アイコンのレンダリングを改善

This commit is contained in:
syuilo 2018-05-06 18:04:37 +09:00
parent 332af15e3c
commit 3f2a7a561e
5 changed files with 110 additions and 16 deletions
migration
package.json
src
client/app
common/views/components
mobile/views/pages
server/api/endpoints/i

69
migration/2.4.0.js Normal file
View file

@ -0,0 +1,69 @@
// for Node.js interpret
const chalk = require('chalk');
const sequential = require('promise-sequential');
const { default: User } = require('../built/models/user');
const { default: DriveFile } = require('../built/models/drive-file');
async function main() {
const promiseGens = [];
const count = await User.count({});
let prev;
for (let i = 0; i < count; i++) {
promiseGens.push(() => {
const promise = new Promise(async (res, rej) => {
const user = await User.findOne(prev ? {
_id: { $gt: prev._id }
} : {}, {
sort: {
_id: 1
}
});
prev = user;
const set = {};
if (user.avatarId != null) {
const file = await DriveFile.findOne({ _id: user.avatarId });
if (file && file.metadata.properties.avgColor) {
set.avatarColor = file.metadata.properties.avgColor;
}
}
if (user.bannerId != null) {
const file = await DriveFile.findOne({ _id: user.bannerId });
if (file && file.metadata.properties.avgColor) {
set.bannerColor = file.metadata.properties.avgColor;
}
}
User.update({
_id: user._id
}, {
$set: set
}).then(() => {
res([i, user]);
}).catch(rej);
});
promise.then(([i, user]) => {
console.log(chalk`{gray ${i}} {green done: {bold ${user._id}} @${user.username}}`);
});
return promise;
});
}
return await sequential(promiseGens);
}
main().then(() => {
console.log('ALL DONE');
}).catch(console.error);

View file

@ -1,8 +1,8 @@
{
"name": "misskey",
"author": "syuilo <i@syuilo.com>",
"version": "2.3.1",
"clientVersion": "1.0.5207",
"version": "2.4.0",
"clientVersion": "1.0.5215",
"codename": "nighthike",
"main": "./built/index.js",
"private": true,

View file

@ -1,8 +1,6 @@
<template>
<router-link class="mk-avatar" :to="user | userPage" :title="user | acct" :target="target" :style="{ borderRadius: clientSettings.circleIcons ? '100%' : null }">
<img v-if="disablePreview" :src="`${user.avatarUrl}?thumbnail&size=128`" alt=""/>
<img v-else :src="`${user.avatarUrl}?thumbnail&size=128`" alt="" v-user-preview="user.id"/>
</router-link>
<router-link class="mk-avatar" :to="user | userPage" :title="user | acct" :target="target" :style="style" v-if="disablePreview"></router-link>
<router-link class="mk-avatar" :to="user | userPage" :title="user | acct" :target="target" :style="style" v-else v-user-preview="user.id"></router-link>
</template>
<script lang="ts">
@ -10,6 +8,7 @@ import Vue from 'vue';
export default Vue.extend({
props: {
user: {
type: Object,
required: true
},
target: {
@ -20,6 +19,15 @@ export default Vue.extend({
required: false,
default: false
}
},
computed: {
style(): any {
return {
backgroundColor: this.user.avatarColor ? `rgb(${ this.user.avatarColor.join(',') })` : null,
backgroundImage: `url(${ this.user.avatarUrl }?thumbnail)`,
borderRadius: (this as any).clientSettings.circleIcons ? '100%' : null
};
}
}
});
</script>
@ -27,13 +35,7 @@ export default Vue.extend({
<style lang="stylus" scoped>
.mk-avatar
display inline-block
> img
display inline-block
width 100%
height 100%
margin 0
border-radius inherit
vertical-align bottom
transition border-radius 1s ease
background-size cover
background-position center center
transition border-radius 1s ease
</style>

View file

@ -9,7 +9,7 @@
<div class="body">
<div class="top">
<a class="avatar">
<img :src="`${user.avatarUrl}?thumbnail&size=200`" alt="avatar"/>
<img :src="user.avatarUrl" alt="avatar"/>
</a>
<mk-follow-button v-if="os.isSignedIn && os.i.id != user.id" :user="user"/>
</div>

View file

@ -4,6 +4,7 @@
import $ from 'cafy'; import ID from '../../../../cafy-id';
import User, { isValidName, isValidDescription, isValidLocation, isValidBirthday, pack } from '../../../../models/user';
import event from '../../../../publishers/stream';
import DriveFile from '../../../../models/drive-file';
/**
* Update myself
@ -51,12 +52,34 @@ module.exports = async (params, user, app) => new Promise(async (res, rej) => {
if (autoWatchErr) return rej('invalid autoWatch param');
if (autoWatch != null) user.settings.autoWatch = autoWatch;
if (avatarId) {
const avatar = await DriveFile.findOne({
_id: avatarId
});
if (avatar != null && avatar.metadata.properties.avgColor) {
user.avatarColor = avatar.metadata.properties.avgColor;
}
}
if (bannerId) {
const banner = await DriveFile.findOne({
_id: bannerId
});
if (banner != null && banner.metadata.properties.avgColor) {
user.bannerColor = banner.metadata.properties.avgColor;
}
}
await User.update(user._id, {
$set: {
name: user.name,
description: user.description,
avatarId: user.avatarId,
avatarColor: user.avatarColor,
bannerId: user.bannerId,
bannerColor: user.bannerColor,
profile: user.profile,
isBot: user.isBot,
settings: user.settings