_Bastler/partey_workadventure
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

merged develop

Browse Source
This commit is contained in:
Hanusiak Piotr 2022-02-07 15:09:18 +01:00
commit e34a72c865
20 changed files with 218 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
front/dist/resources/logos/meet.svg vendored Normal file
View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="452.388px" height="452.388px" viewBox="0 0 452.388 452.388" style="enable-background:new 0 0 452.388 452.388;"
xml:space="preserve">
<g>
<g id="Layer_8_38_">
<path d="M441.677,43.643H10.687C4.785,43.643,0,48.427,0,54.329v297.425c0,5.898,4.785,10.676,10.687,10.676h162.069v25.631
c0,0.38,0.074,0.722,0.112,1.089h-23.257c-5.407,0-9.796,4.389-9.796,9.795c0,5.408,4.389,9.801,9.796,9.801h158.506
c5.406,0,9.795-4.389,9.795-9.801c0-5.406-4.389-9.795-9.795-9.795h-23.256c0.032-0.355,0.115-0.709,0.115-1.089V362.43H441.7
c5.898,0,10.688-4.782,10.688-10.676V54.329C452.37,48.427,447.589,43.643,441.677,43.643z M422.089,305.133
c0,5.903-4.784,10.687-10.683,10.687H40.96c-5.898,0-10.684-4.783-10.684-10.687V79.615c0-5.898,4.786-10.684,10.684-10.684
h370.446c5.898,0,10.683,4.785,10.683,10.684V305.133z M303.942,290.648H154.025c0-29.872,17.472-55.661,42.753-67.706
c-15.987-10.501-26.546-28.571-26.546-49.13c0-32.449,26.306-58.755,58.755-58.755c32.448,0,58.753,26.307,58.753,58.755
c0,20.553-10.562,38.629-26.545,49.13C286.475,234.987,303.942,260.781,303.942,290.648z"/>
</g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

13
front/src/Components/EmbedScreens/CoWebsiteThumbnailSlot.svelte
View File

@ -19,7 +19,9 @@
const urlObject = new URL(coWebsiteUrl);
onMount(() => {
icon.src = `${ICON_URL}/icon?url=${urlObject.hostname}&size=64..96..256&fallback_icon_color=14304c`;
icon.src = coWebsite.jitsi
? "/resources/logos/meet.svg"
: `${ICON_URL}/icon?url=${urlObject.hostname}&size=64..96..256&fallback_icon_color=14304c`;
icon.alt = coWebsite.altMessage ?? urlObject.hostname;
icon.onload = () => {
iconLoaded = true;
@ -34,7 +36,7 @@
const coWebsites = $coWebsitesNotAsleep;
const newMain = $highlightedEmbedScreen ?? coWebsites.length > 1 ? coWebsites[1] : undefined;
if (newMain) {
coWebsiteManager.goToMain(coWebsite);
coWebsiteManager.goToMain(newMain);
}
} else {
highlightedEmbedScreen.toggleHighlight({
@ -79,6 +81,7 @@
<img
class="cowebsite-icon noselect nes-pointer"
class:hide={!iconLoaded}
class:jitsi={coWebsite.jitsi}
bind:this={icon}
on:dragstart|preventDefault={noDrag}
alt=""
@ -308,6 +311,12 @@
&.hide {
display: none;
}
&.jitsi {
filter: invert(100%);
-webkit-filter: invert(100%);
padding: 7px;
}
}
}
</style>

3
front/src/Components/EmbedScreens/Layouts/MozaicLayout.svelte
View File

@ -23,8 +23,9 @@
{#each [...$streamableCollectionStore.values()] as peer (peer.uniqueId)}
<MediaBox
streamable={peer}
mozaicSolo={$streamableCollectionStore.size === 1}
mozaicFullWidth={$streamableCollectionStore.size === 1 || $streamableCollectionStore.size === 2}
mozaicQuarter={$streamableCollectionStore.size === 3 || $streamableCollectionStore.size === 4}
mozaicQuarter={$streamableCollectionStore.size === 3 || $streamableCollectionStore.size >= 4}
/>
{/each}
</div>

9
front/src/Components/Video/MediaBox.svelte
View File

@ -9,6 +9,7 @@
export let streamable: Streamable;
export let isHightlighted = false;
export let isClickable = false;
export let mozaicSolo = false;
export let mozaicFullWidth = false;
export let mozaicQuarter = false;
</script>
@ -16,6 +17,7 @@
<div
class="media-container nes-container is-rounded {isHightlighted ? 'hightlighted' : ''}"
class:clickable={isClickable}
class:mozaic-solo={mozaicSolo}
class:mozaic-full-width={mozaicFullWidth}
class:mozaic-quarter={mozaicQuarter}
>
@ -66,6 +68,11 @@
}
}
&.mozaic-solo {
max-height: inherit !important;
width: 90% !important;
}
&.mozaic-full-width {
width: 95%;
max-width: 95%;
@ -73,6 +80,7 @@
margin-right: 3%;
margin-top: auto;
margin-bottom: auto;
max-height: 95%;
&:hover {
margin-top: auto;
@ -85,6 +93,7 @@
max-width: 95%;
margin-top: auto;
margin-bottom: auto;
max-height: 95%;
&:hover {
margin-top: auto;

1
front/src/Components/WarningContainer/WarningContainer.svelte
View File

@ -38,7 +38,6 @@
right: 0;
margin-left: auto;
margin-right: auto;
transform: translate(-50%, 0);
font-family: Lato;
min-width: 300px;
opacity: 0.9;

3
front/src/Interfaces/UserInputHandlerInterface.ts
View File

@ -9,4 +9,7 @@ export interface UserInputHandlerInterface {
handlePointerUpEvent: (pointer: Phaser.Input.Pointer, gameObjects: Phaser.GameObjects.GameObject[]) => void;
handlePointerDownEvent: (pointer: Phaser.Input.Pointer, gameObjects: Phaser.GameObjects.GameObject[]) => void;
handleSpaceKeyUpEvent: (event: Event) => Event;
addSpaceEventListener: (callback: Function) => void;
removeSpaceEventListner: (callback: Function) => void;
}

7
front/src/Phaser/Companion/Companion.ts
View File

@ -4,6 +4,7 @@ import { PlayerAnimationDirections, PlayerAnimationTypes } from "../Player/Anima
import { TexturesHelper } from "../Helpers/TexturesHelper";
import { Writable, writable } from "svelte/store";
import type { PictureStore } from "../../Stores/PictureStore";
import type CancelablePromise from "cancelable-promise";
export interface CompanionStatus {
x: number;
@ -25,8 +26,9 @@ export class Companion extends Container {
private direction: PlayerAnimationDirections;
private animationType: PlayerAnimationTypes;
private readonly _pictureStore: Writable<string | undefined>;
private texturePromise: CancelablePromise<string | void> | undefined;
constructor(scene: Phaser.Scene, x: number, y: number, name: string, texturePromise: Promise<string>) {
constructor(scene: Phaser.Scene, x: number, y: number, name: string, texturePromise: CancelablePromise<string>) {
super(scene, x + 14, y + 4);
this.sprites = new Map<string, Sprite>();
@ -41,7 +43,7 @@ export class Companion extends Container {
this.companionName = name;
this._pictureStore = writable(undefined);
texturePromise
this.texturePromise = texturePromise
.then((resource) => {
this.addResource(resource);
this.invisible = false;
@ -234,6 +236,7 @@ export class Companion extends Container {
}
public destroy(): void {
this.texturePromise?.cancel();
for (const sprite of this.sprites.values()) {
if (this.scene) {
this.scene.sys.updateList.remove(sprite);

9
front/src/Phaser/Companion/CompanionTexturesLoadingManager.ts
View File

@ -1,5 +1,6 @@
import LoaderPlugin = Phaser.Loader.LoaderPlugin;
import { COMPANION_RESOURCES, CompanionResourceDescriptionInterface } from "./CompanionTextures";
import CancelablePromise from "cancelable-promise";
export const getAllCompanionResources = (loader: LoaderPlugin): CompanionResourceDescriptionInterface[] => {
COMPANION_RESOURCES.forEach((resource: CompanionResourceDescriptionInterface) => {
@ -9,8 +10,12 @@ export const getAllCompanionResources = (loader: LoaderPlugin): CompanionResourc
return COMPANION_RESOURCES;
};
export const lazyLoadCompanionResource = (loader: LoaderPlugin, name: string): Promise<string> => {
return new Promise((resolve, reject) => {
export const lazyLoadCompanionResource = (loader: LoaderPlugin, name: string): CancelablePromise<string> => {
return new CancelablePromise((resolve, reject, cancel) => {
cancel(() => {
return;
});
const resource = COMPANION_RESOURCES.find((item) => item.name === name);
if (typeof resource === "undefined") {

37
front/src/Phaser/Entity/Character.ts
View File

@ -17,7 +17,7 @@ import { Unsubscriber, Writable, writable } from "svelte/store";
import { createColorStore } from "../../Stores/OutlineColorStore";
import type { OutlineableInterface } from "../Game/OutlineableInterface";
import type CancelablePromise from "cancelable-promise";
import { TalkIcon } from '../Components/TalkIcon';
import { TalkIcon } from "../Components/TalkIcon";
const playerNameY = -25;
@ -61,7 +61,7 @@ export abstract class Character extends Container implements OutlineableInterfac
frame: string | number,
isClickable: boolean,
companion: string | null,
companionTexturePromise?: Promise<string>
companionTexturePromise?: CancelablePromise<string>
) {
super(scene, x, y /*, texture, frame*/);
this.scene = scene;
@ -155,7 +155,7 @@ export abstract class Character extends Container implements OutlineableInterfac
this.clickable = clickable;
if (clickable) {
this.setInteractive({
hitArea: new Phaser.Geom.Circle(0, 0, interactiveRadius),
hitArea: new Phaser.Geom.Circle(8, 8, interactiveRadius),
hitAreaCallback: Phaser.Geom.Circle.Contains, //eslint-disable-line @typescript-eslint/unbound-method
useHandCursor: true,
});
@ -172,6 +172,27 @@ export abstract class Character extends Container implements OutlineableInterfac
return { x: this.x, y: this.y };
}
/**
* Returns position based on where player is currently facing
* @param shift How far from player should the point of interest be.
*/
public getDirectionalActivationPosition(shift: number): { x: number; y: number } {
switch (this.lastDirection) {
case PlayerAnimationDirections.Down: {
return { x: this.x, y: this.y + shift };
}
case PlayerAnimationDirections.Left: {
return { x: this.x - shift, y: this.y };
}
case PlayerAnimationDirections.Right: {
return { x: this.x + shift, y: this.y };
}
case PlayerAnimationDirections.Up: {
return { x: this.x, y: this.y - shift };
}
}
}
public getObjectToOutline(): Phaser.GameObjects.GameObject {
return this.playerNameText;
}
@ -196,7 +217,7 @@ export abstract class Character extends Container implements OutlineableInterfac
this.talkIcon.show(show);
}
public addCompanion(name: string, texturePromise?: Promise<string>): void {
public addCompanion(name: string, texturePromise?: CancelablePromise<string>): void {
if (typeof texturePromise !== "undefined") {
this.companion = new Companion(this.scene, this.x, this.y, name, texturePromise);
}
@ -472,16 +493,16 @@ export abstract class Character extends Container implements OutlineableInterfac
this.outlineColorStore.removeApiColor();
}
public pointerOverOutline(): void {
this.outlineColorStore.pointerOver();
public pointerOverOutline(color: number): void {
this.outlineColorStore.pointerOver(color);
}
public pointerOutOutline(): void {
this.outlineColorStore.pointerOut();
}
public characterCloseByOutline(): void {
this.outlineColorStore.characterCloseBy();
public characterCloseByOutline(color: number): void {
this.outlineColorStore.characterCloseBy(color);
}
public characterFarAwayOutline(): void {

6
front/src/Phaser/Entity/RemotePlayer.ts
View File

@ -31,18 +31,18 @@ export class RemotePlayer extends Character implements ActivatableInterface {
moving: boolean,
visitCardUrl: string | null,
companion: string | null,
companionTexturePromise?: Promise<string>,
companionTexturePromise?: CancelablePromise<string>,
activationRadius?: number
) {
super(Scene, x, y, texturesPromise, name, direction, moving, 1, true, companion, companionTexturePromise);
//set data
this.userId = userId;
this.visitCardUrl = visitCardUrl;
this.registeredActions = [];
this.registerDefaultActionsMenuActions();
this.setClickable(this.registeredActions.length > 0);
this.activationRadius = activationRadius ?? 96;
this.visitCardUrl = visitCardUrl;
this.actionsMenuStoreUnsubscriber = actionsMenuStore.subscribe((value: ActionsMenuData | undefined) => {
this.isActionsMenuInitialized = value ? true : false;
});
@ -118,7 +118,7 @@ export class RemotePlayer extends Character implements ActivatableInterface {
private bindEventHandlers(): void {
this.on(Phaser.Input.Events.POINTER_DOWN, (event: Phaser.Input.Pointer) => {
if (event.downElement.nodeName === "CANVAS") {
if (event.downElement.nodeName === "CANVAS" && event.leftButtonDown()) {
this.toggleActionsMenu();
}
});

60
front/src/Phaser/Game/ActivatablesManager.ts
View File

@ -11,6 +11,11 @@ export class ActivatablesManager {
private currentPlayer: Player;
private canSelectByDistance: boolean = true;
private readonly outlineColor = 0xffff00;
private readonly directionalActivationPositionShift = 50;
constructor(currentPlayer: Player) {
this.currentPlayer = currentPlayer;
}
@ -27,7 +32,7 @@ export class ActivatablesManager {
}
this.selectedActivatableObjectByPointer = object;
if (isOutlineable(this.selectedActivatableObjectByPointer)) {
this.selectedActivatableObjectByPointer?.pointerOverOutline();
this.selectedActivatableObjectByPointer?.pointerOverOutline(this.outlineColor);
}
}
@ -37,7 +42,7 @@ export class ActivatablesManager {
}
this.selectedActivatableObjectByPointer = undefined;
if (isOutlineable(this.selectedActivatableObjectByDistance)) {
this.selectedActivatableObjectByDistance?.characterCloseByOutline();
this.selectedActivatableObjectByDistance?.characterCloseByOutline(this.outlineColor);
}
}
@ -46,6 +51,9 @@ export class ActivatablesManager {
}
public deduceSelectedActivatableObjectByDistance(): void {
if (!this.canSelectByDistance) {
return;
}
const newNearestObject = this.findNearestActivatableObject();
if (this.selectedActivatableObjectByDistance === newNearestObject) {
return;
@ -60,10 +68,42 @@ export class ActivatablesManager {
}
this.selectedActivatableObjectByDistance = newNearestObject;
if (isOutlineable(this.selectedActivatableObjectByDistance)) {
this.selectedActivatableObjectByDistance?.characterCloseByOutline();
this.selectedActivatableObjectByDistance?.characterCloseByOutline(this.outlineColor);
}
}
public updateActivatableObjectsDistances(objects: ActivatableInterface[]): void {
const currentPlayerPos = this.currentPlayer.getDirectionalActivationPosition(
this.directionalActivationPositionShift
);
for (const object of objects) {
const distance = MathUtils.distanceBetween(currentPlayerPos, object.getPosition());
this.activatableObjectsDistances.set(object, distance);
}
}
public updateDistanceForSingleActivatableObject(object: ActivatableInterface): void {
this.activatableObjectsDistances.set(
object,
MathUtils.distanceBetween(
this.currentPlayer.getDirectionalActivationPosition(this.directionalActivationPositionShift),
object.getPosition()
)
);
}
public disableSelectingByDistance(): void {
this.canSelectByDistance = false;
if (isOutlineable(this.selectedActivatableObjectByDistance)) {
this.selectedActivatableObjectByDistance?.characterFarAwayOutline();
}
this.selectedActivatableObjectByDistance = undefined;
}
public enableSelectingByDistance(): void {
this.canSelectByDistance = true;
}
private findNearestActivatableObject(): ActivatableInterface | undefined {
let shortestDistance: number = Infinity;
let closestObject: ActivatableInterface | undefined = undefined;
@ -76,18 +116,8 @@ export class ActivatablesManager {
}
return closestObject;
}
public updateActivatableObjectsDistances(objects: ActivatableInterface[]): void {
const currentPlayerPos = this.currentPlayer.getPosition();
for (const object of objects) {
const distance = MathUtils.distanceBetween(currentPlayerPos, object.getPosition());
this.activatableObjectsDistances.set(object, distance);
}
}
public updateDistanceForSingleActivatableObject(object: ActivatableInterface): void {
this.activatableObjectsDistances.set(
object,
MathUtils.distanceBetween(this.currentPlayer.getPosition(), object.getPosition())
);
public isSelectingByDistanceEnabled(): boolean {
return this.canSelectByDistance;
}
}

9
front/src/Phaser/Game/Game.ts
View File

@ -26,15 +26,6 @@ export class Game extends Phaser.Game {
}
}
});
/*window.addEventListener('resize', (event) => {
// Let's trigger the onResize method of any active scene that is a ResizableScene
for (const scene of this.scene.getScenes(true)) {
if (scene instanceof ResizableScene) {
scene.onResize(event);
}
}
});*/
}
public step(time: number, delta: number) {

19
front/src/Phaser/Game/GameScene.ts
View File

@ -92,7 +92,7 @@ import { MapStore } from "../../Stores/Utils/MapStore";
import { followUsersColorStore } from "../../Stores/FollowStore";
import { GameSceneUserInputHandler } from "../UserInput/GameSceneUserInputHandler";
import { locale } from "../../i18n/i18n-svelte";
import { localVolumeStore } from '../../Stores/MediaStore';
import { localVolumeStore } from "../../Stores/MediaStore";
export interface GameSceneInitInterface {
initPosition: PointInterface | null;
reconnecting: boolean;
@ -247,7 +247,7 @@ export class GameScene extends DirtyScene {
loadCustomTexture(this.load, texture).catch((e) => console.error(e));
}
}
this.load.svg('iconTalk', '/resources/icons/icon_talking.svg');
this.load.svg("iconTalk", "/resources/icons/icon_talking.svg");
if (touchScreenManager.supportTouchScreen) {
this.load.image(joystickBaseKey, joystickBaseImg);
@ -641,15 +641,18 @@ export class GameScene extends DirtyScene {
let oldPeerNumber = 0;
this.peerStoreUnsubscribe = peerStore.subscribe((peers) => {
this.volumeStoreUnsubscribers.forEach(unsubscribe => unsubscribe());
this.volumeStoreUnsubscribers.forEach((unsubscribe) => unsubscribe());
this.volumeStoreUnsubscribers.clear();
for (const [key, videoStream] of peers) {
this.volumeStoreUnsubscribers.set(key, videoStream.volumeStore.subscribe((volume) => {
this.volumeStoreUnsubscribers.set(
key,
videoStream.volumeStore.subscribe((volume) => {
if (volume) {
this.MapPlayersByKey.get(key)?.showTalkIcon(volume > 5);
}
}));
})
);
}
const newPeerNumber = peers.size;
@ -1764,6 +1767,12 @@ ${escapedMessage}
emoteMenuStore.openEmoteMenu();
}
});
this.CurrentPlayer.on(Phaser.Input.Events.POINTER_OVER, (pointer: Phaser.Input.Pointer) => {
this.CurrentPlayer.pointerOverOutline(0x00ffff);
});
this.CurrentPlayer.on(Phaser.Input.Events.POINTER_OUT, (pointer: Phaser.Input.Pointer) => {
this.CurrentPlayer.pointerOutOutline();
});
this.CurrentPlayer.on(requestEmoteEventName, (emoteKey: string) => {
this.connection?.emitEmoteEvent(emoteKey);
analyticsClient.launchEmote(emoteKey);

4
front/src/Phaser/Game/OutlineableInterface.ts
View File

@ -3,8 +3,8 @@ export interface OutlineableInterface {
removeFollowOutlineColor(): void;
setApiOutlineColor(color: number): void;
removeApiOutlineColor(): void;
pointerOverOutline(): void;
pointerOverOutline(color: number): void;
pointerOutOutline(): void;
characterCloseByOutline(): void;
characterCloseByOutline(color: number): void;
characterFarAwayOutline(): void;
}

2
front/src/Phaser/Player/Player.ts
View File

@ -25,7 +25,7 @@ export class Player extends Character {
direction: PlayerAnimationDirections,
moving: boolean,
companion: string | null,
companionTexturePromise?: Promise<string>
companionTexturePromise?: CancelablePromise<string>
) {
super(Scene, x, y, texturesPromise, name, direction, moving, 1, true, companion, companionTexturePromise);

16
front/src/Phaser/UserInput/GameSceneUserInputHandler.ts
View File

@ -22,7 +22,7 @@ export class GameSceneUserInputHandler implements UserInputHandlerInterface {
}
public handlePointerUpEvent(pointer: Phaser.Input.Pointer, gameObjects: Phaser.GameObjects.GameObject[]): void {
if (pointer.rightButtonReleased() || pointer.getDuration() > 250) {
if ((!pointer.wasTouch && pointer.leftButtonReleased()) || pointer.getDuration() > 250) {
return;
}
for (const object of gameObjects) {
@ -53,10 +53,20 @@ export class GameSceneUserInputHandler implements UserInputHandlerInterface {
public handlePointerDownEvent(pointer: Phaser.Input.Pointer, gameObjects: Phaser.GameObjects.GameObject[]): void {}
public handleSpaceKeyUpEvent(event: Event): Event {
const activatable = this.gameScene.getActivatablesManager().getSelectedActivatableObject();
if (activatable && activatable.isActivatable()) {
const activatableManager = this.gameScene.getActivatablesManager();
const activatable = activatableManager.getSelectedActivatableObject();
if (activatable && activatable.isActivatable() && activatableManager.isSelectingByDistanceEnabled()) {
activatable.activate();
}
return event;
}
public addSpaceEventListener(callback: Function): void {
this.gameScene.input.keyboard.addListener("keyup-SPACE", callback);
this.gameScene.getActivatablesManager().disableSelectingByDistance();
}
public removeSpaceEventListner(callback: Function): void {
this.gameScene.input.keyboard.removeListener("keyup-SPACE", callback);
this.gameScene.getActivatablesManager().enableSelectingByDistance();
}
}

9
front/src/Phaser/UserInput/UserInputManager.ts
View File

@ -223,10 +223,10 @@ export class UserInputManager {
}
addSpaceEventListner(callback: Function) {
this.scene.input.keyboard.addListener("keyup-SPACE", callback);
this.userInputHandler.addSpaceEventListener(callback);
}
removeSpaceEventListner(callback: Function) {
this.scene.input.keyboard.removeListener("keyup-SPACE", callback);
this.userInputHandler.removeSpaceEventListner(callback);
}
destroy(): void {
@ -255,6 +255,11 @@ export class UserInputManager {
(pointer: Phaser.Input.Pointer, gameObjects: Phaser.GameObjects.GameObject[]) => {
this.joystick?.hide();
this.userInputHandler.handlePointerUpEvent(pointer, gameObjects);
// Disable focus on iframe (need by Firefox)
if (pointer.downElement.nodeName === "CANVAS" && document.activeElement instanceof HTMLIFrameElement) {
document.activeElement.blur();
}
}
);

1
front/src/Stores/LayoutManagerStore.ts
View File

@ -1,4 +1,5 @@
import { derived, writable } from "svelte/store";
import type { ActivatablesManager } from "../Phaser/Game/ActivatablesManager";
import type { UserInputManager } from "../Phaser/UserInput/UserInputManager";
export interface LayoutManagerAction {

23
front/src/Stores/OutlineColorStore.ts
View File

@ -5,38 +5,33 @@ export function createColorStore() {
let followColor: number | undefined = undefined;
let apiColor: number | undefined = undefined;
let pointedByPointer: boolean = false;
let pointedByCharacter: boolean = false;
let pointedByPointer: number | undefined = undefined;
let pointedByCharacter: number | undefined = undefined;
const updateColor = () => {
if (pointedByPointer || pointedByCharacter) {
set(0xffff00);
} else {
set(followColor ?? apiColor);
}
set(pointedByPointer ?? pointedByCharacter ?? followColor ?? apiColor);
};
return {
subscribe,
pointerOver() {
pointedByPointer = true;
pointerOver(color: number) {
pointedByPointer = color;
updateColor();
},
pointerOut() {
pointedByPointer = false;
pointedByPointer = undefined;
updateColor();
},
characterCloseBy() {
pointedByCharacter = true;
characterCloseBy(color: number) {
pointedByCharacter = color;
updateColor();
},
characterFarAway() {
pointedByCharacter = false;
pointedByCharacter = undefined;
updateColor();
},

7
yarn.lock
View File

@ -2,6 +2,7 @@
# yarn lockfile v1
"husky@^6.0.0":
"resolved" "https://registry.npmjs.org/husky/-/husky-6.0.0.tgz"
"version" "6.0.0"
husky@^7.0.1:
version "7.0.4"
resolved "https://registry.yarnpkg.com/husky/-/husky-7.0.4.tgz#242048245dc49c8fb1bf0cc7cfb98dd722531535"
integrity sha512-vbaCKN2QLtP/vD4yvs6iz6hBEo6wkSzs8HpRah1Z6aGmF2KW5PdYuAd7uX5a+OyBZHBhd+TFLqgjUgytQr4RvQ==