fix(spinner): works in iOS8

fixes #8145
This commit is contained in:
Manu Mtz.-Almeida
2016-10-12 21:33:48 +02:00
parent 48c7823d2f
commit a2ffa63fd1
2 changed files with 12 additions and 8 deletions

View File

@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component, ElementRef, Input, Renderer, ViewEn
import { Config } from '../../config/config';
import { Ion } from '../ion';
import { CSS } from '../../util/dom';
/**
* @name Spinner
* @description
@ -232,8 +232,8 @@ const SPINNERS: any = {
y1: 17,
y2: 29,
style: {
transform: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
[CSS.transform]: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
}
};
}
@ -247,8 +247,8 @@ const SPINNERS: any = {
y1: 12,
y2: 20,
style: {
transform: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
[CSS.transform]: 'rotate(' + (30 * index + (index < 6 ? 180 : -180)) + 'deg)',
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
}
};
}
@ -263,7 +263,7 @@ const SPINNERS: any = {
style: {
top: 9 * Math.sin(2 * Math.PI * index / total),
left: 9 * Math.cos(2 * Math.PI * index / total),
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
}
};
}
@ -278,7 +278,7 @@ const SPINNERS: any = {
style: {
top: 9 * Math.sin(2 * Math.PI * index / total),
left: 9 * Math.cos(2 * Math.PI * index / total),
animationDelay: -(dur - ((dur / total) * index)) + 'ms'
[CSS.animationDelay]: -(dur - ((dur / total) * index)) + 'ms'
}
};
}
@ -303,7 +303,7 @@ const SPINNERS: any = {
r: 6,
style: {
left: (9 - (9 * index)),
animationDelay: -(110 * index) + 'ms'
[CSS.animationDelay]: -(110 * index) + 'ms'
}
};
}

View File

@ -72,6 +72,7 @@ export let CSS: {
transitionStart?: string,
transitionEnd?: string,
transformOrigin?: string
animationDelay?: string;
} = {};
(function() {
@ -113,6 +114,9 @@ export let CSS: {
// transform origin
CSS.transformOrigin = (isWebkit ? '-webkit-' : '') + 'transform-origin';
// animation delay
CSS.animationDelay = (isWebkit ? 'webkitAnimationDelay' : 'animationDelay');
})();