javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-06 22:29:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

More side menu angular stuff

Browse Source
This commit is contained in:
Max Lynch
2013-09-21 16:13:43 -05:00
parent ee0186ec89
commit 916725040c
2 changed files with 35 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
hacking/sideMenuAngular.html
View File

@ -15,12 +15,15 @@
<body> <body>
<side-menu-controller> <side-menu-controller>
<content has-header="true"> <div class="full-section" side-menu-content>
<header class="bar bar-header bar-dark"> <header class="bar bar-header bar-dark">
<a href="#" class="button"><i class="icon-reorder"></i></a> <a href="#" class="button"><i class="icon-reorder"></i></a>
<h1 class="title">Slide me</h1> <h1 class="title">Slide me</h1>
</header> </header>
</content> <div class="content has-header">
<h1>Slide me side to side!</h1>
</div>
</div>
<menu side="left"> <menu side="left">
<h2>Left</h2> <h2>Left</h2>
</menu> </menu>
@ -28,6 +31,8 @@
<h2>Right</h2> <h2>Right</h2>
</menu> </menu>
</side-menu-controller> </side-menu-controller>
<script src="../../js/ionic-events.js"></script>
<script src="../../js/ionic-gestures.js"></script>
<script src="SideMenuController.js"></script> <script src="SideMenuController.js"></script>
<script src="SideMenuAngular.js"></script> <script src="SideMenuAngular.js"></script>
<script> <script>

45
hacking/sideMenuAngular.js
View File

@ -1,21 +1,12 @@
angular.module('ionic.ui', ['ngTouch']) angular.module('ionic.ui', [])
.directive('content', function() {
return {
restrict: 'E',
replace: true,
transclude: true,
scope: true,
template: '<div class="full-section menu-animated" ng-class="{\'has-header\': hasHeader, \'has-tabs\': hasTabs}" ng-transclude></div>',
compile: function(element, attr, transclude, navCtrl) {
return function($scope, $element, $attr) {
$scope.hasHeader = attr.hasHeader;
};
}
}
})
.controller('SideMenuCtrl', function($scope) { .controller('SideMenuCtrl', function($scope) {
var _this = this;
angular.extend(this, SideMenuController.prototype);
SideMenuController.call(this, {
});
}) })
.directive('sideMenuController', function() { .directive('sideMenuController', function() {
@ -28,6 +19,26 @@ angular.module('ionic.ui', ['ngTouch'])
} }
}) })
.directive('sideMenuContent', function() {
return {
restrict: 'CA',
require: '^sideMenuController',
compile: function(element, attr, transclude, sideMenuCtrl) {
return function($scope, $element, $attr) {
window.ionic.onGesture('drag', function(e) {
sideMenuCtrl._handleDrag(e);
}, $element[0]);
window.ionic.onGesture('release', function(e) {
sideMenuCtrl._endDrag(e);
}, $element[0]);
};
}
}
})
.directive('menu', function() { .directive('menu', function() {
return { return {
restrict: 'E', restrict: 'E',
@ -36,7 +47,7 @@ angular.module('ionic.ui', ['ngTouch'])
transclude: true, transclude: true,
scope: true, scope: true,
template: '<div class="menu menu-{{side}}" ng-transclude></div>', template: '<div class="menu menu-{{side}}" ng-transclude></div>',
compile: function(element, attr, transclude, navCtrl) { compile: function(element, attr, transclude, sideMenuCtrl) {
return function($scope, $element, $attr) { return function($scope, $element, $attr) {
$scope.side = attr.side; $scope.side = attr.side;
}; };