Posteet: benoitbalon posteets tagged innerHTML

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//FR" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

function get_mois(annee, mois, bloquer_a_date_actuelle, emplacement, bouton)

{

var today = new Date();

var date_a_traiter = today;

if (annee != null && mois != null)

{

if (! bloquer_a_date_actuelle)

{

if (annee != today.getFullYear() || mois != today.getMonth())

{

date_a_traiter = new Date(annee, mois, 1);

}

else

{

if (annee < today.getFullYear() || mois < today.getMonth())

{

date_a_traiter = new Date(annee, mois, 1);

}

var current_year = date_a_traiter.getFullYear();

var current_month = date_a_traiter.getMonth();

var debut_mois = new Date(current_year, current_month, 1);

var premier_jour_mois = debut_mois.getDay();

var fin_mois = new Date(current_year, current_month + 1, 0);

var derniere_date_mois = fin_mois.getDate();

var mon_code = "";

mon_code = "\<table\>" +

"\<tr class=\"deplace\"\>" +

"\<td\>\<a id=\"annee_precedente\" href=\"\" class=\"survol\" title=\"Année précédente\"\>\<\<\</a\>\</td\>" +

"\<td\>\<a id=\"mois_precedent\" href=\"\" class=\"survol\" title=\"Mois précédent\"\>\<\</a\>\</td\>" +

"\<td\>\<span id=\"mois_annee\"\>\</span\>\</td\>" +

"\<td\>\<a id=\"mois_suivant\" href=\"\" class=\"survol\" title=\"Mois suivant\"\>\>\</a\>\</td\>" +

"\<td\>\<a id=\"annee_suivante\" href=\"\" class=\"survol\" title=\"Année suivante\"\>\>\>\</a\>\</td\>" +

"\<td\>\<a id=\"fermer_calendrier\" href=\"javascript: cacher_calendrier('" + emplacement + "', '" + bouton + "');\" class=\"survol\" title=\"Fermer le calendrier\"\>x</a\>\</td\>" +

"\</tr\>" +

"\</table\>";

mon_code = mon_code + "\<table\>\<tr class=\"titre\"\>\<td\>Lu\</td\>\<td\>Ma\</td\>\<td\>Me\</td\>\<td\>Je\</td\>\<td\>Ve\</td\>\<td\>Sa\</td\>\<td\>Di\</td\>\</tr\>";

for (var i = 1 ; i <= derniere_date_mois ; i++)

{

var ma_date = new Date(current_year, current_month, i);

var style_today = " onclick=\"javascript: alert('" + i + "/" + current_month + "/" + current_year + "');\"";

if (i == date_a_traiter.getDate() && (ma_date.getDay() == 0 || ma_date.getDay() == 6) )

{

if (date_a_traiter == today)

{

style_today = style_today + " class=\"today_we\"";

}

else

{

style_today = style_today + " class=\"not_today_we\"";

}

else if (i == date_a_traiter.getDate() && (ma_date.getDay() != 0 && ma_date.getDay() != 6) )

{

if (date_a_traiter == today)

{

style_today = style_today + " class=\"today_not_we\"";

}

else

{

style_today = style_today + " class=\"not_today_not_we\"";

}

else if (i != date_a_traiter.getDate() && (ma_date.getDay() != 0 && ma_date.getDay() != 6) )

{

style_today = style_today + " class=\"not_today_not_we\"";

}

else if (i != date_a_traiter.getDate() && (ma_date.getDay() == 0 || ma_date.getDay() == 6) )

{

style_today = style_today + " class=\"not_today_we\"";

}

if (i == 1)

{

switch (ma_date.getDay())

{

case 1:

mon_code = mon_code + "\<tr\>\<td" + style_today + "\>1\</td\>";

break;

case 2:

mon_code = mon_code + "\<tr\>\<td\> \</td\>\<td" + style_today + "\>1\</td\>";

break;

case 3:

mon_code = mon_code + "\<tr\>\<td\> \</td\>\<td\> \</td\>\<td" + style_today + "\>1\</td\>";

break;

case 4:

mon_code = mon_code + "\<tr\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td" + style_today + "\>1\</td\>";

break;

case 5:

mon_code = mon_code + "\<tr\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td" + style_today + "\>1\</td\>";

break;

case 6:

mon_code = mon_code + "\<tr\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td" + style_today + "\>1\</td\>";

break;

case 0:

mon_code = mon_code + "\<tr\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td" + style_today + "\>1\</td\>\</tr\>";

break;

}

else if (i == derniere_date_mois)

{

switch (ma_date.getDay())

{

case 1:

mon_code = mon_code + "\<tr\>\<td" + style_today + "\>" + i + "\</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\</tr\>";

break;

case 2:

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\</tr\>";

break;

case 3:

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\</tr\>";

break;

case 4:

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>\<td\> \</td\>\<td\> \</td\>\<td\> \</td\>\</tr\>";

break;

case 5:

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>\<td\> \</td\>\<td\> \</td\>\</tr\>";

break;

case 6:

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>\<td\> \</td\>\</tr\>";

break;

case 0:

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>\</tr\>\</tr\>";

break;

}

else

{

if (ma_date.getDay() == 0)

{

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>\</tr\>";

}

else if (ma_date.getDay() == 1)

{

mon_code = mon_code + "\<tr\>\<td" + style_today + "\>" + i + "\</td\>";

}

else

{

mon_code = mon_code + "\<td" + style_today + "\>" + i + "\</td\>";

}

mon_code = mon_code + "\</table\>";

document.getElementById(emplacement).innerHTML = mon_code;

document.getElementById("mois_annee").innerHTML = get_select_month(current_month, current_year, bloquer_a_date_actuelle, emplacement) + " " + get_select_year(current_year, current_month, bloquer_a_date_actuelle, emplacement);

var annee_precedente = new Date(current_year - 1, current_month, 1);

var annee_suivante = new Date(current_year + 1, current_month, 1);

var mois_precedent = new Date(current_year, current_month - 1, 1);

var mois_suivant = new Date(current_year, current_month + 1, 1);

document.getElementById("annee_precedente").setAttribute("href", "javascript: get_mois(" + annee_precedente.getFullYear() + ", " + annee_precedente.getMonth() + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "', '" + bouton + "'" + ");");

document.getElementById("mois_precedent").setAttribute("href", "javascript: get_mois(" + mois_precedent.getFullYear() + ", " + mois_precedent.getMonth() + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "', '" + bouton + "'" + ");");

if (bloquer_a_date_actuelle)

{

if (current_year >= today.getFullYear() && current_month >= today.getMonth())

{

document.getElementById("annee_suivante").setAttribute("href", "javascript: alert(\"Vous ne pouvez pas aller au-delà de la date actuelle\");");

document.getElementById("mois_suivant").setAttribute("href", "javascript: alert(\"Vous ne pouvez pas aller au-delà de la date actuelle\");");

}

else if (current_year >= today.getFullYear() && current_month < today.getMonth())

{

document.getElementById("annee_suivante").setAttribute("href", "javascript: alert(\"Vous ne pouvez pas aller au-delà de la date actuelle\");");

document.getElementById("mois_suivant").setAttribute("href", "javascript: get_mois(" + mois_suivant.getFullYear() + ", " + mois_suivant.getMonth() + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "', '" + bouton + "'" + ");");

}

else

{

document.getElementById("annee_suivante").setAttribute("href", "javascript: get_mois(" + annee_suivante.getFullYear() + ", " + annee_suivante.getMonth() + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "', '" + bouton + "'" + ");");

document.getElementById("mois_suivant").setAttribute("href", "javascript: get_mois(" + mois_suivant.getFullYear() + ", " + mois_suivant.getMonth() + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "', '" + bouton + "'" + ");");

}

else

{

document.getElementById("annee_suivante").setAttribute("href", "javascript: get_mois(" + annee_suivante.getFullYear() + ", " + annee_suivante.getMonth() + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "', '" + bouton + "'" + ");");

document.getElementById("mois_suivant").setAttribute("href", "javascript: get_mois(" + mois_suivant.getFullYear() + ", " + mois_suivant.getMonth() + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "', '" + bouton + "'" + ");");

}

function get_nom_mois(numero)

{

var nom_mois = "";

switch (numero)

{

case 0:

nom_mois = "Janvier";

break;

case 1:

nom_mois = "Février";

break;

case 2:

nom_mois = "Mars";

break;

case 3:

nom_mois = "Avril";

break;

case 4:

nom_mois = "Mai";

break;

case 5:

nom_mois = "Juin";

break;

case 6:

nom_mois = "Juillet";

break;

case 7:

nom_mois = "Août";

break;

case 8:

nom_mois = "Septembre";

break;

case 9:

nom_mois = "Octobre";

break;

case 10:

nom_mois = "Novembre";

break;

case 11:

nom_mois = "Décembre";

break;

}

return nom_mois;

}

function get_select_month(mois, annee, bloquer_a_date_actuelle, emplacement)

{

var today = new Date();

var select = "\<select name=\"mois\" onchange=\"javascript: get_mois(" + annee + ", this.value, " + bloquer_a_date_actuelle + ", '" + emplacement + "'" + ");\"\>";

if (annee == today.getFullYear() && bloquer_a_date_actuelle == true)

{

for (var i = 0 ; i <= today.getMonth() ; i++)

{

if (i != mois)

{

select = select + "\<option value=\"" + i + "\"\>" + get_nom_mois(i) + "\</option\>";

}

else

{

select = select + "\<option value=\"" + i + "\" selected=\"selected\"\>" + get_nom_mois(i) + "\</option\>";

}

else

{

for (var i = 0 ; i <= 11 ; i++)

{

if (i != mois)

{

select = select + "\<option value=\"" + i + "\"\>" + get_nom_mois(i) + "\</option\>";

}

else

{

select = select + "\<option value=\"" + i + "\" selected=\"selected\"\>" + get_nom_mois(i) + "\</option\>";

}

select = select + "\</select\>";

return select;

}

function get_select_year(annee, mois, bloquer_a_date_actuelle, emplacement)

{

var today = new Date();

var select = "\<select name=\"annee\" onchange=\"javascript: get_mois(this.value, " + mois + ", " + bloquer_a_date_actuelle + ", '" + emplacement + "'" + ");\"\>";

if (bloquer_a_date_actuelle && today.getFullYear() - annee <= 10)

{

for (var i = today.getFullYear() ; i > today.getFullYear() - 20 ; i-- )

{

if (i == annee)

{

select = select + "\<option value=\"" + i + "\" selected=\"selected\"\>" + i + "\</option\>";

}

else

{

select = select + "\<option value=\"" + i + "\"\>" + i + "\</option\>";

}

else

{

for (var i = annee + 9 ; i > annee - 10 ; i-- )

{

if (i == annee)

{

select = select + "\<option value=\"" + i + "\" selected=\"selected\"\>" + i + "\</option\>";

}

else

{

select = select + "\<option value=\"" + i + "\"\>" + i + "\</option\>";

}

select = select + "\</select\>";

return select;

}

function afficher_calendrier(calendrier, bouton_calendrier)

{

document.getElementById(calendrier).setAttribute("style", "display: block;");

document.getElementById(bouton_calendrier).setAttribute("onclick", "javascript: cacher_calendrier('" + calendrier + "', '" + bouton_calendrier + "');");

}

function cacher_calendrier(calendrier, bouton_calendrier)

{

document.getElementById(calendrier).setAttribute("style", "display: none;");

document.getElementById(bouton_calendrier).setAttribute("onclick", "javascript: afficher_calendrier('" + calendrier + "', '" + bouton_calendrier + "');");

}

</script>

body

{

background-color: black;

color: white;

font-family: sans-serif;

font-weight: bold;

font-size: 12px;

}

div.calendrier

{

border: 1px solid grey;

width: 250px;

display: none;

}

td.not_today_not_we, td.today_not_we, td.not_today_we, td.today_we

{

text-align: right;

border: 1px solid transparent;

}

td.not_today_not_we:hover, td.today_not_we:hover, td.not_today_we:hover, td.today_we:hover

{

cursor: pointer;

border: 1px solid white;

}

td.not_today_not_we, td.today_not_we

{

background-color: black;

}

td.not_today_we, td.today_we

{

color: grey;

}

td.today_we, td.today_not_we

{

color: red;

}

tr.titre

{

text-align: center;

color: white;

background-color: grey;

}

table

{

width: 100%;

}

tr.deplace

{

text-align: center;

}

tr.deplace span

{

border: 1px solid transparent;

padding-left: 2px;

padding-right: 2px;

font-size: 10px;

margin: 0px;

color: white;

}

tr.deplace a.survol

{

border: 1px solid transparent;

padding-left: 2px;

padding-right: 2px;

font-size: 10px;

margin: 0px;

color: white;

text-decoration: none;

}

a#fermer_calendrier

{

color: red;

}

tr.deplace a.survol:hover

{

cursor: pointer;

border: 1px solid white;

}

select, option

{

background-color: black;

color: white;

font-family: sans-serif;

font-weight: bold;

font-variant: small-caps;

font-size: 10px;

margin: 0px;

border: 1px solid transparent;

}

option:hover

{

background-color: black;

border: 1px solid white;

}

</style>

</head>

</body>

</html>

benoitbalon posteets tagged innerHTML [ Profile ]

"innerHTML" related tags