visualization calendar - change the colour base on the leave Reason user select

[confis]

Hi,

I have changed the CSS base on the Status element at the visualization calendar and its working good



I need to change the colour base on the leave Reason user select (i.e General will be Green, test will be blue,etc)





any idea ?

 

[troester]

Not sure what you mean.
The user selects the reason (the color is set by the admin once)?
Expand your calc element to return something like first_half_red, first_half_blue etc.

 

[confis]

Hi,

yes , (color is set by the admin per leave reason )
now, when user select the reason, the color of the reason reflect on the calander

 

[troester]

As I said:
Use your calc element to create the different classes and add these additional classes (with different background settings) to your custom.css

 

[confis]

The question is how to manage the values ?

the colour values come from the colourpicker element
(i.e 62,207,41 or 236,29,29)
as the admin set

it will be endless values

any idea

 

[cheesegrits]

I can't actually think of a built in way to do that. There's nothing in the code as-is that lets you derive the color from a joined element.

The only way I can think of to do it would be to create a custom template ... copy plugins/fabrik_visualization/fullcalendar/views/fullcalendar/tmpl/bootstrap to some other name, and use that as the template for your calendar.

Then in default.php, add some code at the top of the file that builds a stylesheet on the fly, by grabbing all the 'reasons" from the database, and building the class names from the color element ... something like ...

$db = FabrikWorker::getDbo();
$query = $db->getQuery(true);
// replace 'reasons' with your table name
$query->select('*')->from('reasons');
$db->setQuery($query);
$reasons = $db->loadObjectList();
$style = array();
foreach ($reasons as $r) {
   // replace 'reason' with the reason element on the events list, and  'id' and 'color' with the appropriate field names from reasons table
   $style = 'reason' . $r->id . ' { backgroundcolor: rgb(' . $r->color . '); }';
}
FabrikHelperHTML::addStyleDeclaration(implode("\n", $style));

That should build an inline stylesheet with a list of classes like ...

reason3 { background-color: rgb(123,50,205); }

... which should match the class names added to the events from your "Status" element.

-- hugh