adding instance detail to syspanel

django-openstack/django_openstack/syspanel/urls.py

@@ -33,6 +33,7 @@ urlpatterns = patterns('django_openstack.syspanel.views.instances',
         name='syspanel_tenant_usage'),
     url(r'^instances/$', 'index', name='syspanel_instances'),
     url(r'^instances/refresh$', 'refresh', name='syspanel_instances_refresh'),
+    url(INSTANCES % 'detail', 'detail', name='syspanel_instances_detail'),
     # NOTE(termie): currently just using the 'dash' versions
     #url(INSTANCES % 'console', 'console', name='syspanel_instances_console'),
     #url(INSTANCES % 'vnc', 'vnc', name='syspanel_instances_vnc'),

django-openstack/django_openstack/syspanel/views/instances.py

@@ -22,7 +22,7 @@ from django import template
 from django import http
 from django.conf import settings
 from django.contrib.auth.decorators import login_required
-from django.shortcuts import render_to_response
+from django.shortcuts import render_to_response, redirect
 from django.utils.translation import ugettext as _
 
 import datetime
@@ -229,3 +229,33 @@ def refresh(request):
         'terminate_form': terminate_form,
         'reboot_form': reboot_form,
     }, context_instance=template.RequestContext(request))
+
+
+@login_required
+def detail(request, instance_id):
+    try:
+        instance = api.server_get(request, instance_id)
+        try:
+            console = api.console_create(request, instance_id, 'vnc')
+            vnc_url =  "%s&title=%s(%s)" % (console.output,
+                                            instance.name,
+                                            instance_id)
+        except api_exceptions.ApiException, e:
+            LOG.exception('ApiException while fetching instance vnc \
+                           connection')
+            messages.error(request,
+                       'Unable to get vnc console for instance %s: %s' %
+                       (instance_id, e.message))
+            return redirect('dash_instances', tenant_id)
+    except api_exceptions.ApiException, e:
+        LOG.exception('ApiException while fetching instance info')
+        messages.error(request,
+                   'Unable to get information for instance %s: %s' %
+                   (instance_id, e.message))
+        return redirect('dash_instances', tenant_id)
+
+    return render_to_response(
+    'django_openstack/syspanel/instances/detail.html', {
+        'instance': instance,
+        'vnc_url': vnc_url,
+    }, context_instance=template.RequestContext(request))

django-openstack/django_openstack/templates/django_openstack/syspanel/instances/_list.html

@@ -1,7 +1,7 @@
 {% load parse_date %}
 <table id="instances" class="wide">
   <tr>
-    <th>Id</th>
+    <th>Name</th>
     <th>Tenant</th>
     <th>User</th>
     <th>Host</th>
@@ -13,7 +13,7 @@
   </tr>
   {% for instance in instances %}
     <tr id="{{instance.id}}" class="{% cycle "odd" "even" %}">
-      <td>{{instance.id}}</td>
+      <td><a href="{% url syspanel_instances_detail instance.id %}">{{instance.name}} <small>(id: {{instance.id}})</small></a></td>
       <td>{{instance.attrs.tenant_id}}</td>
       <td>{{instance.attrs.user_id}}</td>
       <td class="name">{{instance.attrs.host}}</td>

django-openstack/django_openstack/templates/django_openstack/syspanel/instances/detail.html

@@ -0,0 +1,104 @@
+{% extends 'django_openstack/syspanel/base.html' %}
+
+{% block sidebar %}
+  {% with current_sidebar="instances" %}
+    {{block.super}}
+  {% endwith %}
+{% endblock %}
+
+{% block page_header %}
+  {# to make searchable false, just remove it from the include statement #}
+  {% include "django_openstack/common/_page_header.html" with title="Instance Detail" %}
+{% endblock page_header %}
+
+{% block syspanel_main %}
+<ul id="instance_tabs">
+  <li class="active"><a class="overview" href="#">Overview</a></li>
+  <li><a class="log" href="#">Log</a></li>
+  <li><a class="vnc" href="#">VNC</a></li>
+</ul>
+
+  <div class="dash_block">
+    <div id="overview" class="tab_wrapper">
+      <ul>
+        <li>
+          <div class="status">
+            <h4>Status</h4>
+            <ul>
+              <li><span>Status:</span> {{instance.status}}</li>
+              <li><span>Instance Name:</span> {{instance.name}}</li>
+              <li><span>Instance ID:</span> {{instance.id}}</li>
+            </ul>
+          </div>
+        </li>
+
+        <li>
+          <div class="specs">
+            <h4>Specs</h4>
+            <ul>
+              <li><span>RAM:</span> {{instance.attrs.memory_mb}} MB</li>
+              <li><span>VCPUs:</span> {{instance.attrs.vcpus}} VCPU</li>
+              <li><span>Disk:</span> {{instance.attrs.disk_gb}}GB Disk</li>
+            </ul>
+          </div>
+        </li>
+
+        <li>
+          <div class="meta">
+            <h4>Meta</h4>
+            <ul>
+              <li><span>Key name:</span> {{instance.attrs.key_name}}</li>
+              <li><span>Security Group(s):</span> {% for group in instance.attrs.security_groups %}{{group}}, {% endfor %}</li>
+              <li><span>Image Name:</span> {{instance.image_name}}</li>
+            </ul>
+          </div>
+        </li>
+      </ul>
+    </div>
+
+    <div id="log" class="tab_wrapper">
+      <a class="view_full" target="_blank" href="{% url dash_instances_console request.user.tenant_id instance.id %}">View Full Log</a>
+      <pre class="logs"></pre>
+    </div>
+
+    <div id="vnc" class="tab_wrapper">
+      <iframe src="{{vnc_url}}" width="720" height="420"></iframe>
+    </div>
+    
+  </div>
+{% endblock %}
+
+{% block footer_js %}
+  <script type="text/javascript" charset="utf-8">
+    $(function(){
+      $(".dash_block div.tab_wrapper").hide()
+      $(".dash_block div.tab_wrapper:first").show()
+
+      $("#instance_tabs a").click(function(e){
+        e.preventDefault();
+        e.stopPropagation()
+        $(".dash_block div.tab_wrapper").hide('fast')
+        $(".dash_block div#"+$(this).attr('class')).show('fast')
+
+        $("#instance_tabs li").removeClass('active')
+        $(this).parent().toggleClass('active')
+      })
+
+      $('a.log').click(function(){
+        getlog();
+      })
+
+      setInterval(function(){
+        if ($("a.log").parent().hasClass('active')) {
+          getlog();
+        };
+      }, 3000)
+    })
+
+    function getlog(){
+      $.get("{% url dash_instances_console request.user.tenant_id instance.id %}", function(data){
+        $("#log .logs").html(data)
+      })
+    }
+  </script>
+{% endblock footer_js %}