Merge branch 'master' of github.com:senaduka/ribica

front-ui/app/components/account/login.js

@@ -52,8 +52,11 @@ var Login = React.createClass({
     renderErrorMessage: function(message){
         return (<div className='error-message'>{message}</div>)
     },
-    doLogin: function(e) {
-        
+    onLoginClick: function(e) {
+        this.doLogin();
+        e.preventDefault();
+    },
+    doLogin: function() {
         if(this.validate()) {
             var loginInfo = new LoginModel({
                 email: this.state.email,
@@ -61,10 +64,8 @@ var Login = React.createClass({
             });
 
             UserActions.userLogin(loginInfo);
-         
-        }
 
-        e.preventDefault();
+        }
     },
     renderLoginFailure: function() {
 
@@ -75,6 +76,12 @@ var Login = React.createClass({
 
         return (<div></div>)
     },
+    onKeyPress: function(e) {
+     var enterKeyCode = 13;
+        if(e.which == enterKeyCode) {
+            this.doLogin();
+        }
+    },
     render : function() {
         return (<div>
                 <div className="col-md-6">
@@ -86,18 +93,18 @@ var Login = React.createClass({
 
                 <div className="form-group">
                 <label for="email">Email adresa</label>
-                <input type="email" onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Unesite email"></input>
+                <input type="email" onKeyPress={this.onKeyPress} onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Unesite email"></input>
 
                 {this.getValidationMessages('email').map(this.renderErrorMessage)}
                 </div>
                 <div className="form-group">
                 <label for="password">Šifra</label>
-                <input type="password" onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"></input>
+                <input type="password" onKeyPress={this.onKeyPress} onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"></input>
 
                 {this.getValidationMessages('password').map(this.renderErrorMessage)}
                 </div>
                 <div className="form-group">
-                <button type="button" onClick={this.doLogin} className="btn btn-success">Prijava</button>
+                <button type="button" onClick={this.onLoginClick} className="btn btn-success">Prijava</button>
                 </div>
                 </form>
                 </div>

front-ui/app/components/account/register.js

@@ -32,6 +32,12 @@ var Register = React.createClass({
       myBabyOnTheWay: (e.currentTarget.value === "1" ? true: false)
     });
   },
+  onKeyPress: function(e) {
+      var enterKeyCode = 13;
+      if(e.which == enterKeyCode) {
+          this.doRegister();
+      }
+  },
   renderMonthSelector: function() {
     var months = ['Januar', 'Februar', 'Mart', 'April', 'Maj', 'Juni',
     'Juli','August','Septembar', 'Oktobar','Novembar','Decembar'];
@@ -194,7 +200,11 @@ var Register = React.createClass({
           loginState : UserStore.getLoginState()
       });
   },
-  register: function(e) {
+  onRegisterClick: function(e) {
+    this.doRegister();
+    e.preventDefault();
+  },
+  doRegister: function() {
     if(this.validate()) {
       var children = [];
       if (this.state.myBabyDetailsVisible) {
@@ -231,8 +241,6 @@ var Register = React.createClass({
 
       UserActions.registerUser(user);
     }
-
-    e.preventDefault();
   },
   successContinue: function(e) {
     NavigationActions.goToHome();
@@ -284,7 +292,7 @@ var Register = React.createClass({
         <div className="form-group">
             <label for="firstName" className="col-md-4 control-label">Ime</label>
             <div className="col-md-4">
-              <input type="text" onChange={this.handleChange('firstName')} className="form-control" id="firstName" placeholder="Ime"/>
+              <input type="text" onKeyPress={this.onKeyPress} onChange={this.handleChange('firstName')} className="form-control" id="firstName" placeholder="Ime"/>
               {this.getValidationMessages('firstName').map(this.renderErrorMessage)}
             </div>
         </div>
@@ -292,28 +300,28 @@ var Register = React.createClass({
         <div className="form-group">
             <label for="lastName" className="col-md-4 control-label">Prezime</label>
             <div className="col-md-4">
-              <input type="text" onChange={this.handleChange('lastName')} className="form-control" id="lastName" placeholder="Prezime"/>
+              <input type="text" onKeyPress={this.onKeyPress} onChange={this.handleChange('lastName')} className="form-control" id="lastName" placeholder="Prezime"/>
               {this.getValidationMessages('lastName').map(this.renderErrorMessage)}
             </div>
         </div>
         <div className="form-group">
             <label for="email" className="col-md-4 control-label">Email</label>
             <div className="col-md-4">
-              <input type="text" onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Email Adresa"/>
+              <input type="text" onKeyPress={this.onKeyPress} onChange={this.handleChange('email')} className="form-control" id="email" placeholder="Email Adresa"/>
               {this.getValidationMessages('email').map(this.renderErrorMessage)}
             </div>
         </div>
         <div className="form-group">
             <label for="password" className="col-md-4 control-label">Šifra</label>
             <div className="col-md-4">
-              <input type="password"  onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"/>
+              <input type="password" onKeyPress={this.onKeyPress} onChange={this.handleChange('password')} className="form-control" id="password" placeholder="Šifra"/>
               {this.getValidationMessages('password').map(this.renderErrorMessage)}
             </div>
         </div>
         <div className="form-group">
             <label for="password_confirmation" className="col-md-4 control-label">Potvrda šifre</label>
             <div className="col-md-4">
-              <input type="password" onChange={this.handleChange('passwordConfirmation')} className="form-control" id="password_confirmation" placeholder="Podvrda šifre"/>
+              <input type="password"  onKeyPress={this.onKeyPress} onChange={this.handleChange('passwordConfirmation')} className="form-control" id="password_confirmation" placeholder="Podvrda šifre"/>
 
 
               {this.getValidationMessages('passwordConfirmation').map(this.renderErrorMessage)}
@@ -335,7 +343,7 @@ var Register = React.createClass({
 
             </div>
             <div className="col-md-4">
-            <button onClick={this.register} type="button" className="btn btn-success btn-lg">
+            <button onClick={this.onRegisterClick} type="button" className="btn btn-success btn-lg">
             Registruj me
             </button>
             </div>

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

@@ -29,6 +29,7 @@ var ItemWithDetailsPage = React.createClass({
           <div className="col-md-7">
             <h3> {this.state.item.get('name')}</h3>
             <div>
+             <div className='h4'> {this.state.item.get('brand').name}</div>
              <div className='h4'> {this.state.item.get('list_price')} KM</div>
              <div className='h5'>{this.state.item.get('pricePerUnit')}</div>
              <div> {this.state.item.get('description')}</div>

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

@@ -25,6 +25,7 @@ var SingleItem = React.createClass({
         <div className="single_item"  onClick={itemClick}>
           <img src={firstImage.url} className="item_list_image" />
           <h1> { this.props.item.get('name') }</h1>
+          <div>{ this.props.item.get('brand')? this.props.item.get('brand').name : '' } </div>
           <div> { this.props.item.get('list_price') } KM </div>
         </div>  
         );

front-ui/app/components/rootApp.js

@@ -1,5 +1,5 @@
 var React = require('react'),
-    SectionsListComponent = require('./shared/sectionsListComponent'),
+    MenuItemListComponent = require('./shared/menuItemListComponent'),
     Router = require('react-router'),
     Link = Router.Link,
     RouteHandler = Router.RouteHandler,
@@ -57,7 +57,7 @@ var RootApp = React.createClass({
     </div>
     <div className='row'>
         <div className='col-md-8' id='header'>
-            <SectionsListComponent />
+            <MenuItemListComponent />
             </div>
 
         <div className="col-md-4">

front-ui/app/components/shared/menuItemListComponent.js

@@ -0,0 +1,93 @@
+var React = require('react'),
+    MenuItemCollection = require('../../models/menuItemCollection'),
+    MenuItem = require('../../models/menuItem'),
+    Backbone = require('backbone'),
+    NavigationStore = require('../../stores/navigationStore'),
+    MenuItemStore = require('../../stores/menuItemStore'),
+    MenuItemActions = require('../../actions/menuItemActions'),
+    NavigationActions = require('../../actions/navigationActions');
+
+Backbone.$ = $;
+
+var MenuItemListComponent = React.createClass({
+
+    _onChange: function () {
+      if (this.isMounted()) {
+        this.setState(MenuItemStore.getState());
+      }
+    },
+  
+    getInitialState: function() {
+      return MenuItemStore.getState();
+    },
+
+    componentDidMount: function() {
+      MenuItemStore.addChangeListener(this._onChange);
+      MenuItemActions.loadMenuItems();
+    },
+    onMouseOver: function(menuItem) {
+      MenuItemActions.setMenuItemHover(menuItem);
+    },
+    onMouseOut: function() {
+      MenuItemActions.unsetMenuItemHover();
+    },
+    onMouseLeave: function() {
+      MenuItemActions.unsetMenuItemHover();
+    },
+    onMenuItemClick: function(menuItem) {
+      MenuItemActions.unsetMenuItemHover();
+      NavigationActions.goToMenuItem(menuItem);
+      event.preventDefault();
+    },
+    //onCategoryClick: function(category, section) {
+      //MenuItemActions.unsetSectionHover();
+      //NavigationActions.goToCategory(new Category(category), section);    
+      //event.preventDefault();
+    //},
+    //onSubcategoryClick: function(subcategory) {
+      //// implement in navigation actions
+      //// and call 
+      //// when ready
+      //return false;
+    //},
+    render: function() {
+      var self = this;
+      var style = {
+        position: 'relative'
+      };
+      var abStyle = {
+        position: 'absolute'
+      };
+      return (
+          <div>
+          <ul className='nav nav-pills'>
+          {this.state.menuItems.map(function(menuItem) {
+
+                                                       return (
+                                                         <li key={menuItem.get('id')} onMouseLeave={self.onMouseOut} onMouseOver={self.onMouseOver.bind(self, menuItem)} role='presentation' style={style}>
+                                                         <a href="#"  onClick={self.onMenuItemClick.bind(self, menuItem)} >
+                                                         { menuItem.get('title') }
+
+                                                         </a>
+                                                         <div style={abStyle} className={menuItem.get('id') !== self.state.hoveredMenuItem ? "hide section-cat-list": "section-cat-list"}  >
+
+                                                         <ul  >
+                                                         {menuItem.get('menu_sub_items').map(function(menuSubItem) {
+                                                                                                             return (
+                                                                                                               <li key={menuSubItem.id}>
+                                                                                                               <a onClick={self.onMenuItemClick.bind(self, menuSubItem)}>{menuSubItem.title}</a>
+                                                                                                               </li>
+                                                                                                               )
+                                                                                                           })}
+                                                       </ul>
+                                                         </div>
+                                                         </li>
+                                                         )
+                                                     })}
+      </ul>
+        </div>
+        );
+    }
+});
+
+module.exports = MenuItemListComponent;