Factor out AnimatableTile{Factory}

ts/animatable_tile.ts

@@ -0,0 +1,19 @@
+import { Tile } from './tile.js';
+
+export abstract class AnimatableTile extends Tile {
+  animations: Map<string, [Keyframe[], object]>;
+
+  constructor(width: number, height: number, animations: Map<string, [Keyframe[], object]>) {
+    super(width, height);
+    this.animations = animations;
+  }
+
+  play(name: string): Animation | undefined {
+    const animation = this.animations.get(name);
+    if (animation) {
+      return this.elem.animate(...animation);
+    } else {
+      return undefined;
+    }
+  }
+}

ts/animatable_tile_factory.ts

@@ -0,0 +1,11 @@
+import { TileFactory } from './tile_factory.js';
+
+export abstract class AnimatableTileFactory extends TileFactory {
+  animations: Map<string, [Keyframe[], object]> = new Map();
+
+  add_animation(name: string, keyframes: Keyframe[], options: object) {
+    this.animations.set(name, [keyframes, options]);
+  }
+
+  abstract copy(): AnimatableTileFactory;
+}

ts/projectile.ts

@@ -1,9 +1,9 @@
 import { LayeredTileFactory } from './layered_tile_factory.js';
-import { SimpleTileFactory } from './simple_tile_factory.js';
+import { AnimatableTileFactory } from './animatable_tile_factory.js';
 import { TileFactory } from './tile_factory.js';
 
-export function projectile(simple_tile_factory: SimpleTileFactory): TileFactory {
-  const copy = simple_tile_factory.copy();
+export function projectile(tile_factory: AnimatableTileFactory): TileFactory {
+  const copy = tile_factory.copy();
 
   copy.add_animation(
     'launch-x',

ts/simple_tile.ts

@@ -1,24 +1,11 @@
-import { Tile } from './tile.js';
-
-export class SimpleTile extends Tile {
-  animations: Map<string, [Keyframe[], object]>;
+import { AnimatableTile } from './animatable_tile.js';
 
+export class SimpleTile extends AnimatableTile {
   constructor(width: number, height: number, image_url: string, animations: Map<string, [Keyframe[], object]>) {
-    super(width, height);
+    super(width, height, animations);
 
     this.elem.style.backgroundImage = `url('${encodeURIComponent(image_url)}')`;
     this.elem.style.backgroundSize = 'cover';
-
-    this.animations = animations;
-  }
-
-  play(name: string): Animation | undefined {
-    const animation = this.animations.get(name);
-    if (animation) {
-      return this.elem.animate(...animation);
-    } else {
-      return undefined;
-    }
   }
 }
 

ts/simple_tile_factory.ts

@@ -1,18 +1,12 @@
 import { SimpleTile } from './simple_tile.js';
-import { TileFactory } from './tile_factory.js';
+import { AnimatableTileFactory } from './animatable_tile_factory.js';
 
-export class SimpleTileFactory extends TileFactory {
+export class SimpleTileFactory extends AnimatableTileFactory {
   name: string;
-  animations: Map<string, [Keyframe[], object]>;
 
   constructor(layer_name: string, width: number, height: number, name: string) {
     super(layer_name, width, height);
     this.name = name;
-    this.animations = new Map();
-  }
-
-  add_animation(name: string, keyframes: Keyframe[], options: object) {
-    this.animations.set(name, [keyframes, options]);
   }
 
   build(tileset: string): SimpleTile {