Skip to content

Instantly share code, notes, and snippets.

@miceno

miceno/meteogalicia.html

Last active July 4, 2025 00:22
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save miceno/707f4f4b77ab13fa235d163c336455ab to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save miceno/707f4f4b77ab13fa235d163c336455ab to your computer and use it in GitHub Desktop.
Download ZIP
HTML page to redirect to MeteoGalicia weather historical data graphs
Raw
meteogalicia.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Selecciona unha data - MeteoGalicia</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>
<style>
body { font-family: Arial, sans-serif; }
.container { max-width: 400px; margin: auto; }
label, input, button { display: block; width: 100%; margin-bottom: 12px; }
input, button { font-size: 1em; padding: 7px; box-sizing: border-box; }
.form-group {
border-radius: 10px;
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
padding: 12px 10px 6px 10px;
margin-bottom: 16px;
}
.form-group:nth-of-type(1) { background: #e3f2fd; }
.form-group:nth-of-type(2) { background: #f1f8e9; }
.form-group:nth-of-type(3) { background: #fff3e0; }
@media (max-width: 600px) {
html, body {
height: 100vh;
min-height: 100vh;
max-height: 100vh;
margin: 0;
padding: 0;
overflow-y: auto;
}
body { margin: 0; }
.container {
max-width: 100%;
padding: 0 5px;
min-height: 100vh;
height: 100vh;
max-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
}
input, button { font-size: 0.95em; padding: 9px 6px; }
}
</style>
</head>
<body>
<div class="container">
<h2>Selecciona unha data</h2>
<div class="form-group">
<form id="dateForm">
<label for="datepicker">MeteoGalicia 10 minutais:</label>
<input type="text" id="datepicker" name="date" autocomplete="off" required>
<button type="submit"><img src="https://www.meteogalicia.gal/web/favicon.ico" alt="MeteoGalicia" style="width:20px;height:20px;vertical-align:middle;margin-right:8px;">Ir a MeteoGalicia 10 minutais</button>
</form>
</div>
<div class="form-group">
<form id="dailyDateForm">
<label for="daily-datepicker">MeteoGalicia Diario:</label>
<input type="text" id="daily-datepicker" name="daily-date" autocomplete="off" required>
<button type="submit"><img src="https://www.meteogalicia.gal/web/favicon.ico" alt="MeteoGalicia" style="width:20px;height:20px;vertical-align:middle;margin-right:8px;">Ir a MeteoGalicia Diario</button>
</form>
</div>
<div class="form-group">
<form id="monthlyDateForm">
<label for="monthly-datepicker">MeteoGalicia Mensual:</label>
<input type="text" id="monthly-datepicker" name="monthly-date" autocomplete="off" required>
<button type="submit"><img src="https://www.meteogalicia.gal/web/favicon.ico" alt="MeteoGalicia" style="width:20px;height:20px;vertical-align:middle;margin-right:8px;">Ir a MeteoGalicia Mensual</button>
</form>
</div>
</div>
<script>
$(function() {
$("#datepicker").datepicker({
dateFormat: "dd-mm-yy",
defaultDate: new Date()
});
$("#datepicker").datepicker("setDate", new Date());
$("#daily-datepicker").datepicker({
dateFormat: "dd-mm-yy",
defaultDate: new Date()
});
$("#daily-datepicker").datepicker("setDate", new Date());
$("#monthly-datepicker").datepicker({
dateFormat: "dd-mm-yy",
defaultDate: new Date()
});
$("#monthly-datepicker").datepicker("setDate", new Date());
$('#dateForm').on('submit', function(e) {
e.preventDefault();
var date = $('#datepicker').val();
if (!date) return;
// Ensure year is 4 digits
var parts = date.split('-');
if (parts[2].length === 2) {
var year = parseInt(parts[2], 10);
parts[2] = year < 50 ? '20' + parts[2] : '19' + parts[2];
}
var formattedDate = parts.join('-');
var url = 'https://www.meteogalicia.gal/web/observacion/rede-meteoroloxica/graficas?all=true&fecha=' + encodeURIComponent(formattedDate) + '&idIntevarlo=1&estacion=Viana%20do%20Bolo&idEstacion=10116&idGrafica-1=83,86,10018&idGrafica-2=10001&idGrafica-3=81,82&idGrafica-4=10002&idGrafica-5=88,10006&idGrafica-6=83,10021';
window.location.href = url;
});
$('#dailyDateForm').on('submit', function(e) {
e.preventDefault();
var date = $('#daily-datepicker').val();
if (!date) return;
// Ensure year is 4 digits
var parts = date.split('-');
if (parts[2].length === 2) {
var year = parseInt(parts[2], 10);
parts[2] = year < 50 ? '20' + parts[2] : '19' + parts[2];
}
var formattedDate = parts.join('-');
var url = 'https://www.meteogalicia.gal/web/observacion/rede-meteoroloxica/graficas?all=true&fecha=' + encodeURIComponent(formattedDate) + '&idIntevarlo=3&estacion=Viana%20do%20Bolo&idEstacion=10116&idGrafica-7=83&idGrafica-8=86&idGrafica-9=10001&idGrafica-10=81,10124&idGrafica-11=10006,10013&idGrafica-12=10002';
window.location.href = url;
});
$('#monthlyDateForm').on('submit', function(e) {
e.preventDefault();
var date = $('#monthly-datepicker').val();
if (!date) return;
// Ensure year is 4 digits
var parts = date.split('-');
if (parts[2].length === 2) {
var year = parseInt(parts[2], 10);
parts[2] = year < 50 ? '20' + parts[2] : '19' + parts[2];
}
var formattedDate = parts.join('-');
var url = 'https://www.meteogalicia.gal/web/observacion/rede-meteoroloxica/graficas?all=true&fecha=' + encodeURIComponent(formattedDate) + '&idIntevarlo=5&estacion=Viana%20do%20Bolo&idEstacion=10116&idGrafica-13=83&idGrafica-14=86&idGrafica-15=10001&idGrafica-16=81,10124&idGrafica-17=10006,10013&idGrafica-18=10002';
window.location.href = url;
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment