Bunch of work on the HTML.

icculus · Jul 4, 2010 · 28bee70 · 28bee70
1 parent 13bef14
commit 28bee70
Show file tree

Hide file tree

Showing 4 changed files with 63 additions and 4 deletions.
diff --git a/globalheader_bg.jpg b/globalheader_bg.jpg
diff --git a/index.html b/index.html
@@ -107,10 +107,10 @@
 
 
 $(document).ready(function(){
-    var user = 'icculus';  // !!! FIXME
+return;
     $.ajax({
         type: "GET",
-        url: "steamprofile.php?user=" + user,
+        url: "steamprofile.php",
         dataType: "xml",
         error: function(XMLHttpRequest, textStatus, errorThrown) {
                     var html = "<center><font color='#FF0000'>" +
@@ -122,6 +122,17 @@
         success: function(xml) { profile = process_steam_profile(xml); render(); }
     });
 });
+
+function clear_filter_textbox()
+{
+    var widget = $('input.tagfilter');
+    if (widget && !widget.attr('filter_cleared'))
+    {
+        widget.attr('filter_cleared', true);
+        widget.val('');
+    } // if
+} // clear_filter_textbox
+
 -->
     </script>
   </head>
@@ -136,8 +147,15 @@
         </center>
     </div>
     <div class='main'>
-      <img class='avatar' src='loading.gif'/>
-      <div class='nickname' style='display:inline;'>Loading your steam profile...</div>
+      <div id="global_header"> 
+        <img class='avatar' src='loading.gif'/>
+        <div class='nickname'>Loading your steam profile...</div>
+        <div class='searchbox'> 
+          <input class='tagfilter' name='filter' type='text'
+                 onFocus='clear_filter_textbox();' 
+                 value='Enter filter tags' size='22' autocomplete='off'/>
+        </div>
+    </div>
       <table class='gametable'><tbody></tbody></table>
     </div>
   </body>

diff --git a/store_header_search.png b/store_header_search.png
diff --git a/style.css b/style.css
@@ -58,6 +58,19 @@ h5 {
 	text-transform: uppercase;
 }
 
+div#global_header {
+	background-image: url(globalheader_bg.jpg);
+	background-color: #000000;
+	border-bottom: 1px solid #4D4B48;
+	background-position: center top;
+}
+
+div.nickname {
+	display: inline;
+	font-size: 30px;
+	font-weight: normal;
+}
+
 div.main {
 	background-image: url(content_bg.png);
 	background-repeat: repeat-x;
@@ -68,6 +81,10 @@ td.gamecell {
 	vertical-align: middle;
 }
 
+img.avatar {
+	padding: 3px;
+}
+
 div.loginpopover {
     position: absolute;
     left: 10%;
@@ -79,3 +96,27 @@ div.loginpopover {
     visibility: hidden;
 }
 
+.searchbox {
+	background-image: url(store_header_search.png);
+	float: right;
+	color: #a6a5a2;
+	width: 253px;
+	height: 27px;
+	position: relative;
+	z-index: 250;
+}
+
+.searchbox input {
+	border: none;
+	background-color: #4a4746;
+	color: #cdc9c0;
+	margin-top: 5px;
+	margin-left: 8px;
+	width: 206px;
+	outline: none;
+}
+
+.searchbox input.default {
+	font-style: italic;
+}
+