1 line
8.3 KiB
JavaScript
1 line
8.3 KiB
JavaScript
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("XWatermark",[],e):"object"==typeof exports?exports.XWatermark=e():t.XWatermark=e()}(window,(function(){return function(t){var e={};function o(n){if(e[n])return e[n].exports;var i=e[n]={i:n,l:!1,exports:{}};return t[n].call(i.exports,i,i.exports,o),i.l=!0,i.exports}return o.m=t,o.c=e,o.d=function(t,e,n){o.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},o.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},o.t=function(t,e){if(1&e&&(t=o(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)o.d(n,i,function(e){return t[e]}.bind(null,i));return n},o.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return o.d(e,"a",e),e},o.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},o.p="",o(o.s=0)}([function(t,e,o){"use strict";function n(t,e,o){return(e=function(t){var e=function(t,e){if("object"!=typeof t||null===t)return t;var o=t[Symbol.toPrimitive];if(void 0!==o){var n=o.call(t,e||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==typeof e?e:String(e)}(e))in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}o.r(e),o.d(e,"XWatermark",(function(){return c}));const i="[XWatermark]",r={id:"",top:0,left:0,rows:0,cols:0,xSpace:50,ySpace:50,ratio:1,font:"Helvetica Neue, Arial, MS YaHei",weight:"normal",color:"black",fontsize:16,alpha:.1,angle:-15,zIndex:9999,width:"auto",height:"auto",mode:"n",parentNode:document.body,parentSelector:"",observer:!1,observerNode:null,prevent:!1};function s(t){const e=document.getElementById(t);if(e){try{const t=e.parentNode;return null==t||t.removeChild(e),!0}catch(e){console.warn(`${i} Remove watermark dom [${t}] failed:`,e)}return!1}return!0}function a(t,e){t.font=`${e.weight} ${e.fontsize}px ${e.font}`,t.fillStyle=e.color,t.textAlign="left",t.textBaseline="bottom"}const l=(t,e,o)=>{if(!t)return void console.error(`${i} Could not load watermark. Dom is null. content:`,e);const n=o.id;s(n);const r=1.5*o.fontsize;let l=o.xSpace,h=o.ySpace;["stagger","s"].includes(o.mode)&&(l=2*o.xSpace,h=2*o.ySpace);let c=document.createElement("canvas"),u=c.getContext("2d");if(null===u)return console.error(`${i} load error. Canvas Context is null. You'r browser may not support canvas.`),"";if(a(u,o),"string"==typeof o.width){const t=Number(o.width);if(isNaN(t)){if("auto"!==o.width)return console.warn(`${i} width is not a number or 'auto'. Please check your options.`),"";{const t=u.measureText(e);o.width=t.width+r*Math.sin(Math.abs(o.angle)*Math.PI/180)}}else o.width=t*o.ratio}if("string"==typeof o.height){const t=Number(o.height);if(isNaN(t)){if("auto"!==o.height)return console.warn(`${i} height is not a number or 'auto'. Please check your options.`),"";{const t=((t,e,o)=>{const n=e.split("");let i="",r=0;for(let e=0;e<n.length;e++){const s=i+n[e];t.measureText(s).width>o&&e>0?(r++,i=n[e]):i=s}return++r})(u,e,o.width);o.height=r*t+o.width*Math.sin(Math.abs(o.angle)*Math.PI/180)}}else o.height=t*o.ratio}const d=window.devicePixelRatio||1;c.width=(o.width+l)*d,c.height=(o.height+h)*d,u.scale(d,d),a(u,o),function(t,e,o,n,i,r,s){t.save(),t.translate(o,n),t.rotate(s*Math.PI/180);const a=e.split("");let l="";const h=r*Math.sin(s*Math.PI/180);let c=s<0?-1:0;for(let e=0;e<a.length;e++){const o=l+a[e];t.measureText(o).width>i&&e>0?(t.fillText(l,h*c++,0),l=a[e],t.translate(0,r)):l=o}t.fillText(l,h*c,0),t.restore()}(u,e,0,(o.angle<0?1:0)*o.width*Math.sin(Math.abs(o.angle)*Math.PI/180)+.8*r,o.width,r,o.angle);const p=c.toDataURL("image/png");u.clearRect(0,0,c.width,c.height),u=null,c=null,t===document.body||""!==t.style.position&&"static"!==t.style.position||(t.style.position="relative");const f=document.createElement("div");f.id=n,f.style.pointerEvents="none",f.style.overflow="hidden",f.style.top="0",f.style.left="0",f.style.margin="0",f.style.padding="0",f.style.position=t===document.body?"fixed":"absolute",f.style.zIndex=`${o.zIndex}`,f.style.opacity=`${o.alpha}`,f.style.paddingTop=`${o.top}px`,f.style.paddingLeft=`${o.left}px`,f.style.width=(t.clientWidth||document.documentElement.clientWidth)-o.left+"px",f.style.height=(t.clientHeight||document.documentElement.clientHeight)-o.top+"px";const b=document.createElement("div");switch(b.style.width="100%",b.style.height="100%",b.style.margin="0",b.style.padding="0",b.style.backgroundImage=`url(${p})`,b.style.backgroundPosition="0 0",o.mode){case"horizontal":case"h":case"x":b.style.backgroundRepeat="repeat-x";break;case"vertical":case"v":case"y":b.style.backgroundRepeat="repeat-y";break;case"stagger":case"s":b.style.backgroundImage=`url(${p}), url(${p})`,b.style.backgroundRepeat="repeat, repeat",b.style.backgroundPosition=`0 0, ${(o.width+l)/2}px ${(o.height+h)/2}px`;break;default:b.style.backgroundRepeat="repeat"}return b.style.backgroundSize=`${o.width+l}px ${o.height+h}px`,f.appendChild(b),t.appendChild(f),p};class h{constructor(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(n(this,"_observerObs",null),n(this,"_preventObs",null),n(this,"_targetNode",null),n(this,"base64",""),n(this,"content",""),n(this,"_options",Object.assign({},r)),t)return this.init(t,e)}init(t){let e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(t){if(this._options=Object.assign({},r,{id:d()},e),this.content=t,this._targetNode=this._options.parentSelector?document.querySelector(this._options.parentSelector):this._options.parentNode,this._targetNode)return"loading"===document.readyState?document.addEventListener("DOMContentLoaded",(()=>this._do())):this._do(),this.start(),this;console.warn(`${i} You have set 'options.parentSelector': (${this._options.parentSelector}), but it seems that the selector does not match any element. You may need to refresh manually or change/delete the selector param.`)}else console.error(`${i} You have not set the content of watermark.`)}reload(t,e){return this.remove(),t&&(this.content=t),e&&"object"==typeof e&&(this._options=Object.assign({},r,{id:d()},e)),this.init(this.content,this._options)}remove(){return this._dispose(),s(this._options.id)}start(){if(window.addEventListener("resize",(()=>this._do())),this._options.observer){const t=window.ResizeObserver||window.WebKitResizeObserver;if(t){this._observerObs=new t(u((t=>{t.forEach((t=>{this._do()}))})),100);const e=this._options.observerNode||this._targetNode;this._observerObs.observe(e,{attributes:!0})}else console.warn(`${i} You have set 'options.observer', but it seems that your current env does not support ResizeObserver. You may need to refresh manually.`)}if(this._options.prevent){const t=window.MutationObserver||window.WebKitMutationObserver;t?(this._preventObs=new t(u((t=>{t.forEach((t=>{this._do()}))}),100)),this._preventObs.observe(this._targetNode,{attributes:!0,subtree:!0,childList:!0,characterData:!0,attributeOldValue:!0,characterDataOldValue:!0})):console.warn(`${i} You have set 'options.prevent', but it seems that your current env does not support MutationObserver. You may need to do it manually.`)}}stop(){this._dispose()}_do(){"number"==typeof this._options.ratio&&1!==this._options.ratio&&(this._options.top*=this._options.ratio,this._options.left*=this._options.ratio,this._options.xSpace*=this._options.ratio,this._options.ySpace*=this._options.ratio,this._options.fontsize*=this._options.ratio,"number"==typeof this._options.width&&(this._options.width*=this._options.ratio),"number"==typeof this._options.height&&(this._options.height*=this._options.ratio)),this.base64=l(this._targetNode,this.content,this._options)}_dispose(){this._observerObs&&(this._observerObs.disconnect(),this._observerObs=null),this._preventObs&&(this._preventObs.disconnect(),this._preventObs=null),window.removeEventListener("resize",this._do)}}const c=h;function u(t,e){let o;return function(){const n=arguments,i=this;o||(t.apply(i,n),o=!0,setTimeout((()=>o=!1),e))}}function d(){return"x-watermark-"+Math.floor(16777215*Math.random()).toString(16).padStart(6,"0")}e.default=h}])})); |