@vime-js/core - npm Package Compare versions

Comparing version 1.1.1 to 1.1.3

CHANGELOG.md

@@ -6,2 +6,15 @@ # Change Log
 
+## [1.1.3](https://github.com/vime-js/vime/tree/master/packages/vime-core/compare/v1.1.2...v1.1.3) (2020-03-22)
+
+
+### Bug Fixes
+
+* **core:** fullscreen change event not firing in webkit ([89f6cec](https://github.com/vime-js/vime/tree/master/packages/vime-core/commit/89f6ceca2994dc3ba84c1bcaab1b3ec2d71d221e))
+* **core:** rebuild event not firing properly ([4cc440b](https://github.com/vime-js/vime/tree/master/packages/vime-core/commit/4cc440b8b492cc61b4709454471609a135359a4e))
+* enforce stricter eslint rules ([d5ad7e6](https://github.com/vime-js/vime/tree/master/packages/vime-core/commit/d5ad7e653cc41e82681d86f475d94a01629fe07d))
+
+
+
+
+
 ## [1.1.1](https://github.com/vime-js/vime/tree/master/packages/vime-core/compare/v1.1.0...v1.1.1) (2020-03-20)
@@ -8,0 +21,0 @@

package.json

 {
   "name": "@vime-js/core",
   "description": "Vime core",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "svelte": "src/index.js",
@@ -27,3 +27,3 @@ "module": "src/index.js",
   "dependencies": {
-    "@vime-js/utils": "^1.1.1"
+    "@vime-js/utils": "^1.1.3"
   },
@@ -33,3 +33,3 @@ "publishConfig": {
   },
-  "gitHead": "7ed5b0d00fc95d8d796273ecfec759fb4049871a"
+  "gitHead": "c47800b578da38a03bcd1abf23614d881fee3342"
 }

src/actions/aspectRatio.js

 import { set_style } from '@vime-js/utils';
 
-export default function aspectRatio (node, aspectRatio) {
-  const update = aspectRatio => {
-    if (!aspectRatio) {
+export default function aspectRatio(node, initialAspectRatio) {
+  const update = (newAspectRatio) => {
+    if (!newAspectRatio) {
       set_style(node, 'paddingBottom');
       return;
     }
-    const [width, height] = aspectRatio.split(':');
+    const [width, height] = newAspectRatio.split(':');
     set_style(node, 'paddingBottom', `${(100 / width) * height}%`);
   };
 
-  update(aspectRatio);
+  update(initialAspectRatio);
 
   return {
     update,
-    destroy () {
+    destroy() {
       update(null);
-    }
+    },
   };
 }

src/actions/focus.js

 import { listen, run_all } from 'svelte/internal';
 
-export default function focus (node) {
+export default function focus(node) {
   const dispose = [];
 
-  const onFocus = e => {
+  const onFocus = (e) => {
     const isFocused = (e.type === 'mouseenter' || e.type === 'focus');
@@ -18,4 +18,4 @@ if (!isFocused) node.blur();
   return {
-    destroy () { run_all(dispose); }
+    destroy() { run_all(dispose); },
   };
 }

src/actions/highlight.js

 import { listen } from 'svelte/internal';
 
-export default function highlight (node, duration = 100) {
+export default function highlight(node, duration = 100) {
   const off = listen(node, 'touchstart', () => {
@@ -13,4 +13,4 @@ node.dispatchEvent(new CustomEvent('highlightchange', { detail: true }));
   return {
-    destroy () { off(); }
+    destroy() { off(); },
   };
 }

src/actions/inputRangeTouch.js

@@ -5,4 +5,4 @@ import { run_all, listen } from 'svelte/internal';
 // @see https://github.com/sampotts/rangetouch
-export default function inputRangeTouch (node) {
-  const calcValue = e => {
+export default function inputRangeTouch(node) {
+  const calcValue = (e) => {
     const input = e.target;
@@ -18,3 +18,3 @@ const touch = e.changedTouches[0];
     const clientRect = input.getBoundingClientRect();
-    
+
     // NOTE: hardcoded thumbwidth.
@@ -40,10 +40,9 @@ const thumbWidth = ((100 / clientRect.width) * (13 / 2)) / 100;
       return min + Math.round(position / step) * step;
-    } else {
-      // NOTE: this part differs from original implementation to save space.
-      // Only supports 2 decimal places (0.01) as the step.
-      return min + parseFloat(position.toFixed(2));
     }
+    // NOTE: this part differs from original implementation to save space.
+    // Only supports 2 decimal places (0.01) as the step.
+    return min + parseFloat(position.toFixed(2));
   };
 
-  const onTouch = e => {
+  const onTouch = (e) => {
     if (e.target.disabled) return;
@@ -66,3 +65,3 @@ e.preventDefault();
     const touchEvents = ['touchstart', 'touchmove', 'touchend'];
-    touchEvents.forEach(event => dispose.push(listen(node, event, onTouch)));
+    touchEvents.forEach((event) => dispose.push(listen(node, event, onTouch)));
   };
@@ -78,3 +77,3 @@
 
-  const onTouchDetect = isTouch => {
+  const onTouchDetect = (isTouch) => {
     if (isTouch && !mounted) {
@@ -94,7 +93,7 @@ onMount();
   return {
-    destroy () {
+    destroy() {
       if (!destroyed) onDestroy();
-      touchListener && touchListener();
-    }
+      if (touchListener) touchListener();
+    },
   };
 }

src/formatters/index.js

@@ -1,8 +0,8 @@
-const getHours = value => Math.trunc((value / 60 / 60) % 60);
-const getMinutes = value => Math.trunc((value / 60) % 60);
-const getSeconds = value => Math.trunc(value % 60);
+const getHours = (value) => Math.trunc((value / 60 / 60) % 60);
+const getMinutes = (value) => Math.trunc((value / 60) % 60);
+const getSeconds = (value) => Math.trunc(value % 60);
 
 export const formatTime = (seconds = 0, alwaysShowHours = false) => {
   // Format time component to add leading zero
-  const format = value => `0${value}`.slice(-2);
+  const format = (value) => `0${value}`.slice(-2);
 
@@ -9,0 +9,0 @@ let hours = getHours(seconds);

src/player/Disposal.js

@@ -0,1 +1,3 @@
+/* eslint-disable no-underscore-dangle */
+
 import { run_all } from 'svelte/internal';
@@ -5,3 +7,3 @@ import { try_on_svelte_destroy } from '@vime-js/utils';
 export default class Disposal {
-  constructor () {
+  constructor() {
     this._dispose = [];
@@ -11,7 +13,7 @@ try_on_svelte_destroy(() => this.dispose());
 
-  add (cb) {
+  add(cb) {
     this._dispose.push(cb);
   }
 
-  dispose () {
+  dispose() {
     run_all(this._dispose);
@@ -18,0 +20,0 @@ this._dispose = [];

src/player/FullscreenApi.js

 // @see https://github.com/videojs/video.js/blob/7.6.x/src/js/fullscreen-api.js
 
 const FullscreenApi = {
-  prefixed: true
+  prefixed: true,
 };
@@ -15,3 +15,3 @@
     'fullscreenerror',
-    'fullscreen'
+    'fullscreen',
   ],
@@ -26,3 +26,3 @@ // WebKit
     'webkitfullscreenerror',
-    '-webkit-full-screen'
+    '-webkit-full-screen',
   ],
@@ -37,3 +37,3 @@ // Mozilla
     'mozfullscreenerror',
-    '-moz-full-screen'
+    '-moz-full-screen',
   ],
@@ -48,4 +48,4 @@ // Microsoft
     'MSFullscreenError',
-    '-ms-fullscreen'
-  ]
+    '-ms-fullscreen',
+  ],
 ];
@@ -57,3 +57,3 @@
 // Determine the supported set of functions.
-for (let i = 0; i < apiMap.length; i++) {
+for (let i = 0; i < apiMap.length; i += 1) {
   // Check for exitFullscreen function.
@@ -68,3 +68,3 @@ if (apiMap[i][1] in document) {
 if (browserApi) {
-  for (let i = 0; i < browserApi.length; i++) {
+  for (let i = 0; i < browserApi.length; i += 1) {
     FullscreenApi[specApi[i]] = browserApi[i];
@@ -71,0 +71,0 @@ }

src/player/MediaType.js

 // Treeshaking safe.
-const MediaType = function () {};
+const MediaType = function MediaType() {};
 MediaType.NONE = 0;
@@ -4,0 +4,0 @@ MediaType.AUDIO = 1;

src/player/PlayerState.js

 // Treeshaking safe.
-const PlayerState = function () {};
+const PlayerState = function PlayerState() {};
 PlayerState.IDLE = 1;
@@ -4,0 +4,0 @@ PlayerState.CUED = 2;

src/player/playerStore.js

@@ -1,2 +0,1 @@
-import { createEventDispatcher } from 'svelte';
 import { writable, derived } from 'svelte/store';
@@ -9,8 +8,9 @@ import { currentPlayer } from './sharedStore';
 import {
-  private_writable, map_store_to_component, can_autoplay, 
+  private_writable, map_store_to_component, can_autoplay,
   selectable_if, rangeable_if, IS_MOBILE,
   indexable, private_writable_if, is_function,
-  rangeable
+  rangeable,
 } from '@vime-js/utils';
 
+
 // Player defaults used when the `src` changes or `resetStore` is called.
@@ -39,6 +39,6 @@ const playerDefaults = () => ({
   nativePoster: null,
-  isControlsActive: true
+  isControlsActive: true,
 });
 
-const buildPlayerStore = player => {
+const buildPlayerStore = (player) => {
   const store = {};
@@ -53,3 +53,3 @@ const defaults = playerDefaults();
     [store.playbackReady, store.rebuilding],
-    ([$playbackReady, $rebuilding]) => $playbackReady && !$rebuilding
+    ([$playbackReady, $rebuilding]) => $playbackReady && !$rebuilding,
   );
@@ -80,3 +80,3 @@
     store.provider,
-    $provider => $provider && is_function($provider.setPoster)
+    ($provider) => $provider && is_function($provider.setPoster),
   );
@@ -89,4 +89,4 @@
   store.mediaType = private_writable(MediaType.NONE);
-  store.isAudio = derived(store.mediaType, $mediaType => $mediaType === MediaType.AUDIO);
-  store.isVideo = derived(store.mediaType, $mediaType => $mediaType === MediaType.VIDEO);
+  store.isAudio = derived(store.mediaType, ($mediaType) => $mediaType === MediaType.AUDIO);
+  store.isVideo = derived(store.mediaType, ($mediaType) => $mediaType === MediaType.VIDEO);
   store.isLive = private_writable(false);
@@ -98,7 +98,14 @@ store.playbackRates = private_writable(defaults.playbackRates);
   // Used by @vime-js/player.
+  // eslint-disable-next-line no-underscore-dangle
   store._posterPlugin = writable(false);
   store.isVideoView = derived(
+    // eslint-disable-next-line no-underscore-dangle
     [store.poster, store.nativePoster, store.canSetPoster, store._posterPlugin, store.isVideo],
-    ([$poster, $nativePoster, $canSetPoster, $plugin, $isVideo]) => 
-      !!(($canSetPoster || $plugin) && ($poster || $nativePoster)) || $isVideo
+    ([
+      $poster,
+      $nativePoster,
+      $canSetPoster,
+      $plugin,
+      $isVideo,
+    ]) => !!(($canSetPoster || $plugin) && ($poster || $nativePoster)) || $isVideo,
   );
@@ -108,3 +115,3 @@
     [store.playbackReady, store.isVideoView],
-    ([$playbackReady, $isVideoView]) => $playbackReady && $isVideoView
+    ([$playbackReady, $isVideoView]) => $playbackReady && $isVideoView,
   );
@@ -118,4 +125,6 @@
     [store.provider, store.playbackRates],
-    ([$provider, $playbackRates]) => 
-      $provider && $playbackRates.length > 1 && is_function($provider.setPlaybackRate)
+    ([
+      $provider,
+      $playbackRates,
+    ]) => $provider && $playbackRates.length > 1 && is_function($provider.setPlaybackRate),
   );
@@ -125,9 +134,19 @@
     [store.provider, store.isVideo, store.videoQualities],
-    ([$provider, $isVideo, $videoQualities]) => 
-      $provider && $isVideo && $videoQualities.length > 0 && is_function($provider.setVideoQuality)
+    ([$provider, $isVideo, $videoQualities]) => $provider
+      && $isVideo
+      && $videoQualities.length > 0
+      && is_function($provider.setVideoQuality),
   );
 
   store.paused = writable(defaults.paused);
-  store.playbackRate = selectable_if(defaults.playbackRate, store.playbackRates, store.canSetPlaybackRate);
-  store.videoQuality = selectable_if(defaults.videoQuality, store.videoQualities, store.canSetVideoQuality);
+  store.playbackRate = selectable_if(
+    defaults.playbackRate,
+    store.playbackRates,
+    store.canSetPlaybackRate,
+  );
+  store.videoQuality = selectable_if(
+    defaults.videoQuality,
+    store.videoQualities,
+    store.canSetVideoQuality,
+  );
   store.currentTime = rangeable(defaults.currentTime, 0, store.duration);
@@ -146,9 +165,9 @@ store.internalTime = private_writable(defaults.internalTime);
         seconds: $currentTime,
-        percent: ($currentTime / $duration) * 100
+        percent: ($currentTime / $duration) * 100,
       },
       buffered: {
         seconds: $buffered,
-        percent: ($buffered / $duration) * 100
-      }
-    })
+        percent: ($buffered / $duration) * 100,
+      },
+    }),
   );
@@ -165,21 +184,26 @@
   store.seeking = private_writable(defaults.seeking);
-  store.isPlayerActive = derived(currentPlayer, $currentPlayer => $currentPlayer === player);
+  store.isPlayerActive = derived(currentPlayer, ($currentPlayer) => $currentPlayer === player);
 
   store.state = derived(
-    [store.playbackStarted, store.playbackEnded, store.paused, store.buffering, store.playbackReady],
+    [
+      store.playbackStarted,
+      store.playbackEnded,
+      store.paused,
+      store.buffering,
+      store.playbackReady,
+    ],
     ([$playbackStarted, $playbackEnded, $paused, $buffering, $playbackReady]) => {
       if ($playbackEnded) {
         return PlayerState.ENDED;
-      } else if ($buffering) {
+      } if ($buffering) {
         return PlayerState.BUFFERING;
-      } else if ($playbackStarted && $paused) {
+      } if ($playbackStarted && $paused) {
         return PlayerState.PAUSED;
-      } else if ($playbackStarted) {
+      } if ($playbackStarted) {
         return PlayerState.PLAYING;
-      } else if ($playbackReady) {
+      } if ($playbackReady) {
         return PlayerState.CUED;
-      } else {
-        return PlayerState.IDLE;
       }
-    }
+      return PlayerState.IDLE;
+    },
   );
@@ -193,6 +217,6 @@
     store.provider,
-    $provider => $provider && is_function($provider.setTracks)
+    ($provider) => $provider && is_function($provider.setTracks),
   );
- 
-  // No needs to block writing of `tracks` as it might be stored and used by a provider when possible.
+
+  // Don't block writing of `tracks` as it might be stored and used by a provider when possible.
   store.tracks = writable([]);
@@ -202,3 +226,6 @@
     [store.provider, store.tracks],
-    ([$provider, $tracks]) => $provider && $tracks && $tracks.length > 0 && is_function($provider.setTrack)
+    ([$provider, $tracks]) => $provider
+      && $tracks
+      && $tracks.length > 0
+      && is_function($provider.setTrack),
   );
@@ -209,16 +236,17 @@
   store.currentTrackIndex = indexable(store.tracks);
-  
+
   store.currentTrack = derived(
     [store.tracks, store.currentTrackIndex],
-    ([$tracks, $index]) => ($index >= 0) ? $tracks[$index] : null
+    ([$tracks, $index]) => (($index >= 0) ? $tracks[$index] : null),
   );
-  
+
   store.isCaptionsActive = derived(
-    [store.playbackReady, store.isAudio, store.currentTrackIndex], 
-    ([$playbackReady, $isAudio, $currentTrackIndex]) => 
-      $playbackReady && !$isAudio && ($currentTrackIndex !== -1)
+    [store.playbackReady, store.isAudio, store.currentTrackIndex],
+    ([$playbackReady, $isAudio, $currentTrackIndex]) => $playbackReady
+      && !$isAudio
+      && ($currentTrackIndex !== -1),
   );
 
   // TODO: add cues support (cues, currentCueIndex, currentCue, activeCues).
-  
+
   // --------------------------------------------------------------
@@ -230,8 +258,10 @@ // Picture in Picture
     [store.isVideoReady, store.provider],
-    ([$isVideoReady, $provider]) => 
-      $isVideoReady && $provider && $provider.supportsPiP() && is_function($provider.setPiP)
+    ([$isVideoReady, $provider]) => $isVideoReady
+      && $provider
+      && $provider.supportsPiP()
+      && is_function($provider.setPiP),
   );
 
   store.isPiPActive = private_writable(false);
-  
+
   // --------------------------------------------------------------
@@ -258,9 +288,9 @@ // Fullscreen
 
-const resetStore = store => {
+const resetStore = (store) => {
   const defaults = playerDefaults();
   Object.keys(defaults)
-    .forEach(prop => store[prop] && store[prop].set(defaults[prop]));
+    .forEach((prop) => store[prop] && store[prop].set(defaults[prop]));
 };
 
-const fillStore = async store => {
+const fillStore = async (store) => {
   store.canAutoplay.set(await can_autoplay(false));
@@ -270,3 +300,3 @@ store.canMutedAutoplay.set(await can_autoplay(true));
 
-export const mapPlayerStoreToComponent = player => {
+export const mapPlayerStoreToComponent = (player) => {
   const store = buildPlayerStore(player);
@@ -278,4 +308,4 @@ fillStore(store);
     onPropsChange,
-    resetStore: () => resetStore(store)
+    resetStore: () => resetStore(store),
   };
 };

src/player/Registry.js

@@ -0,1 +1,3 @@
+/* eslint-disable no-underscore-dangle */
+
 import { writable, derived, get } from 'svelte/store';
@@ -5,3 +7,3 @@
   is_instance_of, try_create_svelte_dispatcher, try_on_svelte_destroy,
-  on_svelte_instance_destroy, is_null
+  on_svelte_instance_destroy, is_null,
 } from '@vime-js/utils';
@@ -11,5 +13,5 @@
 export default class Registry {
-  constructor (id, validator) {
+  constructor(id, validator) {
     this._id = id;
-    this._name = id + 'Registry';
+    this._name = `${id}Registry`;
     this._validator = validator || (() => true);
@@ -23,9 +25,9 @@ this._registry = new Set();
 
-  _error (msg) {
+  _error(msg) {
     throw Error(`${this._name} :: ${msg}`);
   }
 
-  _invalidateParent () {
+  _invalidateParent() {
     if (this._parent && !this._parent._destroyed) {
-      this._parent._values.update(v => v);
+      this._parent._values.update((v) => v);
       this._parent._invalidateParent();
@@ -35,7 +37,7 @@ }
 
-  _unwrap (values) {
+  _unwrapValues(values) {
     const result = {};
-    Object.keys(values).forEach(id => {
+    Object.keys(values).forEach((id) => {
       const value = values[id];
-      result[id] = is_instance_of(value, Registry) ? this._unwrap(value.getValues()) : value;
+      result[id] = is_instance_of(value, Registry) ? this._unwrapValues(value.getValues()) : value;
     });
@@ -45,32 +47,32 @@ return result;
 
-  getId () {
+  getId() {
     return this._id;
   }
 
-  getName () {
+  getName() {
     return this._name;
   }
 
-  getRegistrations () {
+  getRegistrations() {
     return Array.from(this._registry.values());
   }
 
-  getValue (id) {
+  getValue(id) {
     return get(this._values)[id];
   }
 
-  getValues () {
+  getValues() {
     return get(this._values);
   }
 
-  has (id) {
+  has(id) {
     return this._registry.has(id);
   }
 
-  invalidate () {
-    this._values.update(v => v);
+  invalidate() {
+    this._values.update((v) => v);
     this._invalidateParent();
   }
 
-  register (id, value) {
+  register(id, value) {
     if (!id) this._error('registration failed because `id` is missing');
@@ -80,4 +82,5 @@ if (this.has(id)) this._error(`attempted to register with \`id\` [${id}] but it is taken`);
     this._registry.add(id);
-    this._values.update($values => ({ ...$values, [id]: value }));
+    this._values.update(($values) => ({ ...$values, [id]: value }));
     on_svelte_instance_destroy(value, () => this.deregister(id));
+    // eslint-disable-next-line no-param-reassign
     if (is_instance_of(value, Registry)) value._parent = this;
@@ -88,6 +91,7 @@ this._dispatch('register', { id, value });
 
-  deregister (id) {
+  deregister(id) {
     if (!this.has(id)) return;
     this._registry.delete(id);
-    this._values.update($values => {
+    this._values.update(($values) => {
+      // eslint-disable-next-line no-param-reassign
       delete $values[id];
@@ -100,9 +104,9 @@ return $values;
 
-  subscribe () {
-    return derived(this._values, $values => this._unwrap($values)).subscribe(...arguments);
+  subscribe(...args) {
+    return derived(this._values, ($values) => this._unwrapValues($values)).subscribe(...args);
   }
 
-  destroy () {
+  destroy() {
     if (is_null(this._registry)) return;
-    this.getRegistrations().forEach(id => this.deregister(id));
+    this.getRegistrations().forEach((id) => this.deregister(id));
     if (this._parent && !this._parent._destroyed) this._parent.deregister(this.getId());
@@ -109,0 +113,0 @@ this._destroyed = true;

src/player/VideoQuality.js

 // Treeshaking safe.
-const VideoQuality = function () {};
+const VideoQuality = function VideoQuality() {};
 VideoQuality.UNKNOWN = null;
@@ -4,0 +4,0 @@ VideoQuality.XXS = 144;

src/player/withPlayer.js

@@ -0,5 +1,7 @@
+/* eslint-disable no-param-reassign */
+
 import VimePlayer from './Player.svelte';
 
 export default function (Provider) {
-  function Player (options) {
+  function Player(options) {
     if (!options.props) options.props = {};
@@ -6,0 +8,0 @@ options.props.Provider = Provider.default;

No alert changes

Improved metrics

Total package byte prevSize

45408

increased by4.13%

Lines of code

640

increased by5.44%

Dependency changes

• Updated@vime-js/utils@^1.1.3