html snippets

author: pdp8 <pdp8@pdp8.info> 2022-08-21 15:09:38 +0200
committer: pdp8 <pdp8@pdp8.info> 2022-08-21 15:09:38 +0200
commit: ec4c08d91081de6d9c7404742c70a94cea250dce (patch)
tree: d8279f6196ec2f4d94d86aa6138a568989367fd6
parent: 5cc948cbe8f1e36c61f4e224a5ad74a8a975dbfd (diff)
9 files changed, 136 insertions, 0 deletions
diff --git a/about.html b/about.html
new file mode 100644
index 0000000..0efe2b0
--- /dev/null
+++ b/about.html
@@ -0,0 +1,18 @@
+<div class='post'>
+
+This is a platform for quick digital releases of pdp8's artwork.
+
+<p>
+Copy, share and re-use as you like!  Just give credit to the original and
+distribute your work under the same license (Artwork: <a href='https://creativecommons.org/licenses/by-sa/4.0/'>Creative Commons
+Attribution-ShareAlike 4.0 International License</a>,
+Code: <a href='https://www.gnu.org/licenses/gpl.html'>GNU General Public License</a>).
+
+<p>
+<a href='mailto:info@pdp8.info?subject=subscribe'>Subscribe</a>
+to the pdp8 newsletter, to receive updates about new pdp8 releases by email.
+
+<p>
+Get in touch by <a href='mailto:info@pdp8.info'>email</a>, if you are interested in original uncompressed files, physical objects, live performances or anything else.
+</div>
+
diff --git a/code.html b/code.html
new file mode 100644
index 0000000..9bfa460
--- /dev/null
+++ b/code.html
@@ -0,0 +1 @@
+<iframe src='https://git.pdp8.info/'/>"
diff --git a/head.html b/head.html
new file mode 100644
index 0000000..89119aa
--- /dev/null
+++ b/head.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+
+  <head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0">
+    <title>pdp8</title>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.1.7/css/fork-awesome.min.css" integrity="sha256-gsmEoJAws/Kd3CjuOQzLie5Q3yshhvmo7YNtBG7aaEY=" crossorigin="anonymous">
+    <link rel="stylesheet" type="text/css" href="/style.css">
+  </head>
+
+  <body>
diff --git a/html.rb b/html.rb
new file mode 100755
index 0000000..f1adc4b
--- /dev/null
+++ b/html.rb
@@ -0,0 +1,7 @@
+#!/usr/bin/env ruby
+root = ARGV[0]
+tree = {
+  "music" => Dir[File.join(root, "music", "*")],
+  "videos" => Dir[File.join(root, "videos", "*")],
+}
+p tree
diff --git a/images.html b/images.html
new file mode 100644
index 0000000..64b4278
--- /dev/null
+++ b/images.html
@@ -0,0 +1,23 @@
+<script src="/distances.js"></script>
+<script src="/images.js"></script>
+
+<script> 
+  (function() { new_selection() })();
+</script>
+
+<img id="image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNgYAAAAAMAASsJTYQAAAAASUVORK5CYII=" alt/>
+<script>document.getElementById("image").setAttribute("src", selection[0].src);</script>
+
+<div id="controller">
+  <a class="btn" href="/info.html"><i class="fa fa-info" aria-label="info" aria-hidden="true"></i></a>
+  <a class="btn" class="controller-item" onclick="new_selection()"><i class="fa fa-refresh" aria-label="reload" aria-hidden="true"></i></a>
+  <a class="btn" class="controller-item" onclick="toggle_play()"><i id="play-indicator" class="fa fa-stop" area-label="stop" aria-hidden="true"></i></a>
+</div>
+
+<a id="prev" onclick="prev()">&#10094;</a>
+<a id="next" onclick="next()">&#10095;</a>
+
+<script> 
+  (function() { play() })();
+</script>
+
diff --git a/info.html b/info.html
new file mode 100644
index 0000000..8d24230
--- /dev/null
+++ b/info.html
@@ -0,0 +1,38 @@
+<div class="post">
+a <a href="https://git.pdp8.info/ic">curator algorithm</a> displays pdp8 images. it selects 6 images according to its taste and plays them as a slideshow. the reload button <i class="fa fa-refresh" aria-hidden="true"></i>&nbsp;creates a new slideshow.
+
+<p>
+images can be shared and reused under a 
+<a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/">Attribution-ShareAlike 4.0 International</a>
+license.
+
+<p>
+please contact pdp8 by <a href="mailto:info@pdp8.info">email</a> if you are interested in original artwork.
+
+<h3>operating instructions</h3>
+
+<dl>
+
+  <dt> <i class="fa fa-info" aria-hidden="true"></i> </dt>
+  <dd> get info (this page) </dd>
+
+  <dt> <i class="fa fa-refresh" aria-hidden="true"></i> </dt>
+  <dd> load new images (keyboard: enter) </dd>
+
+  <dt> <i class="fa fa-play" aria-hidden="true"></i> </dt>
+  <dd> play slideshow (keyboard: space) </dd>
+
+  <dt> <i class="fa fa-stop" aria-hidden="true"></i> </dt>
+  <dd> stop slideshow (keyboard: space) </dd>
+
+  <dt> <a class="prev">&#10094;</a> </dt>
+  <dd> previous image (keyboard: left arrow) </dd>
+
+  <dt> <a class="next">&#10095;</a> </dt>
+  <dd> next image (keyboard: right arrow) </dd>
+
+</dl>
+
+<p>
+<a href="/images.html">view images</a>
+</div>
diff --git a/nav.html b/nav.html
new file mode 100644
index 0000000..911a8c9
--- /dev/null
+++ b/nav.html
@@ -0,0 +1,13 @@
+    <nav>
+      <img src='/pdp8.png' id='logo' alt=''>
+      <a class='item{{#audio}} current{{/audio}}' href="/audio.html">audio</a>
+      <a class='item{{#images}} current{{/images}}' href="/images.html">images</a>
+      <a class='item{{#video}} current{{/video}}' href="/video.html">video</a>
+      <a class='item{{#code}} current{{/code}}' href="/code.html">code</a>
+      <a class='item{{#news}} current{{/news}}' href="/index.html">news</a>
+      <a class='item{{#about}} current{{/about}}' href="/about.html">about</a>
+      <a class='item{{#newsletter}} current{{/newsletter}}' href="/newsletter.html">newsletter</a>
+      <a id="menu" href="#" onclick=show_vertical_menu()>
+        <i class="fa fa-bars" aria-hidden="true"></i>
+      </a>
+    </nav>
diff --git a/newsletter.html b/newsletter.html
new file mode 100644
index 0000000..9ca65f9
--- /dev/null
+++ b/newsletter.html
@@ -0,0 +1,12 @@
+<div class='post'>
+<p>
+<a href='mailto:info@pdp8.info?subject=Subscribe'>Subscribe</a>
+by email to get updates about new pdp8 releases.
+
+<p>
+<a href='mailto:info@pdp8.info?subject=Unsubscribe'>Unsubscribe</a>, if you are sick of it.
+
+<p>
+pdp8 needs your email only for the newsletter, it won't be shared with anyone.
+</div>
+
diff --git a/tail.html b/tail.html
new file mode 100644
index 0000000..53ca8ca
--- /dev/null
+++ b/tail.html
@@ -0,0 +1,11 @@
+    <script>
+      function show_vertical_menu() {
+        document.getElementById("menu").style.display = "none"
+        items = document.getElementsByClassName("item")
+        for (i = 0; i < items.length; i++) {
+          items[i].style.display = "block"
+        }
+      }
+    </script>
+  </body>
+</html>
author	pdp8 <pdp8@pdp8.info>	2022-08-21 15:09:38 +0200
committer	pdp8 <pdp8@pdp8.info>	2022-08-21 15:09:38 +0200
commit	ec4c08d91081de6d9c7404742c70a94cea250dce (patch)
tree	d8279f6196ec2f4d94d86aa6138a568989367fd6
parent	5cc948cbe8f1e36c61f4e224a5ad74a8a975dbfd (diff)