Anon/yandere_fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Made pausing TL updating configurable. Added styles for disabled checkboxes.

Browse Source 
Shuffled settings a bit b/c all the settings are in "Attachments" section
depsite the fact not all of them are attachments-related.
This commit is contained in:
Henry Jameson 2018-08-13 17:07:45 +03:00
parent 18117c3bfa
commit 87eee191b8
5 changed files with 76 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/App.scss
View File

@ -142,6 +142,14 @@ input, textarea, .select {
color: $fallback--fg; color: $fallback--fg;
color: var(--fg, $fallback--fg); color: var(--fg, $fallback--fg);
} }
&:disabled,
{
&,
& + label,
& + label::before {
opacity: .5;
}
}
+ label::before { + label::before {
display: inline-block; display: inline-block;
content: '✔'; content: '✔';

4
src/components/settings/settings.js
View File

@ -10,6 +10,7 @@ const settings = {
muteWordsString: this.$store.state.config.muteWords.join('\n'), muteWordsString: this.$store.state.config.muteWords.join('\n'),
autoLoadLocal: this.$store.state.config.autoLoad, autoLoadLocal: this.$store.state.config.autoLoad,
streamingLocal: this.$store.state.config.streaming, streamingLocal: this.$store.state.config.streaming,
pauseOnUnfocused: this.$store.state.config.pauseOnUnfocused,
hoverPreviewLocal: this.$store.state.config.hoverPreview, hoverPreviewLocal: this.$store.state.config.hoverPreview,
stopGifs: this.$store.state.config.stopGifs stopGifs: this.$store.state.config.stopGifs
} }
@ -38,6 +39,9 @@ const settings = {
streamingLocal (value) { streamingLocal (value) {
this.$store.dispatch('setOption', { name: 'streaming', value }) this.$store.dispatch('setOption', { name: 'streaming', value })
}, },
pauseOnUnfocusedLocal (value) {
this.$store.dispatch('setOption', { name: 'pauseOnUnfocused', value })
},
hoverPreviewLocal (value) { hoverPreviewLocal (value) {
this.$store.dispatch('setOption', { name: 'hoverPreview', value }) this.$store.dispatch('setOption', { name: 'hoverPreview', value })
}, },

103
src/components/settings/settings.vue
View File

@ -1,53 +1,64 @@
<template> <template>
<div class="settings panel panel-default"> <div class="settings panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
{{$t('settings.settings')}} {{$t('settings.settings')}}
</div>
<div class="panel-body">
<div class="setting-item">
<h2>{{$t('settings.theme')}}</h2>
<style-switcher></style-switcher>
</div> </div>
<div class="panel-body"> <div class="setting-item">
<div class="setting-item"> <h2>{{$t('settings.filtering')}}</h2>
<h2>{{$t('settings.theme')}}</h2> <p>{{$t('settings.filtering_explanation')}}</p>
<style-switcher></style-switcher> <textarea id="muteWords" v-model="muteWordsString"></textarea>
</div> </div>
<div class="setting-item"> <div class="setting-item">
<h2>{{$t('settings.filtering')}}</h2> <h2>{{$t('nav.timeline')}}</h2>
<p>{{$t('settings.filtering_explanation')}}</p> <ul class="setting-list">
<textarea id="muteWords" v-model="muteWordsString"></textarea> <li>
</div> <input type="checkbox" id="streaming" v-model="streamingLocal">
<div class="setting-item"> <label for="streaming">{{$t('settings.streaming')}}</label>
<h2>{{$t('settings.attachments')}}</h2> <ul class="setting-list suboptions" :class="[{disabled: !streamingLocal}]">
<ul class="setting-list">
<li> <li>
<input type="checkbox" id="hideAttachments" v-model="hideAttachmentsLocal"> <input :disabled="!streamingLocal" type="checkbox" id="pauseOnUnfocused" v-model="pauseOnUnfocusedLocal">
<label for="hideAttachments">{{$t('settings.hide_attachments_in_tl')}}</label> <label for="pauseOnUnfocused">{{$t('settings.pauseOnUnfocused')}}</label>
</li> </li>
<li> </ul>
<input type="checkbox" id="hideAttachmentsInConv" v-model="hideAttachmentsInConvLocal"> </li>
<label for="hideAttachmentsInConv">{{$t('settings.hide_attachments_in_convo')}}</label> <li>
</li> <input type="checkbox" id="autoload" v-model="autoLoadLocal">
<li> <label for="autoload">{{$t('settings.autoload')}}</label>
<input type="checkbox" id="hideNsfw" v-model="hideNsfwLocal"> </li>
<label for="hideNsfw">{{$t('settings.nsfw_clickthrough')}}</label> <li>
</li> <input type="checkbox" id="hoverPreview" v-model="hoverPreviewLocal">
<li> <label for="hoverPreview">{{$t('settings.reply_link_preview')}}</label>
<input type="checkbox" id="autoload" v-model="autoLoadLocal"> </li>
<label for="autoload">{{$t('settings.autoload')}}</label> </ul>
</li> </div>
<li> <div class="setting-item">
<input type="checkbox" id="streaming" v-model="streamingLocal"> <h2>{{$t('settings.attachments')}}</h2>
<label for="streaming">{{$t('settings.streaming')}}</label> <ul class="setting-list">
</li> <li>
<li> <input type="checkbox" id="hideAttachments" v-model="hideAttachmentsLocal">
<input type="checkbox" id="hoverPreview" v-model="hoverPreviewLocal"> <label for="hideAttachments">{{$t('settings.hide_attachments_in_tl')}}</label>
<label for="hoverPreview">{{$t('settings.reply_link_preview')}}</label> </li>
</li> <li>
<li> <input type="checkbox" id="hideAttachmentsInConv" v-model="hideAttachmentsInConvLocal">
<input type="checkbox" id="stopGifs" v-model="stopGifs"> <label for="hideAttachmentsInConv">{{$t('settings.hide_attachments_in_convo')}}</label>
<label for="stopGifs">{{$t('settings.stop_gifs')}}</label> </li>
</li> <li>
</ul> <input type="checkbox" id="hideNsfw" v-model="hideNsfwLocal">
</div> <label for="hideNsfw">{{$t('settings.nsfw_clickthrough')}}</label>
</li>
<li>
<input type="checkbox" id="stopGifs" v-model="stopGifs">
<label for="stopGifs">{{$t('settings.stop_gifs')}}</label>
</li>
</ul>
</div> </div>
</div> </div>
</div>
</template> </template>
<script src="./settings.js"> <script src="./settings.js">
@ -89,8 +100,12 @@
} }
.setting-list { .setting-list {
list-style-type: none; list-style-type: none;
padding-left: 2em;
li { li {
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
.suboptions {
margin-top: 0.3em
}
} }
</style> </style>

5
src/components/timeline/timeline.js
View File

@ -133,7 +133,10 @@ const Timeline = {
} }
if (count > 0) { if (count > 0) {
// only 'stream' them when you're scrolled to the top // only 'stream' them when you're scrolled to the top
if (window.pageYOffset < 15 && !this.paused && !this.unfocused) { if (window.pageYOffset < 15 &&
!this.paused &&
!(this.unfocused && this.$store.state.config.pauseOnUnfocused)
) {
this.showNewStatuses() this.showNewStatuses()
} else { } else {
this.paused = true this.paused = true

1
src/i18n/messages.js
View File

@ -314,6 +314,7 @@ const en = {
stop_gifs: 'Play-on-hover GIFs', stop_gifs: 'Play-on-hover GIFs',
autoload: 'Enable automatic loading when scrolled to the bottom', autoload: 'Enable automatic loading when scrolled to the bottom',
streaming: 'Enable automatic streaming of new posts when scrolled to the top', streaming: 'Enable automatic streaming of new posts when scrolled to the top',
pauseOnUnfocused: 'Pause streaming when tab is not focused',
reply_link_preview: 'Enable reply-link preview on mouse hover', reply_link_preview: 'Enable reply-link preview on mouse hover',
follow_import: 'Follow import', follow_import: 'Follow import',
import_followers_from_a_csv_file: 'Import follows from a csv file', import_followers_from_a_csv_file: 'Import follows from a csv file',