Skip to content

Commit

Permalink
セカンダリ投稿ボタン
Browse files Browse the repository at this point in the history
  • Loading branch information
@mei23
mei23 committed May 10, 2019
1 parent 5a58c99 commit f438cf7
Show file tree
Hide file tree
Showing 9 changed files with 199 additions and 115 deletions.
1 change: 1 addition & 0 deletions locales/en-US.yml
View file
Expand Up @@ -138,6 +138,7 @@ common:
fetch-on-scroll-desc: "When you scroll down the page, it automatically fetches additional content."
note-visibility: "Post visibility"
default-note-visibility: "Default visibility"
secondary-note-visibility: "Visibility of secondary post button"
remember-note-visibility: "Remember post visibility"
web-search-engine: "Web search engine"
web-search-engine-desc: "Example: https://www.google.com/?#q={{query}}"
Expand Down
1 change: 1 addition & 0 deletions locales/ja-JP.yml
View file
Expand Up @@ -148,6 +148,7 @@ common:
fetch-on-scroll-desc: "ページを下までスクロールしたときに自動で追加のコンテンツを読み込みます。"
note-visibility: "投稿の公開範囲"
default-note-visibility: "デフォルトの公開範囲"
secondary-note-visibility: "セカンダリ投稿ボタンの公開範囲"
remember-note-visibility: "投稿の公開範囲を記憶する"
web-search-engine: "ウェブ検索エンジン"
web-search-engine-desc: "例: https://www.google.com/?#q={{query}}"
Expand Down
18 changes: 18 additions & 0 deletions src/client/app/common/views/components/settings/settings.vue
View file
Expand Up @@ -129,6 +129,19 @@
<option value="local-followers">{{ $t('@.note-visibility.local-followers') }}</option>
</ui-select>
</section>
<section>
<header>{{ $t('@._settings.secondary-note-visibility') }}</header>
<ui-select v-model="secondaryNoteVisibility">
<option value="none">None</option>
<option value="public">{{ $t('@.note-visibility.public') }}</option>
<option value="home">{{ $t('@.note-visibility.home') }}</option>
<option value="followers">{{ $t('@.note-visibility.followers') }}</option>
<option value="specified">{{ $t('@.note-visibility.specified') }}</option>
<option value="local-public">{{ $t('@.note-visibility.local-public') }}</option>
<option value="local-home">{{ $t('@.note-visibility.local-home') }}</option>
<option value="local-followers">{{ $t('@.note-visibility.local-followers') }}</option>
</ui-select>
</section>
</section>

<section>
Expand Down Expand Up @@ -417,6 +430,11 @@ export default Vue.extend({
set(value) { this.$store.dispatch('settings/set', { key: 'defaultNoteVisibility', value }); }
},
secondaryNoteVisibility: {
get() { return this.$store.state.settings.secondaryNoteVisibility || 'none'; },
set(value) { this.$store.dispatch('settings/set', { key: 'secondaryNoteVisibility', value }); }
},
webSearchEngine: {
get() { return this.$store.state.settings.webSearchEngine; },
set(value) { this.$store.dispatch('settings/set', { key: 'webSearchEngine', value }); }
Expand Down
25 changes: 11 additions & 14 deletions src/client/app/common/views/components/visibility-chooser.vue
View file
Expand Up @@ -3,47 +3,47 @@
<div class="backdrop" ref="backdrop" @click="close"></div>
<div class="popover" :class="{ isMobile: $root.isMobile }" ref="popover">
<div @click="choose('public')" :class="{ active: v == 'public' }">
<div><fa icon="globe"/></div>
<x-visibility-icon v="public"/>
<div>
<span>{{ $t('public') }}</span>
</div>
</div>
<div @click="choose('home')" :class="{ active: v == 'home' }">
<div><fa icon="home"/></div>
<x-visibility-icon v="home"/>
<div>
<span>{{ $t('home') }}</span>
<span>{{ $t('home-desc') }}</span>
</div>
</div>
<div @click="choose('followers')" :class="{ active: v == 'followers' }">
<div><fa icon="unlock"/></div>
<x-visibility-icon v="followers"/>
<div>
<span>{{ $t('followers') }}</span>
<span>{{ $t('followers-desc') }}</span>
</div>
</div>
<div @click="choose('specified')" :class="{ active: v == 'specified' }">
<div><fa icon="envelope"/></div>
<x-visibility-icon v="specified"/>
<div>
<span>{{ $t('specified') }}</span>
<span>{{ $t('specified-desc') }}</span>
</div>
</div>
<div @click="choose('local-public')" :class="{ active: v == 'local-public' }">
<div><div><fa icon="globe"/><fa class="localOnly" icon="heart"/></div></div>
<x-visibility-icon v="local-public"/>
<div>
<span>{{ $t('local-public') }}</span>
<span>{{ $t('local-public-desc') }}</span>
</div>
</div>
<div @click="choose('local-home')" :class="{ active: v == 'local-home' }">
<div><div><fa icon="home"/><fa class="localOnly" icon="heart"/></div></div>
<x-visibility-icon v="local-home"/>
<div>
<span>{{ $t('local-home') }}</span>
</div>
</div>
<div @click="choose('local-followers')" :class="{ active: v == 'local-followers' }">
<div><div><fa icon="unlock"/><fa class="localOnly" icon="heart"/></div></div>
<x-visibility-icon v="local-followers"/>
<div>
<span>{{ $t('local-followers') }}</span>
</div>
Expand All @@ -56,9 +56,13 @@
import Vue from 'vue';
import i18n from '../../../i18n';
import anime from 'animejs';
import XVisibilityIcon from './visibility-icon.vue';
export default Vue.extend({
i18n: i18n('common/views/components/visibility-chooser.vue'),
components: {
XVisibilityIcon,
},
props: {
source: {
required: true
Expand Down Expand Up @@ -220,13 +224,6 @@ export default Vue.extend({
margin-right 10px
width 16px
>>> .localOnly
color var(--primary)
position absolute
top -0.2em
right -0.5em
transform scale(0.8)
> *:last-child
flex 1 1 auto
Expand Down
63 changes: 63 additions & 0 deletions src/client/app/common/views/components/visibility-icon.vue
View file
@@ -0,0 +1,63 @@
<template>
<div>
<div class="wrap" v-if="visibility == 'public'">
<fa icon="globe"/>
</div>
<div class="wrap" v-else-if="visibility == 'home'">
<fa icon="home"/>
</div>
<div class="wrap" v-else-if="visibility == 'followers'">
<fa icon="unlock"/>
</div>
<div class="wrap" v-else-if="visibility == 'specified'">
<fa icon="envelope"/>
</div>
<div class="wrap" v-else-if="visibility == 'local-public'">
<div><fa icon="globe"/></div>
<div class="localOnly"><fa icon="heart"/></div>
</div>
<div class="wrap" v-else-if="visibility == 'local-home'">
<div><fa icon="home"/></div>
<div class="localOnly"><fa icon="heart"/></div>
</div>
<div class="wrap" v-else-if="visibility == 'local-followers'">
<div><fa icon="unlock"/></div>
<div class="localOnly"><fa icon="heart"/></div>
</div>
</div>
</template>

<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
props: {
v: {
type: String,
required: true
},
localOnly: {
type: Boolean,
required: false,
default: false
},
},
computed: {
visibility(): string {
return this.localOnly ? `local-${this.v}` : this.v;
},
},
});
</script>

<style lang="stylus" scoped>
.wrap
display inline-block
> .localOnly
color var(--primary)
position absolute
top -0.5em
right -0.5em
transform scale(0.8)
</style>
17 changes: 4 additions & 13 deletions src/client/app/common/views/widgets/post-form.vue
View file
Expand Up @@ -29,11 +29,7 @@
<button @click="chooseFileFromDrive"><fa icon="cloud"/></button>
<button @click="kao"><fa :icon="['far', 'smile']"/></button>
<button @click="setVisibility" ref="visibilityButton">
<span v-if="visibility === 'public'"><fa icon="globe"/></span>
<span v-if="visibility === 'home'"><fa icon="home"/></span>
<span v-if="visibility === 'followers'"><fa icon="unlock"/></span>
<span v-if="visibility === 'specified'"><fa icon="envelope"/></span>
<span v-if="localOnly" class="localOnly"><fa icon="heart"/></span>
<x-visibility-icon :v="visibility" :localOnly="localOnly"/>
</button>
<button @click="post" :disabled="posting" class="post">{{ $t('note') }}</button>
</footer>
Expand All @@ -49,6 +45,7 @@ import insertTextAtCursor from 'insert-text-at-cursor';
import getFace from '../../../common/scripts/get-face';
import MkVisibilityChooser from '../../../common/views/components/visibility-chooser.vue';
import XPostFormAttaches from '../components/post-form-attaches.vue';
import XVisibilityIcon from '../components/visibility-icon.vue';
export default define({
name: 'post-form',
Expand All @@ -60,7 +57,8 @@ export default define({
components: {
XPostFormAttaches,
MkVisibilityChooser
MkVisibilityChooser,
XVisibilityIcon,
},
data() {
Expand Down Expand Up @@ -289,13 +287,6 @@ export default define({
color var(--textHighlighted)
opacity 1.0
> button > .localOnly
color var(--primary)
position absolute
top 0
right 0.2em
transform scale(.8)
> .post
display block
margin 0 0 0 auto
Expand Down

0 comments on commit f438cf7

Please sign in to comment.