Can't enable transitions & minor improvements to docs

[yarnball]

Hi,

Firstly, I wasn't familiar with Browsify (ie to do the require ES5). I'm building an Ionic app.

I so to get it working, I just added the "/ionic-native-transitions/dist/ionic-native-transitions.js" script to my index.html file (I had to load it after ionic.bundle.js).

In modules I added: angular.module('stashd', ['ionic-native-transitions',])

And below that I added:

.config(function($ionicNativeTransitionsProvider){ $ionicNativeTransitionsProvider.setDefaultOptions({ duration: 400, // in milliseconds (ms), default 400, slowdownfactor: 4, // overlap views (higher number is more) or no overlap (1), default 4 iosdelay: -1, // ms to wait for the iOS webview to update before animation kicks in, default -1 androiddelay: -1, // same as above but for Android, default -1 winphonedelay: -1, // same as above but for Windows Phone, default -1, fixedPixelsTop: 0, // the number of pixels of your fixed header, default 0 (iOS and Android) fixedPixelsBottom: 0, // the number of pixels of your fixed footer (f.i. a tab bar), default 0 (iOS and Android) triggerTransitionEvent: '$ionicView.afterEnter', // internal ionic-native-transitions option backInOppositeDirection: false // Takes over default back transition and state back transition to use the opposite direction transition to go back }); });

NB: I had to add a comma fo "fixedPixelsBottom: 0,"- that's a Syntax error.

Then added a transition to routing (a sample): .state('stores', { url: '/stores', nativeTransitions: { "type": "flip", "direction": "up" }, views: { 'menuContent': { templateUrl: 'app/components/stores/stores.html' } }

ionic serve works, but in the JS console it says "nativepagetransitions is disabled or nativepagetransitions plugin is not present".

When I build the app (ios) xcode does not load the content of the app (aside from the header).

Can some one please guide me?

[shprink]

What is your problem?

[yarnball]

When I build the app (ios/xcode) and have ionic native transitions on- the content of my app is missing (only header & login screen appear).

Should my method of installation work fine (ie adding the /ionic-native-transitions/dist/ionic-native-transitions.js to my index.html)- could this be the cause of the problem?

BTW This looks like an awesome plugin- game changing :)

[shprink]

ionic serve works, but in the JS console it says "nativepagetransitions is disabled or nativepagetransitions plugin is not present".

That's normal, this plugin works only on device.

Test your app without this plugin to see if there is any change. Also remove all the config, the default config is good enough for a start.

[yarnball]

App works fine without the plugin. It seems to be 'hiding' all pages when I enable it.

Will this remove the default config?

.config(function($ionicConfigProvider) { $ionicConfigProvider.views.transition('none'); })

Could the transition issue be related to by routing going to views?

.state('stores', { url: '/stores', nativeTransitions: { "type": "flip", "direction": "up" }, views: { 'menuContent': { templateUrl: 'app/components/stores/stores.html' } }

[shprink]

remove what you added, it is not necessary at this point:

.config(function($ionicNativeTransitionsProvider){ $ionicNativeTransitionsProvider.setDefaultOptions({ duration: 400, // in milliseconds (ms), default 400, slowdownfactor: 4, // overlap views (higher number is more) or no overlap (1), default 4 iosdelay: -1, // ms to wait for the iOS webview to update before animation kicks in, default -1 androiddelay: -1, // same as above but for Android, default -1 winphonedelay: -1, // same as above but for Windows Phone, default -1, fixedPixelsTop: 0, // the number of pixels of your fixed header, default 0 (iOS and Android) fixedPixelsBottom: 0, // the number of pixels of your fixed footer (f.i. a tab bar), default 0 (iOS and Android) triggerTransitionEvent: '$ionicView.afterEnter', // internal ionic-native-transitions option backInOppositeDirection: false // Takes over default back transition and state back transition to use the opposite direction transition to go back }); });

And try without the native transition plugin to see if it works better

[yarnball]

So, the ion-pane CSS (specifically ".pane, .view" ) background colour (white) is covering my background (err. I removed the CSS, and could see my content, but nothing was clickable.

What could that relate to- a bug of some sort?

[yarnball]

I created a fresh project, and have re installed it (my way, adding the ionic-native-transitions.js to the index.html).

The plugin seems to be working, but when I compile it in xcode it is still using ionic's transitions. Do I have to manually disable it? In the browser it looks like it worked- as I no longer see any sort of transition .state('stores', { url: '/stores', nativeTransitions: { "type": "flip", "direction": "up" }, views: { 'menuContent': { templateUrl: 'app/components/stores/stores.html' } }