Add configuration option to enable click-through content warnings

This commit is contained in:
Vivian Lim 2018-06-28 21:39:25 -07:00 committed by Vivian Lim
parent ab86e87e85
commit b0cf050797
4 changed files with 16 additions and 8 deletions

View file

@ -29,7 +29,7 @@ const Status = {
preview: null, preview: null,
showPreview: false, showPreview: false,
showingTall: false, showingTall: false,
showingContentWarningContent: false showingContentWarningContent: false
}), }),
computed: { computed: {
muteWords () { muteWords () {
@ -93,7 +93,10 @@ const Status = {
return 'small' return 'small'
} }
return 'normal' return 'normal'
} },
clickThroughContentWarningsEnabled () {
return this.$store.state.config.clickThroughContentWarningsEnabled
},
}, },
components: { components: {
Attachment, Attachment,

View file

@ -76,17 +76,19 @@
<div v-if="status.summary" @click.prevent="linkClicked" class="status-content media-body"> <div v-if="status.summary" @click.prevent="linkClicked" class="status-content media-body">
<div class="contentWarningLabel"> <div class="contentWarningLabel">
<span v-html="status.summary"></span> <span v-html="status.summary"></span>
<button v-if="showingContentWarningContent" @click.prevent="toggleContentWarningContent">Hide</button> <span v-if="clickThroughContentWarningsEnabled">
<button v-else @click.prevent="toggleContentWarningContent">Show</button> <button v-if="showingContentWarningContent" @click.prevent="toggleContentWarningContent">Hide</button>
<button v-else @click.prevent="toggleContentWarningContent">Show</button>
</span>
</div> </div>
<div v-if="showingContentWarningContent" v-html="status.content" class="contentWarnedContent"></div> <div v-if="showingContentWarningContent || !clickThroughContentWarningsEnabled" v-html="status.content" class="contentWarnedContent"></div>
<div v-else class="hiddenContent" @click.prevent="toggleContentWarningContent">Click to view this post.<span v-if="status.attachments && status.attachments.length > 0"> (has attachments)</span></div> <div v-else class="hiddenContent" @click.prevent="toggleContentWarningContent">Click to view this post.<span v-if="status.attachments && status.attachments.length > 0"> (has attachments)</span></div>
</div> </div>
<div v-else @click.prevent="linkClicked" class="status-content media-body" v-html="status.statusnet_html"></div> <div v-else @click.prevent="linkClicked" class="status-content media-body" v-html="status.statusnet_html"></div>
<a v-if="showingTall" href="#" class="tall-status-unhider" @click.prevent="toggleShowTall">Show less</a> <a v-if="showingTall" href="#" class="tall-status-unhider" @click.prevent="toggleShowTall">Show less</a>
</div> </div>
<div v-if='status.attachments && (!status.summary || showingContentWarningContent)' class='attachments media-body'> <div v-if='status.attachments && (!status.summary || showingContentWarningContent || !clickThroughContentWarningsEnabled)' class='attachments media-body'>
<attachment :size="attachmentSize" :status-id="status.id" :nsfw="status.nsfw" :attachment="attachment" v-for="attachment in status.attachments" :key="attachment.id"> <attachment :size="attachmentSize" :status-id="status.id" :nsfw="status.nsfw" :attachment="attachment" v-for="attachment in status.attachments" :key="attachment.id">
</attachment> </attachment>
</div> </div>

View file

@ -89,7 +89,7 @@ window.fetch('/api/statusnet/config.json')
window.fetch('/static/config.json') window.fetch('/static/config.json')
.then((res) => res.json()) .then((res) => res.json())
.then((data) => { .then((data) => {
const {theme, background, logo, showWhoToFollowPanel, whoToFollowProvider, whoToFollowLink, showInstanceSpecificPanel, scopeOptionsEnabled} = data const {theme, background, logo, showWhoToFollowPanel, whoToFollowProvider, whoToFollowLink, showInstanceSpecificPanel, scopeOptionsEnabled, clickThroughContentWarningsEnabled} = data
store.dispatch('setOption', { name: 'theme', value: theme }) store.dispatch('setOption', { name: 'theme', value: theme })
store.dispatch('setOption', { name: 'background', value: background }) store.dispatch('setOption', { name: 'background', value: background })
store.dispatch('setOption', { name: 'logo', value: logo }) store.dispatch('setOption', { name: 'logo', value: logo })
@ -98,6 +98,8 @@ window.fetch('/static/config.json')
store.dispatch('setOption', { name: 'whoToFollowLink', value: whoToFollowLink }) store.dispatch('setOption', { name: 'whoToFollowLink', value: whoToFollowLink })
store.dispatch('setOption', { name: 'showInstanceSpecificPanel', value: showInstanceSpecificPanel }) store.dispatch('setOption', { name: 'showInstanceSpecificPanel', value: showInstanceSpecificPanel })
store.dispatch('setOption', { name: 'scopeOptionsEnabled', value: scopeOptionsEnabled }) store.dispatch('setOption', { name: 'scopeOptionsEnabled', value: scopeOptionsEnabled })
store.dispatch('setOption', { name: 'clickThroughContentWarningsEnabled', value: clickThroughContentWarningsEnabled })
if (data['chatDisabled']) { if (data['chatDisabled']) {
store.dispatch('disableChat') store.dispatch('disableChat')
} }

View file

@ -11,5 +11,6 @@
"whoToFollowLink": "https://vinayaka.distsn.org/?{{host}}+{{user}}", "whoToFollowLink": "https://vinayaka.distsn.org/?{{host}}+{{user}}",
"whoToFollowLinkDummy2": "https://followlink.osa-p.net/recommend.html", "whoToFollowLinkDummy2": "https://followlink.osa-p.net/recommend.html",
"showInstanceSpecificPanel": false, "showInstanceSpecificPanel": false,
"scopeOptionsEnabled": false "scopeOptionsEnabled": true,
"clickThroughContentWarningsEnabled": true
} }