[POLICY-73] replace openecomp for policy-engine
[policy/engine.git] / ONAP-SDK-APP / src / main / webapp / static / fusion / sample / org_chart / example.html
diff --git a/ONAP-SDK-APP/src/main/webapp/static/fusion/sample/org_chart/example.html b/ONAP-SDK-APP/src/main/webapp/static/fusion/sample/org_chart/example.html
new file mode 100644 (file)
index 0000000..543b0f9
--- /dev/null
@@ -0,0 +1,85 @@
+<!DOCTYPE html>
+<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
+    <title>jOrgChart - A jQuery OrgChart Plugin</title>
+    <link rel="stylesheet" href="css/bootstrap.min.css"/>
+    <link rel="stylesheet" href="css/jquery.jOrgChart.css"/>
+    <link rel="stylesheet" href="css/custom.css"/>
+    <link href="css/prettify.css" type="text/css" rel="stylesheet" />
+
+    <script type="text/javascript" src="prettify.js"></script>
+    
+    <!-- jQuery includes -->
+    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
+    
+    <script src="jquery.jOrgChart.js"></script>
+
+    <script>
+    jQuery(document).ready(function() {
+        $("#org").jOrgChart({
+            chartElement : '#chart',
+            dragAndDrop  : true
+        });
+    });
+    </script>
+  </head>
+
+  <body onload="prettyPrint();">
+    <ul id="org" style="display:none">
+      <li>Product 1<br/>
+        <ul>
+          <li>Service 1<br/>
+            <ul>
+                         <li>Resource 1<br/></li>
+                         <li>Resource 2<br/></li>
+                         <li>Resource 3<br/></li>
+                         <li>Resource 4<br/></li>
+                         <li>Resource 5<br/></li>
+            </ul>
+          </li>
+          <li>Service 6<br/></li>
+          <li>Service 7<br/>
+            <ul>
+                         <li>Resource 8<br/></li>
+                         <li>Resource 9<br/></li>
+                         <li>Resource 10<br/></li>
+                         <li>Resource 11<br/></li>
+            </ul>
+          </li>
+        </ul>
+      </li>
+   </ul>            
+    
+    <div id="chart" class="orgChart"></div>
+    
+    <script>
+        jQuery(document).ready(function() {
+            
+            /* Custom jQuery for the example */
+            $("#show-list").click(function(e){
+                e.preventDefault();
+                
+                $('#list-html').toggle('fast', function(){
+                    if($(this).is(':visible')){
+                        $('#show-list').text('Hide underlying list.');
+                        $(".topbar").fadeTo('fast',0.9);
+                    }else{
+                        $('#show-list').text('Show underlying list.');
+                        $(".topbar").fadeTo('fast',1);                  
+                    }
+                });
+            });
+            
+            $('#list-html').text($('#org').html());
+            
+            $("#org").bind("DOMSubtreeModified", function() {
+                $('#list-html').text('');
+                
+                $('#list-html').text($('#org').html());
+                
+                prettyPrint();                
+            });
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file