UNPKG

@pepperi/lib

Version:

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.0.1.

2 lines 14.4 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/lib"),require("@pepperi/lib/icon"),require("@pepperi/lib/dialog"),require("@ngx-translate/core")):"function"==typeof define&&define.amd?define("@pepperi/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/lib","@pepperi/lib/icon","@pepperi/lib/dialog","@ngx-translate/core"],t):t(((e=e||self).pepperi=e.pepperi||{},e.pepperi.lib=e.pepperi.lib||{},e.pepperi.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.lib,e.pepperi.lib.icon,e.pepperi.lib.dialog,e.translate)}(this,(function(e,t,n,i,r,a,l,o,p,s,c,u,d,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 h(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 I=function(e){return[e]};function C(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,I,"text-align-"+r.xAlignment))}}function x(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,"FilesUploader_SeeOriginal")))}function b(e,n){if(1&e&&(t.ɵɵelementStart(0,"div",18),t.ɵɵtemplate(1,x,5,3,"a",19),t.ɵɵelementEnd()),2&e){var i=t.ɵɵnextContext(3);t.ɵɵadvance(1),t.ɵɵproperty("ngIf",""!=i.src)}}function M(e,n){if(1&e){var i=t.ɵɵgetCurrentView();t.ɵɵtemplate(0,h,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,C,2,7,"img",12),t.ɵɵtemplate(3,b,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 E(e,n){1&e&&t.ɵɵelement(0,"pep-icon",21)}function F(e,n){1&e&&t.ɵɵelement(0,"pep-icon",26)}function S(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?"FilesUploader_MissingImageMsg":"FilesUploader_MissingFileMsg":"FilesUploader_DragDropMsg")," ")}}function w(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,w,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 _(e,n){if(1&e&&(t.ɵɵelementStart(0,"div",18),t.ɵɵtemplate(1,E,1,0,"pep-icon",23),t.ɵɵtemplate(2,F,1,0,"pep-icon",24),t.ɵɵtemplate(3,S,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 P=function(e,t){return{"one-row":e,disable:t}},k=function(e){return{field:e}};function q(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,M,4,3,"ng-template",null,6,t.ɵɵtemplateRefExtractor),t.ɵɵtemplate(6,_,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),l=t.ɵɵnextContext();t.ɵɵproperty("formGroup",l.form),t.ɵɵadvance(2),t.ɵɵstyleProp("height",l.fieldHeight),t.ɵɵproperty("ngClass",t.ɵɵpureFunction2(26,P,1==l.rowSpan,l.disabled)),t.ɵɵadvance(1),t.ɵɵproperty("ngIf",""!=l.src)("ngIfThen",r)("ngIfElse",a),t.ɵɵadvance(5),t.ɵɵproperty("id",l.key)("name",l.key)("formControlName",l.key)("value",l.src)("disabled",l.disabled),t.ɵɵadvance(2),t.ɵɵproperty("title",l.required&&0==l.src.length?t.ɵɵpipeBind2(11,14,"Msg_Is_Required",t.ɵɵpureFunction1(29,k,l.label)):t.ɵɵpipeBind2(12,17,"Msg_Is_Not_Valid",t.ɵɵpureFunction1(31,k,l.label)))("innerText",l.required&&0==l.src.length?t.ɵɵpipeBind2(13,20,"Msg_Is_Required",t.ɵɵpureFunction1(33,k,l.label)):t.ɵɵpipeBind2(14,23,"Msg_Is_Not_Valid",t.ɵɵpureFunction1(35,k,l.label)))}}function A(e,n){1&e&&t.ɵɵelementContainer(0)}function D(e,n){if(1&e&&(t.ɵɵelementContainerStart(0),t.ɵɵtemplate(1,A,1,0,"ng-container",32),t.ɵɵelementContainerEnd()),2&e){t.ɵɵnextContext();var i=t.ɵɵreference(1);t.ɵɵadvance(1),t.ɵɵproperty("ngTemplateOutlet",i)}}function U(e,n){1&e&&t.ɵɵelementContainer(0)}function B(e,n){1&e&&t.ɵɵelementContainer(0)}var O=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 l=a.translate.instant("Msg_Notice_Title"),o=new d.DialogData({title:l,content:r,contentType:d.DialogDataType.Html});a.dialogService.openDefaultDialog(o)}},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,l="",o=-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())?o||(l=this.translate.instant("FaildToLoadImageSize",{fileSize:"<label class='upperCaseBold'>"+i.toString()+"</label>"})):l=this.translate.instant("FaildToLoadImageExtension",{fileExtension:"<label class='upperCaseBold'>"+t+"</label>"}),l},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("NoImage")},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}();O.ɵfac=function(e){return new(e||O)(t.ɵɵdirectiveInject(m.TranslateService),t.ɵɵdirectiveInject(d.DialogService),t.ɵɵdirectiveInject(c.CustomizationService),t.ɵɵdirectiveInject(c.FileService))},O.ɵcmp=t.ɵɵdefineComponent({type:O,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,q,15,37,"ng-template",null,0,t.ɵɵtemplateRefExtractor),t.ɵɵtemplate(2,D,2,1,"ng-container",1),t.ɵɵtemplate(3,U,1,0,"ng-container",1),t.ɵɵtemplate(4,B,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,l.MatFormField,i.NgControlStatusGroup,i.FormGroupDirective,n.NgClass,o.MatInput,i.DefaultValueAccessor,i.NgControlStatus,i.FormControlName,l.MatError,a.MatButton,p.MatIcon,u.PepperiIconComponent,s.FileSelectDirective,n.NgTemplateOutlet],pipes:[m.TranslatePipe],styles:["[_nghost-%COMP%]{display:-ms-grid;display:grid;height:inherit}"],changeDetection:0}),O.ɵprov=t.ɵɵdefineInjectable({token:O,factory:O.ɵfac});var N=function(e){this.pepperiIconRegistry=e,this.pepperiIconRegistry.registerIcons([u.pepperiIconSystemBin,u.pepperiIconSystemAttach,u.pepperiIconSystemFileUploadCloud,u.pepperiIconSystemProcessing])};N.ɵmod=t.ɵɵdefineNgModule({type:N}),N.ɵinj=t.ɵɵdefineInjector({factory:function(e){return new(e||N)(t.ɵɵinject(u.PepperiIconRegistry))},imports:[[n.CommonModule,i.ReactiveFormsModule,i.FormsModule,r.MatCommonModule,a.MatButtonModule,l.MatFormFieldModule,o.MatInputModule,p.MatIconModule,s.FileUploadModule,c.PepperiModule,u.PepperiIconModule,d.PepperiDialogModule]]}),("undefined"==typeof ngJitMode||ngJitMode)&&t.ɵɵsetNgModuleScope(N,{declarations:[O],imports:[n.CommonModule,i.ReactiveFormsModule,i.FormsModule,r.MatCommonModule,a.MatButtonModule,l.MatFormFieldModule,o.MatInputModule,p.MatIconModule,s.FileUploadModule,c.PepperiModule,u.PepperiIconModule,d.PepperiDialogModule],exports:[O]}),e.FilesUploaderComponent=O,e.PepperiFilesUploaderModule=N,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=pepperi-lib-files-uploader.umd.min.js.map