anglk
/
web-narrowcast
forked from varia/web-narrowcast
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

page for publishing partyline broadcast 2

master
mb 2 years ago
parent
db1c77791f
commit
97b834873a
1 changed files with 53 additions and 41 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 88
      index.html

88
index.html
View File

@ -32,22 +32,24 @@
<!-- once the event is over remember to move to the sidebottom section -->
<!-- if no event is left please add this placeholder: <p>more TBA soon! <a href="https://varia.zone/en" target="_blank" > &#128064; </a> <br> meer TBA binnenkort! -->
<p>September 7th, 2022<br>18:00-19:00 (CEST): <a href="https://varia.zone/en/publishing-partyline.html" target="_blank">Publishing Partyline, Broadcast #1: standards and work arounds, with Open Source Publishing (OSP)</a></p>
<p>September 21st, 2022<br>18:00-19:00 (CEST): <a href="https://varia.zone/en/publishing-partyline.html" target="_blank">Publishing Partyline, Broadcast #2: dependency relations in the ecosystem, with Paged.js</a></p>
<!-- <p>more TBA soon! <a href="https://varia.zone/en" target="_blank" > &#128064; </a> <br> meer TBA binnenkort! </p> -->
</div>
<div class="middle">
<p>⇈ Soon ⇈ <br> ⇈ Binnenkort ⇈</p>
<p id="livetitle">LIVE ↝ N↻W ⇶ </p>
<p>⇈ Soon<br>⇈ Binnenkort</p>
<p id="livetitle">LIVE NOW ⇶ </p>
<!-- ADD A CURRENT LIVE EVENT HERE -->
<p id="livesubtitle"><a href="" target="_blank"></a></p>
<p>⇊ Was amazing ↷ ook leuk ⇊</p>
<p>⇊ Previous broadcasts<br>⇊ Vorige uitzendingen </p>
<p> <a href="https://vvvvvvaria.org/archive/">Archive ↩</a></p>
</div>
<div class="sidebottom">
<p>September 7th, 2022<br>18:00-19:00 (CEST): <a href="https://varia.zone/en/publishing-partyline.html" target="_blank">Publishing Partyline, Broadcast #1: standards and work arounds, with Open Source Publishing (OSP)</a></p>
<p>23 maart / March '22: A Transversal Network of Feminist Servers (<a href="https://varia.zone/atnofs-varia.html" target="_blank">een radio uitzending</a> / <a href="https://varia.zone/en/atnofs-varia.html" target="_blank">a radio broadcast</a>)</a></p>
<p>18 December '21: <a href="http://varia.zone/en/usercond04.html" target="_blank">The User Condition #04 - "Losing Your Data is Good for You" - with Dave Young </a></p>
@ -114,7 +116,6 @@
<!-- MEDIA CONTENT -->
<!-- MARQUEE PLACEHOLDER — CHANGE THE TEXT -->
<!-- if online: -->
<!-- " ♪ . *⁽⁽ ◝꒰´꒳`∗꒱◟ ₎₎₊· * ON AIR ♪ ♬ ヾclick on the buttons on the right side to display the different modalities ﾉ ♬ ♪ ON AIR ♫♪.ılılıll|̲̅̅●̲̅̅|̲̅̅=̲̅̅|̲̅̅●̲̅̅|llılılı.♫♪ " -->
@ -122,7 +123,7 @@
<!-- if offline: -->
<!-- " ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone " -->
<marquee scrolldelay="92">[LIVE NOW] Publishing Partyline, Broadcast #1: standards and work arounds, with Open Source Publishing (OSP)</marquee>
<marquee scrolldelay="92">[LIVE NOW] Publishing Partyline, Broadcast #2: dependency relations in the ecosystem, with Paged.js</marquee>
<!-- AUDIO -->
@ -131,12 +132,33 @@
<div class="audio-stream fullscreen" id="showAudio">
<audio id="player" preload="none" src="https://voice.vvvvvvaria.org/live"> </audio>
<p>
Press play (best listened in FireFox). It might take a minute to load.</p>
Press play to tune in! It might take a few seconds to load.</p>
<div class="audio-buttons">
<button id="bp" class="stream-button b-narrow" onclick="document.getElementById('player').play(); bplaytoggle()">Play</button>
<button id="audio" class="stream-button b-narrow" onclick="Play()">Play</button>
<!-- <button id="bp" class="stream-button b-narrow" onclick="document.getElementById('player').play(); bplaytoggle()">Play</button> -->
<!-- <button id="bs" class="stream-button b-narrow" onclick="console.log(soundEffect);">Stop</button> -->
<!-- <button id="bs" class="stream-button b-narrow" onclick="document.getElementById('player').pause();document.getElementById('player').src=document.getElementById('player').src; bstoptoggle()">Stop</button> -->
<script>
var audio = document.getElementById("player");
audio.volume = 0.5;
var butn = document.getElementById("audio");
// butn.style.background = "url(https://uploads-ssl.webflow.com/5acdf398c6f3e7252e9a31b9/5ad9f901d9a651ff58dad03b_play.svg) no-repeat";
<button id="bs" class="stream-button b-narrow" onclick="document.getElementById('player').pause();document.getElementById('player').src=document.getElementById('player').src; bstoptoggle()">Stop</button>
function Play() {
if(audio.paused) {
audio.play();
butn.innerText = "Pause";
}
else {
audio.pause();
butn.innerText = "Play";
}
}
</script>
<button class="stream-button b-narrow vol" onclick="document.getElementById('player').volume += 0.1">Vol +</button>
<button class="stream-button b-narrow vol" onclick="document.getElementById('player').volume -= 0.1">Vol -</button>
@ -153,47 +175,37 @@
<div class="img-gallery" id="showGal">
<p class="img-gallery-title"> ⇩ IMAGE ⇊ GALLERY ⇘ IMAGE ⇊ GALERIJ ⇩ </p>
<!-- <p class="img-gallery-title"> ⇩ IMAGE ⇊ GALLERY ⇘ IMAGE ⇊ GALERIJ ⇩ </p> -->
<figure>
<img alt="" src="./OSP/osp-bienvenue-welkom.jpg"><br>
Lightbox sign at the entrance of the OSP studio, saying "Bienvenue OSP Welkom" in stickered colorful neon Crickx letters
(<a class="windowlinks" href="./OSP/osp-bienvenue-welkom.jpg" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="" src="./OSP/osp.kitchen.png"><br>
Screenshot of <a href="https://osp.kitchen">osp.kitchen</a>
(<a class="windowlinks" href="./OSP/osp.kitchen.png" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="" src="./OSP/Tools-shapes-practice-shapes-tools-osp.png"><br>
Inspired by the motto of the Libre Graphics Research Unit, TOOLS SHAPE PRACTICE SHAPE TOOLS"
(<a class="windowlinks" href="./OSP/Tools-shapes-practice-shapes-tools-osp.png" target="_blank" alt="">link to image</a>)
<img alt="" src="./Paged.js/paged.js-website.png"><br>
Screenshot of the <a href="https://pagedjs.org/" target="_blank">Paged.js website</a>
(<a class="windowlinks" href="./Paged.js/paged.js-website.png" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="" src="./OSP/html2print-pdf-spread.png"><br>
Screenshot of html2print rendering a PDF in the browser
(<a class="windowlinks" href="./OSP/html2print-pdf-spread.png" target="_blank" alt="">link to image</a>)
<img alt="" src="./Paged.js/paged.js-documentation.png"><br>
Screenshot of the <a href="https://pagedjs.org/documentation/" target="_blank">documentation page on the Paged.js website</a>
(<a class="windowlinks" href="./Paged.js/paged.js-documentation.png" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="" src="./OSP/medor.png"><br>
Cover of Médor Nº27 (summer 2022)
(<a class="windowlinks" href="./OSP/medor.png" target="_blank" alt="">link to image</a>)
<img alt="" src="./Paged.js/coko-foundation-website.png"><br>
Screenshot of the <a href="https://coko.foundation/" target="_blank">Coko Foundation website</a>
(<a class="windowlinks" href="./Paged.js/coko-foundation-website.png" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="" src="./OSP/medor-28-spread-1.jpg"><br>
Spread from the latest edition of Médor Nº28, showing the custom columns lay out made with html2print & CSS regions
(<a class="windowlinks" href="./OSP/medor-28-spread-1.jpg" target="_blank" alt="">link to image</a>)
<img alt="" src="./Paged.js/paged.js-used-in-varia-collective-space-guide-booklet.png"><br>
Screenshot of Paged.js being used to make a <a href="https://vvvvvvaria.org/~simoon/partylines/publishing-partyline/varia-collective-space-guide.pdf" target="_blank">Varia collective-space guide booklet</a> (edited and lay out by Simon Browne)
(<a class="windowlinks" href="./Paged.js/paged.js-used-in-varia-collective-space-guide-booklet.png" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="" src="./OSP/medor-28-spread-2.jpg"><br>
Spread from the latest edition of Médor Nº28, showing the custom columns lay out made with html2print & CSS regions
(<a class="windowlinks" href="./OSP/medor-28-spread-2.jpg" target="_blank" alt="">link to image</a>)
<img alt="" src="./Paged.js/paged.js-volumetric-regimes-1.png"><br>
Screenshot of the cover of <a href="https://volumetricregimes.xyz/" target="_blank">Volumetric Regimes</a> (edited by <a href="https://possiblebodies.constantvzw.org/inventory/" target="_blank">Possible Bodies</a>, lay out by Manetta Berends), previewed through Paged.js
(<a class="windowlinks" href="./Paged.js/paged.js-volumetric-regimes-1.png" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="" src="./OSP/medor-n28-web-version-of-article.png"><br>
Web article from the latest edition of Médor Nº28, showing how the same content is used for both the website and printed magazine
(<a class="windowlinks" href="./OSP/medor-n28-web-version-of-article.png" target="_blank" alt="">link to image</a>)
<img alt="" src="./Paged.js/paged.js-volumetric-regimes-2.png"><br>
Screenshot of the table of contents of <a href="https://volumetricregimes.xyz/" target="_blank">Volumetric Regimes</a> (edited by <a href="https://possiblebodies.constantvzw.org/inventory/" target="_blank">Possible Bodies</a>, lay out by Manetta Berends), previewed through Paged.js
(<a class="windowlinks" href="./Paged.js/paged.js-volumetric-regimes-2.png" target="_blank" alt="">link to image</a>)
</figure>
</div>

Write Preview
Loading…
Cancel
Save