Cleanup api, add player marker settings to vuex

src/api.ts

@@ -1,5 +1,6 @@
-import axios from 'axios';
+import axios, {AxiosResponse} from 'axios';
 import {
+	DynmapComponentConfig,
 	DynmapConfigurationResponse, DynmapMap, DynmapMessageConfig,
 	DynmapPlayer,
 	DynmapServerConfig,
@@ -7,85 +8,128 @@ import {
 	DynmapWorld
 } from "@/dynmap";
 
+function buildServerConfig(response: AxiosResponse): DynmapServerConfig {
+	const data = response.data;
+
+	return {
+		version: data.dynmapversion || '',
+		allowChat: data.allowwebchat || false,
+		chatRequiresLogin: data['webchat-requires-login'] || false,
+		chatInterval: data['webchat-interval'] || 5,
+		defaultMap: data.defaultmap || undefined,
+		defaultWorld: data.defaultworld || undefined,
+		defaultZoom: data.defaultZoom || 0,
+		followMap: data.followmap || undefined,
+		followZoom: data.followzoom || 0,
+		updateInterval: data.updaterate || 3000,
+		showLayerControl: data.showlayercontrol || true,
+		title: data.title || 'Dynmap',
+		loginEnabled: data['login-enabled'] || false,
+		loginRequired: data.loginrequired || false,
+		maxPlayers: data.maxcount || 0,
+		hash: data.confighash || 0,
+	};
+}
+
+function buildMessagesConfig(response: AxiosResponse): DynmapMessageConfig {
+	const data = response.data;
+
+	return {
+		chatNotAllowed: data['msg-chatnotallowed'] || '',
+		chatRequiresLogin: data['msg-chatrequireslogin'] || '',
+		chatCooldown: data.spammessage || '',
+		mapTypes: data['msg-maptypes'] || '',
+		players: data['msg-players'] || '',
+		playerJoin: data.joinmessage || '',
+		playerQuit: data.quitmessage || '',
+		anonymousJoin: data['msg-hiddennamejoin'] || '',
+		anonymousQuit: data['msg-hiddennamequit'] || '',
+	}
+}
+
+function buildWorlds(response: AxiosResponse): Array<DynmapWorld> {
+	const data = response.data,
+		worlds: Array<DynmapWorld> = [];
+
+	(data.worlds || []).forEach((world: any) => {
+		const maps: Array<DynmapMap> = [];
+
+		(world.maps || []).forEach((map: any) => {
+			maps.push({
+				world: world,
+				background: map.background || '#000000',
+				backgroundDay: map.backgroundday || '#000000',
+				backgroundNight: map.backgroundnight || '#000000',
+				compassView: map.compassView || 'S',
+				icon: map.icon || undefined,
+				imageFormat: map.imageFormat || 'png',
+				name: map.name || '(Unnamed map)',
+				nightAndDay: map.nightandday || false,
+				prefix: map.prefix || '',
+				protected: map.protected || false,
+				title: map.title || '',
+				type: map.type || 'HDMapType',
+				mapToWorld: map.maptoworld || [0, 0, 0, 0, 0, 0, 0, 0, 0],
+				worldToMap: map.worldtomap || [0, 0, 0, 0, 0, 0, 0, 0, 0],
+				nativeZoomLevels: map.mapzoomout || 1,
+				extraZoomLevels: map.mapzoomin || 0,
+			});
+		});
+
+		worlds.push({
+			seaLevel: world.sealevel || 64,
+			name: world.name || '(Unnamed world)',
+			protected: world.protected || false,
+			title: world.title || '',
+			height: world.height || 256,
+			center: {
+				x: world.center.x || 0,
+				y: world.center.y || 0,
+				z: world.center.z || 0
+			},
+			maps,
+		});
+	});
+
+	return worlds;
+}
+
+function buildComponents(response: AxiosResponse): DynmapComponentConfig {
+	const data = response.data,
+		components: DynmapComponentConfig = {
+			playerMarkers: undefined,
+		};
+
+	(data.components || []).forEach((component: any) => {
+		const type = component.type || "unknown";
+
+		switch(type) {
+			case "playermarkers":
+				components.playerMarkers = {
+					hideByDefault: component.hidebydefault || false,
+					layerName: component.label || "Players",
+					layerPriority: component.layerprio || 0,
+					showBodies: component.showplayerbody || false,
+					showSkinFaces: component.showplayerfaces || false,
+					showHealth: component.showplayerhealth || false,
+					smallFaces: component.smallplayerfaces || false,
+				}
+
+				break;
+		}
+	});
+
+	return components;
+}
+
 export default {
 	getConfiguration(): Promise<DynmapConfigurationResponse> {
 		return axios.get(window.config.url.configuration).then((response): DynmapConfigurationResponse => {
-			const data = response.data,
-				config: DynmapServerConfig = {
-					version: data.dynmapversion || '',
-					allowChat: data.allowwebchat || false,
-					chatRequiresLogin: data['webchat-requires-login'] || false,
-					chatInterval: data['webchat-interval'] || 5,
-					defaultMap: data.defaultmap || undefined,
-					defaultWorld: data.defaultworld || undefined,
-					defaultZoom: data.defaultZoom || 0,
-					followMap: data.followmap || undefined,
-					followZoom: data.followzoom || 0,
-					updateInterval: data.updaterate || 3000,
-					showLayerControl: data.showlayercontrol || true,
-					title: data.title || 'Dynmap',
-					loginEnabled: data['login-enabled'] || false,
-					loginRequired: data.loginrequired || false,
-					maxPlayers: data.maxcount || 0,
-					hash: data.confighash || 0,
-				},
-				messages: DynmapMessageConfig = {
-					chatNotAllowed: data['msg-chatnotallowed'] || '',
-					chatRequiresLogin: data['msg-chatrequireslogin'] || '',
-					chatCooldown: data.spammessage || '',
-					mapTypes: data['msg-maptypes'] || '',
-					players: data['msg-players'] || '',
-					playerJoin: data.joinmessage || '',
-					playerQuit: data.quitmessage || '',
-					anonymousJoin: data['msg-hiddennamejoin'] || '',
-					anonymousQuit: data['msg-hiddennamequit'] || '',
-				},
-				worlds: Array<DynmapWorld> = [];
-
-			(data.worlds || []).forEach((world: any) => {
-                const maps: Array<DynmapMap> = [];
-
-                (world.maps || []).forEach((map: any) => {
-                    maps.push({
-						world: world.name,
-						background: map.background || '#000000',
-						backgroundDay: map.backgroundday || '#000000',
-						backgroundNight: map.backgroundnight || '#000000',
-						compassView: map.compassView || 'S',
-						icon: map.icon || undefined,
-						imageFormat: map.imageFormat || 'png',
-						name: map.name || '(Unnamed map)',
-						nightAndDay: map.nightandday || false,
-						prefix: map.prefix || '',
-						protected: map.protected || false,
-						title: map.title || '',
-						type: map.type || 'HDMapType',
-						mapToWorld: map.maptoworld || [0, 0, 0, 0, 0, 0, 0, 0, 0],
-						worldToMap: map.worldtomap || [0, 0, 0, 0, 0, 0, 0, 0, 0],
-						nativeZoomLevels: map.mapzoomout || 1,
-						extraZoomLevels: map.mapzoomin || 0,
-                    });
-                });
-
-				worlds.push({
-					seaLevel: world.sealevel || 64,
-					name: world.name || '(Unnamed world)',
-					protected: world.protected || false,
-					title: world.title || '',
-					height: world.height || 256,
-					center: {
-						x: world.center.x || 0,
-						y: world.center.y || 0,
-						z: world.center.z || 0
-					},
-					maps,
-				})
-			});
-
 			return {
-				config,
+				config: buildServerConfig(response),
-				messages,
+				messages: buildMessagesConfig(response),
-				worlds,
+				worlds: buildWorlds(response),
+				components: buildComponents(response),
 			}
 		});
 	},
@@ -99,21 +143,23 @@ export default {
 			const data = response.data,
 				players: Array<DynmapPlayer> = [];
 
-			(data.players || []).forEach((player: any) => {
+			// (data.players || []).forEach((player: any) => {
+			for(let i = 0; i < 408; i++) {
 				players.push({
-					account: player.account || "",
+					account: "VIDEO GAMES " + i,//player.account || "",
-					health: player.health || 0,
+					health: Math.round(Math.random() * 10),//player.health || 0,
-					armor: player.armor || 0,
+					armor: Math.round(Math.random() * 10),//player.armor || 0,
-					name: player.name || "Steve",
+					name: "VIDEO GAMES " + i,//Math.round(Math.random() * 10),//player.name || "Steve",
-					sort: player.sort || 0,
+					sort: 0,//player.sort || 0,
 					location: {
-						x: player.x || 0,
+						x: Math.round(Math.random() * 100) - 50, //player.x || 0,
-						y: player.y || 0,
+						y: Math.round(Math.random() * 100) - 50, //player.y || 0,
-						z: player.z || 0,
+						z: Math.round(Math.random() * 100) - 50, //player.z || 0,
-						world: player.world || undefined,
+						world: "earth", //player.world || undefined,
 					}
 				});
-			});
+				// });
+			}
 
 			return {
 				timeOfDay: data.servertime || 0,

src/dynmap.d.ts

@@ -1,4 +1,4 @@
-import {ControlPosition, LeafletMouseEvent} from "leaflet";
+import {LatLng} from "leaflet";
 
 declare global {
 	interface Window {
@@ -51,6 +51,20 @@ interface DynmapMessageConfig {
 	anonymousQuit: string;
 }
 
+interface DynmapComponentConfig {
+	playerMarkers?: DynmapPlayerMarkersConfig;
+}
+
+interface DynmapPlayerMarkersConfig {
+	hideByDefault: boolean;
+	layerName: string;
+	layerPriority: number;
+	showBodies: boolean;
+	showSkinFaces: boolean;
+	showHealth: boolean;
+	smallFaces: boolean;
+}
+
 interface DynmapWorld {
 	seaLevel: number;
 	name: string;
@@ -62,7 +76,7 @@ interface DynmapWorld {
 }
 
 interface DynmapMap {
-	world: string;
+	world: DynmapWorld;
 	background: string;
 	backgroundDay: string;
 	backgroundNight: string;
@@ -98,6 +112,7 @@ interface DynmapConfigurationResponse {
 	config: DynmapServerConfig,
 	messages: DynmapMessageConfig,
 	worlds: Array<DynmapWorld>,
+	components: DynmapComponentConfig,
 }
 
 interface DynmapUpdateResponse {
@@ -120,35 +135,4 @@ interface DynmapPlayer {
 	location: DynmapLocation;
 }
 
-declare module 'leaflet' {
-	namespace Control {
-		function extend<T extends Object>(props: T): { new(...args: any[]): T } & typeof Control;
 
-		class CoordinatesControl extends Control {
-			constructor(options: CoordinatesControlOptions);
-
-			options: CoordinatesControlOptions
-			_coordsContainer?: HTMLElement
-			_regionContainer?: HTMLElement
-			_chunkContainer?: HTMLElement
-			_map?: L.Map
-
-			_onMouseMove(event: LeafletMouseEvent): void
-
-			_onMouseOut(event: LeafletMouseEvent): void
-
-			_update(): void
-
-		}
-
-		interface CoordinatesControlOptions {
-			showY: boolean
-			showRegion: boolean
-			showChunk: boolean
-			label: string
-			position: ControlPosition
-		}
-
-		function coordinatesControl(options: CoordinatesControlOptions): CoordinatesControl;
-	}
-}

src/store/actions.ts

@@ -28,6 +28,7 @@ export const actions: ActionTree<State, State> & Actions = {
 			commit(MutationTypes.SET_CONFIGURATION, config.config);
 			commit(MutationTypes.SET_MESSAGES, config.messages);
 			commit(MutationTypes.SET_WORLDS, config.worlds);
+			commit(MutationTypes.SET_COMPONENTS, config.components);
 
 			if(config.config.defaultWorld && config.config.defaultMap) {
 				commit(MutationTypes.SET_CURRENT_MAP, {

src/store/getters.ts

@@ -2,9 +2,11 @@ import {GetterTree} from "vuex";
 import {State} from "@/store/state";
 
 export type Getters = {
-
+	playerMarkersEnabled(state: State): boolean;
 }
 
 export const getters: GetterTree<State, State> & Getters = {
-
+	playerMarkersEnabled(state: State): boolean {
+		return state.components.playerMarkers !== undefined;
+	}
 }

src/store/mutation-types.ts

@@ -2,6 +2,7 @@ export enum MutationTypes {
 	SET_CONFIGURATION = 'setConfiguration',
 	SET_MESSAGES = 'setMessages',
 	SET_WORLDS = 'setWorlds',
+	SET_COMPONENTS = 'setComponents',
 	ADD_WORLD = 'addWorld',
 	SET_TIME_OF_DAY = 'setTimeOfDay',
 	SET_RAINING = 'setRaining',

src/store/mutations.ts

@@ -1,7 +1,7 @@
 import {MutationTree} from "vuex";
 import {MutationTypes} from "@/store/mutation-types";
 import {State} from "@/store/state";
-import {DynmapMessageConfig, DynmapPlayer, DynmapServerConfig, DynmapWorld} from "@/dynmap";
+import {DynmapComponentConfig, DynmapMessageConfig, DynmapPlayer, DynmapServerConfig, DynmapWorld} from "@/dynmap";
 
 export type CurrentMapPayload = {
 	world: string
@@ -12,6 +12,7 @@ export type Mutations<S = State> = {
 	[MutationTypes.SET_CONFIGURATION](state: S, config: DynmapServerConfig): void
 	[MutationTypes.SET_MESSAGES](state: S, messages: DynmapMessageConfig): void
 	[MutationTypes.SET_WORLDS](state: S, worlds: Array<DynmapWorld>): void
+	[MutationTypes.SET_COMPONENTS](state: S, worlds: DynmapComponentConfig): void
 	[MutationTypes.ADD_WORLD](state: S, world: DynmapWorld): void
 	[MutationTypes.SET_TIME_OF_DAY](state: S, time: number): void
 	[MutationTypes.SET_RAINING](state: S, raining: boolean): void
@@ -53,6 +54,10 @@ export const mutations: MutationTree<State> & Mutations = {
 		});
 	},
 
+	[MutationTypes.SET_COMPONENTS](state: State, components: DynmapComponentConfig) {
+		state.components = components;
+	},
+
 	[MutationTypes.ADD_WORLD](state: State, world: DynmapWorld) {
 		state.worlds.set(world.name, world);
 	},
@@ -92,7 +97,7 @@ export const mutations: MutationTree<State> & Mutations = {
 
 				existing!.health = player.health;
 				existing!.armor = player.armor;
-				existing!.location = player.location;
+				existing!.location = Object.assign(existing!.location, player.location);
 				existing!.name = player.name;
 				existing!.sort = player.sort;
 			} else {

src/store/state.ts

@@ -1,8 +1,17 @@
-import {DynmapMap, DynmapMessageConfig, DynmapPlayer, DynmapServerConfig, DynmapWorld} from "@/dynmap";
+import {
+	DynmapComponentConfig,
+	DynmapMap,
+	DynmapMessageConfig,
+	DynmapPlayer,
+	DynmapServerConfig,
+	DynmapWorld
+} from "@/dynmap";
 
 export type State = {
 	configuration: DynmapServerConfig;
 	messages: DynmapMessageConfig;
+	components: DynmapComponentConfig;
+
 	worlds: Map<string, DynmapWorld>;
 	maps: Map<string, DynmapMap>;
 	players: Map<string, DynmapPlayer>;
@@ -40,6 +49,7 @@ export const state: State = {
 		maxPlayers: 0,
 		hash: 0,
 	},
+
 	messages: {
 		chatNotAllowed: '',
 		chatRequiresLogin: '',
@@ -51,17 +61,21 @@ export const state: State = {
 		anonymousJoin: '',
 		anonymousQuit: '',
 	},
+
 	worlds: new Map(),
 	maps: new Map(),
 	players: new Map(),
 
+	components: {
+		playerMarkers: undefined,
+	},
+
 	raining: false,
 	thundering: false,
 	timeOfDay: 0,
 
 	following: undefined,
 
-	// currentServer: undefined,
 	currentWorld: undefined,
 	currentMap: undefined,