reorganized stuff

front-ui/app/app.js

@@ -1,12 +1,9 @@
-
 var App = function() {
     this.bootstrap = function() {
         // here goes all app initialization and bootstraping logic
-        //this.router = new Router();
+        // nothing at the moment
-        //Backbone.history.start();
     };
 };
 
-
 var app = new App();
 module.exports = app; 

front-ui/app/components/browsing/byCategory.js

@@ -0,0 +1,13 @@
+var React = require('react');
+
+var ByCategory = React.createClass({
+    render: function() {
+        return (
+            <div>
+            <h3> Browse products by category</h3>
+            </div>
+            );
+    }
+});
+
+module.exports = ByCategory;

front-ui/app/components/browsing/bySection.js

@@ -0,0 +1,19 @@
+var React = require('react'),
+    Router = require('react-router');
+
+var BySection = React.createClass({
+    mixins: [Router.State],
+    render : function() {
+        return ( <div>
+
+            <div className='col-md-2'> 
+                Here goes section for refining search, by section
+            </div>
+            <div className='col-md-10'>
+                <h2> Welcome to section {this.getParams().id} </h2>
+            </div>
+            </div> )
+    }
+});
+
+module.exports = BySection;

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

@@ -0,0 +1,13 @@
+var React = require('react')
+    ItemWithDetailsPage = require('../itemWithDetailsPage');
+var ItemPage = React.createClass({
+    render: function() {
+        return (
+            <div>
+              <ItemWithDetailsPage />
+            </div>
+            );
+    }
+});
+
+module.exports = ItemPage;

front-ui/app/components/rootApp.js

@@ -0,0 +1,34 @@
+var React = require('react'),
+    SectionsListComponent = require('./sectionsListComponent'),
+    Router = require('react-router'),
+    RouteHandler = Router.RouteHandler;
+
+var RootApp = React.createClass({
+
+    render: function() {
+
+        return (
+
+<div className="container">
+
+<div  className='page-header'>
+    <h1><a href="#">Ribica.ba</a></h1>
+</div>
+<div className='row'>
+    <div className='col-md-12' id='header'>
+    <SectionsListComponent />
+    </div>
+</div>
+<div className='row'>
+
+<RouteHandler />
+
+</div>
+
+</div>
+            
+            );
+    }
+});
+
+module.exports = RootApp;

front-ui/app/components/sectionsListComponent.js

@@ -29,7 +29,7 @@ var SectionsListComponent = React.createClass({
         }.bind(this)});
     },
     onMouseOver: function(section) {
-        console.log('mouse over!', section);
+        //console.log('mouse over!', section);
         
         this.setState({
             hoveredSection: section.get('id')

front-ui/app/components/startPage/startPage.js

@@ -0,0 +1,24 @@
+var React = require('react'),
+    Router = require('react-router'),
+    RouteHandler = Router.RouteHandler,
+    AllItems = require('../allItems');
+
+var StartPage = React.createClass({
+    render : function() {
+        return (
+            <div>
+
+            <div className='col-md-2'> 
+                left content
+            </div>
+            <div className='col-md-10'>
+                <h2>Ribica Start Page</h2>
+                <AllItems />
+                <RouteHandler />
+            </div>
+            </div>
+            )
+    }
+});
+
+module.exports = StartPage;

front-ui/app/controllers/itemDetailsController.js

@@ -1,12 +0,0 @@
-var StartPageSectionsView = require('../views/startPageSectionsView'),
-    ItemDetailsView = require('../views/itemDetailsView');
-
-function ItemDetailsController(id) {
-	var sectionsView = new StartPageSectionsView();
-    sectionsView.render();     
-
-    var itemDetailsView = new ItemDetailsView(id);
-    itemDetailsView.render(); 
-}
-
-module.exports = ItemDetailsController;

front-ui/app/rapp.js

@@ -1,110 +1,31 @@
 var React = require('react');
-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 ItemWithDetailsPage = require('./components/itemWithDetailsPage');
+var ItemList = require('./components/itemList');
 var SectionsListComponent = require('./components/sectionsListComponent');
-
 var AllItems = require('./components/allItems');
+var RootApp = require('./components/rootApp');
+var StartPage = require('./components/startPage/startPage');
+var ByCategory = require('./components/browsing/byCategory');
+var BySection = require('./components/browsing/bySection');
 
-var RApp = React.createClass({
+var ItemPage = require('./components/items/itemPage');
 
-    render: function() {
-
-        return (
-
-<div className="container">
-
-<div  className='page-header'>
-    <h1><a href="#">Ribica.ba</a></h1>
-</div>
-<div className='row'>
-    <div className='col-md-12' id='header'>
-    <SectionsListComponent />
-    </div>
-</div>
-<div className='row'>
-
-<RouteHandler />
-
-</div>
-
-</div>
-            
-            );
-    }
-});
-
-var StartPage = React.createClass({
-    render : function() {
-        return (
-            <div>
-
-            <div className='col-md-2'> 
-                left content
-            </div>
-            <div className='col-md-10'>
-                <h2>Ribica Start Page</h2>
-                <AllItems />
-                <RouteHandler />
-            </div>
-            </div>
-            )
-    }
-});
-
-var ByCat = React.createClass({
-    render: function() {
-        return (
-            <div>By CAtegoriy stuff</div>
-            );
-    }
-    
-});
-
-var BySection = React.createClass({
-    mixins: [Router.State],
-    render : function() {
-        return ( <div>
-
-            <div className='col-md-2'> 
-                Here goes section for refining search, by section
-            </div>
-            <div className='col-md-10'>
-                <h2> Welcome to section {this.getParams().id} </h2>
-            </div>
-            </div> )
-    }
-});
-
-
-var Artikal = React.createClass({
-    render: function() {
-        return (
-            <div>
-            
-            
-            <ItemWithDetailsPage />
-            </div>
-            );
-    }
-});
 
 var routes = (
-        <Route name='app' path='/' handler={RApp}>
+        <Route name='app' path='/' handler={RootApp}>
             
 
             <Route name='sekcija' path='sekcija/:id/:name' handler={BySection}>
           </Route>
-          <Route name='artikal' path="artikal/:id/*" handler={Artikal} />
+          <Route name='artikal' path="artikal/:id/*" handler={ItemPage} />
 
-          <Route name='byCat' path="sekcija/:sekcijaName/kategorija/:id/*" handler={ByCat} />
+          <Route name='byCat' path="sekcija/:sekcijaName/kategorija/:id/*" handler={ByCategory} />
             <DefaultRoute handler={StartPage}/>
             
         </Route>