//使用场景： A. 本js嵌入aspx页面中和TextBox输入框一起，形成区域查找功能
//           B. 本js嵌入一个页面中,这个页面有一个iframe 元素,在ifame 元素中
//              嵌入另一个页面,这个页面里含有一个textBox 输入框.js和这个
//              输入框一起,形成区域查找功能. 
//限制情况:  B场景下,假定只有一个iframe元素

//global variables
// is an IE explore
var ie = navigator.appName == "Microsoft Internet Explorer" ? true : false;
//the relatedInputBox may be in the same page
//with the popdiv or in the iframe page 
var relatedInputBoxid = '';

//abbr for get element
function AP_GetByID(objID) {
    return document.getElementById(objID);
}

//cancel event bubble
function _cancelAreaBubble(event) {
    e = event ? event : window.event;
    if (ie) {
        e.cancelBubble = true;
    } else {
        e.stopPropagation();
    }
}


//get iframe window 假定内嵌只有一个iframe
function getIframeWindow() {
    if (typeof (document.getElementById("SearchForm")) != undefined) {
        return window.frames["SearchForm"];

    }
    else {
        return window.frames[0];
    }
}
//create div pop area select
//parameter arrareas contarin string
//which is separated by '|'
function CreatePopdiv(arrareas, reltextboxid) {
    if (reltextboxid != null && reltextboxid != '') {
        relatedInputBoxid = reltextboxid;
    }
    var arrRegions = arrareas.split('|');
    var trs = '';
    var arrindex = 0;
    var rowCount = 0;
    if (arrRegions.length > 0) {
        var arrProvinceName = new Array();
        for (var rlen = 0; rlen < (arrRegions.length - 1); rlen++) {
            arrProvinceName[rlen] = arrRegions[rlen];
        }


        rowCount = Math.ceil(arrProvinceName.length / 5);

        for (var rowindex = 0; rowindex < rowCount; rowindex++) {
            trs += '<tr>';
            for (var colindex = 0; colindex < 5; colindex++) {
                if ((rowindex * 5 + colindex) < arrProvinceName.length) {
                    trs += '<td style="border:0px; border-bottom:1px #BCD0E8 solid;"><span style="color:#648BB1; cursor: pointer;" onclick="javascript:ontblClick(event);">' + arrProvinceName[rowindex * 5 + colindex] + '</span></td>'
                }
                else {
                    trs += '<td style="border:0px;"></td>'
                }
            }
            trs += "</tr>"
        }
    }

    s = '';
    s += '<div id="popareadiv"   style="display:none; position:absolute; z-index:9;" >';
    if (ie) {  // i don't know why add a frame
        // s += '<iframe id="iespecificframe" width="200" border="0"  src="about:blank" style="position: absolute;z-index:-1;"></iframe>';
    }
    s += '<div style="width: 200px; background:#ffffff;"><table  cellspacing="0" cellpadding="0" width="100%" style="text-align: center;border:1px #BCD0E8 solid;">';
    s += '<tr><td id="headtd" class="headtd"  colspan="5" align="left" style="background: #DAE8F1; font-size:14px; font-weight:bold; color:#A00401; line-height:20px;" >' + '区域列表' + '</td></tr> ';
    s += trs;
    s += '</table></div></div>';
    var nElement = document.createElement("div");
    nElement.innerHTML = s;

    //if the document contains form element,append child to it(important)
//    if (document.getElementsByTagName("form")[0]) {
//        document.getElementsByTagName("form")[0].appendChild(nElement);
//    }
//    else 
    { //if not form element,append child to body 
        document.getElementsByTagName("body")[0].appendChild(nElement);
    }
    document.onclick = function(event) { AP_GetByID('popareadiv').style.display = 'none'; }

    if (getIframeWindow() != null) {  //if the page contains frame window ,then click in the frame window,should close the div dialog
        getIframeWindow().document.onclick = function(event) { AP_GetByID('popareadiv').style.display = 'none'; }
    }

    AP_GetByID('popareadiv').onclick = function(event) { _cancelAreaBubble(event); }
}



//compute position
function showAreaPopup(event, iframewindow, txtinputid) {
    var p = getareaSelectposition(txtinputid);
    AP_GetByID('popareadiv').style.top = String(p['y']) + 'px';
    AP_GetByID('popareadiv').style.left = String(p['x']) + 'px';
    AP_GetByID('popareadiv').style.display = 'block';
    _cancelAreaBubble(event);

}


function HideAreaPopup(event) {
    AP_GetByID('popareadiv').style.display = 'none';
}


//click the item showed on 
//the popup window
function ontblClick(event) {
    e = event ? event : window.event;
    var elem = e.srcElement ? e.srcElement : e.target;
    if (getIframeWindow() != null) {
        getIframeWindow().document.getElementById(relatedInputBoxid).value = elem.innerHTML;

    }
    else // no frames at all.
    {
        document.getElementById(relatedInputBoxid).value = elem.innerHTML;
    }

    HideAreaPopup(event);
}



//get the top-left position that the popup should
//show
function getareaSelectposition(objid) {
    var r = new Array();
    if (getIframeWindow() != null)  //window.frames[0]
    {
        //txt position in the iframe
        var txtPos = new Array(); //txtbox in the frame offset
        var objinframe = getIframeWindow().document.getElementById(objid);
        txtPos['y'] = objinframe.offsetTop + objinframe.clientHeight + 5;
        txtPos['x'] = objinframe.offsetLeft;
        while (objinframe = objinframe.offsetParent) {
            txtPos['y'] += objinframe.offsetTop;
            txtPos['x'] += objinframe.offsetLeft;
        }


        //iframe position in the parent page
        var iframePos = new Array();
        var elemIframe = getIframeWindow().frameElement;
        iframePos['y'] = elemIframe.offsetTop;
        iframePos['x'] = elemIframe.offsetLeft;
        while (elemIframe = elemIframe.offsetParent) {
            iframePos['y'] += elemIframe.offsetTop;
            iframePos['x'] += elemIframe.offsetLeft;
        }


        //return result
        r['y'] = iframePos['y'] + txtPos['y'];
        r['x'] = iframePos['x'] + txtPos['x'];

    }
    else // no frames at all.
    {
        var obj = document.getElementById(objid);
        r['y'] = obj.offsetTop + obj.clientHeight + 5;
        r['x'] = obj.offsetLeft;
        while (obj = obj.offsetParent) {
            r['y'] += obj.offsetTop;
            r['x'] += obj.offsetLeft;
        }
    }

    return r;
}