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.
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:
remove view-init class from main view in index.html
remove all data- attributes from main view in index.html
remove internal/inline/default page from main view in index.html
// 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?
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
@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.