48 lines
2.4 KiB
HTML
48 lines
2.4 KiB
HTML
{% extends "base.html" %}
|
|
{% block content %}
|
|
<h1 id="datetime" data-time="{{now.isoformat()}}">{{now.strftime("%Y/%m/%d %H:%M:%S")}}</h1>
|
|
<!-- A bit of context for how this page was created -->
|
|
<p>This page was created with the help of LLMs and the Flask framework. It's a great way to learn about how these technologies work together.</p>
|
|
<p>Here are some of the key components that were used:</p>
|
|
<ul>
|
|
<li><strong>LLMs</strong>: Language Model, which is a type of AI model that can generate human-like text based on input prompts.</li>
|
|
<li><strong>Flask</strong>: A lightweight web framework for Python. It's great for building simple web applications quickly.</li>
|
|
<li><strong>Jinja2</strong>: A templating engine used in Flask to dynamically render HTML templates with data from the server.</li>
|
|
<li><strong>Bootstrap</strong>: A popular CSS framework that provides responsive, mobile-first design and layout tools.</li>
|
|
<li><strong>Python</strong>: The programming language used for web development. It's a great choice for building dynamic websites.</li>
|
|
</ul>
|
|
<p>I hope you found this information helpful! If you have any questions or need further assistance, feel free to reach out.</p>
|
|
<p>Best of luck with your project!</p>
|
|
<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 %} |