nico_suggest.html

<p class="search_box">
検索：<input type="text" size="50" id="Q" autocomplete="off"> <button id="S">検索</button> <a href="#OPTION_PANE" id="OPTION_TOGGLE">オプション</a>
</p>
<p id="OPTION_PANE" class="option_box">
プレイヤーサイズ：
<select id="PLAYER_DIMENSION">
    <option value="320x240">320x240</option>
    <option value="640x480">640x480</option>
    <option value="800x600" selected="selected">800x600</option>
    <option value="full">フル</option>
</select>
<a href="#OPTION_PANE" id="OPTION_CLOSE">閉じる</a>
</p>
<hr>
<div id="R" class="result_box"></div>
<div class="pager_box"><span id="P" class="pager"></span></div>

<div><style type="text/css">
  .search_box {
      font-size: 1.25em; line-height: 2em;
  }
  .search_box input {
      font-size: 1em;
  }
  .search_box a {
      font-size: 0.8em;
      margin-left: 0.8em;
  }
  .search_box button {
      line-height: 1.3em; vertical-align: middle;
  }
  .suggest_box {
      position: absolute; 
      background-color: white; 
      border: black solid 1px; 
      min-height: 30px;
      font-size: 1.2em;
      z-index: 999;
  }
  .suggest_box .item {
      padding: 2px 4px;
  }
  .item.selected {
      background-color: #D5E2FF;
  }
  img.thumb {
      width: 130px;
      height: 100px;
  }
  .result_box .container {
      padding: 1em 0;
  }
  .result_box img {
      float: left;
      margin-right: 1em;
  }
  .result_box .desc {
  }
  .result_box .item {
      padding: 2px 4px;
      margin: 4px 0;
  }
  .result_box hr {
      border-color: #DDD;
      border-style: solid;
      border-width: 1px 0 0;
  }
  .result_box h3 {
      margin: 2px 0 !important;
  }
  .result_box a:visited {
      color: #67A;
  }
  .pager_box {
      padding: 0.1em 0 0.6em;
      text-align: center;
  }
  .pager_box .pager {
      padding: 4px 1em 5px;
      border: transparent solid 2px;
      border-radius: 3px;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
  }
  .pager_box .pager.selected {
      border-color: #3789EF;
  }
  .pager_box .page {
      margin: 0 0.3em;
      padding: 0px 3px 1px;
      border: transparent solid 2px;
  }
  .pager_box .page.selected {
      border-color: #3789EF;
  }
  .option_box {
      display: none;
      margin: 0 1em;
      padding: 0.5em;
      border: #75A9FF ridge 2px;
  }
  .option_box a {
      font-size: 92%;
      margin-left: 2em;
  }
</style></div>

<script type="text/javascript">
(function() {

var GOOGLE_API_KEY = 'ABQIAAAAt1jXE9z52FbXM8BhotngJhQXmhh5D0TNp6EIDA53oMQ6POMP-xSouYD9Pk2j_Kw8zw7pOPg5BbugIA';

var window = this;
var document = window.document;

var browser = {
    opera   : (navigator.appName.indexOf("Opera") >= 0),
    mozilla : (navigator.userAgent.indexOf("Gecko/") >= 0),
    webkit  : (navigator.userAgent.indexOf("AppleWebKit/") >= 0),
    ie      : /*@cc_on!@*/false
};

function $(_) { return document.getElementById(_); }

var $e = {};
(function() {
if (this.addEventListener) {
    $e.add = function(ele, type, fn) {
        ele.addEventListener(type, fn, false);
    };
    $e.remove = function(ele, type, fn) {
        ele.removeEventListener(type, fn, false);
    };
    $e.preventDefault = function(e) {
        e.preventDefault();
    };
}
else if (this.attachEvent) {
    $e.add = function(ele, type, fn) {
        ele.attachEvent('on' + type.replace(/^on/i, ''), fn);
    };
    $e.remove = function(ele, type, fn) {
        ele.detachEvent('on' + type.replace(/^on/i, ''), fn);
    };
    $e.preventDefault = function(e) {
        e.returnValue = false;
    };
}
})();

function $hasClass(el, className) {
    return new RegExp('(?:^|\\s)' + className + '(?:\\s|$)').test(el.className);
}
function $appendClass(el, className) {
    if (!el) return;
    if (new RegExp('(?:^|\\s)' + className + '\\s*$').test(el.className)) return;
    removeClass(el, className);
    el.className += ' ' + className;
}
function $removeClass(el, className) {
    if (!el) return;
    var orgClassName = el.className;
    var newClassName = orgClassName.replace(new RegExp('(?:^|\\s)' + className + '(?:\\s|$)', 'g'), '').replace(/\s+/g, ' ').replace(/^\s|\s$/, '');
    if (orgClassName != newClassName) {
        el.className = newClassName;
    }
}

function $trim(str) {
    return str.replace(/^\s+|\s+$/, '')
}

function $text(ele, str) {
    if (arguments.length == 1) {
        return ele.textContent /*@cc_on, ele.innerText @*/;
    }
    else {
        ele.textContent = /*@cc_on undefined; ele.innerText = @*/ str;
    }
}

function $click(ele) {
    if (ele.click) ele.click();
    else {
        var evt = document.createEvent("MouseEvents");
        evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
        ele.dispatchEvent(evt);
    }
}

var $stripTag, $escTag;
(function() {
var dv = document.createElement('div');
$stripTag = function (str) {
    if (!str) return '';
    dv.innerHTML = str;
    return $text(dv);
};
$escTag = function(str) {
    if (!str) return '';
    $text(dv, str)
    return dv.innerHTML;
};
})();

function $escAttr(str) {
    return str.replace(/'/g, '&#39;').replace(/"/g, '&quot;');
}

function $abs(el) {
    var p = el.offsetParent, x = el.offsetLeft, y = el.offsetTop;
    while (p) {
        x += p.offsetLeft; y += p.offsetTop;
        if (!browser.webkit) {  x -= p.scrollLeft; y -= p.scrollTop; }
        p = p.offsetParent;
    }
    return { x : x, y : y }
}

function $XS(xpath, context) {
    return document.evaluate(xpath,context||document,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null).singleNodeValue;
}

function createPlayInfo(el) {
    var an = el.getElementsByTagName('a');
    if (an.length == 0 && el.nodeName == 'A') {
        an = [el];
    }
    var items = [],
        video = {},
        title = {},
        image = {};
    for (var i = 0; i < an.length; i++) {
        var a = an[i];
        if (a != el && /\bnofollow\b/.test(a.getAttribute('rel'))) continue;
        var m;
        if (m = /(http:\/\/www\.nicovideo\.jp\/watch\/(\w+))/.exec(a.href)) {
            var videoid = m[2];
            if (!video[videoid]) {
                items.push(videoid);
                video[videoid] = m[1];
            }
            if (/\u003Cscript/i.test(a.innerHTML)) continue;
            var img = a.getElementsByTagName('img')[0];
            if (img && /\/_\.gif$/.test(img.src)) continue; // lazyimage.
            if (img) {
                title[videoid] = title[videoid] || img.alt;
                image[videoid] = image[videoid] || img.src;
            }
            if (!title[videoid]) {
                var desc = a.textContent/*@cc_on || a.innerText || '' @*/;
                if (!/^\s*http/.test(desc)) {
                    title[videoid] = desc;
                }
            }
        }
    }
    return { items: items, video: video, title: title, image: image }
}

var makeNicoLinks = (function() {
var makeNicoReg = /(https?:\/\/[-_.!~*()a-zA-Z0-9;\/?:@&=+$,%#]+)|\b([a-z]{2}\d+)|(mylist\/\d+)|(^|\D)(\d{10})(?!\d)/mg;
return function makeNicoLinks(str) {
    return str.replace(makeNicoReg, function(str, $1, $2, $3, $4, $5){
        if ($1) return ' <a href="' + $1 + '" target="_blank">' + $1 + '</a> ';
        if ($2) {
            if ($2 == 'mp3') return $2;
            var co = $2.substring(0, 2) == 'co';
            if (co) return ' <a href="http://com.nicovideo.jp/community/' + $2 + '" target="_blank">'+ $2 + '</a> ';
            else    return ' <a href="http://www.nicovideo.jp/watch/' + $2 + '" target="_blank">'+ $2 + '</a> ';
        }
        if ($3) return ' <a href="http://www.nicovideo.jp/' + $3 + '" target="_blank">'+ $3 + '</a> ';
        if ($5) return $4 + ' <a href="http://www.nicovideo.jp/watch/' + $5 + '" target="_blank">'+ $5 + '</a> ';
    });
};
})();

function findVideoTitle(a) {
    var title = '';
    if (!/\u003Cscript/i.test(a.innerHTML)) {
        var title = $text(a).replace(/^\s+|\s+$/g, '');
        if (!title) {
            var img = a.getElementsByTagName('img')[0];
            if (img) title = (img.alt || '').replace(/^\s+|\s+$/g, '');
        }
    }
    if (!title) {
        var videoid = a.href.replace(/.*?watch\/(\w+).*/, '$1');
        if (document.evaluate) {
            var aa = $XS('/\/a[contains(@href,"watch/' + videoid + '") and not(descendant::img)]', a.ownerDocument);
            if (aa) title = $text(aa).replace(/^\s+|\s+$/g, '');
        }
        else {
            var an = a.ownerDocument.getElementsByTagName('a');
            var findHref = 'watch/' + videoid;
            for (var i = 0, len = an.length; i < len; i++) {
                var aa = an[i];
                if (aa.href.indexOf(findHref) >= 0 && !/\u003Cscript|<img/i.test(aa.innerHTML)) {
                    title = $text(aa).replace(/^\s+|\s+$/g, '');
                    if (title) break;
                }
            }
        }
    }
    return title;
}
/**
 * Cookie.
 */
var Cookie = {
    get : function(key) {
        var m = new RegExp('(?: |^)' + key + '=([^;]*)').exec(document.cookie);
        return m ? decodeURIComponent(m[1]) : '';
    },
    set : function(key, value, expires, path, domain) {
        /*@cc_on path = path.replace(/[^/]*$/, '') @*/
        document.cookie = key + '=' + encodeURIComponent(value) + 
            (expires ? ('; expires=' + new Date(expires).toGMTString()) : '') +
            (path    ? ('; path=' + path) : '') +
            (domain  ? ('; domain=' + domain) : '');
    },
    del : function(key) {
        document.cookie = key + '=; expires=Thu, 01 Jan 1970 00:00:00 GMT';
    }
};

/**
 * class Walker
 */
function Walker(test) {
    if (!(this instanceof Walker)) return new Walker(test);
    this.test = test;
    this.item = null;
}
Walker.emptyTest = function() { return true; };
Walker.prototype = {
    current : function(item) {
        this.item = item;
        return this;
    },
    first : function(parent, test) {
        var c = parent.firstChild, t = test || this.test || Walker.emptyTest;
        while (c && (c.nodeType != 1 || !t(c))) { c = c.nextSibling };
        return this.current(c);
    },
    last : function(parent, test) {
        var c = parent.lastChild, t = test || this.test || Walker.emptyTest;
        while (c && (c.nodeType != 1 || !t(c))) { c = c.previousSibling };
        return this.current(c);
    },
    next : function(item, test) {
        var c = item || this.item, t = test || this.test || Walker.emptyTest;
        if (c) do { c = c.nextSibling } while (c && (c.nodeType != 1 || !t(c)));
        return this.current(c);
    },
    prev : function(item, test) {
        var c = item || this.item, t = test || this.test || Walker.emptyTest;
        if (c) do { c = c.previousSibling } while (c && (c.nodeType != 1 || !t(c)));
        return this.current(c);
    },
    isNullThenFirst : function(parent, test) {
        return (this.item == null) ? this.first(parent, test) : this;
    },
    isNullThenLast : function(parent, test) {
        return (this.item == null) ? this.last(parent, test) : this;
    }
};

/**
 * class Soar
 */
function Soar(object, option) {
    this.object = object;
    var o = option || {};
    this.duration = o.duration || 500;
    this.delay = o.delay || 10;
    this.coe = (o.coe != null) ? o.coe : 0.15;
}
Soar.prototype.from = function(attr) {
    this._from = attr;
    return this;
};
Soar.prototype.to = function(attr) {
    this._to = attr;
    return this;
}
Soar.prototype.go = function (win) {
    this.cancel();
    var obj = this.object;
    this.window = window;
    for (var p in this._from) {
        obj[p] = this._from[p];
    }
    var target = [];
    for (var p in this._to) {
        var start = parseFloat(obj[p]);
        var m = /(-?[0-9]+\.?([0-9]*))(.*)/.exec(this._to[p]);
        var dest  = parseFloat(m[1]);
        var scale = m[2].length;
        var unit  = m[3] || /[^0-9]*$/.exec(obj[p]);
        target.push({ prop: p, cur: start, dest: dest, scale: scale, unit: unit });
    }
    var n = Math.ceil(this.duration / this.delay);
    var self = this;
    var startTime = new Date().getTime();
    self.tid = this.window.setTimeout(function() {
        var now = new Date().getTime();
        var nn = (self.duration - (now - startTime)) / self.delay;
        while (n > nn && n > 0) {
            for (var i = 0, len = target.length; i < len; i++) {
                var t = target[i];
                t.cur = t.cur + (t.dest - t.cur) * (1/n + (1-1/n) * self.coe);
            }
            n--;
        }
        var finishCount = 0;
        for (var i = 0, len  = target.length; i < len; i++) {
            var t = target[i];
            var next = t.cur.toFixed(t.scale);
            obj[t.prop] = next + t.unit;
            if (next == t.dest) finishCount++;
        }
        if (finishCount != target.length && n > 0) {
            self.tid = self.window.setTimeout(arguments.callee, self.delay);
        }
        else {
            self.isActive = false;
            if (self.onfinish) self.onfinish();
        }
    }, 0);
    this.isActive = true;
}
Soar.prototype.cancel = function() {
    if (this.isActive) {
        this.window.clearTimeout(this.tid);
        this.isActive = false;
    }
    this._from = null;
    return this;
}

// == options  == /
var optionPane = $('OPTION_PANE');
var playerDimension = $('PLAYER_DIMENSION');

$e.add($('OPTION_TOGGLE'), 'click', function(e) {
    if (optionPane.style.display == 'block') optionPane.style.display = '';
    else optionPane.style.display = 'block';
    $e.preventDefault(e);
});
$e.add($('OPTION_CLOSE'), 'click', function(e) {
    optionPane.style.display = '';
    $e.preventDefault(e);
});

var dim = Cookie.get('pd');
if (dim) {
    playerDimension.value = dim;
}
$e.add(playerDimension, 'change', function(e) {
    dim = playerDimension.value;
    var exp = new Date();
    exp.setFullYear(exp.getFullYear() + 1);
    Cookie.set('pd', dim, exp, location.pathname);
});

// === suggest implementation. === //
var q = $('Q');
var s = $('S');
var r = $('R');
var p = $('P');

var selectionBox = document.createElement('div');
selectionBox.className = 'suggest_box';
var selectedItem = null;
var suggestShowing = false;
var previousPhrase = null;
var selectedEntry = null;
var selectedPageItem = null;
var pagerActivated = false;

function initSelectionBox() {
    selectionBox.style.width = (q.clientWidth + 2) + 'px';
    selectionBox.style.top = (q.offsetTop + q.offsetHeight) + 'px';
    selectionBox.style.left = q.offsetLeft + 'px';
    if (selectionBox.parentNode != document.body) {
        document.body.appendChild(selectionBox);
    }
}
function relayout() {
    if (suggestShowing) {
        initSelectionBox();
    }
}
function clearSuggest() {
    selectionBox.innerHTML = '';
    selectedItem = null;
}
function clearSearchResult() {
    r.innerHTML = '';
    p.innerHTML = '';
    selectedEntry = null;
    selectedPageItem = null;
    deactivatePager();
}

function showSuggest() {
    initSelectionBox();
    selectionBox.style.display = 'block';
    suggestShowing = true;
}
function hideSuggest() {
    selectionBox.style.display = 'none';
    suggestShowing = false;
}
function setSuggest(result) {
    var selectedItem = null;
    var list = result[1];
    var df = document.createDocumentFragment();
    for (var i = 0; i < list.length; i++) {
        var dv = document.createElement('div');
        dv.className = 'item';
        $text(dv, list[i][0]);
        df.appendChild(dv);
    }
    clearSuggest();
    if (list.length > 0) {
        selectionBox.appendChild(df);
        showSuggest();
    }
    else {
        hideSuggest();
    }
}
function selectItem(item, includeContent) {
    if (selectedItem) {
        $removeClass(selectedItem, 'selected');
    }
    selectedItem = item;
    if (item) {
        $appendClass(item, 'selected');
        if (includeContent) {
            q.value = previousPhrase = $text(item);
        }
    }
}
var itemWarker = Walker();
function selectUp() {
    if (selectedItem) {
        var item = itemWarker.prev(selectedItem).item;
        if (item) selectItem(item, true);
    }
    else {
        selectItem(itemWarker.last(selectionBox).item, true);
    }
}
function selectDown() {
    if (selectedItem) {
        var item = itemWarker.next(selectedItem).item;
        if (item) selectItem(item, true);
    }
    else {
        selectItem(itemWarker.first(selectionBox).item, true);
    }
}

function selectEntry(entry, scroll) {
    if (selectedEntry) {
        $removeClass(selectedEntry, 'selected');
    }
    selectedEntry = entry;
    if (entry) {
        $appendClass(entry, 'selected');
        if (scroll) scrollIntoView(entry);
    }
}
var entryWarker = Walker(function(ele) { return $hasClass(ele, 'item') });
function selectEntryUp() {
    if (pagerActivated) {
        deactivatePager();
        if (selectedEntry) selectEntry(selectedEntry, true);
    }
    else if (selectedEntry) {
        var entry = entryWarker.prev(selectedEntry).item;
        if (entry) selectEntry(entry, true);
        else       selectEntry(selectedEntry, true);
    }
    else {
        selectEntry(entryWarker.first(r).item, true);
    }
}
function selectEntryDown() {
    if (selectedEntry) {
        var entry = entryWarker.next(selectedEntry).item;
        if (entry) selectEntry(entry, true);
        else {
            activatePager();
            scrollIntoView(p);
        }
    }
    else {
        selectEntry(entryWarker.first(r).item, true);
    }
}
var scrollSoar = null;
function scrollIntoView(ele) {
    var pos = $abs(ele);
    var view = (browser.webkit) ? document.body : document.documentElement;
    if (scrollSoar) scrollSoar.cancel();
    scrollSoar = new Soar(view);
    scrollSoar.to({scrollTop: pos.y - 100}).go()
}

var pageWarker = Walker(function(ele) { return ele.nodeName == 'A' && $hasClass(ele, 'page') });
function activatePager() {
    if (pageWarker.first(p).item == null) return;
    $appendClass(p, 'selected');
    if (selectedPageItem) $appendClass(selectedPageItem, 'selected');
    else {
        var currentPage = pageWarker.first(p, function(ele) { return ele.nodeName == 'SPAN' && $hasClass(ele, 'page') }).item;
        selectedPageItem = pageWarker.next(currentPage).item;
        if (!selectedPageItem) selectedPageItem = pageWarker.prev(currentPage).item;
        $appendClass(selectedPageItem, 'selected');
    }
    pagerActivated = true;
}
function deactivatePager() {
    $removeClass(p, 'selected');
    $removeClass(selectedPageItem, 'selected');
    pagerActivated = false;
}
function selectPageItem(item, scroll) {
    if (selectedPageItem) {
        $removeClass(selectedPageItem, 'selected');
    }
    selectedPageItem = item;
    if (item) {
        $appendClass(item, 'selected');
        if (scroll) scrollIntoView(item);
    }
}
function selectPageLeft() {
    if (selectedPageItem) {
        var item = pageWarker.prev(selectedPageItem).item;
        if (item) selectPageItem(item, true);
    }
    else {
        selectPageItem(pageWarker.first(p).item, true);
    }
}
function selectPageRight() {
    if (selectedPageItem) {
        var item = pageWarker.next(selectedPageItem).item;
        if (item) selectPageItem(item, true);
    }
    else {
        selectPageItem(pageWarker.first(p).item, true);
    }
}

var lastInputPhrase = '';
var lastSearchedPhrase = null;
var searched = false;
var currentId = 0;
var cache = {};
var tid = null;

function observeStart() {
    observeEnd();
    previousPhrase = q.value;
    tid = setInterval(observe, 64);
}
function observeEnd() {
    if (tid) clearInterval(tid);
    tid = null;
    hideSuggest();
    loadSuggestCancel();
}

function observe() {
    var phrase = $trim(q.value);
    if (!phrase) {
        previousPhrase = '';
        clearSuggest();
        hideSuggest();
        loadSuggestCancel(true);
    }
    else if (previousPhrase != phrase) {
        previousPhrase = lastInputPhrase = phrase;
        if (cache[phrase]) {
            loadSuggestCancel();
            loadSuggest(phrase);
        }
        else {
            loadSuggestLater(phrase);
        }
    }
}

var loadTid = null;
var delayDecrement = 0;
function loadSuggestLater(phrase) {
    loadSuggestCancel();
    loadTid = setTimeout(function() {
        loadTid = null;
        delayDecrement = 0;
        if (phrase == $trim(q.value)) loadSuggest(phrase);
    }, 700 - (100 * delayDecrement));
    if (delayDecrement < 5) delayDecrement++;
}
function loadSuggestCancel(resetDelay) {
    if (loadTid) clearTimeout(loadTid);
    loadTid = null;
    currentId++;
    if (resetDelay) delayDecrement = 0;
}

function justSearched() {
    return lastSearchedPhrase == q.value;
}

var SUGGEST_URL = 'http://google.co.jp/complete/search?hl=ja';
function loadSuggest(phrase) {

    var cached = cache[phrase];
    if (cached) {
        setSuggest(cached);
        return;
    }

    currentId++;
    var requestId = currentId;
    var callbackName = '__suggest__' + requestId;

    var script = document.createElement('script');
    script.src = SUGGEST_URL + '&q=' + encodeURIComponent(phrase) + '&callback=' + callbackName;

    window[callbackName] = function(json) {
        window[callbackName] = undefined; // could't delete on ie.
        document.body.removeChild(script);
        if (json) {
            cache[phrase] = json;
            if (requestId == currentId) {
                setSuggest(json);
            }
        }
    };

    document.body.appendChild(script);
}


var SEARCH_URL = 'http://ajax.googleapis.com/ajax/services/search/web?v=1.0&rsz=large&hl=ja&callback=__search__&key=' + GOOGLE_API_KEY;

var currentContext = 0;
var lastSearchUrl = null;
function search() {
    var phrase = $trim(q.value);
    if (!phrase) return;
    hideSuggest();
    loadSuggestCancel(true);
    q.value = lastSearchedPhrase = previousPhrase = lastInputPhrase = phrase;
    var context = ++currentContext;
    var script = document.createElement('script');
    script.id = '__search__' + context;
    script.src = SEARCH_URL + '&context=' + context + '&q=' + encodeURIComponent(phrase) + '+site%3Awww.nicovideo.jp%2Fwatch%2F';
    document.body.appendChild(script);
    lastSearchUrl = script.src;
}
function searchUrl(url) {
    if (!url) return;
    var context = ++currentContext;
    var script = document.createElement('script');
    script.id = '__search__' + context;
    script.src = url.replace(/context=\d+/, 'context=' + context);
    document.body.appendChild(script);
}
window.__search__ = function(context, json) {
    document.body.removeChild($('__search__' + context));
    if (context == currentContext && json) {
        setSearchResult(json);
    }
}

var THUMB_URL = 'http:\/\/tn-skr2.smilevideo.jp/smile?i=';

function setSearchResult(result) {

    var list = result.results;
    var df = document.createDocumentFragment();
    for (var i = 0; i < list.length; i++) {
        var url = list[i].url;
        var id = url.replace(/.*?watch\/(\w+).*/, '$1');
        var dv = document.createElement('div');
        dv.className = 'item';
        dv.innerHTML = '<div class="container"><a href="' + $escAttr(url) + '" target="_blank"><img class="thumb" src="' + THUMB_URL + $escAttr(id.slice(2)) + '" onerror="this.src=\'http://ec1.images-amazon.com/images/G/09/nav2/dp/no-image-no-ciu.gif\';this.onerror=null;" alt="' + $escAttr($stripTag(list[i].title)) + '"></a><div class="desc"><h3><a href="' + $escAttr(url) + '" target="_blank">' + $stripTag(list[i].title) + '</a></h3>' + makeNicoLinks($stripTag(list[i].content)) + '</div><br style="clear:both;height:0;line-height:0;"></div>';
        df.appendChild(dv);
        var hr = document.createElement('hr');
        df.appendChild(hr);
    }
    
    if (list.length == 0) {
        var dv = document.createElement('div');
        dv.innerHTML = 'ねーよ';
        df.appendChild(dv);
    }

    clearSearchResult();
    r.appendChild(df);

    var df = document.createDocumentFragment();
    var pages = result.cursor.pages;
    if (pages) {
        for (var i = 0; i < pages.length; i++) {
            if ((result.cursor.currentPageIndex + 1) == pages[i].label) {
                var l = document.createElement('span');
                l.className = 'page';
                $text(l, pages[i].label);
                df.appendChild(l);
                continue;
            }
            var a = document.createElement('a');
            a.className = 'page';
            a.href = result.cursor.moreResultsUrl.replace(/start=\d+/, 'start=' + Number(pages[i].start));
            $text(a, pages[i].label);
            df.appendChild(a);
            var reqUrl = lastSearchUrl + '&start=' + Number(pages[i].start);
            with({url: reqUrl}) {
                $e.add(a, 'click', function(e) {
                    searchUrl(url);
                    $e.preventDefault(e);
                });
            }
        }
        p.appendChild(df);
    }
    q.focus();
    scrollIntoView(q);
}

function calcPosition(width) {
    if (browser.opera) {
        return { top: 0, left: window.top.innerWidth - width };
    }
    if (browser.webkit) {
        var top = window.screenTop + 110;
        var left = window.screenLeft + window.outerWidth - width - 25;
        return { top: top, left: left };
    }
    if (browser.mozilla) {
        var top = window.screenY + 110;
        var left = window.screenX + window.outerWidth - width - 25;
        return { top: top, left: left };
    }
    return { top: 0, left: window.screen.width - width };
}

function openExt(href, title) {
    
    var w = 800, h = 600, top = 0, left = 0;
    if (dim && dim == 'full') {
        w = window.screen.availWidth; if (browser.webkit) { w -= (window.outerWidth - window.innerWidth); }
        h = window.screen.availHeight - 100; // toolbar, etc.
        top = 0;
        left = 0;
    }
    else {
        if (dim) {
            var m = /(\d+)x(\d+)/.exec(dim);
            if (m) {
                w = Number(m[1]);
                h = Number(m[2]);
            }
        }
        var pos = calcPosition(w);
        top = pos.top;
        left = pos.left;
    }
    
    var id = href.replace(/.*?watch\/(\w+).*/, '$1');
    var buf = [
        '<!doctype html>',
        '<html lang="ja">',
        '<head>',
        '<title>' + $escTag(title || href) + '</title>',
        '<style type="text/css">',
        '* { margin: 0; padding: 0; } ',
        'html, body { width: 100%; height: 100%; background-color: black; } ',
        'body { display: table; text-align: center; overflow: hidden; } ',
        '#MAIN { display: table-cell; vertical-align: middle; } ',
        '</style>',
        '</head>',
        '<body><div id="MAIN"></div>',
        '\u003Cscript type="text/javascript">function write(ele,str){ele.innerHTML=str}\u003C/script>',
        '\u003Cscript type="text/javascript" src="data:text/javascript,if(window.opera)write=function(ele,str){var r=document.createRange();r.selectNodeContents(ele);r.deleteContents();r.insertNode(r.createContextualFragment(str))}">\u003C/script>',
        '\u003Cscript type="text/javascript">document.write=function(h){write(document.getElementById(\'MAIN\'),h)}\u003C/script>',
        '\u003Cscript type="text/javascript" src="http://ext.nicovideo.jp/thumb_watch/' + id + '?w=' + w + '&h=' + h + '">\u003C/script>',
        '</body></html>'
    ];
    var win = window.open('', 'ext', 'top=' + top + ',left=' + left + ',width=' + w + ',height=' + h + ',resizable=yes,menubar=yes,status=no');
    win.document.open();
    win.document.write(buf.join(''));
    if (/*@cc_on!@*/1) win.document.close(); // freeze on ie.
    win.focus();
}


function nicovideoLinkClick(e) {
    var a = e.target || e.srcElement;
    while(a && a.tagName != 'A') {
        a = a.parentNode;
    }
    if (!a) return;
    if (a.href.indexOf('http://www.nicovideo.jp/watch/') == 0) {
        openExt(a.href, findVideoTitle(a));
        $e.preventDefault(e);
    }
}

function enter(e) {
    if (pagerActivated && selectedPageItem) {
        $click(selectedPageItem);
        $e.preventDefault(e);
    }
    else if (justSearched() && !suggestShowing && selectedEntry) {
        var pl = createPlayInfo(selectedEntry);
        var item = pl.items[0];
        if (item) {
            openExt(pl.video[item], pl.title[item]);
        }
        $e.preventDefault(e);
    }
    else {
        search();
        $e.preventDefault(e);
    }
}
function up(e) {
    if (justSearched() && !suggestShowing) {
        selectEntryUp();
        $e.preventDefault(e);
    }
    else {
        if (selectionBox.childNodes.length > 0) {
            if (!suggestShowing) {
                showSuggest();
            }
            else {
                selectUp();
            }
            $e.preventDefault(e);
        }
    }
}
function down(e) {
    if (justSearched() && !suggestShowing) {
        selectEntryDown();
        $e.preventDefault(e);
    }
    else {
        if (selectionBox.childNodes.length > 0) {
            if (!suggestShowing) {
                showSuggest();
            }
            else {
                selectDown();
            }
            $e.preventDefault(e);
        }
    }
}
function esc(e) {
    if (suggestShowing) {
        q.value = previousPhrase = lastInputPhrase;
        hideSuggest();
        $e.preventDefault(e);
    }
}
function left(e) {
    if (pagerActivated) {
        selectPageLeft();
        $e.preventDefault(e);
    }
}
function right(e) {
    if (pagerActivated) {
        selectPageRight();
        $e.preventDefault(e);
    }
}

var isControlKindKey = false;
function keydown(e) {
    if (browser.opera) {
        switch(e.keyCode) {
        case 37:
        case 38:
        case 39:
        case 40:
        case 27:
            isControlKindKey = true; break;
        default:
            isControlKindKey = false; break;
        }
    }
    else {
        if (e.keyCode == 37) left(e);
        if (e.keyCode == 38) up(e);
        if (e.keyCode == 39) right(e);
        if (e.keyCode == 40) down(e);
        if (e.keyCode == 27) esc(e);
    }
}
function keypress(e) {
    if (browser.opera) {
        if (e.keyCode == 13) enter(e);
        if (e.keyCode == 27 && isControlKindKey) esc(e);
        if (e.keyCode == 37 && isControlKindKey) left(e);
        if (e.keyCode == 38 && isControlKindKey) up(e);
        if (e.keyCode == 39 && isControlKindKey) right(e);
        if (e.keyCode == 40 && isControlKindKey) down(e);
    }
    else {
        if (e.keyCode == 13) enter(e);
    }
}

function findItem(ele) {
    var p = ele;
    while(p) {
        if (p.parentNode === selectionBox) return p;
        p = p.parentNode;
    }
    return null;
}
function selectClickItem(e) {
    selectItem(findItem(e.target || e.srcElement), true);
    search();
}
function hoverItem(e) {
    selectItem(findItem(e.target || e.srcElement));
}
function findEntry(ele) {
    var p = ele;
    while(p) {
        if (p.parentNode === r) break;
        p = p.parentNode;
    }
    if (p && $hasClass(p, 'item')) return p;
    return null;
}
function selectClickEntry(e) {
    selectEntry(findEntry(e.target || e.srcElement));
}

function dblclick(e) {
    var phrase = $trim(q.value);
    if (phrase) loadSuggest(phrase);
}

function main() {
    $e.add(q, 'focus', observeStart);
    $e.add(q, 'blur', observeEnd);
    $e.add(q, 'keydown', keydown);
    $e.add(q, 'keypress', keypress);
    $e.add(q, 'dblclick', dblclick);
    $e.add(s, 'click', search);
    $e.add(r, 'click', selectClickEntry);
    $e.add(selectionBox, 'click', selectClickItem);
    $e.add(selectionBox, 'mouseover', hoverItem);
    $e.add(selectionBox, 'mousedown', $e.preventDefault);
    /*@cc_on
    $e.add(selectionBox, 'mousedown', selectClickItem);
    @*/
}

$e.add(window, 'load', main);
$e.add(window, 'resize', relayout);
$e.add(document, 'click', nicovideoLinkClick);

})();
</script>