Commit 4d12101d5c56d1007d547af47a2cb083913aaf7c
Merge branch 'master' into fulltext-search
mix irving committed on 2/6/2017, 9:49:54 PMParent: f715d01c1a678fca975815e634302f528078efbf
Parent: edabe8be49e24684f650eea0bbebd38e65df4f9f
Files changed
modules_basic/compose.js | changed |
modules_basic/compose.mcss | changed |
modules_basic/thread.js | changed |
modules_extra/channel.js | changed |
modules_extra/raw.js | changed |
package.json | changed |
modules_basic/compose.js | |||
---|---|---|---|
@@ -1,11 +1,13 @@ | |||
1 | 1 … | ||
2 | 2 … | const fs = require('fs') | |
3 | 3 … | const h = require('../h') | |
4 … | +const { Value, when } = require('@mmckegg/mutant') | ||
4 | 5 … | const mentions = require('ssb-mentions') | |
5 | 6 … | ||
6 | 7 … | exports.needs = { | |
7 | 8 … | suggest_mentions: 'map', //<-- THIS MUST BE REWRITTEN | |
9 … | + suggest_channel: 'map', | ||
8 | 10 … | build_suggest_box: 'first', | |
9 | 11 … | publish: 'first', | |
10 | 12 … | message_content: 'first', | |
11 | 13 … | message_confirm: 'first', | |
@@ -40,31 +42,58 @@ | |||
40 | 42 … | } | |
41 | 43 … | } | |
42 | 44 … | opts.prepublish = opts.prepublish || id | |
43 | 45 … | ||
44 | - var actions | ||
46 … | + const isExpanded = Value(opts.shrink === false) | ||
45 | 47 … | ||
46 | 48 … | var textArea = h('textarea', { | |
47 | 49 … | placeholder: opts.placeholder || 'Write a message' | |
48 | 50 … | }) | |
49 | 51 … | ||
52 … | + var channelInput = h('input.channel', { | ||
53 … | + placeholder: '#channel (optional)', | ||
54 … | + value: meta.channel ? `#${meta.channel}` : '', | ||
55 … | + disabled: meta.channel ? true : false, | ||
56 … | + title: meta.channel ? 'Reply is in same channel as original message' : '', | ||
57 … | + }) | ||
58 … | + | ||
59 … | + channelInput.addEventListener('keyup', (e) => { | ||
60 … | + e.target.value = e.target.value | ||
61 … | + .replace(/^#*([\w@%&])/, '#$1') | ||
62 … | + }) | ||
63 … | + | ||
50 | 64 … | if(opts.shrink !== false) { | |
65 … | + isExpanded.set(false) | ||
51 | 66 … | var blur | |
67 … | + | ||
52 | 68 … | textArea.addEventListener('focus', () => { | |
53 | 69 … | clearTimeout(blur) | |
54 | 70 … | if(!textArea.value) { | |
55 | - composer.className = 'Compose -expanded' | ||
71 … | + isExpanded.set(true) | ||
56 | 72 … | } | |
57 | 73 … | }) | |
58 | 74 … | textArea.addEventListener('blur', () => { | |
59 | 75 … | //don't shrink right away, so there is time | |
60 | 76 … | //to click the publish button. | |
61 | 77 … | clearTimeout(blur) | |
62 | 78 … | blur = setTimeout(() => { | |
63 | 79 … | if(textArea.value) return | |
64 | - composer.className = 'Compose -contracted' | ||
80 … | + isExpanded.set(false) | ||
65 | 81 … | }, 300) | |
66 | 82 … | }) | |
83 … | + channelInput.addEventListener('focus', () => { | ||
84 … | + clearTimeout(blur) | ||
85 … | + if (!textArea.value) { | ||
86 … | + isExpanded.set(true) | ||
87 … | + } | ||
88 … | + }) | ||
89 … | + channelInput.addEventListener('blur', () => { | ||
90 … | + clearTimeout(blur) | ||
91 … | + blur = setTimeout(() => { | ||
92 … | + if (textArea.value || channelInput.value) return | ||
93 … | + isExpanded.set(false) | ||
94 … | + }, 300) | ||
95 … | + }) | ||
67 | 96 … | } | |
68 | 97 … | ||
69 | 98 … | textArea.addEventListener('keydown', ev => { | |
70 | 99 … | if(ev.keyCode === 13 && ev.ctrlKey) publish() | |
@@ -79,8 +108,10 @@ | |||
79 | 108 … | try { | |
80 | 109 … | content = JSON.parse(textArea.value) | |
81 | 110 … | } catch (err) { | |
82 | 111 … | meta.text = textArea.value | |
112 … | + meta.channel = (channelInput.value.startsWith('#') ? | ||
113 … | + channelInput.value.substr(1).trim() : channelInput.value.trim()) || null | ||
83 | 114 … | meta.mentions = mentions(textArea.value).map(mention => { | |
84 | 115 … | // merge markdown-detected mention with file info | |
85 | 116 … | var file = filesById[mention.link] | |
86 | 117 … | if (file) { | |
@@ -116,26 +147,25 @@ | |||
116 | 147 … | ||
117 | 148 … | var embed = file.type.indexOf('image/') === 0 ? '!' : '' | |
118 | 149 … | ||
119 | 150 … | textArea.value += embed + '['+file.name+']('+file.link+')' | |
120 | - composer.className = 'Compose -expanded' | ||
151 … | + isExpanded.set(true) | ||
121 | 152 … | console.log('added:', file) | |
122 | 153 … | }) | |
123 | 154 … | var publishBtn = h('button', {'ev-click': publish}, 'Publish' ) | |
124 | - var actions = h('section.actions', [ | ||
125 | - fileInput, publishBtn | ||
126 | - ]) | ||
155 … | + var actions = h('section.actions', [ fileInput, publishBtn ]) | ||
127 | 156 … | ||
128 | 157 … | api.build_suggest_box(textArea, api.suggest_mentions) | |
158 … | + api.build_suggest_box(channelInput, api.suggest_channel) | ||
129 | 159 … | ||
130 | 160 … | var composer = h('Compose', { | |
131 | - className: opts.shrink === false ? '-expanded' : '-contracted' | ||
161 … | + classList: [ when(isExpanded, '-expanded', '-contracted') ] | ||
132 | 162 … | }, [ | |
163 … | + channelInput, | ||
133 | 164 … | textArea, | |
134 | 165 … | actions | |
135 | 166 … | ]) | |
136 | 167 … | ||
137 | - | ||
138 | 168 … | return composer | |
139 | 169 … | } | |
140 | 170 … | ||
141 | 171 … | } |
modules_basic/compose.mcss | ||
---|---|---|
@@ -5,10 +5,29 @@ | ||
5 | 5 … | padding: 1rem .5rem 1rem 7.3rem |
6 | 6 … | |
7 | 7 … | textarea { |
8 | 8 … | border: 1px solid gainsboro |
9 … | + border-top-left-radius: 0 | |
10 … | + border-top-right-radius: 0 | |
9 | 11 … | } |
10 | 12 … | |
13 … | + input.channel { | |
14 … | + border: 1px solid gainsboro | |
15 … | + border-bottom: none | |
16 … | + border-bottom-left-radius: 0 | |
17 … | + border-bottom-right-radius: 0 | |
18 … | + padding: .5rem | |
19 … | + | |
20 … | + :focus { | |
21 … | + outline: none | |
22 … | + box-shadow: none | |
23 … | + } | |
24 … | + :disabled { | |
25 … | + background-color: #f1f1f1 | |
26 … | + cursor: not-allowed | |
27 … | + } | |
28 … | + } | |
29 … | + | |
11 | 30 … | section.actions { |
12 | 31 … | display: flex |
13 | 32 … | flex-direction: row |
14 | 33 … | align-items: baseline |
@@ -25,9 +44,9 @@ | ||
25 | 44 … | |
26 | 45 … | ::-webkit-file-upload-button { |
27 | 46 … | visibility: hidden |
28 | 47 … | } |
29 | - | |
48 … | + | |
30 | 49 … | ::before { |
31 | 50 … | $composeButton |
32 | 51 … | padding-top: .3rem |
33 | 52 … | |
@@ -37,12 +56,12 @@ | ||
37 | 56 … | outline: none |
38 | 57 … | white-space: nowrap |
39 | 58 … | -webkit-user-select: none |
40 | 59 … | } |
41 | - | |
60 … | + | |
42 | 61 … | :active, :focus { |
43 | 62 … | outline: none |
44 | - box-shadow: none | |
63 … | + box-shadow: none | |
45 | 64 … | } |
46 | 65 … | } |
47 | 66 … | |
48 | 67 … | button { |
@@ -59,19 +78,27 @@ | ||
59 | 78 … | height: 200px |
60 | 79 … | transition: height .15s ease-out |
61 | 80 … | } |
62 | 81 … | |
82 … | + input.channel { | |
83 … | + display: flex | |
84 … | + } | |
85 … | + | |
63 | 86 … | section.actions { |
64 | 87 … | display: flex |
65 | 88 … | } |
66 | 89 … | } |
67 | 90 … | |
68 | - -contracted { | |
91 … | + -contracted { | |
69 | 92 … | textarea { |
70 | 93 … | height: 50px |
71 | 94 … | transition: height .15s ease-in |
72 | 95 … | } |
73 | 96 … | |
97 … | + input.channel { | |
98 … | + display: none | |
99 … | + } | |
100 … | + | |
74 | 101 … | section.actions { |
75 | 102 … | display: none |
76 | 103 … | } |
77 | 104 … | } |
@@ -86,5 +113,4 @@ | ||
86 | 113 … | padding: .5rem |
87 | 114 … | margin: 0 |
88 | 115 … | cursor: pointer |
89 | 116 … | } |
90 | - |
modules_basic/thread.js | ||
---|---|---|
@@ -101,8 +101,14 @@ | ||
101 | 101 … | meta.branch = branches.length > 1 ? branches : branches[0] |
102 | 102 … | meta.root = thread[0].value.content.root || thread[0].key |
103 | 103 … | meta.channel = thread[0].value.content.channel |
104 | 104 … | |
105 … | + if (meta.channel) { | |
106 … | + const channelInput = composer.querySelector('input') | |
107 … | + channelInput.value = `#${meta.channel}` | |
108 … | + channelInput.disabled = true | |
109 … | + } | |
110 … | + | |
105 | 111 … | var recps = thread[0].value.content.recps |
106 | 112 … | var priv = thread[0].value['private'] |
107 | 113 … | if(priv) { |
108 | 114 … | if(recps) |
modules_extra/channel.js | ||
---|---|---|
@@ -15,9 +15,10 @@ | ||
15 | 15 … | message_meta: true, |
16 | 16 … | screen_view: true, |
17 | 17 … | connection_status: true, |
18 | 18 … | suggest_search: true, |
19 | - suggest_mentions: true | |
19 … | + suggest_mentions: true, | |
20 … | + suggest_channel: true | |
20 | 21 … | } |
21 | 22 … | |
22 | 23 … | exports.create = function (api) { |
23 | 24 … | |
@@ -34,9 +35,10 @@ | ||
34 | 35 … | message_meta, |
35 | 36 … | screen_view, |
36 | 37 … | connection_status, |
37 | 38 … | suggest_search, |
38 | - suggest_mentions | |
39 … | + suggest_mentions, | |
40 … | + suggest_channel | |
39 | 41 … | } |
40 | 42 … | |
41 | 43 … | function message_meta (msg) { |
42 | 44 … | var chan = msg.value.content.channel |
@@ -138,6 +140,23 @@ | ||
138 | 140 … | } |
139 | 141 … | })) |
140 | 142 … | } |
141 | 143 … | } |
144 … | + | |
145 … | + function suggest_channel (query) { | |
146 … | + return function (cb) { | |
147 … | + if (!/^#\w/.test(query)) return cb() | |
148 … | + | |
149 … | + cb(null, channels.filter(function (chan) { | |
150 … | + return (`#${chan.name}`).substring(0, query.length) === query | |
151 … | + }) | |
152 … | + .map(function (chan) { | |
153 … | + var name = `#${chan.name}` | |
154 … | + return { | |
155 … | + title: name, | |
156 … | + subtitle: `(${chan.rank})`, | |
157 … | + value: `#${name.substr(1)}` | |
158 … | + } | |
159 … | + })) | |
160 … | + } | |
161 … | + } | |
142 | 162 … | } |
143 | - |
Built with git-ssb-web