[main.js] now asynchronous page data loading -> each page script is a Promise() that must success before calling next() on VueRouter to load the according Vue

parcel/main.js

@@ -12,7 +12,7 @@ gs.get.router.beforeEach((to, from, next) => {
 
 	// {1} Ignore null name //
 	if( to.name == null )
-		next();
+		return next();
 
 	// {2} Get appropriate page location //
 	let auth_folder = (gs.get.authed) ? 'auth' : 'noauth';
@@ -21,14 +21,16 @@ gs.get.router.beforeEach((to, from, next) => {
 
 	// {3} Load page script //
 	if( fullpath === 'noauth/login')
-		import('./page/noauth/login.js').then(next);
+		return require('./page/noauth/login.js').default.then(next);
-	else if( fullpath === 'noauth/register')
+
-		import('./page/noauth/register.js').then(next);
+	if( fullpath === 'noauth/register')
-	else if( fullpath === 'auth/channel')
+		return require('./page/noauth/register.js').default.then(next);
-		import('./page/auth/channel.js').then(next);
+
+	if( fullpath === 'auth/channel')
+		return require('./page/auth/channel.js').default.then(next);
 
 	// {4} Let VueRouter do the magic //
-	next();
+	// next();
 
 });
 

parcel/page/auth/channel.js

@@ -3,25 +3,31 @@ import ContentController     from '../../lib/content-controller'
 import RoomController        from '../../lib/room-controller'
 import ChannelController     from '../../lib/channel-controller'
 
-/* (1) Channel data gathering
+export default new Promise( (res, rej) => {
----------------------------------------------------------*/
+
-/* (1) Store route params */
+	/* (1) Channel data gathering
-window.initial_link = gs.get.router.history.current.params.link;
+	---------------------------------------------------------*/
-console.log(`[channel.URL] ${initial_link}`);
+	/* (1) Store route params */
+	window.initial_link = gs.get.router.history.current.params.link;
+	console.log(`[channel.URL] ${initial_link}`);
 
 
 
-/* (2) Main components
+	/* (2) Main components
----------------------------------------------------------*/
+	---------------------------------------------------------*/
-/* (1) Initialize popup management */
+	/* (1) Initialize popup management */
-gs.set('popup', new PopupController());
+	gs.set('popup', new PopupController());
 
-/* (2) Initialize content management */
+	/* (2) Initialize content management */
-gs.set('content', new ContentController());
+	gs.set('content', new ContentController());
 
-/* (3) Initialize rooms & room menu */
+	/* (3) Initialize rooms & room menu */
-gs.set('room', new RoomController());
+	gs.set('room', new RoomController());
 
-/* (4) Initialize channels & channel menu */
+	/* (4) Initialize channels & channel menu */
-gs.set('channel', new ChannelController());
+	gs.set('channel', new ChannelController());
-gs.get.channel.fetch(); // fetch at load time
+	gs.get.channel.fetch(); // fetch at load time
+
+	res();
+
+});

parcel/page/noauth/login.js

@@ -1,7 +1,9 @@
-/* (1) Initialise
+export default new Promise( (res, rej) => {
----------------------------------------------------------*/
+
-/* (1) Default data structure */
+	/* (1) Initialise
-gs.set('login', {
+	---------------------------------------------------------*/
+	/* (1) Default data structure */
+	gs.set('login', {
 		// fields
 		username: new FieldValidator('basic-name', ''),
 		password: new FieldValidator('password', ''),
@@ -17,15 +19,15 @@ gs.set('login', {
 			press_enter(){}
 		}
 
-});
+	});
 
 
 
 
-/* (2) Login attempt
+	/* (2) Login attempt
-*
+	*
----------------------------------------------------------*/
+	---------------------------------------------------------*/
-gs.get.login.func.login = function(){
+	gs.get.login.func.login = function(){
 
 		/* (1) Cache fields' values */
 		let username = this.username.mutable;
@@ -55,7 +57,7 @@ gs.get.login.func.login = function(){
 
 		}.bind(this), encodeURI(`${username}:${password}`));
 
-}.bind(gs.get.login);
+	}.bind(gs.get.login);
 
 
 
@@ -64,13 +66,18 @@ gs.get.login.func.login = function(){
 
 
 
-/* (4) Manage pressing on enter
+	/* (4) Manage pressing on enter
-*
+	*
----------------------------------------------------------*/
+	---------------------------------------------------------*/
-gs.get.login.func.press_enter = function(e){
+	gs.get.login.func.press_enter = function(e){
 
 		// if enter -> launch login
 		if( e.keyCode === 13 )
 			this.func.login();
 
-}.bind(gs.get.login);
+	}.bind(gs.get.login);
+
+
+	res();
+
+});

parcel/page/noauth/register.js

@@ -1,7 +1,9 @@
-/* (1) Initialise
+export default new Promise( (res, rej) => {
----------------------------------------------------------*/
+
-/* (1) Default data structure */
+	/* (1) Initialise
-gs.set('register', {
+	---------------------------------------------------------*/
+	/* (1) Default data structure */
+	gs.set('register', {
 		// fields
 		mail:     new FieldValidator('bypass', ''),
 		username: new FieldValidator('basic-name', ''),
@@ -13,7 +15,7 @@ gs.set('register', {
 			press_enter(){}
 		}
 
-});
+	});
 
 
 
@@ -21,10 +23,10 @@ gs.set('register', {
 
 
 
-/* (2) Login attempt
+	/* (2) Login attempt
-*
+	*
----------------------------------------------------------*/
+	---------------------------------------------------------*/
-gs.get.register.func.register = function(){
+	gs.get.register.func.register = function(){
 
 		/* (1) Cache fields' values */
 		let mail     = this.mail.mutable;
@@ -62,7 +64,7 @@ gs.get.register.func.register = function(){
 		});
 
 
-}.bind(gs.get.register);
+	}.bind(gs.get.register);
 
 
 
@@ -71,13 +73,18 @@ gs.get.register.func.register = function(){
 
 
 
-/* (4) Manage pressing on enter
+	/* (4) Manage pressing on enter
-*
+	*
----------------------------------------------------------*/
+	---------------------------------------------------------*/
-gs.get.register.func.press_enter = function(e){
+	gs.get.register.func.press_enter = function(e){
 
 		// if enter -> launch register
 		if( e.keyCode === 13 )
 			this.func.register();
 
 	}.bind(gs.get.register);
+
+
+	res();
+
+});