add restore feature

hellofeiwu · Jun 22, 2016 · cb81164 · cb81164
1 parent f4e1d96
commit cb81164
Show file tree

Hide file tree

Showing 5 changed files with 94 additions and 52 deletions.
diff --git a/client/main.css b/client/main.css
@@ -60,6 +60,10 @@
   display: table-cell;
   vertical-align: middle;
 }
+.card h1 button {
+  display: none;
+  margin-top: 20px;
+}
 .card-bottom {
   background: #DDD;
   border-radius: 5px;
@@ -71,3 +75,9 @@
   position: absolute;
   transform: translate(10px, 5px);
 }
+.move-left {
+  transform: translate(-500px, 0) scale(0.8);
+  transition: .8s;
+  cursor: e-resize;
+  opacity: 0;
+}
diff --git a/client/main.less b/client/main.less
@@ -69,6 +69,10 @@ body {
     margin: 0;
     display: table-cell;
     vertical-align: middle;
+    button {
+      display: none;
+      margin-top: 20px;
+    }
   }
 }
 
@@ -82,4 +86,11 @@ body {
   margin: auto;
   position: absolute;
   transform: translate(10px, 5px);
+}
+
+.move-left {
+  transform: translate(-500px, 0) scale(0.8);
+  transition: .8s;
+  cursor: e-resize;
+  opacity: 0;
 }
diff --git a/client/views/truth-view.js b/client/views/truth-view.js
@@ -9,53 +9,73 @@ var TruthView = function () {
 };
 
 TruthView.prototype.render = function () {
-    var url = '/api/truth';
     var self = this;
+    var truth = '';
+
+    var $truthTmpl = $(truthTmpl());
+    self.$container.empty().append($truthTmpl);
 
     // make api call and response
-    var init = function() {
+    var getQuestion = function(restore) {
+        var url = '/api/truth/' + restore;
         $.getJSON(url, function (data) {
-        var truth = data;
-
-        var $truthTmpl = $(truthTmpl({
-            question: truth.question
-        }));
-
-        $truthTmpl.find('#change').click(function() {
-            init();
-        });
-        self.$container.empty().append($truthTmpl);
-
-        $truthTmpl.find("#submit").click(function() {
-            console.log('button works ' + $truthTmpl.find("#new-question").val());
-            var url = 'api/truth';
-            var newQuestion = {
-                question: $truthTmpl.find("#new-question").val(),
-                type: 'truth'
-            };
-            HttpRequest.http_request_with_data_authentication(
-                'POST',
-                url,
-                JSON.stringify(newQuestion),
-                function successCallback(data){
-                    $truthTmpl.find('#myModal').modal('hide');
-                    console.log('works');
-                },
-                function (data) {
-                    console.log('fail');
-                    window.location.hash = 'login';
-                }
-            );
-        });
+        truth = data;
+        cardInsert();
+    });
+    };
 
-        $truthTmpl.find("#logout").click(function() {
-            window.localStorage.removeItem('username');
-            window.location.hash = '';
+    var cardInsert = function () {
+        $truthTmpl.find('.card-bottom').after('<div class="card"><h1 id="question">' +
+            truth.question +
+            '<div>' +
+            '<button class="btn btn-default" id="question-restore">Restore</button>' +
+            '<button class="btn btn-primary" data-toggle="modal" data-target="#myModal">Submit your own</button>' +
+            '</div>' +
+            '</h1></div>');
+        if (truth.question == 'There is no new question.') {
+            $truthTmpl.find('#question').find('button').show();
+        }
+        $truthTmpl.find('#question-restore').click(function() {
+            $truthTmpl.find('.card').addClass('move-left');
+            getQuestion(1);
         });
-    });
     };
-
-    init();
+
+    getQuestion();
+
+    $truthTmpl.find('#change').click(function() {
+        $truthTmpl.find('.card').addClass('move-left');
+        getQuestion();
+    });
+
+    $truthTmpl.find("#submit").click(function() {
+        console.log('button works ' + $truthTmpl.find("#new-question").val());
+        var url = 'api/truth';
+        var newQuestion = {
+            question: $truthTmpl.find("#new-question").val(),
+            type: 'truth'
+        };
+        HttpRequest.http_request_with_data_authentication(
+            'POST',
+            url,
+            JSON.stringify(newQuestion),
+            function successCallback(data){
+                $truthTmpl.find('#myModal').modal('hide');
+                console.log('works');
+                $truthTmpl.find('.card').addClass('move-left');
+                getQuestion();
+            },
+            function errorCallback(data) {
+                console.log('fail');
+                window.location.hash = 'login';
+            }
+        );
+    });
+
+    $truthTmpl.find("#logout").click(function() {
+        window.localStorage.removeItem('username');
+        window.location.hash = '';
+    });
 };
 
 var truthView = new TruthView();

diff --git a/client/views/truth.handlebars b/client/views/truth.handlebars
@@ -5,17 +5,11 @@
     <h3>This is a truth page</h3>
     <div class="card-container">
         <div class="card-bottom">loading...</div>
-        <div class="card">
-            <h1 id="question">{{question}}?</h1>
-        </div>
     </div>
 
     <button id="change">Change Question</button>
-    <a href="">Home</a>
+    <a href="#">Home</a>
     <a href="#dare">Dare</a>
-    <button class="btn btn-primary" data-toggle="modal" data-target="#myModal">
-        Submit your own question
-    </button>
 
     <!-- Modal -->
     <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">

diff --git a/server/index.js b/server/index.js
@@ -12,10 +12,16 @@ app.use(bodyParser.json()); // for parsing application/json
 
 var idArray = [];
 
-app.get('/api/truth', function (req, res) {
-
+// get new truth question
+app.get('/api/truth/:restore', function (req, res) {
+
+    if (req.params.restore == 1) {
+        console.log(req.params.restore);
+        idArray = [];
+    }
+
     var data = {};
-    
+
     QuestionModel.find({type: 'truth'}, function (err, questions) {
         if (err) {
             console.log(err);
@@ -24,13 +30,13 @@ app.get('/api/truth', function (req, res) {
                 data = {"question": "There is no new question."};
             }else {
                 var unusedIndexes = [];
-                
+
                 for (var i = 0; i < questions.length; ++i) {
                     if (!_.includes(idArray, i)) {
                         unusedIndexes.push(i);
                     }
                 }
-                
+
                 var i = Math.floor((Math.random() * unusedIndexes.length));
                 var questionsIndex = unusedIndexes[i];
                 idArray.push(questionsIndex);
@@ -41,6 +47,7 @@ app.get('/api/truth', function (req, res) {
     });
 });
 
+// get new dare question
 app.get('/api/dare', function (req, res) {
 
     var data = [];