var img1 = new Image();
img1.src = './img/m_pages_box.png';
var img2 = new Image();
img2.src = './img/m_indexes_box.png';
var img3 = new Image();
img3.src = './img/m_search_box.png';

function SideBar()
{
    var addSideBarEvent = this.addSideBarEvent.bindAsEventListener(this);
    Event.observe(window, "load", addSideBarEvent);
}

SideBar.prototype.addSideBarEvent = function()
{
    if (flippingBook.contents.length) {
        $('m_indexes').style.visibility = 'visible';
        var showIndexes = this.showIndexes.bindAsEventListener(this);
        Event.observe($('m_indexes'), "click", showIndexes);
    }
    if (enableSearch) {
        $('m_search').style.visibility = 'visible';
        var showSearch = this.showSearch.bindAsEventListener(this);
        Event.observe($('m_search'), "click", showSearch);
    }
    var showPages = this.showPages.bindAsEventListener(this);
    Event.observe($('m_pages'), "click", showPages);
}

SideBar.prototype.showSearch = function()
{
    this.showBox('m_search'); 
    if ($('box').style.display == 'none') {
        return;
    }
    var oblock = document.createElement('DIV');
    var oInput = document.createElement('INPUT');
    var oDiv = document.createElement('DIV');
    var oDl = document.createElement('DL');
    oInput.style.width = '150px';
    oInput.id = 'q';
    var oButton = document.createElement('INPUT');
    oButton.type = 'button';
    oButton.value = '検索';
    oDl.id = "searchResults";
    oDiv.id = "numrows";
    oblock.insertBefore(oInput, null);
    oblock.insertBefore(oButton, null);
    oblock.insertBefore(oDiv, null);
    oblock.insertBefore(oDl, null);
    this.insertHtml(oblock);
    var searchRequest = this.searchRequest.bindAsEventListener(this);
    Event.observe(oButton, "click", searchRequest);
}

SideBar.prototype.searchRequest = function()
{
    var url = './search/';
    var pars = 'q='+encodeURI($('q').value);
    var show = this.showSearchData.bindAsEventListener(this);
    var ajx = new Ajax.Request(
        url,
        {
            method: 'get',
            parameters: pars,
            onComplete: show
        }
    );
}

SideBar.prototype.showSearchData = function(res)
{
    var json = res.responseText;
    var func = new Function('return '+json);
    var result = func();
    $('numrows').innerHTML = result.length+'件のデータが見つかりました。';
    $('searchResults').innerHTML = '';
    for (var i=0; i<result.length; i++) {
        var dt = document.createElement('DT');
        var dd = document.createElement('DD');
        $('searchResults').insertBefore(dt, null);
        $('searchResults').insertBefore(dd, null);
        dt.innerHTML = '<a href="JavaScript:flippingBook.getFlippingBookReference().flipGotoPage('+result[i].id+');">P.'+result[i].id+'</a>';
        dd.innerHTML = result[i].body;
    }
}

SideBar.prototype.showPages = function()
{
    this.showBox('m_pages'); 
    if ($('box').style.display == 'none') {
        return;
    }
    var oblock = document.createElement('DIV');
    oblock.className = 'thumbs';
    if (flippingBook.settings.alwaysOpened) {
        this.insertThumbsWide(oblock);
    } else {
        this.insertThumbs(oblock);
    }
    this.insertHtml(oblock);
}

SideBar.prototype.showIndexes = function()
{
    this.showBox('m_indexes'); 
    if ($('box').style.display == 'none') {
        return;
    }
    var oul = document.createElement('UL');
    for (var i=0; i<flippingBook.contents.length; i++) {
        var oli = document.createElement('LI');
        var oa = document.createElement('A');
        var otxt = document.createTextNode(flippingBook.contents[i][0]);
        var n = flippingBook.contents[i][1];
        oa.insertBefore(otxt, null);
        oa.href = 'JavaScript:flippingBook.getFlippingBookReference().flipGotoPage('+n+')';
        oli.insertBefore(oa, null);
        oul.insertBefore(oli, null);
    }
    this.insertHtml(oul);
}

SideBar.prototype.showBox = function(obj)
{
    var oBox = $('box');
    var oContent = $('box_contents');
    if (obj == oBox.className && oBox.style.display == 'block') {
        oBox.style.display = 'none';
        oContent.style.display = 'none';
        $(obj).style.backgroundPosition = 'right top';
    } else {
        oBox.style.display = 'block';
        oContent.style.display = 'block';
        oBox.style.backgroundImage = 'url(./img/'+obj+'_box.png)';
        try{pngfix();}catch(e){}
        if (oBox.className) {
            $(oBox.className).style.backgroundPosition = 'right top';
        }
        oBox.className = obj;
        $(obj).style.backgroundPosition = 'left top';
    }
}

SideBar.prototype.insertHtml = function(html)
{
    var oBox = $('box_contents');
    oBox.innerHTML = '';
    oBox.insertBefore(html, null);
}

SideBar.prototype.insertThumbs = function(oblock)
{
    for (var i=0; i<flippingBook.pages.length; i++) {
        var thumb1 = flippingBook.pages[i];
        thumb1 = thumb1.replace('pages/', 'pages/thumbs/');
        var oa = document.createElement('A');
        var n = i + 1;
        oa.href = 'JavaScript:flippingBook.getFlippingBookReference().flipGotoPage('+n+')';
        oblock.insertBefore(oa, null);
        if (i === 0) {
            var right = this.createBlock();
            right.style.width = '100%';
            right.style.backgroundImage = 'url('+thumb1+')';
            right.style.backgroundRepeat = 'no-repeat';
            right.style.backgroundPosition = 'right top';
            oa.insertBefore(right, null);
        } else {
            var left = this.createBlock();
            left.style.backgroundImage = 'url('+thumb1+')';
            left.style.backgroundRepeat = 'no-repeat';
            left.style.backgroundPosition = 'left top';
            left.style.styleFloat = 'left';
            left.style.cssFloat = 'left';
            oa.insertBefore(left, null);
            i = i + 1;
            if (flippingBook.pages[i]) {
                var thumb2 = flippingBook.pages[i];
                thumb2 = thumb2.replace('pages/', 'pages/thumbs/');
                var right = this.createBlock();
                right.style.backgroundImage = 'url('+thumb2+')';
                right.style.backgroundRepeat = 'no-repeat';
                right.style.backgroundPosition = 'right top';
                right.style.styleFloat = 'right';
                right.style.cssFloat = 'right';
                oa.insertBefore(right, null);
            }
        }
    }
}

SideBar.prototype.createBlock = function()
{
    var div = document.createElement('DIV');
    div.style.width = '50%';
    div.style.height = '141px';
    div.insertBefore(document.createTextNode(' '), null);
    return div;
}

SideBar.prototype.insertThumbsWide = function(oblock)
{
    var len = flippingBook.pages.length / 2;
    for (var i=0; i<len; i++) {
        var oa = document.createElement('A');
        var n = i + 1;
        var p = n * 2;
        oa.href = 'JavaScript:flippingBook.getFlippingBookReference().flipGotoPage('+p+')';
        var oimg = document.createElement('IMG');
        oimg.src = 'pages/thumbs/p-'+n+'.jpeg';
        oimg.width = 200;
        oimg.height = 140;
        oimg.className = 'thumb';
        oa.insertBefore(oimg, null);
        oblock.insertBefore(oa, null);
    }
}

var sb = new SideBar();