if(typeof ThumbnailImage=="undefined"){
    var ThumbnailImage = new Array();
};

var orgWidth=152;
var orgHeight=250;
//var hostDomain = "http://localhost:2296/MobadWebApp/";
var hostDomain = "http://www.mysite-is.jp/";

/*******引数で指定されたエレメントの幅の取得処理*****/
function getElmWidth(elm){
    var width=0;
    if(elm.offsetWidth){
        width = elm.offsetWidth;
    }else if(elm.clip && elm.clip.width){
        width = elm.clip.width;
    }else if(elm.style && elm.style.pixelWidth){
        width = elm.style.pixelWidth;
    }
    return parseInt(width);
};
function getFrameUrl(id){
    //IDの末尾にはフレームNoが格納されている。
    index = id.lastIndexOf('-');
    frameNo = parseInt(id.substr(index+1,1));
    var frameImg="";
    if(frameNo==0){
        frameImg = "mobframe-brack.gif";
    }else if(frameNo==1){
        frameImg = "mobframe-red.gif";
    }else if(frameNo==2){
        frameImg = "mobframe-green.gif";
    }else if(frameNo==3){
        frameImg = "mobframe-orange.gif";
    }
    return hostDomain + "parts/" + frameImg;
};
function getPrevFrameColer(id){
    index = id.lastIndexOf('-');
    frameNo = parseInt(id.substr(index+1,1));
    var color="";
    if(frameNo==0){
        color = "#000000";
    }else if(frameNo==1){
        color = "#ff0000";
    }else if(frameNo==2){
        color = "#00cc00";
    }else if(frameNo==3){
        color = "#ff9900";
    }
    return color;
};
var PreviewTimer = "";
function showPreview(centerTop,width,height,qruid){
    prevElm = document.getElementById('mobframe');
    prevElm.style.width=width + "px";
    prevElm.style.height=height + "px";
    
    prevElm.style.borderStyle="solid";
    prevElm.style.borderWidth="1px";
    prevElm.style.borderColor=getPrevFrameColer(qruid);
    prevElm.style.backgroundColor="#ffffff";
    prevElm.style.top = centerTop - parseInt(height/2) + "px";
    
    if(width==orgWidth && height==orgHeight){
        //フレーム画像を設定
        frmimgurl = getFrameUrl(qruid);
        prevElm.style.backgroundImage = "url('" + frmimgurl + "')";
        prevElm.style.borderWidth="0";
        prevElm.style.backgroundColor="";
        
        //プレビューサムネイル画像を設定
        var thumbnail = document.getElementById("myqrimg");
        thumbnail.src = ThumbnailImage[qruid].src;
        thumbnail.style.visibility = "visible";
        PreviewTimer="";
        return;
    }
    width += 38;
    height += 62;
    if(width>orgWidth)width=orgWidth;
    if(height>orgHeight)height=orgHeight;
    
    func="showPreview(" + centerTop + "," + width + "," + height + ",'" + qruid + "')";
    PreviewTimer=setTimeout(func,70);
};
var TmpParentNode="";//overflow設定をhiddenからVisibleに変更したNodeを一時的に格納する。
//引数はマウスオーバ対処のQRコードのエレメント
function _onMouseOver(obj){
    //QRコード部の座標を取得する。
    var qrElm = obj;
    var targetElm = qrElm;
    var offsetLeft = 0;
    var offsetTop = 0;
    while(targetElm){
        offsetLeft += targetElm.offsetLeft;
        offsetTop += targetElm.offsetTop;
        targetElm = targetElm.offsetParent;
    }
    var qrElmWidth = getElmWidth(qrElm);
    
    if(navigator.userAgent.indexOf("Mac") !=-1 && typeof document.body.leftMargin != "undefined"){
        offsetLeft += document.body.leftMargin;
        offsetTop += document.body.topMargin;
    }
    var centerTop = offsetTop + parseInt(qrElmWidth / 2);
    
    var elm = document.getElementById('mobframe');
    
    if(null!=elm){
        //親領域のoverflow設定がhiddenになっている場合Visibleに変更する。（Hidden領域からはみでた箇所が表示されないので）
        parentElm = elm.parentNode;    
        while(parentElm!=null && typeof(parentElm.style)!="undefined"){
            if(typeof(parentElm.style.overflow)!="undefined"){
                if(parentElm.style.overflow=="hidden"){
                    parentElm.style.overflow="visible";
                    TmpParentNode=parentElm;
                    break;//とりあえずひとつだけ設定を変更する。（親の設定を全部変えたいならここをコメントアウトする）
                }else{
                    //styleシートの定義をみる
                    var ofValue="";
                    if(parentElm.currentStyle){
                        ofValue = parentElm.currentStyle["overflow"];
                    }else if(window.getComputedStyle){
                        var compStyle = window.getComputedStyle(parentElm,"");
                        ofValue=compStyle.getPropertyValue("overflow");
                    }
                    if(ofValue=="hidden"){
                        parentElm.style.overflow="visible";
                        TmpParentNode=parentElm;
                        break;
                    }
                }
            }
            parentElm = parentElm.parentNode;
        }
        //初期表示サイズで表示処理を実行する。（初期表示はフレーム画像なし）
        showPreview(centerTop,38,62,obj.id);
        elm.style.backgroundImage ="";
        elm.style.visibility="visible";
        elm.style.left = qrElmWidth + offsetLeft + "px";
    }
    var imgelm = document.getElementById("myqrimg");
    if(null!=imgelm){
        imgelm.style.visibility = "hidden";
    }
};
function _onMouseLeave(obj){
    if(PreviewTimer!=""){
        clearTimeout(PreviewTimer);
        PreviewTimer="";
    }
    var elm = document.getElementById('mobframe');
    if(null!=elm){
        if(elm.style.visibility=="visible"){
            elm.style.visibility="hidden";
        }
    }
    var imgelm = document.getElementById("myqrimg");
    if(null!=imgelm){
        if(imgelm.style.visibility=="visible"){
            imgelm.style.visibility = "hidden";
        }
    }
    //親のoverflow設定を戻す（変更している場合）
    if(TmpParentNode!=""){
        TmpParentNode.style.overflow="hidden";
    }
};

//ドキュメント中のImageを検索し、QR画像用のID（UID-ページID）の中のUIDが含まれるイメージタグに対して、
//MouseOverとMouseLeaveのイベントを設定する。
function setQRImgInfo(){
    for(var i = 0;i<document.images.length;i++){
        var img = document.images[i];
        if(img.id.indexOf(UID)!=-1){
            //画像のIDにUIDが含まれる＝システムで生成されたタグを埋め込んでいる
            img.onmouseover = (function(obj){return function(){_onMouseOver(obj);};})(img);
            img.onmouseout = (function(obj){return function(){_onMouseLeave(obj);};})(img);
            //QRImageのsrcには初期値に携帯サイトのURLが格納されているので、それを退避し新たにQRコードへのURLを設定する。
            if(typeof ThumbnailImage[img.id]=="undefined"){
                ThumbnailImage[img.id] = new Image();
                
                //ThumbnailImage[img.id].src = hostDomain + "thumbnail.aspx?url=" + img.src;//サムネイル画像を先読みしておく
                //img.srcにサムネイル画像URLを設定していたらアクセス数がカウントされるのでclassNameに格納するように変更
                ThumbnailImage[img.id].src = hostDomain + "thumbnail.aspx?url=" + img.className;//サムネイル画像を先読みしておく
                img.className="";
                img.src = hostDomain + "myqrcode.aspx?qruid=" + img.id;
                img.style.visibility = "visible";
            }
        }
    }
};

if(typeof initflg=="undefined"){
    var initflg = false;
}
function InitQRScript(){
    //document.open();

    //QR画像エリアを取得する
    setQRImgInfo();
    
    if(initflg==false){
        //念の為、初期化処理が一度しか走らないようにしておく。
        initflg = true;
        document.write("<div id='mobframe' style=\"width:152px;height:250px; overflow:hidden;position:absolute;visibility:hidden;\">");
        document.write("<div style=\"width:140px;height:215px;padding:0;margin:0;overflow:hidden; position:absolute;visibility:hidden; top:13px;left:6px\">");
        document.write("<img id='myqrimg' style=\"margin:0;padding:0;border:0;\"/>");
        document.write('</div>');
        document.write('</div>');
    };
    //document.close();
};

InitQRScript();