@@ -1,75 +1,39 @@ -<!DOCTYPE html public "-//W3C/DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> +<!DOCTYPE html public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>Trogdor: Burninatingly fast search using Yahoo! BOSS</title> <style type="text/css"> - body { - background: #fff; - color: #000; - font: 10pt Helvetica, Arial, sans-serif; - } + body { background: #fff; color: #000; font: 10pt Helvetica, Arial, sans-serif; margin: 0; min-width: 430px; } + form { margin: 0; } - h1 { font-size: 1.5em; } - h2 { font-size: 1.2em; } + #hd, #bd, #ft { padding: 1em; } + #hd { background: #dee4ee; border-bottom: 1px solid #5c6f90; } + #hd h1 { font-size: 1.5em; float: right; margin: 0.05em 1em; } + #hd .subtitle { clear: left; margin: 0; float: right; } - #bd { - border-top: 1px solid #dfdfdf; - margin-top: 1.5em; - } + #ft { background: #f6f6f6; border: 1px solid #dfdfdf; margin: 1em; padding: 0.6em; } + #ft a { color: #0000ff; } + #ft h2 { font-size: 1.1em; margin: 0; } + #ft p { margin: 0.6em 0 0; } - #forkme { - background: #f6f6f6; - border: 1px solid #dfdfdf; - margin: 2em 0; - padding: 0.6em; - } + #q { width: 25em; } - #forkme a { color: #0000ff; } + #web { margin: 1em 0; padding: 0; max-width: 600px; } + #web a:focus { outline: #72A7FF solid 2px; } + #web li { color: #666; font-style: italic; list-style: none; } + #web li.res { color: #000; font-style: normal; margin-bottom: 1em; } + #web li.res cite { color: #006600; font-style: normal; } + #web li.res h3 { font-size: 1.2em; font-weight: normal; margin: 0; } - #forkme h2 { - font-size: 1.1em; - margin: 0; - } - - #forkme p { margin: 0.6em 0 0; } - - #q { width: 30em; } - - #web { - list-style: none; - margin: 1em 0; - padding: 0; - } - - #web li { - color: #666; - font-style: italic; - } - - #web li.res { - color: #000; - font-style: normal; - margin-bottom: 1em; - } - - #web li.res cite { - color: #006600; - font-style: normal; - } - - #web li.res h3 { - font-size: 1.2em; - font-weight: normal; - margin: 0; - } + .off-left { left: -9999px; position: absolute; } </style> <link rel="search" type="application/opensearchdescription+xml" href="opensearch.xml" title="Trogdor"> </head> <body> <div id="hd"> - <h1>Trogdor: Burninatingly fast search using Yahoo! BOSS</h1> + <h1 title="Burninatingly fast search using Yahoo! BOSS">Trogdor</h1> <form action="http://search.yahoo.com/search" method="get"> <div> @@ -78,8 +42,8 @@ <noscript> <p> - Instant search results are unavailable because JavaScript is - disabled. + Instant search results are unavailable because JavaScript is + disabled. </p> </noscript> </div> @@ -87,7 +51,7 @@ </div> <div id="bd"> - <h2>Results</h2> + <h2 class="off-left">Web Results</h2> <ol id="web"> <li> Type a search query above, then use the up and down arrow keys to @@ -96,7 +60,7 @@ </ol> </div> - <div id="forkme"> + <div id="ft"> <h2>Fork Me!</h2> <p> @@ -106,7 +70,7 @@ </p> </div> - <script src="js/trogdor-min.js"></script> - <script>Trogdor.init('C82ywM3V34FSPr8EUqeE61WL6zQ1psBVArWY62MoVxyuljPRIfkcdnWSKDTKBuTkFsyMAkvp9Q--', 'q', 'web');</script> + <script src="js/trogdor-min.js" type="text/javascript"></script> + <script type="text/javascript">Trogdor.init('C82ywM3V34FSPr8EUqeE61WL6zQ1psBVArWY62MoVxyuljPRIfkcdnWSKDTKBuTkFsyMAkvp9Q--', 'q', 'web');</script> </body> </html> index.html @@ -1 +1 @@ -var Trogdor=function(){var j=document,m=window,h=-1,o,n,k,p,l,a;function b(d){if(d&&(d.nodeType||d.item)){return d}return j.getElementById(d)}function g(q,d,r){q=b(q);if(!q){return}if(m.addEventListener){q.addEventListener(d,r,false)}else{if(m.attachEvent){q.attachEvent("on"+d,r)}}}function f(d){if(d.preventDefault){d.preventDefault()}else{if(d.returnValue){d.returnValue=false}}}function i(t){if(!t||!t.ysearchresponse){return}var s="",r=t.ysearchresponse.resultset_web,q,d;if(r&&r.length){for(q=0;q<r.length;++q){d=r[q];s+='<li class="res"><h3><a href="'+d.clickurl+'">'+d.title+'</a></h3><div class="abstract">'+d["abstract"]+"</div><cite>"+d.dispurl+"</cite></li>"}}else{s="<li>No results</li>"}k.innerHTML=s}function e(q,d){var r;for(r in d){if(d.hasOwnProperty(r)){q=q.replace("{"+r+"}",d[r])}}return q}function c(q){q=q||m.event;switch(q.keyCode){case 27:f(q);h=-1;n.focus();break;case 38:f(q);if(h-1<=-1){h=-1;n.focus()}else{h-=1;try{k.childNodes[h].firstChild.firstChild.focus()}catch(d){h+=1}}break;case 40:f(q);if(h+1<k.childNodes.length){h+=1;try{k.childNodes[h].firstChild.firstChild.focus()}catch(d){h-=1}}break}}p={BOSS_URL:"http://boss.yahooapis.com/ysearch/web/v1/{query}?appid={appid}&format=jsonp&callback={callback}",results:{},init:function(r,s,q){var d;o=r;n=b(s);k=b(q);if(!n.value){if(d=m.location.search.match(/(?:\?|&)q=([^&]+)/)){n.value=decodeURIComponent(d[1].replace(/\+/g," "))}}if(n.value){p.search(n.value)}g(n,"keyup",function(){p.search(n.value)});g(n,"focus",function(){h=-1});g(j,"keydown",c);n.focus()},search:function(d){d=d.replace(/^\s+|\s+$/g,"");if(!d){return}if(p.results.hasOwnProperty(d)){i(p.results[d]);return}if(l){l.parentNode.removeChild(l)}l=j.createElement("script");l.src=e(p.BOSS_URL,{appid:encodeURIComponent(o),callback:"Trogdor.response",query:encodeURIComponent(d)});p.response=function(q){p.results[d]=q;i(q);if(l){l.parentNode.removeChild(l);l=null}};j.body.appendChild(l)}};return p}(); \ No newline at end of file +var Trogdor=function(){var i=document,l=window,g=-1,n,m,j,o,k;function a(d){if(d&&(d.nodeType||d.item)){return d}return i.getElementById(d)}function f(p,d,q){p=a(p);if(!p){return}if(l.addEventListener){p.addEventListener(d,q,false)}else{if(l.attachEvent){p.attachEvent("on"+d,q)}}}function e(d){if(d.preventDefault){d.preventDefault()}else{if(d.returnValue){d.returnValue=false}}}function h(s){if(!s||!s.ysearchresponse){return}var r="",q=s.ysearchresponse.resultset_web,p,d;if(q&&q.length){for(p=0;p<q.length;++p){d=q[p];r+='<li class="res"><h3><a href="'+d.clickurl+'">'+d.title+'</a></h3><div class="abstract">'+d["abstract"]+"</div><cite>"+d.dispurl+"</cite></li>"}}else{r="<li>No results</li>"}j.innerHTML=r}function c(p,d){var q;for(q in d){if(d.hasOwnProperty(q)){p=p.replace("{"+q+"}",d[q])}}return p}function b(p){p=p||l.event;switch(p.keyCode){case 27:e(p);g=-1;m.focus();break;case 38:e(p);if(g-1<=-1){g=-1;m.focus()}else{g-=1;try{j.childNodes[g].firstChild.firstChild.focus()}catch(d){g+=1}}break;case 40:e(p);if(g+1<j.childNodes.length){g+=1;try{j.childNodes[g].firstChild.firstChild.focus()}catch(d){g-=1}}break}}o={BOSS_URL:"http://boss.yahooapis.com/ysearch/web/v1/{query}?appid={appid}&format=jsonp&callback={callback}",results:{},init:function(q,r,p){var d;n=q;m=a(r);j=a(p);if(!m.value){if(d=l.location.search.match(/(?:\?|&)q=([^&]+)/)){m.value=decodeURIComponent(d[1].replace(/\+/g," "))}}if(m.value){o.search(m.value)}f(m,"keyup",function(){o.search(m.value)});f(m,"focus",function(){g=-1});f(i,"keydown",b);m.focus()},search:function(d){d=d.replace(/^\s+|\s+$/g,"");if(!d){return}if(o.results.hasOwnProperty(d)){h(o.results[d]);return}if(k){k.parentNode.removeChild(k)}k=i.createElement("script");k.src=c(o.BOSS_URL,{appid:encodeURIComponent(n),callback:"Trogdor.response",query:encodeURIComponent(d)});o.response=function(p){o.results[d]=p;h(p);if(k){k.parentNode.removeChild(k);k=null}};i.body.appendChild(k)}};return o}(); \ No newline at end of file js/trogdor-min.js @@ -16,7 +16,7 @@ var Trogdor = function () { var d = document, w = window, selIndex = -1, - appId, inputEl, resultEl, self, script, ua; + appId, inputEl, resultEl, self, script; // -- Private Methods -------------------------------------------------------- js/trogdor.js c82521dea3c35a06c89d2a344e2aa836d88bf0f9 Ryan Grove ryan@wonko.com http://github.com/rgrove/trogdor/commit/856fc38153cf745fe73a147b4c18476a99f1f543 856fc38153cf745fe73a147b4c18476a99f1f543

2009-02-28T22:22:07-08:00

Design tweaks a9e22cf4bdc9494e080ec1d4fe0f6060c321200a Ryan Grove ryan@wonko.com