22/04/2016, 00:40
(Última modificación: 22/04/2016, 00:41 por Amedama Daruu.)
El salto temporal va a tener nuevo estilo y he hecho un script en javascript que, según el calendario de Onindo y la fecha actual, calcula y muestra en la cabecera el mes, la estación, y el año correcto. El script tiene en consideración que si la fecha actual es mayor al mes de junio de ese mismo año, tiene que sumar un año a la cuenta.
Parece mentira, pero me ha costado y me siento orgulloso, jejeje.
Para los curiosos:
Se ve sin formato casi en el code, de modo que adjunto el link donde descansa actualmente:
http://ninjaworld.es/seasons.js
Parece mentira, pero me ha costado y me siento orgulloso, jejeje.
Para los curiosos:
// Obtengo la fecha actual
var currentDate = new Date();
// Obtengo el año actual de la fecha actual
var currentYear = currentDate.getFullYear();
// Utilizo el año para crear réplicas de las fechas de cambio de estación según el calendario de NW
var bienvenidaImpar = new Date("January 1, " + currentYear + " 00:00:00 GMT+0200");
var primeraflorImpar = new Date("January 16, " + currentYear + " 00:00:00 GMT+0200");
var caidadelpetaloImpar = new Date("February 1, " + currentYear + " 00:00:00 GMT+0200");
var ascuaImpar = new Date("February 16, " + currentYear + " 00:00:00 GMT+0200");
var flamaImpar = new Date("March 1, " + currentYear + " 00:00:00 GMT+0200");
var cenizaImpar = new Date("March 16, " + currentYear + " 00:00:00 GMT+0200");
var descensoImpar = new Date("April 1, " + currentYear + " 00:00:00 GMT+0200");
var entretiempoImpar = new Date("April 16, " + currentYear + " 00:00:00 GMT+0200");
var augurioImpar = new Date("May 1, " + currentYear + " 00:00:00 GMT+0200");
var vientogrisImpar = new Date("May 16, " + currentYear + " 00:00:00 GMT+0200");
var alientonevadoImpar = new Date("June 1, " + currentYear + " 00:00:00 GMT+0200");
var despedidaImpar = new Date("June 16, " + currentYear + " 00:00:00 GMT+0200");
var bienvenidaPar = new Date("July 1, " + currentYear + " 00:00:00 GMT+0200");
var primeraflorPar = new Date("July 16, " + currentYear + " 00:00:00 GMT+0200");
var caidadelpetaloPar = new Date("August 1, " + currentYear + " 00:00:00 GMT+0200");
var ascuaPar = new Date("August 16, " + currentYear + " 00:00:00 GMT+0200");
var flamaPar = new Date("September 1, " + currentYear + " 00:00:00 GMT+0200");
var cenizaPar = new Date("September 16, "+ currentYear + " 00:00:00 GMT+0200");
var descensoPar = new Date("October 1, " + currentYear + " 00:00:00 GMT+0200");
var entretiempoPar = new Date("October 16, " + currentYear + " 00:00:00 GMT+0200");
var augurioPar = new Date("November 1, " + currentYear + " 00:00:00 GMT+0200");
var vientogrisPar = new Date("November 16, " + currentYear + " 00:00:00 GMT+0200");
var alientonevadoPar = new Date("December 1, " + currentYear + " 00:00:00 GMT+0200");
var despedidaPar = new Date("December 16, " + currentYear + " 00:00:00 GMT+0200");
// Condicionantes para los años impares
if (currentDate < primeraflorImpar) {
document.getElementById("month").innerHTML = '<span style="color: limegreen;">Bienvenida</span>';
document.getElementById("season").innerHTML = '<span style="color: springgreen;">Primavera</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
}
if ( (currentDate >= primeraflorImpar) && (currentDate < caidadelpetaloImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: yellowgreen;">Primera Flor</span>';
document.getElementById("season").innerHTML = '<span style="color: springgreen;">Primavera</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
}
if ( (currentDate >= caidadelpetaloImpar) && (currentDate < ascuaImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: greenyellow;">Caída del Pétalo</span>';
document.getElementById("season").innerHTML = '<span style="color: springgreen;">Primavera</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
}
if ( (currentDate >= ascuaImpar) && (currentDate < flamaImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: darkorange;">Ascua</span>';
document.getElementById("season").innerHTML = '<span style="color: gold;">Verano</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
}
if ( (currentDate >= flamaImpar) && (currentDate < cenizaImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: orangered;">Flama</span>';
document.getElementById("season").innerHTML = '<span style="color: gold;">Verano</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
}
if ( (currentDate >= cenizaImpar) && (currentDate < descensoImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: indianred;">Ceniza</span>';
document.getElementById("season").innerHTML = '<span style="color: gold;">Verano</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
}
if ( (currentDate >= descensoImpar) && (currentDate < entretiempoImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: chocolate;">Descenso</span>';
document.getElementById("season").innerHTML = '<span style="color: sienna;">Otoño</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
}
if ( (currentDate >= entretiempoImpar) && (currentDate < augurioImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: peru;">Entretiempo</span>';
document.getElementById("season").innerHTML = '<span style="color: sienna;">Otoño</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
}
if ( (currentDate >= augurioImpar) && (currentDate < vientogrisImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: burlywood;">Augurio</span>';
document.getElementById("season").innerHTML = '<span style="color: sienna;">Otoño</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
}
if ( (currentDate >= vientogrisImpar) && (currentDate < alientonevadoImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: lightsteelblue;">Viento Gris</span>';
document.getElementById("season").innerHTML = '<span style="color: white;">Invierno</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
}
if ( (currentDate >= alientonevadoImpar) && (currentDate < despedidaImpar) ) {
document.getElementById("month").innerHTML = '<span style="color: skyblue;">Aliento Nevado</span>';
document.getElementById("season").innerHTML = '<span style="color: white;">Invierno</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
}
if ( (currentDate >= vientogrisImpar) && (currentDate < bienvenidaPar) ) {
document.getElementById("month").innerHTML = '<span style="color: aquamarine;">Despedida</span>';
document.getElementById("season").innerHTML = '<span style="color: white;">Invierno</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
}
// Condicionantes para los años pares
if ( (currentDate >= bienvenidaPar) && (currentDate < primeraflorPar) ) {
document.getElementById("month").innerHTML = '<span style="color: limegreen;">Bienvenida</span>';
document.getElementById("season").innerHTML = '<span style="color: springgreen;">Primavera</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
}
if ( (currentDate >= primeraflorPar) && (currentDate < caidadelpetaloPar) ) {
document.getElementById("month").innerHTML = '<span style="color: yellowgreen;">Primera Flor</span>';
document.getElementById("season").innerHTML = '<span style="color: springgreen;">Primavera</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
}
if ( (currentDate >= caidadelpetaloPar) && (currentDate < ascuaPar) ) {
document.getElementById("month").innerHTML = '<span style="color: greenyellow;">Caída del Pétalo</span>';
document.getElementById("season").innerHTML = '<span style="color: springgreen;">Primavera</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/Zr8y3uE.png')";
}
if ( (currentDate >= ascuaPar) && (currentDate < flamaPar) ) {
document.getElementById("month").innerHTML = '<span style="color: darkorange;">Ascua</span>';
document.getElementById("season").innerHTML = '<span style="color: gold;">Verano</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
}
if ( (currentDate >= flamaPar) && (currentDate < cenizaPar) ) {
document.getElementById("month").innerHTML = '<span style="color: orangered;">Flama</span>';
document.getElementById("season").innerHTML = '<span style="color: gold;">Verano</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
}
if ( (currentDate >= cenizaPar) && (currentDate < descensoPar) ) {
document.getElementById("month").innerHTML = '<span style="color: indianred;">Ceniza</span>';
document.getElementById("season").innerHTML = '<span style="color: gold;">Verano</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/JyYSIKT.png')";
}
if ( (currentDate >= descensoPar) && (currentDate < entretiempoPar) ) {
document.getElementById("month").innerHTML = '<span style="color: chocolate;">Descenso</span>';
document.getElementById("season").innerHTML = '<span style="color: sienna;">Otoño</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
}
if ( (currentDate >= entretiempoPar) && (currentDate < augurioPar) ) {
document.getElementById("month").innerHTML = '<span style="color: peru;">Entretiempo</span>';
document.getElementById("season").innerHTML = '<span style="color: sienna;">Otoño</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
}
if ( (currentDate >= augurioPar) && (currentDate < vientogrisPar) ) {
document.getElementById("month").innerHTML = '<span style="color: burlywood;">Augurio</span>';
document.getElementById("season").innerHTML = '<span style="color: sienna;">Otoño</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/KeQqHVM.png')";
}
if ( (currentDate >= vientogrisPar) && (currentDate < alientonevadoPar) ) {
document.getElementById("month").innerHTML = '<span style="color: lightsteelblue;">Viento Gris</span>';
document.getElementById("season").innerHTML = '<span style="color: white;">Invierno</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
}
if ( (currentDate >= alientonevadoPar) && (currentDate < despedidaPar) ) {
document.getElementById("month").innerHTML = '<span style="color: skyblue;">Aliento Nevado</span>';
document.getElementById("season").innerHTML = '<span style="color: white;">Invierno</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
}
if (currentDate >= vientogrisPar) {
document.getElementById("month").innerHTML = '<span style="color: aquamarine;">Despedida</span>';
document.getElementById("season").innerHTML = '<span style="color: white;">Invierno</span>';
document.getElementById("anuncio1").style = "width: 38px; height: 38px; float: left; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
document.getElementById("anuncio2").style = "width: 38px; height: 38px; float: right; margin-top: -10px; background: url('http://i.imgur.com/UKcXLmz.png')";
}
// Cálculo del año actual
var year201 = new Date("January 1, 2016 05:00:00 GMT+0200");
year201 = year201.getFullYear();
var displayYear = 201 + (currentYear - year201)*2;
if (currentDate >= bienvenidaPar) displayYear = displayYear + 1;
document.getElementById("year").innerHTML = '<span style="color: lightsteelblue;">' + displayYear + '</span>';
Se ve sin formato casi en el code, de modo que adjunto el link donde descansa actualmente:
http://ninjaworld.es/seasons.js
![[Imagen: K02XwLh.png]](https://i.imgur.com/K02XwLh.png)