bug: bug: Ion spinner not spinning in Windows Phone 8.1

[VeldMuijz]

Type: bug

Platform: mobile webview

Hi,
I'm creating an app for Windows Phone 8.1, Android and iOS.
The spinner directive doesn't show a spinning spinner in WP8.1 just a static image.

The spinning css look like it uses css animations that are supported by Internet Explorere 11 and I don't know where else to look.

Spinners do work on Android and iOS.

CodePen.io example

Example gif (left is windows, right is android):

[perrygovier]

Thanks @VeldMuijz, we'll look in to it

[perrygovier]

@VeldMuijz the problem is that IE doesn't support smil animations. since the android spinner uses a timing function instead of smil animation, I set that to be the default spinner on windows phone. That's not a great solution, but it's what we're going to do for now. You can add CSS animations to some of the spinners to get them looking right as well. Something like:

.platform-windowsphone8 {
  .spinner-ios,
  .spinner-ios-small,
  .spinner-circles,
  .spinner-crescent{
    svg {
      animation:spin 1250ms linear infinite;
    }
  }
  .spinner-spiral svg{
    animation:spin 750ms linear infinite;
  }
}
@-webkit-keyframes spin {
  from { -webkit-transform: rotate(0deg) }
  to { -webkit-transform: rotate(360deg) }
}
@keyframes spin
{
  from { transform:rotate(0deg); }
  to { transform:rotate(360deg); }
}

but the animation isn't perfect so we don't plan on adding it to the core

[ghenry22]

This catches windows phone but does not catch the new windows platform which has the same issue. Could be changed to the below to also catch the "windows" platform?

This may be addressed in Ionic 1.2.1 which has official windows platform support, haven't tested yet.

  if (ionic.Platform.platform() === 'windowsphone' || ionic.Platform.platform() === "windows") {
    override = 'android';
  }

[jdnichollsc]

@perrygovier please, add in the Ionic website a page of tips to use Ionic Framework. This info is very useful! :)