78 lines
2.6 KiB
HTML
78 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Trail</title>
|
|
<link
|
|
rel="stylesheet"
|
|
href="{{ url_for('static', path='style.css') }}"
|
|
/>
|
|
</head>
|
|
|
|
<body>
|
|
{% if queue_length > 0 %}
|
|
<div class="trail-container">
|
|
<div class="trail-count">{{ queue_length }}</div>
|
|
<p>items left</p>
|
|
|
|
<p
|
|
style="
|
|
max-width: 80%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
"
|
|
>
|
|
Next:
|
|
<a
|
|
href="{{ current_link }}"
|
|
target="_blank"
|
|
rel="noreferrer noopener"
|
|
>{{ current_link }}</a
|
|
>
|
|
</p>
|
|
|
|
<div class="trail-hint">Tap anywhere to open & next</div>
|
|
<div class="trail-hint">Return <a href="/">home</a></div>
|
|
</div>
|
|
<script>
|
|
window.addEventListener("load", () => {
|
|
document.body.addEventListener("click", (e) => {
|
|
if (e.target.tagName === "A") return;
|
|
// now this is not the new updated
|
|
const newTab = window.open("", "_blank");
|
|
|
|
// do trix
|
|
if (newTab) {
|
|
// background
|
|
if (newTab.document.body) {
|
|
newTab.document.body.style.backgroundColor =
|
|
getComputedStyle(document.body).backgroundColor;
|
|
}
|
|
|
|
newTab.addEventListener("message", () => {
|
|
// Swap roles: Current tab -> Content, New tab -> Controller
|
|
location.replace("/r");
|
|
newTab.opener = null;
|
|
newTab.location.replace(window.location.href);
|
|
});
|
|
// Trigger the message event to run the swap on the next tick
|
|
newTab.postMessage("");
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
{% else %}
|
|
<div class="card">
|
|
<h2>All Done!</h2>
|
|
<p>The queue is empty.</p>
|
|
<div class="actions">
|
|
<a href="/" class="btn">Home</a>
|
|
<a href="/queuein" class="btn">Add More</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</body>
|
|
</html>
|