36 lines
1.4 KiB
HTML
36 lines
1.4 KiB
HTML
{% extends "base.html" %}
|
|
{% block content %}
|
|
<h1 id="datetime" data-time="{{now.isoformat()}}">{{now.strftime("%Y/%m/%d %H:%M:%S")}}</h1>
|
|
<script>
|
|
// JavaScript to update the datetime dynamically
|
|
function formatDateTime(date) {
|
|
const year = date.getFullYear();
|
|
const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are zero-based
|
|
const day = String(date.getDate()).padStart(2, '0');
|
|
const hours = String(date.getHours()).padStart(2, '0');
|
|
const minutes = String(date.getMinutes()).padStart(2, '0');
|
|
const seconds = String(date.getSeconds()).padStart(2, '0');
|
|
|
|
return `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`;
|
|
}
|
|
function updateTime() {
|
|
const dateElement = document.getElementById('datetime');
|
|
const currentTime = new Date(dateElement.dataset.time);
|
|
|
|
// Increment the datetime by 1 second
|
|
currentTime.setSeconds(currentTime.getSeconds() + 1);
|
|
|
|
// Format the datetime as a readable string
|
|
const formattedTime = formatDateTime(currentTime);
|
|
|
|
// Update the displayed datetime
|
|
dateElement.textContent = formattedTime;
|
|
|
|
// Update the data-time attribute for the next update
|
|
dateElement.dataset.time = currentTime;
|
|
}
|
|
|
|
// Update the datetime every second
|
|
setInterval(updateTime, 1000);
|
|
</script>
|
|
{% endblock %} |