From 4bc5e5123fca22d6bce5f93291801b85e0d8ad77 Mon Sep 17 00:00:00 2001 From: xdrm-brackets Date: Thu, 22 Mar 2018 00:53:32 +0100 Subject: [PATCH] [vue.channel] container header title [mockup.channel-init] created [init.channels] manage open() to open a room and apply 'active' state only if success --- webpack/init/channels.js | 24 ++++++++++++----- webpack/mockup/channel-init.json | 45 ++++++++++++++++++++++++++++++++ webpack/mockup/channels.json | 4 +-- webpack/scss/container.scss | 23 +++++++++++++++- webpack/scss/layout.scss | 2 +- webpack/vue/channel.vue | 11 ++++---- webpack/vue/dialog.vue | 4 +-- webpack/vue/wrapper.vue | 8 +----- 8 files changed, 97 insertions(+), 24 deletions(-) create mode 100644 webpack/mockup/channel-init.json diff --git a/webpack/init/channels.js b/webpack/init/channels.js index b7111db..0175bad 100644 --- a/webpack/init/channels.js +++ b/webpack/init/channels.js @@ -21,7 +21,7 @@ gs.get.channel.dump = function(){}; /* (6) Initialize accessor for channel data */ gs.get.channel.get = function(){}; -/* (7) Initialize local channel opener */ +/* (7) Initialize room loader */ gs.get.channel.open = function(){}; @@ -155,24 +155,36 @@ gs.get.channel.get = function(channel_id=null){ -/* (5) Open a local channel +/* (5) Open a room * -* @type Local channel type (text, voice, video) -* @id Local channel id +* @type Room type (text, voice, video) +* @id Room id * ---------------------------------------------------------*/ gs.get.channel.open = function(type=null, id=null){ - let error = function(type){ this.get().local[type].active = null; }.bind(this, type); + let error = function(type){ this.get().room[type].active = null; }.bind(this, type); /* (1) Get current channel */ let channel = this.get(); /* (2) Manage invalid @type */ - if( typeof type !== 'string' || !channel.local.hasOwnProperty(type) ) + if( typeof type !== 'string' || !channel.room.hasOwnProperty(type) ) + return false; + + /* (3) Exit if invalid @id */ + let room = channel.room[type].list[id]; + + if( !room ) return false; + /* (4) Close last room */ + + /* (5) Open new room */ + + /* (6) Update @active room */ + channel.room[type].active = id; console.log(`open(${type}, ${id})`, channel.id); }; \ No newline at end of file diff --git a/webpack/mockup/channel-init.json b/webpack/mockup/channel-init.json new file mode 100644 index 0000000..82720e2 --- /dev/null +++ b/webpack/mockup/channel-init.json @@ -0,0 +1,45 @@ +{ + "channel_id": 12, + + "users": [ + { "uid": 1, "online": true, "name": "First user YaY!" }, + { "uid": 3, "online": false, "name": "Another channel's user" }, + { "uid": 4, "online": true, "name": "And another one" }, + { "uid": 5, "online": true, "name": "And another" } + ], + + "room": { + + "text": { + + "general": { + + "members": [1,3,5], + + "messages": [ + { "mid": 100, "uid": 1, "ts": 23894808320, "msg": "Hey ! How are you ?" }, + { "mid": 101, "uid": 3, "ts": 23894808330, "msg": "Fine n you ?" }, + { "mid": 102, "uid": 5, "ts": 23894808340, "msg": "fine too, what are you doin' ?" }, + { "mid": 103, "uid": 1, "ts": 23894808350, "msg": "Yay guys i'm ok" }, + { "mid": 104, "uid": 1, "ts": 23894808360, "msg": "Do you have anything to say ... ?" } + ] + + }, + + "test-text": { + + "members": [1,4], + + "messages": [ + { "mid": 110, "uid": 1, "ts": 23894823450, "msg": "user_id: 1, message_id: 110" }, + { "mid": 111, "uid": 4, "ts": 23894823460, "msg": "user_id: 4, message_id: 111" }, + { "mid": 112, "uid": 1, "ts": 23894823460, "msg": "user_id: 1, message_id: 112" }, + { "mid": 113, "uid": 1, "ts": 23894823460, "msg": "user_id: 1, message_id: 113" } + ] + + } + + } + } + +} \ No newline at end of file diff --git a/webpack/mockup/channels.json b/webpack/mockup/channels.json index 7b99e95..9dba546 100644 --- a/webpack/mockup/channels.json +++ b/webpack/mockup/channels.json @@ -3,7 +3,7 @@ "id": 0, "link": "channel-1", "label": "first channel", - "local": { + "room": { "text": { "type": "text", "visible": true, @@ -22,7 +22,7 @@ "id": 1, "link": "common-channel", "label": "Common Channel", - "local": { + "room": { "text": { "type": "text", "visible": true, diff --git a/webpack/scss/container.scss b/webpack/scss/container.scss index 93a4b03..321bd1d 100644 --- a/webpack/scss/container.scss +++ b/webpack/scss/container.scss @@ -14,7 +14,7 @@ /* (1) Container HEADER */ & > div.header{ - display: block; + display: flex; position: absolute; top: 0; left: 0; @@ -26,6 +26,27 @@ z-index: 200; + flex-direction: row; + justify-content: space-between; + flex-wrap: nowrap; + + // {1} Title // + & > div.title{ + display: inline-block; + position: relative; + + padding: .2em .5em; + padding-left: 1.3em; + margin-left: .7em; + + font-weight: bold; + + background: url('../asset/svg/dialog.text.svg') left center no-repeat; + background-size: auto 60%; + + align-self: center; + } + } /* (2) Container BODY */ diff --git a/webpack/scss/layout.scss b/webpack/scss/layout.scss index 8983fc1..5f71d6d 100644 --- a/webpack/scss/layout.scss +++ b/webpack/scss/layout.scss @@ -34,7 +34,7 @@ body{ margin: 0; padding: 0; - background-color: #f00; + background-color: #36393e; } } diff --git a/webpack/vue/channel.vue b/webpack/vue/channel.vue index 169aaa4..0b97667 100644 --- a/webpack/vue/channel.vue +++ b/webpack/vue/channel.vue @@ -1,12 +1,13 @@