Clunky page transition from root to stormpath

[yaboi]

When a user clicks a "Get Started" button or the "Login" button in the top nav, it shows a blank page (with nav and footer only) before transitioning to the login/register screen from storm path.

screencast: http://screencast.com/t/OMUfFxQsEch

Though the physical URL isn't changing anymore, this still disrupts the feeling of unity between the marketing site and the app. I think the design change becomes that much more apparent with this little delay.

[yaboi]

I wonder if we could launch this into a modal instead of a page refresh. Could we still do the same tracking in GTM / GA of the user flow if we had a stormpath modal instead of a full page refresh?

Maybe we could do a full opacity, white overlay effect similar to what's in the app for some continuity. Or, even if it's a page refresh, give it that white overlay effect (remove blue border-top, add 'X' which will remove modal or send user 'back')

I like the blue line (pace, I'm assuming), but specifically for loading the app. If we're going to use it on Stormpath pages and within the app, then we should consider implementing it on the marketing page?

[thinq4yourself]

This transition is a PITA. What is happening is that we are

1. Setting all URL routes in Express, which include /login and /register and served by the server, not the io website
2. When in the io site, Angular manages routing. To get the route to "break out" of the Angular routing (ngRoute) we need to change the URL in the window. There is an elegant way of doing this, but it broke and I haven't been able to fix...so we are using a temporary hack to change the window.location if route is /go or /start while in Agular app.
3. I can smooth this out as is by stuffing something in between header/footer. Best solution is to fox the Angular routing issue, but it is advanced Angular HTML5 routing engine stuff that took hours to debug and still not working. I had to move on.
4. Their is an Angular library for Stormpath, and logging into the app in the future will be via Angular. For now, we use the Express version.

I can remove the blue line in the login pages.

[yaboi]

Not directly as a cause of this issue, but just for the sake of past and future issues, too, is it worth converting to a non-angular marketing site?

[thinq4yourself]

Fixed in v1.9.17

Easy solution to this problem in Angular apps in $routeProvider, is to simply add this to your a tag:

href="..." target="_self"

instead of

data-ng-href="..."

$routeProvider get ignored this way

[thinq4yourself]

In response to @yaboi :+1:

In terms of direction of redoing site...

we have a lot invested in angular right now, and after 1.10 comes out (next), I'll be wiring up the admin pages to angular.

We also have a variant server running, so we can add static variant pages anytime now in writeon.server.

I'm a fan of creating one of these for WriteOn and will get itchy to do so when:

1. We have the content, images, messaging, and time
2. We have setup an A/B split test to test the new page vs existing angular
3. A migration plan from angular homepage to variant homepage
4. I have seen 3 or 4 different designs from you (if you are offering to do it), a in .variant pages'

Otherwise can bet I will be creating a kickass variant smart site for WO when next is out.