Skip to content
This repository was archived by the owner on May 26, 2023. It is now read-only.

Commit 83b9ea5

Browse files
coalauracoalaura
authored
Merge pull request #227 from ExpDev07/dev
Update
2 parents dcc3241 + 4b5e7bc commit 83b9ea5

File tree

8 files changed

+423
-23
lines changed

8 files changed

+423
-23
lines changed

‎package-lock.json

Lines changed: 307 additions & 5 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
"leaflet-rotatedmarker": "^0.2.0",
4747
"rainbowvis.js": "^1.0.1",
4848
"vue-linkify": "^1.0.1",
49+
"vue-speedometer": "^1.8.0",
4950
"vue2-circle-progress": "^1.2.3"
5051
}
5152
}

‎public/images/height-indicator.png

6.89 KB
Loading

‎public/images/icons/open_wheel.png

7.63 KB
Loading

‎resources/js/Pages/Map/Index.vue

Lines changed: 84 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -41,28 +41,73 @@
4141

4242
<template>
4343
<div class="-mt-12" id="map-wrapper">
44-
<div class="flex flex-wrap mb-2">
45-
<input type="text"
46-
class="form-control w-56 rounded border block mobile:w-full px-4 py-2 bg-gray-200 dark:bg-gray-600"
47-
:placeholder="t('map.track_placeholder')" v-model="tracking.id"/>
48-
<select
49-
class="block w-44 ml-2 px-4 py-2 bg-gray-200 dark:bg-gray-600 border rounded mobile:w-full mobile:m-0 mobile:mt-1"
50-
v-model="tracking.type">
51-
<option value="server_">{{ t('map.track_server') }}</option>
52-
<option value="">{{ t('map.track_steam') }}</option>
53-
<option value="player_">{{ t('map.track_character') }}</option>
54-
</select>
44+
<div class="flex flex-wrap justify-between mb-2 w-map max-w-full">
45+
<div class="flex flex-wrap">
46+
<input type="text"
47+
class="form-control w-56 rounded border block mobile:w-full px-4 py-2 bg-gray-200 dark:bg-gray-600"
48+
:placeholder="t('map.track_placeholder')" v-model="tracking.id"/>
49+
<select
50+
class="block w-44 ml-2 px-4 py-2 bg-gray-200 dark:bg-gray-600 border rounded mobile:w-full mobile:m-0 mobile:mt-1"
51+
v-model="tracking.type">
52+
<option value="server_">{{ t('map.track_server') }}</option>
53+
<option value="">{{ t('map.track_steam') }}</option>
54+
<option value="player_">{{ t('map.track_character') }}</option>
55+
</select>
56+
<button
57+
class="px-5 py-2 ml-2 font-semibold text-white rounded bg-primary dark:bg-dark-primary mobile:block mobile:w-full mobile:m-0 mobile:mt-1"
58+
@click="trackId(tracking.type + tracking.id)">
59+
{{ t('map.do_track') }}
60+
</button>
61+
</div>
5562
<button
5663
class="px-5 py-2 ml-2 font-semibold text-white rounded bg-primary dark:bg-dark-primary mobile:block mobile:w-full mobile:m-0 mobile:mt-1"
57-
@click="trackId(tracking.type + tracking.id)">
58-
{{ t('map.do_track') }}
64+
@click="advancedTracking = !advancedTracking"
65+
:title="advancedTracking ? t('global.enabled') : t('global.disabled')"
66+
>
67+
{{ t('map.advanced_track') }}
68+
<i class="fas fa-check ml-1" v-if="advancedTracking"></i>
69+
<i class="fas fa-times ml-1" v-else></i>
5970
</button>
6071
</div>
61-
<div class="relative">
72+
<div class="relative w-map max-w-full">
6273
<div id="map" class="w-map max-w-full relative h-max"></div>
6374
<pre class="bg-opacity-70 bg-white coordinate-attr absolute bottom-0 left-0 cursor-pointer z-1k"
6475
v-if="clickedCoords"><span @click="copyText($event, clickedCoords)">{{ clickedCoords }}</span> / <span
6576
@click="copyText($event, coordsCommand)">{{ t('map.command') }}</span></pre>
77+
<pre
78+
class="w-map-gauge bg-opacity-70 bg-white absolute bottom-attr2 right-0 z-1k p-2 text-gray-800 text-xs"
79+
v-if="advancedTracking && trackedPlayer"
80+
>{{ tracking.data.advanced }}</pre>
81+
<div
82+
class="w-map-gauge bg-opacity-70 bg-white absolute bottom-attr right-0 z-1k px-2 pt-2 pb-1 flex"
83+
:class="{'hidden' : !advancedTracking || !trackedPlayer}"
84+
>
85+
<div class="relative w-map-other-gauge">
86+
<img src="/images/height-indicator.png" style="height: 90px" alt="Height indicator" />
87+
<div
88+
class="font-bold absolute border-b-2 border-gray-700 left-8 text-gray-700 w-map-height-ind text-right text-xxs leading-3"
89+
:style="'bottom: ' + tracking.data.alt + '%;'"
90+
>
91+
{{ tracking.data.altitude }}
92+
</div>
93+
</div>
94+
<vue-speedometer
95+
class="inline-block"
96+
:value="tracking.data.speed"
97+
labelFontSize="12px"
98+
:ringWidth="20"
99+
:height="90"
100+
:width="120"
101+
startColor="#90EF90"
102+
endColor="#fa1e43"
103+
:minValue="0"
104+
:maxValue="360"
105+
:segments="4"
106+
currentValueText="${value}mph"
107+
valueTextFontSize="14px"
108+
:needleHeightRatio="0.7"
109+
/>
110+
</div>
66111
</div>
67112
<div class="flex flex-wrap">
68113
<div v-if="afkPeople" class="pt-4 mr-4">
@@ -88,6 +133,7 @@ import {GestureHandling} from "leaflet-gesture-handling";
88133
import "leaflet-rotatedmarker";
89134
import 'leaflet-fullscreen';
90135
import custom_icons from "../../data/vehicles.json";
136+
import VueSpeedometer from "vue-speedometer";
91137
92138
const Rainbow = require('rainbowvis.js');
93139
@@ -156,6 +202,7 @@ export default {
156202
layout: Layout,
157203
components: {
158204
VSection,
205+
VueSpeedometer,
159206
},
160207
props: {
161208
servers: {
@@ -199,8 +246,15 @@ export default {
199246
},
200247
tracking: {
201248
id: '',
202-
type: 'server_'
249+
type: 'server_',
250+
data: {
251+
speed: 0,
252+
alt: 0,
253+
altitude: '0m',
254+
advanced: 'Loading...'
255+
}
203256
},
257+
advancedTracking: false,
204258
cayoCalibrationMode: false // Set this to true to recalibrate the cayo perico map
205259
};
206260
},
@@ -488,6 +542,7 @@ export default {
488542
}
489543
490544
const id = "player_" + player.character.id,
545+
originalCoords = Math.round(player.coords.x) + ' ' + Math.round(player.coords.y) + ' ' + Math.round(player.coords.z),
491546
coords = _this.convertCoords(player.coords),
492547
heading = _this.mapNumber(-player.heading, -180, 180, 0, 360) - 180,
493548
isDriving = 'vehicle' in player && player.vehicle && player.vehicle.driving,
@@ -605,6 +660,20 @@ export default {
605660
duration: 0.1
606661
});
607662
663+
_this.tracking.data.speed = Math.round(speed * 2.236936);
664+
665+
const feet = Math.round(player.coords.z * 3.281);
666+
667+
_this.tracking.data.alt = (feet / 5000) * 100;
668+
_this.tracking.data.alt = _this.tracking.data.alt > 99 ? 99 : _this.tracking.data.alt;
669+
_this.tracking.data.altitude = feet + 'ft';
670+
671+
_this.tracking.data.advanced = [
672+
player.character.fullName + ' (' + player.source + ')',
673+
'Coords: ' + originalCoords,
674+
'Vehicle: ' + (player.vehicle ? player.vehicle.model : 'n/a')
675+
].join("\n");
676+
608677
if (_this.firstRefresh) {
609678
_this.openPopup = id;
610679
}

‎resources/js/data/vehicles.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -265,6 +265,24 @@
265265
]
266266
},
267267

268+
"go-kart": {
269+
"size": 24,
270+
"models": [
271+
"veto",
272+
"veto2"
273+
]
274+
},
275+
276+
"open_wheel": {
277+
"size": 26,
278+
"models": [
279+
"formula",
280+
"formula2",
281+
"openwheel1",
282+
"openwheel2"
283+
]
284+
},
285+
268286
"tank": {
269287
"size": 27,
270288
"models": [

‎resources/js/locales/en-us.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@
1616
"view_map": "View on Live-Map",
1717
"yes": "Yes",
1818
"no": "No",
19+
"enabled": "Enabled",
20+
"disabled": "Disabled",
1921
"do_search": "Search",
2022
"status": {
2123
"online": "Online",
@@ -94,6 +96,7 @@
9496
"track_steam": "Steam Identifier",
9597
"track_character": "Character ID",
9698
"do_track": "Track",
99+
"advanced_track": "Advanced Track",
97100
"kick_reason": "You were afk for more than {0}, consider leaving the server or going to the character selection screen when you have to be afk for longer periods of time"
98101
},
99102
"nav": {

‎tailwind.config.js

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ module.exports = {
1414
theme: {
1515
screens: {
1616
'mobile': {
17-
'max': '640px'
17+
'max': '640px',
1818
},
1919
'sm': '640px',
2020
'md': '768px',
@@ -44,6 +44,9 @@ module.exports = {
4444
'tp-staff': '200px',
4545
'inventory_contents': '660px',
4646
'inventory_slot': '100px',
47+
'map-gauge': '258px',
48+
'map-other-gauge': 'calc(100% - 125px)',
49+
'map-height-ind': '60px',
4750
},
4851
height: {
4952
'side-close': '40px',
@@ -53,10 +56,14 @@ module.exports = {
5356
'inventory_slot': '100px',
5457
},
5558
minWidth: {
56-
'input': '200px'
59+
'input': '200px',
5760
},
5861
maxHeight: {
59-
'max': 'calc(100% - 60px)'
62+
'max': 'calc(100% - 60px)',
63+
},
64+
inset: {
65+
'attr': '16.5px',
66+
'attr2': '119px',
6067
},
6168
colors: {
6269
// Light & dark.

0 commit comments

Comments
 (0)