Hacky projectile system

This commit is contained in:
Ian Gulliver
2021-05-11 05:17:16 +00:00
parent ffe531d5e5
commit 4e65819183
27 changed files with 170 additions and 159 deletions

View File

@@ -17,9 +17,11 @@ export class LayeredTile extends Tile {
}
}
play(name) {
let ret = undefined;
for (const tile of this.tiles) {
tile.play(name);
ret = tile.play(name) || ret;
}
return ret;
}
}
//# sourceMappingURL=layered_tile.js.map

View File

@@ -1 +1 @@
{"version":3,"file":"layered_tile.js","sourceRoot":"","sources":["../ts/layered_tile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,OAAO,WAAY,SAAQ,IAAI;IAGnC,YAAY,KAAa,EAAE,MAAc,EAAE,KAAa;QACtD,KAAK,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QACrB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAEhB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;QAEtC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACrC,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;YACtB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAEtB,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACjC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;YAC/B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;YAChC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;YACtC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;YAC1B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,CAAC;YAC3B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC,EAAE,CAAC;SACjC;IACH,CAAC;IAED,IAAI,CAAC,IAAY;QACf,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE;YAC7B,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACjB;IACH,CAAC;CACF"}
{"version":3,"file":"layered_tile.js","sourceRoot":"","sources":["../ts/layered_tile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,OAAO,WAAY,SAAQ,IAAI;IAGnC,YAAY,KAAa,EAAE,MAAc,EAAE,KAAa;QACtD,KAAK,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QACrB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAEhB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;QAEtC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACrC,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;YACtB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAEtB,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACjC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;YAC/B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;YAChC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;YACtC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;YAC1B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,CAAC;YAC3B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC,EAAE,CAAC;SACjC;IACH,CAAC;IAED,IAAI,CAAC,IAAY;QACf,IAAI,GAAG,GAAG,SAAS,CAAC;QACpB,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE;YAC7B,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,CAAC;SAC9B;QACD,OAAO,GAAG,CAAC;IACb,CAAC;CACF"}

View File

@@ -12,5 +12,8 @@ export class LayeredTileFactory extends TileFactory {
}
return new LayeredTile(this.width, this.height, tiles);
}
copy() {
return new LayeredTileFactory(this.tile_factories);
}
}
//# sourceMappingURL=layered_tile_factory.js.map

View File

@@ -1 +1 @@
{"version":3,"file":"layered_tile_factory.js","sourceRoot":"","sources":["../ts/layered_tile_factory.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,OAAO,kBAAmB,SAAQ,WAAW;IAGjD,YAAY,cAA6B;QACvC,KAAK,CACH,cAAc,CAAC,CAAC,CAAC,CAAC,UAAU,EAC5B,cAAc,CAAC,CAAC,CAAC,CAAC,KAAK,EACvB,cAAc,CAAC,CAAC,CAAC,CAAC,MAAM,CACzB,CAAC;QACF,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC;IACvC,CAAC;IAED,KAAK,CAAC,OAAe;QACnB,MAAM,KAAK,GAAG,EAAE,CAAC;QAEjB,KAAK,MAAM,YAAY,IAAI,IAAI,CAAC,cAAc,EAAE;YAC9C,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;SACzC;QAED,OAAO,IAAI,WAAW,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACzD,CAAC;CACF"}
{"version":3,"file":"layered_tile_factory.js","sourceRoot":"","sources":["../ts/layered_tile_factory.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,OAAO,kBAAmB,SAAQ,WAAW;IAGjD,YAAY,cAA6B;QACvC,KAAK,CACH,cAAc,CAAC,CAAC,CAAC,CAAC,UAAU,EAC5B,cAAc,CAAC,CAAC,CAAC,CAAC,KAAK,EACvB,cAAc,CAAC,CAAC,CAAC,CAAC,MAAM,CACzB,CAAC;QACF,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC;IACvC,CAAC;IAED,KAAK,CAAC,OAAe;QACnB,MAAM,KAAK,GAAG,EAAE,CAAC;QAEjB,KAAK,MAAM,YAAY,IAAI,IAAI,CAAC,cAAc,EAAE;YAC9C,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;SACzC;QAED,OAAO,IAAI,WAAW,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACzD,CAAC;IAED,IAAI;QACF,OAAO,IAAI,kBAAkB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IACrD,CAAC;CACF"}

41
js/projectile.js Normal file
View File

@@ -0,0 +1,41 @@
import { LayeredTileFactory } from './layered_tile_factory.js';
export function projectile(simple_tile_factory) {
const copy = simple_tile_factory.copy();
copy.add_animation('launch-x', [
{
'offset': 0.0,
'easing': 'linear',
'left': '0',
'transform': 'rotate(0)',
},
{
'offset': 1.0,
'left': '1000%',
'transform': 'rotate(720deg)',
},
], {
'duration': 1500,
'iterations': 1,
});
copy.add_animation('launch-y', [
{
'offset': 0.0,
'easing': 'cubic-bezier(0.33, 0.66, 0.66, 1.00)',
'top': '0',
},
{
'offset': 0.50,
'easing': 'cubic-bezier(0.33, 0.00, 0.66, 0.33)',
'top': '-500%',
},
{
'offset': 1.0,
'top': '0',
},
], {
'duration': 1500,
'iterations': 1,
});
return new LayeredTileFactory([copy]);
}
//# sourceMappingURL=projectile.js.map

1
js/projectile.js.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"projectile.js","sourceRoot":"","sources":["../ts/projectile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAI/D,MAAM,UAAU,UAAU,CAAC,mBAAsC;IAC/D,MAAM,IAAI,GAAG,mBAAmB,CAAC,IAAI,EAAE,CAAC;IAExC,IAAI,CAAC,aAAa,CAChB,UAAU,EACV;QACE;YACE,QAAQ,EAAE,GAAG;YACb,QAAQ,EAAE,QAAQ;YAClB,MAAM,EAAE,GAAG;YACX,WAAW,EAAE,WAAW;SACzB;QACD;YACE,QAAQ,EAAE,GAAG;YACb,MAAM,EAAE,OAAO;YACf,WAAW,EAAE,gBAAgB;SAC9B;KACF,EACD;QACE,UAAU,EAAE,IAAI;QAChB,YAAY,EAAE,CAAC;KAChB,CACF,CAAC;IAEF,IAAI,CAAC,aAAa,CAChB,UAAU,EACV;QACE;YACE,QAAQ,EAAE,GAAG;YACb,QAAQ,EAAE,sCAAsC;YAChD,KAAK,EAAE,GAAG;SACX;QACD;YACE,QAAQ,EAAE,IAAI;YACd,QAAQ,EAAE,sCAAsC;YAChD,KAAK,EAAE,OAAO;SACf;QACD;YACE,QAAQ,EAAE,GAAG;YACb,KAAK,EAAE,GAAG;SACX;KACF,EACD;QACE,UAAU,EAAE,IAAI;QAChB,YAAY,EAAE,CAAC;KAChB,CACF,CAAC;IAEF,OAAO,IAAI,kBAAkB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,CAAC"}

View File

@@ -9,7 +9,10 @@ export class SimpleTile extends Tile {
play(name) {
const animation = this.animations.get(name);
if (animation) {
this.elem.animate(...animation);
return this.elem.animate(...animation);
}
else {
return undefined;
}
}
}

View File

@@ -1 +1 @@
{"version":3,"file":"simple_tile.js","sourceRoot":"","sources":["../ts/simple_tile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,OAAO,UAAW,SAAQ,IAAI;IAGlC,YAAY,KAAa,EAAE,MAAc,EAAE,SAAiB,EAAE,UAA6C;QACzG,KAAK,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QAErB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,eAAe,GAAG,QAAQ,kBAAkB,CAAC,SAAS,CAAC,IAAI,CAAC;QAC5E,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,GAAG,OAAO,CAAC;QAEzC,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;IAC/B,CAAC;IAED,IAAI,CAAC,IAAY;QACf,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QAC5C,IAAI,SAAS,EAAE;YACb,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,SAAS,CAAC,CAAC;SACjC;IACH,CAAC;CACF"}
{"version":3,"file":"simple_tile.js","sourceRoot":"","sources":["../ts/simple_tile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,OAAO,UAAW,SAAQ,IAAI;IAGlC,YAAY,KAAa,EAAE,MAAc,EAAE,SAAiB,EAAE,UAA6C;QACzG,KAAK,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QAErB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,eAAe,GAAG,QAAQ,kBAAkB,CAAC,SAAS,CAAC,IAAI,CAAC;QAC5E,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,GAAG,OAAO,CAAC;QAEzC,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;IAC/B,CAAC;IAED,IAAI,CAAC,IAAY;QACf,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QAC5C,IAAI,SAAS,EAAE;YACb,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,SAAS,CAAC,CAAC;SACxC;aAAM;YACL,OAAO,SAAS,CAAC;SAClB;IACH,CAAC;CACF"}

View File

@@ -12,6 +12,13 @@ export class SimpleTileFactory extends TileFactory {
build(tileset) {
return new SimpleTile(this.width, this.height, `images/${tileset}/${this.name}.svg`, this.animations);
}
copy() {
const stf = new SimpleTileFactory(this.layer_name, this.width, this.height, this.name);
for (const [name, [keyframes, options]] of this.animations) {
stf.add_animation(name, keyframes, options);
}
return stf;
}
}
/*
function string_to_mask(mask_string: string): boolean[][] {

View File

@@ -1 +1 @@
{"version":3,"file":"simple_tile_factory.js","sourceRoot":"","sources":["../ts/simple_tile_factory.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,OAAO,iBAAkB,SAAQ,WAAW;IAIhD,YAAY,UAAkB,EAAE,KAAa,EAAE,MAAc,EAAE,IAAY;QACzE,KAAK,CAAC,UAAU,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QACjC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,EAAE,CAAC;IAC9B,CAAC;IAED,aAAa,CAAC,IAAY,EAAE,SAAqB,EAAE,OAAe;QAChE,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;IAClD,CAAC;IAED,KAAK,CAAC,OAAe;QACnB,OAAO,IAAI,UAAU,CACnB,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,MAAM,EACX,UAAU,OAAO,IAAI,IAAI,CAAC,IAAI,MAAM,EACpC,IAAI,CAAC,UAAU,CAChB,CAAC;IACJ,CAAC;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;;EAuBE"}
{"version":3,"file":"simple_tile_factory.js","sourceRoot":"","sources":["../ts/simple_tile_factory.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,OAAO,iBAAkB,SAAQ,WAAW;IAIhD,YAAY,UAAkB,EAAE,KAAa,EAAE,MAAc,EAAE,IAAY;QACzE,KAAK,CAAC,UAAU,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QACjC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,EAAE,CAAC;IAC9B,CAAC;IAED,aAAa,CAAC,IAAY,EAAE,SAAqB,EAAE,OAAe;QAChE,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;IAClD,CAAC;IAED,KAAK,CAAC,OAAe;QACnB,OAAO,IAAI,UAAU,CACnB,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,MAAM,EACX,UAAU,OAAO,IAAI,IAAI,CAAC,IAAI,MAAM,EACpC,IAAI,CAAC,UAAU,CAChB,CAAC;IACJ,CAAC;IAED,IAAI;QACF,MAAM,GAAG,GAAG,IAAI,iBAAiB,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;QACvF,KAAK,MAAM,CAAC,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,IAAI,IAAI,CAAC,UAAU,EAAE;YAC1D,GAAG,CAAC,aAAa,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;SAC7C;QACD,OAAO,GAAG,CAAC;IACb,CAAC;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;;EAuBE"}

View File

@@ -4,5 +4,8 @@ export class Tile {
this.elem.style.gridColumnEnd = `span ${width}`;
this.elem.style.gridRowEnd = `span ${height}`;
}
remove() {
this.elem.remove();
}
}
//# sourceMappingURL=tile.js.map

View File

@@ -1 +1 @@
{"version":3,"file":"tile.js","sourceRoot":"","sources":["../ts/tile.ts"],"names":[],"mappings":"AAAA,MAAM,OAAgB,IAAI;IAGxB,YAAY,KAAa,EAAE,MAAc;QACvC,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1C,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,GAAG,QAAQ,KAAK,EAAE,CAAC;QAChD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,MAAM,EAAE,CAAC;IAChD,CAAC;CAGF"}
{"version":3,"file":"tile.js","sourceRoot":"","sources":["../ts/tile.ts"],"names":[],"mappings":"AAAA,MAAM,OAAgB,IAAI;IAGxB,YAAY,KAAa,EAAE,MAAc;QACvC,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1C,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,GAAG,QAAQ,KAAK,EAAE,CAAC;QAChD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,MAAM,EAAE,CAAC;IAChD,CAAC;IAID,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;IACrB,CAAC;CACF"}

View File

@@ -1 +1 @@
{"version":3,"file":"tile_factory.js","sourceRoot":"","sources":["../ts/tile_factory.ts"],"names":[],"mappings":"AAEA,MAAM,OAAgB,WAAW;IAK/B,YAAY,UAAkB,EAAE,KAAa,EAAE,MAAc;QAC3D,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,CAAC;CAGF"}
{"version":3,"file":"tile_factory.js","sourceRoot":"","sources":["../ts/tile_factory.ts"],"names":[],"mappings":"AAEA,MAAM,OAAgB,WAAW;IAK/B,YAAY,UAAkB,EAAE,KAAa,EAAE,MAAc;QAC3D,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,CAAC;CAKF"}

View File

@@ -55,74 +55,5 @@ export const TOWER_FIREBALL1 = new LayeredTileFactory([
tower_fireball1,
tower_fireball1_front,
]);
/*
class Fireball extends SimpleTileFactory {
get_elem(tileset: string): HTMLElement {
const elem = document.createElement('div');
elem.style.gridColumnEnd = `span ${this.width}`;
elem.style.gridRowEnd = `span ${this.height}`;
elem.style.position = 'relative';
const base = document.createElement('div');
elem.appendChild(base);
base.style.width = '100%';
base.style.height = '100%';
base.style.position = 'absolute';
base.style.top = '0';
base.style.left = '0';
base.style.backgroundImage = `url("images/${tileset}/${this.name}.svg")`;
base.style.backgroundSize = 'cover';
base.style.visibility = 'hidden';
setInterval(() => {
base.animate([
{
'offset': 0.0,
'easing': 'cubic-bezier(0.33, 0.66, 0.66, 1.00)',
'top': '0',
},
{
'offset': 0.50,
'easing': 'cubic-bezier(0.33, 0.00, 0.66, 0.33)',
'top': '-500%',
},
{
'offset': 1.0,
'top': '0',
},
], {
'duration': 1500,
'iterations': 1,
});
base.animate([
{
'offset': 0.0,
'easing': 'linear',
'visibility': 'visible',
'left': '0',
'transform': 'rotate(0)',
},
{
'offset': 1.0,
'visibility': 'hidden',
'left': '1000%',
'transform': 'rotate(720deg)',
},
], {
'duration': 1500,
'iterations': 1,
});
}, 3250);
return elem;
}
}
export const FIREBALL = new Fireball('fireball', 2, 2);
*/
export const FIREBALL = new SimpleTileFactory('projectile', 2, 2, 'fireball');
//# sourceMappingURL=tiles.js.map

View File

@@ -1 +1 @@
{"version":3,"file":"tiles.js","sourceRoot":"","sources":["../ts/tiles.ts"],"names":[],"mappings":"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"}
{"version":3,"file":"tiles.js","sourceRoot":"","sources":["../ts/tiles.ts"],"names":[],"mappings":"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"}

View File

@@ -1,4 +1,5 @@
import { Grid } from './grid.js';
import { projectile } from './projectile.js';
import * as tiles from './tiles.js';
export function main() {
document.body.style.margin = '0';
@@ -20,7 +21,7 @@ export function main() {
const grid = new Grid(real);
grid.set_size(70, 56);
grid.set_tileset('tropical');
grid.set_layers(['road', 'water', 'bridge', 'surface']);
grid.set_layers(['road', 'water', 'bridge', 'surface', 'projectile']);
grid.add_tile(tiles.ROAD_TB, 20, 46);
grid.add_tile(tiles.ROAD_BL, 18, 40);
grid.add_tile(tiles.ROAD_TR, 12, 38);
@@ -74,7 +75,12 @@ export function main() {
grid.add_tile(tiles.BRIDGE_LR, 46, 18);
grid.add_tile(tiles.BRIDGE_LR, 46, 10);
const tower = grid.add_tile(tiles.TOWER_FIREBALL1, 30, 18);
setInterval(() => tower.play('fire'), 3250);
setInterval(() => {
tower.play('fire');
const fireball = grid.add_tile(projectile(tiles.FIREBALL), 31, 17);
fireball.play('launch-x').finished.then(() => fireball.remove());
fireball.play('launch-y');
}, 3250);
}
;
main();

File diff suppressed because one or more lines are too long

View File

@@ -23,9 +23,11 @@ export class LayeredTile extends Tile {
}
}
play(name: string): void {
play(name: string): Animation | undefined {
let ret = undefined;
for (const tile of this.tiles) {
tile.play(name);
ret = tile.play(name) || ret;
}
return ret;
}
}

View File

@@ -22,4 +22,8 @@ export class LayeredTileFactory extends TileFactory {
return new LayeredTile(this.width, this.height, tiles);
}
copy(): LayeredTileFactory {
return new LayeredTileFactory(this.tile_factories);
}
}

54
ts/projectile.ts Normal file
View File

@@ -0,0 +1,54 @@
import { LayeredTileFactory } from './layered_tile_factory.js';
import { SimpleTileFactory } from './simple_tile_factory.js';
import { TileFactory } from './tile_factory.js';
export function projectile(simple_tile_factory: SimpleTileFactory): TileFactory {
const copy = simple_tile_factory.copy();
copy.add_animation(
'launch-x',
[
{
'offset': 0.0,
'easing': 'linear',
'left': '0',
'transform': 'rotate(0)',
},
{
'offset': 1.0,
'left': '1000%',
'transform': 'rotate(720deg)',
},
],
{
'duration': 1500,
'iterations': 1,
},
);
copy.add_animation(
'launch-y',
[
{
'offset': 0.0,
'easing': 'cubic-bezier(0.33, 0.66, 0.66, 1.00)',
'top': '0',
},
{
'offset': 0.50,
'easing': 'cubic-bezier(0.33, 0.00, 0.66, 0.33)',
'top': '-500%',
},
{
'offset': 1.0,
'top': '0',
},
],
{
'duration': 1500,
'iterations': 1,
},
);
return new LayeredTileFactory([copy]);
}

View File

@@ -12,10 +12,12 @@ export class SimpleTile extends Tile {
this.animations = animations;
}
play(name: string): void {
play(name: string): Animation | undefined {
const animation = this.animations.get(name);
if (animation) {
this.elem.animate(...animation);
return this.elem.animate(...animation);
} else {
return undefined;
}
}
}

View File

@@ -23,6 +23,14 @@ export class SimpleTileFactory extends TileFactory {
this.animations,
);
}
copy(): SimpleTileFactory {
const stf = new SimpleTileFactory(this.layer_name, this.width, this.height, this.name);
for (const [name, [keyframes, options]] of this.animations) {
stf.add_animation(name, keyframes, options);
}
return stf;
}
}
/*

View File

@@ -7,5 +7,9 @@ export abstract class Tile {
this.elem.style.gridRowEnd = `span ${height}`;
}
abstract play(name: string): void;
abstract play(name: string): Animation | undefined;
remove(): void {
this.elem.remove();
}
}

View File

@@ -12,4 +12,6 @@ export abstract class TileFactory {
}
abstract build(tileset: string): Tile;
abstract copy(): TileFactory;
}

View File

@@ -74,73 +74,4 @@ export const TOWER_FIREBALL1 = new LayeredTileFactory([
tower_fireball1_front,
]);
/*
class Fireball extends SimpleTileFactory {
get_elem(tileset: string): HTMLElement {
const elem = document.createElement('div');
elem.style.gridColumnEnd = `span ${this.width}`;
elem.style.gridRowEnd = `span ${this.height}`;
elem.style.position = 'relative';
const base = document.createElement('div');
elem.appendChild(base);
base.style.width = '100%';
base.style.height = '100%';
base.style.position = 'absolute';
base.style.top = '0';
base.style.left = '0';
base.style.backgroundImage = `url("images/${tileset}/${this.name}.svg")`;
base.style.backgroundSize = 'cover';
base.style.visibility = 'hidden';
setInterval(() => {
base.animate([
{
'offset': 0.0,
'easing': 'cubic-bezier(0.33, 0.66, 0.66, 1.00)',
'top': '0',
},
{
'offset': 0.50,
'easing': 'cubic-bezier(0.33, 0.00, 0.66, 0.33)',
'top': '-500%',
},
{
'offset': 1.0,
'top': '0',
},
], {
'duration': 1500,
'iterations': 1,
});
base.animate([
{
'offset': 0.0,
'easing': 'linear',
'visibility': 'visible',
'left': '0',
'transform': 'rotate(0)',
},
{
'offset': 1.0,
'visibility': 'hidden',
'left': '1000%',
'transform': 'rotate(720deg)',
},
], {
'duration': 1500,
'iterations': 1,
});
}, 3250);
return elem;
}
}
export const FIREBALL = new Fireball('fireball', 2, 2);
*/
export const FIREBALL = new SimpleTileFactory('projectile', 2, 2, 'fireball');

View File

@@ -1,4 +1,5 @@
import { Grid } from './grid.js';
import { projectile } from './projectile.js'
import * as tiles from './tiles.js';
export function main() {
@@ -24,7 +25,7 @@ export function main() {
const grid = new Grid(real);
grid.set_size(70, 56);
grid.set_tileset('tropical');
grid.set_layers(['road', 'water', 'bridge', 'surface']);
grid.set_layers(['road', 'water', 'bridge', 'surface', 'projectile']);
grid.add_tile(tiles.ROAD_TB, 20, 46);
grid.add_tile(tiles.ROAD_BL, 18, 40);
@@ -82,7 +83,12 @@ export function main() {
grid.add_tile(tiles.BRIDGE_LR, 46, 10);
const tower = grid.add_tile(tiles.TOWER_FIREBALL1, 30, 18);
setInterval(() => tower.play('fire'), 3250);
setInterval(() => {
tower.play('fire');
const fireball = grid.add_tile(projectile(tiles.FIREBALL), 31, 17);
fireball.play('launch-x')!.finished.then(() => fireball.remove());
fireball.play('launch-y');
}, 3250);
};
main();

View File

@@ -18,6 +18,7 @@
"ts/layered_tile.ts",
"ts/layered_tile_factory.ts",
"ts/layer.ts",
"ts/projectile.ts",
"ts/simple_tile.ts",
"ts/simple_tile_factory.ts",
"ts/tile.ts",