From 336282e0dd2fa1c7f4cbcba1c92e272fac76c327 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Thu, 19 Nov 2015 14:51:22 -0500
Subject: store auth in localstorage, add scrollers

---
 StoneIsland/www/index.html | 358 +++++++++++++++++++++++++--------------------
 1 file changed, 198 insertions(+), 160 deletions(-)

(limited to 'StoneIsland/www/index.html')

diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html
index 6b0b1770..886a3b70 100644
--- a/StoneIsland/www/index.html
+++ b/StoneIsland/www/index.html
@@ -55,11 +55,21 @@
       <span class="care">CUSTOMER CARE</span>
     </div>
   </span>
-  
+
   <span class="submenu">
-    <span class="login">ACCOUNT / LOGIN</span>
-    <span class="faq">FAQ</span>
-    <span class="search">SEARCH</span>
+    <div class="main_menu">
+      <span class="account">ACCOUNT</span>
+      <span class="login">LOGIN</span>
+      <span class="faq">FAQ</span>
+    </div>
+    <div class="account_menu">
+      <span class="logout">LOGOUT</span>
+      <span class="faq">FAQ</span>
+    </div>
+    <div class="faq_menu">
+      <span class="login">LOGIN</span>
+      <span class="logout">LOGOUT</span>
+    </div>
   </span>
 
   <span class="social">
@@ -224,144 +234,165 @@
   <!-- ACCOUNT ================================================ -->
 
   <div id="login">
-    <h1>LOGIN</h1>
-    <form>
-      <input type="email" name="Email" placeholder="EMAIL ADDRESS" required>
-      <input type="password" name="Password" placeholder="PASSWORD" required>
+    <div class="scroll">
+      <h1>LOGIN</h1>
+      <form>
+        <input type="email" name="Email" placeholder="EMAIL ADDRESS" required>
+        <input type="password" name="Password" placeholder="PASSWORD" required>
       
-      <span class="newuser">New User?</span>
+        <span class="newuser">New User?</span>
       
-      <span class="msg"></span>
-    </form>
+        <span class="msg"></span>
+      </form>
+    </div>
+  </div>
+
+  <div id="logout">
+    <div class="scroll">
+      <h1>LOGOUT</h1>
+      <span class="msg">
+        You are now logged out.
+      </span>
+    </div>
   </div>
 
   <div id="signup">
-    <h1>NEW USER</h1>
-    <form>
-      <input type="text" name="Name" placeholder="FIRST NAME" required>
-      <input type="text" name="Surname" placeholder="LAST NAME" required>
-      <input type="email" name="Email" placeholder="EMAIL ADDRESS" required>
-      <select name="Gender">
-        <option value="M">Male</option>
-        <option value="F">Female</option>
-      </select>
-      <h2>PASSWORD</h2>
-      <input type="password" name="Password" placeholder="PASSWORD (7 CHARACTERS OR MORE)" required>
-      <input type="password" name="Password2" placeholder="CONFIRM PASSWORD" required>
-      <input type="checkbox" name="DataProfiling" value="true" required> I agree to share my personal information with Stone Island.
-      <span class="msg"></span>
-    </form>
+    <div class="scroll">
+      <h1>NEW USER</h1>
+      <form>
+        <input type="text" name="Name" placeholder="FIRST NAME" required>
+        <input type="text" name="Surname" placeholder="LAST NAME" required>
+        <input type="email" name="Email" placeholder="EMAIL ADDRESS" required>
+        <select name="Gender">
+          <option value="M">Male</option>
+          <option value="F">Female</option>
+        </select>
+        <h2>PASSWORD</h2>
+        <input type="password" name="Password" placeholder="PASSWORD (7 CHARACTERS OR MORE)" required>
+        <input type="password" name="Password2" placeholder="CONFIRM PASSWORD" required>
+        <input type="checkbox" name="DataProfiling" value="true" required> I agree to share my personal information with Stone Island.
+        <span class="msg"></span>
+      </form>
+    </div>
   </div>
     
   <div id="profile">
-    <h1>PROFILE</h1>
-    <form>
-      <div class="container">
-        <div class="container-row">
-          <input type="text" name="Name" placeholder="FIRST NAME" required>
-          <input type="text" name="Surname" placeholder="LAST NAME" required>
-          <input type="email" name="Email" placeholder="EMAIL ADDRESS" required>
-          <div class="half-input">
-            <input type="text" name="Zip" placeholder="ZIP" required>
-            <div id="country-wrapper">
-            <div id="country-select">
-              <input type="text" name="Country" placeholder="UNITED STATES" required>
+    <div class="scroll">
+      <h1>PROFILE</h1>
+      <form>
+        <div class="container">
+          <div class="container-row">
+            <input type="text" name="Name" placeholder="FIRST NAME" required>
+            <input type="text" name="Surname" placeholder="LAST NAME" required>
+            <input type="email" name="Email" placeholder="EMAIL ADDRESS" required>
+            <div class="half-input">
+              <input type="text" name="Zip" placeholder="ZIP" required>
+              <div id="country-wrapper">
+              <div id="country-select">
+                <input type="text" name="Country" placeholder="UNITED STATES" required>
+              </div>
+              </div>
             </div>
+            <h2>CHANGE PASSWORD</h2>
+            <input type="password" name="CurrentPassword" placeholder="CURRENT PASSWORD" required>
+            <input type="password" name="NewPassword" placeholder="NEW PASSWORD (7 CHARACTERS OR MORE)" required>
+            <div class="toggle-container">
+              <div class="caption">
+                <h3>Newsletter</h3>
+                Receive Stone Island Newsletter
+              </div>
+              <div class="toggle">
+                <input type="checkbox" id="receive-newsletter" name="switch" class="switch">
+                <label for="receive-newsletter"></label>
+              </div>     
             </div>
           </div>
-          <h2>CHANGE PASSWORD</h2>
-          <input type="password" name="CurrentPassword" placeholder="CURRENT PASSWORD" required>
-          <input type="password" name="NewPassword" placeholder="NEW PASSWORD (7 CHARACTERS OR MORE)" required>
-          <div class="toggle-container">
-            <div class="caption">
-              <h3>Newsletter</h3>
-              Receive Stone Island Newsletter
+          <div class="container-fill">
+            <div class="container-message">
+              <!-- addClass ".alert-notice" to make the 
+                   error message text red in the span below -->
+              <span class="msg">
+                * Your personal and payment<br>
+                information will always remain private
+              </span>
             </div>
-            <div class="toggle">
-              <input type="checkbox" id="receive-newsletter" name="switch" class="switch">
-              <label for="receive-newsletter"></label>
-            </div>     
-          </div>
-        </div>
-        <div class="container-fill">
-          <div class="container-message">
-            <!-- addClass ".alert-notice" to make the 
-                 error message text red in the span below -->
-            <span class="msg">
-              * Your personal and payment<br>
-              information will always remain private
-            </span>
           </div>
         </div>
-      </div>
-    </form> 
+      </form>
+    </div>
   </div>
 
   
   <div id="shipping">
-    <h1>SHIPPING</h1>
-    <form>
-      <div class="container">
-        <div class="container-row">
-          <div class="address"></div>
-        </div>
-        <div class="container-fill">
-          <div class="container-message">
-            <span class="msg">
-              * Your personal and payment<br>
-              information will always remain private
-            </span>
+    <div class="scroll">
+      <h1>SHIPPING</h1>
+      <form>
+        <div class="container">
+          <div class="container-row">
+            <div class="address"></div>
+          </div>
+          <div class="container-fill">
+            <div class="container-message">
+              <span class="msg">
+                * Your personal and payment<br>
+                information will always remain private
+              </span>
+            </div>
           </div>
         </div>
-      </div>
-    </form>
+      </form>
+    </div>
   </div>
   
   <div id="payment">
-    <h1>PAYMENT</h1>
-    <form>
-      <div class="container">
-        <div class="container-row">
-          <div class="cc"></div>
-          <div class="address"></div>
-        </div>
-        <div class="container-fill">
-          <div class="container-message">
-            <span class="msg">
-              * Your personal and payment<br>
-              information will always remain private           
-            </span>
+    <div class="scroll">
+      <h1>PAYMENT</h1>
+      <form>
+        <div class="container">
+          <div class="container-row">
+            <div class="cc"></div>
+            <div class="address"></div>
+          </div>
+          <div class="container-fill">
+            <div class="container-message">
+              <span class="msg">
+                * Your personal and payment<br>
+                information will always remain private           
+              </span>
+            </div>
           </div>
         </div>
-      </div>
-    </form>
+      </form>
+    </div>
   </div>
 
   <div id="settings">
     <div class="scroll">
       <h1>NOTIFICATIONS</h1>
-      <div class="toggle-container">
-        <div class="toggle-row">
-          <div class="caption">
-            <h3>Store</h3>
-            Receive notifications for Store
+      <form>
+        <div class="toggle-container">
+          <div class="toggle-row">
+            <div class="caption">
+              <h3>Store</h3>
+              Receive notifications for Store
+            </div>
+            <div class="toggle">
+              <input type="checkbox" id="store-notifications" name="switch" class="switch">
+              <label for="store-notifications"></label>
+            </div> 
           </div>
-          <div class="toggle">
-            <input type="checkbox" id="store-notifications" name="switch" class="switch">
-            <label for="store-notifications"></label>
-          </div> 
-        </div>
-        <div class="toggle-row">
-          <div class="caption">
-            <h3>Hub</h3>
-            Receive notifications for Hub
+          <div class="toggle-row">
+            <div class="caption">
+              <h3>Hub</h3>
+              Receive notifications for Hub
+            </div>
+            <div class="toggle">
+              <input type="checkbox" id="hub-notifications" name="switch" class="switch">
+              <label for="hub-notifications"></label>
+            </div> 
           </div>
-          <div class="toggle">
-            <input type="checkbox" id="hub-notifications" name="switch" class="switch">
-            <label for="hub-notifications"></label>
-          </div> 
         </div>
-      </div>
+      </form>
     </div>
   </div>
   
@@ -378,70 +409,78 @@
     </div>
 
     <div id="cart_summary">
-      <div class="rows">
-        <script type="text/html" class="template">
-          <div>
-            <img src="{{image}}">
-            <b>{{sku}}</b><br>
-            <span class="title">{{title}}</span>
-            <span class="type">{{type}}</span>
-            <span class="meta">
-              <b>SIZE:</b> {{size}}<br>
-              <b>COLOR:</b> {{color}}<br>
-              <b>QUANTITY:</b> {{quantity}}<br>
-            </span>
-            <span class="price">{{price}}</span>
-          </div>
-        </script>
-      </div>
-      <div>
-        <span class="label">SUB TOTAL</span>
-        <span class="subtotal"></span>
-      </div>
-      <div>
-        <span class="label">ESTIMATED SHIPPING<br>& HANDLING</span>
-        <span class="shipping"></span>
-      </div>
-      <div>
-        <span class="label">TAX</span>
-        <span class="tax"></span>
-      </div>
-      <div>
-        <span class="label">TOTAL</span>
-        <span class="total"></span>
+      <div class="scroll">
+        <div class="rows">
+          <script type="text/html" class="template">
+            <div>
+              <img src="{{image}}">
+              <b>{{sku}}</b><br>
+              <span class="title">{{title}}</span>
+              <span class="type">{{type}}</span>
+              <span class="meta">
+                <b>SIZE:</b> {{size}}<br>
+                <b>COLOR:</b> {{color}}<br>
+                <b>QUANTITY:</b> {{quantity}}<br>
+              </span>
+              <span class="price">{{price}}</span>
+            </div>
+          </script>
+        </div>
+        <div>
+          <span class="label">SUB TOTAL</span>
+          <span class="subtotal"></span>
+        </div>
+        <div>
+          <span class="label">ESTIMATED SHIPPING<br>& HANDLING</span>
+          <span class="shipping"></span>
+        </div>
+        <div>
+          <span class="label">TAX</span>
+          <span class="tax"></span>
+        </div>
+        <div>
+          <span class="label">TOTAL</span>
+          <span class="total"></span>
+        </div>
       </div>
     </div>
     
     <div id="cart_shipping">
-      <div class="select_address">
-        ADDRESS
-      </div>
+      <div class="scroll">
+        <div class="select_address">
+          ADDRESS
+        </div>
       
-      <h3>SHIPPING METHOD</h3>
+        <h3>SHIPPING METHOD</h3>
       
-      <div class="checkbox">
-        <div class="box"></div>
-        <b>STANDARD $10</b>
-        (DELIVERY IN 5-8 WORKING DAYS)
-      </div>
+        <div class="checkbox">
+          <div class="box"></div>
+          <b>STANDARD $10</b>
+          (DELIVERY IN 5-8 WORKING DAYS)
+        </div>
 
-      <div class="checkbox">
-        <div class="box"></div>
-        <b>EXPRESS $20</b>
-        (DELIVERY IN 2-4 WORKING DAYS)
+        <div class="checkbox">
+          <div class="box"></div>
+          <b>EXPRESS $20</b>
+          (DELIVERY IN 2-4 WORKING DAYS)
+        </div>
       </div>
     </div>
 
     <div id="cart_payment">
-      <form>
-        <div class="cc"></div>
-        <div class="address"></div>
-        <span class="msg"></span>
-      </form>
+      <div class="scroll">
+        <form>
+          <div class="cc"></div>
+          <div class="address"></div>
+          <span class="msg"></span>
+        </form>
+      </div>
     </div>
     
     <div id="cart_confirm">
-      <h1>CONFIRM</h1>
+      <div class="scroll">
+        <h1>CONFIRM</h1>
+      </div>
     </div>
     
     <div id="cart_thanks">
@@ -559,7 +598,6 @@
 <script src="js/vendor/flickity.pkgd.js"></script>
 <script src="js/vendor/util.js"></script>
 <script src="js/vendor/view/view.js"></script>
-<script src="js/vendor/view/formview.js"></script>
 <script src="js/vendor/view/router.js"></script>
 <script src="js/vendor/view/scrollable.js"></script>
 <script src="js/vendor/view/serializable.js"></script>
-- 
cgit v1.2.3-70-g09d2