Lots of little fixes and adjustments while QAing.

flukeout · flukeout · commit 02b00d1d2650 · 2016-09-26T08:47:44.000-07:00
diff --git a/NOTES.md b/NOTES.md
@@ -1,12 +1,8 @@
-##To-do
+##Left-off
 
-**QA b4 Launch**
+**QA B4 LAUNCH (Still in progress)**
   * Check to make sure all levels work
   * Check that examples are correct
-  * QA the reset - it's wiggin out yo? is it????
-
-
-
 
 ##Feature Ideas
 
@@ -16,7 +12,6 @@
 * Do more work to figure out who has already been there, treat them a bit differently?
   * "Welcome back et."
 
-
 **Gameplay**
 
 * Award stars when a level is completed without commas and using the indicated selector
@@ -28,75 +23,30 @@
   * Add a new one every week
   * Gives me a reason to bring people back
 
-
 **Fun sfuff**
 
 * Some kind of bonus level
   * Appears randomly and not very often
   * Can have different food items
   * Or a special riddle that they get two shots on
 
-
 **Aesthetic Cleanup**
 
 * Color the hover border according to the element hovered and context
   * Apples have a red border...
 
+**Branding**
 
-**Final Attrib Rules**
-* has attribute
-* attribute value = something
-* attribute starts with
-* attribute ends with
-
-
-**TO-DO**
-
-* Pull jquery from CDN?
-* Refactor
+* Pull jquery from CDN
 * Figure out CNAME setup for github
   * Would be cool for it to always show up as cssdiner.com
-* Figure out next steps to increase reach and use
-  * Email signup?
-  * Dedicated twitter account?
-* Figure out next steps to improve product
-  * More selectors
-  * More levels per selector
-
 
 **Questions**
 
-  * How to test completion of twitter actions?
-  * How to track where it's being shared already?
-    * Sharetally, or something similar?
-
-
-What kind of new content could I have?
-
-* Special riddle mode?
-* Create a challenge mode?
-* Sandbox mode
-* New levels
-
-
-**Attribute selectors**
-
-* has attribute [for]
-* has an attribute with exact value
-  * ``[for=bob]``
-* has an attribute that starts with
-  * ``[for^=bob]``
-* has an attribute that contains
-  * ``[for*=bob]``
-* has an attribute that ends with
-  * ``[for$=bob]``
-* has this value in a list of space-separated attributes ``for="bob mary"``
-  * ``[for~=bob]``
-* has this value in a list of dash separated attributes ``for="bob-mary"``
-  * ``[for~=bob]``
-
+* Is it possible to track where & how the diner is being shared?
+  * Sharetally, or something similar?
 
-####Figuring out hard levels
+**Tracking where people have trouble**
 
 * Figure out how best to track which levels are the hardest
   * Current proposed method is by tracking incorrect guess counts per level
diff --git a/css/style.css b/css/style.css
@@ -1272,7 +1272,7 @@ tag:after {
   color: #09699b;
   font-size: 22px;
   box-shadow: -3px 4px 0 rgba(0,0,0,.1);
-  background-image: url(http://github.com/images/line.png);
+  background-image: url(http://github.com/images/line.gif);
   z-index: 9999;
   padding: 30px 0 2px 0 ;
   background-color: #c5d6dd;
diff --git a/images/line.gif b/images/line.gif
diff --git a/js/levels.js b/js/levels.js
@@ -569,10 +569,10 @@ var levels = [
     doThis : "Select the items for someone",
     selector : "[for]",
     syntax: "[attribute]",
-    help : "It does not matter what the value of the attribute is, it can even be blank.",
+    help : 'Attributes appear inside the opening tag of an element, like this: <tag>span attribute="value"</tag>. An attribute does not always have a value, it can be blank!',
     examples : [
       '<strong>a[href]</strong> selects all <tag>a</tag> elements that have a <strong>href="anything"</strong> attribute.',
-      '<strong>[id]</strong> selects all elements that have a <strong>href="anything"</strong>. attribute'
+      '<strong>[type]</strong> selects all elements that have a <strong>type="anything"</strong>. attribute'
     ],
     boardMarkup:`
     <bento><apple class="small"/></bento>
@@ -587,7 +587,7 @@ var levels = [
     doThis : "Select the plates for someone",
     selector : "plate[for]",
     syntax: "A[attribute]",
-    help : "You can combine the attribute selector with other selectors, like the tag name selector.",
+    help : "Combine the attribute selector with another selector (like the tag name selector) by adding it to the end.",
     examples : [
       '<strong>[value]</strong> selects all elements that have a <strong>value="anything"</strong> attribute.',
       '<strong>a[href]</strong> selects all <tag>a</tag> elements that have a <strong>href="anything"</strong> attribute.',
@@ -605,8 +605,8 @@ var levels = [
     helpTitle: "Select all elements that have a specific attribute value",
     doThis : "Select Vitaly's meal",
     selector : "[for=Vitaly]",
-    syntax: "A[attribute=value]",
-    help : "You can combine the attribute selector with other selectors, like the tag name selector.",
+    syntax: "[attribute=value]",
+    help : "Attribute selectors are case sensitive, each character must match exactly.",
     examples : [
       '<strong>input[type=checkbox]</strong> selects all checkbox input elements.'
     ],
@@ -623,9 +623,9 @@ var levels = [
     doThis : "Select the items for names that start with 'Sa'",
     selector : "[for^='Sa']",
     syntax: "[attribute^=value]",
-    help : 'Attribute selectors are case sensitive, each character must match exactly.',
+    help : "You can use quotes around the value in the selector, or not&mdash;it's optional!",
     examples : [
-      '<strong>.toy[category^=Swim]</strong> selects elements with class <strong>toy</strong> and either <strong>category="Swimwear</strong> or <strong>category="Swimming</strong>".'
+      '<strong>.toy[category^=Swim]</strong> selects elements with class <strong>toy</strong> and either <strong>category="Swimwear</strong> or <strong>category="Swimming"</strong>.'
     ],
     boardMarkup: `
     <plate for="Sam"><pickle/></plate>
diff --git a/js/restaurant.js b/js/restaurant.js
@@ -170,17 +170,21 @@ function addAnimation(el, className){
   })
 }
 
-// Reset all progress!
-// Should also scroll the menu to the top...
+// Reset all progress
+// * Removes checkmarks from level header and list
+// * Scrolls level menu to top
+// * Resets the progress object
+
 function resetProgress(){
   currentLevel = 0;
   progress = blankProgress;
   localStorage.setItem("progress",JSON.stringify(progress));
+  finished = false;
 
   $(".completed").removeClass("completed");
   loadLevel();
-  closeMenu(); // what does it do??
-  $("#mCSB_2_container").css("top",0); // weird scroll reset - because of the
+  closeMenu();
+  $("#mCSB_2_container").css("top",0); // Strange element to reset scroll due to scroll plugin
 }
 
 
@@ -198,6 +202,9 @@ function checkCompleted(levelNumber){
   }
 }
 
+
+// Builds the slide-out level menu
+
 function buildLevelmenu(){
   for(var i = 0; i < levels.length; i++){
     var level = levels[i];
@@ -226,16 +233,19 @@ function openMenu(){
   $(".right-col").addClass("menu-open");
 }
 
+
+// Hides & shows the tooltip that appears when an eleemnt
+// on the table or the editor is hovered over.
+
 function hideTooltip(){
   $(".enhance").removeClass("enhance");
   $("[data-hovered]").removeAttr("data-hovered");
   $(".helper").hide();
 }
 
 function showTooltip(el){
-
   if(finished){
-    return;
+    return; // Only show tooltip if the game isn't finished yet
   }
 
   el.attr("data-hovered",true);
