From c34936b068b23663566242b3024a3fa425f5a09f Mon Sep 17 00:00:00 2001 From: brunosimon Date: Fri, 1 Sep 2017 01:06:21 +0200 Subject: [PATCH] :sparkles: Site > Chat > Add associated file to messages --- lib/chat.js | 3 ++ site/src/components/chat/script.js | 49 +++++++++++++++++-- site/src/components/chat/style.styl | 1 + site/src/components/chat/template.html | 8 +++ site/src/components/files-tree-file/script.js | 1 + site/src/components/versions/script.js | 3 +- site/src/components/viewer/script.js | 12 +++++ site/src/components/viewer/style.styl | 23 ++++++++- site/src/components/viewer/template.html | 8 +-- site/src/store/modules/chat.js | 24 ++++++++- site/src/store/modules/files.js | 27 +++++++++- 11 files changed, 147 insertions(+), 12 deletions(-) diff --git a/lib/chat.js b/lib/chat.js index c5cd982..7698df7 100644 --- a/lib/chat.js +++ b/lib/chat.js @@ -60,6 +60,7 @@ class Chat broadcastMessage.time = data.time broadcastMessage.text = data.text broadcastMessage.file = data.file + broadcastMessage.version = data.version broadcastMessage.line = data.line broadcastMessage.user = user @@ -190,6 +191,7 @@ class Chat data.time = new Date() data.text = `message ${counting++}` data.file = null + data.version = null data.line = null this.messages.push(data) @@ -199,6 +201,7 @@ class Chat broadcastMessage.time = data.time broadcastMessage.text = data.text broadcastMessage.file = data.file + broadcastMessage.version = data.version broadcastMessage.line = data.line broadcastMessage.user = userA diff --git a/site/src/components/chat/script.js b/site/src/components/chat/script.js index 1f319d8..1499298 100644 --- a/site/src/components/chat/script.js +++ b/site/src/components/chat/script.js @@ -7,13 +7,22 @@ export default return { userName: '', messageText: '', - open: false, unreadCount: 0 } }, computed: { + open() + { + return this.$store.state.chat.open + }, + + question() + { + return this.$store.state.chat.question + }, + messages() { return this.$store.state.chat.messages @@ -64,7 +73,7 @@ export default { onHeaderClick() { - this.open = !this.open + this.$store.commit('toggleChat') // Reset unread count if(this.open) @@ -89,14 +98,30 @@ export default onMessageTextKeyDown(event) { - // Blur if enter pressed + // Enter key pressed if(event.keyCode === 13) { event.preventDefault() + + // Blur event.target.blur() - this.$store.commit('setPendingMessage', { text: this.messageText }) + // Create and send message + const message = {} + message.text = this.messageText + + if(this.question) + { + message.file = this.question.file + message.line = this.question.line + message.version = this.question.version + } + + this.$store.commit('setPendingMessage', message) this.messageText = '' + + // Reset question + this.$store.commit('setQuestion', null) } }, @@ -109,6 +134,22 @@ export default { this.unreadCount = 0 } + }, + + onQuestionRemoveClick() + { + this.$store.commit('setQuestion', null) + }, + + onFileClick(file, version, line) + { + this.$store.commit('setFile', file) + this.$store.commit('setLine', line) + + window.requestAnimationFrame(() => + { + this.$store.commit('setVersion', version) + }) } } } \ No newline at end of file diff --git a/site/src/components/chat/style.styl b/site/src/components/chat/style.styl index 0013653..941faa8 100644 --- a/site/src/components/chat/style.styl +++ b/site/src/components/chat/style.styl @@ -2,6 +2,7 @@ position fixed bottom 0 right 90px + background #fff .header cursor pointer diff --git a/site/src/components/chat/template.html b/site/src/components/chat/template.html index 3a9d456..84f6c44 100644 --- a/site/src/components/chat/template.html +++ b/site/src/components/chat/template.html @@ -12,6 +12,9 @@
{{ message.user.name }}
+ + {{ message.file }}:{{ message.line }} +
{{ message.text }}
@@ -21,6 +24,11 @@
Your nickname is
+
+ Question: + {{ question.file }}:{{ question.line }} + x +
diff --git a/site/src/components/files-tree-file/script.js b/site/src/components/files-tree-file/script.js index 93f9351..b0e2d4f 100644 --- a/site/src/components/files-tree-file/script.js +++ b/site/src/components/files-tree-file/script.js @@ -65,6 +65,7 @@ export default onNameClick() { this.$store.commit('setFile', this.content.path.full) + this.$store.commit('setLine', null) } } } \ No newline at end of file diff --git a/site/src/components/versions/script.js b/site/src/components/versions/script.js index bd01675..f8a212e 100644 --- a/site/src/components/versions/script.js +++ b/site/src/components/versions/script.js @@ -64,13 +64,14 @@ export default this.keepLatest = true this.$store.commit('setVersion', this.versions[0]) }, - + onVersionClick(version, index) { this.keepLatest = index === 0 this.file.isChanged = false this.$store.commit('setVersion', version) + this.$store.commit('setLine', null) } } } \ No newline at end of file diff --git a/site/src/components/viewer/script.js b/site/src/components/viewer/script.js index 1bcbe7e..4381443 100644 --- a/site/src/components/viewer/script.js +++ b/site/src/components/viewer/script.js @@ -28,6 +28,7 @@ export default { const lines = [] const lineBreaks = (this.version.content.match(/\n/g) || []).length + 1 + const currentLine = this.$store.state.files.currentLine // Create all lines for(let i = 0; i < lineBreaks; i++) @@ -36,6 +37,7 @@ export default line.index = lines.length + 1 line.added = false line.removed = false + line.active = currentLine !== null && i === currentLine - 1 lines.push(line) } @@ -134,6 +136,16 @@ export default } } } + }, + + onLineClick(index) + { + const question = {} + question.line = index + question.version = this.version.date + question.file = this.$store.state.files.current.path.full + this.$store.commit('setQuestion', question) + this.$store.commit('openChat') } } } \ No newline at end of file diff --git a/site/src/components/viewer/style.styl b/site/src/components/viewer/style.styl index bd4e585..27a2b5a 100644 --- a/site/src/components/viewer/style.styl +++ b/site/src/components/viewer/style.styl @@ -32,7 +32,6 @@ position absolute top 0 left 0 - pointer-events none .line position relative @@ -40,6 +39,7 @@ opacity 0.75 letter-spacing -1px padding-left 25px + cursor pointer .added position absolute @@ -48,11 +48,30 @@ color #00ffa5 .removed + position absolute top -10px left 9px - position absolute color #ff8157 + .question + display none + position absolute + top 0 + right -8px + font-size 12px + color #00d8ff + + .active + position absolute + top 0 + right -14px + font-size 12px + color #00d8ff + + &:hover + .question + display block + .code position absolute top 0 diff --git a/site/src/components/viewer/template.html b/site/src/components/viewer/template.html index 4f47f21..5379d9c 100644 --- a/site/src/components/viewer/template.html +++ b/site/src/components/viewer/template.html @@ -1,10 +1,12 @@
-
-
+
-
-
+
+ + + - {{ line.index }}. + ? + !
\ No newline at end of file diff --git a/site/src/store/modules/chat.js b/site/src/store/modules/chat.js index 05c92a6..6acae63 100644 --- a/site/src/store/modules/chat.js +++ b/site/src/store/modules/chat.js @@ -1,11 +1,13 @@ export default { state: { + open: false, user: null, pendingUser: null, messages: [], pendingMessage: null, - pendingAlert: null + pendingAlert: null, + question: null }, mutations: @@ -39,6 +41,26 @@ export default { { const date = new Date() state.pendingAlert = { date } + }, + + setQuestion(state, data) + { + state.question = data + }, + + openChat(state) + { + state.open = true + }, + + closeChat(state) + { + state.open = false + }, + + toggleChat(state) + { + state.open = !state.open } } } \ No newline at end of file diff --git a/site/src/store/modules/files.js b/site/src/store/modules/files.js index 00ed48c..4ae3efd 100644 --- a/site/src/store/modules/files.js +++ b/site/src/store/modules/files.js @@ -6,6 +6,7 @@ export default { tree: new FileTree({ autoWash: true }), current: null, currentVersion: null, + currentLine: null, search: '' }, @@ -37,8 +38,10 @@ export default { setFile(state, data) { + // Retrieve file from path const file = state.tree.getFile(data) + // No current file or file different than current if(!state.current || state.current.id !== file.id) { state.current = file @@ -60,7 +63,29 @@ export default { setVersion(state, data) { - state.currentVersion = data + // Date sent + if(typeof data === 'string') + { + // Find version by date + const version = state.current.versions.find((version) => version.date === data) + + // Found + if(version) + { + state.currentVersion = version + } + } + + // Version directly sent + else + { + state.currentVersion = data + } + }, + + setLine(state, data) + { + state.currentLine = data }, searchFile(state, data)