Spythere/stacjownik
1
0
Fork 0
mirror of https://github.com/Spythere/stacjownik.git synced 2026-05-03 05:18:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: added more advanced tooltips for station table icons

Browse Source
This commit is contained in:
Spythere
2025-07-17 14:34:05 +02:00
parent 7b5ef18ad6
commit 86259988c9
3 changed files with 69 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/StationsView/StationTable.vue
+55 -34
View File
@@ -33,12 +33,12 @@
class="header-image" class="header-image"
:class="headerName" :class="headerName"
> >
<span class="header_wrapper"> <span
<img class="header_wrapper"
:src="`/images/icon-${headerName}.svg`" data-tooltip-type="BaseTooltip"
:alt="headerName" :data-tooltip-content="$t(`sceneries.headers.${headerName}`)"
:title="$t(`sceneries.headers.${headerName}`)" >
/> <img :src="`/images/icon-${headerName}.svg`" :alt="headerName" />
<img <img
class="sort-icon" class="sort-icon"
@@ -76,37 +76,49 @@
station.generalInfo.availability != 'nonPublic' && station.generalInfo.availability != 'nonPublic' &&
station.generalInfo.availability != 'unavailable' station.generalInfo.availability != 'unavailable'
" "
data-tooltip-type="BaseTooltip"
:data-tooltip-content="`${$t(`sceneries.info.${station.generalInfo.availability}`)} (${$t(
'sceneries.info.req-level',
{ lvl: station.generalInfo.reqLevel },
station.generalInfo.reqLevel
)})`"
:style="calculateExpStyle(station.generalInfo.reqLevel)" :style="calculateExpStyle(station.generalInfo.reqLevel)"
> >
{{ station.generalInfo.reqLevel >= 2 ? station.generalInfo.reqLevel : 'L' }} {{ station.generalInfo.reqLevel >= 2 ? station.generalInfo.reqLevel : 'L' }}
</span> </span>
<span v-else-if="station.generalInfo.availability == 'abandoned'"> <span
<img v-else-if="station.generalInfo.availability == 'abandoned'"
src="/images/icon-abandoned.svg" data-tooltip-type="BaseTooltip"
alt="non-public" :data-tooltip-content="$t('sceneries.info.abandoned')"
:title="$t('sceneries.info.abandoned')" >
/> <img src="/images/icon-abandoned.svg" alt="non-public" />
</span> </span>
<span v-else-if="station.generalInfo.availability == 'nonPublic'"> <span
<img v-else-if="station.generalInfo.availability == 'nonPublic'"
src="/images/icon-lock.svg" data-tooltip-type="BaseTooltip"
alt="non-public" :data-tooltip-content="$t('sceneries.info.non-public')"
:title="$t('sceneries.info.non-public')" >
/> <img src="/images/icon-lock.svg" alt="non-public" />
</span> </span>
<span v-else> <span
<img v-else
src="/images/icon-unavailable.svg" data-tooltip-type="BaseTooltip"
alt="unavailable" :data-tooltip-content="$t('sceneries.info.unavailable')"
:title="$t('sceneries.info.unavailable')" >
/> <img src="/images/icon-unavailable.svg" alt="unavailable" />
</span> </span>
</span> </span>
<span v-else> ? </span> <span
v-else
data-tooltip-type="BaseTooltip"
:data-tooltip-content="$t('sceneries.info.unknown')"
>
?
</span>
</td> </td>
<td class="station-status"> <td class="station-status">
@@ -153,7 +165,8 @@
<span <span
v-if="station.generalInfo.routes.singleElectrifiedNames.length != 0" v-if="station.generalInfo.routes.singleElectrifiedNames.length != 0"
class="track catenary" class="track catenary"
:title="`${$t('sceneries.info.single-track-routes-catenary')}${ data-tooltip-type="BaseTooltip"
:data-tooltip-content="`${$t('sceneries.info.single-track-routes-catenary')}${
station.generalInfo.routes.singleElectrifiedNames.length station.generalInfo.routes.singleElectrifiedNames.length
}`" }`"
> >
@@ -163,7 +176,8 @@
<span <span
v-if="station.generalInfo.routes.singleOtherNames.length != 0" v-if="station.generalInfo.routes.singleOtherNames.length != 0"
class="track no-catenary" class="track no-catenary"
:title="`${$t('sceneries.info.single-track-routes-other')}${ data-tooltip-type="BaseTooltip"
:data-tooltip-content="`${$t('sceneries.info.single-track-routes-other')}${
station.generalInfo.routes.singleOtherNames.length station.generalInfo.routes.singleOtherNames.length
}`" }`"
> >
@@ -177,7 +191,8 @@
<span <span
v-if="station.generalInfo.routes.doubleElectrifiedNames.length != 0" v-if="station.generalInfo.routes.doubleElectrifiedNames.length != 0"
class="track catenary" class="track catenary"
:title="`${$t('sceneries.info.double-track-routes-catenary')}${ data-tooltip-type="BaseTooltip"
:data-tooltip-content="`${$t('sceneries.info.double-track-routes-catenary')}${
station.generalInfo.routes.doubleElectrifiedNames.length station.generalInfo.routes.doubleElectrifiedNames.length
}`" }`"
> >
@@ -187,7 +202,8 @@
<span <span
v-if="station.generalInfo.routes.doubleOtherNames.length != 0" v-if="station.generalInfo.routes.doubleOtherNames.length != 0"
class="track no-catenary" class="track no-catenary"
:title="`${$t('sceneries.info.double-track-routes-other')}${ data-tooltip-type="BaseTooltip"
:data-tooltip-content="`${$t('sceneries.info.double-track-routes-other')}${
station.generalInfo.routes.doubleOtherNames.length station.generalInfo.routes.doubleOtherNames.length
}`" }`"
> >
@@ -201,7 +217,8 @@
v-if="station.generalInfo?.signalType" v-if="station.generalInfo?.signalType"
class="scenery-icon icon-info" class="scenery-icon icon-info"
:class="station.generalInfo?.controlType.replace('+', '-')" :class="station.generalInfo?.controlType.replace('+', '-')"
:title=" data-tooltip-type="BaseTooltip"
:data-tooltip-content="
$t('sceneries.info.control-type') + $t('sceneries.info.control-type') +
$t(`controls.${station.generalInfo?.controlType}`) $t(`controls.${station.generalInfo?.controlType}`)
" "
@@ -214,7 +231,8 @@
class="icon-info" class="icon-info"
:src="`/images/icon-${station.generalInfo.signalType}.svg`" :src="`/images/icon-${station.generalInfo.signalType}.svg`"
:alt="station.generalInfo.signalType" :alt="station.generalInfo.signalType"
:title=" data-tooltip-type="BaseTooltip"
:data-tooltip-content="
$t('sceneries.info.signals-type') + $t(`signals.${station.generalInfo.signalType}`) $t('sceneries.info.signals-type') + $t(`signals.${station.generalInfo.signalType}`)
" "
/> />
@@ -224,7 +242,8 @@
class="icon-info" class="icon-info"
src="/images/icon-SUP.svg" src="/images/icon-SUP.svg"
alt="SUP (RASP-UZK)" alt="SUP (RASP-UZK)"
:title="$t('sceneries.info.SUP')" data-tooltip-type="BaseTooltip"
:data-tooltip-content="$t('sceneries.info.SUP')"
/> />
<img <img
@@ -232,7 +251,8 @@
class="icon-info" class="icon-info"
src="/images/icon-ASDEK.svg" src="/images/icon-ASDEK.svg"
alt="dSAT ASDEK" alt="dSAT ASDEK"
:title="$t('sceneries.info.ASDEK')" data-tooltip-type="BaseTooltip"
:data-tooltip-content="$t('sceneries.info.ASDEK')"
/> />
<img <img
@@ -240,7 +260,8 @@
class="icon-info" class="icon-info"
src="/images/icon-unknown.svg" src="/images/icon-unknown.svg"
alt="icon-unknown" alt="icon-unknown"
:title="$t('sceneries.info.unknown')" data-tooltip-type="BaseTooltip"
:data-tooltip-content="$t('sceneries.info.unknown')"
/> />
</td> </td>
src/locales/en.json
+11 -9
View File
@@ -337,18 +337,20 @@
}, },
"info": { "info": {
"control-type": "Control type: ", "control-type": "Control type: ",
"signals-type": "Signals type: ", "signals-type": "Signalling type: ",
"SBL": "This scenery has automatic block signalling (ABS/SBL) system on following routes: ", "SBL": "A scenery with automatic block signalling (ABS/SBL) on routes: ",
"SUP": "Requires the SUP program (level crossing remote control)", "SUP": "Requires the SUP program (level crossing remote control)",
"ASDEK": "Requires the ASDEK program (defect detection of moving rolling stock)", "ASDEK": "ASDEK program available (defect detection of moving rolling stock)",
"TWB-all": "This scenery has two-way route blockade on all routes", "TWB-all": "This scenery has two-way route blockade on all routes",
"TWB-routes": "This scenery has two-way route blockade on following routes: ", "TWB-routes": "This scenery has two-way route blockade on following routes: ",
"default": "This scenery is available by default", "default": "Scenery available in game package",
"non-public": "This scenery is not public", "nonDefault": "Sceneria available to download from forum site",
"unavailable": "This scenery is unavailable", "req-level": "all dispatcher levels | requries {lvl} dispatcher lvl | requires {lvl} dispatcher lvl",
"abandoned": "This scenery is no longer supported by its creators", "non-public": "Non-public scenery",
"unknown": "This scenery isn't recognizable right now", "unavailable": "Unavailable scenery",
"real": "Scenery with real lines: ", "abandoned": "Abandoned scenery",
"unknown": "Unknown scenery",
"real": "Scenery with real Polish routes: ",
"double-track-routes-catenary": "Electrified double-track routes count: ", "double-track-routes-catenary": "Electrified double-track routes count: ",
"single-track-routes-catenary": "Electrified single-track routes count: ", "single-track-routes-catenary": "Electrified single-track routes count: ",
"double-track-routes-other": "Not electrified double-track routes count: ", "double-track-routes-other": "Not electrified double-track routes count: ",
src/locales/pl.json
+3 -1
View File
@@ -338,8 +338,10 @@
"signals-type": "Sygnalizacja: ", "signals-type": "Sygnalizacja: ",
"SBL": "Sceneria posiada SBL na szlakach: ", "SBL": "Sceneria posiada SBL na szlakach: ",
"SUP": "Wymaga programu SUP do kontroli systemu RASP-UZK", "SUP": "Wymaga programu SUP do kontroli systemu RASP-UZK",
"ASDEK": "Wymaga programu ASDEK do detekcji stanów awaryjnych taboru w ruchu", "ASDEK": "Dostępny program ASDEK do detekcji stanów awaryjnych taboru w ruchu",
"default": "Sceneria dostępna domyślnie w paczce z grą", "default": "Sceneria dostępna domyślnie w paczce z grą",
"nonDefault": "Sceneria dostępna do pobrania ze strony forum",
"req-level": "ogólnodostępna | od {lvl} poz. DR | od {lvl} poz. DR",
"non-public": "Sceneria niepubliczna", "non-public": "Sceneria niepubliczna",
"unavailable": "Sceneria niedostępna", "unavailable": "Sceneria niedostępna",
"abandoned": "Sceneria wycofana z rozgrywki", "abandoned": "Sceneria wycofana z rozgrywki",