I have color coded event implemented in SharePoint calendar using simple steps and without coding.
All I have done is created a calculated field with input color segment column and a script to include this selected color.
1. Create a Choice type Field named Color .
2. Add the needed colors
3. Create a calculated field name Calendar text Insert formula :
=Color&"|||"&Title
4. Add a CEWP(Content Editor WebPart)
<script language="JavaScript">
var SEPARATOR = "|||";
var nodes, category;
nodes = document.getElementsByTagName("a");
for(var i = 0; i < nodes.length; i++)
{
if(nodes[i].innerText.indexOf(SEPARATOR) != -1)
{
UpdateCalendarEntryText(nodes[i]);
var foundNode = nodes[i];
var trap = 0;
while(foundNode.nodeName.toLowerCase() != "td") {
foundNode = foundNode.parentNode;
trap++;
if(trap > 10)
{
break; // don't want to end up in a loop
}
}
var colour = GetCalendarColour(category);
if(colour ! "")
foundNode.style.background = colour;
}
}
function UpdateCalendarEntryText(anchorNode)
{
var children = anchorNode.childNodes;
for(var i = 0; i < children.length; i++)
{
if(children[i].nodeType == 3 && children[i].nodeValue.indexOf(SEPARATOR)
!= -1)
{
var parts = children[i].nodeValue.split(SEPARATOR);
category = parts[0];
children[i].nodeValue = parts[1];
}
else
UpdateCalendarEntryText(children[i]);
}
}
function GetCalendarColour(desc)
{
var colour;
switch(desc.toLowerCase())
{
case "red":
colour = "#ff0000";
break;
case "blue":
colour = "#0000ff";
break;
case "yellow":
colour = "#ffff00";
break;
case "green":
colour = "#008000";
break;
case "orange":
colour = "#ff8040";
break;
default:
colour = "";
}
nbsp;
return colour;
}
</script>
Bingo
--------
