Kilometers Traveled Calculator
Info
Created On: August 6, 2023
Created By:
AI
Model: gpt-3.5-turbo-16k-0613
Time: 14 seconds
Prompt Tokens: 861
Completion Tokens: 1010
Total Token Cost: 1871
Get This App On Your Website
Copy Code
1. Copy the code above with the iframe and link.
2. Paste the code into your website.
3. Resize the iframe to fit your website.
Javascript, HTML, CSS Code
Copy
<html>
<head>
<script type="text/javascript"> window.addEventListener('error', function(event) { var message = JSON.parse(JSON.stringify(event.message)); var source = event.filename; var lineno = event.lineno; var colno = event.colno; var error = event.error; window.parent.postMessage({ type: 'iframeError', details: { message: message, source: source, lineno: lineno, colno: colno, error: error ? error.stack : '' } }, '*'); }); window.addEventListener('unhandledrejection', function(event) { window.parent.postMessage({ type: 'iframePromiseRejection', details: { reason: event.reason } }, '*'); }); </script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Kilometers Traveled Calculator</title>
<meta name="description" content="Calculate kilometers traveled per vehicle">
<meta name="keywords" content="kilometers, vehicle, calculator">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<!-- Built-In Functions for Apps -->
<script type="text/javascript">
var localStoragePrefix = "ct-169136047623584";
var lastSave = 0;
// save to localstorage
function saveLocal(data) {
if (Date.now() - lastSave < 1000) {
return;
}
// save to cookie
let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict";
cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString();
document.cookie = cookie;
lastSave = Date.now();
}
// load from localstorage
function loadLocal() {
var cookiePrefix = localStoragePrefix + "=";
var cookieStart = document.cookie.indexOf(cookiePrefix);
if (cookieStart > -1) {
let cookieEnd = document.cookie.indexOf(";", cookieStart);
if (cookieEnd == -1) {
cookieEnd = document.cookie.length;
}
var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd);
return JSON.parse(cookieData);
}
}
// Calculate kilometers traveled per vehicle
function calculateKilometersTraveled() {
var acquisitionDate = $("#acquisitionDate").val();
var today = new Date().toISOString().split('T')[0];
var years = ((new Date(today) - new Date(acquisitionDate)) / (1000 * 60 * 60 * 24 * 365)).toFixed(2);
var kilometers = (years * 13700).toFixed(2);
$("#result").text("Kilometers Traveled: " + kilometers + " km");
}
</script>
<style>
/* App CSS Goes Here */
body {
background-color: #f7f7f7;
font-family: 'Roboto', sans-serif;
}
.container {
max-width: 600px;
margin: 0 auto;
padding-top: 50px;
}
h1 {
text-align: center;
margin-bottom: 30px;
color: #333;
}
.form-group {
margin-bottom: 20px;
}
label {
font-weight: bold;
}
.btn-calculate {
display: block;
width: 100%;
text-align: center;
padding: 10px 0;
background-color: #ff6f00;
color: #fff;
font-weight: bold;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.btn-calculate:hover {
background-color: #ff8f00;
}
#result {
text-align: center;
margin-top: 20px;
font-size: 18px;
color: #333;
}
</style>
<link rel="canonical" href="https://calculator.tools/prompt/3418/">
<meta charset="utf-8">
</head>
<body>
<div id="main-container" class="container">
<h1>Kilometers Traveled Calculator</h1>
<div class="form-group">
<label for="acquisitionDate">Acquisition Date:</label>
<input type="date" id="acquisitionDate" class="form-control">
</div>
<button class="btn-calculate" onclick="calculateKilometersTraveled()">Calculate</button>
<div id="result"></div>
</div>
<script type="text/javascript"> var localStoragePrefix = "ct-{{ cachebreaker }}"; var lastSave = 0; function saveLocal(data) { if (Date.now() - lastSave < 1000) { return; } let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict"; cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString(); document.cookie = cookie; lastSave = Date.now(); } function loadLocal() { var cookiePrefix = localStoragePrefix + "="; var cookieStart = document.cookie.indexOf(cookiePrefix); if (cookieStart > -1) { let cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd); return JSON.parse(cookieData); } } </script>
<script type="text/javascript"> window.addEventListener('load', function() { var observer = new MutationObserver(function() { window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); observer.observe(document.body, {attributes: true, childList: true, subtree: true}); window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); </script>
</body>
</html>