Commit 9237b9df2489619d235754cd0b215e38bc426234
Added lightbox for captioning
andre alves garzia committed on 4/23/2018, 9:33:33 PMParent: 36fdd005ea9c7306764cf0040cbb11101156f80a
Files changed
| message/html/shares.js | changed |
| message/html/shares.js | ||
|---|---|---|
| @@ -1,11 +1,13 @@ | ||
| 1 | -var { h, computed, when } = require('mutant') | |
| 1 | +var { h, computed, when, Value, resolve } = require('mutant') | |
| 2 | 2 | var nest = require('depnest') |
| 3 | 3 | |
| 4 | 4 | exports.needs = nest({ |
| 5 | 5 | 'keys.sync.id': 'first', |
| 6 | 6 | 'message.obs.shares': 'first', |
| 7 | - 'sbot.async.publish': 'first' | |
| 7 | + 'sbot.async.publish': 'first', | |
| 8 | + 'translations.sync.strings': 'first', | |
| 9 | + 'app.html.lightbox': 'first' | |
| 8 | 10 | }) |
| 9 | 11 | |
| 10 | 12 | exports.gives = nest('message.html.shares') |
| 11 | 13 | |
| @@ -15,19 +17,53 @@ | ||
| 15 | 17 | var shares = api.message.obs.shares(msg.key) |
| 16 | 18 | |
| 17 | 19 | var iShared = computed(shares, shares => shares.includes(id)) |
| 18 | 20 | var count = computed(shares, shares => shares.length ? shares.length : '') |
| 19 | - return h('Shares', { 'ev-click': () => publishShare(msg, !iShared()) }, [ | |
| 21 | + var isOpen = Value(false) | |
| 22 | + var strings = api.translations.sync.strings() | |
| 23 | + var publishAndClose = (msg) => { | |
| 24 | + publishShare(msg, resolve(captionRaw)) | |
| 25 | + isOpen.set(false) | |
| 26 | + } | |
| 27 | + | |
| 28 | + var captionRaw = Value('') | |
| 29 | + var captionInput = h('textarea#caption', { | |
| 30 | + style: { | |
| 31 | + width: '90%' | |
| 32 | + }, | |
| 33 | + placeholder: 'Type an optional caption here', | |
| 34 | + value: computed(captionRaw, t => t), | |
| 35 | + 'ev-input': () => captionRaw.set(captionInput.value), | |
| 36 | + }) | |
| 37 | + | |
| 38 | + var confirmationDialog = h('div.dialog', [ | |
| 39 | + h('div.message', [ | |
| 40 | + h('p', 'Do you to share this post with your followers?'), | |
| 41 | + ]), | |
| 42 | + h('div.form', [ | |
| 43 | + captionInput | |
| 44 | + ]), | |
| 45 | + h('div.actions', [ | |
| 46 | + h('Button', { 'ev-click': () => isOpen.set(false) }, strings.userShow.action.cancel), | |
| 47 | + h('Button -primary', { 'ev-click': () => publishAndClose(msg, true) }, "Share") | |
| 48 | + ]) | |
| 49 | + ]) | |
| 50 | + | |
| 51 | + var lb = api.app.html.lightbox(confirmationDialog, isOpen) | |
| 52 | + | |
| 53 | + | |
| 54 | + return h('Shares', { 'ev-click': () => isOpen.set(!iShared()) }, [ | |
| 20 | 55 | h('i.fa', { className: when(iShared, 'fa-retweet', 'fa-retweet faint') }), |
| 21 | - h('div.count', count) | |
| 56 | + h('div.count', count), | |
| 57 | + lb | |
| 22 | 58 | ]) |
| 23 | 59 | }) |
| 24 | 60 | |
| 25 | - function publishShare(msg, status = true) { | |
| 61 | + function publishShare(msg, text, status = true) { | |
| 26 | 62 | if (status) { |
| 27 | 63 | var share = { |
| 28 | 64 | type: 'share', |
| 29 | - share: { link: msg.key, content: "blog", text: '' } | |
| 65 | + share: { link: msg.key, content: "blog", text: text } | |
| 30 | 66 | } |
| 31 | 67 | if (msg.value.content.recps) { |
| 32 | 68 | share.recps = msg.value.content.recps.map(function (e) { |
| 33 | 69 | return e && typeof e !== 'string' ? e.link : e |
Built with git-ssb-web