fixed notes logic

app/assets/javascripts/application.js

@@ -23,9 +23,6 @@ $(document).ready(function(){
     $(this).select();
   });
 
-  $('select#branch').selectmenu({style:'popup', width:200});
-  $('select#tag').selectmenu({style:'popup', width:200});
-
   $(".account-box").mouseenter(showMenu);
   $(".account-box").mouseleave(resetMenu);
 
@@ -45,6 +42,9 @@ $(document).ready(function(){
     }
   });
 
+  /**
+   * Focus search field by pressing 's' key
+   */
   $(document).keypress(function(e) {
     if( $(e.target).is(":input") ) return;
     switch(e.which)  {
@@ -52,27 +52,12 @@ $(document).ready(function(){
         e.preventDefault();
     }
   });
-
 });
 
 function focusSearch() {
   $("#search").focus();
 }
 
-function taggifyForm(){
-  var tag_field = $('#tag_field').tagify();
-
-  tag_field.tagify('inputField').autocomplete({
-      source: '/tags.json'
-  });
-
-  $('form').submit( function() {
-    var tag_field = $('#tag_field')
-       tag_field.val( tag_field.tagify('serialize') );
-       return true;
-  });
-}
-
 function updatePage(data){
   $.ajax({type: "GET", url: location.href, data: data, dataType: "script"});
 }
@@ -84,5 +69,3 @@ function showMenu() {
 function resetMenu() {
   $(this).removeClass("hover");
 }
-
-

app/assets/javascripts/note.js

@@ -13,46 +13,54 @@ init:
     this.notes_path = path + ".js";
     this.target_id = tid;
     this.target_type = tt;
-    this.target_params = "&target_type=" + this.target_type + "&target_id=" + this.target_id
+    this.target_params = "&target_type=" + this.target_type + "&target_id=" + this.target_id;
-    this.refresh();
+
+    // get notes
+    this.getContent();
+
+    // get new notes every n seconds
     this.initRefresh();
-    this.initLoadMore();
+
+    $('.delete-note').live('ajax:success', function() {
+      $(this).closest('li').fadeOut(); });
+
+    $("#new_note").live("ajax:before", function(){
+      $("#submit_note").attr("disabled", "disabled");
+    })
+
+    $("#new_note").live("ajax:complete", function(){
+      $("#submit_note").removeAttr("disabled");
+    })
+
+    $("#note_note").live("click", function(){
+      $(this).css("height", "100px");
+      $('.attach_holder').show();
+    });
+
   },
 
-getOld:
+
+/**
+ * Load new notes to fresh list called 'new_notes_list': 
+ * - Replace 'new_notes_list' with new list every n seconds
+ * - Append new notes to this list after submit
+ */
+
+initRefresh:
   function() {
-    $('.loading').show();
+    // init timer
-    $.ajax({
+    var intNew = setInterval("NoteList.getNew()", 10000);
-      type: "GET",
-      url: this.notes_path,
-      data: "first_id=" + this.first_id + this.target_params,
-      complete: function(){ $('.loading').hide()},
-      dataType: "script"});
-  },
-
-append:
-  function(id, html) {
-    if(this.first_id == id) { 
-      this.disable = true;
-    } else { 
-      this.first_id = id;
-      $("#notes-list").append(html);
-    }
   },
 
 replace:
-  function(fid, lid, html) {
+  function(html) {
-    this.first_id = fid;
+    $("#new_notes_list").html(html);
-    this.last_id = lid;
-    $("#notes-list").html(html);
-    this.initLoadMore();
   },
 
 prepend:
   function(id, html) {
     if(id != this.last_id) {
-      this.last_id = id;
+      $("#new_notes_list").prepend(html);
-      $("#notes-list").prepend(html);
     }
   },
 
@@ -76,13 +84,66 @@ refresh:
       dataType: "script"});
   },
 
-initRefresh:
+
-  function() {
+/**
-    // init timer
+ * Init load of notes: 
-    var intNew = setInterval("NoteList.getNew()", 15000);
+ * 1. Get content with ajax call
-    var intRefresh = setInterval("NoteList.refresh()", 90000);
+ * 2. Set content of notes list with loaded one
+ */
+
+
+getContent: 
+  function() { 
+    $.ajax({
+      type: "GET",
+      url: this.notes_path,
+      data: "?" + this.target_params,
+      dataType: "script"});
   },
 
+setContent:
+  function(fid, lid, html) {
+      this.last_id = lid;
+      this.first_id = fid;
+      $("#notes-list").html(html);
+
+      // Init infinite scrolling
+      this.initLoadMore();
+  },
+
+
+/**
+ * Paging for old notes when scroll to bottom: 
+ * 1. Init scroll events with 'initLoadMore'
+ * 2. Load onlder notes with 'getOld' method
+ * 3. append old notes to bottom of list with 'append'
+ *
+ */
+
+
+getOld:
+  function() {
+    $('.loading').show();
+    $.ajax({
+      type: "GET",
+      url: this.notes_path,
+      data: "first_id=" + this.first_id + this.target_params,
+      complete: function(){ $('.status').removeClass("loading")},
+      beforeSend: function() { $('.status').addClass("loading") },
+      dataType: "script"});
+  },
+
+append:
+  function(id, html) {
+    if(this.first_id == id) { 
+      this.disable = true;
+    } else { 
+      this.first_id = id;
+      $("#notes-list").append(html);
+    }
+  },
+
+
 initLoadMore:
   function() {
     $(document).endlessScroll({

app/assets/stylesheets/notes.scss

@@ -2,13 +2,18 @@
  * Notes
  *
  */
-#notes-list {
+#notes-list, 
+#new_notes_list {
   display:block;
   list-style:none;
   margin:0px;
   padding:0px;
 }
 
+#new_notes_list li:last-child{ 
+  border-bottom:1px solid #aaa;
+}
+
 .issue_notes {
   .note_content {
     float:left;

app/controllers/notes_controller.rb

@@ -16,7 +16,7 @@ class NotesController < ApplicationController
              when "snippet"
                then  project.snippets.find(params[:target_id]).notes
              when "wall"
-               then project.common_notes.order("created_at DESC").fresh.limit(60)
+               then project.common_notes.order("created_at DESC").fresh.limit(10)
              when "issue"
                then project.issues.find(params[:target_id]).notes.inc_author.order("created_at DESC").limit(20)
              when "merge_request"

app/views/notes/_load.js.haml

@@ -1,12 +1,7 @@
 - unless @notes.blank?
-
+  - if params[:last_id]
-  - if params[:last_id] && params[:first_id]
     :plain
-      NoteList.replace(#{@notes.last.id}, #{@notes.first.id}, "#{escape_javascript(render(:partial => 'notes/notes_list'))}");
+      NoteList.replace("#{escape_javascript(render(:partial => 'notes/notes_list'))}");
-
-  - elsif params[:last_id]
-    :plain
-      NoteList.prepend(#{@notes.first.id}, "#{escape_javascript(render(:partial => 'notes/notes_list'))}");
 
   - elsif params[:first_id]
     :plain
@@ -14,6 +9,7 @@
 
   - else
     :plain
+      NoteList.setContent(#{@notes.last.id}, #{@notes.first.id}, "#{escape_javascript(render(:partial => 'notes/notes_list'))}");
 
 - else 
   - if params[:first_id]

app/views/notes/_notes.html.haml

@@ -2,27 +2,12 @@
   = render "notes/form"
 .clear
 %hr
+%ul#new_notes_list
 %ul#notes-list
-.loading
+.status
 
 
 :javascript
-  $('.delete-note').live('ajax:success', function() {
-    $(this).closest('li').fadeOut(); });
-
-  $("#new_note").live("ajax:before", function(){
-    $("#submit_note").attr("disabled", "disabled");
-  })
-
-  $("#new_note").live("ajax:complete", function(){
-    $("#submit_note").removeAttr("disabled");
-  })
-
   $(function(){
-    $("#note_note").live("click", function(){
-      $(this).css("height", "100px");
-      $('.attach_holder').show();
-    });
-
     NoteList.init("#{tid}", "#{tt}", "#{project_notes_path(@project)}");
   });