Add custom XML file selection highlight.

This commit is contained in:
Daniel Ceregatti 2023-05-25 08:53:31 -07:00
parent 5267ae70bb
commit 20910730df
2 changed files with 16 additions and 3 deletions

View file

@ -20,6 +20,10 @@ body {
background-color: aliceblue; background-color: aliceblue;
} }
.selected {
background-color: cyan;
}
.simulink { .simulink {
cursor: pointer; cursor: pointer;
text-underline: blue; text-underline: blue;

View file

@ -48,8 +48,8 @@ const template = `
</table> </table>
</div> </div>
<div class="col-9 modInfo" v-if="modInfo != ''"> <div class="col-9 modInfo" v-if="modInfo != ''">
<div class="text-center col-2"> <div class="text-center col-12">
<h2>{{ modInfo.name }}</h2> <h2>{{ modInfo.name }} mod info:</h2>
</div> </div>
<div class="row"> <div class="row">
<div class="col-2"> <div class="col-2">
@ -63,7 +63,12 @@ const template = `
Custom XML files: Custom XML files:
<ul> <ul>
<li v-for="info in modInfo.customXML"> <li v-for="info in modInfo.customXML">
<a class="simulink" @click="getXMLInfo(modInfo.id,info.name)">{{ info.name }}</a> <a
:class="'simulink xmlfile ' + info.name"
@click="getXMLInfo(modInfo.id,info.name)"
>
{{ info.name }}
</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -88,6 +93,7 @@ export default {
mods: [], mods: [],
modInfo: "", modInfo: "",
version: "Unknown", version: "Unknown",
XMLFile: "",
XMLInfo: "", XMLInfo: "",
} }
}, },
@ -105,10 +111,13 @@ export default {
}) })
}, },
getXMLInfo(modId, file) { getXMLInfo(modId, file) {
for (const e of document.getElementsByClassName("selected")) e.classList.remove("selected")
fetch('/mod/' + modId + '/' + file) fetch('/mod/' + modId + '/' + file)
.then(response => response.text()) .then(response => response.text())
.then(response => { .then(response => {
this.XMLFile = file
this.XMLInfo = response this.XMLInfo = response
for (const e of document.getElementsByClassName(file)) e.classList.add("selected")
}) })
.catch((error) => { .catch((error) => {
console.error(error) console.error(error)