Hacking Angular Stuff

This commit is contained in:
Max Lynch
2013-10-03 20:18:23 -05:00
parent 52bf562b05
commit 153a8de7a1
8 changed files with 135 additions and 42 deletions

View File

@ -33,6 +33,7 @@ module.exports = function(grunt) {
distAngular: {
src: [
'js/ext/angular/src/ionicAngular.js',
'js/ext/angular/src/service/**/*.js',
'js/ext/angular/src/directive/**/*.js'
],
dest: 'dist/<%= pkg.name %>-angular.js'

64
dist/ionic-angular.js vendored
View File

@ -1,5 +1,21 @@
angular.module('ionic.ui', ['ionic.ui.content', 'ionic.ui.tabs', 'ionic.ui.nav', 'ionic.ui.sideMenu']);
;
angular.module('ionic.service', [])
.factory('TemplateLoader', ['$q', '$http', '$templateCache', function($q, $http, $templateCache) {
return {
load: function(url) {
var deferred = $q.defer();
$http.get(url, { cache: $templateCache }).success(function(html) {
deferred.resolve(html && html.trim());
});
return deferred.promise;
}
}
}]);
;
angular.module('ionic.ui.content', {})
// The content directive is a core scrollable content area
@ -24,13 +40,26 @@ angular.module('ionic.ui.content', {})
}
})
;
angular.module('ionic.ui.nav', [])
angular.module('ionic.ui.nav', ['ionic.service'])
.controller('NavCtrl', function($scope, $element, $compile) {
.controller('NavCtrl', ['$scope', '$element', '$compile', 'TemplateLoader', function($scope, $element, $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: {
},
@ -38,34 +67,28 @@ angular.module('ionic.ui.nav', [])
shouldGoBack: function() {
},
setTitle: function(title) {
$scope.title = title;
$scope.navController.title = title;
},
showBackButton: function(show) {
},
}
});
$scope.controllers = this.controllers;
$scope.getTopController = function() {
return $scope.controllers[$scope.controllers.length-1];
}
$scope.pushController = function(controller) {
_this.push(controller);
}
$scope.pushController = function(scope) {
_this.push(scope);
};
$scope.navController = this;
})
}])
.directive('navController', function() {
.directive('navCtrl', function() {
return {
restrict: 'E',
replace: true,
transclude: true,
controller: 'NavCtrl',
//templateUrl: 'ext/angular/tmpl/ionicTabBar.tmpl.html',
template: '<div class="view"><div ng-transclude></div></div>',
template: '<div class="view" ng-transclude></div>',
compile: function(element, attr, transclude, navCtrl) {
return function($scope, $element, $attr) {
};
@ -100,6 +123,15 @@ angular.module('ionic.ui.nav', [])
scope.title = attrs.title;
scope.isVisible = true;
scope.pushController(scope);
scope.$watch('isVisible', function(value) {
console.log('Visiblity changed', value);
if(value) {
element[0].classList.remove('hidden');
} else {
element[0].classList.add('hidden');
}
});
}
}
});
@ -164,7 +196,7 @@ angular.module('ionic.ui.sideMenu', [])
$scope.contentTranslateX = 0;
})
.directive('sideMenuController', function() {
.directive('sideMenuCtrl', function() {
return {
restrict: 'E',
controller: 'SideMenuCtrl',

View File

@ -35,25 +35,36 @@
</nav-ctrl>
<!-- Splash -->
<script id="/splash.html" type="text/ng-template">
<div class="vc">
<script id="splash.html" type="text/ng-template">
<div class="view" nav-content>
<h1>Toderp</h1>
</div>
</script>
<!-- Login -->
<script id="/login.html" type="text/ng-template">
<div></div>
<script id="login.html" type="text/ng-template">
<div class="view" nav-content ng-controller="LoginCtrl">
<h1>Login</h1>
</div>
</script>
<!-- Signup -->
<script id="/signup.html" type="text/ng-template">
<div></div>
<script id="signup.html" type="text/ng-template">
<div class="view" nav-content ng-controller="SignupCtrl"></div>
</script>
<!-- Tasks -->
<script id="/tasks.html" type="text/ng-template">
<side-menu-ctrl>
<script id="tasks.html" type="text/ng-template">
<side-menu-ctrl nav-content class="view" ng-controller="TasksCtrl">
<div class="full-section" side-menu-content>
<header class="bar bar-header bar-dark">
<a href="#" class="button"><i class="icon-reorder"></i></a>
<h1 class="title">Slide me</h1>
</header>
<div class="content has-header">
<h1>Slide me side to side!</h1>
</div>
</div>
<menu side="left">
<header>
<div class="toderp-logo"></div>
@ -67,8 +78,6 @@
</list>
</content>
</menu>
<view>
</view>
</side-menu-ctrl>
</script>
</body>

View File

@ -1,4 +1,13 @@
angular.module('ionic.todo', ['ionic.todo.services', 'ionic.todo.controllers', 'firebase', 'ngRoute', 'ngAnimate'])
angular.module('ionic.todo', [
'ionic.todo.services',
'ionic.todo.controllers',
'ionic.service',
'ionic.ui.nav',
'ionic.ui.sideMenu',
'firebase', 'ngRoute', 'ngAnimate'])
// Our Firebase URL
.constant('FIREBASE_URL', 'https://ionic-todo-demo.firebaseio.com/');

View File

@ -2,6 +2,14 @@ angular.module('ionic.todo.controllers', ['ionic.todo', 'firebase'])
// The main controller for the application
.controller('TodoCtrl', function($scope, $rootScope, AuthService) {
$scope.candy = 'yes';
$scope.navController.pushFromTemplate('splash.html');
$scope.navController.pushFromTemplate('login.html');
$scope.navController.pushFromTemplate('signup.html');
$scope.navController.pushFromTemplate('tasks.html');
console.log($scope);
$rootScope.$on('angularFireAuth:login', function(evt, user) {
$scope.display.screen = 'tasks';
});
@ -42,6 +50,9 @@ angular.module('ionic.todo.controllers', ['ionic.todo', 'firebase'])
};
})
.controller('ProjectsCtrl', function($scope, angularFire, FIREBASE_URL) {
})
// The tasks controller (main app controller)
.controller('TasksCtrl', function($scope, angularFire, FIREBASE_URL) {
var taskRef = new Firebase(FIREBASE_URL + '/todos');

View File

@ -1,10 +1,23 @@
angular.module('ionic.ui.nav', [])
angular.module('ionic.ui.nav', ['ionic.service'])
.controller('NavCtrl', function($scope, $element, $compile) {
.controller('NavCtrl', ['$scope', '$element', '$compile', 'TemplateLoader', function($scope, $element, $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: {
},
@ -12,25 +25,19 @@ angular.module('ionic.ui.nav', [])
shouldGoBack: function() {
},
setTitle: function(title) {
$scope.title = title;
$scope.navController.title = title;
},
showBackButton: function(show) {
},
}
});
$scope.controllers = this.controllers;
$scope.getTopController = function() {
return $scope.controllers[$scope.controllers.length-1];
}
$scope.pushController = function(controller) {
_this.push(controller);
}
$scope.pushController = function(scope) {
_this.push(scope);
};
$scope.navController = this;
})
}])
.directive('navCtrl', function() {
return {
@ -39,7 +46,7 @@ angular.module('ionic.ui.nav', [])
transclude: true,
controller: 'NavCtrl',
//templateUrl: 'ext/angular/tmpl/ionicTabBar.tmpl.html',
template: '<div class="view"><div ng-transclude></div></div>',
template: '<div class="view" ng-transclude></div>',
compile: function(element, attr, transclude, navCtrl) {
return function($scope, $element, $attr) {
};
@ -74,6 +81,15 @@ angular.module('ionic.ui.nav', [])
scope.title = attrs.title;
scope.isVisible = true;
scope.pushController(scope);
scope.$watch('isVisible', function(value) {
console.log('Visiblity changed', value);
if(value) {
element[0].classList.remove('hidden');
} else {
element[0].classList.add('hidden');
}
});
}
}
});

View File

@ -58,7 +58,7 @@ angular.module('ionic.ui.sideMenu', [])
$scope.contentTranslateX = 0;
})
.directive('sideMenuController', function() {
.directive('sideMenuCtrl', function() {
return {
restrict: 'E',
controller: 'SideMenuCtrl',

View File

@ -0,0 +1,15 @@
angular.module('ionic.service', [])
.factory('TemplateLoader', ['$q', '$http', '$templateCache', function($q, $http, $templateCache) {
return {
load: function(url) {
var deferred = $q.defer();
$http.get(url, { cache: $templateCache }).success(function(html) {
deferred.resolve(html && html.trim());
});
return deferred.promise;
}
}
}]);