sostler prod commit

author: dumpfmprod <dumpfmprod@ubuntu.(none)> 2010-10-24 20:41:34 -0400
committer: dumpfmprod <dumpfmprod@ubuntu.(none)> 2010-10-24 20:41:34 -0400
commit: 2f166037d567f7215cb7799419da32a74a5d19fe (patch)
tree: ca9e9616e021fd6bc7305db9c306540011d7d875 /static/html
parent: fafbde26383e42858538046d4b2b3691e21bd898 (diff)
2 files changed, 390 insertions, 0 deletions
diff --git a/static/html/search.test.html b/static/html/search.test.html
new file mode 100644
index 0000000..6db9224
--- /dev/null
+++ b/static/html/search.test.html
@@ -0,0 +1,216 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>dump.fm image search</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <meta name="keywords" content="dump.fm,hot girls, hot guys, image chat, realtime, internet 3.0, dump, dump fm, image dump, pictures, image links, image board">
+    <meta name="description" content="dump.fm - Talk with pictures!" />
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
+    <script type="text/javascript" src="http://dump.fm/static/js/jquery-ui-1.8.effects.min.js"></script>
+
+    <script type="text/javascript" src="http://dump.fm/static/js/pichat.js"></script>
+    <link rel="stylesheet" type="text/css" href="http://dump.fm/static/css/dump.css">
+
+
+    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css"
+          type="text/css" media="all" />
+    <link rel="stylesheet" href="http://dump.fm/static/css/admin.css"
+          type="text/css" media="all" />
+    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"
+            type="text/javascript"></script>
+    <script src="http://dump.fm/static/js/admin.js" type="text/javascript"></script>
+
+    <link rel="shortcut icon" href="http://dump.fm/static/favicon.ico">
+
+    <!--[if IE]>
+    <script>
+    window.location = "http://dump.fm/error/ie";
+    </script>
+    <![endif]-->
+  <style>
+  body{margin:6%;}
+  img { max-width: 400px; max-height: 400px;}
+  h1 { width: 40%; display:inline-block; margin: 20px; font-size: 30px;}
+  #content { overflow: visible}
+  #content a { position: relative; display:inline-block; }
+  #content a canvas { position:absolute; z-index: 0; top: 0; left: 0;  }
+  #content a img { position:absolute; z-index: 1; top:0; left: 0; }
+  #content a.animating canvas { display: none }
+  </style>
+  </head>
+  <body class="profile" style="margin:1%;">
+
+  <center>search dumps: <input type="text" name="search-query" id="search-query" /></center><br><br>
+  <center><div id="message"></div><br><br></center>
+  <div id="content">
+</div>
+
+  </body>
+
+
+  <script>
+
+
+  $('#content a').live('hover', function(event) {
+    if (event.type == 'mouseover') {
+		var i = imageCache[this.index]
+		if (i.animated) {
+			i.img.width = Math.floor(i.width / 2)
+			i.img.height = Math.floor(i.height / 2)
+			$(this).addClass("animating")
+			$(this).append(i.img)
+		}
+    } else {
+		var i = imageCache[this.index]
+		if (i.animated) {
+			$(this).removeClass("animating")
+			this.removeChild(i.img)
+		}
+    }
+});
+
+    var term = ""
+    var imagesPerPage = 25;
+    var images = []
+
+    var imageCache = []
+
+    var Search = {};
+
+    function addScript(term){
+      jQuery("#search-script").remove()
+      jQuery("head").append("<scr"+"ipt src='http://dump.fm/cmd/ghettosearch/"+term+"' id='search-script'></sc"+"ript>")
+    }
+
+    function setContent(x){
+      jQuery("#content").html(x)
+    }
+
+    function setMessage(x){
+      jQuery("#message").html(x)
+    }
+
+    Search.searchError = function(error){
+      setContent("")
+      setMessage(error)
+    }
+
+	var LoadedCheckerTimer = 0;
+	function startLoadedChecker(){
+		stopLoadedChecker()
+		LoadedCheckerTimer = setTimeout(loadedChecker, 500)
+	}
+    function loadedChecker(){
+    	for(var j =0; j<imageCache.length; j++){
+    		var i = imageCache[j];
+    		if (i.img.complete && !i.shown) {
+			if (i.img.height == 0 || i.img.height == NaN || i.img.width == 0 || i.img.width == NaN) {
+                           i.shown = true; continue;
+                        }
+    			//console.log("loaded " + i.img.src + " " + i.img.width + "x" + i.img.height)
+
+				i.width = i.img.width
+				i.height = i.img.height
+
+				var width = Math.floor(i.img.width / 2)
+				var height = Math.floor(i.img.height / 2)
+
+				var c = document.createElement("canvas")
+				c.width = width
+				c.height = height
+				c.index = j
+
+				var ctx = c.getContext('2d');
+				ctx.drawImage(i.img, 0, 0, c.width, c.height)
+
+				var a = document.createElement("a")
+				a.index = j
+				a.href = i.img.src
+				a.style.width = width + "px"
+				a.style.height = height + "px"
+				a.id = "imagelink-" + j;
+
+				a.appendChild(c)
+
+				$("#content").append(a)
+
+    			i.shown = true
+    		}
+    	}
+
+    	LoadedCheckerTimer = setTimeout(loadedChecker, 500)
+    }
+    function stopLoadedChecker(){
+    	clearTimeout(LoadedCheckerTimer)
+    }
+
+    function renderPage(num){
+
+		setContent("")
+		delete window['imageCache']
+    	imageCache = []
+
+		var tempLimit = 200;
+		for(var i=0; i<images.length && i<tempLimit; i++) {
+			var img = new Image();
+			img.src = images[i];
+			var animated = (parseUri(img.src)["file"].toLowerCase().substr(-3) == "gif") ? true : false;
+			imageCache.push({"img": img, "shown": false, "animated": animated})
+		}
+		startLoadedChecker();
+
+
+      /*if (images.length > 0)
+        setMessage("page " + (num + 1));
+      var contentString = ''
+      var start = num * imagesPerPage
+      var imageCounter = 0
+      for(var i = start; i < images.length; i++){
+        if(imageCounter > imagesPerPage) break;
+        contentString += '<a href="'+images[i]+'"><img src="'+images[i]+'"></a>'
+        imageCounter += 1
+      }
+      contentString += '<br><br>'
+      if(num > 0)
+        contentString += '<a href="javascript:renderPage('+(num-1)+')"><h1>previous</h1></a> '
+      if (images.length > start + imageCounter)
+        contentString += ' <a href="javascript:renderPage('+(num+1)+')"><h1>next</h1></a>'
+      setContent(contentString)*/
+    }
+
+    Search.searchResult = function(results){
+      images = []
+      if(results === null || results.length == 0) {
+        setContent("")
+        setMessage("no results found")
+      } else {
+        for(var r = 0; r<results.length; r++)
+          images.push(results[r].url)
+        renderPage(0)
+      }
+    }
+
+    var tokens = []
+
+    function doSearch(){
+      term = jQuery("#search-query").val().trim().toLowerCase()
+      var rawTokens = term.split(" ")
+      tokens = []
+      for(var t = 0; t < rawTokens.length; t++) {
+        if (rawTokens[t].length > 2)
+        tokens.push(rawTokens[t])
+      }
+      if (tokens.length == 0) {
+        setMessage("search query too small")
+      } else {
+        setMessage("searching for '"+tokens.join(" and ")+"'")
+        addScript(tokens.join("+"))
+      }
+    }
+
+    jQuery("#search-query").keydown(ifEnter(doSearch))
+
+  </script>
+
+</html>
+
diff --git a/static/html/space.packing.html b/static/html/space.packing.html
new file mode 100644
index 0000000..7f46061
--- /dev/null
+++ b/static/html/space.packing.html
@@ -0,0 +1,174 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>dump.fm image packing test</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <meta name="description" content="dump.fm - Talk with pictures!" />
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
+
+  <style>
+  html,body,img,div{margin:0; border:0; padding:0}
+  img { max-width: 400px; max-height: 400px;}
+  h1 { display:inline-block; margin: 20px; font-size: 30px;}
+  #content { position: relative; width: 100%; }
+  fieldset { display: inline }
+  p { margin-left: 20px; display: inline-block; }
+  </style>
+
+<script>
+
+var marginWidth = 16
+var marginHeight = 16
+
+function go(){
+
+  $("#content").html("")
+
+  columnSize = parseInt($("#settings-columnSize").val()) || 300
+
+  minImageSize = parseInt($("#settings-minSize").val()) || 16
+  maxImageSize = columnSize
+
+
+  columnSpacingStyle = $('input:radio[name=settings-column-spacing]:checked').val();
+
+  getWindowSize()
+  var numColumns = calcColumns()
+  Columns = []
+  for (var i = 0; i < numColumns; i++) {
+    Columns.push({"height": 0})
+  }
+
+  if (columnSpacingStyle == "center") {
+    marginWidth = 16
+    columnSpacingAmt = (Width - (numColumns * (columnSize + marginWidth) + marginWidth)) / 2
+
+  } else if (columnSpacingStyle == "justify")
+    marginWidth = (Width - (numColumns * columnSize)) / (numColumns + 1)
+
+
+  setTimeout(fill, 50)
+}
+
+
+function fill(){
+  var img = randomImage()
+
+  var colIndex = shortestColumn()
+  var col = Columns[colIndex]
+
+  if (col.height > 2 * Height) return;
+
+  if (columnSpacingStyle == "center") {
+    var colLeft = colIndex * (marginWidth + columnSize) + columnSpacingAmt
+    var imgLeft = Math.floor((marginWidth / 2) + (columnSize / 2) - (parseInt(img.style.width) / 2)) + colLeft + "px"
+  } else if (columnSpacingStyle == "justify") {
+    var colLeft = (colIndex * (marginWidth + columnSize))
+    var imgLeft = Math.floor((marginWidth / 2) + (columnSize / 2) - (parseInt(img.style.width) / 2)) + colLeft + "px"
+  }
+
+
+
+  img.style.position = 'absolute'
+  img.style.top = col.height + marginHeight + "px"
+  img.style.left = imgLeft
+
+  col.height += marginHeight + parseInt(img.style.height)
+
+  $("#content").append(img)
+
+  setTimeout(fill, 50)
+
+}
+
+function shortestColumn(){
+  var min = Infinity
+  var mindex = 0
+  for(var i = 0; i< Columns.length; i++){
+      var col = Columns[i]
+      if ( min > col.height) {
+        min = col.height
+        mindex = i
+      }
+  }
+
+  return mindex
+
+
+}
+
+
+
+function randomImage(){
+
+  var d = document.createElement("div")
+  d.style.backgroundColor = "#" + rand16() + rand16() + rand16() + rand16() + rand16() + rand16()
+  d.style.width = Math.floor(Math.random() * (maxImageSize - minImageSize) + minImageSize) + "px"
+  d.style.height = Math.floor(Math.random() * (maxImageSize - minImageSize) + minImageSize) + "px"
+
+  return d
+
+}
+
+function rand16(){
+  return Math.floor(Math.random() * 16).toString(16)
+ }
+
+
+
+
+function calcColumns(){
+  var minMargin = 16
+  var columns = 0;
+  var width = Width - minMargin;
+  var columnSub = columnSize + minMargin
+  while (width > columnSub) {
+    width -= columnSub
+    columns ++
+  }
+
+  return columns
+
+}
+
+function getWindowSize(){
+  Width = $(document).width()
+  Height = $(document).height()
+}
+
+
+
+</script>
+</head>
+  <body>
+
+  <h1> space packing test. </h1>
+  <p>
+  <fieldset><legend>type: <select><option>columns</option></select></legend>
+  <div>
+  <br>column size <input name="settings-columnSize" id="settings-columnSize" type="text" value="200" size="4" />
+  <br>min image size <input name="settings-minSize" id="settings-minSize" type="text" value="40" size="4" />
+  <br>
+    center <input name="settings-column-spacing" value="center" checked="checked" type="radio">
+    justify <input name="settings-column-spacing" value="justify" type="radio">
+  </div>
+  <br><button onclick="go()">go</button>
+  </fieldset>
+
+
+
+
+  </p>
+
+
+
+
+
+  <div id="content"></div>
+
+
+
+
+  </body>
+ </html>
+
author	dumpfmprod <dumpfmprod@ubuntu.(none)>	2010-10-24 20:41:34 -0400
committer	dumpfmprod <dumpfmprod@ubuntu.(none)>	2010-10-24 20:41:34 -0400
commit	2f166037d567f7215cb7799419da32a74a5d19fe (patch)
tree	ca9e9616e021fd6bc7305db9c306540011d7d875 /static/html
parent	fafbde26383e42858538046d4b2b3691e21bd898 (diff)