@w0s/button-media-same-play 3.0.1 → 3.0.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.
package/README.md CHANGED
@@ -1,45 +1,45 @@
1
- # Simultaneous playback button for multiple audio / video
2
-
3
- [![npm version](https://badge.fury.io/js/%40w0s%2Fbutton-media-same-play.svg)](https://www.npmjs.com/package/@w0s/button-media-same-play)
4
- [![Workflow status](https://github.com/SaekiTominaga/js-library-browser/actions/workflows/button-media-same-play.yml/badge.svg)](https://github.com/SaekiTominaga/js-library-browser/actions/workflows/button-media-same-play.yml)
5
-
6
- - If you press the button during pause, the playback starts from the position with the lowest playback time.
7
- - Pause if you press a button during playback.
8
- - If all the target media elements has finished playing, start playing from the beginning.
9
-
10
- ## Demo
11
-
12
- - [Demo page](https://saekitominaga.github.io/js-library-browser/packages/button-media-same-play/demo/)
13
-
14
- ## Examples
15
-
16
- ```HTML
17
- <script type="importmap">
18
- {
19
- "imports": {
20
- "@w0s/button-media-same-play": "..."
21
- }
22
- }
23
- </script>
24
- <script type="module">
25
- import ButtonMediaSamePlay from '@w0s/button-media-same-play';
26
-
27
- buttonMediaSamePlay(document.querySelectorAll('.js-button-media-same-play')); // `getElementById()` or `getElementsByClassName()` or `getElementsByTagName()` or `querySelector()` or `querySelectorAll()`
28
- </script>
29
-
30
- <button type="button" class="js-button-media-same-play"
31
- aria-controls="video1 video2"
32
- >Simultaneous playback</button>
33
-
34
- <video src="video.webm" controls="" id="video1"></video>
35
- <video src="video.webm" controls="" id="video2"></video>
36
- ```
37
-
38
- ## HTML attributes
39
-
40
- <dl>
41
- <dt><code>type</code> [optional]</dt>
42
- <dd>This attribute is not required, but it is recommended to include <code>type="button"</code>. According to <a href="https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type">the description in the HTML specification</a>, <q cite="https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type">The missing value default and invalid value default are the <a href="https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type-submit-state">Submit Button</a> state</q>.</dd>
43
- <dt><code>aria-controls</code> [required]</dt>
44
- <dd>Space separated list of one or more ID values referencing the media elements being controlled. See the <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls"><code>aria-controls</code></a> attribute of WAI-ARIA for details.</dd>
45
- </dl>
1
+ # Simultaneous playback button for multiple audio / video
2
+
3
+ [![npm version](https://badge.fury.io/js/%40w0s%2Fbutton-media-same-play.svg)](https://www.npmjs.com/package/@w0s/button-media-same-play)
4
+ [![Workflow status](https://github.com/SaekiTominaga/js-library-browser/actions/workflows/package-button-media-same-play.yml/badge.svg)](https://github.com/SaekiTominaga/js-library-browser/actions/workflows/package-button-media-same-play.yml)
5
+
6
+ - If you press the button during pause, the playback starts from the position with the lowest playback time.
7
+ - Pause if you press a button during playback.
8
+ - If all the target media elements has finished playing, start playing from the beginning.
9
+
10
+ ## Demo
11
+
12
+ - [Demo page](https://saekitominaga.github.io/js-library-browser/packages/button-media-same-play/demo/)
13
+
14
+ ## Examples
15
+
16
+ ```HTML
17
+ <script type="importmap">
18
+ {
19
+ "imports": {
20
+ "@w0s/button-media-same-play": "..."
21
+ }
22
+ }
23
+ </script>
24
+ <script type="module">
25
+ import buttonMediaSamePlay from '@w0s/button-media-same-play';
26
+
27
+ buttonMediaSamePlay(document.querySelectorAll('.js-button-media-same-play')); // `getElementById()` or `getElementsByClassName()` or `getElementsByTagName()` or `querySelector()` or `querySelectorAll()`
28
+ </script>
29
+
30
+ <button type="button" class="js-button-media-same-play"
31
+ aria-controls="video1 video2"
32
+ >Simultaneous playback</button>
33
+
34
+ <video src="video.webm" controls="" id="video1"></video>
35
+ <video src="video.webm" controls="" id="video2"></video>
36
+ ```
37
+
38
+ ## HTML attributes
39
+
40
+ <dl>
41
+ <dt><code>type</code> [optional]</dt>
42
+ <dd>This attribute is not required, but it is recommended to include <code>type="button"</code>. According to <a href="https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type">the description in the HTML specification</a>, <q cite="https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type">The missing value default and invalid value default are the <a href="https://html.spec.whatwg.org/multipage/form-elements.html#attr-button-type-submit-state">Submit Button</a> state</q>.</dd>
43
+ <dt><code>aria-controls</code> [required]</dt>
44
+ <dd>Space separated list of one or more ID values referencing the media elements being controlled. See the <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls"><code>aria-controls</code></a> attribute of WAI-ARIA for details.</dd>
45
+ </dl>
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonMediaSamePlay.d.ts","sourceRoot":"","sources":["../src/ButtonMediaSamePlay.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,CAAC,OAAO;;IAKb;;OAEG;gBACS,WAAW,EAAE,iBAAiB;CA+C1C"}
1
+ {"version":3,"file":"ButtonMediaSamePlay.d.ts","sourceRoot":"","sources":["../src/ButtonMediaSamePlay.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,CAAC,OAAO;;IAKb;;OAEG;gBACS,WAAW,EAAE,iBAAiB;CA8C1C"}
@@ -1,4 +1,4 @@
1
- import Media from './attribute/Media.js';
1
+ import Media from "./attribute/Media.js";
2
2
  /**
3
3
  * Simultaneous playback button for multiple audio / video
4
4
  */
@@ -11,7 +11,6 @@ export default class {
11
11
  constructor(thisElement) {
12
12
  const ariaControlsAttribute = thisElement.getAttribute('aria-controls');
13
13
  this.#media = new Media(ariaControlsAttribute);
14
- // eslint-disable-next-line @typescript-eslint/no-misused-promises
15
14
  thisElement.addEventListener('click', this.#clickEvent, { passive: true });
16
15
  }
17
16
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonMediaSamePlay.js","sourceRoot":"","sources":["../src/ButtonMediaSamePlay.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,sBAAsB,CAAC;AAEzC;;GAEG;AACH,MAAM,CAAC,OAAO;IACJ,MAAM,CAAQ,CAAC,WAAW;IAEnC,OAAO,GAAG,IAAI,CAAC,CAAC,sBAAsB;IAEtC;;OAEG;IACH,YAAY,WAA8B;QACzC,MAAM,qBAAqB,GAAG,WAAW,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;QAExE,IAAI,CAAC,MAAM,GAAG,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAAC;QAE/C,kEAAkE;QAClE,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAC5E,CAAC;IAED;;OAEG;IACH,WAAW,GAAG,KAAK,IAAmB,EAAE;QACvC,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YAC5D,gCAAgC;YAChC,MAAM,OAAO,CAAC,GAAG,CAChB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,aAAa,EAAE,EAAE;gBAChD,aAAa,CAAC,WAAW,GAAG,CAAC,CAAC;gBAC9B,MAAM,aAAa,CAAC,IAAI,EAAE,CAAC;YAC5B,CAAC,CAAC,CACF,CAAC;YAEF,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACtB,CAAC;aAAM,CAAC;YACP,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBAClB,qCAAqC;gBACrC,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,WAAW,EAAE,YAAY,EAAE,EAAE;oBACzE,MAAM,OAAO,GAAG,WAAW,CAAC,WAAW,GAAG,YAAY,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,CAAC;oBAChG,OAAO,OAAO,CAAC;gBAChB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,yBAAyB;gBAEzC,MAAM,OAAO,CAAC,GAAG,CAChB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,aAAa,EAAE,EAAE;oBAChD,aAAa,CAAC,WAAW,GAAG,OAAO,CAAC;oBACpC,MAAM,aAAa,CAAC,IAAI,EAAE,CAAC;gBAC5B,CAAC,CAAC,CACF,CAAC;YACH,CAAC;iBAAM,CAAC;gBACP,mBAAmB;gBACnB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,aAAa,EAAE,EAAE;oBAC9C,aAAa,CAAC,KAAK,EAAE,CAAC;gBACvB,CAAC,CAAC,CAAC;YACJ,CAAC;YAED,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAC9B,CAAC;IACF,CAAC,CAAC;CACF"}
1
+ {"version":3,"file":"ButtonMediaSamePlay.js","sourceRoot":"","sources":["../src/ButtonMediaSamePlay.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,sBAAsB,CAAC;AAEzC;;GAEG;AACH,MAAM,CAAC,OAAO;IACJ,MAAM,CAAQ,CAAC,WAAW;IAEnC,OAAO,GAAG,IAAI,CAAC,CAAC,sBAAsB;IAEtC;;OAEG;IACH,YAAY,WAA8B;QACzC,MAAM,qBAAqB,GAAG,WAAW,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;QAExE,IAAI,CAAC,MAAM,GAAG,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAAC;QAE/C,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAC5E,CAAC;IAED;;OAEG;IACM,WAAW,GAAG,KAAK,IAAmB,EAAE;QAChD,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YAC5D,gCAAgC;YAChC,MAAM,OAAO,CAAC,GAAG,CAChB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,aAAa,EAAE,EAAE;gBAChD,aAAa,CAAC,WAAW,GAAG,CAAC,CAAC;gBAC9B,MAAM,aAAa,CAAC,IAAI,EAAE,CAAC;YAC5B,CAAC,CAAC,CACF,CAAC;YAEF,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACtB,CAAC;aAAM,CAAC;YACP,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBAClB,qCAAqC;gBACrC,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,WAAW,EAAE,YAAY,EAAE,EAAE;oBACzE,MAAM,OAAO,GAAG,WAAW,CAAC,WAAW,GAAG,YAAY,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,CAAC;oBAChG,OAAO,OAAO,CAAC;gBAChB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,yBAAyB;gBAEzC,MAAM,OAAO,CAAC,GAAG,CAChB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,aAAa,EAAE,EAAE;oBAChD,aAAa,CAAC,WAAW,GAAG,OAAO,CAAC;oBACpC,MAAM,aAAa,CAAC,IAAI,EAAE,CAAC;gBAC5B,CAAC,CAAC,CACF,CAAC;YACH,CAAC;iBAAM,CAAC;gBACP,mBAAmB;gBACnB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,aAAa,EAAE,EAAE;oBAC9C,aAAa,CAAC,KAAK,EAAE,CAAC;gBACvB,CAAC,CAAC,CAAC;YACJ,CAAC;YAED,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAC9B,CAAC;IACF,CAAC,CAAC;CACF"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"4CAUmC,UAAU,CAAC,OAAO,CAAC,GAAG,gBAAgB,CAAC,OAAO,CAAC,GAAG,OAAO,GAAG,IAAI,KAAG,IAAI;AAA1G,wBAYE"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"yBAUgB,mBAAmB,UAAU,CAAC,OAAO,CAAC,GAAG,gBAAgB,CAAC,OAAO,CAAC,GAAG,OAAO,GAAG,IAAI,KAAG,IAAI;AAA1G,wBAYE"}
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import ButtonMediaSamePlay from './ButtonMediaSamePlay.js';
1
+ import ButtonMediaSamePlay from "./ButtonMediaSamePlay.js";
2
2
  const validate = (element) => {
3
3
  if (!(element instanceof HTMLButtonElement)) {
4
4
  throw new Error('Element must be a `HTMLButtonElement`');
@@ -13,9 +13,9 @@ export default (elementOrElements) => {
13
13
  new ButtonMediaSamePlay(validate(elementOrElements));
14
14
  }
15
15
  else {
16
- for (const element of elementOrElements) {
16
+ Array.from(elementOrElements).forEach((element) => {
17
17
  new ButtonMediaSamePlay(validate(element));
18
- }
18
+ });
19
19
  }
20
20
  };
21
21
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAE3D,MAAM,QAAQ,GAAG,CAAC,OAAgB,EAAqB,EAAE;IACxD,IAAI,CAAC,CAAC,OAAO,YAAY,iBAAiB,CAAC,EAAE,CAAC;QAC7C,MAAM,IAAI,KAAK,CAAC,uCAAuC,CAAC,CAAC;IAC1D,CAAC;IAED,OAAO,OAAO,CAAC;AAChB,CAAC,CAAC;AAEF,eAAe,CAAC,iBAAmF,EAAQ,EAAE;IAC5G,IAAI,iBAAiB,KAAK,IAAI,EAAE,CAAC;QAChC,OAAO;IACR,CAAC;IAED,IAAI,iBAAiB,YAAY,OAAO,EAAE,CAAC;QAC1C,IAAI,mBAAmB,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC;IACtD,CAAC;SAAM,CAAC;QACP,KAAK,MAAM,OAAO,IAAI,iBAAiB,EAAE,CAAC;YACzC,IAAI,mBAAmB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5C,CAAC;IACF,CAAC;AACF,CAAC,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAE3D,MAAM,QAAQ,GAAG,CAAC,OAAgB,EAAqB,EAAE;IACxD,IAAI,CAAC,CAAC,OAAO,YAAY,iBAAiB,CAAC,EAAE,CAAC;QAC7C,MAAM,IAAI,KAAK,CAAC,uCAAuC,CAAC,CAAC;IAC1D,CAAC;IAED,OAAO,OAAO,CAAC;AAChB,CAAC,CAAC;AAEF,eAAe,CAAC,iBAAmF,EAAQ,EAAE;IAC5G,IAAI,iBAAiB,KAAK,IAAI,EAAE,CAAC;QAChC,OAAO;IACR,CAAC;IAED,IAAI,iBAAiB,YAAY,OAAO,EAAE,CAAC;QAC1C,IAAI,mBAAmB,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC;IACtD,CAAC;SAAM,CAAC;QACP,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YACjD,IAAI,mBAAmB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;QAC5C,CAAC,CAAC,CAAC;IACJ,CAAC;AACF,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,42 +1,41 @@
1
- {
2
- "name": "@w0s/button-media-same-play",
3
- "version": "3.0.1",
4
- "description": "Simultaneous playback button for multiple audio / video",
5
- "keywords": [],
6
- "homepage": "https://github.com/SaekiTominaga/js-library-browser#readme",
7
- "bugs": {
8
- "url": "https://github.com/SaekiTominaga/js-library-browser/issues"
9
- },
10
- "license": "MIT",
11
- "author": "Saeki Tominaga",
12
- "files": [
13
- "dist/**/*.d.ts",
14
- "!dist/**/*.test.d.ts",
15
- "dist/**/*.d.ts.map",
16
- "!dist/**/*.test.d.ts.map",
17
- "dist/**/*.js",
18
- "!dist/**/*.test.js",
19
- "dist/**/*.js.map",
20
- "!dist/**/*.test.js.map"
21
- ],
22
- "type": "module",
23
- "main": "dist/index.js",
24
- "module": "dist/index.js",
25
- "types": "dist/index.d.ts",
26
- "repository": {
27
- "type": "git",
28
- "url": "git+https://github.com/SaekiTominaga/js-library-browser.git"
29
- },
30
- "scripts": {
31
- "server": "http-server -o demo -c-1",
32
- "prebuild": "rimraf dist/* -g",
33
- "build": "tsc",
34
- "watch": "tsc -w",
35
- "lint": "eslint src/**/*.ts __tests__/**/*.js",
36
- "pretest": "npm run build",
37
- "test": "cross-env NODE_OPTIONS=--experimental-vm-modules jest dist/.+\\.test\\.js -c ../../jest.config.mjs --roots packages/button-media-same-play"
38
- },
39
- "publishConfig": {
40
- "access": "public"
41
- }
42
- }
1
+ {
2
+ "name": "@w0s/button-media-same-play",
3
+ "version": "3.0.3",
4
+ "description": "Simultaneous playback button for multiple audio / video",
5
+ "keywords": [],
6
+ "homepage": "https://github.com/SaekiTominaga/js-library-browser#readme",
7
+ "bugs": {
8
+ "url": "https://github.com/SaekiTominaga/js-library-browser/issues"
9
+ },
10
+ "license": "MIT",
11
+ "author": "Saeki Tominaga",
12
+ "files": [
13
+ "dist/**/*.d.ts",
14
+ "!dist/**/*.test.d.ts",
15
+ "dist/**/*.d.ts.map",
16
+ "!dist/**/*.test.d.ts.map",
17
+ "dist/**/*.js",
18
+ "!dist/**/*.test.js",
19
+ "dist/**/*.js.map",
20
+ "!dist/**/*.test.js.map"
21
+ ],
22
+ "type": "module",
23
+ "main": "dist/index.js",
24
+ "module": "dist/index.js",
25
+ "types": "dist/index.d.ts",
26
+ "repository": {
27
+ "type": "git",
28
+ "url": "git+https://github.com/SaekiTominaga/js-library-browser.git"
29
+ },
30
+ "scripts": {
31
+ "dev": "conc \"http-server -o demo -c-1\" \"tsc -w\"",
32
+ "prebuild": "rimraf dist/* -g",
33
+ "build": "tsc",
34
+ "lint": "eslint src/**/*.ts",
35
+ "pretest": "npm run build",
36
+ "test": "cross-env NODE_OPTIONS=--experimental-vm-modules jest dist/.+\\.test\\.js -c ../../jest.config.mjs --roots packages/button-media-same-play"
37
+ },
38
+ "publishConfig": {
39
+ "access": "public"
40
+ }
41
+ }