From f0dd6d526160fdb98a5f55b4e45b84652590df58 Mon Sep 17 00:00:00 2001 From: François Schmidts Date: Mon, 25 Jan 2016 12:40:23 +0100 Subject: bootstraping right panel --- src/web/js/actions/RightPanelActions.js | 20 +++++++++ src/web/js/components/MainApp.react.js | 5 +++ src/web/js/components/RightPanel.react.js | 71 +++++++++++++++++++++++++++++++ src/web/js/constants/JarrConstants.js | 3 ++ src/web/js/stores/RightPanelStore.js | 33 ++++++++++++++ 5 files changed, 132 insertions(+) create mode 100644 src/web/js/actions/RightPanelActions.js create mode 100644 src/web/js/components/RightPanel.react.js create mode 100644 src/web/js/stores/RightPanelStore.js (limited to 'src/web/js') diff --git a/src/web/js/actions/RightPanelActions.js b/src/web/js/actions/RightPanelActions.js new file mode 100644 index 00000000..3cd549e5 --- /dev/null +++ b/src/web/js/actions/RightPanelActions.js @@ -0,0 +1,20 @@ +var JarrDispatcher = require('../dispatcher/JarrDispatcher'); +var RightActionTypes = require('../constants/JarrConstants').RightPanelActionTypes; +var jquery = require('jquery'); +var RightPanelStore = require('../stores/RightPanelStore'); + + +var RightPanelActions = { + load: function(obj_type, obj_id) { + filters = MiddlePanelStore.getRequestFilter(); + jquery.getJSON('api/v2.0/' + obj_type + '/' + obj_id, function(payload) { + _last_fetched_with = filters; + JarrDispatcher.dispatch({ + type: RightPanelActionTypes.LOAD_RIGHT_PANEL, + articles: payload.articles, + }); + }); + }, +}; + +module.exports = RightPanelActions; diff --git a/src/web/js/components/MainApp.react.js b/src/web/js/components/MainApp.react.js index 059d2646..bd643be1 100644 --- a/src/web/js/components/MainApp.react.js +++ b/src/web/js/components/MainApp.react.js @@ -4,6 +4,7 @@ var Grid = require('react-bootstrap/lib/Grid'); var Menu = require('./Menu.react'); var MiddlePanel = require('./MiddlePanel.react'); +var RightPanel = require('./RightPanel.react'); var MainApp = React.createClass({ @@ -17,6 +18,10 @@ var MainApp = React.createClass({ + + + + ); }, diff --git a/src/web/js/components/RightPanel.react.js b/src/web/js/components/RightPanel.react.js new file mode 100644 index 00000000..422b8e5b --- /dev/null +++ b/src/web/js/components/RightPanel.react.js @@ -0,0 +1,71 @@ +var React = require('react'); + +var RightPanelStore = require('../stores/RightPanelStore'); +var RightPanelActions = require('../actions/RightPanelActions'); + + +var Article = React.createClass({ + + render: function() { + return (
); + }, +}); + + +var Feed = React.createClass({ + render: function() { + return (
); + }, +}); + + +var Category = React.createClass({ + render: function() { + return (
); + }, +}); + + +var RightPanelMenu = React.createClass({ + getInitialState: function() { + return {}; + }, + render: function() { + return (
); + }, + componentDidMount: function() { + RightPanelStore.addChangeListener(this._onChange); + }, + componentWillUnmount: function() { + RightPanelStore.removeChangeListener(this._onChange); + }, + _onChange: function() { + }, +}); + +var RightPanel = React.createClass({ + getInitialState: function() { + return {obj_type: null, obj_id: null}; + }, + render: function() { + if (this.state.obj_type == 'article') { + return
; + } else if (this.state.obj_type == 'feed') { + return ; + } else if (this.state.obj_type == 'category') { + return ; + } + return
; + }, + componentDidMount: function() { + RightPanelActions.reload(); + RightPanelStore.addChangeListener(this._onChange); + }, + componentWillUnmount: function() { + RightPanelStore.removeChangeListener(this._onChange); + }, + _onChange: function() { + }, +}); + +module.exports = {RightPanelMenu: RightPanelMenu, RightPanel: RightPanel}; diff --git a/src/web/js/constants/JarrConstants.js b/src/web/js/constants/JarrConstants.js index d00f24a8..c7b419e4 100644 --- a/src/web/js/constants/JarrConstants.js +++ b/src/web/js/constants/JarrConstants.js @@ -23,4 +23,7 @@ module.exports = { MIDDLE_PANEL_FILTER: null, CHANGE_ATTR: null, }), + RightPanelActionTypes: keyMirror({ + LOAD_RIGHT_PANEL: null, + }), }; diff --git a/src/web/js/stores/RightPanelStore.js b/src/web/js/stores/RightPanelStore.js new file mode 100644 index 00000000..0bca9f54 --- /dev/null +++ b/src/web/js/stores/RightPanelStore.js @@ -0,0 +1,33 @@ +var JarrDispatcher = require('../dispatcher/JarrDispatcher'); +var RightPanelActionTypes = require('../constants/JarrConstants').RightPanelActionTypes; +var MenuActionTypes = require('../constants/JarrConstants').MenuActionTypes; +var EventEmitter = require('events').EventEmitter; +var CHANGE_EVENT = 'change_middle_panel'; +var assign = require('object-assign'); + + +var RightPanelStore = assign({}, EventEmitter.prototype, { + _datas: {}, + getAll: function() { + return this._datas; + }, + emitChange: function() { + this.emit(CHANGE_EVENT); + }, + addChangeListener: function(callback) { + this.on(CHANGE_EVENT, callback); + }, + removeChangeListener: function(callback) { + this.removeListener(CHANGE_EVENT, callback); + }, +}); + + +RightPanelStore.dispatchToken = JarrDispatcher.register(function(action) { + switch(action.type) { + default: + // pass + } +}); + +module.exports = RightPanelStore; -- cgit