Version 1.0.0 - Basic Web Application
This commit is contained in:
@ -1,144 +0,0 @@
|
||||
metrics.createWindow(() => {
|
||||
|
||||
const View = new ViewWindow({
|
||||
title: `<i class="fa-solid fa-square-poll-vertical"></i> Web Metrik`,
|
||||
width: "600px",
|
||||
height: "600px",
|
||||
})
|
||||
|
||||
loadMetrics()
|
||||
|
||||
function loadMetrics() {
|
||||
|
||||
View.setContent(`
|
||||
<div class="metrics">
|
||||
<div class='mt-bar'>
|
||||
<p> <strong>WebMetrik</strong> : <span id='${View.getViewTitle()}_number'><i>Calcul en cours</i></span></p>
|
||||
<div>
|
||||
<button id='${View.getViewTitle()}_refresh' class='btn green'><span><i class='fa fa-rotate-left'></i> Rafraîchir</span></button>
|
||||
<button id='${View.getViewTitle()}_add' class='btn blue'><span><i class='fa fa-add'></i> Ajouter un WebMetrik</span></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class='mt-metrics' id='${View.getViewTitle()}_metrics'>
|
||||
|
||||
<div style='font-size: 24px; margin-top: 180px;' class='t-center'>
|
||||
<p><i class="fa-solid fa-rotate fa-spin"></i> Chargement en cours ...</p>
|
||||
</div>
|
||||
|
||||
</div>`)
|
||||
|
||||
const metricsList = new Array()
|
||||
const metricsComponent = new Array()
|
||||
const metricsReq = get("MT_ALL")
|
||||
|
||||
const metricsDiv = document.getElementById(`${View.getViewTitle()}_metrics`)
|
||||
const metricsNumber = document.getElementById(`${View.getViewTitle()}_number`)
|
||||
const addButton = document.getElementById(`${View.getViewTitle()}_add`)
|
||||
const refreshButton = document.getElementById(`${View.getViewTitle()}_refresh`)
|
||||
const metricsView = document.getElementById(`${View.getViewTitle()}_metrics`)
|
||||
|
||||
refreshButton.addEventListener("click", () => {
|
||||
loadMetrics()
|
||||
})
|
||||
|
||||
metricsReq.then((ANS_metrics) => {
|
||||
console.log(ANS_metrics)
|
||||
if(ANS_metrics != "UNAVAILABLE") {
|
||||
metricsList.length = 0
|
||||
if(ANS_metrics.length == 0) {
|
||||
metricsList.push(`<div style='font-size: 24px; margin-top: 180px;' class='yellow t-center'>
|
||||
<p><i class="fa-solid fa-warning"></i> Aucune WebMetrik n'a été ajoutée</p>
|
||||
</div>`)
|
||||
}
|
||||
ANS_metrics.forEach((metric) => {
|
||||
const metricComponent = new Metric({
|
||||
properties: metric,
|
||||
Component: metrics,
|
||||
View: View
|
||||
})
|
||||
metricsList.push(metricComponent.generateHTML())
|
||||
|
||||
metricsComponent.push(metricComponent)
|
||||
})
|
||||
metricsDiv.innerHTML = metricsList.join("")
|
||||
metricsNumber.innerHTML = ANS_metrics.length
|
||||
|
||||
for(const metric of metricsComponent) {
|
||||
metric.loadScript()
|
||||
}
|
||||
} else {
|
||||
metricsDiv.innerHTML = `<div style='font-size: 24px; margin-top: 180px;' class='t-center'>
|
||||
<p><i class="fa-solid fa-warning"></i> Une erreur est survenue lors du chargement des WebMetrik</p>
|
||||
</div>`
|
||||
}
|
||||
})
|
||||
|
||||
// Generate a pop to add metrics with 3 settings, the adress, the port, the name of the metrics and the key to authentificate
|
||||
|
||||
addButton.addEventListener("click", () => {
|
||||
|
||||
View.createPopup({
|
||||
title: "Ajouter un WebMetrik",
|
||||
content: `
|
||||
<div class='mt-add'>
|
||||
<p>Adresse</p>
|
||||
<input class='field' type="text" id="mt-add-address" placeholder="Adresse">
|
||||
<p>Port</p>
|
||||
<input class='field' type="number" id="mt-add-port" placeholder="Port">
|
||||
<p>Nom</p>
|
||||
<input class='field' type="text" id="mt-add-name" placeholder="Nom">
|
||||
<p>Clé d'authentification</p>
|
||||
<input class='field' type="password" id="mt-add-key" placeholder="Clé d'authentification">
|
||||
<span id='mtaddinfo'></span>
|
||||
<button id='mt-add-btn' class='btn blue'><span><i class='fa fa-add'></i> Ajouter</span></button>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
|
||||
const addBtn = document.getElementById("mt-add-btn")
|
||||
const address = document.getElementById("mt-add-address")
|
||||
const port = document.getElementById("mt-add-port")
|
||||
const name = document.getElementById("mt-add-name")
|
||||
const key = document.getElementById("mt-add-key")
|
||||
const infoMTAdd = new TextResponse("mtaddinfo")
|
||||
|
||||
|
||||
addBtn.addEventListener("click", () => {
|
||||
|
||||
// Check if all fields are filled
|
||||
|
||||
if(address.value == "" || port.value == "" || name.value == "" || key.value == "") {
|
||||
infoMTAdd.err("Veuillez remplir tous les champs")
|
||||
return
|
||||
}
|
||||
|
||||
post("MT_ADD", {
|
||||
address: address.value,
|
||||
port: port.value,
|
||||
name: name.value,
|
||||
key: key.value
|
||||
}).then((res) => {
|
||||
if(res != "ERROR") {
|
||||
View.destroyPopup()
|
||||
loadMetrics()
|
||||
} else {
|
||||
View.createPopup({
|
||||
title: "Erreur",
|
||||
content: `<p class='yellow'><i class='fa fa-warning'></i> Une erreur est survenue lors de l'ajout de la WebMetrik</p>`
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
||||
/*
|
||||
<div style='font-size: 24px; margin-top: 180px;' class='t-center'>
|
||||
<p><i class="fa-solid fa-rotate fa-spin"></i> Chargement en cours ...</p>
|
||||
</div>*/
|
||||
Reference in New Issue
Block a user