From 39a6867557e1af5dfa4047dc3e19f80069b744a4 Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Thu, 30 Mar 2017 15:11:32 +0300 Subject: Make muted notifications take much less space (handy for bot spam). --- src/components/status/status.vue | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 62a55505..993ce796 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -162,8 +162,11 @@ border-left: 4px rgba(255, 48, 16, 0.65); border-left-style: inherit; } - .muted button { - margin-left: auto; + .muted { + padding: 0.1em 0.7em 0.1em 0.8em; + button { + margin-left: auto; + } } a.unmute { -- cgit v1.2.3-70-g09d2 From a53555254a711654399836e0f5f052d629bf4380 Mon Sep 17 00:00:00 2001 From: Roger Braun Date: Sun, 9 Apr 2017 15:53:23 +0200 Subject: Add word-based muting to settings / statuses. --- src/components/settings/settings.js | 6 +++++- src/components/settings/settings.vue | 11 ++++++++++- src/components/status/status.js | 14 +++++++++++++- src/components/status/status.vue | 7 ++++++- src/main.js | 1 + src/modules/config.js | 3 ++- 6 files changed, 37 insertions(+), 5 deletions(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js index 3d373283..7aa4bbc4 100644 --- a/src/components/settings/settings.js +++ b/src/components/settings/settings.js @@ -5,7 +5,8 @@ const settings = { return { hideAttachmentsLocal: this.$store.state.config.hideAttachments, hideAttachmentsInConvLocal: this.$store.state.config.hideAttachmentsInConv, - hideNsfwLocal: this.$store.state.config.hideNsfw + hideNsfwLocal: this.$store.state.config.hideNsfw, + muteWordsString: this.$store.state.config.muteWords.join('\n') } }, components: { @@ -20,6 +21,9 @@ const settings = { }, hideNsfwLocal (value) { this.$store.dispatch('setOption', { name: 'hideNsfw', value }) + }, + muteWordsString (value) { + this.$store.dispatch('setOption', { name: 'muteWords', value: value.split('\n') }) } } } diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue index 478d761a..33d46e7e 100644 --- a/src/components/settings/settings.vue +++ b/src/components/settings/settings.vue @@ -8,6 +8,11 @@

Theme

+
+

Filtering

+

All notices containing these words will be muted, one per line

+ +

Attachments

    @@ -32,9 +37,13 @@ - -- cgit v1.2.3-70-g09d2 From 52e6b470be3420178bee02844fcfd8968f2797e7 Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Thu, 1 Jun 2017 17:43:37 +0300 Subject: Revert some of those mobile optimizations, breaks mention notifs. --- src/components/status/status.vue | 13 ------------- 1 file changed, 13 deletions(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 9b17dfff..8fb8d894 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -308,19 +308,6 @@ .status-el { .name-and-links { margin-left: -0.25em; - - .user-name { - flex: 100%; - } - } - - .status-content { - margin-top: 0.5em; - margin-left: -3.7em; - margin-right: 0; - } - .status-actions { - margin-left: -3.7em; } } .status { -- cgit v1.2.3-70-g09d2 From c149330e50fd54ba875c430c4854c9ced0c86b10 Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Thu, 1 Jun 2017 17:50:09 +0300 Subject: Fix bugginess with heading links overlapping icons on the right. --- src/components/status/status.vue | 3 --- 1 file changed, 3 deletions(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 8fb8d894..5d0a50d3 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -158,9 +158,6 @@ flex: 1 0; display: flex; flex-wrap: wrap; - .links { - margin-right: -4em; - } } } -- cgit v1.2.3-70-g09d2 From 24b7d7d9d453d279850af6bb000d41b1ea0be4cb Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Fri, 2 Jun 2017 13:05:03 +0300 Subject: Add mouseover tooltips for names in notif headings and timeline repeats, make the timeline repeat name into a link to the repeater profile and use the word 'repeat' instead of 'retweet'. --- src/components/notifications/notifications.vue | 6 +++--- src/components/status/status.vue | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue index 256d6f7a..97989aea 100644 --- a/src/components/notifications/notifications.vue +++ b/src/components/notifications/notifications.vue @@ -14,7 +14,7 @@

    - {{ notification.action.user.name }} + {{ notification.action.user.name }}

    @@ -22,7 +22,7 @@

    - {{ notification.action.user.name }} + {{ notification.action.user.name }}

    @@ -30,7 +30,7 @@

    - {{ notification.action.user.name }} + {{ notification.action.user.name }}

    diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 5d0a50d3..cf84d177 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -28,7 +28,7 @@
    - Retweeted by {{retweeter}} + Repeated by {{retweeter}}
    -- cgit v1.2.3-70-g09d2 From 4fabeda3ecbd0f194f3951a2394849de504b1a89 Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Sun, 4 Jun 2017 23:58:15 +0300 Subject: Add list of replies under the name/links in conversation statuses, clicking them will highlight the statuses and scroll you to them, expanding a status will scroll you to that status once the conversation has opened. --- src/components/conversation/conversation.js | 24 ++++++++++++++++++++---- src/components/conversation/conversation.vue | 2 +- src/components/status/status.js | 14 ++++++++------ src/components/status/status.vue | 11 ++++++++++- 4 files changed, 39 insertions(+), 12 deletions(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index e89fa84f..b4bd6296 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -10,7 +10,8 @@ const sortAndFilterConversation = (conversation) => { const conversation = { data () { return { - highlight: null + highlight: null, + statuses: [] } }, props: [ @@ -27,8 +28,8 @@ const conversation = { const conversationId = this.status.statusnet_conversation_id const statuses = this.$store.state.statuses.allStatuses const conversation = filter(statuses, { statusnet_conversation_id: conversationId }) - - return sortAndFilterConversation(conversation) + this.statuses = sortAndFilterConversation(conversation) + return this.statuses } }, components: { @@ -46,6 +47,7 @@ const conversation = { const conversationId = this.status.statusnet_conversation_id this.$store.state.api.backendInteractor.fetchConversation({id: conversationId}) .then((statuses) => this.$store.dispatch('addNewStatuses', { statuses })) + .then(() => this.setHighlight(this.statusoid.id)) } else { const id = this.$route.params.id this.$store.state.api.backendInteractor.fetchStatus({id}) @@ -53,7 +55,21 @@ const conversation = { .then(() => this.fetchConversation()) } }, - focused: function (id) { + getReplies (id) { + let res = [] + id = Number(id) + let i + for (i = 0; i < this.statuses.length; i++) { + if (Number(this.statuses[i].in_reply_to_status_id) === id) { + res.push({ + name: `#${i}`, + id: this.statuses[i].id + }) + } + } + return res + }, + focused (id) { if (this.statusoid.retweeted_status) { return (id === this.statusoid.retweeted_status.id) } else { diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index 8b1e00ac..96e8a5d7 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -8,7 +8,7 @@
    - +
diff --git a/src/components/status/status.js b/src/components/status/status.js index 183838a8..7b8f304b 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -13,7 +13,8 @@ const Status = { 'inConversation', 'focused', 'highlight', - 'compact' + 'compact', + 'replies' ], data: () => ({ replying: false, @@ -87,12 +88,14 @@ const Status = { toggleReplying () { this.replying = !this.replying }, - gotoOriginal () { + gotoOriginal (id) { // only handled by conversation, not status_or_conversation - this.$emit('goto', this.status.in_reply_to_status_id) + //this.$emit('goto', this.status.in_reply_to_status_id) + this.$emit('goto', id) }, toggleExpanded () { this.$emit('toggleExpanded') + //console.log(this.replies) }, toggleMute () { this.unmuted = !this.unmuted @@ -108,9 +111,8 @@ const Status = { let rect = this.$el.getBoundingClientRect() if (rect.top < 100) { window.scrollBy(0, rect.top - 200) - } else if (rect.bottom > window.innerHeight - 100) { - // will be useful when scrolling down to replies or root posts is in - window.scrollBy(0, rect.bottom + 200) + } else if (rect.bottom > window.innerHeight - 50) { + window.scrollBy(0, rect.bottom - window.innerHeight + 50) } } } diff --git a/src/components/status/status.vue b/src/components/status/status.vue index cf84d177..5d2c0c30 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -56,7 +56,7 @@ - @@ -67,6 +67,12 @@ +

+ Replies: + + {{reply.name}}  + +

@@ -159,6 +165,9 @@ display: flex; flex-wrap: wrap; } + .replies { + flex-basis: 80%; + } } .source_url { -- cgit v1.2.3-70-g09d2 From 64a7db1d8b015fb386380c32645ddbce591898af Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Mon, 5 Jun 2017 12:03:32 +0300 Subject: Change replies element flex to cover more width if needed. --- src/components/status/status.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 5d2c0c30..a921c9a6 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -166,7 +166,7 @@ flex-wrap: wrap; } .replies { - flex-basis: 80%; + flex-basis: 100%; } } -- cgit v1.2.3-70-g09d2 From f915ae174d3454ade20b9f6c827ce84b04ad7089 Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Wed, 7 Jun 2017 17:58:24 +0300 Subject: Add floating status-previews on reply-link mouseover in conversations and make them optional in the settings, fix a small visual inconsistency in muted statuses while editing the file already.. --- src/components/conversation/conversation.js | 17 ++++++++++++- src/components/conversation/conversation.vue | 38 +++++++++++++++++++++++++++- src/components/settings/settings.js | 4 +++ src/components/settings/settings.vue | 4 +++ src/components/status/status.js | 9 +++++++ src/components/status/status.vue | 16 ++++++------ src/main.js | 1 + src/modules/config.js | 1 + 8 files changed, 80 insertions(+), 10 deletions(-) (limited to 'src/components/status/status.vue') diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index 3e601c3d..c91e4fde 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -10,7 +10,12 @@ const sortAndFilterConversation = (conversation) => { const conversation = { data () { return { - highlight: null + highlight: null, + preview: { + x: 0, + y: 0, + status + } } }, props: [ @@ -76,6 +81,16 @@ const conversation = { }, setHighlight (id) { this.highlight = Number(id) + }, + setPreview (id, x, y) { + if (id) { + this.preview.x = x + this.preview.y = y + this.preview.status = filter(this.conversation, { id: id })[0] + console.log(this.preview.status) + } else { + this.preview.status = null + } } } } diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index 96e8a5d7..e8d97f99 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -8,7 +8,17 @@
- + +
+
+
+ +
+

+ {{ preview.status.user.name }} + {{ preview.status.user.screen_name}} +

+
@@ -21,4 +31,30 @@ border-bottom-style: solid; border-bottom-width: 1px; } + + .status-preview { + position: absolute; + max-width: 35em; + padding: 0.5em; + display: flex; + border-color: inherit; + border-style: solid; + border-width: 1px; + border-radius: 4px; + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); + .avatar { + width: 32px; + height: 32px; + border-radius: 50%; + } + .text { + h4 { + margin-bottom: 0.4em; + small { + font-weight: lighter; + } + } + padding: 0 0.5em 0.5em 0.5em; + } + } diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js index cfceedde..998aa354 100644 --- a/src/components/settings/settings.js +++ b/src/components/settings/settings.js @@ -8,6 +8,7 @@ const settings = { hideAttachmentsInConvLocal: this.$store.state.config.hideAttachmentsInConv, hideNsfwLocal: this.$store.state.config.hideNsfw, autoLoadLocal: this.$store.state.config.autoLoad, + hoverPreviewLocal: this.$store.state.config.hoverPreview, muteWordsString: this.$store.state.config.muteWords.join('\n') } }, @@ -27,6 +28,9 @@ const settings = { autoLoadLocal (value) { this.$store.dispatch('setOption', { name: 'autoLoad', value }) }, + hoverPreviewLocal (value) { + this.$store.dispatch('setOption', { name: 'hoverPreview', value }) + }, muteWordsString (value) { value = filter(value.split('\n'), (word) => trim(word).length > 0) this.$store.dispatch('setOption', { name: 'muteWords', value }) diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue index 3fab1c1c..af0242c4 100644 --- a/src/components/settings/settings.vue +++ b/src/components/settings/settings.vue @@ -32,6 +32,10 @@ +
  • + + +
    • diff --git a/src/components/status/status.js b/src/components/status/status.js index 9448b64b..99dc1b95 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -100,6 +100,15 @@ const Status = { }, toggleUserExpanded () { this.userExpanded = !this.userExpanded + }, + replyEnter (id, event) { + if (this.$store.state.config.hoverPreview) { + let rect = event.target.getBoundingClientRect() + this.$emit('preview', Number(id), rect.left + 20, rect.top + 20 + window.pageYOffset); + } + }, + replyLeave () { + this.$emit('preview', 0, 0, 0) } }, watch: { diff --git a/src/components/status/status.vue b/src/components/status/status.vue index a921c9a6..e582a80d 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -19,7 +19,7 @@
    {{status.user.screen_name}} {{muteWordHits.join(', ')}} - +