diff --git a/js/angular/directive/itemDeleteButton.js b/js/angular/directive/itemDeleteButton.js
index 19059e3c241..c279c93474e 100644
--- a/js/angular/directive/itemDeleteButton.js
+++ b/js/angular/directive/itemDeleteButton.js
@@ -30,10 +30,10 @@ var ITEM_TPL_DELETE_BUTTON =
* ```
*/
IonicModule
-.directive('ionDeleteButton', [function() {
+.directive('ionDeleteButton', ['$animate', function($animate) {
return {
restrict: 'E',
- require: '^ionItem',
+ require: ['^ionItem', '^ionList'],
//Run before anything else, so we can move it before other directives process
//its location (eg ngIf relies on the location of the directive in the dom)
priority: Number.MAX_VALUE,
@@ -41,10 +41,16 @@ IonicModule
//Add the classes we need during the compile phase, so that they stay
//even if something else like ngIf removes the element and re-addss it
$attr.$set('class', ($attr.class || '') + ' button icon button-icon', true);
- return function($scope, $element, $attr, itemCtrl) {
+ return function($scope, $element, $attr, ctrls) {
+ var itemCtrl = ctrls[0];
+ var listCtrl = ctrls[1];
var container = angular.element(ITEM_TPL_DELETE_BUTTON);
container.append($element);
itemCtrl.$element.append(container).addClass('item-left-editable');
+
+ if (listCtrl.showDelete()) {
+ $animate.removeClass(container, 'ng-hide');
+ }
};
}
};
diff --git a/js/angular/directive/itemReorderButton.js b/js/angular/directive/itemReorderButton.js
index 85ff338a315..c2f58951d52 100644
--- a/js/angular/directive/itemReorderButton.js
+++ b/js/angular/directive/itemReorderButton.js
@@ -46,15 +46,17 @@ var ITEM_TPL_REORDER_BUTTON =
* Parameters given: $fromIndex, $toIndex.
*/
IonicModule
-.directive('ionReorderButton', [function() {
+.directive('ionReorderButton', ['$animate', function($animate) {
return {
restrict: 'E',
- require: '^ionItem',
+ require: ['^ionItem', '^ionList'],
priority: Number.MAX_VALUE,
compile: function($element, $attr) {
$attr.$set('class', ($attr.class || '') + ' button icon button-icon', true);
$element[0].setAttribute('data-prevent-scroll', true);
- return function($scope, $element, $attr, itemCtrl) {
+ return function($scope, $element, $attr, ctrls) {
+ var itemCtrl = ctrls[0];
+ var listCtrl = ctrls[1];
$scope.$onReorder = function(oldIndex, newIndex) {
$scope.$eval($attr.onReorder, {
$fromIndex: oldIndex,
@@ -65,6 +67,10 @@ IonicModule
var container = angular.element(ITEM_TPL_REORDER_BUTTON);
container.append($element);
itemCtrl.$element.append(container).addClass('item-right-editable');
+
+ if (listCtrl.showReorder()) {
+ $animate.removeClass(container, 'ng-hide');
+ }
};
}
};
diff --git a/test/unit/angular/directive/list.unit.js b/test/unit/angular/directive/list.unit.js
index 94fde82e7b7..99302a4f382 100644
--- a/test/unit/angular/directive/list.unit.js
+++ b/test/unit/angular/directive/list.unit.js
@@ -256,41 +256,72 @@ describe('ionItem directive', function() {
describe('ionDeleteButton directive', function() {
beforeEach(module('ionic'));
it('should have delete button', inject(function($compile, $rootScope) {
- var setSpy = jasmine.createSpy('setDeleteButton')
+ var setSpy = jasmine.createSpy('setDeleteButton');
var el = angular.element('');
- el.data('$ionListController', {});
+ el.data('$ionListController', {
+ showDelete: function() { return false; }
+ });
$compile(el)($rootScope.$new());
$rootScope.$apply();
- var deleteContainer = angular.element(el[0].querySelector('.item-left-edit.item-delete'));
+ var deleteContainer = angular.element(el[0].querySelector('.item-left-edit.item-delete.ng-hide'));
expect(deleteContainer.length).toBe(1);
expect(deleteContainer.children().hasClass('button icon button-icon')).toBe(true);
}));
+ it('should unhide if delete is shown', inject(function($compile, $rootScope) {
+ var setSpy = jasmine.createSpy('setDeleteButton');
+ var el = angular.element('');
+ el.data('$ionListController', {
+ showDelete: function() { return true; }
+ });
+ $compile(el)($rootScope.$new());
+ $rootScope.$apply();
+
+ var deleteContainer = angular.element(el[0].querySelector('.item-left-edit.item-delete'));
+ expect(deleteContainer.length).toBe(1);
+ expect(deleteContainer.hasClass('ng-hide')).toBe(false);
+ }));
});
describe('ionReorderButton directive', function() {
beforeEach(module('ionic'));
it('should have reorder button', inject(function($compile, $rootScope) {
- var setSpy = jasmine.createSpy('setReorderButton')
+ var setSpy = jasmine.createSpy('setReorderButton');
var el = angular.element('');
- el.data('$ionListController', {});
+ el.data('$ionListController', {
+ showReorder: function() { return false; }
+ });
$compile(el)($rootScope.$new());
$rootScope.$apply();
- var reorderContainer = angular.element(el[0].querySelector('.item-right-edit.item-reorder'));
+ var reorderContainer = angular.element(el[0].querySelector('.item-right-edit.item-reorder.ng-hide'));
expect(reorderContainer.length).toBe(1);
expect(reorderContainer.children().hasClass('button icon button-icon')).toBe(true);
expect(reorderContainer.attr('data-prevent-scroll')).toBe('true');
expect(reorderContainer.children().attr('data-prevent-scroll')).toBe('true');
}));
+ it('should remove ng-hide if reorder is already active', inject(function($compile, $rootScope) {
+ var setSpy = jasmine.createSpy('setReorderButton');
+ var el = angular.element('');
+ el.data('$ionListController', {
+ showReorder: function() { return true; }
+ });
+ $compile(el)($rootScope.$new());
+ $rootScope.$apply();
+ var reorderContainer = angular.element(el[0].querySelector('.item-right-edit.item-reorder'));
+ expect(reorderContainer.length).toBe(1);
+ expect(reorderContainer.hasClass('ng-hide')).toBe(false);
+ }));
});
describe('ionOptionButton directive', function() {
beforeEach(module('ionic'));
it('should have option button', inject(function($compile, $rootScope) {
- var setSpy = jasmine.createSpy('setOptionButton')
+ var setSpy = jasmine.createSpy('setOptionButton');
var el = angular.element('');
- el.data('$ionListController', {});
+ el.data('$ionListController', {
+ showDelete: function() { return false; }
+ });
$compile(el)($rootScope.$new());
$rootScope.$apply();