Skip to content

Commit

Permalink
chore: add readme
Browse files Browse the repository at this point in the history
  • Loading branch information
Ovilia committed Sep 13, 2020
1 parent 1c5b39e commit 9b41233
Show file tree
Hide file tree
Showing 7 changed files with 26 additions and 2 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
node_modules/
lib/
tmp/
dist/*.zip
21 changes: 21 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# EVERY ALIEN LOVES 404

![Screenshot](./screenshots/400.png)

This is [@devyumao](https://github.com/devyumao) and [@Ovilia](https://github.com/Ovilia)'s entry for [Js13kGames](https://js13kgames.com/) 2020. This year's theme is `404`.

## Game Background

You are an alien visiting the Earth. Your goal is to find 10 DNA samples.

But on the way to do that, humans may witness your flying saucer. They may tweet about what they see and the public pressure will terminate your agreemenet with some governments that secretly allow you to collect these DNA samples. So, you need to make the most influential tweets to be 404 as long as collecting DNA samples.

## Play!

(Online link will be published soon. You may download this repo and open `dist/index.html` with a local server if you are too curious to wait.)

### Controls

<kbd>A</kbd>/<kbd>S</kbd>/<kbd>D</kbd>/<kbd>W</kbd> to move around.

Hold <kbd>SPACE</kbd> then release to collect DNA samples or make tweets 404.
1 change: 1 addition & 0 deletions dist/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<!DOCTYPE html><meta charset="utf-8"><title>Alien</title><style>body{margin:0;transition:1s;font-family:monospace;background:#0e1a25;color:#aaa;line-height:1.6em;font-size:14px}.ui,canvas{position:absolute;left:0;top:0;width:100%;height:100%;image-rendering:pixelated;overflow:hidden}.ui{z-index:1}.p{position:absolute;padding:0 10px;background:#574ab7;color:#fff;border-radius:4px;transition:opacity .5s;font-weight:700;font-size:12px;transform:translate(-50%);min-width:108px;text-align:center;line-height:32px;box-sizing:border-box}.p.po{opacity:0!important}.p::before{position:absolute;top:0;left:50%;transform:translate(-50%,-50%) rotate(45deg);width:8px;height:8px;background:inherit;content:''}.p::after{display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;height:100%;width:0;content:'';white-space:nowrap;transition:width .2s linear;font-size:12px;font-weight:700;color:#4e6d47;background:#9be889;box-sizing:border-box;border-radius:4px}.p.y{background:#a641e7}.p.R{background:#dd4391}.p.pl{overflow:hidden}.p.pf{animation:p4 .3s ease forwards}.p.pl::after{width:100%;transition:width 1s linear;border:2px solid #4e6d47}.p.pf::after{content:'404 NOT FOUND'}@keyframes p4{0%{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.2)}100%{transform:translate(-50%) scale(1)}}#a{text-align:center;position:relative;top:50%}#b,#b .w,#b.w .f,#u{display:none}#b{position:absolute;left:50vw;right:10vw;min-width:350px;top:90px}#b.w .w{display:block}h2,h3,h4,h5,h6{text-align:center}h3{font-size:45px;font-family:serif;color:#fff}h4{margin-bottom:-25px;font-size:22px;color:#ccc}h5{margin:120px 0 0 0;font-size:15px}h5 a{color:#9be889}h6{margin:0}a{color:#32c5d9}@keyframes blink{from{opacity:1}to{opacity:.4}}h2{animation:.5s blink ease-in-out infinite alternate;margin:10px 0}#w{position:absolute;height:2.2vh;width:16vh;transform:translate(-50%,50%);border-radius:.3vh;background:#202731;opacity:0;transition:opacity .15s}#wt{height:100%;background:#32c5d9}#wp{position:absolute;top:0;left:0;width:.3vh;height:100%;background:#fff;animation:wiggle .8s linear infinite alternate}#f{top:25%;left:50%;position:absolute;font-size:7vh;color:#444;text-shadow:0 0 1vh rgba(255,255,255,.5);opacity:0;font-weight:700;transform:translate(-50%,50%)}#f.i{transition:opacity .15s ease .4s,transform .15s ease .4s;opacity:1;transform:translate(-50%,0)}#f.o{transition:opacity .15s,transform .15s;opacity:0}#g{display:none}#r{border-radius:6px;padding:15px;width:50vh;background:rgba(28,37,46,.5);top:50%;margin:50vh auto;color:#fff;z-index:1000;position:relative;text-align:center;display:none}.t{background:rgba(28,37,46,.7);border-radius:6px;width:260px;position:absolute;top:70px;transition:.5s ease-in;max-height:450px;overflow:auto;z-index:100}#h{display:none;width:215px;left:20px;padding:15px 10px}#h .a{border-color:#32c5d9}#t{right:20px}.T{margin:5px 0;min-height:70px;padding:5px 0}@keyframes hl{0%{background-color:#9be889}100%{background-color:transparent}}.TT{background-color:#9be889;animation:hl 3s forwards}.TT .a{border-color:#9be889}.a{width:32px;image-rendering:pixelated;border:2px solid #dd4391;border-radius:4px;margin-left:6px}.v{color:#fff;font-size:12px;text-align:center;line-height:13px}.l{width:48px;float:left;margin-left:10px}.r{margin:0 10px 0 70px}.n{color:#fff;font-size:13px;font-weight:700;overflow:hidden;text-overflow:ellipsis;line-height:1;margin-bottom:4px}.c{font-size:11px;line-height:16px;overflow:hidden}@keyframes wiggle{to{left:100%}}</style><div class="ui"><div id="a"><h3>EVERY ALIEN LOVES 404</h3><p>BEST WITH EARPHONES; VR SUPPORTED<h2 id="x">LOADING...</h2></div><div id="b"><h4>EVERY ALIEN LOVES 404</h4><h3 class="f">GAME OVER</h3><h3 class="w">YOU WIN</h3><p class="f">YOU FAILED TO GET ENOUGH DNA SAMPLES ON THE EARTH. NOW, TOO MANY HUMANS HEARD ABOUT YOUR SPECIES AND THE COOPERATION WITH SEVERAL GOVERNMENTS HAS BEEN TERMINATED DUE TO THE PUBLIC PRESSURE.<p class="w">YOU MANAGED TO GET ENOUGH DNA SAMPLES ON THE EARTH. YOU HAVE JUST SEND THE DATA BACK TO YOUR PLANET.<p>THE GOOD NEWS IS THAT WE CAN FINALLY GO BACK HOME NOW. HOME, SWEET HOME.<p>WELL, THE BAD NEWS IS THAT THE NAVIGATION SYSTEM KEEPS RETURNING 404...<h2>PRESS ENTER TO REPLAY</h2><h5>A <a href="//umeecorn.com">UMEECORN</a> GAME</h5><h6>BY <a href="//github.com/devyumao">@DEVYUMAO</a> AND <a href="//github.com/Ovilia">@OVILIA</a></h6></div><div id="g"><div id="h" class="t"></div><div id="t" class="t"></div><div id="r"></div><div id="p"></div><div id="w"><div id="wt"></div><div id="wp"></div></div><div id="f">?</div></div><canvas id="u"></canvas></div><script src="https://js13kgames.com/webxr-src/2020/three.js"></script><script src="./index.js"></script>
1 change: 1 addition & 0 deletions dist/index.js

Large diffs are not rendered by default.

Binary file added screenshots/160.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added screenshots/400.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions tutorial.js
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ function setTutorial(state) {
break;

case TUTORIAL.AFTER_DNA_AVAILABLE$:
text = 'HOLD SPACE AND RELEASE ON CORRECT MOMENT TO CATCH IT!';
text = 'HOLD SPACE AND RELEASE AT THE CORRECT MOMENT TO CATCH IT!';
break;

case TUTORIAL.AFTER_MEDIUM_APPEAR$:
Expand All @@ -61,7 +61,7 @@ function setTutorial(state) {
break;

case TUTORIAL.AFTER_MEDIA_CAUGHT$:
text = 'GOOD JOB! NOW, COMPLETE YOUR GOAL OF COLLECTING 10 DNA SAMPLES. REMEMBER YOU ONLY HAVE TO MAKE THE TWEETS 404 WHEN NECESSARY. DON\'T WASTE TOO MUCH YOUR TIME ON IT.';
text = 'GOOD JOB! NOW, COMPLETE YOUR GOAL OF COLLECTING 10 DNA SAMPLES. REMEMBER YOU ONLY HAVE TO MAKE THE TWEETS 404 WHEN NECESSARY. DON\'T WASTE TOO MUCH TIME ON IT.';
setTimeout(() => {
setTutorial(TUTORIAL.DONE$);
tutorialCompleted = true;
Expand Down

0 comments on commit 9b41233

Please sign in to comment.