mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-06 22:29:44 +08:00
Updated toggle and moved to view inheritance
This commit is contained in:
@ -7,9 +7,9 @@
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<link href="/vendor/font-awesome/css/font-awesome.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="../../../../dist/css/ionic.css">
|
||||
<script src="/vendor/angular/angular-1.2.0rc2.min.js"></script>
|
||||
<script src="/vendor/angular/angular-touch.js"></script>
|
||||
<script src="/vendor/angular/angular-animate.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular-touch.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular-animate.js"></script>
|
||||
<style>
|
||||
.box {
|
||||
width: 100%;
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<meta charset="utf-8">
|
||||
<title>Tab Bars</title>
|
||||
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<link rel="stylesheet" href="../../../../dist/css/ionic.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular-touch.js"></script>
|
||||
|
||||
@ -13,9 +13,11 @@
|
||||
<body>
|
||||
|
||||
<content has-header="true" ng-controller="TestCtrl" class="reveal-animation">
|
||||
<form ng-submit="doIt()">
|
||||
<form>
|
||||
<toggle ng-model="data.isLovely"></toggle>
|
||||
<button type="submit" class="button button-danger">Do it</button>
|
||||
<button ng-click="toggle()" class="button button-danger">Toggle</button>
|
||||
<button ng-click="doIt()" class="button button-warning">Print</button>
|
||||
</form>
|
||||
</content>
|
||||
|
||||
<script src="../../../../dist/js/ionic.js"></script>
|
||||
@ -28,6 +30,9 @@
|
||||
$scope.doIt = function() {
|
||||
console.log('DOIT', $scope.data);
|
||||
}
|
||||
$scope.toggle = function() {
|
||||
$scope.data.isLovely = !$scope.data.isLovely;
|
||||
};
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
@ -8,33 +8,33 @@
|
||||
(function(ionic) {
|
||||
'use strict';
|
||||
|
||||
ionic.views.SlideBox = function(opts) {
|
||||
var _this = this;
|
||||
ionic.views.SlideBox = ionic.views.View.inherit({
|
||||
initialize: function(opts) {
|
||||
var _this = this;
|
||||
|
||||
this.el = opts.el;
|
||||
this.pager = this.el.querySelector('.slide-box-pager');
|
||||
this.el = opts.el;
|
||||
this.pager = this.el.querySelector('.slide-box-pager');
|
||||
|
||||
// The drag threshold is the pixel delta that will trigger a drag (to
|
||||
// avoid accidental dragging)
|
||||
this.dragThresholdX = opts.dragThresholdX || 10;
|
||||
// The velocity threshold is a velocity of drag that indicates a "swipe". This
|
||||
// number is taken from hammer.js's calculations
|
||||
this.velocityXThreshold = opts.velocityXThreshold || 0.3;
|
||||
// The drag threshold is the pixel delta that will trigger a drag (to
|
||||
// avoid accidental dragging)
|
||||
this.dragThresholdX = opts.dragThresholdX || 10;
|
||||
// The velocity threshold is a velocity of drag that indicates a "swipe". This
|
||||
// number is taken from hammer.js's calculations
|
||||
this.velocityXThreshold = opts.velocityXThreshold || 0.3;
|
||||
|
||||
// Initialize the slide index to the first page and update the pager
|
||||
this.slideIndex = 0;
|
||||
this._updatePager();
|
||||
// Initialize the slide index to the first page and update the pager
|
||||
this.slideIndex = 0;
|
||||
this._updatePager();
|
||||
|
||||
// Listen for drag and release events
|
||||
window.ionic.onGesture('drag', function(e) {
|
||||
_this._handleDrag(e);
|
||||
}, this.el);
|
||||
window.ionic.onGesture('release', function(e) {
|
||||
_this._handleEndDrag(e);
|
||||
}, this.el);
|
||||
};
|
||||
// Listen for drag and release events
|
||||
window.ionic.onGesture('drag', function(e) {
|
||||
_this._handleDrag(e);
|
||||
}, this.el);
|
||||
window.ionic.onGesture('release', function(e) {
|
||||
_this._handleEndDrag(e);
|
||||
}, this.el);
|
||||
},
|
||||
|
||||
ionic.views.SlideBox.prototype = {
|
||||
/**
|
||||
* Tell the pager to update itself if content is added or
|
||||
* removed.
|
||||
@ -323,6 +323,6 @@
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
})(window.ionic);
|
||||
|
||||
@ -1,14 +1,13 @@
|
||||
(function(ionic) {
|
||||
'use strict';
|
||||
|
||||
ionic.views.Toggle = function(opts) {
|
||||
this.el = opts.el;
|
||||
this.checkbox = opts.checkbox;
|
||||
this.handle = opts.handle;
|
||||
this.openPercent = -1;
|
||||
};
|
||||
|
||||
ionic.views.Toggle.prototype = {
|
||||
ionic.views.Toggle = ionic.views.View.inherit({
|
||||
initialize: function(opts) {
|
||||
this.el = opts.el;
|
||||
this.checkbox = opts.checkbox;
|
||||
this.handle = opts.handle;
|
||||
this.openPercent = -1;
|
||||
},
|
||||
|
||||
tap: function(e) {
|
||||
this.val( !this.checkbox.checked );
|
||||
@ -59,6 +58,6 @@
|
||||
return this.checkbox.checked;
|
||||
}
|
||||
|
||||
};
|
||||
});
|
||||
|
||||
})(ionic);
|
||||
|
||||
Reference in New Issue
Block a user