reveal.js-appearance 1.2.0 → 1.2.1

package/CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+## [1.2.1] - 2023-07-22
+### Added
+- Fix for hidden items in print and speaker view
+
+
 ## [1.2.0] - 2023-05-05
 ### Added
 - Added local, specified, auto-appear

package/README.md

@@ -8,7 +8,8 @@ An animation plugin for [Reveal.js](https://revealjs.com) that animates elements
 
 In Powerpoint you can make slides with items that appear automatically with effects. This plugin for Reveal.js tries to achieve the same result. It's easy to set up. It uses Animate.css by Daniel Eden for the animations, with some changes to allow for a non-animated state. 
 
-[Demo](https://martinomagnifico.github.io/reveal.js-appearance/demo.html)
+* [Demo](https://martinomagnifico.github.io/reveal.js-appearance/demo.html)
+* [Markdown demo](https://martinomagnifico.github.io/reveal.js-appearance/demo-markdown.html)
 
 The animations will start automatically after or at each slide or fragment change if the HTML is set up to use Appearance.
 

package/css/demo.css

@@ -89,7 +89,7 @@ p a code {
   text-decoration: underline;
 }
 
-p a[href*=html] {
+p a[href*=html], p a[href*=http] {
   text-decoration: underline;
 }
 

package/demo.html

@@ -115,7 +115,7 @@
                     <pre><code class="hljs html" data-line-numbers>&lt;img class=&quot;animate__fadeInDown&quot; src=&quot;img/1.jpg&quot;&gt;
 &lt;img class=&quot;animate__fadeInDown&quot; src=&quot;img/2.jpg&quot;&gt;
 </code></pre>
-                    <p class="small">Check the <a href="demo-markdown.html">Markdown demo</a> to see how you do this in Markdown. A Quarto extension can be found here. </p>
+                    <p class="small">Check the <a href="demo-markdown.html">Markdown demo</a> to see how you do this in Markdown. A Quarto extension can be found <a href="https://github.com/Martinomagnifico/quarto-appearance">here</a>. </p>
                     <p class="small">To simplify it <em>in any markup</em>, you can use the <a href="#/autoappear"><code>autoappear</code></a> option.</p>
                 </section>
             </section>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "reveal.js-appearance",
-    "version": "1.2.0",
+    "version": "1.2.1",
     "main": "plugin/appearance/appearance.js",
     "module": "plugin/appearance/appearance.esm.js",
     "description": "An animation plugin for Reveal.js that animates elements sequentially like in Powerpoint. Perfect for online portfolios or other presentations with images.",
@@ -14,5 +14,8 @@
     "license": "MIT, Copyright (C) 2023 Martijn De Jongh",
     "peerDependencies": {
         "reveal.js": "^4.2"
+    },
+    "dependencies": {
+        "animate.css": "^4.1.1"
     }
 }

package/plugin/appearance/appearance.css

@@ -304,10 +304,22 @@ span.animate__animated, span.animated {
           animation-duration: calc(var(--animate-duration) * 3);
 }
 
-.print-pdf {
-  color: black;
+.print-pdf .animated, .print-pdf .animate__animated,
+.print-pdf section:not(.stack):not([data-appearance-can-start]) .animated,
+.print-pdf section:not(.stack):not([data-appearance-can-start]) .animate__animated {
+  opacity: 1;
+  visibility: visible;
+  -webkit-animation: none;
+          animation: none;
 }
-.print-pdf .animated, .print-pdf .animate__animated {
+.print-pdf .reveal .fragment {
+  opacity: 1;
+}
+
+.reveal.sv .animated, .reveal.sv .animate__animated,
+.reveal.sv section:not(.stack):not([data-appearance-can-start]) .animated,
+.reveal.sv section:not(.stack):not([data-appearance-can-start]) .animate__animated {
+  opacity: 1;
   visibility: visible;
   -webkit-animation: none;
           animation: none;

package/plugin/appearance/appearance.esm.js

@@ -4,7 +4,7 @@
  * https://github.com/Martinomagnifico
  *
  * Appearance.js for Reveal.js 
- * Version 1.2.0
+ * Version 1.2.1
  * 
  * @license 
  * MIT licensed
@@ -141,6 +141,14 @@ const Plugin = () => {
       if (options.debug) console.log(text);
     };
 
+    let url = new URL(window.location);
+    let urlparams = new URLSearchParams(url.search);
+
+    if (urlparams.has('receiver')) {
+      viewport.classList.add('sv');
+      console.log(viewport);
+    }
+
     const assignAutoClass = (section, str, kind) => {
       let index = [...section.parentElement.children].filter(s => s.tagName == "SECTION").indexOf(section) + 1;
       let warning = kind == 'global' ? `JSON Parse error, please try to correct the global "autoelements" option.` : `JSON Parse error, please try to correct the "data-autoappear" attribute on section ${index}`;

package/plugin/appearance/appearance.js

@@ -4,7 +4,7 @@
  * https://github.com/Martinomagnifico
  *
  * Appearance.js for Reveal.js 
- * Version 1.2.0
+ * Version 1.2.1
  * 
  * @license 
  * MIT licensed
@@ -147,6 +147,14 @@
 	      if (options.debug) console.log(text);
 	    };
 
+	    let url = new URL(window.location);
+	    let urlparams = new URLSearchParams(url.search);
+
+	    if (urlparams.has('receiver')) {
+	      viewport.classList.add('sv');
+	      console.log(viewport);
+	    }
+
 	    const assignAutoClass = (section, str, kind) => {
 	      let index = [...section.parentElement.children].filter(s => s.tagName == "SECTION").indexOf(section) + 1;
 	      let warning = kind == 'global' ? `JSON Parse error, please try to correct the global "autoelements" option.` : `JSON Parse error, please try to correct the "data-autoappear" attribute on section ${index}`;

package/plugin/appearance/plugin-src.js

@@ -91,6 +91,13 @@ const Plugin = () => {
 			if (options.debug) console.log(text);
 		}
 
+		let url = new URL(window.location);
+		let urlparams = new URLSearchParams(url.search);
+		if (urlparams.has('receiver')) {
+			viewport.classList.add('sv')
+			console.log(viewport)
+		}
+
 		const assignAutoClass = (section, str, kind) => {
 
 			let index = [...section.parentElement.children].filter(s => s.tagName=="SECTION").indexOf(section) + 1;