v3.1

- Cleanup - Modal Dialogs - Schedule now built-in table instead of embed. - Other Misc.
bgiesing · Jul 17, 2015 · 44dd46f · 44dd46f
1 parent b1603f8
commit 44dd46f
Showing 1 changed file with 71 additions and 22 deletions.
diff --git a/index.html b/index.html
@@ -13,22 +13,6 @@
   <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
   <link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css" type="text/css" rel="stylesheet" media="screen,projection">
   <link href="style.css" type="text/css" rel="stylesheet" media="screen,projection">
-
-
-  <SCRIPT LANGUAGE="JavaScript">
- <!-- Begin
- function popUp(URL) {
- day = new Date();
- id = day.getTime();
- eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=1,width=295,height=389,left = 650,top = 375');");
- }
- // End -->
- </script>
-
-  <script type="text/javascript" async="true" 
-    id="tkf_embed" src="https://tockify.com/_tockify.embed.js">
-  </script>
-
 </head>
 <body>
   <header>
@@ -78,11 +62,72 @@
         <h5 class="header col s12 light">Unique Radio. 24/7.</h5>
       </div>
       <div class="row center">
-        <a href="https://tockify.com/voxvariety" class="btn-large waves-effect waves-light amber darken-2 tockify-link" style="margin-right: 5px;"><i class="material-icons left">today</i>Schedule</a>
-        <a href="https://webmenu.org/apps/vox-variety" class="btn-large waves-effect waves-grey grey lighten-5"><i class="material-icons left grey-text text-lighten-1" style="margin-left: -10px;">add</i><img class="center" style="padding-top: 17px; margin-left: -10px; margin-right: -10px;" src="https://d2avfbmbvwlo8q.cloudfront.net/assets/logo_5-1ccea9940734e4845fc16ecdff1f1d42.png"></img></a>
+        <a href="#schedule" class="btn-large waves-effect waves-light amber darken-2 modal-trigger"><i class="material-icons left">today</i>Schedule</a>
       </div>
-      <br><br>
+      <div class="row center">
+      <a href="https://webmenu.org/apps/vox-variety" class="btn-large waves-effect waves-grey grey lighten-5"><i class="material-icons left grey-text text-lighten-1" style="margin-left: -10px;">add</i><img class="center" style="padding-top: 17px; margin-left: -10px; margin-right: -10px;" src="https://d2avfbmbvwlo8q.cloudfront.net/assets/logo_5-1ccea9940734e4845fc16ecdff1f1d42.png"></img></a>
+      </div>
+    </div>
+  </div>
+
+  <!-- Modal Structure -->
+  <div id="schedule" class="modal modal-fixed-footer">
+    <div class="modal-content">
+        <table class="responsive-table bordered" style="width: 100%; height: 100%;">
+        <thead>
+          <tr>
+              <th data-field="time">Time</th>
+              <th data-field="name">Block</th>
+          </tr>
+        </thead>
+
+        <tbody>
+          <tr>
+            <td>5-8am</td>
+            <td>Today's Hits</td>
+          </tr>
+          <tr>
+            <td>8-11am</td>
+            <td>Vox Faves</td>
+          </tr>
+          <tr>
+            <td>11am-2pm</td>
+            <td>Classical Time</td>
+          </tr>
+          <tr>
+            <td>2-5pm</td>
+            <td>Cookin' Up Country</td>
+          </tr>
+          <tr>
+            <td>5-8pm</td>
+            <td>Today's Hits</td>
+          </tr>
+          <tr>
+            <td>8-11pm</td>
+            <td>Vox Faves</td>
+          </tr>
+          <tr>
+            <td>11pm-2am</td>
+            <td>Dance Club</td>
+          </tr>
+          <tr>
+            <td>2-5am</td>
+            <td>Cookin' Up Country</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <div class="modal-footer">
+      <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">Close</a>
+    </div>
+  </div>
 
+  <div id="request" class="modal bottom-sheet modal-fixed-footer">
+    <div class="modal-content">
+      <iframe src='https://docs.google.com/forms/d/1Aciq2LEErqarK0-XAfb93hqAuBbpEwhnvvBfd5xfBno/viewform?embedded=true' style="overflow: hidden;" width="100%" height="100%" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>
+    </div>
+    <div class="modal-footer">
+      <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">Close</a>
     </div>
   </div>
 
@@ -92,7 +137,7 @@ <h5 class="header col s12 light">Unique Radio. 24/7.</h5>
     </a>
     <ul>
       <li>
-        <a href="https://docs.google.com/forms/d/1Aciq2LEErqarK0-XAfb93hqAuBbpEwhnvvBfd5xfBno/viewform" class="btn-floating amber darken-2">
+        <a href="#request" class="btn-floating amber darken-2 modal-trigger">
           <i class="material-icons" title="Suggest a Song">playlist_add</i>
         </a>
       </li>
@@ -116,8 +161,12 @@ <h5 class="header col s12 light">Unique Radio. 24/7.</h5>
   // Initialize collapse button
   $(".button-collapse").sideNav();
   // Initialize collapsible (uncomment the line below if you use the dropdown variation)
-  //$('.collapsible').collapsible();
+  $('.collapsible').collapsible();
+  // Initialize Modals
+  $(document).ready(function(){
+    // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
+    $('.modal-trigger').leanModal();
+  });
   </script>
-
   </body>
 </html>