User:Bill Flanagan/Google Image Search

From OpenWetWare
Jump to navigationJump to search

Demonstration: Google Image Search

This search page is a VERY preliminary example of how we can incorporate Google Image Lookup into OWW.

An important missing element is in how we take advantage of the OWW information about returned Images and use that to display the pages in a way closer to the way the current MediaWiki gallery functions.

One point: the search is not exclusively looking at OWW images either: you'll see external links scattered amid the OWW images.


OWW/Google Image Search

<html> 

   <script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key=internal-sample" type="text/javascript"></script>
   <link href="http://www.google.com/uds/css/gsearch.css" rel="stylesheet" type="text/css"/>
   <style type="text/css">
     table.search-control {
       width : 100%;
     }
     table.search-control .gsc-control {
       width : 100%;
     }
     td {
       vertical-align : top;
     }
     /* Disable built in search forms */
     .gsc-control form.gsc-search-box {
       display : none;
     }
     /* restrict global search form width */
     #searchForm {
       width : 300px;
     }
     /* for demonstration purposes ONLY. This is not ok by the terms */
     #rightSearchControl .gsc-ad-box {
       display : none;
     }
     /* long form visible urls should be on */
     .gsc-webResult div.gs-visibleUrl-long {
       display : block;
     }
     .gsc-webResult div.gs-visibleUrl-short {
       display : none;
     }
   </style>
   <script type="text/javascript">
     <!--
     // the se class encapsulates a left and right search control
     // both controls are driven by a shared search form
     function se() {
       var sFormDiv = document.getElementById("searchForm");
       var rightScDiv = document.getElementById("rightSearchControl");

       // create a ight search control
       // create a custom search form
       this.rightControl = new GSearchControl();
       this.searchForm = new GSearchForm(true, sFormDiv);

       // bind clear and submit functions
       this.searchForm.setOnSubmitCallback(this, se.prototype.onSubmit);
       this.searchForm.setOnClearCallback(this, se.prototype.onClear);

       // set up for large result sets
       this.rightControl.setResultSetSize(GSearch.LARGE_RESULTSET);

       var searcher;
       var options;

       // configure right control

       // tabbed layout image, web, news, video
       this.rightControl.addSearcher(new GimageSearch());

       var drawOptions = new GdrawOptions();

       drawOptions.setDrawMode(GSearchControl.DRAW_MODE_TABBED);
       this.rightControl.setNoResultsString(GSearchControl.NO_RESULTS_DEFAULT_STRING);
       this.rightControl.draw(rightScDiv, drawOptions);
       // execute a starter search
       this.searchForm.execute("");
     }
     // when the form fires a submit, grab its
     // value and call the right control
     se.prototype.onSubmit = function(form) {
       var q = form.input.value;
       if (!q)
         return false;
       if (q!= "") {
         this.rightControl.execute("Openwetware " + q);
       }
       return false;
     }
     // when the form fires a clear, call the left and right control
     se.prototype.onClear = function(form) {
       this.rightControl.clearAllResults();
       form.input.value = "";
       return false;
     }
     function OnLoad() {
       new se();
     }
     GSearch.setOnLoadCallback(OnLoad);
     // -->
   </script>

   <div id="searchForm">Loading...</div>
   <table class="search-control">
     <td class="right">
       <div id="rightSearchControl" class="search-control">Loading...</div>
     </td>
   </table>

</html>


Comments

  1. 13:11, 11 May 2008 (EDT)I cleaned up the formatting to make this look like an OWW page.


Local lookup of returned image information

One possibility is to intercept the opening of the image so that we can do the following:

  • Get the image name
  • Lookup the name of the Image: page related to the image
  • Show the name of the image page as a clickable entity
  • Lookup the Wiki pages linked to the page
  • Allow navigation to the specific page

Just thinking...

Retrieved from "https://openwetware.org/mediawiki/index.php?title=User:Bill_Flanagan/Google_Image_Search&oldid=204279"