UNPKG

@pepperi/ngx-lib

Version:

Pepperi Angular Components and Services

3 lines (2 loc) 14.6 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("@angular/forms"),require("@angular/material/core"),require("@angular/material/button"),require("@angular/material/form-field"),require("@angular/material/input"),require("@angular/material/icon"),require("ng2-file-upload"),require("@pepperi/ngx-lib"),require("@pepperi/ngx-lib/icon"),require("@pepperi/ngx-lib/dialog"),require("@ngx-translate/core")):"function"==typeof define&&define.amd?define("@pepperi/ngx-lib/files-uploader",["exports","@angular/core","@angular/common","@angular/forms","@angular/material/core","@angular/material/button","@angular/material/form-field","@angular/material/input","@angular/material/icon","ng2-file-upload","@pepperi/ngx-lib","@pepperi/ngx-lib/icon","@pepperi/ngx-lib/dialog","@ngx-translate/core"],t):t(((e=e||self)["pepperi-addons"]=e["pepperi-addons"]||{},e["pepperi-addons"]["ngx-lib"]=e["pepperi-addons"]["ngx-lib"]||{},e["pepperi-addons"]["ngx-lib"]["files-uploader"]={}),e.ng.core,e.ng.common,e.ng.forms,e.ng.material.core,e.ng.material.button,e.ng.material.formField,e.ng.material.input,e.ng.material.icon,e["file-upload"],e["pepperi-addons"]["ngx-lib"],e["pepperi-addons"]["ngx-lib"].icon,e["pepperi-addons"]["ngx-lib"].dialog,e.translate)}(this,(function(e,t,n,i,r,a,o,l,p,s,c,d,u,m){"use strict";var f=["fileInput"],g=["imagePreview"];function v(e,n){1&e&&t.ɵɵelementContainer(0)}var y=function(e){return{"right-alignment":e}};function I(e,n){if(1&e){var i=t.ɵɵgetCurrentView();t.ɵɵelementStart(0,"button",14),t.ɵɵlistener("click",(function(){return t.ɵɵrestoreView(i),t.ɵɵnextContext(3).deleteFile()})),t.ɵɵelementStart(1,"mat-icon"),t.ɵɵelement(2,"pep-icon",15),t.ɵɵelementEnd(),t.ɵɵelementEnd()}if(2&e){var r=t.ɵɵnextContext(3);t.ɵɵproperty("ngClass",t.ɵɵpureFunction1(1,y,"2"==r.xAlignment))}}var h=function(e){return[e]};function E(e,n){if(1&e){var i=t.ɵɵgetCurrentView();t.ɵɵelementStart(0,"img",16,17),t.ɵɵlistener("error",(function(e){return t.ɵɵrestoreView(i),t.ɵɵnextContext(3).errorHandler(e)})),t.ɵɵelementEnd()}if(2&e){var r=t.ɵɵnextContext(3);t.ɵɵstyleProp("max-height",r.fieldHeight),t.ɵɵproperty("src",r.src,t.ɵɵsanitizeUrl)("alt",r.label)("ngClass",t.ɵɵpureFunction1(5,h,"text-align-"+r.xAlignment))}}function S(e,n){1&e&&(t.ɵɵelementStart(0,"a",20),t.ɵɵelement(1,"pep-icon",21),t.ɵɵelementStart(2,"span",22),t.ɵɵtext(3),t.ɵɵpipe(4,"translate"),t.ɵɵelementEnd(),t.ɵɵelementEnd()),2&e&&(t.ɵɵadvance(3),t.ɵɵtextInterpolate(t.ɵɵpipeBind1(4,1,"FILE.SEE_ORIGINAL")))}function x(e,n){if(1&e&&(t.ɵɵelementStart(0,"div",18),t.ɵɵtemplate(1,S,5,3,"a",19),t.ɵɵelementEnd()),2&e){var i=t.ɵɵnextContext(3);t.ɵɵadvance(1),t.ɵɵproperty("ngIf",""!=i.src)}}function C(e,n){if(1&e){var i=t.ɵɵgetCurrentView();t.ɵɵtemplate(0,I,3,3,"button",10),t.ɵɵelementStart(1,"div",11),t.ɵɵlistener("click",(function(e){return t.ɵɵrestoreView(i),t.ɵɵnextContext(2).onElementClicked(e)})),t.ɵɵtemplate(2,E,2,7,"img",12),t.ɵɵtemplate(3,x,2,1,"div",13),t.ɵɵelementEnd()}if(2&e){var r=t.ɵɵnextContext(2);t.ɵɵproperty("ngIf",!r.disabled),t.ɵɵadvance(2),t.ɵɵproperty("ngIf","image"===r.controlType),t.ɵɵadvance(1),t.ɵɵproperty("ngIf","attachment"===r.controlType)}}function b(e,n){1&e&&t.ɵɵelement(0,"pep-icon",21)}function M(e,n){1&e&&t.ɵɵelement(0,"pep-icon",26)}function F(e,n){if(1&e&&(t.ɵɵelementStart(0,"span",22),t.ɵɵtext(1),t.ɵɵpipe(2,"translate"),t.ɵɵelementEnd()),2&e){var i=t.ɵɵnextContext(3);t.ɵɵadvance(1),t.ɵɵtextInterpolate1(" ",t.ɵɵpipeBind1(2,1,i.disabled?"image"===i.controlType?"MESSAGES.INFO_MISSING_IMAGE":"MESSAGES.INFO_MISSING_FILE":"FILE.HINT")," ")}}function _(e,n){if(1&e&&(t.ɵɵelementStart(0,"button",30),t.ɵɵelementStart(1,"mat-icon"),t.ɵɵelement(2,"pep-icon",31),t.ɵɵelementEnd(),t.ɵɵelementEnd()),2&e){var i=t.ɵɵnextContext(4);t.ɵɵproperty("ngClass",t.ɵɵpureFunction1(1,y,"2"==i.xAlignment))}}function T(e,n){if(1&e&&(t.ɵɵelementContainerStart(0),t.ɵɵelement(1,"input",27,28),t.ɵɵtemplate(3,_,3,3,"button",29),t.ɵɵelementContainerEnd()),2&e){var i=t.ɵɵnextContext(3);t.ɵɵadvance(1),t.ɵɵpropertyInterpolate1("id","pepperi-file-",i.key,""),t.ɵɵproperty("uploader",i.uploader),t.ɵɵadvance(2),t.ɵɵproperty("ngIf",0!=i.progress)}}function w(e,n){if(1&e&&(t.ɵɵelementStart(0,"div",18),t.ɵɵtemplate(1,b,1,0,"pep-icon",23),t.ɵɵtemplate(2,M,1,0,"pep-icon",24),t.ɵɵtemplate(3,F,3,3,"span",25),t.ɵɵelementEnd(),t.ɵɵtemplate(4,T,4,3,"ng-container",1)),2&e){var i=t.ɵɵnextContext(2);t.ɵɵadvance(1),t.ɵɵproperty("ngIf","attachment"===i.controlType),t.ɵɵadvance(1),t.ɵɵproperty("ngIf","image"===i.controlType),t.ɵɵadvance(1),t.ɵɵproperty("ngIf",0==i.progress),t.ɵɵadvance(1),t.ɵɵproperty("ngIf",!i.disabled)}}var A=function(e,t){return{"one-row":e,disable:t}},O=function(e){return{field:e}};function R(e,n){if(1&e){var i=t.ɵɵgetCurrentView();t.ɵɵelementStart(0,"mat-form-field",2),t.ɵɵelementStart(1,"div",3),t.ɵɵelementStart(2,"div",4),t.ɵɵtemplate(3,v,1,0,"ng-container",5),t.ɵɵtemplate(4,C,4,3,"ng-template",null,6,t.ɵɵtemplateRefExtractor),t.ɵɵtemplate(6,w,5,4,"ng-template",null,7,t.ɵɵtemplateRefExtractor),t.ɵɵelementEnd(),t.ɵɵelementStart(8,"input",8),t.ɵɵlistener("click",(function(e){return t.ɵɵrestoreView(i),t.ɵɵnextContext().onClick_ChooseFile(e)}))("keypress",(function(e){return t.ɵɵrestoreView(i),t.ɵɵnextContext().onKeyPress_ChooseFile(e)})),t.ɵɵelementEnd(),t.ɵɵelementEnd(),t.ɵɵelementStart(9,"mat-error"),t.ɵɵelement(10,"span",9),t.ɵɵpipe(11,"translate"),t.ɵɵpipe(12,"translate"),t.ɵɵpipe(13,"translate"),t.ɵɵpipe(14,"translate"),t.ɵɵelementEnd(),t.ɵɵelementEnd()}if(2&e){var r=t.ɵɵreference(5),a=t.ɵɵreference(7),o=t.ɵɵnextContext();t.ɵɵproperty("formGroup",o.form),t.ɵɵadvance(2),t.ɵɵstyleProp("height",o.fieldHeight),t.ɵɵproperty("ngClass",t.ɵɵpureFunction2(26,A,1==o.rowSpan,o.disabled)),t.ɵɵadvance(1),t.ɵɵproperty("ngIf",""!=o.src)("ngIfThen",r)("ngIfElse",a),t.ɵɵadvance(5),t.ɵɵproperty("id",o.key)("name",o.key)("formControlName",o.key)("value",o.src)("disabled",o.disabled),t.ɵɵadvance(2),t.ɵɵproperty("title",o.required&&0==o.src.length?t.ɵɵpipeBind2(11,14,"MESSAGES.ERROR_IS_REQUIRED",t.ɵɵpureFunction1(29,O,o.label)):t.ɵɵpipeBind2(12,17,"MESSAGES.ERROR_IS_NOT_VALID",t.ɵɵpureFunction1(31,O,o.label)))("innerText",o.required&&0==o.src.length?t.ɵɵpipeBind2(13,20,"MESSAGES.ERROR_IS_REQUIRED",t.ɵɵpureFunction1(33,O,o.label)):t.ɵɵpipeBind2(14,23,"MESSAGES.ERROR_IS_NOT_VALID",t.ɵɵpureFunction1(35,O,o.label)))}}function P(e,n){1&e&&t.ɵɵelementContainer(0)}function k(e,n){if(1&e&&(t.ɵɵelementContainerStart(0),t.ɵɵtemplate(1,P,1,0,"ng-container",32),t.ɵɵelementContainerEnd()),2&e){t.ɵɵnextContext();var i=t.ɵɵreference(1);t.ɵɵadvance(1),t.ɵɵproperty("ngTemplateOutlet",i)}}function D(e,n){1&e&&t.ɵɵelementContainer(0)}function N(e,n){1&e&&t.ɵɵelementContainer(0)}var L=function(){function e(e,n,i,r){this.translate=e,this.dialogService=n,this.customizationService=i,this.fileService=r,this.key="",this.src="",this.label="",this.required=!1,this.disabled=!1,this.xAlignment="0",this.rowSpan=1,this.controlType="",this.sizeLimitMB=5,this.standAlone=!1,this.acceptedExtensions="bmp,jpg,jpeg,png,gif,ico,svg,html,css",this.layoutType=c.LAYOUT_TYPE.PepperiForm,this.fileChanged=new t.EventEmitter,this.elementClicked=new t.EventEmitter,this.LAYOUT_TYPE=c.LAYOUT_TYPE,this.fieldHeight="",this.progress=0,this.intervalID=null;var a=this;this.uploader=new s.FileUploader({removeAfterUpload:!0}),this.uploader.onAfterAddingFile=function(e){var t;(null===(t=a.fileInput)||void 0===t?void 0:t.nativeElement)&&(a.fileInput.nativeElement.value="");var n=new FileReader;n.onload=function(t){var n=e._file.name.split(".").pop(),i=(t.target||t.srcElement).result,r=a.isValidFile(i,n,a.acceptedExtensions,a.sizeLimitMB);if(""===r)a.src=i,a.setIntervalX(25,75),a.setProgress(5),a.fileChanged.emit(JSON.stringify({acceptedExtensions:a.acceptedExtensions,fileStr:i,fileExt:n}));else{var o=a.translate.instant("MESSAGES.TITLE_NOTICE"),l=new u.DialogData({title:o,content:r,contentType:u.DialogDataType.Html});a.dialogService.openDefaultDialog(l)}},n.readAsDataURL(e._file)}}return e.prototype.ngOnInit=function(){this.fieldHeight=this.customizationService.calculateFieldHeight(this.layoutType,this.rowSpan,this.standAlone)},e.prototype.isValidFile=function(e,t,n,i){void 0===i&&(i=5);var r=e,a=0,o="",l=-1!==(a="string"==typeof e&&e.indexOf("data:")>-1?this.getBase64FileSize(e):r.size)&&null!=r&&a<1048576*i;return""===n||-1!==n.indexOf(t.toLowerCase())?l||(o=this.translate.instant("MESSAGES.ERROR_FAILD_TO_LOAD_SIZE",{fileSize:"<label class='uppercase bold'>"+i.toString()+"</label>"})):o=this.translate.instant("MESSAGES.ERROR_FAILD_TO_LOAD_EXTENSION",{fileExtension:"<label class='uppercase bold'>"+t+"</label>"}),o},e.prototype.getBase64FileSize=function(e){var t;try{e=e.substr(e.indexOf(",")+1),t=atob(e).length}catch(e){t=-1}return t},e.prototype.setIntervalX=function(e,t){var n=this,i=0;this.intervalID=window.setInterval((function(){(++i===t||n.uploader.progress>=100)&&window.clearInterval(n.intervalID)}),e)},e.prototype.errorHandler=function(e){e.target.src=this.fileService.getNoImagePath(),e.target.title=this.translate.instant("IMAGE.NO_IMAGE")},e.prototype.setProgress=function(e){this.progress=e,this.uploader.progress=e},e.prototype.deleteFile=function(){this.uploader.clearQueue(),window.clearInterval(this.intervalID),this.setProgress(0);this.src="",this.fileChanged.emit("")},e.prototype.onElementClicked=function(e){this.elementClicked.emit({apiName:this.key,event:e})},e.prototype.onClick_ChooseFile=function(e){var t;(null===(t=this.fileInput)||void 0===t?void 0:t.nativeElement)&&this.fileInput.nativeElement.click()},e.prototype.onKeyPress_ChooseFile=function(e){var t,n=e;-1!==[13,32].indexOf(n.which)&&(null===(t=this.fileInput)||void 0===t?void 0:t.nativeElement)&&this.fileInput.nativeElement.click(),n.preventDefault()},e}();L.ɵfac=function(e){return new(e||L)(t.ɵɵdirectiveInject(m.TranslateService),t.ɵɵdirectiveInject(u.DialogService),t.ɵɵdirectiveInject(c.CustomizationService),t.ɵɵdirectiveInject(c.FileService))},L.ɵcmp=t.ɵɵdefineComponent({type:L,selectors:[["files-uploader"]],viewQuery:function(e,n){var i;(1&e&&(t.ɵɵviewQuery(f,!0),t.ɵɵviewQuery(g,!0)),2&e)&&(t.ɵɵqueryRefresh(i=t.ɵɵloadQuery())&&(n.fileInput=i.first),t.ɵɵqueryRefresh(i=t.ɵɵloadQuery())&&(n.imagePreview=i.first))},inputs:{key:"key",src:"src",label:"label",required:"required",disabled:"disabled",xAlignment:"xAlignment",rowSpan:"rowSpan",controlType:"controlType",sizeLimitMB:"sizeLimitMB",form:"form",standAlone:"standAlone",acceptedExtensions:"acceptedExtensions",layoutType:"layoutType"},outputs:{fileChanged:"fileChanged",elementClicked:"elementClicked"},decls:5,vars:3,consts:[["pepperiTemplate",""],[4,"ngIf"],["appearance","outline",3,"formGroup"],[1,"pepperi-file-wrapper"],[1,"pepperi-file","body-sm",3,"ngClass"],[4,"ngIf","ngIfThen","ngIfElse"],["withImg",""],["noImg",""],["matInput","","type","text","autocomplete","off",1,"hidden-input",3,"id","name","formControlName","value","disabled","click","keypress"],[1,"body-xs",3,"title","innerText"],["mat-button","","class","pepperi-button icon-button weak md delete","tabindex","-1",3,"ngClass","click",4,"ngIf"],[1,"pepperi-file-preview",3,"click"],["class","pepperi-file-preview-img",3,"src","max-height","alt","ngClass","error",4,"ngIf"],["class","ellipsis pepperi-file-message",4,"ngIf"],["mat-button","","tabindex","-1",1,"pepperi-button","icon-button","weak","md","delete",3,"ngClass","click"],["name","system_bin"],[1,"pepperi-file-preview-img",3,"src","alt","ngClass","error"],["imagePreview",""],[1,"ellipsis","pepperi-file-message"],["href","javascript:void(0)",4,"ngIf"],["href","javascript:void(0)"],["name","system_attach"],[1,"body-sm","ellipsis"],["name","system_attach",4,"ngIf"],["name","system_file_upload_cloud",4,"ngIf"],["class","body-sm ellipsis",4,"ngIf"],["name","system_file_upload_cloud"],["tabindex","-1","type","file","accept","acceptedExtensions","ng2FileSelect","","autocomplete","off",3,"id","uploader"],["fileInput",""],["mat-button","","class","pepperi-button icon-button weak md delete",3,"ngClass",4,"ngIf"],["mat-button","",1,"pepperi-button","icon-button","weak","md","delete",3,"ngClass"],["name","system_processing",1,"spin-icon"],[4,"ngTemplateOutlet"]],template:function(e,n){1&e&&(t.ɵɵtemplate(0,R,15,37,"ng-template",null,0,t.ɵɵtemplateRefExtractor),t.ɵɵtemplate(2,k,2,1,"ng-container",1),t.ɵɵtemplate(3,D,1,0,"ng-container",1),t.ɵɵtemplate(4,N,1,0,"ng-container",1)),2&e&&(t.ɵɵadvance(2),t.ɵɵproperty("ngIf",n.layoutType===n.LAYOUT_TYPE.PepperiForm),t.ɵɵadvance(1),t.ɵɵproperty("ngIf",n.layoutType===n.LAYOUT_TYPE.PepperiCard),t.ɵɵadvance(1),t.ɵɵproperty("ngIf",n.layoutType===n.LAYOUT_TYPE.PepperiTable))},directives:[n.NgIf,o.MatFormField,i.NgControlStatusGroup,i.FormGroupDirective,n.NgClass,l.MatInput,i.DefaultValueAccessor,i.NgControlStatus,i.FormControlName,o.MatError,a.MatButton,p.MatIcon,d.PepperiIconComponent,s.FileSelectDirective,n.NgTemplateOutlet],pipes:[m.TranslatePipe],styles:["[_nghost-%COMP%]{display:-ms-grid;display:grid;height:inherit}"],changeDetection:0}),L.ɵprov=t.ɵɵdefineInjectable({token:L,factory:L.ɵfac});var q=function(e){this.pepperiIconRegistry=e,this.pepperiIconRegistry.registerIcons([d.pepperiIconSystemBin,d.pepperiIconSystemAttach,d.pepperiIconSystemFileUploadCloud,d.pepperiIconSystemProcessing])};q.ɵmod=t.ɵɵdefineNgModule({type:q}),q.ɵinj=t.ɵɵdefineInjector({factory:function(e){return new(e||q)(t.ɵɵinject(d.PepperiIconRegistry))},imports:[[n.CommonModule,i.ReactiveFormsModule,i.FormsModule,r.MatCommonModule,a.MatButtonModule,o.MatFormFieldModule,l.MatInputModule,p.MatIconModule,s.FileUploadModule,c.PepperiModule,d.PepperiIconModule,u.PepperiDialogModule]]}),("undefined"==typeof ngJitMode||ngJitMode)&&t.ɵɵsetNgModuleScope(q,{declarations:[L],imports:[n.CommonModule,i.ReactiveFormsModule,i.FormsModule,r.MatCommonModule,a.MatButtonModule,o.MatFormFieldModule,l.MatInputModule,p.MatIconModule,s.FileUploadModule,c.PepperiModule,d.PepperiIconModule,u.PepperiDialogModule],exports:[L]}),e.FilesUploaderComponent=L,e.PepperiFilesUploaderModule=q,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=pepperi-addons-ngx-lib-files-uploader.umd.min.js.map