From 94a18fbdecaa798d67a5bf7ad0f2b8ee4e0c7851 Mon Sep 17 00:00:00 2001 From: François Schmidts Date: Sat, 23 Jan 2016 03:21:41 +0100 Subject: meh, kinda works, sleep now --- src/web/js/actions/MiddlePanelActions.js | 77 ++++++++++++++++++++++-------- src/web/js/components/MiddlePanel.react.js | 2 +- src/web/js/constants/JarrConstants.js | 4 +- src/web/js/stores/MiddlePanelStore.js | 72 +++++++++++++++------------- 4 files changed, 100 insertions(+), 55 deletions(-) (limited to 'src/web/js') diff --git a/src/web/js/actions/MiddlePanelActions.js b/src/web/js/actions/MiddlePanelActions.js index f750c900..159ba91b 100644 --- a/src/web/js/actions/MiddlePanelActions.js +++ b/src/web/js/actions/MiddlePanelActions.js @@ -1,53 +1,92 @@ var JarrDispatcher = require('../dispatcher/JarrDispatcher'); var MiddlePanelActionTypes = require('../constants/JarrConstants').MiddlePanelActionTypes; var jquery = require('jquery'); +var MiddlePanelStore = require('../stores/MiddlePanelStore'); + +var _last_fetched_with = {}; +var shouldFetch = function(filters) { + if(filters.filter != null // undefined means unchanged + && (_last_fetched_with.filter != 'all' + || _last_fetched_with.filter != filters.filter)) { + return true; + } + if(_last_fetched_with.filter_type != null) { + if(_last_fetched_with.filter_type != filters.filter_type) { + return true; + } + if(_last_fetched_with.filter_id != filters.filter_id) { + return true; + } + } + return false; +} +var reloadIfNecessaryAndDispatch = function(dispath_payload) { + if(shouldFetch(dispath_payload)) { + filters = MiddlePanelStore.getRequestFilter(); + for (var key in filters) { + if(dispath_payload[key] != null) { + filters[key] = dispath_payload[key]; + } + } + jquery.getJSON('/middle_panel', dispath_payload, function(payload) { + dispath_payload.articles = payload.articles; + JarrDispatcher.dispatch(dispath_payload); + _last_fetched_with = MiddlePanelStore.getRequestFilter(); + }); + } else { + JarrDispatcher.dispatch(dispath_payload); + } +} var MiddlePanelActions = { reload: function() { - jquery.getJSON('/middle_panel', function(payload) { + filters = MiddlePanelStore.getRequestFilter(); + jquery.getJSON('/middle_panel', filters, function(payload) { + _last_fetched_with = filters; JarrDispatcher.dispatch({ type: MiddlePanelActionTypes.RELOAD_MIDDLE_PANEL, articles: payload.articles, }); }); }, - removeParentFilter: function(parent_type, parent_id) { - JarrDispatcher.dispatch({ + removeParentFilter: function(filter_type, filter_id) { + reloadIfNecessaryAndDispatch({ type: MiddlePanelActionTypes.MIDDLE_PANEL_PARENT_FILTER, - parent_type: null, - parent_id: null, + filter_type: null, + filter_id: null, }); }, setCategoryFilter: function(category_id) { - JarrDispatcher.dispatch({ + reloadIfNecessaryAndDispatch({ type: MiddlePanelActionTypes.MIDDLE_PANEL_PARENT_FILTER, - parent_type: 'category', - parent_id: category_id, + filter_type: 'category', + filter_id: category_id, }); }, setFeedFilter: function(feed_id) { - JarrDispatcher.dispatch({ + reloadIfNecessaryAndDispatch({ type: MiddlePanelActionTypes.MIDDLE_PANEL_PARENT_FILTER, - parent_type: 'feed', - parent_id: feed_id, + filter_type: 'feed', + filter_id: feed_id, }); }, setFilterAll: function() { - JarrDispatcher.dispatch({ - component: 'middle_panel', - type: MiddlePanelActionTypes.MIDDLE_PANEL_FILTER_ALL, + reloadIfNecessaryAndDispatch({ + type: MiddlePanelActionTypes.MIDDLE_PANEL_FILTER, + filter: 'all', }); }, setFilterUnread: function() { - JarrDispatcher.dispatch({ - component: 'middle_panel', - type: MiddlePanelActionTypes.MIDDLE_PANEL_FILTER_UNREAD, + reloadIfNecessaryAndDispatch({ + type: MiddlePanelActionTypes.MIDDLE_PANEL_FILTER, + filter: 'unread', }); }, setFilterLiked: function() { - JarrDispatcher.dispatch({ - type: MiddlePanelActionTypes.MIDDLE_PANEL_FILTER_LIKED, + reloadIfNecessaryAndDispatch({ + type: MiddlePanelActionTypes.MIDDLE_PANEL_FILTER, + filter: 'liked', }); }, }; diff --git a/src/web/js/components/MiddlePanel.react.js b/src/web/js/components/MiddlePanel.react.js index 38f3b1db..f95554b8 100644 --- a/src/web/js/components/MiddlePanel.react.js +++ b/src/web/js/components/MiddlePanel.react.js @@ -20,7 +20,7 @@ var TableLine = React.createClass({ render: function() { var read = this.state.read ? 'r' : ''; var liked = this.state.liked ? 'l' : ''; - var icon = undefined; + var icon = null; if(this.props.icon_url){ icon = (); } else { diff --git a/src/web/js/constants/JarrConstants.js b/src/web/js/constants/JarrConstants.js index a0850283..3d334ee3 100644 --- a/src/web/js/constants/JarrConstants.js +++ b/src/web/js/constants/JarrConstants.js @@ -21,8 +21,6 @@ module.exports = { MiddlePanelActionTypes: keyMirror({ RELOAD_MIDDLE_PANEL: null, MIDDLE_PANEL_PARENT_FILTER: null, - MIDDLE_PANEL_FILTER_ALL: null, - MIDDLE_PANEL_FILTER_UNREAD: null, - MIDDLE_PANEL_FILTER_LIKED: null, + MIDDLE_PANEL_FILTER: null, }), }; diff --git a/src/web/js/stores/MiddlePanelStore.js b/src/web/js/stores/MiddlePanelStore.js index 4e6e04c4..80ac8198 100644 --- a/src/web/js/stores/MiddlePanelStore.js +++ b/src/web/js/stores/MiddlePanelStore.js @@ -7,38 +7,51 @@ var assign = require('object-assign'); var MiddlePanelStore = assign({}, EventEmitter.prototype, { _datas: {filter: 'unread', articles: [], - parent_filter_type: null, parent_filter_id: null}, + filter_type: null, filter_id: null}, getAll: function() { return this._datas; }, + getRequestFilter: function() { + return {'filter': this._datas.filter, + 'filter_type': this._datas.filter_type, + 'filter_id': this._datas.filter_id}; + }, getArticles: function() { - var articles = []; var key = null; var id = null; - if (this._datas.parent_filter_type) { - key = this._datas.parent_filter_type + '_id'; - id = this._datas.parent_filter_id; + var filter = this._datas.filter; + if (this._datas.filter_type) { + key = this._datas.filter_type + '_id'; + id = this._datas.filter_id; } - this._datas.articles.map(function(article) { - if(!key || article[key] == id) { - articles.push(article); - } + return this._datas.articles.filter(function(article) { + return ((!key || article[key] == id) + && (filter == 'all' + || (filter == 'unread' && !article.read) + || (filter == 'liked' && article.liked))); }); - return articles; + }, + setArticles: function(articles) { + if(articles || articles == []) { + this._datas.articles = articles; + return true; + } + return false; }, setFilter: function(value) { if(this._datas.filter != value) { this._datas.filter = value; - this.emitChange(); + return true; } + return false; }, setParentFilter: function(type, value) { - if(this._datas['parent_filter_id'] != value - || this._datas['parent_filter_type'] != type) { - this._datas['parent_filter_type'] = type; - this._datas['parent_filter_id'] = value; - this.emitChange(); + if(this._datas.filter_id != value || this._datas.filter_type != type) { + this._datas.filter_type = type; + this._datas.filter_id = value; + return true; } + return false; }, emitChange: function() { this.emit(CHANGE_EVENT); @@ -53,30 +66,25 @@ var MiddlePanelStore = assign({}, EventEmitter.prototype, { MiddlePanelStore.dispatchToken = JarrDispatcher.register(function(action) { + var changed = false; switch(action.type) { case MiddlePanelActionTypes.RELOAD_MIDDLE_PANEL: - MiddlePanelStore._datas['articles'] = action.articles; + MiddlePanelStore.setArticles(action.articles); MiddlePanelStore.emitChange(); break; - // PARENT FILTER case MiddlePanelActionTypes.MIDDLE_PANEL_PARENT_FILTER: - MiddlePanelStore.setParentFilter(action.parent_type, - action.parent_id); - break; - // FILTER - case MiddlePanelActionTypes.MIDDLE_PANEL_FILTER_ALL: - MiddlePanelStore.setFilter('all'); + changed = MiddlePanelStore.setParentFilter(action.filter_type, + action.filter_id); + changed = MiddlePanelStore.setArticles(action.articles) || changed; + if(changed) {MiddlePanelStore.emitChange();} break; - case MiddlePanelActionTypes.MIDDLE_PANEL_FILTER_UNREAD: - MiddlePanelStore.setFilter('unread'); + case MiddlePanelActionTypes.MIDDLE_PANEL_FILTER: + changed = MiddlePanelStore.setFilter(action.filter); + changed = MiddlePanelStore.setArticles(action.articles) || changed; + if(changed) {MiddlePanelStore.emitChange();} break; - case MiddlePanelActionTypes.MIDDLE_PANEL_FILTER_LIKED: - MiddlePanelStore.setFilter('liked'); - break; - - default: - // do nothing + // pass } }); -- cgit