Orga schick die 2

orga/templates/orga/orga_main.html

@@ -6,7 +6,14 @@
   <h3>{{request.user.profile.agency.name}}</h3>
   <hr>
   <h4>Organigramm</h4>
-  <div id="diagram"></div>   
+  <div class="text-center">
+    <div id="diagram"></div> 
+  </div>
+  <div id="spinner" class="text-center" style="margin-top: 15%; width: 100%; height: 100%; display: none;">
+    <div class="spinner-border text-danger" role="status">
+      <span class="sr-only">Loading...</span>
+    </div>
+  </div>  
 </div>
 <script type="text/javascript">
 
@@ -24,7 +31,7 @@ var data = [
 var items = new ej.data.DataManager(data);
 
 var diagram = new ej.diagrams.Diagram({
-  width: "1000px", height: "600px",
+  width: "1350px", height: "800px",
   /*tool: ej.diagrams.DiagramTools.ZoomPan,*/
   dataSourceSettings: {
     // set the unique field from data source
@@ -52,11 +59,13 @@ function goToUser(){
         selected_id = diagram.selectedItems['nodes'][0]['properties']['data']['id'];
         if(selected_id != 'parent'){
             $("#diagram").hide();
-            window.location.href = "/orga/single/"+selected_id;     
+            $("#spinner").show();
+            /*window.location.href = "/orga/single/"+selected_id;     */
         }
         else{
             $("#diagram").hide();
-            window.location.href = "/orga/";        
+            $("#spinner").show();
+            /*window.location.href = "/orga/";        */
         }
         
     }
@@ -140,24 +149,5 @@ function setNodeTemplate(obj, diagram) {
 
     return content;
 }
-/*
-$(document).ready(function(){
-
-
-    var orgaele = $( "#diagram" ).find("rect");
-    console.log(orgaele);
-
-    orgaele.each(function( ele ) {
-      console.log(  );
-      document.getElementById(orgaele[ele]['id']).addEventListener("click", clickme(orgaele[ele]['id']));
-
-    });
-
-});
-
-function clickme(id){
-    console.log(id);
-}
-*/
 </script>
 {% endblock content %}