SP2013 and PlanetWilson.SharePoint.ColourCalendarV2.4

So, we finally upgraded to SharePoint 2013.

PlanetWilson.SharePoint.ColourCalendarV2.4 was being used on our old SP2007 farm. 

I delayed writing this script until my company was off of SP2007, thinking someone else would write it by the time we migrated.

However, I noticed no one easily Googleable has done it.

So after a few hours of coding, here is the script that you can add to your calendars that are using Planet Wilson color coding to get it working again, as originally designed (pulling colors from the Colour Calendar Mapping list).


I wrote it using SharePoint 2013 JavaScript Client API.  I didn't use JQuery to reduce the number of library dependencies it had.  Just plain old JavaScript.  It uses document.getElementsByClassName, though, which only started getting support from IE  after IE11.  If you are on SP2013, you are more than likely using a fairly recent browser, anyways.


1) Throw the below code into a file called PlanetWilsonSP2013.js.

2)  Upload it to a document library on your SharePoint site and add a Script Editor Web Part to your calendar page.

3) Reference the uploaded JavaScript file in the Script Editor Snippet:
<script language="javascript" src="/Scripts/PlanetWilsonSP2013.js"></script>

4) Planet Wilson will once again color code your calendars, just like in the days of yore.

The code will use the Colour Calendar Mapping list in the root web of the site collection to look up the colors.  In my environment, I had to modify the Category field to be a text field instead of an empty choice field. 

//Author: William W.C.Chung
//Source: http://adamantinewolverine.blogspot.kr/2017/04/sp2013-and-planetwilsonsharepointcolour.html

var objPWColor = new UpdatePlanetWilsonCalendarColors();
_spBodyOnLoadFunctionNames.push("LaunchPWColorCode");

function LaunchPWColorCode()
{
    SP.SOD.executeOrDelayUntilScriptLoaded(MyCalendarHook1, 'SP.js');
   
}
function MyCalendarHook1()
{
    SP.SOD.executeOrDelayUntilScriptLoaded(MyCalendarHook, 'SP.UI.ApplicationPages.Calendar.js');
}
function MyCalendarHook() {
    objPWColor.initialize();
    var _patchCalendar = function () {
        //Do something to the items in the calendar here
        //ColorCodeCalendar();
        objPWColor.ColorCodeCalendar();
    };

  
}


function UpdatePlanetWilsonCalendarColors()
{
    var self = this;
    function EventCategoryColor(EventCategory, Color, BGColor) {
        this.EventCategory = EventCategory || '';
        this.Color = Color || '';
        this.BGColor = BGColor || '';
    }
    self.GetEventColor=function(cat)
    {
        var EventCategoryObj = new EventCategoryColor("","","");
        for (var i=0;i<self.EventCategoryArray.length;i++)
        {
            var ec = self.EventCategoryArray[i];
            if (ec.EventCategory.toLowerCase() == cat.toLowerCase())
            {
                return ec;
            }
        }
        return EventCategoryObj;
    }
      
    self.onQuerySucceeded = function (sender, args) {
        var listItemInfo = '';
        var listItemEnumerator = self.collListItem.getEnumerator();
        while (listItemEnumerator.moveNext()) {
            var oListItem = listItemEnumerator.get_current();
            var PWEventCategory = oListItem.get_item('PWEventCategory');
            var BGColor = oListItem.get_item('PWBGColour');
            var Color = oListItem.get_item('PWFGColour');
            var eventColor = new EventCategoryColor(PWEventCategory, Color, BGColor);
            self.EventCategoryArray.push(eventColor);
            listItemInfo += "Added event cat: " + eventColor.EventCategory + "\r\n";
        }
       // alert(listItemInfo.toString());

        var _onItemsSucceed = SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed;
        SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed = function ($p0, $p1) {
            _onItemsSucceed.call(this, $p0, $p1);
            self.ColorCodeCalendar();
        };

        self.ColorCodeCalendar();

    }
    self.ColorCodeCalendar=function()
    {

        var eventelements = document.getElementsByClassName('ms-acal-mdiv');
        var eventelements2 = document.getElementsByClassName('ms-acal-item');
        var eventelements3 = document.getElementsByClassName('ms-acal-ddiv');
        //All Day Event
        for (var i = 0; i < eventelements.length; i++) {
            var divi = eventelements[i];
            if (divi.hasChildNodes) {
                var alink = divi.firstChild;
                if (alink.nodeName.toUpperCase() == 'A') {
                    var strText = alink.innerHTML;
                    if (strText.indexOf("|||") >= 0) {
                        var splitText = strText.split('|||');
                        var category = splitText[0];
                        var title = splitText[1];
                        alink.innerHTML = title;
                        var eco = self.GetEventColor(category);
                        var strStyle = "";
                        if (eco.BGColor) {
                            strStyle = "background-color: " + eco.BGColor + ";";
                        }
                        if (eco.Color) {
                            strStyle += "color: " + eco.Color + " !important";
                        }
                        alink.setAttribute('style', strStyle);
                        var prevStyle = divi.getAttribute('style');
                        divi.setAttribute('style', prevStyle + ";" + strStyle);
                    }
                }
            }
        }
        //Recurrent Event Day View
        //All Day Event
        for (var i = 0; i < eventelements3.length; i++) {
            var ddiv = eventelements3[i];
            if (ddiv.hasChildNodes) {
                var titlediv = ddiv.firstChild;
                var alink = null;
                if (titlediv.hasChildNodes)
                {
                    for (var j=0;j<titlediv.childNodes.length;j++)
                    {
                        if (titlediv.childNodes[j].nodeName && titlediv.childNodes[j].nodeName.toUpperCase()=="A")
                        {
                            alink = titlediv.childNodes[j];
                            continue;
                        }
                    }
                }
               
                if (alink && alink.nodeName.toUpperCase() == 'A') {
                    var strText = alink.innerHTML;
                    if (strText.indexOf("|||") >= 0) {
                        var splitText = strText.split('|||');
                        var category = splitText[0];
                        var title = splitText[1];
                        alink.innerHTML = title;
                        var eco = self.GetEventColor(category);
                        var strStyle = "";
                        if (eco.BGColor) {
                            strStyle = "background-color: " + eco.BGColor + ";";
                        }
                        if (eco.Color) {
                            strStyle += "color: " + eco.Color + " !important";
                        }
                        alink.setAttribute('style', strStyle);
                        var prevStyle = ddiv.getAttribute('style');
                        ddiv.setAttribute('style', prevStyle + ";" + strStyle);
                        if (ddiv.parentElement.nodeName.toUpperCase()=="DIV")
                        {
                            var prevStyle = ddiv.parentElement.getAttribute('style');
                            ddiv.parentElement.setAttribute('style', prevStyle + ";" + strStyle);
                        }
                        for (var j=0;j<ddiv.childNodes.length;j++)
                        {
                            var childDiv = ddiv.childNodes[j];
                            if (childDiv.nodeName.toUpperCase() == 'DIV') {
                                var prevStyle = childDiv.getAttribute('style');
                                childDiv.setAttribute('style', prevStyle + ";" + strStyle);
                            }
                        }
                    }
                }
            }
        }

        //Timed Event
        for (var i = 0; i < eventelements2.length; i++) {
            var divi = eventelements2[i];

            if (divi.hasChildNodes) {
                var sdiv = divi.firstChild;
                if (sdiv.hasChildNodes)
                {
                    var childrenDivs = sdiv.childNodes;
                    if (childrenDivs)
                    {
                        var titlediv = null, alink = null;
                        for (var j = 0; j < childrenDivs.length; j++)
                        {
                            var tempDiv = childrenDivs[j];
                            if (tempDiv.attributes && tempDiv.attributes["class"] && tempDiv.attributes["class"].value=='ms-acal-title')
                            {
                                titlediv = tempDiv;
                                continue;
                            }
                            if (tempDiv.nodeName.toUpperCase()=="A")
                            {
                                alink = tempDiv;
                                continue;
                            }
                        }
                        if (titlediv == null && alink==null)
                        {
                            continue;
                        }
                      
                        if (titlediv && titlediv.hasChildNodes) {
                            alink = titlediv.firstChild;
                        }
                            if (alink.nodeName.toUpperCase()=="A")
                            {
                               
                                var strText = alink.innerHTML;
                                if (strText.indexOf("|||") >= 0) {
                                    var splitText = strText.split('|||');
                                    var category = splitText[0];
                                    var title = splitText[1];
                                    alink.innerHTML = title;
                                    var eco = self.GetEventColor(category);
                                    var strStyle = "";
                                    if (eco.BGColor) {
                                        strStyle = "background-color: " + eco.BGColor + ";";
                                       
                                    }
                                    if (eco.Color) {
                                        strStyle += "color: " + eco.Color + " !important";
                                       
                                    }
                                    alink.setAttribute('style', strStyle);
                                    var prevStyle=divi.getAttribute('style');
                                    divi.setAttribute('style', prevStyle + ";" + strStyle);
                                    prevStyle = sdiv.getAttribute('style');
                                    sdiv.setAttribute('style', prevStyle + ";" + strStyle);
                                    for (var j = 0; j < childrenDivs.length; j++) {
                                        var tempDiv = childrenDivs[j];
                                        if (tempDiv.attributes && tempDiv.nodeName.toUpperCase()=="DIV") {
                                            var prevStyle = tempDiv.getAttribute('style');
                                            tempDiv.setAttribute('style', prevStyle + ";" + strStyle);
                                        }
                                       
                                    }
                                }
                            }
                       
                    }
                }
               
            }
        }
    }

    self.onQueryFailed = function (sender, args) {
        alert('Request failed. ' + args.get_message() +   '\n' + args.get_stackTrace());
    }
 
    self.retrieveEventCategoryItems = function () {
        var clientContext = self.ctx;
        var oList = self.rootWeb.get_lists().getByTitle('Colour Calendar Mapping');
        var camlQuery = new SP.CamlQuery();
        camlQuery.set_viewXml(
            "<View><Query><Where><Neq><FieldRef Name='PWEventCategory'/><Value Type='Text'></Value></Neq></Where></Query>" +
            '<RowLimit>1000</RowLimit></View>'
        );
        self.collListItem = oList.getItems(camlQuery);
        clientContext.load(self.collListItem);
        clientContext.executeQueryAsync(
            Function.createDelegate(self, self.onQuerySucceeded),
            Function.createDelegate(self, self.onQueryFailed)
        );
    }
   // retrieveEventCategoryItems();
   
    self.initialize = function () {

        self.EventCategoryArray = [];
        self.ctx = new SP.ClientContext();
        self.site = self.ctx.get_site();
        self.rootWeb = self.site.get_rootWeb();
        self.ctx.load(self.rootWeb);
        //self.ctx.load(site);
        self.retrieveEventCategoryItems();
    }

}


Comments

  1. TigrgrguyMay 23, 2018 at 6:51 AM

    I am unable to find the original instructions to setup the calendar to work with the code. Is there any way you can post them? thanks.

    ReplyDelete
    Replies
    1. Will ChungDecember 29, 2018 at 5:34 AM

      If you aren't using the Planet Wilson Color Calendar, then you won't need this code.

      Just google for color code SharePoint Calendar:

      Here's a couple links:
      http://www.sharepointjunkies.com/color-coded-calendar-sharepoint-online-using-javascript/

      or

      https://www.eimagine.com/sharepoint-color-coding-your-calendar-by-category-tutorial/

      Delete

Post a Comment

Popular posts from this blog

How To use ASPNET_SetReg to store encrypted data in the registry and then decrypt the data for use in your app

1) You may find it a bit unsecure storing usernames and passwords inside your web.config.  As an alternative to doing this, Microsoft has established a standard way to store that type of info in the registry of your server instead.  Yes, you can encrypt portions of the web.config using aspnet_regiis, but it can become quite a hassle if you need to make changes to some of your appSettings keys or change the account password over a number of different applications.   ( http://msdn.microsoft.com/en-us/library/dtkwfdky.aspx ) 2) You can use a simple command line tool called aspnet_setreg.exe to create your registry entries.     You can find the tool here:              http://support.microsoft.com/kb/329290     The tool will use CryptProtectData to encrypt the values you put in the registry. The example in the article uses the following example: Run the following command...
Read more

Nostalgia for SNL's Il Returno De Hercules

Image
Source: http://snltranscripts.jt.org/86/86nhercules.phtml Now that SNL has an official YouTube channel, I had hoped SNL would add the "Il Returno de Hercules" skit to the channel.  The skit was from from SNL Season 12 Episode 14. I was able to find the script for the skit at snltranscripts.jt.org.  And here it is for your viewing pleasure.  If SNL doesn't put this on YouTube, maybe someone can remake it and put it up. Il Returno de Hercules King Laetes.....Dana Carvey/Tom Davis (voice) Helena.....Nora Dunn/Jan Hooks (voice) Hercules.....Bill Murray Guard.....A Whitney Brown Announcer : [ over SCROLL ] "In the time known as the Heroic Age, many centuries before the birth of Christ, Greece was still a savage and uncivilized land. In these dark times, one man alone defended the helpless - the Mighty Hercules. For many years the mighty Hercules fought for the common people, until at length his rich diet and increasingly sedentary lifesty...
Read more

PowerShell Script to Clean the Windows Installer Directory

Yesterday, I had a case of the Windows folder filling up the OS drive on a server. I already have scripts to archive the event log files in c:\windows\system32\winevt, as well as c:\inetpub\logs for web servers.  So I ran those again, but found the OS drive still down to less than 5 GB in space. Using a program called WinDirStat, I discovered that the Windows Installer directory had gotten pretty big, like over 40GB in size. I began my quest to Google for a solution. I saw one article talking about using DISM to clean up the winsxs directory.  https://docs.microsoft.com/en-us/windows-hardware/manufacture/desktop/clean-up-the-winsxs-folder However, that didn't clean up the c:\windows\installer directory at all.  Also, installing the Desktop Experience Feature and using the cleanmgr.exe (Disk Clean up) utility didn't clean up the Installer directory either. Many blogs pointed towards a tool called Patch Cleaner. https://www.winhelponline.com/blog/windows-inst...
Read more