varia/web-narrowcast
14
0
Fork 1
Code Issues 11 Pull Requests Projects Releases Wiki Activity

page for publishing partyline broadcast 2

Browse Source
This commit is contained in:
mb 2022-09-21 15:17:02 +02:00
parent db1c77791f
commit 97b834873a
1 changed files with 53 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
index.html
View File

@ -32,22 +32,24 @@
<!-- once the event is over remember to move to the sidebottom section --> <!-- 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! --> <!-- 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> --> <!-- <p>more TBA soon! <a href="https://varia.zone/en" target="_blank" > &#128064; </a> <br> meer TBA binnenkort! </p> -->
</div> </div>
<div class="middle"> <div class="middle">
<p>⇈ Soon ⇈ <br> ⇈ Binnenkort ⇈</p> <p>⇈ Soon<br>⇈ Binnenkort</p>
<p id="livetitle">LIVE ↝ N↻W ⇶ </p> <p id="livetitle">LIVE NOW ⇶ </p>
<!-- ADD A CURRENT LIVE EVENT HERE --> <!-- ADD A CURRENT LIVE EVENT HERE -->
<p id="livesubtitle"><a href="" target="_blank"></a></p> <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> <p> <a href="https://vvvvvvaria.org/archive/">Archive ↩</a></p>
</div> </div>
<div class="sidebottom"> <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>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> <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 --> <!-- MEDIA CONTENT -->
<!-- MARQUEE PLACEHOLDER — CHANGE THE TEXT --> <!-- MARQUEE PLACEHOLDER — CHANGE THE TEXT -->
<!-- if online: --> <!-- 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ı.♫♪ " --> <!-- " ♪ . *⁽⁽ ◝꒰´꒳`∗꒱◟ ₎₎₊· * 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: --> <!-- if offline: -->
<!-- " ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone " --> <!-- " ♬ ¨ * • 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 --> <!-- AUDIO -->
@ -131,12 +132,33 @@
<div class="audio-stream fullscreen" id="showAudio"> <div class="audio-stream fullscreen" id="showAudio">
<audio id="player" preload="none" src="https://voice.vvvvvvaria.org/live"> </audio> <audio id="player" preload="none" src="https://voice.vvvvvvaria.org/live"> </audio>
<p> <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"> <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="document.getElementById('player').pause();document.getElementById('player').src=document.getElementById('player').src; bstoptoggle()">Stop</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";
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>
<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"> <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> <figure>
<img alt="" src="./OSP/osp-bienvenue-welkom.jpg"><br> <img alt="" src="./Paged.js/paged.js-website.png"><br>
Lightbox sign at the entrance of the OSP studio, saying "Bienvenue OSP Welkom" in stickered colorful neon Crickx letters Screenshot of the <a href="https://pagedjs.org/" target="_blank">Paged.js website</a>
(<a class="windowlinks" href="./OSP/osp-bienvenue-welkom.jpg" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="./Paged.js/paged.js-website.png" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure> <figure>
<img alt="" src="./OSP/osp.kitchen.png"><br> <img alt="" src="./Paged.js/paged.js-documentation.png"><br>
Screenshot of <a href="https://osp.kitchen">osp.kitchen</a> Screenshot of the <a href="https://pagedjs.org/documentation/" target="_blank">documentation page on the Paged.js website</a>
(<a class="windowlinks" href="./OSP/osp.kitchen.png" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="./Paged.js/paged.js-documentation.png" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure> <figure>
<img alt="" src="./OSP/Tools-shapes-practice-shapes-tools-osp.png"><br> <img alt="" src="./Paged.js/coko-foundation-website.png"><br>
Inspired by the motto of the Libre Graphics Research Unit, TOOLS SHAPE PRACTICE SHAPE TOOLS" Screenshot of the <a href="https://coko.foundation/" target="_blank">Coko Foundation website</a>
(<a class="windowlinks" href="./OSP/Tools-shapes-practice-shapes-tools-osp.png" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="./Paged.js/coko-foundation-website.png" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure> <figure>
<img alt="" src="./OSP/html2print-pdf-spread.png"><br> <img alt="" src="./Paged.js/paged.js-used-in-varia-collective-space-guide-booklet.png"><br>
Screenshot of html2print rendering a PDF in the browser 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="./OSP/html2print-pdf-spread.png" target="_blank" alt="">link to image</a>) (<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>
<figure> <figure>
<img alt="" src="./OSP/medor.png"><br> <img alt="" src="./Paged.js/paged.js-volumetric-regimes-1.png"><br>
Cover of Médor Nº27 (summer 2022) 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="./OSP/medor.png" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="./Paged.js/paged.js-volumetric-regimes-1.png" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure> <figure>
<img alt="" src="./OSP/medor-28-spread-1.jpg"><br> <img alt="" src="./Paged.js/paged.js-volumetric-regimes-2.png"><br>
Spread from the latest edition of Médor Nº28, showing the custom columns lay out made with html2print & CSS regions 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="./OSP/medor-28-spread-1.jpg" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="./Paged.js/paged.js-volumetric-regimes-2.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>)
</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>)
</figure> </figure>
</div> </div>