created navigation store

front-ui/app/actions/navigationActions.js

@@ -0,0 +1,18 @@
+var AppDispatcher = require('../dispatcher/appDispatcher');
+var NavigationConstants = require('../constants/navigationConstants');
+
+// Define action methods
+var NavigationActions = {
+
+  // select item
+  goToItemDetails: function(item) {
+    console.log("Going to item details");
+    AppDispatcher.handleAction({
+      actionType: NavigationConstants.CHANGE_URL,
+      url: '/artikal/' + item.get('id') +'/' + item.get('name')
+    });
+  }
+
+};
+
+module.exports = NavigationActions;

front-ui/app/components/items/itemWithDetailsPage.js

@@ -3,15 +3,11 @@ 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 (
@@ -27,9 +23,6 @@ var ItemWithDetailsPage = React.createClass({
         <div> {this.state.item.get('description')}</div>
         </div>
         <ItemMultiMediaDescriptions descriptions={this.state.item.get('multi_media_descriptions')} />
-
-
-
         </div>
         <div className="span4">
         quantitative descriptions
@@ -41,19 +34,7 @@ var ItemWithDetailsPage = React.createClass({
 
     // Add change listeners to stores
     componentDidMount: function() {
-      //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
-          });
-        }
-      }});
+      ItemStore.addChangeListener(this._onChange);
     },
 
     _onChange: function () {
@@ -64,8 +45,7 @@ var ItemWithDetailsPage = React.createClass({
 
     getInitialState: function () {
       return { 
-        //item: ItemStore.getSelectedItem() 
-        item : (new Item())
+        item : ItemStore.getSelectedItem()
       }; 
     }
 

front-ui/app/components/items/singleItem.js

@@ -1,11 +1,11 @@
 var React = require('react');
 var ItemActions = require('../../actions/itemActions');
+var NavigationActions = require('../../actions/navigationActions');
+var NavigationStore = require('../../stores/navigationStore')
 
 var Router = require('react-router');
-var Navigation = Router.Navigation;
 
 var SingleItem = React.createClass({
-  mixins: [Navigation],
     render: function() {
       var self = this;
       var itemClick = this.itemClick;
@@ -21,9 +21,10 @@ var SingleItem = React.createClass({
     },
 
     itemClick: function(e) {
-      // no need for this to go through ItemActions
+      NavigationActions.goToItemDetails(this.props.item);
       ItemActions.selectItem(this.props.item);
-      //this.transitionTo('/artikal/' + this.props.item.get('id') +'/' + this.props.item.get('name'));
+      console.log(this.props.item)
+      
     }
 });
 

front-ui/app/constants/navigationConstants.js

@@ -0,0 +1,6 @@
+var keyMirror = require('react/lib/keyMirror');
+
+// Define action constants
+module.exports = keyMirror({
+  CHANGE_URL: null
+});

front-ui/app/dispatcher/appDispatcher.js

@@ -9,6 +9,8 @@ AppDispatcher.handleAction = function(action) {
     source: 'VIEW_ACTION',
     action: action
   });
+
+  console.log("Dispatching:", action);
 }
 
 module.exports = AppDispatcher;

front-ui/app/stores/itemStore.js

@@ -21,7 +21,7 @@ var loadItemsForFrontpage = function() {
 };
 
 var setSelected  = function(id) {
-  var item = new ItemWithDetails({id: this.itemId });
+  var item = new ItemWithDetails({id: id });
   item.fetch({
     success: function() {            
        _selectedItem = item;
@@ -73,13 +73,7 @@ AppDispatcher.register(function(payload) {
 
     // Respond to SELECT_ITEM action
     case ItemConstants.SELECT_ITEM:
-<<<<<<< HEAD
       setSelected(action.item.id);      
-=======
-      var router = require('../router');
-      // use this instead: action.item.getFrontEndUrl()
-      router.transitionTo('/artikal/' + action.item.get('id') +'/' + action.item.get('name'));
->>>>>>> 8d885694cfe8307d42a9a5201ff5357f57909012
       break;
 
     case ItemConstants.LOAD_FOR_FRONTPAGE:

front-ui/app/stores/navigationStore.js

@@ -0,0 +1,51 @@
+var AppDispatcher = require('../dispatcher/appDispatcher');
+var EventEmitter = require('events').EventEmitter;
+
+var NavigationConstants = require('../constants/navigationConstants')
+var _ = require('underscore');
+
+
+// Extend ItemStore with EventEmitter to add eventing capabilities
+var NavigationStore = _.extend({}, EventEmitter.prototype, {
+
+  // Emit Change event
+  emitChange: function() {
+    console.log("NavigationStore change!");
+    this.emit('change');
+  },
+
+  // Add change listener
+  addChangeListener: function(callback) {
+    this.on('change', callback);
+  },
+
+  // Remove change listener
+  removeChangeListener: function(callback) {
+    this.removeListener('change', callback);
+  }
+
+});
+
+
+// Register callback with AppDispatcher
+AppDispatcher.register(function(payload) {
+  var action = payload.action;
+
+  switch(action.actionType) {
+
+    case NavigationConstants.CHANGE_URL:   
+      var router = require('../router'); 
+      router.transitionTo(action.url);
+      break;
+
+    default:
+      return true;
+  }
+
+  // If action was responded to, emit change event
+  NavigationStore.emitChange();
+  return true;
+
+});
+
+module.exports = NavigationStore;