浏览代码

finally fix this shit about sectionState.

Tati 9 年之前
父节点
当前提交
986f567021
共有 3 个文件被更改,包括 27 次插入17 次删除
  1. 1 1
      client/index.html
  2. 17 16
      client/js/app.js
  3. 9 0
      client/js/binders.js

+ 1 - 1
client/index.html

@@ -48,7 +48,7 @@
         <nav>
             <div class="navbar-container container" id="section-navbar">
                 <ul class="navbar-list">
-                    <li rv-each-section="sections"><a rv-on-click="selectSection">{section}</a></li>
+                    <li rv-each-section="sections"><a rv-on-click="selectSection" rv-text="section.name" rv-class-selected="section.view"></a></li>
                 </ul>
             </div>
         </nav>

+ 17 - 16
client/js/app.js

@@ -30,10 +30,15 @@ http('http://192.168.1.127/api/products/listcategories').then(function(data) {
 function logError(err) {
     console.log('Error: ', err);
 }
-var sections = [
-    'empresa',
-    'productos'
-];
+
+
+var sections = [{
+    name: 'empresa',
+    view: true
+}, {
+    name: 'productos',
+    view: false
+}];
 
 function fetchProducts(category) {
     return new Promise(function(resolve, reject) {
@@ -105,24 +110,20 @@ function getElement(selector) {
 
 function chooseSection(section) {
     var navbarList = getElement('ul.navbar-list > li > a');
-    addSelectedClass(navbarList, section, selectedSection_);
+    sections.forEach(function (s) {
+        var isSelected = s.name === section;
+        s.view = isSelected;
+        selectedSection_[s.name] = isSelected;
+    })
     data.getSectionData[section]();
 }
 var elements = [];
 
-function addSelectedClass(elemList, x, opt) {
+function addSelectedClass(elemList, x) {
     elemList.forEach(function(el) {
         var isSelected = el.text === x;
         el.className = isSelected ? 'selected' : '';
-        if (opt) {
-            opt[el.text] = isSelected;
-        }
     })
-    if (opt) {
-        sections.forEach(function (s) {
-            opt[s] = s === x;
-        })
-    }
 }
 
 window.onscroll = function() {
@@ -152,7 +153,7 @@ function isInViewport(element) {
 window.onload = function() {
     var section = window.location.hash.substr(1)
     if (section !== '') {
-        chooseSection(section);
+        chooseSection(section, selectedSection_);
     }
     var view = rivets.bind(app, {
     sections: sections,
@@ -163,7 +164,7 @@ window.onload = function() {
     selectSection: function(event, scope) {
         var newValue = event.target.text;
         window.history.pushState({}, newValue, '#' + newValue)
-        chooseSection(newValue);
+        chooseSection(newValue, selectedSection_);
         event.target.className = 'selected';
     },
     selectCategory: function(event, scope) {

+ 9 - 0
client/js/binders.js

@@ -18,4 +18,13 @@ rivets.binders['transition'] = function(el, display) {
            el.classList.add('hide'); 
         }, 200);
     }
+}
+
+rivets.binders['selected-section'] = function (el, sectionState) {
+    var section = el.text;
+    if (sectionState[section]) {
+        el.classList.add('selected');
+    } else {
+        el.classList.remove('selected');
+    }
 }