Ajout de l'appel a l'API pretalx

js/components/upcoming-talks.js

@@ -0,0 +1,90 @@
+import { getUpcomingTalksForRoom } from "../pretalx.js"
+
+class UpcomingTalksElement extends HTMLElement {
+    #roomId
+    #loadingPromise
+
+    srcObject = undefined
+
+    get roomId(){
+        return this.#roomId
+    }
+
+    set roomId(val){
+        this.#roomId = val
+    }
+
+    connectedCallback(){
+        this.updateContent()
+    }
+
+    updateContent(){
+        if(!this.roomId){
+            this.replaceChildren()
+            return
+        }
+
+        if(!this.srcObject){
+            
+            if(!this.#loadingPromise){
+                this.fetchTalks()
+            }
+
+            let loading = document.createElement("div")
+            loading.classList.add("loading")
+            loading.textContent = "Chargement des événements..."
+            this.replaceChildren(loading)
+
+        } else {
+
+            let childrens = []
+
+            for(let talk of this.srcObject){
+                let item = document.createElement("camp-talk")
+                item.srcObject = talk
+
+                let a = document.createElement("a")
+                a.href = talk.displayUrl
+                a.target = "_blank"
+                a.append(item)
+
+                childrens.push(a)
+            }
+
+            this.classList.toggle("empty", childrens.length == 0)
+            if(childrens.length == 0){
+                let empty = document.createElement("p")
+                empty.classList.add("empty")
+                empty.textContent = `Aucun événement à venir dans cette salle`
+                childrens.push(empty)
+            }
+            this.replaceChildren(...childrens)
+
+        }
+
+        this.classList.toggle("loading", !this.srcObject && this.#loadingPromise)
+    }
+
+    async fetchTalks(){
+        let prom = (async () => {
+            this.srcObject = await getUpcomingTalksForRoom(this.roomId)
+            this.#loadingPromise = null
+            this.updateContent()
+        })()
+        this.#loadingPromise = prom
+        await prom
+    }
+
+    static observedAttributes = ["room-id"]
+
+    attributeChangedCallback(name, oldVal, newVal){
+        switch(name){
+            case "room-id":
+                this.roomId = newVal
+                break;
+        }
+    }
+
+}
+
+customElements.define("camp-upcoming-talks", UpcomingTalksElement);