NinjaWorld
Un script para el foro - Versión para impresión

+- NinjaWorld (https://ninjaworld.es)
+-- Foro: Comunidad (https://ninjaworld.es/foro-comunidad)
+--- Foro: Café NinjaWorld (https://ninjaworld.es/foro-cafe-ninjaworld)
+--- Tema: Un script para el foro (/tema-un-script-para-el-foro)



Un script para el foro - Amedama Daruu - 22/04/2016

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:

Código:
// 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


RE: Un script para el foro - Karamaru - 25/04/2016

Nunca vi tantos "var" ni "if" juntos xD

Parece simple y lioso a la vez aunque me alegro de que vayas a poner el mes en la cabecera. Era algo que iba a postear como sugerencia, se me había ocurrido en mis dias de ausente, pero parece que se me adelantaron Risa


This forum uses Lukasz Tkacz MyBB addons.