[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
This commit is contained in:
xdrm-brackets
parent
51875ca4e8
commit
9150874287
|
|
@ -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);
|
||||
else if( fullpath === 'noauth/register')
|
||||
import('./page/noauth/register.js').then(next);
|
||||
else if( fullpath === 'auth/channel')
|
||||
import('./page/auth/channel.js').then(next);
|
||||
return require('./page/noauth/login.js').default.then(next);
|
||||
|
||||
if( fullpath === 'noauth/register')
|
||||
return require('./page/noauth/register.js').default.then(next);
|
||||
|
||||
if( fullpath === 'auth/channel')
|
||||
return require('./page/auth/channel.js').default.then(next);
|
||||
|
||||
// {4} Let VueRouter do the magic //
|
||||
next();
|
||||
// next();
|
||||
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -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
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Store route params */
|
||||
window.initial_link = gs.get.router.history.current.params.link;
|
||||
console.log(`[channel.URL] ${initial_link}`);
|
||||
export default new Promise( (res, rej) => {
|
||||
|
||||
/* (1) Channel data gathering
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Store route params */
|
||||
window.initial_link = gs.get.router.history.current.params.link;
|
||||
console.log(`[channel.URL] ${initial_link}`);
|
||||
|
||||
|
||||
|
||||
/* (2) Main components
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Initialize popup management */
|
||||
gs.set('popup', new PopupController());
|
||||
/* (2) Main components
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Initialize popup management */
|
||||
gs.set('popup', new PopupController());
|
||||
|
||||
/* (2) Initialize content management */
|
||||
gs.set('content', new ContentController());
|
||||
/* (2) Initialize content management */
|
||||
gs.set('content', new ContentController());
|
||||
|
||||
/* (3) Initialize rooms & room menu */
|
||||
gs.set('room', new RoomController());
|
||||
/* (3) Initialize rooms & room menu */
|
||||
gs.set('room', new RoomController());
|
||||
|
||||
/* (4) Initialize channels & channel menu */
|
||||
gs.set('channel', new ChannelController());
|
||||
gs.get.channel.fetch(); // fetch at load time
|
||||
/* (4) Initialize channels & channel menu */
|
||||
gs.set('channel', new ChannelController());
|
||||
gs.get.channel.fetch(); // fetch at load time
|
||||
|
||||
res();
|
||||
|
||||
});
|
||||
|
|
@ -1,76 +1,83 @@
|
|||
/* (1) Initialise
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Default data structure */
|
||||
gs.set('login', {
|
||||
// fields
|
||||
username: new FieldValidator('basic-name', ''),
|
||||
password: new FieldValidator('password', ''),
|
||||
export default new Promise( (res, rej) => {
|
||||
|
||||
// login failed
|
||||
failed: false,
|
||||
/* (1) Initialise
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Default data structure */
|
||||
gs.set('login', {
|
||||
// fields
|
||||
username: new FieldValidator('basic-name', ''),
|
||||
password: new FieldValidator('password', ''),
|
||||
|
||||
// login failed
|
||||
failed: false,
|
||||
|
||||
|
||||
// functions
|
||||
func: {
|
||||
login(){},
|
||||
forgot_pass(){},
|
||||
press_enter(){}
|
||||
}
|
||||
// functions
|
||||
func: {
|
||||
login(){},
|
||||
forgot_pass(){},
|
||||
press_enter(){}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
/* (2) Login attempt
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.login.func.login = function(){
|
||||
|
||||
/* (1) Cache fields' values */
|
||||
let username = this.username.mutable;
|
||||
let password = this.password.mutable;
|
||||
|
||||
/* (2) Manage errors */
|
||||
if( !this.username.is_valid() )
|
||||
return false;
|
||||
|
||||
if( !this.password.is_valid() )
|
||||
return false;
|
||||
|
||||
/* (3) API bindings */
|
||||
api.call('GET /user/token', {}, function(rs){
|
||||
|
||||
// manage error
|
||||
if( rs.error !== 0 || rs.token == null || rs.uid == null )
|
||||
return this.failed = true;
|
||||
|
||||
// store TOKEN + user data
|
||||
auth.token = rs.token;
|
||||
auth.user = {
|
||||
uid: rs.uid,
|
||||
username: username
|
||||
};
|
||||
document.location = '';
|
||||
|
||||
}.bind(this), encodeURI(`${username}:${password}`));
|
||||
|
||||
}.bind(gs.get.login);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* (4) Manage pressing on enter
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.login.func.press_enter = function(e){
|
||||
|
||||
// if enter -> launch login
|
||||
if( e.keyCode === 13 )
|
||||
this.func.login();
|
||||
|
||||
}.bind(gs.get.login);
|
||||
|
||||
|
||||
res();
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
/* (2) Login attempt
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.login.func.login = function(){
|
||||
|
||||
/* (1) Cache fields' values */
|
||||
let username = this.username.mutable;
|
||||
let password = this.password.mutable;
|
||||
|
||||
/* (2) Manage errors */
|
||||
if( !this.username.is_valid() )
|
||||
return false;
|
||||
|
||||
if( !this.password.is_valid() )
|
||||
return false;
|
||||
|
||||
/* (3) API bindings */
|
||||
api.call('GET /user/token', {}, function(rs){
|
||||
|
||||
// manage error
|
||||
if( rs.error !== 0 || rs.token == null || rs.uid == null )
|
||||
return this.failed = true;
|
||||
|
||||
// store TOKEN + user data
|
||||
auth.token = rs.token;
|
||||
auth.user = {
|
||||
uid: rs.uid,
|
||||
username: username
|
||||
};
|
||||
document.location = '';
|
||||
|
||||
}.bind(this), encodeURI(`${username}:${password}`));
|
||||
|
||||
}.bind(gs.get.login);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* (4) Manage pressing on enter
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.login.func.press_enter = function(e){
|
||||
|
||||
// if enter -> launch login
|
||||
if( e.keyCode === 13 )
|
||||
this.func.login();
|
||||
|
||||
}.bind(gs.get.login);
|
||||
|
|
@ -1,83 +1,90 @@
|
|||
/* (1) Initialise
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Default data structure */
|
||||
gs.set('register', {
|
||||
// fields
|
||||
mail: new FieldValidator('bypass', ''),
|
||||
username: new FieldValidator('basic-name', ''),
|
||||
password: new FieldValidator('password', ''),
|
||||
export default new Promise( (res, rej) => {
|
||||
|
||||
// functions
|
||||
func: {
|
||||
register(){},
|
||||
press_enter(){}
|
||||
}
|
||||
/* (1) Initialise
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Default data structure */
|
||||
gs.set('register', {
|
||||
// fields
|
||||
mail: new FieldValidator('bypass', ''),
|
||||
username: new FieldValidator('basic-name', ''),
|
||||
password: new FieldValidator('password', ''),
|
||||
|
||||
});
|
||||
// functions
|
||||
func: {
|
||||
register(){},
|
||||
press_enter(){}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* (2) Login attempt
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.register.func.register = function(){
|
||||
|
||||
/* (1) Cache fields' values */
|
||||
let mail = this.mail.mutable;
|
||||
let username = this.username.mutable;
|
||||
let password = this.password.mutable;
|
||||
|
||||
/* (2) Manage errors */
|
||||
// mail error
|
||||
if( !this.mail.is_valid() )
|
||||
return false;
|
||||
|
||||
// username error
|
||||
if( !this.username.is_valid() )
|
||||
return false;
|
||||
|
||||
// password error
|
||||
if( !this.password.is_valid() )
|
||||
return false;
|
||||
|
||||
/* (3) API bindings */
|
||||
api.call('POST /user', { username: username, password: password }, function(rs){
|
||||
|
||||
// manage error
|
||||
if( rs.error !== 0 || rs.uid == null || rs.token == null )
|
||||
return gs.get.router.push('register');
|
||||
|
||||
// manage login
|
||||
auth.token = rs.token;
|
||||
auth.user = {
|
||||
uid: rs.uid,
|
||||
username: username
|
||||
};
|
||||
|
||||
document.location = '';
|
||||
});
|
||||
|
||||
|
||||
}.bind(gs.get.register);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* (2) Login attempt
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.register.func.register = function(){
|
||||
|
||||
/* (1) Cache fields' values */
|
||||
let mail = this.mail.mutable;
|
||||
let username = this.username.mutable;
|
||||
let password = this.password.mutable;
|
||||
|
||||
/* (2) Manage errors */
|
||||
// mail error
|
||||
if( !this.mail.is_valid() )
|
||||
return false;
|
||||
|
||||
/* (4) Manage pressing on enter
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.register.func.press_enter = function(e){
|
||||
// username error
|
||||
if( !this.username.is_valid() )
|
||||
return false;
|
||||
|
||||
// password error
|
||||
if( !this.password.is_valid() )
|
||||
return false;
|
||||
|
||||
/* (3) API bindings */
|
||||
api.call('POST /user', { username: username, password: password }, function(rs){
|
||||
|
||||
// manage error
|
||||
if( rs.error !== 0 || rs.uid == null || rs.token == null )
|
||||
return gs.get.router.push('register');
|
||||
|
||||
// manage login
|
||||
auth.token = rs.token;
|
||||
auth.user = {
|
||||
uid: rs.uid,
|
||||
username: username
|
||||
};
|
||||
|
||||
document.location = '';
|
||||
});
|
||||
|
||||
// if enter -> launch register
|
||||
if( e.keyCode === 13 )
|
||||
this.func.register();
|
||||
|
||||
}.bind(gs.get.register);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* (4) Manage pressing on enter
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.register.func.press_enter = function(e){
|
||||
|
||||
// if enter -> launch register
|
||||
if( e.keyCode === 13 )
|
||||
this.func.register();
|
||||
|
||||
}.bind(gs.get.register);
|
||||
|
||||
|
||||
res();
|
||||
|
||||
});
|
||||
Loading…
Reference in New Issue