/* Copyright 2006 LuckyTeam.co.uk. To use this code on your own site, visit http://luckyteam.co.uk */

var ua = 'msie';
var W=navigator.userAgent.toLowerCase();
if(W.indexOf("opera")!=-1){ua='opera';}else if(W.indexOf("msie")!=-1){ua='msie';} else if(W.indexOf("mozilla")!=-1){ua='gecko';}

function _el(id){ return document.getElementById(id); };

function concat() {
    var result = [];

    for (var i = 0; i < arguments.length; i++)
        for (var j = 0; j < arguments[i].length; j++)
            result.push(arguments[i][j]);

    return result;
};

function withoutFirst(sequence) {
    result = [];

    for (var i = 1; i < sequence.length; i++)
        result.push(sequence[i]);

    return result;
};

function cons(element, sequence) {
    return concat([element], sequence);
};

Function.prototype.bind = function (object) {
    var method = this;
    var preappliedArguments = withoutFirst(arguments);
    return function () {
        method.apply(object, concat(preappliedArguments, arguments));
    };
};

Function.prototype.bindEventListener = function (object) {
    var method = this;
    var preappliedArguments = withoutFirst(arguments);
    return function (event) {
        method.apply(object, cons(event || window.event, preappliedArguments));
    };
};

function luckyView_vis(e){
    var o = e.currentTarget || e.srcElement;
    o.style.visibility='visible';
};

function luckyView_ia() {
    return false;
};

function luckyView_addEventListener(obj, event, listener){
    if(ua == 'gecko' || ua == 'opera'){
        obj.addEventListener(event, listener, false);
    } else if (ua == 'msie') {
        obj.attachEvent("on"+event,listener);
    }
};

function luckyView_removeEventListener(obj, event, listener){
    if(ua == 'gecko' || ua == 'opera'){
        obj.removeEventListener(event, listener, false);
    } else if (ua == 'msie') {
        obj.detachEvent("on"+event,listener);
    }
};

function luckyView_createMethodReference(object, methodName) {
    var args = arguments;
        return function () {
        object[methodName].apply(object, arguments, "sssss");
    };
};

function luckyView(title, images, start, mapCont, baseuri) {
    this.sx = 0;
    this.sy = 0;
    this.z = start;
    this.baseuri = baseuri;

    this.images = images;

    this.scaleImagePlus = 0;
    this.scaleImageMinus = 0;
    this.map = 0;
    this.mapCont = _el(mapCont);
    this.mapImage = 0;
    this.help = 0;
    this.title = title;

    this.lvisim = luckyView_createMethodReference(this, "visim");
    this.lunzoom = luckyView_createMethodReference(this, "unzoom");
    this.lzoom = luckyView_createMethodReference(this, "zoom");
    this.lmap_move = luckyView_createMethodReference(this, "map_move")
};

luckyView.prototype.map_mouse_down = function (e) {
    if(ua == 'gecko'){
        e.cancelBubble=true;
        e.preventDefault();
        e.stopPropagation();
    } else  if (ua == 'msie' || ua == 'opera') {
        window.event.cancelBubble = true;
    }

    this.map.style.cursor = 'move';
    luckyView_addEventListener(this.map, "mousemove", this.lmap_move);
    this.sx = e.clientX; this.sy = e.clientY;

    this.hideHelpPopup();
};

luckyView.prototype.stop_map_move = function () {
    this.map.style.cursor = 'default';
    luckyView_removeEventListener(this.map, "mousemove", this.lmap_move);
};

luckyView.prototype.map_mouse_up = function (e) {
    if(ua == 'gecko'){
        e.cancelBubble=true;
        e.preventDefault();
        e.stopPropagation();
    } else  if (ua == 'msie' || ua == 'opera') {
        window.event.cancelBubble = true;
    }

    this.stop_map_move();
};

luckyView.prototype.visim = function (e) {
    var o = e.currentTarget || e.srcElement || e;
    luckyView_removeEventListener(o, "load", this.lvisim);
    o.style.left=-(o.width/2 - parseInt(this.mapCont.style.width)/2) + 'px';
    o.style.top=-(o.height/2 - parseInt(this.mapCont.style.height)/2) + 'px';
    this.map.style.top = 0+'px';
    this.map.style.left = 0+'px';
    o.style.visibility='visible';
};

luckyView.prototype.map_move = function (e) {
    if(ua == 'gecko'){
        e.cancelBubble=true;
        e.preventDefault();
        e.stopPropagation();
    } else  if (ua == 'msie') {
        window.event.cancelBubble = true;
    }
    if(e){
        this.map_move_to(parseInt(this.map.style.left) + e.clientX - this.sx, parseInt(this.map.style.top) + e.clientY - this.sy);
        this.sx = e.clientX; this.sy = e.clientY;
    }
    this.hideHelpPopup();
};

luckyView.prototype.check_mouse_coords = function (e) {
    if(e.clientX > parseInt(this.mapCont.offsetLeft + parseInt(this.mapCont.style.width))){
        this.stop_map_move();
    }
    if(e.clientX < parseInt(this.mapCont.offsetLeft) ){
        this.stop_map_move();
    }
    if(e.clientY > parseInt(this.mapCont.offsetTop + (parseInt(this.mapCont.style.height)-this.map.offsetTop))){
        this.stop_map_move();
    }
    if(e.clientY < parseInt(this.mapCont.offsetTop) ){
        this.stop_map_move();
    }
};



luckyView.prototype.showCopyrightPopup = function (e, text) {
    if(this.help.style.visibility == 'visible'){
        this.hideHelpPopup();
        return;
    }
    var o = e.currentTarget || e.srcElement || e;
    var o_height = o.style.height || o.height;
    var o_width = o.style.width || o.width;
    text = '<p>Click the + and - to zoom in and out.<br/>Click and drag the image to move around it.</p><p>Current image size is '+this.mapImage.width+'x'+this.mapImage.height+'px</p>';
    this.showHelpPopup(e, (parseInt(o.style.left)+o_width), (parseInt(o.style.top)+o_height), text);
};

luckyView.prototype.showHelpPopup = function (e, x, y, text) {
    if(ua == 'gecko'){
        e.cancelBubble=true;
        e.preventDefault();
        e.stopPropagation();
    } else  if (ua == 'msie') {
        window.event.cancelBubble = true;
    }
    this.help.style.top = y + 'px';
    this.help.style.left = x + 'px';
    this.help.innerHTML = text;
    this.help.style.visibility = "visible";
};

luckyView.prototype.hideHelpPopup = function () {
    this.help.style.visibility = "hidden";
};

luckyView.prototype.addScaleImages = function () {
    this.scaleImagePlus = document.createElement("IMG");
    this.scaleImagePlus.style.position="absolute";
    this.scaleImagePlus.style.cursor="pointer";
    this.scaleImagePlus.style.left='10px';
    this.scaleImagePlus.style.top='10px';
    this.scaleImagePlus.style.zIndex=2;
    this.scaleImagePlus.alt="";
    this.scaleImagePlus.title="";
    this.scaleImagePlus.unselectable="on";
    this.scaleImagePlus.onselectstart=luckyView_ia;
    this.scaleImagePlus.oncontextmenu=luckyView_ia;
    this.scaleImagePlus.style.MozUserSelect="none";
    this.scaleImagePlus.style.border="0";
    if(ua == 'gecko'){
        this.scaleImagePlus.style.visibility='hidden';
        luckyView_addEventListener(this.scaleImagePlus, "load", luckyView_vis);
    }
    luckyView_addEventListener(this.scaleImagePlus, "click", this.lzoom);
    this.mapCont.appendChild(this.scaleImagePlus);
    this.scaleImagePlus.src=this.baseuri+'plus.gif';

    this.scaleImageMinus = document.createElement("IMG");
    this.scaleImageMinus.style.position="absolute";
    this.scaleImageMinus.style.cursor="pointer";
    this.scaleImageMinus.style.left='10px';
    this.scaleImageMinus.style.top='28px';
    this.scaleImageMinus.style.zIndex=2;
    this.scaleImageMinus.alt="";
    this.scaleImageMinus.title="";
    this.scaleImageMinus.unselectable="on";
    this.scaleImageMinus.onselectstart=luckyView_ia;
    this.scaleImageMinus.oncontextmenu=luckyView_ia;
    this.scaleImageMinus.style.MozUserSelect="none";
    this.scaleImageMinus.style.border="0px";
    if(ua == 'gecko'){
        this.scaleImageMinus.style.visibility='hidden';
        luckyView_addEventListener(this.scaleImageMinus, "load", luckyView_vis);
    }
    luckyView_addEventListener(this.scaleImageMinus, "click", this.lunzoom);
    this.mapCont.appendChild(this.scaleImageMinus);
    this.scaleImageMinus.src=this.baseuri+'minus.gif';

    var f = document.createElement("IMG");
    f.style.position="absolute";
    f.style.cursor="pointer";
    f.style.left='10px';
    f.style.top='46px';
    f.style.zIndex=2;
    f.alt="";
    f.title="";
    f.unselectable="on";
    f.onselectstart=luckyView_ia;
    f.oncontextmenu=luckyView_ia;
    f.style.MozUserSelect="none";
    f.style.border="0px";
    if(ua == 'gecko'){
        f.style.visibility='hidden';
        luckyView_addEventListener(f, "load", luckyView_vis);
    }
    f.onclick = this.showCopyrightPopup.bindEventListener(this);
    luckyView_addEventListener(this.help, "click", luckyView_createMethodReference(this, "hideHelpPopup"));
    this.mapCont.appendChild(f);
    f.src=this.baseuri+'help.gif';
};

luckyView.prototype.addImage = function () {

    this.hideHelpPopup();

    var f = document.createElement("IMG");
    f.src=this.images[this.z];
    f.style.position="absolute";
    f.style.zIndex=0;
    f.unselectable="on";
    f.alt = this.title;
    f.title = this.title;
    f.onselectstart=luckyView_ia;
    f.oncontextmenu=luckyView_ia;
    f.style.MozUserSelect="none";
    f.style.border="0px solid blue";
    if(ua == 'gecko'){
        f.style.visibility='hidden';
        luckyView_addEventListener(f, "load", this.lvisim);
    } else {
        if(f.width != 0) { /* already cached in ie */
            this.visim(f);
        } else {
            luckyView_addEventListener(f, "load", this.lvisim);
        }
    }

    if(!this.mapImage){
        this.map.appendChild(f);
    } else {
        this.map.replaceChild(f, this.mapImage);
    }
    this.mapImage = f;
};

luckyView.prototype.map_move_to = function (x, y) {
    var dx = (this.mapImage.width/2 - parseInt(this.mapCont.style.width)/2 );
    var dy = (this.mapImage.height/2 - parseInt(this.mapCont.style.height)/2);
    if((x - dx) <= 0 && (dx + x) >= 0)
        this.map.style.left = x + 'px';
    if((y - dy) <= 0 && (dy + y) >= 0)
        this.map.style.top = y + 'px';
};

luckyView.prototype.initContainer = function () {
    while (this.mapCont.firstChild) {
        this.mapCont.removeChild(this.mapCont.firstChild);
    }

    /*
    var f = document.createElement("DIV");
    f.style.position = 'absolute';
    f.style.top = (parseInt(this.mapCont.style.height) - 15) + 'px';
    f.style.left = ((parseInt(this.mapCont.style.width) - 218) / 2) + 'px';
    f.style.zIndex = 200;
    f.style.fontSize = '10px';
    f.style.color = '#555';
    f.style.fontFamily = 'Verdana';
    f.innerHTML = "&#169;2006 <b>LuckyView</b> by <a style=\"color: #555\" href=\"http://luckyteam.co.uk\">LuckyTeam.co.uk</a>";
    this.mapCont.appendChild(f);
    */

    this.help = document.createElement("DIV");
    this.help.style.position = 'absolute';
    this.help.style.zIndex = 200;
    this.help.className = 'luckyViewHelp';
    this.mapCont.appendChild(this.help);

    var pr = document.createElement("IMG");
    pr.src=this.baseuri+'progress.gif';

    pr.style.position="absolute";
    prWidth = parseInt(pr.width);
    if(prWidth == 0){
        prWidth = 241;
    }
    pr.style.left=((parseInt(this.mapCont.style.width) - prWidth) / 2) + 'px';
    pr.style.top=(parseInt(this.mapCont.style.height) - parseInt(pr.height))/2 + 'px';
    pr.style.zIndex=0;
    pr.unselectable="on";
    pr.onselectstart=luckyView_ia;
    pr.oncontextmenu=luckyView_ia;
    pr.style.MozUserSelect="none";
    pr.style.border="0px";
    this.mapCont.appendChild(pr);

    this.map = document.createElement("DIV");
    this.map.style.position = 'absolute';
    this.mapCont.appendChild(this.map);
};


luckyView.prototype.initView = function () {
    this.initContainer();
    this.addImage();
    this.addScaleImages();
    luckyView_addEventListener(this.map, "mousedown", luckyView_createMethodReference(this, "map_mouse_down"));
    luckyView_addEventListener(this.map, "mouseup", luckyView_createMethodReference(this, "map_mouse_up"));
    luckyView_addEventListener(window.document, "mousemove", luckyView_createMethodReference(this, "check_mouse_coords"));
    luckyView_addEventListener(window.document, "mouseup", luckyView_createMethodReference(this, "map_mouse_up"));
};