planetstack/templates/admin/newminidashboard.html

   1 {% load admin_static %}
   2
   3 <script>
   4     admin_object_name = "{{ opts.object_name }}";
   5     admin_object_id = "{{ original.id }}";
   6     if (admin_object_id == "") {
   7         admin_object_id = undefined;
   8     } else {
   9         admin_object_id = parseInt(admin_object_id, 10);
  10     }
  11     {% if opts.object_name == "Site" %}
  12         admin_controller_sites = [];
  13         {% for record in original.controllersite.all %}
  14             admin_controller_sites.push( {{ record.id }} );
  15         {% endfor %}
  16     {% endif %}
  17     {% if opts.object_name == "Slice" %}
  18         admin_controller_slices = [];
  19         {% for record in original.controllerslice.all %}
  20             admin_controller_slices.push( {{ record.id }} );
  21         {% endfor %}
  22     {% endif %}
  23 </script>
  24
  25 {% if not DISABLE_MINIDASHBOARD %}
  26
  27 <div id="newMiniDashboard">
  28     <div class="hide" id="selectedMainNav">{{ opts.verbose_name_plural|capfirst }}</div>
  29     <div class="hide" id="currentOriginalNode">{{ original|truncatewords:"18" }}</div>
  30     <div class="hide" id="minidashStatus"></div>
  31     <div class="miniDashPair">
  32         <button type="button" name="nodeCount" id="miniDashNodeCount" class="minidashbutton">--</button>
  33         <label for="nodeCount" id="miniDashNodeCountLabel">Active Nodes</label>
  34     </div>
  35     <div class="miniDashPair">
  36         <button type="button" name="avgLoad" id="miniDashAvgLoad" class="minidashbutton">--</button>
  37         <label for="avgLoad" id="miniDashAvgLoadLabel">Average Load</label>
  38     </div>
  39     <div class="miniDashPair">
  40         <button type="button" name="bandwidth" id="miniDashBandwidth" class="minidashbutton">--</button>
  41         <label for="bandwidth" id="miniDashBandwidthLabel">Bandwidth</label>
  42     </div>
  43     <div class="endDashPair">
  44     </div>
  45 </div>
  46
  47 <div id="nodeCountDialog" class="miniDashModal" >
  48 <div id="nodeCountGraph" ></div>
  49 </div>
  50
  51 <div id="bandwidthDialog" class="miniDashModal" >
  52 <div id="bandwidthGraph" ></div>
  53 </div>
  54
  55 <div id="avgLoadDialog" class="miniDashModal" >
  56 <div id="avgLoadGraph" ></div>
  57 </div>
  58
  59 <script src="{% static 'page_analytics.js' %}"></script>
  60
  61 <script>
  62 /** If the analytics have already been set -- read them in on page load **/
  63 if (typeof window != "undefined") {
  64     if (typeof window.pageAnalyticsData != "undefined") {
  65         updatePageAnalyticsData(window.pageAnalyticsData);
  66     }
  67 }
  68
  69 var loadingDiv = '<div class="loading">Loading ...</div>';
  70
  71 $( "#nodeCountDialog" ).dialog({ title: "OpenCloud Node Count", modal: true, position: ['middle', 40], resizable: true, autoOpen: false, width: 527, height: 400});
  72 $( "#miniDashNodeCount" ).click(function() {
  73     $( "#nodeCountGraph" ).html(loadingDiv);
  74     $( "#nodeCountDialog" ).dialog("open");
  75     var options = {"title": "Node Count", "vAxis": {"title": "Number of Nodes", "minValue": 0, "maxValue": 250}};
  76     renderChart(true,"#nodeCountDialog", "#nodeCountGraph", window.pageAnalyticsUrl, 0, 2, google.visualization.data.sum, options);
  77     });
  78
  79 $( "#bandwidthDialog" ).dialog({ title: "OpenCloud Bandwidth", modal: true, position: ['middle', 40], resizable: true, autoOpen: false, width: 527, height: 400});
  80 $( "#miniDashBandwidth" ).click(function() {
  81     $("#bandwidthGraph").html(loadingDiv);
  82     $( "#bandwidthDialog" ).dialog("open");
  83     var options = {"title": "Total Bandwidth", "vAxis": {"title": "Total Bandwidth (Gbps)"}};
  84     renderChart(true,"#bandwidthDialog", "#bandwidthGraph", window.pageBandwidthUrl, 0, 1, agg_bandwidth, options);
  85     });
  86
  87 $( "#avgLoadDialog" ).dialog({ title: "OpenCloud Average Load", modal: true, position: ['middle', 40], resizable: true, autoOpen: false, width: 527, height: 400});
  88 $( "#miniDashAvgLoad" ).click(function() {
  89     $("#avgLoadGraph").html(loadingDiv);
  90     $( "#avgLoadDialog" ).dialog("open");
  91     var options = {"title": "Average CPU Utilization", "vAxis": {"title": "CPU Utilization (%)"}};
  92     renderChart(true,"#avgLoadDialog", "#avgLoadGraph", window.pageAnalyticsUrl, 0, 1, google.visualization.data.sum, options);
  93     });
  94
  95 </script>
  96
  97 {% endif %}