Skip to content

Instantly share code, notes, and snippets.

@Verdi
Verdi / gist:f7daf6237c23141e9bae8f67e95b85f5
Created January 22, 2023 19:41
Twine footer to change undo/redo to emoji
(replace: "↶")[👈]
(replace: "↷")[👉]
@Verdi
Verdi / gist:21c3f281cee6d62000ce4614397cfc3c
Last active January 22, 2023 19:39
Simple Twine Styles
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,600;1,400;1,600&display=swap');
tw-story {
display: block; /* reset */
width: 90vw; /* width on viewports <1000 */
margin: auto;
padding: 2rem 0;
padding-bottom: 2rem;
background: #fff; /* reset */
color: #404040;
@Verdi
Verdi / gist:c04f379322fbcd789767e57f92af957f
Created February 25, 2019 22:04
Bandersnatch-like timer for Twine
[[DEFAULT CHOICE PASSAGE NAME]] <!-- This is the passage you will go to if no action is taken -->
[[PASSAGE NAME]]
<!-- Timer code below -->
{(live: XX+8s)[(replace: "PASSAGE NAME")[**~~PASSAGE NAME~~**]]}<!-- This will cross out a link to a passage. The time (live: XX+8s) is meant to make it happen 8 seconds after the 10 second countdown starts. -->
{(live: XXs)[(stop:) <!-- "XXs" is the amount of seconds you want to wait before the countdown starts -->
(set: $counter to 10)
Time left: |amount>[$counter]
(live: 1s)[
(set: $counter to it - 1)
(if: $counter is 0)[(go-to: "DEFAULT CHOICE PASSAGE NAME")]
/* My Harelowe Game Styles */
@import url('https://fonts.googleapis.com/css?family=Poppins:200,600');
@import url('https://fonts.googleapis.com/css?family=Roboto+Mono:300,700');
html, tw-story {
background-color: #F2F2F2;
color: #242424;
}
tw-sidebar {
@Verdi
Verdi / .htaccess
Created November 11, 2018 22:16
.htaccess to apply new serviceworker right away
<IfModule mod_expires.c>
<FilesMatch "serviceworker.js">
ExpiresDefault "access plus 0 seconds"
</FilesMatch>
</IfModule>
@Verdi
Verdi / extra_meta_tags_for_twine.txt
Last active June 1, 2019 21:35
Meta tags to add to twine game
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<link rel="manifest" href="/manifest.json" />
<link rel="icon" href="icon-256.png" sizes="256x256" />
<link rel="icon" href="icon-32.png" sizes="32x32" />
<link rel="icon" href="icon-192.png" sizes="192x192" />
<link rel="apple-touch-icon-precomposed" href="icon-180.png" />
<meta name="msapplication-TileImage" content="icon-270.png" />
@Verdi
Verdi / manifest.json
Created November 11, 2018 22:12
Web manifest for twine game
{
"lang": "en",
"name": "My Game",
"short_name": "My Game",
"description": "My super awesome twine game",
"start_url": "/index.html",
"background_color": "#000000",
"theme_color": "#202020",
"display": "standalone",
"icons": [{
@Verdi
Verdi / register_serviceworker.txt
Last active June 1, 2019 21:31
Register Serviceworker
<script>
if (navigator.serviceWorker) {
navigator.serviceWorker.register('/serviceworker.js');
}
</script>
@Verdi
Verdi / serviceworker.js
Last active June 1, 2019 21:33
Serviceworker for twine game
const version = 'V0.03';
const staticCacheName = version + 'staticfiles';
addEventListener('install', installEvent => {
skipWaiting();
installEvent.waitUntil(
caches.open(staticCacheName)
.then(staticCache =>{
// These files don't block installation
staticCache.addAll([
@Verdi
Verdi / desktop-framer-project.coffee
Last active February 11, 2019 15:36
This is the setup I use in Framer Studio for creating desktop software (Browsers) mockups.
#Setup
########## Include for desktop projects ##########
# Tell computers with touch screens to use the mouse
if Utils.isDesktop() or not Utils.isTouch()
Framer.Extras.TouchEmulator.disable()
preventer = () -> alert "Please use your mouse and not the touch screen."
preventer2 = (event) -> if event.pointerType is "touch" then preventer() # Edge-only
window.addEventListener("touchstart", preventer, false)
window.addEventListener("pointerdown", preventer2, false)
# Ensures that the alert also fires for Edge