presi-slides 1.0.5 → 1.0.7

package/includes/presi-slides.cjs

@@ -122,4 +122,4 @@ js: import "konva/skia-backend";
         transition: opacity 1s;
       }
     }
-  `;isPaint=!1;overlayMode=`pointer`;overlayColor=`red`;stage=null;constructor(){super(),ne(this).template(e.template).styles(e.styles),te.delegate(this,`.reveal`,{click:e=>{let t=e.target;if(t){let e=t.nextElementSibling;e&&e.classList.add(`reveal`),t.classList.remove(`reveal`)}}})}static observedAttributes=[`active`,`overlay`];attributeChangedCallback(e,t,n){switch(e){case`overlay`:this.overlayMode=n,this.createOverlay();break;case`color`:this.overlayColor=n}}disconnectedCallback(){this.stage&&delete this.stage}createOverlay(){if(this.stage)return;let e=this.shadowRoot.getElementById(`overlay`);console.log(`Creating overlay if needed`,this.stage),this.stage=new ua.Stage({container:e,width:e?.clientWidth,height:e?.clientHeight}),this.layer=new ua.Layer,this.stage.add(this.layer),this.stage.on(`mousedown touchstart`,e=>{this.isPaint=!0;let t=this.stage.getPointerPosition();console.log(`touchstart`,t),this.lastLine=new ua.Line({stroke:this.overlayColor,strokeWidth:this.overlayMode===`eraser`?20:4,globalCompositeOperation:this.overlayMode===`brush`?`source-over`:`destination-out`,lineCap:`round`,lineJoin:`round`,points:[t.x,t.y,t.x,t.y]}),this.layer.add(this.lastLine)}),this.stage.on(`mouseup touchend`,()=>{this.isPaint=!1,console.log(`touchend`)}),this.stage.on(`mousemove touchmove`,e=>{if(!this.isPaint)return;e.evt.preventDefault();let t=this.stage.getPointerPosition(),n=this.lastLine.points().concat([t.x,t.y]);this.lastLine.points(n)})}},fa=.4,pa=.8,ma=new URLSearchParams(document.location.search),ha=class extends HTMLElement{VIEW_ELEMENT=`slide-view`;FOOTER_ELEMENT=`slide-footer`;controls=null;active=null;observer=new IntersectionObserver(e=>{let t=0,n=null;e.forEach(e=>{if(e.isIntersecting){let r=e.target;e.intersectionRatio<fa?r.removeAttribute(`active`):e.intersectionRatio>t&&(t=e.intersectionRatio,n=r)}}),n&&n!==this.active&&this.setActiveSlide(n)},{threshold:[0,fa,pa,1],delay:300});constructor(){super(),this.addEventListener(`slide:input`,e=>{let{slide:t}=e.detail,n=this.slide(t);this.setActiveSlide(n),this.jumpToSlide(n)}),this.addEventListener(`slide:overlay`,e=>{this.manageOverlay(e.detail)}),ma.get(`reveal`)&&this.classList.add(`reveal-all`)}slide(e){return Array.from(this.querySelectorAll(this.VIEW_ELEMENT))[e-1]}connectedCallback(){let e=Array.from(this.querySelectorAll(this.VIEW_ELEMENT));this.controls=this.querySelector(this.FOOTER_ELEMENT),e.forEach(e=>this.observer.observe(e))}gotoSlide(e){console.log(`Going to slide`,e),e&&e.scrollIntoView({behavior:`smooth`,block:`center`,inline:`nearest`})}jumpToSlide(e){e&&e.scrollIntoView({block:`center`,inline:`nearest`})}setActiveSlide(e){if(this.active=e,this.active){this.active.setAttribute(`active`,`active`);let t=Array.from(this.querySelectorAll(this.VIEW_ELEMENT)).findIndex(t=>t===e);this.controls&&(this.controls.setAttribute(`slide`,t+1),this.controls.setAttribute(`overlay`,e.getAttribute(`overlay`)||`pointer`))}}manageOverlay(e){let{overlay:t}=e||{};console.log(`Overlay options`,e),this.active&&t&&this.active.setAttribute(`overlay`,t)}};function ga(){window.addEventListener(`resize`,_a),_a()}function _a(){let e=document.body,t=document.documentElement.clientWidth,n=document.documentElement.clientHeight;e.classList.add(`presentation-scaled`),e.style.setProperty(`--viewport-width`,t.toString()),e.style.setProperty(`--viewport-height`,n.toString()),console.log(`Rescaled`,t,n)}c({"slide-presi":ha,"slide-view":da,"slide-footer":T}),ga();
+  `;isPaint=!1;overlayMode=`pointer`;overlayColor=`red`;stage=null;constructor(){super(),ne(this).template(e.template).styles(e.styles),te.delegate(this,`.reveal`,{click:e=>{let t=e.target;if(t){let e=t.nextElementSibling;e&&e.classList.add(`reveal`),t.classList.remove(`reveal`)}}}),te.delegate(this,`.reveal ~ :not(.reveal)`,{click:e=>{let t=e.target;t&&t.classList.add(`reveal-one`)}})}static observedAttributes=[`active`,`overlay`];attributeChangedCallback(e,t,n){switch(e){case`overlay`:this.overlayMode=n,this.createOverlay();break;case`color`:this.overlayColor=n}}disconnectedCallback(){this.stage&&delete this.stage}createOverlay(){if(this.stage)return;let e=this.shadowRoot.getElementById(`overlay`);console.log(`Creating overlay if needed`,this.stage),this.stage=new ua.Stage({container:e,width:e?.clientWidth,height:e?.clientHeight}),this.layer=new ua.Layer,this.stage.add(this.layer),this.stage.on(`mousedown touchstart`,e=>{this.isPaint=!0;let t=this.stage.getPointerPosition();console.log(`touchstart`,t),this.lastLine=new ua.Line({stroke:this.overlayColor,strokeWidth:this.overlayMode===`eraser`?20:4,globalCompositeOperation:this.overlayMode===`brush`?`source-over`:`destination-out`,lineCap:`round`,lineJoin:`round`,points:[t.x,t.y,t.x,t.y]}),this.layer.add(this.lastLine)}),this.stage.on(`mouseup touchend`,()=>{this.isPaint=!1,console.log(`touchend`)}),this.stage.on(`mousemove touchmove`,e=>{if(!this.isPaint)return;e.evt.preventDefault();let t=this.stage.getPointerPosition(),n=this.lastLine.points().concat([t.x,t.y]);this.lastLine.points(n)})}},fa=.4,pa=.8,ma=new URLSearchParams(document.location.search),ha=class extends HTMLElement{VIEW_ELEMENT=`slide-view`;FOOTER_ELEMENT=`slide-footer`;controls=null;active=null;observer=new IntersectionObserver(e=>{let t=0,n=null;e.forEach(e=>{if(e.isIntersecting){let r=e.target;e.intersectionRatio<fa?r.removeAttribute(`active`):e.intersectionRatio>t&&(t=e.intersectionRatio,n=r)}}),n&&n!==this.active&&this.setActiveSlide(n)},{threshold:[0,fa,pa,1],delay:300});constructor(){super(),this.addEventListener(`slide:input`,e=>{let{slide:t}=e.detail,n=this.slide(t);this.setActiveSlide(n),this.jumpToSlide(n)}),this.addEventListener(`slide:overlay`,e=>{this.manageOverlay(e.detail)}),ma.get(`reveal`)&&this.classList.add(`reveal-all`)}slide(e){return Array.from(this.querySelectorAll(this.VIEW_ELEMENT))[e-1]}connectedCallback(){let e=Array.from(this.querySelectorAll(this.VIEW_ELEMENT));this.controls=this.querySelector(this.FOOTER_ELEMENT),e.forEach(e=>this.observer.observe(e))}gotoSlide(e){console.log(`Going to slide`,e),e&&e.scrollIntoView({behavior:`smooth`,block:`center`,inline:`nearest`})}jumpToSlide(e){e&&e.scrollIntoView({block:`center`,inline:`nearest`})}setActiveSlide(e){if(this.active=e,this.active){this.active.setAttribute(`active`,`active`);let t=Array.from(this.querySelectorAll(this.VIEW_ELEMENT)).findIndex(t=>t===e);this.controls&&(this.controls.setAttribute(`slide`,t+1),this.controls.setAttribute(`overlay`,e.getAttribute(`overlay`)||`pointer`))}}manageOverlay(e){let{overlay:t}=e||{};console.log(`Overlay options`,e),this.active&&t&&this.active.setAttribute(`overlay`,t)}};function ga(){window.addEventListener(`resize`,_a),_a()}function _a(){let e=document.body,t=document.documentElement.clientWidth,n=document.documentElement.clientHeight;e.classList.add(`presentation-scaled`),e.style.setProperty(`--viewport-width`,t.toString()),e.style.setProperty(`--viewport-height`,n.toString()),console.log(`Rescaled`,t,n)}c({"slide-presi":ha,"slide-view":da,"slide-footer":T}),ga();

package/includes/presi-slides.js

@@ -8433,6 +8433,9 @@ var ua = $n.Util._assign($n, {
 				let e = t.nextElementSibling;
 				e && e.classList.add("reveal"), t.classList.remove("reveal");
 			}
+		} }), te.delegate(this, ".reveal ~ :not(.reveal)", { click: (e) => {
+			let t = e.target;
+			t && t.classList.add("reveal-one");
 		} });
 	}
 	static observedAttributes = ["active", "overlay"];

package/includes/slides.css

@@ -484,24 +484,14 @@ slide-view {
             color: white;
         }
     }
-
-    /*&:not(:first-child)::after {
-        display: block;
-        position: absolute;
-        bottom: var(--size-spacing-large);
-        right: var(--size-spacing-large);
-        content: attr(data-slide-number);
-        font-size: 0.75em;
-        color: var(--color-accent);
-    }*/
 }
 
 /* progressively revealed lists (li.reveal) */
 
 slide-presi:not(.reveal-all) {
     li.reveal {
-        &,
-        & ~ li {
+        &:not(.reveal-one),
+        & ~ li:not(.reveal-one) {
             color: transparent;
             border: 1px solid #ccc;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "presi-slides",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "Make slides with Markdown",
   "keywords": [
     "Presentation",

package/public/slides.css

@@ -326,8 +326,9 @@ slide-view {
         > video:only-child {
             display: block;
             object-fit: contain;
-            height: 100%;
-            width: 100%;
+            max-height: 100%;
+            justify-self: center;
+            align-self: stretch;
         }
 
         &.max25vh > img:only-child {
@@ -484,24 +485,14 @@ slide-view {
             color: white;
         }
     }
-
-    /*&:not(:first-child)::after {
-        display: block;
-        position: absolute;
-        bottom: var(--size-spacing-large);
-        right: var(--size-spacing-large);
-        content: attr(data-slide-number);
-        font-size: 0.75em;
-        color: var(--color-accent);
-    }*/
 }
 
 /* progressively revealed lists (li.reveal) */
 
 slide-presi:not(.reveal-all) {
     li.reveal {
-        &,
-        & ~ li {
+        &:not(.reveal-one),
+        & ~ li:not(.reveal-one) {
             color: transparent;
             border: 1px solid #ccc;
         }

package/src/slide-view.js

@@ -73,6 +73,15 @@ export class SlideElement extends HTMLElement {
         }
       }
     });
+
+    Events.delegate(this, ".reveal ~ :not(.reveal)", {
+      click: (ev) => {
+        const target = ev.target;
+        if (target) {
+          target.classList.add("reveal-one");
+        }
+      }
+    });
   }
 
   static observedAttributes = ["active", "overlay"];