refactoring working, will need to reorganize stuff a little bit

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; 

front-ui/app/components/itemMultiMediaDescriptions.js

@@ -7,13 +7,17 @@ var ItemMultimediaDescriptions = React.createClass({
         var self = this;      
 
         return (    
-               <div>Multimedia Description!</div>
+               <div>Multimedia Description!
+                {(this.props.descriptions || []).map(function(des) {
+                return (<img src={des.url} />)
+                                                          })}
+                             </div>
         );
-    },
+    }
 
-    getInitialState: function () {
-			return { descriptions: this.props.descriptions }; 
-	}
+    //getInitialState: function () {
+			//return { descriptions: [] }; 
+	//}
 });
 
 

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 (
-            <div className="item-with-details row-fluid center">
+
+
+ <div className="item-with-details row-fluid center">
             <div className="span3">
-                <ItemMultiMediaDescriptions descriptions={this.state.item.get('multi_media_descriptions')} />
-            </div>
+            
+           <h3> {this.state.item.get('name')} </h3>
+           <div>
+
+             <div className='h4'> {this.state.item.get('list_price')} KM</div>
+             <div> {this.state.item.get('description')}</div>
+           </div>
+<ItemMultiMediaDescriptions descriptions={this.state.item.get('multi_media_descriptions')} />
+
+
+
+                            </div>
             <div className="span4">
                quantitative descriptions
             </div>
             </div>
-            
         ) ;       
 
     },
 
      // 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())
+      }; 
     }
 
 });

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'));
     }
 });