0.8.1 - PWA and favicons

changelog.txt

@@ -4,6 +4,11 @@
     + ~~Electricity~~ & Machines Update
     + Mod Manager Update
 
+[Version 0.8.1]
+    + Progressive web app support
+    + Confirms when you are about to leave the page
+    + Favicons and social cards
+
 [Version 0.8 - Electricity]
     + Mobile Support (Potentially buggy)
     + Electricity

icons/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="icons/mstile-150x150.png?v=2"/>
+            <TileColor>#e6d577</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

icons/safari-pinned-tab.svg

@@ -0,0 +1,107 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="419.000000pt" height="419.000000pt" viewBox="0 0 419.000000 419.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,419.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M2020 3890 l0 -60 60 0 60 0 0 60 0 60 -60 0 -60 0 0 -60z m110 0 l0
+-50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z"/>
+<path d="M1660 3770 l0 -60 60 0 61 0 -3 -57 -3 -58 -57 -3 -57 -3 -3 -57 -3
+-57 -117 -3 -118 -3 0 -59 0 -59 58 -3 57 -3 0 -55 0 -55 -177 -3 -178 -2 0
+-60 0 -59 118 -3 117 -3 0 -55 0 -55 -57 -3 -58 -3 0 -59 0 -60 178 -2 177 -3
+0 -55 0 -55 -177 -3 -178 -2 0 -60 0 -59 58 -3 57 -3 0 -55 0 -55 -117 -3
+-117 -3 -3 -57 -3 -57 -57 -3 -58 -3 0 -59 0 -59 58 -3 57 -3 3 -57 3 -57 57
+-3 57 -3 0 -115 0 -115 -57 -3 -58 -3 0 61 0 60 -60 0 -60 0 0 -60 0 -60 60 0
+60 0 -2 -177 -3 -178 -57 -3 -58 -3 0 61 0 60 -60 0 -60 0 0 -60 0 -60 60 0
+61 0 -3 -57 -3 -58 -117 -3 -118 -3 0 -48 c0 -59 -14 -73 -72 -69 l-43 3 -3
+58 -3 57 -59 0 -59 0 -3 -57 -3 -58 -55 0 -55 0 -3 58 -3 57 -119 0 -119 0 -3
+-57 -3 -58 -107 -3 -108 -3 0 -654 0 -655 2095 0 2095 0 0 633 c0 347 -3 669
+-7 715 l-6 82 -58 0 -58 0 -3 -57 -3 -58 -55 0 -55 0 -3 58 -3 57 -59 0 -59 0
+-3 -57 -3 -58 -295 0 -295 0 -3 58 -3 57 -44 0 c-76 0 -75 -2 -75 126 l0 114
+-60 0 -59 0 -3 -57 -3 -58 -55 0 -55 0 -3 57 -3 57 -57 3 -57 3 0 55 0 55 58
+3 57 3 0 59 0 59 -57 3 -58 3 0 55 0 55 118 3 117 3 0 119 0 120 -60 0 -59 0
+-3 -57 -3 -58 -115 0 -115 0 0 55 0 55 57 3 57 3 3 57 3 57 118 3 117 3 0 59
+0 59 -117 3 -118 3 0 55 0 55 58 3 57 3 0 59 0 60 60 0 60 0 0 60 0 60 -60 0
+-60 0 0 -60 0 -61 -57 3 -58 3 -3 117 -3 118 -237 2 -237 3 0 55 0 55 117 3
+117 3 3 57 3 57 55 0 55 0 3 -57 3 -58 119 0 120 0 0 60 0 59 -57 3 -58 3 -3
+57 -3 57 -57 3 -57 3 -3 58 -3 57 61 0 60 0 0 60 0 60 -60 0 -60 0 0 -60 0
+-61 -57 3 -58 3 -3 57 -3 57 -57 3 -57 3 -3 58 -3 57 -299 0 -300 0 0 60 0 60
+-60 0 -60 0 0 -60z m110 0 l0 -50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z
+m380 -120 c0 -27 -4 -50 -10 -50 -6 0 -10 -30 -10 -70 l0 -70 -50 0 -50 0 0
+70 0 70 -70 0 -70 0 0 -60 0 -60 -60 0 -60 0 0 -60 0 -60 -60 0 -60 0 0 -60 0
+-60 -50 0 -50 0 0 60 0 60 -60 0 -60 0 0 50 0 50 120 0 120 0 0 60 0 60 60 0
+60 0 0 60 0 60 180 0 180 0 0 -50z m-135 -120 l0 -55 -55 0 -55 0 -3 44 c-5
+67 0 72 60 69 l53 -3 0 -55z m360 0 l0 -55 -115 0 -115 0 -3 44 c-5 72 -6 72
+120 69 l113 -3 0 -55z m355 0 l0 -50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z
+m-240 -60 c0 -6 27 -10 60 -10 l60 0 0 -60 0 -60 60 0 60 0 0 -60 0 -60 60 0
+60 0 0 -50 0 -50 -110 0 -110 0 0 60 c0 33 -4 60 -10 60 -5 0 -10 23 -10 50
+l0 50 -50 0 -50 0 0 -50 c0 -27 -4 -50 -10 -50 -6 0 -10 -27 -10 -60 l0 -60
+-120 0 -120 0 0 -70 0 -70 240 0 240 0 0 -110 0 -110 -50 0 -50 0 0 60 0 60
+-130 0 -130 0 0 -70 0 -70 120 0 120 0 0 -50 0 -50 -60 0 -60 0 0 -60 0 -60
+-60 0 -60 0 0 -130 0 -130 70 0 70 0 0 120 0 120 50 0 50 0 0 -60 0 -60 60 0
+60 0 0 -50 0 -50 -60 0 -60 0 0 -60 0 -60 -60 0 -60 0 0 -70 0 -71 68 3 67 3
+3 58 3 57 119 0 120 0 0 60 0 60 50 0 50 0 0 -110 0 -110 -120 0 -120 0 0 -70
+0 -70 60 0 60 0 0 -50 0 -50 -60 0 -60 0 0 -70 0 -70 60 0 59 0 3 -57 3 -58
+68 -3 67 -3 0 61 0 60 50 0 50 0 0 -109 0 -108 -166 -12 c-121 -10 -169 -10
+-177 -2 -6 6 -34 11 -63 11 l-52 0 -6 58 c-4 31 -9 81 -12 110 l-6 52 -109 0
+-109 0 0 -50 0 -50 50 0 50 0 0 -59 0 -58 -84 -6 c-46 -3 -124 -3 -173 0 -62
+4 -92 2 -97 -6 -9 -14 -106 -15 -106 -1 0 6 -47 10 -120 10 l-119 0 -3 58 -3
+57 -65 0 -65 0 -3 -117 -3 -118 -168 0 -169 0 -6 53 c-3 28 -8 78 -12 110 l-6
+57 -49 0 -49 0 0 -50 0 -50 -60 0 -60 0 0 50 0 50 60 0 60 0 0 70 0 70 55 0
+55 0 0 50 0 50 -55 0 -55 0 0 60 0 60 60 0 60 0 0 130 0 130 -60 0 -60 0 0 50
+0 50 110 0 110 0 0 -60 0 -60 130 0 130 0 0 70 0 70 -120 0 -120 0 0 60 0 60
+-120 0 -120 0 0 50 0 50 120 0 120 0 0 70 0 70 -60 0 -60 0 0 50 0 50 173 1
+c94 1 199 4 232 8 l60 6 3 53 3 52 55 0 54 0 0 -60 0 -60 70 0 70 0 0 60 0 60
+50 0 50 0 0 -60 0 -60 70 0 70 0 0 70 0 70 -60 0 -60 0 0 60 0 60 -70 0 -70 0
+0 -60 0 -60 -50 0 -50 0 0 120 c0 73 -4 120 -10 120 -5 0 -10 22 -10 50 l0 49
+68 3 67 3 3 63 3 62 49 0 50 0 0 55 0 55 130 0 c80 0 130 4 130 10 0 6 23 10
+50 10 28 0 50 -4 50 -10z m-595 -60 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60
+69 l53 -3 0 -55z m125 0 l0 -50 -55 0 -55 0 0 50 0 50 55 0 55 0 0 -50z m-245
+-120 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z m240 0 l0 -55
+-55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z m-360 -120 l0 -55 -55 0
+-55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z m-345 0 l0 -50 -60 0 -60 0 0 50
+0 50 60 0 60 0 0 -50z m220 -10 l0 -60 60 0 60 0 0 -110 0 -110 -170 0 -170 0
+0 50 0 50 60 0 60 0 0 70 c0 40 -4 70 -10 70 -5 0 -10 23 -10 50 l0 50 60 0
+60 0 0 -60z m260 10 l0 -50 -60 0 -60 0 0 50 0 50 60 0 60 0 0 -50z m105 -180
+l0 -115 -115 0 -115 0 -3 104 c-1 58 0 111 2 118 4 11 31 13 118 11 l113 -3 0
+-115z m240 -60 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z
+m-120 -120 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z m240 0
+l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z m360 0 l0 -55 -115
+0 -115 0 -3 44 c-5 72 -6 72 120 69 l113 -3 0 -55z m355 0 l0 -50 -50 0 -50 0
+0 50 0 50 50 0 50 0 0 -50z m-235 -120 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72
+60 69 l53 -3 0 -55z m115 0 l0 -50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z
+m-235 -120 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z m115 0
+l0 -50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z m-235 -180 l0 -115 -55 0 -55
+0 -3 104 c-1 58 0 111 3 118 3 10 20 13 57 11 l53 -3 0 -115z m240 60 l0 -55
+-55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z m235 0 l0 -50 -110 0 -110
+0 0 50 0 50 110 0 110 0 0 -50z m-1555 -120 l0 -55 -115 0 -115 0 -3 44 c-5
+72 -6 72 120 69 l113 -3 0 -55z m-245 0 l0 -50 -50 0 -50 0 0 50 0 50 50 0 50
+0 0 -50z m485 -120 l0 -55 -115 0 -115 0 -3 44 c-5 72 -6 72 120 69 l113 -3 0
+-55z m960 -120 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z
+m-1445 -120 l0 -50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z m-120 -360 l0 -50
+-50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z m1445 -240 l0 -55 -55 0 -55 0 -3 44
+c-5 67 0 72 60 69 l53 -3 0 -55z m-1555 0 l0 -50 -55 0 -55 0 0 50 0 50 55 0
+55 0 0 -50z m0 -120 l0 -60 -60 0 -60 0 0 53 c0 30 3 57 7 60 3 4 30 7 60 7
+l53 0 0 -60z m1070 0 l0 -50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z m480 0
+l0 -50 -50 0 -50 0 0 50 0 50 50 0 50 0 0 -50z"/>
+<path d="M2250 3290 l0 -70 70 0 70 0 0 70 0 70 -70 0 -70 0 0 -70z m125 0 l0
+-55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z"/>
+<path d="M1650 2570 c0 -40 4 -70 10 -70 6 0 10 -22 10 -50 l0 -50 50 0 50 0
+0 50 c0 28 5 50 10 50 6 0 10 30 10 70 l0 70 -70 0 -70 0 0 -70z m125 0 l0
+-55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z"/>
+<path d="M2130 2450 l0 -70 70 0 70 0 0 70 0 70 -70 0 -70 0 0 -70z m125 0 l0
+-55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0 -55z"/>
+<path d="M1787 2023 c-4 -3 -7 -25 -7 -49 0 -67 -6 -74 -61 -74 l-49 0 0 -54
+0 -53 77 -7 c42 -3 96 -6 120 -6 l43 0 0 43 c0 23 -3 79 -7 125 l-6 82 -52 0
+c-28 0 -55 -3 -58 -7z m108 -173 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69
+l53 -3 0 -55z"/>
+<path d="M1410 1642 c0 -22 3 -80 7 -131 l6 -92 61 3 61 3 3 128 3 127 -71 0
+-70 0 0 -38z m125 -32 l0 -55 -55 0 -55 0 -3 44 c-5 67 0 72 60 69 l53 -3 0
+-55z"/>
+</g>
+</svg>

icons/site.webmanifest

@@ -0,0 +1,20 @@
+{
+    "name": "Sandboxels",
+    "short_name": "Sandboxels",
+    "icons": [
+        {
+            "src": "icons/android-chrome-192x192.png?v=2",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/android-chrome-384x384.png?v=2",
+            "sizes": "384x384",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#e6d577",
+    "background_color": "#e6d577",
+    "start_url": "https://sandboxels.r74n.com",
+    "display": "standalone"
+}

index.html

@@ -1,14 +1,49 @@
+<!DOCTYPE html>
 <html>
 
 <head>
     <meta charset="utf-8">
     <title>Sandboxels</title>
-    <meta charset="utf-8">
     <meta name="description" content="A falling sand simulation game.">
     <meta name="keywords" content="falling sand, elements, pixel art, simulator, powder">
     <meta name="author" content="R74n">
+    <meta name="copyright" content="R74n">
     <link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="robots" content="follow">
+
+    <!--Favicons-->
+    <link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png?v=2">
+    <link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png?v=2">
+    <link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png?v=2">
+    <link rel="manifest" href="manifest.json">
+    <link rel="mask-icon" href="icons/safari-pinned-tab.svg?v=2" color="#2167ff">
+    <link rel="shortcut icon" href="icons/favicon.ico?v=2">
+    <meta name="msapplication-TileColor" content="#e6d577">
+    <meta name="theme-color" content="#e6d577">
+
+    <!--OpenGraph-->
+    <meta property="og:locale" content="en_US">
+    <meta property="og:type" content="website">
+    <meta property="og:title" content="Sandboxels">
+    <meta property="og:description" content="A falling sand simulation game.">
+    <meta property="og:url" content="https://sandboxels.r74n.com">
+    <meta property="og:site_name" content="Sandboxels">
+    <meta property="og:image" content="icons/wallpaper.png">
+    <meta property="og:image:width" content="1980">
+    <meta property="og:image:height" content="971">
+    <meta property="og:image:type" content="image/png">
+    <meta property="og:image:alt" content="A rainforest made in Sandboxels">
+
+    <!--Twitter-->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:description" content="A falling sand simulation game.">
+    <meta name="twitter:title" content="Sandboxels">
+    <meta name="twitter:site:id" content="1436857621827530753">
+    <meta name="twitter:image" content="icons/wallpaper.png">
+    <meta name="twitter:image:alt" content="A rainforest made in Sandboxels">
+    <meta name="twitter:creator:id" content="1436857621827530753">
+
     <script src="https://R74n.com/load.js"></script>
     
     <style>
@@ -4150,6 +4185,11 @@ for (var k = 0; k < b0.split(" AND ").length; k++) {
                 if (e.touches) e = e.touches[0];
                 return false;
             }
+            window.onbeforeunload = function(){ // Confirm leaving page if there are pixels on-screen
+                if (currentPixels.length > 0){
+                    return 'Are you sure you want to leave?';
+                }
+            };
             shiftDown = 0;
             // If the user presses [ or -, decrease the mouse size by 2
             document.addEventListener("keydown", function(e) {
@@ -4315,7 +4355,7 @@ for (var k = 0; k < b0.split(" AND ").length; k++) {
 
 <body>
     <h1 class="pagetitle">
-    <a href="https://R74n.com" class="backbutton">&lt;</a>
+    <a href="https://R74n.com" class="backbutton" target="_blank">&lt;</a>
     Sandboxels</h1>
     <div id="gameDiv">
         <canvas id="game" width="800" height="600" oncontextmenu="return false;">
@@ -4331,7 +4371,7 @@ for (var k = 0; k < b0.split(" AND ").length; k++) {
                 <div id="categoryControls"></div>
                 <div id="elementControls"></div>
             </div>
-            <div id="extraInfo"><small><a href="controls.txt" target="_blank">Controls</a> • <a href="changelog.txt" target="_blank">Changelog</a> • <a href="https://docs.google.com/document/d/1R8xljj_J-K5oU-9y4louwplQmM-ZBvUfXmhbgj5LYdk/edit?usp=sharing" target="_blank">Feedback</a></small></div>
+            <div id="extraInfo"><small><a href="https://sandboxels.R74n.com/changelog.txt" target="_blank">Controls</a> • <a href="https://sandboxels.R74n.com/changelog.txt" target="_blank">Changelog</a> • <a href="https://docs.google.com/document/d/1R8xljj_J-K5oU-9y4louwplQmM-ZBvUfXmhbgj5LYdk/edit?usp=sharing" target="_blank">Feedback</a></small></div>
         </div>
     </div>
 

manifest.json

@@ -0,0 +1,28 @@
+{
+  "name": "Sandboxels",
+  "short_name": "Sandboxels",
+  "theme_color": "#e6d577",
+  "background_color": "#000000",
+  "display": "standalone",
+  "scope": "/",
+  "start_url": "https://sandboxels.r74n.com",
+  "description": "A falling sand simulation game",
+  "orientation": "any",
+  "icons": [
+    {
+      "src": "icons/android-chrome-192x192.png?v=2",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+        "src": "icons/android-chrome-384x384.png?v=2",
+        "sizes": "384x384",
+        "type": "image/png"
+    },
+    {
+        "src": "icons/apple-touch-icon.png?v=2",
+        "sizes": "180x180",
+        "type": "image/png"
+    }
+  ]
+}

offline.html

@@ -0,0 +1 @@
+index.html