From 769230eda15ad04fb8ebc70c3436122e3de64225 Mon Sep 17 00:00:00 2001 From: Edin Dazdarevic Date: Sun, 25 Jan 2015 12:52:31 +0100 Subject: [PATCH] refactoring working, will need to reorganize stuff a little bit --- front-ui/app/app.js | 6 +-- front-ui/app/components/allItems.js | 7 +-- .../components/itemMultiMediaDescriptions.js | 14 +++--- .../app/components/itemWithDetailsPage.js | 44 ++++++++++++++++--- front-ui/app/components/singleItem.js | 10 +++-- front-ui/app/controllers/homeController.js | 13 ------ front-ui/app/rapp.js | 25 +++++++++-- front-ui/app/router.js | 16 ------- front-ui/app/stores/itemStore.js | 12 ++--- front-ui/app/views/itemDetailsView.js | 22 ---------- front-ui/app/views/startPageItemsView.js | 21 --------- front-ui/app/views/startPageSectionsView.js | 35 --------------- 12 files changed, 83 insertions(+), 142 deletions(-) delete mode 100644 front-ui/app/controllers/homeController.js delete mode 100644 front-ui/app/router.js delete mode 100644 front-ui/app/views/itemDetailsView.js delete mode 100644 front-ui/app/views/startPageItemsView.js delete mode 100644 front-ui/app/views/startPageSectionsView.js diff --git a/front-ui/app/app.js b/front-ui/app/app.js index f7fc069..f07665b 100644 --- a/front-ui/app/app.js +++ b/front-ui/app/app.js @@ -1,11 +1,9 @@ -var Router = require('./router'), - Backbone = require('backbone'); var App = function() { this.bootstrap = function() { // here goes all app initialization and bootstraping logic - this.router = new Router(); - Backbone.history.start(); + //this.router = new Router(); + //Backbone.history.start(); }; }; diff --git a/front-ui/app/components/allItems.js b/front-ui/app/components/allItems.js index 736fcc2..38565a8 100644 --- a/front-ui/app/components/allItems.js +++ b/front-ui/app/components/allItems.js @@ -4,7 +4,6 @@ var ItemStore = require('../stores/itemStore.js'); var ItemActions = require('../actions/itemActions.js'); var ItemCollection = require('../models/itemCollection'); - var AllItems = React.createClass({ render: function() { @@ -20,10 +19,10 @@ var AllItems = React.createClass({ } }, - // Add change listeners to stores componentDidMount: function() { + ItemActions.loadFrontPageItems(); ItemStore.addChangeListener(this._onChange); }, @@ -34,10 +33,6 @@ var AllItems = React.createClass({ }); } }, - - - - }); module.exports = AllItems; diff --git a/front-ui/app/components/itemMultiMediaDescriptions.js b/front-ui/app/components/itemMultiMediaDescriptions.js index bd7d4c5..1f4fb12 100644 --- a/front-ui/app/components/itemMultiMediaDescriptions.js +++ b/front-ui/app/components/itemMultiMediaDescriptions.js @@ -7,13 +7,17 @@ var ItemMultimediaDescriptions = React.createClass({ var self = this; return ( -
Multimedia Description!
+
Multimedia Description! + {(this.props.descriptions || []).map(function(des) { + return () + })} +
); - }, + } - getInitialState: function () { - return { descriptions: this.props.descriptions }; - } + //getInitialState: function () { + //return { descriptions: [] }; + //} }); diff --git a/front-ui/app/components/itemWithDetailsPage.js b/front-ui/app/components/itemWithDetailsPage.js index 9db5c35..0c8fe41 100644 --- a/front-ui/app/components/itemWithDetailsPage.js +++ b/front-ui/app/components/itemWithDetailsPage.js @@ -3,30 +3,57 @@ var React = require('react'), ItemActions = require('../actions/itemActions'), ItemStore = require('../stores/itemStore'); +var Item = require('../models/item'); + +var Router = require('react-router'); +var Navigation = Router.Navigation; var ItemWithDetailsPage = React.createClass({ + mixins : [Router.State], render: function() { return ( -
+ + +
- -
+ +

{this.state.item.get('name')}

+
+ +
{this.state.item.get('list_price')} KM
+
{this.state.item.get('description')}
+
+ + + + +
quantitative descriptions
- ) ; }, // Add change listeners to stores componentDidMount: function() { - ItemStore.addChangeListener(this._onChange); - ItemActions.loadFrontPageItems(); + //ItemStore.addChangeListener(this._onChange); + //ItemActions.loadFrontPageItems(); + + var self = this; + var item = new Item({ id: self.getParams().id }); + item.fetch({success: function() { + if (self.isMounted()) { + console.log('article loaded', item); + self.setState({ + item : item + }); + } + }}); }, _onChange: function () { @@ -36,7 +63,10 @@ var ItemWithDetailsPage = React.createClass({ }, getInitialState: function () { - return { item: ItemStore.getSelectedItem() }; + return { + //item: ItemStore.getSelectedItem() + item : (new Item()) + }; } }); diff --git a/front-ui/app/components/singleItem.js b/front-ui/app/components/singleItem.js index a573fe3..2cfba7c 100644 --- a/front-ui/app/components/singleItem.js +++ b/front-ui/app/components/singleItem.js @@ -1,12 +1,12 @@ var React = require('react'); var ItemActions = require('../actions/itemActions'); +var Router = require('react-router'); +var Navigation = Router.Navigation; var SingleItem = React.createClass({ - - - + mixins: [Navigation], render: function() { var self = this; var itemClick = this.itemClick; @@ -22,7 +22,9 @@ var SingleItem = React.createClass({ }, itemClick: function(e) { - ItemActions.selectItem(this.props.item); + // no need for this to go through ItemActions + //ItemActions.selectItem(this.props.item); + this.transitionTo('/artikal/' + this.props.item.get('id') +'/' + this.props.item.get('name')); } }); diff --git a/front-ui/app/controllers/homeController.js b/front-ui/app/controllers/homeController.js deleted file mode 100644 index b6bed7f..0000000 --- a/front-ui/app/controllers/homeController.js +++ /dev/null @@ -1,13 +0,0 @@ -var StartPageSectionsView = require('../views/startPageSectionsView'), - StartPageItemsView = require('../views/startPageItemsView'); - -function HomeController() { - console.log('HomeController'); - var sectionsView = new StartPageSectionsView(); - sectionsView.render(); - - var itemsView = new StartPageItemsView(); - itemsView.render(); -} - -module.exports = HomeController; diff --git a/front-ui/app/rapp.js b/front-ui/app/rapp.js index 0fe471c..3e14692 100644 --- a/front-ui/app/rapp.js +++ b/front-ui/app/rapp.js @@ -3,12 +3,16 @@ var ItemList = require('./components/itemList'); var Router = require('react-router'), Route = Router.Route, DefaultRoute = Router.DefaultRoute; +var ItemWithDetailsPage = require('./components/itemWithDetailsPage'); + var RouteHandler = Router.RouteHandler; var Navigation = Router.Navigation; var SectionsListComponent = require('./components/sectionsListComponent'); +var AllItems = require('./components/allItems'); + var RApp = React.createClass({ render: function() { @@ -18,7 +22,7 @@ var RApp = React.createClass({
-

Ribica.ba

+

Ribica.ba

Ribica Start Page

+
@@ -69,7 +74,7 @@ var BySection = React.createClass({ return (
- left content + Here goes section for refining search, by section

Welcome to section {this.getParams().id}

@@ -78,13 +83,27 @@ var BySection = React.createClass({ } }); + +var Artikal = React.createClass({ + render: function() { + return ( +
+ + + +
+ ); + } +}); + var routes = ( - + + diff --git a/front-ui/app/router.js b/front-ui/app/router.js deleted file mode 100644 index 12234a1..0000000 --- a/front-ui/app/router.js +++ /dev/null @@ -1,16 +0,0 @@ -var Backbone = require('backbone'), - HomeController = require('./controllers/homeController'); - ItemDetailsController = require('./controllers/itemDetailsController'); - -var Router = Backbone.Router.extend({ -/* routes : {*/ - //"home" : HomeController, - //"artikal/:id/:slug": ItemDetailsController, - //"*default": HomeController - /*}*/ - -}); - -//Backbone.history.start(); - -module.exports = Router; diff --git a/front-ui/app/stores/itemStore.js b/front-ui/app/stores/itemStore.js index 4f3ee03..512ab62 100644 --- a/front-ui/app/stores/itemStore.js +++ b/front-ui/app/stores/itemStore.js @@ -71,12 +71,12 @@ AppDispatcher.register(function(payload) { switch(action.actionType) { // Respond to SELECT_ITEM action - case ItemConstants.SELECT_ITEM: - setSelected(action.item.id); - // TODO: this does not belong here - update when react router becommes available - RIBICA.App.router.navigate(action.item.getFrontEndUrl(), {'trigger': true}); + /* case ItemConstants.SELECT_ITEM:*/ + //setSelected(action.item.id); + //// TODO: this does not belong here - update when react router becommes available + //RIBICA.App.router.navigate(action.item.getFrontEndUrl(), {'trigger': true}); - break; + /*break;*/ case ItemConstants.LOAD_FOR_FRONTPAGE: loadItemsForFrontpage(); @@ -92,4 +92,4 @@ AppDispatcher.register(function(payload) { }); -module.exports = ItemStore; \ No newline at end of file +module.exports = ItemStore; diff --git a/front-ui/app/views/itemDetailsView.js b/front-ui/app/views/itemDetailsView.js deleted file mode 100644 index 6490b49..0000000 --- a/front-ui/app/views/itemDetailsView.js +++ /dev/null @@ -1,22 +0,0 @@ -var Backbone = require('backbone'), - React = require('react'), - ItemWithDetailsPage = require('../components/itemWithDetailsPage'); - -var ItemDetailsView = Backbone.View.extend({ - el: '#content', - template: '
', - initialize: function(id) { - this.itemId = id; - }, - - render: function() { - var self = this; - this.$el.html(this.template); - - React.render(, self.$('.item-details-container').get(0)); - - return this; - } -}); - -module.exports = ItemDetailsView; diff --git a/front-ui/app/views/startPageItemsView.js b/front-ui/app/views/startPageItemsView.js deleted file mode 100644 index b5f6da9..0000000 --- a/front-ui/app/views/startPageItemsView.js +++ /dev/null @@ -1,21 +0,0 @@ -var Backbone = require('backbone'), - React = require('react'), - AllItems = require('../components/allItems'), - ItemActions = require('../actions/itemActions'); - -var StartPageItemsView = Backbone.View.extend({ - el: '#content', - template: '
', - initialize: function() { - //alert('StartPageItemsView init'); - }, - render: function() { - this.$el.html(this.template); - ItemActions.loadFrontPageItems(); - React.render(, self.$('.item-list-container').get(0)); - return this; - } - -}); - -module.exports = StartPageItemsView; diff --git a/front-ui/app/views/startPageSectionsView.js b/front-ui/app/views/startPageSectionsView.js deleted file mode 100644 index 6698155..0000000 --- a/front-ui/app/views/startPageSectionsView.js +++ /dev/null @@ -1,35 +0,0 @@ -var Backbone = require('backbone'), - React = require('react'), - SectionsViewComponent = require('../components/sectionsListComponent'), - SectionCollection = require('../models/sectionCollection'), - Section = require('../models/section'); - -var StartPageSectionsView = Backbone.View.extend({ - el: '#header', - template: '
', - initialize: function() { - //alert('StartPageSectionsView init'); - }, - render: function() { - this.$el.append(this.template); - - var sections = new SectionCollection(); - var self = this; - sections.fetch({success: function() { - - console.log(sections); - React.render(new SectionsViewComponent({ - handleClick: self.clickHandler.bind(self), - sections: sections - }), - self.$('.section-list-container').get(0)); - - }}); - return this; - }, - clickHandler : function() { - alert('the item was clicked!'); - } -}); - -module.exports = StartPageSectionsView;