diff options
-rw-r--r-- | about.html | 18 | ||||
-rw-r--r-- | code.html | 1 | ||||
-rw-r--r-- | head.html | 13 | ||||
-rwxr-xr-x | html.rb | 7 | ||||
-rw-r--r-- | images.html | 23 | ||||
-rw-r--r-- | info.html | 38 | ||||
-rw-r--r-- | nav.html | 13 | ||||
-rw-r--r-- | newsletter.html | 12 | ||||
-rw-r--r-- | tail.html | 11 |
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> @@ -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()">❮</a> +<a id="next" onclick="next()">❯</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> 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">❮</a> </dt> + <dd> previous image (keyboard: left arrow) </dd> + + <dt> <a class="next">❯</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> |