statoolinfosweb/src/fr/devinsy/statoolinfos/htmlize/metricMenuView.xhtml

106 lines
4.6 KiB
HTML
Raw Normal View History

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>StatoolInfos</title>
<meta charset="UTF-8" />
<meta name="keywords" content="statoolinfos,devinsy,federation" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="statoolinfos.css" />
<script src="sorttable.js" />
<script src="Chart.bundle.min.js"></script>
</head>
<body>
<div>
<div style="margin: 5px;">
<span style="display: inline-block; width: 100px">Type</span>
2021-05-26 02:06:15 +02:00
<a onclick="javascript:selectTypeMenu('general');" href="#" id="generalTypeButton" class="button">Général</a>
<a onclick="javascript:selectTypeMenu('summary');" href="#" id="summaryTypeButton" class="button">Résumé</a>
<a onclick="javascript:selectTypeMenu('generic');" href="#" id="genericTypeButton" class="button">Génériques</a>
<a onclick="javascript:selectTypeMenu('web');" href="#" id="webTypeButton" class="button">Web</a>
<a onclick="javascript:selectTypeMenu('specific');" href="#" id="specificTypeButton" class="button">Spécifiques</a>
</div>
<div style="margin: 5px;">
<span style="display: inline-block; width: 100px">Période</span>
<a onclick="javascript:selectPeriodMenu('full');" href="#" id="fullPeriodButton" class="button">Full</a>
<a onclick="javascript:selectPeriodMenu('last');" href="#" id="lastPeriodButton" class="button selected">12 mois</a>
<a onclick="javascript:selectPeriodMenu('2020');" href="#" id="2020PeriodButton" class="button">2020</a>
<a onclick="javascript:selectPeriodMenu('2021');" href="#" id="2021PeriodButton" class="button">2021</a>
</div>
<div style="margin: 5px;">
<span style="display: inline-block; width: 100px">Vue</span>
<a onclick="javascript:createClosedSelect('years');" href="#" id="yearViewButton" class="button">Années</a>
<a onclick="javascript:createClosedSelect('months');" href="#" id="monthViewButton" class="button selected">Mois</a>
<a onclick="javascript:createClosedSelect('weekds');" href="#" id="weekViewButton" class="button">Semaines</a>
<a onclick="javascript:createClosedSelect('days');" href="#" id="dayViewButton" class="button">Jours</a>
</div>
</div>
<script type="text/javascript">
function selectTypeMenu(selection)
{
document.getElementById ('summaryTypeButton').classList.remove('selected');
2021-05-26 02:06:15 +02:00
document.getElementById ('generalTypeButton').classList.remove('selected');
document.getElementById ('genericTypeButton').classList.remove('selected');
document.getElementById ('webTypeButton').classList.remove('selected');
document.getElementById ('specificTypeButton').classList.remove('selected');
if (selection == 'summary')
{
document.getElementById ('summaryTypeButton').classList.add('selected');
}
else if (selection == 'generic')
{
document.getElementById ('genericTypeButton').classList.add('selected');
}
2021-05-26 02:06:15 +02:00
else if (selection == 'general')
{
document.getElementById ('generalTypeButton').classList.add('selected');
}
else if (selection == 'web')
{
document.getElementById ('webTypeButton').classList.add('selected');
}
else if (selection == 'specific')
{
document.getElementById ('specificTypeButton').classList.add('selected');
}
}
function selectPeriodMenu(selection)
{
document.getElementById('fullCharts').style.display = 'none';
document.getElementById('lastCharts').style.display = 'none';
document.getElementById('2020Charts').style.display = 'none';
document.getElementById('2021Charts').style.display = 'none';
document.getElementById('fullPeriodButton').classList.remove('selected');
document.getElementById('lastPeriodButton').classList.remove('selected');
document.getElementById('2020PeriodButton').classList.remove('selected');
document.getElementById('2021PeriodButton').classList.remove('selected');
if (selection == 'full')
{
document.getElementById('fullPeriodButton').classList.add('selected');
document.getElementById('fullCharts').style.display = 'block';
}
else if (selection == 'last')
{
document.getElementById('lastPeriodButton').classList.add('selected');
document.getElementById('lastCharts').style.display = 'block';
}
else if (selection == '2020')
{
document.getElementById('2020PeriodButton').classList.add('selected');
document.getElementById('2020Charts').style.display = 'block';
}
else if (selection == '2021')
{
document.getElementById('2021PeriodButton').classList.add('selected');
document.getElementById('2021Charts').style.display = 'block';
}
}
</script>
</body>
</html>