﻿
function $() {
    return document.getElementById ? document.getElementById(arguments[0]) : eval(arguments[0]);
}
function GetWebHttpPath() { return "http://soft.jdbbx.com"; }
var public_imagesUrl = GetWebHttpPath() + "/Pages/handPage/ToolImages/screen/"; //与CSS同目录的图片地址
var public_ImgSrc = "";                                             //软件界面图等的地址
var counts, offerImgNo, cancelImgRoll, clickPicN, array;  //counts图片张数、offerImgNo推荐图片序号、cancelImgRoll图片滚动交换（setTimeout）
var imgArray = new Array(); //小图数组
var imgP = new Array(); //小图图片对象
var imgArray1 = new Array(); //大图数组
var imgP1 = new Array(); //大图图片对象
var picN = 1; //小图幻灯现实的图片索引编号
var clickFromClass3 = false; //判断图片预览是否是从/softClass3/点击进入
function showbeij(key) {
    var windowWidth = document.documentElement.clientWidth;
    if (key == 1) {
        $("#backgroundPopup1").css({
            "opacity": "0.5"
        });
        //以下代码仅在IE6下有效
        $("#backgroundPopup1").css({
            "height": windowWidth
        });
        $("#backgroundPopup1").show();

    } else {
        $("#backgroundPopup1").hide();
        $("#Loading").hide();
        $("#Loading").html("");

    }
}
//小图滚动预览图片函数
function show_minPicture(folderName, fileName1, fileName2, DAT, frame, offerImg, cFrom, ToolId) {//文件夹名、文件名、张数、推荐图序号、进入页
    var minPictureHtml = "<div style=\"height:100px; padding:0 0 4px 0; overflow:hidden;\"><a id=\"url\" href=\"\" onclick=\"showbeij(1);OpenDiv(440,520,2);return false;\"><img id=\"pic\" onerror=\"this.src='http://soft.jdbbx.com/Pages/images/pic_msg.gif'\" src=\"http://soft.jdbbx.com/Pages/images/pic_msg_loading.gif\" alt=\"界面截图\" border=0 width=\"169\" height=\"102\"><\/a><\/div><div style=\"float:left;width:166px;height:20px;border-top:1px #dbdbdb solid;padding:3px 3px 0 0; background:#F6F6F6;text-align:right;\" id=\"picNumber\"><\/div>";
    counts = frame;

    var str = counts;
    array = str.split(",");
    offerImgNo = offerImg;
    if (cFrom == 3) { clickFromClass3 = true; }
    document.getElementById('softPic').innerHTML = minPictureHtml;
    //如果没有截图
    if (array[0] == "") {
    } else {
        for (var i = 0; i < array.length; i++) {
            imgArray[array[i]] = public_imagesUrl + folderName + "/" + fileName1 + array[i] + DAT;
            imgArray1[array[i]] = public_imagesUrl + folderName + "/" + fileName2 + array[i] + DAT;
            document.getElementById('picNumber').style.borderTop = '#dbdbdb 1px solid';
            document.getElementById('picNumber').innerHTML += "<a href=\"javascript:void(0);\" onclick=\"changeimg(" + array[i] + ");return false;\" id=\"picNumNo" + array[i] + "\" class=\"picNumNoA\" target=\"_self\">" + array[i] + "<\/a>";
            imgP[array[i]] = new Image();
            imgP[array[i]].src = imgArray[array[i]];
            imgP1[array[i]] = new Image();
            imgP1[array[i]].src = imgArray1[array[i]];
        }
    }
    document.getElementById('picNumber').innerHTML = "<span style='height:24px;float:left;width:auto;line-height:12px; padding:3 0 0 3px;color:#898989;'>点缩略图查看</span><span style='float:right;width:auto;padding:3 0 0 3px;'>" + document.getElementById('picNumber').innerHTML + "</span>";
    change_img();
}
//图片幻灯显示函数
function change_img() {
    clickPicN = picN;
    if (array[0] == "") {
        document.getElementById("pic").src = 'http://soft.jdbbx.com/Pages/images/pic_msg.gif';
    } else {
        if (imgP[picN].complete) {
            document.getElementById("pic").src = imgP[picN].src;
        }
        document.getElementById("pic").src = imgArray[picN];
        for (var i = 0; i < array.length; i++) {
            document.getElementById("picNumNo" + array[i]).className = 'picNumNoA';
        }
        document.getElementById("picNumNo" + picN).className = 'bxx';
        picN++;
        if (picN > array.length) {
            picN = 1;
        }
        cancelImgRoll = setTimeout('change_img()', 4000);
    }
}
function changeimg(n) {
    picN = n; window.clearInterval(cancelImgRoll); change_img();
}
//软件截面图片展示效果JS
//var showPicSrc;
var OverH, OverW, ChangeH = 20, ChangeW = 20, leftLoading, topLoading, widthLoading, heightLoading;
function OpenDiv(_Dw, _Dh, folderName, fileName1, fileName2, DAT, frame, offerImg) {//div宽度、div高度、文件夹名、图片名称、扩展名、张数、推荐图序号
    OverH = _Dw; OverW = _Dh;
    if (frame) {
        counts = frame;
    }
    if (offerImg) {
        clickPicN = offerImg;
    }
    if (!clickFromClass3) {//从非小图函数点击进来，加载图片
        for (var i = 0; i < array.length; i++) {
            imgArray[array[i]] = public_imagesUrl + folderName + "/" + fileName1 + array[i] + DAT;
            imgArray1[array[i]] = public_imagesUrl + folderName + "/" + fileName2 + array[i] + DAT;
            imgP[array[i]] = new Image();
            imgP[array[i]].src = imgArray[array[i]];
            imgP1[array[i]] = new Image();
            imgP1[array[i]].src = imgArray1[array[i]];
        }
    }
    document.getElementById("Loading").style.display = 'none';
    $("Loading").innerHTML = '';
    document.getElementById("Loading").style.display = 'block';
    //div改变比率
    if (_Dw > _Dh) {
        ChangeH = Math.ceil((_Dh - 10) / ((_Dw - 10) / 20))
    } else if (_Dw < _Dh) {
        ChangeW = Math.ceil((_Dw - 10) / ((_Dh - 10) / 20))
    }
    document.getElementById("Loading").style.top = ((document.documentElement.clientHeight + document.documentElement.scrollTop) - 10) / 2 + "px";
    document.getElementById("Loading").style.left = ((document.documentElement.clientWidth + document.documentElement.scrollLeft) - 10) / 2 + "px";
    OpenNow();
}

var Nw = 10, Nh = 10; //Loading初始宽度和高度
function OpenNow() {
    Nw = Nw + ChangeW;
    Nh = Nh + ChangeH;
    document.getElementById("Loading").style.border = "1px #A7CAD9 solid";
    if (OverW > Nw || OverH > Nh) {
        if (OverW > Nw) {

            document.getElementById("Loading").style.width = Nw + "px";
            document.getElementById("Loading").style.left = ((document.documentElement.offsetWidth - Nw) / 2 + document.documentElement.scrollLeft + document.body.scrollLeft) + 20 + "px";

        }
        if (OverH > Nh) {
            document.getElementById("Loading").style.height = Nh + "px";
            document.getElementById("Loading").style.top = ((document.documentElement.offsetHeight - Nh) / 2 + document.documentElement.scrollTop + document.body.scrollTop) - 20 + "px"
        }
        window.setTimeout("OpenNow()", 1)
    } else {
        Nw = 10; Nh = 10; ChangeH = 20; ChangeW = 20; //结束，在恢复初始值
        document.getElementById("Loading").innerHTML = "<br><br><br><br><br><br><br><br><br><br><img src=\'http://baoku.yunduan.cn/images/loading.gif\' style=\'margin-bottom:-8px;\'>&nbsp;&nbsp;<font style=\'font-size:14px;\'>界面预览图加载中...</font>";
        showPic();
    }
}
//图片浏览器
var browse = window.navigator.appName.toLowerCase(); //返回浏览器的名称
var MyMar;
var speed = 1; //速度，越大越慢
var spec = 5; //每次滚动的间距, 越大滚动越快
var minOpa = 60; //滤镜最小值
var maxOpa = 100; //滤镜最大值
var spa = 4; //缩略图区域补充数值
spec = (browse.indexOf("microsoft") > -1) ? spec : ((browse.indexOf("opera") > -1) ? spec * 10 : spec * 1);
function goleft() {
    document.getElementById("pictureCase").scrollLeft -= spec
}
function goright() {
    document.getElementById("pictureCase").scrollLeft += spec
}
function setOpacity(e, n) {
    if (browse.indexOf("microsoft") > -1) e.style.filter = 'alpha(opacity=' + n + ')';
    else e.style.opacity = n / 100;
}
function showPic() {
    var w = 60;
    document.getElementById("Loading").style.border = "0px #A7CAD9 solid";
    var showImgContent = "<div class=\"closepic\" onclick=\"showbeij(2);\"><img src=\"../images/close_pic.gif\" /></div>";
    showImgContent += "<div class=\"midContentCase\">";
    showImgContent += "<div id=\"maxmianPic\" class=\"maxmianPic\">";
    showImgContent += "<img id=\"maxPicture\" onerror=\"this.src='http://soft.jdbbx.com/Pages/images/pic_msg.gif'\" src=\"" + imgArray1[clickPicN] + "\"  onload=javascript:DrawImage(this); >";
    showImgContent += "</div>";
    showImgContent += "<div id=showCloseDiv style=\"position:absolute; z-index:99999; width:105px; height:30px; display:none;background:url(http://baoku.yunduan.cn/images/mini-pic-close.png) no-repeat;_background:none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='http://baoku.yunduan.cn/images/mini-pic-close.png');\"></div>";
    showImgContent += "<div class=\"minpicshow\">";
    showImgContent += "<div class=\"goleft\"><img src=\"../images/btn_pic_pageup.gif\" id=\"goleft\"></div>";
    showImgContent += "<div id=\"pictureCase\"><div id=\"minImg\"> </div></div>";
    showImgContent += "<div class=\"goright\"><img src=\"../images/btn_pic_pagedown.gif\" id=\"goright\"></div>";
    showImgContent += "</div>";
    showImgContent += "</div>";

    document.getElementById("Loading").innerHTML = showImgContent; //"<div class=\"openDiv-outCase\"><div class=\"opendiv-left01\"><img src=\"http://baoku.yunduan.cn/images/opendiv-left01.gif\"></div><div class=\"midContentCase\"><div id=\"maxmianPic\" class=\"maxmianPic\"><img id=\"maxPicture\" onerror=\"this.src='http://soft.jdbbx.com/Pages/images/pic_msg.gif'\" src=\"" + imgArray1[clickPicN] + "\"  onload=javascript:DrawImage(this); ></div><div id=showCloseDiv style=\"position:absolute; z-index:99999; width:105px; height:30px; display:block;background:url(http://baoku.yunduan.cn/images/mini-pic-close.png) no-repeat;_background:none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='http://baoku.yunduan.cn/images/mini-pic-close.png');\"></div><div class=\"minpicshow\"><div class=\"goleft\"><img src=\"http://baoku.yunduan.cn/images/opendiv-goleft.gif\" id=\"goleft\"></div><div id=\"pictureCase\"><div id=\"minImg\"> </div></div><div class=\"goright\"><img src=\"http://baoku.yunduan.cn/images/opendiv-goright.gif\" id=\"goright\"></div></div></div><div class=\"opendiv-right01\"><img src=\"http://baoku.yunduan.cn/images/opendiv-right01.gif\"></div></div>";
    for (var i = 0; i < array.length; i++) {
        if (array[i] == "") { } else {
            if (imgP[array[i]].complete) {
                document.getElementById("minImg").innerHTML += "<img src=\"" + imgArray[array[i]] + "\" rel=\"" + imgArray1[array[i]] + "\">";
            }
            else {
                imgP[array[i]].onload = function() {
                    document.getElementById("minImg").innerHTML += "<img src=\"" + imgArray[array[i]] + "\" rel=\"" + imgArray1[array[i]] + "\">";
                }
            }
        }
    }
    var p = document.getElementById("minImg").getElementsByTagName('img');
    for (var i = 0; i < p.length; i++) {
        w += parseInt(p[i].width) + spa;
        if (i == clickPicN - 1) { setOpacity(p[clickPicN - 1], maxOpa); p[clickPicN - 1].style.border = '2px #0F8DC0 solid'; }
        else { setOpacity(p[i], minOpa); p[i].style.border = '2px #ccc solid'; }
        p[i].onmouseover = function() {
            for (var j = 0; j < p.length; j++) { setOpacity(p[j], minOpa); p[j].style.border = '2px #ccc solid'; }
            setOpacity(this, maxOpa);
            this.style.border = '2px #0F8DC0 solid';
            document.getElementById('maxPicture').src = this.getAttribute('rel');
            setOpacity($id("maxPicture"), maxOpa);
        }
        p[i].onmouseout = function() {
            setOpacity($id("maxPicture"), maxOpa);
        }
    }
    document.getElementById("minImg").style.width = parseInt(w) + 'px';
    document.getElementById('goleft').style.cursor = 'pointer';
    document.getElementById('goright').style.cursor = 'pointer';
    document.getElementById('goleft').onmouseover = function() {
        this.src = '../images/btn_pic_pageup.gif'; MyMar = setInterval(goleft, speed);
    }
    document.getElementById('goleft').onmouseout = function() {
        this.src = '../images/btn_pic_pageup.gif'; clearInterval(MyMar);
    }
    document.getElementById('goright').onmouseover = function() {
        this.src = '../images/btn_pic_pagedown.gif'; MyMar = setInterval(goright, speed);
    }
    document.getElementById('goright').onmouseout = function() {
        this.src = '../images/btn_pic_pagedown.gif'; clearInterval(MyMar);
    }
    var tempobj = $id("maxmianPic");
    widthLoading = tempobj.offsetWidth;
    heightLoading = tempobj.offsetHeight;
    var leftoffset = tempobj.offsetLeft;
    var topoffset = tempobj.offsetTop;
    while ((tempobj = tempobj.offsetParent) != null) {
        leftoffset += tempobj.offsetLeft;
        topoffset += tempobj.offsetTop;
    }
    leftLoading = leftoffset;
    topLoading = topoffset;
    document.onmousemove = function(e) {
        //showClose(e);
    }
    $id("maxmianPic").onmouseout = function() {
        //$id("showCloseDiv").style.display = "none";
    };
    $id("maxmianPic").onclick = function() {
        document.onmousemove = function() { };
        document.getElementById("Loading").style.display = 'none';
        document.getElementById("Loading").innerHTML = '';
        showbeij(2);
    }
    $id("showCloseDiv").onclick = function() {
        document.onmousemove = function() { };
        document.getElementById("Loading").style.display = 'none';
        document.getElementById("Loading").innerHTML = '';
        showbeij(2);
    }
}

function showClose(ev) {//现实关闭图片，进行关闭有关操作

    var ev = ev || window.event;
    var ly = $id("showCloseDiv");
    var lytop = ev.clientY; // - document.body.clientTop+20;
    var lyleft = ev.clientX; // - document.body.clientLeft+10;
    var y_top = topLoading - document.documentElement.scrollTop - document.body.scrollTop;
    var x_Left = leftLoading - document.documentElement.scrollLeft - document.body.scrollLeft;
    if (lytop < y_top || lyleft < x_Left || lyleft > (x_Left + widthLoading) || lytop > (y_top + heightLoading)) {
        document.getElementById('showCloseDiv').style.display = "none";
    } else {
        document.getElementById('showCloseDiv').style.display = "";
        document.getElementById('showCloseDiv').style.top = (lytop - y_top - 5) + "px";
        document.getElementById('showCloseDiv').style.left = (lyleft - x_Left - 37) + "px";
    }
}

//图片等比率缩小
//var  flag=false;  
function DrawImage(ImgD) {
    var image = new Image();
    image.src = ImgD.src;
    if (image.width > 0 && image.height > 0) {
        //flag=true;  
        if (image.width / image.height >= 460 / 348) {
            if (image.width > 460) {
                ImgD.width = 460;
                ImgD.height = (image.height * 460) / image.width;
            } else {
                ImgD.width = image.width;
                ImgD.height = image.height;
            }

        }
        else {
            if (image.height > 348) {
                ImgD.height = 348;
                ImgD.width = (image.width * 348) / image.height;
            } else {
                ImgD.width = image.width;
                ImgD.height = image.height;
            }

        }
    }
}

