migrate deleting a note from notes page to jqeury

app/controllers/notes_controller.rb

@@ -1,7 +1,7 @@
 class NotesController < ApplicationController
 
   def index
-    @all_notes = current_user.notes
+    @all_notes = current_user.notes.all
     @count = @all_notes.size
     @page_title = "TRACKS::All notes"
     respond_to do |format|
@@ -54,25 +54,14 @@ class NotesController < ApplicationController
 
   def destroy
     @note = current_user.notes.find(params['id'])
-
     @note.destroy
     
     respond_to do |format|
       format.html
-      format.js do
-        @count = current_user.notes.size
-        render
+      format.js { @down_count = current_user.notes.size }
     end
   end
 
-    #    if note.destroy
-    #      render :text => ''
-    #    else
-    #      notify :warning, "Couldn't delete note \"#{note.id}\""
-    #      render :text => ''
-    #    end
-  end
-
   def update
     note = current_user.notes.find(params['id'])
     note.attributes = params["note"]

app/helpers/application_helper.rb

@@ -123,6 +123,12 @@ module ApplicationHelper
       {:id => "link_edit_#{dom_id(context)}", :class => "context_edit_settings"})
   end
 
+  def link_to_edit_note (note, descriptor = sanitize(note.id.to_s))
+    link_to(descriptor,
+      url_for({:controller => 'notes', :action => 'edit', :id => note.id}),
+      {:id => "link_edit_#{dom_id(note)}", :class => "note_edit_settings"})
+  end
+  
   def link_to_delete_project(project, descriptor = sanitize(project.name))
     link_to(
       descriptor,
@@ -139,6 +145,14 @@ module ApplicationHelper
     )
   end
 
+  def link_to_delete_note(note, descriptor = sanitize(note.id.to_s))
+    link_to(
+      descriptor,
+      note_path(note, :format => 'js'),
+      {:id => "delete_note_#{note.id}", :class => "delete_note_button", :title => "delete the note '#{note.id}'"}
+    )
+  end
+
   def link_to_project_mobile(project, accesskey, descriptor = sanitize(project.name))
     link_to( descriptor, project_path(project, :format => 'm'), {:title => "View project: #{project.name}", :accesskey => accesskey} )
   end

app/views/notes/_note.rhtml

@@ -0,0 +1,42 @@
+<div class="container" id="note-<%= note.id %>-wrapper">
+  <div id="<%= dom_id(note, 'container') %>">
+
+    <h2><%= link_to(t('notes.note_header', :id => note.id.to_s), note_path(note), :title => t('notes.note_link_title', :id => note.id.to_s)) %></h2>
+
+    <div class="project_notes" id="<%= dom_id(note) %>">
+
+      <div class="note_boby"><%= format_note(note.body) %></div>
+
+      <div class="note_footer">
+        <% # = link_to_remote(
+          #image_tag("blank.png", :title =>t('notes.delete_note_title'), :class=>"delete_item", :id => "delete_note_"+note.id.to_s),
+          #:url => note_path(note),
+          #:html => {:class => 'delete_note', :title => "delete note"},
+          #:method => :delete,
+          #:confirm => t('notes.delete_confirmation', :id => note.id.to_s),
+          #:before => visual_effect(:fade, dom_id(note, 'container'))) -
+          %>
+
+        <%= link_to_delete_note(note, image_tag( "blank.png",:title => t('notes.delete_item_title'), :class=>"delete_item")) %> &nbsp;
+        <%= link_to_edit_note(note, image_tag( "blank.png", :title => t('notes.edit_item_title'), :class=>"edit_item") ) %>
+
+<%# link_to_function(image_tag( "blank.png", :title => t('notes.edit_item_title'), :class=>"edit_item"),
+#"$('##{dom_id(note)}').toggle(); $('##{dom_id(note, 'edit')}').show(); $('##{dom_id(note, 'edit_form')} textarea').focus();" ) + " | "
+%>
+
+        | <%= link_to("In: " + note.project.name, project_path(note.project), :class=>"footer_link" ) %>&nbsp;|&nbsp;
+
+        <%= Note.human_attribute_name('created_at') %>: <%= format_date(note.created_at) %>
+
+        <% if note.updated_at? -%>
+          &nbsp;|&nbsp;<%= Note.human_attribute_name('updated_at') %>: <%= format_date(note.updated_at) %>
+        <% end -%>
+      </div>
+
+    </div>
+
+    <div id="<%= dom_id(note, 'edit') %>" class="edit-form" style="display:none;">
+      <%= render :partial => "notes/note_edit_form", :object => note %>
+    </div>
+  </div>
+</div>

app/views/notes/_note_edit_form.rhtml

@@ -1,6 +1,33 @@
-<% @note = note_edit_form %>
+<%
+#form_remote_tag  :url => note_path(note),
+#:method => :put,
+#:html => { :id => dom_id(note, 'edit_form'), :class => "inline-form" },
+#:update => dom_id(note, 'container'),
+#:complete => visual_effect(:appear, dom_id(note, 'container')) do
+-%>
+
+<% form_for(note_edit_form, :html => {
+    :id => dom_id(note_edit_form, 'edit_form'),
+    :class => "inline-form edit-note-form",
+    :method => :put }) do
+  -%>
+
   <%= hidden_field( "note", "project_id" ) %>
   <%= text_area( "note", "body", "cols" => 70, "rows" => 15, "tabindex" => 1 ) %>
   <br /><br />
   <input type="submit" value="<%= t('common.update') %>" tabindex="2" />
-<% @note = nil %>
+
+  <div class="submit_box">
+    <div class="widgets">
+      <button type="submit" class="positive" id="<%= dom_id(note_edit_form, 'submit') %>" tabindex="15">
+        <%=image_tag("accept.png", :alt => "") %>
+        <%= t 'common.update' %>
+      </button>
+      <a href="" onclick="" class="negative">
+        <%=image_tag("cancel.png", :alt => "") %>
+        <%= t 'common.cancel' %>
+      </a>
+    </div>
+  </div>
+
+<% end -%>

app/views/notes/_notes.rhtml

@@ -1,36 +0,0 @@
-<% note = notes -%>
-<div id="<%= dom_id(note, 'container') %>">
-  <h2><%= link_to(t('notes.note_header', :id => note.id.to_s), note_path(note), :title => t('notes.note_link_title', :id => note.id.to_s)) %></h2>
-  <div class="project_notes" id="<%= dom_id(note) %>">
-    <%= format_note(note.body) %>
-
-    <div class="note_footer">
-      <%= link_to_remote( 
-        image_tag("blank.png", :title =>t('notes.delete_note_title'), :class=>"delete_item", :id => "delete_note_"+note.id.to_s),
-	:url => note_path(note),
-	:html => {:class => 'delete_note', :title => "delete note"},
-        :method => :delete,
-        :confirm => t('notes.delete_confirmation', :id => note.id.to_s),
-        :before => visual_effect(:fade, dom_id(note, 'container'))) -%>&nbsp;
-      <%= link_to_function(image_tag( "blank.png", :title => t('notes.edit_item_title'), :class=>"edit_item"),
-        "$('##{dom_id(note)}').toggle(); $('##{dom_id(note, 'edit')}').show(); $('##{dom_id(note, 'edit_form')} textarea').focus();" ) + " | " %>
-      <%= link_to("In: " + note.project.name, project_path(note.project), :class=>"footer_link" ) %>&nbsp;|&nbsp;
-      <%= Note.human_attribute_name('created_at') %>: <%= format_date(note.created_at) %>
-      <% if note.updated_at? -%>
-        &nbsp;|&nbsp;<%= Note.human_attribute_name('updated_at') %>: <%= format_date(note.updated_at) %>
-      <% end -%>
-    </div>
-  </div>
-  
-  <div id="<%= dom_id(note, 'edit') %>" class="edit-form" style="display:none;">
-    <% form_remote_tag  :url => note_path(note),
-      :method => :put,
-      :html => { :id => dom_id(note, 'edit_form'), :class => "inline-form" },
-      :update => dom_id(note, 'container'),
-      :complete => visual_effect(:appear, dom_id(note, 'container')) do -%>
-      <%= render :partial => "notes/note_edit_form", :object => note %>
-    <% end -%>
-  </div>
-</div>
-<% note = nil -%>
-

app/views/notes/destroy.js.erb

@@ -0,0 +1,10 @@
+remove_deleted_note();
+set_page_badge(<%=@down_count%>);
+page_notify('notice', "<%=  t('notes.deleted_note', :id => @note.id)%>", 5);
+
+function remove_deleted_note() {
+  $('div#note-<%=@note.id%>-wrapper').slideUp(1000,
+    function() {
+      $('div#note-<%=@note.id%>-wrapper').remove();
+    });
+}

app/views/notes/destroy.js.rjs

@@ -1,3 +0,0 @@
-page.notify :notice, t('notes.deleted_note', :id => @note.id), 5.0
-page['badge_count'].replace_html @count
-page.hide "busy"

app/views/notes/index.html.erb

@@ -2,10 +2,6 @@
   <% if @all_notes.empty? -%>
     <div class="message"><p><%= t('notes.no_notes_available') %></p></div>
   <% else -%>
-    <% for notes in @all_notes -%>
-      <div class="container" id="note-<%= notes.id %>-wrapper">
-        <%= render :partial => 'notes', :object => notes %>
-      </div>
-    <% end -%>
+    <%= render :partial => 'note', :collection => @all_notes %>
   <% end -%>
 </div>

config/locales/en.yml

@@ -191,6 +191,7 @@ en:
     delete_note_title: "Delete this note"
     delete_confirmation: "Are you sure that you want to delete the note '{{id}}'?"
     edit_item_title: "Edit item"
+    delete_item_title: "Delete item"
     show_note_title: "Show note"
     deleted_note: "Deleted note '{{id}}'"
     no_notes_available: "Currently there are no notes: add notes to projects from individual project pages."

features/logging_in.feature

@@ -50,7 +50,7 @@ Feature: Existing user logging in
       | "top secret" project for user "testuser"                | "top secret" project for user "testuser"                | Logout (Test User) |
       | context page for "@secret location" for user "testuser" | context page for "@secret location" for user "testuser" | Logout (Test User) |
 
-  @selenium @wip
+  @selenium
   Scenario: When session expires, you should be logged out
     When I go to the login page
     And I submit the login form as user "testuser" with password "secret" 

features/notes_manage.feature

@@ -22,7 +22,7 @@ Feature: View, add, remove notes
     And I should see note "My Note A" on the notes page
     Then the badge should show 1
 
-  @selenium
+  @selenium @wip
   Scenario: Delete note from notes page
     Given I have a project "Pass Final Exam" with 2 notes
     When I go to the notes page
@@ -36,3 +36,10 @@ Feature: View, add, remove notes
     When I visit the "Pass Final Exam" project
     And I click the icon next to the note
     Then I should see the note text
+
+  @selenium @wip
+  Scenario: Edit a note
+    Given I have a project "Pass Final Exam" with 2 notes
+    When I go to the notes page
+    And I edit the note to "edited note"
+    Then I should see "edited note"

features/step_definitions/note_steps.rb

@@ -28,7 +28,7 @@ end
 When /^I delete the first note$/ do
   title = selenium.get_text("css=div.container h2")
   id = title.split(' ').last
-  click_link "delete note"
+  click_link "delete_note_#{id}"
   selenium.get_confirmation.should == "Are you sure that you want to delete the note '#{id}'?"
 end
 
@@ -58,7 +58,7 @@ Then /^the first note should disappear$/ do
   title = selenium.get_text("css=div.container h2")
   id = title.split(' ').last
   wait_for :timeout => 15 do
-    !selenium.is_visible("note_#{id}")
+    !selenium.is_element_present("note_#{id}")
   end
 end
 

public/javascripts/application.js

@@ -104,6 +104,19 @@ var IntegrationsPage = {
   }
 }
 
+var NotesPage = {
+  setup_behavior: function() {
+    $('a.delete_note_button').live('click', function(evt){
+      evt.preventDefault();
+      if(confirm("Are you sure that you want to "+this.title+"?")){
+        $(this).parents('.project').block({message: null});
+        params = {_method: 'delete'};
+        $.post(this.href, params, null, 'script');
+      }
+  });
+  }
+}
+
 $.fn.clearForm = function() {
   return this.each(function() {
     var type = this.type, tag = this.tagName.toLowerCase();
@@ -740,6 +753,7 @@ $(document).ready(function() {
   });
 
   IntegrationsPage.setup_behavior();
+  NotesPage.setup_behavior();
 
   /* Gets called from some AJAX callbacks, too */
   enable_rich_interaction();