Views leaving the stack unexpectedly

[jaypeeZero]

Views leaving the stack unexpectedly

[pwalczyszyn]

@jamespwright Does the same happen when you pass NotesPage as a type not as an instance?

[jaypeeZero]

Yes. I tried changing all calls to "pushView" to a type and it still occurs. I compared my code to your example projects and I cannot figure out where I've done anything wrong (though I'm not ruling that option out) so I have no real clue what to do.
I checked and I'm using the same version of Backbone, and Underscore as your example project.
If you look under my user account at the "jqpgHelloWorld" project you'll see the same basic setup that I have on my current project.

[pwalczyszyn]

First thing I see in your jqpgHelloWorld project is that you shouldn't set el property in Backbone.View's and for sure not to point to #container. Next I see that your templates are loaded after the callback is executed and returned template is undefined. That is at least what I see when I debug it in Safari on my Mac.

[jaypeeZero]

:-\
Apparently that project isn't actually working. I should have checked before I mentioned it.
My current project is similar though.
Why should I not point to #container for my View's "el" property?
I know for sure with my "NotesPage" that the template is not being returned as undefined because the view shows up for half a second then fades out.

I can't share my entire project with you as it is a company project, but if there is any information I can provide please let me know.

[pwalczyszyn]

If you set el to #container then the Backbone will do its magic to add the view to the DOM and also BackStack will do the same thing. This may cause some weird behaviour and for sure the transitions will not work properly.

[jaypeeZero]

When I initialize StackNavigator, the "el" that I provide, does that mean it will look for that element on every template/page I use or just where the main container goes?
I also noticed that you don't set the "el" property on a View but you do set "id". Does BackStack use that ID as the element to grab from the template/page?

[jaypeeZero]

I've updated the gist from the original post to include the files for "index", "app.js", "splash.js" and "splash.html"
At the moment, the event "viewChanging" fires, then about 5 seconds later I see an error about "Warning webkitTransitionEnd didn't trigger in expected time!" and the "viewChanged" event fires.
The page never transitions away from the default "index.html" though which is just the text "index".

When I use console.log(tpl.get("splash")) during the Splash page "render" I see the html that I would expect but it does not display on the page.

These files should be everything needed to reproduce my problem.

[jaypeeZero]

I BELIEVE I figured out this issue.

I was initializing a new instance of BackStack.StackNavigator BEFORE $(document).ready() had fired. After moving the initialization of stackNavigator to onDeviceReady (the PhoneGap equivalent) it appears to be working correctly.

[pwalczyszyn]

cool :) BTW you can see the source code of demo page here: https://github.com/pwalczyszyn/backstack/tree/gh-pages