var imgid = 1;

var imgNum1 = 49;

var imgNum2 = imgNum1+1;

function $(objid){

        return document.getElementById(objid);

}

$('lnext').onclick = function(){

        changeImage(2);

}

$('rnext').onclick = function(){

        changeImage(2);

}



function getOs(){

        var OsObject = "";

        if(navigator.userAgent.indexOf("MSIE 6.")>0){

                return "MSIE6";

        }

        if(navigator.userAgent.indexOf("MSIE 7.")>0){

                return "MSIE7";

        }

}



function loadImage(limgid){

        var smal = new Image();

        smal.src = '../images/gallery/small/' + limgid + '.jpg';

        var img = new Image();

        img.src = '../images/gallery/image/' + limgid + '.jpg';

        img.onload = function(){

                $('box' + imgid).innerHTML = '<a id="ahover' + imgid + '" href="javascript:void(0);" onfocus="this.blur()" onclick="changeImage(' + imgid + ');"><img src="../images/gallery/thumb/' + imgid + '.jpg" /></a>';

                if(imgid < imgNum1){

                        loadImage(imgid);

                }

        }

        

        

        $('box' + imgid).innerHTML = '<a id="ahover' + imgid + '" href="javascript:void(0);" onfocus="this.blur()" onclick="changeImage(' + imgid + ');"><img src="../images/gallery/thumb/' + imgid + '.jpg" /></a>';

        if(imgid == 1){

                $('ahover' + imgid).className = 'ah';

        }

        imgid ++;

        if(imgid < imgNum2 && getOs() == 'MSIE6'){

                loadImage(imgid);

        }

        if(imgid < imgNum2 && getOs() == 'MSIE7'){

                loadImage(imgid);

        }

}

function changeImage(cimgid){

        $('imagebox').innerHTML = '<img src="../images/gallery/image/' + cimgid + '.jpg" />';

        $('imagebox2').innerHTML = '<img src="../images/gallery/small/' + cimgid + '.jpg" />';

        $('num').innerHTML = '<span>( '+cimgid+' )</span>';

        for(var i = 1; i < imgNum2; i ++){

                $('ahover' + i).className = 'dd';

        }

        $('ahover' + cimgid).className = 'ah';

        

        if(cimgid != 1 && cimgid != imgNum1){

                $('lback').onclick = function(){

                        changeImage(cimgid - 1);

                }

                $('rback').onclick = function(){

                        changeImage(cimgid - 1);

                }

                $('lnext').onclick = function(){

                        changeImage(cimgid + 1);

                }

                $('rnext').onclick = function(){

                        changeImage(cimgid + 1);

                }

        }

        if(cimgid == imgNum1){

                $('lnext').onclick = "";

                $('rnext').onclick = "";

                $('lback').onclick = function(){

                        changeImage(cimgid - 1);

                }

                $('rback').onclick = function(){

                        changeImage(cimgid - 1);

                }

        }

        if(cimgid == 1){

                $('lback').onclick = "";

                $('rback').onclick = "";

                $('lnext').onclick = function(){

                        changeImage(2);

                }

                $('rnext').onclick = function(){

                        changeImage(2);

                }

        }

}

loadImage(imgid);