[lib.popup-controller] added [lib.room-controller] create() method [vue.wrapper] popup now works
This commit is contained in:
parent
1dd2db9d79
commit
e7ffcfc152
|
@ -18,7 +18,7 @@
|
||||||
<link type='text/css' rel='stylesheet' href='./css/pop-up.css'>
|
<link type='text/css' rel='stylesheet' href='./css/pop-up.css'>
|
||||||
|
|
||||||
<!-- FONT -->
|
<!-- FONT -->
|
||||||
<!-- <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro|Arvo|Exo+2" rel="stylesheet"> -->
|
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
|
||||||
|
|
||||||
|
|
||||||
<!-- BODY -->
|
<!-- BODY -->
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import {GlobalStore} from './lib/gstore'
|
import {GlobalStore} from './lib/gstore'
|
||||||
import VueRouter from 'vue-router'
|
import VueRouter from 'vue-router'
|
||||||
import routes from './routes'
|
import routes from './routes'
|
||||||
|
import {PopupController} from './lib/popup-controller'
|
||||||
import {ContentController} from './lib/content-controller'
|
import {ContentController} from './lib/content-controller'
|
||||||
import {RoomController} from './lib/room-controller'
|
import {RoomController} from './lib/room-controller'
|
||||||
import {ChannelController} from './lib/channel-controller'
|
import {ChannelController} from './lib/channel-controller'
|
||||||
|
@ -26,11 +27,14 @@ gs.set('router', new VueRouter({
|
||||||
|
|
||||||
/* (2) Main components
|
/* (2) Main components
|
||||||
---------------------------------------------------------*/
|
---------------------------------------------------------*/
|
||||||
/* (1) Initialize content management */
|
/* (1) Initialize popup management */
|
||||||
|
gs.set('popup', new PopupController());
|
||||||
|
|
||||||
|
/* (2) Initialize content management */
|
||||||
gs.set('content', new ContentController());
|
gs.set('content', new ContentController());
|
||||||
|
|
||||||
/* (2) Initialize rooms & room menu */
|
/* (3) Initialize rooms & room menu */
|
||||||
gs.set('room', new RoomController());
|
gs.set('room', new RoomController());
|
||||||
|
|
||||||
/* (3) Initialize channels & channel menu */
|
/* (4) Initialize channels & channel menu */
|
||||||
gs.set('channel', new ChannelController());
|
gs.set('channel', new ChannelController());
|
|
@ -0,0 +1,20 @@
|
||||||
|
export class PopupController{
|
||||||
|
|
||||||
|
/* (1) Construct default attributes
|
||||||
|
*
|
||||||
|
---------------------------------------------------------*/
|
||||||
|
constructor(){
|
||||||
|
|
||||||
|
/* (1) Popups */
|
||||||
|
this.croom = {
|
||||||
|
active: false,
|
||||||
|
type: 'text',
|
||||||
|
name: '',
|
||||||
|
reset(){ this.active = false; this.type = 'text'; this.name = ''; },
|
||||||
|
submit(){ gs.get.room.create(this.type, this.name) && this.reset(); }
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -147,5 +147,34 @@ export class RoomController{
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* (5) Create a new room
|
||||||
|
*
|
||||||
|
* @type<int> room type
|
||||||
|
* @name<String> room name
|
||||||
|
*
|
||||||
|
* @return created<bool> Whether the room has been created
|
||||||
|
*
|
||||||
|
---------------------------------------------------------*/
|
||||||
|
create(type=null, name=null){
|
||||||
|
|
||||||
|
/* (1) Manage invalid @type */
|
||||||
|
if( typeof type !== 'string' || this[type] == null )
|
||||||
|
return false;
|
||||||
|
|
||||||
|
/* (2) Manage invalid @name */
|
||||||
|
if( typeof name !== 'string' )
|
||||||
|
return false;
|
||||||
|
|
||||||
|
/* (3) Try to create room in API */
|
||||||
|
console.log(`POST /channel/${gs.get.content.cid}/room/${type}`);
|
||||||
|
|
||||||
|
/* (4) Add room -> update VueJS */
|
||||||
|
|
||||||
|
|
||||||
|
return true;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
|
@ -17,7 +17,7 @@
|
||||||
@click='rooms.visible=!rooms.visible'>
|
@click='rooms.visible=!rooms.visible'>
|
||||||
{{ type }} <span>rooms</span>
|
{{ type }} <span>rooms</span>
|
||||||
</div>
|
</div>
|
||||||
<div class='add' data-title='Create channel' @click='gs.room.create()'></div>
|
<div class='add' @click='gs.popup.croom.active=true' data-title='Create channel'></div>
|
||||||
<ul>
|
<ul>
|
||||||
<li v-for='r in rooms.list'
|
<li v-for='r in rooms.list'
|
||||||
:class='rooms.current==r.id?`active`:``'
|
:class='rooms.current==r.id?`active`:``'
|
||||||
|
|
|
@ -14,23 +14,21 @@
|
||||||
<router-view></router-view>
|
<router-view></router-view>
|
||||||
|
|
||||||
<!-- Pop-up -->
|
<!-- Pop-up -->
|
||||||
<div class='popup'>
|
<div class='popup' v-show='gs.popup.croom.active'>
|
||||||
<span class='header'>Create text channel</span>
|
<span class='header'>Create {{ gs.popup.croom.type }} channel</span>
|
||||||
|
|
||||||
<span class='body'>
|
<span class='body'>
|
||||||
<label for='channel_name'>Channel Name</label>
|
<label for='channel_name'>Channel Name</label>
|
||||||
<input type='text' name='channel_name'>
|
<input type='text' name='channel_name' v-model='gs.popup.croom.name'>
|
||||||
|
|
||||||
<label for='channel_name'>Channel Type</label>
|
<label for='channel_name'>Channel Type</label>
|
||||||
<div class='select'>
|
<span class='select-box' @click='gs.popup.croom.type=`text`' :data-selected='gs.popup.croom.type==`text`?1:0' data-type='text'>Text Channel</span>
|
||||||
<span class='select-box' @click='selected=0' :data-selected='selected==0?1:0' data-type='text'>Text Channel</span>
|
<span class='select-box' @click='gs.popup.croom.type=`voice`' :data-selected='gs.popup.croom.type==`voice`?1:0' data-type='voice'>Voice Channel</span>
|
||||||
<span class='select-box' @click='selected=1' :data-selected='selected==1?1:0' data-type='voice'>Voice Channel</span>
|
|
||||||
</div>
|
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class='footer'>
|
<span class='footer'>
|
||||||
<button>Cancel</button>
|
<button @click='gs.popup.croom.reset()'>Cancel</button>
|
||||||
<button>Create Channel</button>
|
<button @click='gs.popup.croom.submit()'>Create Channel</button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -46,7 +44,7 @@
|
||||||
|
|
||||||
name: 'wrapper-',
|
name: 'wrapper-',
|
||||||
|
|
||||||
data(){ return { gs: gs.get, selected: 1}; },
|
data(){ return { gs: gs.get }; },
|
||||||
|
|
||||||
components: {
|
components: {
|
||||||
'MenuComp': menu_vue,
|
'MenuComp': menu_vue,
|
||||||
|
|
Loading…
Reference in New Issue