docklet/web/templates/monitor/hostsConAll.html

{% extends 'base_AdminLTE.html' %}

{% block title %}Docklet | Hosts{% endblock %}

{% block panel_title %}Node list for {{ com_ip }}{% endblock %}

{% block panel_list %}
<ol class="breadcrumb">
  <li>
      <a href="/dashboard/"><i class="fa fa-dashboard"></i>Home</a>
  </li>
  <li>
      <a href='/hosts/'>Hosts</a>
  </li>
  <li class="active">
      <strong>Node List</strong>
  </li>
</ol>
{% endblock %}

{% block content %}
	  <div class="row">
	     <div class="col-md-12">
         <div class="box box-info">
              <div class="box-header with-border">
                <h3 class="box-title">Total Nodes</h3>

                <div class="box-tools pull-right">
                  <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                  </button>
                  <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                </div>
              </div>
                     <div class="box-body table-responsive">
                         <table class="table table-bordered">
                             <thead>
                             <tr>
				                 <th>NO</th>
				                 <th>Name</th>
                                 <th>Owner</th>
                                 <th>Owner's Truename</th>
                                 <th>State</th>
                                 <th>PID</th>
                                 <th>IP Address</th>
				                 <th>Cpu used</th>
                                 <th>%Cpu</th>
                                 <th>Mem used</th>
                                 <th>Summary</th>
                             </tr>
                             </thead>
                             <tbody>
                             {% for container in containerslist %}
                             <tr>
                                 <td>{{ loop.index }}</td>
                                 <td>{{ container['Name'] }}</td>
                                 <td>{{ container['owner']['username'] }}</td>
                                 <td>{{ container['owner']['truename'] }}</td>
                                 {% if container['State'] == 'STOPPED' %}
                                 <td><div id='{{ container['Name'] }}_state' class="label label-danger">Stopped</div></td>
                                 <td id='{{ container['Name'] }}_pid'>--</td>
                                 <td id='{{ container['Name'] }}_ip'>--</td>
                                 {% else %}
                                 <td><div id='{{ container['Name'] }}_state' class="label label-primary">Running</div></td>
                                 <td id='{{ container['Name'] }}_pid'>{{ container['PID'] }}</td>
                                 <td id='{{ container['Name'] }}_ip'>{{ container['IP'] }}</td>
                                 {% endif %}
                                 <td id='{{ container['Name'] }}_cpu'>--</td>
                                 <td id='{{ container['Name'] }}_cpupercent'>--</td>
                                 <td id='{{ container['Name'] }}_mem'>--</td>
                                 <td><a class="btn btn-info btn-xs"
                                         href='/vclusters/root/{{
                                         container['Name'] }}/'>Realtime</a></td>
			     </tr>
                             {% endfor %}
                             </tbody>
                         </table>

                     </div>
                 </div>
             </div>
	   </div>

{% endblock %}

{% block script_src %}
<script type='text/javascript'>
   function update(url,name)
   {

       $.post(url+"/basic_info/",{},function(data){
		var state = data.monitor.basic_info.State;
		if(state == 'RUNNING')
       		{
           	    var tmp = $("#"+name+"_state");
                    tmp.removeClass();
	            tmp.addClass("label label-primary");
	   	    tmp.html("Running");
		    $("#"+name+"_pid").html(data.monitor.basic_info.PID);
		    $("#"+name+"_ip").html(data.monitor.basic_info.IP);
       		}
       		else if(state == 'STOPPED')
       		{
           	    var tmp = $("#"+name+"_state");
           	    tmp.removeClass();
	   	    tmp.addClass("label label-danger");
	   	    tmp.html("Stopped");
		    $("#"+name+"_pid").html('--');
		    $("#"+name+"_ip").html('--');
		    $("#"+name+"_cpu").html('--');
		    $("#"+name+"_mem").html('--');
		    return;
       		}

       		$.post(url+"/cpu_use/",{},function(data){
		       	var val = (data.monitor.cpu_use.val).toFixed(2);
			    var unit = data.monitor.cpu_use.unit;
                var hostpercent = data.monitor.cpu_use.hostpercent;
                var percent = (hostpercent*100).toFixed(2);
		       	$("#"+name+"_cpu").html(val +" "+ unit);
		       	$("#"+name+"_cpupercent").html(percent);
		       	},"json");


       		$.post(url+"/mem_use/",{},function(data){
		       	var val = data.monitor.mem_use.val;
			    var unit = data.monitor.mem_use.unit
		       	$("#"+name+"_mem").html(val+" "+unit);
		       	},"json");

       		},"json");
   }

   function updateAll()
   {
        var host = window.location.host;
	{% for container in containerslist %}
	url =  "//" + host + "/monitor/" + '{{masterip}}' + "/vnodes/" + '{{container["Name"]}}';
        //url = url0 + '{{ container['Name'] }}';
	update(url,'{{ container['Name'] }}');
	{% endfor %}
    /*$.post(url+"/concpuinfo/",{},function(data){
		var info = data.monitor.concpuinfo;
		for(container in info)
        {
		    $("#"+container+"_cpupercent").html(info[container]);
        }
		},"json");*/
   }
   setInterval(updateAll,4000);

</script>
{% endblock %}