FullCalendar: Event with tooltips/custom event attributes

by slicedtoad

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.4.0/fullcalendar.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.4.0/fullcalendar.min.js"></script>
<div style="border:solid 2px red;">
    <div id='calendar'></div>
</div>

JavaScript

$(document).ready(function () {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    function GetDateString(myDate) {
        // GET CURRENT DATE
        var date = new Date(myDate);

        // GET YYYY, MM AND DD FROM THE DATE OBJECT
        var yyyy = date.getFullYear().toString();
        var mm = (date.getMonth() + 1).toString();
        var dd = date.getDate().toString();

        // CONVERT mm AND dd INTO chars
        var mmChars = mm.split('');
        var ddChars = dd.split('');

        // CONCAT THE STRINGS IN YYYY-MM-DD FORMAT
        var datestring = yyyy + '-' + (mmChars[1] ? mm : "0" + mmChars[0]) + '-' + (ddChars[1] ? dd : "0" + ddChars[0]);

        return datestring;
    }

    // adding a every monday and wednesday events:

    var myDataset = {
        "classes": [
            [{
                "name": "ECEC 301 Advanced Programming for Engineers Lecture",
                    "days": "MWF",
                    "times": "02:00 pm - 03:20 pm",
                    "crn": "11215"
            }, {
                "name": "ECEC 301 Advanced Programming for Engineers Lab",
                    "days": "W",
                    "times": "09:00 am - 10:50 am",
                    "crn": "11216"
            }],
            [{
                "name": "ECEC 301 Advanced Programming for Engineers Lecture",
                    "days": "MWF",
                    "times": "02:00 pm - 03:20 pm",
                    "crn": "11215"
            }, {
                "name": "ECEC 301 Advanced Programming for Engineers Lab",
                    "days": "F",
                    "times": "02:00 pm - 03:50 pm",
                    "crn": "11217"
            }]
        ]
    };

    var eventSourceFunction = function (start, end, timezone, callback) {
        console.log(start);
        // When requested, dynamically generate virtual
        // events for every monday and wednesday.
        var events...