javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fixed #272

Browse Source
This commit is contained in:
Max Lynch
2013-12-07 18:00:42 -06:00
parent 21702608e2
commit 1826f455c5
6 changed files with 80 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
dist/js/ionic-angular.js vendored
View File

@@ -587,32 +587,29 @@ angular.module('ionic.ui.checkbox', [])
require: '?ngModel',
scope: {},
transclude: true,
template: '<label ng-click="tapHandler($event)" class="checkbox"><input type="checkbox"><div ng-transclude></div></label>',
template: '<li class="item item-checkbox">\
<label class="checkbox">\
<input type="checkbox">\
</label>\
<div class="item-content" ng-transclude>\
</div>\
</li>',
link: function($scope, $element, $attr, ngModel) {
var checkbox;
if(!ngModel) { return; }
checkbox = $element.children().eq(0);
checkbox = angular.element($element[0].querySelector('input[type="checkbox"]'));
if(!checkbox.length) { return; }
$scope.tapHandler = function(e) {
if(e.type != 'click') {
checkbox[0].checked = !checkbox[0].checked;
}
checkbox.bind('change', function(e) {
ngModel.$setViewValue(checkbox[0].checked);
e.alreadyHandled = true;
};
var clickHandler = function(e) {
checkbox[0].checked = !checkbox[0].checked;
$scope.$apply(function() {
ngModel.$setViewValue(checkbox[0].checked);
e.alreadyHandled = true;
});
};
});
if(ngModel) {
ngModel.$render = function() {
@@ -1083,7 +1080,7 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
};
}],
link: function($scope, $element, $attr) {
link: function($scope, $element, $attr, ctrl) {
if(!$element.length) return;
$scope.animation = $attr.animation;
@@ -1142,6 +1139,10 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
}
});
$scope.$on('navRouter.goBack', function(e) {
ctrl.goBack();
});
// Keep track of location changes and update a stack pointer that tracks whether we are
// going forwards or back
@@ -1413,7 +1414,6 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
.directive('navBack', ['$window', '$rootScope', 'Gesture', function($window, $rootScope, Gesture) {
return {
restrict: 'AC',
require: '^?navRouter',
link: function($scope, $element, $attr, navCtrl) {
var goBack = function(e) {
// Only trigger back if the stack is greater than zero
@@ -1421,7 +1421,7 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
$window.history.back();
// Fallback for bad history supporting devices
navCtrl.goBack();
$scope.$emit('navRouter.goBack');
}
e.alreadyHandled = true;
return false;
@@ -1449,8 +1449,8 @@ angular.module('ionic.ui.radio', [])
value: '@'
},
transclude: true,
template: '<label skip-tap-poly ng-click="tapHandler($event)" class="item item-radio">\
<input type="radio" name="group">\
template: '<label class="item item-radio">\
<input type="radio" name="radio-group">\
<div class="item-content" ng-transclude>\
</div>\
<i class="radio-icon icon ion-checkmark"></i>\
@@ -1465,21 +1465,14 @@ angular.module('ionic.ui.radio', [])
if(!radio.length) { return; }
$scope.tapHandler = function(e) {
console.log("RADIOTAP");
radio[0].checked = true;
ngModel.$setViewValue($scope.$eval($attr.ngValue));
e.alreadyHandled = true;
};
var clickHandler = function(e) {
console.log("RADIOCLICK");
ngModel.$setViewValue($scope.$eval($attr.ngValue));
};
if(ngModel) {
//$element.bind('tap', tapHandler);
$element.bind('click', clickHandler);
radio.bind('click', function(e) {
console.log('RADIO CLICK');
$scope.$apply(function() {
ngModel.$setViewValue($scope.$eval($attr.ngValue));
});
e.alreadyHandled = true;
});
ngModel.$render = function() {
var val = $scope.$eval($attr.ngValue);
@@ -1549,7 +1542,7 @@ angular.module('ionic.ui.radio', [])
if(!ngModel || !radioButtons) { return; }
var setIt = function() {
console.trace('SET');
console.log('SET');
$element.addClass('active');
ngModel.$setViewValue($scope.$eval($attr.ngValue));
@@ -1567,7 +1560,7 @@ angular.module('ionic.ui.radio', [])
};
});
$element.bind('tap', clickHandler);
$element.bind('click', clickHandler);
}
}
});

37
dist/js/ionic.js vendored
View File

@@ -1824,8 +1824,16 @@ window.ionic = {
// polyfill use to simulate native "tap"
function inputTapPolyfill(ele, e) {
if(ele.type === "radio" || ele.type === "checkbox") {
if(ele.type === "radio") {
ele.checked = !ele.checked;
ionic.trigger('click', {
target: ele
});
} else if(ele.type === "checkbox") {
ele.checked = !ele.checked;
ionic.trigger('change', {
target: ele
});
} else if(ele.type === "submit" || ele.type === "button") {
ionic.trigger('click', {
target: ele
@@ -1839,7 +1847,6 @@ window.ionic = {
}
function tapPolyfill(e) {
console.log('TAP POLY');
// if the source event wasn't from a touch event then don't use this polyfill
if(!e.gesture || e.gesture.pointerType !== "touch" || !e.gesture.srcEvent) return;
@@ -1849,7 +1856,6 @@ window.ionic = {
// the tap stuff itself). This is in contrast to preventDefault which will
// mess up other operations like change events and such
if(e.alreadyHandled) {
console.log('POLY HANDLED');
return;
}
@@ -1857,35 +1863,17 @@ window.ionic = {
var ele = e.target;
console.log('TARGET', ele);
while(ele) {
// Skip ones that have the poly skip
if(ele.getAttribute('skip-tap-poly')) {
ele = ele.parentElement;
continue;
}
if( ele.tagName === "INPUT" || ele.tagName === "TEXTAREA" || ele.tagName === "SELECT" ) {
console.log('INPUT POLY');
return inputTapPolyfill(ele, e);
} else if( ele.tagName === "LABEL" ) {
console.log('LABEL POLY');
if(ele.control) {
return inputTapPolyfill(ele.control, e);
}
} else if( ele.tagName === "A" || ele.tagName === "BUTTON" ) {
if(ele.getAttribute('href')) {
console.log('HREF POLY', ele);
ionic.trigger('click', {
target: ele
});
} else {
console.log('BUTTON POLY', ele);
ionic.trigger('tap', {
target: ele
});
}
ionic.trigger('click', {
target: ele
});
e.stopPropagation();
e.preventDefault();
return false;
@@ -1893,7 +1881,6 @@ window.ionic = {
ele = ele.parentElement;
}
console.log('NEITHER POLY');
// they didn't tap one of the above elements
// if the currently active element is an input, and they tapped outside
// of the current input, then unset its focus (blur) so the keyboard goes away

25
js/ext/angular/src/directive/ionicCheckbox.js vendored
View File

@@ -11,32 +11,29 @@ angular.module('ionic.ui.checkbox', [])
require: '?ngModel',
scope: {},
transclude: true,
template: '<label ng-click="tapHandler($event)" class="checkbox"><input type="checkbox"><div ng-transclude></div></label>',
template: '<li class="item item-checkbox">\
<label class="checkbox">\
<input type="checkbox">\
</label>\
<div class="item-content" ng-transclude>\
</div>\
</li>',
link: function($scope, $element, $attr, ngModel) {
var checkbox;
if(!ngModel) { return; }
checkbox = $element.children().eq(0);
checkbox = angular.element($element[0].querySelector('input[type="checkbox"]'));
if(!checkbox.length) { return; }
$scope.tapHandler = function(e) {
if(e.type != 'click') {
checkbox[0].checked = !checkbox[0].checked;
}
checkbox.bind('change', function(e) {
ngModel.$setViewValue(checkbox[0].checked);
e.alreadyHandled = true;
};
var clickHandler = function(e) {
checkbox[0].checked = !checkbox[0].checked;
$scope.$apply(function() {
ngModel.$setViewValue(checkbox[0].checked);
e.alreadyHandled = true;
});
};
});
if(ngModel) {
ngModel.$render = function() {

9
js/ext/angular/src/directive/ionicNavRouter.js vendored
View File

@@ -40,7 +40,7 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
};
}],
link: function($scope, $element, $attr) {
link: function($scope, $element, $attr, ctrl) {
if(!$element.length) return;
$scope.animation = $attr.animation;
@@ -99,6 +99,10 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
}
});
$scope.$on('navRouter.goBack', function(e) {
ctrl.goBack();
});
// Keep track of location changes and update a stack pointer that tracks whether we are
// going forwards or back
@@ -370,7 +374,6 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
.directive('navBack', ['$window', '$rootScope', 'Gesture', function($window, $rootScope, Gesture) {
return {
restrict: 'AC',
require: '^?navRouter',
link: function($scope, $element, $attr, navCtrl) {
var goBack = function(e) {
// Only trigger back if the stack is greater than zero
@@ -378,7 +381,7 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
$window.history.back();
// Fallback for bad history supporting devices
navCtrl.goBack();
$scope.$emit('navRouter.goBack');
}
e.alreadyHandled = true;
return false;

29
js/ext/angular/src/directive/ionicRadio.js vendored
View File

@@ -14,8 +14,8 @@ angular.module('ionic.ui.radio', [])
value: '@'
},
transclude: true,
template: '<label skip-tap-poly ng-click="tapHandler($event)" class="item item-radio">\
<input type="radio" name="group">\
template: '<label class="item item-radio">\
<input type="radio" name="radio-group">\
<div class="item-content" ng-transclude>\
</div>\
<i class="radio-icon icon ion-checkmark"></i>\
@@ -30,21 +30,14 @@ angular.module('ionic.ui.radio', [])
if(!radio.length) { return; }
$scope.tapHandler = function(e) {
console.log("RADIOTAP");
radio[0].checked = true;
ngModel.$setViewValue($scope.$eval($attr.ngValue));
e.alreadyHandled = true;
};
var clickHandler = function(e) {
console.log("RADIOCLICK");
ngModel.$setViewValue($scope.$eval($attr.ngValue));
};
if(ngModel) {
//$element.bind('tap', tapHandler);
$element.bind('click', clickHandler);
radio.bind('click', function(e) {
console.log('RADIO CLICK');
$scope.$apply(function() {
ngModel.$setViewValue($scope.$eval($attr.ngValue));
});
e.alreadyHandled = true;
});
ngModel.$render = function() {
var val = $scope.$eval($attr.ngValue);
@@ -114,7 +107,7 @@ angular.module('ionic.ui.radio', [])
if(!ngModel || !radioButtons) { return; }
var setIt = function() {
console.trace('SET');
console.log('SET');
$element.addClass('active');
ngModel.$setViewValue($scope.$eval($attr.ngValue));
@@ -132,7 +125,7 @@ angular.module('ionic.ui.radio', [])
};
});
$element.bind('tap', clickHandler);
$element.bind('click', clickHandler);
}
}
});

37
js/utils/poly.js
View File

@@ -30,8 +30,16 @@
// polyfill use to simulate native "tap"
function inputTapPolyfill(ele, e) {
if(ele.type === "radio" || ele.type === "checkbox") {
if(ele.type === "radio") {
ele.checked = !ele.checked;
ionic.trigger('click', {
target: ele
});
} else if(ele.type === "checkbox") {
ele.checked = !ele.checked;
ionic.trigger('change', {
target: ele
});
} else if(ele.type === "submit" || ele.type === "button") {
ionic.trigger('click', {
target: ele
@@ -45,7 +53,6 @@
}
function tapPolyfill(e) {
console.log('TAP POLY');
// if the source event wasn't from a touch event then don't use this polyfill
if(!e.gesture || e.gesture.pointerType !== "touch" || !e.gesture.srcEvent) return;
@@ -55,7 +62,6 @@
// the tap stuff itself). This is in contrast to preventDefault which will
// mess up other operations like change events and such
if(e.alreadyHandled) {
console.log('POLY HANDLED');
return;
}
@@ -63,35 +69,17 @@
var ele = e.target;
console.log('TARGET', ele);
while(ele) {
// Skip ones that have the poly skip
if(ele.getAttribute('skip-tap-poly')) {
ele = ele.parentElement;
continue;
}
if( ele.tagName === "INPUT" || ele.tagName === "TEXTAREA" || ele.tagName === "SELECT" ) {
console.log('INPUT POLY');
return inputTapPolyfill(ele, e);
} else if( ele.tagName === "LABEL" ) {
console.log('LABEL POLY');
if(ele.control) {
return inputTapPolyfill(ele.control, e);
}
} else if( ele.tagName === "A" || ele.tagName === "BUTTON" ) {
if(ele.getAttribute('href')) {
console.log('HREF POLY', ele);
ionic.trigger('click', {
target: ele
});
} else {
console.log('BUTTON POLY', ele);
ionic.trigger('tap', {
target: ele
});
}
ionic.trigger('click', {
target: ele
});
e.stopPropagation();
e.preventDefault();
return false;
@@ -99,7 +87,6 @@
ele = ele.parentElement;
}
console.log('NEITHER POLY');
// they didn't tap one of the above elements
// if the currently active element is an input, and they tapped outside
// of the current input, then unset its focus (blur) so the keyboard goes away