Bien plus que 50 nuances de gris : une fonction PHP qui transforme l’heure en couleur
Parfois, on a juste envie de donner un peu de vie à un bloc d’une page web. Nous savons tous ce que la géolocalisation peut faire, mais ces fonctions sont relativement récentes, et surtout utilisées pour proposer des contenus ciblés à des fins marketing.
Je vous propose ici une fonction qui renvoie une couleur HTML en niveaux de gris selon l’heure de la journée et les coordonnées géographiques d’un lieu que vous choisissez. J’ai personnellement utilisé ce code pour afficher un graphique en barres de statistiques quotidiennes, avec des nuances différentes selon l’heure de la journée.
Je vous propose ici une fonction qui renvoie une couleur HTML en niveaux de gris selon l’heure de la journée et les coordonnées géographiques d’un lieu que vous choisissez. J’ai personnellement utilisé ce code pour afficher un graphique en barres de statistiques quotidiennes, avec des nuances différentes selon l’heure de la journée.
<?php
/*
@Synopsis
This function returns a grayscale time HTML colour (i.e. 3 bytes preceded by #).
I tried to choose a intuitive match for the colours: night is black, day is white,
dusks are a shade of grey, following a sine function that has a full span over the dusk length.
I originally thought of a scale of shades of blue, but by comparing various pictures of the sky I've taken
at different times of the year, I've noticed all the blues are different,
depending mostly on the latitude, the weather and the time of year.
@Arguments
@Argument1: <t>, a Unix timestamp, leave empty for time().
@Argument2: <longitude>, in decimal format, conventionally signed as positive Eastwards and negative Westwards.
0 being the Greenwich Meridian.
Default has been set to the longitude of Paris.
@Argument3: <latitude>, in decimal format, conventionally signed as positive Northwards and negative Southwards.
0 being the Equator.
Default has been set to the latitude of Paris.
Examples of use:
setlocale(LC_TIME, 'English_Australia.1252'); // Tells strftime to use the proper locale
$details = geoip_record_by_name($_SERVER['REMOTE_ADDR']);
printf ('<div style="background-color: %s;">Welcome to my website, the current date is %s</div>',
GetTimeColor($sometime = null, $details['longitude'], $details['latitude']),
strftime('%A %d %B %Y, %H:%M');
);
can return
<div style="background-color: #ffffff;">Welcome to my website, the current date is Saturday 17 November 2012, 11:38</div>
(needs geoip activated).
(c) 2012 Fabien Haddadi
*/
function GetTimeColor($t = null, $longitude = 2.3470, $latitude = 48.8742) {
if (is_null($t)) $t = time();
$infos = date_sun_info($t, $latitude, $longitude); // Paris
/* sum of dusk lengths */
$dusksLength = $infos['sunrise'] - $infos['astronomical_twilight_begin']; // symetrical with evening dusk
/* full day */
if ($t >= $infos['sunrise'] && $t <= $infos['sunset']) {
$color = 255;
}
/* morning dusk */
elseif ($t >= $infos['astronomical_twilight_begin'] && $t < $infos['sunrise']) {
/* it is a colour that is proportional to the sine of the time spent from start of the
astronomical twilight to now above the total length of dusks. */
$color = 255 * sin(($t - $infos['astronomical_twilight_begin']) / $dusksLength * pi() / 2);
}
/* evening dusk */
elseif ($t > $infos['sunset'] && $t <= $infos['astronomical_twilight_end']) {
$color = 255 * (1-sin(($t - $infos['sunset']) / $dusksLength * pi() / 2));
}
/* full night */
else {
$color = 0;
}
$colorbyte = sprintf('%02x', $color);
return '#' . str_repeat($colorbyte, 3);
}
?>
Comment ai-je obtenu ce spectre ?
J’ai créé une boucle de minuit à minuit, avec un pas d’une minute. GetTimeColor($t) renvoie une couleur HTML, utilisée comme attribut CSS background-color d’un spectre formé d’éléments div flottant à gauche, de 1 px de large.
Le résultat compte à l’origine 1440 bandes de 1 px (= le nombre de minutes dans une journée), et fait donc 1440 px de large, mais je l’ai réduit ici pour la publication.
Voici le code qui a généré le spectre :
<?php
for($t = 0; $t <= 24; $t += 1/60) {
printf ('<div style="float:left; background-color: %s; width: 1px; height: 60px;"></div>',
GetTimeColor(mktime($t, (60*$t)%60)));
}
?>