Compare commits
No commits in common. 'master' and 'livestream-fix' have entirely different histories.
master
...
livestream
@ -1,47 +1,88 @@ |
||||
{{ define "main" }} |
||||
{{ .Content }} |
||||
<div class="jumbo"> |
||||
<div class="jumbo-cover" style="background-image: url('https://ozgurkon.org/2021/images/flat-mountains.svg')"></div> |
||||
|
||||
<div class="container"> |
||||
<div class="row"><div class="col"><h1 class="hashtag">#ÖzgürKon2021 live!</h1></div></div> |
||||
<div class="row"> |
||||
<div class="col-8"> |
||||
<nav class="live-tab-switcher"> |
||||
{{ range $index, $room := $.Site.Data.live }} |
||||
<a class="live-tab-link{{ if ($index) eq 0 }} active {{end}}" id="button-{{$room.navId}}" onClick="switchTabs(event, '{{$room.navId}}')" href="#room-{{$room.navId}}">{{$room.name}}</a> |
||||
{{end}} |
||||
</nav> |
||||
|
||||
<section class="live-section"> |
||||
<div |
||||
id="room" |
||||
class=""> |
||||
<video-js |
||||
id="player" |
||||
data-setup="{}" |
||||
> |
||||
<source src="https://rtmp.ozgurkon.org/live/test.m3u8"> |
||||
</video-js> |
||||
</div> |
||||
{{ range $index, $room := $.Site.Data.live }} |
||||
<div id="room-{{$room.navId}}" class="live-player-wrapper {{ if ($index) eq 1 }} live-tab-d-none {{end}}"> |
||||
<video-js |
||||
id="player-{{$room.navId}}" |
||||
data-setup="{}" |
||||
> |
||||
<source src="{{ $room.url }}"> |
||||
</video-js> |
||||
</div> |
||||
{{ end }} |
||||
<iframe src="https://kiwiirc.com/client/chat.freenode.net/?&theme=cli#ozgurkon" class="live-chat"></iframe> |
||||
</section> |
||||
</div> |
||||
<div class="col-4"> |
||||
<iframe src="https://kiwiirc.com/client/chat.freenode.net/?&theme=cli#ozgurkon" class="live-chat" ></iframe> |
||||
{{end}} |
||||
|
||||
{{ define "scripts"}} |
||||
<script type="text/javascript" src="https://vjs.zencdn.net/7.8.1/video.js"></script> |
||||
<script type="text/javascript" src="https://unpkg.com/@videojs/http-streaming@1.13.3/dist/videojs-http-streaming.min.js"></script> |
||||
<script type="text/javascript"> |
||||
|
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
const players = { |
||||
{{ range $room := $.Site.Data.live }} |
||||
{{ $room.navId}}: videojs('player-{{$room.navId}}', { |
||||
controls: true, |
||||
aspectRatio: '16:9' |
||||
}), |
||||
{{end}} |
||||
} |
||||
|
||||
const roomAkgul = document.getElementById('room-akgul'); |
||||
const roomUckan = document.getElementById('room-uckan'); |
||||
const buttonAkgul = document.getElementById('button-akgul'); |
||||
const buttonUckan = document.getElementById('button-uckan'); |
||||
|
||||
{{end}} |
||||
function switchTabs(event, id) { |
||||
event.preventDefault(); |
||||
pausePlayer(id); |
||||
|
||||
if(id === "akgul") { |
||||
setActive(buttonAkgul); |
||||
notActive(buttonUckan); |
||||
show(roomAkgul); |
||||
hide(roomUckan); |
||||
} |
||||
if(id === "uckan") { |
||||
setActive(buttonUckan); |
||||
notActive(buttonAkgul); |
||||
hide(roomAkgul); |
||||
show(roomUckan); |
||||
} |
||||
} |
||||
|
||||
function pausePlayer(id) { |
||||
const playerToPause = (id === "akgul") ? "uckan" : "akgul"; |
||||
players[id].play(); |
||||
players[playerToPause].pause(); |
||||
|
||||
} |
||||
|
||||
function show(el) { |
||||
if(el.classList.contains('live-tab-d-none')) return el.classList.remove('live-tab-d-none'); |
||||
} |
||||
|
||||
{{ define "scripts"}} |
||||
<script type="text/javascript" src="https://vjs.zencdn.net/7.8.1/video.js"></script> |
||||
<script type="text/javascript" src="https://unpkg.com/@videojs/http-streaming@1.13.3/dist/videojs-http-streaming.min.js"></script> |
||||
<script type="text/javascript"> |
||||
function hide(el) { |
||||
if(!el.classList.contains('live-tab-d-none')) return el.classList.add('live-tab-d-none'); |
||||
} |
||||
|
||||
function setActive(el) { |
||||
if(!el.classList.contains('active')) return el.classList.add('active'); |
||||
} |
||||
|
||||
const players = { |
||||
room : videojs('player', { |
||||
controls: true, |
||||
aspectRatio: '16:9' |
||||
}), |
||||
} |
||||
</script> |
||||
function notActive(el) { |
||||
if(el.classList.contains('active')) return el.classList.remove('active'); |
||||
} |
||||
setTimeout(() => { |
||||
document.getElementById("button-akgul").click(); |
||||
},3000); |
||||
</script> |
||||
{{ end }} |
||||
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 18 KiB |
@ -1,16 +0,0 @@ |
||||
@import url('https://fonts.googleapis.com/css2?family=Bitter:wght@600&display=swap'); |
||||
|
||||
|
||||
.hashtag { |
||||
margin-left: auto !important; |
||||
margin-right: auto !important; |
||||
text-align: center !important; |
||||
font-family: 'Bitter', serif; |
||||
margin-bottom: 30px; |
||||
color: #c03e24; |
||||
} |
||||
|
||||
.live-chat { |
||||
height: 100%; |
||||
width: 350px; |
||||
} |
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,178 +1 @@ |
||||
// NodeList.forEach
|
||||
if (window.NodeList && !NodeList.prototype.forEach) { |
||||
NodeList.prototype.forEach = function (callback, thisArg) { |
||||
thisArg = thisArg || window; |
||||
|
||||
for (let i = 0; i < this.length; i++) { |
||||
callback.call(thisArg, this[i], i, this); |
||||
} |
||||
}; |
||||
} |
||||
|
||||
// Shuffle
|
||||
document.querySelectorAll('ul.shuffle').forEach(listElt => { |
||||
for (let i = listElt.children.length; i >= 0; i--) { |
||||
listElt.appendChild(listElt.children[Math.random() * i | 0]); |
||||
} |
||||
}); |
||||
|
||||
// From https://github.com/snaptortoise/konami-js
|
||||
var Konami$1 = function (callback) { |
||||
var konami = { |
||||
addEvent: function (obj, type, fn, ref_obj) { |
||||
if (obj.addEventListener) obj.addEventListener(type, fn, false);else if (obj.attachEvent) { |
||||
// IE
|
||||
obj["e" + type + fn] = fn; |
||||
|
||||
obj[type + fn] = function () { |
||||
obj["e" + type + fn](window.event, ref_obj); |
||||
}; |
||||
|
||||
obj.attachEvent("on" + type, obj[type + fn]); |
||||
} |
||||
}, |
||||
removeEvent: function (obj, eventName, eventCallback) { |
||||
if (obj.removeEventListener) { |
||||
obj.removeEventListener(eventName, eventCallback); |
||||
} else if (obj.attachEvent) { |
||||
obj.detachEvent(eventName); |
||||
} |
||||
}, |
||||
input: "", |
||||
pattern: "38384040373937396665", |
||||
keydownHandler: function (e, ref_obj) { |
||||
if (ref_obj) { |
||||
konami = ref_obj; |
||||
} // IE
|
||||
|
||||
|
||||
konami.input += e ? e.keyCode : event.keyCode; |
||||
|
||||
if (konami.input.length > konami.pattern.length) { |
||||
konami.input = konami.input.substr(konami.input.length - konami.pattern.length); |
||||
} |
||||
|
||||
if (konami.input === konami.pattern) { |
||||
konami.code(konami._currentLink); |
||||
konami.input = ''; |
||||
e.preventDefault(); |
||||
return false; |
||||
} |
||||
}, |
||||
load: function (link) { |
||||
this._currentLink = link; |
||||
this.addEvent(document, "keydown", this.keydownHandler, this); |
||||
this.iphone.load(link); |
||||
}, |
||||
unload: function () { |
||||
this.removeEvent(document, 'keydown', this.keydownHandler); |
||||
this.iphone.unload(); |
||||
}, |
||||
code: function (link) { |
||||
window.location = link; |
||||
}, |
||||
iphone: { |
||||
start_x: 0, |
||||
start_y: 0, |
||||
stop_x: 0, |
||||
stop_y: 0, |
||||
tap: false, |
||||
capture: false, |
||||
orig_keys: "", |
||||
keys: ["UP", "UP", "DOWN", "DOWN", "LEFT", "RIGHT", "LEFT", "RIGHT", "TAP", "TAP"], |
||||
input: [], |
||||
code: function (link) { |
||||
konami.code(link); |
||||
}, |
||||
touchmoveHandler: function (e) { |
||||
if (e.touches.length === 1 && konami.iphone.capture === true) { |
||||
var touch = e.touches[0]; |
||||
konami.iphone.stop_x = touch.pageX; |
||||
konami.iphone.stop_y = touch.pageY; |
||||
konami.iphone.tap = false; |
||||
konami.iphone.capture = false; |
||||
konami.iphone.check_direction(); |
||||
} |
||||
}, |
||||
touchendHandler: function () { |
||||
konami.iphone.input.push(konami.iphone.check_direction()); |
||||
if (konami.iphone.input.length > konami.iphone.keys.length) konami.iphone.input.shift(); |
||||
|
||||
if (konami.iphone.input.length === konami.iphone.keys.length) { |
||||
var match = true; |
||||
|
||||
for (var i = 0; i < konami.iphone.keys.length; i++) { |
||||
if (konami.iphone.input[i] !== konami.iphone.keys[i]) { |
||||
match = false; |
||||
} |
||||
} |
||||
|
||||
if (match) { |
||||
konami.iphone.code(konami._currentLink); |
||||
} |
||||
} |
||||
}, |
||||
touchstartHandler: function (e) { |
||||
konami.iphone.start_x = e.changedTouches[0].pageX; |
||||
konami.iphone.start_y = e.changedTouches[0].pageY; |
||||
konami.iphone.tap = true; |
||||
konami.iphone.capture = true; |
||||
}, |
||||
load: function (link) { |
||||
this.orig_keys = this.keys; |
||||
konami.addEvent(document, "touchmove", this.touchmoveHandler); |
||||
konami.addEvent(document, "touchend", this.touchendHandler, false); |
||||
konami.addEvent(document, "touchstart", this.touchstartHandler); |
||||
}, |
||||
unload: function () { |
||||
konami.removeEvent(document, 'touchmove', this.touchmoveHandler); |
||||
konami.removeEvent(document, 'touchend', this.touchendHandler); |
||||
konami.removeEvent(document, 'touchstart', this.touchstartHandler); |
||||
}, |
||||
check_direction: function () { |
||||
x_magnitude = Math.abs(this.start_x - this.stop_x); |
||||
y_magnitude = Math.abs(this.start_y - this.stop_y); |
||||
x = this.start_x - this.stop_x < 0 ? "RIGHT" : "LEFT"; |
||||
y = this.start_y - this.stop_y < 0 ? "DOWN" : "UP"; |
||||
result = x_magnitude > y_magnitude ? x : y; |
||||
result = this.tap === true ? "TAP" : result; |
||||
return result; |
||||
} |
||||
} |
||||
}; |
||||
typeof callback === "string" && konami.load(callback); |
||||
|
||||
if (typeof callback === "function") { |
||||
konami.code = callback; |
||||
konami.load(); |
||||
} |
||||
|
||||
return konami; |
||||
}; |
||||
|
||||
if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') { |
||||
module.exports = Konami$1; |
||||
} else { |
||||
if (typeof define === 'function' && define.amd) { |
||||
define([], function () { |
||||
return Konami$1; |
||||
}); |
||||
} else { |
||||
window.Konami = Konami$1; |
||||
} |
||||
} |
||||
|
||||
new Konami(function () { |
||||
const elt = document.querySelector('.jumbo'); |
||||
|
||||
if (elt) { |
||||
elt.style.backgroundImage = 'url(/images/wtf/serious.jpg)'; |
||||
} |
||||
}); |
||||
setTimeout(function () { |
||||
const jumboOverlay = document.querySelector('#jumbo-overlay'); |
||||
|
||||
if (jumboOverlay) { |
||||
jumboOverlay.classList.add('show'); |
||||
} |
||||
}, 500); |
||||
window.NodeList&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=function(t,e){e=e||window;for(var n=0;n<this.length;n++)t.call(e,this[n],n,this)}),document.querySelectorAll("ul.shuffle").forEach(function(t){for(var e=t.children.length;0<=e;e--)t.appendChild(t.children[Math.random()*e|0])});var Konami$1=function(t){var n={addEvent:function(t,e,n,o){t.addEventListener?t.addEventListener(e,n,!1):t.attachEvent&&(t["e"+e+n]=n,t[e+n]=function(){t["e"+e+n](window.event,o)},t.attachEvent("on"+e,t[e+n]))},removeEvent:function(t,e,n){t.removeEventListener?t.removeEventListener(e,n):t.attachEvent&&t.detachEvent(e)},input:"",pattern:"38384040373937396665",keydownHandler:function(t,e){if(e&&(n=e),n.input+=t?t.keyCode:event.keyCode,n.input.length>n.pattern.length&&(n.input=n.input.substr(n.input.length-n.pattern.length)),n.input===n.pattern)return n.code(n._currentLink),n.input="",t.preventDefault(),!1},load:function(t){this._currentLink=t,this.addEvent(document,"keydown",this.keydownHandler,this),this.iphone.load(t)},unload:function(){this.removeEvent(document,"keydown",this.keydownHandler),this.iphone.unload()},code:function(t){window.location=t},iphone:{start_x:0,start_y:0,stop_x:0,stop_y:0,tap:!1,capture:!1,orig_keys:"",keys:["UP","UP","DOWN","DOWN","LEFT","RIGHT","LEFT","RIGHT","TAP","TAP"],input:[],code:function(t){n.code(t)},touchmoveHandler:function(t){if(1===t.touches.length&&!0===n.iphone.capture){var e=t.touches[0];n.iphone.stop_x=e.pageX,n.iphone.stop_y=e.pageY,n.iphone.tap=!1,n.iphone.capture=!1,n.iphone.check_direction()}},touchendHandler:function(){if(n.iphone.input.push(n.iphone.check_direction()),n.iphone.input.length>n.iphone.keys.length&&n.iphone.input.shift(),n.iphone.input.length===n.iphone.keys.length){for(var t=!0,e=0;e<n.iphone.keys.length;e++)n.iphone.input[e]!==n.iphone.keys[e]&&(t=!1);t&&n.iphone.code(n._currentLink)}},touchstartHandler:function(t){n.iphone.start_x=t.changedTouches[0].pageX,n.iphone.start_y=t.changedTouches[0].pageY,n.iphone.tap=!0,n.iphone.capture=!0},load:function(t){this.orig_keys=this.keys,n.addEvent(document,"touchmove",this.touchmoveHandler),n.addEvent(document,"touchend",this.touchendHandler,!1),n.addEvent(document,"touchstart",this.touchstartHandler)},unload:function(){n.removeEvent(document,"touchmove",this.touchmoveHandler),n.removeEvent(document,"touchend",this.touchendHandler),n.removeEvent(document,"touchstart",this.touchstartHandler)},check_direction:function(){return x_magnitude=Math.abs(this.start_x-this.stop_x),y_magnitude=Math.abs(this.start_y-this.stop_y),x=this.start_x-this.stop_x<0?"RIGHT":"LEFT",y=this.start_y-this.stop_y<0?"DOWN":"UP",result=x_magnitude>y_magnitude?x:y,result=!0===this.tap?"TAP":result,result}}};return"string"==typeof t&&n.load(t),"function"==typeof t&&(n.code=t,n.load()),n};"undefined"!=typeof module&&void 0!==module.exports?module.exports=Konami$1:"function"==typeof define&&define.amd?define([],function(){return Konami$1}):window.Konami=Konami$1,new Konami(function(){var t=document.querySelector(".jumbo");t&&(t.style.backgroundImage="url(/images/wtf/serious.jpg)")}),setTimeout(function(){var t=document.querySelector("#jumbo-overlay");t&&t.classList.add("show")},500); |
||||
|
||||
Loading…
Reference in new issue