diff options
Diffstat (limited to 'src/client/app/desktop')
12 files changed, 109 insertions, 40 deletions
diff --git a/src/client/app/desktop/api/update-avatar.ts b/src/client/app/desktop/api/update-avatar.ts index 83820f92bd..e9d92d1eb1 100644 --- a/src/client/app/desktop/api/update-avatar.ts +++ b/src/client/app/desktop/api/update-avatar.ts @@ -3,8 +3,21 @@ import { apiUrl } from '../../config'; import CropWindow from '../views/components/crop-window.vue'; import ProgressDialog from '../views/components/progress-dialog.vue'; -export default (os: OS) => (cb, file = null) => { - const fileSelected = file => { +export default (os: OS) => { + + const cropImage = file => new Promise((resolve, reject) => { + + const regex = RegExp('\.(jpg|jpeg|png|gif|webp|bmp|tiff)$'); + if (!regex.test(file.name) ) { + os.apis.dialog({ + title: '%fa:info-circle% %i18n:desktop.invalid-filetype%', + text: null, + actions: [{ + text: '%i18n:common.got-it%' + }] + }); + reject(); + } const w = os.new(CropWindow, { image: file, @@ -19,27 +32,29 @@ export default (os: OS) => (cb, file = null) => { os.api('drive/folders/find', { name: '%i18n:desktop.avatar%' - }).then(iconFolder => { - if (iconFolder.length === 0) { + }).then(avatarFolder => { + if (avatarFolder.length === 0) { os.api('drive/folders/create', { name: '%i18n:desktop.avatar%' }).then(iconFolder => { - upload(data, iconFolder); + resolve(upload(data, iconFolder)); }); } else { - upload(data, iconFolder[0]); + resolve(upload(data, avatarFolder[0])); } }); }); w.$once('skipped', () => { - set(file); + resolve(file); }); + w.$once('cancelled', reject); + document.body.appendChild(w.$el); - }; + }); - const upload = (data, folder) => { + const upload = (data, folder) => new Promise((resolve, reject) => { const dialog = os.new(ProgressDialog, { title: '%i18n:desktop.uploading-avatar%' }); @@ -52,18 +67,19 @@ export default (os: OS) => (cb, file = null) => { xhr.onload = e => { const file = JSON.parse((e.target as any).response); (dialog as any).close(); - set(file); + resolve(file); }; + xhr.onerror = reject; xhr.upload.onprogress = e => { if (e.lengthComputable) (dialog as any).update(e.loaded, e.total); }; xhr.send(data); - }; + }); - const set = file => { - os.api('i/update', { + const setAvatar = file => { + return os.api('i/update', { avatarId: file.id }).then(i => { os.store.commit('updateIKeyValue', { @@ -83,18 +99,21 @@ export default (os: OS) => (cb, file = null) => { }] }); - if (cb) cb(i); + return i; }); }; - if (file) { - fileSelected(file); - } else { - os.apis.chooseDriveFile({ - multiple: false, - title: '%fa:image% %i18n:desktop.choose-avatar%' - }).then(file => { - fileSelected(file); - }); - } + return (file = null) => { + const selectedFile = file + ? Promise.resolve(file) + : os.apis.chooseDriveFile({ + multiple: false, + title: '%fa:image% %i18n:desktop.choose-avatar%' + }); + + return selectedFile + .then(cropImage) + .then(setAvatar) + .catch(err => err && console.warn(err)); + }; }; diff --git a/src/client/app/desktop/api/update-banner.ts b/src/client/app/desktop/api/update-banner.ts index 33c4e306a2..e8fa35149b 100644 --- a/src/client/app/desktop/api/update-banner.ts +++ b/src/client/app/desktop/api/update-banner.ts @@ -6,6 +6,19 @@ import ProgressDialog from '../views/components/progress-dialog.vue'; export default (os: OS) => { const cropImage = file => new Promise((resolve, reject) => { + + const regex = RegExp('\.(jpg|jpeg|png|gif|webp|bmp|tiff)$'); + if (!regex.test(file.name) ) { + os.apis.dialog({ + title: '%fa:info-circle% %i18n:desktop.invalid-filetype%', + text: null, + actions: [{ + text: '%i18n:common.got-it%' + }] + }); + reject(); + } + const w = os.new(CropWindow, { image: file, title: '%i18n:desktop.banner-crop-title%', diff --git a/src/client/app/desktop/views/components/charts.vue b/src/client/app/desktop/views/components/charts.vue index e400aebbb7..c4e92e429f 100644 --- a/src/client/app/desktop/views/components/charts.vue +++ b/src/client/app/desktop/views/components/charts.vue @@ -88,7 +88,9 @@ export default Vue.extend({ }, created() { - (this as any).api('chart').then(chart => { + (this as any).api('chart', { + limit: 32 + }).then(chart => { this.chart = chart; }); }, @@ -580,6 +582,6 @@ export default Vue.extend({ > div > * display block - height 300px + height 320px </style> diff --git a/src/client/app/desktop/views/components/note-detail.vue b/src/client/app/desktop/views/components/note-detail.vue index 227bcc349d..1ba4a9a447 100644 --- a/src/client/app/desktop/views/components/note-detail.vue +++ b/src/client/app/desktop/views/components/note-detail.vue @@ -47,7 +47,7 @@ </div> <mk-poll v-if="p.poll" :note="p"/> <mk-url-preview v-for="url in urls" :url="url" :key="url" :detail="true"/> - <a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% %i18n:@location%</a> + <a class="location" v-if="p.geo" :href="`https://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% %i18n:@location%</a> <div class="map" v-if="p.geo" ref="map"></div> <div class="renote" v-if="p.renote"> <mk-note-preview :note="p.renote"/> diff --git a/src/client/app/desktop/views/components/notes.note.vue b/src/client/app/desktop/views/components/notes.note.vue index 87acf7974d..7592ae3905 100644 --- a/src/client/app/desktop/views/components/notes.note.vue +++ b/src/client/app/desktop/views/components/notes.note.vue @@ -32,7 +32,7 @@ <mk-media-list :media-list="p.media"/> </div> <mk-poll v-if="p.poll" :note="p" ref="pollViewer"/> - <a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% 位置情報</a> + <a class="location" v-if="p.geo" :href="`https://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% 位置情報</a> <div class="map" v-if="p.geo" ref="map"></div> <div class="renote" v-if="p.renote"> <mk-note-preview :note="p.renote"/> diff --git a/src/client/app/desktop/views/components/ui.header.nav.vue b/src/client/app/desktop/views/components/ui.header.nav.vue index f01aade306..6292b764c6 100644 --- a/src/client/app/desktop/views/components/ui.header.nav.vue +++ b/src/client/app/desktop/views/components/ui.header.nav.vue @@ -11,7 +11,7 @@ <li class="deck" :class="{ active: $route.name == 'deck' }" @click="goToTop"> <router-link to="/deck"> %fa:columns% - <p>%i18n:@deck% <small>(beta)</small></p> + <p>%i18n:@deck%</p> </router-link> </li> <li class="messaging"> diff --git a/src/client/app/desktop/views/components/ui.header.vue b/src/client/app/desktop/views/components/ui.header.vue index 6de4eaf744..ac8a6c7765 100644 --- a/src/client/app/desktop/views/components/ui.header.vue +++ b/src/client/app/desktop/views/components/ui.header.vue @@ -1,5 +1,6 @@ <template> <div class="header"> + <p class="warn" v-if="env != 'production'">%i18n:common.do-not-use-in-production%</p> <mk-special-message/> <div class="main" ref="main"> <div class="backdrop"></div> @@ -28,6 +29,7 @@ <script lang="ts"> import Vue from 'vue'; import * as anime from 'animejs'; +import { env } from '../../../config'; import XNav from './ui.header.nav.vue'; import XSearch from './ui.header.search.vue'; @@ -43,7 +45,13 @@ export default Vue.extend({ XAccount, XNotifications, XPost, - XClock, + XClock + }, + + data() { + return { + env: env + }; }, mounted() { @@ -119,6 +127,15 @@ root(isDark) width 100% box-shadow 0 1px 1px rgba(#000, 0.075) + > .warn + display block + margin 0 + padding 4px + text-align center + font-size 12px + background #f00 + color #fff + > .main height 48px diff --git a/src/client/app/desktop/views/pages/deck/deck.note.vue b/src/client/app/desktop/views/pages/deck/deck.note.vue index c7df715a05..e6d062eac9 100644 --- a/src/client/app/desktop/views/pages/deck/deck.note.vue +++ b/src/client/app/desktop/views/pages/deck/deck.note.vue @@ -32,7 +32,7 @@ <mk-media-list :media-list="p.media"/> </div> <mk-poll v-if="p.poll" :note="p" ref="pollViewer"/> - <a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% %i18n:@location%</a> + <a class="location" v-if="p.geo" :href="`https://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% %i18n:@location%</a> <div class="renote" v-if="p.renote"> <mk-note-preview :note="p.renote" :mini="true"/> </div> diff --git a/src/client/app/desktop/views/pages/stats/stats.vue b/src/client/app/desktop/views/pages/stats/stats.vue index 6fcbf069ee..41005b6398 100644 --- a/src/client/app/desktop/views/pages/stats/stats.vue +++ b/src/client/app/desktop/views/pages/stats/stats.vue @@ -60,5 +60,5 @@ export default Vue.extend({ font-size 70% > div - max-width 800px + max-width 850px </style> diff --git a/src/client/app/desktop/views/pages/user/user.friends.vue b/src/client/app/desktop/views/pages/user/user.friends.vue index 4af0f0bca6..516eea0288 100644 --- a/src/client/app/desktop/views/pages/user/user.friends.vue +++ b/src/client/app/desktop/views/pages/user/user.friends.vue @@ -40,10 +40,12 @@ export default Vue.extend({ </script> <style lang="stylus" scoped> +root(isDark) .friends - background #fff + background isDark ? #282C37 : #fff border solid 1px rgba(#000, 0.075) border-radius 6px + overflow hidden > .title z-index 1 @@ -52,7 +54,8 @@ export default Vue.extend({ line-height 42px font-size 0.9em font-weight bold - color #888 + background isDark ? #313543 : inherit + color isDark ? #e3e5e8 : #888 box-shadow 0 1px rgba(#000, 0.07) > i @@ -70,7 +73,7 @@ export default Vue.extend({ > .user padding 16px - border-bottom solid 1px #eee + border-bottom solid 1px isDark ? #21242f : #eee &:last-child border-bottom none @@ -96,18 +99,24 @@ export default Vue.extend({ margin 0 font-size 16px line-height 24px - color #555 + color isDark ? #ccc : #555 > .username display block margin 0 font-size 15px line-height 16px - color #ccc + color isDark ? #555 : #ccc > .mk-follow-button position absolute top 16px right 16px +.friends[data-darkmode] + root(true) + +.friends:not([data-darkmode]) + root(false) + </style> diff --git a/src/client/app/desktop/views/pages/user/user.photos.vue b/src/client/app/desktop/views/pages/user/user.photos.vue index ce7791a96b..8397e56484 100644 --- a/src/client/app/desktop/views/pages/user/user.photos.vue +++ b/src/client/app/desktop/views/pages/user/user.photos.vue @@ -39,10 +39,12 @@ export default Vue.extend({ </script> <style lang="stylus" scoped> +root(isDark) .photos - background #fff + background isDark ? #282C37 : #fff border solid 1px rgba(#000, 0.075) border-radius 6px + overflow hidden > .title z-index 1 @@ -51,7 +53,8 @@ export default Vue.extend({ line-height 42px font-size 0.9em font-weight bold - color #888 + background: isDark ? #313543 : inherit + color isDark ? #e3e5e8 : #888 box-shadow 0 1px rgba(#000, 0.07) > i @@ -85,4 +88,10 @@ export default Vue.extend({ > i margin-right 4px +.photos[data-darkmode] + root(true) + +.photos:not([data-darkmode]) + root(false) + </style> diff --git a/src/client/app/desktop/views/pages/user/user.vue b/src/client/app/desktop/views/pages/user/user.vue index 300fd68f06..afb5e674d9 100644 --- a/src/client/app/desktop/views/pages/user/user.vue +++ b/src/client/app/desktop/views/pages/user/user.vue @@ -138,7 +138,7 @@ root(isDark) padding 16px font-size 12px color #aaa - background #fff + background isDark ? #21242f : #fff border solid 1px rgba(#000, 0.075) border-radius 6px |