Skip to content

Commit

Permalink
🐛 [feat/maps] correct ETA time
Browse files Browse the repository at this point in the history
  • Loading branch information
@JAGFx
JAGFx committed Dec 19, 2020
1 parent da19b76 commit 72f4f0c
Show file tree
Hide file tree
Showing 5 changed files with 74 additions and 40 deletions.
26 changes: 16 additions & 10 deletions src/dashboards/maps/assets/scss/maps.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,23 +20,30 @@
position: relative;

.ol-control {
display: block;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
position: absolute;
right: .3rem;
bottom: .3rem;
height: 1.5rem;
height: 2rem;

button {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
color: $cWhite;
border: 0;
border-bottom: 2px solid $cRed;
background: $cBlackTransparentMid;
font-size: 1rem;
font-size: 1.5rem;
padding: 0 0 .1rem 0;
margin-right: .15rem;
outline: 0;
width: 1.5rem;
height: 1.5rem;
width: 2rem;
height: 2rem;

&:last-child {
margin-right: 0;
Expand All @@ -45,7 +52,6 @@
}

#rotate-wrapper {
font-size: .7rem;
position: absolute;
right: .3rem;
width: auto;
Expand All @@ -56,7 +62,7 @@
justify-content: center;
align-items: center;
text-align: center;
font-size: .6rem;
font-size: .9rem;

i {
padding: .2rem 0 0 0;
Expand All @@ -81,16 +87,16 @@
justify-content: center;
align-items: center;
text-align: center;
font-size: .6rem;
font-size: 1rem;
color: $cWhite;
border: 0;
border-bottom: 2px solid $cRed;
background: $cBlackTransparentMid;
padding: .1rem 0.5rem 0;
padding: .5rem 0.5rem;
margin-right: .15rem;
outline: 0;
//width: 1.5rem;
height: 1.5rem;
height: 2rem;
}

.ol-mouse-position {
Expand Down
30 changes: 21 additions & 9 deletions src/dashboards/maps/components/DashMaps.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,15 @@
<button id="rotate-button" :class="{ enable: rotateWithPlayer }" @click="onClickRotate">
<i class="fas fa-location-arrow"></i>
</button>
<button id="center-button" :class="{ enable: focusOnPlayer }" @click="onClickCenter">
<i class="fas fa-bullseye"></i>
</button>
</div>
<div id="eta">
ETA:
{{ $jobRemainingTimeDelivery( telemetry.job.deliveryTime.unix ) }},
{{ unit_length( telemetry.job.plannedDistance.km, 'km' ) }}
{{ $etaDueDate() | $dateTimeLocalized( DATE_FORMAT_LONG, TIME_FORMAT_SHORT ) }},
{{ unit_length( telemetry.navigation.distance, 'm' ) }},
{{ $etaRemaing() }}
</div>
</Dashboard>
</template>
Expand All @@ -19,6 +23,7 @@
import { EventBus } from '@/event-bus.js';
import _maps from '@/utils/_maps';
import Dashboard from '../../../components/Elements/Dashboard';
import _app from '../../../utils/_app';
export default {
name: 'DashMaps',
Expand All @@ -27,7 +32,8 @@ export default {
},
data() {
return {
rotateWithPlayer: _maps.d.gBehaviorRotateWithPlayer
rotateWithPlayer: _maps.d.gBehaviorRotateWithPlayer,
focusOnPlayer: _maps.d.gBehaviorCenterOnPlayer
};
},
mounted() {
Expand All @@ -36,17 +42,18 @@ export default {
EventBus.$on( 'tmp-update', dataIn => {
_maps.updatePlayerPositionAndRotation(
dataIn.truck.position.X,
dataIn.truck.position.Y,
dataIn.truck.position.Z,
dataIn.truck.orientation.heading,
dataIn.truck.speed.kph );
} );
// --- Dev
/*_maps.updatePlayerPositionAndRotation(
this.telemetry.truck.position.X,
this.telemetry.truck.position.Y,
this.telemetry.truck.orientation.heading,
this.telemetry.truck.speed.kph );*/
if ( _app.isOnDevEnvironment )
_maps.updatePlayerPositionAndRotation(
this.telemetry.truck.position.X,
this.telemetry.truck.position.Z,
this.telemetry.truck.orientation.heading,
this.telemetry.truck.speed.kph );
// --- ./Dev
},
methods: {
Expand All @@ -57,6 +64,11 @@ export default {
: true;
this.rotateWithPlayer = _maps.d.gBehaviorRotateWithPlayer;
},
onClickCenter() {
_maps.d.gBehaviorCenterOnPlayer = !_maps.d.gBehaviorCenterOnPlayer;
this.focusOnPlayer = _maps.d.gBehaviorCenterOnPlayer;
}
}
};
Expand Down
4 changes: 2 additions & 2 deletions src/data/scs_sdk_plugin_parsed_data.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -557,8 +557,8 @@
},
"position" : {
"X" : 4390.900,
"Y" : -53410.500,
"Z" : -27702.9903755188
"Y" : 0,
"Z" : -53410.500
},
"orientation" : {
"heading" : 0.9078420996665955,
Expand Down
13 changes: 13 additions & 0 deletions src/plugins/telemetry.plugin.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -445,6 +445,19 @@ export default {
strGear = 'R' + Math.abs( transmission.gear.displayed );

return strGear;
},

$etaDueDate: function () {
const currentGameTime = this.$gameTime();
let etaTime = this.telemetry.navigation.time + currentGameTime;

return etaTime;
},
$etaRemaing: function () {
const currentGameTime = this.$gameTime();
const etaTime = this.$etaDueDate();

return utils.app.diffDateTimeLocalized( currentGameTime, etaTime );
}

// --- ./Navigation
Expand Down
41 changes: 22 additions & 19 deletions src/utils/_maps.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,16 @@ let d = {
playerIcon: null,
playerFeature: null,
gBehaviorCenterOnPlayer: true,
gBehaviorRotateWithPlayer: false,
gBehaviorRotateWithPlayer: true,
gIgnoreViewChangeEvents: false,
arrowRotate: ''
};

const MAX_X = 131072;
const MAX_Y = 131072;
const MAP_MAX_X = 131072;
const MAP_MAX_Y = 131072;
const ZOOM_MIN = 0;
const ZOOM_MAX = 9;
const ZOOM_DEFAULT = 9;

// ----

Expand All @@ -28,15 +31,15 @@ const init = () => {
// Any name here. I chose "Funbit" because we are using funbit's image coordinates.
code: 'Funbit',
units: 'pixels',
extent: [ 0, 0, MAX_X, MAX_Y ],
worldExtent: [ 0, 0, MAX_X, MAX_Y ]
extent: [ 0, 0, MAP_MAX_X, MAP_MAX_Y ],
worldExtent: [ 0, 0, MAP_MAX_X, MAP_MAX_Y ]
} );
ol.proj.addProjection( projection );

// Adding a marker for the player position/rotation.
d.playerIcon = new ol.style.Icon( {
anchor: [ 0.5, 39 ],
scale: .5,
scale: .7,
anchorXUnits: 'fraction',
anchorYUnits: 'pixels',
rotateWithView: true,
Expand All @@ -47,7 +50,7 @@ const init = () => {
image: d.playerIcon
} );
d.playerFeature = new ol.Feature( {
geometry: new ol.geom.Point( [ MAX_X / 2, MAX_Y / 2 ] )
geometry: new ol.geom.Point( [ MAP_MAX_X / 2, MAP_MAX_Y / 2 ] )
} );
// For some reason, we cannot pass the style in the constructor.
d.playerFeature.setStyle( playerIconStyle );
Expand All @@ -63,9 +66,9 @@ const init = () => {

// Configuring the custom map tiles.
let custom_tilegrid = new ol.tilegrid.TileGrid( {
extent: [ 0, 0, MAX_X, MAX_Y ],
minZoom: 0,
origin: [ 0, MAX_Y ],
extent: [ 0, 0, MAP_MAX_X, MAP_MAX_Y ],
minZoom: ZOOM_MIN,
origin: [ 0, MAP_MAX_Y ],
tileSize: [ 512, 512 ],
resolutions: (function () {
let r = [];
Expand Down Expand Up @@ -93,8 +96,8 @@ const init = () => {
target: 'map',
controls: [
//new ol.control.ZoomSlider(),
// new ol.control.OverviewMap(),
// new ol.control.Rotate(),
//new ol.control.OverviewMap(),
//new ol.control.Rotate(),
// new ol.control.MousePosition(), // DEBUG
new ol.control.Zoom(),
rotate_control
Expand Down Expand Up @@ -130,12 +133,12 @@ const init = () => {
],
view: new ol.View( {
projection: projection,
extent: [ 0, 0, MAX_X, MAX_Y ],
extent: [ 0, 0, MAP_MAX_X, MAP_MAX_Y ],
//center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
center: [ MAX_X / 2, MAX_Y / 2 ],
minZoom: 2,
maxZoom: 9,
zoom: 3//8
center: [ MAP_MAX_X / 2, MAP_MAX_Y / 2 ],
minZoom: ZOOM_MIN,
maxZoom: ZOOM_MAX,
zoom: ZOOM_DEFAULT
} )
} );

Expand Down Expand Up @@ -180,7 +183,7 @@ const init = () => {

const getMapTilesLayer = ( projection, tileGrid ) => {
return new ol.layer.Tile( {
extent: [ 0, 0, MAX_X, MAX_Y ],
extent: [ 0, 0, MAP_MAX_X, MAP_MAX_Y ],
source: new ol.source.XYZ( {
projection: projection,
url: 'https://github.com/meatlayer/ets2-mobile-route-advisor/raw/master/maps/ets2/tiles/{z}/{x}/{y}.png',
Expand Down Expand Up @@ -255,7 +258,7 @@ const gameCoordToPixels = ( x, y ) => {
if ( x < -31056.8 && y < -5832.867 ) {
let r = [ x / 1.087326 + 57157, y / 1.087326 + 59287 ];
}
r[ 1 ] = MAX_Y - r[ 1 ];
r[ 1 ] = MAP_MAX_Y - r[ 1 ];
return r;
};

Expand Down

1 comment on commit 72f4f0c

@JAGFx
Copy link
Owner Author

@JAGFx JAGFx commented on 72f4f0c Dec 19, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

#3

Please sign in to comment.