function showSubImage(img,x,y) {
    document.getElementById('mainImage').style.display = 'block';
    if (document.getElementById('mainVideo')) document.getElementById('mainVideo').style.display = 'none';
    if ((x > 300) || (y > 300)) {
        document.getElementById('mainImage').innerHTML = "<img src=\"http://www.fun-shop.com/show_image.php?im=" + img + "&size=300\" width=\"300\" height=\"300\" border=\"0\" style=\"display: block; cursor: move;\" onClick=\"showBigImg('"+img+"',"+x+","+y+")\">CLICK IMAGE TO ENLARGE"
    }else {
        document.getElementById('mainImage').innerHTML = "<img src=\"http://www.fun-shop.com/show_image.php?im=" + img + "&size=300\" width=\"300\" height=\"300\" border=\"0\" style=\"display: block;\">"
    }
}

function showSubVideo(videoFile,Name) {
    document.getElementById('bigImage').innerHTML = "<div id=\"innerBigImage\" style=\"display: none; background-color: #000;\"></div>"
    var so = new SWFObject('/img/video/player.swf','mpl','600','488','9');
    so.addParam('allowscriptaccess','always');
    so.addParam('allowfullscreen','true');
    so.addParam('flashvars','&file='+videoFile+'&logo=/img/video/logo.png&autostart=true');
    so.write('innerBigImage');
    showBigImg("mainVideo",600,488)
}

imgW = 0
imgH = 0
maxW = 300
maxH = 300
offY = 0
fade = 0
function showBigImg(img,inW,inH) {
    maxW = inW
    maxH = inH
    var winW = 600, winH = 400
    if (parseInt(navigator.appVersion)>3) {
        if (navigator.appName=="Netscape") {
            winW = document.body.offsetWidth
            winH = document.body.offsetHeight
            offY = window.pageYOffset - 6
        }
        if (navigator.appName.indexOf("Microsoft")!=-1) {
            if (document.documentElement) {
                winW = document.documentElement.scrollWidth
                winH = document.documentElement.scrollHeight
                offY = document.documentElement.scrollTop - 2
            }else {
                winW = document.body.scrollWidth
                winH = document.body.scrollHeight
                offY = document.body.scrollTop - 14
            }
        }
    }

    inX = 0
    inY = 0
    disX = 300
    disY = 300
    if (self.innerWidth) {
		inX = self.innerWidth
		inY = self.innerHeight
	}else if (document.documentElement && document.documentElement.clientWidth) {
		inX = document.documentElement.clientWidth
		inY = document.documentElement.clientHeight
	}else if (document.body) {
		inX = document.body.clientWidth
		inY = document.body.clientHeight
	}

    if(maxH/2 >= inY/2 + offY) {
        offY += maxH/2 - (inY/2 + offY)  //keep image from breaking top
    }

    imgW = 0
    imgH = 0
    fade = 0
    document.getElementById('background50').style.width = winW + "px"
    document.getElementById('background50').style.height = winH + "px"
    document.getElementById('background50').style.opacity = fade/100
    document.getElementById('background50').style.filter = 'alpha(opacity='+fade+')'
    if (img != "mainVideo") document.getElementById('bigImage').innerHTML = "<img src=\"" + img + "\" alt=\"click anywhere to close\" id=\"innerBigImage\" style=\"display: none; background-color: #000;\">"
    document.getElementById('bigImage').style.width = "0px"
    document.getElementById('bigImage').style.height = "0px"
    document.getElementById('bigImage').style.top = inY/2 + offY + "px"
    document.getElementById('bigImage').style.overflow = "visible"
    document.getElementById('innerBigImage').style.opacity = fade/100
    document.getElementById('innerBigImage').style.filter = 'alpha(opacity='+fade+')'

    tmf = setInterval("showBigImgBackFade('"+inX+"','"+inY+"')",20)
}

function showBigImgBackFade(inX,inY) {
    fade += 10
    document.getElementById('background50').style.opacity = fade/100
    document.getElementById('background50').style.filter = 'alpha(opacity='+fade+')'
    if (fade >= 90) {
        clearInterval(tmf)
        document.getElementById('background50').style.opacity = .9
	    document.getElementById('background50').style.filter = 'alpha(opacity=90)'
        fade = 0
        tmw = setInterval("showBigImgWidth('"+inX+"','"+inY+"')",10)
    }
}

function showBigImgWidth(inX,inY) {
    imgW += 20
    if (imgW >= maxW) {
        clearInterval(tmw)
        document.getElementById('bigImage').style.width = maxW + "px"
        tmh = setInterval("showBigImgHeight('"+inY+"')",10)
    }else {
        document.getElementById('bigImage').style.width = imgW + "px"
        document.getElementById('bigImage').style.left = (inX-imgW)/2 + "px"
    }
    document.getElementById('bigImage').style.display = "block"
}

function showBigImgHeight(inY) {
    imgH += 20;
    if (imgH >= maxH) {
        clearInterval(tmh)
        document.getElementById('bigImage').style.height = maxH + "px"
        document.getElementById('innerBigImage').style.display = "block"
        tmf = setInterval("showBigImgFade()",20);
    }else {
        document.getElementById('bigImage').style.height = imgH + "px"
        document.getElementById('bigImage').style.top = (inY-imgH)/2 + offY + "px"
    }
}

function showBigImgFade() {
    fade += 10
    document.getElementById('innerBigImage').style.opacity = fade/100;
    document.getElementById('innerBigImage').style.filter = 'alpha(opacity='+fade+')'
    if (fade >= 100) {
        clearInterval(tmf)
        if (maxH == 600) {
            document.getElementById('bigImage').innerHTML += "<div align=\"right\" style=\"background-color: #FFF; position: absolute; right: 0px; top: 0px; height: 17px; padding: 1px 20px 1px 2px; color: #3B576B; font: normal 13px Arial; cursor: pointer;\">Close Image</div>"
            document.getElementById('bigImage').innerHTML += "<div align=\"center\" style=\"position: absolute; right: 1px; top: 1px; color: #FFF; font: bold 13px/15px Arial; cursor: pointer; border: 1px outset #3B576B; background-color: #3B576B; width: 15px; height: 15px;\">X</div>"
        }else {
            document.getElementById('bigImage').innerHTML += "<div align=\"right\" style=\"background-color: #FFF; position: absolute; right: 0px; top: -18px; height: 17px; width: "+(maxW-20)+"px; padding: 1px 20px 1px 2px; color: #3B576B; font: normal 13px Arial; cursor: pointer;\">Close Image</div>"
            document.getElementById('bigImage').innerHTML += "<div align=\"center\" style=\"position: absolute; right: 1px; top: -17px; color: #FFF; font: bold 13px/15px Arial; cursor: pointer; border: 1px outset #3B576B; background-color: #3B576B; width: 15px; height: 15px;\">X</div>"
        }
    }
}

function closeBigImg() {
    document.getElementById('background50').style.width = "0px"
    document.getElementById('background50').style.height = "0px"
    document.getElementById('bigImage').style.display = "none"
    document.getElementById('bigImage').style.width = "0px"
    document.getElementById('bigImage').style.height = "0px"
    document.getElementById('bigImage').innerHTML = ""
}