Skip to content

Instantly share code, notes, and snippets.

@OsvaldoFrias

OsvaldoFrias/htmlPopup.html

Last active October 5, 2022 16:15
Show Gist options
  • Save OsvaldoFrias/296a9605626844f6d45444672ae707bc to your computer and use it in GitHub Desktop.
Save OsvaldoFrias/296a9605626844f6d45444672ae707bc to your computer and use it in GitHub Desktop.
Download ZIP
Raw
htmlPopup.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PLACA EN LISTA NEGRA</title>
<style>
:root {
--main-background-color: #0b1122;
--active-border-color: #242f4e;
--body-text-color: #aaa;
--active-text-color: #ccc;
}
* {
padding: 0;
margin: 0;
}
body {
background-color: var(--main-background-color);
color: var(--active-text-color);
display: flex;
flex-direction: column;
}
.container {
width: 100vw;
height: 80vh;
display: flex;
align-items: center;
justify-content: center;
}
.child-div {
width: 100%;
align-items: center;
justify-content: center;
display: flex;
border: 8px solid #ff0000;
background-color: #d8d8d8;
border-radius: 25px;
font-size: 50px;
color: #000000;
font-family: Agency FB;
letter-spacing: 10px;
margin-top: 10px;
margin: auto
}
.placeholder {
color: var(--body-text-color);
}
</style>
<script>
ISScustomAPI.onSetup(function (settings) {
// let jsonSettings = JSON.parse(settings);
// document.getElementById("plate").innerHTML = jsonSettings.number;
// document.getElementById("best_view_date_time").innerHTML = jsonSettings.best_view_date_time;
ISScustomAPI.onEvent(function (type, id, action, params) {
// var textArea = document.getElementById("events");
// textArea.value = type + '|' + id + '|' + action +
// '|' + JSON.stringify(params) + '\n' + textArea.value;
if (params.database_type === 'blacklist') {
document.getElementById("plate").innerHTML = params.number;
document.getElementById("best_view_date_time").innerHTML = params.best_view_date_time;
document.getElementById("recognizer_name").innerHTML = params.recognizer_name;
ISScustomAPI.sendReact("HTML_POPUP", settings, "SHOW");
}
});
});
setTimeout(() => {
ISScustomAPI.subscribe("LPR_LOGIC", "*", "CAR_LP_FOUND");
}, 1000);
</script>
</head>
<body>
<header>
<table width="100%" height="20vh">
<tr>
<td class="title" style="font-size:20px; font-weight:bold; font-family:sans-serif; text-align: center;">
PLACA EN LISTA NEGRA
<br />
<label id="recognizer_name"></label> - <label id="best_view_date_time"></label>
</td>
</tr>
</table>
</header>
<!-- <textarea id="events" rows="10"></textarea> -->
<div class="container">
<div class="child-div">
<h2 id="plate"><em class="placeholder">811YMBX</em></h2>
</div>
<!-- <div class="child-div">
Two
</div>
<div class="child-div">
Three
</div>
<div class="child-div">
Four
</div>
<div class="child-div">
Five
</div> -->
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment