// ==UserScript==
// @name         test
// @namespace    http://your.homepage/
// @version      0.1
// @description  enter something useful
// @author       You
// @match        http://acomics.ru/*/*
// @require      http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
// @reauire      https://raw.githubusercontent.com/mrhenry/jquery-image-loader/master/public/jquery-image-loader-min.js
// @grant        none
// ==/UserScript==

var nextPage;
var previousPage;
var currentImage;
var currentPage;
var exitPage;
var pageAll;
var comments;

$(function(){
    nextPage = $('.next').attr('href');
    currentImage = $('#mainImage').attr('src');
    previousPage = $('.prev').attr('href');
    currentPage = $('.issueNumber').text();
    comments = $('.comment');
    console.log(currentPage);
    $('head').append('<style>'
                     +'.comments\n'
                     +'{position:fixed; top:0px; left:-400px; width:400px; height:100%; border:solid; border-color:#757585; background:white; overflow-y:auto;}\n'
                     +'.comments:hover\n'
                     +'{transition: 0.5s; left:0px;}'
                     +'#download\n'
                     +'{position:absolute; top:50%; left:50%; margin-top: -100px; margin-left: -100px; width:200px; heigth:200px;}'
                     +'</style>');
    var download = $('<div id="download"><img src="http://sierrafire.cr.usgs.gov/images/loading.gif" width="100%" heigth="100%"></img></div>');
    var commentBlock = $('<div></div>').addClass('comments');
    var numberPages = $('<div></div>').css({"position":"fixed", "bottom":"15px","left":"15px","border":"solid","border-color":"#757575","border-radius":"8px","border-width":"2px"}).addClass('pages');
    var exitButton = $("<button>exit</button>").css({"position":"fixed", "bottom":"15px", "right":"15px"});
    var button = $("<button>read</button>").click(function(){
        var imageDiv = $('<div align="center" class="img">').attr('id', 'imageDiv').css({"position":"relative","background-color":"black"});
        var image = $('<img id="dynamic">');
        $('body').html("");
        $('body').append(imageDiv);
        $('body').append(download);
        $('#download').hide();
        image.appendTo('.img');
        numberPages.appendTo('body');
        $('body').on("keydown", function(event){
            if(event.which===39){
                console.log("button right");
                getImage(true);
            }
            else if(event.which===37){
                console.log("button left");
                getImage(false);
            }
        });

        commentBlock.appendTo('body');
        read();
        exitButton.appendTo('body');
    }).css({"position":"fixed", "bottom":"15px", "right":"15px"});
    exitButton.click(function(){
        exit();
    });
    $('body').append(button);

});

function read(){
    $('body').animate({ scrollTop: 0 }, "fast");
    $('.pages').html('<span>'+currentPage+'</span>');
    $('span').css('color', 'white');
    $('.comments').html(comments);
    $('#dynamic').attr('src', currentImage);
    $('#dynamic').click(function(){
        getImage(true)
    });
}

function getImage(next){
    var url;
    if(next){
        url = nextPage;
        exitPage = nextPage;
    }
    else{
        url = previousPage;
        exitPage = previousPage;
    }
    $('#download').show();
    $.get(url, function(data, status){
        nextPage = $(data).find('.next').attr('href');
        currentImage = $(data).find('#mainImage').attr('src');
        previousPage = $(data).find('.prev').attr('href');
        currentPage = $(data).find('.issueNumber').text();
        comments = $(data).find('.comment');
        data = null;
        read();
        $('#download').hide();
    });
}

function exit(){
    window.open(exitPage,"_self");
}