From e6536ca7c86835ab6f37383cb98486f9518c9f99 Mon Sep 17 00:00:00 2001
From: Dennis Schoepf <me@dnsc.io>
Date: Sat, 24 Jul 2021 17:19:54 +0200
Subject: [PATCH] Set up contributor and detail scene

---
 .htmlnanorc.js                   |  3 +++
 metadata/project.json            |  6 +++++-
 src/helpers.ts                   |  4 ++++
 src/scenes/DetailScene.ts        | 14 +++++++++++++-
 src/scenes/OverviewScene.ts      |  1 +
 src/sketchObjects/Contributor.ts | 24 ++++++++++++++++++++++++
 src/store.ts                     | 18 ++++++++++++++++++
 src/types.ts                     |  6 +++++-
 8 files changed, 73 insertions(+), 3 deletions(-)
 create mode 100644 .htmlnanorc.js
 create mode 100644 src/sketchObjects/Contributor.ts

diff --git a/.htmlnanorc.js b/.htmlnanorc.js
new file mode 100644
index 0000000..86d7fe9
--- /dev/null
+++ b/.htmlnanorc.js
@@ -0,0 +1,3 @@
+module.exports = {
+  minifySvg: false,
+};
diff --git a/metadata/project.json b/metadata/project.json
index 0e616b3..8297af4 100644
--- a/metadata/project.json
+++ b/metadata/project.json
@@ -4,7 +4,11 @@
       "name": "block",
       "path": "packages/block",
       "size": 2450,
-      "contents": {}
+      "contents": {
+        "legacy": ["Test"],
+        "contributors": ["Test"],
+        "packages": ["Test"]
+      }
     },
     {
       "name": "client",
diff --git a/src/helpers.ts b/src/helpers.ts
index c5230a1..63986c1 100644
--- a/src/helpers.ts
+++ b/src/helpers.ts
@@ -64,3 +64,7 @@ export function generateEdges(subprojects: SubProject[]): Edge[] {
       })
   );
 }
+
+export function getSubproject(name: string, projects: SubProject[]): SubProject {
+  return projects.filter((project) => project.name === name)[0];
+}
diff --git a/src/scenes/DetailScene.ts b/src/scenes/DetailScene.ts
index 0301c1f..4f7100c 100644
--- a/src/scenes/DetailScene.ts
+++ b/src/scenes/DetailScene.ts
@@ -1,19 +1,31 @@
 import { mp5 } from '../../main';
+import { colors } from '../constants/colors';
 import { Player } from '../sketchObjects/Player';
 import store from '../store';
 import { Scenes } from './scenes';
 
 export class DetailScene {
   player: Player;
+  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;
+    });
   }
 
   draw() {
-    mp5.background(100);
+    mp5.background(mp5.color(colors.greyLighter));
     this.player.follow();
     this.player.move();
+
+    // TODO: Draw what can be found
   }
 
   onSceneClick() {
diff --git a/src/scenes/OverviewScene.ts b/src/scenes/OverviewScene.ts
index 81884a6..d1d8029 100644
--- a/src/scenes/OverviewScene.ts
+++ b/src/scenes/OverviewScene.ts
@@ -36,6 +36,7 @@ export class OverviewScene {
     this.edges.forEach((edge, i) => {
       const dist = mp5.dist(mp5.mouseX, mp5.mouseY, edge.x, edge.y);
       if (dist < edge.r) {
+        store.getState().setDetailScene(edge.name);
         store.setState({ currentScene: Scenes.DETAIL });
       }
     });
diff --git a/src/sketchObjects/Contributor.ts b/src/sketchObjects/Contributor.ts
new file mode 100644
index 0000000..29f1233
--- /dev/null
+++ b/src/sketchObjects/Contributor.ts
@@ -0,0 +1,24 @@
+import { mp5 } from '../../main';
+import { colors } from '../constants/colors';
+
+export class Contributor {
+  x: number;
+  y: number;
+  size: number;
+  name: string;
+  profileURL: string;
+  revealed: boolean;
+
+  constructor(x: number, y: number, size: number, name?: string, profileURL?: string) {
+    this.x = x;
+    this.y = y;
+    this.size = size;
+  }
+
+  public place() {}
+
+  private draw() {
+    mp5.fill(mp5.color(colors.blueGrey));
+    mp5.ellipse(this.x, this.y, this.size);
+  }
+}
diff --git a/src/store.ts b/src/store.ts
index a5369ee..d52c9fd 100644
--- a/src/store.ts
+++ b/src/store.ts
@@ -2,12 +2,19 @@ import create from 'zustand/vanilla';
 import { devtools } from 'zustand/middleware';
 import { Scenes } from './scenes/scenes';
 import { CompanionMessage, CompanionState } from './ui/companion';
+import project from '../metadata/project.json';
+import { getSubproject } from './helpers';
+import { SubProject } from './types';
 
 export interface State {
   currentScene: Scenes;
   companionState: CompanionState;
   userMessages: CompanionMessage[];
   addUserMessage: (newMessage: CompanionMessage) => void;
+  currContributors: any;
+  currLegacy: any;
+  currPackages: any;
+  setDetailScene: (packageName: string) => void;
 }
 
 const store = create<State>(
@@ -17,6 +24,17 @@ const store = create<State>(
     userMessages: [],
     addUserMessage: (newMessage) =>
       set((state) => ({ userMessages: [...state.userMessages, newMessage] })),
+    currContributors: [],
+    currLegacy: [],
+    currPackages: [],
+    setDetailScene: (packageName) =>
+      set(() => ({
+        currContributors: getSubproject(packageName, project.subprojects as SubProject[]).contents
+          .contributors,
+        currLegacy: getSubproject(packageName, project.subprojects as SubProject[]).contents.legacy,
+        currPackages: getSubproject(packageName, project.subprojects as SubProject[]).contents
+          .packages,
+      })),
   }))
 );
 
diff --git a/src/types.ts b/src/types.ts
index 9e6cd8a..280428e 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -2,7 +2,11 @@ export interface SubProject {
   name: string;
   path: string;
   size: number;
-  contents: any;
+  contents: {
+    contributors: any[];
+    legacy: any[];
+    packages: any[];
+  };
 }
 
 export interface Coordinates {