Merge pull request #275 from jpbackman/show-child-sections-variables

Feature: if section does not use variables, list sub-sections' variables

Author: hannu

lib/app/js/directives/design.js

@@ -7,10 +7,20 @@ angular.module('sgApp')
       restrict: 'A',
       templateUrl: 'views/partials/design.html',
       link: function(scope) {
+
+        var parentRef;
+
         scope.showRelated = true;
 
-        scope.$watch('currentReference.section', function(newVal, oldVal) {
-          scope.relatedVariables = scope.currentReference.section.variables
+        scope.$watch('currentReference.section', function() {
+          var relatedVariables = scope.currentReference.section.variables || [];
+          if (scope.showRelated && relatedVariables.length === 0 && scope.sections.data) {
+            parentRef = scope.currentReference.section.reference;
+            scope.relatedChildVariableNames = scope.sections.data.filter(isSubSection)
+              .map(getVariables)
+              .reduce(concat, [])
+              .filter(unique);
+          }
         });
 
         scope.saveVariables = function() {
@@ -19,7 +29,26 @@ angular.module('sgApp')
 
         scope.resetLocal = function() {
           Variables.resetLocal();
+        };
+
+        function isSubSection(section) {
+          var ref = section.parentReference;
+          return (typeof ref === 'string') &&
+            (ref === parentRef || ref.substring(0, ref.indexOf('.')) === parentRef);
+        }
+
+        function getVariables(section) {
+          return section.variables;
         }
+
+        function concat(a, b) {
+          return a.concat(b);
+        }
+
+        function unique(a, idx, arr) {
+          return arr.indexOf(a) === idx && a !== undefined;
+        }
+
       }
     };
   });

lib/app/js/directives/section.js

@@ -10,7 +10,7 @@ angular.module('sgApp')
         function updateCurrentReference() {
           var topOffset = element[0].offsetTop,
             bottomOffset = element[0].offsetTop + element[0].offsetHeight,
-            buffer = 100;
+            buffer = 50;
 
           if (this.pageYOffset > topOffset - buffer && this.pageYOffset < bottomOffset - buffer) {
             if ($rootScope.currentReference.section.reference !== scope.section.reference) {

lib/app/views/partials/design.html

@@ -14,14 +14,22 @@
     <a class="sg" ng-click="showRelated = false" ng-show="showRelated">Show all variables</a>
     <h3 class="sg" ng-show="showRelated">{{currentReference.section.reference}} {{currentReference.section.header}}</h3>
     <h3 class="sg" ng-hide="showRelated">All variables</h3>
-    <ul>
+    <ul class="sg">
       <li ng-hide="showRelated" ng-repeat="variable in variables">
         <div sg-variable></div>
       </li>
       <li ng-if="showRelated" ng-repeat="variable in filteredItems = (variables | filterRelated: currentReference.section.variables)">
         <div sg-variable></div>
       </li>
-      <li ng-if="showRelated" ng-show="!filteredItems.length">This section does not contain related variables.</li>
+
+      <li ng-if="showRelated" ng-show="filteredItems.length === 0"><b>This section does not contain any related variables.</b></li>
+      <li ng-if="showRelated" ng-show="relatedChildVariableNames.length > 0">
+        <p>Sub sections use the following variables:</p>
+      </li>
+      <li ng-if="showRelated && filteredItems.length === 0" ng-repeat="variable in childVariables = (variables | filterRelated: relatedChildVariableNames)">
+        <div sg-variable></div>
+      </li>
+
     </ul>
     <div class="sg action-footer" ng-if="socketService.isAvailable()">
       <button class="sg button primary" ng-click="saveVariables()">Save changes</button>