From 1fc12dd8ba2238eba7d154eee55e1381e7415372 Mon Sep 17 00:00:00 2001 From: =Corey Hulen Date: Tue, 20 Oct 2015 14:49:42 -0700 Subject: Multi-session login --- web/react/components/post_list.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'web/react/components/post_list.jsx') diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 4402745e1..29cd22c44 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -323,7 +323,7 @@ export default class PostList extends React.Component {
-- cgit v1.2.3-1-g7c22 From 27a8169ae8dd41eb5a2b8a9b11e69fc4b922b115 Mon Sep 17 00:00:00 2001 From: Reed Garmsen Date: Wed, 21 Oct 2015 13:55:41 -0700 Subject: Changed post list resize code to use react state; fixed various eslint warnings --- web/react/components/post_list.jsx | 89 ++++++++++++++++++++++---------------- 1 file changed, 51 insertions(+), 38 deletions(-) (limited to 'web/react/components/post_list.jsx') diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 4402745e1..5a4e8abaf 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -12,7 +12,7 @@ const UserStore = require('../stores/user_store.jsx'); const SocketStore = require('../stores/socket_store.jsx'); const PreferenceStore = require('../stores/preference_store.jsx'); -const utils = require('../utils/utils.jsx'); +const Utils = require('../utils/utils.jsx'); const Client = require('../utils/client.jsx'); const Constants = require('../utils/constants.jsx'); const ActionTypes = Constants.ActionTypes; @@ -40,11 +40,13 @@ export default class PostList extends React.Component { this.loadFirstPosts = this.loadFirstPosts.bind(this); this.activate = this.activate.bind(this); this.deactivate = this.deactivate.bind(this); - this.resize = this.resize.bind(this); + this.handleResize = this.handleResize.bind(this); + this.resizePostList = this.resizePostList.bind(this); const state = this.getStateFromStores(props.channelId); state.numToDisplay = Constants.POST_CHUNK_SIZE; state.isFirstLoadComplete = false; + state.windowHeight = Utils.windowHeight(); this.state = state; } @@ -115,12 +117,7 @@ export default class PostList extends React.Component { const postHolder = $(ReactDOM.findDOMNode(this.refs.postlist)); - $(window).resize(() => { - this.resize(); - if (!this.scrolled) { - this.scrollToBottom(); - } - }); + window.addEventListener('resize', this.handleResize); postHolder.on('scroll', () => { const position = postHolder.scrollTop() + postHolder.height() + 14; @@ -154,7 +151,7 @@ export default class PostList extends React.Component { this.loadFirstPosts(this.props.channelId); } - this.resize(); + this.handleResize(); this.onChange(); this.scrollToBottom(); } @@ -164,7 +161,9 @@ export default class PostList extends React.Component { SocketStore.removeChangeListener(this.onSocketChange); PreferenceStore.removeChangeListener(this.onTimeChange); $('body').off('click.userpopover'); - $(window).off('resize'); + + window.removeEventListener('resize', this.handleResize); + var postHolder = $(ReactDOM.findDOMNode(this.refs.postlist)); postHolder.off('scroll'); } @@ -202,7 +201,7 @@ export default class PostList extends React.Component { // it's by the user and not a comment } else if (isNewPost && userId === firstPost.user_id && - !utils.isComment(firstPost)) { + !Utils.isComment(firstPost)) { this.scrollToBottom(true); // the user clicked 'load more messages' @@ -219,6 +218,10 @@ export default class PostList extends React.Component { } else { this.scrollTo(this.prevScrollTop); } + + if (prevState.windowHeight !== this.state.windowHeight) { + this.handleResize(); + } } componentWillUpdate() { var postHolder = $(ReactDOM.findDOMNode(this.refs.postlist)); @@ -231,10 +234,20 @@ export default class PostList extends React.Component { this.deactivate(); } } - resize() { + handleResize() { + this.setState({ + windowHeight: Utils.windowHeight() + }); + + this.resizePostList(); + if (!this.scrolled) { + this.scrollToBottom(); + } + } + resizePostList() { const postHolder = $(ReactDOM.findDOMNode(this.refs.postlist)); if ($('#create_post').length > 0) { - const height = $(window).height() - $('#create_post').height() - $('#error_bar').outerHeight() - 50; + const height = this.state.windowHeight - $('#create_post').height() - $('#error_bar').outerHeight() - 50; postHolder.css('height', height + 'px'); } } @@ -280,7 +293,7 @@ export default class PostList extends React.Component { onChange() { var newState = this.getStateFromStores(this.props.channelId); - if (!utils.areStatesEqual(newState.postList, this.state.postList)) { + if (!Utils.areStatesEqual(newState.postList, this.state.postList)) { this.setState(newState); } } @@ -310,7 +323,7 @@ export default class PostList extends React.Component { } } createDMIntroMessage(channel) { - var teammate = utils.getDirectTeammate(channel.id); + var teammate = Utils.getDirectTeammate(channel.id); if (teammate) { var teammateName = teammate.username; @@ -370,13 +383,13 @@ export default class PostList extends React.Component { createDefaultIntroMessage(channel) { return (
-

Beginning of {channel.display_name}

+

{'Beginning of ' + channel.display_name}

- Welcome to {channel.display_name}! + {'Welcome to ' + channel.display_name + '!'}

- This is the first channel teammates see when they sign up - use it for posting updates everyone needs to know. + {'This is the first channel teammates see when they sign up - use it for posting updates everyone needs to know.'}

- To create a new channel or join an existing one, go to the Left Sidebar under “Channels” and click “More…”. + {'To create a new channel or join an existing one, go to the Left Sidebar under “Channels” and click “More…”.'}

@@ -385,7 +398,7 @@ export default class PostList extends React.Component { createOffTopicIntroMessage(channel) { return (
-

Beginning of {channel.display_name}

+

{'Beginning of ' + channel.display_name}

{'This is the start of ' + channel.display_name + ', a channel for non-work-related conversations.'}
@@ -399,7 +412,7 @@ export default class PostList extends React.Component { data-title={channel.display_name} data-channelid={channel.id} > - Set a description + {'Set a description'} - Invite others to this channel + {'Invite others to this channel'}

); @@ -422,7 +435,7 @@ export default class PostList extends React.Component { var members = ChannelStore.getExtraInfo(channel.id).members; for (var i = 0; i < members.length; i++) { - if (utils.isAdmin(members[i].roles)) { + if (Utils.isAdmin(members[i].roles)) { return members[i].username; } } @@ -443,14 +456,14 @@ export default class PostList extends React.Component { var createMessage; if (creatorName === '') { - createMessage = 'This is the start of the ' + uiName + ' ' + uiType + ', created on ' + utils.displayDate(channel.create_at) + '.'; + createMessage = 'This is the start of the ' + uiName + ' ' + uiType + ', created on ' + Utils.displayDate(channel.create_at) + '.'; } else { - createMessage = (This is the start of the {uiName} {uiType}, created by {creatorName} on {utils.displayDate(channel.create_at)}); + createMessage = (This is the start of the {uiName} {uiType}, created by {creatorName} on {Utils.displayDate(channel.create_at)}); } return (
-

Beginning of {uiName}

+

{'Beginning of ' + uiName}

{createMessage} {memberMessage} @@ -465,7 +478,7 @@ export default class PostList extends React.Component { data-title={channel.display_name} data-channelid={channel.id} > - Set a description + {'Set a description'} - Invite others to this {uiType} + {'Invite others to this ' + uiType}

); @@ -507,7 +520,7 @@ export default class PostList extends React.Component { if (prevPost) { sameUser = prevPost.user_id === post.user_id && post.create_at - prevPost.create_at <= 1000 * 60 * 5; - sameRoot = utils.isComment(post) && (prevPost.id === post.root_id || prevPost.root_id === post.root_id); + sameRoot = Utils.isComment(post) && (prevPost.id === post.root_id || prevPost.root_id === post.root_id); // hide the profile pic if: // the previous post was made by the same user as the current post, @@ -516,8 +529,8 @@ export default class PostList extends React.Component { // the current post is not from a webhook // and the previous post is not from a webhook if ((prevPost.user_id === post.user_id) && - !utils.isComment(prevPost) && - !utils.isComment(post) && + !Utils.isComment(prevPost) && + !Utils.isComment(post) && (!post.props || !post.props.from_webhook) && (!prevPost.props || !prevPost.props.from_webhook)) { hideProfilePic = true; @@ -526,7 +539,7 @@ export default class PostList extends React.Component { // check if it's the last comment in a consecutive string of comments on the same post // it is the last comment if it is last post in the channel or the next post has a different root post - var isLastComment = utils.isComment(post) && (i === 0 || posts[order[i - 1]].root_id !== post.root_id); + var isLastComment = Utils.isComment(post) && (i === 0 || posts[order[i - 1]].root_id !== post.root_id); var postCtl = ( ); - let currentPostDay = utils.getDateForUnixTicks(post.create_at); + const currentPostDay = Utils.getDateForUnixTicks(post.create_at); if (currentPostDay.toDateString() !== previousPostDay.toDateString()) { postCtls.push(
lastViewed && !renderedLastViewed) { renderedLastViewed = true; - // Temporary fix to solve ie10/11 rendering issue + // Temporary fix to solve ie11 rendering issue let newSeparatorId = ''; - if (!utils.isBrowserIE()) { + if (!Utils.isBrowserIE()) { newSeparatorId = 'new_message_' + this.props.channelId; } postCtls.push( @@ -572,7 +585,7 @@ export default class PostList extends React.Component {
-
New Messages
+
{'New Messages'}
); } @@ -638,7 +651,7 @@ export default class PostList extends React.Component { order = this.state.postList.order; } - var moreMessages =

Beginning of Channel

; + var moreMessages =

{'Beginning of Channel'}

; if (channel != null) { if (order.length >= this.state.numToDisplay) { moreMessages = ( @@ -648,7 +661,7 @@ export default class PostList extends React.Component { href='#' onClick={this.loadMorePosts} > - Load more messages + {'Load more messages'} ); } else { -- cgit v1.2.3-1-g7c22 From 4129b204c3f6d76154f98ed715c11508d5348cc9 Mon Sep 17 00:00:00 2001 From: Reed Garmsen Date: Wed, 21 Oct 2015 15:08:04 -0700 Subject: Fixed typos in create_post.jsx resizing code --- web/react/components/post_list.jsx | 18 ++++++++---------- 1 file changed, 8 insertions(+), 10 deletions(-) (limited to 'web/react/components/post_list.jsx') diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 5a4e8abaf..b7df483e9 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -151,7 +151,7 @@ export default class PostList extends React.Component { this.loadFirstPosts(this.props.channelId); } - this.handleResize(); + this.resizePostList(); this.onChange(); this.scrollToBottom(); } @@ -172,6 +172,13 @@ export default class PostList extends React.Component { return; } + if (prevState.windowHeight !== this.state.windowHeight) { + this.resizePostList(); + if (!this.scrolled) { + this.scrollToBottom(); + } + } + $('.post-list__content div .post').removeClass('post--last'); $('.post-list__content div:last-child .post').addClass('post--last'); @@ -218,10 +225,6 @@ export default class PostList extends React.Component { } else { this.scrollTo(this.prevScrollTop); } - - if (prevState.windowHeight !== this.state.windowHeight) { - this.handleResize(); - } } componentWillUpdate() { var postHolder = $(ReactDOM.findDOMNode(this.refs.postlist)); @@ -238,11 +241,6 @@ export default class PostList extends React.Component { this.setState({ windowHeight: Utils.windowHeight() }); - - this.resizePostList(); - if (!this.scrolled) { - this.scrollToBottom(); - } } resizePostList() { const postHolder = $(ReactDOM.findDOMNode(this.refs.postlist)); -- cgit v1.2.3-1-g7c22 From 7384b0791e54b0fd980ce8c321566c2c42289c02 Mon Sep 17 00:00:00 2001 From: =Corey Hulen Date: Thu, 22 Oct 2015 20:52:31 -0700 Subject: Fixing merge --- web/react/components/post_list.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'web/react/components/post_list.jsx') diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 2839325fe..fd29a303c 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -334,7 +334,7 @@ export default class PostList extends React.Component {
-- cgit v1.2.3-1-g7c22 From d4f1f981a5143663e03a1daab8105cc11b39820d Mon Sep 17 00:00:00 2001 From: JoramWilander Date: Thu, 22 Oct 2015 08:45:28 -0400 Subject: Auto-embed gifs from .gif links --- web/react/components/post_list.jsx | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) (limited to 'web/react/components/post_list.jsx') diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index fd29a303c..3ceef478c 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -42,6 +42,7 @@ export default class PostList extends React.Component { this.deactivate = this.deactivate.bind(this); this.handleResize = this.handleResize.bind(this); this.resizePostList = this.resizePostList.bind(this); + this.updateScroll = this.updateScroll.bind(this); const state = this.getStateFromStores(props.channelId); state.numToDisplay = Constants.POST_CHUNK_SIZE; @@ -205,9 +206,10 @@ export default class PostList extends React.Component { this.scrollToBottom(); // there's a new post and - // it's by the user and not a comment + // it's by the user (and not from their webhook) and not a comment } else if (isNewPost && userId === firstPost.user_id && + !firstPost.props.from_webhook && !Utils.isComment(firstPost)) { this.scrollToBottom(true); @@ -237,6 +239,11 @@ export default class PostList extends React.Component { this.deactivate(); } } + updateScroll() { + if (!this.scrolled) { + this.scrollToBottom(); + } + } handleResize() { this.setState({ windowHeight: Utils.windowHeight() @@ -550,6 +557,7 @@ export default class PostList extends React.Component { posts={posts} hideProfilePic={hideProfilePic} isLastComment={isLastComment} + resize={this.updateScroll} /> ); -- cgit v1.2.3-1-g7c22