From fb53bddd379740474fef170da5b265c0b42f822c Mon Sep 17 00:00:00 2001 From: Ivan Date: Tue, 9 Jan 2024 01:39:00 +0300 Subject: [PATCH] update for our registrators --- server.js | 22 +- static/styles/main.css | 104 ++++++++- static/templates/devices/device.html | 27 +++ static/templates/live.html | 23 +- static/templates/videos/playback.html | 313 ++++++++++++++++++++++++-- 5 files changed, 455 insertions(+), 34 deletions(-) diff --git a/server.js b/server.js index ea539c0..18987ed 100644 --- a/server.js +++ b/server.js @@ -829,7 +829,7 @@ async function live(req, res) { // Выполняем запрос, чтобы получить все данные из таблицы registrars const queryRegistrars = ` - SELECT id, serial, channels, lastkeepalive, "group", name, plate, sim, ip, port, number + SELECT id, serial, channels, lastkeepalive, "group", name, plate, sim, ip, port, number, our_registrator FROM registrars ${!templateData.isAdmin ? "WHERE serial = ANY($1)" : ""} ORDER BY id `; @@ -858,6 +858,7 @@ async function live(req, res) { ip: registrar.ip, port: registrar.port, number: registrar.number, + ourreg: registrar.our_registrator, }); }); @@ -2578,6 +2579,7 @@ app.get("/devices/device/:serial", async (req, res) => { Installer: "", Installation: "", Description: "", + OurRegistrator: "", }; try { @@ -2637,6 +2639,7 @@ app.get("/devices/device/:serial", async (req, res) => { templateData.Installer = rowData.installer; templateData.Installation = rowData.installation; templateData.Description = rowData.description; + templateData.OurRegistrator = rowData.our_registrator; } const source = fs.readFileSync( @@ -3965,8 +3968,15 @@ app.post("/updatedevice", async (req, res) => { equipmentInstaller, equipmentInstalled, equipmentDescription, + ourRegistrator, } = req.body; + if (ourRegistrator == "on") { + ourRegistrator = true; + } else { + ourRegistrator = false; + } + try { const query = ` UPDATE registrars @@ -4002,8 +4012,9 @@ app.post("/updatedevice", async (req, res) => { installation = $29, description = $30, number = $31, - vin = $32 - WHERE serial = $33 + vin = $32, + our_registrator = $33 + WHERE serial = $34 RETURNING *; `; @@ -4040,6 +4051,7 @@ app.post("/updatedevice", async (req, res) => { equipmentDescription, deviceNumber, vinNumber, + ourRegistrator, serialNumber, ]; @@ -4849,7 +4861,7 @@ async function videos(req, res) { // Выполняем запрос, чтобы получить все данные из таблицы registrars const queryRegistrars = ` - SELECT id, serial, channels, lastkeepalive, "group", name, plate, sim, ip, port, number + SELECT id, serial, channels, lastkeepalive, "group", name, plate, sim, ip, port, number, our_registrator FROM registrars ${!templateData.isAdmin ? "WHERE serial = ANY($1)" : ""} ORDER BY id `; @@ -4878,6 +4890,7 @@ async function videos(req, res) { ip: registrar.ip, port: registrar.port, number: registrar.number, + ourreg: registrar.our_registrator, }); }); @@ -4893,6 +4906,7 @@ async function videos(req, res) { sim: registrar.sim, ip: registrar.ip, port: registrar.port, + ourreg: registrar.our_registrator, })); templateData.Groups = Object.keys(groupedRegistrars).map((groupName) => ({ diff --git a/static/styles/main.css b/static/styles/main.css index a714651..954b459 100644 --- a/static/styles/main.css +++ b/static/styles/main.css @@ -351,7 +351,7 @@ header img { font-weight: 400; opacity: 50%; font-size: 16px; - margin: 10px 0 0 44px; + margin: 10px 44px 0 44px; } .whole-width button { @@ -1823,7 +1823,7 @@ input[type="datetime-local"] { } .speedometr .speed-bg { - z-index: 10; + z-index: 2; position: absolute; top: 0; left: -20px; @@ -2164,6 +2164,7 @@ input[type="datetime-local"] { width: 100%; height: 100%; position: absolute; + z-index: 2; /* border-radius: 29px; */ } @@ -2677,6 +2678,105 @@ input[type="time"]:focus { height: 30px !important; } +.heart-container { + --heart-color: #8086f9; + position: relative; + width: 100%; + height: 50px; + transition: 0.3s; + display: flex; + align-items: center; + gap: 10px; + font-weight: 400; + font-size: 20px; + margin-top: 10px; +} + +.heart-container .checkbox { + position: absolute; + width: 100%; + height: 100%; + opacity: 0; + z-index: 20; + cursor: pointer; +} + +.heart-container .svg-container { + width: 50px; + height: 50px; + display: flex; + justify-content: center; + align-items: center; +} + +.heart-container .svg-outline, +.heart-container .svg-filled { + fill: var(--heart-color); + position: absolute; +} + +.heart-container .svg-filled { + animation: keyframes-svg-filled 1s; + display: none; +} + +.heart-container .svg-celebrate { + position: absolute; + animation: keyframes-svg-celebrate 0.5s; + animation-fill-mode: forwards; + display: none; + stroke: var(--heart-color); + fill: var(--heart-color); + stroke-width: 2px; +} + +.heart-container .checkbox:checked ~ .svg-container .svg-filled { + display: block; +} + +.heart-container .checkbox:checked ~ .svg-container .svg-celebrate { + display: block; +} + +@keyframes keyframes-svg-filled { + 0% { + transform: scale(0); + } + + 25% { + transform: scale(1.2); + } + + 50% { + transform: scale(1); + filter: brightness(1.5); + } +} + +@keyframes keyframes-svg-celebrate { + 0% { + transform: scale(0); + } + + 50% { + opacity: 1; + filter: brightness(1.5); + } + + 100% { + transform: scale(1.4); + opacity: 0; + display: none; + } +} + +#playback-camera { + width: 500px; + margin-left: 44px; + background: #f7f7fa; + display: none; +} + @media (max-width: 1950px) { /* при разрешении монитора до 1950 пикселей */ diff --git a/static/templates/devices/device.html b/static/templates/devices/device.html index 34db6c5..e8efd69 100644 --- a/static/templates/devices/device.html +++ b/static/templates/devices/device.html @@ -224,6 +224,31 @@ + + +
+ +
+ + + + + + + + + + + + + + + + +
+ Является самым лучшим регистратором в мире +
+ @@ -508,6 +533,8 @@ $("#parameters-device-installer").val("{{Installer}}"); $("#parameters-equipment-installed").val(formatDate("{{Installation}}")); $("#parameters-device-description").val("{{Description}}"); + $('#parameters-our-registrator').prop('checked', {{OurRegistrator}}); + document.getElementById('parameters-bg').style.display = 'flex'; diff --git a/static/templates/live.html b/static/templates/live.html index 1eb9251..5c32517 100644 --- a/static/templates/live.html +++ b/static/templates/live.html @@ -94,6 +94,7 @@
+