npm - @nebularstreams/overlay-sdk - Versions diffs - 1.0.0 - Mend

@nebularstreams/overlay-sdk 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (133) hide show

package/templates/all/gambling/keno/index.html ADDED Viewed

@@ -0,0 +1,202 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>Keno Live Board</title>
+    <style>
+        * {
+            box-sizing: border-box
+        }
+        html, body {
+            width: 100%;
+            height: 100%;
+            margin: 0;
+            overflow: hidden;
+            background: transparent
+        }
+        body {
+            font-family: Inter, system-ui, sans-serif;
+            color: #fff
+        }
+        .keno {
+            position: absolute;
+            inset: auto 5% 9% 5%;
+            display: grid;
+            grid-template-columns: 19rem 1fr;
+            gap: .9rem;
+        }
+        .side, .board {
+            background: #081b2df2;
+            border: 1px solid #ffffff29;
+            border-radius: 1rem;
+            box-shadow: 0 1.3rem 3.5rem #0006
+        }
+        .side {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            padding: 1.3rem;
+            background: radial-gradient(circle at 50% 30%, #174a67, #071725 70%);
+            text-align: center
+        }
+        .logo {
+            color: #61ddff;
+            font-size: 1.15rem;
+            font-weight: 900;
+            letter-spacing: .2em
+        }
+        .latest {
+            width: 10.5rem;
+            height: 10.5rem;
+            margin: 1.2rem;
+            display: grid;
+            place-items: center;
+            border-radius: 50%;
+            background: radial-gradient(circle at 32% 25%, #fff 0 6%, #73f2ff 28%, #1689c5 72%);
+            border: .5rem solid #d8faff;
+            color: #062239;
+            font-size: 4.5rem;
+            font-weight: 950;
+            animation: pop .4s ease
+        }
+        .title {
+            font-size: 1.9rem;
+            font-weight: 900
+        }
+        .subtitle {
+            margin-top: .4rem;
+            color: #9eb9c9;
+            font-size: 1.25rem;
+            line-height: 1.3
+        }
+        .count {
+            margin-top: 1.2rem;
+            color: #61ddff;
+            font-size: 1.15rem;
+            font-weight: 850
+        }
+        .board {
+            padding: 1rem
+        }
+        .header {
+            display: flex;
+            justify-content: space-between;
+            margin-bottom: .75rem
+        }
+        .header strong {
+            font-size: 1.3rem;
+            letter-spacing: .1em
+        }
+        .header span {
+            color: #91aebf;
+            font-size: 1rem;
+            font-weight: 750
+        }
+        .numbers {
+            display: grid;
+            grid-template-columns:repeat(10, minmax(0, 1fr));
+            gap: .36rem
+        }
+        .number {
+            height: 3.6rem;
+            display: grid;
+            place-items: center;
+            border-radius: .45rem;
+            background: #ffffff0a;
+            border: 1px solid #ffffff14;
+            color: #ffffff54;
+            font-size: 1.2rem;
+            font-weight: 800
+        }
+        .number.hit {
+            background: #eefcff;
+            color: #08233a;
+            border-color: #fff
+        }
+        .number.latest {
+            width: auto;
+            height: 3.6rem;
+            margin: 0;
+            border: .15rem solid #bbf7ff;
+            background: #25c5ee;
+            color: #062239;
+            font-size: 1.35rem;
+            transform: scale(1.12);
+            box-shadow: 0 .6rem 1.3rem #0008;
+            z-index: 2
+        }
+        @keyframes pop {
+            from {
+                opacity: 0;
+                transform: scale(.45) rotate(18deg)
+            }
+        }
+    </style>
+</head>
+<body>
+<main class="keno">
+    <aside class="side">
+        <div class="logo">KENO LIVE</div>
+        <div class="latest" id="latest">63</div>
+        <div class="title" id="title">Evening Draw</div>
+        <div class="subtitle" id="subtitle">Watch your numbers light up</div>
+        <div class="count" id="count">9 numbers drawn</div>
+    </aside>
+    <section class="board">
+        <div class="header"><strong>DRAW BOARD</strong><span>1–80 · LATEST NUMBER IN BLUE</span></div>
+        <div class="numbers" id="numbers"></div>
+    </section>
+</main>
+<script>
+	const
+		ALL = Array.from({length: 80}, (_, i) => i + 1);
+	const $ = id => document.getElementById(id), cells = new Map();
+	ALL.forEach(n => {
+		const cell = document.createElement("div");
+		cell.className = "number";
+		cell.textContent = n;
+		$("numbers").append(cell);
+		cells.set(n, cell)
+	});
+	function render(numbers) {
+		const values = (Array.isArray(numbers) ? numbers : []).map(Number).filter(n => n >= 1 && n <= 80), hits = new Set(values), latest = values.at(-1);
+		cells.forEach((cell, n) => {
+			cell.classList.toggle("hit", hits.has(n));
+			cell.classList.toggle("latest", n === latest)
+		});
+		$("latest").textContent = latest ?? "—";
+		$("count").textContent = `${hits.size} ${hits.size === 1 ? "number" : "numbers"} drawn`
+	}
+	window.addEventListener("nebular-overlay:update", ({detail}) => {
+		if (detail.content?.title != null) $("title").textContent = detail.content.title;
+		if (detail.content?.subtitle != null) $("subtitle").textContent = detail.content.subtitle;
+		if (detail.draw?.numbers != null) render(detail.draw.numbers)
+	});
+</script>
+</body>
+</html>

package/templates/all/gambling/keno/manifest.json ADDED Viewed

@@ -0,0 +1,129 @@
+{
+  "instructions": "Select all numbers drawn in the current game and edit the draw title or subtitle as needed. Press Update after each draw to refresh the board. Use Reset draw to clear the numbers, then press Update to publish the reset.",
+  "meta": {
+    "content/title": {
+      "type": "string",
+      "phase": "edit",
+      "label": "Draw title", "hint": "Enter draw title",
+      "default": "Evening Draw"
+    },
+    "content/subtitle": {
+      "type": "string",
+      "phase": "edit",
+      "label": "Subtitle", "hint": "Enter subtitle",
+      "default": "Watch your numbers light up"
+    },
+    "draw/numbers": {
+      "type": "multi",
+      "phase": "play",
+      "container": "big",
+      "label": "Drawn numbers", "hint": "Numbers selected in the current draw",
+      "choose": [
+        1,
+        2,
+        3,
+        4,
+        5,
+        6,
+        7,
+        8,
+        9,
+        10,
+        11,
+        12,
+        13,
+        14,
+        15,
+        16,
+        17,
+        18,
+        19,
+        20,
+        21,
+        22,
+        23,
+        24,
+        25,
+        26,
+        27,
+        28,
+        29,
+        30,
+        31,
+        32,
+        33,
+        34,
+        35,
+        36,
+        37,
+        38,
+        39,
+        40,
+        41,
+        42,
+        43,
+        44,
+        45,
+        46,
+        47,
+        48,
+        49,
+        50,
+        51,
+        52,
+        53,
+        54,
+        55,
+        56,
+        57,
+        58,
+        59,
+        60,
+        61,
+        62,
+        63,
+        64,
+        65,
+        66,
+        67,
+        68,
+        69,
+        70,
+        71,
+        72,
+        73,
+        74,
+        75,
+        76,
+        77,
+        78,
+        79,
+        80
+      ],
+      "cols": 10,
+      "rows": 8,
+      "responsive": true,
+      "minCellWidth": "2.54rem",
+      "default": [
+        4,
+        11,
+        23,
+        37,
+        44,
+        52,
+        58,
+        71,
+        63
+      ]
+    },
+    "draw/reset": {
+      "type": "reset",
+      "phase": "play",
+      "icon": "undo",
+      "text": "Reset draw", "hint": "Clear every number from the current draw",
+      "values": {
+        "draw/numbers": []
+      }
+    }
+  }
+}

package/templates/all/gambling/lottery/index.html ADDED Viewed

@@ -0,0 +1,159 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>Lottery Draw</title>
+    <style>
+        * {
+            box-sizing: border-box
+        }
+        html, body {
+            width: 100%;
+            height: 100%;
+            margin: 0;
+            overflow: hidden;
+            background: transparent
+        }
+        body {
+            font-family: Inter, system-ui, sans-serif;
+            color: #fff
+        }
+        .draw {
+            position: absolute;
+            left: 6%;
+            right: 6%;
+            bottom: 9%;
+            padding: 1.5rem 1.8rem 1.8rem;
+            background: linear-gradient(135deg, #281451f2, #0c1838f2);
+            border: 1px solid #ffffff38;
+            border-radius: 1.4rem;
+            box-shadow: 0 1.5rem 4rem #0006
+        }
+        .head {
+            display: flex;
+            justify-content: space-between;
+            align-items: end
+        }
+        .eyebrow {
+            color: #8ce8ff;
+            font-size: 1.2rem;
+            font-weight: 850;
+            letter-spacing: .18em
+        }
+        .title {
+            margin-top: .25rem;
+            font-size: 2.6rem;
+            font-weight: 950
+        }
+        .status {
+            color: #c8c6dd;
+            font-size: 1.3rem;
+            font-weight: 750
+        }
+        .balls {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            gap: 1.1rem;
+            min-height: 12rem;
+            margin-top: 1.2rem;
+            padding: 1.2rem;
+            border-radius: 1rem;
+            background: #ffffff0c
+        }
+        .empty {
+            color: #ffffff66;
+            font-size: 1.6rem;
+            font-weight: 750
+        }
+        .ball {
+            width: 8rem;
+            height: 8rem;
+            display: grid;
+            place-items: center;
+            border-radius: 50%;
+            background: radial-gradient(circle at 32% 25%, #fff 0 7%, #70e2ff 29%, #385ddb 72%);
+            border: .45rem solid #ffffffc7;
+            color: #10173c;
+            font-size: 3rem;
+            font-weight: 950;
+            box-shadow: inset -.7rem -.8rem 1.2rem #14217666, 0 .8rem 1.6rem #0006
+        }
+        .ball.latest {
+            width: 9.5rem;
+            height: 9.5rem;
+            background: radial-gradient(circle at 32% 25%, #fff 0 7%, #ffe66d 29%, #ff8d21 72%);
+            animation: drop .45s cubic-bezier(.2, .9, .35, 1.25)
+        }
+        .order {
+            margin-top: .65rem;
+            text-align: center;
+            color: #aaa9c3;
+            font-size: 1.15rem;
+            font-weight: 800;
+            letter-spacing: .1em
+        }
+        @keyframes drop {
+            from {
+                opacity: 0;
+                transform: translateY(-4rem) rotate(-20deg) scale(.6)
+            }
+        }
+    </style>
+</head>
+<body>
+<section class="draw">
+    <div class="head">
+        <div>
+            <div class="eyebrow" id="eyebrow">OFFICIAL DRAW</div>
+            <div class="title" id="title">Lucky 49</div>
+        </div>
+        <div class="status" id="status">6 numbers drawn</div>
+    </div>
+    <div class="balls" id="balls"></div>
+    <div class="order">NUMBERS ARE DISPLAYED IN DRAW ORDER</div>
+</section>
+<script>
+	const ALL = Array.from({length: 49}, (_, i) => i + 1);
+	const $ = id => document.getElementById(id);
+	function render(numbers) {
+		const values = (Array.isArray(numbers) ? numbers : []).map(Number).filter(n => n >= 1 && n <= 49), holder = $("balls");
+		holder.replaceChildren();
+		if (!values.length) {
+			const empty = document.createElement("div");
+			empty.className = "empty";
+			empty.textContent = "Waiting for the first number…";
+			holder.append(empty)
+		} else values.forEach((number, index) => {
+			const ball = document.createElement("div");
+			ball.className = `ball ${index === values.length - 1 ? "latest" : ""}`;
+			ball.textContent = number;
+			holder.append(ball)
+		});
+		$("status").textContent = `${values.length} ${values.length === 1 ? "number" : "numbers"} drawn`
+	}
+	window.addEventListener("nebular-overlay:update", ({detail}) => {
+		if (detail.content?.eyebrow != null) $("eyebrow").textContent = detail.content.eyebrow;
+		if (detail.content?.title != null) $("title").textContent = detail.content.title;
+		if (detail.draw?.numbers != null) render(detail.draw.numbers)
+	});
+</script>
+</body>
+</html>

package/templates/all/gambling/lottery/manifest.json ADDED Viewed

@@ -0,0 +1,95 @@
+{
+  "instructions": "Select the official drawn numbers, edit the lottery title and draw label if needed, then press Update to publish the result strip. Use Reset draw to clear the numbers, then press Update to publish the reset.",
+  "meta": {
+    "content/eyebrow": {
+      "type": "string",
+      "phase": "edit",
+      "label": "Draw label", "hint": "Enter short label",
+      "default": "OFFICIAL DRAW"
+    },
+    "content/title": {
+      "type": "string",
+      "phase": "edit",
+      "label": "Lottery title", "hint": "Enter lottery title",
+      "default": "Lucky 49"
+    },
+    "draw/numbers": {
+      "type": "multi",
+      "phase": "play",
+      "container": "big",
+      "label": "Drawn numbers", "hint": "Numbers selected in the current draw",
+      "choose": [
+        1,
+        2,
+        3,
+        4,
+        5,
+        6,
+        7,
+        8,
+        9,
+        10,
+        11,
+        12,
+        13,
+        14,
+        15,
+        16,
+        17,
+        18,
+        19,
+        20,
+        21,
+        22,
+        23,
+        24,
+        25,
+        26,
+        27,
+        28,
+        29,
+        30,
+        31,
+        32,
+        33,
+        34,
+        35,
+        36,
+        37,
+        38,
+        39,
+        40,
+        41,
+        42,
+        43,
+        44,
+        45,
+        46,
+        47,
+        48,
+        49
+      ],
+      "cols": 7,
+      "rows": 7,
+      "responsive": true,
+      "minCellWidth": "2.54rem",
+      "default": [
+        7,
+        14,
+        22,
+        31,
+        38,
+        46
+      ]
+    },
+    "draw/reset": {
+      "type": "reset",
+      "phase": "play",
+      "icon": "undo",
+      "text": "Reset draw", "hint": "Clear every number from the current draw",
+      "values": {
+        "draw/numbers": []
+      }
+    }
+  }
+}