I think the problem with this working when the app starts is that the “home” page is already displayed when the framework7 code is loaded (it’s loaded at the bottom in kitchen sink). It seems as though the async() code simply never gets called on startup but it seems to work fine when returning home from any other page.
I tried loading the framework7 code first but that was a bust… so now I’ll try to implement @nolimits4web’s method as well.
I added the code that @nolimits4web suggested and that didn’t work as I still get the same home screen. I cut kitchen-sink (core) back to just a few relevant pages and posted the project on github with all the files I’m including (jquery and a few dummy files I’ve written). Hopefully one of you can tell me what I’m doing wrong.
I will try to take a look tonight and see if I can help you.
@pvtallulah thanks for that but, at this point, I’m suspecting a bug.
At the end of the .view .view-main there’s a ‘data-url=’ and what ever is in that string is what gets loaded first no matter what startURL or async() is specified. If you remove data-url from the div then absolutely nothing gets loaded.
Here’s what I know:
Unless, there’s a bug in my code, which I admit is a real possibility, this functionality as you and Vladimir outlined early on, is broken.
Please post whole related HTML and JavaScript code: your initial views layout, your app and views init
about 5 posts back on Dec 20 at 5:59p I provided a link to a git that has everything (I figured that would be easier).
You have both async and url on your route, only one at a time can be used, no sense to use both
There is no such url app parameter
It is not supported because there is no sense to load something just load then something different. There is route’s beforeEnter hooks for this case to prevent page loadings
You have both
asyncandurlon your route, only one at a time can be used, no sense to use both
Doesn’t matter. Doesn’t work either way.
There is no such
urlapp parameter
StartPage/StartURL is a variable as you suggested. Variable gets ignored as does hard coding a path or url
It is not supported because there is no sense to load something just load then something different. There is route’s beforeEnter hooks for this case to prevent page loadings
If async only gets called when returning to ‘/’ and not before ‘/’ is loaded then there needs to be some mechanism to override this on the first pass.
I spent a lot of time trying to figure this out, I’ve tried all I can find to try and tried your and @pvtallulah’s suggestions. I’ve read the docs and scanned the forums. If it doesn’t work then please tell me. If it does work then please show me how to make it work.
just test your code,
the only thing i did was comment the url line on route
{
path: '/',
// url: './pages/home.html',
}
then, every time async is called, at ferst load, going back also.
i dont understand your problem.
i test it on chrome
Taking the raw kitchen-sink project and making the following change to the end of the app.js file like this:
// Dom7
var $ = Dom7;
// Theme
var theme = 'auto';
if (document.location.search.indexOf('theme=') >= 0) {
theme = document.location.search.split('theme=')[1].split('&')[0];
}
// Init App
var app = new Framework7({
id: 'io.framework7.testapp',
root: '#app',
theme: theme,
data: function () {
return {
user: {
firstName: 'John',
lastName: 'Doe',
},
};
},
methods: {
helloWorld: function () {
app.dialog.alert('Hello World!');
},
},
routes: routes,
popup: {
closeOnEscape: true,
},
sheet: {
closeOnEscape: true,
},
popover: {
closeOnEscape: true,
},
actions: {
closeOnEscape: true,
},
vi: {
placementId: 'pltd4o7ibb9rc653x14',
},
});
var startUrl = '/action-sheet/';
var wasLoggedIn = false;
var isLoggedIn = false;
if (wasLoggedIn) startUrl = '/accordion/';
if (isLoggedIn) startUrl = '/';
//init view
var mainView = app.views.create('.view-main', {
// specify which route to load on view init
url: startUrl
});
Does not work. If you set a breakpoint on the first if statement, when the debugger breaks the default page is already loaded. Setting the view like I did does not work and since (it certainly seems to me) I need to wait on app to be initialized before I use it, this this would be the correct way.
To make this to work:
var startUrl = '/action-sheet/';
var wasLoggedIn = false;
var isLoggedIn = false;
if (wasLoggedIn) startUrl = '/accordion/';
if (isLoggedIn) startUrl = '/';
//init view
var mainView = app.views.create('.view-main', {
// specify which route to load on view init
url: startUrl
});
as i stated above it is required to:
view-init class from main view in index.htmldata- attributes from main view in index.htmlHere is a working git that is fully documented and works perfectly.
(Once you actually stop trying to use resolve, life gets a whole lot easier!)
Thanks for all your help! Now to get font-awesome to work! 
Will this open the index.html for a short while or will it take straight to the other html pages based on code logic?
@Karanveer_Singh I ended up going to the following method:
// Index page
{
path: '/',
name: 'home',
on: {
pageBeforeIn: () => {console.log("home page init - from routes"); }
},
redirect: function (route, resolve, reject) {
if (appInfo.firstTime == true)
{
// new user so welcome them
console.log("rerouting to welcome screen");
$$('.navbar').hide();
$$('.toolbar-bottom').hide();
appInfo.startPage = '/welcome/';
resolve(appInfo.startPage);
}
else if(userInfo.state == false)
{
// not logged in but has been
console.log("rerouting to signin/welcome back screen");
$$('.navbar').hide();
$$('.toolbar-bottom').hide();
appInfo.startPage = '/signin/';
resolve(appInfo.startPage);
}
else
{
// just doing normal stuff here
console.log("rerouting to actual home page");
StatusBar.show();
$$('.navbar').show();
$$('.toolbar-bottom').show();
appInfo.startPage = '/home/';
resolve(appInfo.startPage);
}
}
},
It never flashes the index.html page and always loads the appropriate page based on the conditions I test for.
I tried it. But, it doesn’t log any of these lines. Neither pageBeforeIn nor inside redirect function, even if I put the console line before the logic. What could I be doing wrong?
You probably still have the home page in your index.html… you have to strip all that out.
Mine looks like this:
<div id="main" class="view view-main view-init safe-areas" data-master-detail-breakpoint="800" data-url="/">
so, i checked the latest documentation and made some changes here and there and it has worked. Need to implement the logic yet, but I think it should be doable now. This worked
If you’re using the git code, I never could get that to work correctly… I need to update the git code with the method I sent you a few posts back.
(and yes, I think that’s an F7 bug too (several actually) but I’m sure Vladimir will get too it.)
@Karanveer_Singh The git code is updated. I changed the old method to the one I posted on March 9th AND I removed the transition as that too creates problems. All changes are in the routes.js. This is working in two code bases.