From 96a1b496938bec61a9eaac3d8489f4ae958d78a1 Mon Sep 17 00:00:00 2001 From: Dominic Zimmer Date: Mon, 20 Apr 2020 11:07:15 +0200 Subject: [PATCH] Update master view, Add sortable.js example --- model.py | 33 ++++++++++- static/views/master/script.js | 92 +++++++++++++++++++++++-------- static/views/master/template.html | 2 + tehsession.json | 43 +-------------- ui.html | 3 +- 5 files changed, 105 insertions(+), 68 deletions(-) diff --git a/model.py b/model.py index 7f01364..4f661df 100644 --- a/model.py +++ b/model.py @@ -136,6 +136,12 @@ class Model(object): data["username"] = client.name data["session"] = session.to_json() data["items"] = self.to_json()["items"] + data["inventories"] = {} + for _client in session.inventories: + _client = self.clients[_client] + inventory = session.get_items(_client.id) + inventory = list(map(lambda itemid: self.to_json()["items"][itemid], inventory)) + data["inventories"][_client.name] = inventory for socket in self.sockets[clientid]: await socket.send_json(data) @@ -200,20 +206,39 @@ class Session: self.name = model["name"] self.clients = model["clients"] self.owner = model["owner"] + if "inventories" in model: + self.inventories = model["inventories"] + else: + self.inventories = {} elif owner and name: self.id = generate_random_id() self.clients = [] self.owner = owner self.name = name + self.inventories = {} else: raise Exception("Illegal session constructor") + def get_items(self, playerid): + print(f"get_items(self, {playerid}) called") + print(f"{self.inventories=}") + if playerid in self.inventories: + return self.inventories[playerid] + else: + return [] + + def give_item(self, playerid, itemid): + if not playerid in self.inventories: + self.inventories[playerid] = [] + self.inventories[playerid].append(itemid) + def to_json(self): model = { "id": self.id, "name": self.name, "clients": self.clients, "owner": self.owner, + "inventories": self.inventories } return model @@ -241,17 +266,22 @@ class Client: class Item: - def __init__(self, model = None, name = None, description = "", image = ""): + def __init__(self, model = None, name = None, description = "", image = "", tags = {}): if model: self.id = model["id"] self.name = model["name"] self.description = model["description"] self.image = model["image"] + if "tags" in model: + self.tags = model["tags"] + else: + self.tags = {} elif name: self.id = generate_random_id() self.name = name self.description = description self.image = image + self.tags = tags else: raise Exception("Illegal Item Constructor") @@ -261,5 +291,6 @@ class Item: "name": self.name, "description": self.description, "image": self.image, + "tags": self.tags, } return model diff --git a/static/views/master/script.js b/static/views/master/script.js index 8ab623a..fa2ea9f 100644 --- a/static/views/master/script.js +++ b/static/views/master/script.js @@ -1,30 +1,7 @@ var text = document.getElementById("msg").innerText msg = JSON.parse(text) -document.getElementById("btn-leave-session").onclick = async (e) => await fetch('api/leave_session', { - method: 'POST', body: JSON.stringify({}) - }); -var session = msg.session; -document.getElementById("session").innerText = session["name"]; -document.getElementById('label-username').innerText = msg.username; - -document.getElementById("btn-gen-item").onclick = async (e) => { - name = document.getElementById("input-gen-item-name").value; - description = document.getElementById("input-gen-item-description").value; - image = document.getElementById("input-gen-item-image").value; - if (Boolean(name)) { - await fetch('api/create_item', { method: 'POST', body: JSON.stringify( - {'name': name, 'description': description, 'image': image} - )}); - } -}; -var itemsdiv = document.getElementById("items"); -var items = msg.items; - -while (itemsdiv.children.length) itemsdiv.lastChild.remove(); - -Object.keys(items).forEach( item => { - var item = items[item]; +function draw_item(item) { const itemdiv = document.createElement('div'); var name = item["name"] var description = item["description"] @@ -49,7 +26,74 @@ Object.keys(items).forEach( item => { itemdiv.appendChild(imageimg); itemdiv.appendChild(descriptionspan); itemdiv.style.display = "inline-block" + itemdiv.style.background = "lightcoral" + return itemdiv +} +document.getElementById("btn-leave-session").onclick = async (e) => await fetch('api/leave_session', { + method: 'POST', body: JSON.stringify({}) + }); +var session = msg.session; +document.getElementById("session").innerText = session["name"]; +document.getElementById('label-username').innerText = msg.username; + +document.getElementById("btn-gen-item").onclick = async (e) => { + name = document.getElementById("input-gen-item-name").value; + description = document.getElementById("input-gen-item-description").value; + image = document.getElementById("input-gen-item-image").value; + if (Boolean(name)) { + await fetch('api/create_item', { method: 'POST', body: JSON.stringify( + {'name': name, 'description': description, 'image': image} + )}); + } +}; +var wrapper = document.getElementById("items"); +var items = msg.items; +var itemsdiv = document.createElement('div'); +var itemsheading = document.createElement('h3'); +itemsheading.innerText = "All Items"; +wrapper.style.background = "lightblue"; +wrapper.style.display = "table"; + +while (wrapper.children.length) wrapper.lastChild.remove(); + +Object.keys(items).forEach( item => { + + var item = items[item]; + itemdiv = draw_item(item); itemsdiv.appendChild(itemdiv); }); +Sortable.create(itemsdiv, {"group": "items"}); +wrapper.appendChild(itemsheading); +wrapper.appendChild(itemsdiv); + + +var inventories = document.getElementById("inventories"); +while (inventories.children.length) inventories.lastChild.remove(); + +Object.keys(msg.inventories).forEach( name => { + inventory = msg.inventories[name]; + inventorydiv = document.createElement('div'); + inventorydiv.style.display = "block"; + titlespan = document.createElement('h4'); + titlespan.innerText = name; + titlespan.style.textAlign = "center"; + inventorydiv.appendChild(titlespan); + + Object.keys(inventory).forEach( item => { + item = inventory[item]; + var thediv = draw_item(item); + thediv.style.display = "block"; + inventorydiv.appendChild(thediv); + inventorydiv.style.display = "inline-block"; + }); + Sortable.create(inventorydiv, {"group": "items"}); + + inventorydiv.style.background = "lightgreen"; + + inventories.appendChild(inventorydiv); + +}); + +inventories.style.display = "inline-block"; diff --git a/static/views/master/template.html b/static/views/master/template.html index d49f6df..edebe27 100644 --- a/static/views/master/template.html +++ b/static/views/master/template.html @@ -10,3 +10,5 @@ Welcome to , lobbymaster
+
+
diff --git a/tehsession.json b/tehsession.json index 70cf9e1..54c9d91 100644 --- a/tehsession.json +++ b/tehsession.json @@ -1,42 +1 @@ -{ - "sessions": { - "2b7jrklcn6eulwbw": { - "id": "2b7jrklcn6eulwbw", - "name": "Die coole session von Player 1", - "clients": [], - "owner": "bkrqopf5j6q3tpta" - } - }, - "clients": { - "bkrqopf5j6q3tpta": { - "id": "bkrqopf5j6q3tpta", - "name": "Player 1", - "session": "" - }, - "cho2o2ntflm4mq3u": { - "id": "cho2o2ntflm4mq3u", - "name": "uiae", - "session": "" - } - }, - "items": { - "hr3gqfed4zelzdcz": { - "id": "hr3gqfed4zelzdcz", - "name": "Revive", - "description": "Revives a KO pokemon and brings it to 50% health", - "image": "https://1.bp.blogspot.com/-Hz8sIf0g7cY/VsyVIWiLsnI/AAAAAAAAnII/DjW20xLr0R4/s1600/max_revive_by_peetzaahhh2010-d8oki1o.png" - }, - "7htnswtslkla6rqh": { - "id": "7htnswtslkla6rqh", - "name": "Potion", - "description": "Heals your Pokey-Man by 20 hp", - "image": "https://cdn.bulbagarden.net/upload/thumb/4/45/PotionBaseSet94.jpg/200px-PotionBaseSet94.jpg" - }, - "tuqjjll2cltlw6i6": { - "id": "tuqjjll2cltlw6i6", - "name": "Revive\u2122", - "description": "When mom tells you that there is Max-Revive at home", - "image": "https://www.pokewiki.de/images/5/58/Vitalkraut_Traumwelt.png" - } - } -} +{"sessions": {"2b7jrklcn6eulwbw": {"id": "2b7jrklcn6eulwbw", "name": "Die coole session von Player 1", "clients": ["bkrqopf5j6q3tpta", "hmrcjnvo2ngs7265"], "owner": "bkrqopf5j6q3tpta", "inventories": {"cho2o2ntflm4mq3u": ["hr3gqfed4zelzdcz", "hr3gqfed4zelzdcz"], "bkrqopf5j6q3tpta": ["7htnswtslkla6rqh", "tuqjjll2cltlw6i6"]}}}, "clients": {"bkrqopf5j6q3tpta": {"id": "bkrqopf5j6q3tpta", "name": "Player 1", "session": "2b7jrklcn6eulwbw"}, "cho2o2ntflm4mq3u": {"id": "cho2o2ntflm4mq3u", "name": "uiae", "session": ""}, "hmrcjnvo2ngs7265": {"id": "hmrcjnvo2ngs7265", "name": "Joe", "session": "2b7jrklcn6eulwbw"}}, "items": {"hr3gqfed4zelzdcz": {"id": "hr3gqfed4zelzdcz", "name": "Revive", "description": "Revives a KO pokemon and brings it to 50% health", "image": "https://1.bp.blogspot.com/-Hz8sIf0g7cY/VsyVIWiLsnI/AAAAAAAAnII/DjW20xLr0R4/s1600/max_revive_by_peetzaahhh2010-d8oki1o.png", "tags": {}}, "7htnswtslkla6rqh": {"id": "7htnswtslkla6rqh", "name": "Potion", "description": "Heals your Pokey-Man by 20 hp", "image": "https://cdn.bulbagarden.net/upload/thumb/4/45/PotionBaseSet94.jpg/200px-PotionBaseSet94.jpg", "tags": {}}, "tuqjjll2cltlw6i6": {"id": "tuqjjll2cltlw6i6", "name": "Revive\u2122", "description": "When mom tells you that there is Max-Revive at home", "image": "https://www.pokewiki.de/images/5/58/Vitalkraut_Traumwelt.png", "tags": {}}}} \ No newline at end of file diff --git a/ui.html b/ui.html index f0782e8..116ace5 100644 --- a/ui.html +++ b/ui.html @@ -3,10 +3,11 @@ leafblade Minecraft Server +