better search

2 files changed, 208 insertions, 22 deletions

diff --git a/static/css/dump.css b/static/css/dump.css
index 4a914e0..2cb9833 100755
--- a/static/css/dump.css
+++ b/static/css/dump.css
@@ -434,7 +434,7 @@ a.msg-image-zoom img.zoom-icon:hover {
 #searchbox{
     position:absolute;
     top:18px;
-    right:36px;
+    right:100px;
 }
 
 #search-query{
@@ -443,11 +443,12 @@ a.msg-image-zoom img.zoom-icon:hover {
     color: #C0C8D3;
     font-size: 13px;
     padding: 3px 12px 3px 37px;
-    padding-left: 37px;
-    text-indent:5px;
-    border-radius: 50px;
-    -webkit-border-radius: 50px;
-    -moz-border-radius: 50px;
+    padding-left: 10px;
+    ztext-indent:5px;
+    border-radius: 8px;
+    -webkit-border-radius: 8px;
+    -moz-border-radius: 8px;
+    width: 150px;
 }
 
 .search_icon  {
@@ -461,29 +462,69 @@ a.msg-image-zoom img.zoom-icon:hover {
     top:3px;
     width:32px;
 }
+#search-results{
+  position: absolute;
+  top:55px;
+  width:100%;
+  text-align: center;
+  left: 0;
+}
 
-#searchresults{
-    top:50px;
-    overflow:auto;
-    position:fixed;background-image:url(/static/img/bg.dither.gif);
-    background-color:#eee;
-    width:100%;
-    min-width:600px;
-    border-bottom:1px solid #000;
-    left:-1px;
-    margin-top:-1px;
+#search-results-images{
+  display: none;
+  overflow:auto;
+  background-image:url(/static/img/bg.dither.gif);
+  background-color:#eee;
+  width:95%;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: -22px;
+  padding-top: 30px;
+  -moz-box-shadow: 0 0 10px #D8DBDE, 0 0 2px #000000;
+  -webkit-box-shadow: 0 0 10px #D8DBDE, 0 0 2px #000000;
+  box-shadow: 0 0 10px #D8DBDE, 0 0 2px #000000;
+  border-radius: 8px;
+  -webkit-border-radius: 8px;
+  -moz-border-radius: 8px;    
 }
-#searchresults img{
-    max-width:300px;
-    width: expression(this.width > 300 ? 300: true);
-    max-height:50px;
-    height: expression(this.width > 300 ? 300: true);
+#search-results-images img{
     max-width:300px;
+    max-height:100px;
     border:1px solid #eee;
-    float:left;
+    float:right;
     display:inline;
     margin-right:10px;
 }
+#search-controls {
+  width: 95%;
+  margin-left: auto;
+  margin-right: auto;
+  position: relative;
+  text-align: right;
+  display: none;
+  top: 0;
+  padding-right: 8px;
+}
+#search-control-text {
+  font-size: medium;
+  padding: 4px;
+}
+#search-controls a {
+  -moz-box-shadow: 0 0 10px #D8DBDE, 0 0 2px #000000;
+  -webkit-box-shadow: 0 0 10px #D8DBDE, 0 0 2px #000000;
+  box-shadow: 0 0 10px #D8DBDE, 0 0 2px #000000;
+  border-radius: 8px;
+  -webkit-border-radius: 8px;
+  -moz-border-radius: 8px;
+  padding: 4px;
+}
+#search-message {
+  display: inline;
+  font-size: medium;
+}
+#search-control-previous, #search-control-next {
+  visibility: hidden;
+}
 
 
 /* pichat.css */
diff --git a/static/js/pichat.js b/static/js/pichat.js
index 44db3cf..de078f6 100644
--- a/static/js/pichat.js
+++ b/static/js/pichat.js
@@ -482,6 +482,8 @@ function refresh() {
 }
 
 function initChat() {
+  Search.init()
+  
     $('.oldmsg').each(function() {
         var dump = $(this);
         var content = dump.find(".content")
@@ -556,6 +558,7 @@ function enableProfileEdit() {
 }
 
 function initProfile() {
+  Search.init()
     $(".linkify").each(function() {
         var text = jQuery(this).text();
         jQuery(this).html(linkifyWithoutImage(text));
@@ -571,6 +574,7 @@ function initProfile() {
 };
 
 function initLog() {
+  Search.init()
     $('.logged-dump .content').each(function() {
         var t = $(this);
         t.html(buildMsgContent(t.text()));
@@ -771,6 +775,146 @@ function setupUploadAvatar(elementId) {
     });
 }
 
+var Search = {
+  
+  'term': "",
+  'imagesPerPage': 25,
+  'images': [],
+  'tokens': [],
+  
+  'init': function(){
+    $("#search-query").val("search dump.fm")
+    $("#search-query").focus(function(){
+      if ($("#search-query").val() == 'search dump.fm')
+        $("#search-query").val("")
+    })
+    $("#search-query").blur(function(){
+      if ($("#search-query").val().trim() == '')
+        $("#search-query").val("search dump.fm")
+    })
+    $("#search-query").keydown(ifEnter(Search.doSearch))
+  },
+
+  'addScript': function(term) {
+    $("#search-script").remove()
+    $("head").append("<scr"+"ipt src='/cmd/ghettosearch/"+term+"' id='search-script'></sc"+"ript>")
+  },
+  'setContent': function(x){
+    $("#search-results-images").html(x)
+  },
+  'setMessage': function(x){
+    $("#search-controls").css("display", "block")
+    $("#search-control-text").html(x)
+  },
+  'searchError': function(error){
+    Search.setContent("")
+    $('#search-control-previous').css("visibility", "hidden")
+    $('#search-control-next').css("visibility", "hidden")
+    Search.setMessage(error)
+  },
+
+  'doSearch': function(){
+    term = $("#search-query").val().trim().toLowerCase()
+    var rawTokens = term.split(" ")
+    Search.tokens = []
+    for(var t = 0; t < rawTokens.length; t++) {
+      if (rawTokens[t].length > 2)
+        Search.tokens.push(rawTokens[t])
+    }
+    if (Search.tokens.length == 0) {
+      Search.setMessage("search query too small")
+    } else {
+      Search.setMessage("searching for '"+Search.tokens.join(" and ")+"'")
+      Search.addScript(Search.tokens.join("+"))
+    }
+  },
+
+  'renderPage': function(num){
+    $("#search-results-images").css("display", "block")
+    $("#search-controls").css("display", "block")
+    if (Search.images.length > 0)
+        Search.setMessage("results for '"+Search.tokens.join(" and ")+"' (page " + (num + 1) + ")");
+    var contentString = ''
+    var start = num * Search.imagesPerPage
+    var imageCounter = 0
+    for(var i = start; i < Search.images.length; i++){
+        if(imageCounter > Search.imagesPerPage) break;
+        contentString += '<a href="'+Search.images[i]+'" target="_blank" onclick="return Search.addToChatBoxIfPossible(this)"><img src="'+Search.images[i]+'"></a>'
+        imageCounter += 1
+    }
+    contentString += '<br><br><div id="search-commands">'
+    if(num > 0) {
+      $('#search-control-previous').attr("href", 'javascript:Search.renderPage('+(num-1)+')')
+      $('#search-control-previous').css("visibility", "visible")
+    } else {
+      $('#search-control-previous').attr("href", 'javascript:void()')
+      $('#search-control-previous').css("visibility", "hidden")
+    }
+    
+    if (Search.images.length > start + imageCounter) {
+      $('#search-control-next').attr("href", 'javascript:Search.renderPage('+(num+1)+')')
+      $('#search-control-next').css("visibility", "visible")
+    } else {
+      $('#search-control-next').attr("href", 'javascript:void()')
+      $('#search-control-next').css("visibility", "hidden")
+    }
+    Search.setContent(contentString)
+  },
+
+  'addToChatBoxIfPossible': function(img){
+    var chatBoxExists = $("#msgInput").length
+    if (chatBoxExists) {
+      var chatText = $("#msgInput").val()
+      if (chatText.length && chatText[chatText.length - 1] != " ")
+        chatText += " "
+      chatText += $(img).attr("href") + " "
+      $("#msgInput").val(chatText)
+      $("#msgInput").focus().val($("#msgInput").val()) //http://stackoverflow.com/questions/1056359/
+      return false
+    } else return true
+  },
+
+  'searchResult': function(results){
+    Search.images = []
+    var alreadyGot = {}
+    if(results === null || results.length == 0) {
+        Search.setContent("")
+        Search.setMessage("no results found")        
+    } else {
+        for(var r = 0; r<results.length; r++){
+          var content = results[r]['content']
+          if (content.substring(0,6) == "<safe>") continue; // skip html posts
+          var imageUrls = getImagesAsArray(content);
+          for (var i=0; i<imageUrls.length; i++){
+	          var imageUrl = imageUrls[i];
+	          if (imageUrl in alreadyGot) continue;
+	          alreadyGot[imageUrl] = true
+	          var validImage = true;
+	          for(var t = 0; t<Search.tokens.length; t++){
+	            if (imageUrl.toLowerCase().indexOf(Search.tokens[t]) == -1) {
+		            validImage = false;
+		            break;
+	            }
+	          }
+	          if (validImage)
+	            Search.images.push(imageUrl);
+          }
+        }
+        if (Search.images.length == 0) {
+            Search.setMessage("no results found")  
+        }
+        Search.renderPage(0)
+    }
+  },
+  'close': function(){
+    Search.setContent("")
+    $("#search-results-images").css("display", "none")
+    $("#search-controls").css("display", "none")
+  }
+  
+
+}
+
 
 // scrolling stuff
 // this code keeps the div scrolled to the bottom, but will also let the user scroll up, without jumping down
@@ -821,6 +965,7 @@ function initDirectory() {
         var t = $(this);
         t.html(buildMsgContent(t.text()));
     });
+  Search.init()
 }
 
 //big hand stuff