senaduka/old-ribica
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fix: menu not visible on small screens

Browse Source
This commit is contained in:
Edin Dazdarevic
2015-04-18 16:13:55 +02:00
parent 269ad19e4f
commit aafda1d187
2 changed files with 51 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
front-ui/Gruntfile.js
View File

@@ -85,7 +85,9 @@ module.exports = function(grunt) {
dest: 'build/ribica.css'
},
js: {
src: ['node_modules/jquery/dist/jquery.min.js', 'node_modules/bootstrap/dist/css/bootstrap.min.js', 'build/ribica.bundle.js'],
src: ['node_modules/jquery/dist/jquery.min.js',
'build/bootstrap.min.js',
'build/ribica.bundle.js'],
dest: 'build/ribica.js'
}
}
@@ -107,4 +109,4 @@ module.exports = function(grunt) {
grunt.registerTask('dev', ['browserify', 'config-dev', 'concat:css', 'concat:js', 'connect:server:keepalive']);
grunt.registerTask('build', ['browserify', 'config-prod', 'concat:css', 'concat:js']);
};
};

65
front-ui/app/components/shared/menuItemListComponent.js
View File

@@ -4,6 +4,7 @@ var React = require('react'),
Backbone = require('backbone'),
NavigationStore = require('../../stores/navigationStore'),
MenuItemStore = require('../../stores/menuItemStore'),
CartStore = require('../../stores/cartStore.js');
MenuItemActions = require('../../actions/menuItemActions'),
NavigationActions = require('../../actions/navigationActions');
@@ -18,7 +19,10 @@ var MenuItemListComponent = React.createClass({
},
getInitialState: function() {
return MenuItemStore.getState();
var state = MenuItemStore.getState();
var cartState = CartStore.getWholeCartState();
state.cartCount = cartState;
return state;
},
componentDidMount: function() {
@@ -39,17 +43,9 @@ var MenuItemListComponent = React.createClass({
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;
//},
_onCartClick: function() {
NavigationActions.goToCart();
},
render: function() {
var self = this;
var style = {
@@ -62,8 +58,19 @@ var MenuItemListComponent = React.createClass({
<div className="navbar navbar-default navbar-static-top">
<div className="container">
<ul className='nav nav-pills'>
<div className="navbar-collapse collapse ">
<div className="navbar-header">
<button type="button" className="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span className="icon-bar" />
<span className="icon-bar" />
<span className="icon-bar" />
</button>
<a className="navbar-brand hidden-lg hidden-md" href="#"><img style={{marginTop: '-4px'}} height={24} src="https://res.cloudinary.com/du5pdibul/image/upload/v1428813560/logo_h5f9yp.png" /></a>
<ul className="mynav hidden-lg hidden-md " style={{listStyle: 'none'}}>
<li><a href="#">0,00 KM</a></li>
<li onClick={this._onCartClick}><a style={{marginLeft: 10}} className="mybutton" href="#">Završi narudžbu</a></li>
</ul>
</div>
<div className="navbar-collapse collapse">
<ul className="nav navbar-nav hidden-sm hidden-xs ">
{/*
<li id="myhome"><a href="home.html">Današnja ponuda</a></li>
@@ -109,7 +116,7 @@ var MenuItemListComponent = React.createClass({
{this.state.menuItems.map(function(menuItem) {
return <li className="mydropdown menu-large" onMouseLeave={self.onMouseOut} onMouseOver={self.onMouseOver.bind(self, menuItem)}>
<a href="#" className="dropdown-toggle " id={menuItem.get('title').toLowerCase()} onClick={self.onMenuItemClick.bind(self, menuItem)} >{menuItem.get('title')}</a>
<ul className={menuItem.get('id') !== self.state.hoveredMenuItem ? "hdropdown-menu megamenu row hide": "dropdown-menu megamenu row"}>
<ul className={menuItem.get('id') !== self.state.hoveredMenuItem ? "dropdown-menu megamenu row hide": "dropdown-menu megamenu row"}>
{menuItem.get('menu_sub_items').map(function(menuSubItem) {
return (
<li className="col-sm-3" key={menuSubItem.id}>
@@ -120,7 +127,7 @@ var MenuItemListComponent = React.createClass({
return (<li><a href="#" onClick={self.onMenuItemClick.bind(self, menuSubSubItem)}>{menuSubSubItem.title}</a></li>)
})}
</ul>
</li>
</li>
)
})}
</ul>
@@ -128,6 +135,7 @@ var MenuItemListComponent = React.createClass({
})}
</ul>
<ul className="nav navbar-nav hidden-lg hidden-md ">
{/*
<li id="myhome"><a href="#">Današnja ponuda</a></li>
<li className="dropdown menu-large">
<a href="#" className="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"> Beba <b className="caret" /> </a>
@@ -171,11 +179,32 @@ var MenuItemListComponent = React.createClass({
<li><a href="kategorija.html">Mama</a></li>
<li><a href="kategorija.html">Made in BiH</a></li>
<li><a href="kategorija.html">Tržišna marka</a></li>
*/}
{this.state.menuItems.map(function(menuItem) {
return <li> <a href="#" onClick={self.onMenuItemClick.bind(self, menuItem)} >{menuItem.get('title')}</a></li>
return <li className="dropdown menu-large">
<a href="#" className="dropdown-toggle " data-toggle="dropdown" role="button" aria-expanded="false">
{menuItem.get('title')} <b className="caret" /> </a>
<ul className="dropdown-menu megamenu row">
{menuItem.get('menu_sub_items').map(function(menuSubItem) {
return (
<li className="col-sm-3" key={menuSubItem.id}>
<ul>
<li className="dropdown-header"><a href="kategorija.html" onClick={self.onMenuItemClick.bind(self, menuSubItem)}><p>{menuSubItem.title}</p></a></li>
{menuSubItem.menu_sub_sub_items.map(function(menuSubSubItem) {
return (<li><a href="#" onClick={self.onMenuItemClick.bind(self, menuSubSubItem)}>{menuSubSubItem.title}</a></li>)
})}
</ul>
</li>
)
})}
</ul>
</li>
})}
</ul>
</div>
</div>
</ul>
</div>
</div>