started to work on filters on the frontend

front-api/controllers/category.rb

@@ -1,10 +1,11 @@
 
 
 get '/category' do 
-  Category.order(:name).all.to_json(include: :sub_categories)
+  Category.order(:name).all.to_json(:include => [:sub_categories, :filter_criterias =>{:include => :filter_criteria_values} ])
+
 end
 
 get '/category/:id' do 
   id = params[:id].to_i
-  Category.find(id).to_json(include: :sub_categories)
-end
+  Category.find(id).to_json(:include => [:sub_categories, :filter_criterias =>{:include => :filter_criteria_values} ])
+end

front-ui/app/actions/navigationActions.js

@@ -21,11 +21,21 @@ var NavigationActions = {
     });
   },
 
-  goToCategory: function(category,section) {
+  goToCategory: function(category,section, query) {
   console.log("Going to item details");
+  var url ='/sekcija/' + section.get('name') +'/kategorija/'+ category.id + '/' + category.name;
+
+  var q = '?';
+  if(query) {
+    for(var key in query) {
+      if (query.hasOwnProperty(key)) {
+        q += "&" + key + '=' + query[key];
+      }
+    }
+  }
     AppDispatcher.handleAction({
       actionType: NavigationConstants.CHANGE_URL,
-      url: '/sekcija/' + section.get('name') +'/kategorija/'+ category.id + '/' + category.name
+      url: (url + q)
     });
   },
 
@@ -40,4 +50,4 @@ var NavigationActions = {
 
 };
 
-module.exports = NavigationActions;
+module.exports = NavigationActions;

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

@@ -1,6 +1,7 @@
 var React = require('react'),
     Router = require('react-router'),
     Category = require('../../models/category'),
+    Section = require('../../models/section'),
     ItemCollection = require('../../models/itemCollection'),
     ItemActions = require('../../actions/itemActions.js'),
     CategoryActions = require('../../actions/categoryActions.js'),
@@ -20,17 +21,49 @@ var ByCategory = React.createClass({
     items: items
     };
   },
+    onFCClick: function(fc, fcv) {
+
+      alert(fc.field_name);
+      var q = {};
+      q[fc.field_name] = fcv.filter_value;
+      // TODO: fix this, clean this up
+      var s = new Section({name: 'meho'});
+var c = this.state.category;
+      NavigationActions.goToCategory({id: c.get('id'), name: c.get('name')}, s, q)
+    },
     render: function() {
+      var self = this;
       return (
         <div>
 <div className='col-md-2'> 
-        Here goes section for refining search, by section
+<div className='h4'>{this.state.category.get('name')}</div>
+<div>Podkategorije</div>
+        <ul>
+        {(this.state.category.get('sub_categories') || []).map(function(sc) {
+          return (<li> <a>{sc.name}</a></li>)
+                                                             })}
+        </ul>
+
+        {this.state.category.get('filter_criterias').map(function(fc) {
+          return (<div>
+            
+        <div className='h4'>{fc.title}</div>
+        <ul>
+        {fc.filter_criteria_values.map(function(fcv) {
+          return (<li>
+              <a onClick={self.onFCClick.bind(self,fc, fcv)}>{fcv.filter_text}</a>
+            </li>)
+                                                     })}
+        </ul>
+            </div>)
+                                                                      })}
         </div>
 
         <div className='col-md-10'>
         
         <h3> Browse products by category  : {this.state.category.get('name')}</h3>
         Number of items in this category: {this.state.items.length}
+        <div>need to filter brand: {this.getQuery().brand}</div>
         <ItemList items={this.state.items} />
         </div>
         </div>

front-ui/app/models/category.js

@@ -4,7 +4,9 @@ var Globals = require('../globals');
 var Category = Backbone.Model.extend({
     urlRoot : Globals.ApiUrl + '/category',
     defaults : {
-        name: ''
+        name: '',
+        filter_criterias: [],
+        sub_categories: []
     }
 });