/* Marc Boronat                                                               */
/* Allways set up the imageboard. You can use body onload.                    */
/* Example: imageboard_set('element_id', 'image_height_px');                  */

var tag_name = "a";
var position = 0;
var velocity = 50;
var friction = 10;
var moving = false;
var fail_dist;

function imageboard_set(element_id, img_height, store) {

    var the_element = document.getElementById(element_id);
    if (the_element != null) {
        the_element.style.overflow = "hidden";
        the_element.style.position = "relative";
        the_element.style.visibility = "hidden";

        var images = the_element.getElementsByTagName(tag_name);
        var left_init = 0;
        var top_init = 0;
        var the_img;

        for (i=0;i<images.length;i++){
            the_img = images.item(i);
            if (!store) {the_img.removeAttribute("href");}
            the_img.style.position = "absolute";
            the_img.style.height = img_height;
            the_img.style.width = "auto";
            the_img.style.left = left_init+"px";
            the_img.style.top = top_init+"px";
            left_init += the_img.offsetWidth;
            left_init = Math.floor(left_init);
        }

        toggle_visibility(the_element);
    }
    
}

function imageboard_scroll(element_id, direction, distance) {

    var the_element = document.getElementById(element_id);
    var first_img = the_element.getElementsByTagName(tag_name).item(0);
    var last_img = the_element.lastChild;

    if (moving != true) {
        switch(direction){
            case "L":
                if(first_img.offsetLeft < 0){
                    if(first_img.offsetLeft+distance < 0) {
                        moving = true;
                        slide_x_int = window.setInterval("slide_x("+distance+",'"+element_id+"')",1);
                    } else {
                        moving = true;
                        fail_dist = first_img.offsetLeft;
                        if (fail_dist < 0) {fail_dist = -fail_dist};
                        slide_x_int = window.setInterval("slide_x("+fail_dist+",'"+element_id+"')",1);
                    }
                }
            break;

            case "R":
                if((last_img.offsetLeft+last_img.offsetWidth) > document.body.offsetWidth){
                    if((last_img.offsetLeft+last_img.offsetWidth-distance) > document.body.offsetWidth) {
                        moving = true;
                        slide_x_int = window.setInterval("slide_x(-"+distance+",'"+element_id+"')",1);
                    } else {
                        moving = true;
                        fail_dist = document.body.offsetWidth - (last_img.offsetLeft+last_img.offsetWidth);
                        slide_x_int = window.setInterval("slide_x("+fail_dist+",'"+element_id+"')",1);
                    }
                }
            break;
        }
    }

}

function slide_x(distance, element_id) {

    var the_element = document.getElementById(element_id);
    var childs = the_element.getElementsByTagName(tag_name);

    if (distance<0) {
        if (position <= distance) {
            clearInterval(slide_x_int);
            moving = false;
            position = 0;
            velocity = 50;
        } else {
            for (i=0;i<childs.length;i++) {
                the_img = childs.item(i);
                the_img.style.left = (the_img.offsetLeft-(velocity))+"px";
            }
            position -= velocity;
            velocity -= Math.ceil(velocity/friction);
            if (velocity < 1) {
                clearInterval(slide_x_int);
                moving = false;
                position = 0;
                velocity = 50;
            }
        }
    }

    if (distance>0) {
        if (position >= distance) {
            clearInterval(slide_x_int);
            moving = false;
            position = 0;
            velocity = 50;
        } else {
            for (i=0;i<childs.length;i++) {
                the_img = childs.item(i);
                the_img.style.left = (the_img.offsetLeft+(velocity))+"px";
            }
            position += velocity;
            velocity -= Math.ceil(velocity/friction);
            if (velocity < 1) {
                clearInterval(slide_x_int);
                moving = false;
                position = 0;
                velocity = 50;
            }
        }
    }
    
}

/* Toggle Visibility                                                          */

var toggle_lmnt;

function showimg(url) {
    var popimg = document.createElement("div");
    popimg.setAttribute('class', 'popimg');
    popimg.setAttribute('className','popimg');
    popimg.style.visibility = "hidden";

    var theimage = document.createElement("img");
    theimage.setAttribute('src', url);
    theimage.setAttribute('class', 'theimage');
    theimage.setAttribute('className','theimage');

    var close = document.createElement("img");
    close.setAttribute('onclick', 'toggle_visibility(this.parentNode)');
    close.setAttribute('src', '../media/web_stock/close.png');
    close.setAttribute('class', 'close');
    theimage.setAttribute('className','close');
    close.style.cursor = "pointer";

    popimg.appendChild(theimage);
    popimg.appendChild(close);

    document.documentElement.appendChild(popimg);
    toggle_visibility(popimg);
}

function toggle_visibility(lmnt) {
    toggle_lmnt = lmnt;
    if(lmnt.style.visibility == "hidden"){
        lmnt.style.visibility = "visible";
        lmnt.style.opacity = 0.1;
        lmnt.style.filter = "alpha(opacity=1)";
        appear_int = window.setInterval("appear(toggle_lmnt);", 10);
    } else if (lmnt.style.visibility == "visible"){
        lmnt.style.opacity = 1.0;
        lmnt.style.filter = "alpha(opacity=100)";
        appear_int = window.setInterval("disappear(toggle_lmnt);", 10);
    }
}

function appear(lmnt) {
    if(lmnt.style.opacity >= 1){
        clearInterval(appear_int);
    } else {
        lmnt.style.opacity *= 1.1;
        lmnt.style.filter = "alpha(opacity="+(lmnt.style.opacity*100)+")";
    }
}

function disappear(lmnt) {
    if(lmnt.style.opacity <= 0.1){
        clearInterval(appear_int);
        document.documentElement.removeChild(lmnt);
    } else {
        lmnt.style.opacity -= 0.1;
        lmnt.style.filter = "alpha(opacity="+(lmnt.style.opacity*100)+")";
    }
}

/* Zoom image                                                                 */

var zoom_lmnt;
var zoom_viewport;
var zoom_image;
var zoom_frame;

function zoom(event, lmnt, zimg_url) {
    zoom_lmnt = lmnt;
    zoom_lmnt.style.cursor = "none";
    zoom_lmnt.onmouseout = hide_zview;

    var event_x = event.clientX;
    var event_y = event.clientY;
    var lmnt_x = 0;
    var lmnt_y = 0;
    var x_proportion = 0;
    var y_proportion = 0;

    while(zoom_lmnt && !isNaN(zoom_lmnt.offsetLeft) && !isNaN(zoom_lmnt.offsetTop)) {
        lmnt_x += zoom_lmnt.offsetLeft - zoom_lmnt.scrollLeft;
        lmnt_y += zoom_lmnt.offsetTop - zoom_lmnt.scrollTop;
        zoom_lmnt = zoom_lmnt.offsetParent;
    }

    if(!document.getElementById('zoom_viewport')){
        zoom_viewport = document.createElement("div");
        zoom_viewport.setAttribute('id', 'zoom_viewport');
        zoom_viewport.setAttribute('class', 'zoom_viewport');
        zoom_viewport.setAttribute('className','zoom_viewport');
        zoom_image = document.createElement("img");
        zoom_image.setAttribute('src', zimg_url);
        zoom_frame = document.createElement("div");
        zoom_viewport.appendChild(zoom_image);
        zoom_viewport.appendChild(zoom_frame);
        document.documentElement.appendChild(zoom_viewport);
    } else {
        zoom_image.setAttribute('src', zimg_url);
        zoom_viewport = document.getElementById('zoom_viewport');
        document.getElementById('zoom_viewport').style.visibility = "visible";
    }

    rel_mouse_x = event_x-lmnt_x;
    rel_mouse_y = event_y-lmnt_y;
    x_proportion = Math.floor(zoom_image.offsetWidth/lmnt.offsetWidth);
    y_proportion = Math.floor(zoom_image.offsetHeight/lmnt.offsetHeight);
    z_image_left = (-(x_proportion*rel_mouse_x))+5;
    z_image_top = (-(y_proportion*rel_mouse_y))+5;

    zoom_frame.style.top = (event_y+5)+"px";
    zoom_frame.style.left = (event_x-5)+"px";
    zoom_viewport.style.top = (lmnt_y-40)+"px";
    zoom_viewport.style.left = (lmnt_x+195)+"px";
    zoom_image.style.left = z_image_left+"px";
    zoom_image.style.top = z_image_top+"px";
    zoom_image.style.clip = "rect("+y_proportion*rel_mouse_y+"px "+((x_proportion*rel_mouse_x)+300)+"px "+((y_proportion*rel_mouse_y)+300)+"px "+x_proportion*rel_mouse_x+"px)";
}

function hide_zview() {
    document.getElementById('zoom_viewport').style.visibility = "hidden";
}

/* Misc functions                                                             */

function logo_appear() {
    lmnt = document.getElementById("thelogo");
    toggle_visibility(lmnt);
}

function switch_img(lmnt_id, new_src, new_big) {
    lmnt = document.getElementById(lmnt_id);
    lmnt.setAttribute('src',new_src);
    //lmnt.setAttribute('onmousemove','zoom(event,this,\''+new_big+'\')');
    lmnt.style.visibility = "hidden";
    toggle_visibility(lmnt);
}

function show_hide(lmnt) {
    if(lmnt.style.visibility == 'visible') {
        lmnt.style.visibility = 'hidden';
        lmnt.style.display = 'none';
    }else if(lmnt.style.visibility == 'hidden') {
        lmnt.style.visibility = 'visible';
        lmnt.style.display = 'block';
    }
}