special fx for nukes

index.html

@@ -17,6 +17,6 @@
   </style>
 </head>
 <body>
-  <script type="module" src="src/main.js?v=7"></script>
+  <script type="module" src="src/main.js?v=8"></script>
 </body>
 </html>

src/ai.js

@@ -1,5 +1,5 @@
-import {PLAYER_MAX_ENERGY, PLAYER_INITIAL_POWER, PLAYER_ENERGY_POWER_MULTIPLIER} from './constants.js?v=7';
+import {PLAYER_MAX_ENERGY, PLAYER_INITIAL_POWER, PLAYER_ENERGY_POWER_MULTIPLIER} from './constants.js?v=8';
-import {randomInt} from './math.js?v=7';
+import {randomInt} from './math.js?v=8';
 
 export const AI_TYPES = {
 

src/constants.js

@@ -30,8 +30,8 @@ export const WEAPON_TYPES = {
   tracer: {id:'tracer', name:'Tracer', projectile:{type:'normal'}, explosion:{type:'tracer'}},
   babyMissile: {id:'babyMissile', name:'Baby Missile', projectile:{type:'normal'}, explosion:{type:'blast', r:5}},
   missile: {id:'missile', name:'Missile', projectile:{type:'normal'}, explosion:{type:'blast', r:20}},
-  babyNuke: {id:'babyNuke', name:'Baby Nuke', projectile:{type:'normal'}, explosion:{type:'blast', r:50}},
+  babyNuke: {id:'babyNuke', name:'Baby Nuke', projectile:{type:'normal'}, explosion:{type:'lava', r:50}},
-  nuke: {id:'nuke', name:'Nuke', projectile:{type:'normal'}, explosion:{type:'blast', r:100}},
+  nuke: {id:'nuke', name:'Nuke', projectile:{type:'normal'}, explosion:{type:'lava', r:100}},
   babyNapalm: {id:'babyNapalm', name:'Baby Napalm', projectile:{type:'normal'}, explosion:{type:'napalm', particles:32}},
   napalm: {id:'napalm', name:'Napalm', projectile:{type:'normal'}, explosion:{type:'napalm', particles:64}},
   babyRoller: {id:'babyRoller', name:'Baby Roller', projectile:{type:'roller'}, explosion:{type:'blast', r:15}},

src/gfx.js

@@ -1,6 +1,6 @@
-import {splitWords} from './utils.js?v=7';
+import {splitWords} from './utils.js?v=8';
-import {parable} from './math.js?v=7';
+import {parable} from './math.js?v=8';
-import {FONT_HEIGHT, FONT_WIDTH} from './constants.js?v=7';
+import {FONT_HEIGHT, FONT_WIDTH} from './constants.js?v=8';
 
 export function createCanvas(width, height, readable) {
   const canvas = document.createElement('canvas');

src/input.js

@@ -1,4 +1,4 @@
-import {DEFAULT_KEYPRESS_DELAY} from './constants.js?v=7';
+import {DEFAULT_KEYPRESS_DELAY} from './constants.js?v=8';
 
 const input = {};
 let lastKeypressTime = 0;

src/main.js

@@ -1,15 +1,15 @@
-import {AI_TYPES} from './ai.js?v=7';
+import {AI_TYPES} from './ai.js?v=8';
-import {DEATH_SPECS, EXPLOSION_SHAKE_REDUCTION_FACTOR, H, MAX_EXPLOSION_SHAKE_FACTOR, MAX_WIND, PARTICLE_AMOUNT, PARTICLE_FADE_AMOUNT, PARTICLE_MAX_POWER_FACTOR, PARTICLE_MIN_LIFETIME, PARTICLE_MIN_POWER_FACTOR, PARTICLE_POWER_REDUCTION_FACTOR, PARTICLE_TIME_FACTOR, PARTICLE_WIND_REDUCTION_FACTOR, PLAYER_ANGLE_FAST_INCREMENT, PLAYER_ANGLE_INCREMENT, PLAYER_ANGLE_TICK_SOUND_INTERVAL, PLAYER_COLORS, PLAYER_ENERGY_POWER_MULTIPLIER, PLAYER_EXPLOSION_PARTICLE_POWER, PLAYER_FALL_DAMAGE_FACTOR, PLAYER_FALL_DAMAGE_HEIGHT, PLAYER_INITIAL_POWER, PLAYER_MAX_ENERGY, PLAYER_POWER_FAST_INCREMENT, PLAYER_POWER_INCREMENT, PLAYER_POWER_TICK_SOUND_INTERVAL, PLAYER_STARTING_TOOLS, PLAYER_STARTING_WEAPONS, PLAYER_TANK_BOUNDING_RADIUS, PLAYER_TANK_Y_FOOTPRINT, SHIELD_TYPES, TRAJECTORY_FADE_SPEED, TRAJECTORY_FLOAT_SPEED, W, WEAPON_TYPES, Z, STARTING_SCORE, SCORE_PER_KILL, SCORE_FOR_WIN, MARKET_ITEMS, NAPALM_SPAWN_RATE, FIRE_DURATION, FIRE_DAMAGE} from './constants.js?v=7';
+import {DEATH_SPECS, EXPLOSION_SHAKE_REDUCTION_FACTOR, H, MAX_EXPLOSION_SHAKE_FACTOR, MAX_WIND, PARTICLE_AMOUNT, PARTICLE_FADE_AMOUNT, PARTICLE_MAX_POWER_FACTOR, PARTICLE_MIN_LIFETIME, PARTICLE_MIN_POWER_FACTOR, PARTICLE_POWER_REDUCTION_FACTOR, PARTICLE_TIME_FACTOR, PARTICLE_WIND_REDUCTION_FACTOR, PLAYER_ANGLE_FAST_INCREMENT, PLAYER_ANGLE_INCREMENT, PLAYER_ANGLE_TICK_SOUND_INTERVAL, PLAYER_COLORS, PLAYER_ENERGY_POWER_MULTIPLIER, PLAYER_EXPLOSION_PARTICLE_POWER, PLAYER_FALL_DAMAGE_FACTOR, PLAYER_FALL_DAMAGE_HEIGHT, PLAYER_INITIAL_POWER, PLAYER_MAX_ENERGY, PLAYER_POWER_FAST_INCREMENT, PLAYER_POWER_INCREMENT, PLAYER_POWER_TICK_SOUND_INTERVAL, PLAYER_STARTING_TOOLS, PLAYER_STARTING_WEAPONS, PLAYER_TANK_BOUNDING_RADIUS, PLAYER_TANK_Y_FOOTPRINT, SHIELD_TYPES, TRAJECTORY_FADE_SPEED, TRAJECTORY_FLOAT_SPEED, W, WEAPON_TYPES, Z, STARTING_SCORE, SCORE_PER_KILL, SCORE_FOR_WIN, MARKET_ITEMS, NAPALM_SPAWN_RATE, FIRE_DURATION, FIRE_DAMAGE} from './constants.js?v=8';
-import {createCanvas, drawLine, drawRect, drawSemiCircle, drawText, loop, plot, strokeCircle} from './gfx.js?v=7';
+import {createCanvas, drawLine, drawRect, drawSemiCircle, drawText, loop, plot, strokeCircle} from './gfx.js?v=8';
-import {afterKeyDelay, key} from './input.js?v=7';
+import {afterKeyDelay, key} from './input.js?v=8';
-import {clamp, deg2rad, distance, parable, random, randomInt, vec, wrap} from './math.js?v=7';
+import {clamp, deg2rad, distance, parable, random, randomInt, vec, wrap} from './math.js?v=8';
-import {PROJECTILE_TYPES} from './projectiles.js?v=7';
+import {PROJECTILE_TYPES} from './projectiles.js?v=8';
-import {generateSky} from './sky.js?v=7';
+import {generateSky} from './sky.js?v=8';
-import {playTickSound} from './sound.js?v=7';
+import {playTickSound} from './sound.js?v=8';
-import {clipTerrain, closestLand, collapseTerrain, generateTerrain, isTerrain, landHeight, startCollapseTerrain, collapseTerrainStep} from './terrain.js?v=7';
+import {clipTerrain, closestLand, collapseTerrain, generateTerrain, isTerrain, landHeight, startCollapseTerrain, collapseTerrainStep} from './terrain.js?v=8';
-import {sample, shuffle} from './utils.js?v=7';
+import {sample, shuffle} from './utils.js?v=8';
-import {EXPLOSION_TYPES} from './weapons.js?v=7';
+import {EXPLOSION_TYPES} from './weapons.js?v=8';
-import {drawPanelBg, drawPanelTitle, drawPanelText, drawPanelDivider, drawPanelMenu, getPanelBounds} from './panel.js?v=7';
+import {drawPanelBg, drawPanelTitle, drawPanelText, drawPanelDivider, drawPanelMenu, getPanelBounds} from './panel.js?v=8';
 
 
 let state = 'start-game';

src/panel.js

@@ -1,5 +1,5 @@
-import {PANEL_WIDTH, PANEL_HEIGHT, PANEL_FONT_SIZE, PANEL_TITLE_FONT_SIZE, PANEL_BG_COLOR, PANEL_BORDER_COLOR, W, H, FONT_WIDTH} from './constants.js?v=7';
+import {PANEL_WIDTH, PANEL_HEIGHT, PANEL_FONT_SIZE, PANEL_TITLE_FONT_SIZE, PANEL_BG_COLOR, PANEL_BORDER_COLOR, W, H, FONT_WIDTH} from './constants.js?v=8';
-import {drawRect, drawLine} from './gfx.js?v=7';
+import {drawRect, drawLine} from './gfx.js?v=8';
 
 const PANEL_X = (W - PANEL_WIDTH) / 2;
 const PANEL_Y = (H - PANEL_HEIGHT) / 2;

src/projectiles.js

@@ -1,10 +1,10 @@
-import {H, PROJECTILE_ITERATIONS_PER_FRAME, PROJECTILE_ITERATION_PROGRESS, PROJECTILE_MAX_SOUND_FREQUENCY, PROJECTILE_MIN_SOUND_FREQUENCY, PROJECTILE_POWER_REDUCTION_FACTOR, PROJECTILE_WIND_REDUCTION_FACTOR, WEAPON_TYPES, PLAYER_TANK_Y_FOOTPRINT} from './constants.js?v=7';
+import {H, PROJECTILE_ITERATIONS_PER_FRAME, PROJECTILE_ITERATION_PROGRESS, PROJECTILE_MAX_SOUND_FREQUENCY, PROJECTILE_MIN_SOUND_FREQUENCY, PROJECTILE_POWER_REDUCTION_FACTOR, PROJECTILE_WIND_REDUCTION_FACTOR, WEAPON_TYPES, PLAYER_TANK_Y_FOOTPRINT} from './constants.js?v=8';
-import {checkLineWith, drawLineVirtual} from './gfx.js?v=7';
+import {checkLineWith, drawLineVirtual} from './gfx.js?v=8';
-import {createParticles, isTank, isTankShield, spawnNapalm, tracerMode} from './main.js?v=7';
+import {createParticles, isTank, isTankShield, spawnNapalm, tracerMode} from './main.js?v=8';
-import {deg2rad, parable, rad2deg, wrap} from './math.js?v=7';
+import {deg2rad, parable, rad2deg, wrap} from './math.js?v=8';
-import {audio, createOsc} from './sound.js?v=7';
+import {audio, createOsc} from './sound.js?v=8';
-import {isTerrain, landHeight} from './terrain.js?v=7';
+import {isTerrain, landHeight} from './terrain.js?v=8';
-import {EXPLOSION_TYPES} from './weapons.js?v=7';
+import {EXPLOSION_TYPES} from './weapons.js?v=8';
 
 
 export const PROJECTILE_TYPES = {

src/sky.js

@@ -1,7 +1,7 @@
-import {SKY_COLORS} from './constants.js?v=7';
+import {SKY_COLORS} from './constants.js?v=8';
-import {drawRect} from './gfx.js?v=7';
+import {drawRect} from './gfx.js?v=8';
-import {gradient} from './math.js?v=7';
+import {gradient} from './math.js?v=8';
-import {sample} from './utils.js?v=7';
+import {sample} from './utils.js?v=8';
 
 export function generateSky(ctx) {
   const {width, height} = ctx.canvas;

src/sound.js

@@ -1,4 +1,4 @@
-import {SOUND_MUSIC_VOLUME, SOUND_SFX_VOLUME} from './constants.js?v=7';
+import {SOUND_MUSIC_VOLUME, SOUND_SFX_VOLUME} from './constants.js?v=8';
 
 // @ts-ignore
 export const audio = new (window.AudioContext || window.webkitAudioContext)();

src/terrain.js

@@ -1,6 +1,6 @@
-import {clipCanvas, drawCircle, drawRect} from './gfx.js?v=7';
+import {clipCanvas, drawCircle, drawRect} from './gfx.js?v=8';
-import {clamp, coords2index, random, randomInt} from './math.js?v=7';
+import {clamp, coords2index, random, randomInt} from './math.js?v=8';
-import {sample} from './utils.js?v=7';
+import {sample} from './utils.js?v=8';
 
 let cachedImageData;
 

src/utils.js

@@ -1,4 +1,4 @@
-import {randomInt} from './math.js?v=7';
+import {randomInt} from './math.js?v=8';
 
 export function sample(arr) {
   return arr[randomInt(0, arr.length-1)];

src/weapons.js

@@ -1,8 +1,8 @@
-import {PLAYER_TANK_BOUNDING_RADIUS, PLAYER_TANK_Y_FOOTPRINT, SHIELD_TYPES} from './constants.js?v=7';
+import {PLAYER_TANK_BOUNDING_RADIUS, PLAYER_TANK_Y_FOOTPRINT, SHIELD_TYPES} from './constants.js?v=8';
-import {drawCircle, plot} from './gfx.js?v=7';
+import {drawCircle, plot} from './gfx.js?v=8';
-import {clamp, cycle, distance, randomInt} from './math.js?v=7';
+import {clamp, cycle, distance, randomInt} from './math.js?v=8';
-import {audio, createOsc} from './sound.js?v=7';
+import {audio, createOsc} from './sound.js?v=8';
-import {clipTerrain} from './terrain.js?v=7';
+import {clipTerrain} from './terrain.js?v=8';
 
 export function drawExplosion(ctx, x, y, r) {
   const step = Math.max(1, Math.floor(r / 12));
@@ -20,6 +20,22 @@ export function drawDirt(ctx, x, y, r, c) {
   drawCircle(ctx, x, y, r, c);
 }
 
+export function drawLavaExplosion(ctx, x, y, r) {
+  drawCircle(ctx, x, y, r, 'rgb(60, 0, 0)');
+  const count = Math.floor(r * 1.2);
+  for (let i = 0; i < count; i++) {
+    const dist = Math.random() * r;
+    const angle = Math.random() * Math.PI * 2;
+    const sx = x + Math.cos(angle) * dist;
+    const sy = y + Math.sin(angle) * dist;
+    const spotR = Math.max(1, Math.random() * (2 + r * 0.03));
+    const heat = 1 - dist / r;
+    const red = 180 + Math.floor(Math.random() * 75);
+    const green = Math.floor(Math.random() * heat * 150);
+    drawCircle(ctx, sx, sy, spotR, `rgb(${red}, ${green}, 0)`);
+  }
+}
+
 export const EXPLOSION_TYPES = {
   tracer: {
     create(spec, x, y) {
@@ -66,6 +82,41 @@ export const EXPLOSION_TYPES = {
       }
     }
   },
+  lava: {
+    create(spec, x, y) {
+      const {r} = spec;
+      const osc = createOsc('sawtooth');
+      osc.start();
+      return {type:'lava', x, y, r, cr:0, osc};
+    },
+    update(explosion, dt) {
+      return (explosion.cr += dt * 30) < explosion.r;
+    },
+    draw(explosion, foreground) {
+      const {x, y, cr, osc} = explosion;
+      const f = cycle(explosion.cr, 6) % 2 === 0 ? 55 : 110;
+      osc.frequency.setValueAtTime(f, audio.currentTime);
+      drawLavaExplosion(foreground, x, y, cr);
+    },
+    stop(explosion) {
+      const {osc} = explosion;
+      osc.stop();
+    },
+    clip(explosion, terrain) {
+      const {x, y, cr} = explosion;
+      clipTerrain(terrain, (ctx) => drawCircle(ctx, x, y, cr, '#000'));
+    },
+    damage(explosion, player) {
+      const {x, y, r} = explosion;
+      const dist = distance(x, y, player.x, player.y+PLAYER_TANK_Y_FOOTPRINT);
+      const overlap = clamp(0, dist - r, Infinity);
+      const shieldType = player.shield ? SHIELD_TYPES[player.shield.type] : null;
+      const radius = PLAYER_TANK_BOUNDING_RADIUS + (shieldType? shieldType.r : 0);
+      if (overlap <= radius) {
+        return Math.round(100 * (1 - overlap / (radius+1)));
+      }
+    }
+  },
   dirt: {
     create(spec, x, y) {
       const {r} = spec;