Unable to run ui-calendar error: undefined is not a function

I am trying to implement ui-calendar into my ionic application, and am having some severe issues, I have followed the instructions on the documentation at https://github.com/angular-ui/ui-calendar however no matter what I do to try and get the calendar to render nothing is working. I am trying to get the calendar to pull event data from a json feed in a PHP page I have set up on a MySQL server. The page is displaying the event data fine and I have used the same code in a similar working function on my app also.

Here is the header for my html:

<script type="text/javascript" src="lib/jquery/dist/jquery.js"></script>
    <script type="text/javascript" src="lib/jquery-ui/ui/jquery-ui.js"></script>
    <!--other libs-->
    <!--<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>-->

    <!--ionic libs-->
    <link rel="stylesheet" href="lib/ionic/css/ionic.css">
    <script src="lib/ionic/js/ionic.bundle.js"></script>


    <!--My App-->
    <link rel="stylesheet" href="css/style.css">
    <script src="js/app.js"></script>


    <!--will 404 during the dev stage--> 
     <script src="cordova.js"></script>

    <!--Fullcalendar libs-->
    <script type="text/javascript" src="lib/jquery/dist/jquery.js"></script>
    <script type="text/javascript" src="lib/jquery-ui/ui/jquery-ui.js"></script>
    <!--<script type="text/javascript" src="lib/angular/angular.js"></script>-->
    <script type="text/javascript" src="lib/angular-ui-calendar/src/calendar.js"></script>
    <script type="text/javascript" src="lib/fullcalendar/fullcalendar.js"></script>
    <script type="text/javascript" src="lib/fullcalendar/gcal.js"></script>

Here is the controller for my ui-calendar:

App.controller('calCtrl', function ($scope, $rootScope, $log, $state)
{
$scope.eventSources = [ 
/* event source that pulls from google.com */
         function() {
            var userData = $.ajax( {
                url: 'urlHere',
                method: 'GET',
                dataType: 'json',
                success: function(userData) {
                    //console.log(userData);
                    var user_count = userData.length;
                    var source = [];
                    var jsonData = [];
                    // Create the sources
                    for (var i = 0; i < user_count; i++)
                    {
                        var uid = userData[i].ID;
                        if(!source[i]) source[i] = [];
                        source[i] = 'urlHere?e=' + uid;

                        // Add each source to a JSON feed object
                        jsonData.push({
                            url: source[i],
                            type: 'GET',
                            color: userData[i].cal_color,
                            textColor: userData[i].txt_color,
                            error: function() { alert('There was an error loading calendar data.');}
                        });
                    }
console.log(jsonData); // In the console I can see well formed JSON data
                    return jsonData;
                }
            }); 
        }
];
});

The calendar controller is the only thing that differs from the documentation on the ui-calendar github page. I don't see what I am missing here and this has had me at a stand still for a while now. Any help would be greatly appreciated!

Try to replace your code by this:

$scope.eventSources = [
    {
        events: [
            {
                title: 'Event1',
                start: '2011-04-04'
            },
            {
                title: 'Event2',
                start: '2011-05-05'
            }
            // etc...
        ],
        color: 'yellow',   // an option!
        textColor: 'black' // an option!
    }
];

If that works,

$scope.eventSources = [
    {
        events: function() {
            var userData = $.ajax( {
                url: 'urlHere',
                method: 'GET',
                dataType: 'json',
                success: function(userData) {
                    //console.log(userData);
                    var user_count = userData.length;
                    var source = [];
                    var jsonData = [];
                    // Create the sources
                    for (var i = 0; i < user_count; i++)
                    {
                        var uid = userData[i].ID;
                        if(!source[i]) source[i] = [];
                        source[i] = 'urlHere?e=' + uid;

                        // Add each source to a JSON feed object
                        jsonData.push({
                            url: source[i],
                            type: 'GET',
                            color: userData[i].cal_color,
                            textColor: userData[i].txt_color,
                            error: function() { alert('There was an error loading calendar data.');}
                        });
                    }
                    console.log(jsonData); // In the console I can see well formed JSON data
                    return jsonData;
                }
            }); 
        }
    }
];

You can see all the options for eventSour in the doc: http://arshaw.com/fullcalendar/docs/event_data/Event_Source_Object/