mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
Closes #2336. Closes #2317. Closes #2290. Closes #2228. Closes #2067. Closes #1890. Closes #1865. Closes #1850. Closes #1755. Closes #1688. Closes #1578. Closes #1501. Closes #1353. Closes #1342. Closes #782. Closes #416. Closes #2288. BREAKING CHANGE: The slideBox's API has undergone many changes. - **`<ion-slide-box>`** attributes have changed (see [documentation](http://ionicframework.com/docs/api/directive/ionSlideBox)): * `active-slide` has changed to `selected`. Change your code from this: ```html <ion-slide-box active-slide="activeSlideIndex"></ion-slide-box> ``` To this: ```html <ion-slide-box selected="activeSlideIndex"></ion-slide-box> ``` * `does-continue` has changed to `loop`. Change your code from this: ```html <ion-slide-box does-continue="shouldLoop"></ion-slide-box> ``` To this: ```html <ion-slide-box loop="shouldLoop"></ion-slide-box> ``` * `auto-play` and `slide-interval` have been merged into `auto-play`. Change your code from this: ```html <!-- autoPlay is on --> <ion-slide-box auto-play="true" slide-interval="1000"> </ion-slide-box> <!-- autoPlay is off --> <ion-slide-box auto-play="false" slide-interval="1000"> </ion-slide-box> ``` To this: ```html <!-- autoPlay is on --> <ion-slide-box auto-play="1000"></ion-slide-box> <!-- autoPlay is off --> <ion-slide-box auto-play="false"></ion-slide-box> ``` * `show-pager` and `pager-click` have been removed. Use a child `<ion-slide-pager>` element. See the [`ion-slide-pager` documentation](http://ionicframework.com/docs/api/directive/ionSlidePager). Change your code from this: ```html <!-- pager using default click action --> <ion-slide-box show-pager="true"> </ion-slide-box> <!-- pager with custom click action --> <ion-slide-box show-pager="true" pager-click="doSomething(index)"> </ion-slide-box> ``` To this: ```html <ion-slide-box> <!-- pager using default click action --> <ion-slide-pager></ion-slide-pager> </ion-slide-box> <ion-slide-box> <!-- pager with custom click action --> <ion-slide-pager ng-click="doSomething(index)"></ion-slide-pager> </ion-slide-box> ``` - **`$ionicSlideBoxDelegate`** methods have changed (see [documentation](http://ionicframework.com/docs/api/service/$ionicSlideBoxDelegate)): - `update()` has been removed. slideBox updates on its own now. - `stop()` has been removed. See `autoPlay()` below. - `start()` hass been removed. See `autoPlay()` below. - `slide(newIndex[, speed])` has been renamed to `select(newIndex[, speed]); - `currentIndex()` has been renamed to `selected()`. - `slidesCount()` has been renamed to `count()`. - New method `$ionicSlideBoxDelegate.autoPlay()`. Change your code from this: ```js // stop auto sliding $ionicSlideBoxDelegate.stop(); // later... start auto sliding $ionicSlideBoxDelegate.start(); ``` To this: ```js var autoPlaySpeed = 3000; //wait 3000 seconds between changing slide // stop auto sliding $ionicSlideBoxDelegate.autoPlay(false); // later... start auto sliding $ionicSlideBoxDelegate.autoPlay(autoPlaySpeed); ``` - `previous()` now returns the index of the previous slide and does not select. Change your code from this: ```js // select previous slide $ionicSlideBoxDelegate.previous(); ``` To this: ```js // select previous slide $ionicSlideBoxDelegate.select( $ionicSlideBoxDelegate.previous() ); ``` - `next()` now returns the index of the next slide and does not select. Change your code from this: ```js // select next slide $ionicSlideBoxDelegate.next(); ``` To this: ```js // select next slide $ionicSlideBoxDelegate.select( $ionicSlideBoxDelegate.next() ); ```
151 lines
3.7 KiB
JavaScript
151 lines
3.7 KiB
JavaScript
(function() {
|
|
|
|
function trueFn() { return true; }
|
|
|
|
ionic.Utils.list = list;
|
|
|
|
function list(initialArray) {
|
|
|
|
var array = angular.isArray(initialArray) ? initialArray : [];
|
|
var self = {};
|
|
var isLooping = false;
|
|
|
|
// The Basics
|
|
self.items = items;
|
|
self.add = add;
|
|
self.remove = remove;
|
|
self.at = at;
|
|
self.count = count;
|
|
self.indexOf = angular.bind(array, array.indexOf);
|
|
self.isInRange = isInRange;
|
|
self.loop = loop;
|
|
|
|
// The Crazy Ones
|
|
self.delta = delta;
|
|
self.isRelevant = isRelevant;
|
|
self.previous = previous;
|
|
self.next = next;
|
|
|
|
return self;
|
|
|
|
// ***************
|
|
// Public methods
|
|
// ***************
|
|
function items() {
|
|
return array;
|
|
}
|
|
function add(item, index) {
|
|
if (!self.isInRange(index)) index = array.length;
|
|
array.splice(index, 0, item);
|
|
return index;
|
|
}
|
|
|
|
function remove(index) {
|
|
if (!self.isInRange(index)) return;
|
|
array.splice(index, 1);
|
|
}
|
|
|
|
function at(index) {
|
|
return array[index];
|
|
}
|
|
|
|
function count() {
|
|
return array.length;
|
|
}
|
|
|
|
function isInRange(index) {
|
|
return index > -1 && index < array.length;
|
|
}
|
|
|
|
function loop(newIsLooping) {
|
|
if (arguments.length) {
|
|
isLooping = !!newIsLooping;
|
|
}
|
|
return isLooping;
|
|
}
|
|
|
|
function delta(fromIndex, toIndex) {
|
|
var difference = toIndex - fromIndex;
|
|
if (!isLooping) return difference;
|
|
|
|
// Is looping on? Then check for the looped difference.
|
|
// For example, going from the first item to the last item
|
|
// is actually a change of -1.
|
|
var loopedDifference = 0;
|
|
if (toIndex > fromIndex) {
|
|
loopedDifference = toIndex - fromIndex - self.count();
|
|
} else {
|
|
loopedDifference = self.count() - fromIndex + toIndex;
|
|
}
|
|
|
|
if (Math.abs(loopedDifference) < Math.abs(difference)) {
|
|
return loopedDifference;
|
|
}
|
|
return difference;
|
|
}
|
|
|
|
// Returns whether an index is 'relevant' to some index.
|
|
// Will return true if the index is equal to `someIndex`, the index
|
|
// previous of that index, or the index next of that index.
|
|
function isRelevant(index, someIndex) {
|
|
return self.isInRange(index) && (
|
|
index === someIndex ||
|
|
index === self.previous(someIndex) ||
|
|
index === self.next(someIndex)
|
|
);
|
|
}
|
|
|
|
// Get the index after the given index.
|
|
// Takes looping and the given filterFn into account.
|
|
function next(index, filterFn) {
|
|
filterFn = filterFn || trueFn;
|
|
if (!self.isInRange(index)) return -1;
|
|
|
|
// Keep adding 1 to index, trying to find an index that passes filterFn.
|
|
// If we loop through *everything* and get back to our original index, return -1.
|
|
// We don't use recursion here because Javascript sucks at recursion.
|
|
var nextIndex = index + 1;
|
|
while ( nextIndex !== index ) {
|
|
|
|
if (nextIndex === array.length) {
|
|
if (isLooping) nextIndex -= array.length;
|
|
else break;
|
|
} else {
|
|
if (filterFn(array[nextIndex], nextIndex)) {
|
|
return nextIndex;
|
|
}
|
|
nextIndex++;
|
|
}
|
|
}
|
|
return -1;
|
|
}
|
|
|
|
// Get the index before the given index.
|
|
// Takes looping and the given filterFn into account.
|
|
function previous(index, filterFn) {
|
|
filterFn = filterFn || trueFn;
|
|
if (!self.isInRange(index)) return -1;
|
|
|
|
// Keep subtracting 1 from index, trying to find an index that passes filterFn.
|
|
// If we loop through *everything* and get back to our original index, return -1.
|
|
// We don't use recursion here because Javascript sucks at recursion.
|
|
var prevIndex = index - 1;
|
|
while ( prevIndex !== index ) {
|
|
|
|
if (prevIndex === -1) {
|
|
if (isLooping) prevIndex += array.length;
|
|
else break;
|
|
} else {
|
|
if (filterFn(array[prevIndex], prevIndex)) {
|
|
return prevIndex;
|
|
}
|
|
prevIndex--;
|
|
}
|
|
}
|
|
return -1;
|
|
}
|
|
|
|
}
|
|
|
|
})();
|