jQuery(document).ready(function () {
    var mTop = 0;
    var mLeft = 0;
    var maxiDT = 11;
    var maxiLR = 2;
    var topscroll = 108;
    var linescroll = 242;
    jQuery('#reset').css({ 'opacity': '1' });
    jQuery('#su').css({ 'opacity': '1' });
    jQuery('#sinistra').css({ 'opacity': '1' });

    function resetall() {
        if (mTop != 0 || mLeft != 0) {
            jQuery('#reset').css({ 'opacity': '1' });
        } else {
            jQuery('#reset').css({ 'opacity': '1' });
        }
    }

    function scrolldown() {
        calcolamax = topscroll * maxiDT;
        if (Math.abs(mTop) < calcolamax) {
            mTop = mTop - topscroll;
            $('#insidetoscroll').animate({ 'marginTop': mTop + 'px' }, 450);
            jQuery('#su').css({ 'opacity': '1' });
            if (Math.abs(mTop) >= calcolamax) {
                jQuery('#giu').css({ 'opacity': '1' });
            }
        }
        resetall();
    }

    function scrollTop() {
        if (mTop != 0) {
            jQuery('#giu').css({ 'opacity': '1' });
            mTop = mTop + topscroll;
            $('#insidetoscroll').animate({ 'marginTop': mTop + 'px' }, 450);
        }
        if (mTop == 0) {
            jQuery('#su').css({ 'opacity': '1' });
        }
        resetall();
    }

    function scrollRight() {
        calcolamax = linescroll * (maxiLR - 1);
        if (Math.abs(mLeft) < calcolamax) {
            jQuery('#sinistra').css({ 'opacity': '1' });
            mLeft = mLeft - linescroll;
            $('#insidetoscroll').animate({ 'marginLeft': mLeft + 'px' }, 450);
        }
        if (Math.abs(mLeft) >= calcolamax) {
            jQuery('#destra').css({ 'opacity': '1' });
        }
        resetall();
    }

    function scrollLeft() {
        if (mLeft != 0) {
            jQuery('#destra').css({ 'opacity': '1' });
            mLeft = mLeft + linescroll;
            $('#insidetoscroll').animate({ 'marginLeft': mLeft + 'px' }, 450);
        }
        if (mLeft == 0) {
            jQuery('#sinistra').css({ 'opacity': '1' });
        }
        resetall();
    }

    function reset() {
        $('#insidetoscroll').animate({ 'marginLeft': '0px',
            'marginTop': '0px'
        },
                                  1000);
        mLeft = 0;
        mTop = 0;
        jQuery('#reset').css({ 'opacity': '1' });
        jQuery('#giu').css({ 'opacity': '1' });
        jQuery('#su').css({ 'opacity': '1' });
        jQuery('#sinistra').css({ 'opacity': '1' });
        jQuery('#destra').css({ 'opacity': '1' });
    }

    jQuery("#giu").bind("click", scrolldown);
    jQuery("#su").bind("click", scrollTop);
    jQuery("#destra").bind("click", scrollRight);
    jQuery("#sinistra").bind("click", scrollLeft);
    jQuery("#reset").bind("click", reset);
}); 

