From b71503416e531086cfad2d723354a5a116587db8 Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Tue, 16 Jan 2024 10:06:28 -0700 Subject: [PATCH 1/9] Feat: exports for Base Plugin --- rollup.config.js | 4 ++-- src/wavesurfer.ts | 3 +++ 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/rollup.config.js b/rollup.config.js index 83822a2dc..7ef2c8351 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -21,7 +21,7 @@ export default [ output: { file: 'dist/wavesurfer.cjs', format: 'cjs', - exports: 'default', + exports: 'named', }, plugins, }, @@ -32,7 +32,7 @@ export default [ name: 'WaveSurfer', file: 'dist/wavesurfer.min.js', format: 'umd', - exports: 'default', + exports: 'named', }, plugins, }, diff --git a/src/wavesurfer.ts b/src/wavesurfer.ts index f10759272..194d5ee0b 100644 --- a/src/wavesurfer.ts +++ b/src/wavesurfer.ts @@ -515,3 +515,6 @@ class WaveSurfer extends Player { } export default WaveSurfer + +export { default as BasePlugin } from './base-plugin.js' +export { default as render } from './dom.js' From 097e0f3f06762b85a67d7aaa5f08f34033b2d08d Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Tue, 16 Jan 2024 13:25:30 -0700 Subject: [PATCH 2/9] Feat: exports for Base Plugin --- src/wavesurfer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/wavesurfer.ts b/src/wavesurfer.ts index 194d5ee0b..b856ba0c6 100644 --- a/src/wavesurfer.ts +++ b/src/wavesurfer.ts @@ -517,4 +517,4 @@ class WaveSurfer extends Player { export default WaveSurfer export { default as BasePlugin } from './base-plugin.js' -export { default as render } from './dom.js' +export { default as createElement } from './dom.js' From 6303bb2ca2806d53e9628a6897d34306a3af760e Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Tue, 16 Jan 2024 14:36:22 -0700 Subject: [PATCH 3/9] Feat: exports for Base Plugin --- src/dom.ts | 8 ++++---- src/plugins/envelope.ts | 8 ++++---- src/plugins/hover.ts | 6 +++--- src/plugins/minimap.ts | 6 +++--- src/plugins/regions.ts | 12 ++++++------ src/plugins/spectrogram.ts | 8 ++++---- src/plugins/timeline.ts | 8 ++++---- 7 files changed, 28 insertions(+), 28 deletions(-) diff --git a/src/dom.ts b/src/dom.ts index c1c85cf69..eb7bf7137 100644 --- a/src/dom.ts +++ b/src/dom.ts @@ -31,12 +31,12 @@ function renderNode(tagName: string, content: TreeNode): HTMLElement | SVGElemen return element } -function render(tagName: string, content: TreeNode & { xmlns: string }, container?: Node): SVGElement -function render(tagName: string, content?: TreeNode, container?: Node): HTMLElement -function render(tagName: string, content?: TreeNode, container?: Node): HTMLElement | SVGElement { +function createElement(tagName: string, content: TreeNode & { xmlns: string }, container?: Node): SVGElement +function createElement(tagName: string, content?: TreeNode, container?: Node): HTMLElement +function createElement(tagName: string, content?: TreeNode, container?: Node): HTMLElement | SVGElement { const el = renderNode(tagName, content || {}) container?.appendChild(el) return el } -export default render +export default createElement diff --git a/src/plugins/envelope.ts b/src/plugins/envelope.ts index 34395e3e6..45d1b674f 100644 --- a/src/plugins/envelope.ts +++ b/src/plugins/envelope.ts @@ -5,7 +5,7 @@ import BasePlugin, { type BasePluginEvents } from '../base-plugin.js' import { makeDraggable } from '../draggable.js' import EventEmitter from '../event-emitter.js' -import render from '../dom.js' +import createElement from '../dom.js' export type EnvelopePoint = { id?: string @@ -66,7 +66,7 @@ class Polyline extends EventEmitter<{ const height = wrapper.clientHeight // SVG element - const svg = render( + const svg = createElement( 'svg', { xmlns: 'http://www.w3.org/2000/svg', @@ -88,7 +88,7 @@ class Polyline extends EventEmitter<{ this.svg = svg // A polyline representing the envelope - const polyline = render( + const polyline = createElement( 'polyline', { xmlns: 'http://www.w3.org/2000/svg', @@ -173,7 +173,7 @@ class Polyline extends EventEmitter<{ private createCircle(x: number, y: number) { const size = this.options.dragPointSize const radius = size / 2 - return render( + return createElement( 'ellipse', { xmlns: 'http://www.w3.org/2000/svg', diff --git a/src/plugins/hover.ts b/src/plugins/hover.ts index 3066cd688..e3b3a98e6 100644 --- a/src/plugins/hover.ts +++ b/src/plugins/hover.ts @@ -3,7 +3,7 @@ */ import BasePlugin, { type BasePluginEvents } from '../base-plugin.js' -import render from '../dom.js' +import createElement from '../dom.js' export type HoverPluginOptions = { lineColor?: string @@ -33,8 +33,8 @@ class HoverPlugin extends BasePlugin { this.options = Object.assign({}, defaultOptions, options) // Create the plugin elements - this.wrapper = render('div', { part: 'hover' }) - this.label = render('span', { part: 'hover-label' }, this.wrapper) + this.wrapper = createElement('div', { part: 'hover' }) + this.label = createElement('span', { part: 'hover-label' }, this.wrapper) } public static create(options?: HoverPluginOptions) { diff --git a/src/plugins/minimap.ts b/src/plugins/minimap.ts index a21c73cdc..b5996b995 100644 --- a/src/plugins/minimap.ts +++ b/src/plugins/minimap.ts @@ -4,7 +4,7 @@ import BasePlugin, { type BasePluginEvents } from '../base-plugin.js' import WaveSurfer, { type WaveSurferOptions } from '../wavesurfer.js' -import render from '../dom.js' +import createElement from '../dom.js' export type MinimapPluginOptions = { overlayColor?: string @@ -63,7 +63,7 @@ class MinimapPlugin extends BasePlugin { wordBreak: 'keep-all', } - const leftHandle = render( + const leftHandle = createElement( 'div', { part: 'region-handle region-handle-left', @@ -134,7 +134,7 @@ class SingleRegion extends EventEmitter { element, ) - const rightHandle = render( + const rightHandle = createElement( 'div', { part: 'region-handle region-handle-right', @@ -188,7 +188,7 @@ class SingleRegion extends EventEmitter { elementTop = elementHeight * this.channelIdx } - const element = render('div', { + const element = createElement('div', { style: { position: 'absolute', top: `${elementTop}%`, @@ -319,7 +319,7 @@ class SingleRegion extends EventEmitter { } if (typeof content === 'string') { const isMarker = this.start === this.end - this.content = render('div', { + this.content = createElement('div', { style: { padding: `0.2em ${isMarker ? 0.2 : 0.4}em`, display: 'inline-block', @@ -439,7 +439,7 @@ class RegionsPlugin extends BasePlugin Date: Wed, 17 Jan 2024 10:28:31 -0700 Subject: [PATCH 4/9] Revert "Feat: exports for Base Plugin" This reverts commit 097e0f3f06762b85a67d7aaa5f08f34033b2d08d. --- src/wavesurfer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/wavesurfer.ts b/src/wavesurfer.ts index b856ba0c6..194d5ee0b 100644 --- a/src/wavesurfer.ts +++ b/src/wavesurfer.ts @@ -517,4 +517,4 @@ class WaveSurfer extends Player { export default WaveSurfer export { default as BasePlugin } from './base-plugin.js' -export { default as createElement } from './dom.js' +export { default as render } from './dom.js' From 489e3844ddc5c131d8345e221799c59e5a06b583 Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Wed, 17 Jan 2024 10:28:36 -0700 Subject: [PATCH 5/9] Revert "Feat: exports for Base Plugin" This reverts commit b71503416e531086cfad2d723354a5a116587db8. --- rollup.config.js | 4 ++-- src/wavesurfer.ts | 3 --- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/rollup.config.js b/rollup.config.js index 7ef2c8351..83822a2dc 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -21,7 +21,7 @@ export default [ output: { file: 'dist/wavesurfer.cjs', format: 'cjs', - exports: 'named', + exports: 'default', }, plugins, }, @@ -32,7 +32,7 @@ export default [ name: 'WaveSurfer', file: 'dist/wavesurfer.min.js', format: 'umd', - exports: 'named', + exports: 'default', }, plugins, }, diff --git a/src/wavesurfer.ts b/src/wavesurfer.ts index 194d5ee0b..f10759272 100644 --- a/src/wavesurfer.ts +++ b/src/wavesurfer.ts @@ -515,6 +515,3 @@ class WaveSurfer extends Player { } export default WaveSurfer - -export { default as BasePlugin } from './base-plugin.js' -export { default as render } from './dom.js' From 884476a642fcffb472d3afff1b5cbaa19e0355f5 Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Wed, 17 Jan 2024 10:39:14 -0700 Subject: [PATCH 6/9] Feat: exports for BasePlugin and Dom --- package.json | 10 ++++++++ rollup.config.js | 62 +++++++++++++++++++++++++++++++++++++++++++++ src/base-plugin.ts | 2 +- src/plugins/zoom.ts | 2 +- 4 files changed, 74 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index cdd32b2ca..39b49241d 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,16 @@ "types": "./dist/plugins/*.d.ts", "require": "./dist/plugins/*.cjs" }, + "./dist/base-plugin.js": { + "import": "./dist/base-plugin.esm.js", + "types": "./dist/base-plugin.d.ts", + "require": "./dist/base-plugin.cjs" + }, + "./dist/dom.js": { + "import": "./dist/dom.esm.js", + "types": "./dist/dom.d.ts", + "require": "./dist/dom.cjs" + }, "./dist/*": { "import": "./dist/*" } diff --git a/rollup.config.js b/rollup.config.js index 83822a2dc..c07139138 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -98,4 +98,66 @@ export default [ }, ]) .flat(), + + // ES module + { + input: 'src/base-plugin.ts', + output: { + file: 'dist/base-plugin.esm.js', + format: 'esm', + }, + plugins, + }, + // CommonJS module (Node.js) + { + input: 'src/base-plugin.ts', + output: { + file: 'dist/base-plugin.cjs', + format: 'cjs', + exports: 'default', + }, + plugins, + }, + // UMD (browser script tag) + { + input: 'src/base-plugin.ts', + output: { + name: 'BasePlugin', + file: 'dist/base-plugin.min.js', + format: 'umd', + exports: 'default', + }, + plugins, + }, + + // ES module + { + input: 'src/dom.ts', + output: { + file: 'dist/dom.esm.js', + format: 'esm', + }, + plugins, + }, + // CommonJS module (Node.js) + { + input: 'src/dom.ts', + output: { + file: 'dist/dom.cjs', + format: 'cjs', + exports: 'default', + }, + plugins, + }, + // UMD (browser script tag) + { + input: 'src/dom.ts', + output: { + name: 'createElement', + file: 'dist/dom.min.js', + format: 'umd', + exports: 'default', + }, + plugins, + }, ] diff --git a/src/base-plugin.ts b/src/base-plugin.ts index 22762762f..ccead1765 100644 --- a/src/base-plugin.ts +++ b/src/base-plugin.ts @@ -8,7 +8,7 @@ export type BasePluginEvents = { export type GenericPlugin = BasePlugin /** Base class for wavesurfer plugins */ -export class BasePlugin extends EventEmitter { +class BasePlugin extends EventEmitter { protected wavesurfer?: WaveSurfer protected subscriptions: (() => void)[] = [] protected options: Options diff --git a/src/plugins/zoom.ts b/src/plugins/zoom.ts index 077f585e2..a84d52ee5 100644 --- a/src/plugins/zoom.ts +++ b/src/plugins/zoom.ts @@ -19,7 +19,7 @@ * }); */ -import { BasePlugin, BasePluginEvents } from '../base-plugin.js' +import BasePlugin, { type BasePluginEvents } from '../base-plugin.js' export type ZoomPluginOptions = { /** From 8b9818292236ec62748e52f0b5db95bcbf27c686 Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Wed, 17 Jan 2024 11:16:46 -0700 Subject: [PATCH 7/9] Revert "Feat: exports for BasePlugin and Dom" This reverts commit 884476a642fcffb472d3afff1b5cbaa19e0355f5. --- package.json | 10 -------- rollup.config.js | 62 --------------------------------------------- src/base-plugin.ts | 2 +- src/plugins/zoom.ts | 2 +- 4 files changed, 2 insertions(+), 74 deletions(-) diff --git a/package.json b/package.json index 39b49241d..cdd32b2ca 100644 --- a/package.json +++ b/package.json @@ -42,16 +42,6 @@ "types": "./dist/plugins/*.d.ts", "require": "./dist/plugins/*.cjs" }, - "./dist/base-plugin.js": { - "import": "./dist/base-plugin.esm.js", - "types": "./dist/base-plugin.d.ts", - "require": "./dist/base-plugin.cjs" - }, - "./dist/dom.js": { - "import": "./dist/dom.esm.js", - "types": "./dist/dom.d.ts", - "require": "./dist/dom.cjs" - }, "./dist/*": { "import": "./dist/*" } diff --git a/rollup.config.js b/rollup.config.js index c07139138..83822a2dc 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -98,66 +98,4 @@ export default [ }, ]) .flat(), - - // ES module - { - input: 'src/base-plugin.ts', - output: { - file: 'dist/base-plugin.esm.js', - format: 'esm', - }, - plugins, - }, - // CommonJS module (Node.js) - { - input: 'src/base-plugin.ts', - output: { - file: 'dist/base-plugin.cjs', - format: 'cjs', - exports: 'default', - }, - plugins, - }, - // UMD (browser script tag) - { - input: 'src/base-plugin.ts', - output: { - name: 'BasePlugin', - file: 'dist/base-plugin.min.js', - format: 'umd', - exports: 'default', - }, - plugins, - }, - - // ES module - { - input: 'src/dom.ts', - output: { - file: 'dist/dom.esm.js', - format: 'esm', - }, - plugins, - }, - // CommonJS module (Node.js) - { - input: 'src/dom.ts', - output: { - file: 'dist/dom.cjs', - format: 'cjs', - exports: 'default', - }, - plugins, - }, - // UMD (browser script tag) - { - input: 'src/dom.ts', - output: { - name: 'createElement', - file: 'dist/dom.min.js', - format: 'umd', - exports: 'default', - }, - plugins, - }, ] diff --git a/src/base-plugin.ts b/src/base-plugin.ts index ccead1765..22762762f 100644 --- a/src/base-plugin.ts +++ b/src/base-plugin.ts @@ -8,7 +8,7 @@ export type BasePluginEvents = { export type GenericPlugin = BasePlugin /** Base class for wavesurfer plugins */ -class BasePlugin extends EventEmitter { +export class BasePlugin extends EventEmitter { protected wavesurfer?: WaveSurfer protected subscriptions: (() => void)[] = [] protected options: Options diff --git a/src/plugins/zoom.ts b/src/plugins/zoom.ts index a84d52ee5..077f585e2 100644 --- a/src/plugins/zoom.ts +++ b/src/plugins/zoom.ts @@ -19,7 +19,7 @@ * }); */ -import BasePlugin, { type BasePluginEvents } from '../base-plugin.js' +import { BasePlugin, BasePluginEvents } from '../base-plugin.js' export type ZoomPluginOptions = { /** From f73e8c5645a09af7e7cc09f608d92de323c57c78 Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Wed, 17 Jan 2024 13:48:39 -0700 Subject: [PATCH 8/9] Feat: add BasePlugin and createElement to wavesurfer class --- src/wavesurfer.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/wavesurfer.ts b/src/wavesurfer.ts index f10759272..8c8f1b2a6 100644 --- a/src/wavesurfer.ts +++ b/src/wavesurfer.ts @@ -1,5 +1,6 @@ -import type { GenericPlugin } from './base-plugin.js' +import BasePlugin, { type GenericPlugin } from './base-plugin.js' import Decoder from './decoder.js' +import createElement from './dom.js' import Fetcher from './fetcher.js' import Player from './player.js' import Renderer from './renderer.js' @@ -140,6 +141,9 @@ class WaveSurfer extends Player { protected subscriptions: Array<() => void> = [] protected mediaSubscriptions: Array<() => void> = [] + public static readonly BasePlugin = BasePlugin + public static readonly createElement = createElement + /** Create a new WaveSurfer instance */ public static create(options: WaveSurferOptions) { return new WaveSurfer(options) From d05b9f837e457a63ff832460da6b61456fb04566 Mon Sep 17 00:00:00 2001 From: Brian Byassee Date: Thu, 18 Jan 2024 09:43:09 -0700 Subject: [PATCH 9/9] Feat: Add dom to WaveSurfer --- src/dom.ts | 6 +++--- src/wavesurfer.ts | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/dom.ts b/src/dom.ts index eb7bf7137..e1953ec80 100644 --- a/src/dom.ts +++ b/src/dom.ts @@ -31,9 +31,9 @@ function renderNode(tagName: string, content: TreeNode): HTMLElement | SVGElemen return element } -function createElement(tagName: string, content: TreeNode & { xmlns: string }, container?: Node): SVGElement -function createElement(tagName: string, content?: TreeNode, container?: Node): HTMLElement -function createElement(tagName: string, content?: TreeNode, container?: Node): HTMLElement | SVGElement { +export function createElement(tagName: string, content: TreeNode & { xmlns: string }, container?: Node): SVGElement +export function createElement(tagName: string, content?: TreeNode, container?: Node): HTMLElement +export function createElement(tagName: string, content?: TreeNode, container?: Node): HTMLElement | SVGElement { const el = renderNode(tagName, content || {}) container?.appendChild(el) return el diff --git a/src/wavesurfer.ts b/src/wavesurfer.ts index 8c8f1b2a6..b7d19ae6c 100644 --- a/src/wavesurfer.ts +++ b/src/wavesurfer.ts @@ -1,6 +1,6 @@ import BasePlugin, { type GenericPlugin } from './base-plugin.js' import Decoder from './decoder.js' -import createElement from './dom.js' +import * as dom from './dom.js' import Fetcher from './fetcher.js' import Player from './player.js' import Renderer from './renderer.js' @@ -142,7 +142,7 @@ class WaveSurfer extends Player { protected mediaSubscriptions: Array<() => void> = [] public static readonly BasePlugin = BasePlugin - public static readonly createElement = createElement + public static readonly dom = dom /** Create a new WaveSurfer instance */ public static create(options: WaveSurferOptions) {