make color of writing in event headers depending on the brightness of the choosen category color, fix for bug #1717

This commit is contained in:
Ralf Becker 2008-09-13 12:43:14 +00:00
parent 8d9f3eb858
commit 6a8e9471b6
3 changed files with 34 additions and 12 deletions

View File

@ -1137,6 +1137,7 @@ class calendar_uiviews extends calendar_ui
//$body_height = max(0,$height - $header_height - $corner_radius);
$border=1;
$headerbgcolor = $color ? $color : '#808080';
$headercolor = self::brightness($headerbgcolor) > 128 ? 'black' : 'white';
// the body-colors (gradient) are calculated from the headercolor, which depends on the cat of an event
$bodybgcolor1 = $this->brighter($headerbgcolor,$headerbgcolor == '#808080' ? 100 : 170);
$bodybgcolor2 = $this->brighter($headerbgcolor,220);
@ -1195,6 +1196,7 @@ class calendar_uiviews extends calendar_ui
'border' => $border,
'bordercolor' => $headerbgcolor,
'headerbgcolor' => $headerbgcolor,
'headercolor' => $headercolor,
'bodybackground' => ($background = 'url('.$GLOBALS['egw_info']['server']['webserver_url'].
'/calendar/inc/gradient.php?color1='.urlencode($bodybgcolor1).'&color2='.urlencode($bodybgcolor2).
'&width='.$width.') repeat-y '.$bodybgcolor2),
@ -1336,7 +1338,7 @@ class calendar_uiviews extends calendar_ui
* @param $decr int value to add to each component, default 64
* @return string the brighter color
*/
function brighter($rgb,$decr=64)
static function brighter($rgb,$decr=64)
{
if (!preg_match('/^#?([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})$/',$rgb,$components))
{
@ -1353,6 +1355,26 @@ class calendar_uiviews extends calendar_ui
return $brighter;
}
/**
* Calculates the brightness of a hexadecimal rgb color (median of the r, g and b components)
*
* @param string $rgb eg. #808080
* @return int between 0 and 255
*/
static function brightness($rgb)
{
if ($rgb[0] != '#' || strlen($rgb) != 7)
{
return 128; // no rgb color, return some default
}
$dec = hexdec(substr($rgb,1));
for($i = 0; $i < 24; $i += 8)
{
$sum += ($dec >> $i) & 255;
}
return (int)round($sum / 3.0, 0);
}
/**
* Creates a planner view: grid with columns for the time and rows for categories or users

View File

@ -237,13 +237,13 @@ e.g. the div with class calTimeGrid is generated by the timeGridWidget method of
position: relative; /* as the calEventIcons use postion: absolute! */
font-weight: bold;
font-size: 9pt;
color: white;
text-align: left;
left: 0px;
right: 0px;
padding-left: 2px;
/* set via inline style on runtime
* background-color: depending on category
* color: white || black depending on cat;
*/
}
.calEventHeaderSmall{

View File

@ -1,5 +1,5 @@
<!-- BEGIN event_widget -->
{indent}<div class="calEventHeader{Small}" style="background-color: {bordercolor};">
{indent}<div class="calEventHeader{Small}" style="background-color: {bordercolor}; color: {headercolor};">
{indent} {header}
{indent} <div class="calEventIcons">{icons}</div>
{indent}</div>
@ -15,7 +15,7 @@
<!-- BEGIN event_tooltip -->
<div class="calEventTooltip" style="border-color: {bordercolor}; background: {bodybackground};">
<div class="calEventHeaderSmall" style="background-color: {bordercolor};">
<font color="white"><b>{timespan}</b></font>
<font color="{headercolor}">{timespan}</font>
<div class="calEventIcons">{icons}</div>
</div>
<div class="calEventBodySmall">