From 9107cb9857d3e8b9c11770d7a6d0da3f08ac5958 Mon Sep 17 00:00:00 2001
From: jessikitty <jess.rogerson.29@outlook.com>
Date: Wed, 20 May 2026 15:22:36 +1000
Subject: [PATCH] v1.0.0: Device Create view

---
 Views/Devices/Create.cshtml | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)
 create mode 100644 Views/Devices/Create.cshtml

diff --git a/Views/Devices/Create.cshtml b/Views/Devices/Create.cshtml
new file mode 100644
index 0000000..93a344a
--- /dev/null
+++ b/Views/Devices/Create.cshtml
@@ -0,0 +1,24 @@
+@model Device
+@{ ViewData["Title"] = "New Kitten"; }
+<div class="row justify-content-center">
+    <div class="col-md-8 col-lg-6">
+        <div class="card"><div class="card-body">
+            <form asp-action="Create" method="post">
+                @Html.AntiForgeryToken()
+                <div class="mb-3"><label asp-for="Name" class="form-label">Display Name *</label><input asp-for="Name" class="form-control" placeholder="e.g. Front of House" required /><span asp-validation-for="Name" class="text-danger"></span></div>
+                <div class="mb-3"><label asp-for="Slug" class="form-label">URL Slug *</label><div class="input-group"><span class="input-group-text">/</span><input asp-for="Slug" class="form-control font-monospace" placeholder="frontofhouse" /></div><div class="form-text">Lowercase, no spaces. Auto-generated from name if left empty.</div><span asp-validation-for="Slug" class="text-danger"></span></div>
+                <div class="row g-3 mb-3"><div class="col-6"><label asp-for="ResolutionWidth" class="form-label">Width (px)</label><input asp-for="ResolutionWidth" class="form-control" type="number" min="320" max="7680" /></div><div class="col-6"><label asp-for="ResolutionHeight" class="form-label">Height (px)</label><input asp-for="ResolutionHeight" class="form-control" type="number" min="240" max="4320" /></div></div>
+                <div class="mb-3"><label class="form-label">Quick Presets</label><div class="d-flex flex-wrap gap-2"><button type="button" class="btn btn-sm btn-outline-secondary" onclick="setRes(1920,1080)">1080p</button><button type="button" class="btn btn-sm btn-outline-secondary" onclick="setRes(3840,2160)">4K</button><button type="button" class="btn btn-sm btn-outline-secondary" onclick="setRes(1080,1920)">Portrait</button><button type="button" class="btn btn-sm btn-outline-secondary" onclick="setRes(1280,720)">720p</button></div></div>
+                <div class="mb-4"><label asp-for="Transition" class="form-label">Transition Effect</label><select asp-for="Transition" class="form-select"><option value="fade">Fade</option><option value="slide">Slide</option><option value="none">None</option></select></div>
+                <div class="d-grid gap-2"><button type="submit" class="btn btn-primary btn-lg"><i class="bi bi-check-lg me-1"></i>Create Kitten</button><a href="/admin/devices" class="btn btn-outline-secondary">Cancel</a></div>
+            </form>
+        </div></div>
+    </div>
+</div>
+@section Scripts {
+    <script>
+        function setRes(w,h){document.getElementById('ResolutionWidth').value=w;document.getElementById('ResolutionHeight').value=h;}
+        document.getElementById('Name').addEventListener('input',function(){var s=document.getElementById('Slug');if(!s.dataset.manual)s.value=this.value.toLowerCase().replace(/[^a-z0-9]+/g,'').substring(0,50);});
+        document.getElementById('Slug').addEventListener('input',function(){this.dataset.manual='true';});
+    </script>
+}