From aa03c15b186da0973a4369a97e7fea00468f16d5 Mon Sep 17 00:00:00 2001 From: Minteck Date: Tue, 12 Apr 2022 11:47:32 +0200 Subject: Familine --- js/home.js | 12 ++++++ js/iframe.js | 48 ++++++++++++++++++++++++ js/loading.js | 32 ++++++++++++++++ js/navigation.js | 110 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ js/statusbar.js | 4 ++ 5 files changed, 206 insertions(+) create mode 100755 js/home.js create mode 100755 js/iframe.js create mode 100755 js/loading.js create mode 100755 js/navigation.js create mode 100755 js/statusbar.js (limited to 'js') diff --git a/js/home.js b/js/home.js new file mode 100755 index 0000000..d875860 --- /dev/null +++ b/js/home.js @@ -0,0 +1,12 @@ +setInterval(() => { + window.fetch("/app/radio/song.php").then((raw) => { + raw.text().then((text) => { + document.getElementById('radio-now').innerText = text; + }) + }) + window.fetch("/app/radio/next.php").then((raw) => { + raw.text().then((text) => { + document.getElementById('radio-next').innerText = text; + }) + }) +}, 2000) \ No newline at end of file diff --git a/js/iframe.js b/js/iframe.js new file mode 100755 index 0000000..a031872 --- /dev/null +++ b/js/iframe.js @@ -0,0 +1,48 @@ +function iframeURLChange(iframe, callback) { + var unloadHandler = function () { + setTimeout(function () { + callback(iframe.contentWindow.location.href); + }, 0); + }; + + function attachUnload() { + iframe.contentWindow.removeEventListener("pagehide", unloadHandler); + iframe.contentWindow.addEventListener("pagehide", unloadHandler); + iframe.contentWindow.removeEventListener("unload", unloadHandler); + iframe.contentWindow.addEventListener("unload", unloadHandler); + } + + iframe.addEventListener("load", attachUnload); + attachUnload(); +} + +Array.from(document.getElementsByTagName("iframe")).forEach((par) => { + iframeURLChange(par, function (newURL) { + $(".loader").fadeIn(200); + }); +}) + +function unload() { + $(".loader").fadeIn(200); +} + +Array.from(document.getElementsByTagName("iframe")).forEach((par) => { + par.onbeforeunload = unload +}) + +function loaded () { + $(".loader").fadeOut(200); + + setTimeout(() => { + $(".loader").fadeOut(200); + }, 300) + + setTimeout(() => { + $(".loader").fadeOut(200); + }, 1500); +} + +Array.from(document.getElementsByTagName("iframe")).forEach((par) => { + par.onload = loaded; + par.onabort = loaded; +}) \ No newline at end of file diff --git a/js/loading.js b/js/loading.js new file mode 100755 index 0000000..b3970de --- /dev/null +++ b/js/loading.js @@ -0,0 +1,32 @@ +document.onreadystatechange = function(e) { + if (document.readyState == "interactive") { + var all = document.getElementsByTagName("*"); + for (var i = 0, max = all.length; i < max; i++) { + set_ele(all[i]); + } + } +} + +function check_element(ele) { + var all = document.getElementsByTagName("*"); + var totalele = all.length; + var per_inc = 100 / all.length; + + if ($(ele).on()) { + var prog_width = per_inc + Number(document.getElementById("progress_width").value); + document.getElementById("progress_width").value = prog_width; + $("#bar1").animate({ + width: prog_width + "%" + }, 10, function() { + if (document.getElementById("bar1").style.width === "100%") { + $(".progress").fadeOut("slow"); + } + }); + } else { + set_ele(ele); + } +} + +function set_ele(set_element) { + check_element(set_element); +} \ No newline at end of file diff --git a/js/navigation.js b/js/navigation.js new file mode 100755 index 0000000..b4d1dbe --- /dev/null +++ b/js/navigation.js @@ -0,0 +1,110 @@ +window.addEventListener('load', () => { + document.getElementById('loading').style.display = "none"; +}) + +function setImageSource(image, source) { + if (image.src !== source) { + image.src = source; + } +} + +doCheckForActiveItem = true; + +Array.from(document.getElementsByClassName("tab")).forEach((par) => { + item = par.children[0]; + if (typeof item.getAttribute("data-image-hover") === "string") { + item.setAttribute("data-image-normal", item.src) + par.addEventListener('mouseenter', (e) => { + doCheckForActiveItem = false; + + if (e.target.classList.contains("tab-active")) { + item = e.target.children[0]; + item.style.opacity = ".75"; + } else { + item = e.target.children[0]; + setImageSource(item, item.getAttribute("data-image-hover")); + } + }) + par.addEventListener('mouseleave', (e) => { + doCheckForActiveItem = true; + + if (e.target.classList.contains("tab-active")) { + item = e.target.children[0]; + item.style.opacity = "1"; + } else { + item = e.target.children[0]; + setImageSource(item, item.getAttribute("data-image-normal")); + } + }) + } +}) + +setInterval(() => { + Array.from(document.getElementsByClassName("tab")).forEach((par) => { + if (!doCheckForActiveItem) { return; } + item = par.children[0]; + if (par.classList.contains("tab-active")) { + setImageSource(item, item.getAttribute("data-image-active")); + } else { + setImageSource(item, item.getAttribute("data-image-normal")); + } + }) +}, 100) + +function openTab(tab) { + Array.from(document.getElementsByClassName("tab")).forEach((par) => { + if (par.classList.contains("tab-active")) { + par.classList.remove("tab-active"); + } + }) + document.getElementById('tab-' + tab).classList.add("tab-active"); + doCheckForActiveItem = true; +} + +function openPane(pane) { + Array.from(document.getElementsByTagName("iframe")).forEach((par) => { + par.src = "about:blank"; + }) + Array.from(document.getElementsByClassName("pane")).forEach((par) => { + $("#" + par.id).fadeOut(200); + }) + $("#pane-" + pane).fadeIn(200); + $(".loader").fadeIn(200); + switch (pane) { + case "radio": + document.getElementById('frame-' + pane).src = "/app/radio" + break; + case "money": + document.getElementById('frame-' + pane).src = "/app/money" + break; + case "contacts": + document.getElementById('frame-' + pane).src = "/app/contacts" + break; + case "home": + document.getElementById('frame-' + pane).src = "/app/home" + break; + case "space": + if (navigator.userAgent.includes("+Familine/")) { + $(".loader").fadeOut(200); + document.getElementById('frame-' + pane).loadURL("https://chat.familine.minteck.org"); + document.getElementById('frame-' + pane).setZoomFactor(0.9); + break; + } else { + document.getElementById('frame-' + pane).src = "/app/space" + break; + } + case "cinema": + document.getElementById('frame-' + pane).src = "https://cinema.familine.minteck.org" + break; + case "share": + document.getElementById('frame-' + pane).src = "https://share.familine.minteck.org" + break; + case "help": + document.getElementById('frame-' + pane).src = "/app/help" + break; + } +} + +window.addEventListener('load', () => { + try { openPane('home'); } catch (e) {} +}) \ No newline at end of file diff --git a/js/statusbar.js b/js/statusbar.js new file mode 100755 index 0000000..210653e --- /dev/null +++ b/js/statusbar.js @@ -0,0 +1,4 @@ +window.addEventListener("load", () => { + window.fetch("/statusbar.php").then((a) => {a.text().then((b) => {document.body.innerHTML=document.body.innerHTML+b;document.getElementById("statusbar").classList.add("desktop");})}); + $(".progress").fadeOut("slow"); +}) \ No newline at end of file -- cgit