A whole lotta shit

js/ext/angular/src/directive/ionicList.js

@@ -1,7 +1,7 @@
 (function() {
 'use strict';
 
-angular.module('ionic.ui.list', ['ionic.service', 'ngAnimate'])
+angular.module('ionic.ui.list', ['ionic.service.gesture', 'ngAnimate'])
 
 .directive('listItem', function() {
   return {
@@ -18,7 +18,7 @@ angular.module('ionic.ui.list', ['ionic.service', 'ngAnimate'])
       canSwipe: '@',
       buttons: '=',
     },
-    template:   '<li class="list-item">\
+    template:   '<li class="list-item" ng-click="onSelect()">\
                    <div class="list-item-edit" ng-if="canDelete && isEditing">\
                      <button class="button button-icon" ng-click="onDelete()"><i ng-class="deleteIcon"></i></button>\
                    </div>\
@@ -47,6 +47,15 @@ angular.module('ionic.ui.list', ['ionic.service', 'ngAnimate'])
   };
 })
 
+.directive('listRefresher', function() {
+  return {
+    restrict: 'E',
+    replace: true,
+    transclude: true,
+    template: '<div class="list-refresher"><div class="list-refresher-content" ng-transclude></div></div>'
+  }
+})
+
 .directive('list', function() {
   return {
     restrict: 'E',
@@ -56,7 +65,10 @@ angular.module('ionic.ui.list', ['ionic.service', 'ngAnimate'])
     scope: {
       isEditing: '=',
       deleteIcon: '@',
-      reorderIcon: '@'
+      reorderIcon: '@',
+      onRefreshOpening: '&',
+      onRefreshHolding: '&',
+      onRefresh: '&',
     },
 
     // So we can require being under this
@@ -75,7 +87,12 @@ angular.module('ionic.ui.list', ['ionic.service', 'ngAnimate'])
 
     compile: function(element, attr, transclude) {
       return function($scope, $element, $attr) {
-        var lv = new ionic.views.List({el: $element[0]});
+        var lv = new ionic.views.List({
+          el: $element[0],
+          onRefreshOpening: function(ratio) { $scope.onRefreshOpening({ratio: ratio}) },
+          onRefreshHolding: function() { $scope.onRefreshHolding(); },
+          onRefresh: function() { $scope.onRefresh(); }
+        });
 
         if(attr.animation) {
           $element.addClass(attr.animation);

js/ext/angular/src/directive/ionicLoading.js

@@ -0,0 +1,24 @@
+(function() {
+'use strict';
+
+angular.module('ionic.ui.loading', [])
+
+.directive('loading', function() {
+  return {
+    restrict: 'E',
+    replace: true,
+    transclude: true,
+    link: function($scope, $element){
+      $scope.$on('$destroy', function() {
+        $element.remove();
+      });
+      $element.addClass($scope.animation || '');
+    },
+    template: '<div class="loading-backdrop" ng-class="{enabled: showBackdrop}">' + 
+                '<div class="loading" ng-transclude>' +
+                '</div>' +
+              '</div>'
+  };
+});
+
+})();

js/ext/angular/src/directive/ionicNav.js

@@ -1,26 +1,13 @@
 (function() {
 'use strict';
 
-angular.module('ionic.ui.nav', ['ionic.service'])
+angular.module('ionic.ui.nav', ['ionic.service.templateLoad', 'ionic.service.gesture', 'ngAnimate'])
 
-.controller('NavCtrl', ['$scope', '$element', '$compile', 'TemplateLoader', function($scope, $element, $compile, TemplateLoader) {
+.controller('NavCtrl', ['$scope', '$element', '$animate', '$compile', 'TemplateLoader', function($scope, $element, $animate, $compile, TemplateLoader) {
   var _this = this;
 
   angular.extend(this, ionic.controllers.NavController.prototype);
 
-  this.pushFromTemplate = function(tmpl) {
-    data = TemplateLoader.load(tmpl).then(function(data) {
-      console.log('Nav loaded template', data);
-
-      var childScope = $scope.$new();
-      childScope.isVisible = true;
-      
-      $compile(data)(childScope, function(cloned, scope) {
-        $element.append(cloned);
-      });
-    });
-  };
-
   ionic.controllers.NavController.call(this, {
     content: {
     },
@@ -41,14 +28,39 @@ angular.module('ionic.ui.nav', ['ionic.service'])
     }
   });
 
-  $scope.pushController = function(scope) {
+  this.handleDrag = function(e) {
+  };
+
+  this.endDrag = function(e) {
+  };
+
+  this.pushFromTemplate = function(templateUrl) {
+    var childScope = $scope.$new();
+    childScope.isVisible = true;
+
+    TemplateLoader.load(templateUrl).then(function(templateString) {
+      var el = $compile(templateString)(childScope, function(cloned, scope) {
+        angular.element($element[0].children[1].firstElementChild).append(cloned);
+      });
+    });
+  };
+
+  $scope.pushController = function(scope, element) {
     _this.push(scope);
+
+    /*
+    var old = angular.element($element[0].children[1]);
+    $animate.enter(element, $element, $element[0].firstElementChild, function() {
+    });
+    $animate.leave(old, function() {
+    });
+    */
   };
 
   $scope.navController = this;
 }])
 
-.directive('navCtrl', function() {
+.directive('navs', function() {
   return {
     restrict: 'E',
     replace: true,
@@ -62,7 +74,7 @@ angular.module('ionic.ui.nav', ['ionic.service'])
 .directive('navBar', function() {
   return {
     restrict: 'E',
-    require: '^navCtrl',
+    require: '^navs',
     replace: true,
     scope: true,
     template: '<header class="bar bar-header bar-dark nav-bar" ng-class="{hidden: !navController.navBar.isVisible}">' + 
@@ -71,6 +83,8 @@ angular.module('ionic.ui.nav', ['ionic.service'])
       '</header>',
     link: function(scope, element, attrs, navCtrl) {
       scope.navController = navCtrl;
+      scope.$watch('navController.controllers.length', function(value) {
+      });
       scope.goBack = function() {
         navCtrl.pop();
       };
@@ -78,33 +92,61 @@ angular.module('ionic.ui.nav', ['ionic.service'])
   };
 })
 
-.directive('navContent', function() {
+.directive('navContent', ['Gesture', '$animate', function(Gesture, $animate) {
   return {
     restrict: 'ECA',
-    require: '^navCtrl',
+    require: '^navs',
     scope: true,
-    link: function(scope, element, attrs, navCtrl) {
-      scope.title = attrs.title;
+    transclude: 'element',
+    compile: function(element, attr, transclude) {
+      return function($scope, $element, $attr, navCtrl) {
+        var lastParent, lastIndex, childScope, childElement;
 
-      if(attrs.navBar === "false") {
-        navCtrl.hideNavBar();
-      } else {
-        navCtrl.showNavBar();
-      }
+        $scope.title = $attr.title;
 
-      scope.isVisible = true;
-      scope.pushController(scope);
-
-      scope.$watch('isVisible', function(value) {
-        console.log('Visiblity changed', value);
-        if(value) {
-          element[0].classList.remove('hidden');
+        if($attr.navBar === "false") {
+          navCtrl.hideNavBar();
         } else {
-          element[0].classList.add('hidden');
+          navCtrl.showNavBar();
         }
-      });
+
+        $scope.pushController($scope, $element);
+
+        
+        $scope.$watch('isVisible', function(value) {
+          if(childElement) {
+            $animate.leave(childElement);
+            childElement = undefined;
+          }
+          if(childScope) {
+            childScope.$destroy();
+            childScope = undefined;
+          }
+          if(value) {
+            childScope = $scope.$new();
+            transclude(childScope, function(clone) {
+              childElement = clone;
+              Gesture.on('drag', function(e) {
+                //navCtrl.handleDrag(e);
+                console.log('Content drag', e);
+              }, childElement[0]);
+
+              Gesture.on('release', function(e) {
+                //navCtrl._endDrag(e);
+              }, childElement[0]);
+
+              var title = $element.parent().parent().parent()[0].querySelector('.title');
+              $animate.enter(clone, $element.parent(), $element);
+              $animate.addClass(angular.element(title), 'slide-left-fade', function() {
+                $animate.removeClass(angular.element(title), 'slide-left-fade', function() {
+                });
+              });
+            });
+          }
+        });
+      }
     }
   };
-});
+}]);
 
 })();

js/ext/angular/src/directive/ionicSlideBox.js

@@ -0,0 +1,79 @@
+(function() {
+'use strict';
+
+/**
+ * @description
+ * The sideMenuCtrl lets you quickly have a draggable side
+ * left and/or right menu, which a center content area.
+ */
+
+angular.module('ionic.ui.slideBox', [])
+
+/**
+ * The internal controller for the side menu controller. This
+ * extends our core Ionic side menu controller and exposes
+ * some side menu stuff on the current scope.
+ */
+.controller('SlideBoxCtrl', ['$scope', '$element', function($scope, $element) {
+  $scope.slides = [];
+  this.slideAdded = function() {
+    $scope.slides.push({});
+  };
+}])
+
+.directive('slideBox', ['$compile', function($compile) {
+  return {
+    restrict: 'E',
+    replace: true,
+    transclude: true,
+    controller: 'SlideBoxCtrl',
+    scope: {},
+    template: '<div class="slide-box">\
+            <div class="slide-box-slides" ng-transclude>\
+            </div>\
+          </div>',
+
+    postLink: function() {
+      console.log('POST LINK');
+    },
+    link: function($scope, $element, $attr, slideBoxCtrl) {
+      // If the pager should show, append it to the slide box
+      if($attr.showPager !== "false") {
+        var childScope = $scope.$new();
+        var pager = $compile('<pager></pager>')(childScope);
+        $element.append(pager);
+
+        $scope.slideBox = new ionic.views.SlideBox({
+          el: $element[0]
+        });
+      }
+    }
+  }
+}])
+
+.directive('slide', function() {
+  return {
+    restrict: 'E',
+    replace: true,
+    require: '^slideBox',
+    transclude: true,
+    template: '<div class="slide-box-slide" ng-transclude></div>',
+    compile: function(element, attr, transclude) {
+      return function($scope, $element, $attr, slideBoxCtrl) {
+        slideBoxCtrl.slideAdded();
+      }
+    }
+  }
+})
+
+.directive('pager', function() {
+  return {
+    restrict: 'E',
+    replace: true,
+    require: '^slideBox',
+    template: '<div class="slide-box-pager"><span ng-repeat="slide in slides"><i class="icon-record"></i></span></div>'
+  }
+
+});
+
+})();

js/ext/angular/src/directive/ionicTabBar.js

@@ -1,6 +1,6 @@
-angular.module('ionic.ui.tabs', [])
+angular.module('ionic.ui.tabs', ['ngAnimate'])
 
-.controller('TabsCtrl', function($scope) {
+.controller('TabsCtrl', ['$scope', '$element', '$animate', function($scope, $element, $animate) {
   var _this = this;
 
   angular.extend(this, ionic.controllers.TabBarController.prototype);
@@ -8,83 +8,119 @@ angular.module('ionic.ui.tabs', [])
   ionic.controllers.TabBarController.call(this, {
     tabBar: {
       tryTabSelect: function() {},
-      setSelectedItem: function(index) {
-        console.log('TAB BAR SET SELECTED INDEX', index);
-      },
-      addItem: function(item) {
-        console.log('TAB BAR ADD ITEM', item);
-      }
+      setSelectedItem: function(index) {},
+      addItem: function(item) {}
     }
   });
 
+  this.add = function(controller) {
+    this.addController(controller);
+      this.select(0);
+  };
+
+  this.select = function(controllerIndex) {
+    var oldIndex = _this.getSelectedIndex();
+
+    $scope.activeAnimation = $scope.animation;
+    /*
+    if(controllerIndex > oldIndex) {
+    } else if(controllerIndex < oldIndex) {
+      $scope.activeAnimation = $scope.animation + '-reverse';
+    }
+    */
+    _this.selectController(controllerIndex);
+  };
+
   $scope.controllers = this.controllers;
+}])
 
-  $scope.$watch('controllers', function(newV, oldV) {
-    console.log("CControlelrs changed", newV, oldV);
-    //$scope.$apply();
-  });
-})
-
-.directive('tabController', function() {
+.directive('tabs', function() {
   return {
     restrict: 'E',
     replace: true,
-    scope: {},
+    scope: {
+      animation: '@'
+    },
     transclude: true,
     controller: 'TabsCtrl',
     //templateUrl: 'ext/angular/tmpl/ionicTabBar.tmpl.html',
-    template: '<div class="view"><div ng-transclude></div><tab-bar></tab-bar></div>',
+    template: '<div class="view"><tab-controller-bar></tab-controller-bar></div>',
     compile: function(element, attr, transclude, tabsCtrl) {
       return function($scope, $element, $attr) {
+        $scope.$watch('activeAnimation', function(value) {
+          //$element.removeClass($scope.animation + ' ' + $scope.animation + '-reverse');
+          $element.addClass($scope.activeAnimation);
+        });
+        transclude($scope, function(cloned) {
+          $element.prepend(cloned);
+        });
       };
     }
   };
 })
 
 // Generic controller directive
-.directive('tabContent', function() {
-  return {
-    restrict: 'CA',
-    replace: true,
-    require: '^tabController',
-    scope: true,
-    link: function(scope, element, attrs, tabsCtrl) {
-      scope.$watch('isVisible', function(value) {
-        if(!value) {
-          element[0].style.display = 'none';
-        } else {
-          element[0].style.display = 'block';
-        }
-      });
-
-      scope.title = attrs.title;
-      scope.icon = attrs.icon;
-      scope.iconOn = attrs.iconOn;
-      scope.iconOff = attrs.iconOff;
-      tabsCtrl.addController(scope);
-    }
-  };
-})
-
-
-.directive('tabBar', function() {
+.directive('tab', ['$animate', function($animate) {
   return {
     restrict: 'E',
-    require: '^tabController',
+    replace: true,
+    require: '^tabs',
+    scope: true,
+    transclude: 'element',
+    compile: function(element, attr, transclude) {
+      return function($scope, $element, $attr, tabsCtrl) {
+        var childScope, childElement;
+
+        
+        $scope.$watch('isVisible', function(value) {
+          if(childElement) {
+            $animate.leave(childElement);
+            childElement = undefined;
+          }
+          if(childScope) {
+            childScope.$destroy();
+            childScope = undefined;
+          }
+          if(value) {
+            childScope = $scope.$new();
+            transclude(childScope, function(clone) {
+              childElement = clone;
+              childElement.addClass('view-full');
+              $animate.enter(clone, $element.parent(), $element);
+            });
+          }
+        });
+
+        $scope.title = $attr.title;
+        $scope.icon = $attr.icon;
+        $scope.iconOn = $attr.iconOn;
+        $scope.iconOff = $attr.iconOff;
+        tabsCtrl.add($scope);
+
+      }
+    }
+  };
+}])
+
+
+.directive('tabControllerBar', function() {
+  return {
+    restrict: 'E',
+    require: '^tabs',
     transclude: true,
     replace: true,
     scope: true,
     template: '<div class="tabs tabs-primary">' + 
-      '<tab-item title="{{controller.title}}" icon="{{controller.icon}}" icon-on="{{controller.iconOn}}" icon-off="{{controller.iconOff}}" active="controller.isVisible" index="$index" ng-repeat="controller in controllers"></tab-item>' + 
+      '<tab-controller-item title="{{controller.title}}" icon="{{controller.icon}}" icon-on="{{controller.iconOn}}" icon-off="{{controller.iconOff}}" active="controller.isVisible" index="$index" ng-repeat="controller in controllers"></tab-controller-item>' + 
     '</div>'
   };
 })
 
-.directive('tabItem', function() {
+.directive('tabControllerItem', function() {
   return {
     restrict: 'E',
     replace: true,
-    require: '^tabController',
+    require: '^tabs',
     scope: {
       title: '@',
       iconOn: '@',
@@ -94,9 +130,8 @@ angular.module('ionic.ui.tabs', [])
       index: '='
     },
     link: function(scope, element, attrs, tabsCtrl) {
-      console.log('Linked item', scope);
       scope.selectTab = function(index) {
-        tabsCtrl.selectController(scope.index);
+        tabsCtrl.select(scope.index);
       };
     },
     template: 
@@ -106,4 +141,37 @@ angular.module('ionic.ui.tabs', [])
         '<i class="{{iconOff}}" ng-if="!active"></i> {{title}}' +
       '</a>'
   };
+})
+
+.directive('tabBar', function() {
+  return {
+    restrict: 'E',
+    replace: true,
+    transclude: true,
+    template: '<div class="tabs tabs-primary" ng-transclude>' + 
+    '</div>'
+  }
+})
+
+.directive('tabItem', function() {
+  return {
+    restrict: 'E',
+    replace: true,
+    scope: {
+      title: '@',
+      iconOn: '@',
+      iconOff: '@',
+      active: '=',
+      tabSelected: '@',
+      index: '='
+    },
+    link: function(scope, element, attrs) {
+    },
+    template: 
+      '<a href="#" ng-class="{active:active}" ng-click="tabSelected()" class="tab-item">' +
+        '<i class="{{icon}}" ng-if="icon"></i>' +
+        '<i class="{{iconOn}}" ng-if="active"></i>' +
+        '<i class="{{iconOff}}" ng-if="!active"></i> {{title}}' +
+      '</a>'
+  };
 });

js/ext/angular/src/service/ionicActionSheet.js

@@ -1,4 +1,4 @@
-angular.module('ionic.service.actionSheet', ['ionic.service', 'ionic.ui.actionSheet'])
+angular.module('ionic.service.actionSheet', ['ionic.service.templateLoad', 'ionic.ui.actionSheet'])
 
 .factory('ActionSheet', ['$rootScope', '$document', '$compile', 'TemplateLoader', function($rootScope, $document, $compile, TemplateLoader) {
   return {

js/ext/angular/src/service/ionicLoading.js

@@ -0,0 +1,48 @@
+angular.module('ionic.service.loading', ['ionic.ui.loading'])
+
+.factory('Loading', ['$rootScope', '$document', '$compile', function($rootScope, $document, $compile) {
+  return {
+    /**
+     * Load an action sheet with the given template string.
+     *
+     * A new isolated scope will be created for the 
+     * action sheet and the new element will be appended into the body.
+     *
+     * @param {object} opts the options for this ActionSheet (see docs)
+     */
+    show: function(opts) {
+      var defaults = {
+        content: '',
+        animation: 'fade-in',
+        showBackdrop: true
+      };
+
+      opts = angular.extend(defaults, opts);
+
+      var scope = $rootScope.$new(true);
+      angular.extend(scope, opts);
+
+      // Make sure there is only one loading element on the page at one point in time
+      var existing = angular.element($document[0].querySelector('.loading-backdrop'));
+      if(existing.length) {
+        var scope = existing.scope();
+        if(scope.loading) {
+          scope.loading.show();
+          return scope.loading;
+        }
+      }
+
+      // Compile the template
+      var element = $compile('<loading>' + opts.content + '</loading>')(scope);
+
+      $document[0].body.appendChild(element[0]);
+
+      var loading = new ionic.views.Loading({el: element[0] });
+      loading.show();
+
+      scope.loading = loading;
+
+      return loading;
+    }
+  };
+}]);

js/ext/angular/src/service/ionicModal.js

@@ -1,4 +1,4 @@
-angular.module('ionic.service.modal', ['ionic.service'])
+angular.module('ionic.service.modal', ['ionic.service.templateLoad'])
 
 
 .factory('Modal', ['$rootScope', '$document', '$compile', 'TemplateLoader', function($rootScope, $document, $compile, TemplateLoader) {

js/ext/angular/src/service/ionicPopup.js

@@ -0,0 +1,57 @@
+angular.module('ionic.service.popup', ['ionic.service.templateLoad'])
+
+
+.factory('Popup', ['$rootScope', '$document', '$compile', 'TemplateLoader', function($rootScope, $document, $compile, TemplateLoader) {
+
+  var getPopup = function() {
+    // Make sure there is only one loading element on the page at one point in time
+    var existing = angular.element($document[0].querySelector('.popup'));
+    if(existing.length) {
+      var scope = existing.scope();
+      if(scope.popup) {
+        return scope;
+      }
+    }
+  };
+
+  return {
+    alert: function(message) {
+
+      // If there is an existing popup, just show that one
+      var existing = getPopup();
+      if(existing) {
+        return existing.popup.alert(message);
+      }
+
+      var defaults = {
+        title: message,
+        animation: 'fade-in',
+      };
+
+      opts = angular.extend(defaults, opts);
+
+      var scope = $rootScope.$new(true);
+      angular.extend(scope, opts);
+
+      // Compile the template
+      var element = $compile('<popup>' + opts.content + '</popup>')(scope);
+      $document[0].body.appendChild(element[0]);
+
+      var popup = new ionic.views.Popup({el: element[0] });
+      popup.alert(message);
+
+      scope.popup = popup;
+
+      return popup;
+    },
+    confirm: function(cb) {
+    },
+    prompt: function(cb) {
+    },
+    show: function(data) {
+      // data.title
+      // data.template
+      // data.buttons
+    }
+  };
+}]);

js/ext/angular/src/service/ionicTemplateLoad.js

@@ -1,4 +1,4 @@
-angular.module('ionic.service', [])
+angular.module('ionic.service.templateLoad', [])
 
 .factory('TemplateLoader', ['$q', '$http', '$templateCache', function($q, $http, $templateCache) {
   return {