upload

css/style.css

@@ -0,0 +1,72 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+@font-face {
+  font-family: lcd;
+  src: url(../font/SUBWT___.ttf);
+}
+
+html {
+    font-size: 62.5%;
+}
+
+body {
+
+}
+
+header {
+
+}
+
+header h1 {
+
+}
+
+main {
+
+}
+
+main input{
+    width: 100%;
+    font-size: 3.5rem;
+    margin-bottom:10px;
+    background-color: black;
+    color: green;
+    text-align: right;
+    padding: 10px 4px 10px 4px;
+    font-family: lcd;
+    border: 1px solid yellow;
+    border-radius:4px;
+}
+
+main section#keyBoard {
+    /** Grid eller liknade */
+}
+
+@media (max-width: 767px) {
+    header {
+        height: 45px;
+    }
+
+    body {
+
+    }
+
+    main {
+
+    }
+
+    main input{
+
+    }
+}
+
+@media (max-width: 339px) {
+    main {
+
+    }
+
+}

font/SubwayTicker_ReadMe.rtf

@@ -0,0 +1,106 @@
+{\rtf1\mac\ansicpg10000\cocoartf824\cocoasubrtf440
+{\fonttbl\f0\fnil\fcharset77 Verdana-Bold;\f1\fnil\fcharset77 Verdana;\f2\fnil\fcharset77 Verdana-Italic;
+}
+{\colortbl;\red255\green255\blue255;\red255\green0\blue0;\red36\green36\blue36;\red83\green83\blue83;
+}
+\margl1440\margr1440\vieww10080\viewh12480\viewkind0
+\deftab720
+\pard\pardeftab720\ql\qnatural
+
+\f0\b\fs32 \cf2 SUBWAY TICKER
+\f1\b0\fs24 \cf0 \
+\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardeftab720\ql\qnatural
+\cf0 \
+
+\fs28 Keith Bates / K-Type Freebie 2006 (version 3.01)\
+www.k-type.com    -    keith@k-type.com\
+\
+This font is free for personal use (see below).\
+\
+Subway Ticker by Keith Bates is based on an electronic display seen on a New York subway train in February 2005.\
+
+\fs24 \
+\
+\pard\pardeftab720\ql\qnatural
+
+\f0\b\fs32 \cf2 K-TYPE LICENSE AGREEMENT 
+\fs36 \cf0 \
+\pard\pardeftab720\ql\qnatural
+
+\f1\b0\fs18 \cf0 \
+
+\fs28 \cf2 FREEBIES (Unlicensed)
+\fs24 \cf3 \
+K-Type Freebies are free for personal use and do not require a license.\
+However, Freebies used for Commercial and Entrepreneurial purposes need to be licensed at the same rates as Pay Fonts.  \cf0 Freebie Commercial Licenses, Enterprise Licenses and Custom Fonts are available from {\field{\*\fldinst{HYPERLINK "mailto:keith@k-type.com"}}{\fldrslt \cf4 \ul \ulc4 keith@k-type.com}}\cf3 \
+
+\fs18 \
+
+\fs28 \cf2 COMMERCIAL LICENSE (Normal License)
+\fs24 \cf3 \
+Purchasing a K-Type font grants you non-exclusive rights to use the font commercially on paper, on film, online and embedded in documents.\
+The software may be stored on up to five workstations and output devices.\
+You cannot legally give the font to others or install it on their machines (with the exception of co-workers and your service bureau).\
+To place any K-Type font within other media will require an additional Enterprise License.\
+
+\fs18 \
+
+\fs28 \cf2 ENTERPRISE LICENSE (Extended License)
+\fs24 \cf3 \
+For Entrepreneurial use on an unlimited number of workstations and output devices, and where a font file is incorporated into a software product, each K-Type font will require an Enterprise License.\
+An Enterprise License is indefinite, but not exclusive.\
+
+\fs18 \
+
+\fs28 \cf2 CUSTOM FONTS
+\fs24 \cf3 \
+Commissioning a K-Type Custom Font grants you ownership upon payment \'d0 sole rights to use the font autonomously, exclusively and indefinitely.\
+
+\fs18 \
+
+\f2\i\fs24 \cf2 Fonts are supplied "as is". Every effort is made to ensure that the files will behave properly, and whilst mistakes and omissions are corrected cheerfully and quickly, K-Type will not be liable for losses incurred by software failure.\
+\
+\pard\pardeftab720\ql\qnatural
+
+\f0\i0\b\fs32 \cf2 \
+K-TYPE
+\f1\b0\fs24 \cf0 \
+\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardeftab720\ql\qnatural
+\cf0 \
+\pard\tx566\tx1133\tx1700\tx2267\tx2834\tx3401\tx3968\tx4535\tx5102\tx5669\tx6236\tx6803\pardeftab720\ql\qnatural\pardirnatural
+
+\fs28 \cf0 K-Type fonts are inexpensive, quality typefaces supplied in Truetype (Windows and Mac varieties), OpenType, and Mac Postscript file formats.  \
+\
+K-Type aims to provide a more personal service than most foundries, and are increasingly widening the scope of our fonts. In addition to the full set of standard Latin characters, a large selection of accented characters are included. Polish and Lithuanian accented characters are already included in many K-Type fonts. \
+\
+\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardeftab720\ql\qnatural
+\cf0 Please email {\field{\*\fldinst{HYPERLINK "mailto:keith@k-type.com"}}{\fldrslt \cf4 \ul \ulc4 keith@k-type.com}} if you require additional characters. There is usually no charge to existing customers for adding accented characters. Other additions, such as company logos or signatures will be chargeable.\
+\
+Our recent 
+\f2\i Ivan Zemtsov
+\f1\i0  font features both Latin and Cyrillic alphabets, being based on the lettering of Russian mailartist Ivan Zemtsov. The Cyrillics also include Mari language characters that were specially requested.\
+\
+\
+\pard\pardeftab720\ql\qnatural
+
+\f0\b\fs32 \cf2 INSTALLING FONTS
+\f1\b0\fs24 \cf0 \
+\pard\tx560\tx1120\tx1680\tx2240\tx2800\tx3360\tx3920\tx4480\tx5040\tx5600\tx6160\tx6720\pardeftab720\ql\qnatural
+\cf0 \
+\pard\tx566\tx1133\tx1700\tx2267\tx2834\tx3401\tx3968\tx4535\tx5102\tx5669\tx6236\tx6803\pardeftab720\ql\qnatural\pardirnatural
+
+\fs28 \cf0 Fonts are placed in your operating system's 
+\f2\i Fonts
+\f1\i0  folder and will be made available to all the applications or programs you use.\
+\
+\pard\pardeftab720\ql\qnatural
+\cf2 WINDOWS\cf0 \
+\pard\pardeftab720\ql\qnatural
+
+\fs24 \cf0 Put the font files (.ttf, .otf) into C:\\Windows\\Fonts, or right-click on the font files > Install
+\fs28 \
+\pard\pardeftab720\ql\qnatural
+\cf2 MAC\cf0 \
+\pard\pardeftab720\ql\qnatural
+
+\fs24 \cf0 Put the font files (.otf, Mac Truetype, Mac Postscript) into /Library/Fonts}

index.html

@@ -0,0 +1,45 @@
+
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>Kalkylator</title>
+    <meta charset="utf-8">
+    <link rel="stylesheet" href="css/style.css?v=1.8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <script src="js/script.js"></script>
+</head>
+
+<body>
+    <header>
+        <h1>Kalkylator</h1>
+    </header>
+    <main>
+        <input type="text" id = 'lcd' disabled="disabled">
+        <section id = 'keyBoard'>
+            <button id='b7'>7</button>
+            <button id='b8'>8</button>
+            <button id='b9'>9</button>
+            <button id='add'>+</button>
+
+            <button id='b4'>4</button>
+            <button id='b5'>5</button>
+            <button id='b6'>6</button>
+            <button id='sub'>-</button>
+
+            <button id='b1'>1</button>
+            <button id='b2'>2</button>
+            <button id='b3'>3</button>
+            <button id='mul'>x</button>
+            
+            <button id='comma'>,</button>
+            <button id='b0'>0</button>
+            <button id='enter'>=</button>
+            <button id='div'>/</button>
+
+            <button id='clear' style = 'grid-column: span 4;'>CLEAR</button>
+        </section>
+
+    </main>
+
+</body>

js/script.js

@@ -0,0 +1,75 @@
+/**
+ * Se detta som en grund att utgå ifrån.
+ * Det är helt fritt att ändra och ta bort kod om ni
+ * önskar lösa problemen med andra metoder.
+ */
+
+let lcd = null; // displayen
+
+let memory = 0; // Lagrat/gamlat värdet från display
+let arithmetic = null; // Vilken beräkning som skall göras +,-, x eller /
+
+function init() {
+    lcd = document.getElementById('lcd');
+    let keyBoard = document.getElementById('keyBoard')
+    keyBoard.onclick = buttonClick;
+}
+
+/**
+ * Händelsehanterare för kalkylatorns tangentbord
+ */
+function buttonClick(e) {
+    let btn = e.target.id; //id för den tangent som tryckte ner
+
+
+    // kollar om siffertangent är nedtryckt
+    if (btn.substring(0, 1) === 'b') {
+        let digit = btn.substring(1, 2); // plockar ut siffran från id:et
+
+    } else { // Inte en siffertangent, övriga tangenter.
+
+    }
+}
+
+/**
+ *  Lägger till siffra på display.
+ */
+function addDigit(digit) {
+}
+
+/**
+ * Lägger till decimaltecken
+ */
+function addComma() {
+
+}
+
+/**
+ * Sparar operator.
+ * +, -, *, /
+ */
+function setOperator(operator){
+
+}
+
+/**
+ * Beräknar ovh visar resultatet på displayen.
+ */
+function calculate() {
+
+}
+
+/** Rensar display */
+function clearLCD() {
+    lcd.value = '';
+    isComma = false;
+}
+
+/** Rensar allt, reset */
+function memClear(){
+    memory = 0;
+    arithmetic = null;
+    clearLCD();
+}
+
+window.onload = init;

manifest.json

@@ -0,0 +1,76 @@
+{
+    "short_name": "Calc",
+    "name": "Calculator",
+    "icons": [
+    {
+        "src": "icons/icon-32x32.png",
+        "sizes": "32x32",
+        "type": "image/png"
+    },
+    {
+        "src": "icons/icon-72x72.png",
+        "sizes": "72x72",
+        "type": "image/png"
+    },
+    {
+        "src": "icons/icon-96x96.png",
+        "sizes": "96x96",
+        "type": "image/png",
+        "purpose": "maskable"
+    },
+    {
+        "src": "icons/icon-128x128.png",
+        "sizes": "128x128",
+        "type": "image/png",
+        "purpose": "maskable"
+    },
+    {
+        "src": "icons/icon-144x144.png",
+        "sizes": "144x144",
+        "type": "image/png",
+        "purpose": "maskable"
+    },
+    {
+        "src": "icons/icon-152x152.png",
+        "sizes": "152x152",
+        "type": "image/png",
+        "purpose": "maskable"
+    },
+    {
+        "src": "icons/icon-180x180.png",
+        "sizes": "180x180",
+        "type": "image/png",
+        "purpose": "maskable"
+    },
+    {
+        "src": "icons/icon-192x192.png",
+        "sizes": "192x192",
+        "type": "image/png",
+        "purpose": "maskable"
+    },
+    {
+        "src": "icons/icon-384x384.png",
+        "sizes": "384x384",
+        "type": "image/png",
+        "purpose": "maskable"
+    },
+    {
+        "src": "icons/icon-512x512.png",
+        "sizes": "512x512",
+        "type": "image/png"
+    }
+],
+"start_url": ".",
+"background_color": "#000000",
+"theme_color": "#000000",
+"display": "standalone",
+"scope": "/",
+"description": "Utbildnings app för PWA",
+"screenshots": [
+    {
+        "src": "img/screenShot-1.png",
+        "sizes": "377x670",
+        "type": "image/png"
+    }
+]
+}

sw.js

@@ -0,0 +1,59 @@
+/**
+ * Från
+ * https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Offline_Service_workers (2021-06-09)
+ * https://web.dev/offline-cookbook/
+ */
+ const cacheKey = 'cache-v1';
+
+ const cacheArray = [
+   '/index.html',
+   '/manifest.json',
+   '/favicon.ico',
+   '/icons/icon-72x72.png',
+   '/icons/icon-96x96.png',
+   '/icons/icon-128x128.png',
+   '/icons/icon-144x144.png',
+   '/icons/icon-152x152.png',
+   '/icons/icon-180x180.png',
+   '/icons/icon-192x192.png',
+   '/icons/icon-32x32.png',
+   '/icons/icon-48x48.png',
+   '/icons/icon-512x512.png',
+   '/css/style.css',
+   '/js/script.js'
+ ];
+
+ self.addEventListener('install', event => {
+   console.log('Attempting to install service worker and cache static assets');
+   event.waitUntil(
+     caches.open(cacheKey)
+     .then(cache => {
+       return cache.addAll(cacheArray);
+     })
+   );
+ });
+
+ /** Rensar cache */
+ self.addEventListener('activate', (e) => {
+   e.waitUntil(caches.keys().then((keyList) => {
+     Promise.all(keyList.map((key) => {
+       if (key === cacheKey) { return; }
+       caches.delete(key);
+     }))
+   })());
+ });
+
+ /** cache-filer först, upddaterar cache från servern */
+ self.addEventListener('fetch', function (event) {
+   event.respondWith(
+     caches.open(cacheKey).then(function (cache) {
+       return cache.match(event.request).then(function (response) {
+         var fetchPromise = fetch(event.request).then(function (networkResponse) {
+           cache.put(event.request, networkResponse.clone());
+           return networkResponse;
+         });
+         return response || fetchPromise;
+       });
+     }),
+   );
+ });