From 5596a6b37c440522176fdc05217161d7de7e169c Mon Sep 17 00:00:00 2001
From: JoramWilander <jwawilander@gmail.com>
Date: Thu, 23 Jul 2015 12:45:08 -0400
Subject: added client predictive commenting

---
 web/react/components/create_comment.jsx | 24 ++++++++++++++++++++----
 1 file changed, 20 insertions(+), 4 deletions(-)

(limited to 'web/react/components/create_comment.jsx')

diff --git a/web/react/components/create_comment.jsx b/web/react/components/create_comment.jsx
index 885efab7a..fbb05c77f 100644
--- a/web/react/components/create_comment.jsx
+++ b/web/react/components/create_comment.jsx
@@ -2,15 +2,16 @@
 // See License.txt for license information.
 
 var client = require('../utils/client.jsx');
-var AsyncClient =require('../utils/async_client.jsx');
+var AsyncClient = require('../utils/async_client.jsx');
 var SocketStore = require('../stores/socket_store.jsx');
 var ChannelStore = require('../stores/channel_store.jsx');
+var UserStore = require('../stores/user_store.jsx');
 var PostStore = require('../stores/post_store.jsx');
 var Textbox = require('./textbox.jsx');
 var MsgTyping = require('./msg_typing.jsx');
 var FileUpload = require('./file_upload.jsx');
 var FilePreview = require('./file_preview.jsx');
-
+var utils = require('../utils/utils.jsx');
 var Constants = require('../utils/constants.jsx');
 
 module.exports = React.createClass({
@@ -39,10 +40,16 @@ module.exports = React.createClass({
             return;
         }
 
+        var user_id = UserStore.getCurrentId();
+
         post.channel_id = this.props.channelId;
         post.root_id = this.props.rootId;
-        post.parent_id = this.props.parentId;
+        post.parent_id = this.props.rootId;
         post.filenames = this.state.previews;
+        var time = utils.getTimestamp();
+        post.pending_post_id = user_id + ":"+ time;
+        post.user_id = user_id;
+        post.create_at = time;
 
         this.setState({submitting: true, serverError: null});
 
@@ -69,10 +76,19 @@ module.exports = React.createClass({
                         $('#post_deleted').modal('show');
                     }
                 } else {
-                    this.setState(state);
+                    post.did_fail = true;
+                    PostStore.updatePendingPost(post);
                 }
+
+                state.submitting = false;
+                this.setState(state);
             }.bind(this)
         );
+
+        post.is_loading = true;
+        PostStore.storePendingPost(post);
+        PostStore.storeCommentDraft(this.props.rootId, null);
+        this.setState({ messageText: '', submitting: false, post_error: null, previews: [], server_error: null, limit_error: null });
     },
     commentMsgKeyPress: function(e) {
         if (e.which === 13 && !e.shiftKey && !e.altKey) {
-- 
cgit v1.2.3-1-g7c22


From fa1491bbfbb1261757943759edf44883d31e5477 Mon Sep 17 00:00:00 2001
From: JoramWilander <jwawilander@gmail.com>
Date: Wed, 12 Aug 2015 12:45:15 -0400
Subject: finalize implenetation of predictive client posts so that users get
 immediate feedback after posting

---
 web/react/components/create_comment.jsx | 31 +++++++++++++++----------------
 1 file changed, 15 insertions(+), 16 deletions(-)

(limited to 'web/react/components/create_comment.jsx')

diff --git a/web/react/components/create_comment.jsx b/web/react/components/create_comment.jsx
index fbb05c77f..1de768872 100644
--- a/web/react/components/create_comment.jsx
+++ b/web/react/components/create_comment.jsx
@@ -1,6 +1,7 @@
 // Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
 // See License.txt for license information.
 
+var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
 var client = require('../utils/client.jsx');
 var AsyncClient = require('../utils/async_client.jsx');
 var SocketStore = require('../stores/socket_store.jsx');
@@ -13,6 +14,7 @@ var FileUpload = require('./file_upload.jsx');
 var FilePreview = require('./file_preview.jsx');
 var utils = require('../utils/utils.jsx');
 var Constants = require('../utils/constants.jsx');
+var ActionTypes = Constants.ActionTypes;
 
 module.exports = React.createClass({
     lastTime: 0,
@@ -27,6 +29,8 @@ module.exports = React.createClass({
             return;
         }
 
+        this.setState({submitting: true, serverError: null});
+
         var post = {};
         post.filenames = [];
         post.message = this.state.messageText;
@@ -47,17 +51,16 @@ module.exports = React.createClass({
         post.parent_id = this.props.rootId;
         post.filenames = this.state.previews;
         var time = utils.getTimestamp();
-        post.pending_post_id = user_id + ":"+ time;
+        post.pending_post_id = user_id + ':'+ time;
         post.user_id = user_id;
         post.create_at = time;
 
-        this.setState({submitting: true, serverError: null});
+        PostStore.storePendingPost(post);
+        PostStore.storeCommentDraft(this.props.rootId, null);
+        this.setState({messageText: '', submitting: false, postError: null, previews: [], serverError: null});
 
         client.createPost(post, ChannelStore.getCurrent(),
             function(data) {
-                PostStore.storeCommentDraft(this.props.rootId, null);
-                this.setState({messageText: '', submitting: false, postError: null, serverError: null});
-                this.clearPreviews();
                 AsyncClient.getPosts(true, this.props.channelId);
 
                 var channel = ChannelStore.get(this.props.channelId);
@@ -65,18 +68,22 @@ module.exports = React.createClass({
                 member.msg_count = channel.total_msg_count;
                 member.last_viewed_at = Date.now();
                 ChannelStore.setChannelMember(member);
+
+                AppDispatcher.handleServerAction({
+                    type: ActionTypes.RECIEVED_POST,
+                    post: data
+                });
             }.bind(this),
             function(err) {
                 var state = {};
-                state.serverError = err.message;
-                state.submitting = false;
 
                 if (err.message === 'Invalid RootId parameter') {
                     if ($('#post_deleted').length > 0) {
                         $('#post_deleted').modal('show');
                     }
+                    PostStore.removePendingPost(post.pending_post_id);
                 } else {
-                    post.did_fail = true;
+                    post.state = Constants.POST_FAILED;
                     PostStore.updatePendingPost(post);
                 }
 
@@ -84,11 +91,6 @@ module.exports = React.createClass({
                 this.setState(state);
             }.bind(this)
         );
-
-        post.is_loading = true;
-        PostStore.storePendingPost(post);
-        PostStore.storeCommentDraft(this.props.rootId, null);
-        this.setState({ messageText: '', submitting: false, post_error: null, previews: [], server_error: null, limit_error: null });
     },
     commentMsgKeyPress: function(e) {
         if (e.which === 13 && !e.shiftKey && !e.altKey) {
@@ -153,9 +155,6 @@ module.exports = React.createClass({
             this.setState({serverError: err});
         }
     },
-    clearPreviews: function() {
-        this.setState({previews: []});
-    },
     removePreview: function(id) {
         var previews = this.state.previews;
         var uploadsInProgress = this.state.uploadsInProgress;
-- 
cgit v1.2.3-1-g7c22

