Pl4tform_website/index.php

1005 lines
22 KiB
PHP
Raw Permalink Normal View History

2025-02-03 19:29:59 +01:00
<!-- ACTUAL IMAGE -->
<?php
###### tester les erreur php !!
// ini_set('display_errors', '1');
// ini_set('display_startup_errors', '1');
// error_reporting(E_ALL);
// $tutos = [];
foreach (new DirectoryIterator('/var/www/pl4tform.org/website/data/main-page-image/') as $file) {
if ($file->isFile()) {
$filename = $file->getFilename();
// array_push($tutos, $filename);
}
};
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <link rel='stylesheet' type='text/css' href='newradio-wip.css'> -->
<link rel="stylesheet" type="text/css" href="newmap.css" />
<title>PL4TFORM </title>
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
</style>
</head>
<body >
<!-- <a href="https://pl4tform.org"> -->
<!-- <img src="buttons/pl4tamodeler.png" onclick="closeAll()" onmouseover="mouseHover('Home')" onmouseout='mouseHoverOut("")' alt="" id="pl4tformBtn"> -->
<!-- </a> -->
<?php // include 'counter/counter.php'; ?>
<script type="text/javascript" src="https://pl4tform.org/stat/pws.php?mode=js"></script>
<script type="text/javascript" src="includes/nowLive.js"></script>
<!-- CHATTTTT -->
<?php
include "accueil.php";
?>
<div class="wipMobile">WE ARE ACTUALLY WORKING ON THE MOBILE VERSION !! VISIT PL4TFORM.ORG ON A PC/LAPTOP ! <3 <br> <br>
NOUS TRAVAILLONS ACTUELLEMENT SUR LA VERSION MOBILE ! VISITE PL4TFORM.ORG SUR UN ORDINATEUR ! <3
</div>
<div class="wipDesktop">
We are working on a new website ! <br>
There might be some error and non really working stuff but be patient ! Soon ut will be creazy cool ! <br?<br>
ղεჯէ Lἶνε ʂհօω: Wednesday 𝟐𝟎/𝟏𝟏/𝟐𝟎𝟐𝟒 - 𝟏𝟒𝓱 _ Br4vebête <br> <br>
<a href="https://pl4tform.org/stream">Click here</a> to listen to the livestream ! <br><br>
And <a href="https://pl4tform.org/nc-request.php">click here</a> to access a very simple table of all archives. <br><br>
Very soon there will be creazycool new stuff righttt here @_@ <3
</div>
<div id='map1Background'></div>
<!-- actual image -->
<!-- NOOOWWW LIIIVEEEE -->
<div class="livTitle"></div>
<!-- <script>
var radioTitle = function(){
var url = 'http://pl4tform.org:8000/status-json.xsl';
$.get(url, function(data){
var title = data.icestats.source[0].title;
$('.livTitle').html(title);
document.getElementsByClassName('liveTitle').innterHTML = title;
console.log('radioTitle refresh'+title);
});
}
setInterval(radioTitle, 2000);
</script> -->
<div class="footer" id="footer">
<div id="actualPlaying"></div>
<audio id='audio' controls='controls'>
<source id='audioSource' src='https://pl4tform.org/stream'></source> Your browser does not support the audio format.
</audio>
</div>
<button class="navigationBtn" id="backBtn" onclick="back()"><span class="arrowSymbol"><=</span> Back </button>
<div id="positionBox">
<div id="positionActual"></div>
</div>
<!-- //////////// ESC button > BACK //////////// -->
<script>
// $(document).keydown(function(e) {
// if (e.key === "Escape") {
// /// HIER BACK TO BEFORE FUNKTION
// back();
// }
// });
</script>
<!-- //////////// LOCATION URL //////////// -->
<!-- //////////// MOUSE STICKY TEXT //////////// -->
<div id="hoverText">
</div>
<script>
function mouseHover(text) {
document.getElementById('hoverText').innerHTML = text;
$("#hoverText").addClass("visible");
}
function mouseHoverOut() {
$("#hoverText").removeClass("visible");
}
document.addEventListener('mousemove', function(ev){
document.getElementById('hoverText').style.transform = 'translateY('+(ev.clientY+40)+'px)';
document.getElementById('hoverText').style.transform += 'translateX('+(ev.clientX-10)+'px)';
},false);
</script>
<!-- //////////// UPDATE POSITION //////////// -->
<script>
///// URLS
/////////////// CLOSE ALL //////////////////////
function closeAll() {
// document.querySelector("#positionActual").innerHTML = "Map";
window.history.pushState('','','https://pl4tform.org');
addUrl("base");
console.log('window history gepush auf "leer" da close All funktion');
mapLayer = 2;
console.log('mapLayer set to 2');
closeMap('2');
closeMap('3');
closeMap('4');
closeMap('5');
closeMap('6');
closeMap('7');
closeMap('8');
closeMap('9');
closeMap('10');
closeZone();
focusClose();
}
</script>
<!-- <img id="ceasefirenow" class="hoverinvert" src="data/map-backgrounds/casefirenow.png"> -->
<div id="mobilBtns">
<button class="mobileMainBtns" id="navigationOpenBtn" onclick="openNavigation()">MENU</button>
<button class="mobileMainBtns" id="backBtnMobil" onclick="back()"><- Back </button>
</div>
<div id="navigation">
<!-- BIG SCREEEN MENU -->
<?php
$liveLink = 'https://pl4tform.org/stream';
$liveDiscription = "Pl4tform Livestream";
if (date('D') == 'Wed' AND date('H') == '12') {
$liveLink = 'https://lacledesondes.fr/streaming';
$liveDiscription = "Livestream de La Cle Des Ondes - PL4TFORM FM";
}
// elseif (date('D') == 'Wed') {
// $liveLink = 'https://lacledesondes.fr/streaming';
// $liveDiscription = "Livestream de La Cle Des Ondes - PL4TFORM FM";
// }
elseif (date('D') == 'Wed' AND date('H') == '11' AND date('i') > '55') {
$liveLink = 'https://lacledesondes.fr/streaming';
$liveDiscription = "Livestream de La Cle Des Ondes - PL4TFORM FM";
}
?>
<div class="navigationBtnBox">
<!-- <button class="navigationBtn" id="livestreamBtn" style="color: red" onclick='audioPlay("<?php echo $liveLink; ?>","<?php echo $liveDiscription ?>")'>Livestream</button> -->
<button class="navigationBtn" id="livestreamBtn" style="color: red" onclick='audioPlay("<?php echo $liveLink; ?>")'>Livestream</button>
</div>
<div class="navigationBtnBox">
<button class="navigationBtn" id="basemapBtn" onclick="closeAll()"> Home </button>
<button class="navigationBtn" id="newsBtn" onclick="openMap('news');closeSearchBar()">News/Agenda</button>
<button class="navigationBtn" id="archiveBtn" onclick="openMap('rhizome','2')">Pl4tform-MAP</button>
</div>
<div class="navigationBtnBox">
<button class="navigationBtn" id="searchBtn" onclick="openSearchBar()">Search</button>
<button class="navigationBtn" id="aboutBtn" onclick="focusItem('72888');closeSearchBar()">About</button>
<button class="navigationBtn" id="contactBtn" onclick="focusItem('60601');closeSearchBar()">Contact</button>
</div>
<div class="navigationBtnBox">
<button class="navigationBtn" id="palestineBtn" onclick="openMap('palestine');closeSearchBar()">Palestine</button>
</div>
<br>
<!-- <div class="hidden" id="searchBar" >
<input id="searchBarInput" onkeyup="search()" type="text" name="search" placeholder="Type your research...">
</div> -->
<!-- <button onclick="addPosition('map','outils')">Map</button>
<button onclick="addPosition('Zone')">Zone</button>
<button onclick="printArray()">2.?</button> -->
<div id="space"></div>
</div>
<!-- <div class="hidden" id="searchBar" >
<button onclick="closeSearchBar();closeZone()">Close Search</button>
<input id="searchBarInput" onkeyup="search()" type="text" name="search" placeholder="Type your research...">
</div> -->
<div id="navigationMobil">
<!-- MOBIL NAVIGATION -->
<!-- <button class="navigationBtn" id="archiveBtn" style="color: red" onclick='audioPlay("<?php echo $liveLink; ?>","<?php echo $liveDiscription ?>");closeNavigation()'>Livestream</button> -->
<button class="navigationBtn" id="archiveBtn" style="color: red" onclick='audioPlay("<?php echo $liveLink; ?>");closeNavigation()'>Livestream</button>
<button class="navigationBtn" id="backBtn" onclick="closeChat();back();closeNavigation();"><- Back </button>
<button class="navigationBtn" id="basemapBtn" onclick="openChat();closeNavigation();scrollLate()"> Chat </button>
<button class="navigationBtn" id="basemapBtn" onclick="closeAll();closeNavigation()"> Home </button>
<button class="navigationBtn" id="newsBtn" onclick="openMap('news');closeSearchBar();closeNavigation()">News/Agenda</button>
<button class="navigationBtn" id="archiveBtn" onclick="openMap('archive');closeNavigation()">Archive</button>
<button class="navigationBtn" id="searchBtn" onclick="openSearchBarMobile();closeNavigation()">Search</button>
<button class="navigationBtn" id="aboutBtn" onclick="focusItem('72888');closeSearchBar();closeNavigation()">About</button>
<button class="navigationBtn" id="contactBtn" onclick="focusItem('60601');closeSearchBar();closeNavigation()">Contact</button>
<button class="navigationBtn" id="palestineBtn" onclick="openMap('palestine');closeSearchBar();closeNavigation()">Palestine</button>
<br>
<!-- <div class="hidden" id="searchBar" >
<input id="searchBarInput" onkeyup="search()" type="text" name="search" placeholder="Type your research...">
</div> -->
<div id="space"></div>
</div>
<div class="hidden mobilesearchBar" id="mobilesearchBar" >
<input id="searchBarInputMobile" onkeyup="searchMobile()" type="text" name="search" placeholder="Type your research...">
</div>
<!-- //////////// Navigation open FUNCTION //////////// -->
<script>
function openNavigation() {
document.getElementById("navigationMobil").style.display = 'grid';
closeChat();
}
function closeNavigation() {
document.getElementById("navigationMobil").style.display = 'none';
}
</script>
<!-- //////////// BACK FUNCTION //////////// -->
<script>
function back() {
// closeChat();
removeUrlPosition();
removeLastPosition();
console.log('back');
}
let historyUrl = [];
// Funktion zum Hinzufügen einer URL
function addUrl(actualUrl) {
// Füge die aktuelle URL am Ende des Arrays hinzu
historyUrl.push(actualUrl);
// console.log('changed url to:' + actualUrl);
}
////////// too see historic: console.log(historyUrl);
addEventListener ("popstate", e => {openUrl()});
function openUrl (landingURL) {
const url = window.location.search;
var id = url.replace('?', '');
id = id.replace('/', '');
if (/^\d+$/.test(id)) {
focusItem(id);
return
}
else if (mapLayer == 3) {
if (focusOpenCheck == 0){
mapLayer--;
mapLayerId = "#map" + mapLayer;
document.querySelector(mapLayerId).setAttribute('class','mapOver');
console.log('mapLayer was 3 - so your are back home!')
addUrl("");
closeZone();
document.querySelector('#map' + mapLayer).innerHTML = "";
console.log('map from before was cleaned/emtyed')
}
else {
console.log('focusCloseCheck was still 1')
focusClose();
}
return
}
else{
if (id.length > 3) {
console.log('going to open '+id+'-map')
openMap(id, landingURL);
}
else {
focusClose();
console.log("id was to short -> just closed focus")
}
}
}
function removeLastPosition() {
console.log('remove last position');
};
</script>
<!-- //////////// SEARCH FUNCTION //////////// -->
<script>
function openSearchBar() {
document.getElementById('searchBarInput').value = "";
openZone("");
function removePhpClass (){
$("#phpload").removeClass("visible");}
setTimeout(removePhpClass, 40)
// $("#searchBtn").removeClass("visible");
// $("#searchBtn").addClass("hidden");
$("#searchBar").removeClass("hidden");
$("#searchBar").addClass("visible");
// addPosition('zone','search')
};
function openSearchBarMobile() {
document.getElementById('searchBarInputMobile').value = "";
openZone("");
function removePhpClass (){
$("#phpload").removeClass("visible");}
setTimeout(removePhpClass, 40)
// $("#searchBtn").removeClass("visible");
// $("#searchBtn").addClass("hidden");
$("#mobilesearchBar").removeClass("hidden");
$("#mobilesearchBar").addClass("visible");
// addPosition('zone','search')
};
function closeSearchBar() {
$("#searchBtn").removeClass("hidden");
$("#searchBtn").addClass("visible");
$("#searchBar").removeClass("visible");
$("#searchBar").addClass("hidden");
$("#mobilesearchBar").removeClass("visible");
$("#mobilesearchBar").addClass("hidden");
};
function search() {
$("#phpload").addClass("visible");
let input = document.getElementById('searchBarInput').value
input=input.toLowerCase();
let x = document.getElementsByClassName('item');
focusClose();
for (i = 0; i < x.length; i++) {
if (!x[i].innerHTML.toLowerCase().includes(input) && !x[i].id.toLowerCase().includes(input)) {
x[i].style.display="none";
x[i].closest(".contentColumn > div").style.display="none";
}
else {
// alert(x[i].classList)
// dint work :
if (x[i].classList.contains("withDiscription")) {
x[i].style.display="grid";
// alert("huhu");
}
else {
x[i].style.display="block";
// alert(x[i].classList)
}
///// old
// x[i].style.display="block";
x[i].closest(".contentColumn > div").style.display="block";
}
}
}
function searchMobile() {
$("#phpload").addClass("visible");
let input = document.getElementById('searchBarInputMobile').value
input=input.toLowerCase();
let x = document.getElementsByClassName('item');
focusClose();
for (i = 0; i < x.length; i++) {
if (!x[i].innerHTML.toLowerCase().includes(input) && !x[i].id.toLowerCase().includes(input)) {
x[i].style.display="none";
x[i].closest(".contentColumn > div").style.display="none";
}
else {
// alert(x[i].classList)
// dint work :
if (x[i].classList.contains("withDiscription")) {
x[i].style.display="grid";
// alert("huhu");
}
else {
x[i].style.display="block";
// alert(x[i].classList)
}
///// old
// x[i].style.display="block";
x[i].closest(".contentColumn > div").style.display="block";
}
}
}
</script>
<script>
/////////////////// CLOSE ZONE ///////////////////
function closeZone() {
// document.getElementById('content').style.display = 'none';
// document.getElementById('zoneBackground').style.backdropFilter = "blur(0rem)";
// document.getElementById('content').style.visibility = "hidden";
// document.getElementById('content').style.opacity = "0";
$("#phpload").removeClass("visible");
function removeBackgroundClass (){$("#zoneBackground").removeClass("visible");}
setTimeout(removeBackgroundClass, 1)
function removeContentClass () {$("#content").removeClass("visible");}
setTimeout(removeContentClass, 1)
document.getElementById('phpload').innerHTML = "";
// closeSearchBar();
console.log('zone closed');
// updatePositionMap();
};
</script>
<div class="radiobody">
<div class="map" id="map">
<?php
// HOTGLUE RANSFORMATION
// include "hotgluetransformation.php";
?>
<div id="map1">
<?php
// HOTGLUE RANSFORMATION
include "hotgluetransformation.php";
?>
</div>
</div>
</div>
<script>
/////////////// OPEN GENERAL FUNCTION //////////////////
</script>
<div class="content" id="content">
<!-- UM ZONEN BACKGROUND ZU HABEN -->
<!-- <div id="zoneBackground" onclick='back()' style="background-image: url('https://pl4tform.org/data/map-backgrounds/estuaire.png');"></div> -->
<script>
/////////////////// OPEN ZONE ///////////////////
function openZone(id) {
var cat = id;
const map = document.getElementById('map');
focusClose();
// UM HINTERGUND BILDER AUCH IN ZONEN ZU LADEN ---->>> AENDERN SO DASS ALLES UEBERHOTGLUE LAUFT UND ZONES GLEICH MAPS SIND
// document.getElementById('zoneBackground').style.backgroundImage="url(https://pl4tform.org/data/map-backgrounds/"+id+".jpg)";
$("#phpload").load("load.php", {cat: cat});
$("#content").addClass("visible");
function showPhpload(){$("#phpload").addClass("visible");}
function showBg(){$("#zoneBackground").addClass("visible");}
setTimeout(showBg, 20)
setTimeout(showPhpload, 40)
// addPosition('zone', id);
// addUrlPosition('zone',id);
console.log('zone opened:' + id);
};
/////////////////// OPEN MORE MAPS ///////////////////
var mapLayer = 2;
function openMap(id, landingURL) {
console.log('map to open:' +id);
var mapLayerId = "#map" + mapLayer;
const targetMap = document.querySelector('.'+id+'-map');
if (targetMap != null) {
if (focusOpenCheck == 0){
mapLayer--;
mapLayerId = "#map" + mapLayer;
document.querySelector(mapLayerId).setAttribute('class','mapOver');
console.log('back button was pushed ! or map open that was open just before !')
closeZone();
document.querySelector('#map' + mapLayer).innerHTML = "";
console.log('map from before was cleaned/emtyed')
}
else {
console.log('focusCloseCheck was still 1')
focusClose();
}
return
}
if (landingURL != 1) {
window.history.pushState('','','?/'+id+'');
addUrl("?/"+id);
console.log('window history gepush auf ?/'+id+' - 1');
}
else {
console.log('window history was not pushed beceause coming here from a direct url !')
}
focusClose();
$(mapLayerId).load("hotgluetransformation.php", {mapId: id});
$(mapLayerId).addClass("visible "+id+'-map');
openZone(id);
console.log('map-opened: ' + id + ' - actual maplayer: ' + mapLayer);
mapLayer++;
console.log('mapLayer-value was augmented!')
};
/////////////////// CLOS MORE MAPS ///////////////////
function closeMap(mapToCloseId) {
document.querySelector("#map" + mapToCloseId).setAttribute('class','mapOver');
// $("#map" + mapToCloseId).setAttribute('class','mapOver');
console.log("#map" + mapToCloseId + ' classes were reset ! ')
if (mapToCloseId > 1) {
document.getElementById('map' + mapToCloseId).innerHTML = "";
// alert("map" + mapToCloseId);
}
console.log('map closed');
};
</script>
<script>
/////////////////// OPEN FOCUS ///////////////////
let focusOpenCheck = 0;
function focusItem(id) {
if (id.indexOf("http") >= 0) {
console.log('try to focus extern link');
window.history.pushState('','','?/extern');
addUrl("?/extern");
}
else {
if (window.location.search != '?/'+id) {
window.history.pushState('','','?/'+id+'');
addUrl("?/"+id);
console.log('window history gepush auf ?/'+id+' - 2');
}
else {
console.log('window location was already pushed !');
}
}
$("#phploadFocus").load("loadFocus.php", {
id: id});
console.log('focusItem: '+id+'');
$("#focusLayer").addClass("visible");
$("#focusBackground").addClass("visible");
focusOpenCheck = 1;
};
</script>
<div id="phpload">
<div id="catPlaceHolder"> </div>
</div>
</div>
</div>
<div id="map1" class="mapOver"></div>
<div id="map2" class="mapOver"></div>
<div id="map3" class="mapOver"></div>
<div id="map4" class="mapOver"></div>
<div id="map5" class="mapOver"></div>
<div id="map6" class="mapOver"></div>
<div id="map7" class="mapOver"></div>
<div id="map8" class="mapOver"></div>
<div id="map9" class="mapOver"></div>
<div id="map10" class="mapOver"></div>
<div id="map11" class="mapOver"></div>
<div id="map12" class="mapOver"></div>
<div id="map13" class="mapOver"></div>
<div id="map14" class="mapOver"></div>
<div id="map15" class="mapOver"></div>
<div id="map16" class="mapOver"></div>
<div id="map17" class="mapOver"></div>
<div id="map18" class="mapOver"></div>
<div id="map19" class="mapOver"></div>
<div id="focusLayer">
<div id='focusBackground' onclick='back()'></div>
<div id="phploadFocus"></div>
</div>
<script>
/////////////////// CLOSE FOCUS ///////////////////
function focusClose() {
// alert("close");
const radiobody = document.querySelector(".radiobody")
radiobody.style.filter = "blur(0)";
$(".focusBox").removeClass("visible");
$("#focusBackground").removeClass("visible");
$("#focusLayer").removeClass("visible");
document.getElementById('phploadFocus').innerHTML = '';
console.log('focus closed 3');
focusOpenCheck = 0;
};
</script>
<script>
document.querySelectorAll('.alert').forEach(occurence => {
occurence.addEventListener('click', (e) => {
alert("test");
})});
nowLive();
// // Eventuelle Initialisierung
// window.onload = function() {
startLiveUpdate(); // Intervall bei Seitenladen starten
// };
</script>
<script>
const loadingURL = window.location.search;
const loadingURLsearch = loadingURL.split('?/')[1];
if (loadingURLsearch != null){
console.log('already something in url');
openUrl(1);
}
else {
window.history.pushState('','','https://pl4tform.org');
addUrl("");
console.log('window history auf beginn gesetzt');
}
</script>
</div>
</body>
</html>