From cb6e2c19524be23f5cbf35b31b0ee452ebfc2eb5 Mon Sep 17 00:00:00 2001
From: STEINNI <nicolas.stein@ext.ec.europa.eu>
Date: Sat, 15 Nov 2025 20:10:31 +0000
Subject: [PATCH] added EE to intro

---
 buildoz.css | 37 +++++++++++++++++++++++++++++++++++
 buildoz.js  | 56 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 93 insertions(+)

diff --git a/buildoz.css b/buildoz.css
index 31f86b6..e58b232 100644
--- a/buildoz.css
+++ b/buildoz.css
@@ -136,4 +136,41 @@ bz-toggler div.toggle-switch span.toggle-thumb  {
 
 bz-toggler div.toggle-switch span.toggle-thumb.turned-on {
     left : 1em;
+}
+
+bz-slidepane div.handle.top {
+    position: absolute;
+    top: 0;
+    left: 50%;
+    width: 40px;
+    height: 11px;
+    background: repeating-linear-gradient( to top, rgba(255,255,255,1) 0, rgba(255,255,255,1) 2px, rgba(0,0,0,0.2) 3px, rgba(0,0,0,0.2) 4px );
+    transform: translateX(-50%);
+}
+bz-slidepane div.handle.bottom {
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    width: 40px;
+    height: 11px;
+    background: repeating-linear-gradient( to bottom, rgba(255,255,255,1) 0, rgba(255,255,255,1) 2px, rgba(0,0,0,0.2) 3px, rgba(0,0,0,0.2) 4px );
+    transform: translateX(-50%);
+}
+bz-slidepane div.handle.left {
+    position: absolute;
+    left: 0;
+    top: 50%;
+    width: 11px;
+    height: 40px;
+    background: repeating-linear-gradient( to left, rgba(255,255,255,1) 0, rgba(255,255,255,1) 2px, rgba(0,0,0,0.2) 3px, rgba(0,0,0,0.2) 4px );
+    transform: translateY(-50%);
+}
+bz-slidepane div.handle.right {
+    position: absolute;
+    right: 0;
+    top: 50%;
+    width: 11px;
+    height: 40px;
+    background: repeating-linear-gradient( to right, rgba(255,255,255,1) 0, rgba(255,255,255,1) 2px, rgba(0,0,0,0.2) 3px, rgba(0,0,0,0.2) 4px );
+    transform: translateY(-50%);
 }
\ No newline at end of file
diff --git a/buildoz.js b/buildoz.js
index 74d2f0a..37a0377 100644
--- a/buildoz.js
+++ b/buildoz.js
@@ -247,3 +247,59 @@ class BZtoggler extends Buildoz {
     }    
 }
 Buildoz.define('toggler', BZtoggler)
+
+
+
+class BZslidePane extends Buildoz {
+
+    constructor(){
+        super()
+        this.open = false
+        this.defaultAttrs = {
+            side: 'bottom'
+        }
+        this.dragMove = this.dragMove.bind(this)
+        this.dragEnd = this.dragEnd.bind(this)
+    }
+
+    connectedCallback(){
+        super.connectedCallback()
+        this.handle = document.createElement('div')
+        this.handle.classList.add('handle')
+        this.handle.classList.add(this.getBZAttribute('side'))
+        this.prepend(this.handle)
+        this.handle.addEventListener('pointerdown', this.dragStart.bind(this))
+    }
+
+    dragStart(evt){ 
+        evt.target.setPointerCapture(evt.pointerId)        
+        this.dragStartX = evt.clientX
+        this.dragStartY = evt.clientY        
+        this.handle.addEventListener('pointermove', this.dragMove)
+        this.handle.addEventListener('pointerup', this.dragEnd)
+    }
+
+    dragMove(evt){
+        const dx = evt.clientX - this.dragStartX
+        const dy = evt.clientY - this.dragStartY
+
+        switch(this.getAttribute('side')){
+            case 'top':
+                break
+            case 'bottom':
+                break
+            case 'left':
+                break
+            case'right':
+                break
+        }
+    }
+
+    dragEnd(evt){
+        evt.target.releasePointerCapture(evt.pointerId)
+        this.handle.removeEventListener('pointermove', this.dragMove)
+        this.handle.removeEventListener('pointerup', this.dragEnd)
+    }
+}
+Buildoz.define('slidepane', BZslidePane)
+