Close simonv3#48. Re-order questions

hc27080401 · Nov 22, 2016 · 09eab3c · 09eab3c
1 parent 5c548e2
commit 09eab3c
Show file tree

Hide file tree

Showing 7 changed files with 40 additions and 35 deletions.
diff --git a/client/js/lib/app.js b/client/js/lib/app.js
@@ -1,8 +1,10 @@
 import angularMeteor from 'angular-meteor';
+import uiTree from 'angular-ui-tree';
 
 angular.module('quick-survey', [
   angularMeteor,
   'angular-meteor.auth',
   'ui.router',
   'ngSanitize',
-  'btford.markdown']);
+  'btford.markdown',
+  uiTree]);
diff --git a/client/js/manage/directives/manage-survey.ng.html b/client/js/manage/directives/manage-survey.ng.html
@@ -8,22 +8,27 @@ <h2>Survey Details</h2>
     </div>
   </div>
 </form>
-<div class="questions">
+<div class="questions" ui-tree>
 <h2>Survey Questions</h2>
   <div ng-if="survey.questions.length === 0 && !addingQuestion" class="empty-state">
     Add some questions
   </div>
-  <ul ng-if="survey">
+  <ul ui-tree-nodes ng-model="survey.questions" ng-if="survey">
     <li ng-repeat="question in survey.questions"
+      ui-tree-node
       question-details
       question="question"
       index="$index"
       question-types="questionTypes"
-      survey="survey">
+      questions="survey.questions"
+      save="save">
     </li>
   </ul>
-  <span add-question
+  <div add-question
     survey="survey"
     question-types="questionTypes"
-    class="add-question"></span>
+    class="add-question"></div>
+  <button type="button" ng-click="save()">
+    Save Questions
+  </button>
 </div>
diff --git a/client/js/manage/directives/manage-survey.ng.js b/client/js/manage/directives/manage-survey.ng.js
@@ -6,6 +6,8 @@ angular.module('quick-survey').directive('manageSurvey', function () {
     },
     controller: function ($scope) {
 
+      $scope.save = save;
+
       $scope.questionTypes = [
         {'type': 'number'},
         {'type': 'text'},
@@ -17,6 +19,23 @@ angular.module('quick-survey').directive('manageSurvey', function () {
         // ToDo: Add more question types as the question directive supports them.
       ];
 
+      function save () {
+        $scope.saved = false;
+        Surveys.update($scope.survey._id,
+          {$set: {
+            questions: angular.copy($scope.survey.questions)
+          }}, function(err, resp) {
+            if (err) {
+              console.log('error', err);
+            } else {
+              $scope.$apply(function () {
+                $scope.saved = true;
+              });
+            }
+
+          });
+      };
+
     },
     templateUrl: 'client/js/manage/directives/manage-survey.ng.html',
   };

diff --git a/client/js/manage/directives/question-details.ng.html b/client/js/manage/directives/question-details.ng.html
@@ -1,5 +1,6 @@
 
 <div class="question-overview">
+  <span ui-tree-handle class="icon-align-vertical-middle"></span>
   {{ question.question }}
 
   <div class="manage-questions">

diff --git a/client/js/manage/directives/question-details.ng.js b/client/js/manage/directives/question-details.ng.js
@@ -7,7 +7,8 @@ angular.module('quick-survey').directive('questionDetails', function () {
       index: '=',
       // TODO: figure out a way to not pass survey through here, just
       // the save() method on survey.
-      survey: '='
+      questions: '=',
+      save: '='
     },
     controller: function ($scope) {
       $scope.editingQuestion = false;
@@ -25,27 +26,10 @@ angular.module('quick-survey').directive('questionDetails', function () {
       $scope.deleteQuestion = function (index) {
         var success = confirm("Are you sure you want to delete this question?");
         if (success) {
-          $scope.survey.questions.splice(index, 1);
+          $scope.questions.splice(index, 1);
           $scope.save();
         }
       };
-
-      $scope.save = function() {
-        $scope.saved = false;
-        Surveys.update($scope.survey._id,
-          {$set: {
-            questions: angular.copy($scope.survey.questions)
-          }}, function(err, resp) {
-            if (err) {
-              console.log('error', err);
-            } else {
-              $scope.$apply(function () {
-                $scope.saved = true;
-              });
-            }
-
-          });
-      };
     },
     templateUrl: 'client/js/manage/directives/question-details.ng.html',
   };

diff --git a/client/js/surveys/controllers/surveyCtrl.ng.js b/client/js/surveys/controllers/surveyCtrl.ng.js
@@ -9,31 +9,23 @@ angular.module('quick-survey').controller('SurveyCtrl',
 
   Meteor.subscribe('surveys', {
     onReady: function () {
-      console.log('loaded surveys');
+      // console.log('loaded surveys');
     },
     onStop: function () {
-      console.log('survey subscribe stopped');
+      // console.log('survey subscribe stopped');
     }
   })
 
   $scope.helpers({
     activeSurvey: function() {
       var surveys = Surveys.find({active: true}).fetch();
-      console.log('found', surveys)
       if (surveys.length > 0) {
         var survey = Surveys.findOne(surveys[0]._id);
-        console.log(survey)
         $scope.loaded = true;
 
         if (!$scope.activeSurvey) {
-          console.log('active survey not set');
-          // $scope.$apply(function () {
-          //   console.log('setting active survey');
-          //   console.log()
             $scope.activeSurvey = survey;
             activate();
-          //   console.log($scope.activeSurvey)
-          // });
         }
 
         if (survey.questions.length > 0) {

diff --git a/package.json b/package.json
@@ -2,7 +2,9 @@
   "devDependencies": {},
   "dependencies": {
     "angular": "^1.5.8",
+    "angular-legacy-sortablejs": "^0.4.1",
     "angular-meteor": "^1.3.2",
+    "angular-ui-tree": "^2.22.1",
     "bcrypt": "^0.8.7",
     "bluebird": "^3.4.6",
     "fibers": "^1.0.15",