#37: update UI for "Assignee" Issues and PullRequests

app/assets/javascripts/extra/tracker.js

@@ -137,30 +137,61 @@ $(document).ready(function() {
     return false;
   });
 
-  function remAssignee(form) {
+  $('#assigned-popup .header .icon-remove-circle').live('click', function() {
-    var el = form.find('.people.selected.remove_assignee');
+    $('#assigned-popup').hide();
-    var id = el.attr('id');
-    $('#manage_issue_users_list .add_assignee.people.selected').removeClass('select');
-    el.remove();
-  }
-
-  $('.add_assignee.people.selected').live('click', function() {
-    var form_new = $('form.issue');
-    var form_edit = $('form.edit_form.issue');
-    form_new.find('#people-span').fadeOut(0);
-    remAssignee(form_new);
-    var clone = $(this).clone().removeClass('add_assignee').addClass('remove_assignee');
-    form_new.find('#issue_assignee').html(clone);
-    $('.current_assignee').html(clone.removeClass('select'));
-    $(this).addClass('select');
   });
 
-  $('.remove_assignee.people.selected').live('click', function() {
+  $('.assigned .icon-share').live('click', function() {
-    var form = $('form.issue, form.edit_form issue');
+    $('#assigned-popup').show();
-    form.find('#people-span').fadeIn(0);
-    remAssignee(form);
   });
 
+  // function remAssignee(form) {
+  //   var el = form.find('.people.selected.remove_assignee');
+  //   var id = el.attr('id');
+  //   $('#manage_issue_users_list .add_assignee.people.selected').removeClass('select');
+  //   el.remove();
+  // }
+
+  $('#assigned-popup .people.selected').live('click', function() {
+    // var form_new = $('form.issue');
+    // var form_edit = $('form.edit_form.issue');
+    // form_new.find('#people-span').fadeOut(0);
+    // remAssignee(form_new);
+    // var clone = $(this).clone().removeClass('add_assignee').addClass('remove_assignee');
+    // form_new.find('#issue_assignee').html(clone);
+    // $('.current_assignee').html(clone.removeClass('select'));
+    // $(this).addClass('select');
+
+    var form = $('#assigned-popup .edit_assignee');
+    $.ajax({
+      type: 'PUT',
+      url: form.attr("action"),
+      data: $(this).find('input').serialize(),
+      success: function(data){
+                      $('#assigned-popup').hide();
+                      window.location.reload();
+                      // $('.current_assignee .people').removeClass('remove_assignee selected').addClass('nopointer');
+                      // $('form#search_user, .button.update_assignee').fadeOut(0);
+                      // $('.button.manage_assignee').fadeIn(0);
+                      // $('#manage_issue_users_list').html('');
+                    },
+      error: function(data){
+                   alert('error'); // TODO remove
+                }
+     });
+    return false;
+
+
+
+
+  });
+
+  // $('.remove_assignee.people.selected').live('click', function() {
+  //   var form = $('form.issue, form.edit_form issue');
+  //   form.find('#people-span').fadeIn(0);
+  //   remAssignee(form);
+  // });
+
   function remLabel(form, id) {
     var el = form.find('.label.remove_label'+'#'+id);
     var label = $('#'+id+'.remove_label.label.selected');
@@ -251,11 +282,11 @@ $(document).ready(function() {
     return false;
   });
 
-  $('.button.manage_assignee').live('click', function() {
+  // $('.button.manage_assignee').live('click', function() {
-    $('form#search_user, .button.update_assignee').fadeIn(0);
+  //   $('form#search_user, .button.update_assignee').fadeIn(0);
-    $('.current_assignee .people').addClass('remove_assignee selected').removeClass('nopointer');
+  //   $('.current_assignee .people').addClass('remove_assignee selected').removeClass('nopointer');
-    $(this).fadeOut(0);
+  //   $(this).fadeOut(0);
-  });
+  // });
 
   $('.button.manage_labels').live('click', function() {
     $('.button.update_labels').fadeIn(0);
@@ -264,24 +295,24 @@ $(document).ready(function() {
     $(this).fadeOut(0);
   });
 
-  $('.button.update_assignee').live('click', function() {
+  // $('.button.update_assignee').live('click', function() {
-    var form = $('form.edit_assignee.issue');
+  //   var form = $('form.edit_assignee.issue');
-    $.ajax({
+  //   $.ajax({
-      type: 'POST',
+  //     type: 'POST',
-      url: form.attr("action"),
+  //     url: form.attr("action"),
-      data: form.serialize(),
+  //     data: form.serialize(),
-      success: function(data){
+  //     success: function(data){
-                      $('.current_assignee .people').removeClass('remove_assignee selected').addClass('nopointer');
+  //                     $('.current_assignee .people').removeClass('remove_assignee selected').addClass('nopointer');
-                      $('form#search_user, .button.update_assignee').fadeOut(0);
+  //                     $('form#search_user, .button.update_assignee').fadeOut(0);
-                      $('.button.manage_assignee').fadeIn(0);
+  //                     $('.button.manage_assignee').fadeIn(0);
-                      $('#manage_issue_users_list').html('');
+  //                     $('#manage_issue_users_list').html('');
-                    },
+  //                   },
-      error: function(data){
+  //     error: function(data){
-                   alert('error'); // TODO remove
+  //                  alert('error'); // TODO remove
-                }
+  //               }
-     });
+  //    });
-    return false;
+  //   return false;
-  });
+  // });
 
   $('.button.update_labels').live('click', function() {
     var form = $('form.edit_labels.issue');

app/assets/stylesheets/design/custom.scss

@@ -1888,3 +1888,79 @@ table#myTable thead tr.search th form.button_to div input {
         padding: 7px 5px 3px;
     }
 }
+
+article .activity .top {
+  
+  .created {
+    opacity: 0.8;
+    span {
+        float: none;
+        margin-right: 5px;
+    }
+  }
+  .assigned {
+    padding: 10px 20px;
+    border: 1px solid #D6D6D6;
+    margin: 10px -7px;
+    border-left: none;
+    border-right: none;
+    .icon-share {
+        cursor: pointer;
+    }
+    .image {
+        width: auto;
+        height: auto;
+        margin: -1px 10px 0 0;
+    }
+  }  
+}
+
+#assigned-popup {
+    position: absolute;
+    margin: 5px 0 0 130px;
+    display: none;
+    min-width: 230px;
+    border: 1px solid #b3cce0;
+    background: #FFF;
+    -moz-border-radius: 5px;
+    -webkit-border-radius: 5px;
+    border-radius: 5px;
+    .header .icon-remove-circle {
+        cursor: pointer;
+        float: right;
+    }
+    .header {
+        padding: 10px;
+        background: #dcecfa;
+        border-bottom: 1px solid #D6D6D6;
+        font-weight: bold;
+        .title { display: inline-block; }
+    }
+    form {
+        padding: 10px 15px 10px 10px;
+        border-bottom: 1px solid #D6D6D6;
+        input {
+            width: 100%;
+            max-width: 100%;
+        }
+    }
+    .edit_assignee {
+        display: none;
+    }
+    #manage_issue_users_list {
+        overflow-y: auto;
+        overflow-x: hidden;
+        max-height: 280px;
+        .people, .nothing {
+            margin: 0;
+            width: 100%;
+            padding: 10px 20px 10px 10px;
+        }
+        .clear {
+            opacity: 0.8;
+        }
+        .nothing {
+            color: #D6D6D6;
+        }
+    }
+}

app/assets/stylesheets/design/main.scss

@@ -762,7 +762,7 @@ article div.activity div.top div.text {
   font-size: 12px;
 }
 
-article div.activity div.top div.text span.name {
+article div.activity div.top span.name {
   font-weight: 700;
 }
 

app/controllers/projects/issues_controller.rb

@@ -95,6 +95,7 @@ class Projects::IssuesController < Projects::BaseController
     users = User.joins(:groups => :projects).where(:projects => {:id => @project.id}).where("users.uname ILIKE ?", search)
     users2 = @project.collaborators.where("users.uname ILIKE ?", search)
     @users = (users + users2).uniq.sort {|x,y| x.uname <=> y.uname}.first(10)
+    @issue = Issue.where(:id => params[:id]).first
     render :partial => 'search_collaborators'
   end
 

app/views/projects/issues/_header.html.haml

@@ -1,13 +1,35 @@
-%h3.issue_title=@issue.title
 .activity
   .top
     .image
       =image_tag(avatar_url(@issue.user, :medium), :alt => 'avatar') if @issue.user
     .text
-      %span.name=link_to(@issue.user.fullname, user_path(@issue.user)) if @issue.user
+      .created
-      %br/
+        %span.date=@issue.created_at.to_s(:long)
-      %span.date=@issue.created_at.to_s(:long)
+        - if @issue.user
-      %br/
+          %span.date=t("layout.by") 
+          %span.name=link_to(@issue.user.fullname, user_path(@issue.user))
+      %h3.issue_title=@issue.title
+    .both
+    .assigned
+      - if @issue.assignee
+        .image
+          =image_tag(avatar_url(@issue.assignee, :micro), :alt => 'avatar')
+        %span.name= link_to(@issue.assign_uname, user_path(@issue.assignee))
+        %span= 'is assigned'
+      - else
+        %span= "No one is assigned"
+      -if can?(:update, @issue) || @issue.new_record?
+        %span.icon-share
+        #assigned-popup
+          .header
+            .title= 'Assign someone to this issue'
+            %span.icon-remove-circle
+          =form_tag search_collaborators_project_issues_path(@project, :id => @issue.id), :id => 'search_user', :method => :get do
+            =tracker_search_field(:search_user, t('layout.issues.search_user'))
+          =form_for :issue, :url => [@project, @issue], :method => :put, :html => { :class => 'edit_assignee issue'} do |f|
+            =hidden_field_tag "user-default_assignee", nil, :name => 'issue[assignee_id]'
+          #manage_issue_users_list
+            =render 'projects/issues/search_collaborators'
     .both
     .fulltext.view.issue_body.formatted.cm-s-default.md_and_cm=markdown @issue.body
 .both

app/views/projects/issues/_manage_sidebar.html.haml

@@ -9,32 +9,6 @@
         - if can_manage
           =form_tag [@project, @issue], :id => 'update_issue_status', :method => :put do
             =hidden_field_tag "issue_status", @issue.closed? ? 'closed' : 'open', :name => "issue[status]"
-  .bordered.nopadding
-    %h3=t('layout.issues.assignee')
-    - if @issue.persisted?
-      -if can_manage
-        =form_for :issue, :url => [@project, @issue], :method => :put, :html => { :class => 'edit_assignee issue'} do |f|
-          =hidden_field_tag "user-default_assignee", nil, :name => 'issue[assignee_id]'
-          .current_assignee
-            - if @issue.assignee
-              #user-0.people.nopointer
-                .avatar=image_tag avatar_url(@issue.assignee), :alt => 'avatar'
-                .name=@issue.assignee.fullname
-                =hidden_field_tag "user-0", @issue.assignee.id, :name => 'issue[assignee_id]'
-                .both
-      - elsif @issue.assignee
-        .people.nopointer
-          .avatar=image_tag avatar_url(@issue.assignee), :alt => 'avatar'
-          .name=@issue.assignee.fullname
-          .both
-      =link_to(t('layout.issues.assignee_manage'), '#', :class => "button tmargin10 manage_assignee") if can_manage
-    - if can_manage
-      =form_tag search_collaborators_project_issues_path(@project), :id => 'search_user', :method => :get, :style => @issue.persisted? ? 'display:none' : '' do
-        =tracker_search_field(:search_user, t('layout.issues.search_user'))
-      #manage_issue_users_list
-        =render 'search_collaborators'
-      =link_to(t('layout.issues.done'), '#', :class => "button tmargin10 update_assignee", :style => 'display:none') if can_manage
-
   .block
     %h3=t('layout.issues.labels')
     - if can_manage

app/views/projects/issues/_search_collaborators.html.haml

@@ -1,6 +1,15 @@
-- (@users || []).each_with_index do |user, index|
+- if @issue.try(:assignee)
+  .people.clear.selected
+    %span.icon-remove-circle
+    = 'Clear assignee'
+    =hidden_field_tag "user-nil", nil, :name => 'issue[assignee_id]'
+
+- users = (@users || [])
+- users.each_with_index do |user, index|
   .people.selected{:id => "user-#{index}", :class => 'add_assignee'}
     .avatar= image_tag(avatar_url(user), :alt => 'avatar')
     .name=user.fullname
     =hidden_field_tag "user-#{index}", user.id, :name => 'issue[assignee_id]'
     .both
+- if users.empty?
+  .nothing= 'Nothing to show'

app/views/projects/pull_requests/_index_sidebar.html.haml

@@ -1,5 +1,18 @@
 -content_for :sidebar do
-  =form_tag project_pull_requests_path(@project), :id => 'filter_pull_requests', :method => :get, :class => 'ajax_search_form' do
+  - if current_user
+    =form_tag project_pull_requests_path(@project), :id => 'filter_pull_requests', :method => :get do
+      .bordered.nopadding
+        %h3=t("layout.issues.accessory")
+        %table
+          %tr
+            %td.width18=radio_button_tag :myradio, 'all', !@is_assigned_to_me, {:id => 'myradio1', :class => 'niceRadio', :name => 'filter'}
+            %td.width135=t("layout.issues.all")
+            %td.width30.right=@project.issues.joins(:pull_request).count
+          %tr
+            %td=radio_button_tag :myradio, 'to_me', @is_assigned_to_me, {:id => 'myradio1', :class => 'niceRadio', :name => 'filter'}
+            %td=t("layout.issues.to_me")
+            %td.width30.right=@project.issues.joins(:pull_request).where(:assignee_id => current_user.id).count
+  =form_tag project_pull_requests_path(@project), :id => 'search_pull_requests', :method => :get, :class => 'ajax_search_form' do
     .bordered.bpadding20
       - search = params[:search_pull_request].present? ? params[:search_pull_request] : t('layout.pull_requests.search')
       =tracker_search_field(:search_pull_request, search)

vendor/assets/stylesheets/bootstrap.css

@@ -835,3 +835,9 @@ a.badge:hover {
 .icon-chevron-down {
   background-position: -313px -119px;
 }
+.icon-share {
+  background-position: -120px -72px;
+}
+.icon-remove-circle {
+  background-position: -168px -96px;
+}