Use the REST API in the web interface for editing projects

src/root/edit-project.tt

@@ -1,7 +1,7 @@
 [% WRAPPER layout.tt title=(create ? "New project" : "Editing project $project.name") %]
 [% PROCESS common.tt %]
 
-<form class="form-horizontal" action="[% IF create %][% c.uri_for('/create-project/submit') %][% ELSE %][% c.uri_for('/project' project.name 'submit') %][% END %]" method="post">
+<form class="form-horizontal">
 
   <fieldset>
 
@@ -54,21 +54,27 @@
     </div>
 
     <div class="form-actions">
-      <button type="submit" class="btn btn-primary">
+      <button id="submit-project" type="submit" class="btn btn-primary">
         <i class="icon-ok icon-white"></i>
         [%IF create %]Create[% ELSE %]Apply changes[% END %]
-      </button>
-      [% IF !create %]
-        <button id="delete-project" type="submit" class="btn btn-danger" name="submit" value="delete">
-          <i class="icon-trash icon-white"></i>
-          Delete this project
-        </button>
         <script type="text/javascript">
-          $("#delete-project").click(function() {
-            return confirm("Are you sure you want to delete this project?");
+          $("#submit-project").click(function() {
+            requestJSON({
+              [% IF create %]
+                url: "[% c.uri_for('/project' '.new') %]",
+              [% ELSE %]
+                url: "[% c.uri_for('/project' project.name) %]",
+              [% END %]
+              data: $(this).parents("form").serialize(),
+              type: 'PUT',
+              success: function(data) {
+                window.location = data.redirect;
+              },
+            });
+            return false;
           });
         </script>
-      [% END %]
+      </button>
     </div>
 
   </fieldset>

src/root/project.tt

@@ -9,7 +9,8 @@
         <b class="caret"></b>
       </a>
       <ul class="dropdown-menu">
-        [% INCLUDE menuItem uri = c.uri_for('/project' project.name 'edit') title="Edit configuration" %]
+        <li><a href="[% c.uri_for('/project' project.name 'edit') %]"><i class="icon-edit icon-black"></i> Edit configuration</a></li>
+        <li><a href="javascript:deleteProject()"><i class="icon-trash icon-black"></i> Delete this project</a></li>
         [% INCLUDE menuItem uri = c.uri_for(c.controller('Project').action_for('create_jobset'), [project.name]) title = "Create jobset" %]
         [% INCLUDE menuItem uri = c.uri_for('/project' project.name 'create-release') title = "Create release" %]
       </ul>
@@ -94,7 +95,6 @@
   </div>
 
   <div id="tabs-configuration" class="tab-pane">
-    <a class="btn pull-right" href="[% c.uri_for('/project' project.name "edit") %]"><i class="icon-edit"></i> Edit</a>
     <table class="info-table">
       <tr>
         <th>Display name:</th>
@@ -186,4 +186,18 @@
 
 </div>
 
+<script>
+  function deleteProject() {
+    bootbox.confirm(
+      'Are you sure you want to delete this project?',
+      function(c) {
+        if (!c) return;
+        redirectJSON({
+          url: "[% c.uri_for('/project' project.name) %]",
+          type: 'DELETE'
+        });
+      });
+  };
+</script>
+
 [% END %]

src/root/static/js/common.js

@@ -88,3 +88,29 @@ var makeLazyTab = function(tabName, uri) {
         }
     });
 }
+
+var requestJSON = function(args) {
+    args.dataType = 'json';
+    args.error = function(data) {
+        json = {};
+        try {
+            if (data.responseText)
+                json = $.parseJSON(data.responseText);
+        } catch (err) {
+        }
+        if (json.error)
+            bootbox.alert(json.error);
+        else if (data.responseText)
+            bootbox.alert("Server error: " + data.responseText);
+        else
+            bootbox.alert("Unknown server error!");
+    };
+    return $.ajax(args);
+}
+
+var redirectJSON = function(args) {
+    args.success = function(data) {
+        window.location = data.redirect;
+    };
+    return requestJSON(args);
+}