New fullscreen design

author: Scott Ostler <scottbot9000@gmail.com> 2010-09-04 04:40:19 -0400
committer: Scott Ostler <scottbot9000@gmail.com> 2010-09-04 04:40:19 -0400
commit: 89d4d43bf2d588825ca7916ce34384e06f0ee8a7 (patch)
tree: 3c68949fa8b70165342509b558d2ba26ee8c8133 /template
parent: a3cc24432db0f4a9c9c79731f45e3c03538a432b (diff)
1 files changed, 141 insertions, 89 deletions
diff --git a/template/fullscreen.st b/template/fullscreen.st
index fc57dc0..2f8aab2 100644
--- a/template/fullscreen.st
+++ b/template/fullscreen.st
@@ -1,94 +1,146 @@
 <html>
-<head>
-$head()$
-<title>dump.fm - fullscreen</title>
-<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
-<script src="$domain$/static/js/pichat.js"></script>
-<script src="$domain$/static/js/fullscreen.js"></script>
- <script>
-    jQuery(document).ready(initChat);
-    var Room = $json_room_key$;
-    var Timestamp = $timestamp$;
-    var Version = $version$;
-$if(isadmin)$
-    var IsAdmin = true;
-$else$
-    var IsAdmin = false;
-$endif$
-    if (Nick) {
-      jQuery(document).ready(function() { setupUpload('upload', Room); });
-    }
-    function showAlert() { alert('MUST LOGIN'); }
-    var newwindow;
-    function pop(url) {
+  <head>
+    <title>dump.fm - fullscreen</title>
+    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
+    <script src="$domain$/static/js/pichat.js"></script>
+    <script src="$domain$/static/js/fullscreen.js"></script>
+    <script>
+      var LoggedIn = $if(user_nick)$true$else$false$endif$;
+      var Timestamp = $timestamp$;
+      var newwindow;
+      function pop(url) {
       newwindow=window.open(url,'name','height=50,width=400,left=20,top=20,location=0,status=0,scrollbar=0,resizable=0');
       if (window.focus) {newwindow.focus()}
-    }
-    jQuery(startTitleUpdater);
-    jQuery(initChatMsgs);
-    $if(user_nick)$ //
-    $else$
-    function showAlert() {
-	alert('Join dump.fm @ http://dump.fm/register');
-	}
+      }
+      jQuery(startChatUpdater);
+    </script>
+    <style>
+      html, body, div, img { margin: 0; padding: 0; border: 0; overflow: hidden; font-family: Monaco, "Courier New", Courier, monospace; }
+      input {
+          font-family: Monaco, "Courier New", Courier, monospace;
+      }
+      #big-image img {
+          width: 100%; height: 100%;
+          cursor: pointer;
+          box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
+      }
+      #loginbox {
+          background: white;
+          z-index: 999;
+          position: absolute;
+          display: none;
+      }
+      #logininner {
+          width: 30em;
+          height: 20em;
+          position: relative;
+      }
+      #infocol {
+          width: 50%;
+          float: left;
+          position: relative;
+      }
+      #formcontainer {
+          padding: 0;
+          margin-top: 20%;
+          width: 80%;
+          position: relative;
+      }
+      #nickInput, #passwordInput {
+          width: 100%;
+      }
+      #piccol {
+          width: 50%;
+          float: right;
+          position: relative;
+      }
+      #loginimg {
+          width: 75%;
+          margin-top: 20%;
+      }
+      #spinner { display: none; }
+      #forgetpw {
+          position: absolute;
+          left: 5px;
+          bottom: 5px;
+          font-size: 80%;
+      }
+      #fav-indicator {
+          display: none;
+          position: fixed;
+          z-index: 999;
+          height: 150px;
+          width: 150px; 
+          left: 20px;
+          top: 20px;
+      }
+      #errormsg {
+          position: relative;
+          color: red;
+          text-align: center;
+          margin-top: 250px;
+      }
 
-$endif$
-  </script>
-<style>
-html, body, div, img { margin: 0; padding: 0; border: 0; overflow: hidden; }
-#controls { display: none; }
-#big-image img { width: 100%; height: 100%;}
-#big-image{font-size:120px;text-align: justify; text-justify: newspaper;   text-shadow: 1px 1px #eee, 2px 2px #f0e, 3px 3px #eee,4px 4px #f0e,5px 5px #eee, 3px 3px #eee,4px 4px #f0e,5px 5px #eee,6px 6px #f0e,6px 6px #eee,7px 7px #f0e,7px 7px #eee,8px 8px #f0e,8px 8px #eee,9px 9px #f0e,9px 9px #eee;	font-family: Monaco, "Courier New", Courier, monospace;color:#fff}
-#tools-button{position:absolute;height:10px;width:10px;background-color:#eee;bottom:37px;left:2px;}
-#msgInputDiv{display:none;}
+      #loginclose {
+          position: absolute;
+          right: 3px;
+          top: 3px;
+      }
+      #big-image{font-size:120px;text-align: justify; text-justify: newspaper;   text-shadow: 1px 1px #eee, 2px 2px #f0e, 3px 3px #eee,4px 4px #f0e,5px 5px #eee, 3px 3px #eee,4px 4px #f0e,5px 5px #eee,6px 6px #f0e,6px 6px #eee,7px 7px #f0e,7px 7px #eee,8px 8px #f0e,8px 8px #eee,9px 9px #f0e,9px 9px #eee; color:#fff}
+      #memelogo { position: fixed; z-index: 999; bottom: 30px; right: 80px; }
+      .sublogo { font-family: Monaco, "Courier New", Courier, monospace; }
+      a { color:#000 }
+    </style>
+    <script>jQuery(initLogin)</script>
+  </head>
+  <body>
+     <div id="loginbox">
+       <div id="logininner">
+         <div id="infocol">
+           <center>
+           <div id="formcontainer">
+             <form onsubmit="login(); return false;">
+             <div align="left">username</div>
+             <div><input id="nickInput"></div>
+             <br>
+             <div align="left">password</div>
+             <div><input id="passwordInput" type="password"></div>
+             <div align="right" style="font-size: 80%">remember me? <input id="remembermeInput" type="checkbox" checked="true"></div>
+             <br>
+             <div>
+               <center><input type="submit" value="LOGIN"></center>
+               <img id="spinner" src="/static/img/spinner.gif">
+             </div>
+             </form>
+           </div>
+           </center>
+         </div>
+         <div id="piccol">
+           <center><img id="loginimg" src="/static/img/danceman.gif"></center>
+           <center><i>join the party</i></center>
+         </div>
+         <div id="errormsg"></div>
+         <div id="forgetpw"><a href="$domain$/reset">forgot password?</a></div>
+         <div id="loginclose"><a href="#" onclick="jQuery('#loginbox').hide(); return false;">X</a></div>
+       </div>
+     </div>
 
-#msgInputDiv {
-	position:fixed;
-	min-width:500px;
-	z-index:100;
-left:3px;opacity:0.5;
-bottom: 0px;
-	width: 100%;
-}
-
-#msgInput {
-	z-index:100;
-	left:-3px;border:1px solid #000;
-    position:relative;border-right:0px;
-height:35px;
-font-size:20px;
-    min-width:500px;padding-right:38px;padding-left:1px;
-		box-shadow: 2px 3px 4px #eee;
-}
-.msgInput {
-    min-width:500px;width:100%;
-	z-index:100;background-color:#eff5fb;
-}
-#msginputrapper{
-margin-right:0;
-height:35px;
-
-}
-.memelogo{padding:0px;top:0px;position:absolute;}
-#fullscreen-logo {
-
-    position: fixed;
-    z-index: 999;
-    bottom: 60px;
-    right: 200px;
-}
-</style>
-</head>
-<body>
-<a id="fullscreen-logo" href="http://dump.fm">
-<img src="http://dump.fm/static/img/dumppixelhover.png"class="memelogo">
-</a>
-<div id="big-image">waiting 4 new image from dump.fm.............</div>
-<div id="controls"></div>
-<script>
-Timestamp = $timestamp$;
-initFullscreen()
-</script>
-$google_analytics()$
-</body>
-</html>
-\ No newline at end of file
+    <div id="memelogo">
+      <a href="http://dump.fm"><img src="http://dump.fm/static/img/dumppixelhover.png" class="memelogo"></a>
+      <br><br>
+      <div class="sublogo">
+      $if(user_nick)$
+      click to fav
+      $else$
+      <a href="#" onclick="showLogin(); return false;">LOGIN</a> | <a href="$domain$/register">REGISTER</a>
+      $endif$
+      </div>
+    </div>
+    <div id="big-image">waiting 4 new image from dump.fm.............</div>
+    <img src="/static/img/thumbs/heartfaved.gif" id="fav-indicator">
+    <script>
+      initFullscreen()
+    </script>
+    $google_analytics()$
+  </body>
+</html>
author	Scott Ostler <scottbot9000@gmail.com>	2010-09-04 04:40:19 -0400
committer	Scott Ostler <scottbot9000@gmail.com>	2010-09-04 04:40:19 -0400
commit	89d4d43bf2d588825ca7916ce34384e06f0ee8a7 (patch)
tree	3c68949fa8b70165342509b558d2ba26ee8c8133 /template
parent	a3cc24432db0f4a9c9c79731f45e3c03538a432b (diff)