@bizy/core 19.13.5 → 19.13.7
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/fesm2022/bizy-core.mjs
CHANGED
|
@@ -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');
|
|
@@ -186,6 +190,7 @@ class BizyAudioPlayerComponent {
|
|
|
186
190
|
this.#audioRef = this.#document.getElementById(this.id);
|
|
187
191
|
if (this.#audioRef) {
|
|
188
192
|
this.#audioRef.load();
|
|
193
|
+
this._trackPlayerRate();
|
|
189
194
|
if (this.autoplay) {
|
|
190
195
|
this.#audioRef.play();
|
|
191
196
|
}
|
|
@@ -195,6 +200,7 @@ class BizyAudioPlayerComponent {
|
|
|
195
200
|
this.#audioRef = this.#document.getElementById(this.id);
|
|
196
201
|
if (this.#audioRef) {
|
|
197
202
|
this.#audioRef.load();
|
|
203
|
+
this._trackPlayerRate();
|
|
198
204
|
if (this.autoplay) {
|
|
199
205
|
this.#audioRef.play();
|
|
200
206
|
}
|
|
@@ -204,16 +210,20 @@ class BizyAudioPlayerComponent {
|
|
|
204
210
|
}
|
|
205
211
|
}
|
|
206
212
|
_audioURL = null;
|
|
213
|
+
_ready = false;
|
|
207
214
|
#audioRef;
|
|
208
215
|
_playbackRate = 1;
|
|
209
216
|
#trackPlaybackRate$ = new Subject();
|
|
210
217
|
#subscription = new Subscription();
|
|
211
|
-
|
|
218
|
+
_trackPlayerRate() {
|
|
212
219
|
this.#subscription.add(this.#trackPlaybackRate$.pipe(debounceTime(500), distinctUntilChanged()).subscribe(value => {
|
|
213
220
|
this.onTrackPlayerRate.emit(value);
|
|
214
221
|
}));
|
|
215
222
|
}
|
|
216
223
|
_onTrackPlayerRate() {
|
|
224
|
+
if (!this.disabled) {
|
|
225
|
+
return;
|
|
226
|
+
}
|
|
217
227
|
if (!this.#audioRef) {
|
|
218
228
|
this.#audioRef = this.#document.getElementById(this.id);
|
|
219
229
|
}
|
|
@@ -232,14 +242,19 @@ class BizyAudioPlayerComponent {
|
|
|
232
242
|
case 2:
|
|
233
243
|
this.#audioRef.playbackRate = 1;
|
|
234
244
|
this._playbackRate = 1;
|
|
245
|
+
this.#trackPlaybackRate$.next('1');
|
|
235
246
|
break;
|
|
236
247
|
default:
|
|
237
248
|
this.#audioRef.playbackRate = 1;
|
|
238
249
|
this._playbackRate = 1;
|
|
250
|
+
this.#trackPlaybackRate$.next('1');
|
|
239
251
|
}
|
|
240
252
|
}
|
|
241
253
|
}
|
|
242
254
|
_onDownload() {
|
|
255
|
+
if (this.disabled || !this.showDownload) {
|
|
256
|
+
return;
|
|
257
|
+
}
|
|
243
258
|
const downloadButton = this.#renderer.createElement('a');
|
|
244
259
|
this.#renderer.setAttribute(downloadButton, 'download', this.downloadFileName);
|
|
245
260
|
this.#renderer.setProperty(downloadButton, 'href', this.downloadURL);
|
|
@@ -252,25 +267,31 @@ class BizyAudioPlayerComponent {
|
|
|
252
267
|
this.#subscription.unsubscribe();
|
|
253
268
|
}
|
|
254
269
|
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: "<
|
|
270
|
+
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
271
|
}
|
|
257
272
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BizyAudioPlayerComponent, decorators: [{
|
|
258
273
|
type: Component,
|
|
259
|
-
args: [{ selector: 'bizy-audio-player', imports: [CommonModule, BizyButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<
|
|
274
|
+
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
275
|
}], propDecorators: { id: [{
|
|
261
276
|
type: Input
|
|
262
277
|
}], mimeType: [{
|
|
263
278
|
type: Input
|
|
279
|
+
}], audioPlayerError: [{
|
|
280
|
+
type: Input
|
|
264
281
|
}], showDownload: [{
|
|
265
282
|
type: Input
|
|
266
283
|
}], autoplay: [{
|
|
267
284
|
type: Input
|
|
285
|
+
}], disabled: [{
|
|
286
|
+
type: Input
|
|
268
287
|
}], downloadURL: [{
|
|
269
288
|
type: Input
|
|
270
289
|
}], downloadFileName: [{
|
|
271
290
|
type: Input
|
|
272
291
|
}], onDownload: [{
|
|
273
292
|
type: Output
|
|
293
|
+
}], canPlayThrough: [{
|
|
294
|
+
type: Output
|
|
274
295
|
}], onTrackPlayerRate: [{
|
|
275
296
|
type: Output
|
|
276
297
|
}], audioURL: [{
|