@bizy/core 19.13.5 → 19.13.6

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.
@@ -157,16 +157,20 @@ class BizyAudioPlayerComponent {
157
157
  #renderer = inject(Renderer2);
158
158
  id = `bizy-audio-player-${Math.random()}`;
159
159
  mimeType;
160
+ audioPlayerError = 'Error';
160
161
  showDownload = true;
161
162
  autoplay = false;
163
+ disabled = false;
162
164
  downloadURL;
163
165
  downloadFileName = 'bizy_audio';
164
166
  onDownload = new EventEmitter();
167
+ canPlayThrough = new EventEmitter();
165
168
  onTrackPlayerRate = new EventEmitter();
166
169
  set audioURL(audioURL) {
167
170
  if (!audioURL) {
168
171
  return;
169
172
  }
173
+ this._ready = false;
170
174
  this._audioURL = audioURL;
171
175
  if (!this.mimeType) {
172
176
  const isOGG = this._audioURL.toLowerCase().includes('ogg');
@@ -204,6 +208,7 @@ class BizyAudioPlayerComponent {
204
208
  }
205
209
  }
206
210
  _audioURL = null;
211
+ _ready = false;
207
212
  #audioRef;
208
213
  _playbackRate = 1;
209
214
  #trackPlaybackRate$ = new Subject();
@@ -214,6 +219,9 @@ class BizyAudioPlayerComponent {
214
219
  }));
215
220
  }
216
221
  _onTrackPlayerRate() {
222
+ if (!this.disabled) {
223
+ return;
224
+ }
217
225
  if (!this.#audioRef) {
218
226
  this.#audioRef = this.#document.getElementById(this.id);
219
227
  }
@@ -240,6 +248,9 @@ class BizyAudioPlayerComponent {
240
248
  }
241
249
  }
242
250
  _onDownload() {
251
+ if (!this.disabled) {
252
+ return;
253
+ }
243
254
  const downloadButton = this.#renderer.createElement('a');
244
255
  this.#renderer.setAttribute(downloadButton, 'download', this.downloadFileName);
245
256
  this.#renderer.setProperty(downloadButton, 'href', this.downloadURL);
@@ -252,25 +263,31 @@ class BizyAudioPlayerComponent {
252
263
  this.#subscription.unsubscribe();
253
264
  }
254
265
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAudioPlayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
255
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyAudioPlayerComponent, isStandalone: true, selector: "bizy-audio-player", inputs: { id: "id", mimeType: "mimeType", showDownload: "showDownload", autoplay: "autoplay", downloadURL: "downloadURL", downloadFileName: "downloadFileName", audioURL: "audioURL" }, outputs: { onDownload: "onDownload", onTrackPlayerRate: "onTrackPlayerRate" }, ngImport: i0, template: "<div class=\"bizy-audio-player-component\">\n\n <span class=\"bizy-audio-player__audio-controls\">\n\n <audio\n *ngIf=\"_audioURL\"\n class=\"bizy-audio-player__audio-controls__audio\"\n [id]=\"id\"\n [autoplay]=\"autoplay\"\n controls\n controlslist=\"nodownload noplaybackrate\">\n <source [src]=\"_audioURL\" [type]=\"mimeType\">\n {{audioPlayerError}}\n </audio>\n\n <bizy-button customClass=\"bizy-audio-player__audio-controls__playback-rate\" (onSelect)=\"_onTrackPlayerRate()\">\n <span>{{_playbackRate}}x</span>\n </bizy-button>\n\n <bizy-button customClass=\"bizy-audio-player__download-button\" *ngIf=\"showDownload\" (onSelect)=\"_onDownload()\">\n <svg \n class=\"bizy-audio-player__download-button__icon\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><polyline points=\"7 10 12 15 17 10\"/><line x1=\"12\" x2=\"12\" y1=\"15\" y2=\"3\"/>\n </svg>\n </bizy-button>\n\n </span>\n\n</div>", styles: [":host{font-size:1rem;width:100%}.bizy-audio-player-component{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;row-gap:2rem}.bizy-audio-player__audio-controls{width:100%;min-width:25rem;display:flex;align-items:center;column-gap:1rem}.bizy-audio-player__audio-controls__audio{flex:1;width:100%}::ng-deep .bizy-audio-player__audio-controls__playback-rate{font-size:1rem;--bizy-button-background-color: var(--bizy-audio-player-playback-rate-background-color);--bizy-button-color: var(--bizy-audio-player-playback-rate-color);font-weight:700;border-radius:50%!important;width:4rem;height:2rem;display:grid;place-items:center;cursor:pointer}::ng-deep .bizy-audio-player__download-button{--bizy-button-background-color: var(--bizy-audio-player-download-button-background-color);--bizy-button-color: var(--bizy-audio-player-download-button-color)}.bizy-audio-player__download-button__icon{height:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BizyButtonModule }, { kind: "component", type: BizyButtonComponent, selector: "bizy-button", inputs: ["id", "disabled", "type", "customClass"], outputs: ["onSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
266
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: BizyAudioPlayerComponent, isStandalone: true, selector: "bizy-audio-player", inputs: { id: "id", mimeType: "mimeType", audioPlayerError: "audioPlayerError", showDownload: "showDownload", autoplay: "autoplay", disabled: "disabled", downloadURL: "downloadURL", downloadFileName: "downloadFileName", audioURL: "audioURL" }, outputs: { onDownload: "onDownload", canPlayThrough: "canPlayThrough", onTrackPlayerRate: "onTrackPlayerRate" }, ngImport: i0, template: "<audio\n class=\"bizy-audio-player__audio\"\n [ngClass]=\"{'bizy-audio-player__audio--disabled': disabled || !_audioURL || !_ready}\"\n [id]=\"id\"\n [autoplay]=\"autoplay\"\n controls\n (canplaythrough)=\"_ready = true; canPlayThrough.emit($event)\"\n controlslist=\"nodownload noplaybackrate\">\n <source [src]=\"_audioURL\" [type]=\"mimeType\">\n {{audioPlayerError}}\n</audio>\n\n<bizy-button customClass=\"bizy-audio-player__playback-rate\" (onSelect)=\"_onTrackPlayerRate()\" [disabled]=\"disabled || !_audioURL || !_ready\">\n <span>{{_playbackRate}}x</span>\n</bizy-button>\n\n<bizy-button customClass=\"bizy-audio-player__download-button\" *ngIf=\"showDownload\" (onSelect)=\"_onDownload()\" [disabled]=\"disabled || !_audioURL || !_ready\">\n <svg \n class=\"bizy-audio-player__download-button__icon\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><polyline points=\"7 10 12 15 17 10\"/><line x1=\"12\" x2=\"12\" y1=\"15\" y2=\"3\"/>\n </svg>\n</bizy-button>\n", styles: [":host{font-size:1rem;width:100%;display:flex;align-items:center;column-gap:1rem}.bizy-audio-player__audio--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-audio-player__audio{flex:1;width:100%}::ng-deep .bizy-audio-player__playback-rate{font-size:1rem;--bizy-button-background-color: var(--bizy-audio-player-playback-rate-background-color);--bizy-button-color: var(--bizy-audio-player-playback-rate-color);font-weight:700;border-radius:50%!important;width:4rem;height:2rem;display:grid;place-items:center;cursor:pointer}::ng-deep .bizy-audio-player__download-button{--bizy-button-background-color: var(--bizy-audio-player-download-button-background-color);--bizy-button-color: var(--bizy-audio-player-download-button-color)}.bizy-audio-player__download-button__icon{height:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BizyButtonModule }, { kind: "component", type: BizyButtonComponent, selector: "bizy-button", inputs: ["id", "disabled", "type", "customClass"], outputs: ["onSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
256
267
  }
257
268
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAudioPlayerComponent, decorators: [{
258
269
  type: Component,
259
- args: [{ selector: 'bizy-audio-player', imports: [CommonModule, BizyButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bizy-audio-player-component\">\n\n <span class=\"bizy-audio-player__audio-controls\">\n\n <audio\n *ngIf=\"_audioURL\"\n class=\"bizy-audio-player__audio-controls__audio\"\n [id]=\"id\"\n [autoplay]=\"autoplay\"\n controls\n controlslist=\"nodownload noplaybackrate\">\n <source [src]=\"_audioURL\" [type]=\"mimeType\">\n {{audioPlayerError}}\n </audio>\n\n <bizy-button customClass=\"bizy-audio-player__audio-controls__playback-rate\" (onSelect)=\"_onTrackPlayerRate()\">\n <span>{{_playbackRate}}x</span>\n </bizy-button>\n\n <bizy-button customClass=\"bizy-audio-player__download-button\" *ngIf=\"showDownload\" (onSelect)=\"_onDownload()\">\n <svg \n class=\"bizy-audio-player__download-button__icon\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><polyline points=\"7 10 12 15 17 10\"/><line x1=\"12\" x2=\"12\" y1=\"15\" y2=\"3\"/>\n </svg>\n </bizy-button>\n\n </span>\n\n</div>", styles: [":host{font-size:1rem;width:100%}.bizy-audio-player-component{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;row-gap:2rem}.bizy-audio-player__audio-controls{width:100%;min-width:25rem;display:flex;align-items:center;column-gap:1rem}.bizy-audio-player__audio-controls__audio{flex:1;width:100%}::ng-deep .bizy-audio-player__audio-controls__playback-rate{font-size:1rem;--bizy-button-background-color: var(--bizy-audio-player-playback-rate-background-color);--bizy-button-color: var(--bizy-audio-player-playback-rate-color);font-weight:700;border-radius:50%!important;width:4rem;height:2rem;display:grid;place-items:center;cursor:pointer}::ng-deep .bizy-audio-player__download-button{--bizy-button-background-color: var(--bizy-audio-player-download-button-background-color);--bizy-button-color: var(--bizy-audio-player-download-button-color)}.bizy-audio-player__download-button__icon{height:1rem}\n"] }]
270
+ args: [{ selector: 'bizy-audio-player', imports: [CommonModule, BizyButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<audio\n class=\"bizy-audio-player__audio\"\n [ngClass]=\"{'bizy-audio-player__audio--disabled': disabled || !_audioURL || !_ready}\"\n [id]=\"id\"\n [autoplay]=\"autoplay\"\n controls\n (canplaythrough)=\"_ready = true; canPlayThrough.emit($event)\"\n controlslist=\"nodownload noplaybackrate\">\n <source [src]=\"_audioURL\" [type]=\"mimeType\">\n {{audioPlayerError}}\n</audio>\n\n<bizy-button customClass=\"bizy-audio-player__playback-rate\" (onSelect)=\"_onTrackPlayerRate()\" [disabled]=\"disabled || !_audioURL || !_ready\">\n <span>{{_playbackRate}}x</span>\n</bizy-button>\n\n<bizy-button customClass=\"bizy-audio-player__download-button\" *ngIf=\"showDownload\" (onSelect)=\"_onDownload()\" [disabled]=\"disabled || !_audioURL || !_ready\">\n <svg \n class=\"bizy-audio-player__download-button__icon\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><polyline points=\"7 10 12 15 17 10\"/><line x1=\"12\" x2=\"12\" y1=\"15\" y2=\"3\"/>\n </svg>\n</bizy-button>\n", styles: [":host{font-size:1rem;width:100%;display:flex;align-items:center;column-gap:1rem}.bizy-audio-player__audio--disabled{opacity:.5;pointer-events:none;cursor:not-allowed!important}.bizy-audio-player__audio{flex:1;width:100%}::ng-deep .bizy-audio-player__playback-rate{font-size:1rem;--bizy-button-background-color: var(--bizy-audio-player-playback-rate-background-color);--bizy-button-color: var(--bizy-audio-player-playback-rate-color);font-weight:700;border-radius:50%!important;width:4rem;height:2rem;display:grid;place-items:center;cursor:pointer}::ng-deep .bizy-audio-player__download-button{--bizy-button-background-color: var(--bizy-audio-player-download-button-background-color);--bizy-button-color: var(--bizy-audio-player-download-button-color)}.bizy-audio-player__download-button__icon{height:1rem}\n"] }]
260
271
  }], propDecorators: { id: [{
261
272
  type: Input
262
273
  }], mimeType: [{
263
274
  type: Input
275
+ }], audioPlayerError: [{
276
+ type: Input
264
277
  }], showDownload: [{
265
278
  type: Input
266
279
  }], autoplay: [{
267
280
  type: Input
281
+ }], disabled: [{
282
+ type: Input
268
283
  }], downloadURL: [{
269
284
  type: Input
270
285
  }], downloadFileName: [{
271
286
  type: Input
272
287
  }], onDownload: [{
273
288
  type: Output
289
+ }], canPlayThrough: [{
290
+ type: Output
274
291
  }], onTrackPlayerRate: [{
275
292
  type: Output
276
293
  }], audioURL: [{