ped.min.js 12 KB

1
  1. !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.PED=e():t.PED=e()}(window,function(){return n={},i.m=o=[function(t,e,o){"use strict";o.r(e),o.d(e,"imageInfo",function(){return c}),o.d(e,"PED_GlOBAL",function(){return m});var m={img:{_width:0,_height:0,_WH:0,_HW:0},device:{_width:0,_height:0},boxSize:{_width:0,_height:0},operateType:0,imgInstance:null,canvas:{},textBox:{},textInput:{},textOperateIndex:0,textIndex:0,inputArray:[],inputDomArray:[],canvasParentDom:null,canvasGrandDom:null,pictureEditBox:null,canvasContext:{},paintingArray:[]};function n(t){return function(t){if(Array.isArray(t))return i(t)}(t)||function(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)}(t)||function(t,e){if(!t)return;if("string"==typeof t)return i(t,e);var o=Object.prototype.toString.call(t).slice(8,-1);"Object"===o&&t.constructor&&(o=t.constructor.name);if("Map"===o||"Set"===o)return Array.from(t);if("Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return i(t,e)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(t,e){(null==e||e>t.length)&&(e=t.length);for(var o=0,n=new Array(e);o<e;o++)n[o]=t[o];return n}var x=0;function p(t,e){var o=t,n=document.createElement(e||"div");return n.innerHTML=o,n.firstChild}function u(p){var u={x:0,y:0},h=null,f=1;x=(p.width/parseFloat(p.style.width)).toFixed(4);var g=m.canvasContext,y=m.canvasParentDom.offsetTop,v=m.canvasParentDom.offsetLeft;p.addEventListener("touchstart",function(t){var e,o;2===t.touches.length?h=t.touches:1===t.touches.length&&1==m.operateType&&(w(u,t),g.beginPath(),g.lineWidth=5,e=(t.touches[0].pageX-v-document.body.scrollLeft+m.canvasGrandDom.scrollLeft)*x,o=(t.touches[0].pageY-y-document.body.scrollTop+m.canvasGrandDom.scrollTop)*x,g.moveTo(e,o),m.paintingArray.push({start:{x:e,y:o},moves:[]}))},!1),p.addEventListener("touchmove",function(t){var e,o,n,i,a,r,c,l,s,d;2===t.touches.length?(t.preventDefault(),b(),m.operateType=0,l=h,s=t.touches,d=_(l[0],l[1]),f=(_(s[0],s[1])/d).toFixed(4),h=t.touches,e=parseFloat(p.style.width),o=parseFloat(p.style.height),n=(e*f).toFixed(4),i=parseFloat((e*m.img._WH).toFixed(4)),p.style.width=n+"px",p.style.height=i+"px",x=(p.width/parseFloat(n)).toFixed(4),y=m.canvasParentDom.offsetTop,v=m.canvasParentDom.offsetLeft,function(){var t=m.boxSize._height-parseFloat(m.canvas.style.height),e=m.boxSize._width-parseFloat(m.canvas.style.width);0<t?m.canvasGrandDom.style.paddingTop=(t/2).toFixed(4)+"px":"0px"!==m.canvasGrandDom.style.paddingTop&&(m.canvasGrandDom.style.paddingTop="0px");0<e?m.canvasGrandDom.style.paddingLeft=(e/2).toFixed(4)+"px":"0px"!==m.canvasGrandDom.style.paddingLeft&&(m.canvasGrandDom.style.paddingLeft="0px")}(),0<m.inputDomArray.length&&m.inputDomArray.forEach(function(t){t.style.fontSize=(parseFloat(t.style.fontSize)*f).toFixed(4)+"px",t.style.top=(parseFloat(t.style.top)/o*i).toFixed(4)+"px",t.style.left=(parseFloat(t.style.left)/e*n).toFixed(4)+"px"})):1===t.touches.length&&1==m.operateType&&(t.preventDefault(),a=parseFloat((t.touches[0].pageX-v-document.body.scrollLeft+m.canvasGrandDom.scrollLeft)*x),r=parseFloat((t.touches[0].pageY-y-document.body.scrollTop+m.canvasGrandDom.scrollTop)*x),g.lineTo(a,r),g.strokeStyle="#ff0000",g.stroke(),w(u,t),c=m.paintingArray.length-1,m.paintingArray[c].moves.push({x:a,y:r}))},{passive:!1})}function h(){m.textInput.addEventListener("blur",function(){var t=m.textInput.innerText.split(/[\n\r]+/);m.textBox.style.display="none";var a,r,c;if(0<t.length){if(m.inputArray.push(t),0==m.textOperateIndex){for(var e='<div style="position: absolute;font-size: '.concat("15px",';background-color: white;padding: 3px 5px;border-radius: 5px;white-space: nowrap">'),o=0;o<t.length;o++)e=e+t[o]+"".concat(o==t.length-1?"":"</br>");var n=p(e+="</div>");m.canvasParentDom.appendChild(n);var i=n.offsetWidth,l=n.offsetHeight;n.style.top=(m.boxSize._height-l)/2+m.canvasGrandDom.scrollTop-parseFloat(m.canvasGrandDom.style.paddingTop||0)+"px",n.style.left=(m.boxSize._width-i)/2+m.canvasGrandDom.scrollLeft-parseFloat(m.canvasGrandDom.style.paddingLeft||0)+"px",m.inputDomArray.push(n),r={x:0,y:0},c={top:0,left:0},(a=n).addEventListener("touchstart",function(t){t.preventDefault(),r.x=t.touches[0].pageX-document.body.scrollLeft,r.y=t.touches[0].pageY-document.body.scrollTop,c.top=parseFloat(a.style.top),c.left=parseFloat(a.style.left)},!1),a.addEventListener("touchmove",function(t){var e,o,n,i;t.preventDefault(),1==t.touches.length?(e=t.touches[0].pageX-document.body.scrollLeft-r.x,o=t.touches[0].pageY-document.body.scrollTop-r.y,r.x=t.touches[0].pageX-document.body.scrollLeft,r.y=t.touches[0].pageY-document.body.scrollTop,n=c.left+e,i=c.top+o,c.top=i,c.left=n,a.style.left=n.toFixed(4)+"px",a.style.top=i.toFixed(4)+"px"):t.touches.length},!1)}m.textIndex++}m.textInput.innerText="",m.textBox.style.display="none",m.textInput.style.display="none"})}function b(){var t=n(document.querySelectorAll(".picture-operate"))[0];console.log(t.style.color),"rgb(69, 148, 248)"==t.style.color&&(t.firstChild.src="static/imgEdit/painting.png",t.style.color="white")}function f(){n(document.querySelectorAll(".picture-operate")).forEach(function(t){t.addEventListener("click",function(t){var e,o,n,i=t.currentTarget.getAttribute("operate");e=i,m.operateType=e,1==i?((o=t.currentTarget).firstChild.src="static/imgEdit/painting1.png",o.style.color="#4594f8"):4==i?(a(),D(),m.paintingArray=[],b()):2==i?(m.textBox.style.display="block",m.textInput.style.display="inline-block",m.textInput.focus(),b()):3==i&&(0<m.paintingArray.length&&(a(),n=m.canvasContext,m.paintingArray.pop(),n.beginPath(),m.paintingArray.forEach(function(t){n.moveTo(t.start.x,t.start.y),t.moves.forEach(function(t){n.lineTo(t.x,t.y)})}),n.stroke()),b())},!1)})}function w(t,e){t.x=e.touches[0].pageX-document.body.scrollLeft,t.y=e.touches[0].pageY-document.body.scrollTop}function _(t,e){var o=e.pageX-t.pageX,n=e.pageY-t.pageY;return Math.sqrt(o*o+n*n)}function a(){m.canvasContext.clearRect(0,0,m.img._width,m.img._height),m.canvasContext.drawImage(m.imgInstance,0,0,m.img._width,m.img._height)}function g(t,y,v){t.addEventListener("click",function(){var t,e,o,n,i,a,r,c,l=m.inputArray;if(0<l.length){for(var s=0;s<l.length;s++){var d=m.inputDomArray[s],p=parseFloat(d.style.left),u=parseFloat(d.style.top)/parseFloat(m.canvas.style.height)*m.img._height,h=parseFloat(d.style.fontSize)/parseFloat(m.canvas.style.height)*m.img._height;t=y,e=p*x,o=u,n=parseFloat(d.offsetWidth)*x,i=parseFloat(d.offsetHeight)*x,a=5*x,c=!(r=!0),t.save(),t.beginPath(),t.moveTo(e+a,o),t.arcTo(e+n,o,e+n,o+a,a),t.arcTo(e+n,o+i,e+n-a,o+i,a),t.arcTo(e,o+i,e,o+i-a,a),t.arcTo(e,o,e+a,o,a),r&&t.fill(),c&&t.stroke(),t.restore(),console.log("scaleStyle===",x),y.fillStyle="white",y.fill();for(var f=0;f<l[s].length;f++)y.fillStyle="black",y.font="".concat(h,"px helvetica"),y.fillText(l[s][f],(p+5)*x,u+(f+1)*(1.4*parseFloat(d.style.fontSize))*x)}D()}var g=m.canvas.toDataURL();v(g)},!1)}function y(){m.pictureEditBox.style.display="none",D(),m.paintingArray=[],m.operateType=0}function D(){m.inputDomArray.forEach(function(t){t.remove()}),m.inputDomArray=[],m.inputArray=[]}function r(t,e){for(var o=0;o<e.length;o++){var n=e[o];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var c=function(){function n(t,e,o){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n),this.getImgInfo(t),this.getDeviceInfo(),this.saveFn=e,this.canseLFn=o}var t,e,o;return t=n,(e=[{key:"getImgInfo",value:function(t){var e=new Image;e.crossOrigin="anonymous";var o=this;e.onload=function(){var t=m.img;t._width=this.width,t._height=this.height,t._HW=(this.width/this.height).toFixed(4),t._WH=(this.height/this.width).toFixed(4),m.imgInstance=this,o.showImg()},e.src=t}},{key:"getDeviceInfo",value:function(){m.device._width=document.documentElement.clientWidth,m.device._height=document.documentElement.clientHeight}},{key:"showImg",value:function(){document.getElementById("picture_edit_cancel")&&m.pictureEditBox.remove();var t="style=\"flex: 1;padding-top: 1rem\" class='picture-operate'",e=p('<div style="position: fixed;top: 0;left: 0;right: 0;bottom: 0;overflow: hidden;z-index: 997000;background-color: white"><div id="picture_edit_cancel" style="position: absolute;left: 15px;top: 15px;padding: 5px 13px;background-color: white;color: black;z-index: 2;border-radius: 3px">取消</div><div id="picture_edit_save" style="position: absolute;right: 15px;top: 15px;padding: 5px 13px;background-color: #67c23a;color: white;z-index: 2;border-radius: 3px">保存</div><div style="width: 100%;height:calc(100% - 6rem);overflow: scroll;-webkit-overflow-scrolling: touch;overflow-scrolling: touch;box-sizing: border-box"><div style="position: relative">'+'<canvas id="picture_edit_canvas" width="'.concat(m.img._width,'" height="').concat(m.img._height,'" style="width: ').concat(m.device._width+"px",";height: ").concat(Math.floor(m.device._width*m.img._WH)+"px",'"></canvas>')+'</div></div><div style="position: absolute;bottom: 0;left: 0;right: 0;height: 6rem;background-color: black;display: flex;text-align: center;color: white">'+"<div ".concat(t,' operate="1">')+'<img src="static/imgEdit/painting.png" style="width: 1.3rem;display: block;margin: auto;">涂画</div>'+"<div ".concat(t,' operate="2">')+'<img src="static/imgEdit/text.png" style="width: 1.3rem;display: block;margin: auto"> 文字</div>'+"<div ".concat(t,' operate="3">')+'<img src="static/imgEdit/withdraw.png" style="width: 1.3rem;display: block;margin: auto"> 撤回</div>'+"<div ".concat(t,' operate="4">')+'<img src="static/imgEdit/empty.png" style="width: 1.3rem;display: block;margin: auto"> 清空</div></div><div id="picture_edit_text" style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;overflow: hidden;z-index: 2;display: none;background-color: white;opacity: 0.93"></div><div id="picture_edit_input" contenteditable="true" tabindex="1" style="min-height:15%;border-radius: 5px;border: 2px solid #63eca1;outline: none;width: 96%;box-sizing: border-box;position: absolute;top: 8%;left: 2%;right: 2%;display: none;z-index: 2;padding: 3px 5px"></div></div>');document.body.appendChild(e);var o,n,i,a=document.getElementById("picture_edit_canvas"),r=document.getElementById("picture_edit_text"),c=document.getElementById("picture_edit_input");o=a,n=r,i=c,m.canvas=o,m.canvasParentDom=o.parentElement,m.canvasGrandDom=o.parentElement.parentElement,m.canvasContext=o.getContext("2d"),m.textBox=n,m.pictureEditBox=n.parentElement,m.textInput=i,m.boxSize._height=m.canvasGrandDom.offsetHeight,m.boxSize._width=m.canvasGrandDom.offsetWidth;var l,s,d=(m.boxSize._height-parseFloat(a.style.height)).toFixed(4);0<d&&(m.canvasGrandDom.style.paddingTop=d/2+"px"),m.canvasContext.drawImage(m.imgInstance,0,0,a.width,a.height),u(a),h(),f(),g(document.getElementById("picture_edit_save"),m.canvasContext,this.saveFn),l=document.getElementById("picture_edit_cancel"),s=this.canseLFn,l.addEventListener("click",function(){s(),y()},!1)}},{key:"showPED",value:function(){m.pictureEditBox.style.display="block"}},{key:"hidePED",value:function(){y()}}])&&r(t.prototype,e),o&&r(t,o),n}()}],i.c=n,i.d=function(t,e,o){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(i.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)i.d(o,n,function(t){return e[t]}.bind(null,n));return o},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=0);function i(t){if(n[t])return n[t].exports;var e=n[t]={i:t,l:!1,exports:{}};return o[t].call(e.exports,e,e.exports,i),e.l=!0,e.exports}var o,n});