Set up the Kifu PWA project with decent Makefiles #41

Merged
savanni merged 14 commits from kifu-pwa into main 2023-05-13 16:48:42 +00:00
8 changed files with 188 additions and 0 deletions
Showing only changes of commit 17050ed4d6 - Show all commits

View File

@ -0,0 +1,38 @@
html {
background: rgb(243, 243, 243);
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-size: 15pt;
}
html, body {
height: 100%;
margin: 0;
}
body {
display: grid;
place-items: center;
}
#converter {
width: 15rem;
padding: 2rem;
border-radius: .5rem;
box-shadow: 0 0 2rem 0 #0001;
display: flex;
flex-direction: column;
align-items: center;
}
#converter input, #converter select {
font-family: inherit;
font-size: inherit;
margin-block-end: 1rem;
text-align: center;
width: 10rem;
}
#converter #output-temp {
font-size: 2rem;
font-weight: bold;
}

View File

@ -0,0 +1,42 @@
const inputField = document.getElementById('input-temp');
const fromUnitField = document.getElementById('input-unit');
const toUnitField = document.getElementById('output-unit');
const outputField = document.getElementById('output-temp');
const form = document.getElementById('converter');
function convertTemp(value, fromUnit, toUnit) {
if (fromUnit === 'c') {
if (toUnit === 'f') {
return value * 9 / 5 + 32;
} else if (toUnit === 'k') {
return value + 273.15;
}
return value
}
if (fromUnit === 'f') {
if (toUnit === 'c') {
return (value - 32) * 5 / 9;
} else if (toUnit === 'k') {
return (value + 459.67) * 5 / 9;
}
return value;
}
if (fromUnit === 'k') {
if (toUnit === 'c') {
return value - 273.15;
} else if (toUnit === 'f') {
return value * 9 / 5 - 459.67;
}
return value;
}
throw new Error('Invalid unit');
}
form.addEventListener('input', () => {
const inputTemp = parseFloat(inputField.value);
const fromUnit = fromUnitField.value;
const toUnit = toUnitField.value;
const outputTemp = convertTemp(inputTemp, fromUnit, toUnit);
outputField.value = (Math.round(outputTemp * 100) / 100) + ' ' + toUnit.toUpperCase();
});

BIN
kifu/kifu-pwa/icon512.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

36
kifu/kifu-pwa/index.html Normal file
View File

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8" />
<link rel="manifest" href="/manifest.json">
<link rel="stylesheet" href="converter.css">
<title>Temperature converter</title>
</head>
<body>
<h1> Temperature Converter </h1>
<form id="converter">
<label for="input-temp">temperature</label>
<input type="text" id="input-temp" name="input-temp" value="20" />
<label for="input-unit">from</label>
<select id="input-unit" name="input-unit">
<option value="c" selected>Celsius</option>
<option value="f">Fahrenheit</option>
<option value="k">Kelvin</option>
</select>
<label for="output-unit">to</label>
<select id="output-unit" name="output-unit">
<option value="c">Celsius</option>
<option value="f" selected>Fahrenheit</option>
<option value="k">Kelvin</option>
</select>
<output name="output-temp" id="output-temp" for="input-temp input-unit output-unit">68 F</output>
</form>
<script src="converter.js"></script>
<script>
if('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js', { scope: '/' });
}
</script>
</body>
</html>

View File

@ -0,0 +1,17 @@
{
"lang": "en-us",
"name": "Temperature converter app",
"short_name": "Temperature converter",
"description": "A basic temperature converter application",
"start_url": "/",
"background_color": "#2f3d58",
"theme_color": "#2f3d58",
"orientation": "any",
"display": "standalone",
"icons": [
{
"src": "/icon512.png",
"sizes": "512x512"
}
]
}

29
kifu/kifu-pwa/sw.js Normal file
View File

@ -0,0 +1,29 @@
const CACHE_NAME = 'temperature-converter-v1';
self.addEventListener('install', event => {
event.waitUntil((async () => {
const cache = await caches.open(CACHE_NAME);
cache.addAll([
'/',
'/converter.js',
'/converter.css',
]);
})());
});
self.addEventListener('fetch', event => {
event.respondWith((async () => {
const cache = await caches.open(CACHE_NAME);
const cachedResponse = await cache.match(event.request);
if (cachedResponse) {
return cachedResponse;
} else {
try {
const fetchResponse = await fetch(event.request);
cache.put(event.request, fetchResponse.clone());
return fetchResponse;
} catch (e) {
}
}
})());
});

12
kifu/kifu-wasm/Cargo.toml Normal file
View File

@ -0,0 +1,12 @@
[package]
name = "kifu-wasm"
version = "0.1.0"
edition = "2021"
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
[lib]
crate-type = ["cdylib"]
[dependencies]
wasm-bindgen = "0.2"

14
kifu/kifu-wasm/src/lib.rs Normal file
View File

@ -0,0 +1,14 @@
pub fn add(left: usize, right: usize) -> usize {
left + right
}
#[cfg(test)]
mod tests {
use super::*;
#[test]
fn it_works() {
let result = add(2, 2);
assert_eq!(result, 4);
}
}