Présentation
L’outil décrit ici est une fonctionnalité du plugin Le Couteau Suisse que vous pouvez trouver ici : Le Couteau Suisse. Pour avoir accès à l’horloge présentée dans cet article, il vous faut donc avoir préalablement installé ce plugin. Attention, la version minimum requise est : 1.8.17.02.
Ensuite, une fois cet outil « Horloge » activé sur la page d’administration du plugin en espace privé, vous avez la possibilité d’insérer l’heure et/ou la date du jour dans vos contenus éditoriaux (les articles, les brèves, les forums, etc.) grâce à un modèle SPIP surchargeable <horlogeX>
, ou dans vos squelettes grâce à une balise SPIP #HORLOGE
. L’heure que nous vous proposons est celle du serveur hébergeant votre site, lue juste une fois par PHP, ensuite mise à jour en temps réel sur le client (par JavaScript). Moyennant les décalages horaires, et il est possible de modifier la zone choisie, et le format d’affichage. Exemple :
- À Paris, il est 22:10:00
- À Montréal, il est 16:10:00
Voir une horloge ici ou ici.
Dépendances
- Si vous utilisez SPIP version 1.9.2 ou inférieure, il vous faut installer le plugin jQuery, jquery.cookie.js, car cet outil retient pendant la session la différence d’horaire serveur/client dans un cookie, côté client.
- Si vous utilisez SPIP version 1.9.1 ou inférieure, il vous faut en plus installer et activer le plugin Jquery [1] que vous pouvez télécharger ici.
- Nécessaire pour toute version de SPIP : la balise #INSERT_HEAD, qui doit être présente (en un seul exemplaire) dans le header de vos squelettes (entre les balises <head>
et </head>
des fichiers HTML). Les fonctions Javascript du plugin sont insérés grâce à elle. Si vous ne trouvez pas cette balise dans vos codes et que les liens n’ont pas l’apparence voulue, alors l’outil du Couteau Suisse « Balise #INSERT_HEAD » permet d’insérer automatiquement cette balise sans manipulation de votre part.
Le modèle <horloge>
Ce modèle est utilisable dans tous vos contenus SPIP : articles, brèves, rubriques, etc.
Paramètres (tous optionnels)
Paramètre | Explication | Valeur par défaut |
---|---|---|
id | id et class de la balise HTML produite | pas d’id ; class="jclock" |
zone | Nombre d’heures, ville ou raccourci permettant d’inialiser l’horloge | Heure sur l’ordinateur client |
format | Format de l’horloge.
Les codes de formattage sont ceux de PHP. Mais l’horloge fait de son mieux, avec les fichiers de langue SPIP de traduire les éléments textuels (noms des jours, mois) dans la langue de l’article où l’horloge est placée. |
H:i:s |
balise | Balise HTML utilisée pour entourer l’horloge | span |
defaut | Texte brut affiché avant le traitement par jQuery | 99:99 |
Exemples d’utilisation
Code | Affichage |
---|---|
<horloge1>
ou : éq. : |
Affiche l’heure telle qu’elle est lue sur l’ordinateur client [2] ; format par défaut : heures:minutes:secondes. |
<horloge|zone=serveur> |
Affiche l’heure telle qu’elle est lue sur le serveur par PHP. |
<horloge|zone=GMT>
éq. : éq. : |
Affiche l’heure GMT (Temps moyen de Greenwich) courante telle qu’elle est calculée par le serveur PHP. Aujourd’hui (depuis 1972), on parle plutôt d’heure UTC (Temps universel coordonné). |
<horloge|zone=New York> |
Affiche l’heure de la zone environnante de New York telle qu’elle est calculée par le serveur PHP (voir ci-dessous pour les zones). |
<horloge|zone=New York|format=H:i (g:ia) l, \l\e j F Y> |
Affiche l’heure de New York dans un format tel que :
19:42 (7:42pm) samedi, le 1 mai 2010. |
<horloge|id=1>
éq. : |
Le paramètre « id » sert ici à marquer la balise qui contient l’horloge avec un id et une class pour faciliter son traitement par feuille de style CSS. Un id=2 produira : class="jclock jclock2" id="jclock2" . |
<horloge|zone=serveur|balise=div> |
Insère l’horloge dans un <div> plutôt que dans un <span> (balise par défaut). [3] |
Voici le code utilisé nativement par le Couteau Suisse. Il appelle directement la balise #HORLOGE expliquée ci-après :
[(#HORLOGE{
[format=(#ENV{format})],
[zone=(#ENV{zone})],
[id=(#ENV{id})],
[balise=(#ENV{balise})],
[defaut=(#ENV{defaut})]
})]
Pour surcharger ce modèle, repérez simplement le fichier original couteau-suisse/modeles/horloge.html, copiez-le dans le dossier modeles/ de votre squelette et modifiez-le ensuite à votre guise.
La balise #HORLOGE
Pour insérer une horloge à un endroit fixe dans un squelette utiliser la balise #HORLOGE
qui est fonctionellement équivalente.
Equivalences
Modèle (contenus) | Balise (squelettes) | Inclusion statique (squelettes) |
---|---|---|
<horloge|> |
#HORLOGE |
#MODELE{horloge} |
<horloge1>
|
#HORLOGE{id=1} |
#MODELE{horloge,id=1} |
<horloge|format=H:s> |
#HORLOGE{format=H:s} |
#MODELE{horloge,format=H:s} |
Quelques exemples
- Heure locale côté client : #HORLOGE
- Heure serveur : #HORLOGE{zone=serveur}
- GMT & id=jclock2 : #HORLOGE{format=H:i:s,zone=GMT,id=2}
- GMT 0200 & id=jclock4 : #HORLOGE{zone=GMT0200,id=4}
- GMT -0300 (avec utilisation d’un chiffre) : #HORLOGE{zone=-3}
- Heure locale de Montreal : #HORLOGE{zone=Montreal}
- Heure locale de Paris : #HORLOGE{zone=Paris,format=H\hi}
Le paramètre zone
Si on choisit une ville comme valeur pour le paramètre zone
alors l’horloge tiendra compte des changements d’horaire été/hiver.
Voici les villes prises en charge par le plugin. Le paramètre zone
est insensible à la casse.
Villes | ||
---|---|---|
Addis Ababa | Guatemala | Nassau * |
Adelaide | Halifax * | New Delhi |
Aden | Hanoi | New Orleans * |
Algiers | Harare | New York * |
Almaty | Havana * | Oslo * |
Amman * | Helsinki * | Ottawa * |
Amsterdam * | Hong Kong | Paris * |
Anadyr * | Honolulu | Perth |
Anchorage * | Houston * | Philadelphia * |
Ankara * | Indianapolis * | Phoenix |
Antananarivo | Islamabad | Prague * |
Asuncion | Istanbul * | Reykjavik |
Athens * | Jakarta | Rio de Janeiro |
Atlanta * | Jerusalem * | Riyadh |
Auckland | Johannesburg | Rome * |
Baghdad | Kabul | San Francisco * |
Bangkok | Kamchatka * | San Juan |
Barcelona * | Karachi | San Salvador |
Beijing | Kathmandu | Santiago |
Beirut * | Khartoum | Santo Domingo |
Belgrade * | Kingston | Sao Paulo |
Berlin * | Kiritimati | Seattle * |
Bogota | Kolkata | Seoul |
Boston * | Kuala Lumpur | Shanghai |
Brasilia | Kuwait City | Singapore |
Brisbane | Kyiv * | Sofia * |
Brussels * | La Paz | St. John’s * |
Bucharest * | Lagos | St. Paul * |
Budapest * | Lahore | Stockholm * |
Buenos Aires | Lima | Suva |
Cairo | Lisbon * | Sydney |
Canberra | London * | Taipei |
Cape Town | Los Angeles * | Tallinn * |
Caracas | Madrid * | Tashkent |
Casablanca | Managua | Tegucigalpa |
Chatham Islands | Manila | Tehran * |
Chicago * | Melbourne | Tokyo |
Copenhagen * | Mexico City * | Toronto * |
Darwin | Miami * | Vancouver * |
Denver * | Minneapolis * | Vienna * |
Detroit * | Minsk * | Vladivostok * |
Dhaka | Montevideo | Warsaw * |
Dubai | Montgomery * | Washington DC * |
Dublin * | Montreal * | Winnipeg * |
Edmonton * | Moscow * | Yangon |
Frankfurt * | Mumbai | Zagreb * |
Geneva * | Nairobi | Zürich * |
- * : Villes appliquant un changement d’horaire été/hiver
- Mise à jour des données : le 23/04/2010 ; Champ d’application : 2010 - 2019 ; Références : http://www.timeanddate.com/
Les raccourcis suivants peuvent être également utilisables pour le paramètre zone
au lieu d’une ville, mais ils sont peut-être moins très utiles à cause des changements été/hiver.
Raccourci | Libellé | Raccourci | Libellé |
---|---|---|---|
GMT | GMT + 00:00 | GMT1000 | GMT + 10:00 |
GMT0100 | GMT + 01:00 | GMT1100 | GMT + 11:00 |
GMT0200 | GMT + 02:00 | GMT1200 | GMT + 12:00 |
GMT0300 | GMT + 03:00 | GMT1300 | GMT + 13:00 |
GMT0330 | GMT + 03:30 | GMT-0100 | GMT - 01:00 |
GMT0400 | GMT + 04:00 | GMT-0200 | GMT - 02:00 |
GMT0430 | GMT + 04:30 | GMT-0230 | GMT - 02:30 |
GMT0500 | GMT + 05:00 | GMT-0300 | GMT - 03:00 |
GMT0530 | GMT + 05:30 | GMT-0330 | GMT - 03:30 |
GMT0545 | GMT + 05:45 | GMT-0400 | GMT - 04:00 |
GMT0600 | GMT + 06:00 | GMT-0430 | GMT - 04:30 |
GMT0630 | GMT + 06:30 | GMT-0500 | GMT - 05:00 |
GMT0700 | GMT + 07:00 | GMT-0600 | GMT - 06:00 |
GMT0710 | GMT + 07:10 | GMT-0700 | GMT - 07:00 |
GMT0730 | GMT + 07:30 | GMT-0800 | GMT - 08:00 |
GMT0800 | GMT + 08:00 | GMT-0900 | GMT - 09:00 |
GMT0830 | GMT + 08:30 | GMT-1000 | GMT - 10:00 |
GMT0900 | GMT + 09:00 | GMT-1100 | GMT - 11:00 |
GMT0930 | GMT + 09:30 | GMT-1200 | GMT - 12:00 |
Zones de temps :
Raccourci | Libellé | Continent |
---|---|---|
ACDT | Australian Central Daylight Time (UTC + 10:30) | Australia |
ACST | Australian Central Standard Time (UTC + 9:30) | Australia |
AEDT | Australian Eastern Daylight Time or Australian Eastern Summer Time (UTC + 11) | Australia |
AEST | Australian Eastern Standard Time (UTC + 10) | Australia |
AWDT | Australian Western Daylight Time (UTC + 9) | Australia |
AWST | Australian Western Standard Time (UTC + 8) | Australia |
CDT | Central Daylight Time (UTC + 10:30) | Australia |
CST | Central Summer Time (UTC + 10:30) | Australia |
CST | Central Standard Time (UTC + 9:30) | Australia |
CXT | Christmas Island Time (UTC + 7) | Australia |
EDT | Eastern Daylight Time (UTC + 11) | Australia |
EST | Eastern Summer Time (UTC + 11) | Australia |
EST | Eastern Standard Time (UTC + 10) | Australia |
NFT | Norfolk (Island) Time (UTC + 11:30) | Australia |
WDT | Western Daylight Time (UTC + 9) | Australia |
WST | Western Summer Time (UTC + 9) | Australia |
WST | Western Standard Time (UTC + 8) | Australia |
BST | British Summer Time (UTC + 1) | Europe |
CEDT | Central European Daylight Time (UTC + 2) | Europe |
CEST | Central European Summer Time (UTC + 2) | Europe |
CET | Central European Time (UTC + 1) | Europe |
EEDT | Eastern European Daylight Time (UTC + 3) | Europe |
EEST | Eastern European Summer Time (UTC + 3) | Europe |
EET | Eastern European Time (UTC + 2) | Europe |
GMT | Greenwich Mean Time (UTC) | Europe |
IST | Irish Summer Time (UTC + 1) | Europe |
MESZ | Mitteleuroäische Sommerzeit (UTC + 2) | Europe |
MEZ | Mitteleuropäische Zeit (UTC + 1) | Europe |
MSD | Moscow Daylight Time (UTC + 4) | Europe |
MSK | Moscow Standard Time (UTC + 3) | Europe |
UTC | Coordinated Universal Time (UTC) | Europe |
WEDT | Western European Daylight Time (UTC + 1) | Europe |
WEST | Western European Summer Time (UTC + 1) | Europe |
WET | Western European Time (UTC) | Europe |
ADT | Atlantic Daylight Time (UTC - 3) | North America |
AKDT | Alaska Daylight Time (UTC - 8) | North America |
AKST | Alaska Standard Time (UTC - 9) | North America |
AST | Atlantic Standard Time (UTC - 4) | North America |
CDT | Central Daylight Time (UTC - 5) | North America |
CST | Central Standard Time (UTC - 6) | North America |
EDT | Eastern Daylight Time (UTC - 4) | North America |
EST | Eastern Standard Time (UTC - 5) | North America |
HAA | Heure Avancée de l’Atlantique (UTC - 3) | North America |
HAC | Heure Avancée du Centre (UTC - 5) | North America |
HADT | Hawaii-Aleutian Daylight Time (UTC - 9) | North America |
HAE | Heure Avancée de l’Est (UTC - 4) | North America |
HAP | Heure Avancée du Pacifique (UTC - 7) | North America |
HAR | Heure Avancée des Rocheuses (UTC - 6) | North America |
HAST | Hawaii-Aleutian Standard Time (UTC - 10) | North America |
HAT | Heure Avancée de Terre-Neuve (UTC - 2:30) | North America |
HAY | Heure Avancée du Yukon (UTC - 8) | North America |
HNA | Heure Normale de l’Atlantique (UTC - 4) | North America |
HNC | Heure Normale du Centre (UTC - 6) | North America |
HNE | Heure Normale de l’Est (UTC - 5) | North America |
HNP | Heure Normale du Pacifique (UTC - 8) | North America |
HNR | Heure Normale des Rocheuses (UTC - 7) | North America |
HNT | Heure Normale de Terre-Neuve (UTC - 3:30) | North America |
HNY | Heure Normale du Yukon (UTC - 9) | North America |
HST | Hawaii Standard Time (UTC - 10) | North America |
MDT | Mountain Daylight Time (UTC - 6) | North America |
MST | Mountain Standard Time (UTC - 7) | North America |
NDT | Newfoundland Daylight Time (UTC - 2:30) | North America |
NST | Newfoundland Standard Time (UTC - 3:30) | North America |
PDT | Pacific Daylight Time (UTC - 7) | North America |
PST | Pacific Standard Time (UTC - 8) | North America |
Un peu de technique
- Pour obtenir une horloge à l’heure, on se base dans ce plugin sur l’heure du serveur, censée être juste. Le hit pour obtenir l’heure du serveur est une adresse ressemblant à : http://www.toto.fr/plugins/auto/couteau_suisse/outils/horloge_fonctions.php?cs_dateserveur=oui
. Ce hit renvoie un fichier xml du genre :
<?xml version="1.0" encoding="UTF-8"?>
<curTime><U>1272545526</U><Z>7200</Z></curTime>
On peut grâce à ces informations calculer l’heure GMT du serveur : « U » représente les secondes depuis l’époque Unix (1er Janvier 1970, 0h00 00s GMT) et « Z » représente le décalage horaire (secondes). L’heure GMT du serveur est donc ici : 1272545526 - 7200 = 1272538326 secondes.
- JavaScript doit obligatoirement être activé chez le visiteur, sinon, est affiché 99:99 (à moins que le paramètre defaut
soit renseigné). Une fois la page totalement chargée, l’heure est alors mise à jour chaque seconde.
- Afin d’éviter les hits trop nombreux sur le serveur, le delta calculé par rapport au serveur (ou différence entre l’heure UTC du client et l’heure UTC du serveur) et stocké en cookie durant la session. Si les cookies sont désactivés, alors l’heure du serveur est demandée à chaque affichage de la page.
- Le plugin est compatibilité avec AJAX et les crayons : l’horloge est systématiquement redémarée après un clic AJAX ou un crayonnage.
Aucune discussion
Ajouter un commentaire
Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :
Merci d’avance pour les personnes qui vous aideront !
Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.
Suivre les commentaires : |