From aece802c32b638f805a57496a89e8ab1edc6223c Mon Sep 17 00:00:00 2001
From: Tom Willemse <tom@ryuslash.org>
Date: Sun, 7 Jul 2013 22:36:51 +0200
Subject: [PATCH] Reload stories immediately

Reload the stories list immediately after successfully adding a new
story.
---
 scrumli.lisp      |  6 ++++--
 static/js/main.js | 53 +++++++++++++++++++++++++++--------------------
 2 files changed, 34 insertions(+), 25 deletions(-)

diff --git a/scrumli.lisp b/scrumli.lisp
index 4659457..778b1aa 100644
--- a/scrumli.lisp
+++ b/scrumli.lisp
@@ -97,12 +97,14 @@
                  parameters)
      ,@body))
 
-(define-route stories-new ("stories/new" :method :post)
+(define-route stories-new ("stories/new" :method :post
+                                         :content-type "text/json")
   (if (logged-in-p)
       (with-post-parameters ("role" "necessity" "headline" "content")
         (post-story role necessity headline content
                     (hunchentoot:session-value :username))
-        200)
+        (with-output-to-string (out)
+          (encode-json '((status . "ok")) out)))
       403))
 
 (define-route tasks-new ("stories/tasks/new" :method :post)
diff --git a/static/js/main.js b/static/js/main.js
index 60988df..255e537 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -221,30 +221,11 @@ var StoryRow = React.createClass({
 });
 
 var StoryTable = React.createClass({
-    loadStoriesFromServer: function() {
-        $.ajax({
-            url: this.props.url,
-            mimeType: 'textPlain',
-            success: function(data) {
-                this.setState({data: eval(data)});
-            }.bind(this)
-        });
-    },
-    getInitialState: function() {
-        return {data: []};
-    },
-    componentWillMount: function() {
-        this.loadStoriesFromServer();
-        setInterval(
-            this.loadStoriesFromServer.bind(this),
-            this.props.pollInterval
-        );
-    },
     handleMoved: React.autoBind(function(direction) {
         this.loadStoriesFromServer();
     }),
     render: function() {
-        var storyNodes = this.state.data.map(function (story) {
+        var storyNodes = this.props.data.map(function (story) {
             return <StoryRow story={story} onMoved={this.handleMoved} />;
         }.bind(this));
         return (
@@ -302,19 +283,45 @@ var StoryForm = React.createClass({
 });
 
 var StoryPage = React.createClass({
+    loadStoriesFromServer: function() {
+        $.ajax({
+            url: this.props.url,
+            mimeType: 'textPlain',
+            success: function(data) {
+                this.setState({data: eval(data)});
+            }.bind(this)
+        });
+    },
+    getInitialState: function() {
+        return {data: []};
+    },
+    componentWillMount: function() {
+        this.loadStoriesFromServer();
+        setInterval(
+            this.loadStoriesFromServer.bind(this),
+            this.props.pollInterval
+        );
+    },
     handleStorySubmit: React.autoBind(function (story) {
         $.ajax({
             url: "/stories/new",
             type: "POST",
             data: story,
             dataType: 'json',
-            mimeType: 'textPlain'
+            mimeType: 'textPlain',
+            success: function (data, textStatus, jqXHR) {
+                if (data.status == "ok")
+                    this.loadStoriesFromServer();
+            }.bind(this),
+            error: function (jqXHR, textStatus, errorThrown) {
+                alert("error: " + errorThrown);
+            }.bind(this)
         });
     }),
     render: function() {
         return (
             <div>
-              <StoryTable url="/stories" pollInterval={5000} />
+              <StoryTable data={this.state.data} />
               <StoryForm onStorySubmit={this.handleStorySubmit} />
             </div>
         );
@@ -322,6 +329,6 @@ var StoryPage = React.createClass({
 });
 
 React.renderComponent(
-    <StoryPage />,
+    <StoryPage url="/stories" pollInterval={5000} />,
     document.getElementById('content')
 );