diff --git a/index.html b/index.html
index 92b1371..85ad727 100644
--- a/index.html
+++ b/index.html
@@ -226,21 +226,41 @@
Have fun! 🤟
-
Questions about this visualization sepcifically
+
Questions about this Project
- After the project-specific "knowledge" questions in the last step I want to get your
- valuable input as a developer for the following questions:
+ Thanks for going through this visualization. It would be great if you could answer a set
+ of questions now:
- 1) Do you remember any of the contributors of this project? Please name them below
+ 1) Do you remember any of the contributors of this project? Please name those that you
+ remember below
+
+ 2) What were the two largest packages of this monorepo (not the npm packages, but the
+ ones the monorepo is made out of)?
+
+
+
+ 3) Which of the project's own packages was used most within other parts of the project?
+
+
+
+ 4) Any npm packages you've revealed in this project, that you can think of? did you take
+ a look at their respective websites?
+
+
+
+ 5) Have you taken a look at any of the files that were potentially "legacy" files? If
+ yes, did you agree on them being "refactor-worthy" or do you think they were fine as-is?
+
+
Questions about Play in Software Development
- After the project-specific "knowledge" questions in the last step I want to get your
- valuable input as a developer for the following questions:
+ After the project-specific questions in the last step I want to get your valuable input
+ as a developer for the following questions:
1) Would you say, that you have learned something about the underlying project from
diff --git a/src/sketchObjects/Player.ts b/src/sketchObjects/Player.ts
index b68e8a3..25bb8e2 100644
--- a/src/sketchObjects/Player.ts
+++ b/src/sketchObjects/Player.ts
@@ -68,7 +68,7 @@ export class Player {
revealedArea$.next({ x, y, w });
- if (timeElapsedSinceRevealClick > 2000) {
+ if (timeElapsedSinceRevealClick > 2500) {
this.showRevealEl = false;
revealedArea$.next({ x: 0, y: 0, w: 0 });
}
diff --git a/src/sketchObjects/Revealable.ts b/src/sketchObjects/Revealable.ts
index 4af7cad..aeed823 100644
--- a/src/sketchObjects/Revealable.ts
+++ b/src/sketchObjects/Revealable.ts
@@ -4,7 +4,7 @@ import { areasColliding, playerHead$, revealedArea$ } from '../area';
import { colors } from '../constants/colors';
import { logger } from '../logger';
import store from '../store';
-import { Area } from '../types';
+import { Area, Coordinates } from '../types';
import { Commit } from '../ui/info';
export enum RevealableTypes {
@@ -51,6 +51,9 @@ export class Revealable {
isRevealed: boolean;
wasInteractedWith: boolean;
wasRevealed: boolean;
+ hasMovedAway: boolean;
+ newMovePosition: Coordinates;
+ originalMovePosition: Coordinates;
minSize: number = 5;
currentSize: number;
@@ -87,6 +90,14 @@ export class Revealable {
this.currentSize = this.minSize;
this.pulseCurrentSize = area.w;
this.maxSize = area.w;
+ this.newMovePosition = {
+ x: this.area.x + mp5.random(-800, 800),
+ y: this.area.y + mp5.random(-800, 800),
+ };
+ this.originalMovePosition = {
+ x: this.area.x,
+ y: this.area.y,
+ };
combineLatest([revealedArea$, playerHead$]).subscribe(([revealedArea, playerHead]) => {
const isRevealed = areasColliding(revealedArea, {
@@ -141,6 +152,12 @@ export class Revealable {
} else if (this.state === RevealableStates.REVEALED) {
this.increaseSize();
+ if (!this.hasMovedAway) {
+ this.moveAway();
+ } else {
+ this.moveBack();
+ }
+
mp5.fill(mp5.color(colors.greyLight));
mp5.ellipse(this.area.x, this.area.y, this.currentSize);
} else if (this.state === RevealableStates.FOUND) {
@@ -200,6 +217,78 @@ export class Revealable {
}
}
+ private moveAway() {
+ const boundaryX = mp5.width - 200;
+ const boundaryY = mp5.height - 200;
+
+ const newX = this.newMovePosition.x;
+ const newY = this.newMovePosition.y;
+
+ const limitedX = newX > boundaryX ? boundaryX : newX < 200 ? 200 : newX;
+ const limitedY = newY > boundaryY ? boundaryY : newY < 200 ? 200 : newY;
+
+ if (limitedX > this.area.x) {
+ this.area.x += 5;
+ if (limitedX <= this.area.x) {
+ this.area.x = limitedX;
+ this.hasMovedAway = true;
+ }
+ } else {
+ this.area.x -= 5;
+ if (limitedX >= this.area.x) {
+ this.area.x = limitedX;
+ this.hasMovedAway = true;
+ }
+ }
+
+ if (limitedY > this.area.y) {
+ this.area.y += 5;
+ if (limitedY <= this.area.y) {
+ this.area.y = limitedY;
+ this.hasMovedAway = true;
+ }
+ } else {
+ this.area.y -= 5;
+ if (limitedY >= this.area.y) {
+ this.area.y = limitedY;
+ this.hasMovedAway = true;
+ }
+ }
+ }
+
+ private moveBack() {
+ const newX = this.originalMovePosition.x;
+ const newY = this.originalMovePosition.y;
+
+ if (newX > this.area.x) {
+ this.area.x += 5;
+ if (newX <= this.area.x) {
+ this.area.x = newX;
+ this.hasMovedAway = false;
+ }
+ } else {
+ this.area.x -= 5;
+ if (newX >= this.area.x) {
+ this.area.x = newX;
+ this.hasMovedAway = false;
+ }
+ }
+
+ if (newY > this.area.y) {
+ this.area.y += 5;
+ if (newY <= this.area.y) {
+ this.area.y = newY;
+ this.hasMovedAway = false;
+ }
+ } else {
+ this.area.y -= 5;
+ if (newY >= this.area.y) {
+ this.area.y = newY;
+ this.hasMovedAway = false;
+ }
+ }
+ }
+
private reduceSize() {
if (this.currentSize > this.minSize) {
this.currentSize -= 8;
diff --git a/src/store.ts b/src/store.ts
index adfafdf..1545a05 100644
--- a/src/store.ts
+++ b/src/store.ts
@@ -1,5 +1,4 @@
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';
@@ -27,34 +26,31 @@ export interface State {
uid: string;
}
-const store = create(
- devtools((set) => ({
- uid: null,
- showScore: false,
- currentIntroStep: 1,
- revealablesFinished: 0,
- currentScene: Scenes.OVERVIEW,
- currentSubproject: null,
- participantAnonymous: false,
- companionState: CompanionState.IDLE,
- infoMessageShown: false,
- infoMessages: [],
- finishedGame: false,
- addInfoMessage: (newMessage) =>
- set((state) => ({ ...state, infoMessages: [...state.infoMessages, newMessage] })),
- userMessages: [],
- addUserMessage: (newMessage) =>
- set((state) => ({
- userMessages: [...state.userMessages, newMessage],
- })),
- revealables: [],
- finishedSubProjects: [],
- setProjectMetadata: (projectName) =>
- set((state) => ({
- ...state,
- revealables: getRevealablesforSubproject(projectName, project.subprojects),
- })),
- }))
-);
-
+const store = create((set) => ({
+ uid: null,
+ showScore: false,
+ currentIntroStep: 0,
+ revealablesFinished: 0,
+ currentScene: Scenes.OVERVIEW,
+ currentSubproject: null,
+ participantAnonymous: false,
+ companionState: CompanionState.IDLE,
+ infoMessageShown: false,
+ infoMessages: [],
+ finishedGame: false,
+ addInfoMessage: (newMessage) =>
+ set((state) => ({ ...state, infoMessages: [...state.infoMessages, newMessage] })),
+ userMessages: [],
+ addUserMessage: (newMessage) =>
+ set((state) => ({
+ userMessages: [...state.userMessages, newMessage],
+ })),
+ revealables: [],
+ finishedSubProjects: [],
+ setProjectMetadata: (projectName) =>
+ set((state) => ({
+ ...state,
+ revealables: getRevealablesforSubproject(projectName, project.subprojects),
+ })),
+}));
export default store;
diff --git a/src/ui/intro.ts b/src/ui/intro.ts
index d711f9c..0e20743 100644
--- a/src/ui/intro.ts
+++ b/src/ui/intro.ts
@@ -35,6 +35,10 @@ export class Intro {
fb10: HTMLTextAreaElement;
k1: HTMLTextAreaElement;
+ k2: HTMLTextAreaElement;
+ k3: HTMLTextAreaElement;
+ k4: HTMLTextAreaElement;
+ k5: HTMLTextAreaElement;
errorRef: HTMLElement;
@@ -68,6 +72,10 @@ export class Intro {
this.fb10 = document.querySelector('#fb-10');
this.k1 = document.querySelector('#k-1');
+ this.k2 = document.querySelector('#k-2');
+ this.k3 = document.querySelector('#k-3');
+ this.k4 = document.querySelector('#k-4');
+ this.k5 = document.querySelector('#k-5');
this.errorRef = document.querySelector('#intro-error');
@@ -196,7 +204,7 @@ export class Intro {
}
private sendKnowledgeQuestionAnswers() {
- const answers = [this.k1.value];
+ const answers = [this.k1.value, this.k2.value, this.k3.value, this.k4.value, this.k5.value];
logger.logQuestions(answers, true);
}