2 lines
6.8 KiB
JavaScript
2 lines
6.8 KiB
JavaScript
import e,{Component as t}from"react";import{CSSTransition as i}from"primereact/csstransition";import{DomHandler as n,ZIndexUtils as o,classNames as r,ObjectUtils as a}from"primereact/utils";import{Portal as s}from"primereact/portal";import l from"primereact/api";function c(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function p(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function u(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function m(e,t){return m=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},m(e,t)}function f(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&m(e,t)}function h(e){return h="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},h(e)}function d(e,t){if(t&&("object"===h(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return u(e)}function y(e){return y=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},y(e)}function v(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}var b,k,E,w=function(m){f(C,t);var h,b,k,E,w,g=(h=C,b=v(),function(){var e,t=y(h);if(b){var i=y(this).constructor;e=Reflect.construct(t,arguments,i)}else e=t.apply(this,arguments);return d(this,e)});function C(t){var i;return c(this,C),(i=g.call(this,t)).state={maskVisible:!1,previewVisible:!1,rotate:0,scale:1},i.onImageClick=i.onImageClick.bind(u(i)),i.onMaskClick=i.onMaskClick.bind(u(i)),i.onDownload=i.onDownload.bind(u(i)),i.rotateRight=i.rotateRight.bind(u(i)),i.rotateLeft=i.rotateLeft.bind(u(i)),i.zoomIn=i.zoomIn.bind(u(i)),i.zoomOut=i.zoomOut.bind(u(i)),i.onEntering=i.onEntering.bind(u(i)),i.onEntered=i.onEntered.bind(u(i)),i.onPreviewImageClick=i.onPreviewImageClick.bind(u(i)),i.onExit=i.onExit.bind(u(i)),i.onExiting=i.onExiting.bind(u(i)),i.onExited=i.onExited.bind(u(i)),i.previewRef=e.createRef(),i}return k=C,(E=[{key:"onImageClick",value:function(){var e=this;this.props.preview&&(this.setState({maskVisible:!0}),setTimeout((function(){e.setState({previewVisible:!0})}),25))}},{key:"onPreviewImageClick",value:function(){this.previewClick=!0}},{key:"onMaskClick",value:function(){this.previewClick||(this.setState({previewVisible:!1}),this.setState({rotate:0}),this.setState({scale:1})),this.previewClick=!1}},{key:"onDownload",value:function(){var e=this.props;n.saveAs({name:e.alt,src:e.src}),this.previewClick=!0}},{key:"rotateRight",value:function(){this.setState((function(e){return{rotate:e.rotate+90}})),this.previewClick=!0}},{key:"rotateLeft",value:function(){this.setState((function(e){return{rotate:e.rotate-90}})),this.previewClick=!0}},{key:"zoomIn",value:function(){this.setState((function(e){return{scale:e.scale+.1}})),this.previewClick=!0}},{key:"zoomOut",value:function(){this.setState((function(e){return{scale:e.scale-.1}})),this.previewClick=!0}},{key:"onEntering",value:function(){o.set("modal",this.mask,l.autoZIndex,l.zIndex.modal)}},{key:"onEntered",value:function(){this.props.onShow&&this.props.onShow()}},{key:"onExit",value:function(){n.addClass(this.mask,"p-component-overlay-leave")}},{key:"onExiting",value:function(){this.props.onHide&&this.props.onHide()}},{key:"onExited",value:function(e){o.clear(e),this.setState({maskVisible:!1})}},{key:"componentWillUnmount",value:function(){this.mask&&o.clear(this.container)}},{key:"renderElement",value:function(){var t=this,n={transform:"rotate("+this.state.rotate+"deg) scale("+this.state.scale+")"},o=this.state.scale<=.5||this.state.scale>=1.5;return e.createElement("div",{ref:function(e){return t.mask=e},className:"p-image-mask p-component-overlay p-component-overlay-enter",onClick:this.onMaskClick},e.createElement("div",{className:"p-image-toolbar"},this.props.downloadable&&e.createElement("button",{className:"p-image-action p-link",onClick:this.onDownload,type:"button"},e.createElement("i",{className:"pi pi-download"})),e.createElement("button",{className:"p-image-action p-link",onClick:this.rotateRight,type:"button"},e.createElement("i",{className:"pi pi-refresh"})),e.createElement("button",{className:"p-image-action p-link",onClick:this.rotateLeft,type:"button"},e.createElement("i",{className:"pi pi-undo"})),e.createElement("button",{className:"p-image-action p-link",onClick:this.zoomOut,type:"button",disabled:o},e.createElement("i",{className:"pi pi-search-minus"})),e.createElement("button",{className:"p-image-action p-link",onClick:this.zoomIn,type:"button",disabled:o},e.createElement("i",{className:"pi pi-search-plus"})),e.createElement("button",{className:"p-image-action p-link",type:"button",onClick:this.hidePreview},e.createElement("i",{className:"pi pi-times"}))),e.createElement(i,{nodeRef:this.previewRef,classNames:"p-image-preview",in:this.state.previewVisible,timeout:{enter:150,exit:150},unmountOnExit:!0,onEntering:this.onEntering,onEntered:this.onEntered,onExit:this.onExit,onExiting:this.onExiting,onExited:this.onExited},e.createElement("div",{ref:this.previewRef},e.createElement("img",{src:this.props.src,className:"p-image-preview",style:n,onClick:this.onPreviewImageClick,alt:this.props.alt}))))}},{key:"render",value:function(){var t=this,i=r("p-image p-component",this.props.className,{"p-image-preview-container":this.props.preview}),n=this.renderElement(),o=this.props.template?a.getJSXElement(this.props.template,this.props):e.createElement("i",{className:"p-image-preview-icon pi pi-eye"}),l=this.props;return e.createElement("span",{ref:function(e){return t.container=e},className:i,style:this.props.style},e.createElement("img",{src:l.src,className:this.props.imageClassName,width:l.width,height:l.height,style:this.props.imageStyle,alt:l.alt}),this.props.preview&&e.createElement("div",{className:"p-image-preview-indicator",onClick:this.onImageClick},o),this.state.maskVisible&&e.createElement(s,{element:n,appendTo:document.body}))}}])&&p(k.prototype,E),w&&p(k,w),Object.defineProperty(k,"prototype",{writable:!1}),C}();E={preview:!1,className:null,downloadable:!1,style:null,imageStyle:null,imageClassName:null,template:null,src:null,alt:null,width:null,height:null},(k="defaultProps")in(b=w)?Object.defineProperty(b,k,{value:E,enumerable:!0,configurable:!0,writable:!0}):b[k]=E;export{w as Image};
|