nanka iroiro

This commit is contained in:
syuilo 2018-06-07 05:14:37 +09:00
parent 2053a041e5
commit 14d12c21f2
6 changed files with 51 additions and 2 deletions

View file

@ -40,6 +40,7 @@
<button class="ui button" @click="customizeHome" style="margin-bottom: 16px">%i18n:@customize%</button> <button class="ui button" @click="customizeHome" style="margin-bottom: 16px">%i18n:@customize%</button>
</div> </div>
<div class="div"> <div class="div">
<button class="ui" @click="updateWallpaper">%i18n:@choose-wallpaper%</button>
<mk-switch v-model="darkmode" text="%i18n:@dark-mode%"/> <mk-switch v-model="darkmode" text="%i18n:@dark-mode%"/>
<mk-switch v-model="$store.state.settings.circleIcons" @change="onChangeCircleIcons" text="%i18n:@circle-icons%"/> <mk-switch v-model="$store.state.settings.circleIcons" @change="onChangeCircleIcons" text="%i18n:@circle-icons%"/>
<mk-switch v-model="$store.state.settings.gradientWindowHeader" @change="onChangeGradientWindowHeader" text="%i18n:@gradient-window-header%"/> <mk-switch v-model="$store.state.settings.gradientWindowHeader" @change="onChangeGradientWindowHeader" text="%i18n:@gradient-window-header%"/>
@ -293,6 +294,15 @@ export default Vue.extend({
this.$router.push('/i/customize-home'); this.$router.push('/i/customize-home');
this.$emit('done'); this.$emit('done');
}, },
updateWallpaper() {
(this as any).apis.chooseDriveFile({
multiple: false
}).then(file => {
(this as any).api('i/update', {
wallpaperId: file.id
});
});
},
onChangeFetchOnScroll(v) { onChangeFetchOnScroll(v) {
this.$store.dispatch('settings/set', { this.$store.dispatch('settings/set', {
key: 'fetchOnScroll', key: 'fetchOnScroll',

View file

@ -1,5 +1,5 @@
<template> <template>
<div class="mk-ui"> <div class="mk-ui" :style="style">
<x-header class="header"/> <x-header class="header"/>
<div class="content"> <div class="content">
<slot></slot> <slot></slot>
@ -16,6 +16,15 @@ export default Vue.extend({
components: { components: {
XHeader XHeader
}, },
computed: {
style(): any {
if (!this.$store.getters.isSignedIn || this.$store.state.i.wallpaperUrl == null) return {};
return {
backgroundColor: this.$store.state.i.wallpaperColor && this.$store.state.i.wallpaperColor.length == 3 ? `rgb(${ this.$store.state.i.wallpaperColor.join(',') })` : null,
backgroundImage: `url(${ this.$store.state.i.wallpaperUrl })`
};
}
},
mounted() { mounted() {
document.addEventListener('keydown', this.onKeydown); document.addEventListener('keydown', this.onKeydown);
}, },
@ -40,6 +49,9 @@ export default Vue.extend({
display flex display flex
flex-direction column flex-direction column
flex 1 flex 1
background-size cover
background-position center
background-attachment fixed
> .header > .header
@media (max-width 1000px) @media (max-width 1000px)

View file

@ -140,6 +140,7 @@ root(isDark)
z-index 1 z-index 1
line-height $header-height line-height $header-height
padding 0 16px padding 0 16px
font-size 14px
color isDark ? #e3e5e8 : #888 color isDark ? #e3e5e8 : #888
background isDark ? #313543 : #fff background isDark ? #313543 : #fff
box-shadow 0 1px rgba(#000, 0.15) box-shadow 0 1px rgba(#000, 0.15)

View file

@ -150,7 +150,6 @@ export default Vue.extend({
root(isDark) root(isDark)
display flex display flex
flex 1 flex 1
justify-content center
padding 16px 0 16px 16px padding 16px 0 16px 16px
overflow auto overflow auto
@ -160,6 +159,13 @@ root(isDark)
&:last-of-type &:last-of-type
margin-right 0 margin-right 0
> *
&:first-child
margin-left auto
&:last-child
margin-right auto
> button > button
padding 0 16px padding 0 16px
color isDark ? #93a0a5 : #888 color isDark ? #93a0a5 : #888

View file

@ -48,6 +48,7 @@ type IUserBase = {
usernameLower: string; usernameLower: string;
avatarId: mongo.ObjectID; avatarId: mongo.ObjectID;
bannerId: mongo.ObjectID; bannerId: mongo.ObjectID;
wallpaperId: mongo.ObjectID;
data: any; data: any;
description: string; description: string;
pinnedNoteId: mongo.ObjectID; pinnedNoteId: mongo.ObjectID;
@ -412,6 +413,10 @@ export const pack = (
? `${config.drive_url}/${_user.bannerId}` ? `${config.drive_url}/${_user.bannerId}`
: null; : null;
_user.wallpaperUrl = _user.wallpaperId != null
? `${config.drive_url}/${_user.wallpaperId}`
: null;
if (!meId || !meId.equals(_user.id) || !opts.detail) { if (!meId || !meId.equals(_user.id) || !opts.detail) {
delete _user.avatarId; delete _user.avatarId;
delete _user.bannerId; delete _user.bannerId;

View file

@ -45,6 +45,11 @@ module.exports = async (params, user, app) => new Promise(async (res, rej) => {
if (bannerIdErr) return rej('invalid bannerId param'); if (bannerIdErr) return rej('invalid bannerId param');
if (bannerId !== undefined) updates.bannerId = bannerId; if (bannerId !== undefined) updates.bannerId = bannerId;
// Get 'wallpaperId' parameter
const [wallpaperId, wallpaperIdErr] = $.type(ID).optional().nullable().get(params.wallpaperId);
if (wallpaperIdErr) return rej('invalid wallpaperId param');
if (wallpaperId !== undefined) updates.wallpaperId = wallpaperId;
// Get 'isLocked' parameter // Get 'isLocked' parameter
const [isLocked, isLockedErr] = $.bool.optional().get(params.isLocked); const [isLocked, isLockedErr] = $.bool.optional().get(params.isLocked);
if (isLockedErr) return rej('invalid isLocked param'); if (isLockedErr) return rej('invalid isLocked param');
@ -85,6 +90,16 @@ module.exports = async (params, user, app) => new Promise(async (res, rej) => {
} }
} }
if (wallpaperId) {
const wallpaper = await DriveFile.findOne({
_id: wallpaperId
});
if (wallpaper != null && wallpaper.metadata.properties.avgColor) {
updates.wallpaperColor = wallpaper.metadata.properties.avgColor;
}
}
await User.update(user._id, { await User.update(user._id, {
$set: updates $set: updates
}); });