Mastodon/Whalebird-desktop-client-mac-linux-windows
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #733 from amyspark/media-description

Browse Source 
Enable adding a media description
This commit is contained in:
AkiraFukushima 2018-11-21 21:26:21 +09:00 committed by GitHub
commit 3ea62cd58d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 83 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/config/locales/de/translation.json
View File

@ -188,7 +188,8 @@
"change_visibility": "Sichtbarkeit ändern",
"add_cw": "Inhalt hinzufügen Warnung",
"change_sensitive": "Ändern Sie empfindlich",
"pined_hashtag": "Pin the hashtag"
"pined_hashtag": "Pin the hashtag",
"description": "Für Menschen mit Sehbehinderung beschreiben",
},
"jump": {
"jump_to": "Springe zu..."

3
src/config/locales/en/translation.json
View File

@ -200,7 +200,8 @@
"change_visibility": "Change visibility",
"add_cw": "Add contents warning",
"change_sensitive": "Change sensitive",
"pined_hashtag": "Pin the hashtag"
"pined_hashtag": "Pin the hashtag",
"description": "Describe for the visually impaired",
},
"jump": {
"jump_to": "Jump to..."

3
src/config/locales/fr/translation.json
View File

@ -188,7 +188,8 @@
"change_visibility": "Changer la visibilité",
"add_cw": "Ajouter un avertissement de contenu",
"change_sensitive": "Changer sensible",
"pined_hashtag": "Pin the hashtag"
"pined_hashtag": "Pin the hashtag",
"description": "Décrire pour les malvoyant·e·s",
},
"jump": {
"jump_to": "Aller à..."

3
src/config/locales/ja/translation.json
View File

@ -200,7 +200,8 @@
"change_visibility": "プライバシー設定",
"add_cw": "閲覧注意を追加",
"change_sensitive": "メディアの閲覧注意設定",
"pined_hashtag": "ハッシュタグを固定する"
"pined_hashtag": "ハッシュタグを固定する",
"description": "視覚障害者のための説明",
},
"jump": {
"jump_to": "移動..."

3
src/config/locales/ko/translation.json
View File

@ -188,7 +188,8 @@
"change_visibility": "공개 범위 변경",
"add_cw": "경고 문구 추가",
"change_sensitive": "민감한 미디어 설정",
"pined_hashtag": "해시태그고정"
"pined_hashtag": "해시태그고정",
"description": "시각장애인을 위한 설명",
},
"jump": {
"jump_to": "이동"

3
src/config/locales/pl/translation.json
View File

@ -188,7 +188,8 @@
"change_visibility": "Zmień widoczność",
"add_cw": "Dodaj ostrzeżenie zawartości",
"change_sensitive": "Zmień wrażliwy",
"pined_hashtag": "Pin the hashtag"
"pined_hashtag": "Pin the hashtag",
"description": "Wprowadź opis dla niewidomych i niedowidzących",
},
"jump": {
"jump_to": "Przejdź do…"

62
src/renderer/components/TimelineSpace/Modals/NewToot.vue
View File

@ -20,7 +20,8 @@
<div class="preview">
<div class="image-wrapper" v-for="media in attachedMedias" v-bind:key="media.id">
<img :src="media.preview_url" class="preview-image" />
<el-button size="small" type="text" @click="removeAttachment(media)" class="remove-image"><icon name="times-circle"></icon></el-button>
<el-button type="text" @click="removeAttachment(media)" class="remove-image"><icon name="times-circle"></icon></el-button>
<textarea rows="2" maxlength="420" class="image-description" :placeholder="$t('modals.new_toot.description')" v-model="mediaDescriptions[media.id]" ></textarea>
</div>
</div>
<div slot="footer" class="dialog-footer">
@ -93,6 +94,7 @@ export default {
data () {
return {
status: '',
mediaDescriptions: {},
spoiler: '',
showContentWarning: false,
visibilityList: Visibility
@ -207,8 +209,12 @@ export default {
})
}
const status = await this.$store.dispatch('TimelineSpace/Modals/NewToot/postToot', form)
.catch(() => {
const status = await this.$store.dispatch('TimelineSpace/Modals/NewToot/updateMedia', this.mediaDescriptions)
.then(() => {
return this.$store.dispatch('TimelineSpace/Modals/NewToot/postToot', form)
})
.catch((e) => {
console.error(e)
this.$message({
message: this.$t('message.toot_error'),
type: 'error'
@ -262,6 +268,7 @@ export default {
},
removeAttachment (media) {
this.$store.commit('TimelineSpace/Modals/NewToot/removeMedia', media)
delete this.mediaDescriptions[media.id]
},
changeVisibility (level) {
this.$store.commit('TimelineSpace/Modals/NewToot/changeVisibilityValue', level)
@ -319,23 +326,60 @@ export default {
.preview {
box-sizing: border-box;
padding: 0 12px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
.image-wrapper {
position: relative;
display: inline-block;
flex: 1 1 0;
min-width: 40%;
height: 150px;
margin: 4px;
.preview-image {
width: 60px;
margin-right: 8px;
width: 100%;
height: 100%;
object-fit: cover;
border: 0;
border-radius: 8px;
}
.image-description {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
box-sizing: border-box;
border: 0;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0, rgba(0, 0, 0, 0.35) 80%, transparent);
font-size: var(--font-base-size);
color: #fff;
opacity: 1;
resize: none;
&::placeholder {
color: #c0c4cc;
}
}
.remove-image {
position: absolute;
top: 0;
left: 0;
top: 2px;
left: 2px;
padding: 0;
cursor: pointer;
font-size: 1.5rem;
.fa-icon {
font-size: 0.9em;
width: auto;
height: 1em;
max-width: 100%;
max-height: 100%;
}
}
}
}

19
src/renderer/store/TimelineSpace/Modals/NewToot.js
View File

@ -74,7 +74,24 @@ const NewToot = {
}
},
actions: {
postToot ({ state, commit, rootState }, form) {
async updateMedia ({state, commit, rootState}, media) {
if (rootState.TimelineSpace.account.accessToken === undefined || rootState.TimelineSpace.account.accessToken === null) {
throw new AuthenticationError()
}
const client = new Mastodon(
rootState.TimelineSpace.account.accessToken,
rootState.TimelineSpace.account.baseURL + '/api/v1'
)
return Promise.all(
Object.keys(media).map(async (id, index) => {
return client.put(`/media/${id}`, { description: media[id] })
}
)).catch(err => {
console.error(err)
throw err
})
},
async postToot ({ state, commit, rootState }, form) {
if (rootState.TimelineSpace.account.accessToken === undefined || rootState.TimelineSpace.account.accessToken === null) {
throw new AuthenticationError()
}