Plausible parabolas
This commit is contained in:
@@ -3,6 +3,10 @@ import { LayeredTileFactory } from './layered_tile_factory.js';
|
||||
import { Tile } from './tile.js';
|
||||
import { TileFactory } from './tile_factory.js';
|
||||
|
||||
function get_distance(x: number, y: number) {
|
||||
return Math.sqrt(x ** 2 + y ** 2);
|
||||
}
|
||||
|
||||
export class ProjectileTileFactory extends TileFactory {
|
||||
source_tile_factory: AnimatableTileFactory;
|
||||
target_relative_x: number;
|
||||
@@ -24,7 +28,18 @@ export class ProjectileTileFactory extends TileFactory {
|
||||
this.loft = loft;
|
||||
|
||||
const copy = tile_factory.copy();
|
||||
const distance = Math.sqrt(target_relative_x ** 2 + target_relative_y ** 2);
|
||||
|
||||
const top = Math.min(0, target_relative_y) - loft;
|
||||
let h1_distance = get_distance(target_relative_x / 2, top);
|
||||
let h2_distance = get_distance(target_relative_x / 2, target_relative_y - top);
|
||||
let total_distance = h1_distance + h2_distance;
|
||||
let vertex_offset = h1_distance / total_distance;
|
||||
for (let i = 0; i < 5; i++) {
|
||||
h1_distance = get_distance(target_relative_x * vertex_offset, top);
|
||||
h2_distance = get_distance(target_relative_x * (1 - vertex_offset), target_relative_y - top);
|
||||
total_distance = h1_distance + h2_distance;
|
||||
vertex_offset = h1_distance / total_distance;
|
||||
}
|
||||
|
||||
copy.add_animation(
|
||||
'launch-x',
|
||||
@@ -38,11 +53,11 @@ export class ProjectileTileFactory extends TileFactory {
|
||||
{
|
||||
'offset': 1.0,
|
||||
'left': `${target_relative_x / tile_factory.width * 100}%`,
|
||||
'transform': `rotate(${Math.sign(target_relative_x) * distance * spin * 10}deg)`,
|
||||
'transform': `rotate(${Math.sign(target_relative_x) * total_distance * spin * 10}deg)`,
|
||||
},
|
||||
],
|
||||
{
|
||||
'duration': distance / speed * 100,
|
||||
'duration': total_distance / speed * 100,
|
||||
'iterations': 1,
|
||||
},
|
||||
);
|
||||
@@ -56,9 +71,9 @@ export class ProjectileTileFactory extends TileFactory {
|
||||
'top': '0',
|
||||
},
|
||||
{
|
||||
'offset': 0.50 - Math.abs(target_relative_y / distance * 0.50),
|
||||
'offset': vertex_offset,
|
||||
'easing': 'cubic-bezier(0.33, 0.00, 0.66, 0.33)',
|
||||
'top': `${((-1 * loft / tile_factory.height) + ((target_relative_y / distance) * (loft / tile_factory.height))) * 100}%`,
|
||||
'top': `${top / tile_factory.height * 100}%`,
|
||||
},
|
||||
{
|
||||
'offset': 1.0,
|
||||
@@ -66,7 +81,7 @@ export class ProjectileTileFactory extends TileFactory {
|
||||
},
|
||||
],
|
||||
{
|
||||
'duration': distance / speed * 100,
|
||||
'duration': total_distance / speed * 100,
|
||||
'iterations': 1,
|
||||
},
|
||||
);
|
||||
|
||||
@@ -86,10 +86,10 @@ export function main() {
|
||||
return Math.random() * (max - min) + min;
|
||||
}
|
||||
|
||||
const tower = grid.add_tile(tiles.TOWER_FIREBALL1, 30, 18);
|
||||
const tower = grid.add_tile(tiles.TOWER_FIREBALL1, 30, 28);
|
||||
setInterval(() => {
|
||||
tower.play('fire');
|
||||
grid.add_tile(new ProjectileTileFactory(tiles.FIREBALL, rand(-20, 20), rand(-10, 20), 5, 1.5, 10), 31, 17);
|
||||
grid.add_tile(new ProjectileTileFactory(tiles.FIREBALL, rand(-20, 20), rand(-10, 20), 5, 1.5, 5), 31, 27);
|
||||
}, 3250);
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user