watermark_wev8.js 9.82 KB
define(["mUtil"], function(mUtil){
    var instance = null;

    function WaterMark() {
        var doc = window.document,
            len = 0,
            html = "",
            timer = null,
            options = {
                // text / img
                text: "WATERMARK",
                fontStyle: "font-size:18px;color:#000;",
                src: "",
                width: 200,
                height: 150,
                rotate: -15,
                alpha: 0.15,
                interval: 2000,
                intervalCheck: true,
                clickCheck: true
            };

        // 判断重新生成dom条件
        var isUpdate = function(marks) {
            var alpha = options.alpha,
                rotate = options.rotate;
            if (!marks || marks.length === 0) {
                // 初始化
                return true;
            } else if (marks.length != len) {
                // 修改宽高的值
                return true;
            } else if (marks[0].style.transform !== 'rotate('+rotate+'deg)') {
                // 修改旋转角度
                return true;
            } else if (marks[0].style.opacity !== alpha) {
                // 修改透明度
                return true;
            }
            return false;
        };

        var update = function(type) {
            var src = options.src,
                alpha = options.alpha,
                rotate = options.rotate,
                text = options.text,
                fontStyle = options.fontStyle,
                width = options.width,
                height = options.height;

            width = width > 0 ? width : 200;
            height = height > 0 ? height : 150;
            var wrap = doc.getElementById("wea_watermark_wrap");
            if (!wrap) {
                wrap = doc.createElement("div");
                wrap.id = "wea_watermark_wrap";
                doc.body.appendChild(wrap);
            }

            var bg = doc.getElementById("wea_watermark");
            if (!bg) {
                bg = doc.createElement("div");
                bg.id = "wea_watermark";
                bg.style.display = "block";
                bg.style.pointerEvents = "none";
                bg.style.position = "fixed";
                bg.style.width = "100%";
                bg.style.height = "100%";
                bg.style.zIndex = 99999;
                bg.style.top = 0;
                bg.style.left = 0;
                bg.style.textAlign = "center";
                wrap.appendChild(bg);
            }

            // 检测图片是否有效
            if (src && type !== "text") {
                type = "img";
                var img = doc.getElementById("wea_watermark_img_test");
                if (!img) {
                    img = doc.createElement("img");
                    img.id = "wea_watermark_img_test";
                    img.style.display = "none";
                    img.onerror = function() {
                        type = "text";
                        update(type);
                    };
                    doc.body.appendChild(img);
                }
                img.src = src;
            } else {
                type = "text";
            }

            var w = doc.documentElement.clientWidth;
            var h = doc.documentElement.clientHeight;

            var x = Math.ceil(w / width);
            var y = Math.ceil(h / height);

            len = x * y + 2;

            var marks = doc.querySelectorAll(".wea-watermark-mark");
            if (isUpdate(marks)) {
                bg.innerHTML = "";
                for (var i = 0; i < len; i++) {
                    var mark = doc.createElement("div");
                    mark.className = "wea-watermark-mark";
                    mark.style.width = width+'px';
                    mark.style.height = height+'px';
                    mark.style.pointerEvents = "none";
                    mark.style.zIndex = -1;
                    mark.style.float = "left";
                    mark.style.overflow = "visible";
                    mark.style.opacity = alpha;
                    mark.style.transform = 'rotate('+rotate+'deg)';
                    mark.style["-ms-transform"] = 'rotate('+rotate+'deg)';
                    mark.style.position = "relative";
                    bg.appendChild(mark);
                }
                marks = doc.querySelectorAll(".wea-watermark-mark");
            }

            Array.prototype.forEach.call(marks, function(m, i) {
                if ((i + 1) % x === 0 && x !== 1) {
                    m.style.marginRight = '-'+width+'px';
                } else {
                    m.style.marginRight = "0";
                }
                if (type === "text") {
                    m.innerHTML = '<div style="width:100%;position:absolute;top:50%;transform:translateY(-50%);"><p style="pointer-events:none;'+fontStyle+'">'+text+'</p></div>';
                } else {
                    m.innerHTML = '<img alt="" src="'+src+'" style="position:absolute;top:50%;left:50%transform:translate(-50%,-50%);pointer-events:none;max-width:100%;max-height:100%;"></img>';
                }
            });

            html = wrap.innerHTML;
        };

        var handleClick = function() {
            var wrap = doc.getElementById("wea_watermark_wrap");
            var isChanged = !wrap || wrap.innerHTML !== html;
            if (isChanged) {
                update();
            }
        };

        setOptions = function(opts) {
            options = $.extend(options, opts);
            var intervalCheck = options.intervalCheck,
                interval = options.interval,
                clickCheck = options.clickCheck;
            if (timer) {
                clearInterval(timer);
            }
            if (intervalCheck) {
                timer = setInterval(handleClick, interval);
            }
            if (clickCheck) {
                doc.addEventListener("click", handleClick);
            } else {
                doc.removeEventListener("click", handleClick);
            }
            window.top.onresize = function() {
                update(options);
            };
        };

        this.init = function(opts){
            setOptions(opts);
            update();
        }

        this.des = function() {
            clearInterval(timer);
            window.top.onresize = undefined;
            doc.removeEventListener("click", handleClick);
            var wmWrap = doc.getElementById("wea_watermark_wrap");
            if (wmWrap) {
                doc.body.removeChild(wmWrap);
            }
        };
    }

    // 格式化文档水印文本内容
    var formatContent = function (options) {
        var text = options.wmcontent || "",
            familyname = options.familyname || "微软雅黑",
            fontsize = options.fontsize || 14,
            color = options.color || "#000",
            align = options.align || "left";
        var fontStyle = 'font-family:'+familyname+';font-size:'+fontsize+'px;color:'+color+';text-align:'+align+';';
        var lines = "";
        // 处理多行文本的换行
        text.split("\n").forEach(function(line) {
            lines += '<p style="'+fontStyle+'">' + line + "</p>";
        });
        text = lines;
        return text;
    }

    // 处理水印设置内容
    var handleWMSetting = function(wmSetting, params) {
        wmSetting = wmSetting || {};
        params = params || {};
        var rotate = -Number(wmSetting.rotate);
        var alpha = Number(wmSetting.opacity) / 100;
        var options = {
            src:
                wmSetting.watermarktype == "2" ?
                    "/weaver/weaver.file.FileDownload?fileid=" + wmSetting.imageid : "",
            text:
                wmSetting.watermarktype == "1" ?
                    params && params.document ?
                        formatContent(wmSetting) : wmSetting.wmcontent
                    : "",
            width: wmSetting.wmwidth > 0 ? wmSetting.wmwidth : 200,
            height: wmSetting.wmheight > 0 ? wmSetting.wmheight : 150,
            rotate: rotate,
            alpha: alpha
        };
        return options;
    };

    // 处理水印黑白名单规则
    var handleSettingByHash = function(wmSetting) {
        var pathname = window.location.pathname || "";
        var hash = window.location.hash || "";
        var index = hash.indexOf("?");
        index = index !== -1 ? index : hash.length;
        var href = pathname + hash.substring(0, index);
        if (wmSetting) {
            var isopen = wmSetting.isopen,
                mobileisopen = wmSetting.mobileisopen,
                whitelist = wmSetting.whitelist,
                blacklist = wmSetting.blacklist;
            var open = Number(isopen) === 1 && Number(mobileisopen) === 1;
            var list = open ? blacklist : whitelist;
            var match = (list || []).findIndex(function(value) {
                return new RegExp(value).test(href);
            });
            if (match !== -1) {
                open ? WM.destory() : WM(handleWMSetting(wmSetting));
            } else {
                open ? WM(handleWMSetting(wmSetting)) : WM.destory();
            }
        }
    };

    var WM = function(options) {
        if (instance) {
            instance.init(options);
        } else {
            instance = new WaterMark();
            instance.init(options);
        }
    };

    WM.destory = function(){
        if (instance) {
            instance.des();
            instance = null;
        }
    };

    return {
        handleHashChange: function() {
            handleSettingByHash(WM.wmSetting);
        },
        getSystemSetting: function(){
            mUtil.ajax("/api/doc/console/wmsystemsetting/getwmsetting?isconvert=1", function(res){
                var result = JSON.parse(res);
                var wmSetting = result.wmSetting || {};
                WM.wmSetting = wmSetting;
                handleSettingByHash(wmSetting);
            });
        }
    }
});