title: Unable to run ui-calendar error: undefined is not a function
body: <p>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 <a href="https://github.com/angular-ui/ui-calendar" rel="nofollow">https://github.com/angular-ui/ui-calendar</a> 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.</p>
  
  <p>Here is the header for my html:</p>
  
  <pre><code>&lt;script type="text/javascript" src="lib/jquery/dist/jquery.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="lib/jquery-ui/ui/jquery-ui.js"&gt;&lt;/script&gt;
      &lt;!--other libs--&gt;
      &lt;!--&lt;script type="text/javascript" src="js/jquery-1.11.1.min.js"&gt;&lt;/script&gt;--&gt;
  
      &lt;!--ionic libs--&gt;
      &lt;link rel="stylesheet" href="lib/ionic/css/ionic.css"&gt;
      &lt;script src="lib/ionic/js/ionic.bundle.js"&gt;&lt;/script&gt;
  
  
      &lt;!--My App--&gt;
      &lt;link rel="stylesheet" href="css/style.css"&gt;
      &lt;script src="js/app.js"&gt;&lt;/script&gt;
  
  
      &lt;!--will 404 during the dev stage--&gt; 
       &lt;script src="cordova.js"&gt;&lt;/script&gt;
  
      &lt;!--Fullcalendar libs--&gt;
      &lt;script type="text/javascript" src="lib/jquery/dist/jquery.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="lib/jquery-ui/ui/jquery-ui.js"&gt;&lt;/script&gt;
      &lt;!--&lt;script type="text/javascript" src="lib/angular/angular.js"&gt;&lt;/script&gt;--&gt;
      &lt;script type="text/javascript" src="lib/angular-ui-calendar/src/calendar.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="lib/fullcalendar/fullcalendar.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="lib/fullcalendar/gcal.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Here is the controller for my ui-calendar:</p>
  
  <pre><code>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 &lt; 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;
                  }
              }); 
          }
  ];
  });
  </code></pre>
  
  <p>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!</p>