All pages in one index-file


#1

Hello,
Is there any way how to design your app in F7 V2, so all the pages are in the main index file as it was in V1? where you could have all pages, in divs with class=“page” and data-page=“xxx” atribute, in one file?
I am developing a web app to be used as captive portal splash page in my venue. I started with jquerymobile, then moved to framework7 v1 which was awesome!! But my app developed in v2, where all the pages are to be loaded into main-view from separate files by router, is not working in captive portal assistant (the retarded browser for wifi login) on android. I think that makin it again real Single Page Application could work. or maybe the javascript here is too heavy for the captive browsers?

Could anyone help please?
Thanks


#2

Hi, i dont really understand what you want. But did you try instead of url, use components? i use f7-vue to create SPA’s


#3

So it works in normal android Chrome?
V1 works in captive portal browser?

The Wifi login browser normally is the one that comes with the phone. Maybe you can test in that. Bad thing is, every phone maker has diff versions based on android/ios version. Must cater to the lowest I guess?

Please share some code on how you manage the pages


#4

I dont know what is a captive portal browser or what it does.
But here you have a layout of an app, wich loads all pages under main-view div. Notice that i use component in my routes.js

Here is my routes.js:
Screenshot_1

My app.vue layout:

Result:


#5

Thanks for answers, what i meant was one index.php file where all the pages are from the beginning in data-page divs. Yes i use php bc my server runs it and i know it. I use F7 mostly for design purposes. And i also(bc of the captive browser restrictions) need to use facebook php sdk for logging users. I tried to run in the browser one of the templates, and it ran fine. So i will try to tweak that instead of building my own from scratch and will report back with results. Actually im pretty new to javascript heavy frameworks so i probably used something in a bad way so it works fine in chrome, but not at all in retarded captive portal browser.


#6

OK Guys, found the cause of the problem,

IT WAS PUSHSTATE! when is enabled in app initialisation in app.js, or in html with data-push-state=“true” it just doesnt work in captive browser on android. I dunno why because in V1 you could easily use back button for navigation.

Is there any other way to use back button to go back in navigation instead of jumping outta app? or activate pushstate different way then mentioned above because i didnt find any other way in docs.

THANK YOU ALL