@rs-pk/asset-management 1.0.24 → 1.0.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/rs-pk-asset-management.umd.js +11 -17
- package/bundles/rs-pk-asset-management.umd.js.map +1 -1
- package/bundles/rs-pk-asset-management.umd.min.js +1 -1
- package/bundles/rs-pk-asset-management.umd.min.js.map +1 -1
- package/esm2015/lib/asset-management.component.js +7 -2
- package/esm2015/lib/components/partial/asset-item/asset-item.component.js +2 -2
- package/esm2015/lib/components/partial/asset-management-dialog/asset-management-dialog.component.js +4 -17
- package/esm2015/lib/models/asset.model.js +3 -1
- package/esm5/lib/asset-management.component.js +7 -2
- package/esm5/lib/components/partial/asset-item/asset-item.component.js +2 -2
- package/esm5/lib/components/partial/asset-management-dialog/asset-management-dialog.component.js +4 -17
- package/esm5/lib/models/asset.model.js +3 -1
- package/fesm2015/rs-pk-asset-management.js +12 -18
- package/fesm2015/rs-pk-asset-management.js.map +1 -1
- package/fesm5/rs-pk-asset-management.js +12 -18
- package/fesm5/rs-pk-asset-management.js.map +1 -1
- package/lib/components/partial/asset-management-dialog/asset-management-dialog.component.d.ts +0 -3
- package/lib/models/asset.model.d.ts +5 -0
- package/package.json +2 -1
- package/rs-pk-asset-management.metadata.json +1 -1
|
@@ -372,6 +372,8 @@
|
|
|
372
372
|
DialogConfig.prototype.allowedType;
|
|
373
373
|
/** @type {?} */
|
|
374
374
|
DialogConfig.prototype.maxSize;
|
|
375
|
+
/** @type {?} */
|
|
376
|
+
DialogConfig.prototype.permission;
|
|
375
377
|
}
|
|
376
378
|
/** @enum {number} */
|
|
377
379
|
var BackgroudProcessingStatus = {
|
|
@@ -1863,9 +1865,6 @@
|
|
|
1863
1865
|
this.data = data;
|
|
1864
1866
|
this.dialogRef = dialogRef;
|
|
1865
1867
|
this.assetService = assetService;
|
|
1866
|
-
this.hasModifyPermission = true;
|
|
1867
|
-
this.hasAccessPermission = true;
|
|
1868
|
-
this.hasArchivePermission = true;
|
|
1869
1868
|
this.destroy$ = new Subject.Subject();
|
|
1870
1869
|
this.selectedAssets = [];
|
|
1871
1870
|
}
|
|
@@ -1877,6 +1876,7 @@
|
|
|
1877
1876
|
*/
|
|
1878
1877
|
function () {
|
|
1879
1878
|
var _this = this;
|
|
1879
|
+
console.log('Assest Management Dialog', this.data);
|
|
1880
1880
|
this.initDialogConfig(this.data);
|
|
1881
1881
|
select((/**
|
|
1882
1882
|
* @param {?} state
|
|
@@ -1942,7 +1942,7 @@
|
|
|
1942
1942
|
AssetManagementDialogComponent.decorators = [
|
|
1943
1943
|
{ type: core.Component, args: [{
|
|
1944
1944
|
selector: 'lib-asset-management-dialog',
|
|
1945
|
-
template: "<lib-modal heading=\"Asset management\" [customHeader]=\"true\">\r\n <ng-container subtitle>\r\n <lib-breadcrumb></lib-breadcrumb>\r\n </ng-container>\r\n <ng-container headerActions>\r\n <lib-search-box></lib-search-box>\r\n </ng-container>\r\n <ng-container content>\r\n <lib-asset-wrapper \r\n [header]=\"false\"\r\n [hasModifyPermission]=\"
|
|
1945
|
+
template: "<lib-modal heading=\"Asset management\" [customHeader]=\"true\">\r\n <ng-container subtitle>\r\n <lib-breadcrumb></lib-breadcrumb>\r\n </ng-container>\r\n <ng-container headerActions>\r\n <lib-search-box></lib-search-box>\r\n </ng-container>\r\n <ng-container content>\r\n <lib-asset-wrapper \r\n [header]=\"false\"\r\n [hasModifyPermission]=\"data.permission.modify\"\r\n [hasAccessPermission]=\"data.permission.access\"\r\n [hasArchivePermission]=\"data.permission.archive\"\r\n ></lib-asset-wrapper>\r\n </ng-container>\r\n <ng-container actions>\r\n <div class=\"asset-management-dialog__footer\">\r\n <div class=\"selected-assets\">\r\n <ng-container *ngIf=\"data?.limit\">\r\n <span>Selected{{' '}}</span>\r\n <span class=\"count\" [ngClass]=\"{'error': selectedAssets?.length && disabled}\">\r\n {{selectedAssets?.length}}/{{data?.limit}}\r\n </span>\r\n <span>\r\n {{data?.limit > 1 ? \"assets\": \"asset\"}}\r\n </span>\r\n </ng-container>\r\n\r\n </div>\r\n <div>\r\n <button mat-raised-button mat-dialog-close>Cancel</button>\r\n <button mat-raised-button color=\"primary\" (click)=\"selectAssets()\" [disabled]=\"disabled\">Done</button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</lib-modal>",
|
|
1946
1946
|
styles: [":host::ng-deep .asset-management-dialog__footer{display:flex;width:100%;align-items:center;justify-content:space-between}:host::ng-deep .asset-management-dialog__footer .selected-assets{font-size:14px;color:#979797}:host::ng-deep .asset-management-dialog__footer .selected-assets .count{color:#000}:host::ng-deep .asset-management-dialog__footer .selected-assets .error{color:#f44336}"]
|
|
1947
1947
|
}] }
|
|
1948
1948
|
];
|
|
@@ -1952,20 +1952,9 @@
|
|
|
1952
1952
|
{ type: dialog.MatDialogRef },
|
|
1953
1953
|
{ type: AssetService }
|
|
1954
1954
|
]; };
|
|
1955
|
-
AssetManagementDialogComponent.propDecorators = {
|
|
1956
|
-
hasModifyPermission: [{ type: core.Input }],
|
|
1957
|
-
hasAccessPermission: [{ type: core.Input }],
|
|
1958
|
-
hasArchivePermission: [{ type: core.Input }]
|
|
1959
|
-
};
|
|
1960
1955
|
return AssetManagementDialogComponent;
|
|
1961
1956
|
}());
|
|
1962
1957
|
if (false) {
|
|
1963
|
-
/** @type {?} */
|
|
1964
|
-
AssetManagementDialogComponent.prototype.hasModifyPermission;
|
|
1965
|
-
/** @type {?} */
|
|
1966
|
-
AssetManagementDialogComponent.prototype.hasAccessPermission;
|
|
1967
|
-
/** @type {?} */
|
|
1968
|
-
AssetManagementDialogComponent.prototype.hasArchivePermission;
|
|
1969
1958
|
/**
|
|
1970
1959
|
* @type {?}
|
|
1971
1960
|
* @private
|
|
@@ -2058,7 +2047,12 @@
|
|
|
2058
2047
|
var config = {
|
|
2059
2048
|
limit: this.limit,
|
|
2060
2049
|
allowedType: this.allowedType,
|
|
2061
|
-
maxSize: this.maxSize
|
|
2050
|
+
maxSize: this.maxSize,
|
|
2051
|
+
permission: {
|
|
2052
|
+
access: this.hasAccessPermission,
|
|
2053
|
+
modify: this.hasModifyPermission,
|
|
2054
|
+
archive: this.hasArchivePermission,
|
|
2055
|
+
}
|
|
2062
2056
|
};
|
|
2063
2057
|
/** @type {?} */
|
|
2064
2058
|
var dialogRef = this.dialog.open(AssetManagementDialogComponent, {
|
|
@@ -4728,7 +4722,7 @@
|
|
|
4728
4722
|
AssetItemComponent.decorators = [
|
|
4729
4723
|
{ type: core.Component, args: [{
|
|
4730
4724
|
selector: 'lib-asset-item',
|
|
4731
|
-
template: "<div class=\"asset-wrapper\">\r\n <div class=\"asset-content\">\r\n <div class=\"asset-content__header\" *ngIf=\"asset?.BackgroudProcessingStatus === backgroundProcessingNum.Processed\">\r\n <button class=\"asset-content__header--button\" mat-raised-button (click)=\"onChange()\"
|
|
4725
|
+
template: "<div class=\"asset-wrapper\">\r\n <div class=\"asset-content\">\r\n <div class=\"asset-content__header\" *ngIf=\"asset?.BackgroudProcessingStatus === backgroundProcessingNum.Processed\">\r\n <button class=\"asset-content__header--button\" mat-raised-button (click)=\"onChange()\">\r\n <mat-checkbox\r\n class=\"checkbox\"\r\n [checked]=\"checkSelectedAsset\"\r\n ></mat-checkbox>\r\n </button>\r\n <button\r\n class=\"asset-content__header--button edit-button\"\r\n mat-raised-button\r\n (click)=\"editAsset()\"\r\n >\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n </div>\r\n <div class=\"asset-content__body\">\r\n <ng-container [ngSwitch]=\"asset.FileType\">\r\n <ng-container *ngSwitchCase=\"fileType.IMAGE\">\r\n <img\r\n class=\"image\"\r\n [src]=\"asset.UrlThumbnail\"\r\n [alt]=\"asset.OriginalFileName\"\r\n *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Processed\"\r\n />\r\n <!-- In Processing -->\r\n <div class=\"processing\" *ngIf=\"asset?.BackgroudProcessingStatus === backgroundProcessingNum.InProcessing\">\r\n <mat-icon class=\"icon\">cloud_upload</mat-icon>\r\n <span class=\"processing-txt\">Uploading...</span>\r\n </div>\r\n <!-- Failed -->\r\n <div class=\"processing\" *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Failed\">\r\n <mat-icon class=\"icon-img\">error_outline</mat-icon>\r\n <div class=\"failed-group\">\r\n <span style=\"color: #f44336; font-weight: 300; font-size: 12px;\">Failed to upload the file</span>\r\n </div>\r\n <div class=\"btn-failed-group\">\r\n <button class=\"btn-custom-upload\" (click)=\"onUploadAgain(asset)\">Delete and update again</button>\r\n <span class=\"failed-txt mx-1\">or</span>\r\n <button class=\"btn-custom-failed\" (click)=\"onDelete(asset)\">Delete</button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"fileType.DOCUMENT\">\r\n <img [src]=\"base64PNG[asset.Extension] || base64PNG.default\" [alt]=\"asset.OriginalFileName\" class=\"file\" *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Processed\"/>\r\n <!-- In Processing -->\r\n <div class=\"processing\" *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.InProcessing\">\r\n <mat-icon class=\"icon\">cloud_upload</mat-icon>\r\n <span class=\"processing-txt\">Uploading...</span>\r\n </div>\r\n <!-- Failed -->\r\n <div class=\"processing\" *ngIf=\"asset.BackgroudProcessingStatus === backgroundProcessingNum.Failed\">\r\n <mat-icon class=\"icon-doc\">error_outline</mat-icon>\r\n <div class=\"failed-group\">\r\n <span style=\"color: #f44336; font-weight: 300; font-size: 12px;\">Failed to upload the file</span>\r\n </div>\r\n <div class=\"btn-failed-group\">\r\n <button class=\"btn-custom-upload\" (click)=\"onUploadAgain(asset)\">Delete and update again</button>\r\n <span class=\"failed-txt mx-1\">or</span>\r\n <button class=\"btn-custom-failed\" (click)=\"onDelete(asset)\">Delete</button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <div class=\"asset-content__footer\">\r\n <div\r\n class=\"asset-content__footer--info\"\r\n [ngClass]=\"{\r\n 'file-type__document': asset.FileType === fileType.DOCUMENT\r\n }\"\r\n >\r\n <p\r\n class=\"name\"\r\n [matTooltip]=\"asset.OriginalFileNameWithoutExtension\"\r\n matTooltipClass=\"width-auto\"\r\n >\r\n {{ asset.OriginalFileNameWithoutExtension }}\r\n </p>\r\n <p class=\"info\">\r\n <span class=\"extension\">{{ asset.Extension }}</span>\r\n <span\r\n *ngIf=\"\r\n asset.FileType === fileType.IMAGE && asset?.Extension !== 'svg'\r\n \"\r\n >\r\n - {{ asset.Width }}x{{ asset.Height }}</span\r\n >\r\n <span *ngIf=\"asset.Size\"> - {{ asset.Size }}</span>\r\n </p>\r\n </div>\r\n <div class=\"asset-content__footer--file-type\">\r\n <span>{{ asset.FileType }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n",
|
|
4732
4726
|
styles: [":host::ng-deep .asset-wrapper{padding:5px}:host::ng-deep .asset-wrapper .asset-content{overflow:hidden;position:relative;border-radius:10px;border:1px solid #d8d8d8;font-size:14px;transition:.3s cubic-bezier(.25,.8,.25,1)}:host::ng-deep .asset-wrapper .asset-content:hover{box-shadow:0 0 8px rgba(0,0,0,.17),0 0 0 rgba(0,0,0,.06)}:host::ng-deep .asset-wrapper .asset-content__header{position:absolute;z-index:1;top:0;left:0;width:100%;display:flex;justify-content:space-between;padding:14px}:host::ng-deep .asset-wrapper .asset-content__header--button{width:30px;height:30px;min-width:30px;display:flex;align-items:center;justify-content:center;text-align:center;color:rgba(0,0,0,.65);background:rgba(255,255,255,.6)}:host::ng-deep .asset-wrapper .asset-content__header--button:hover{background:#fff}:host::ng-deep .asset-wrapper .asset-content__header--button.edit-button{transition:.3s cubic-bezier(.25,.8,.25,1);opacity:0}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-icon{font-size:22px}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox{pointer-events:none;display:flex;align-items:center}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox .mat-checkbox-layout{display:block;margin:0}:host::ng-deep .asset-wrapper .asset-content__header--button .mat-checkbox .mat-checkbox-layout .mat-checkbox-frame{color:#767676}:host::ng-deep .asset-wrapper .asset-content__body{padding-bottom:66.66%;background:#f1f1f1;position:relative}:host::ng-deep .asset-wrapper .asset-content__body img{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host::ng-deep .asset-wrapper .asset-content__body img.image{background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEBLAEsAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wAARCAAUABQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD+/ivFPFOf+EjvxzjbBgdv+PeDp+OfxzSt4q18AkageASB9ntu3OM+Vn8c5rsdG0fT9d06DVdUgN1f3XmefP5ksO/ypXhj/dwvHGu2ONF+VF3bQSM0AeYUV7IPCWgjgWRA/wCvi4P85SaKAPGm5Vh7H+VeyeERjQLEDoPP/WeQ/wAzRRQB0tFFFAH/2Q==)}:host::ng-deep .asset-wrapper .asset-content__body img.file{width:75%;height:75%}:host::ng-deep .asset-wrapper .asset-content__body .processing{background-color:#f1f1f1;width:100%;height:100%}:host::ng-deep .asset-wrapper .asset-content__body .processing .icon{position:absolute;top:30%;left:42%;font-size:35px}:host::ng-deep .asset-wrapper .asset-content__body .processing .icon-img{position:absolute;top:30%;left:42%;font-size:35px;color:#f44336}:host::ng-deep .asset-wrapper .asset-content__body .processing .icon-doc{position:absolute;top:30%;left:42%;font-size:35px;color:#f44336}:host::ng-deep .asset-wrapper .asset-content__body .processing .processing-txt{position:absolute;top:55%;left:35%}:host::ng-deep .asset-wrapper .asset-content__body .processing .failed-image{width:27px;height:27px;-o-object-fit:contain;object-fit:contain}:host::ng-deep .asset-wrapper .asset-content__body .processing .failed-group{position:absolute;top:55%;left:20%}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group{position:absolute;top:70%;left:10%;font-size:12px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .failed-txt{color:#f44336}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-custom-upload{font-size:9px;border:0;color:#fff;background-color:#ffc107;border-radius:3px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-custom-failed{font-size:9px;border:0;color:#fff;background-color:#f44336;border-radius:3px}:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-custom-failed:hover,:host::ng-deep .asset-wrapper .asset-content__body .processing .btn-failed-group .btn-custom-upload:hover{opacity:.8}:host::ng-deep .asset-wrapper .asset-content__footer{display:flex;align-items:center;justify-content:space-between;padding:5px 8px}:host::ng-deep .asset-wrapper .asset-content__footer--info{max-width:calc(100% - 50px)}:host::ng-deep .asset-wrapper .asset-content__footer--info p{margin:0;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host::ng-deep .asset-wrapper .asset-content__footer--info .info{font-size:12px;color:#979797}:host::ng-deep .asset-wrapper .asset-content__footer--info .info .extension{text-transform:uppercase}:host::ng-deep .asset-wrapper .asset-content__footer--info.file-type__document{max-width:calc(100% - 70px)}:host::ng-deep .asset-wrapper .asset-content__footer--file-type{border-radius:5px;background-color:#d8d8d8;padding:2px 6px;font-size:12px}:host::ng-deep .asset-wrapper .asset-content:hover .edit-button{opacity:1!important}"]
|
|
4733
4727
|
}] }
|
|
4734
4728
|
];
|