Last updated: 19 May 20 17:32:21 (UTC)

Enabling full screen on mobile

Create a Progressive Web App (PWA) that can be placed on the home screen, that can have set color themes, take full screen, have an icon, etc.

Did this for Infectious Storytelling.

Today I did some more testing. Decided I wanted the site to be a “PWA”: Progressive Web App (https://web.dev/add-manifest/) so that the address bar on the mobile browser would disappear on scroll. I could also make it so the app could go full screen with no mar at all, but as I don’t have the UI for the user to close the thing, etc., decided not to. Yet. I followed the site above, with the following Twine-specific changes:

I just added the following line to the Twine javascript file (not the whole function, just this line):

$(document.head).append('<link rel="manifest" href="manifest.json">');

Note: to create the manifest file literally copy and paste the example into a text file, then save as “manifest.txt”, then change the file extension in the finder. Works fine.

Once I uploaded and tested I got a couple of errors to do with the site security and “service worker”. I had to force the site to redirect to https, which means I created a “.htaccess” file and placed it in the project folder (same as Twine’s index.html): I created a text file in BBEdit, pasted the following code in:

RewriteCond %{REQUEST_URI} !^/[0-9]+\..+\.cpaneldcv$

RewriteCond %{REQUEST_URI} !^/\.well-known/pki-validation/[A-F0-9]{32}\.txt(?:\ Comodo\ DCV)?$

RewriteEngine On
RewriteCond %{SERVER_PORT} 80
RewriteCond %{REQUEST_URI} IS
RewriteRule ^(.*)$ https://www.lyleskains.com/IS/$1 [R=301,L]
RewriteCond %{REQUEST_URI} !^/[0-9]+\..+\.cpaneldcv$

RewriteCond %{REQUEST_URI} !^/\.well-known/pki-validation/[A-F0-9]{32}\.txt(?:\ Comodo\ DCV)?$

RewriteEngine On
RewriteCond %{SERVER_PORT} 80
RewriteCond %{REQUEST_URI} IS
RewriteRule ^(.*)$ https://www.lyleskains.com/IS/$1 [R=301,L]

(The last two lines are the customizable ones - have to put the web folder on the penultimate line, and the full url on the last, before the “/$1”.)

Then I saved it and uploaded the .htaccess file through Transmit. Seems to work fine now.

Never really fixed the service worker error, but it works  fine anyway, so I couldn’t be asked.