267 lines
7.9 KiB
HTML
267 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
|
|
<!-- THE BIG META -->
|
|
<title>Adventures With Anxiety! (Demo)</title>
|
|
<meta name="description" content="A story-game about a human and their anxiety! You play *as* the anxiety." />
|
|
<link rel="icon" type="image/png" href="favicon.png">
|
|
|
|
<!-- Schema.org markup for Google+ -->
|
|
<meta itemprop="name" content="Adventures With Anxiety! (Demo)">
|
|
<meta itemprop="description" content="A story-game about a human and their anxiety! You play *as* the anxiety.">
|
|
<meta itemprop="image" content="https://ncase.me/anxiety-demo/sharing/thumb.png">
|
|
|
|
<!-- Twitter Card data -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:site" content="@ncasenmare">
|
|
<meta name="twitter:title" content="Adventures With Anxiety! (Demo)">
|
|
<meta name="twitter:description" content="A story-game about a human and their anxiety! You play *as* the anxiety.">
|
|
<meta name="twitter:image" content="https://ncase.me/anxiety-demo/sharing/thumb.png">
|
|
|
|
<!-- Open Graph data -->
|
|
<meta property="og:title" content="Adventures With Anxiety! (Demo)">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:url" content="https://ncase.me/anxiety-demo">
|
|
<meta property="og:image" content="https://ncase.me/anxiety-demo/sharing/thumb.png">
|
|
<meta property="og:description" content="A story-game about a human and their anxiety! You play *as* the anxiety.">
|
|
<meta property="og:site_name" content="Adventures With Anxiety! (Demo)">
|
|
|
|
<!-- Styles -->
|
|
<link rel="stylesheet" type="text/css" href="styles/game.css">
|
|
|
|
<!-- Mobile -->
|
|
<meta name="viewport" content="width=360, user-scalable=no" id="my_viewport">
|
|
<script>
|
|
var ratio = screen.width/screen.height;
|
|
if(ratio > 360/600){
|
|
var mvp = document.getElementById('my_viewport');
|
|
mvp.setAttribute('content','width='+Math.round(ratio*600)+', height=600, user-scalable=no');
|
|
}
|
|
</script>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<div id="game_container">
|
|
|
|
<!-- The main game -->
|
|
<canvas id="game_canvas"></canvas>
|
|
<div id="game_words"></div>
|
|
<div id="game_hp"></div>
|
|
<div id="game_choices"></div>
|
|
|
|
<!-- Click to Advance-->
|
|
<div id="click_to_advance">
|
|
<span id="cta_text1">
|
|
<div class="mini-icon" pic="click" style="top:3px;"></div>
|
|
click anywhere
|
|
</span>
|
|
<span id="cta_text2">
|
|
<div class="mini-icon" pic="next"></div>
|
|
</span>
|
|
</div>
|
|
|
|
<!-- Bottom Corner Tabs -->
|
|
<div id="gear" style="display:none" onclick="publish('show_options')">
|
|
<div class="icon">
|
|
<div class="mini-icon" pic="gear"></div>
|
|
</div>
|
|
</div>
|
|
<div id="about" style="display:none">
|
|
<div class="icon">
|
|
<div class="mini-icon" pic="about"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Paused Screen -->
|
|
<div id="paused">
|
|
<div>
|
|
paused
|
|
<div>click anywhere to keep freaking out</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- LOADING -->
|
|
<div id="loading">
|
|
<div id="loading_bar">
|
|
<div id="loading_bar_bg"></div>
|
|
<div id="loading_pic"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ABOUT / END DEMO -->
|
|
<div id="end_demo_tbc"></div>
|
|
<div id="end_demo">
|
|
<div id="end_demo_words">
|
|
<span id="end_words1">
|
|
Augh games take so long to make!
|
|
This one will be done August 2019, and released for <i>free</i>.
|
|
</span>
|
|
<span id="end_words2">
|
|
This is a demo for my upcoming story-game,
|
|
which will be released for <i>free</i> in August 2019.
|
|
</span>
|
|
Get notified via my (once-a-month) newsletter!
|
|
<div>
|
|
<form id="the_newsletter" method="POST" accept-charset="utf-8" target="_blank">
|
|
<input type="text" name="name" id="name" style="display:none"/>
|
|
<input type="email" name="email" id="email" placeholder="your@email.com" required/>
|
|
<div id="email_info">
|
|
<input type="checkbox" name="gdpr" id="gdpr"/>
|
|
<div id="consent">
|
|
I consent to 1 ✉️ a month, that's it
|
|
</div>
|
|
<input type="submit" name="submit" id="submit" disabled/>
|
|
</div>
|
|
|
|
<!-- Hidden -->
|
|
<input type="hidden" name="list" value="57rMxgfbvr08aemz763COHwg"/>
|
|
<input type="hidden" name="subform" value="yes"/>
|
|
|
|
<!-- Hey bots, fill this one up. -->
|
|
<div style="display:none;">
|
|
<label for="hp">HP</label><br/>
|
|
<input type="text" name="hp" id="hp"/>
|
|
</div>
|
|
|
|
</form>
|
|
</div>
|
|
|
|
<div class="about_padding">
|
|
Help me keep making free games?
|
|
</div>
|
|
<a href="https://www.patreon.com/ncase" target="_blank" class="no_deco">
|
|
<div id="patreon"></div>
|
|
</a>
|
|
|
|
<div class="about_padding">
|
|
A share on an anxiety-app helps too!
|
|
</div>
|
|
<div id="share">
|
|
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fncase.me%2Fanxiety-demo%2F" target="_blank" class="no_deco">
|
|
<div id="share_fb"></div>
|
|
</a>
|
|
<a href="https://twitter.com/intent/tweet?source=https%3A%2F%2Fncase.me%2Fanxiety-demo%2F&text=I%20just%20played%20this%20story-game%20about%20a%20human%20and%20their%20anxiety!%20You%20play%20*as*%20the%20anxiety.%20%F0%9F%98%B1%20https%3A%2F%2Fncase.me%2Fanxiety-demo%2F"
|
|
target="_blank" class="no_deco">
|
|
<div id="share_tw"></div>
|
|
</a>
|
|
<a href="mailto:?subject=Adventures%20with%20Anxiety!%20(Demo)&body=I%20just%20played%20this%20story-game%20about%20a%20human%20and%20their%20anxiety!%20You%20play%20*as*%20the%20anxiety.%20%F0%9F%98%B1%20https%3A%2F%2Fncase.me%2Fanxiety-demo%2F"
|
|
target="_blank" class="no_deco">
|
|
<div id="share_em"></div>
|
|
</a>
|
|
</div>
|
|
|
|
<div style="clear:both" class="about_padding"></div>
|
|
|
|
Above all, thank you for playing! <3
|
|
<br>
|
|
<a href="https://ncase.me/" target="_blank">
|
|
my other games
|
|
</a>
|
|
·
|
|
<a href="https://twitter.com/ncasenmare" target="_blank">
|
|
my twitter
|
|
</a>
|
|
|
|
<div id="replay"></div>
|
|
|
|
<div style="clear:both;"></div>
|
|
<div id="close_about">close</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- OPTIONS -->
|
|
<div id="options">
|
|
<div style="width: 150px; height: 63px; float: left;">
|
|
<div id="text_speed_preview"></div>
|
|
<input id="text_speed_slider" type="range" min=0 value=0.5 max=1 step="0.01"/>
|
|
</div>
|
|
<div style="float: right; width: 135px; height: 63px;">
|
|
And advance
|
|
<div id="text_automatic_toggle">on click</div>
|
|
</div>
|
|
<div style="clear:both"></div>
|
|
<span id="volume_options">
|
|
<div>Volume:</div>
|
|
<input id="volume_slider" type="range" min=0 max=1 value=1 step="0.01"/>
|
|
</span>
|
|
<div id="options_ok">
|
|
ok <div class="mini-icon" pic="ok" style="top: 3px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Corner Text -->
|
|
<div id="topleft">
|
|
|
|
Created by
|
|
<a target="_blank" href="https://ncase.me/">
|
|
Nicky Case</a>
|
|
|
|
<br>
|
|
|
|
Music
|
|
<a target="_blank" href="http://freemusicarchive.org/music/Komiku/Captain_Glouglous_Incredible_Week_Soundtrack/pog">
|
|
by Komiku</a>
|
|
|
|
<br>
|
|
|
|
See
|
|
<a target="_blank" href="https://github.com/ncase/anxiety-demo">
|
|
source code & full credits</a>
|
|
|
|
</div>
|
|
<div id="bottomright">
|
|
|
|
Thank you playtesters!
|
|
|
|
<br><br>
|
|
|
|
B Cavello
|
|
<br>
|
|
EmilyKate McDonough
|
|
<br>
|
|
Glen Chiacchieri
|
|
<br>
|
|
Mikayla Hutchinson
|
|
<br>
|
|
Monica Srivastava
|
|
<br>
|
|
Rowan
|
|
<br>
|
|
Srini Kadamati
|
|
|
|
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|
|
|
|
<!-- SCRIPTS -->
|
|
<script src="scripts/lib/helpers.js"></script>
|
|
<script src="scripts/lib/rsvp.min.js"></script>
|
|
<script src="scripts/lib/minpubsub.min.js"></script>
|
|
<script src="scripts/lib/howler.min.js"></script>
|
|
|
|
<script src="scripts/game/Loader.js"></script>
|
|
<script src="scripts/game/Game.js"></script>
|
|
<script src="scripts/game/Sprite.js"></script>
|
|
<script src="scripts/game/HP.js"></script>
|
|
<script src="scripts/game/BG_Anxiety.js"></script>
|
|
<script src="scripts/game/Character.js"></script>
|
|
<script src="scripts/game/Sounds.js"></script>
|
|
<script src="scripts/game/Options.js"></script>
|
|
<script src="scripts/game/About.js"></script>
|
|
|
|
<script src="scripts/intro/Intro_SceneSetup.js"></script>
|
|
<script src="scripts/intro/Intro_BG.js"></script>
|
|
|
|
<script src="scripts/act1/Act1_SceneSetup.js"></script>
|
|
<script src="scripts/act1/Act1_Hong.js"></script>
|
|
<script src="scripts/act1/Act1_Beebee.js"></script>
|
|
<script src="scripts/act1/Act1_Outro_BG.js"></script>
|
|
|
|
<script src="scripts/main.js"></script> |