edit: passage en mode off + webring

js/floating.js

@@ -0,0 +1,55 @@
+function deselectAll(){
+    let windowList = document.querySelectorAll('main > .floating');
+    //console.log('selected windows:', windowList);
+    for(const e of windowList){
+        e.setAttribute('data-window', 'background');
+    }
+}
+
+export function makeItFloat(target){
+    const startTarget = target.querySelector('h1');
+
+    //console.log('selected target :', startTarget);
+
+    let startX, startY;
+    let selectedWindow;
+    let selectedPointer;
+
+    startTarget.addEventListener('pointerdown', (event) => {
+        selectedPointer = event.pointerId;
+        startX = event.pageX;
+        startY = event.pageY;
+        selectedWindow = target;
+        deselectAll();
+        target.setAttribute('data-window', 'selected');
+        //console.log('clicking...')
+    })
+
+    document.addEventListener('pointermove', (event) => {
+    if(event.pointerId === selectedPointer && selectedWindow === target){
+        event.preventDefault();
+        document.querySelector('html').style.overflow = 'hidden';
+        //console.log('moving...')
+        let currentX = event.pageX;
+        let currentY = event.pageY;
+        let moveX = target.offsetLeft + currentX - startX;
+        target.style.left =  moveX + 'px';
+        let moveY = target.offsetTop + currentY - startY;
+        target.style.top = moveY + 'px';
+        startX = currentX;
+        startY = currentY;
+    }
+    });
+
+    document.addEventListener('pointerup', () => {
+        //console.log('STOP !')
+        selectedPointer = null;
+        document.querySelector('html').style.overflow = '';
+    })
+
+    document.addEventListener('pointercancel', () => {
+        //console.log('STOP !')
+        selectedPointer = null;
+        document.querySelector('html').style.overflow = '';
+    })
+}