@devopmaat/badaboom 1.3.2 → 1.3.3

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.
@@ -1625,7 +1625,7 @@ class BdbMediaDisplayComponent {
1625
1625
  }
1626
1626
  switch (media.type) {
1627
1627
  case MediaType.File:
1628
- if (this.getFileExtension(media.fileName) === 'pdf') {
1628
+ if (media.fileName && this.getFileExtension(media.fileName) === 'pdf') {
1629
1629
  if (download) {
1630
1630
  return `${this.bdbOptions.mediaUrl}/${media.fileName}`;
1631
1631
  }
@@ -1665,11 +1665,11 @@ class BdbMediaDisplayComponent {
1665
1665
  return parts.pop()?.toLocaleLowerCase();
1666
1666
  }
1667
1667
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: BdbMediaDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1668
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: BdbMediaDisplayComponent, isStandalone: true, selector: "bdb-media-display", inputs: { media: "media", mode: "mode", width: "width", height: "height", alt: "alt" }, usesOnChanges: true, ngImport: i0, template: "@if (media && !hasError) {\r\n @switch (media.type) {\r\n @case (mediaType.File) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? filePreview : fileLive\"></ng-container>\r\n }\r\n @case (mediaType.Video) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? videoPreview : videoPlayer\"></ng-container>\r\n }\r\n @default {\r\n <img [src]=\"src\" (error)=\"errorHandler()\" [alt]=\"alt\" />\r\n }\r\n }\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"noMedia\"></ng-container>\r\n}\r\n\r\n<ng-template #noMedia>\r\n <img [src]=\"noMediaUrl\" style=\"opacity: 0.3\" />\r\n</ng-template>\r\n\r\n<ng-template #fileNameDisplay>\r\n <div bdbFlex=\"col 8px center center\" style=\"width: 100%; height: 100%\">\r\n <div>Geen preview beschikbaar</div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPreview>\r\n <div bdbFlex=\"col 0px center center\">\r\n <mat-icon>play_circle_outline</mat-icon>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPlayer>\r\n <bdb-youtube-player [videoId]=\"media?.reference\"></bdb-youtube-player>\r\n</ng-template>\r\n\r\n<ng-template #filePreview>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #fileLive>\r\n <div class=\"file-live\" bdbFlex=\"col 0px start center\" style=\"width: 100%; height: 100%\">\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n\r\n <a class=\"file-overlay\" bdbFlex=\"col 0px center center\" [href]=\"getSource(media, true)\" target=\"_blank\" download>\r\n <div class=\"icon-backdrop bg-primary mat-elevation-z5\" bdbFlex=\"col 0px center center\">\r\n <mat-icon class=\"i64\">save_alt</mat-icon>\r\n </div>\r\n </a>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}img{object-fit:contain}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BdbYoutubePlayerComponent, selector: "bdb-youtube-player", inputs: ["videoId"] }] }); }
1668
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: BdbMediaDisplayComponent, isStandalone: true, selector: "bdb-media-display", inputs: { media: "media", mode: "mode", width: "width", height: "height", alt: "alt" }, usesOnChanges: true, ngImport: i0, template: "@if (media && !hasError) {\r\n @switch (media.type) {\r\n @case (mediaType.File) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? filePreview : fileLive\"></ng-container>\r\n }\r\n @case (mediaType.Video) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? videoPreview : videoPlayer\"></ng-container>\r\n }\r\n @default {\r\n <img [src]=\"src\" (error)=\"errorHandler()\" [alt]=\"alt\" />\r\n }\r\n }\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"noMedia\"></ng-container>\r\n}\r\n\r\n<ng-template #fileNameDisplay>\r\n <div bdbFlex=\"col 8px center center\" style=\"width: 100%; height: 100%\">\r\n <div>Geen preview beschikbaar</div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPreview>\r\n <div bdbFlex=\"col 0px center center\">\r\n <mat-icon>play_circle_outline</mat-icon>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPlayer>\r\n <bdb-youtube-player [videoId]=\"media?.reference\"></bdb-youtube-player>\r\n</ng-template>\r\n\r\n<ng-template #filePreview>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #fileLive>\r\n <div class=\"file-live\" bdbFlex=\"col 0px start center\" style=\"width: 100%; height: 100%\">\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n\r\n <a class=\"file-overlay\" bdbFlex=\"col 0px center center\" [href]=\"getSource(media, true)\" target=\"_blank\" download>\r\n <div class=\"icon-backdrop bg-primary mat-elevation-z5\" bdbFlex=\"col 0px center center\">\r\n <mat-icon class=\"i64\">save_alt</mat-icon>\r\n </div>\r\n </a>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #noMedia>\r\n <svg version=\"1.1\" viewBox=\"0 0 180 180\" xmlns:svg=\"http://www.w3.org/2000/svg\">\r\n <g transform=\"translate(-2,-6)\">\r\n <rect style=\"fill: #9f9f9f\" width=\"90\" height=\"90\" x=\"-18\" y=\"85\" ry=\"8.4\" transform=\"rotate(-16.3)\" />\r\n <g transform=\"rotate(16.3,229,-1658.3)\">\r\n <rect\r\n ry=\"4.6\"\r\n y=\"1.6\"\r\n x=\"547\"\r\n height=\"110\"\r\n width=\"110\"\r\n style=\"fill: #a2a2a2; stroke: #ffffff; stroke-width: 5.4\" />\r\n <g\r\n style=\"stroke: #ffffff; stroke-width: 13; stroke-miterlimit: 4\"\r\n transform=\"matrix(0.17265471,0,0,0.17265471,512.49324,-6.3296456)\">\r\n <rect style=\"fill: #cccccc\" width=\"491\" height=\"449\" x=\"270\" y=\"107\" />\r\n <rect style=\"fill: #ffffff\" id=\"rect3342\" width=\"491\" height=\"209\" x=\"270\" y=\"107\" />\r\n <path\r\n style=\"fill: #cccccc\"\r\n d=\"m 300,317.36255 38.46147,-53.53818 60.53097,-45.16084 15.88277,18.57394 13.61285,-38.68356 8.20133,-2.98188 13.3106,-28.2093 180,179.99979\" />\r\n <path\r\n style=\"fill: #b3b3b3; stroke: #ffffff; paint-order: stroke\"\r\n d=\"m 180,60 c 4.09311,16.474688 7.71219,33.067277 10.85156,49.75 2.38256,12.66097 4.48857,25.37408 6.31641,38.12695 l -22.06445,-7.16015 -46.11133,-29.41602 5.32422,46.42578 -1.61524,24.78711 10.05274,30.37695 73.18554,-11.75585 L 300,180 252.19922,102.56641 242.5,117.5 215.375,95.375 Z\"\r\n transform=\"translate(270,107.36227)\" />\r\n <path\r\n d=\"m 419.99999,347.36252 81.89918,-74.42959 18.50574,-9.68009 23.6512,-44.18894 25.94388,-21.70121 179.99999,179.99979\"\r\n style=\"fill: #cccccc; stroke: #ffffff; stroke-width: 13.0708; paint-order: stroke\" />\r\n <path\r\n style=\"fill: #b3b3b3; stroke: #ffffff; stroke-width: 13.0708; paint-order: stroke\"\r\n d=\"m 569.99999,197.36269 35.9388,80.91289 v 30.11038 30.11038 l 22.45864,19.46652 c 6.52453,-6.45031 14.14893,-11.78526 22.44431,-15.70477 14.8245,-7.00447 31.33823,-9.35959 47.17057,-13.6217 6.42776,-1.73037 12.90672,-3.85419 18.21343,-7.87277 1.35174,-1.02362 2.61592,-2.16281 3.77424,-3.40107 h -30 l -40.52149,-40.55006 -29.85645,-48.91972 -10.25307,8.83886 z\" />\r\n <path\r\n style=\"fill: #ffffff\"\r\n d=\"m 419.99999,557.36227 c -0.41699,-9.60089 -8.81759,-17.60878 17.1252,-30.66806 31.8318,-16.02389 125.895,-35.88836 152.1537,-59.98434 19.42709,-17.82687 -70.4154,-37.66945 -55.0191,-59.07323 6.981,-9.70528 59.037,-19.96947 82.1463,-30.27386 21.90569,-9.76799 15.14129,-19.80328 31.4046,-29.97507 15.7092,-9.82558 68.3499,-19.77358 72.18929,-30.02516 -10.41359,10.52188 -68.83379,20.40327 -89.99999,30.00026 -22.3377,10.128 -21.4689,19.93018 -49.4313,29.48367 -30.1245,10.29239 -89.142,20.55268 -102.7077,30.51626 -28.4133,20.86858 46.863,42.59995 16.2024,59.99993 C 452.54309,490.92554 344.7219,510.65712 300,527.3626 c -30.9039,11.54369 -28.4079,17.74799 -30,29.99967\" />\r\n </g>\r\n </g>\r\n </g>\r\n </svg>\r\n</ng-template>\r\n", styles: [":host{display:contents}img{object-fit:contain;max-width:100%;max-height:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BdbYoutubePlayerComponent, selector: "bdb-youtube-player", inputs: ["videoId"] }] }); }
1669
1669
  }
1670
1670
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: BdbMediaDisplayComponent, decorators: [{
1671
1671
  type: Component,
1672
- args: [{ selector: 'bdb-media-display', imports: [MatIconModule, NgTemplateOutlet, BdbYoutubePlayerComponent], template: "@if (media && !hasError) {\r\n @switch (media.type) {\r\n @case (mediaType.File) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? filePreview : fileLive\"></ng-container>\r\n }\r\n @case (mediaType.Video) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? videoPreview : videoPlayer\"></ng-container>\r\n }\r\n @default {\r\n <img [src]=\"src\" (error)=\"errorHandler()\" [alt]=\"alt\" />\r\n }\r\n }\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"noMedia\"></ng-container>\r\n}\r\n\r\n<ng-template #noMedia>\r\n <img [src]=\"noMediaUrl\" style=\"opacity: 0.3\" />\r\n</ng-template>\r\n\r\n<ng-template #fileNameDisplay>\r\n <div bdbFlex=\"col 8px center center\" style=\"width: 100%; height: 100%\">\r\n <div>Geen preview beschikbaar</div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPreview>\r\n <div bdbFlex=\"col 0px center center\">\r\n <mat-icon>play_circle_outline</mat-icon>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPlayer>\r\n <bdb-youtube-player [videoId]=\"media?.reference\"></bdb-youtube-player>\r\n</ng-template>\r\n\r\n<ng-template #filePreview>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #fileLive>\r\n <div class=\"file-live\" bdbFlex=\"col 0px start center\" style=\"width: 100%; height: 100%\">\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n\r\n <a class=\"file-overlay\" bdbFlex=\"col 0px center center\" [href]=\"getSource(media, true)\" target=\"_blank\" download>\r\n <div class=\"icon-backdrop bg-primary mat-elevation-z5\" bdbFlex=\"col 0px center center\">\r\n <mat-icon class=\"i64\">save_alt</mat-icon>\r\n </div>\r\n </a>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}img{object-fit:contain}\n"] }]
1672
+ args: [{ selector: 'bdb-media-display', imports: [MatIconModule, NgTemplateOutlet, BdbYoutubePlayerComponent], template: "@if (media && !hasError) {\r\n @switch (media.type) {\r\n @case (mediaType.File) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? filePreview : fileLive\"></ng-container>\r\n }\r\n @case (mediaType.Video) {\r\n <ng-container *ngTemplateOutlet=\"mode === 'preview' ? videoPreview : videoPlayer\"></ng-container>\r\n }\r\n @default {\r\n <img [src]=\"src\" (error)=\"errorHandler()\" [alt]=\"alt\" />\r\n }\r\n }\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"noMedia\"></ng-container>\r\n}\r\n\r\n<ng-template #fileNameDisplay>\r\n <div bdbFlex=\"col 8px center center\" style=\"width: 100%; height: 100%\">\r\n <div>Geen preview beschikbaar</div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPreview>\r\n <div bdbFlex=\"col 0px center center\">\r\n <mat-icon>play_circle_outline</mat-icon>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #videoPlayer>\r\n <bdb-youtube-player [videoId]=\"media?.reference\"></bdb-youtube-player>\r\n</ng-template>\r\n\r\n<ng-template #filePreview>\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #fileLive>\r\n <div class=\"file-live\" bdbFlex=\"col 0px start center\" style=\"width: 100%; height: 100%\">\r\n @if (src) {\r\n <img [src]=\"src\" [alt]=\"alt\" />\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"fileNameDisplay\"></ng-container>\r\n }\r\n\r\n <a class=\"file-overlay\" bdbFlex=\"col 0px center center\" [href]=\"getSource(media, true)\" target=\"_blank\" download>\r\n <div class=\"icon-backdrop bg-primary mat-elevation-z5\" bdbFlex=\"col 0px center center\">\r\n <mat-icon class=\"i64\">save_alt</mat-icon>\r\n </div>\r\n </a>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #noMedia>\r\n <svg version=\"1.1\" viewBox=\"0 0 180 180\" xmlns:svg=\"http://www.w3.org/2000/svg\">\r\n <g transform=\"translate(-2,-6)\">\r\n <rect style=\"fill: #9f9f9f\" width=\"90\" height=\"90\" x=\"-18\" y=\"85\" ry=\"8.4\" transform=\"rotate(-16.3)\" />\r\n <g transform=\"rotate(16.3,229,-1658.3)\">\r\n <rect\r\n ry=\"4.6\"\r\n y=\"1.6\"\r\n x=\"547\"\r\n height=\"110\"\r\n width=\"110\"\r\n style=\"fill: #a2a2a2; stroke: #ffffff; stroke-width: 5.4\" />\r\n <g\r\n style=\"stroke: #ffffff; stroke-width: 13; stroke-miterlimit: 4\"\r\n transform=\"matrix(0.17265471,0,0,0.17265471,512.49324,-6.3296456)\">\r\n <rect style=\"fill: #cccccc\" width=\"491\" height=\"449\" x=\"270\" y=\"107\" />\r\n <rect style=\"fill: #ffffff\" id=\"rect3342\" width=\"491\" height=\"209\" x=\"270\" y=\"107\" />\r\n <path\r\n style=\"fill: #cccccc\"\r\n d=\"m 300,317.36255 38.46147,-53.53818 60.53097,-45.16084 15.88277,18.57394 13.61285,-38.68356 8.20133,-2.98188 13.3106,-28.2093 180,179.99979\" />\r\n <path\r\n style=\"fill: #b3b3b3; stroke: #ffffff; paint-order: stroke\"\r\n d=\"m 180,60 c 4.09311,16.474688 7.71219,33.067277 10.85156,49.75 2.38256,12.66097 4.48857,25.37408 6.31641,38.12695 l -22.06445,-7.16015 -46.11133,-29.41602 5.32422,46.42578 -1.61524,24.78711 10.05274,30.37695 73.18554,-11.75585 L 300,180 252.19922,102.56641 242.5,117.5 215.375,95.375 Z\"\r\n transform=\"translate(270,107.36227)\" />\r\n <path\r\n d=\"m 419.99999,347.36252 81.89918,-74.42959 18.50574,-9.68009 23.6512,-44.18894 25.94388,-21.70121 179.99999,179.99979\"\r\n style=\"fill: #cccccc; stroke: #ffffff; stroke-width: 13.0708; paint-order: stroke\" />\r\n <path\r\n style=\"fill: #b3b3b3; stroke: #ffffff; stroke-width: 13.0708; paint-order: stroke\"\r\n d=\"m 569.99999,197.36269 35.9388,80.91289 v 30.11038 30.11038 l 22.45864,19.46652 c 6.52453,-6.45031 14.14893,-11.78526 22.44431,-15.70477 14.8245,-7.00447 31.33823,-9.35959 47.17057,-13.6217 6.42776,-1.73037 12.90672,-3.85419 18.21343,-7.87277 1.35174,-1.02362 2.61592,-2.16281 3.77424,-3.40107 h -30 l -40.52149,-40.55006 -29.85645,-48.91972 -10.25307,8.83886 z\" />\r\n <path\r\n style=\"fill: #ffffff\"\r\n d=\"m 419.99999,557.36227 c -0.41699,-9.60089 -8.81759,-17.60878 17.1252,-30.66806 31.8318,-16.02389 125.895,-35.88836 152.1537,-59.98434 19.42709,-17.82687 -70.4154,-37.66945 -55.0191,-59.07323 6.981,-9.70528 59.037,-19.96947 82.1463,-30.27386 21.90569,-9.76799 15.14129,-19.80328 31.4046,-29.97507 15.7092,-9.82558 68.3499,-19.77358 72.18929,-30.02516 -10.41359,10.52188 -68.83379,20.40327 -89.99999,30.00026 -22.3377,10.128 -21.4689,19.93018 -49.4313,29.48367 -30.1245,10.29239 -89.142,20.55268 -102.7077,30.51626 -28.4133,20.86858 46.863,42.59995 16.2024,59.99993 C 452.54309,490.92554 344.7219,510.65712 300,527.3626 c -30.9039,11.54369 -28.4079,17.74799 -30,29.99967\" />\r\n </g>\r\n </g>\r\n </g>\r\n </svg>\r\n</ng-template>\r\n", styles: [":host{display:contents}img{object-fit:contain;max-width:100%;max-height:100%}\n"] }]
1673
1673
  }], propDecorators: { media: [{
1674
1674
  type: Input
1675
1675
  }], mode: [{