var pointX1, pointY1;
var page = 1;
var gesture = false;
var motion = null;

if (document.addEventListener) {
    document.addEventListener('DOMContentLoaded', Init, false);
} else if (window.attachEvent) {
    window.attachEvent("onload", Init);
}

function Init() {
    Deunderlinize('page');
    Tablerize();
    Layerize();

    if (localStorage.page != null) {
        page = parseInt(localStorage.page);
        LoadAndShow();
    }

    document.body.onmousedown = MouseDown;
    document.body.onmouseup = MouseUp;
    document.onselectstart = function () { return false; };

    Footerize();

    PreLoad();
}

function Deunderlinize(name) {
    var page = document.getElementById(name);
    
    var anchors = page.getElementsByTagName('a');
    for (var i = 0; i < anchors.length; i++) {
        anchors.item(i).className = 'js';
    }

    var divs = page.getElementsByTagName('div');
    for (var i = 0; i < divs.length; i++) {
        var div = divs.item(i);
        if (div.getAttribute('class') == 'hentry') {
            var href = div.getElementsByTagName('a').item(0).getAttribute('href');
            div.setAttribute('onmouseover', "javascript:if (!gesture) this.className='hentry border';");
            div.setAttribute('onmouseout', "javascript:if (!gesture) this.className='hentry';");
            div.setAttribute('onmousemove', "javascript:if (gesture) this.className='hentry';");
            div.getElementsByTagName('h1').item(0).innerHTML = div.getElementsByTagName('a').item(0).innerHTML;
            div.innerHTML = '<a rel="bookmark" ondrag="javascript:return false;" onclick=\"javascript:if (gesture) return false;\" href="' + href + '">' + div.innerHTML + '</a>';
        } else if (div.getAttribute('class') == 'centry') {
            var href = div.getElementsByTagName('a').item(0).getAttribute('href');
            div.setAttribute('onmouseover', "javascript:if (!gesture) this.className='centry border';");
            div.setAttribute('onmouseout', "javascript:if (!gesture) this.className='centry';");
            div.setAttribute('onmousemove', "javascript:if (gesture) this.className='centry';");
            div.getElementsByTagName('h1').item(0).innerHTML = div.getElementsByTagName('a').item(0).innerHTML;
            div.innerHTML = '<a ondrag="javascript:return false;" onclick=\"javascript:if (gesture) return false;\" href="' + href + '">' + div.innerHTML + '</a>';
        }
    }
}

function IfLeftRetFalse(event) {
    if (event == undefined) var event = window.event;
    if (Button(event) == "LEFT") return false;
    return true;
}

function Tablerize() {
    var page = document.getElementById('page');
    var content = document.getElementById('content');
    var table = document.createElement('table');
    table.setAttribute('id', 'table');
    table.setAttribute('cellpading', 0);
    table.setAttribute('cellspacing', 0);
    table.setAttribute('border', 0);
    table.style.marginLeft = 0;
    var tr = document.createElement('tr');
    table.appendChild(tr);
    var td = document.createElement('td');
    td.setAttribute('id', 'page1');
    td.style.paddingBottom = '80px';
    var div = page.cloneNode(true);
    div.removeAttribute('id');
    td.appendChild(div);
    tr.appendChild(td);
    content.insertBefore(table, page);
    content.removeChild(page);
}

function Footerize() {
    var pi = document.createElement('div');
    var footer = document.getElementById('footer');
    pi.style.width = '100%';
    pi.style.position = 'absolute';
    pi.style.left = 0;
    pi.style.bottom = 0;
    pi.innerHTML = '<div id="mouseLeft"></div><div id="mouseRight"></div><div id="pageInfo">Strana <span id="pageNumber">' + page + '</span> / ' + pagesCount + '</div>';
    footer.parentNode.insertBefore(pi, footer);
    ChangePageNumber();
}

function Layerize() {
    var content = document.getElementById('content');
    content.style.position = 'relative';
    content.style.overflow = 'hidden';
    content.style.clip = 'rect(0px, ' + content.offsetWidth + 'px, ' + content.offsetHeight + 'px, 0px)';
}

function Button(event) {
    if (event.which)
        return (event.which < 2) ? "LEFT" :
            ((event.which == 2) ? "MIDDLE" : "RIGHT");
    else
        return (event.button < 2) ? "LEFT" :
            ((event.button == 4) ? "MIDDLE" : "RIGHT");
}

function MouseDown(event) {
    if (event == undefined) var event = window.event;
    if (Button(event) == "LEFT") {
        gesture = true;
        pointX1 = event.screenX || event.pageX;
        pointY1 = event.screenY || event.pageY;
        return false;
    }
}

function MouseUp(event) {
    if (event == undefined) var event = window.event;
    if (gesture && Button(event) == "LEFT") {
        setTimeout(function () { gesture = false; }, 100);
        var pointX2 = event.screenX || event.pageX;
        var pointY2 = event.screenY || event.pageY;
        Gesture(event, pointX1, pointX2, pointY1, pointY2);
    }
}

function Gesture(event, x1, x2, y1, y2) {
    var dx = x1 - x2;
    var dy = y1 - y2;
    if (Math.abs(dy) < 100 && Math.abs(dx) > 200) {
        if (dx > 0) {
            if (page + 1 <= pagesCount) {
                page++;
                Move(1);
            }
        } else if (dx < 0) {
            if (page - 1 >= 1) {
                page--;
                Move(-1);
            }
        }
    } else if (Math.abs(dy) < 10 && Math.abs(dx) < 10) {
        gesture = false;
        MouseUp(event);
    }
}

function Move(direction) {
    var width = document.getElementById('content').offsetWidth;
    var start = parseInt(document.getElementById('table').style.marginLeft);
    if (motion == null) {
        motion = setInterval('Animate(' + start + ', ' + direction + ', Mathematica(' + width + ', 15))', 33);
        ChangePageNumber();
    }
    PreLoad();
}

function PreLoad() {
    if (page > 1) Load(page - 1);
    if (page < pagesCount) Load(page + 1);
}

function ChangePageNumber() {
    document.getElementById('pageNumber').innerHTML = page;
    if (page == 1) {
        document.getElementById('mouseLeft').style.backgroundImage = 'none';
        document.getElementById('mouseRight').style.backgroundImage = "url('http://dajbych.net/design/mouse-gesture-right.png')";
    } else if (page == pagesCount) {
        document.getElementById('mouseLeft').style.backgroundImage = "url('http://dajbych.net/design/mouse-gesture-left.png')";
        document.getElementById('mouseRight').style.backgroundImage = 'none';
    } else {
        document.getElementById('mouseLeft').style.backgroundImage = "url('http://dajbych.net/design/mouse-gesture-left.png')";
        document.getElementById('mouseRight').style.backgroundImage = "url('http://dajbych.net/design/mouse-gesture-right.png')";
    }
    localStorage.setItem('page', page);
}

function Animate(start, direction, positions) {
    var table = document.getElementById('table');
    var i = Number(table.style.zIndex);
    if (i < positions.length) {
        table.style.marginLeft = (start + positions[i] * -direction) + 'px';
        table.style.zIndex = i + 1;
    } else {
        table.style.zIndex = 0;
        clearInterval(motion);
        motion = null;
        return;
    }
}

function Mathematica(width, count) {
    var positions = new Array();
    for (var x = 0; x <= count; x++) {
        positions.push(width / 2 * (1 - Math.cos(Math.PI * x / count)));
    }
    return positions;
}

function Load(number) {
    if (document.getElementById('page' + number) == null) {
        if (typeof XMLHttpRequest != 'undefined') {
            var xmlHttp = new XMLHttpRequest();
            xmlHttp.open('GET', 'page.ashx?page=' + number);
            xmlHttp.onreadystatechange = function () { Paste(xmlHttp, number) };
            xmlHttp.send();
        }
    }
}

function Paste(request, number) {
    if (request.readyState == 4) {
        if (request.status == 200) {
            var name = 'page' + number;
            var td = document.createElement('td');
            td.setAttribute('id', name);
            td.style.paddingBottom = '80px';
            td.innerHTML = request.responseText;
            var after = document.getElementById('page' + (number + 1));
            if (after == null) {
                document.getElementById('table').firstChild.appendChild(td);
            } else {
                after.parentNode.insertBefore(td, after);
            }
            Deunderlinize(name);
        }
    }
}

function LoadAndShow() {
    if (document.getElementById('page' + page) == null) Load(page);
    ShowWhenLoaded();
}

function ShowWhenLoaded() {
    if (document.getElementById('page' + page) == null) {
        setTimeout(ShowWhenLoaded, 10);
    } else {
        var width = document.getElementById('content').offsetWidth;
        var left = width * (page - 1) * -1;
        document.getElementById('table').style.marginLeft = left + 'px';
    }
}