remove modal window from team member managment

app/assets/javascripts/team.js

@@ -0,0 +1,8 @@
+function backToMembers(){
+  $("#team_member_new").hide("slide", { direction: "right" }, 150, function(){
+    $("#team-table").show("slide", { direction: "left" }, 150, function() { 
+      $("#team_member_new").remove();
+      $(".add_new").show();
+    });
+  });
+}

app/assets/stylesheets/projects.css.scss

@@ -815,7 +815,7 @@ tr.line_notes_row {
       width:28px;  
       height:27px;
       top: -12px;
-      border: 1px solid #474D57;
+      border: 1px solid #CCC;
       border-radius: 3px;
       background: #fff;
 

app/views/projects/team.html.haml

@@ -1,4 +1,3 @@
 = render "project_head"
-%div
-  = render :partial => "team", :locals => {:project => @project}
+= render :partial => "team", :locals => {:project => @project}
 

app/views/team_members/_form.html.haml

@@ -1,24 +1,33 @@
-%div
-  = form_for @team_member, :as => :team_member, :url => project_team_members_path(@project, @team_member), :remote => "true" do |f|
-    -if @team_member.errors.any?
-      %ul
-        - @team_member.errors.full_messages.each do |msg|
-          %li= msg
+= form_for @team_member, :as => :team_member, :url => project_team_members_path(@project, @team_member), :remote => "true" do |f|
+  %div
+    %span.entity-info
+      - if request.xhr? 
+        = link_to "#back", :onclick => "backToMembers();" do 
+          .entity-button
+            Team List
+            %i
+    %h2= "New Team member"
 
-    .span-6.append-bottom
-      %b Name
-    .span-6
-      = f.select(:user_id, User.not_in_project(@project).all.collect {|p| [ p.name, p.id ] }, { :include_blank => "Select user" }, { :style => "width:300px" })
-    .span-6
-      %b Project Access:
-    .span-6
-      = f.select :project_access, options_for_select(Project.access_options, @team_member.project_access), {}, :class => "project-access-select"
+    %hr
+  -if @team_member.errors.any?
+    %ul
+      - @team_member.errors.full_messages.each do |msg|
+        %li= msg
 
-    .span-6
-      %b Repository Access:
-    .span-6
-      = f.select :repo_access, options_for_select(Repository.access_options, @team_member.repo_access), {}, :class => "repo-access-select"
-    %br
-    .span-6
-      = f.submit 'Save', :class => "grey-button"
+  .span-6.append-bottom
+    %b Name
+  .span-6
+    = f.select(:user_id, User.not_in_project(@project).all.collect {|p| [ p.name, p.id ] }, { :include_blank => "Select user" }, { :style => "width:300px" })
+  .span-6
+    %b Project Access:
+  .span-6
+    = f.select :project_access, options_for_select(Project.access_options, @team_member.project_access), {}, :class => "project-access-select"
+
+  .span-6
+    %b Repository Access:
+  .span-6
+    = f.select :repo_access, options_for_select(Repository.access_options, @team_member.repo_access), {}, :class => "repo-access-select"
+  %br
+  .merge-tabs
+    = f.submit 'Save', :class => "grey-button"
 

app/views/team_members/create.js.haml

@@ -1,9 +1,13 @@
 - if @team_member.valid?
   :plain
-    $("#new_tm_dialog").dialog("close");
-    $("#team-table").append("#{escape_javascript(render(:partial => 'show', :locals => {:member => @team_member} ))}");
+    $("#team_member_new").hide("slide", { direction: "right" }, 150, function(){
+      $("#team-table").show("slide", { direction: "left" }, 150, function() { 
+        $("#team_member_new").remove();
+        $("#team-table").replaceWith("#{escape_javascript(render('projects/team'))}");
+        $(".add_new").show();
+      });
+    });
 - else
   :plain
-    $("#new_tm_dialog").empty();
-    $("#new_tm_dialog").append("#{escape_javascript(render('form'))}");
+    $("#team_member_new").replaceWith("#{escape_javascript(render('form'))}");
     $('select#team_member_user_id').chosen();

app/views/team_members/new.js.haml

@@ -1,16 +1,8 @@
--#$("#new-member-holder").empty();
--#$("#new-member-holder").append("#{escape_javascript(render('form'))}");
 :plain
-  var new_tm_dialog = $("<div id='new_tm_dialog'></div>");
-  new_tm_dialog.html("#{escape_javascript(render('form'))}");
-  $(new_tm_dialog).dialog({
-    width: 350,
-    resizable: false,
-    draggable: false,
-    title: "Add new member to project team",
-    close: function(event, ui) { $("#new_tm_dialog").remove();},
-    modal: true
-
+  $("#team-table").hide("slide", { direction: "left" }, 150, function(){
+    $(this).parent().append("#{escape_javascript(render('form'))}");
+    $('#team_member_new select#team_member_user_id').chosen();
+    $("#team_member_new").show("slide", { direction: "right" }, 150);
+    $(".add_new").hide();
   });
 
-  $('#team_member_new select#team_member_user_id').chosen();

spec/requests/team_members_spec.rb

@@ -26,7 +26,7 @@ describe "TeamMembers" do
     end
 
     it "should open new team member popup" do
-      page.should have_content("Add new member to project")
+      page.should have_content("New Team member")
     end
 
     describe "fill in" do