Add loaded story if it doesn't exist yet

app/views/backlogs/_backlog.html.erb

@@ -8,7 +8,7 @@
     </div>
     <div class="points"><%= backlog.points %></div>
     <%- else %>
-    <!-- a class='new_story'>New story</a -->
+    <a class='new_story'>New story</a>
     <%- end %>
     <%= backlog_menu is_sprint?(backlog),
         [

assets/javascripts/backlog.js

@@ -173,10 +173,9 @@ RB.Backlog = RB.Object.create(RB.Model, {
 
   loadStoryTemplate: function(){
     $.ajax({
-        type: "POST",
+        type: "GET",
         async: false,
-        data: "s=s",  // I don't quite understand why the server balks without any data supplied
-        url: RB.urlFor['new_story'],
+        url: RB.urlFor['new_story'] + "?project_id=" + RB.constants.project_id,
         complete: function(xhr, textStatus){ $(xhr.responseText).removeClass("story").appendTo("#content").wrap("<div id='story_template'/>") } // removeClass() ensures that $(".story") will not include this node
     });
   },
@@ -190,7 +189,8 @@ RB.Backlog = RB.Object.create(RB.Model, {
       this.loadStoryTemplate();
     }
 
-    story = $('#story_template').children().first().clone();
+    var story = $('#story_template').children().first().clone();
+    
     this.getList().prepend(story);
     o = RB.Factory.initialize(RB.Story, story[0]); // 'this' refers to an element with class="story"
     o.edit();

assets/javascripts/index_main.js

@@ -61,25 +61,33 @@ RB.indexMain = RB.Object.create({
     stories.each(function(i, v){
       var updated = RB.Factory.initialize(RB.Story, v);
       var previous = updated.$.find(".previous").text();
-      var old = $('#story_' + updated.getID()).data('this');
-      var editing = old.$.hasClass('editing');
+
+      var story;
+      if($('#story_' + updated.getID()).length==0){
+        story = RB.Factory.initialize(RB.Story, updated.$.clone());
+      } else {
+        console.log('#story_' + updated.getID());
+        story = $('#story_' + updated.getID()).data('this');
+        story.$.html(updated.$.html());
+      }
+
+      var editing = story.$.hasClass('editing');
       
-      old.$.html(updated.$.html());
       if(previous.length > 0){
-        old.$.insertAfter($("#story_" + previous));
+        story.$.insertAfter($("#story_" + previous));
       } else {
         var backlog = updated.$.find(".sprint").text().length==0 ? $('#product_backlog') : $('#sprint_' + updated.$.find(".sprint").text());
-        backlog.find('.stories').first().prepend(old.$);
+        backlog.find('.stories').first().prepend(story.$);
       }
       if(updated.$.hasClass('closed')){
-        old.$.addClass('closed');
+        story.$.addClass('closed');
       } else {
-        old.$.removeClass('closed');
+        story.$.removeClass('closed');
       }
-      old.refresh();
-      if(editing) old.edit();
-      if(old.$.data('focus')!=null && old.$.data('focus').length>0) old.$.find("*[name=" + old.$.data('focus') + "]").focus();
-      old.$.effect("highlight", { easing: 'easeInExpo' }, 4000);
+      story.refresh();
+      if(editing) story.edit();
+      if(story.$.data('focus')!=null && story.$.data('focus').length>0) story.$.find("*[name=" + story.$.data('focus') + "]").focus();
+      story.$.effect("highlight", { easing: 'easeInExpo' }, 4000);
     });
     
     if(stories.length==0 && RB.pollWait < 60000 && !$('body').hasClass('no_autorefresh')){

assets/javascripts/story.js

@@ -9,7 +9,10 @@ RB.Story = RB.Object.create(RB.Model, {
     this.$ = j = $(el);
     this.el = el;
     
-    j.addClass("story"); // If node is based on #story_template, it doesn't have the story class yet
+    // If node is based on #story_template, it doesn't have the story class yet
+    // The reason #story_template doesn't have the story class is because we don't
+    // want it accidentally included in $('.story') searches
+    j.addClass("story");
 
     // Associate this object with the element for later retrieval
     j.data('this', this);