Polished mixin solution
<p dir="auto">Work has continued with <a href="https://apps.spelmakare.se/arw" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">ARW the past weeks. Not much progress with the actual game, been concentrating on reviewing and improving the code before continuing on.
<p dir="auto">I have <a href="https://peakd.com/hive-176981/@smjn/tmos-game-using-mixins-in-typescript" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">previously described the Mixin solution, but would like to revisit it as it got some simplifications that are worth talking about. As with the <a href="https://peakd.com/hive-176981/@smjn/arw-game-a-timer-for-making-sequences-of-events" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">waitDo class, I have <a href="https://github.com/smjnab/mixin" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">uploaded the Mixin class to GitHub.<br />
<center><img src="https://images.hive.blog/768x0/https://files.peakd.com/file/peakd-hive/smjn/23swbmk7Zck6on7C2qv34idGmgqXemLWsiVFeqWJghYdgx9bXNRNJF2rmBcDbGD57XqRe.png" alt="Class using a mixin." srcset="https://images.hive.blog/768x0/https://files.peakd.com/file/peakd-hive/smjn/23swbmk7Zck6on7C2qv34idGmgqXemLWsiVFeqWJghYdgx9bXNRNJF2rmBcDbGD57XqRe.png 1x, https://images.hive.blog/1536x0/https://files.peakd.com/file/peakd-hive/smjn/23swbmk7Zck6on7C2qv34idGmgqXemLWsiVFeqWJghYdgx9bXNRNJF2rmBcDbGD57XqRe.png 2x" /><br />
<h2>Mixin
<p dir="auto">Mixin is a solution based on the alternative solution found on <a href="https://www.typescriptlang.org/docs/handbook/mixins.html" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">TypeScriptLang.org. I wanted a solution that merged with regular class inheritance and where mixins could be initialized in a similar manner as a regular class.
<p dir="auto">The solution is an abstract Mixin class that is used to create new mixins. Check the <a href="https://github.com/smjnab/mixin" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">GitHub page for the code, example and documentation. To keep it short, lets do an example of making a mixin and one example of using that mixin.<br />
<br />A basic mixin that adds a string property to a class:
<pre><code>export class MixinString extends Mixin {
myString: string;
MixinString() {
this.myString = "MyString";
}
MixinStringDestroy() {
delete this.myString;
}
}
<p dir="auto"><br />A class using MixinString to get a string property. The interface is created to get proper type support.
<pre><code>// Class using MixinString
export class MyClass {
constructor(){
Mixin.mixinInits(this, MyClass, MixinString);
}
destroy(){
this.mixinDestroys(MyClass);
}
}
export interface MyClass extends MixinString { }
<p dir="auto"><br /> The above is as basic as you can make it, to the point of making it pointless! To show some actual usage, here is a screenshot from the player class in <a href="https://apps.spelmakare.se/arw" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">ARW.
<p dir="auto"><img src="https://images.hive.blog/768x0/https://files.peakd.com/file/peakd-hive/smjn/Eo1vWXrEztM83fvVPtMcA362njd4AdVtkTrYgRRGL8D25MncWMDC9pRazCbAW8k6ztD.png" alt="player example.png" srcset="https://images.hive.blog/768x0/https://files.peakd.com/file/peakd-hive/smjn/Eo1vWXrEztM83fvVPtMcA362njd4AdVtkTrYgRRGL8D25MncWMDC9pRazCbAW8k6ztD.png 1x, https://images.hive.blog/1536x0/https://files.peakd.com/file/peakd-hive/smjn/Eo1vWXrEztM83fvVPtMcA362njd4AdVtkTrYgRRGL8D25MncWMDC9pRazCbAW8k6ztD.png 2x" />
<p dir="auto"><strong>MixinGameObjectBodies gives a class unlimited rigidbodies and colliders, here it is used to give the player colliders that are used to check various contacts between the player and ground, walls and ceiling.
<p dir="auto"><strong>MixinColliderCollector gives a class the functionality to collect other objects of interest to do specific events. The objects of interested will be determined by what MixinInteractions they have. If other objects use MixinIntPlayer they will be able to interact with the player.
<p dir="auto"><strong>MixinIntLadder One of the MixinInteractions that the player have. This gives the player the ability to use ladders. By adding MixinIntLadder to other classes they too can use ladders.
<p dir="auto">As shown here, mixins are very powerful to easily create functionality that can be added to different classes that otherwise have nothing in common or any inheritance.
<p dir="auto">That's it! Thanks for reading.<br />
<br />
<hr />
<p dir="auto"><i> Spelmakare is game development using web technologies.
<p dir="auto"><a href="https://spelmakare.se" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Spelmakare.se<br />
<a href="https://discord.gg/VG5EW9R" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Discord<br />
<a href="https://github.com/smjnab" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">GitHub<br />
<a href="https://apps.spelmakare.se/arw" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Play ARW<br />
<a href="https://spelmakare.se/games/hivepvs" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Play Hive P v. S<br />