[lib.*-controller] instead of [init.*]
This commit is contained in:
parent
d7c9711593
commit
2d6b5c7378
|
@ -1,6 +1,9 @@
|
|||
import {GlobalStore} from './lib/gstore'
|
||||
import VueRouter from 'vue-router'
|
||||
import routes from './routes'
|
||||
import {GlobalStore} from './lib/gstore'
|
||||
import VueRouter from 'vue-router'
|
||||
import routes from './routes'
|
||||
import {ContentController} from './lib/content-controller'
|
||||
import {RoomController} from './lib/room-controller'
|
||||
import {ChannelController} from './lib/channel-controller'
|
||||
|
||||
|
||||
window.gs = new GlobalStore();
|
||||
|
@ -23,8 +26,11 @@ gs.set('router', new VueRouter({
|
|||
|
||||
/* (2) Main components
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Initialize rooms & room menu */
|
||||
require('./init/rooms.js');
|
||||
/* (1) Initialize content management */
|
||||
gs.set('content', new ContentController());
|
||||
|
||||
/* (2) Initialize channels & channel menu */
|
||||
require('./init/channels.js');
|
||||
/* (2) Initialize rooms & room menu */
|
||||
gs.set('room', new RoomController());
|
||||
|
||||
/* (3) Initialize channels & channel menu */
|
||||
gs.set('channel', new ChannelController());
|
|
@ -1,159 +0,0 @@
|
|||
/* (1) Initialisation
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Init @channel object */
|
||||
gs.set('channel', {});
|
||||
|
||||
/* (2) Set default active channel */
|
||||
gs.get.channel.current = null;
|
||||
|
||||
/* (3) Initialize channel list */
|
||||
gs.get.channel.list = [
|
||||
{ id: -1, link: 'me', label: 'My data', sub: '0 online', icon: 'group', room: [] },
|
||||
{ id: -2, link: null, label: 'add', sub: null, icon: 'add', room: [], add: 1 }
|
||||
];
|
||||
|
||||
/* (4) Initialize vue-router channel navigation */
|
||||
gs.get.channel.nav = function(){};
|
||||
|
||||
/* (5) Initialize adding fetched channel */
|
||||
gs.get.channel.dump = function(){};
|
||||
|
||||
/* (6) Initialize accessor for channel data */
|
||||
gs.get.channel.get = function(){};
|
||||
|
||||
|
||||
|
||||
/* (2) Channel navigation
|
||||
*
|
||||
* @channel_id<int> Channel id (NULL uses get())
|
||||
*
|
||||
* @return status<boolean> Whether the navigation has been successful
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.channel.nav = function(channel_id=null){
|
||||
console.log(`channel.nav(${channel_id})`);
|
||||
|
||||
/* (1) Get channel data */
|
||||
var channel = this.get(channel_id);
|
||||
|
||||
/* (2) Abort if same channel */
|
||||
// if( gs.get.router.history.current.params.link === channel.link )
|
||||
// return false;
|
||||
|
||||
/* (3) Navigate vue-router */
|
||||
gs.get.router.push(`/channel/${channel.link}`);
|
||||
|
||||
/* (4) Load rooms */
|
||||
gs.get.rfunc.dump(channel.room);
|
||||
|
||||
/* (5) Default open first 'text' room */
|
||||
gs.get.rfunc.nav('text', gs.get.room.text.list[0].id);
|
||||
|
||||
/* (6) Update active element */
|
||||
this.current = channel.id;
|
||||
|
||||
/* (7) Log channel */
|
||||
console.log(`[channel.current] ${channel.link} (${channel.label})`);
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
|
||||
/* (3) Dump/Update channel data
|
||||
*
|
||||
* @channels<array> Channels data
|
||||
*
|
||||
* @return udpated<boolean> Whether channels have been updated
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.channel.dump = function(channels){
|
||||
console.log(`channel.dump([${channels instanceof Array?channels.length:0}])`);
|
||||
|
||||
/* (1) Check @channels type */
|
||||
if( !(channels instanceof Array) )
|
||||
return false;
|
||||
|
||||
/* (2) Store LAST item */
|
||||
let last_item = this.list.pop();
|
||||
|
||||
/* (3) Clear list (except FIRST) */
|
||||
this.list.splice(1);
|
||||
|
||||
/* (4) Apply new channels */
|
||||
for(let c of channels)
|
||||
this.list.push(c);
|
||||
|
||||
/* (5) Restore LAST */
|
||||
this.list.push(last_item);
|
||||
|
||||
return true;
|
||||
|
||||
};
|
||||
|
||||
|
||||
/* (4) Get channel data
|
||||
*
|
||||
* @channel_id<int> Channel ID
|
||||
* NULL: current channel || from URL (and set current)
|
||||
*
|
||||
* @return channel<array> Channel data
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.channel.get = function(channel_id=null){
|
||||
// console.log(`channel.get(${channel_id})`);
|
||||
|
||||
if( channel_id === null ){
|
||||
|
||||
/* (1) Get @current channel
|
||||
---------------------------------------------------------*/
|
||||
/* (1) If @current is set */
|
||||
if( !isNaN(this.current) ){
|
||||
|
||||
/* (2) Return matching id in list */
|
||||
for( let c of this.list ){
|
||||
|
||||
if( c.id === this.current )
|
||||
return c; // exit point
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (2) Get from URL
|
||||
---------------------------------------------------------*/
|
||||
/* (1) If vue-router has @link param */
|
||||
if( gs.get.router.history.current.params.link ){
|
||||
|
||||
/* (2) Extract @link */
|
||||
let link = gs.get.router.history.current.params.link;
|
||||
|
||||
/* (3) Return matching link in list */
|
||||
for( let c of this.list ){
|
||||
|
||||
if( c.link === link ){
|
||||
|
||||
this.current = c.id; // set @current
|
||||
return c; // exit point
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (3) Get channel data
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Return channel matching id */
|
||||
for( let c of this.list )
|
||||
if( c.id === channel_id )
|
||||
return c; // exit point
|
||||
|
||||
/* (2) Return default: if ID not found */
|
||||
this.current = this.list[0].id;
|
||||
return this.list[0];
|
||||
|
||||
}
|
|
@ -1,154 +0,0 @@
|
|||
/* (1) Initialisation
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Init @room AVAILABLE types */
|
||||
gs.set('room', {
|
||||
text: { list: [], current: 0, visible: true },
|
||||
voice: { list: [], current: null, visible: true }
|
||||
});
|
||||
|
||||
/* (2) Init room functions */
|
||||
gs.set('rfunc', {});
|
||||
|
||||
/* (3) Initialize room navigation */
|
||||
gs.get.rfunc.open = function(){};
|
||||
|
||||
/* (4) Initialize adding fetched room */
|
||||
gs.get.rfunc.dump = function(){};
|
||||
|
||||
/* (5) Initialize accessor for room data */
|
||||
gs.get.rfunc.get = function(){};
|
||||
|
||||
|
||||
|
||||
/* (2) room navigation
|
||||
*
|
||||
* @type<int> room type
|
||||
* @id<int> room ID (NULL uses get())
|
||||
*
|
||||
* @return status<boolean> Whether the navigation has been successful
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.rfunc.nav = function(type=null, id=null){
|
||||
console.log(`room.nav(${type}, ${id})`);
|
||||
|
||||
/* (1) Try to get current room from id */
|
||||
let room = gs.get.rfunc.get(type, id);
|
||||
|
||||
/* (2) Manage invalid room */
|
||||
if( room == null )
|
||||
return false;
|
||||
|
||||
/* (3) Close last room */
|
||||
|
||||
/* (4) Open new room */
|
||||
|
||||
/* (5) Update @active room */
|
||||
this[type].current = room.id;
|
||||
|
||||
console.log(`[room.${type}.opened] ${room.name} (${room.id})`, room.id);
|
||||
|
||||
return true;
|
||||
|
||||
}.bind(gs.get.room);
|
||||
|
||||
|
||||
/* (3) Dump/Update room data (raw format -> tree structure)
|
||||
*
|
||||
* @rooms<array> rooms data (raw format)
|
||||
*
|
||||
* {raw_format}
|
||||
* [
|
||||
* { rid: <int>, type: 'text', name: <string> }
|
||||
* { rid: <int>, type: 'voice', name: <string> }
|
||||
* { rid: <int>, type: 'video', name: <string> }
|
||||
* ]
|
||||
*
|
||||
* @return udpated<boolean> Whether rooms have been updated
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.rfunc.dump = function(rooms){
|
||||
|
||||
console.log(`room.dump([${rooms instanceof Array?rooms.length:0}])`);
|
||||
|
||||
/* (1) Check @rooms type */
|
||||
if( !(rooms instanceof Array) )
|
||||
return false;
|
||||
|
||||
/* (2) Clear data */
|
||||
for( let type in this ){
|
||||
this[type].list = [];
|
||||
this[type].current = null;
|
||||
}
|
||||
|
||||
/* (3) Browse each room */
|
||||
for(let r of rooms){
|
||||
|
||||
// {1} Ignore: if not object //
|
||||
if( typeof r !== 'object' )
|
||||
continue;
|
||||
|
||||
// {2} Ignore: if missing field //
|
||||
if( isNaN(r.rid) || typeof r.type !== 'string' || typeof r.name !== 'string' )
|
||||
continue;
|
||||
|
||||
// {3} Ignore: not available type //
|
||||
if( this[r.type] == null )
|
||||
continue;
|
||||
|
||||
|
||||
this[r.type].list.push({ id: r.rid, name: r.name, type: r.type });
|
||||
}
|
||||
|
||||
return true;
|
||||
|
||||
}.bind(gs.get.room);
|
||||
|
||||
|
||||
/* (4) Get room data
|
||||
*
|
||||
* @type<int> room type
|
||||
* @id<int> room ID
|
||||
* NULL: current room || from URL (and set current)
|
||||
*
|
||||
* @return room<array> room data
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
gs.get.rfunc.get = function(type=null, id=null){
|
||||
console.log(`room.get(${type}, ${id})`);
|
||||
|
||||
/* (1) Manage invalid @type */
|
||||
if( typeof type !== 'string' || this[type] == null )
|
||||
return null;
|
||||
|
||||
/* (1) Get @current room: if id is null
|
||||
---------------------------------------------------------*/
|
||||
if( id === null ){
|
||||
|
||||
/* (1) If @current is set */
|
||||
if( !isNaN(this[type].current) ){
|
||||
|
||||
/* (2) Return matching id in list */
|
||||
for( let r of this[type].list ){
|
||||
|
||||
if( r.id === this[type].current )
|
||||
return r; // exit point
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (2) Get room data
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Return room matching id */
|
||||
for( let r of this[type].list )
|
||||
if( r.id === id )
|
||||
return r; // exit point
|
||||
|
||||
/* (2) Return default: if ID not found */
|
||||
this[type].current = null;
|
||||
return null;
|
||||
|
||||
}.bind(gs.get.room);
|
|
@ -0,0 +1,182 @@
|
|||
export class ChannelController{
|
||||
|
||||
/* (1) Construct default attributes
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
constructor(){
|
||||
|
||||
/* (1) Set default active channel */
|
||||
this.current = null;
|
||||
|
||||
/* (2) Initialize channel list */
|
||||
this.list = [
|
||||
{ id: -1, link: 'me', label: 'My data', sub: '0 online', icon: 'group', room: [] },
|
||||
{ id: -2, link: null, label: 'add', sub: null, icon: 'add', room: [], add: 1 }
|
||||
];
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (2) Channel navigation
|
||||
*
|
||||
* @channel_id<int> Channel id (NULL uses get())
|
||||
*
|
||||
* @return status<boolean> Whether the navigation has been successful
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
nav(channel_id=null){
|
||||
console.log(`channel.nav(${channel_id})`);
|
||||
|
||||
/* (1) Get channel data */
|
||||
var channel = this.get(channel_id);
|
||||
|
||||
/* (2) Try to load channel data */
|
||||
if( !this.load(channel.id) )
|
||||
return false;
|
||||
|
||||
/* (3) Navigate vue-router */
|
||||
gs.get.router.push(`/channel/${channel.link}`);
|
||||
|
||||
/* (4) Load rooms */
|
||||
gs.get.room.dump(channel.room);
|
||||
|
||||
/* (5) Default open first 'text' room */
|
||||
gs.get.room.nav('text', gs.get.room.text.list[0].id);
|
||||
|
||||
/* (6) Update active element */
|
||||
this.current = channel.id;
|
||||
|
||||
/* (7) Log channel */
|
||||
console.log(`[channel.current] ${channel.link} (${channel.label})`);
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
|
||||
/* (3) Dump/Update channel data
|
||||
*
|
||||
* @channels<array> Channels data
|
||||
*
|
||||
* @return udpated<boolean> Whether channels have been updated
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
dump(channels){
|
||||
console.log(`channel.dump([${channels instanceof Array?channels.length:0}])`);
|
||||
|
||||
/* (1) Check @channels type */
|
||||
if( !(channels instanceof Array) )
|
||||
return false;
|
||||
|
||||
/* (2) Store LAST item */
|
||||
let last_item = this.list.pop();
|
||||
|
||||
/* (3) Clear list (except FIRST) */
|
||||
this.list.splice(1);
|
||||
|
||||
/* (4) Apply new channels */
|
||||
for(let c of channels)
|
||||
this.list.push(c);
|
||||
|
||||
/* (5) Restore LAST */
|
||||
this.list.push(last_item);
|
||||
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (4) Get channel data
|
||||
*
|
||||
* @channel_id<int> Channel ID
|
||||
* NULL: current channel || from URL (and set current)
|
||||
*
|
||||
* @return channel<array> Channel data
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
get(channel_id=null){
|
||||
// console.log(`channel.get(${channel_id})`);
|
||||
|
||||
if( channel_id === null ){
|
||||
|
||||
/* (1) Get @current channel
|
||||
---------------------------------------------------------*/
|
||||
/* (1) If @current is set */
|
||||
if( !isNaN(this.current) ){
|
||||
|
||||
/* (2) Return matching id in list */
|
||||
for( let c of this.list ){
|
||||
|
||||
if( c.id === this.current )
|
||||
return c; // exit point
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (2) Get from URL
|
||||
---------------------------------------------------------*/
|
||||
/* (1) If vue-router has @link param */
|
||||
if( gs.get.router.history.current.params.link ){
|
||||
|
||||
/* (2) Extract @link */
|
||||
let link = gs.get.router.history.current.params.link;
|
||||
|
||||
/* (3) Return matching link in list */
|
||||
for( let c of this.list ){
|
||||
|
||||
if( c.link === link ){
|
||||
|
||||
this.current = c.id; // set @current
|
||||
return c; // exit point
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (3) Get channel data
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Return channel matching id */
|
||||
for( let c of this.list )
|
||||
if( c.id === channel_id )
|
||||
return c; // exit point
|
||||
|
||||
/* (2) Return default: if ID not found */
|
||||
this.current = this.list[0].id;
|
||||
return this.list[0];
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (5) Fetch channel data
|
||||
*
|
||||
* @channel_id<int> Channel ID
|
||||
*
|
||||
* @return fetched<bool> Whether channel data have been fetched
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
load(channel_id=null){
|
||||
console.log(`channel.load(${channel_id})`);
|
||||
|
||||
/* (1) Exit if invalid @channel_id */
|
||||
if( isNaN(channel_id) )
|
||||
return false;
|
||||
|
||||
/* (2) Call API to get data */
|
||||
setTimeout(() => {
|
||||
|
||||
let fetched = require('../mockup/api-channel-init.json');
|
||||
gs.get.main = fetched;
|
||||
|
||||
}, 500);
|
||||
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
}
|
|
@ -0,0 +1,22 @@
|
|||
export class ContentController{
|
||||
|
||||
/* (1) Construct default attributes
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
constructor(){
|
||||
|
||||
/* (1) Initialize content data */
|
||||
this.messages = [];
|
||||
this.users = [];
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (2) Getters
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
get cid(){ return gs.get.channel.current; }
|
||||
get rid(){ return gs.get.room.text.current; }
|
||||
|
||||
|
||||
}
|
|
@ -0,0 +1,150 @@
|
|||
export class RoomController{
|
||||
|
||||
|
||||
/* (1) Construct default attributes
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
constructor(){
|
||||
|
||||
/* (1) Init available @room sets */
|
||||
this.text = { list: [], current: 0, visible: true };
|
||||
this.voice = { list: [], current: null, visible: true };
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (2) room navigation
|
||||
*
|
||||
* @type<int> room type
|
||||
* @id<int> room ID (NULL uses get())
|
||||
*
|
||||
* @return status<boolean> Whether the navigation has been successful
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
nav(type=null, id=null){
|
||||
console.log(`room.nav(${type}, ${id})`);
|
||||
|
||||
/* (1) Try to get current room from id */
|
||||
let room = this.get(type, id);
|
||||
|
||||
/* (2) Manage invalid room */
|
||||
if( room == null )
|
||||
return false;
|
||||
|
||||
/* (3) Close last room */
|
||||
|
||||
/* (4) Open new room */
|
||||
|
||||
/* (5) Update @active room */
|
||||
this[type].current = room.id;
|
||||
|
||||
console.log(`[room.${type}.opened] ${room.name} (${room.id})`, room.id);
|
||||
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (3) Dump/Update room data (raw format -> tree structure)
|
||||
*
|
||||
* @rooms<array> rooms data (raw format)
|
||||
*
|
||||
* {raw_format}
|
||||
* [
|
||||
* { rid: <int>, type: 'text', name: <string> }
|
||||
* { rid: <int>, type: 'voice', name: <string> }
|
||||
* { rid: <int>, type: 'video', name: <string> }
|
||||
* ]
|
||||
*
|
||||
* @return udpated<boolean> Whether rooms have been updated
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
dump(rooms){
|
||||
|
||||
console.log(`room.dump([${rooms instanceof Array?rooms.length:0}])`);
|
||||
|
||||
/* (1) Check @rooms type */
|
||||
if( !(rooms instanceof Array) )
|
||||
return false;
|
||||
|
||||
/* (2) Clear data */
|
||||
for( let type in this ){
|
||||
this[type].list = [];
|
||||
this[type].current = null;
|
||||
}
|
||||
|
||||
/* (3) Browse each room */
|
||||
for(let r of rooms){
|
||||
|
||||
// {1} Ignore: if not object //
|
||||
if( typeof r !== 'object' )
|
||||
continue;
|
||||
|
||||
// {2} Ignore: if missing field //
|
||||
if( isNaN(r.rid) || typeof r.type !== 'string' || typeof r.name !== 'string' )
|
||||
continue;
|
||||
|
||||
// {3} Ignore: not available type //
|
||||
if( this[r.type] == null )
|
||||
continue;
|
||||
|
||||
|
||||
this[r.type].list.push({ id: r.rid, name: r.name, type: r.type });
|
||||
}
|
||||
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (4) Get room data
|
||||
*
|
||||
* @type<int> room type
|
||||
* @id<int> room ID
|
||||
* NULL: current room || from URL (and set current)
|
||||
*
|
||||
* @return room<array> room data
|
||||
*
|
||||
---------------------------------------------------------*/
|
||||
get(type=null, id=null){
|
||||
console.log(`room.get(${type}, ${id})`);
|
||||
|
||||
/* (1) Manage invalid @type */
|
||||
if( typeof type !== 'string' || this[type] == null )
|
||||
return null;
|
||||
|
||||
/* (1) Get @current room: if id is null
|
||||
---------------------------------------------------------*/
|
||||
if( id === null ){
|
||||
|
||||
/* (1) If @current is set */
|
||||
if( !isNaN(this[type].current) ){
|
||||
|
||||
/* (2) Return matching id in list */
|
||||
for( let r of this[type].list ){
|
||||
|
||||
if( r.id === this[type].current )
|
||||
return r; // exit point
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* (2) Get room data
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Return room matching id */
|
||||
for( let r of this[type].list )
|
||||
if( r.id === id )
|
||||
return r; // exit point
|
||||
|
||||
/* (2) Return default: if ID not found */
|
||||
this[type].current = null;
|
||||
return null;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
|
@ -34,7 +34,7 @@ console.log(`[channel.URL] ${initial_link}`);
|
|||
setTimeout(() => {
|
||||
|
||||
/* (2) Fetch data */
|
||||
gs.get.channel.dump( require('./mockup/channels.json') );
|
||||
gs.get.channel.dump( require('./mockup/api-channels.json') );
|
||||
|
||||
/* (3) Find if @link matches */
|
||||
var redirect_id = null;
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div class='container'>
|
||||
|
||||
<div class='header'>
|
||||
<div class='title'>{{ gs.rfunc.get('text') ? gs.rfunc.get('text').name : '?' }}</div>
|
||||
<div class='title'>{{ gs.room.get('text') ? gs.room.get('text').name : '?' }}</div>
|
||||
</div>
|
||||
|
||||
<div class='body'>
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
<li v-for='r in rooms.list'
|
||||
:class='rooms.current==r.id?`active`:``'
|
||||
:data-type='r.type'
|
||||
@click='gs.rfunc.nav(r.type, r.id)'>{{ r.name }}</li>
|
||||
@click='gs.room.nav(r.type, r.id)'>{{ r.name }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in New Issue