From e3ccabdcb9ee5cea09dc6eabb2bf700e0c21d90d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gr=C3=A9goire=20Delattre?= <gregoire.delattre@gmail.com>
Date: Mon, 22 Jul 2019 20:50:01 +0200
Subject: [PATCH] Update the PWA manifest

This adds:
* fingerprint of the manifest for better updates
* landscape mode
* better integration of apple devices
---
 frontend/index.html |  4 ----
 frontend/js/app.js  |  1 -
 webpack.config.js   | 21 +++++++++++++++------
 3 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/frontend/index.html b/frontend/index.html
index 7e9610d..e504d5a 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -5,13 +5,9 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta name="Description" content="Canapé">
-    <link rel="apple-touch-icon" sizes="180x180" href="<%= require("./img/apple-touch-icon.png") %>">
     <link rel="icon" type="image/png" href="<%= require("./img/favicon-32x32.png") %>" sizes="32x32">
     <link rel="icon" type="image/png" href="<%= require("./img/favicon-16x16.png") %>" sizes="16x16">
-    <link rel="manifest" href="/manifest.json">
-    <meta name="theme-color" content="#4E5D6C">
     <meta name="msapplication-navbutton-color" content="#4E5D6C">
-    <meta name="apple-mobile-web-app-status-bar-style" content="#4E5D6C">
     <link rel="mask-icon" href="<%= require("./img/safari-pinned-tab.svg") %>" color="#5bbad5">
     <title>Canapé</title>
   </head>
diff --git a/frontend/js/app.js b/frontend/js/app.js
index 497f881..495b560 100644
--- a/frontend/js/app.js
+++ b/frontend/js/app.js
@@ -2,7 +2,6 @@
 import "../img/noimage.png"
 
 // Import favicon settings
-import "../img/apple-touch-icon.png"
 import "../img/favicon-16x16.png"
 import "../img/favicon-32x32.png"
 import "../img/favicon.ico"
diff --git a/webpack.config.js b/webpack.config.js
index bc8f4ba..9b1fa4a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -76,15 +76,22 @@ const config = {
     new CleanWebpackPlugin({
       cleanOnceBeforeBuildPatterns: ["**/*", "!img/**/*", "!img"],
     }),
+    new HtmlWebpackPlugin({
+      template: path.join(SRC_DIR, "../index.html"),
+    }),
     new WebpackPwaManifest({
-      fingerprints: false,
-      inject: false,
+      fingerprints: true,
+      inject: true,
+      ios: {
+        "apple-mobile-web-app-status-bar-style": "default",
+        "apple-mobile-web-app-title": "Canapé",
+      },
       name: "Canapé",
       short_name: "Canapé",
       background_color: "#4e5d6c",
       theme_color: "#4e5d6c",
       display: "standalone",
-      orientation: "portrait",
+      orientation: "omit",
       scope: "/",
       start_url: "/",
       icons: [
@@ -92,11 +99,13 @@ const config = {
           src: path.resolve(__dirname, "frontend/img/android-chrome-512x512.png"),
           sizes: [96, 128, 192, 256, 384, 512],
         },
+        {
+          src: path.resolve(__dirname, "frontend/img/apple-touch-icon.png"),
+          sizes: [80, 120, 152, 167, 180],
+          ios: true
+        },
       ],
     }),
-    new HtmlWebpackPlugin({
-      template: path.join(SRC_DIR, "../index.html"),
-    }),
   ],
   resolve: {
     extensions: [".js"],