Deploying to gh-pages from @ 067716d 🚀

marekdedic · Mar 28, 2024 · 93f8eec · 93f8eec
commit 93f8eec
Show file tree

Hide file tree

Showing 21 changed files with 217 additions and 0 deletions.
diff --git a/assets/index-BS0UOPKv.js b/assets/index-BS0UOPKv.js
diff --git a/assets/index-BS0UOPKv.js.map b/assets/index-BS0UOPKv.js.map
diff --git a/assets/index-BnUIMAgQ.css b/assets/index-BnUIMAgQ.css
diff --git a/images/body-bg.png b/images/body-bg.png
diff --git a/images/demo1.jpg b/images/demo1.jpg
diff --git a/images/demo2.jpg b/images/demo2.jpg
diff --git a/images/demo3.jpg b/images/demo3.jpg
diff --git a/images/demo4.jpg b/images/demo4.jpg
diff --git a/images/highlight-bg.jpg b/images/highlight-bg.jpg
diff --git a/images/hr.png b/images/hr.png
diff --git a/images/octocat-icon.png b/images/octocat-icon.png
diff --git a/images/tar-gz-icon.png b/images/tar-gz-icon.png
diff --git a/images/thumb1.jpg b/images/thumb1.jpg
diff --git a/images/thumb2.jpg b/images/thumb2.jpg
diff --git a/images/thumb3.jpg b/images/thumb3.jpg
diff --git a/images/thumb4.jpg b/images/thumb4.jpg
diff --git a/images/video-thumb.jpg b/images/video-thumb.jpg
diff --git a/images/video.m4v b/images/video.m4v
diff --git a/images/zip-icon.png b/images/zip-icon.png
diff --git a/index.html b/index.html
@@ -0,0 +1,200 @@
+<!doctype html>
+<html>
+<head>
+    <title>Imagelightbox</title>
+    <meta charset='utf-8'>
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <link href='https://fonts.googleapis.com/css?family=Chivo:900' rel='stylesheet' type='text/css'>
+  <script type="module" crossorigin src="./assets/index-BS0UOPKv.js"></script>
+  <link rel="stylesheet" crossorigin href="./assets/index-BnUIMAgQ.css">
+</head>
+
+<body>
+<div id="container">
+    <div class="inner">
+        <header>
+            <h1>Imagelightbox</h1>
+            <h2>Image Lightbox, Responsive and Touch‑friendly</h2>
+        </header>
+
+        <section id="downloads" class="clearfix">
+            <a href="https://github.com/marekdedic/imagelightbox/zipball/master" class="button download-zip"><span>Download .zip</span></a>
+            <a href="https://github.com/marekdedic/imagelightbox/tarball/master" class="button download-tar-gz"><span>Download .tar.gz</span></a>
+            <a href="https://github.com/marekdedic/imagelightbox" class="button view-on-github"><span>View on GitHub</span></a>
+        </section>
+
+        <div id="main_content">
+            <section class="options">
+                <h2>With activity indication</h2>
+                <ul data-testid="activity">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="a"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="a"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="a"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="a"]')
+                        .imageLightbox({activity: true});
+                </code></pre>
+
+                <h2>With overlay</h2>
+                <ul data-testid="overlay">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="b"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="b"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="b"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="b"]')
+                    .imageLightbox({overlay: true});
+                </code></pre>
+
+                <h2>With "close" button</h2>
+                <ul data-testid="close-button">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="c"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="c"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="c"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="c"]')
+                    .imageLightbox({button: true, quitOnDocClick: false});
+                </code></pre>
+
+                <h2>With caption</h2>
+                <ul data-testid="caption">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="d" data-ilb2-caption="Sunset in Tanzania"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="d"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="d"><img src="images/thumb3.jpg" alt="Just another sunset in Tanzania"></a></li>
+                </ul>
+                <pre><code>
+                    $('a[data-imagelightbox="d"]')
+                    .imageLightbox({caption: true});
+                </code></pre>
+
+                <h2>With navigation</h2>
+                <ul data-testid="navigation">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="e"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="e"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="e"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>
+                    $('a[data-imagelightbox="e"]')
+                    .imageLightbox({navigation: true});
+                </code></pre>
+
+                <h2>With arrows</h2>
+                <ul data-testid="arrows">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="f"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="f"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="f"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="f"]')
+                    .imageLightbox({arrows: true});
+                </code></pre>
+
+                <h2>All of the above</h2>
+                <ul>
+                    <li><a href="images/demo1.jpg" data-imagelightbox="g" data-ilb2-caption="Sunset in Tanzania"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="g" data-ilb2-caption="Traffic jam in Tanzania"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="g" data-ilb2-caption="Just another sunset in Tanzania"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+
+                <h2>Quiting on reaching the end or clicking the image</h2>
+                <ul data-testid="quit">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="quit"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="quit"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="quit"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="quit"]')
+                    .imageLightbox({quitOnEnd: true, quitOnImgClick: true});
+                </code></pre>
+
+                <h2>With manual trigger</h2>
+                <ul>
+                    <li><a href="images/demo1.jpg" data-imagelightbox="h"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="h"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="h"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <button class="trigger_lightbox">Click Me!</button>
+
+                <h2>dynamically adding</h2>
+                <ul class="demo_dynamic" data-testid="dynamic">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="i"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="i"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="i"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <button class="add_image">Add another image</button>
+
+                <h2>With history & permalinks</h2>
+                <ul data-testid="history">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="j"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="j"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="j"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="hist"]')
+                        .imageLightbox({history: true});
+                </code></pre>
+				<pre>Call with ?imageLightboxIndex=2 added to the url to open the third image
+                    (may need to add &imageLightboxSet=j as well because there are multiple examples)</pre>
+
+                <h2>History with ids</h2>
+                <ul data-testid="history-ids">
+                    <li><a href="images/demo1.jpg" data-imagelightbox="k" data-ilb2-id="img1"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="k" data-ilb2-id="img2"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="k" data-ilb2-id="img3"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="hist"]')
+                        .imageLightbox({history: true});
+                </code></pre>
+				<pre>Add data-ilb2-id="img2" and call with ?imageLightboxIndex=img2 added to the url to open that image
+(may need to add &imageLightboxSet=k as well because there are multiple examples)</pre>
+
+                <h2>Video support</h2>
+                <ul>
+                    <li><a href="images/demo1.jpg" data-imagelightbox="video"><img src="images/thumb1.jpg"></a></li>
+					<li><a data-ilb2-video='{"controls":"controls", "autoplay":false, "sources":[{"src":"images/video.m4v", "type":"video/mp4"}]}' data-imagelightbox="video"><img src="images/video-thumb.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="video"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+				<pre>Add data-ilb2-video to the link, containing the parameters of a HTML5 video tag as JSON. You can also
+include a sources field - a list of source tags similarily encoded.</pre>
+
+                <h2>Press enter for fullscreen</h2>
+                <ul data-testid="fullscreen">
+                 <li><a href="images/demo1.jpg" data-imagelightbox="fullscreen"><img src="images/thumb1.jpg"></a></li>
+                 <li><a href="images/demo2.jpg" data-imagelightbox="fullscreen"><img src="images/thumb2.jpg"></a></li>
+                 <li><a href="images/demo3.jpg" data-imagelightbox="fullscreen"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+
+                <h2>Filter images by extension</h2>
+                <h3>Allow gif only</h3>
+                <ul>
+                    <li><a href="images/demo1.jpg" data-imagelightbox="allowedtypes"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="allowedtypes"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="allowedtypes"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+
+            </section>
+
+            <section id="events">
+                <h2>Events</h2>
+                <ul>
+                    <li><a href="images/demo1.jpg" data-imagelightbox="events"><img src="images/thumb1.jpg"></a></li>
+                    <li><a href="images/demo2.jpg" data-imagelightbox="events"><img src="images/thumb2.jpg"></a></li>
+                    <li><a href="images/demo3.jpg" data-imagelightbox="events"><img src="images/thumb3.jpg"></a></li>
+                </ul>
+                <pre><code>$('a[data-imagelightbox="events"]').imageLightbox();<br/>
+                    $(document)<br/>
+                    .on("start.ilb2", function () { console.log("start.ilb2"); })<br/>
+                    .on("loaded.ilb2", function () { console.log("loaded.ilb2"); })<br/>
+                    .on("next.ilb2", function () { console.log("next.ilb2"); })<br/>
+                    .on("previous.ilb2", function () { console.log("previous.ilb2"); })<br/>
+                    .on("quit.ilb2", function () {  console.log("quit-ilb2"); });
+                </code></pre>
+            </section>
+        </div>
+
+        <footer>
+            <p>Imagelightbox is currently maintained by <a href="https://github.com/marekdedic">Marek Dědič</a>. Photos taken by <a href="https://www.veeck.de">rejas</a>, who has also maintained the project for several years.
+                Original work by <a href="http://osvaldas.info/image-lightbox-responsive-touch-friendly">Osvaldas Valutis</a>.</p>
+            <p>This page was generated by <a href="https://pages.github.com">GitHub Pages</a>.
+                Tactile theme by <a href="https://twitter.com/jasonlong">Jason Long</a>.</p>
+        </footer>
+    </div>
+</div>
+</body>
+</html>
diff --git a/params.json b/params.json
@@ -0,0 +1 @@
+{"name":"Imagelightbox","tagline":"Image Lightbox, Responsive and Touch‑friendly","body":"### Welcome to GitHub Pages.\r\nThis automatic page generator is the easiest way to create beautiful pages for all of your projects. Author your page content here using GitHub Flavored Markdown, select a template crafted by a designer, and publish. After your page is generated, you can check out the new branch:\r\n\r\n```\r\n$ cd your_repo_root/repo_name\r\n$ git fetch origin\r\n$ git checkout gh-pages\r\n```\r\n\r\nIf you're using the GitHub for Mac, simply sync your repository and you'll see the new branch.\r\n\r\n### Designer Templates\r\nWe've crafted some handsome templates for you to use. Go ahead and continue to layouts to browse through them. You can easily go back to edit your page before publishing. After publishing your page, you can revisit the page generator and switch to another theme. Your Page content will be preserved if it remained markdown format.\r\n\r\n### Rather Drive Stick?\r\nIf you prefer to not use the automatic generator, push a branch named `gh-pages` to your repository to create a page manually. In addition to supporting regular HTML content, GitHub Pages support Jekyll, a simple, blog aware static site generator written by our own Tom Preston-Werner. Jekyll makes it easy to create site-wide headers and footers without having to copy them across every page. It also offers intelligent blog support and other advanced templating features.\r\n\r\n### Authors and Contributors\r\nYou can @mention a GitHub username to generate a link to their profile. The resulting `<a>` element will link to the contributor's GitHub Profile. For example: In 2007, Chris Wanstrath (@defunkt), PJ Hyett (@pjhyett), and Tom Preston-Werner (@mojombo) founded GitHub.\r\n\r\n### Support or Contact\r\nHaving trouble with Pages? Check out the documentation at https://help.github.com/pages or contact [email protected] and we’ll help you sort it out.\r\n","google":"","note":"Don't delete this file! It's used internally to help with page regeneration."}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		{"name":"Imagelightbox","tagline":"Image Lightbox, Responsive and Touch‑friendly","body":"### Welcome to GitHub Pages.\r\nThis automatic page generator is the easiest way to create beautiful pages for all of your projects. Author your page content here using GitHub Flavored Markdown, select a template crafted by a designer, and publish. After your page is generated, you can check out the new branch:\r\n\r\n```\r\n$ cd your_repo_root/repo_name\r\n$ git fetch origin\r\n$ git checkout gh-pages\r\n```\r\n\r\nIf you're using the GitHub for Mac, simply sync your repository and you'll see the new branch.\r\n\r\n### Designer Templates\r\nWe've crafted some handsome templates for you to use. Go ahead and continue to layouts to browse through them. You can easily go back to edit your page before publishing. After publishing your page, you can revisit the page generator and switch to another theme. Your Page content will be preserved if it remained markdown format.\r\n\r\n### Rather Drive Stick?\r\nIf you prefer to not use the automatic generator, push a branch named `gh-pages` to your repository to create a page manually. In addition to supporting regular HTML content, GitHub Pages support Jekyll, a simple, blog aware static site generator written by our own Tom Preston-Werner. Jekyll makes it easy to create site-wide headers and footers without having to copy them across every page. It also offers intelligent blog support and other advanced templating features.\r\n\r\n### Authors and Contributors\r\nYou can @mention a GitHub username to generate a link to their profile. The resulting `<a>` element will link to the contributor's GitHub Profile. For example: In 2007, Chris Wanstrath (@defunkt), PJ Hyett (@pjhyett), and Tom Preston-Werner (@mojombo) founded GitHub.\r\n\r\n### Support or Contact\r\nHaving trouble with Pages? Check out the documentation at https://help.github.com/pages or contact [email protected] and we’ll help you sort it out.\r\n","google":"","note":"Don't delete this file! It's used internally to help with page regeneration."}