mass energy mod, various bug fixes
This commit is contained in:
landgreen
974
index.html
974
index.html
@@ -1,488 +1,488 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-113454647-1"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
|
||||
function gtag() {
|
||||
dataLayer.push(arguments);
|
||||
}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'UA-113454647-1');
|
||||
</script>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="description" content="Browser-based side scrolling video game with the matter.js physics engine.">
|
||||
<meta name="author" content="Ross Landgreen">
|
||||
<meta property="og:description" content="Browser-based side scrolling video game with the matter.js physics engine.">
|
||||
<meta property="og:title" content="n-gon">
|
||||
<meta name="twitter:title" content="n-gon">
|
||||
<meta name="twitter:description" content="Browser-based side scrolling video game with the matter.js physics engine.">
|
||||
|
||||
<title>n-gon</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel='shortcut icon' href='favicon.ico' type='image/x-icon' />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- <body oncontextmenu="return false"> -->
|
||||
<div id='guns'></div>
|
||||
<div id='field'></div>
|
||||
<div id='mods'></div>
|
||||
<div id="text-log"></div>
|
||||
<div id="fade-out"></div>
|
||||
<div id="health-bg"></div>
|
||||
<div id="health"></div>
|
||||
<div id="dmg"></div>
|
||||
|
||||
<!-- guns -->
|
||||
<!-- <audio id="snare2" src="sounds\guns\snare2.ogg" preload="auto"></audio>
|
||||
<audio id="airgun" src="sounds\guns\airgun.ogg" preload="auto"></audio>
|
||||
<audio id="basssnaredrum" src="sounds\guns\basssnaredrum.ogg" preload="auto"></audio>
|
||||
<audio id="sniper" src="sounds\guns\sniper.ogg" preload="auto"></audio>
|
||||
<audio id="glock" src="sounds\guns\glock.ogg" preload="auto"></audio>
|
||||
<audio id="launcher" src="sounds\guns\launcher2.ogg" preload="auto"></audio> -->
|
||||
|
||||
<!-- player walk -->
|
||||
<!-- <audio id="walk1" src="sounds\mech\walk1.ogg" preload="auto"></audio>
|
||||
<audio id="walk2" src="sounds\mech\walk2.ogg" preload="auto"></audio>
|
||||
<audio id="walk3" src="sounds\mech\walk3.ogg" preload="auto"></audio>
|
||||
<audio id="walk4" src="sounds\mech\walk4.ogg" preload="auto"></audio>
|
||||
<audio id="walk5" src="sounds\mech\walk5.ogg" preload="auto"></audio>
|
||||
<audio id="walk6" src="sounds\mech\walk6.ogg" preload="auto"></audio>
|
||||
<audio id="walk7" src="sounds\mech\walk7.ogg" preload="auto"></audio>
|
||||
<audio id="walk8" src="sounds\mech\walk8.ogg" preload="auto"></audio>
|
||||
<audio id="walk9" src="sounds\mech\walk9.ogg" preload="auto"></audio>
|
||||
<audio id="walk10" src="sounds\mech\walk10.ogg" preload="auto"></audio> -->
|
||||
|
||||
<!-- player dmg -->
|
||||
<!-- <audio id="dmg0" src="sounds\dmg\dmg0.ogg" preload="auto"></audio>
|
||||
<audio id="dmg1" src="sounds\dmg\dmg1.ogg" preload="auto"></audio>
|
||||
<audio id="dmg2" src="sounds\dmg\dmg2.ogg" preload="auto"></audio>
|
||||
<audio id="dmg3" src="sounds\dmg\dmg3.ogg" preload="auto"></audio> -->
|
||||
|
||||
<!-- other -->
|
||||
<!-- <audio id="boom" src="sounds\boom.ogg" preload="auto"></audio>
|
||||
<audio id="powerup" src="sounds\powerup4.ogg" preload="auto"></audio>
|
||||
<audio id="no" src="sounds\no.ogg" preload="auto"></audio>
|
||||
<audio id="click" src="sounds\click.ogg" preload="auto"></audio>
|
||||
<audio id="ammo" src="sounds\ammo.ogg" preload="auto"></audio> -->
|
||||
|
||||
<canvas id="canvas"></canvas>
|
||||
<!-- ********** intro page ***********************************************
|
||||
******************************************************************************* -->
|
||||
|
||||
<!-- <div id="build-details">
|
||||
<div class="build-grid-module"></div>
|
||||
<details>
|
||||
<summary>build</summary>
|
||||
<div id="details-div">
|
||||
|
||||
</div>
|
||||
</details>
|
||||
</div> -->
|
||||
<div id="build-grid"></div>
|
||||
<!-- <button type="button" id="build-button">challenge run</button> -->
|
||||
<svg class="SVG-button" id="build-button" width="110" height="40">
|
||||
<g stroke='none' fill='#333' stroke-width="2" font-size="28px" font-family="Arial, sans-serif">
|
||||
<text x="10" y="30">custom</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
||||
<div id="settings">
|
||||
<details>
|
||||
<summary>settings</summary>
|
||||
<div style="line-height: 150%;" id="details-div">
|
||||
<label for="difficulty-select" title="effects: number of mobs, damage done by mobs, damage done to mobs, mob speed">combat difficulty:</label>
|
||||
<select name="difficulty-select" id="difficulty-select">
|
||||
<option value="easy">easy</option>
|
||||
<option value="0" selected>normal</option>
|
||||
<option value="4">hard</option>
|
||||
<option value="8">why...</option>
|
||||
</select>
|
||||
<br>
|
||||
<label for="body-damage" title="allow damage from heavy, fast moving blocks">collision damage from blocks:</label>
|
||||
<input type="checkbox" id="body-damage" name="body-damage" checked style="width:16px; height:16px;">
|
||||
<br>
|
||||
<label for="fps-select" title="use this to slow the game down">frames per second cap:</label>
|
||||
<select name="fps-select" id="fps-select">
|
||||
<option value="max">no fps cap</option>
|
||||
<option value="72" selected>72 fps cap</option>
|
||||
<option value="60">60 fps cap</option>
|
||||
<option value="45">45 fps cap</option>
|
||||
<option value="30">30 fps cap</option>
|
||||
</select>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="controls">
|
||||
<details>
|
||||
<summary>about</summary>
|
||||
<div id="details-div">
|
||||
<table>
|
||||
<tr>
|
||||
<th>FIRE</th>
|
||||
<td>left mouse</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>FIELD</th>
|
||||
<td>right mouse / spacebar</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>MOVE</th>
|
||||
<td>WASD / arrows</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>GUNS</th>
|
||||
<td>Q / E / mouse wheel</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>ZOOM</th>
|
||||
<td>+ / -</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>PAUSE</th>
|
||||
<td>P</td>
|
||||
</tr>
|
||||
<!-- <tr>
|
||||
<td>FULL SCREEN</td>
|
||||
<td>enter</td>
|
||||
</tr> -->
|
||||
</table>
|
||||
<br>
|
||||
<br>
|
||||
<a href="https://discord.gg/2eC9pgJ">
|
||||
<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1400 235">
|
||||
<style>
|
||||
.st0 {
|
||||
fill: #1B1F23;
|
||||
}
|
||||
</style>
|
||||
<path class="st0" d="M142.8 120.1c-5.7 0-10.2 4.9-10.2 11s4.6 11 10.2 11c5.7 0 10.2-4.9 10.2-11s-4.6-11-10.2-11zM106.3 120.1c-5.7 0-10.2 4.9-10.2 11s4.6 11 10.2 11c5.7 0 10.2-4.9 10.2-11 .1-6.1-4.5-11-10.2-11z" />
|
||||
<path class="st0" d="M191.4 36.9h-134c-11.3 0-20.5 9.2-20.5 20.5v134c0 11.3 9.2 20.5 20.5 20.5h113.4l-5.3-18.3 12.8 11.8 12.1 11.1 21.6 18.7V57.4c-.1-11.3-9.3-20.5-20.6-20.5zm-38.6 129.5s-3.6-4.3-6.6-8c13.1-3.7 18.1-11.8 18.1-11.8-4.1 2.7-8 4.6-11.5 5.9-5 2.1-9.8 3.4-14.5 4.3-9.6 1.8-18.4 1.3-25.9-.1-5.7-1.1-10.6-2.6-14.7-4.3-2.3-.9-4.8-2-7.3-3.4-.3-.2-.6-.3-.9-.5-.2-.1-.3-.2-.4-.2-1.8-1-2.8-1.7-2.8-1.7s4.8 7.9 17.5 11.7c-3 3.8-6.7 8.2-6.7 8.2-22.1-.7-30.5-15.1-30.5-15.1 0-31.9 14.4-57.8 14.4-57.8 14.4-10.7 28-10.4 28-10.4l1 1.2c-18 5.1-26.2 13-26.2 13s2.2-1.2 5.9-2.8c10.7-4.7 19.2-5.9 22.7-6.3.6-.1 1.1-.2 1.7-.2 6.1-.8 13-1 20.2-.2 9.5 1.1 19.7 3.9 30.1 9.5 0 0-7.9-7.5-24.9-12.6l1.4-1.6s13.7-.3 28 10.4c0 0 14.4 25.9 14.4 57.8 0-.1-8.4 14.3-30.5 15zM303.8 79.7h-33.2V117l22.1 19.9v-36.2h11.8c7.5 0 11.2 3.6 11.2 9.4v27.7c0 5.8-3.5 9.7-11.2 9.7h-34v21.1h33.2c17.8.1 34.5-8.8 34.5-29.2v-29.8c.1-20.8-16.6-29.9-34.4-29.9zm174 59.7v-30.6c0-11 19.8-13.5 25.8-2.5l18.3-7.4c-7.2-15.8-20.3-20.4-31.2-20.4-17.8 0-35.4 10.3-35.4 30.3v30.6c0 20.2 17.6 30.3 35 30.3 11.2 0 24.6-5.5 32-19.9l-19.6-9c-4.8 12.3-24.9 9.3-24.9-1.4zM417.3 113c-6.9-1.5-11.5-4-11.8-8.3.4-10.3 16.3-10.7 25.6-.8l14.7-11.3c-9.2-11.2-19.6-14.2-30.3-14.2-16.3 0-32.1 9.2-32.1 26.6 0 16.9 13 26 27.3 28.2 7.3 1 15.4 3.9 15.2 8.9-.6 9.5-20.2 9-29.1-1.8l-14.2 13.3c8.3 10.7 19.6 16.1 30.2 16.1 16.3 0 34.4-9.4 35.1-26.6 1-21.7-14.8-27.2-30.6-30.1zm-67 55.5h22.4V79.7h-22.4v88.8zM728 79.7h-33.2V117l22.1 19.9v-36.2h11.8c7.5 0 11.2 3.6 11.2 9.4v27.7c0 5.8-3.5 9.7-11.2 9.7h-34v21.1H728c17.8.1 34.5-8.8 34.5-29.2v-29.8c0-20.8-16.7-29.9-34.5-29.9zm-162.9-1.2c-18.4 0-36.7 10-36.7 30.5v30.3c0 20.3 18.4 30.5 36.9 30.5 18.4 0 36.7-10.2 36.7-30.5V109c0-20.4-18.5-30.5-36.9-30.5zm14.4 60.8c0 6.4-7.2 9.7-14.3 9.7-7.2 0-14.4-3.1-14.4-9.7V109c0-6.5 7-10 14-10 7.3 0 14.7 3.1 14.7 10v30.3zM682.4 109c-.5-20.8-14.7-29.2-33-29.2h-35.5v88.8h22.7v-28.2h4l20.6 28.2h28L665 138.1c10.7-3.4 17.4-12.7 17.4-29.1zm-32.6 12h-13.2v-20.3h13.2c14.1 0 14.1 20.3 0 20.3z" />
|
||||
</svg>
|
||||
</a>
|
||||
Chat about n-gon in the <a href="https://discord.gg/2eC9pgJ">discord</a>.<br> Let me know about ideas, or bugs.
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<a href="https://github.com/landgreen/n-gon">
|
||||
<svg viewBox="0 0 100 16" xmlns="http://www.w3.org/2000/svg" fill="#1B1F23">
|
||||
<path d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z" />
|
||||
<g stroke='none' font-size="8px" font-family="Arial Black, sans-serif">
|
||||
<text x="19" y="11">Github</text>
|
||||
</g>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="https://github.com/landgreen/n-gon">Github</a> hosts the source code for n-gon.<br> It's written in JavaScript, CSS, and HTML.
|
||||
<!-- <br>
|
||||
<br>
|
||||
n-gon is also hosted at <a href="https://lilgreenland.itch.io/n-gon">itch.io</a>.
|
||||
<br>
|
||||
<br> -->
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.fade-in {
|
||||
opacity: 0;
|
||||
animation: 4s ease 3s normal forwards 1 fadein;
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes dash {
|
||||
to {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.draw-lines {
|
||||
stroke-dasharray: 20;
|
||||
stroke-dashoffset: 20;
|
||||
animation: dash 4.8s ease-in forwards;
|
||||
}
|
||||
|
||||
.draw-lines-box-1 {
|
||||
stroke-dasharray: 1000;
|
||||
stroke-dashoffset: 1000;
|
||||
animation: dash 10s ease-in forwards;
|
||||
animation-delay: 0s;
|
||||
}
|
||||
|
||||
.draw-lines-box-2 {
|
||||
stroke-dasharray: 1000;
|
||||
stroke-dashoffset: 1000;
|
||||
animation: dash 5.2s ease-in forwards;
|
||||
animation-delay: 2s;
|
||||
}
|
||||
|
||||
.draw-lines-box-3 {
|
||||
stroke-dasharray: 1000;
|
||||
stroke-dashoffset: 1000;
|
||||
animation: dash 2.3s ease-in forwards;
|
||||
animation-delay: 3.1s;
|
||||
}
|
||||
|
||||
.draw-lines3 {
|
||||
stroke-dasharray: 3000;
|
||||
stroke-dashoffset: 3000;
|
||||
animation: dash 6.2s ease-in forwards;
|
||||
}
|
||||
|
||||
.draw-lines4 {
|
||||
stroke-dasharray: 300;
|
||||
stroke-dashoffset: 300;
|
||||
animation: dash 5s ease-in forwards;
|
||||
}
|
||||
</style>
|
||||
<svg id='splash' class="intro" viewBox="0 0 800 800" onclick="game.startGame()">
|
||||
<!-- title -->
|
||||
<!-- <g class="fade-in" transform="translate(100,210) scale(34)" fill='#bbb' stroke='none'>
|
||||
<path d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" fill="rgb(50,200,255)" />
|
||||
<rect x="4" y="1.25" width="1" height="0.5" rx='0.03' />
|
||||
<path transform="translate(6.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v2.3 l-0.2 0.2 h-1.8 v-0.5 h1.4 L 1.1 2.4 h-1.1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z"
|
||||
fill='rgb(255,70,140)' />
|
||||
<path transform="translate(10.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v1 l -0.7 0.7 h-1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z"
|
||||
fill="none" />
|
||||
<path transform="translate(14,0)" d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" fill='rgb(10,220,190)'
|
||||
/>
|
||||
</g> -->
|
||||
<g class="fade-in" transform="translate(100,210) scale(34)" fill='#bbb' stroke='none'>
|
||||
<path d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" />
|
||||
<rect x="4" y="1.25" width="1" height="0.5" rx='0.03' />
|
||||
<path transform="translate(6.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v2.3 l-0.2 0.2 h-1.8 v-0.5 h1.4 L 1.1 2.4 h-1.1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" />
|
||||
<path transform="translate(10.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v1 l -0.7 0.7 h-1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" />
|
||||
<path transform="translate(14,0)" d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" />
|
||||
</g>
|
||||
<g class="draw-lines" transform="translate(100,210) scale(34)" fill='none' stroke='#222' stroke-linejoin="round" stroke-linecap="round">
|
||||
<path d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" stroke-width='0.0875' />
|
||||
<rect x="4" y="1.25" width="1" height="0.5" stroke-width='0.0875' rx='0.03' />
|
||||
<path transform="translate(6.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v2.3 l-0.2 0.2 h-1.8 v-0.5 h1.4 L 1.1 2.4 h-1.1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" stroke-width='0.07' />
|
||||
<path transform="translate(10.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v1 l -0.7 0.7 h-1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" stroke-width='0.07' />
|
||||
<path transform="translate(14,0)" d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" stroke-width='0.0875' />
|
||||
</g>
|
||||
<!-- mouse -->
|
||||
<g class="draw-lines3" transform="translate(290,430) scale(0.28)" stroke-linecap="round" stroke-linejoin="round" stroke-width="10px" stroke="#222" fill="none">
|
||||
<path class="fade-in" d="M832.41,106.64 V323.55 H651.57 V256.64 c0-82.5,67.5-150,150-150 Z" fill="rgb(0, 200, 255)" stroke="none" />
|
||||
<!-- <path class="fade-in" d="M832.41,106.64 V323.55 H651.57 V256.64 c0-82.5,67.5-150,150-150 Z" fill="#789" stroke="none" />
|
||||
<path class="fade-in" d="M827,112 h30 a140,140,0,0,1,140,140 v68 h-167 z" fill="#7ce" stroke="none" /> -->
|
||||
<path d="M827,112 h30 a140,140,0,0,1,140,140 v268 a140,140,0,0,1-140,140 h-60 a140,140,0,0,1-140-140v-268 a140,140,0,0,1,140-140h60" />
|
||||
<path d="M657 317 h 340 h-170 v-207 s 21 -59, -5 -59 S 807 7, 807 7" />
|
||||
<ellipse fill="#fff" cx="827.57" cy="218.64" rx="29" ry="68" />
|
||||
</g>
|
||||
<!-- keys -->
|
||||
<g transform="translate(195,480) scale(0.8)">
|
||||
<g fill='none' stroke='#222' stroke-width="3.5" stroke-linejoin="round">
|
||||
<path d="M0 60 h60 v-60 h-60 v60" class="draw-lines-box-1" />
|
||||
<path d="M70 60 h60 v-60 h-60 v60" class="draw-lines-box-2" />
|
||||
<path d="M140 60 h60 v-60 h-60 v60" class="draw-lines-box-3" />
|
||||
<path d="M0 70 h60 v60 h-60 v-60" class="draw-lines-box-1" />
|
||||
<path d="M70 70 h60 v60 h-60 v-60" class="draw-lines-box-2" />
|
||||
<path d="M140 70 h60 v60 h-60 v-60" class="draw-lines-box-3" />
|
||||
<!-- <rect x="0" y="0" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="140" y="0" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="0" y="70" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="70" y="0" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="70" y="70" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="140" y="70" width="60" height="60" rx='3' /> -->
|
||||
</g>
|
||||
<g class="draw-lines4" text-anchor="middle" stroke='#000' fill='none' stroke-width="2" font-size="38px" font-family="Arial Black, sans-serif">
|
||||
<!-- <text class="fade-in" fill='#aaa' stroke="none" x="30" y="45">Q</text>
|
||||
<text class="fade-in" fill='#aaa' stroke="none" x="170" y="45">E</text> -->
|
||||
<text x="30" y="45" stroke-width="2">Q</text>
|
||||
<text x="170" y="45" stroke-width="2">E</text>
|
||||
<text x="100" y="45">W</text>
|
||||
<text x="100" y="113">S</text>
|
||||
<text x="170" y="113">D</text>
|
||||
<text x="30" y="113">A</text>
|
||||
<!-- <text class="fade-in" fill='#999' x="100" y="45">W</text>
|
||||
<text class="fade-in" fill='#999' x="100" y="113">S</text>
|
||||
<text class="fade-in" fill='#999' x="170" y="113">D</text>
|
||||
<text class="fade-in" fill='#999' x="30" y="113">A</text> -->
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g class="fade-in" fill="none" stroke="#aaa" stroke-width="1">
|
||||
<path d="M 254 433.5 h-35.5 v40" />
|
||||
<path d="M 295 433.5 h36.5 v40" />
|
||||
|
||||
<path d="M 274 625 v-35" />
|
||||
<path d="M 430.5 442 v50 h38" />
|
||||
<path d="M 612.5 442 v50 h-38" />
|
||||
</g>
|
||||
<g class="fade-in" stroke="none" fill="#aaa" font-size="16px">
|
||||
<text x="253" y="422">switch</text>
|
||||
<text x="257" y="438">guns</text>
|
||||
<text x="255" y="638">move</text>
|
||||
<text x="420" y="438">fire</text>
|
||||
<text x="599" y="438">field</text>
|
||||
</g>
|
||||
<g id="gamepad" transform="translate(700,700) scale(0.2)" style="display: none;" stroke="#333" stroke-width="0.5" fill="#444">
|
||||
<path style="fill:#FB7686;" d="M122.578,86.897H68.276c-6.184,0-11.196,5.013-11.196,11.196v12.126h76.692V98.091
|
||||
C133.772,91.908,128.76,86.897,122.578,86.897z" />
|
||||
<rect x="57.08" y="100.766" style="opacity:0.4;fill:#FF4E64;enable-background:new ;" width="76.69" height="9.453" />
|
||||
<path style="fill:#FB7686;" d="M389.422,86.897h54.303c6.182,0,11.194,5.013,11.194,11.196v12.126h-76.693V98.091
|
||||
C378.228,91.908,383.241,86.897,389.422,86.897z" />
|
||||
<rect x="378.229" y="100.766" style="opacity:0.4;fill:#FF4E64;enable-background:new ;" width="76.69" height="9.453" />
|
||||
<rect x="101.947" y="130.449" style="fill:#89BBE4;" width="308.094" height="144.099" />
|
||||
<path style="opacity:0.1;fill:#145587;enable-background:new ;" d="M336.726,130.443l-6.391,28.154
|
||||
c-6.438,28.363-7.324,57.602-2.745,86.134H184.41c4.577-28.531,3.692-57.77-2.746-86.134l-6.39-28.154h-73.323v144.103h308.097
|
||||
V130.443H336.726z" />
|
||||
<g>
|
||||
<path style="fill:#89BBE4;" d="M168.235,158.598l-6.39-28.154c-4.031-12.081-15.338-20.226-28.073-20.226H57.08
|
||||
c-4.862,0-9.582,1.835-13.034,5.259c-9.65,9.571-15.848,22.071-17.629,35.539L0.612,346.264
|
||||
c-5.519,41.762,26.979,78.838,69.103,78.838c31.406,0,58.935-21.004,67.23-51.296l27.18-99.262l0,0
|
||||
C175.524,236.906,176.94,196.95,168.235,158.598z" />
|
||||
<path style="fill:#89BBE4;" d="M511.387,346.264l-25.806-195.25c-1.78-13.468-7.978-25.967-17.629-35.539
|
||||
c-3.452-3.424-8.172-5.259-13.034-5.259h-76.693c-12.734,0-24.041,8.146-28.072,20.226l-6.39,28.154
|
||||
c-8.706,38.353-7.288,78.308,4.109,115.948l0,0l27.18,99.262c8.296,30.292,35.823,51.296,67.23,51.296
|
||||
C484.408,425.102,516.908,388.026,511.387,346.264z" />
|
||||
</g>
|
||||
<circle style="fill:#ACDFEA;" cx="189.252" cy="285.582" r="52.611" />
|
||||
<circle style="opacity:0.3;fill:#145587;enable-background:new ;" cx="183.371" cy="293.273" r="25.611" />
|
||||
<circle style="fill:#ACDFEA;" cx="322.747" cy="285.582" r="52.611" />
|
||||
<circle style="opacity:0.3;fill:#145587;enable-background:new ;" cx="316.866" cy="293.273" r="25.611" />
|
||||
<circle style="fill:#384148;" cx="322.747" cy="285.582" r="25.611" />
|
||||
<g>
|
||||
<path style="fill:#1F84CE;" d="M108.027,142.799H86.073c-4.334,0-7.848,3.514-7.848,7.849v9.17c0,2.082,0.826,4.077,2.298,5.549
|
||||
l11.3,11.3c3.064,3.065,8.034,3.065,11.1,0l10.653-10.652c1.471-1.472,2.298-3.469,2.298-5.549v-9.818
|
||||
C115.875,146.314,112.361,142.799,108.027,142.799z" />
|
||||
<path style="fill:#1F84CE;" d="M76.951,190.893l-10.653-10.652c-1.472-1.472-3.468-2.3-5.549-2.3h-9.818
|
||||
c-4.334,0-7.849,3.514-7.849,7.849v21.953c0,4.335,3.514,7.849,7.849,7.849h9.17c2.082,0,4.077-0.828,5.549-2.3l11.302-11.3
|
||||
C80.016,198.929,80.016,193.96,76.951,190.893z" />
|
||||
<path style="fill:#1F84CE;" d="M113.576,228.168l-11.3-11.3c-3.065-3.065-8.034-3.065-11.1,0l-10.653,10.652
|
||||
c-1.472,1.472-2.298,3.468-2.298,5.55v9.817c0,4.334,3.514,7.848,7.849,7.848h21.953c4.334,0,7.849-3.513,7.849-7.848v-9.171
|
||||
C115.875,231.636,115.048,229.64,113.576,228.168z" />
|
||||
<path style="fill:#1F84CE;" d="M143.169,177.943h-9.171c-2.081,0-4.077,0.826-5.549,2.298l-11.3,11.3
|
||||
c-3.064,3.064-3.064,8.034,0,11.1l10.653,10.653c1.472,1.471,3.468,2.298,5.55,2.298h9.818c4.334,0,7.848-3.513,7.848-7.848
|
||||
v-21.953C151.018,181.457,147.504,177.943,143.169,177.943z" />
|
||||
<circle style="fill:#1F84CE;" cx="414.952" cy="155.839" r="18.825" />
|
||||
</g>
|
||||
<circle style="fill:#F9C526;" cx="374.025" cy="196.766" r="18.825" />
|
||||
<circle style="fill:#54B8AC;" cx="414.952" cy="237.693" r="18.825" />
|
||||
<circle style="fill:#FFFFFF;" cx="455.879" cy="196.766" r="18.825" />
|
||||
<circle style="fill:#384148;" cx="189.252" cy="285.582" r="25.611" />
|
||||
<g>
|
||||
<path style="fill:#FFFFFF;" d="M226.267,190.234h-23.773c-4.57,0-8.276-3.705-8.276-8.276s3.705-8.276,8.276-8.276h23.773
|
||||
c4.57,0,8.276,3.705,8.276,8.276S230.838,190.234,226.267,190.234z" />
|
||||
<path style="fill:#FFFFFF;" d="M309.506,190.234h-23.773c-4.572,0-8.276-3.705-8.276-8.276s3.704-8.276,8.276-8.276h23.773
|
||||
c4.572,0,8.276,3.705,8.276,8.276S314.077,190.234,309.506,190.234z" />
|
||||
</g>
|
||||
</g>
|
||||
<!-- <g id="gamepad" transform="translate(640,640) scale(0.3)" style="display: none;" stroke="#333" stroke-width="0.5" fill="#444">
|
||||
<path d="M115.824,187.891c-2.95,2.95-4.576,6.872-4.576,11.045c0,4.172,1.625,8.095,4.575,11.045l10.322,10.322
|
||||
c2.95,2.949,6.872,4.573,11.042,4.573h9.511c8.612,0,15.619-7.007,15.619-15.619v-21.268c0-8.612-7.007-15.619-15.619-15.619
|
||||
h-8.884c-4.171,0-8.093,1.625-11.044,4.575L115.824,187.891z M137.986,188.403h8.298v20.438h-8.926l-9.905-9.906L137.986,188.403
|
||||
z" />
|
||||
<path d="M91.29,184.819c2.95,2.951,6.873,4.576,11.046,4.576c4.172,0,8.095-1.625,11.044-4.575l10.32-10.318
|
||||
c2.95-2.95,4.575-6.873,4.575-11.044v-9.511c0-8.613-7.007-15.62-15.62-15.62H91.388c-8.612,0-15.619,7.007-15.619,15.62v8.883
|
||||
c0,4.172,1.625,8.095,4.575,11.045L91.29,184.819z M91.802,154.358h0.001h20.438v8.926l-9.906,9.905l-10.533-10.533V154.358z" />
|
||||
<path d="M88.221,209.352c6.089-6.09,6.089-15.999,0-22.089c0-0.001,0-0.001-0.001-0.001L77.9,176.944
|
||||
c-2.95-2.951-6.873-4.576-11.045-4.576h-9.51c-8.613,0-15.62,7.008-15.62,15.62v21.266c0,8.613,7.007,15.62,15.62,15.62h8.883
|
||||
c4.172,0,8.094-1.625,11.045-4.575L88.221,209.352z M66.055,208.841h-8.297v-20.439h8.926l9.906,9.906L66.055,208.841z" />
|
||||
<path d="M112.753,212.424c-2.95-2.95-6.872-4.576-11.045-4.576c-4.172,0-8.095,1.625-11.044,4.575l-10.32,10.318
|
||||
c-2.95,2.95-4.575,6.873-4.575,11.045v9.51c0,8.612,7.007,15.619,15.62,15.619h21.266c8.614,0,15.62-7.007,15.62-15.619v-8.884
|
||||
c0-4.172-1.625-8.094-4.575-11.045L112.753,212.424z M112.241,242.884H91.802v-8.926l9.906-9.905l10.533,10.533V242.884z" />
|
||||
<path d="M449.624,172.369c-14.477,0-26.254,11.778-26.254,26.253c0,14.477,11.778,26.254,26.254,26.254
|
||||
c14.476,0,26.253-11.778,26.253-26.254C475.877,184.145,464.099,172.369,449.624,172.369z M449.624,208.841
|
||||
c-5.635,0-10.22-4.585-10.22-10.22s4.585-10.219,10.22-10.219c5.634,0,10.219,4.585,10.219,10.219
|
||||
S455.259,208.841,449.624,208.841z" />
|
||||
<path d="M409.979,212.012c-14.477,0-26.253,11.778-26.253,26.253c0,14.477,11.778,26.254,26.253,26.254
|
||||
s26.253-11.778,26.253-26.254C436.232,223.79,424.455,212.012,409.979,212.012z M409.979,248.485
|
||||
c-5.634,0-10.219-4.585-10.219-10.22s4.585-10.219,10.219-10.219c5.635,0,10.219,4.585,10.219,10.219
|
||||
S415.615,248.485,409.979,248.485z" />
|
||||
<path d="M511.349,342.391l-24.999-189.143c-1.947-14.73-8.829-28.605-19.38-39.069c-2.853-2.831-6.397-4.93-10.254-6.16v-4.988
|
||||
c0-10.401-8.462-18.862-18.862-18.862h-52.604c-10.401,0-18.862,8.461-18.862,18.862v4.631
|
||||
c-10.461,2.335-19.426,9.143-24.443,18.692H170.057c-5.018-9.55-13.983-16.358-24.443-18.692v-4.631
|
||||
c0-10.401-8.462-18.862-18.862-18.862H74.147c-10.401,0-18.862,8.461-18.862,18.862v4.988c-3.858,1.231-7.401,3.33-10.254,6.16
|
||||
c-10.55,10.464-17.433,24.339-19.38,39.069L0.652,342.391c-2.851,21.572,3.74,43.329,18.083,59.692
|
||||
c14.343,16.363,35.049,25.747,56.809,25.747c33.935,0,63.897-22.86,72.86-55.591l10.502-38.356
|
||||
c9.314,6.157,20.461,9.754,32.437,9.754c32.523,0,58.983-26.459,58.983-58.984c0-0.896-0.028-1.786-0.067-2.672h11.487
|
||||
c-0.04,0.886-0.067,1.777-0.067,2.672c0,32.523,26.46,58.984,58.984,58.984c11.976,0,23.123-3.598,32.437-9.755l10.502,38.356
|
||||
c8.963,32.731,38.923,55.591,72.859,55.591c21.76,0,42.466-9.385,56.809-25.747C507.608,385.721,514.199,363.964,511.349,342.391
|
||||
z M385.25,100.203h52.604c1.56,0,2.828,1.269,2.828,2.828v3.73h-58.26v-3.73h-0.001
|
||||
C382.422,101.471,383.69,100.203,385.25,100.203z M71.319,103.031c0-1.56,1.269-2.828,2.828-2.828h52.603
|
||||
c1.558,0,2.828,1.269,2.828,2.828v3.73h-58.26V103.031z M132.937,368.005c-7.06,25.784-30.661,43.792-57.394,43.792
|
||||
c-17.141,0-33.451-7.393-44.75-20.283c-11.299-12.89-16.49-30.029-14.245-47.021l25-189.144
|
||||
c1.484-11.23,6.731-21.808,14.775-29.786c1.773-1.759,4.317-2.769,6.979-2.769h74.293c8.778,0,16.557,5.518,19.472,13.769
|
||||
l6.095,26.855c5.027,22.148,6.454,44.778,4.258,67.342c-20.634,9.195-35.061,29.885-35.061,53.895
|
||||
c0,14.078,4.964,27.014,13.225,37.166L132.937,368.005z M191.342,327.606c-23.682,0-42.95-19.266-42.95-42.95
|
||||
s19.266-42.95,42.95-42.95c23.682,0,42.949,19.266,42.949,42.95S215.023,327.606,191.342,327.606z M247.267,265.95
|
||||
c-7.841-23.379-29.94-40.278-55.925-40.278c-2.527,0-5.012,0.177-7.457,0.489c1.561-22.23-0.135-44.477-5.086-66.29
|
||||
l-3.968-17.481h162.339l-3.967,17.481c-4.952,21.813-6.648,44.06-5.086,66.29c-2.445-0.31-4.93-0.489-7.457-0.489
|
||||
c-25.985,0-48.084,16.898-55.926,40.278H247.267z M320.66,327.606c-23.682,0-42.95-19.266-42.95-42.95s19.266-42.95,42.95-42.95
|
||||
c23.681,0,42.949,19.266,42.949,42.95S344.341,327.606,320.66,327.606z M481.209,391.514
|
||||
c-11.299,12.89-27.61,20.283-44.751,20.283c-26.732,0-50.334-18.008-57.394-43.791l-12.646-46.183
|
||||
c8.261-10.152,13.225-23.088,13.225-37.166c0-24.009-14.427-44.7-35.061-53.895c-2.197-22.564-0.769-45.195,4.258-67.342
|
||||
l6.095-26.855c2.914-8.251,10.693-13.769,19.471-13.769h74.294c2.662,0,5.206,1.009,6.98,2.769
|
||||
c8.043,7.977,13.29,18.556,14.774,29.786l24.999,189.142C497.699,361.486,492.506,378.625,481.209,391.514z" />
|
||||
<path d="M191.342,251.823c-18.105,0-32.832,14.729-32.832,32.833s14.729,32.833,32.832,32.833
|
||||
c18.105,0,32.832-14.729,32.832-32.833C224.175,266.551,209.446,251.823,191.342,251.823z M191.342,301.455
|
||||
c-9.263,0-16.798-7.536-16.798-16.799s7.536-16.799,16.798-16.799c9.263,0,16.798,7.536,16.798,16.799
|
||||
S200.605,301.455,191.342,301.455z" />
|
||||
<path d="M396.588,198.622c0-14.476-11.778-26.253-26.253-26.253c-14.477,0-26.253,11.778-26.253,26.253
|
||||
c0,14.477,11.778,26.254,26.253,26.254C384.81,224.875,396.588,213.098,396.588,198.622z M370.334,208.841
|
||||
c-5.634,0-10.219-4.585-10.219-10.22s4.585-10.219,10.219-10.219c5.635,0,10.219,4.585,10.219,10.219
|
||||
S375.97,208.841,370.334,208.841z" />
|
||||
<path d="M227.198,176.258h-23.028c-4.427,0-8.017,3.589-8.017,8.017c0,4.427,3.589,8.017,8.017,8.017h23.028
|
||||
c4.427,0,8.017-3.59,8.017-8.017C235.215,179.848,231.625,176.258,227.198,176.258z" />
|
||||
<path d="M284.804,192.293h23.029c4.427,0,8.017-3.59,8.017-8.017c0-4.428-3.59-8.017-8.017-8.017h-23.029
|
||||
c-4.429,0-8.017,3.589-8.017,8.017C276.787,188.703,280.375,192.293,284.804,192.293z" />
|
||||
<path d="M320.66,251.823c-18.105,0-32.833,14.729-32.833,32.833s14.729,32.833,32.833,32.833
|
||||
c18.104,0,32.832-14.729,32.832-32.833C353.492,266.551,338.763,251.823,320.66,251.823z M320.66,301.455
|
||||
c-9.263,0-16.799-7.536-16.799-16.799s7.536-16.799,16.799-16.799c9.262,0,16.798,7.536,16.798,16.799
|
||||
S329.922,301.455,320.66,301.455z" />
|
||||
<path d="M409.979,185.23c14.476,0,26.253-11.778,26.253-26.254c0-14.476-11.778-26.253-26.253-26.253
|
||||
c-14.477,0-26.253,11.778-26.253,26.253C383.726,173.454,395.503,185.23,409.979,185.23z M409.979,148.758
|
||||
c5.635,0,10.219,4.585,10.219,10.219s-4.584,10.22-10.219,10.22c-5.634,0-10.219-4.585-10.219-10.22
|
||||
C399.76,153.343,404.345,148.758,409.979,148.758z" />
|
||||
</g> -->
|
||||
|
||||
<!-- <g id="gamepad" transform="translate(640,640) scale(2)" style="display: none;">
|
||||
<path d="M44.3,49.8v-3.7c0-0.3-0.1-0.5-0.3-0.7s-0.4-0.3-0.7-0.3h-5.5v-5.5c0-0.3-0.1-0.5-0.3-0.7
|
||||
s-0.4-0.3-0.7-0.3h-3.7c-0.3,0-0.5,0.1-0.7,0.3s-0.3,0.4-0.3,0.7v5.5h-5.5c-0.3,0-0.5,0.1-0.7,0.3S26,45.9,26,46.2v3.7
|
||||
c0,0.3,0.1,0.5,0.3,0.7s0.4,0.3,0.7,0.3h5.5v5.5c0,0.3,0.1,0.5,0.3,0.7s0.4,0.3,0.7,0.3H37c0.3,0,0.5-0.1,0.7-0.3s0.3-0.4,0.3-0.7
|
||||
v-5.5h5.5c0.3,0,0.5-0.1,0.7-0.3S44.3,50.1,44.3,49.8z M60.8,51.7c0-1-0.4-1.9-1.1-2.6C59,48.4,58.2,48,57.2,48s-1.9,0.4-2.6,1.1
|
||||
s-1.1,1.6-1.1,2.6s0.4,1.9,1.1,2.6c0.7,0.7,1.6,1.1,2.6,1.1s1.9-0.4,2.6-1.1C60.5,53.5,60.8,52.7,60.8,51.7z M68.2,44.3
|
||||
c0-1-0.4-1.9-1.1-2.6c-0.7-0.7-1.6-1.1-2.6-1.1s-1.9,0.4-2.6,1.1c-0.7,0.7-1.1,1.6-1.1,2.6s0.4,1.9,1.1,2.6
|
||||
c0.7,0.7,1.6,1.1,2.6,1.1s1.9-0.4,2.6-1.1C67.8,46.2,68.2,45.3,68.2,44.3z M75.5,48c0,4-1.4,7.5-4.3,10.4
|
||||
c-2.9,2.9-6.3,4.3-10.4,4.3c-3.7,0-6.9-1.2-9.7-3.7h-6.3c-2.8,2.4-6,3.7-9.7,3.7c-4,0-7.5-1.4-10.4-4.3c-2.9-2.9-4.3-6.3-4.3-10.4
|
||||
s1.4-7.5,4.3-10.4c2.9-2.9,6.3-4.3,10.4-4.3h25.7c4,0,7.5,1.4,10.4,4.3C74.1,40.5,75.5,44,75.5,48z" fill="#888" stroke="#222" />
|
||||
</g> -->
|
||||
</svg>
|
||||
|
||||
<script src='lib/matter.min.js'></script>
|
||||
<script src='lib/decomp.min.js'></script>
|
||||
<script src='lib/randomColor.min.js'></script>
|
||||
<script src="js/game.js"></script>
|
||||
<script src="js/player.js"></script>
|
||||
<script src="js/powerups.js"></script>
|
||||
<script src="js/bullets.js"></script>
|
||||
<script src="js/mobs.js"></script>
|
||||
<script src="js/spawn.js"></script>
|
||||
<script src="js/level.js"></script>
|
||||
<script src="js/engine.js"></script>
|
||||
<script src="js/index.js"></script>
|
||||
</body>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-113454647-1"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
|
||||
function gtag() {
|
||||
dataLayer.push(arguments);
|
||||
}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'UA-113454647-1');
|
||||
</script>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="description" content="Browser-based side scrolling video game with the matter.js physics engine.">
|
||||
<meta name="author" content="Ross Landgreen">
|
||||
<meta property="og:description" content="Browser-based side scrolling video game with the matter.js physics engine.">
|
||||
<meta property="og:title" content="n-gon">
|
||||
<meta name="twitter:title" content="n-gon">
|
||||
<meta name="twitter:description" content="Browser-based side scrolling video game with the matter.js physics engine.">
|
||||
|
||||
<title>n-gon</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel='shortcut icon' href='favicon.ico' type='image/x-icon' />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- <body oncontextmenu="return false"> -->
|
||||
<div id='guns'></div>
|
||||
<div id='field'></div>
|
||||
<div id='mods'></div>
|
||||
<div id="text-log"></div>
|
||||
<div id="fade-out"></div>
|
||||
<div id="health-bg"></div>
|
||||
<div id="health"></div>
|
||||
<div id="dmg"></div>
|
||||
|
||||
<!-- guns -->
|
||||
<!-- <audio id="snare2" src="sounds\guns\snare2.ogg" preload="auto"></audio>
|
||||
<audio id="airgun" src="sounds\guns\airgun.ogg" preload="auto"></audio>
|
||||
<audio id="basssnaredrum" src="sounds\guns\basssnaredrum.ogg" preload="auto"></audio>
|
||||
<audio id="sniper" src="sounds\guns\sniper.ogg" preload="auto"></audio>
|
||||
<audio id="glock" src="sounds\guns\glock.ogg" preload="auto"></audio>
|
||||
<audio id="launcher" src="sounds\guns\launcher2.ogg" preload="auto"></audio> -->
|
||||
|
||||
<!-- player walk -->
|
||||
<!-- <audio id="walk1" src="sounds\mech\walk1.ogg" preload="auto"></audio>
|
||||
<audio id="walk2" src="sounds\mech\walk2.ogg" preload="auto"></audio>
|
||||
<audio id="walk3" src="sounds\mech\walk3.ogg" preload="auto"></audio>
|
||||
<audio id="walk4" src="sounds\mech\walk4.ogg" preload="auto"></audio>
|
||||
<audio id="walk5" src="sounds\mech\walk5.ogg" preload="auto"></audio>
|
||||
<audio id="walk6" src="sounds\mech\walk6.ogg" preload="auto"></audio>
|
||||
<audio id="walk7" src="sounds\mech\walk7.ogg" preload="auto"></audio>
|
||||
<audio id="walk8" src="sounds\mech\walk8.ogg" preload="auto"></audio>
|
||||
<audio id="walk9" src="sounds\mech\walk9.ogg" preload="auto"></audio>
|
||||
<audio id="walk10" src="sounds\mech\walk10.ogg" preload="auto"></audio> -->
|
||||
|
||||
<!-- player dmg -->
|
||||
<!-- <audio id="dmg0" src="sounds\dmg\dmg0.ogg" preload="auto"></audio>
|
||||
<audio id="dmg1" src="sounds\dmg\dmg1.ogg" preload="auto"></audio>
|
||||
<audio id="dmg2" src="sounds\dmg\dmg2.ogg" preload="auto"></audio>
|
||||
<audio id="dmg3" src="sounds\dmg\dmg3.ogg" preload="auto"></audio> -->
|
||||
|
||||
<!-- other -->
|
||||
<!-- <audio id="boom" src="sounds\boom.ogg" preload="auto"></audio>
|
||||
<audio id="powerup" src="sounds\powerup4.ogg" preload="auto"></audio>
|
||||
<audio id="no" src="sounds\no.ogg" preload="auto"></audio>
|
||||
<audio id="click" src="sounds\click.ogg" preload="auto"></audio>
|
||||
<audio id="ammo" src="sounds\ammo.ogg" preload="auto"></audio> -->
|
||||
|
||||
<canvas id="canvas"></canvas>
|
||||
<!-- ********** intro page ***********************************************
|
||||
******************************************************************************* -->
|
||||
|
||||
<!-- <div id="build-details">
|
||||
<div class="build-grid-module"></div>
|
||||
<details>
|
||||
<summary>build</summary>
|
||||
<div id="details-div">
|
||||
|
||||
</div>
|
||||
</details>
|
||||
</div> -->
|
||||
<div id="build-grid"></div>
|
||||
<!-- <button type="button" id="build-button">challenge run</button> -->
|
||||
<svg class="SVG-button" id="build-button" width="110" height="40">
|
||||
<g stroke='none' fill='#333' stroke-width="2" font-size="28px" font-family="Arial, sans-serif">
|
||||
<text x="10" y="30">custom</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
||||
<div id="settings">
|
||||
<details>
|
||||
<summary>settings</summary>
|
||||
<div style="line-height: 150%;" id="details-div">
|
||||
<label for="difficulty-select" title="effects: number of mobs, damage done by mobs, damage done to mobs, mob speed">combat difficulty:</label>
|
||||
<select name="difficulty-select" id="difficulty-select">
|
||||
<option value="easy">easy</option>
|
||||
<option value="0" selected>normal</option>
|
||||
<option value="4">hard</option>
|
||||
<option value="8">why...</option>
|
||||
</select>
|
||||
<br>
|
||||
<label for="body-damage" title="allow damage from heavy, fast moving blocks">collision damage from blocks:</label>
|
||||
<input type="checkbox" id="body-damage" name="body-damage" checked style="width:16px; height:16px;">
|
||||
<br>
|
||||
<label for="fps-select" title="use this to slow the game down">frames per second cap:</label>
|
||||
<select name="fps-select" id="fps-select">
|
||||
<option value="max">no fps cap</option>
|
||||
<option value="72" selected>72 fps cap</option>
|
||||
<option value="60">60 fps cap</option>
|
||||
<option value="45">45 fps cap</option>
|
||||
<option value="30">30 fps cap</option>
|
||||
</select>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="controls">
|
||||
<details>
|
||||
<summary>about</summary>
|
||||
<div id="details-div">
|
||||
<table>
|
||||
<tr>
|
||||
<th>FIRE</th>
|
||||
<td>left mouse</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>FIELD</th>
|
||||
<td>right mouse / spacebar</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>MOVE</th>
|
||||
<td>WASD / arrows</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>GUNS</th>
|
||||
<td>Q / E / mouse wheel</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>ZOOM</th>
|
||||
<td>+ / -</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>PAUSE</th>
|
||||
<td>P</td>
|
||||
</tr>
|
||||
<!-- <tr>
|
||||
<td>FULL SCREEN</td>
|
||||
<td>enter</td>
|
||||
</tr> -->
|
||||
</table>
|
||||
<br>
|
||||
<br>
|
||||
<a href="https://discord.gg/2eC9pgJ">
|
||||
<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1400 235">
|
||||
<style>
|
||||
.st0 {
|
||||
fill: #1B1F23;
|
||||
}
|
||||
</style>
|
||||
<path class="st0" d="M142.8 120.1c-5.7 0-10.2 4.9-10.2 11s4.6 11 10.2 11c5.7 0 10.2-4.9 10.2-11s-4.6-11-10.2-11zM106.3 120.1c-5.7 0-10.2 4.9-10.2 11s4.6 11 10.2 11c5.7 0 10.2-4.9 10.2-11 .1-6.1-4.5-11-10.2-11z" />
|
||||
<path class="st0" d="M191.4 36.9h-134c-11.3 0-20.5 9.2-20.5 20.5v134c0 11.3 9.2 20.5 20.5 20.5h113.4l-5.3-18.3 12.8 11.8 12.1 11.1 21.6 18.7V57.4c-.1-11.3-9.3-20.5-20.6-20.5zm-38.6 129.5s-3.6-4.3-6.6-8c13.1-3.7 18.1-11.8 18.1-11.8-4.1 2.7-8 4.6-11.5 5.9-5 2.1-9.8 3.4-14.5 4.3-9.6 1.8-18.4 1.3-25.9-.1-5.7-1.1-10.6-2.6-14.7-4.3-2.3-.9-4.8-2-7.3-3.4-.3-.2-.6-.3-.9-.5-.2-.1-.3-.2-.4-.2-1.8-1-2.8-1.7-2.8-1.7s4.8 7.9 17.5 11.7c-3 3.8-6.7 8.2-6.7 8.2-22.1-.7-30.5-15.1-30.5-15.1 0-31.9 14.4-57.8 14.4-57.8 14.4-10.7 28-10.4 28-10.4l1 1.2c-18 5.1-26.2 13-26.2 13s2.2-1.2 5.9-2.8c10.7-4.7 19.2-5.9 22.7-6.3.6-.1 1.1-.2 1.7-.2 6.1-.8 13-1 20.2-.2 9.5 1.1 19.7 3.9 30.1 9.5 0 0-7.9-7.5-24.9-12.6l1.4-1.6s13.7-.3 28 10.4c0 0 14.4 25.9 14.4 57.8 0-.1-8.4 14.3-30.5 15zM303.8 79.7h-33.2V117l22.1 19.9v-36.2h11.8c7.5 0 11.2 3.6 11.2 9.4v27.7c0 5.8-3.5 9.7-11.2 9.7h-34v21.1h33.2c17.8.1 34.5-8.8 34.5-29.2v-29.8c.1-20.8-16.6-29.9-34.4-29.9zm174 59.7v-30.6c0-11 19.8-13.5 25.8-2.5l18.3-7.4c-7.2-15.8-20.3-20.4-31.2-20.4-17.8 0-35.4 10.3-35.4 30.3v30.6c0 20.2 17.6 30.3 35 30.3 11.2 0 24.6-5.5 32-19.9l-19.6-9c-4.8 12.3-24.9 9.3-24.9-1.4zM417.3 113c-6.9-1.5-11.5-4-11.8-8.3.4-10.3 16.3-10.7 25.6-.8l14.7-11.3c-9.2-11.2-19.6-14.2-30.3-14.2-16.3 0-32.1 9.2-32.1 26.6 0 16.9 13 26 27.3 28.2 7.3 1 15.4 3.9 15.2 8.9-.6 9.5-20.2 9-29.1-1.8l-14.2 13.3c8.3 10.7 19.6 16.1 30.2 16.1 16.3 0 34.4-9.4 35.1-26.6 1-21.7-14.8-27.2-30.6-30.1zm-67 55.5h22.4V79.7h-22.4v88.8zM728 79.7h-33.2V117l22.1 19.9v-36.2h11.8c7.5 0 11.2 3.6 11.2 9.4v27.7c0 5.8-3.5 9.7-11.2 9.7h-34v21.1H728c17.8.1 34.5-8.8 34.5-29.2v-29.8c0-20.8-16.7-29.9-34.5-29.9zm-162.9-1.2c-18.4 0-36.7 10-36.7 30.5v30.3c0 20.3 18.4 30.5 36.9 30.5 18.4 0 36.7-10.2 36.7-30.5V109c0-20.4-18.5-30.5-36.9-30.5zm14.4 60.8c0 6.4-7.2 9.7-14.3 9.7-7.2 0-14.4-3.1-14.4-9.7V109c0-6.5 7-10 14-10 7.3 0 14.7 3.1 14.7 10v30.3zM682.4 109c-.5-20.8-14.7-29.2-33-29.2h-35.5v88.8h22.7v-28.2h4l20.6 28.2h28L665 138.1c10.7-3.4 17.4-12.7 17.4-29.1zm-32.6 12h-13.2v-20.3h13.2c14.1 0 14.1 20.3 0 20.3z" />
|
||||
</svg>
|
||||
</a>
|
||||
Chat about n-gon in the <a href="https://discord.gg/2eC9pgJ">discord</a>.<br> Let me know about ideas, or bugs.
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<a href="https://github.com/landgreen/n-gon">
|
||||
<svg viewBox="0 0 100 16" xmlns="http://www.w3.org/2000/svg" fill="#1B1F23">
|
||||
<path d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z" />
|
||||
<g stroke='none' font-size="8px" font-family="Arial Black, sans-serif">
|
||||
<text x="19" y="11">Github</text>
|
||||
</g>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="https://github.com/landgreen/n-gon">Github</a> hosts the source code for n-gon.<br> It's written in JavaScript, CSS, and HTML.
|
||||
<!-- <br>
|
||||
<br>
|
||||
n-gon is also hosted at <a href="https://lilgreenland.itch.io/n-gon">itch.io</a>.
|
||||
<br>
|
||||
<br> -->
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.fade-in {
|
||||
opacity: 0;
|
||||
animation: 4s ease 3s normal forwards 1 fadein;
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes dash {
|
||||
to {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.draw-lines {
|
||||
stroke-dasharray: 20;
|
||||
stroke-dashoffset: 20;
|
||||
animation: dash 4.8s ease-in forwards;
|
||||
}
|
||||
|
||||
.draw-lines-box-1 {
|
||||
stroke-dasharray: 1000;
|
||||
stroke-dashoffset: 1000;
|
||||
animation: dash 10s ease-in forwards;
|
||||
animation-delay: 0s;
|
||||
}
|
||||
|
||||
.draw-lines-box-2 {
|
||||
stroke-dasharray: 1000;
|
||||
stroke-dashoffset: 1000;
|
||||
animation: dash 5.2s ease-in forwards;
|
||||
animation-delay: 2s;
|
||||
}
|
||||
|
||||
.draw-lines-box-3 {
|
||||
stroke-dasharray: 1000;
|
||||
stroke-dashoffset: 1000;
|
||||
animation: dash 2.3s ease-in forwards;
|
||||
animation-delay: 3.1s;
|
||||
}
|
||||
|
||||
.draw-lines3 {
|
||||
stroke-dasharray: 3000;
|
||||
stroke-dashoffset: 3000;
|
||||
animation: dash 6.2s ease-in forwards;
|
||||
}
|
||||
|
||||
.draw-lines4 {
|
||||
stroke-dasharray: 300;
|
||||
stroke-dashoffset: 300;
|
||||
animation: dash 5s ease-in forwards;
|
||||
}
|
||||
</style>
|
||||
<svg id='splash' class="intro" viewBox="0 0 800 800" onclick="game.startGame()">
|
||||
<!-- title -->
|
||||
<!-- <g class="fade-in" transform="translate(100,210) scale(34)" fill='#bbb' stroke='none'>
|
||||
<path d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" fill="rgb(50,200,255)" />
|
||||
<rect x="4" y="1.25" width="1" height="0.5" rx='0.03' />
|
||||
<path transform="translate(6.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v2.3 l-0.2 0.2 h-1.8 v-0.5 h1.4 L 1.1 2.4 h-1.1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z"
|
||||
fill='rgb(255,70,140)' />
|
||||
<path transform="translate(10.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v1 l -0.7 0.7 h-1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z"
|
||||
fill="none" />
|
||||
<path transform="translate(14,0)" d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" fill='rgb(10,220,190)'
|
||||
/>
|
||||
</g> -->
|
||||
<g class="fade-in" transform="translate(100,210) scale(34)" fill='#bbb' stroke='none'>
|
||||
<path d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" />
|
||||
<rect x="4" y="1.25" width="1" height="0.5" rx='0.03' />
|
||||
<path transform="translate(6.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v2.3 l-0.2 0.2 h-1.8 v-0.5 h1.4 L 1.1 2.4 h-1.1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" />
|
||||
<path transform="translate(10.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v1 l -0.7 0.7 h-1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" />
|
||||
<path transform="translate(14,0)" d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" />
|
||||
</g>
|
||||
<g class="draw-lines" transform="translate(100,210) scale(34)" fill='none' stroke='#222' stroke-linejoin="round" stroke-linecap="round">
|
||||
<path d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" stroke-width='0.0875' />
|
||||
<rect x="4" y="1.25" width="1" height="0.5" stroke-width='0.0875' rx='0.03' />
|
||||
<path transform="translate(6.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v2.3 l-0.2 0.2 h-1.8 v-0.5 h1.4 L 1.1 2.4 h-1.1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" stroke-width='0.07' />
|
||||
<path transform="translate(10.9,0) scale(1.25)" d="M0 0 h1 l 0.7 0.7 v1 l -0.7 0.7 h-1 l -0.7 -0.7 v-1 l 0.7 -0.7 Z" stroke-width='0.07' />
|
||||
<path transform="translate(14,0)" d="M0 0 h1 v0.2 h1.7 l0.3 0.3 v2.6 h-1 v-1.7 h-1 v1.7 h-1 z" stroke-width='0.0875' />
|
||||
</g>
|
||||
<!-- mouse -->
|
||||
<g class="draw-lines3" transform="translate(290,430) scale(0.28)" stroke-linecap="round" stroke-linejoin="round" stroke-width="10px" stroke="#222" fill="none">
|
||||
<path class="fade-in" d="M832.41,106.64 V323.55 H651.57 V256.64 c0-82.5,67.5-150,150-150 Z" fill="rgb(0, 200, 255)" stroke="none" />
|
||||
<!-- <path class="fade-in" d="M832.41,106.64 V323.55 H651.57 V256.64 c0-82.5,67.5-150,150-150 Z" fill="#789" stroke="none" />
|
||||
<path class="fade-in" d="M827,112 h30 a140,140,0,0,1,140,140 v68 h-167 z" fill="#7ce" stroke="none" /> -->
|
||||
<path d="M827,112 h30 a140,140,0,0,1,140,140 v268 a140,140,0,0,1-140,140 h-60 a140,140,0,0,1-140-140v-268 a140,140,0,0,1,140-140h60" />
|
||||
<path d="M657 317 h 340 h-170 v-207 s 21 -59, -5 -59 S 807 7, 807 7" />
|
||||
<ellipse fill="#fff" cx="827.57" cy="218.64" rx="29" ry="68" />
|
||||
</g>
|
||||
<!-- keys -->
|
||||
<g transform="translate(195,480) scale(0.8)">
|
||||
<g fill='none' stroke='#222' stroke-width="3.5" stroke-linejoin="round">
|
||||
<path d="M0 60 h60 v-60 h-60 v60" class="draw-lines-box-1" />
|
||||
<path d="M70 60 h60 v-60 h-60 v60" class="draw-lines-box-2" />
|
||||
<path d="M140 60 h60 v-60 h-60 v60" class="draw-lines-box-3" />
|
||||
<path d="M0 70 h60 v60 h-60 v-60" class="draw-lines-box-1" />
|
||||
<path d="M70 70 h60 v60 h-60 v-60" class="draw-lines-box-2" />
|
||||
<path d="M140 70 h60 v60 h-60 v-60" class="draw-lines-box-3" />
|
||||
<!-- <rect x="0" y="0" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="140" y="0" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="0" y="70" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="70" y="0" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="70" y="70" width="60" height="60" rx='3' /> -->
|
||||
<!-- <rect x="140" y="70" width="60" height="60" rx='3' /> -->
|
||||
</g>
|
||||
<g class="draw-lines4" text-anchor="middle" stroke='#000' fill='none' stroke-width="2" font-size="38px" font-family="Arial Black, sans-serif">
|
||||
<!-- <text class="fade-in" fill='#aaa' stroke="none" x="30" y="45">Q</text>
|
||||
<text class="fade-in" fill='#aaa' stroke="none" x="170" y="45">E</text> -->
|
||||
<text x="30" y="45" stroke-width="2">Q</text>
|
||||
<text x="170" y="45" stroke-width="2">E</text>
|
||||
<text x="100" y="45">W</text>
|
||||
<text x="100" y="113">S</text>
|
||||
<text x="170" y="113">D</text>
|
||||
<text x="30" y="113">A</text>
|
||||
<!-- <text class="fade-in" fill='#999' x="100" y="45">W</text>
|
||||
<text class="fade-in" fill='#999' x="100" y="113">S</text>
|
||||
<text class="fade-in" fill='#999' x="170" y="113">D</text>
|
||||
<text class="fade-in" fill='#999' x="30" y="113">A</text> -->
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g class="fade-in" fill="none" stroke="#aaa" stroke-width="1">
|
||||
<path d="M 254 433.5 h-35.5 v40" />
|
||||
<path d="M 295 433.5 h36.5 v40" />
|
||||
|
||||
<path d="M 274 625 v-35" />
|
||||
<path d="M 430.5 442 v50 h38" />
|
||||
<path d="M 612.5 442 v50 h-38" />
|
||||
</g>
|
||||
<g class="fade-in" stroke="none" fill="#aaa" font-size="16px">
|
||||
<text x="253" y="422">switch</text>
|
||||
<text x="257" y="438">guns</text>
|
||||
<text x="255" y="638">move</text>
|
||||
<text x="420" y="438">fire</text>
|
||||
<text x="599" y="438">field</text>
|
||||
</g>
|
||||
<g id="gamepad" transform="translate(700,700) scale(0.2)" style="display: none;" stroke="#333" stroke-width="0.5" fill="#444">
|
||||
<path style="fill:#FB7686;" d="M122.578,86.897H68.276c-6.184,0-11.196,5.013-11.196,11.196v12.126h76.692V98.091
|
||||
C133.772,91.908,128.76,86.897,122.578,86.897z" />
|
||||
<rect x="57.08" y="100.766" style="opacity:0.4;fill:#FF4E64;enable-background:new ;" width="76.69" height="9.453" />
|
||||
<path style="fill:#FB7686;" d="M389.422,86.897h54.303c6.182,0,11.194,5.013,11.194,11.196v12.126h-76.693V98.091
|
||||
C378.228,91.908,383.241,86.897,389.422,86.897z" />
|
||||
<rect x="378.229" y="100.766" style="opacity:0.4;fill:#FF4E64;enable-background:new ;" width="76.69" height="9.453" />
|
||||
<rect x="101.947" y="130.449" style="fill:#89BBE4;" width="308.094" height="144.099" />
|
||||
<path style="opacity:0.1;fill:#145587;enable-background:new ;" d="M336.726,130.443l-6.391,28.154
|
||||
c-6.438,28.363-7.324,57.602-2.745,86.134H184.41c4.577-28.531,3.692-57.77-2.746-86.134l-6.39-28.154h-73.323v144.103h308.097
|
||||
V130.443H336.726z" />
|
||||
<g>
|
||||
<path style="fill:#89BBE4;" d="M168.235,158.598l-6.39-28.154c-4.031-12.081-15.338-20.226-28.073-20.226H57.08
|
||||
c-4.862,0-9.582,1.835-13.034,5.259c-9.65,9.571-15.848,22.071-17.629,35.539L0.612,346.264
|
||||
c-5.519,41.762,26.979,78.838,69.103,78.838c31.406,0,58.935-21.004,67.23-51.296l27.18-99.262l0,0
|
||||
C175.524,236.906,176.94,196.95,168.235,158.598z" />
|
||||
<path style="fill:#89BBE4;" d="M511.387,346.264l-25.806-195.25c-1.78-13.468-7.978-25.967-17.629-35.539
|
||||
c-3.452-3.424-8.172-5.259-13.034-5.259h-76.693c-12.734,0-24.041,8.146-28.072,20.226l-6.39,28.154
|
||||
c-8.706,38.353-7.288,78.308,4.109,115.948l0,0l27.18,99.262c8.296,30.292,35.823,51.296,67.23,51.296
|
||||
C484.408,425.102,516.908,388.026,511.387,346.264z" />
|
||||
</g>
|
||||
<circle style="fill:#ACDFEA;" cx="189.252" cy="285.582" r="52.611" />
|
||||
<circle style="opacity:0.3;fill:#145587;enable-background:new ;" cx="183.371" cy="293.273" r="25.611" />
|
||||
<circle style="fill:#ACDFEA;" cx="322.747" cy="285.582" r="52.611" />
|
||||
<circle style="opacity:0.3;fill:#145587;enable-background:new ;" cx="316.866" cy="293.273" r="25.611" />
|
||||
<circle style="fill:#384148;" cx="322.747" cy="285.582" r="25.611" />
|
||||
<g>
|
||||
<path style="fill:#1F84CE;" d="M108.027,142.799H86.073c-4.334,0-7.848,3.514-7.848,7.849v9.17c0,2.082,0.826,4.077,2.298,5.549
|
||||
l11.3,11.3c3.064,3.065,8.034,3.065,11.1,0l10.653-10.652c1.471-1.472,2.298-3.469,2.298-5.549v-9.818
|
||||
C115.875,146.314,112.361,142.799,108.027,142.799z" />
|
||||
<path style="fill:#1F84CE;" d="M76.951,190.893l-10.653-10.652c-1.472-1.472-3.468-2.3-5.549-2.3h-9.818
|
||||
c-4.334,0-7.849,3.514-7.849,7.849v21.953c0,4.335,3.514,7.849,7.849,7.849h9.17c2.082,0,4.077-0.828,5.549-2.3l11.302-11.3
|
||||
C80.016,198.929,80.016,193.96,76.951,190.893z" />
|
||||
<path style="fill:#1F84CE;" d="M113.576,228.168l-11.3-11.3c-3.065-3.065-8.034-3.065-11.1,0l-10.653,10.652
|
||||
c-1.472,1.472-2.298,3.468-2.298,5.55v9.817c0,4.334,3.514,7.848,7.849,7.848h21.953c4.334,0,7.849-3.513,7.849-7.848v-9.171
|
||||
C115.875,231.636,115.048,229.64,113.576,228.168z" />
|
||||
<path style="fill:#1F84CE;" d="M143.169,177.943h-9.171c-2.081,0-4.077,0.826-5.549,2.298l-11.3,11.3
|
||||
c-3.064,3.064-3.064,8.034,0,11.1l10.653,10.653c1.472,1.471,3.468,2.298,5.55,2.298h9.818c4.334,0,7.848-3.513,7.848-7.848
|
||||
v-21.953C151.018,181.457,147.504,177.943,143.169,177.943z" />
|
||||
<circle style="fill:#1F84CE;" cx="414.952" cy="155.839" r="18.825" />
|
||||
</g>
|
||||
<circle style="fill:#F9C526;" cx="374.025" cy="196.766" r="18.825" />
|
||||
<circle style="fill:#54B8AC;" cx="414.952" cy="237.693" r="18.825" />
|
||||
<circle style="fill:#FFFFFF;" cx="455.879" cy="196.766" r="18.825" />
|
||||
<circle style="fill:#384148;" cx="189.252" cy="285.582" r="25.611" />
|
||||
<g>
|
||||
<path style="fill:#FFFFFF;" d="M226.267,190.234h-23.773c-4.57,0-8.276-3.705-8.276-8.276s3.705-8.276,8.276-8.276h23.773
|
||||
c4.57,0,8.276,3.705,8.276,8.276S230.838,190.234,226.267,190.234z" />
|
||||
<path style="fill:#FFFFFF;" d="M309.506,190.234h-23.773c-4.572,0-8.276-3.705-8.276-8.276s3.704-8.276,8.276-8.276h23.773
|
||||
c4.572,0,8.276,3.705,8.276,8.276S314.077,190.234,309.506,190.234z" />
|
||||
</g>
|
||||
</g>
|
||||
<!-- <g id="gamepad" transform="translate(640,640) scale(0.3)" style="display: none;" stroke="#333" stroke-width="0.5" fill="#444">
|
||||
<path d="M115.824,187.891c-2.95,2.95-4.576,6.872-4.576,11.045c0,4.172,1.625,8.095,4.575,11.045l10.322,10.322
|
||||
c2.95,2.949,6.872,4.573,11.042,4.573h9.511c8.612,0,15.619-7.007,15.619-15.619v-21.268c0-8.612-7.007-15.619-15.619-15.619
|
||||
h-8.884c-4.171,0-8.093,1.625-11.044,4.575L115.824,187.891z M137.986,188.403h8.298v20.438h-8.926l-9.905-9.906L137.986,188.403
|
||||
z" />
|
||||
<path d="M91.29,184.819c2.95,2.951,6.873,4.576,11.046,4.576c4.172,0,8.095-1.625,11.044-4.575l10.32-10.318
|
||||
c2.95-2.95,4.575-6.873,4.575-11.044v-9.511c0-8.613-7.007-15.62-15.62-15.62H91.388c-8.612,0-15.619,7.007-15.619,15.62v8.883
|
||||
c0,4.172,1.625,8.095,4.575,11.045L91.29,184.819z M91.802,154.358h0.001h20.438v8.926l-9.906,9.905l-10.533-10.533V154.358z" />
|
||||
<path d="M88.221,209.352c6.089-6.09,6.089-15.999,0-22.089c0-0.001,0-0.001-0.001-0.001L77.9,176.944
|
||||
c-2.95-2.951-6.873-4.576-11.045-4.576h-9.51c-8.613,0-15.62,7.008-15.62,15.62v21.266c0,8.613,7.007,15.62,15.62,15.62h8.883
|
||||
c4.172,0,8.094-1.625,11.045-4.575L88.221,209.352z M66.055,208.841h-8.297v-20.439h8.926l9.906,9.906L66.055,208.841z" />
|
||||
<path d="M112.753,212.424c-2.95-2.95-6.872-4.576-11.045-4.576c-4.172,0-8.095,1.625-11.044,4.575l-10.32,10.318
|
||||
c-2.95,2.95-4.575,6.873-4.575,11.045v9.51c0,8.612,7.007,15.619,15.62,15.619h21.266c8.614,0,15.62-7.007,15.62-15.619v-8.884
|
||||
c0-4.172-1.625-8.094-4.575-11.045L112.753,212.424z M112.241,242.884H91.802v-8.926l9.906-9.905l10.533,10.533V242.884z" />
|
||||
<path d="M449.624,172.369c-14.477,0-26.254,11.778-26.254,26.253c0,14.477,11.778,26.254,26.254,26.254
|
||||
c14.476,0,26.253-11.778,26.253-26.254C475.877,184.145,464.099,172.369,449.624,172.369z M449.624,208.841
|
||||
c-5.635,0-10.22-4.585-10.22-10.22s4.585-10.219,10.22-10.219c5.634,0,10.219,4.585,10.219,10.219
|
||||
S455.259,208.841,449.624,208.841z" />
|
||||
<path d="M409.979,212.012c-14.477,0-26.253,11.778-26.253,26.253c0,14.477,11.778,26.254,26.253,26.254
|
||||
s26.253-11.778,26.253-26.254C436.232,223.79,424.455,212.012,409.979,212.012z M409.979,248.485
|
||||
c-5.634,0-10.219-4.585-10.219-10.22s4.585-10.219,10.219-10.219c5.635,0,10.219,4.585,10.219,10.219
|
||||
S415.615,248.485,409.979,248.485z" />
|
||||
<path d="M511.349,342.391l-24.999-189.143c-1.947-14.73-8.829-28.605-19.38-39.069c-2.853-2.831-6.397-4.93-10.254-6.16v-4.988
|
||||
c0-10.401-8.462-18.862-18.862-18.862h-52.604c-10.401,0-18.862,8.461-18.862,18.862v4.631
|
||||
c-10.461,2.335-19.426,9.143-24.443,18.692H170.057c-5.018-9.55-13.983-16.358-24.443-18.692v-4.631
|
||||
c0-10.401-8.462-18.862-18.862-18.862H74.147c-10.401,0-18.862,8.461-18.862,18.862v4.988c-3.858,1.231-7.401,3.33-10.254,6.16
|
||||
c-10.55,10.464-17.433,24.339-19.38,39.069L0.652,342.391c-2.851,21.572,3.74,43.329,18.083,59.692
|
||||
c14.343,16.363,35.049,25.747,56.809,25.747c33.935,0,63.897-22.86,72.86-55.591l10.502-38.356
|
||||
c9.314,6.157,20.461,9.754,32.437,9.754c32.523,0,58.983-26.459,58.983-58.984c0-0.896-0.028-1.786-0.067-2.672h11.487
|
||||
c-0.04,0.886-0.067,1.777-0.067,2.672c0,32.523,26.46,58.984,58.984,58.984c11.976,0,23.123-3.598,32.437-9.755l10.502,38.356
|
||||
c8.963,32.731,38.923,55.591,72.859,55.591c21.76,0,42.466-9.385,56.809-25.747C507.608,385.721,514.199,363.964,511.349,342.391
|
||||
z M385.25,100.203h52.604c1.56,0,2.828,1.269,2.828,2.828v3.73h-58.26v-3.73h-0.001
|
||||
C382.422,101.471,383.69,100.203,385.25,100.203z M71.319,103.031c0-1.56,1.269-2.828,2.828-2.828h52.603
|
||||
c1.558,0,2.828,1.269,2.828,2.828v3.73h-58.26V103.031z M132.937,368.005c-7.06,25.784-30.661,43.792-57.394,43.792
|
||||
c-17.141,0-33.451-7.393-44.75-20.283c-11.299-12.89-16.49-30.029-14.245-47.021l25-189.144
|
||||
c1.484-11.23,6.731-21.808,14.775-29.786c1.773-1.759,4.317-2.769,6.979-2.769h74.293c8.778,0,16.557,5.518,19.472,13.769
|
||||
l6.095,26.855c5.027,22.148,6.454,44.778,4.258,67.342c-20.634,9.195-35.061,29.885-35.061,53.895
|
||||
c0,14.078,4.964,27.014,13.225,37.166L132.937,368.005z M191.342,327.606c-23.682,0-42.95-19.266-42.95-42.95
|
||||
s19.266-42.95,42.95-42.95c23.682,0,42.949,19.266,42.949,42.95S215.023,327.606,191.342,327.606z M247.267,265.95
|
||||
c-7.841-23.379-29.94-40.278-55.925-40.278c-2.527,0-5.012,0.177-7.457,0.489c1.561-22.23-0.135-44.477-5.086-66.29
|
||||
l-3.968-17.481h162.339l-3.967,17.481c-4.952,21.813-6.648,44.06-5.086,66.29c-2.445-0.31-4.93-0.489-7.457-0.489
|
||||
c-25.985,0-48.084,16.898-55.926,40.278H247.267z M320.66,327.606c-23.682,0-42.95-19.266-42.95-42.95s19.266-42.95,42.95-42.95
|
||||
c23.681,0,42.949,19.266,42.949,42.95S344.341,327.606,320.66,327.606z M481.209,391.514
|
||||
c-11.299,12.89-27.61,20.283-44.751,20.283c-26.732,0-50.334-18.008-57.394-43.791l-12.646-46.183
|
||||
c8.261-10.152,13.225-23.088,13.225-37.166c0-24.009-14.427-44.7-35.061-53.895c-2.197-22.564-0.769-45.195,4.258-67.342
|
||||
l6.095-26.855c2.914-8.251,10.693-13.769,19.471-13.769h74.294c2.662,0,5.206,1.009,6.98,2.769
|
||||
c8.043,7.977,13.29,18.556,14.774,29.786l24.999,189.142C497.699,361.486,492.506,378.625,481.209,391.514z" />
|
||||
<path d="M191.342,251.823c-18.105,0-32.832,14.729-32.832,32.833s14.729,32.833,32.832,32.833
|
||||
c18.105,0,32.832-14.729,32.832-32.833C224.175,266.551,209.446,251.823,191.342,251.823z M191.342,301.455
|
||||
c-9.263,0-16.798-7.536-16.798-16.799s7.536-16.799,16.798-16.799c9.263,0,16.798,7.536,16.798,16.799
|
||||
S200.605,301.455,191.342,301.455z" />
|
||||
<path d="M396.588,198.622c0-14.476-11.778-26.253-26.253-26.253c-14.477,0-26.253,11.778-26.253,26.253
|
||||
c0,14.477,11.778,26.254,26.253,26.254C384.81,224.875,396.588,213.098,396.588,198.622z M370.334,208.841
|
||||
c-5.634,0-10.219-4.585-10.219-10.22s4.585-10.219,10.219-10.219c5.635,0,10.219,4.585,10.219,10.219
|
||||
S375.97,208.841,370.334,208.841z" />
|
||||
<path d="M227.198,176.258h-23.028c-4.427,0-8.017,3.589-8.017,8.017c0,4.427,3.589,8.017,8.017,8.017h23.028
|
||||
c4.427,0,8.017-3.59,8.017-8.017C235.215,179.848,231.625,176.258,227.198,176.258z" />
|
||||
<path d="M284.804,192.293h23.029c4.427,0,8.017-3.59,8.017-8.017c0-4.428-3.59-8.017-8.017-8.017h-23.029
|
||||
c-4.429,0-8.017,3.589-8.017,8.017C276.787,188.703,280.375,192.293,284.804,192.293z" />
|
||||
<path d="M320.66,251.823c-18.105,0-32.833,14.729-32.833,32.833s14.729,32.833,32.833,32.833
|
||||
c18.104,0,32.832-14.729,32.832-32.833C353.492,266.551,338.763,251.823,320.66,251.823z M320.66,301.455
|
||||
c-9.263,0-16.799-7.536-16.799-16.799s7.536-16.799,16.799-16.799c9.262,0,16.798,7.536,16.798,16.799
|
||||
S329.922,301.455,320.66,301.455z" />
|
||||
<path d="M409.979,185.23c14.476,0,26.253-11.778,26.253-26.254c0-14.476-11.778-26.253-26.253-26.253
|
||||
c-14.477,0-26.253,11.778-26.253,26.253C383.726,173.454,395.503,185.23,409.979,185.23z M409.979,148.758
|
||||
c5.635,0,10.219,4.585,10.219,10.219s-4.584,10.22-10.219,10.22c-5.634,0-10.219-4.585-10.219-10.22
|
||||
C399.76,153.343,404.345,148.758,409.979,148.758z" />
|
||||
</g> -->
|
||||
|
||||
<!-- <g id="gamepad" transform="translate(640,640) scale(2)" style="display: none;">
|
||||
<path d="M44.3,49.8v-3.7c0-0.3-0.1-0.5-0.3-0.7s-0.4-0.3-0.7-0.3h-5.5v-5.5c0-0.3-0.1-0.5-0.3-0.7
|
||||
s-0.4-0.3-0.7-0.3h-3.7c-0.3,0-0.5,0.1-0.7,0.3s-0.3,0.4-0.3,0.7v5.5h-5.5c-0.3,0-0.5,0.1-0.7,0.3S26,45.9,26,46.2v3.7
|
||||
c0,0.3,0.1,0.5,0.3,0.7s0.4,0.3,0.7,0.3h5.5v5.5c0,0.3,0.1,0.5,0.3,0.7s0.4,0.3,0.7,0.3H37c0.3,0,0.5-0.1,0.7-0.3s0.3-0.4,0.3-0.7
|
||||
v-5.5h5.5c0.3,0,0.5-0.1,0.7-0.3S44.3,50.1,44.3,49.8z M60.8,51.7c0-1-0.4-1.9-1.1-2.6C59,48.4,58.2,48,57.2,48s-1.9,0.4-2.6,1.1
|
||||
s-1.1,1.6-1.1,2.6s0.4,1.9,1.1,2.6c0.7,0.7,1.6,1.1,2.6,1.1s1.9-0.4,2.6-1.1C60.5,53.5,60.8,52.7,60.8,51.7z M68.2,44.3
|
||||
c0-1-0.4-1.9-1.1-2.6c-0.7-0.7-1.6-1.1-2.6-1.1s-1.9,0.4-2.6,1.1c-0.7,0.7-1.1,1.6-1.1,2.6s0.4,1.9,1.1,2.6
|
||||
c0.7,0.7,1.6,1.1,2.6,1.1s1.9-0.4,2.6-1.1C67.8,46.2,68.2,45.3,68.2,44.3z M75.5,48c0,4-1.4,7.5-4.3,10.4
|
||||
c-2.9,2.9-6.3,4.3-10.4,4.3c-3.7,0-6.9-1.2-9.7-3.7h-6.3c-2.8,2.4-6,3.7-9.7,3.7c-4,0-7.5-1.4-10.4-4.3c-2.9-2.9-4.3-6.3-4.3-10.4
|
||||
s1.4-7.5,4.3-10.4c2.9-2.9,6.3-4.3,10.4-4.3h25.7c4,0,7.5,1.4,10.4,4.3C74.1,40.5,75.5,44,75.5,48z" fill="#888" stroke="#222" />
|
||||
</g> -->
|
||||
</svg>
|
||||
|
||||
<script src='lib/matter.min.js'></script>
|
||||
<script src='lib/decomp.min.js'></script>
|
||||
<script src='lib/randomColor.min.js'></script>
|
||||
<script src="js/game.js"></script>
|
||||
<script src="js/player.js"></script>
|
||||
<script src="js/powerups.js"></script>
|
||||
<script src="js/bullets.js"></script>
|
||||
<script src="js/mobs.js"></script>
|
||||
<script src="js/spawn.js"></script>
|
||||
<script src="js/level.js"></script>
|
||||
<script src="js/engine.js"></script>
|
||||
<script src="js/index.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -25,6 +25,7 @@ const b = {
|
||||
isModLowHealthDmg: null,
|
||||
isModFarAwayDmg: null,
|
||||
isModMonogamy: null,
|
||||
isModMassEnergy: null,
|
||||
setModDefaults() {
|
||||
b.modCount = 0;
|
||||
b.modFireRate = 1;
|
||||
@@ -47,6 +48,7 @@ const b = {
|
||||
b.isModLowHealthDmg = false;
|
||||
b.isModFarAwayDmg = false;
|
||||
b.isModMonogamy = false;
|
||||
b.isModMassEnergy = false;
|
||||
mech.Fx = 0.015;
|
||||
mech.jumpForce = 0.38;
|
||||
mech.throwChargeRate = 2;
|
||||
@@ -116,7 +118,7 @@ const b = {
|
||||
},
|
||||
{
|
||||
name: "zoospore vector",
|
||||
description: "enemies can discharge <strong class='color-s'>spores</strong> on <strong>death</strong><br><strong class='color-s'>spores</strong> seek out enemies",
|
||||
description: "enemies can discharge <strong style='letter-spacing: 2px;'>spores</strong> on <strong>death</strong><br><strong style='letter-spacing: 2px;'>spores</strong> seek out enemies",
|
||||
have: false, //7
|
||||
effect: () => { //good late game maybe?
|
||||
b.modSpores = 0.20;
|
||||
@@ -148,7 +150,7 @@ const b = {
|
||||
},
|
||||
{
|
||||
name: "fluoroantimonic acid",
|
||||
description: "each bullet does extra chemical <strong class='color-d'>damage</strong>",
|
||||
description: "each bullet does extra chemical <strong class='color-d'>damage</strong><br>instant damage, unaffected by momentum",
|
||||
have: false, //11
|
||||
effect: () => { //good with guns that fire many bullets at low speeds, minigun, drones, junk-bots, shotgun, superballs, wavebeam
|
||||
b.modExtraDmg = 0.1
|
||||
@@ -156,7 +158,7 @@ const b = {
|
||||
},
|
||||
{
|
||||
name: "annihilation",
|
||||
description: "after <strong>touching</strong> enemies, they are annihilated",
|
||||
description: "after <strong>touching</strong> enemies, they are annihilated<br><em>doesn't trigger health or energy transfer</em>",
|
||||
have: false, //12
|
||||
effect: () => { //good with mods that heal: superconductive healing, entropy transfer
|
||||
b.modAnnihilation = true
|
||||
@@ -230,6 +232,14 @@ const b = {
|
||||
b.isModMonogamy = true
|
||||
}
|
||||
},
|
||||
{
|
||||
name: "mass-energy equivalence",
|
||||
description: "change the mass of <strong>power ups</strong> into <strong class='color-f'>energy</strong><br>power ups fill your <strong class='color-f'>energy</strong> and <strong class='color-h'>heal</strong> for +3%",
|
||||
have: false, //21
|
||||
effect: () => { // good with long term planning
|
||||
b.isModMassEnergy = true // used in mech.usePowerUp
|
||||
}
|
||||
},
|
||||
],
|
||||
giveMod(i) {
|
||||
b.mods[i].effect(); //give specific mod
|
||||
@@ -1044,7 +1054,7 @@ const b = {
|
||||
name: "shotgun", //5
|
||||
description: "fire a <strong>burst</strong> of short range bullets<br><em>crouch to reduce recoil</em>",
|
||||
ammo: 0,
|
||||
ammoPack: 8,
|
||||
ammoPack: 9,
|
||||
have: false,
|
||||
isStarterGun: true,
|
||||
fire() {
|
||||
@@ -1055,7 +1065,7 @@ const b = {
|
||||
const me = bullet.length;
|
||||
const dir = mech.angle + (Math.random() - 0.5) * (mech.crouch ? 0.22 : 0.7)
|
||||
bullet[me] = Bodies.rectangle(mech.pos.x + 35 * Math.cos(mech.angle) + 15 * (Math.random() - 0.5), mech.pos.y + 35 * Math.sin(mech.angle) + 15 * (Math.random() - 0.5), side, side, b.fireAttributes(dir));
|
||||
b.fireProps(mech.crouch ? 60 : 30, 40 + Math.random() * 11, dir, me); //cd , speed
|
||||
b.fireProps(mech.crouch ? 65 : 45, 40 + Math.random() * 11, dir, me); //cd , speed
|
||||
bullet[me].endCycle = game.cycle + Math.floor(55 * b.isModBulletsLastLonger);
|
||||
bullet[me].frictionAir = 0.03;
|
||||
bullet[me].do = function () {
|
||||
@@ -1070,7 +1080,7 @@ const b = {
|
||||
}
|
||||
}, {
|
||||
name: "fléchettes", //6
|
||||
description: "fire a flight of needles<br><strong>accurate</strong> at long range",
|
||||
description: "fire a flight of long range needles",
|
||||
ammo: 0,
|
||||
ammoPack: 25,
|
||||
have: false,
|
||||
@@ -1218,9 +1228,9 @@ const b = {
|
||||
fire() {
|
||||
b.muzzleFlash(30);
|
||||
const totalBullets = 5
|
||||
const angleStep = (mech.crouch ? 0.06 : 0.15) / totalBullets
|
||||
const SPEED = mech.crouch ? 30 : 25
|
||||
const CD = mech.crouch ? 45 : 11
|
||||
const angleStep = (mech.crouch ? 0.06 : 0.25) / totalBullets
|
||||
const SPEED = mech.crouch ? 29 : 25
|
||||
const CD = mech.crouch ? 30 : 11
|
||||
const END = Math.floor((mech.crouch ? 30 : 18) * b.isModBulletsLastLonger);
|
||||
let dir = mech.angle - angleStep * totalBullets / 2;
|
||||
const side1 = 17 * b.modBulletSize
|
||||
@@ -1236,7 +1246,7 @@ const b = {
|
||||
bullet[me].restitution = 0;
|
||||
bullet[me].friction = 1;
|
||||
// bullet[me].dmg = 0.15;
|
||||
bullet[me].explodeRad = (mech.crouch ? 70 : 45) + (Math.random() - 0.5) * 50;
|
||||
bullet[me].explodeRad = (mech.crouch ? 70 : 50) + (Math.random() - 0.5) * 50;
|
||||
bullet[me].onEnd = b.explode;
|
||||
bullet[me].onDmg = function () {
|
||||
this.endCycle = 0; //bullet ends cycle after hitting a mob and triggers explosion
|
||||
@@ -1461,7 +1471,7 @@ const b = {
|
||||
}
|
||||
}, {
|
||||
name: "spores", //12
|
||||
description: "fire orbs that discharge <strong class='color-s'>spores</strong><br><strong class='color-s'>spores</strong> seek out enemies",
|
||||
description: "fire orbs that discharge <strong style='letter-spacing: 2px;'>spores</strong><br><strong style='letter-spacing: 2px;'>spores</strong> seek out enemies",
|
||||
ammo: 0,
|
||||
ammoPack: 5,
|
||||
have: false,
|
||||
@@ -1677,17 +1687,16 @@ const b = {
|
||||
fire() {
|
||||
const dir = mech.angle;
|
||||
const me = bullet.length;
|
||||
const RADIUS = (22 + 5 * Math.random()) * b.modBulletSize
|
||||
const LENGTH = 0.7 + Math.random()
|
||||
|
||||
bullet[me] = Bodies.rectangle(mech.pos.x + 30 * Math.cos(mech.angle), mech.pos.y + 30 * Math.sin(mech.angle), RADIUS * LENGTH, RADIUS / LENGTH, {
|
||||
const RADIUS = (13 + 10 * Math.random()) * b.modBulletSize //(22 + 10 * Math.random()) * b.modBulletSize
|
||||
bullet[me] = Bodies.polygon(mech.pos.x + 30 * Math.cos(mech.angle), mech.pos.y + 30 * Math.sin(mech.angle), 3, RADIUS, {
|
||||
angle: dir,
|
||||
friction: 0,
|
||||
frictionStatic: 0,
|
||||
restitution: 0.8,
|
||||
restitution: 0.5 + 0.5 * Math.random(),
|
||||
dmg: b.modExtraDmg, // 0.14 //damage done in addition to the damage from momentum
|
||||
minDmgSpeed: 2,
|
||||
lookFrequency: 37 + Math.floor(27 * Math.random()),
|
||||
acceleration: 0.0015 + 0.0013 * Math.random(),
|
||||
range: 500 + Math.floor(200 * Math.random()),
|
||||
endCycle: Infinity,
|
||||
classType: "bullet",
|
||||
@@ -1705,8 +1714,7 @@ const b = {
|
||||
this.lockedOn = null;
|
||||
let closeDist = this.range;
|
||||
for (let i = 0, len = mob.length; i < len; ++i) {
|
||||
const TARGET_VECTOR = Matter.Vector.sub(this.vertices[0], mob[i].position)
|
||||
const DIST = Matter.Vector.magnitude(TARGET_VECTOR);
|
||||
const DIST = Matter.Vector.magnitude(Matter.Vector.sub(this.vertices[0], mob[i].position));
|
||||
if (DIST - mob[i].radius < closeDist &&
|
||||
Matter.Query.ray(map, this.vertices[0], mob[i].position).length === 0 &&
|
||||
Matter.Query.ray(body, this.vertices[0], mob[i].position).length === 0) {
|
||||
@@ -1716,13 +1724,12 @@ const b = {
|
||||
}
|
||||
}
|
||||
|
||||
const FIELD_DRAIN = 0.001
|
||||
const FIELD_DRAIN = 0.0016
|
||||
if (this.lockedOn && this.lockedOn.alive && mech.fieldMeter > FIELD_DRAIN) { //hit target with laser
|
||||
mech.fieldMeter -= FIELD_DRAIN
|
||||
|
||||
//make sure you can still see target
|
||||
const TARGET_VECTOR = Matter.Vector.sub(this.vertices[0], this.lockedOn.position)
|
||||
const DIST = Matter.Vector.magnitude(TARGET_VECTOR);
|
||||
const DIST = Matter.Vector.magnitude(Matter.Vector.sub(this.vertices[0], this.lockedOn.position));
|
||||
if (DIST - this.lockedOn.radius < this.range + 150 &&
|
||||
Matter.Query.ray(map, this.vertices[0], this.lockedOn.position).length === 0 &&
|
||||
Matter.Query.ray(body, this.vertices[0], this.lockedOn.position).length === 0) {
|
||||
@@ -1744,7 +1751,7 @@ const b = {
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(this.vertices[0].x, this.vertices[0].y);
|
||||
ctx.lineTo(this.lockedOn.vertices[bestVertex].x, this.lockedOn.vertices[bestVertex].y);
|
||||
ctx.strokeStyle = "rgb(255,0,40)";
|
||||
ctx.strokeStyle = "#f00";
|
||||
ctx.lineWidth = "2"
|
||||
ctx.lineDashOffset = 300 * Math.random()
|
||||
ctx.setLineDash([50 + 100 * Math.random(), 100 * Math.random()]);
|
||||
@@ -1752,17 +1759,19 @@ const b = {
|
||||
ctx.setLineDash([0, 0]);
|
||||
ctx.beginPath();
|
||||
ctx.arc(this.lockedOn.vertices[bestVertex].x, this.lockedOn.vertices[bestVertex].y, Math.sqrt(dmg) * 100, 0, 2 * Math.PI);
|
||||
ctx.fillStyle = "rgba(255,0,40,0.7)" //"#f00"
|
||||
ctx.fillStyle = "#f00";
|
||||
ctx.fill();
|
||||
}
|
||||
}
|
||||
|
||||
const distanceToPlayer = Matter.Vector.magnitude(Matter.Vector.sub(this.position, mech.pos))
|
||||
if (distanceToPlayer > this.range * 0.2) { //if far away move towards player
|
||||
this.force = Matter.Vector.mult(Matter.Vector.normalise(Matter.Vector.sub(mech.pos, this.position)), this.mass * 0.002)
|
||||
this.force = Matter.Vector.mult(Matter.Vector.normalise(Matter.Vector.sub(mech.pos, this.position)), this.mass * this.acceleration)
|
||||
this.frictionAir = 0.02
|
||||
} else { //close to player
|
||||
this.frictionAir = 0
|
||||
//add player's velocity
|
||||
Matter.Body.setVelocity(this, Matter.Vector.add(Matter.Vector.mult(this.velocity, 1), Matter.Vector.mult(player.velocity, 0.02)));
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@@ -201,6 +201,7 @@ const game = {
|
||||
}
|
||||
},
|
||||
switchGun() {
|
||||
if (b.modNoAmmo) b.modNoAmmo = 1 //this prevents hacking the mod by switching guns
|
||||
b.activeGun = b.inventory[b.inventoryGun];
|
||||
game.updateGunHUD();
|
||||
game.boldActiveGunHUD();
|
||||
|
||||
10
js/level.js
10
js/level.js
@@ -15,8 +15,8 @@ const level = {
|
||||
if (level.levelsCleared === 0) {
|
||||
// game.difficulty = 6; //for testing to simulate possible mobs spawns
|
||||
// b.giveGuns(14)
|
||||
// mech.fieldUpgrades[2].effect();
|
||||
// b.giveMod(5)
|
||||
// mech.fieldUpgrades[7].effect();
|
||||
// b.giveMod(2)
|
||||
|
||||
this.intro(); //starting level
|
||||
// this.testingMap();
|
||||
@@ -107,11 +107,11 @@ const level = {
|
||||
// spawn.bodyRect(-135, -50, 50, 50);
|
||||
// spawn.bodyRect(-140, -100, 50, 50);
|
||||
// powerUps.spawn(420, -400, "ammo", false);
|
||||
powerUps.spawn(450, -400, "mod", false, 6);
|
||||
// powerUps.spawn(450, -400, "mod", false, 6);
|
||||
// powerUps.spawn(450, -400, "mod", false);
|
||||
// spawn.bodyRect(-45, -100, 40, 50);
|
||||
spawn.spawner(800, -1150);
|
||||
spawn.groupBoss(-600, -550);
|
||||
spawn.spinner(800, -1150);
|
||||
// spawn.groupBoss(-600, -550);
|
||||
// spawn.hopper(800, -150);
|
||||
// spawn.beamer(800, -150);
|
||||
// spawn.grower(800, -250);
|
||||
|
||||
27
js/mobs.js
27
js/mobs.js
@@ -225,11 +225,34 @@ const mobs = {
|
||||
// ctx.stroke();
|
||||
// return targetPos;
|
||||
},
|
||||
|
||||
hacked() { //set this.hackedTarget variable before running this method
|
||||
//find a new target
|
||||
if (!(game.cycle % this.seePlayerFreq)) {
|
||||
this.hackedTarget = null
|
||||
for (let i = 0, len = mob.length; i < len; i++) {
|
||||
if (mob[i] !== this) {
|
||||
// const DIST = Matter.Vector.magnitude(Matter.Vector.sub(this.position, mob[j]));
|
||||
if (Matter.Query.ray(map, this.position, mob[i].position).length === 0 &&
|
||||
Matter.Query.ray(body, this.position, mob[i].position).length === 0) {
|
||||
this.hackedTarget = mob[i]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//acceleration towards targets
|
||||
if (this.hackedTarget) {
|
||||
this.force = Matter.Vector.mult(Matter.Vector.normalise(Matter.Vector.sub(this.hackedTarget.position, this.position)), this.mass * 0.0015)
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
laserBeam() {
|
||||
if (game.cycle % 7 && this.seePlayer.yes) {
|
||||
ctx.setLineDash([125 * Math.random(), 125 * Math.random()]);
|
||||
// ctx.lineDashOffset = 6*(game.cycle % 215);
|
||||
if (this.distanceToPlayer() < this.laserRange) {
|
||||
if (this.distanceToPlayer() < this.laserRange && !mech.isStealth) {
|
||||
//if (Math.random()>0.2 && this.seePlayer.yes && this.distanceToPlayer2()<800000) {
|
||||
if (b.isModTempResist) {
|
||||
mech.damage(0.00006 * game.dmgScale);
|
||||
@@ -320,7 +343,7 @@ const mobs = {
|
||||
};
|
||||
vertexCollision(this.position, look, map);
|
||||
vertexCollision(this.position, look, body);
|
||||
vertexCollision(this.position, look, [player]);
|
||||
if (!mech.isStealth) vertexCollision(this.position, look, [player]);
|
||||
// hitting player
|
||||
if (best.who === player) {
|
||||
if (b.isModTempResist) {
|
||||
|
||||
74
js/player.js
74
js/player.js
@@ -517,6 +517,10 @@ const mech = {
|
||||
powerUp[i].effect();
|
||||
Matter.World.remove(engine.world, powerUp[i]);
|
||||
powerUp.splice(i, 1);
|
||||
if (b.isModMassEnergy) {
|
||||
mech.fieldMeter = 1;
|
||||
mech.addHealth(0.03);
|
||||
}
|
||||
},
|
||||
drawLeg(stroke) {
|
||||
// if (game.mouseInGame.x > this.pos.x) {
|
||||
@@ -1512,5 +1516,75 @@ const mech = {
|
||||
}
|
||||
}
|
||||
},
|
||||
// {
|
||||
// name: "code injection field",
|
||||
// description: "capture an enemy in your field for 3 seconds<br>rewrite thier behavior to target your enemies",
|
||||
// effect: () => {
|
||||
// mech.fieldMode = 7;
|
||||
// mech.fieldText();
|
||||
// mech.setHoldDefaults();
|
||||
// mech.hackProgress = 0;
|
||||
// // mech.grabRange = 230
|
||||
// mech.hold = function () {
|
||||
// mech.isStealth = false //isStealth is checked in mob foundPlayer()
|
||||
// player.collisionFilter.mask = 0x010011 //0x010011 is normal
|
||||
// if (mech.isHolding) {
|
||||
// mech.hackProgress = 0
|
||||
// mech.drawHold(mech.holdingTarget);
|
||||
// mech.holding();
|
||||
// mech.throw();
|
||||
// } else if ((keys[32] || game.mouseDownRight) && mech.fieldCDcycle < mech.cycle) {
|
||||
// const DRAIN = 0.0005
|
||||
// if (mech.fieldMeter > DRAIN) {
|
||||
// mech.fieldMeter -= DRAIN;
|
||||
|
||||
// //try to hack a mob
|
||||
// for (let i = 0, len = mob.length; i < len; ++i) {
|
||||
// if (
|
||||
// Matter.Vector.magnitude(Matter.Vector.sub(mob[i].position, this.pos)) < this.grabRange &&
|
||||
// this.lookingAt(mob[i]) &&
|
||||
// Matter.Query.ray(map, mob[i].position, this.pos).length === 0
|
||||
// ) {
|
||||
// if (mech.hackProgress > 180) { //hack the mob
|
||||
// mech.fieldMeter = 0;
|
||||
// mob[i].hackedTarget = null;
|
||||
// mob[i].seePlayerFreq = Math.round((30 + 30 * Math.random()) * game.lookFreqScale)
|
||||
// mob[i].do = function () {
|
||||
// this.healthBar();
|
||||
// this.hacked();
|
||||
// }
|
||||
// } else { //hold the mob still
|
||||
// mech.hackProgress++
|
||||
// range = this.grabRange * 0.9
|
||||
// Matter.Body.setPosition(mob[i], {
|
||||
// x: mech.pos.x + range * Math.cos(mech.angle),
|
||||
// y: mech.pos.y + range * Math.sin(mech.angle),
|
||||
// });
|
||||
// Matter.Body.setVelocity(mob[i], player.velocity);
|
||||
// }
|
||||
|
||||
// }
|
||||
// }
|
||||
|
||||
|
||||
// mech.pushBodyFacing();
|
||||
// mech.drawField();
|
||||
// mech.grabPowerUp();
|
||||
// mech.lookForPickUp();
|
||||
// } else {
|
||||
// mech.hackProgress = 0
|
||||
// mech.fieldCDcycle = mech.cycle + 120;
|
||||
// }
|
||||
// } else if (mech.holdingTarget && mech.fireCDcycle < mech.cycle && mech.fieldMeter > 0.05) { //holding, but field button is released
|
||||
// mech.pickUp();
|
||||
// mech.hackProgress = 0
|
||||
// } else {
|
||||
// mech.hackProgress = 0
|
||||
// mech.holdingTarget = null; //clears holding target (this is so you only pick up right after the field button is released and a hold target exists)
|
||||
// }
|
||||
// mech.drawFieldMeter()
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
],
|
||||
};
|
||||
309
js/spawn.js
309
js/spawn.js
@@ -12,14 +12,13 @@ const spawn = {
|
||||
"beamer",
|
||||
"focuser",
|
||||
"laser", "laser",
|
||||
// "blinker", //make blinker a boss
|
||||
"sucker",
|
||||
"exploder", "exploder", "exploder",
|
||||
"spawner",
|
||||
"ghoster",
|
||||
"sneaker",
|
||||
],
|
||||
allowedBossList: ["chaser", "spinner", "striker", "springer", "laser", "focuser", "beamer", "exploder", "spawner", "shooter"], //"zoomer",
|
||||
allowedBossList: ["chaser", "spinner", "striker", "springer", "laser", "focuser", "beamer", "exploder", "spawner", "shooter"],
|
||||
setSpawnList() {
|
||||
//this is run at the start of each new level to determine the possible mobs for the level
|
||||
//each level has 2 mobs: one new mob and one from the last level
|
||||
@@ -132,6 +131,7 @@ const spawn = {
|
||||
let me = mob[mob.length - 1];
|
||||
me.accelMag = 0.0005 * game.accelScale;
|
||||
me.memory = 60;
|
||||
me.seeAtDistance2 = 1400000 //1200 vision range
|
||||
Matter.Body.setDensity(me, 0.0005) // normal density is 0.001 // this reduces life by half and decreases knockback
|
||||
|
||||
me.do = function () {
|
||||
@@ -140,92 +140,92 @@ const spawn = {
|
||||
this.attraction();
|
||||
};
|
||||
},
|
||||
healer(x, y, radius = 20) {
|
||||
mobs.spawn(x, y, 3, radius, "rgba(50,255,200,0.4)");
|
||||
let me = mob[mob.length - 1];
|
||||
me.frictionAir = 0.02;
|
||||
me.accelMag = 0.0004 * game.accelScale;
|
||||
if (map.length) me.searchTarget = map[Math.floor(Math.random() * (map.length - 1))].position; //required for search
|
||||
me.lookFrequency = 160 + Math.floor(57 * Math.random())
|
||||
me.lockedOn = null;
|
||||
Matter.Body.setDensity(me, 0.003) // normal density is 0.001
|
||||
// healer(x, y, radius = 20) {
|
||||
// mobs.spawn(x, y, 3, radius, "rgba(50,255,200,0.4)");
|
||||
// let me = mob[mob.length - 1];
|
||||
// me.frictionAir = 0.02;
|
||||
// me.accelMag = 0.0004 * game.accelScale;
|
||||
// if (map.length) me.searchTarget = map[Math.floor(Math.random() * (map.length - 1))].position; //required for search
|
||||
// me.lookFrequency = 160 + Math.floor(57 * Math.random())
|
||||
// me.lockedOn = null;
|
||||
// Matter.Body.setDensity(me, 0.003) // normal density is 0.001
|
||||
|
||||
me.do = function () {
|
||||
this.healthBar();
|
||||
// me.do = function () {
|
||||
// this.healthBar();
|
||||
|
||||
if (!(game.cycle % this.lookFrequency)) {
|
||||
//slow self heal
|
||||
this.health += 0.02;
|
||||
if (this.health > 1) this.health = 1;
|
||||
// if (!(game.cycle % this.lookFrequency)) {
|
||||
// //slow self heal
|
||||
// this.health += 0.02;
|
||||
// if (this.health > 1) this.health = 1;
|
||||
|
||||
//target mobs with low health
|
||||
let closeDist = Infinity;
|
||||
for (let i = 0; i < mob.length; i++) {
|
||||
if (mob[i] != this && Matter.Query.ray(map, this.position, mob[i].position).length === 0) {
|
||||
const TARGET_VECTOR = Matter.Vector.sub(this.position, mob[i].position)
|
||||
const DIST = Matter.Vector.magnitude(TARGET_VECTOR) * mob[i].health * mob[i].health * mob[i].health; //distance is multiplied by mob health to prioritize low health mobs
|
||||
if (DIST < closeDist) {
|
||||
closeDist = DIST;
|
||||
this.lockedOn = mob[i]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// //target mobs with low health
|
||||
// let closeDist = Infinity;
|
||||
// for (let i = 0; i < mob.length; i++) {
|
||||
// if (mob[i] != this && Matter.Query.ray(map, this.position, mob[i].position).length === 0) {
|
||||
// const TARGET_VECTOR = Matter.Vector.sub(this.position, mob[i].position)
|
||||
// const DIST = Matter.Vector.magnitude(TARGET_VECTOR) * mob[i].health * mob[i].health * mob[i].health; //distance is multiplied by mob health to prioritize low health mobs
|
||||
// if (DIST < closeDist) {
|
||||
// closeDist = DIST;
|
||||
// this.lockedOn = mob[i]
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
//move away from player if too close
|
||||
if (this.distanceToPlayer2() < 400000) {
|
||||
const TARGET_VECTOR = Matter.Vector.sub(this.position, player.position)
|
||||
this.force = Matter.Vector.mult(Matter.Vector.normalise(TARGET_VECTOR), this.mass * this.accelMag * 1.4)
|
||||
if (this.lockedOn) this.lockedOn = null
|
||||
} else if (this.lockedOn && this.lockedOn.alive) {
|
||||
//move towards and heal locked on target
|
||||
const TARGET_VECTOR = Matter.Vector.sub(this.position, this.lockedOn.position)
|
||||
const DIST = Matter.Vector.magnitude(TARGET_VECTOR);
|
||||
if (DIST > 250) {
|
||||
this.force = Matter.Vector.mult(Matter.Vector.normalise(TARGET_VECTOR), -this.mass * this.accelMag)
|
||||
} else {
|
||||
if (this.lockedOn.health < 1) {
|
||||
this.lockedOn.health += 0.002;
|
||||
if (this.lockedOn.health > 1) this.lockedOn.health = 1;
|
||||
//spin when healing
|
||||
this.torque = 0.000005 * this.inertia;
|
||||
//draw heal
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(this.position.x, this.position.y);
|
||||
ctx.lineTo(this.lockedOn.position.x, this.lockedOn.position.y);
|
||||
ctx.lineWidth = 10
|
||||
ctx.strokeStyle = "rgba(50,255,200,0.4)"
|
||||
ctx.stroke();
|
||||
}
|
||||
}
|
||||
} else {
|
||||
//wander if no heal targets visible
|
||||
//be sure to declare searchTarget in mob spawn
|
||||
const newTarget = function (that) {
|
||||
that.searchTarget = mob[Math.floor(Math.random() * (mob.length - 1))].position;
|
||||
};
|
||||
// //move away from player if too close
|
||||
// if (this.distanceToPlayer2() < 400000) {
|
||||
// const TARGET_VECTOR = Matter.Vector.sub(this.position, player.position)
|
||||
// this.force = Matter.Vector.mult(Matter.Vector.normalise(TARGET_VECTOR), this.mass * this.accelMag * 1.4)
|
||||
// if (this.lockedOn) this.lockedOn = null
|
||||
// } else if (this.lockedOn && this.lockedOn.alive) {
|
||||
// //move towards and heal locked on target
|
||||
// const TARGET_VECTOR = Matter.Vector.sub(this.position, this.lockedOn.position)
|
||||
// const DIST = Matter.Vector.magnitude(TARGET_VECTOR);
|
||||
// if (DIST > 250) {
|
||||
// this.force = Matter.Vector.mult(Matter.Vector.normalise(TARGET_VECTOR), -this.mass * this.accelMag)
|
||||
// } else {
|
||||
// if (this.lockedOn.health < 1) {
|
||||
// this.lockedOn.health += 0.002;
|
||||
// if (this.lockedOn.health > 1) this.lockedOn.health = 1;
|
||||
// //spin when healing
|
||||
// this.torque = 0.000005 * this.inertia;
|
||||
// //draw heal
|
||||
// ctx.beginPath();
|
||||
// ctx.moveTo(this.position.x, this.position.y);
|
||||
// ctx.lineTo(this.lockedOn.position.x, this.lockedOn.position.y);
|
||||
// ctx.lineWidth = 10
|
||||
// ctx.strokeStyle = "rgba(50,255,200,0.4)"
|
||||
// ctx.stroke();
|
||||
// }
|
||||
// }
|
||||
// } else {
|
||||
// //wander if no heal targets visible
|
||||
// //be sure to declare searchTarget in mob spawn
|
||||
// const newTarget = function (that) {
|
||||
// that.searchTarget = mob[Math.floor(Math.random() * (mob.length - 1))].position;
|
||||
// };
|
||||
|
||||
const sub = Matter.Vector.sub(this.searchTarget, this.position);
|
||||
if (Matter.Vector.magnitude(sub) > this.radius * 2) {
|
||||
ctx.beginPath();
|
||||
ctx.strokeStyle = "#aaa";
|
||||
ctx.moveTo(this.position.x, this.position.y);
|
||||
ctx.lineTo(this.searchTarget.x, this.searchTarget.y);
|
||||
ctx.stroke();
|
||||
//accelerate at 0.6 of normal acceleration
|
||||
this.force = Matter.Vector.mult(Matter.Vector.normalise(sub), this.accelMag * this.mass * 0.6);
|
||||
} else {
|
||||
//after reaching random target switch to new target
|
||||
newTarget(this);
|
||||
}
|
||||
//switch to a new target after a while
|
||||
if (!(game.cycle % (this.lookFrequency * 15))) {
|
||||
newTarget(this);
|
||||
}
|
||||
// const sub = Matter.Vector.sub(this.searchTarget, this.position);
|
||||
// if (Matter.Vector.magnitude(sub) > this.radius * 2) {
|
||||
// ctx.beginPath();
|
||||
// ctx.strokeStyle = "#aaa";
|
||||
// ctx.moveTo(this.position.x, this.position.y);
|
||||
// ctx.lineTo(this.searchTarget.x, this.searchTarget.y);
|
||||
// ctx.stroke();
|
||||
// //accelerate at 0.6 of normal acceleration
|
||||
// this.force = Matter.Vector.mult(Matter.Vector.normalise(sub), this.accelMag * this.mass * 0.6);
|
||||
// } else {
|
||||
// //after reaching random target switch to new target
|
||||
// newTarget(this);
|
||||
// }
|
||||
// //switch to a new target after a while
|
||||
// if (!(game.cycle % (this.lookFrequency * 15))) {
|
||||
// newTarget(this);
|
||||
// }
|
||||
|
||||
}
|
||||
};
|
||||
},
|
||||
// }
|
||||
// };
|
||||
// },
|
||||
chaser(x, y, radius = 35 + Math.ceil(Math.random() * 40)) {
|
||||
mobs.spawn(x, y, 8, radius, "#2c9790");
|
||||
let me = mob[mob.length - 1];
|
||||
@@ -304,27 +304,27 @@ const spawn = {
|
||||
this.searchSpring();
|
||||
};
|
||||
},
|
||||
zoomer(x, y, radius = 20 + Math.ceil(Math.random() * 30)) {
|
||||
mobs.spawn(x, y, 6, radius, "#ffe2fd");
|
||||
let me = mob[mob.length - 1];
|
||||
me.trailLength = 20; //required for trails
|
||||
me.setupTrail(); //fill trails array up with the current position of mob
|
||||
me.trailFill = "#ff00f0";
|
||||
me.g = 0.001; //required if using 'gravity'
|
||||
me.frictionAir = 0.02;
|
||||
me.accelMag = 0.004 * game.accelScale;
|
||||
me.memory = 30;
|
||||
me.zoomMode = 150;
|
||||
me.onHit = function () {
|
||||
this.zoomMode = 150;
|
||||
};
|
||||
me.do = function () {
|
||||
this.healthBar();
|
||||
this.seePlayerByDistAndLOS();
|
||||
this.zoom();
|
||||
this.gravity();
|
||||
};
|
||||
},
|
||||
// zoomer(x, y, radius = 20 + Math.ceil(Math.random() * 30)) {
|
||||
// mobs.spawn(x, y, 6, radius, "#ffe2fd");
|
||||
// let me = mob[mob.length - 1];
|
||||
// me.trailLength = 20; //required for trails
|
||||
// me.setupTrail(); //fill trails array up with the current position of mob
|
||||
// me.trailFill = "#ff00f0";
|
||||
// me.g = 0.001; //required if using 'gravity'
|
||||
// me.frictionAir = 0.02;
|
||||
// me.accelMag = 0.004 * game.accelScale;
|
||||
// me.memory = 30;
|
||||
// me.zoomMode = 150;
|
||||
// me.onHit = function () {
|
||||
// this.zoomMode = 150;
|
||||
// };
|
||||
// me.do = function () {
|
||||
// this.healthBar();
|
||||
// this.seePlayerByDistAndLOS();
|
||||
// this.zoom();
|
||||
// this.gravity();
|
||||
// };
|
||||
// },
|
||||
hopper(x, y, radius = 30 + Math.ceil(Math.random() * 30)) {
|
||||
mobs.spawn(x, y, 5, radius, "rgb(0,200,180)");
|
||||
let me = mob[mob.length - 1];
|
||||
@@ -388,12 +388,9 @@ const spawn = {
|
||||
hue: "blue"
|
||||
});
|
||||
//draw attack vector
|
||||
const mag = this.radius * 2 + 200;
|
||||
const gradient = ctx.createRadialGradient(this.position.x, this.position.y, 0, this.position.x, this.position.y, mag);
|
||||
gradient.addColorStop(0, "rgba(0,0,0,0.2)");
|
||||
gradient.addColorStop(1, "transparent");
|
||||
ctx.strokeStyle = gradient;
|
||||
ctx.lineWidth = 5;
|
||||
const mag = this.radius * 2.5 + 50;
|
||||
ctx.strokeStyle = "rgba(0,0,0,0.2)";
|
||||
ctx.lineWidth = 3;
|
||||
ctx.setLineDash([10, 20]); //30
|
||||
const dir = Matter.Vector.add(this.position, Matter.Vector.mult(this.burstDir, mag));
|
||||
ctx.beginPath();
|
||||
@@ -455,7 +452,7 @@ const spawn = {
|
||||
|
||||
this.healthBar();
|
||||
//when player is inside event horizon
|
||||
if (Matter.Vector.magnitude(Matter.Vector.sub(this.position, player.position)) < eventHorizon) {
|
||||
if (Matter.Vector.magnitude(Matter.Vector.sub(this.position, player.position)) < eventHorizon && !mech.isStealth) {
|
||||
mech.damage(0.00015 * game.dmgScale);
|
||||
if (mech.fieldMeter > 0.1) mech.fieldMeter -= 0.007
|
||||
|
||||
@@ -545,7 +542,7 @@ const spawn = {
|
||||
ctx.fillStyle = "rgba(0,0,0,0.05)";
|
||||
ctx.fill();
|
||||
//when player is inside event horizon
|
||||
if (Matter.Vector.magnitude(Matter.Vector.sub(this.position, player.position)) < eventHorizon) {
|
||||
if (Matter.Vector.magnitude(Matter.Vector.sub(this.position, player.position)) < eventHorizon && !mech.isStealth) {
|
||||
mech.damage(0.00015 * game.dmgScale);
|
||||
if (mech.fieldMeter > 0.1) mech.fieldMeter -= 0.007
|
||||
const angle = Math.atan2(player.position.y - this.position.y, player.position.x - this.position.x);
|
||||
@@ -614,13 +611,9 @@ const spawn = {
|
||||
this.laserPos = Matter.Vector.add(this.laserPos, Matter.Vector.mult(Matter.Vector.sub(player.position, this.laserPos), 0.1));
|
||||
let targetDist = Matter.Vector.magnitude(Matter.Vector.sub(this.laserPos, mech.pos));
|
||||
const r = 10;
|
||||
|
||||
// ctx.setLineDash([15, 200]);
|
||||
// ctx.lineDashOffset = 20*(game.cycle % 215);
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(this.position.x, this.position.y);
|
||||
if (targetDist < r + 15) {
|
||||
// || dist2 < 80000
|
||||
targetDist = r + 10;
|
||||
//charge at player
|
||||
const forceMag = this.accelMag * 40 * this.mass;
|
||||
@@ -645,11 +638,7 @@ const spawn = {
|
||||
sub = Matter.Vector.normalise(Matter.Vector.sub(laserOffL, this.position));
|
||||
laserOffL = Matter.Vector.add(laserOffL, Matter.Vector.mult(sub, rangeWidth));
|
||||
ctx.lineTo(laserOffL.x, laserOffL.y);
|
||||
// ctx.fillStyle = "rgba(0,0,255,0.15)";
|
||||
var gradient = ctx.createRadialGradient(this.position.x, this.position.y, 0, this.position.x, this.position.y, rangeWidth);
|
||||
gradient.addColorStop(0, `rgba(0,0,255,${((r + 5) * (r + 5)) / (targetDist * targetDist)})`);
|
||||
gradient.addColorStop(1, "transparent");
|
||||
ctx.fillStyle = gradient;
|
||||
ctx.fillStyle = `rgba(0,0,255,${Math.max(0,0.3*r/targetDist)})`
|
||||
ctx.fill();
|
||||
}
|
||||
} else {
|
||||
@@ -801,46 +790,46 @@ const spawn = {
|
||||
}
|
||||
};
|
||||
},
|
||||
blinker(x, y, radius = 45 + Math.ceil(Math.random() * 70)) {
|
||||
mobs.spawn(x, y, 6, radius, "transparent");
|
||||
let me = mob[mob.length - 1];
|
||||
Matter.Body.setDensity(me, 0.0005); //normal is 0.001 //makes effective life much lower
|
||||
me.stroke = "rgb(0,200,255)"; //used for drawGhost
|
||||
Matter.Body.rotate(me, Math.random() * 2 * Math.PI);
|
||||
me.blinkRate = 40 + Math.round(Math.random() * 60); //required for blink
|
||||
me.blinkLength = 150 + Math.round(Math.random() * 200); //required for blink
|
||||
me.isStatic = true;
|
||||
me.memory = 360;
|
||||
me.seePlayerFreq = Math.round((40 + 30 * Math.random()) * game.lookFreqScale);
|
||||
me.isBig = false;
|
||||
me.scaleMag = Math.max(5 - me.mass, 1.75);
|
||||
me.onDeath = function () {
|
||||
if (this.isBig) {
|
||||
Matter.Body.scale(this, 1 / this.scaleMag, 1 / this.scaleMag);
|
||||
this.isBig = false;
|
||||
}
|
||||
};
|
||||
me.do = function () {
|
||||
this.healthBar();
|
||||
this.seePlayerCheck();
|
||||
this.blink();
|
||||
//strike by expanding
|
||||
if (this.isBig) {
|
||||
if (this.cd - this.delay + 15 < game.cycle) {
|
||||
Matter.Body.scale(this, 1 / this.scaleMag, 1 / this.scaleMag);
|
||||
this.isBig = false;
|
||||
}
|
||||
} else if (this.seePlayer.yes && this.cd < game.cycle) {
|
||||
const dist = Matter.Vector.sub(this.seePlayer.position, this.position);
|
||||
const distMag2 = Matter.Vector.magnitudeSquared(dist);
|
||||
if (distMag2 < 80000) {
|
||||
this.cd = game.cycle + this.delay;
|
||||
Matter.Body.scale(this, this.scaleMag, this.scaleMag);
|
||||
this.isBig = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
// blinker(x, y, radius = 45 + Math.ceil(Math.random() * 70)) {
|
||||
// mobs.spawn(x, y, 6, radius, "transparent");
|
||||
// let me = mob[mob.length - 1];
|
||||
// Matter.Body.setDensity(me, 0.0005); //normal is 0.001 //makes effective life much lower
|
||||
// me.stroke = "rgb(0,200,255)"; //used for drawGhost
|
||||
// Matter.Body.rotate(me, Math.random() * 2 * Math.PI);
|
||||
// me.blinkRate = 40 + Math.round(Math.random() * 60); //required for blink
|
||||
// me.blinkLength = 150 + Math.round(Math.random() * 200); //required for blink
|
||||
// me.isStatic = true;
|
||||
// me.memory = 360;
|
||||
// me.seePlayerFreq = Math.round((40 + 30 * Math.random()) * game.lookFreqScale);
|
||||
// me.isBig = false;
|
||||
// me.scaleMag = Math.max(5 - me.mass, 1.75);
|
||||
// me.onDeath = function () {
|
||||
// if (this.isBig) {
|
||||
// Matter.Body.scale(this, 1 / this.scaleMag, 1 / this.scaleMag);
|
||||
// this.isBig = false;
|
||||
// }
|
||||
// };
|
||||
// me.do = function () {
|
||||
// this.healthBar();
|
||||
// this.seePlayerCheck();
|
||||
// this.blink();
|
||||
// //strike by expanding
|
||||
// if (this.isBig) {
|
||||
// if (this.cd - this.delay + 15 < game.cycle) {
|
||||
// Matter.Body.scale(this, 1 / this.scaleMag, 1 / this.scaleMag);
|
||||
// this.isBig = false;
|
||||
// }
|
||||
// } else if (this.seePlayer.yes && this.cd < game.cycle) {
|
||||
// const dist = Matter.Vector.sub(this.seePlayer.position, this.position);
|
||||
// const distMag2 = Matter.Vector.magnitudeSquared(dist);
|
||||
// if (distMag2 < 80000) {
|
||||
// this.cd = game.cycle + this.delay;
|
||||
// Matter.Body.scale(this, this.scaleMag, this.scaleMag);
|
||||
// this.isBig = true;
|
||||
// }
|
||||
// }
|
||||
// };
|
||||
// },
|
||||
bomber(x, y, radius = 120 + Math.ceil(Math.random() * 70)) {
|
||||
//boss that drops bombs from above and holds a set distance from player
|
||||
mobs.spawn(x, y, 3, radius, "transparent");
|
||||
|
||||
740
style.css
740
style.css
@@ -1,374 +1,368 @@
|
||||
body {
|
||||
font-family: "Helvetica", "Arial", sans-serif;
|
||||
margin: 0;
|
||||
/* overflow: hidden; */
|
||||
background-color: #fff;
|
||||
user-select: none;
|
||||
/*cursor: crosshair;*/
|
||||
}
|
||||
|
||||
canvas {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
#splash {
|
||||
user-select: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
*:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
/* border: 1px solid #eee; */
|
||||
width: 360px;
|
||||
/* background-color: #ddd; */
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
summary {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.SVG-button {
|
||||
border: 2px #333 solid;
|
||||
border-radius: 9px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.SVG-button:hover {
|
||||
background-color: #efeff5;
|
||||
}
|
||||
|
||||
#build-button {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 3px;
|
||||
z-index: 12;
|
||||
}
|
||||
|
||||
#build-grid {
|
||||
padding: 10px;
|
||||
margin: 0px;
|
||||
border: 0px;
|
||||
/* border-radius: 8px; */
|
||||
background-color: #c4ccd8;
|
||||
/* #b6bfca; */
|
||||
|
||||
display: none;
|
||||
/* display: grid; */
|
||||
grid-template-columns: repeat(auto-fit, minmax(292px, 1fr));
|
||||
grid-auto-rows: minmax(auto, auto);
|
||||
grid-gap: 15px;
|
||||
|
||||
position: relative;
|
||||
bottom: 0px;
|
||||
/* left: 0px; */
|
||||
z-index: 12;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.build-grid-module {
|
||||
/* box-shadow: 0px 1px 4px #234; */
|
||||
padding: 7px;
|
||||
/* margin: 4px; */
|
||||
line-height: 150%;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
font-size: 0.65em;
|
||||
/* display: flex; */
|
||||
}
|
||||
|
||||
.build-grid-module:hover {
|
||||
background-color: #efeff5;
|
||||
}
|
||||
|
||||
.gun-module {
|
||||
background: #d5dde5;
|
||||
}
|
||||
|
||||
.field-module {
|
||||
background: #bde;
|
||||
}
|
||||
|
||||
.mod-module {
|
||||
background: #fdf;
|
||||
}
|
||||
|
||||
|
||||
/* #build {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 1px;
|
||||
z-index: 12;
|
||||
font-size: 1.3em;
|
||||
} */
|
||||
#settings {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 1px;
|
||||
z-index: 12;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
#controls {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 1px;
|
||||
z-index: 12;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
#details-div {
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
#dmg {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: none;
|
||||
background-color: #f67;
|
||||
opacity: 0;
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
#health-bg {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
height: 20px;
|
||||
width: 300px;
|
||||
background-color: #000;
|
||||
opacity: 0.1;
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#health {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
height: 20px;
|
||||
width: 0px;
|
||||
transition: width 1s ease-out;
|
||||
opacity: 0.6;
|
||||
z-index: 2;
|
||||
pointer-events: none;
|
||||
background-color: #f00;
|
||||
}
|
||||
|
||||
.low-health {
|
||||
animation: blink 250ms infinite alternate;
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
from {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0.2;
|
||||
}
|
||||
}
|
||||
|
||||
#fade-out {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
opacity: 1;
|
||||
transition: opacity 3s;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#guns {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 15px;
|
||||
z-index: 2;
|
||||
font-size: 23px;
|
||||
color: #111;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
padding: 0px 5px 0px 5px;
|
||||
border-radius: 5px;
|
||||
/*border: 2px solid rgba(0, 0, 0, 0.4);*/
|
||||
}
|
||||
|
||||
#field {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
z-index: 2;
|
||||
font-size: 23px;
|
||||
color: #000;
|
||||
text-align: right;
|
||||
opacity: 0.7;
|
||||
line-height: 140%;
|
||||
background-color: rgba(190, 210, 245, 0.25);
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
padding: 0px 5px 0px 5px;
|
||||
border-radius: 5px;
|
||||
/*border: 2px solid rgba(0, 0, 0, 0.4);*/
|
||||
}
|
||||
|
||||
#mods {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
right: 15px;
|
||||
z-index: 2;
|
||||
font-size: 20px;
|
||||
color: #000;
|
||||
text-align: right;
|
||||
opacity: 0.35;
|
||||
line-height: 140%;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
padding: 0px 5px 0px 5px;
|
||||
border-radius: 5px;
|
||||
/*border: 2px solid rgba(0, 0, 0, 0.4);*/
|
||||
}
|
||||
|
||||
#text-log {
|
||||
/* position: absolute;
|
||||
top: 20px;
|
||||
left: 0;
|
||||
width: 100%; */
|
||||
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
/* left: 50%; */
|
||||
/* transform: translate(-50%, 0); */
|
||||
|
||||
padding: 10px;
|
||||
border-radius: 10px;
|
||||
|
||||
/* text-align: center; */
|
||||
line-height: 150%;
|
||||
font-size: 1.25em;
|
||||
color: #000;
|
||||
background-color: rgba(255, 255, 255, 0.23);
|
||||
|
||||
opacity: 0;
|
||||
transition: opacity 0.5s;
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
em {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.mouse-icon {
|
||||
margin-bottom: -20px;
|
||||
}
|
||||
|
||||
.color-f {
|
||||
color: #0ad;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.color-d {
|
||||
color: #f03;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.color-h {
|
||||
color: #0b7;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.color-e {
|
||||
color: #d60;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.color-s {
|
||||
color: #055;
|
||||
font-weight: 900;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.faded {
|
||||
opacity: 0.7;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
.circle {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-bottom: -2px;
|
||||
}
|
||||
|
||||
.circle-grid {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-bottom: -4px;
|
||||
}
|
||||
|
||||
.field {
|
||||
background: #0cf;
|
||||
}
|
||||
|
||||
.mod {
|
||||
background: #96e;
|
||||
}
|
||||
|
||||
.gun {
|
||||
background: #149;
|
||||
}
|
||||
|
||||
.heal {
|
||||
background: #0d9;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 3px 8px 3px 8px;
|
||||
border: 2px solid #444;
|
||||
border-radius: 4px;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: 360px 10px;
|
||||
align-self: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.grid-box {
|
||||
align-self: center;
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
.right {
|
||||
text-align: right;
|
||||
body {
|
||||
font-family: "Helvetica", "Arial", sans-serif;
|
||||
margin: 0;
|
||||
/* overflow: hidden; */
|
||||
background-color: #fff;
|
||||
user-select: none;
|
||||
/*cursor: crosshair;*/
|
||||
}
|
||||
|
||||
canvas {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
#splash {
|
||||
user-select: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
*:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
/* border: 1px solid #eee; */
|
||||
width: 360px;
|
||||
/* background-color: #ddd; */
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
summary {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.SVG-button {
|
||||
border: 2px #333 solid;
|
||||
border-radius: 9px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.SVG-button:hover {
|
||||
background-color: #efeff5;
|
||||
}
|
||||
|
||||
#build-button {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 3px;
|
||||
z-index: 12;
|
||||
}
|
||||
|
||||
#build-grid {
|
||||
padding: 10px;
|
||||
margin: 0px;
|
||||
border: 0px;
|
||||
/* border-radius: 8px; */
|
||||
background-color: #c4ccd8;
|
||||
/* #b6bfca; */
|
||||
|
||||
display: none;
|
||||
/* display: grid; */
|
||||
grid-template-columns: repeat(auto-fit, minmax(292px, 1fr));
|
||||
grid-auto-rows: minmax(auto, auto);
|
||||
grid-gap: 15px;
|
||||
|
||||
position: relative;
|
||||
bottom: 0px;
|
||||
/* left: 0px; */
|
||||
z-index: 12;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.build-grid-module {
|
||||
/* box-shadow: 0px 1px 4px #234; */
|
||||
padding: 7px;
|
||||
/* margin: 4px; */
|
||||
line-height: 150%;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
font-size: 0.65em;
|
||||
/* display: flex; */
|
||||
}
|
||||
|
||||
.build-grid-module:hover {
|
||||
background-color: #efeff5;
|
||||
}
|
||||
|
||||
.gun-module {
|
||||
background: #d5dde5;
|
||||
}
|
||||
|
||||
.field-module {
|
||||
background: #bde;
|
||||
}
|
||||
|
||||
.mod-module {
|
||||
background: #fdf;
|
||||
}
|
||||
|
||||
|
||||
/* #build {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 1px;
|
||||
z-index: 12;
|
||||
font-size: 1.3em;
|
||||
} */
|
||||
#settings {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 1px;
|
||||
z-index: 12;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
#controls {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 1px;
|
||||
z-index: 12;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
#details-div {
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
#dmg {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: none;
|
||||
background-color: #f67;
|
||||
opacity: 0;
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
#health-bg {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
height: 20px;
|
||||
width: 300px;
|
||||
background-color: #000;
|
||||
opacity: 0.1;
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#health {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
height: 20px;
|
||||
width: 0px;
|
||||
transition: width 1s ease-out;
|
||||
opacity: 0.6;
|
||||
z-index: 2;
|
||||
pointer-events: none;
|
||||
background-color: #f00;
|
||||
}
|
||||
|
||||
.low-health {
|
||||
animation: blink 250ms infinite alternate;
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
from {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0.2;
|
||||
}
|
||||
}
|
||||
|
||||
#fade-out {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
opacity: 1;
|
||||
transition: opacity 3s;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#guns {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 15px;
|
||||
z-index: 2;
|
||||
font-size: 23px;
|
||||
color: #111;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
padding: 0px 5px 0px 5px;
|
||||
border-radius: 5px;
|
||||
/*border: 2px solid rgba(0, 0, 0, 0.4);*/
|
||||
}
|
||||
|
||||
#field {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
z-index: 2;
|
||||
font-size: 23px;
|
||||
color: #000;
|
||||
text-align: right;
|
||||
opacity: 0.7;
|
||||
line-height: 140%;
|
||||
background-color: rgba(190, 210, 245, 0.25);
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
padding: 0px 5px 0px 5px;
|
||||
border-radius: 5px;
|
||||
/*border: 2px solid rgba(0, 0, 0, 0.4);*/
|
||||
}
|
||||
|
||||
#mods {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
right: 15px;
|
||||
z-index: 2;
|
||||
font-size: 20px;
|
||||
color: #000;
|
||||
text-align: right;
|
||||
opacity: 0.35;
|
||||
line-height: 140%;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
padding: 0px 5px 0px 5px;
|
||||
border-radius: 5px;
|
||||
/*border: 2px solid rgba(0, 0, 0, 0.4);*/
|
||||
}
|
||||
|
||||
#text-log {
|
||||
/* position: absolute;
|
||||
top: 20px;
|
||||
left: 0;
|
||||
width: 100%; */
|
||||
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
/* left: 50%; */
|
||||
/* transform: translate(-50%, 0); */
|
||||
|
||||
padding: 10px;
|
||||
border-radius: 10px;
|
||||
|
||||
/* text-align: center; */
|
||||
line-height: 150%;
|
||||
font-size: 1.25em;
|
||||
color: #000;
|
||||
background-color: rgba(255, 255, 255, 0.23);
|
||||
|
||||
opacity: 0;
|
||||
transition: opacity 0.5s;
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
em {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.mouse-icon {
|
||||
margin-bottom: -20px;
|
||||
}
|
||||
|
||||
.color-f {
|
||||
color: #0ad;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.color-d {
|
||||
color: #f03;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.color-h {
|
||||
color: #0b7;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.color-e {
|
||||
color: #d60;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.faded {
|
||||
opacity: 0.7;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
.circle {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-bottom: -2px;
|
||||
}
|
||||
|
||||
.circle-grid {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-bottom: -4px;
|
||||
}
|
||||
|
||||
.field {
|
||||
background: #0cf;
|
||||
}
|
||||
|
||||
.mod {
|
||||
background: #96e;
|
||||
}
|
||||
|
||||
.gun {
|
||||
background: #149;
|
||||
}
|
||||
|
||||
.heal {
|
||||
background: #0d9;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 3px 8px 3px 8px;
|
||||
border: 2px solid #444;
|
||||
border-radius: 4px;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: 360px 10px;
|
||||
align-self: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.grid-box {
|
||||
align-self: center;
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
.right {
|
||||
text-align: right;
|
||||
}
|
||||
Reference in New Issue
Block a user