Browse Source

cleaning the narrowcast after the 5y party, also fixed some HTML/CSS errors related to the buttons

master
mb 1 year ago
parent
commit
e90cbf177e
  1. BIN
      broadcast3/2print-org.png
  2. 234
      index-default.html
  3. 388
      index.html
  4. 87
      narrowscripts.js
  5. 30
      narrowstyle-extra.css
  6. 16
      narrowstyle.css
  7. BIN
      video-poster.png

BIN
broadcast3/2print-org.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 MiB

234
index-default.html

@ -26,80 +26,85 @@
<div id="side" class="sidebar sidemin"> <div id="side" class="sidebar sidemin">
<button class="minimize" onclick="fside()"></button> <button class="minimize" onclick="fside()"></button>
<div class="sidetop"> <div class="sidetop">
<!-- ADD A FUTURE EVENT HERE --> <!-- ADD A FUTURE EVENT HERE -->
<!-- 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>more TBA soon! <a href="https://varia.zone/en" target="_blank" > &#128064; </a> <br> meer 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 NOW ⇶ </p> --> <!-- <p id="livetitle">LIVE NOW ⇶ </p> -->
<!-- <p><br>MONTH XX, XXXX<br>(time): <a href="XXX" target="_blank"><span id="livetitle">XXX</span></a><br><br></p> --> <!-- <p><br>MONTH XX, XXXX<br>(time): <a href="XXX" target="_blank"><span id="livetitle">XXX</span></a><br><br></p> -->
<!-- ADD A CURRENT LIVE EVENT HERE --> <!-- ADD A CURRENT LIVE EVENT HERE -->
<p>⇊ Previous broadcasts<br>⇊ Vorige uitzendingen </p> <!-- <p id="livetitle">LIVE NOW ⇶ </p> -->
<p> <a href="https://vvvvvvaria.org/archive/">Archive ↩</a></p> <p>⇊ Previous broadcasts<br>⇊ Vorige uitzendingen </p>
<p><br>(<a href="https://vvvvvvaria.org/archive/">Archive/Archief</a>)</p>
</div> </div>
<div class="sidebottom"> <div class="sidebottom">
<p><br>October 5th, 2022<br>18:00-19:00 (CEST): <a href="https://varia.zone/en/publishing-partyline.html" target="_blank"><span id="">Publishing Partyline, Broadcast #3: web-to-print in education, with Julien Bidoret & Quentin Juhel</span></a><br><br></p> <p><br>November 4th, 2022<br> 19:00 (CEST): <a href="https://vvvvvvaria.org/en/5y-varia.html" target="_blank"><span id="">5 year anniVARIAssary! </span></a></p>
<p>September 29th-30th, Sonic Liberation Front, Women Life Freedom<a href="https://cloud.disroot.org/apps/files_sharing/publicpreview/wFzqNR8yrHidif3?x=1080&y=1125&a=true&file=IMG_20220929_142643_959.jpg&scalingup=0" target="_blank"></a></p> <p>October 21st, 2022<br>20:00-21:00 (CEST): <a href="https://varia.zone/radio-activity.html" target="_blank"><span id="">Radio Activity - I smell Patchouli</span></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><br>October 5th, 2022<br>18:00-19:00 (CEST): <a href="https://varia.zone/en/publishing-partyline.html" target="_blank"><span id="">Publishing Partyline, Broadcast #3: web-to-print in education, with Julien Bidoret & Quentin Juhel</span></a><br><br></p>
<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>September 29th-30th, Sonic Liberation Front, Women Life Freedom<a href="https://cloud.disroot.org/apps/files_sharing/publicpreview/wFzqNR8yrHidif3?x=1080&y=1125&a=true&file=IMG_20220929_142643_959.jpg&scalingup=0" target="_blank"></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>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>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>17 December '21: <a href="http://varia.zone/en/double-launch-si16-and-vernaculars-come-to-matter.html" target="_blank">Double publication launch: <em>Learning How to Walk While Catwalking</em> and <em>Vernaculars come to matter</em></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>17 December '21: <a href="https://vvvvvvaria.org/archive/2021-12-17_Radio_Activity_Wireless_Orchestra/" target="_blank" >Radio Activity ↝ a Wireless Orchestra ↜ </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>5 December '21: <a href="http://varia.zone/en/cc-nlcl-tales.html" target="_blank">Ch◦re◦graphing C◦ding ↝ tales from real-time collaborative audio-visual coding ↜ </a></p> <p>17 December '21: <a href="http://varia.zone/en/double-launch-si16-and-vernaculars-come-to-matter.html" target="_blank">Double publication launch: <em>Learning How to Walk While Catwalking</em> and <em>Vernaculars come to matter</em></a></p>
<p>29-30 November'21: <a href="https://radioee.net/" target="_blank"> Mirroring the 24hr radio marathon ROOTS </a></p> <p>17 December '21: <a href="https://vvvvvvaria.org/archive/2021-12-17_Radio_Activity_Wireless_Orchestra/" target="_blank" >Radio Activity ↝ a Wireless Orchestra ↜ </a></p>
<p>29 July'21: <a href="https://vvvvvvaria.org/usercond03.html" target="_blank">The User Condition #03 - met Anaëlle Beignon </a></p> <p>5 December '21: <a href="http://varia.zone/en/cc-nlcl-tales.html" target="_blank">Ch◦re◦graphing C◦ding ↝ tales from real-time collaborative audio-visual coding ↜ </a></p>
<p>24 July'21: <a href="https://vvvvvvaria.org/fhm-2.html" target="_blank">Feminist Hack Meetings #2 - Polyphonic Radio Ensemble</a></p>
<p>12 July'21: <a href="" target="_blank">Waste/d voices and infrastructures</a></p>
<p>12-14 June'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
<p>11 June'21: <a href="" target="_blank">Ecstatic Speech</a></p>
<p>19-23 May'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
<p>17 May'21: <a href="https://vvvvvvaria.org/usercond02.html" target="_blank">The User Condition #02 - Met Brendan Howell </a></p>
<p>28 March'21: <a href="https://varia.zone/en/rr-sense-full-1.html" target="_blank">Read &amp; Repair</a></p>
<p>23 March'21: <a href="http://varia.zone/en/usercond01.html" target="_blank">User Condition S01E01</a></p>
<p>13 March'21: <a href="https://varia.zone/en/fhm-servers-migrations.html" target="_blank">FHM #1 Feminist Hack Meetings: Feminist Servers</a></p>
<p>28 February'21: <a href="https://varia.zone/en/rr-wireless-imagination-2.html" target="_blank">Read &amp; Repair: Wireless Imagination</a></p>
<p>27 June'20: <a href="https://varia.zone/en/corporeal-whispers.html" target="_blank">RE#SISTER: Corporeal Whispers</a></p> <p>29-30 November'21: <a href="https://radioee.net/" target="_blank"> Mirroring the 24hr radio marathon ROOTS </a></p>
<p>19 June'20: <a href="https://varia.zone/en/Groeten_Charlois.html" target="_blank">Niek Hilkmann - Groeten uit Charlois</a></p> <p>29 July'21: <a href="https://vvvvvvaria.org/usercond03.html" target="_blank">The User Condition #03 - met Anaëlle Beignon </a></p>
<p>18 April'20: <a href="https://varia.zone/en/we-hope-this-email.html" target="_blank">We hope this email finds you well</a></p> <p>24 July'21: <a href="https://vvvvvvaria.org/fhm-2.html" target="_blank">Feminist Hack Meetings #2 - Polyphonic Radio Ensemble</a></p>
<p>14 March'20:<a href="https://varia.zone/en/radio-on-radio.html" target="_blank">Radio on the Radio</a></p> <p>12 July'21: <a href="" target="_blank">Waste/d voices and infrastructures</a></p>
</div> <p>12-14 June'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
</div>
<p>11 June'21: <a href="" target="_blank">Ecstatic Speech</a></p>
<p>19-23 May'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
<p>17 May'21: <a href="https://vvvvvvaria.org/usercond02.html" target="_blank">The User Condition #02 - Met Brendan Howell </a></p>
<p>28 March'21: <a href="https://varia.zone/en/rr-sense-full-1.html" target="_blank">Read &amp; Repair</a></p>
<p>23 March'21: <a href="http://varia.zone/en/usercond01.html" target="_blank">User Condition S01E01</a></p>
<p>13 March'21: <a href="https://varia.zone/en/fhm-servers-migrations.html" target="_blank">FHM #1 Feminist Hack Meetings: Feminist Servers</a></p>
<p>28 February'21: <a href="https://varia.zone/en/rr-wireless-imagination-2.html" target="_blank">Read &amp; Repair: Wireless Imagination</a></p>
<p>27 June'20: <a href="https://varia.zone/en/corporeal-whispers.html" target="_blank">RE#SISTER: Corporeal Whispers</a></p>
<p>19 June'20: <a href="https://varia.zone/en/Groeten_Charlois.html" target="_blank">Niek Hilkmann - Groeten uit Charlois</a></p>
<p>18 April'20: <a href="https://varia.zone/en/we-hope-this-email.html" target="_blank">We hope this email finds you well</a></p>
<p>14 March'20:<a href="https://varia.zone/en/radio-on-radio.html" target="_blank">Radio on the Radio</a></p>
</div>
</div>
<div class="live live-flex"> <div class="live live-flex">
@ -108,21 +113,21 @@
<div class="b_allmedia"> <div class="b_allmedia">
<!-- audio streaming or files --> <!-- audio streaming or files -->
<button onclick="hideshowAudio()" class="bhide_chat_off" id="bhide_au">LISTENING <br> LUISTEREN</button> <button onclick="hideshowAudio()" class="show_button" id="button_au">LISTENING <br> LUISTEREN</button>
<!-- image multiple --> <!-- image multiple -->
<button onclick="hideshowGal()" class="bhide_chat_off" id="bhide_gal">GALLERY <br> GALERIJ</button> <button onclick="hideshowGal()" class="show_button" id="button_gal">GALLERY <br> GALERIJ</button>
<!-- video streaming or files -->
<button onclick="hideshowVideo()" class="show_button" id="button_vid">WATCHING <br> KIJKEN</button>
<!-- chat --> <!-- chat -->
<button onclick="hideshowChat()" class="bhide_chat_off" id="bhide_chat">CHATTING <br> CHATTEN</button> <button onclick="hideshowChat()" class="show_button" id="button_chat">CHATTING <br> CHATTEN</button>
<!-- image single -->
<button onclick="hideshowIMG()" class="show_button" id="button_img">IMAGE <br> BEELD</button>
<!-- etherpad--> <!-- etherpad-->
<button onclick="hideshowPad()" class="bhide_chat_off" id="bhide_ether">WRITING <br> SCHRIJVEN</button> <button onclick="hideshowPad()" class="" id="button_ether">WRITING <br> SCHRIJVEN</button>
<!-- jitsi or alike --> <!-- jitsi or alike -->
<button onclick="hideshowJitsi()" class="bhide_chat_off" id="bhide_jit">CALLING <br> BELLEN</button> <button onclick="hideshowJitsi()" class="" id="button_jit">CALLING <br> BELLEN</button>
<!-- PDFs--> <!-- PDFs-->
<button onclick="hideshowEssay()" class="bhide_chat_off" id="bhide_ess">READING <br> LEZING</button> <button onclick="hideshowEssay()" class="" id="button_ess">READING <br> LEZING</button>
<!-- video streaming or files -->
<button onclick="hideshowVideo()" class="bhide_chat_off" id="bhide_vid">WATCHING <br> KIJKEND</button>
<!-- image single -->
<button onclick="hideshowIMG()" class="bhide_chat_off" id="bhide_img">IMAGE <br> BEELD</button>
</div> </div>
@ -135,10 +140,7 @@
<!-- " ♪ . *⁽⁽ ◝꒰´꒳`∗꒱◟ ₎₎₊· * 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ı.♫♪ " -->
<!-- if offline: --> <!-- if offline: -->
<!-- " ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone " --> <marquee scrolldelay="92">" ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone "</marquee>
<!-- <marquee scrolldelay="92">" ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone "</marquee> -->
<!-- AUDIO --> <!-- AUDIO -->
<!-- PLACEHOLDER link: https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3 --> <!-- PLACEHOLDER link: https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3 -->
@ -148,7 +150,9 @@
Your browser does not support the audio element. Try the direct link to the audio below! Your browser does not support the audio element. Try the direct link to the audio below!
</audio> </audio>
<p> <p>
Press play to tune in! It might take a few seconds to load.</p> Press play to tune in! It might take a few seconds to load...<br>
Druk op "play" om te luisteren! Het kan een paar seconden duren voordat je iets hoort...
</p>
<div class="audio-buttons"> <div class="audio-buttons">
<button id="audioButton" class="stream-button b-narrow" onclick="Play()">Play</button> <button id="audioButton" class="stream-button b-narrow" onclick="Play()">Play</button>
<script> <script>
@ -203,19 +207,46 @@
</div> </div>
<!-- VIDEO -->
<!-- PLACEHOLDER link: https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4 -->
<div class="halfscreen" id="showVideo">
<video
id="player"
class="video-js vjs-default-skin"
controls
preload="none"
poster="video-poster.png"
>
<source
src="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4"
type="video/mp4"
/>
</video>
<br>
(<a class="windowlinks" href="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4" target="_blank">direct link to this video</a>)
</div>
<!-- CHAT --> <!-- CHAT -->
<!-- PLACEHOLDER link: https://chat.vvvvvvaria.org/ --> <!-- PLACEHOLDER link: https://chat.vvvvvvaria.org/ -->
<div class="fullscreen chat" id=""> <div class="fullscreen" id="showChat">
<iframe src="https://chat.vvvvvvaria.org/"></iframe><br> <iframe src="https://chat.vvvvvvaria.org/"></iframe><br>
Chat room Chat room
(<a class="windowlinks" href="https://chat.vvvvvvaria.org/" target="_blank">direct link this chat</a>) (<a class="windowlinks" href="https://chat.vvvvvvaria.org/" target="_blank">direct link this chat</a>)
</div> </div>
<!-- IMAGE -->
<!-- PLACEHOLDER link: https://varia.zone/images/de_varia.jpg -->
<figure class="halfscreen" id="showImg">
<img src="https://varia.zone/images/de_varia.jpg">
<br>
(<a class="windowlinks" href="https://varia.zone/images/de_varia.jpg" alt="">link to image</a>)
</figure>
<!-- ETHERPAD --> <!-- ETHERPAD -->
<!-- PLACEHOLDER link: https://pad.vvvvvvaria.org/varia.broadcast.intro <!-- PLACEHOLDER link: https://pad.vvvvvvaria.org/varia.broadcast.intro
PLACEHOLDER desc: Varia Narrowcast Intro--> PLACEHOLDER desc: Varia Narrowcast Intro-->
<div class="fullscreen" id="showEther"> <div class="fullscreen hide" id="showEther">
<iframe src="https://pad.vvvvvvaria.org/varia.broadcast.intro"></iframe><br> <iframe src="https://pad.vvvvvvaria.org/varia.broadcast.intro"></iframe><br>
Live transcriptions pad Live transcriptions pad
(<a class="windowlinks" href="https://pad.vvvvvvaria.org/varia.broadcast.intro" target="_blank">direct link to this pad</a>) (<a class="windowlinks" href="https://pad.vvvvvvaria.org/varia.broadcast.intro" target="_blank">direct link to this pad</a>)
@ -223,66 +254,27 @@
<!-- JITSI --> <!-- JITSI -->
<!-- PLACEHOLDER link: https://meet.jit.si/varia.broadcats --> <!-- PLACEHOLDER link: https://meet.jit.si/varia.example -->
<div class="halfscreen hide" id="showJit"> <div class="fullscreen hide" id="showJit">
<iframe src="https://meet.jit.si/varia.broadcats" width="640" height="480" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen>
</iframe>
<br>
<a class="windowlinks" href="" target="_blank"> direct link to ↬ Jitsi</a>
</div>
<!-- Jitsi for use -->
<!-- PLACEHOLDER link: https://meet.jit.si/varia.example -->
<div class="fullscreen" id="showJit">
<iframe src="https://meet.jit.si/varia.example" allow="camera; microphone" width="640" height="800" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen> <iframe src="https://meet.jit.si/varia.example" allow="camera; microphone" width="640" height="800" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen>
</iframe> </iframe>
<br> <br>
<a class="windowlinks" href="https://meet.jit.si/varia.example" target="_blank"> direct link to ↬ Jitsi</a> (<a class="windowlinks" href="https://meet.jit.si/varia.example" target="_blank">direct link to this Jitsi room</a>)
</div> </div>
<!-- ESSAY --> <!-- ESSAY -->
<!-- PLACEHOLDER link: https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html --> <!-- PLACEHOLDER link: https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html -->
<div class="halfscreen hide" id="showEssay"> <div class="halfscreen hide" id="showEssay">
<iframe src="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html"></iframe><br> <iframe src="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html"></iframe><br>
<a class="windowlinks" href="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html" target="_blank">direct link to text</a> (<a class="windowlinks" href="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html" target="_blank">direct link to text</a>)
</div> </div>
<!-- here is an example if you would like to add an iframe --> <!-- here is an example if you would like to add an iframe -->
<!-- <iframe class="halfscreen hide" id="showEssay" src="https://loading.vvvvvvaria.org" width="600" height="680" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen></iframe> --> <!-- <iframe class="halfscreen hide" id="showEssay" src="https://loading.vvvvvvaria.org" width="600" height="680" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen></iframe> -->
<!-- IMAGE -->
<!-- PLACEHOLDER link: https://varia.zone/images/de_varia.jpg -->
<figure class="halfscreen" id="showImg">
<img src="https://varia.zone/images/de_varia.jpg">
<br>
<a class="windowlinks" href="https://varia.zone/images/de_varia.jpg" alt=""> caption: ↬ link to .jpg</a>
</figure>
<!-- VIDEO -->
<!-- PLACEHOLDER link: https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4 -->
<div class="fullscreen hide" id="showVideo">
<video
id="player"
class="video-js vjs-default-skin"
controls
preload="none"
>
<source
src="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4"
type="video/mp4"
/>
</video>
<br>
<a class="windowlinks" href="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4" target="_blank"> ↬ direct link to video </a>
</div>
<script type="text/javascript" src="narrowscripts.js"></script>
</body> </body>
<script type="text/javascript" src="narrowscripts.js"></script>
</html> </html>

388
index.html

@ -26,84 +26,85 @@
<div id="side" class="sidebar sidemin"> <div id="side" class="sidebar sidemin">
<button class="minimize" onclick="fside()"></button> <button class="minimize" onclick="fside()"></button>
<div class="sidetop"> <div class="sidetop">
<!-- ADD A FUTURE EVENT HERE --> <!-- ADD A FUTURE EVENT HERE -->
<!-- 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>more TBA soon! <a href="https://varia.zone/en" target="_blank" > &#128064; </a> <br> meer 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 NOW ⇶ </p> --> <!-- <p id="livetitle">LIVE NOW ⇶ </p> -->
<!-- <p><br>MONTH XX, XXXX<br>(time): <a href="XXX" target="_blank"><span id="livetitle">XXX</span></a><br><br></p> --> <!-- <p><br>MONTH XX, XXXX<br>(time): <a href="XXX" target="_blank"><span id="livetitle">XXX</span></a><br><br></p> -->
<!-- ADD A CURRENT LIVE EVENT HERE --> <!-- ADD A CURRENT LIVE EVENT HERE -->
<p id="livetitle">LIVE NOW ⇶ </p> <!-- <p id="livetitle">LIVE NOW ⇶ </p> -->
<p><br>November 4th, 2022<br> 19:00 (CEST): <a href="https://vvvvvvaria.org/en/5y-varia.html" target="_blank"><span id="livetitle">5 year anniVARIAssary! </span></a><br><br></p> <p>⇊ Previous broadcasts<br>⇊ Vorige uitzendingen </p>
<p>⇊ Previous broadcasts<br>⇊ Vorige uitzendingen </p>
<p> <a href="https://vvvvvvaria.org/archive/">Archive</a></p> <p><br>(<a href="https://vvvvvvaria.org/archive/">Archive/Archief</a>)</p>
</div> </div>
<div class="sidebottom"> <div class="sidebottom">
<p>October 21st, 2022<br>20:00-21:00 (CEST): <a href="https://varia.zone/radio-activity.html" target="_blank"><span id="">Radio Activity - I smell Patchouli</span></a></p> <p><br>November 4th, 2022<br> 19:00 (CEST): <a href="https://vvvvvvaria.org/en/5y-varia.html" target="_blank"><span id="">5 year anniVARIAssary! </span></a></p>
<p><br>October 5th, 2022<br>18:00-19:00 (CEST): <a href="https://varia.zone/en/publishing-partyline.html" target="_blank"><span id="">Publishing Partyline, Broadcast #3: web-to-print in education, with Julien Bidoret & Quentin Juhel</span></a><br><br></p> <p>October 21st, 2022<br>20:00-21:00 (CEST): <a href="https://varia.zone/radio-activity.html" target="_blank"><span id="">Radio Activity - I smell Patchouli</span></a></p>
<p>September 29th-30th, Sonic Liberation Front, Women Life Freedom<a href="https://cloud.disroot.org/apps/files_sharing/publicpreview/wFzqNR8yrHidif3?x=1080&y=1125&a=true&file=IMG_20220929_142643_959.jpg&scalingup=0" target="_blank"></a></p> <p><br>October 5th, 2022<br>18:00-19:00 (CEST): <a href="https://varia.zone/en/publishing-partyline.html" target="_blank"><span id="">Publishing Partyline, Broadcast #3: web-to-print in education, with Julien Bidoret & Quentin Juhel</span></a><br><br></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>September 29th-30th, Sonic Liberation Front, Women Life Freedom<a href="https://cloud.disroot.org/apps/files_sharing/publicpreview/wFzqNR8yrHidif3?x=1080&y=1125&a=true&file=IMG_20220929_142643_959.jpg&scalingup=0" target="_blank"></a></p>
<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>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>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>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>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>17 December '21: <a href="http://varia.zone/en/double-launch-si16-and-vernaculars-come-to-matter.html" target="_blank">Double publication launch: <em>Learning How to Walk While Catwalking</em> and <em>Vernaculars come to matter</em></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>17 December '21: <a href="https://vvvvvvaria.org/archive/2021-12-17_Radio_Activity_Wireless_Orchestra/" target="_blank" >Radio Activity ↝ a Wireless Orchestra ↜ </a></p> <p>17 December '21: <a href="http://varia.zone/en/double-launch-si16-and-vernaculars-come-to-matter.html" target="_blank">Double publication launch: <em>Learning How to Walk While Catwalking</em> and <em>Vernaculars come to matter</em></a></p>
<p>5 December '21: <a href="http://varia.zone/en/cc-nlcl-tales.html" target="_blank">Ch◦re◦graphing C◦ding ↝ tales from real-time collaborative audio-visual coding ↜ </a></p> <p>17 December '21: <a href="https://vvvvvvaria.org/archive/2021-12-17_Radio_Activity_Wireless_Orchestra/" target="_blank" >Radio Activity ↝ a Wireless Orchestra ↜ </a></p>
<p>29-30 November'21: <a href="https://radioee.net/" target="_blank"> Mirroring the 24hr radio marathon ROOTS </a></p> <p>5 December '21: <a href="http://varia.zone/en/cc-nlcl-tales.html" target="_blank">Ch◦re◦graphing C◦ding ↝ tales from real-time collaborative audio-visual coding ↜ </a></p>
<p>29 July'21: <a href="https://vvvvvvaria.org/usercond03.html" target="_blank">The User Condition #03 - met Anaëlle Beignon </a></p>
<p>24 July'21: <a href="https://vvvvvvaria.org/fhm-2.html" target="_blank">Feminist Hack Meetings #2 - Polyphonic Radio Ensemble</a></p>
<p>12 July'21: <a href="" target="_blank">Waste/d voices and infrastructures</a></p>
<p>12-14 June'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
<p>11 June'21: <a href="" target="_blank">Ecstatic Speech</a></p>
<p>19-23 May'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
<p>17 May'21: <a href="https://vvvvvvaria.org/usercond02.html" target="_blank">The User Condition #02 - Met Brendan Howell </a></p>
<p>28 March'21: <a href="https://varia.zone/en/rr-sense-full-1.html" target="_blank">Read &amp; Repair</a></p>
<p>23 March'21: <a href="http://varia.zone/en/usercond01.html" target="_blank">User Condition S01E01</a></p>
<p>13 March'21: <a href="https://varia.zone/en/fhm-servers-migrations.html" target="_blank">FHM #1 Feminist Hack Meetings: Feminist Servers</a></p>
<p>28 February'21: <a href="https://varia.zone/en/rr-wireless-imagination-2.html" target="_blank">Read &amp; Repair: Wireless Imagination</a></p>
<p>27 June'20: <a href="https://varia.zone/en/corporeal-whispers.html" target="_blank">RE#SISTER: Corporeal Whispers</a></p> <p>29-30 November'21: <a href="https://radioee.net/" target="_blank"> Mirroring the 24hr radio marathon ROOTS </a></p>
<p>19 June'20: <a href="https://varia.zone/en/Groeten_Charlois.html" target="_blank">Niek Hilkmann - Groeten uit Charlois</a></p> <p>29 July'21: <a href="https://vvvvvvaria.org/usercond03.html" target="_blank">The User Condition #03 - met Anaëlle Beignon </a></p>
<p>18 April'20: <a href="https://varia.zone/en/we-hope-this-email.html" target="_blank">We hope this email finds you well</a></p> <p>24 July'21: <a href="https://vvvvvvaria.org/fhm-2.html" target="_blank">Feminist Hack Meetings #2 - Polyphonic Radio Ensemble</a></p>
<p>14 March'20:<a href="https://varia.zone/en/radio-on-radio.html" target="_blank">Radio on the Radio</a></p> <p>12 July'21: <a href="" target="_blank">Waste/d voices and infrastructures</a></p>
</div> <p>12-14 June'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
</div>
<p>11 June'21: <a href="" target="_blank">Ecstatic Speech</a></p>
<p>19-23 May'21: <a href="https://vvvvvvaria.org/archive/2021-05-20-Sonic-Liberation-Front" target="_blank">Mirroring Radio Alhara: Sonic Liberation Front</a></p>
<p>17 May'21: <a href="https://vvvvvvaria.org/usercond02.html" target="_blank">The User Condition #02 - Met Brendan Howell </a></p>
<p>28 March'21: <a href="https://varia.zone/en/rr-sense-full-1.html" target="_blank">Read &amp; Repair</a></p>
<p>23 March'21: <a href="http://varia.zone/en/usercond01.html" target="_blank">User Condition S01E01</a></p>
<p>13 March'21: <a href="https://varia.zone/en/fhm-servers-migrations.html" target="_blank">FHM #1 Feminist Hack Meetings: Feminist Servers</a></p>
<p>28 February'21: <a href="https://varia.zone/en/rr-wireless-imagination-2.html" target="_blank">Read &amp; Repair: Wireless Imagination</a></p>
<p>27 June'20: <a href="https://varia.zone/en/corporeal-whispers.html" target="_blank">RE#SISTER: Corporeal Whispers</a></p>
<p>19 June'20: <a href="https://varia.zone/en/Groeten_Charlois.html" target="_blank">Niek Hilkmann - Groeten uit Charlois</a></p>
<p>18 April'20: <a href="https://varia.zone/en/we-hope-this-email.html" target="_blank">We hope this email finds you well</a></p>
<p>14 March'20:<a href="https://varia.zone/en/radio-on-radio.html" target="_blank">Radio on the Radio</a></p>
</div>
</div>
<div class="live live-flex"> <div class="live live-flex">
@ -112,21 +113,21 @@
<div class="b_allmedia"> <div class="b_allmedia">
<!-- audio streaming or files --> <!-- audio streaming or files -->
<button onclick="hideshowAudio()" class="" id="bhide_au">LISTENING <br> LUISTEREN</button> <button onclick="hideshowAudio()" class="show_button" id="button_au">LISTENING <br> LUISTEREN</button>
<!-- image multiple --> <!-- image multiple -->
<button onclick="hideshowGal()" class="" id="bhide_gal">GALLERY <br> GALERIJ</button> <button onclick="hideshowGal()" class="show_button" id="button_gal">GALLERY <br> GALERIJ</button>
<!-- video streaming or files -->
<button onclick="hideshowVideo()" class="show_button" id="button_vid">WATCHING <br> KIJKEN</button>
<!-- chat --> <!-- chat -->
<button onclick="hideshowChat()" class="" id="bhide_chat">CHATTING <br> CHATTEN</button> <button onclick="hideshowChat()" class="show_button" id="button_chat">CHATTING <br> CHATTEN</button>
<!-- image single -->
<button onclick="hideshowIMG()" class="show_button" id="button_img">IMAGE <br> BEELD</button>
<!-- etherpad--> <!-- etherpad-->
<button onclick="hideshowPad()" class="bhide_chat_off" id="bhide_ether">WRITING <br> SCHRIJVEN</button> <button onclick="hideshowPad()" class="" id="button_ether">WRITING <br> SCHRIJVEN</button>
<!-- jitsi or alike --> <!-- jitsi or alike -->
<button onclick="hideshowJitsi()" class="bhide_chat_off" id="bhide_jit">CALLING <br> BELLEN</button> <button onclick="hideshowJitsi()" class="" id="button_jit">CALLING <br> BELLEN</button>
<!-- PDFs--> <!-- PDFs-->
<button onclick="hideshowEssay()" class="bhide_chat_off" id="bhide_ess">READING <br> LEZING</button> <button onclick="hideshowEssay()" class="" id="button_ess">READING <br> LEZING</button>
<!-- video streaming or files -->
<button onclick="hideshowVideo()" class="bhide_chat_off" id="bhide_vid">WATCHING <br> KIJKEND</button>
<!-- image single -->
<button onclick="hideshowIMG()" class="" id="bhide_img">IMAGE <br> BEELD</button>
</div> </div>
@ -139,20 +140,19 @@
<!-- " ♪ . *⁽⁽ ◝꒰´꒳`∗꒱◟ ₎₎₊· * 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ı.♫♪ " -->
<!-- if offline: --> <!-- if offline: -->
<!-- " ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone " --> <marquee scrolldelay="92">" ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone "</marquee>
<!-- <marquee scrolldelay="92">" ♬ ¨ * • WELCOME TO THE VARIA NARROWCAST • ♬ °¸. there is currently no event happening, please check our agenda @ varia.zone "</marquee> -->
<!-- AUDIO --> <!-- AUDIO -->
<!-- PLACEHOLDER link: https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3 --> <!-- PLACEHOLDER link: https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3 -->
<div class="audio-stream fullscreen" id="showAudio"> <div class="audio-stream fullscreen" id="showAudio">
<audio id="player" preload="none"> <audio id="player" preload="none">
<source src="https://voice.vvvvvvaria.org/narrowcast" type="audio/mpeg"> <source src="https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3 " type="audio/mpeg">
Your browser does not support the audio element. Try the direct link to the audio below! Your browser does not support the audio element. Try the direct link to the audio below!
</audio> </audio>
<p> <p>
Press play to tune in! It might take a few seconds to load.</p> Press play to tune in! It might take a few seconds to load...<br>
Druk op "play" om te luisteren! Het kan een paar seconden duren voordat je iets hoort...
</p>
<div class="audio-buttons"> <div class="audio-buttons">
<button id="audioButton" class="stream-button b-narrow" onclick="Play()">Play</button> <button id="audioButton" class="stream-button b-narrow" onclick="Play()">Play</button>
<script> <script>
@ -174,179 +174,79 @@
<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>
</div> </div>
<span class="audio-link">(<a class="windowlinks" href="https://voice.vvvvvvaria.org/narrowcast" target="_blank">direct link to audio</a>)</span> <span class="audio-link">(<a class="windowlinks" href="https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3" target="_blank">direct link to audio</a>)</span>
</div> </div>
<!-- CHAT -->
<!-- PLACEHOLDER link: https://chat.vvvvvvaria.org/ -->
<div class="halfscreen chat" id="">
<iframe src="https://chat.vvvvvvaria.org/"></iframe><br>
Chat room
(<a class="windowlinks" href="https://chat.vvvvvvaria.org/" target="_blank">direct link this chat</a>)
</div>
<!-- IMAGE -->
<!-- PLACEHOLDER link: https://varia.zone/images/de_varia.jpg -->
<figure class="halfscreen" id="showImg">
<img src="https://vvvvvvaria.org/images/varia_birthday_poster4_small_for_website.jpg">
<br>
<a class="windowlinks" href="https://vvvvvvaria.org/images/varia_birthday_poster4_small_for_website.jpg" alt=""> caption: ↬ link to .jpg</a>
</figure>
<!-- IMAGE GALLERY --> <!-- IMAGE GALLERY -->
<!-- PLACEHOLDER links: <!-- PLACEHOLDER links:
https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/a_safe_image.php.jpeg https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/a_safe_image.php.jpeg
https://vvvvvvaria.org/archive/varia-server/7e920c7f_Screenshot%20from%202020-03-21%2019-07-20.png https://vvvvvvaria.org/archive/varia-server/7e920c7f_Screenshot%20from%202020-03-21%2019-07-20.png
https://vvvvvvaria.org/archive/varia-server/varia-home-red.png https://vvvvvvaria.org/archive/varia-server/varia-home-red.png
https://vvvvvvaria.org/archive/varia-server/welcome.png https://vvvvvvaria.org/archive/varia-server/welcome.png -->
https://varia.zone/images/de_varia.jpg
-->
<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="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/y22fbtD7e5oj6pa?x=1854&y=483&a=true&file=2ba8bb88_WhatsApp%2520Image%25202021-07-19%2520at%252022.23.28.jpeg&scalingup=0"><br> <img alt="XXX" src="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/a_safe_image.php.jpeg"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/y22fbtD7e5oj6pa?x=1854&y=483&a=true&file=2ba8bb88_WhatsApp%2520Image%25202021-07-19%2520at%252022.23.28.jpeg&scalingup=0" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/a_safe_image.php.jpeg" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/JLKdLfWCjWRcQof?x=1854&y=483&a=true&file=varia-cake.jpeg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/JLKdLfWCjWRcQof?x=1854&y=483&a=true&file=varia-cake.jpeg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/7fAQFXbsnW4pNCk?x=1854&y=483&a=true&file=a51b9f01_8c0fd11f_t8GolReeSYOkT-o_TpBpxA.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/7fAQFXbsnW4pNCk?x=1854&y=483&a=true&file=a51b9f01_8c0fd11f_t8GolReeSYOkT-o_TpBpxA.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/JZwW3En4ogy3Gkm?x=1854&y=483&a=true&file=6bfee521_kQkxMYnVSl-QcZY9c292nA.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/JZwW3En4ogy3Gkm?x=1854&y=483&a=true&file=6bfee521_kQkxMYnVSl-QcZY9c292nA.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/J8GzjHBie78R6Tx?x=1854&y=483&a=true&file=3d0cfff4_20220308_145038.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/J8GzjHBie78R6Tx?x=1854&y=483&a=true&file=3d0cfff4_20220308_145038.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/8cnFtmwotHD44Bw?x=1854&y=483&a=true&file=3d427b57_2BuZF_Y8SwSu_mwwX-Z7Bg.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/8cnFtmwotHD44Bw?x=1854&y=483&a=true&file=3d427b57_2BuZF_Y8SwSu_mwwX-Z7Bg.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/9B3AzBY3o6MYbYf?x=1854&y=483&a=true&file=2d748633_-Vk_xkgXT5az2Rdxrcrv2w.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/9B3AzBY3o6MYbYf?x=1854&y=483&a=true&file=2d748633_-Vk_xkgXT5az2Rdxrcrv2w.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/NWKLeBNpK6NiymT?x=1854&y=483&a=true&file=daf71d07-25b9-4e1b-bc00-a9b3d5b3b336.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/NWKLeBNpK6NiymT?x=1854&y=483&a=true&file=daf71d07-25b9-4e1b-bc00-a9b3d5b3b336.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/4QBJoCgQrBt4zCc?x=1854&y=483&a=true&file=d7dd0e88-2a90-44bc-82f5-a8d70699b66d.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/4QBJoCgQrBt4zCc?x=1854&y=483&a=true&file=d7dd0e88-2a90-44bc-82f5-a8d70699b66d.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/FpJ2x8ot6iiHM8G?x=1854&y=483&a=true&file=8c9ade04-df6f-4f5e-869d-1c87fe7faae7.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/FpJ2x8ot6iiHM8G?x=1854&y=483&a=true&file=8c9ade04-df6f-4f5e-869d-1c87fe7faae7.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/ZGoKBE3KHcji4HZ?x=1854&y=483&a=true&file=20210831_232413.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/ZGoKBE3KHcji4HZ?x=1854&y=483&a=true&file=20210831_232413.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/aAEzK5F7eEzNaoa?x=1854&y=483&a=true&file=04043fb8-fde3-482a-a93d-07bda6dd181f.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/aAEzK5F7eEzNaoa?x=1854&y=483&a=true&file=04043fb8-fde3-482a-a93d-07bda6dd181f.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure> <figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/qxiiQidGM22EwWZ?x=1854&y=483&a=true&file=5dd51c9a-c433-424f-858e-83f30d96af36.jpg&scalingup=0"><br> <img alt="XXX" src="https://vvvvvvaria.org/archive/00-varia-server/7e920c7f_Screenshot%20from%202020-03-21%2019-07-20.png"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/qxiiQidGM22EwWZ?x=1854&y=483&a=true&file=5dd51c9a-c433-424f-858e-83f30d96af36.jpg&scalingup=0" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="https://vvvvvvaria.org/archive/00-varia-server/7e920c7f_Screenshot%20from%202020-03-21%2019-07-20.png" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure> <figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/f4RWB7Kb2g6Gtf9?x=1854&y=483&a=true&file=b164abaa_VEhuEEQfRrmN2sPdAlE9Og.jpg&scalingup=0"><br> <img alt="XXX" src="https://vvvvvvaria.org/archive/00-varia-server/varia-home-red.png"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/f4RWB7Kb2g6Gtf9?x=1854&y=483&a=true&file=b164abaa_VEhuEEQfRrmN2sPdAlE9Og.jpg&scalingup=0" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="https://vvvvvvaria.org/archive/00-varia-server/varia-home-red.png" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure> <figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/yjjNmpymjmyrLBk?x=1854&y=483&a=true&file=7a99f19d_TatmrYdeRCWjjri-m6jAKA.jpg&scalingup=0"><br> <img alt="XXX" src="https://vvvvvvaria.org/archive/00-varia-server/welcome.png"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/yjjNmpymjmyrLBk?x=1854&y=483&a=true&file=7a99f19d_TatmrYdeRCWjjri-m6jAKA.jpg&scalingup=0" target="_blank" alt="">link to image</a>) (<a class="windowlinks" href="https://vvvvvvaria.org/archive/00-varia-server/welcome.png" target="_blank" alt="">link to image</a>)
</figure> </figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/i3qog4gnxcdazQy?x=1854&y=483&a=true&file=549e1a4d_IMG_1698.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/i3qog4gnxcdazQy?x=1854&y=483&a=true&file=549e1a4d_IMG_1698.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://vvvvvvaria.org/archive/2020-20XX-Feminist-Hack-Meetings/FHM3_Screenshot%20from%202021-11-06%2014-41-08.png"><br>
(<a class="windowlinks" href="https://vvvvvvaria.org/archive/2020-20XX-Feminist-Hack-Meetings/FHM3_Screenshot%20from%202021-11-06%2014-41-08.png" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/22RKenTnfxmnTCW?x=1854&y=483&a=true&file=*-7.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/22RKenTnfxmnTCW?x=1854&y=483&a=true&file=*-7.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/m8t7Q7Z7jQ8ccaE?x=1854&y=483&a=true&file=9k%253D(1).jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/m8t7Q7Z7jQ8ccaE?x=1854&y=483&a=true&file=9k%253D(1).jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/gm5SyaFqX6fZwQk?x=1854&y=483&a=true&file=abcc8080-4bcc-4372-953c-b5d155b6328d.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/gm5SyaFqX6fZwQk?x=1854&y=483&a=true&file=abcc8080-4bcc-4372-953c-b5d155b6328d.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://vvvvvvaria.org/logs/atnofs-varia/image/WQFDd5seRcqPrfWaa8tUbg.jpg"><br>
(<a class="windowlinks" href="https://vvvvvvaria.org/logs/atnofs-varia/image/WQFDd5seRcqPrfWaa8tUbg.jpg" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://vvvvvvaria.org/logs/atnofs-varia/image/K_yAUHDUTfGV2uUgK7Lgkg.jpg"><br>
(<a class="windowlinks" href="https://vvvvvvaria.org/logs/atnofs-varia/image/K_yAUHDUTfGV2uUgK7Lgkg.jpg" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/EBFMH7prDTxSLNW?x=1854&y=483&a=true&file=IMG_0068.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/EBFMH7prDTxSLNW?x=1854&y=483&a=true&file=IMG_0068.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/sTjDfxwAFeHPp5i?x=1854&y=483&a=true&file=IMG_0087.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/sTjDfxwAFeHPp5i?x=1854&y=483&a=true&file=IMG_0087.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/m3K4WkKm7Bojmo5?x=1854&y=483&a=true&file=IMG_0094.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/m3K4WkKm7Bojmo5?x=1854&y=483&a=true&file=IMG_0094.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/zX7TDk4FEFWqZzs?x=1854&y=483&a=true&file=2Q%253D%253D(2).jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/zX7TDk4FEFWqZzs?x=1854&y=483&a=true&file=2Q%253D%253D(2).jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://vvvvvvaria.org/~lain/mosquito_hunting/walks/IMG_4555.jpg"><br>
(<a class="windowlinks" href="https://vvvvvvaria.org/~lain/mosquito_hunting/walks/IMG_4555.jpg" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/yt8AWmasYwAG2cP?x=1854&y=483&a=true&file=a5684370-4723-45a6-b5ae-a670eecd6886.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/yt8AWmasYwAG2cP?x=1854&y=483&a=true&file=a5684370-4723-45a6-b5ae-a670eecd6886.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
<figure>
<img alt="XXX" src="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/zKLBXxjywnZiXDj?x=1854&y=483&a=true&file=f8a989da-6f50-430a-87e3-575d309ab6f4.jpg&scalingup=0"><br>
(<a class="windowlinks" href="https://cloud.vvvvvvaria.org/apps/files_sharing/publicpreview/zKLBXxjywnZiXDj?x=1854&y=483&a=true&file=f8a989da-6f50-430a-87e3-575d309ab6f4.jpg&scalingup=0" target="_blank" alt="">link to image</a>)
</figure>
</div> </div>
<!-- VIDEO -->
<!-- PLACEHOLDER link: https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4 -->
<div class="halfscreen" id="showVideo">
<video
id="player"
class="video-js vjs-default-skin"
controls
preload="none"
poster="video-poster.png"
>
<source
src="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4"
type="video/mp4"
/>
</video>
<br>
(<a class="windowlinks" href="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4" target="_blank">direct link to this video</a>)
</div>
<!-- CHAT -->
<!-- PLACEHOLDER link: https://chat.vvvvvvaria.org/ -->
<div class="fullscreen" id="showChat">
<iframe src="https://chat.vvvvvvaria.org/"></iframe><br>
Chat room
(<a class="windowlinks" href="https://chat.vvvvvvaria.org/" target="_blank">direct link this chat</a>)
</div>
<!-- IMAGE -->
<!-- PLACEHOLDER link: https://varia.zone/images/de_varia.jpg -->
<figure class="halfscreen" id="showImg">
<img src="https://varia.zone/images/de_varia.jpg">
<br>
(<a class="windowlinks" href="https://varia.zone/images/de_varia.jpg" alt="">link to image</a>)
</figure>
<!-- ETHERPAD --> <!-- ETHERPAD -->
<!-- PLACEHOLDER link: https://pad.vvvvvvaria.org/varia.broadcast.intro <!-- PLACEHOLDER link: https://pad.vvvvvvaria.org/varia.broadcast.intro
PLACEHOLDER desc: Varia Narrowcast Intro--> PLACEHOLDER desc: Varia Narrowcast Intro-->
<div class="halfscreen hide" id="showEther"> <div class="fullscreen hide" id="showEther">
<iframe src="https://pad.vvvvvvaria.org/varia.broadcast.intro"></iframe><br> <iframe src="https://pad.vvvvvvaria.org/varia.broadcast.intro"></iframe><br>
Live transcriptions pad Live transcriptions pad
(<a class="windowlinks" href="https://pad.vvvvvvaria.org/varia.broadcast.intro" target="_blank">direct link to this pad</a>) (<a class="windowlinks" href="https://pad.vvvvvvaria.org/varia.broadcast.intro" target="_blank">direct link to this pad</a>)
@ -354,57 +254,27 @@
<!-- JITSI --> <!-- JITSI -->
<!-- PLACEHOLDER link: https://meet.jit.si/varia.broadcats --> <!-- PLACEHOLDER link: https://meet.jit.si/varia.example -->
<div class="halfscreen hide" id="showJit"> <div class="fullscreen hide" id="showJit">
<iframe src="https://meet.jit.si/varia.broadcats" width="640" height="480" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen>
</iframe>
<br>
<a class="windowlinks" href="" target="_blank"> direct link to ↬ Jitsi</a>
</div>
<!-- Jitsi for use -->
<!-- PLACEHOLDER link: https://meet.jit.si/varia.example -->
<!-- <div class="fullscreen hide" id="showJit">
<iframe src="https://meet.jit.si/varia.example" allow="camera; microphone" width="640" height="800" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen> <iframe src="https://meet.jit.si/varia.example" allow="camera; microphone" width="640" height="800" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen>
</iframe> </iframe>
<br> <br>
<a class="windowlinks" href="https://meet.jit.si/varia.example" target="_blank"> direct link to ↬ Jitsi</a> (<a class="windowlinks" href="https://meet.jit.si/varia.example" target="_blank">direct link to this Jitsi room</a>)
</div>--> </div>
<!-- ESSAY --> <!-- ESSAY -->
<!-- PLACEHOLDER link: https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html --> <!-- PLACEHOLDER link: https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html -->
<div class="halfscreen hide" id="showEssay"> <div class="halfscreen hide" id="showEssay">
<iframe src="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html"></iframe><br> <iframe src="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html"></iframe><br>
<a class="windowlinks" href="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html" target="_blank">direct link to text</a> (<a class="windowlinks" href="https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html" target="_blank">direct link to text</a>)
</div> </div>
<!-- here is an example if you would like to add an iframe --> <!-- here is an example if you would like to add an iframe -->
<!-- <iframe class="halfscreen hide" id="showEssay" src="https://loading.vvvvvvaria.org" width="600" height="680" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen></iframe> --> <!-- <iframe class="halfscreen hide" id="showEssay" src="https://loading.vvvvvvaria.org" width="600" height="680" frameborder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen></iframe> -->
<!-- VIDEO -->
<!-- PLACEHOLDER link: https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4 -->
<div class="fullscreen hide" id="showVideo">
<video
id="player"
class="video-js vjs-default-skin"
controls
preload="none"
>
<source
src="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4"
type="video/mp4"
/>
</video>
<br>
<a class="windowlinks" href="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/tv-varia.mp4" target="_blank"> ↬ direct link to video </a>
</div>
<script type="text/javascript" src="narrowscripts.js"></script>
</body> </body>
<script type="text/javascript" src="narrowscripts.js"></script>
</html> </html>

87
narrowscripts.js

@ -1,38 +1,41 @@
// SCRIPTS FOR THE NEW AUDIO PLAYER // SCRIPTS FOR THE NEW AUDIO PLAYER
(function(){ // edit: mb turned the audio player code to make it work on iOS in September 2022
// commenting out the function below...
function waitForIt(selector, time) { // (function(){
if(document.querySelector(selector)!=null) {
var chat_title = document.getElementsByClassName("chatbox-title__text")[0]; // function waitForIt(selector, time) {
var element = document.createElement("span"); // if(document.querySelector(selector)!=null) {
element.innerHTML = '<audio id="player" preload="none" src="http://w-i-t-m.net:8001/radiodrama"></audio><div><button onclick="document.getElementById(\'player\').play()">Play</button><button onclick="document.getElementById(\'player\').pause();document.getElementById(\'player\').src=document.getElementById(\'player\').src;">Stop</button><button onclick="document.getElementById(\'player\').volume += 0.1">Vol +</button><button onclick="document.getElementById(\'player\').volume -= 0.1">Vol -</button></div>'; // var chat_title = document.getElementsByClassName("chatbox-title__text")[0];
// var element = document.createElement("span");
chat_title.insertAdjacentElement('afterend', element); // element.innerHTML = '<audio id="player" preload="none" src="http://w-i-t-m.net:8001/radiodrama"></audio><div><button onclick="document.getElementById(\'player\').play()">Play</button><button onclick="document.getElementById(\'player\').pause();document.getElementById(\'player\').src=document.getElementById(\'player\').src;">Stop</button><button onclick="document.getElementById(\'player\').volume += 0.1">Vol +</button><button onclick="document.getElementById(\'player\').volume -= 0.1">Vol -</button></div>';
return; // chat_title.insertAdjacentElement('afterend', element);
}
else {
setTimeout(function() {
waitForIt(selector, time); // return;
// }
// else {
// setTimeout(function() {
}, time); // waitForIt(selector, time);
}
} // }, time);
// }
// }
waitForIt(".toggle-smiley", 1000); // waitForIt(".toggle-smiley", 1000);
})(); // })();
$(function() { // $(function() {
console.log("PARENT READY"); // console.log("PARENT READY");
$("iframe").on("load", function(){ // $("iframe").on("load", function(){
console.log("LOADED"); // console.log("LOADED");
$(this).contents().find('.kiwi-startup-common').hide(); // $(this).contents().find('.kiwi-startup-common').hide();
}); // });
}); // });
// SCRIPT for button to hide side pannel --> // SCRIPT for button to hide side pannel -->
@ -64,8 +67,8 @@ $(function() {
var elwel = document.getElementById("showWel"); var elwel = document.getElementById("showWel");
elwel.classList.toggle("hide"); elwel.classList.toggle("hide");
var bwel = document.getElementById("bhide_wel"); var bwel = document.getElementById("button_wel");
bwel.classList.toggle("bhide_chat_off") bwel.classList.toggle("show_button")
we = document.getElementById("showWel"); we = document.getElementById("showWel");
we.scrollIntoView(); we.scrollIntoView();
@ -75,8 +78,8 @@ $(function() {
var elchat = document.getElementById("showChat"); var elchat = document.getElementById("showChat");
elchat.classList.toggle("hide"); elchat.classList.toggle("hide");
var bchat = document.getElementById("bhide_chat"); var bchat = document.getElementById("button_chat");
bchat.classList.toggle("bhide_chat_off") bchat.classList.toggle("show_button")
cha = document.getElementById("showChat"); cha = document.getElementById("showChat");
cha.scrollIntoView(); cha.scrollIntoView();
@ -86,8 +89,8 @@ $(function() {
var elether = document.getElementById("showEther"); var elether = document.getElementById("showEther");
elether.classList.toggle("hide"); elether.classList.toggle("hide");
var bether = document.getElementById("bhide_ether"); var bether = document.getElementById("button_ether");
bether.classList.toggle("bhide_chat_off") bether.classList.toggle("show_button")
eth = document.getElementById("showEther"); eth = document.getElementById("showEther");
eth.scrollIntoView(); eth.scrollIntoView();
@ -98,8 +101,8 @@ $(function() {
var elau = document.getElementById("showAudio"); var elau = document.getElementById("showAudio");
elau.classList.toggle("hide"); elau.classList.toggle("hide");
var bau = document.getElementById("bhide_au"); var bau = document.getElementById("button_au");
bau.classList.toggle("bhide_chat_off") bau.classList.toggle("show_button")
au = document.getElementById("showAudio"); au = document.getElementById("showAudio");
au.scrollIntoView(); au.scrollIntoView();
@ -111,8 +114,8 @@ $(function() {
var eljit = document.getElementById("showJit"); var eljit = document.getElementById("showJit");
eljit.classList.toggle("hide"); eljit.classList.toggle("hide");
var bjit = document.getElementById("bhide_jit"); var bjit = document.getElementById("button_jit");
bjit.classList.toggle("bhide_chat_off") bjit.classList.toggle("show_button")
jit = document.getElementById("showJit"); jit = document.getElementById("showJit");
jit.scrollIntoView(); jit.scrollIntoView();
@ -123,8 +126,8 @@ $(function() {
var eless = document.getElementById("showEssay"); var eless = document.getElementById("showEssay");
eless.classList.toggle("hide"); eless.classList.toggle("hide");
var bess = document.getElementById("bhide_ess"); var bess = document.getElementById("button_ess");
bess.classList.toggle("bhide_chat_off") bess.classList.toggle("show_button")
ess = document.getElementById("showEssay"); ess = document.getElementById("showEssay");
ess.scrollIntoView(); ess.scrollIntoView();
@ -135,8 +138,8 @@ $(function() {
var elvid = document.getElementById("showVideo"); var elvid = document.getElementById("showVideo");
elvid.classList.toggle("hide"); elvid.classList.toggle("hide");
var bvid = document.getElementById("bhide_vid"); var bvid = document.getElementById("button_vid");
bvid.classList.toggle("bhide_chat_off") bvid.classList.toggle("show_button")
vid = document.getElementById("showVideo"); vid = document.getElementById("showVideo");
vid.scrollIntoView(); vid.scrollIntoView();
@ -148,8 +151,8 @@ $(function() {
var elimg = document.getElementById("showImg"); var elimg = document.getElementById("showImg");
elimg.classList.toggle("hide"); elimg.classList.toggle("hide");
var bimg = document.getElementById("bhide_img"); var bimg = document.getElementById("button_img");
bimg.classList.toggle("bhide_chat_off") bimg.classList.toggle("show_button")
im = document.getElementById("showImg"); im = document.getElementById("showImg");
im.scrollIntoView(); im.scrollIntoView();
@ -161,8 +164,8 @@ $(function() {
var elgal = document.getElementById("showGal"); var elgal = document.getElementById("showGal");
elgal.classList.toggle("hide"); elgal.classList.toggle("hide");
var bgal = document.getElementById("bhide_gal"); var bgal = document.getElementById("button_gal");
bgal.classList.toggle("bhide_chat_off") bgal.classList.toggle("show_button")
gal = document.getElementById("showGal"); gal = document.getElementById("showGal");
gal.scrollIntoView(); gal.scrollIntoView();

30
narrowstyle-extra.css

@ -3,33 +3,3 @@
/* once the event is over remember these and the corresponding classes /* once the event is over remember these and the corresponding classes
on index.html and put all back to 'placeholder mode' dank je! */ on index.html and put all back to 'placeholder mode' dank je! */
/* Silvio's User Condition #03 */
#showEssay {
width: 54.5%;
}
#showChat {
width: 34.5%;
}
#dave, #silvio {
width: 80px;
height: auto;
position: fixed;
bottom: 100px;
right: 80px;
}
#dave {
bottom: 230px;
}
#dave > img, #silvio > img {
border-radius: 50px;
box-shadow: 0.3rem 0.2rem 0.3rem #ffe4fd;
}
.b_allmedia {
top: 150px;
}

16
narrowstyle.css

@ -98,7 +98,7 @@ p.about {
position: fixed; position: fixed;
top: 0; top: 0;
right: 0; right: 0;
margin: 3% 1% 0% 1%; margin: 0.5em;
color: var(--color-lightyellow); color: var(--color-lightyellow);
z-index: 99; z-index: 99;
max-width: 80px; max-width: 80px;
@ -316,21 +316,21 @@ button.minimize:hover {
box-shadow: 0.3rem 0.2rem 0.3rem var(--color-lightpink); box-shadow: 0.3rem 0.2rem 0.3rem var(--color-lightpink);
} }
.bhide_chat_off { .show_button {
color: var(--color-purple) !important; color: var(--color-purple) !important;
background-color: var(--color-lightpink) !important; background-color: var(--color-lightpink) !important;
box-shadow: none !important; box-shadow: none !important;
border: 0.03rem solid var(--color-purple) !important; border: 0.03rem solid var(--color-purple) !important;
} }
.bhide_chat_off{ .show_button{
background: -moz-linear-gradient(0deg, var(--color-lightpink) 20%, var(--color-purple) 40%, var(--color-purple) 60%, var(--color-lightpink) 80%, var(--color-lightpink) 100%); background: -moz-linear-gradient(0deg, var(--color-lightpink) 20%, var(--color-purple) 40%, var(--color-purple) 60%, var(--color-lightpink) 80%, var(--color-lightpink) 100%);
background: -webkit-linear-gradient(0deg, var(--color-lightpink) 20%, var(--color-purple) 40%, var(--color-purple) 60%, var(--color-lightpink) 80%, var(--color-lightpink) 100%); background: -webkit-linear-gradient(0deg, var(--color-lightpink) 20%, var(--color-purple) 40%, var(--color-purple) 60%, var(--color-lightpink) 80%, var(--color-lightpink) 100%);
background: linear-gradient(0deg, var(--color-lightpink) 20%, var(--color-purple) 40%, var(--color-purple) 60%, var(--color-lightpink) 80%, var(--color-lightpink) 100%); background: linear-gradient(0deg, var(--color-lightpink) 20%, var(--color-purple) 40%, var(--color-purple) 60%, var(--color-lightpink) 80%, var(--color-lightpink) 100%);
/*content: " OFF";*/ /*content: " OFF";*/
} }
.bhide_chat_off:hover { .show_button:hover {
background: -moz-linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purple) 50%, var(--color-lightpink) 60%, var(--color-lightpink) 100%); background: -moz-linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purple) 50%, var(--color-lightpink) 60%, var(--color-lightpink) 100%);
background: -webkit-linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purple) 50%, var(--color-lightpink) 60%, var(--color-lightpink) 100%); background: -webkit-linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purple) 50%, var(--color-lightpink) 60%, var(--color-lightpink) 100%);
background: linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purple) 50%, var(--color-lightpink) 60%, var(--color-lightpink) 100%); background: linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purple) 50%, var(--color-lightpink) 60%, var(--color-lightpink) 100%);
@ -373,6 +373,9 @@ background: linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purp
#showAudio > * { #showAudio > * {
height: auto !important; height: auto !important;
} }
#showAudio p{
text-align: center;
}
.halfscreen { .halfscreen {
margin: 1%; margin: 1%;
@ -383,6 +386,11 @@ background: linear-gradient(0deg, var(--color-lightpink) 40%, var(--color-purp
height: 60vh; height: 60vh;
border-radius: 0.2rem; border-radius: 0.2rem;
} }
.halfscreen > video{
width: 100%;
height: auto !important;
margin-top: 1.5em;
}
.thirdscreen { .thirdscreen {
margin: 1%; margin: 1%;

BIN
video-poster.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 447 KiB

Loading…
Cancel
Save