Vizualno pedenanje

sbc
Jurij Podgoršek 2023-06-05 00:30:29 +02:00
parent dc1317deaf
commit a19c28cfc6
6 changed files with 53 additions and 18 deletions

BIN
CenturyGothic.ttf 100644

Binary file not shown.

View File

@ -20,11 +20,11 @@
<body> <body>
<section id="glavno"> <section id="glavno">
<h1>OBSERVATORIJ</h1> <h1>OBSERVATORIJ</h1>
<h2>je umetniška instalacija, ki je del razstave nevidni sopotnik v mestni galeriji nova gorica. spodnja konzola vam omogoča uporavljanje tamkajšnjega lebdečega objekta.</h2> <h2>je umetniška instalacija, ki je del razstave Nevidni sopotnik v Mestni galeriji Nova Gorica. &nbsp;&nbsp;Spodnja konzola vam omogoča upravljanje tamkajšnjega lebdečega objekta.</h2>
<section class="zaslon"> <section class="zaslon cakam">
<video id="videofeed" class="cakam" muted="" autoplay="" playsinline=""></video> <video id="videofeed" muted="" autoplay="" playsinline=""></video>
<button id="predvajaj"></button> <button id="predvajaj"></button>
<section class="gumbi"> <section class="gumbi">
@ -38,7 +38,7 @@
<p>Avtor: BOŠTJAN DRINOVEC</p> <p>Avtor: BOŠTJAN DRINOVEC</p>
<p>programiranje: JURIJ PODGORŠEK</p> <p>programiranje: JURIJ PODGORŠEK</p>
<p>elektronika: BORUT SAVSKI</p> <p>elektronika: BORUT SAVSKI</p>
<p>produkcija: Mestna Galerija Nova Gorica in Boštjan Drinovec, 2023</p> <p>produkcija: Mestna galerija Nova Gorica in Boštjan Drinovec, 2023</p>
</section> </section>
</section> </section>

View File

@ -4,18 +4,18 @@ function xhttp() {
window.peljiLevo = function () { window.peljiLevo = function () {
var xh = xhttp(); var xh = xhttp();
xh.open('GET', BOT + "cm?cmnd=PojdiLevo%20" + DOLZINA); xh.open('GET', "/cm?cmnd=PojdiLevo%20" + DOLZINA);
xh.send(); xh.send();
} }
window.peljiDesno = function () { window.peljiDesno = function () {
var xh = xhttp(); var xh = xhttp();
xh.open('GET', BOT + "cm?cmnd=PojdiDesno%20" + DOLZINA); xh.open('GET', "/cm?cmnd=PojdiDesno%20" + DOLZINA);
xh.send(); xh.send();
} }
window.peljiRavno = function () { window.peljiRavno = function () {
var xh = xhttp(); var xh = xhttp();
xh.open('GET', BOT + "cm?cmnd=PojdiRavno%20" + DOLZINA); xh.open('GET', "/cm?cmnd=PojdiRavno%20" + DOLZINA);
xh.send(); xh.send();
} }

View File

@ -924,6 +924,9 @@ function Janus(gatewayCallbacks) {
} else { } else {
Janus.warn("Unknown message/event '" + json["janus"] + "' on session " + sessionId); Janus.warn("Unknown message/event '" + json["janus"] + "' on session " + sessionId);
Janus.debug(json); Janus.debug(json);
setTimeout(function () {
window.reload();
}, 5000);
} }
} }

View File

@ -1,6 +1,6 @@
@font-face { @font-face {
font-family: CenturyGothic; font-family: CenturyGothic;
src: url("nu_century_gothic.ttf") format("truetype"); src: url("CenturyGothic.ttf") format("truetype");
} }
body { body {
@ -15,16 +15,18 @@ body {
} }
h1, h2 { h1, h2 {
text-transform: uppercase;
display: inline; display: inline;
} }
h1 { h1 {
font-size: 2rem; font-size: 2.5rem;
margin-right: .4rem;
font-weight: normal;
} }
h2 { h2 {
font-size: .9rem; font-size: .8rem;
font-weight: normal; font-weight: normal;
word-spacing: 1px;
} }
@ -45,19 +47,20 @@ video {
border-top-right-radius: 50% 12%; border-top-right-radius: 50% 12%;
border-bottom-left-radius: 50% 12%; border-bottom-left-radius: 50% 12%;
border-bottom-right-radius: 50% 12%; border-bottom-right-radius: 50% 12%;
min-height: 482.5px;
} }
#predvajaj { #predvajaj {
display: none; display: block;
font-size: 10rem; font-size: 10rem;
font-weight: bold; font-weight: bold;
opacity: .7; opacity: .7;
position: absolute; position: absolute;
left: 25%; left: calc(50% - 7rem);
top: 25%; top: calc(50% - 7rem);
width: 50%; width: 14rem;
height: 50%; height: 14rem;
border-radius: 100%; border-radius: 100%;
cursor: pointer; cursor: pointer;
@ -65,6 +68,25 @@ video {
background-color: white; background-color: white;
} }
.cakam #predvajaj {
display: none;
}
.cakam:after {
display: block;
position: absolute;
content: 'Nalaganje...';
width: 100%;
height: 100%;
display: flex;
top: 0;
bottom: 0;
left: 0;
right: 0;
align-items: center;
justify-content: center;
}
.gumbi { .gumbi {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
@ -91,6 +113,10 @@ video {
background-repeat: no-repeat; background-repeat: no-repeat;
} }
button[disabled] {
opacity: .4;
}
#levo { #levo {
left: 5rem; left: 5rem;
bottom: 2rem; bottom: 2rem;

View File

@ -205,6 +205,7 @@ window.addEventListener('DOMContentLoaded', function () {
Janus.log("Created remote video stream:", stream); Janus.log("Created remote video stream:", stream);
var vidEl = document.querySelector('#videofeed'); var vidEl = document.querySelector('#videofeed');
var zaslonEl = document.querySelector('.zaslon');
/* bitrate in resolucija /* bitrate in resolucija
if(!bitrateTimer[mid]) { if(!bitrateTimer[mid]) {
@ -223,8 +224,13 @@ window.addEventListener('DOMContentLoaded', function () {
console.log('dodajam pretok', vidEl, stream); console.log('dodajam pretok', vidEl, stream);
Janus.attachMediaStream(vidEl, stream); Janus.attachMediaStream(vidEl, stream);
vidEl.addEventListener('canplay', function () {
console.log('lahko predvajam!');
zaslonEl.classList.remove('cakam');
});
// Moramo kliknit za predvajanje :/ // Moramo kliknit za predvajanje :/
predvajaj.style.display = 'block'; // predvajaj.style.display = 'block';
predvajaj.addEventListener('click', function () { predvajaj.addEventListener('click', function () {
predvajaj.style.display = 'none'; predvajaj.style.display = 'none';
vidEl.play(); vidEl.play();
@ -235,7 +241,7 @@ window.addEventListener('DOMContentLoaded', function () {
predvajaj.style.display = 'none'; predvajaj.style.display = 'none';
}); });
vidEl.play(); //vidEl.play();
} }
}, },
ondataopen: function(data) { ondataopen: function(data) {