New Issues Page: update templates, add comment, transitions

4 files changed, 101 insertions, 35 deletions

diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issue_detail.hbs.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issue_detail.hbs.erb
index cb402873853..efd9132cd5f 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issue_detail.hbs.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/issues/templates/_issue_detail.hbs.erb
@@ -50,10 +50,12 @@
               {{/if}}
             </div>
           </li>
-          <li>
-            <div class="code-issue-details-term"><%= message('issue_filter.header.action_plan') -%></div>
-            <div class="code-issue-details-value">{{actionPlanName}}</div>
-          </li>
+          {{#if actionPlanName}}
+            <li>
+              <div class="code-issue-details-term"><%= message('issue_filter.header.action_plan') -%></div>
+              <div class="code-issue-details-value">{{actionPlanName}}</div>
+            </li>
+          {{/if}}
           {{#if technicalDebt}}
             <li>
               <div class="code-issue-details-term"><%= message('issue.technical_debt_clear') -%></div>
@@ -123,32 +125,45 @@
             <b>{{userName}}</b>
             ({{creationDate}})
           </h4>
-          {{{htmlText}}}
+          {{{html}}}
         </div>
       {{/each}}
     </div>
 
     <ul class="code-issue-actions">
-      <li>
-        <a id="issue-comment" class="link-action"><%= message('issue.comment.formlink') -%></a>
-      </li>
+      {{#inArray actions "comment"}}
+        <li>
+          <a id="issue-comment" class="link-action"><%= message('issue.comment.formlink') -%></a>
+        </li>
+      {{/inArray}}
 
-      <li>
-        <a id="issue-assign" class="link-action"><%= message('issue.assign.formlink') -%></a>
-        [<a id="issue-assign-to-me" class="link-action"><%= message('issue.assign.to_me') -%></a>]
-      </li>
+      {{#inArray actions "assign"}}
+        <li>
+          <a id="issue-assign" class="link-action"><%= message('issue.assign.formlink') -%></a>
+          [<a id="issue-assign-to-me" class="link-action"><%= message('issue.assign.to_me') -%></a>]
+        </li>
+      {{/inArray}}
 
-      <li>
-        <a id="issue-plan" class="link-action"><%= message('issue.do_plan') -%></a>
-      </li>
+      {{#inArray actions "plan"}}
+        <li>
+          <a id="issue-plan" class="link-action"><%= message('issue.do_plan') -%></a>
+        </li>
+      {{/inArray}}
 
       <li>
         <div class="dropdown">
           <a class="link-action link-more" onclick="showDropdownMenuOnElement($j(this).next('.dropdown-menu')); return false;">More actions</a>
           <ul style="display: none" class="dropdown-menu">
-            <li>
-              <a id="issue-change-severity" class="link-action spacer-right">Change severity</a>
-            </li>
+            {{#inArray actions "set_severity"}}
+              <li>
+                <a id="issue-change-severity" class="link-action spacer-right">Change severity</a>
+              </li>
+            {{/inArray}}
+            {{#each transitions}}
+              <li>
+                <a class="link-action spacer-right issue-transition" data-transition="{{this}}">{{this}}</a>
+              </li>
+            {{/each}}
           </ul>
         </div>
       </li>
diff --git a/sonar-server/src/main/webapp/javascripts/navigator/handlebars-extensions.js b/sonar-server/src/main/webapp/javascripts/navigator/handlebars-extensions.js
index 5530622c7e1..60ae8336665 100644
--- a/sonar-server/src/main/webapp/javascripts/navigator/handlebars-extensions.js
+++ b/sonar-server/src/main/webapp/javascripts/navigator/handlebars-extensions.js
@@ -26,6 +26,15 @@
     return moment(time).fromNow(true);
   });
 
+  Handlebars.registerHelper('inArray', function(array, element, options) {
+    if (array.indexOf(element) !== -1) {
+      return options.fn(this);
+    } else {
+      return options.inverse(this);
+    }
+
+  });
+
   Handlebars.registerHelper('dashboardUrl', function(component) {
     var url = '/dashboard/index/' + decodeURIComponent(component.key);
     if (component.qualifier === 'FIL' || component.qualifier === 'CLA') {
diff --git a/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js b/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js
index 652d9620acb..131290eff57 100644
--- a/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js
+++ b/sonar-server/src/main/webapp/javascripts/navigator/issues-app.js
@@ -53,7 +53,9 @@ jQuery(function() {
     });
     this.actionsRegion.show(this.issuesActionsView);
 
-    this.issueDetailView = new window.SS.IssueDetailView();
+    this.issueDetailView = new window.SS.IssueDetailView({
+      model: new window.SS.Issue()
+    });
   });
 
 
diff --git a/sonar-server/src/main/webapp/javascripts/navigator/issues.js b/sonar-server/src/main/webapp/javascripts/navigator/issues.js
index 6e83d219b90..6fea1eaaea0 100644
--- a/sonar-server/src/main/webapp/javascripts/navigator/issues.js
+++ b/sonar-server/src/main/webapp/javascripts/navigator/issues.js
@@ -117,7 +117,8 @@ jQuery(function() {
 
       var app = this.options.app,
           detailView = this.options.app.issueDetailView;
-      detailView.model = new window.SS.Issue({ key: this.model.get('key') });
+
+      detailView.model.set({ key: this.model.get('key') }, { silent: true});
       jQuery.when(detailView.model.fetch()).done(function() {
         app.detailsRegion.show(detailView);
       });
@@ -365,7 +366,7 @@ jQuery(function() {
 
     events: {
       'keyup #issue-comment-text': 'toggleSubmit',
-      'click #issue-comment-cancel': 'close',
+      'click #issue-comment-cancel': 'cancel',
       'click #issue-comment-submit': 'submit'
     },
 
@@ -375,24 +376,25 @@ jQuery(function() {
     },
 
 
+    cancel: function() {
+      this.options.detailView.updateAfterAction(false);
+    },
+
+
     submit: function() {
-      var that = this;
+      var that = this,
+          text = this.ui.textarea.val();
       that.options.detailView.updateAfterAction();
       jQuery.ajax({
         type: 'POST',
         url: baseUrl + '/api/issues/add_comment',
         data: {
           issue: this.model.get('key'),
-          text: this.ui.textarea.val()
+          text: text
         }
       }).done(function() {
-            that.close();
+            that.options.detailView.updateAfterAction(true);
           });
-    },
-
-
-    onClose: function() {
-      this.options.detailView.updateAfterAction();
     }
   });
 
@@ -408,7 +410,13 @@ jQuery(function() {
 
 
     events: {
-      'click #issue-comment': 'comment'
+      'click #issue-comment': 'comment',
+      'click .issue-transition': 'transition'
+    },
+
+
+    modelEvents: {
+      'change': 'render'
     },
 
 
@@ -418,9 +426,27 @@ jQuery(function() {
     },
 
 
-    updateAfterAction: function() {
-      this.formRegion.reset();
-      this.$('.code-issue-form').hide();
+    showActionView: function(view) {
+      this.$('.code-issue-actions').hide();
+      this.$('.code-issue-form').show();
+      this.formRegion.show(view);
+    },
+
+
+    updateAfterAction: function(fetch) {
+      var that = this;
+
+      if (fetch) {
+        jQuery.when(this.model.fetch()).done(function() {
+          that.formRegion.reset();
+          that.$('.code-issue-actions').show();
+          that.$('.code-issue-form').hide();
+        });
+      } else {
+        that.formRegion.reset();
+        that.$('.code-issue-actions').show();
+        that.$('.code-issue-form').hide();
+      }
     },
 
 
@@ -429,8 +455,22 @@ jQuery(function() {
         model: this.model,
         detailView: this
       });
-      this.$('.code-issue-form').show();
-      this.formRegion.show(commentFormView);
+      this.showActionView(commentFormView);
+    },
+
+
+    transition: function(e) {
+      var that = this;
+      jQuery.ajax({
+        type: 'POST',
+        url: baseUrl + '/api/issues/do_transition',
+        data: {
+          issue: this.model.get('key'),
+          transition: jQuery(e.target).data('transition')
+        }
+      }).done(function() {
+            that.model.fetch();
+          });
     }
 
   });