js/cuteTexture.js

@@ -133,7 +133,7 @@ export function initCuteTexture(options){
   let mainShader = initMainShader(ctx, {
     shaderSource: shaderSourceOption
   })
-  console.log("Shader CuteTexture initialisé", mainShader)
+  //console.log("Shader CuteTexture initialisé", mainShader)
   
   const initTime = Date.now()
 

js/events.js

@@ -1,129 +1,43 @@
 export async function loadEvents(){
-  let eventList = document.querySelectorAll('#eventSection > article');
+  const eventList = document.querySelectorAll('#eventSection > article');
   //console.log("event list: ", eventList);
 
-  for (let event of eventList){
+  for (const event of eventList){
-    let title = event.querySelector('h4');
+    const title = event.querySelector('h4');
-    let date = event.querySelector('p.date');
+    const date = event.querySelector('p.date');
-    let posterLink = event.querySelector('a.iconBtnStyle').href;
+    const posterLink = event.querySelector('a.iconBtnStyle').href;
-    let posterHTML = await getPoster(posterLink);
+    const posterHTML = await getPoster(posterLink);
 
-    let poster = posterHTML.querySelector('body > article');
+    const poster = posterHTML.querySelector('body > article');
 
-    let posterStyle = posterHTML.querySelectorAll('head > style:not([data-import="no-import"])')
+    const posterStyle = posterHTML.querySelectorAll('head > style:not([data-import="no-import"])')
 
     //console.log('entry data :', title, date, poster, posterStyle);
 
-    let selectedEntry = createEntry(title, date, poster, posterStyle)
+    const selectedEntry = createEntry(title, date, poster, posterStyle)
 
     //console.log('created new details :', selectedEntry);
 
     event.replaceChildren(selectedEntry);
   }
-
-  /* let btnList = document.querySelectorAll('.eventEntry > .iconBtnStyle');
-
-  //console.log("source buttons : ", btnList)
-
-  let displayWindow = document.querySelector('#posterWindow');
-
-  let displayContainer = document.querySelector('#posterContainer');
-
-  let closeBtn = document.querySelector('#posterCloseBtn');
-
-  closeBtn.addEventListener('mousedown', () => {
-    displayWindow.style.visibility  = 'collapse';
-    displayContainer.replaceChildren();
-  })
-
-  closeBtn.addEventListener('touchstart', () => {
-    displayWindow.style.visibility  = 'collapse';
-    displayContainer.replaceChildren();
-  })
-
-  async function getPoster(src){
-    let res = await fetch(src);
-    if (res.ok){
-      let html_text = await res.text()
-      let html = new DOMParser().parseFromString(html_text, "text/html");
-        return html
-    } else{
-      console.log('error 333');
-        return
-    }
-  }
-
-  let eventList = [];
-
-  if( btnList.length > 0 ){
-    for (let btn of btnList ){
-      let link = btn.children[0];
-      link.style.pointerEvents = 'none';
-
-      //console.log(link.href);
-
-      let posterPage = await getPoster(link.href);
-
-      //console.log('selected poster: ', posterPage)
-
-      let titleData = posterPage.querySelector('title');
-      //console.log(titleData);
-
-      let styleList = Array.from(posterPage.querySelectorAll('head > style'));
-      //console.log(styleList)
-
-      styleList.splice(0,1);
-      //console.log(styleList)
-
-      eventList.push(
-        {
-          content: posterPage.querySelector('main'),
-          title: titleData.innerText,
-          stylesheet: styleList,
-          sourceBtn: btn
-        }
-      );
-    }
-  }
-
-  //console.log("event list : ", eventList);
-
-  if (eventList.length > 0){
-
-    eventList.forEach( (obj) =>{
-      let btn = obj.sourceBtn;
-      let content = obj.content;
-      let title = obj.title;
-      for (let style of obj.stylesheet){
-        document.head.append(style);
-      }
-      btn.addEventListener( 'click', () => {
-        //console.log("selection :", content)
-        displayWindow.style.visibility = 'visible';
-        let targetTitle = displayWindow.querySelector('h4');
-        targetTitle.innerText = title;
-        displayContainer.replaceChildren(content);
-      })
-    })
-  } */
 }
 
 async function getPoster(link){
-  let res = await fetch(link);
+  const res = await fetch(link);
   if (res.ok){
-      let html_text = await res.text()
+      const html_text = await res.text()
-      let html = new DOMParser().parseFromString(html_text, "text/html");
+      const html = new DOMParser().parseFromString(html_text, "text/html");
         return html
     } else{
-      console.log('error 333');
+      console.log('error 333: something went wrong with this poster...');
         return
     }
 
 }
 
 function createEntry(title, date, html, style){
-  let newEntry = document.createElement('details');
+  const newEntry = document.createElement('details');
-  let newSummary = document.createElement('summary');
+  const newSummary = document.createElement('summary');
   newSummary.append(title, date);
 
   newEntry.append(newSummary);
@@ -132,7 +46,7 @@ function createEntry(title, date, html, style){
 
   newEntry.name = "eventList"
 
-  for(let el of style){
+  for(const el of style){
     document.head.append(el);
   }
 

js/floating.js

@@ -1,7 +1,7 @@
 export function makeItFloat(target){
-    let startTarget = target.querySelector('.title');
+    const startTarget = target.querySelector('.title');
 
-    console.log('selected target :', startTarget);
+    //console.log('selected target :', startTarget);
 
     let startX, startY;
     let clicked = false;
@@ -11,14 +11,14 @@ export function makeItFloat(target){
         selectedPointer = event.pointerId;
         startX = event.pageX;
         startY = event.pageY;
-        console.log('clicking...')
+        //console.log('clicking...')
     })
 
     document.addEventListener('pointermove', (event) => {
     if(event.pointerId === selectedPointer){
         event.preventDefault();
         document.querySelector('html').style.overflow = 'hidden';
-        console.log('moving...')
+        //console.log('moving...')
         let currentX = event.pageX;
         let currentY = event.pageY;
         let moveX = target.offsetLeft + currentX - startX;
@@ -31,13 +31,13 @@ export function makeItFloat(target){
     });
 
     document.addEventListener('pointerup', () => {
-        console.log('STOP !')
+        //console.log('STOP !')
         selectedPointer = null;
         document.querySelector('html').style.overflow = '';
     })
 
     document.addEventListener('pointercancel', () => {
-        console.log('STOP !')
+        //console.log('STOP !')
         selectedPointer = null;
         document.querySelector('html').style.overflow = '';
     })

js/main.js

@@ -7,7 +7,7 @@ import { makeItFloat } from '/js/floating.js';
 loadEvents();
 loadStatus()
   .then((status) => {
-    console.log("Status actuel du LOL", status);
+    console.log("is LOL open ???", status.open);
 
     let cuteTexture = initCuteTexture({
       shaderSource: status.shaderSource

js/status.js

@@ -1,12 +1,20 @@
 import { getDocumentShaderSource } from './cuteTexture.js';
 
 export async function loadStatus(){
-  let res = await fetch('/status/index.html');
+  const uri = new URL('/status', document.baseURI);
 
-  let html_text = await res.text()
-  let html = new DOMParser().parseFromString(html_text, "text/html");
 
-  let shaderSource = getDocumentShaderSource(html);
+  const html = await (await fetch(uri, {cache: 'no-store'})).text();
+
+  const remoteDoc = new DOMParser().parseFromString(html, "text/html");
+
+  const base = remoteDoc.createElement('base');
+  base.href = uri.toString();
+  remoteDoc.head.prepend(base);
+
+  //console.log('selected file:', remoteDoc);
+
+  let shaderSource = getDocumentShaderSource(remoteDoc);
 
   let target = document.querySelector('#statuSection');
 
@@ -14,14 +22,16 @@ export async function loadStatus(){
 
   hiddenBtn.style.visibility = 'collapse';
 
-  let status = html.querySelector('#lolStatus');
+  let status = remoteDoc.querySelector('#lolStatus');
-  console.log('current status:', status.innerText);
+  //console.log('current status:', status);
 
   let isOpen = status.innerText.includes('ouvert');
 
-  let icon = html.querySelector('link[rel="icon"]');
+  let icon = remoteDoc.querySelector('link[rel="icon"]');
-  let style = html.querySelector('link[data-import="status-style"]');
+  let style = remoteDoc.querySelector('link[data-import="status-style"]');
-  //console.log("selected style: ", style);
+  let styleFile = style.href.split('/').at(-1);
+  style.href = uri + '/' + styleFile;
+  //console.log("selected style: ", style.href);
 
   document.head.append(icon);
   document.head.append(style);