Skip to content

Commit

Permalink
🐛 minor fix
Browse files Browse the repository at this point in the history
  • Loading branch information
JAGFx committed Oct 7, 2020
1 parent 08720e8 commit 7453777
Show file tree
Hide file tree
Showing 7 changed files with 202 additions and 184 deletions.
188 changes: 95 additions & 93 deletions src/App.vue
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<template>
<main :class="`${telemetry.game && telemetry.game.game.id === 2 ? 'ats' : 'ets2'}`">
<b-overlay :show="!gameConnected" :variant="'dark'" no-wrap>
<main :class="`${telemetry.game && telemetry.game.game.id === 2 ? 'ats' : 'ets2'}`">
<b-overlay :show="!gameConnected" :variant="'dark'" no-wrap>
<template v-slot:overlay>
<div class="d-flex justify-content-center flex-column align-items-center">
<transition mode="out-in" name="slide-fade">
Expand All @@ -21,7 +21,9 @@
<div class="wrapper menu h-100" v-if="gameConnected" v-show="menuIsDisplayed">
<Menu></Menu>
</div>
<component v-bind:is="currentSkinComponent()" v-if="gameConnected" v-show="!menuIsDisplayed"></component>
<keep-alive>
<component v-bind:is="currentSkinComponent()" v-if="gameConnected" v-show="!menuIsDisplayed"></component>
</keep-alive>
<!--<Events id="events" v-bind="{log}" />-->
<!--<Controls id="controls" v-bind="{...controls, transmission: truck.transmission}" />-->
</main>
Expand Down Expand Up @@ -57,60 +59,60 @@ export default {
DashManTGX,
DashMercedesAtego,
DashRdInfo,
DashScania,
DashVolvoFH,
Game,
Menu,
OverlayElement
},
mixins: [ AppDashMixins ],
data() {
return {
launching: {
icon: '<i class="fas fa-box"></i>',
text: 'App ready !',
subText: 'Starting delivering'
}
};
},
created() {
//console.log( this );
this.$store.dispatch( 'skins/setFirstActive' );
this.$store.dispatch( 'config/load' );
/*// Game connected
setTimeout(()=> {
this.launching = {
icon: '<i class="fas fa-truck-loading"></i>',
text: 'Game connected',
subText: 'Delivering'
}
}, 6000);
// After game connected + 3s
setTimeout(()=> {
this.launching = {
icon: '<i class="fas fa-box-open"></i>',
text: 'Finished',
subText: 'Delivered'
}
}, 9000);*/
},
methods: {
currentSkinComponent() {
const currentSkin = this.currentSkin; //this.$store.getters[ 'skins/current' ];
if ( currentSkin === undefined || currentSkin === null )
return null;
return 'Dash' + currentSkin.id;
DashScania,
DashVolvoFH,
Game,
Menu,
OverlayElement
},
mixins: [ AppDashMixins ],
data() {
return {
launching: {
icon: '<i class="fas fa-box"></i>',
text: 'App ready !',
subText: 'Starting delivering'
}
},
computed: {
};
},
created() {
//console.log( 'Vue env: ', process.env );
this.$store.dispatch( 'skins/setFirstActive' );
this.$store.dispatch( 'config/load' );
/*// Game connected
setTimeout(()=> {
this.launching = {
icon: '<i class="fas fa-truck-loading"></i>',
text: 'Game connected',
subText: 'Delivering'
}
}, 6000);
// After game connected + 3s
setTimeout(()=> {
this.launching = {
icon: '<i class="fas fa-box-open"></i>',
text: 'Finished',
subText: 'Delivered'
}
}, 9000);*/
},
methods: {
currentSkinComponent() {
const currentSkin = this.currentSkin; //this.$store.getters[ 'skins/current' ];
if ( currentSkin === undefined || currentSkin === null )
return null;
return 'Dash' + currentSkin.id;
}
},
computed: {
gameConnected() {
const gameReady = this.telemetry.game !== null &&
(typeof this.telemetry.game
Expand All @@ -127,52 +129,52 @@ export default {
currentSkin: 'skins/current'
} )
},
sockets: {
connect: function () {
sockets: {
connect: function () {
console.log( 'connected' );
this.launching = {
icon: '<i class="fas fa-truck"></i>',
text: 'Connected to telemetry server',
subText: 'Ready to delivering'
};
},
update: function ( data ) {
let srvData = {};
for ( const key of Object.keys( data ) ) {
srvData[ key ] = data[ key ];
}
this.$store.commit( 'telemetry/update', srvData );
},
log: function ( log ) {
/*log.reverse();
this.log = log;*/
//console.log( 'Log---', log );
/*switch ( log.eventName ) {
case 'game.connected':
this.launching = {
icon: '<i class="fas fa-truck-loading"></i>',
text: 'Game connected',
subText: 'Delivering. Waiting you on road !'
};
break;
}*/
const event = _event.filterInputEvent( log );
if ( event !== false ) {
//console.log( log );
this.$store.dispatch( 'events/emitEvent', {
eventName: event.eventName,
rawData: event.rawData
} );
}
update: function ( data ) {
let srvData = {};
for ( const key of Object.keys( data ) ) {
srvData[ key ] = data[ key ];
}
this.$store.commit( 'telemetry/update', srvData );
},
log: function ( log ) {
/*log.reverse();
this.log = log;*/
//console.log( 'Log---', log );
/*switch ( log.eventName ) {
case 'game.connected':
this.launching = {
icon: '<i class="fas fa-truck-loading"></i>',
text: 'Game connected',
subText: 'Delivering. Waiting you on road !'
};
break;
}*/
const event = _event.filterInputEvent( log );
if ( event !== false ) {
//console.log( log );
this.$store.dispatch( 'events/emitEvent', {
eventName: event.eventName,
rawData: event.rawData
} );
}
}
};
}
}
};
</script>

<style lang="scss">
@import "assets/scss/app/app";
@import "assets/scss/app/app";
</style>
50 changes: 25 additions & 25 deletions src/components/Menu/tabs/Elements/TabConfigElement.vue
Original file line number Diff line number Diff line change
@@ -1,20 +1,22 @@
<template>
<div class="field d-flex justify-content-between align-items-center" v-if="elm.disabled === undefined || ( elm.disabled !== undefined && !elm.disabled )">
<div>
<h5 class="m-0">{{ elm.label }}</h5>
<small class="font-italic text-muted">{{ elm.description }}</small>
</div>
<div class="switch d-flex justify-content-between align-items-stretch" v-if="elm.values.length <= 2" :class="{ 'processing': appGetProcessing() }">
<div :class="{ 'active': current( elm.id ) === value.value }" :key="value.value" @click="set( value.value )" class="value w-100 m-0 text-center d-flex justify-content-center align-items-center" v-for="value in elm.values">
<span class="py-1 px-2">{{ value.label }}</span>
</div>
</div>
<div class="select d-flex justify-content-between align-items-stretch" v-else-if="elm.values.length > 2" :class="{ 'processing': appGetProcessing() }">
<select :disabled="appGetProcessing()" :multiple="elm.multiple !== undefined && elm.multiple" @change="set( current( elm.id ) )" class="custom-select value w-100 m-0 py-1 px-2">
<option :key="value.value" :selected="current( elm.id ) === value.value" :value="value.value" v-for="value in elm.values">{{ value.label }}</option>
</select>
</div>
</div>
<div>
<h5 class="m-0">{{ elm.label }}</h5>
<small class="font-italic text-muted">{{ elm.description }}</small>
</div>
<div class="switch d-flex justify-content-between align-items-stretch" v-if="elm.values.length <= 2" :class="{ 'processing': appGetProcessing }">
<div :class="{ 'active': current( elm.id ) === value.value }" :key="value.value" @click="set( value.value )" class="value w-100 m-0 text-center d-flex justify-content-center align-items-center" v-for="value in elm.values">
<span class="py-1 px-2">{{ value.label }}</span>
</div>
</div>
<div class="select d-flex justify-content-between align-items-stretch" v-else-if="elm.values.length > 2" :class="{ 'processing': appGetProcessing }">
<select :disabled="appGetProcessing" :multiple="elm.multiple !== undefined && elm.multiple" @change="set( current( elm.id ) )" class="custom-select value w-100 m-0 py-1 px-2">
<option :key="value.value" :selected="current( elm.id ) === value.value" :value="value.value" v-for="value in elm.values">
{{ value.label }}
</option>
</select>
</div>
</div>
</template>

<script>
Expand All @@ -28,19 +30,17 @@
},
computed: {
...mapGetters( {
current: 'config/get'
} )
current: 'config/get',
appGetProcessing: 'app/getProcessing'
} )
},
methods: {
set( value ) {
this.$store.commit( 'config/setElm', {
id: this.elm.id,
value: value
} );
},
...mapGetters( {
appGetProcessing: 'app/getProcessing'
} )
this.$store.commit( 'config/setElm', {
id: this.elm.id,
value: value
} );
}
}
};
</script>
Expand Down
58 changes: 28 additions & 30 deletions src/components/Menu/tabs/TabConfig.vue
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
<template>
<div class="tab-config">
<div class="d-flex justify-content-center align-items-center pb-3">
<!--<button :disabled="isOnProcessing()" @click="save" class="btn btn-sm btn-outline-ets mx-1">
<b-icon-file-earmark-check></b-icon-file-earmark-check>
Save
</button>-->
<button :disabled="isOnProcessing()" @click="download" class="btn btn-sm btn-outline-ets mx-1">
<b-icon-file-earmark-arrow-down></b-icon-file-earmark-arrow-down>
Download
</button>
<!--<button :disabled="isOnProcessing()" @click="reset" class="btn btn-sm btn-outline-ets mx-1">
<b-icon-file-earmark-break></b-icon-file-earmark-break>
Reset
</button>-->
<span>
<button :disabled="isOnProcessing()" @click="showUpload = !showUpload" class="btn btn-sm btn-outline-ets mx-1">
<!--<button :disabled="isOnProcessing" @click="save" class="btn btn-sm btn-outline-ets mx-1">
<b-icon-file-earmark-check></b-icon-file-earmark-check>
Save
</button>-->
<button :disabled="isOnProcessing" @click="download" class="btn btn-sm btn-outline-ets mx-1">
<b-icon-file-earmark-arrow-down></b-icon-file-earmark-arrow-down>
Download
</button>
<!--<button :disabled="isOnProcessing" @click="reset" class="btn btn-sm btn-outline-ets mx-1">
<b-icon-file-earmark-break></b-icon-file-earmark-break>
Reset
</button>-->
<span>
<button :disabled="isOnProcessing" @click="showUpload = !showUpload" class="btn btn-sm btn-outline-ets mx-1">
<b-icon-file-earmark-arrow-up></b-icon-file-earmark-arrow-up> Upload
</button>
<input @change="upload" accept="application/json" class="btn btn-sm btn-outline-ets mx-1" type="file" v-show="showUpload" ref="uploadFile" />
Expand Down Expand Up @@ -85,8 +85,9 @@
},
computed: {
...mapGetters( {
configAll: 'config/all'
} )
configAll: 'config/all',
isOnProcessing: 'app/isOnProcessing'
} )
},
methods: {
skinsConfigTemplate( skinTarget ) {
Expand Down Expand Up @@ -117,20 +118,17 @@
title: 'Upload failed',
message: e
},
details: {
message: e,
code: '#CONFIG_UPLOAD_FAILED'
}
} );
} )
.finally( () => {
this.$refs.uploadFile.value = null;
this.showUpload = false;
} );
},
...mapGetters( {
isOnProcessing: 'app/isOnProcessing'
} )
details: {
message: e,
code: '#CONFIG_UPLOAD_FAILED'
}
} );
} )
.finally( () => {
this.$refs.uploadFile.value = null;
this.showUpload = false;
} );
}
}
};
</script>
Expand Down
Loading

0 comments on commit 7453777

Please sign in to comment.