Draw subproject contents on screen

src/scenes/DetailScene.ts

@@ -1,22 +1,27 @@
 import { mp5 } from '../../main';
 import { colors } from '../constants/colors';
+import { Contributor } from '../sketchObjects/Contributor';
+import { Legacy } from '../sketchObjects/Legacy';
+import { Package } from '../sketchObjects/Package';
 import { Player } from '../sketchObjects/Player';
 import store from '../store';
 import { Scenes } from './scenes';
 
 export class DetailScene {
   player: Player;
-  contributors: any;
-  legacy: any;
-  packages: any;
+  contributors: any[];
+  legacy: any[];
+  packages: any[];
 
   constructor() {
     this.player = new Player();
 
     store.subscribe((state) => {
-      this.contributors = state.currContributors;
-      this.legacy = state.currLegacy;
-      this.packages = state.currPackages;
+      this.contributors = state.currContributors.map(
+        (contributor) => new Contributor(100, 200, 100)
+      );
+      this.legacy = state.currLegacy.map((legacy) => new Legacy(200, 300, 100));
+      this.packages = state.currPackages.map((currPackage) => new Package(400, 300, 100));
     });
   }
 
@@ -25,7 +30,15 @@ export class DetailScene {
     this.player.follow();
     this.player.move();
 
-    // TODO: Draw what can be found
+    this.contributors.forEach((contributor) => {
+      contributor.place();
+    });
+    this.legacy.forEach((legacyObj) => {
+      legacyObj.place();
+    });
+    this.packages.forEach((packageObj) => {
+      packageObj.place();
+    });
   }
 
   onSceneClick() {

src/sketchObjects/Contributor.ts

@@ -15,9 +15,7 @@ export class Contributor {
     this.size = size;
   }
 
-  public place() {}
-
-  private draw() {
+  public place() {
     mp5.fill(mp5.color(colors.blueGrey));
     mp5.ellipse(this.x, this.y, this.size);
   }

src/sketchObjects/Legacy.ts

@@ -14,9 +14,7 @@ export class Legacy {
     this.size = size;
   }
 
-  public place() {}
-
-  private draw() {
+  private place() {
     mp5.fill(mp5.color(colors.red));
     mp5.ellipse(this.x, this.y, this.size);
   }

src/sketchObjects/Package.ts

@@ -1,7 +1,7 @@
 import { mp5 } from '../../main';
 import { colors } from '../constants/colors';
 
-export class Contributor {
+export class Package {
   x: number;
   y: number;
   size: number;
@@ -14,9 +14,7 @@ export class Contributor {
     this.size = size;
   }
 
-  public place() {}
-
-  private draw() {
+  public place() {
     mp5.fill(mp5.color(colors.redDark));
     mp5.ellipse(this.x, this.y, this.size);
   }