webui: vm-rename interface

one/static/script/cloud.js

@@ -41,6 +41,24 @@ $(function() {
             e.stopPropagation();
         });
     }
+    $('.rename-vm').click(function(e){
+        e.preventDefault();
+        e.stopPropagation();
+        var id=$(this).data('id');
+        var oldName=$(this).data('name');
+        $('#vm-'+id+'-name-details').hide();
+        $('#vm-'+id+'-name').html('<input type="text" value="'+name+'" />\
+<input type="submit" value="'+gettext('Rename')+'" />');
+        $('#vm-'+id+'-name').find('input[type="text"]').click(function(f){
+            f.preventDefault();
+            f.stopPropagation();
+        }).focus();
+        $('#vm-'+id+'-name').find('input[type=submit]').click(function(f){
+            f.preventDefault();
+            f.stopPropagation();
+            alert($(this).prev().val());
+        })
+    });
     $('.try-template-button').click(function(e) {
         e.preventDefault();
         e.stopPropagation();

one/templates/box/vm/summary.html

@@ -10,7 +10,10 @@
 
 {% block name %}
 <div class="name {% if i.state == 'ACTIVE' %}vm-on{% else %}vm-off{% endif %}">
-    {{vm.name|truncatechars:20}} <small class="details">(<a href="/vm/show/{{vm.id}}/" title="{{vm.name}}">{% trans "More details" %}</a>)</small>
+    <span id="vm-{{vm.id}}-name">{{vm.name|truncatechars:20}}</span>
+    <small id="vm-{{vm.id}}-name-details" class="details">
+        (<a href="/vm/show/{{vm.id}}/" title="{{vm.name}}">{% trans "More details" %}</a>)
+    </small>
 </div>
 {% endblock %}