xys-watermark
Version:
xys-watermark:一个支持TS的前端水印SDK,可以自由的在前端页面中添加各种形式和内容的水印(或暗水印)!
2 lines (1 loc) • 8.78 kB
JavaScript
function e(e,t,n,r){return new(n||(n=Promise))((function(i,o){function a(e){try{s(r.next(e))}catch(e){o(e)}}function c(e){try{s(r.throw(e))}catch(e){o(e)}}function s(e){var t;e.done?i(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(a,c)}s((r=r.apply(e,t||[])).next())}))}function t(e,t){var n,r,i,o,a={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return o={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function c(o){return function(c){return function(o){if(n)throw new TypeError("Generator is already executing.");for(;a;)try{if(n=1,r&&(i=2&o[0]?r.return:o[0]?r.throw||((i=r.return)&&i.call(r),0):r.next)&&!(i=i.call(r,o[1])).done)return i;switch(r=0,i&&(o=[2&o[0],i.value]),o[0]){case 0:case 1:i=o;break;case 4:return a.label++,{value:o[1],done:!1};case 5:a.label++,r=o[1],o=[0];continue;case 7:o=a.ops.pop(),a.trys.pop();continue;default:if(!(i=a.trys,(i=i.length>0&&i[i.length-1])||6!==o[0]&&2!==o[0])){a=0;continue}if(3===o[0]&&(!i||o[1]>i[0]&&o[1]<i[3])){a.label=o[1];break}if(6===o[0]&&a.label<i[1]){a.label=i[1],i=o;break}if(i&&a.label<i[2]){a.label=i[2],a.ops.push(o);break}i[2]&&a.ops.pop(),a.trys.pop();continue}o=t.call(e,a)}catch(e){o=[6,e],r=0}finally{n=i=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,c])}}}var n=document.createElement("canvas"),r=n.getContext("2d"),i=function(i){return e(void 0,void 0,void 0,(function(){var e,a,c,s;return t(this,(function(t){switch(t.label){case 0:return(e=document.createElement("img")).src=i,e.crossOrigin="true",[4,new Promise((function(t){e.onload=t}))];case 1:return t.sent(),a=e.width,c=e.height,n.width=a,n.height=c,r.drawImage(e,0,0,a,c),s=r.getImageData(0,0,a,c),o(s.data),r.putImageData(s,0,0),e.remove(),[2,n.toDataURL("image/png")]}}))}))},o=function(e){for(var t=new Map,n=new Map,r=0;r<e.length;r+=4){var i="".concat(e[r],",").concat(e[r+1],",").concat(e[r+2]);t.set(i,(t.get(i)||0)+1)}Array.from(t).forEach((function(e){for(var r=e[0],i=e[1],o=0,c=a(r);o<c.length;o++){var s=c[o],u=t.get(s);if(u&&u>i){n.set(r,i);break}}}));for(r=0;r<e.length;r+=4){var o=[e[r],e[r+1],e[r+2]].join(","),c=n.get(o);e[r]=c?0:255,e[r+1]=c?0:255,e[r+2]=c?0:255}},a=function(e){var t=e.split(",").map(Number),n=t[0],r=t[1],i=t[2],o=[];return o.push([n-1,r-1,i-1]),o.push([n+1,r+1,i+1]),o.push([n-2,r-1,i-1]),o.push([n-1,r-2,i-1]),o.push([n-1,r-1,i-2]),o.push([n-2,r-2,i-1]),o.push([n-1,r-2,i-2]),o.push([n-2,r-2,i-2]),o.map((function(e){return e.join(",")}))},c=/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/,s=function(n){return e(void 0,void 0,void 0,(function(){var r,i,o,a;return t(this,(function(s){switch(s.label){case 0:return r="","string"!=typeof n.target?[3,3]:c.test(n.target)?[4,(u=n.target,e(void 0,void 0,void 0,(function(){var e,n;return t(this,(function(t){switch(t.label){case 0:return(e=new Image(l,h)).setAttribute("crossorigin","crossorigin"),e.src=u,[4,new Promise((function(t){e.onload=function(){t(e)},e.onerror=function(){t(null)}}))];case 1:if(!(n=t.sent()))throw new Error("An error occurred while loading image (src: ".concat(u," )"));return[2,n]}}))})))]:[3,2];case 1:if(!(i=s.sent()))throw new Error("An error occurred while loading image (src: ".concat(n.target," )"));return n.target=i,[3,3];case 2:if(o=document.querySelector(n.target),r=n.target,!o)throw new Error("can not get the target (".concat(n.target," )"));n.target=o,s.label=3;case 3:return[2,{target:n.target,selectors:r,text:n.text||"Sample Text",image:n.image||"",imageWidth:n.imageWidth&&Number(n.imageWidth)||0,imageHeight:n.imageHeight&&Number(n.imageHeight)||0,color:n.color||"rgba(0, 0, 0, 0.07)",fontSize:Number(n.fontSize)||24,zIndex:(null===(a=n.zIndex)||void 0===a?void 0:a.toString())||"2147483647",cSpace:Number(n.cSpace)||0,vSpace:Number(n.vSpace)||0,angle:Number(n.angle)||0,secret:n.secret||!1,position:n.position||"repeat",onchange:n.onchange||function(){},onerror:n.onerror||function(){},success:n.success||function(){}}]}var u,l,h}))}))},u=function(e){var t=document.createElement("div");t.id="watermark-9527";var n=e.target,r=e.image,i=e.imageWidth,o=e.imageHeight,a=e.zIndex,c={"background-image":"url(".concat(r,"), url(").concat(r,")"),position:n===document.body?"fixed":"absolute",top:"50%",left:"50%","pointer-events":"none","background-repeat":"repeat","background-size":"".concat(i,"px ").concat(o,"px"),"background-position":"0 0, ".concat(i/2,"px ").concat(o/2,"px"),"z-index":a,display:"block",visibility:"visible",width:"300%",height:"300%",opacity:"1",transform:"rotate(".concat(e.angle||0,"deg) translate(-50%,-50%)"),"transform-origin":"0 0",scale:"none","user-select":"none"},s=Object.keys(c).reduce((function(e,t){return e+="".concat(t,": ").concat(c[t]," !important; ")}),"");return t.setAttribute("style",s),t},l=window.MutationObserver||window.WebKitMutationObserver||window.MozMutationObserver,h=function(e,t){var n=t.onchange,r=t.success,i=new d(e,n,t);return r(),i},d=function(){function e(e,t,n){var r=this;this.onchange=t,this.config=n,this._callback=function(e){for(var t=!1,n=r.getWatermark(r.config),i=r.getTarget(r.config),o=0,a=e;o<a.length;o++){var c=a[o];if("childList"===c.type)for(var s=0;s<c.removedNodes.length;s++){var u=c.removedNodes[s];if(u===n||"watermark-9527"===u.id||u.contains(i)||u.contains(n)){t=!0;break}}else c.target!==r.element&&c.target!==n||(t=!0);if(t){r.onchange(c),r._reAddWatermark();break}}};var i=this.getTarget(this.config);i.style.position="relative",this.element=e,this.element&&i.appendChild(this.element),this.parentElement=this.element.parentElement,this.elementHTML=this.element.outerHTML}return e.prototype.start=function(){var e=this;l?(this.observer=new l(this._callback),this.observer.observe(document.documentElement,{characterData:!0,attributes:!0,childList:!0,subtree:!0})):this.setIntervalId=window.setInterval((function(){var t=e.getWatermark(e.config),n=e.getTarget(e.config).contains(t);if(!t||!n){var r=e.createWmByClone();e.addWatermark(r),e.onchange()}}),200)},e.prototype.stop=function(){var e;this.observer?this.observer.disconnect():this.setIntervalId&&window.clearInterval(this.setIntervalId),null===(e=this.element)||void 0===e||e.remove()},e.prototype._reAddWatermark=function(){this.observer&&this.observer.disconnect(),this.element.remove();var e=this.createWmByClone();this.addWatermark(e),this.start()},e.prototype.createWmByClone=function(){var e=document.createElement("div");return e.innerHTML=this.elementHTML,e.firstChild},e.prototype.addWatermark=function(e){var t=this.getWatermark(this.config),n=this.getTarget(this.config);t&&document.documentElement.contains(t)?n.contains(t)?n.replaceChild(e,t):n.appendChild(e):this.getTarget(this.config).appendChild(e),this.element=e,this.parentElement=this.element.parentElement},e.prototype.getWatermark=function(e){return document.getElementById("watermark-9527")},e.prototype.getTarget=function(e){if(e.selectors){var t=document.querySelector(e.selectors);return t||document.body}return e.target},e.prototype.isEqualNode=function(e,t){return!(!(null==e?void 0:e.outerHTML)||!(null==t?void 0:t.outerHTML))&&e.outerHTML===t.outerHTML},e}(),g=function(e){var t=document.createElement("canvas"),n=function(e,t){var n,r={width:0,height:0},i=document.createElement("span");return r.width=i.offsetWidth,r.height=i.offsetWidth,i.style.visibility="hidden",i.style.fontSize=t+"px",document.body.appendChild(i),i.textContent?i.textContent=e:i.innerText=e,r.width=i.offsetWidth-r.width,r.height=i.offsetHeight-r.height,null===(n=i.parentNode)||void 0===n||n.removeChild(i),r}(e.text,e.fontSize),r=n.width,i=n.height,o=t.getContext("2d");Math.abs(e.angle);var a=window.devicePixelRatio||1;if(t.width=(r+e.cSpace)*a,t.height=(i+e.vSpace)*a,!o)throw new Error("Not exist: document.createElement('canvas').getContext('2d')");return o.font="".concat(e.fontSize,"px Microsoft YaHei"),o.fillStyle=e.color,o.textAlign="center",o.textBaseline="middle",o.translate(t.width/2,t.height/2),o.scale(a,a),o.fillStyle=e.color,o.fillText(e.text,0,0),t},f=function(e,t){var n="image"===t?function(e){var t=u(e);return h(t,e)}(e):function(e){var t=g(e);e.imageWidth=t.width/(window.devicePixelRatio||1)||0,e.imageHeight=t.height/(window.devicePixelRatio||1)||0,e.image=t.toDataURL();var n=u(e);return h(n,e)}(e);return null==n||n.start(),{remove:function(){null==n||n.stop()}}},m=function(){function n(){}var r;return r=n,n.init=function(n){return e(void 0,void 0,void 0,(function(){var e,i;return t(r,(function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),[4,s(n)];case 1:return e=t.sent(),[2,f(e,e.image?"image":"text")];case 2:return i=t.sent(),n.onerror&&n.onerror("".concat(i)),[3,3];case 3:return[2]}}))}))},n.utils={decodeWatermark:i},n}();export{m as default};