ganeti_web/templates/ganeti/node/detail.html

   1 {% extends "menu_base.html" %}
   2 {% load webmgr_tags %}
   3 {% load i18n %}
   4 {% block head %}
   5     <!-- "import" the CSS and javascript for this template -->
   6     <link href="{{STATIC_URL}}/css/jquery-ui.css" rel="stylesheet" type="text/css"/>
   7     <script type="text/javascript" src="{{STATIC_URL}}/js/jquery-ui.min.js"></script>
   8     <script type="text/javascript" src="{{STATIC_URL}}/js/jquery.form.js"></script>
   9     <script type="text/javascript" src="{{STATIC_URL}}/js/jquery.progressbar.js"></script>
  10     <script type="text/javascript" src="{{STATIC_URL}}/js/ajax_tab_handler.js"></script>
  11     <script type="text/javascript" src="{{STATIC_URL}}/js/job_status.js"></script>
  12     <script type="text/javascript">
  13         var job_poller;
  14         var actions_enabled = true;
  15         var PBAR_CONF = {
  16             steps: 0,
  17             showText: true,
  18             textFormat: 'fraction',
  19             boxImage: '/static/images/progressbar/progressbar.gif',
  20             barImage: {
  21                 0: '{{STATIC_URL}}/images/progressbar/progressbg_green.gif',
  22                 30: '{{STATIC_URL}}/images/progressbar/progressbg_yellow.gif',
  23                 50: '{{STATIC_URL}}/images/progressbar/progressbg_orange.gif',
  24                 75:  '{{STATIC_URL}}/images/progressbar/progressbg_red.gif'
  25             }
  26         };
  27
  28         $(document).ready(function() {
  29             $('#tabs').tabs({
  30                 spinner: false,
  31                 cache: false, // no-cache b/c we want data to update
  32                 //cache: true,
  33                 select: function(event, ui) {
  34                     window.location.hash = ui.tab.hash;
  35                 },
  36                 load: function(event, ui) {
  37                     init_ajax_tab_handler(event, ui, ".pagination a, .sortable a");
  38                 },
  39                 ajaxOptions: {
  40                     error: function(xhr, status, index, anchor) {
  41                         $(anchor.hash).html("{% trans "Couldn't load this tab. We'll try to fix this as soon as possible" %}.");
  42                     }
  43                 }
  44             });
  45
  46             $(".ram, .disk").progressBar(PBAR_CONF);
  47
  48             $(".modify, .migrate, .evacuate").click(function(event){
  49                 event.preventDefault();
  50                 if (actions_enabled) {
  51                     $('.qtip').qtip('destroy');
  52                     var $this = $(this);
  53                     var title;
  54
  55                     if ($this.hasClass("modify")) {
  56                         title = "{% trans "Modify Role" %}";
  57                     } else if ($this.hasClass("migrate")) {
  58                         title = "{% trans "Migrate Primary Virtual Machines" %}";
  59                      } else {
  60                         title = "{% trans "Evacuate Secondary Virtual Machines" %}";
  61                     }
  62
  63                     $(this).qtip({
  64                         content: {
  65                            url: this.href,
  66                            title: {text:title, button:"close"}
  67                         },
  68                         position: {
  69                             corner:{
  70                                 target:'center', tooltip:'center'
  71                             }
  72                         },
  73                         style: {
  74                             name: 'dark',
  75                             border:{radius:5},
  76                             width:400,
  77                             background:'#eeeeee'
  78                         },
  79                         show: {when:false, ready:true},
  80                         hide: {fixed: true, when:false},
  81                         api:{onShow:function(){
  82                             $(".ajax_form input[type!=hidden], " +
  83                                     ".ajax_form select").first().focus();
  84                         }}
  85                     });
  86                 }
  87             });
  88
  89             $(".node_role_form, .node_migrate_form, .node_evacuate_form")
  90                 .live("submit", function(event){
  91                     event.preventDefault();
  92                     $("#errors").empty();
  93                     $(this).ajaxSubmit({success: node_form_response});
  94             });
  95
  96
  97             var job_status_url = "{% url node-job-status node.id %}";
  98             var cluster_detail_url = "{% url cluster-detail cluster.slug %}";
  99             job_poller = new JobPoller();
 100             job_poller.init(job_status_url, cluster_detail_url, job_complete);
 101             {% if node.last_job_id %}
 102                 job_poller.get_jobs();
 103             {% else %}
 104                 job_poller.poll();
 105                 {% if node.error %}
 106                     display_ganeti_error("{{node.error}}");
 107                 {% endif %}
 108             {% endif %}
 109         });
 110
 111         function node_action_response(result) {
 112             if (result.ops == undefined) {
 113                 display_ganeti_error(result[1]);
 114                 actions_enabled = true;
 115                 $('#actions a').removeClass('disabled');
 116             } else {
 117                 job_poller.render_job(result);
 118                 job_poller.poll(FAST);
 119             }
 120         }
 121
 122         function job_complete() {
 123             window.location.reload();
 124         }
 125
 126         function node_form_response(responseText, statusText, xhr, $form) {
 127             if (responseText["opstatus"] == undefined) {
 128                 // no opstatus, must be an error
 129                 // parse errors
 130                 for (var key in responseText) {
 131                     $("#errors").append("<li>"+ responseText[key] +"</li>");
 132                 }
 133             } else {
 134                 $('.qtip').qtip("hide");
 135                 job_poller.poll(job_poller.FAST);
 136             }
 137         }
 138
 139         function display_ganeti_error(msg) {
 140             $("#messages").empty();
 141             var html = "<li class='error'>{% trans "Error" %}:<p>" + msg + "</p></li>";
 142             $("#messages").append(html);
 143         }
 144     </script>
 145 {% endblock %}
 146
 147 {% block content %}
 148 <h1 class="breadcrumb">
 149     <a href="{% url cluster-detail cluster.slug %}">{{cluster.hostname}}</a>
 150     : {{node.hostname}}
 151 </h1>
 152
 153 <ul id="messages"></ul>
 154 <div id="tabs">
 155     <ul>
 156         <li><a href="#detail"><span>{% trans "Detail" %}</span></a></li>
 157         {% if not readonly %}
 158             <li>
 159                 <a title="primary"
 160                         href="{% url node-primary-vms cluster.slug node.hostname %}">
 161                     <span>{% trans "Primary" %}</span>
 162                 </a>
 163             </li>
 164             <li>
 165                 <a title="secondary"
 166                         href="{% url node-secondary-vms cluster.slug node.hostname %}">
 167                     <span>{% trans "Secondary" %}</span>
 168                 </a>
 169             </li>
 170             <li>
 171                 <a title="log"
 172                         href="{% url node-object_log cluster.slug node.hostname %}">
 173                     <span>{% trans "Log" %}</span>
 174                 </a>
 175         </li>
 176         {% endif %}
 177     </ul>
 178     <div id="detail">
 179         <ul id="actions">
 180             {% if node_count > 1 %}
 181             <li>
 182                 <a class="button modify" title="modifies the role of this node"
 183                         href="{% url node-role cluster.slug node.hostname %}">
 184                     {% trans "Change Role" %}
 185                 </a>
 186             </li>
 187             <li>
 188                 <a class="button migrate"
 189                         title="migrates all primary instances of this node"
 190                         href="{% url node-migrate cluster.slug node.hostname %}">
 191                     {% trans "Migrate" %}
 192                 </a>
 193             </li>
 194             {% comment %}
 195             Disabling this button for now till this is fixed upstream
 196
 197             <li>
 198                 <a class="button evacuate"
 199                         title="migrates all secondary instances off this node"
 200                         href="{% url node-evacuate cluster.slug node.hostname %}">
 201                     {% trans "Evacuate" %}
 202                 </a>
 203             </li>
 204             {% endcomment %}
 205             {% endif %}
 206         </ul>
 207         <table id="nodes" class="overview horizontal">
 208             <tr><th>Status</th><td class="status">
 209                 {% if node.info.offline %}
 210                     <div class="icon_stopped" title="Offline"></div>
 211                 {% else %}
 212                     <div class="icon_running" title="Online"></div>
 213                 {% endif %}
 214                 </td>
 215             </tr>
 216             <tr><th>{% trans "Primary IP" %}</th><td>{{node.info.pip}}</td></tr>
 217             <tr><th>{% trans "Secondary IP" %}</th><td>{{node.info.sip}}</td></tr>
 218             <tr><th>{% trans "Role" %}</th><td>{{node.info.role|node_role}}</td></tr>
 219             <tr>
 220                 <th>{% trans "Master Candidate" %}</th>
 221                 <td>{{node.info.master_candidate|checkmark}}</td>
 222             </tr>
 223             <tr><th>{% trans "Drained" %}</th><td>{{node.info.drained|checkmark}}</td></tr>
 224             <tr><th>{% trans "CPUs" %}</th><td>{{ node.cpus|default:"unknown" }}</td></tr>
 225             <tr><th>{% trans "Allocated CPUs" %}</th><td>{{ node.allocated_cpus }}</td></tr>
 226             <tr><th>{% trans "Ram Allocated [GiB]" %}</th><td class="ram">{% node_memory node %}</td></tr>
 227             <tr><th>{% trans "Ram Used [GiB]" %}</th><td class="ram">{% node_memory node 0 %}</td></tr>
 228             <tr><th>{% trans "Disk Allocated [GiB]" %}</th><td class="disk">{% node_disk node %}</td></tr>
 229             <tr><th>{% trans "Disk Used [GiB]" %}</th><td class="disk">{% node_disk node 0 %}</td></tr>
 230
 231             <tr>
 232                 <th>{% trans "Virtual Machines" %}</th>
 233                 <td>{{ node.info.pinst_cnt }} / {{ node.info.sinst_cnt }}</td>
 234             </tr>
 235         </table>
 236     </div>
 237 </div>
 238 {% endblock %}