Support for hidden sketches on parse and the ability to opt out of th…

…e gallery per #64
processing · Nov 26, 2014 · ec92d6c · ec92d6c
1 parent cccfc7d
commit ec92d6c
Show file tree

Hide file tree

Showing 6 changed files with 80 additions and 45 deletions.
diff --git a/admin/index.html b/admin/index.html
@@ -41,8 +41,8 @@ <h3 class="panel-title">Log Out</h3>
     </div>
     <div class="panel-body">
 
-      <p>You are logged in as <span id="userInfo"></span>.</p>
-      <button id="logoutButton" class="btn btn-default">Log Out</button>
+      <p>You are logged in as <span id="userInfo"></span>. You make now make edits to sketches in the <a href="/gallery/">gallery</a>.</p>
+      <button id="logoutButton" class="btn btn-default btn-sm btn-info">Log Out</button>
 
     </div>
   </div>

diff --git a/display/index.html b/display/index.html
@@ -64,6 +64,11 @@ <h4 class="modal-title" id="codeModalTitle">Admin</h4>
             <label for="featureScore">Feature Score</label>
             <input type="text" class="form-control" id="featureScore">
           </div>
+         <div class="checkbox">
+            <label>
+              <input type="checkbox" id="hidden"> Hide Sketch
+            </label>
+          </div>          
          <div class="checkbox">
             <label>
               <input type="checkbox" id="delete"> Delete Sketch

diff --git a/editor/index.html b/editor/index.html
@@ -132,6 +132,44 @@ <h4 class="modal-title" id="errorModalTitle">Don't Panic!</h4>
 <!-- End Modal Error Window -->
 
 
+<!-- Modal Confirm Window -->
+
+<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog" aria-labelledby="shareModalTitle" aria-hidden="true" data-url="http://hello.processing.org/">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+        <h4 class="modal-title" id="confirmModalTitle">Confirm</h4>
+      </div>
+      <div class="modal-body">
+        <p>
+          We'll create a custom link you can use to share your work with the world. You can also choose to have your sketch added to the gallery.
+        </p>
+
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" id="modalGalleryCheckbox" checked="checked"> Share in gallery?
+          </label>
+        </div>
+
+      </div>   
+      <div class="modal-footer">
+
+        <button class="btn btn-default btn-sm" id="modalConfirmButton">
+         <span class="glyphicon glyphicon-ok"></span> Continue
+        </button>             
+        <button class="btn btn-default btn-sm" data-dismiss="modal">
+          <span class="glyphicon glyphicon-remove"></span> Cancel
+        </button>
+      </div>
+    </div><!-- /.modal-content -->
+  </div><!-- /.modal-dialog -->
+</div><!-- /.modal -->
+
+<!-- End Modal Confirm Window -->
+
+
+
 <!-- Modal Share Window -->
 
 <div class="modal fade" id="shareModal" tabindex="-1" role="dialog" aria-labelledby="shareModalTitle" aria-hidden="true" data-url="http://hello.processing.org/">
@@ -142,22 +180,26 @@ <h4 class="modal-title" id="errorModalTitle">Don't Panic!</h4>
         <h4 class="modal-title" id="shareModalTitle">Share</h4>
       </div>
       <div class="modal-body">
-        You can copy or bookmark the link below to revisit your creation at any time. You can also use any of the social buttons to share your work with the world!
-      </div>
-      <div class="modal-body" id="shareModalLink">
-        <a href="http://hello.processing.org" target="_blank">http://hello.processing.org/</a>
-      </div>      
+        <p>
+          You can copy or bookmark the link below to revisit your creation at any time. You can also use any of the social buttons to share your work with the world!
+        </p>
+
+        <p id="shareModalLink">
+          <a href="http://hello.processing.org" target="_blank">http://hello.processing.org/</a>
+        </p>   
+
+      </div>   
       <div class="modal-footer">
-        <button class="btn btn-default" id="modalFacebookButton">
+        <button class="btn btn-default btn-sm" id="modalFacebookButton">
          <span class="glyphicon glyphicon-share-alt"></span> Facebook
         </button> 
-        <button class="btn btn-default" id="modalGoogleButton">
+        <button class="btn btn-default btn-sm" id="modalGoogleButton">
          <span class="glyphicon glyphicon-share-alt"></span> Google+
         </button>               
-        <button class="btn btn-default" id="modalTwitterButton">
+        <button class="btn btn-default btn-sm" id="modalTwitterButton">
          <span class="glyphicon glyphicon-share-alt"></span> Twitter
         </button>             
-        <button class="btn btn-default" data-dismiss="modal">
+        <button class="btn btn-default btn-sm" data-dismiss="modal">
           <span class="glyphicon glyphicon-ok"></span> Close
         </button>
       </div>

diff --git a/js/display.js b/js/display.js
@@ -70,8 +70,10 @@ var helloDisplay = {
             } else {
 
                 var featureScore = parseInt($("#featureScore").val());
+                var hidden = $('#hidden').prop('checked');
 
                 helloDisplay.parseObject.set("featureScore", featureScore);
+                helloDisplay.parseObject.set("hidden", hidden);
                 helloDisplay.parseObject.save();
             }
 
@@ -136,9 +138,10 @@ var helloDisplay = {
             helloDisplay.parseObject = gallery;
             helloDisplay.showSketch(gallery.get("source"));
 
-            $("#viewCount").val(gallery.get("viewCount"));
             $("#featureScore").val(gallery.get("featureScore"));
 
+            $('#hidden').prop('checked', gallery.get("hidden"));
+
             Parse.Cloud.run('incrementViewCount', {id: gallery.id}, {
               success: function(result) {
                 // Success

diff --git a/js/editor.js b/js/editor.js
@@ -204,9 +204,9 @@ var helloEditor = {
         });
 
         $("#shareButton").click(function () {
-            helloEditor.confirmExit = false;
-            //helloEditor.createGist();
-            helloEditor.addToGallery();
+            //helloEditor.addToGallery();
+
+            helloEditor.showShareConfirm();
         });
 
         $("#resetExample").click(function () {
@@ -242,6 +242,14 @@ var helloEditor = {
 
         /* Share UI */
 
+        $("#modalConfirmButton").click(function () {
+
+            var hidden = !$("#modalGalleryCheckbox").prop('checked');
+
+            $('#confirmModal').modal('hide');
+            helloEditor.addToGallery(hidden);
+        });
+
         $("#modalGoogleButton").click(function () {
 
             var shareURL = "https://plus.google.com/share",
@@ -640,7 +648,7 @@ var helloEditor = {
     /**
      * Adds to the gallery hosted on Parse
      */
-    addToGallery: function() {
+    addToGallery: function(hidden) {
 
         // Post to Parse
 
@@ -665,7 +673,9 @@ var helloEditor = {
             var gallery = new Parse.Object("Gallery");
             gallery.set("source", processingSource);
             gallery.set("image", processingImage);
+            gallery.set("hidden", hidden)
             gallery.save(galleryData).then(function(object) {
+                helloEditor.parseObject = object;
                 var displayURL = "http://" + $(location).attr('hostname') + (($(location).attr('port') !== "") ?  ":" + $(location).attr('port') : "") + "/display/#@" + object.id;                
                 helloEditor.showShare(displayURL);          
             });
@@ -685,35 +695,8 @@ var helloEditor = {
 
     },
 
-    /**
-     * Creates a new Gist with editor contents and shows the share modal
-     */
-    createGist: function () {
-
-        var processingSource = this.editor.getValue(),
-            postURL = "https://api.github.com/gists",
-            postData;
-
-        if (!(/size\(\s*\d+\s*,\s*\d+\s*\)/.test(processingSource))) {
-            processingSource = "size(500,400);\n\n" + processingSource;
-        }
-
-        postData = {
-                "description": "Save for Processing Hour of Code",
-                "public": true,
-                "files": {
-                    "demo.pde": {
-                        "content": processingSource
-                    }
-                }
-            };        
-
-        $.post(postURL, JSON.stringify(postData))
-            .done(function (data) {
-                var displayURL = "http://" + $(location).attr('hostname') + (($(location).attr('port') !== "") ?  ":" + $(location).attr('port') : "") + "/display/#" + data.id;                
-                helloEditor.showShare(displayURL);
-            });
-
+    showShareConfirm: function() {
+        $('#confirmModal').modal('show');
     },
     showShare: function(displayURL) {
 

diff --git a/js/gallery.js b/js/gallery.js
@@ -84,6 +84,8 @@ var helloGallery = {
 
         var GalleryObject = Parse.Object.extend("Gallery");
         var query = new Parse.Query(GalleryObject);
+
+        query.notEqualTo("hidden", true);
         query.limit(helloGallery.itemsPerPage);
         query.skip(helloGallery.pageNumber * helloGallery.itemsPerPage);