@shower/core - npm Package Compare versions

Comparing version 3.0.0-2 to 3.0.0

dist/shower.js

 /**
  * Core for Shower HTML presentation engine
- * @shower/core v3.0.0-1, https://github.com/shower/core
- * @copyright 2010–2019 Vadim Makeev, https://pepelsbey.net
+ * @shower/core v3.0.0-2, https://github.com/shower/core
+ * @copyright 2010–2020 Vadim Makeev, https://pepelsbey.net
  * @license MIT
@@ -35,4 +35,4 @@ */
 
-    const isInteractiveElement = element => element.tabIndex !== -1;
-    const freezeHistory = callback => {
+    const isInteractiveElement = (element) => element.tabIndex !== -1;
+    const freezeHistory = (callback) => {
         history.pushState = () => {};
@@ -49,3 +49,3 @@ history.replaceState = () => {};
 
-    const contentLoaded = callback => {
+    const contentLoaded = (callback) => {
         if (document.currentScript.async) {
@@ -137,3 +137,3 @@ callback();
 
-    var a11y = shower => {
+    var a11y = (shower) => {
         const { container } = shower;
@@ -162,4 +162,4 @@ const liveRegion = createLiveRegion();
 
-    var keys = shower => {
-        const doSlideActions = event => {
+    var keys = (shower) => {
+        const doSlideActions = (event) => {
             const isShowerAction = !(event.ctrlKey || event.altKey || event.metaKey);
@@ -233,3 +233,3 @@
 
-        const doModeActions = event => {
+        const doModeActions = (event) => {
             switch (event.key.toUpperCase()) {
@@ -266,3 +266,3 @@ case 'ESCAPE':
 
-        shower.container.addEventListener('keydown', event => {
+        shower.container.addEventListener('keydown', (event) => {
             if (event.defaultPrevented) return;
@@ -276,4 +276,4 @@ if (isInteractiveElement(event.target)) return;
 
-    var location$1 = shower => {
-        const getURL = () => {
+    var location$1 = (shower) => {
+        const composeURL = () => {
             const search = shower.isFullMode ? '?full' : '';
@@ -286,9 +286,23 @@ const slide = shower.activeSlide;
 
-        const changeSlide = () => {
+        const applyURLMode = () => {
+            const isFull = new URL(location).searchParams.has('full');
+
+            freezeHistory(() => {
+                if (isFull) {
+                    shower.enterFullMode();
+                } else {
+                    shower.exitFullMode();
+                }
+            });
+        };
+
+        const applyURLSlide = () => {
             const id = location.hash.slice(1);
             if (!id) return;
 
-            const target = shower.slides.find(slide => slide.id === id);
+            const target = shower.slides.find((slide) => slide.id === id);
             if (target) {
-                target.activate();
+                freezeHistory(() => {
+                    target.activate();
+                });
             } else if (!shower.activeSlide) {
@@ -299,32 +313,20 @@ shower.first(); // invalid hash
 
+        const applyURL = () => {
+            applyURLMode();
+            applyURLSlide();
+        };
+
         shower.addEventListener('modechange', () => {
-            history.replaceState(null, document.title, getURL());
+            history.replaceState(null, document.title, composeURL());
         });
 
         shower.addEventListener('slidechange', () => {
-            history.pushState(null, document.title, getURL());
+            history.pushState(null, document.title, composeURL());
         });
 
-        shower.addEventListener('start', () => {
-            const isFull = new URL(location).searchParams.has('full');
-            changeSlide();
-            if (isFull) {
-                shower.enterFullMode();
-            }
-        });
-
-        window.addEventListener('popstate', () => {
-            freezeHistory(() => {
-                changeSlide();
-                const isFull = new URL(location).searchParams.has('full');
-                if (isFull) {
-                    shower.enterFullMode();
-                } else {
-                    shower.exitFullMode();
-                }
-            });
-        });
+        shower.addEventListener('start', applyURL);
+        window.addEventListener('popstate', applyURL);
     };
 
-    var next = shower => {
+    var next = (shower) => {
         const { stepSelector, activeSlideClass } = shower.options;
@@ -341,3 +343,3 @@
         const getInnerAt = () => {
-            return innerSteps.filter(step => {
+            return innerSteps.filter((step) => {
                 return step.classList.contains(activeSlideClass);
@@ -361,3 +363,3 @@ }).length;
 
-        shower.addEventListener('next', event => {
+        shower.addEventListener('next', (event) => {
             if (event.defaultPrevented || !event.cancelable) return;
@@ -371,3 +373,3 @@ if (shower.isListMode || innerAt === innerSteps.length) return;
 
-        shower.addEventListener('prev', event => {
+        shower.addEventListener('prev', (event) => {
             if (event.defaultPrevented || !event.cancelable) return;
@@ -382,3 +384,3 @@ if (shower.isListMode || innerAt === innerSteps.length || !innerAt) return;
 
-    var progress = shower => {
+    var progress = (shower) => {
         const { progressSelector } = shower.options;
@@ -405,3 +407,3 @@ const bar = shower.container.querySelector(progressSelector);
 
-    var scale = shower => {
+    var scale = (shower) => {
         const { container } = shower;
@@ -427,11 +429,11 @@ const getScale = () => {
     const units = ['s', 'm', 'h'];
-    const hasUnits = timing => {
-        return units.some(unit => timing.includes(unit));
+    const hasUnits = (timing) => {
+        return units.some((unit) => timing.includes(unit));
     };
 
-    const parseUnits = timing => {
-        return units.map(unit => timing.match(`(\\S+)${unit}`)).map(match => match && match[1]);
+    const parseUnits = (timing) => {
+        return units.map((unit) => timing.match(`(\\S+)${unit}`)).map((match) => match && match[1]);
     };
 
-    const parseColons = timing => {
+    const parseColons = (timing) => {
         return `::${timing}`.split(':').reverse();
@@ -443,3 +445,3 @@ };
 
-    var parseTiming = timing => {
+    var parseTiming = (timing) => {
         if (!timing) return 0;
@@ -457,3 +459,3 @@
 
-    var timer = shower => {
+    var timer = (shower) => {
         let id;
@@ -483,3 +485,3 @@
 
-        shower.container.addEventListener('keydown', event => {
+        shower.container.addEventListener('keydown', (event) => {
             if (!event.defaultPrevented) {
@@ -493,3 +495,3 @@ clearTimeout(id);
 
-    var title = shower => {
+    var title = (shower) => {
         const { title } = document;
@@ -513,3 +515,3 @@ const updateTitle = () => {
 
-    var view = shower => {
+    var view = (shower) => {
         const { container } = shower;
@@ -548,3 +550,3 @@ const { fullModeClass, listModeClass } = shower.options;
 
-    var installModules = shower => {
+    var installModules = (shower) => {
         a11y(shower);
@@ -573,3 +575,3 @@ keys(shower); // should come before `timer`
             this._isStarted = false;
-            this.options = Object.assign({}, defaultOptions, options);
+            this.options = { ...defaultOptions, ...options };
         }
@@ -610,10 +612,10 @@
                 ...this.container.querySelectorAll(this.options.slideSelector),
-            ].filter(slideElement => !slideElement.hidden);
+            ].filter((slideElement) => !slideElement.hidden);
 
             slideElements.forEach(ensureSlideId);
-            this.slides = slideElements.map(slideElement => {
+            this.slides = slideElements.map((slideElement) => {
                 const slide = new Slide(slideElement, this.options);
 
                 slide.addEventListener('activate', () => {
-                    this._toggleActiveSlide(slide);
+                    this._changeActiveSlide(slide);
                 });
@@ -623,4 +625,4 @@
                     if (this.isListMode) {
+                        this.enterFullMode();
                         slide.activate();
-                        this.enterFullMode();
                     }
@@ -633,11 +635,16 @@ });
 
-        _toggleActiveSlide(target) {
-            // at this point, there can be two active slides
-            this.slides.forEach(slide => {
-                if (slide !== target) {
-                    slide.deactivate();
-                }
+        _changeActiveSlide(next) {
+            const prev = this.slides.find((slide) => {
+                return slide.isActive && slide !== next;
             });
 
-            this.dispatchEvent(new Event('slidechange'));
+            if (prev) {
+                prev.deactivate();
+            }
+
+            const event = new CustomEvent('slidechange', {
+                detail: { prev },
+            });
+
+            this.dispatchEvent(event);
         }
@@ -654,7 +661,7 @@
         get activeSlide() {
-            return this.slides.find(slide => slide.isActive);
+            return this.slides.find((slide) => slide.isActive);
         }
 
         get activeSlideIndex() {
-            return this.slides.findIndex(slide => slide.isActive);
+            return this.slides.findIndex((slide) => slide.isActive);
         }
@@ -661,0 +668,0 @@

lib/shower.js

@@ -18,3 +18,3 @@ import defaultOptions from './default-options';
         this._isStarted = false;
-        this.options = Object.assign({}, defaultOptions, options);
+        this.options = { ...defaultOptions, ...options };
     }
@@ -55,10 +55,10 @@
             ...this.container.querySelectorAll(this.options.slideSelector),
-        ].filter(slideElement => !slideElement.hidden);
+        ].filter((slideElement) => !slideElement.hidden);
 
         slideElements.forEach(ensureSlideId);
-        this.slides = slideElements.map(slideElement => {
+        this.slides = slideElements.map((slideElement) => {
             const slide = new Slide(slideElement, this.options);
 
             slide.addEventListener('activate', () => {
-                this._toggleActiveSlide(slide);
+                this._changeActiveSlide(slide);
             });
@@ -68,4 +68,4 @@
                 if (this.isListMode) {
+                    this.enterFullMode();
                     slide.activate();
-                    this.enterFullMode();
                 }
@@ -78,11 +78,16 @@ });
 
-    _toggleActiveSlide(target) {
-        // at this point, there can be two active slides
-        this.slides.forEach(slide => {
-            if (slide !== target) {
-                slide.deactivate();
-            }
+    _changeActiveSlide(next) {
+        const prev = this.slides.find((slide) => {
+            return slide.isActive && slide !== next;
         });
 
-        this.dispatchEvent(new Event('slidechange'));
+        if (prev) {
+            prev.deactivate();
+        }
+
+        const event = new CustomEvent('slidechange', {
+            detail: { prev },
+        });
+
+        this.dispatchEvent(event);
     }
@@ -99,7 +104,7 @@
     get activeSlide() {
-        return this.slides.find(slide => slide.isActive);
+        return this.slides.find((slide) => slide.isActive);
     }
 
     get activeSlideIndex() {
-        return this.slides.findIndex(slide => slide.isActive);
+        return this.slides.findIndex((slide) => slide.isActive);
     }
@@ -106,0 +111,0 @@

package.json

 {
   "name": "@shower/core",
   "description": "Core for Shower HTML presentation engine",
-  "version": "3.0.0-2",
+  "version": "3.0.0",
   "publishConfig": {
@@ -24,2 +24,3 @@ "access": "public"
   "files": [
+    "lib",
     "dist/shower.js"
@@ -30,22 +31,22 @@ ],
     "chai-dom": "^1.8.1",
-    "chromedriver": "^2.46.0",
-    "eslint": "^5.16.0",
-    "eslint-config-airbnb-base": "^13.1.0",
-    "eslint-config-prettier": "^4.2.0",
-    "eslint-plugin-import": "^2.17.2",
+    "chromedriver": "^81.0.0",
+    "eslint": "^6.8.0",
+    "eslint-config-airbnb-base": "^14.1.0",
+    "eslint-config-prettier": "^6.10.1",
+    "eslint-plugin-import": "^2.17.3",
     "eslint-plugin-prettier": "^3.1.0",
-    "esm": "^3.2.22",
-    "husky": "^2.2.0",
-    "lint-staged": "^8.1.6",
-    "mocha": "^6.1.4",
-    "nightwatch": "^1.0.19",
-    "prettier": "^1.17.1",
-    "puppeteer": "^1.15.0",
-    "rollup": "^1.11.3",
-    "rollup-plugin-commonjs": "^9.3.4",
-    "rollup-plugin-node-resolve": "^4.2.4",
-    "sauce-connect-launcher": "^1.2.6",
-    "serve": "^11.0.0",
-    "serve-handler": "^6.0.0",
-    "yn": "^3.1.0"
+    "esm": "^3.2.25",
+    "husky": "^4.2.5",
+    "lint-staged": "^10.1.3",
+    "mocha": "^7.1.1",
+    "nightwatch": "^1.3.4",
+    "prettier": "^2.0.4",
+    "puppeteer": "^3.0.0",
+    "rollup": "^2.6.1",
+    "rollup-plugin-commonjs": "^10.0.0",
+    "rollup-plugin-node-resolve": "^5.0.3",
+    "sauce-connect-launcher": "^1.2.7",
+    "serve": "^11.0.2",
+    "serve-handler": "^6.0.2",
+    "yn": "^4.0.0"
   },
@@ -60,3 +61,3 @@ "scripts": {
     "format:etc": "prettier '**/*.{json,md,yml}' --write",
-    "test": "npm run lint && npm run test:unit && npm run test:sauce",
+    "test": "npm run lint && npm run test:unit && npm run test:local",
     "test:unit": "mocha test/unit --require esm --require chai/register-should",
@@ -63,0 +64,0 @@ "test:local": "nightwatch --env chrome-local",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

44703

increased by52.49%

Number of package files

23

increased by283.33%

Lines of code

1190

increased by64.36%

Number of low quality alerts

0

decreased by-100%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes