Add a contact pane on aspects#show altered to also allow removal of existing contact from aspect

app/controllers/aspects_controller.rb

@@ -102,6 +102,10 @@ class AspectsController < ApplicationController
     else 
       flash[:error] =  I18n.t 'aspects.remove_from_aspect.failure'
     end
-    redirect_to aspects_manage_path
+    if params[:manage]
+      redirect_to aspects_manage_path
+    else
+      redirect_to aspect_path(params[:aspect_id])
+    end
   end
 end

app/views/aspects/manage.html.haml

@@ -41,7 +41,7 @@
             %span.tip click to edit
 
           %ul.tools
-            %li= link_to t('.add_a_new_friend'), "#add_request_pane_#{aspect.id}", :class => 'add_request_button'
+            %li= link_to t('.add_a_new_friend'), "#manage_aspect_contacts_pane_#{aspect.id}", :class => 'manage_aspect_contacts_button'
             %li!= remove_link(aspect)
 
         %ul.dropzone{:data=>{:aspect_id=>aspect.id}}
@@ -59,7 +59,7 @@
 
 
           .fancybox_content
-            %div{:id => "add_request_pane_#{aspect.id}"}
+            %div{:id => "manage_aspect_contacts_pane_#{aspect.id}"}
-              = render "requests/new_request", :aspect => aspect, :manage => true
+              = render "requests/manage_aspect_contacts", :aspect => aspect, :manage => true
 
 

app/views/requests/_manage_aspect_contacts.haml

@@ -5,12 +5,12 @@
 .span-15.last
   .modal_title_bar
     %h4
-      =t('.add_a_new_friend_to')
+      Manage contacts within
       %i= aspect.name
 
   .span-6.append-1.last
     %h3 Existing contacts
-    = render 'shared/add_friend_dropdown', :aspect => aspect, :friends => current_user.friends_not_in_aspect(aspect), :manage => defined?(manage)
+    = render 'shared/contact_list', :aspect => aspect, :contacts => current_user.friends, :manage => defined?(manage)
 
   .span-7.last
     %h3 Add a new contact

app/views/shared/_add_friend_dropdown.html.haml

@@ -1,35 +0,0 @@
-
-:javascript
-  $(".contact_list_search").keyup(function(e){
-    var search = $(this);
-    var list   = $(this).siblings("ul").first();
-    var query  = new RegExp(search.val(),'i');
-
-    $("li", list).each( function() {
-      var element = $(this);
-      if( !element.text().match(query) ){
-        if( !element.hasClass('invis') ){
-          element.addClass('invis').fadeOut(10);
-        }
-      } else {
-        element.removeClass('invis').fadeIn(10);
-      }
-    });
-  });
-
-
-.contact_list
-  = search_field_tag :hello, "", :class => 'contact_list_search', :results => 5
-  %ul
-    - for person in friends
-      %li
-        = form_tag '/aspects/add_to_aspect' do
-          = person.real_name
-          
-          .right
-            = hidden_field_tag :aspect_id, aspect.id
-            = hidden_field_tag :friend_id, person.id
-            - if defined?(manage) && manage
-              = hidden_field_tag :manage, true
-            = submit_tag '+'
-

app/views/shared/_aspect_friends.haml

@@ -13,11 +13,11 @@
       = person_image_link(friend)
 
     -unless (aspect == :all)
-      = link_to (image_tag('add_friend_button.png', :title => "#{t('.add_to', :aspect => @aspect)}")), "#add_request_pane", :class => 'add_request_button'
+      = link_to (image_tag('add_friend_button.png', :title => "manage #{@aspect}")), "#manage_aspect_contacts_pane", :class => 'manage_aspect_contacts_button'
 
       .fancybox_content
-        #add_request_pane
+        #manage_aspect_contacts_pane
-          = render "requests/new_request", :aspect => @aspect
+          = render "requests/manage_aspect_contacts", :aspect => @aspect
     -else
       .clear
         %br

app/views/shared/_contact_list.html.haml

@@ -0,0 +1,55 @@
+-#   Copyright (c) 2010, Diaspora Inc.  This file is
+-#   licensed under the Affero General Public License version 3 or later.  See
+-#   the COPYRIGHT file.
+
+
+:javascript
+  $(".contact_list_search").keyup(function(e){
+    var search = $(this);
+    var list   = $(this).siblings("ul").first();
+    var query  = new RegExp(search.val(),'i');
+
+    $("li", list).each( function() {
+      var element = $(this);
+      if( !element.text().match(query) ){
+        if( !element.hasClass('invis') ){
+          element.addClass('invis').fadeOut(10);
+        }
+      } else {
+        element.removeClass('invis').fadeIn(10);
+      }
+    });
+  });
+
+
+.contact_list
+  = search_field_tag :contact_search, "", :class => 'contact_list_search', :results => 5, :placeholder => "Search contacts"
+  
+  %ul
+    - for contact in contacts
+      %li
+
+        - unless contact.aspect_ids.include?(aspect.id)
+          = form_tag '/aspects/add_to_aspect' do
+            = person_image_tag contact.person
+            %span.name
+              = contact.person.real_name
+            .right
+              = hidden_field_tag :aspect_id, aspect.id
+              = hidden_field_tag :friend_id, contact.person.id
+              - if defined?(manage) && manage
+                = hidden_field_tag :manage, true
+              = submit_tag '+', :class => 'add', :title => "Add #{contact.person.real_name} to #{aspect}"
+
+        - else
+          = form_tag '/aspects/remove_from_aspect' do
+            = person_image_tag contact.person
+            %span.name
+              = contact.person.real_name
+            .right
+              = hidden_field_tag :aspect_id, aspect.id
+              = hidden_field_tag :friend_id, contact.person.id
+              - if defined?(manage) && manage
+                = hidden_field_tag :manage, true
+              = submit_tag 'x', :class => 'remove', :title => "Remove #{contact.person.real_name} from #{aspect}"
+

app/views/users/getting_started/_step_2.html.haml

@@ -22,11 +22,11 @@
         - for friend in aspect.person_objects
           = person_image_link(friend)
 
-        = link_to (image_tag('add_friend_button.png', :title => "add to #{aspect}")), "#add_request_pane", :class => 'add_request_button'
+        = link_to (image_tag('add_friend_button.png', :title => "add to #{aspect}")), '#manage_aspect_contacts_pane', :class => 'manage_aspect_contacts_button'
 
         .fancybox_content
-          #add_request_pane
+          #manage_aspect_contacts_pane
-            = render "requests/new_request", :aspect => aspect, :getting_started => 2
+            = render "requests/manage_aspect_contacts", :aspect => aspect, :getting_started => 2
 
       = link_to "x", aspect_path(aspect), :method => :delete, :remote => true, :class => "delete right"
 

config/locales/diaspora/en.yml

@@ -298,7 +298,7 @@ en:
           last_seen: "last seen: %{how_long_ago}"
           friends_since: "friends since: %{how_long_ago}"
   requests:
-      new_request:
+      manage_aspect_contacts:
           add_a_new_friend_to: "Add a new friend to"
           enter_a_diaspora_username: "Enter a Diaspora username:"
           your_diaspora_username_is: "Your Diaspora username is: %{diaspora_handle}"

public/javascripts/view.js

@@ -19,7 +19,7 @@ $(document).ready(function(){
 
   //buttons//////
   $(".add_aspect_button," + 
-    ".add_request_button," +
+    ".manage_aspect_contacts_button," +
     ".invite_user_button," +
     ".add_photo_button," +
     ".remove_person_button," +

public/stylesheets/sass/application.sass

@@ -1553,12 +1553,18 @@ h3 span.current_gs_step
   :max-height 300px
   :overflow auto
 
-  :border 2px solid #ccc
+  :border 2px solid #eee
+
+  :border-radius 5px
+
   :margin 
     :bottom 1.5em
 
   input.contact_list_search
     :width 100%
+    :margin
+      :top 0
+
   ul
     :width 100%
     :margin 0
@@ -1578,8 +1584,24 @@ h3 span.current_gs_step
 
       &:hover
         :background
-          :color #eee
+          :color rgb(250,250,250)
 
       .right
         :top -6px
 
+      .avatar
+        :height 22px
+        :width 22px
+        :position absolute
+        :top -2px
+
+      span.name
+        :padding
+          :left 30px
+
+      input
+        &.add
+          :color green
+
+        &.remove
+          :color red