dzoni/home-core-dev-assistant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: initial commit

Browse Source
This commit is contained in:
nikola
2026-05-19 14:53:37 +02:00
commit c6e7ac92ae
11 changed files with 660 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
guest-portal/app.js
+33
View File
@@ -0,0 +1,33 @@
(() => {
const status = document.getElementById("copy-status");
const buttons = document.querySelectorAll("[data-copy]");
buttons.forEach((btn) => {
btn.addEventListener("click", async () => {
const selector = btn.getAttribute("data-copy");
const el = document.querySelector(selector);
if (!el) return;
const value = (el.textContent || "").trim();
try {
await navigator.clipboard.writeText(value);
if (status) status.textContent = "Kopirano.";
} catch (_) {
if (status) status.textContent = "Ne mogu da kopiram automatski. Oznaci i copy rucno.";
}
});
});
const wifiQrIds = ["wifi-qr-sr", "wifi-qr-en"];
const portalQrIds = ["portal-qr-sr", "portal-qr-en"];
wifiQrIds.forEach((id) => {
const img = document.getElementById(id);
if (img) img.src = "/qr/wifi.svg";
});
portalQrIds.forEach((id) => {
const img = document.getElementById(id);
if (img) img.src = "/qr/portal.svg";
});
const bojanaQr = document.getElementById("bojana-qr");
if (bojanaQr) bojanaQr.src = "/qr/bojana.svg";
})();
guest-portal/bojana.html
+42
View File
@@ -0,0 +1,42 @@
<!doctype html>
<html lang="sr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Bojana | Home Core</title>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<main class="container">
<header class="hero">
<p class="eyebrow">Samo za tebe</p>
<h1>Bojana, dobrodosla kuci</h1>
<p class="lead">
Ako ovo citas, znaci da je Nikola uspeo da automatizuje makar nesto.
</p>
</header>
<section class="card">
<h2>Brzo uputstvo</h2>
<ol class="list ordered">
<li>Na telefonu drzi prst na praznom delu Home ekrana.</li>
<li>Izaberi <code>Widgets</code>.</li>
<li>Nadji <code>Home Assistant</code> widget.</li>
<li>Izaberi veliko svetlo iz dnevne sobe.</li>
<li>Gotovo: jedan tap = ON/OFF.</li>
</ol>
</section>
<section class="card love-note">
<h2>Poruka</h2>
<p>
Volim te. Hvala ti sto imas strpljenja za sve moje servere, kablove i
ideje. Ovaj klik je mali podsetnik da mi je dom najleps i kada je
haotican, jer smo zajedno.
</p>
</section>
<a class="btn secondary" href="./index.html">Nazad na Guest Portal</a>
</main>
</body>
</html>
guest-portal/en.html
+84
View File
@@ -0,0 +1,84 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Welcome | Home Core</title>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<main class="container">
<header class="hero">
<p class="eyebrow">Home Core Guest Portal</p>
<h1>Welcome to our apartment</h1>
<p class="lead">
Everything in one place: Wi-Fi, stay notes, and one-tap control for
the main living-room light.
</p>
<p class="lead">
Serbian version:
<a href="./index.html">Open SR page</a>
</p>
</header>
<section class="card">
<h2>1) Wi-Fi connection</h2>
<p class="muted">Use this network:</p>
<div class="row">
<div>
<label>SSID</label>
<code id="wifi-ssid-en">Zapadna</code>
</div>
<button data-copy="#wifi-ssid-en" class="btn secondary">Copy SSID</button>
</div>
<div class="row">
<div>
<label>Password</label>
<code id="wifi-pass-en">Ask host</code>
</div>
<button data-copy="#wifi-pass-en" class="btn secondary">
Copy Password
</button>
</div>
<p class="hint" id="copy-status">Tap Copy to copy text.</p>
<div class="qr-grid">
<div class="qr-card">
<h3>Wi-Fi QR (Android)</h3>
<img id="wifi-qr-en" alt="Wi-Fi QR" />
<p class="hint">Use camera scanner or Samsung QR scanner.</p>
</div>
<div class="qr-card">
<h3>Portal QR</h3>
<img id="portal-qr-en" alt="Portal QR" />
<p class="hint">Open this page quickly.</p>
</div>
</div>
</section>
<section class="card">
<h2>2) Main light (guest control)</h2>
<p class="muted">Buttons below call local Home Assistant webhooks.</p>
<div class="controls">
<form
action="/api/light/on"
method="post"
target="silent-submit"
>
<button type="submit" class="btn on">Turn ON</button>
</form>
<form
action="/api/light/off"
method="post"
target="silent-submit"
>
<button type="submit" class="btn off">Turn OFF</button>
</form>
</div>
<p class="hint">If needed, wait 1-2 seconds and tap again.</p>
<iframe name="silent-submit" title="silent-submit" hidden></iframe>
</section>
</main>
<script src="./app.js"></script>
</body>
</html>
guest-portal/index.html
+111
View File
@@ -0,0 +1,111 @@
<!doctype html>
<html lang="sr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Dobrodosli | Home Core</title>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<main class="container">
<header class="hero">
<p class="eyebrow">Home Core Guest Portal</p>
<h1>Dobrodosli u nas stan</h1>
<p class="lead">
Sve bitno na jednom mestu: Wi-Fi, pravila boravka i brzo dugme za
veliko svetlo u dnevnoj sobi.
</p>
<p class="lead">
English version:
<a href="./en.html">Open EN page</a>
</p>
</header>
<section class="card">
<h2>1) Wi-Fi povezivanje</h2>
<p class="muted">Ako ste gost, koristite ovu mrezu:</p>
<div class="row">
<div>
<label>SSID</label>
<code id="wifi-ssid">Zapadna</code>
</div>
<button data-copy="#wifi-ssid" class="btn secondary">Copy SSID</button>
</div>
<div class="row">
<div>
<label>Password</label>
<code id="wifi-pass">Pitaj domacina</code>
</div>
<button data-copy="#wifi-pass" class="btn secondary">
Copy Password
</button>
</div>
<p class="hint" id="copy-status">Klik na Copy da prekopiras.</p>
<div class="qr-grid">
<div class="qr-card">
<h3>QR za Wi-Fi (Android)</h3>
<img id="wifi-qr-sr" alt="Wi-Fi QR" />
<p class="hint">Skener kamere ili Samsung QR scanner.</p>
</div>
<div class="qr-card">
<h3>QR za Guest Portal</h3>
<img id="portal-qr-sr" alt="Portal QR" />
<p class="hint">Brz ulaz na ovu stranu.</p>
</div>
</div>
</section>
<section class="card">
<h2>2) Korisne informacije</h2>
<ul class="list">
<li>Molimo bez buke posle 23:00.</li>
<li>Pusenje je dozvoljeno samo na terasi.</li>
<li>Ako nesto nije jasno, pitajte domacina.</li>
<li>Izlazak iz stana: proverite vrata i svetla.</li>
</ul>
</section>
<section class="card">
<h2>3) Veliko svetlo (gosti)</h2>
<p class="muted">
Dugmad ispod rade lokalno kroz Home Assistant webhook.
</p>
<div class="controls">
<form
action="/api/light/on"
method="post"
target="silent-submit"
>
<button type="submit" class="btn on">Ukljuci svetlo</button>
</form>
<form
action="/api/light/off"
method="post"
target="silent-submit"
>
<button type="submit" class="btn off">Iskljuci svetlo</button>
</form>
</div>
<p class="hint">Ako ne reaguje odmah, sacekajte 1-2 sekunde i ponovite.</p>
<iframe name="silent-submit" title="silent-submit" hidden></iframe>
</section>
<section class="card bojana">
<h2>Za Bojanu</h2>
<p>
Posebna strana sa kratkim uputstvom i malim iznenadjenjem je ovde:
</p>
<a class="btn love" href="./bojana.html">Otvori Bojaninu stranu</a>
<div class="qr-grid single">
<div class="qr-card">
<h3>QR za Bojanu</h3>
<img id="bojana-qr" alt="Bojana QR" />
<p class="hint">Direktno otvara Bojaninu stranu.</p>
</div>
</div>
</section>
</main>
<script src="./app.js"></script>
</body>
</html>
guest-portal/nginx.conf
+27
View File
@@ -0,0 +1,27 @@
server {
listen 80;
server_name _;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri $uri/ =404;
}
location /api/ {
proxy_pass http://guest-portal-api:8081/;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
location /qr/ {
proxy_pass http://guest-portal-api:8081/qr/;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
guest-portal/style.css
+186
View File
@@ -0,0 +1,186 @@
:root {
--bg: #f6f5f1;
--card: #ffffff;
--text: #1d2129;
--muted: #5b6470;
--line: #e4e7ec;
--on: #0a7a3d;
--off: #8f1d1d;
--accent: #1f5ad2;
--love: #b0216a;
}
* {
box-sizing: border-box;
}
body {
margin: 0;
font-family: "Segoe UI", Roboto, sans-serif;
background: radial-gradient(circle at top right, #fff6fb 0%, var(--bg) 45%);
color: var(--text);
}
.container {
max-width: 820px;
margin: 0 auto;
padding: 24px 16px 48px;
}
.hero {
margin-bottom: 18px;
}
.eyebrow {
margin: 0 0 6px;
color: var(--muted);
text-transform: uppercase;
letter-spacing: 0.08em;
font-size: 12px;
font-weight: 600;
}
h1 {
margin: 0 0 10px;
line-height: 1.2;
}
h2 {
margin-top: 0;
}
.lead {
margin: 0;
color: var(--muted);
}
.card {
background: var(--card);
border: 1px solid var(--line);
border-radius: 14px;
padding: 18px;
margin-top: 14px;
}
.muted {
color: var(--muted);
}
.row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin: 12px 0;
padding: 10px;
border: 1px solid var(--line);
border-radius: 10px;
}
label {
display: block;
color: var(--muted);
font-size: 12px;
margin-bottom: 4px;
}
code {
font-size: 14px;
font-weight: 600;
}
.list {
margin: 0;
padding-left: 18px;
}
.list li {
margin-bottom: 8px;
}
.controls {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.btn {
border: 0;
border-radius: 10px;
padding: 11px 14px;
cursor: pointer;
color: #fff;
font-weight: 600;
font-size: 14px;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
}
.btn.secondary {
background: var(--accent);
}
.btn.on {
background: var(--on);
}
.btn.off {
background: var(--off);
}
.btn.love {
background: var(--love);
}
.hint {
color: var(--muted);
font-size: 13px;
margin-top: 10px;
}
.love-note {
background: linear-gradient(135deg, #fff4fa, #fff);
}
.qr-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 10px;
margin-top: 12px;
}
.qr-grid.single {
grid-template-columns: minmax(220px, 280px);
}
.qr-card {
border: 1px solid var(--line);
border-radius: 10px;
padding: 10px;
background: #fcfcff;
}
.qr-card h3 {
margin: 0 0 8px;
font-size: 14px;
}
.qr-card img {
width: 170px;
height: 170px;
object-fit: contain;
display: block;
}
@media (max-width: 640px) {
.row {
flex-direction: column;
align-items: flex-start;
}
.btn {
width: 100%;
}
}