Fix player icons

This commit is contained in:
James Lyne 2020-12-13 13:23:32 +00:00
parent 3e2f507eb2
commit 99a28401b9
2 changed files with 12 additions and 2 deletions

View File

@ -1,6 +1,6 @@
<template> <template>
<li class="player"> <li class="player">
<img width="16" height="16" class="player__icon" src="images/player_face.png" alt="" /> <img width="16" height="16" class="player__icon" :src="playerImage" alt="" />
<button class="player__name" type="button" title="Click to center on player&#10;Double-click to follow player" <button class="player__name" type="button" title="Click to center on player&#10;Double-click to follow player"
@click.prevent="pan" @click.prevent="pan"
@keydown="onKeydown" @keydown="onKeydown"
@ -14,6 +14,8 @@ import {DynmapPlayer} from "@/dynmap";
import {useStore} from "@/store"; import {useStore} from "@/store";
import {MutationTypes} from "@/store/mutation-types"; import {MutationTypes} from "@/store/mutation-types";
const playerImage = require('@/assets/images/player_face.png');
export default defineComponent({ export default defineComponent({
name: 'PlayerListItem', name: 'PlayerListItem',
props: { props: {
@ -22,6 +24,11 @@ export default defineComponent({
required: true required: true
} }
}, },
data() {
return {
playerImage: playerImage,
}
},
methods: { methods: {
follow() { follow() {
useStore().commit(MutationTypes.FOLLOW_PLAYER, this.player); useStore().commit(MutationTypes.FOLLOW_PLAYER, this.player);
@ -55,6 +62,7 @@ export default defineComponent({
left: 0.7rem; left: 0.7rem;
pointer-events: none; pointer-events: none;
margin: auto; margin: auto;
z-index: 1;
} }
.player__name { .player__name {

View File

@ -2,6 +2,8 @@ import {MarkerOptions, DivIcon, DomUtil} from 'leaflet';
import {DynmapPlayer} from "@/dynmap"; import {DynmapPlayer} from "@/dynmap";
import Util from '@/util'; import Util from '@/util';
const playerImage = require('@/assets/images/player_face.png');
const noSkinImage: HTMLImageElement = document.createElement('img'); const noSkinImage: HTMLImageElement = document.createElement('img');
noSkinImage.height = 16; noSkinImage.height = 16;
noSkinImage.width = 16; noSkinImage.width = 16;
@ -18,7 +20,7 @@ const bodyImage: HTMLImageElement = document.createElement('img');
bodyImage.height = 32; bodyImage.height = 32;
bodyImage.width = 32; bodyImage.width = 32;
noSkinImage.src = smallImage.src = largeImage.src = bodyImage.src = 'images/player.png'; noSkinImage.src = smallImage.src = largeImage.src = bodyImage.src = playerImage;
noSkinImage.className = smallImage.className = largeImage.className = bodyImage.className = 'player__icon'; noSkinImage.className = smallImage.className = largeImage.className = bodyImage.className = 'player__icon';
export interface PlayerIconOptions extends MarkerOptions { export interface PlayerIconOptions extends MarkerOptions {