web-narrowcast/index.html
2022-03-14 12:38:34 +01:00

277 lines
14 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>NARROWCAST</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- <link href="https://vjs.zencdn.net/7.10.2/video-js.css" rel="stylesheet" /> -->
<!-- OUR STYLES -->
<link rel="stylesheet" type="text/css" media="all" href="narrowstyle.css"></link>
<link rel="stylesheet" type="text/css" media="all" href="narrowstyle-extra.css"></link>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css" rel="stylesheet" type='text/css'>
<!-- OUR SCRIPTS -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="narrowscripts.js"></script>
<script type="text/javascript" src="narrowskin.js"></script>
</head>
<body>
<div class="linkmore">
<a href="https://vvvvvvaria.org/logs/zamopuzo" target="_blank">back ↗ stage </a>
<br>
<a href="https://stream.vvvvvvaria.org/about.html"> about ↯ over ↻ </a>
</div>
<div id="side" class="sidebar sidemin">
<button class="minimize" onclick="fside()"></button>
<div class="sidetop">
<!-- ADD A FUTURE EVENT HERE -->
<!-- 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>more TBA soon! <a href="https://varia.zone/en" target="_blank" > &#128064; </a> <br> meer TBA binnenkort! </p>
</div>
<div class="middle">
<p>⇈ Will be awesome ⇈ <br> ⇈ Zal geweldig zijn ⇈</p>
<p id="livetitle">LIVE ↝ N↻W ⇶ </p>
<!-- ADD A CURRENT LIVE EVENT HERE -->
<p id="livesubtitle"><a href="" target="_blank"></a></p>
<p>⇊ Was amazing ↷ geweldig ⇊</p>
<p> <a href="archive.html">Archive ↩</a></p>
</div>
<div class="sidebottom">
<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="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>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>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-30 November'21: <a href="https://radioee.net/" target="_blank"> Mirroring the 24hr radio marathon ROOTS </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>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">
<!-- BUTTONS HIDE SHOW MEDIA -->
<div class="b_allmedia">
<!-- audio streaming or files -->
<button onclick="hideshowAudio()" class="bhide_chat_off" id="bhide_au">LISTENING <br> LUISTEREN</button>
<!-- etherpad-->
<button onclick="hideshowPad()" class="bhide_chat_off" id="bhide_ether">WRITING <br> SCHRIJVEN</button>
<!-- jitsi or alike -->
<button onclick="hideshowJitsi()" class="bhide_chat_off" id="bhide_jit">CALLING <br> BELLEN</button>
<!-- PDFs-->
<button onclick="hideshowEssay()" class="bhide_chat_off" id="bhide_ess">READING <br> LEZING</button>
<!-- video streaming or files -->
<button onclick="hideshowVideo()" class="bhide_chat_off" id="bhide_vid">WATCHING <br> KIJKEND</button>
<!-- chat -->
<button onclick="hideshowChat()" class="bhide_chat_off" id="bhide_chat">CHATTING <br> CHATTEN</button>
<!-- image single -->
<button onclick="hideshowIMG()" class="" id="bhide_img">IMAGE <br> BEELD</button>
<!-- image multiple -->
<button onclick="hideshowGal()" class="bhide_chat_off" id="bhide_gal">GALLERY <br> GALERIJ</button>
</div>
<!-- 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ı.♫♪ " -->
<!-- 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 being streamed, please check our agenda @ varia.zone for upcoming ones! </marquee>
<!-- AUDIO -->
<!-- PLACEHOLDER link: https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3
previous audio cast: https://stream.w-i-t-m.net/meander -->
<div class="audio-stream fullscreen hide" id="showAudio">
<audio id="player" preload="none" src="https://radio.alonetogether.pub/live"> </audio>
<p>
Press play (best listened in FireFox). It might take a minute 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="bs" class="stream-button b-narrow" onclick="document.getElementById('player').pause();document.getElementById('player').src=document.getElementById('player').src; bstoptoggle()">Stop</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>
<span class="audio-link"><a class="windowlinks" href="https://radio.alonetogether.pub/live" target="_blank"> direct link to audio! </a></span>
</div>
<!-- ETHERPAD -->
<!-- PLACEHOLDER link: https://pad.vvvvvvaria.org/varia.broadcast.intro
PLACEHOLDER desc: Varia Narrowcast Intro-->
<div class="halfscreen hide" id="showEther">
<iframe src="https://pad.vvvvvvaria.org/varia.broadcast.intro"></iframe><br>
<a class="windowlinks" href="https://pad.vvvvvvaria.org/varia.broadcast.intro" target="_blank"> Varia Narrowcast Intro ↝ direct to pad </a>
</div>
<!-- JITSI -->
<!-- PLACEHOLDER link: https://meet.jit.si/varia.broadcats -->
<div class="halfscreen 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>
<br> ↬
<a class="windowlinks" href="https://meet.jit.si/varia.example" target="_blank"> direct link to ↬ Jitsi</a>
</div> -->
<!-- ESSAY -->
<!-- PLACEHOLDER link: https://etherdump.vvvvvvaria.org/publish/digital-solidarity-networks.raw.html -->
<div class="halfscreen hide" id="showEssay">
<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>
</div>
<!-- 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> -->
<!-- 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>
<!-- CHAT -->
<!-- PLACEHOLDER link: https://chat.vvvvvvaria.org/ -->
<div class="chat halfscreen hide" id="showChat">
<iframe src="https://chat.vvvvvvaria.org/"></iframe><br>
<a class="windowlinks" href="https://chat.vvvvvvaria.org/" target="_blank"> direct link to chat! </a>
</div>
<!-- IMAGE GALLERY -->
<!-- PLACEHOLDER links:
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/varia-home-red.png
https://vvvvvvaria.org/archive/varia-server/welcome.png -->
<div class="img-gallery hide" id="showGal">
<p class="img-gallery-title"> ⇩ IMAGE ⇊ GALLERY ⇘ IMAGE ⇊ GALERIJ ⇩ </p>
<figure>
<img src="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/a_safe_image.php.jpeg"><br>
<a class="windowlinks" href="https://vvvvvvaria.org/archive/2021-01+02-Read-and-Repair_Wireless-Imagination/a_safe_image.php.jpeg" target="_blank" alt="">caption: 'Read & Repair — Wireless Imagination' ↬ link to .jpg</a>
</figure>
<figure>
<img src="https://vvvvvvaria.org/archive/varia-server/7e920c7f_Screenshot%20from%202020-03-21%2019-07-20.png"><br>
<a class="windowlinks" href="https://vvvvvvaria.org/archive/varia-server/7e920c7f_Screenshot%20from%202020-03-21%2019-07-20.png" target="_blank" alt=""> caption: 'Varia pixels' ↬ link to .png</a>
</figure>
<figure>
<img src="https://vvvvvvaria.org/archive/varia-server/varia-home-red.png"><br>
<a class="windowlinks" href="https://vvvvvvaria.org/archive/varia-server/varia-home-red.png" target="_blank" alt=""> caption: 'Welcome to Varia home server' ↬ link to .jpg</a>
</figure>
<figure>
<img src="https://vvvvvvaria.org/archive/varia-server/welcome.png"><br>
<a class="windowlinks" href="https://vvvvvvaria.org/archive/varia-server/welcome.png" target="_blank" alt=""> caption: 'Varia Welcome again!' ↬ link to .jpg</a>
</figure>
</div>
<p class="note"> <u>Note</u>: this interface is in experimental phase ☆゚.*・。゚ and some things may not work always smoothly * <u>Nota</u>: deze interface is in experimentele fase ☆゚.*・。゚ en sommige dingen kunnen niet altijd soepel werken *</p>
<!-- <p class="note"> <u>Note</u>: this interface is in experimental phase ☆゚.*・。゚ and some things may not work always smoothly. There is the option to open the direct url of each element in a new window.</p> -->
</div>
<script type="text/javascript" src="narrowscripts.js"></script>
</body>
</html>