forked from mirror/misskey
This commit is contained in:
parent
9852c57b8f
commit
e36a708132
@ -110,7 +110,7 @@ const addFile = async (
|
||||
}
|
||||
}
|
||||
|
||||
const [wh, folder] = await Promise.all([
|
||||
const [wh, averageColor, folder] = await Promise.all([
|
||||
// Width and height (when image)
|
||||
(async () => {
|
||||
// 画像かどうか
|
||||
@ -125,14 +125,45 @@ const addFile = async (
|
||||
return null;
|
||||
}
|
||||
|
||||
log('calculate image width and height...');
|
||||
|
||||
// Calculate width and height
|
||||
const g = gm(fs.createReadStream(path), name);
|
||||
const size = await prominence(g).size();
|
||||
|
||||
log('image width and height is calculated');
|
||||
log(`image width and height is calculated: ${size.width}, ${size.height}`);
|
||||
|
||||
return [size.width, size.height];
|
||||
})(),
|
||||
// average color (when image)
|
||||
(async () => {
|
||||
// 画像かどうか
|
||||
if (!/^image\/.*$/.test(mime)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const imageType = mime.split('/')[1];
|
||||
|
||||
// 画像でもPNGかJPEGでないならスキップ
|
||||
if (imageType != 'png' && imageType != 'jpeg') {
|
||||
return null;
|
||||
}
|
||||
|
||||
log('calculate average color...');
|
||||
|
||||
const buffer = await prominence(gm(fs.createReadStream(path), name)
|
||||
.setFormat('ppm')
|
||||
.resize(1, 1)) // 1pxのサイズに縮小して平均色を取得するというハック
|
||||
.toBuffer();
|
||||
|
||||
const r = buffer.readUInt8(buffer.length - 3);
|
||||
const g = buffer.readUInt8(buffer.length - 2);
|
||||
const b = buffer.readUInt8(buffer.length - 1);
|
||||
|
||||
log(`average color is calculated: ${r}, ${g}, ${b}`);
|
||||
|
||||
return [r, g, b];
|
||||
})(),
|
||||
// folder
|
||||
(async () => {
|
||||
if (!folderId) {
|
||||
@ -188,6 +219,10 @@ const addFile = async (
|
||||
properties['height'] = wh[1];
|
||||
}
|
||||
|
||||
if (averageColor) {
|
||||
properties['average_color'] = averageColor;
|
||||
}
|
||||
|
||||
return addToGridFS(detectedName, readable, mime, {
|
||||
user_id: user._id,
|
||||
folder_id: folder !== null ? folder._id : null,
|
||||
|
@ -38,9 +38,15 @@ module.exports = async (file, params, user): Promise<any> => {
|
||||
const [folderId = null, folderIdErr] = $(params.folder_id).optional.nullable.id().$;
|
||||
if (folderIdErr) throw 'invalid folder_id param';
|
||||
|
||||
try {
|
||||
// Create file
|
||||
const driveFile = await create(user, file.path, name, null, folderId);
|
||||
|
||||
// Serialize
|
||||
return serialize(driveFile);
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
|
||||
throw e;
|
||||
}
|
||||
};
|
||||
|
@ -5,7 +5,9 @@
|
||||
<div class="label" if={ I.banner_id == file.id }><img src="/assets/label.svg"/>
|
||||
<p>%i18n:desktop.tags.mk-drive-browser-file.banner%</p>
|
||||
</div>
|
||||
<div class="thumbnail"><img src={ file.url + '?thumbnail&size=128' } alt=""/></div>
|
||||
<div class="thumbnail" ref="thumbnail" style="background-color:{ file.properties.average_color ? 'rgb(' + file.properties.average_color.join(',') + ')' : 'transparent' }">
|
||||
<img src={ file.url + '?thumbnail&size=128' } alt="" onload={ onload }/>
|
||||
</div>
|
||||
<p class="name"><span>{ file.name.lastIndexOf('.') != -1 ? file.name.substr(0, file.name.lastIndexOf('.')) : file.name }</span><span class="ext" if={ file.name.lastIndexOf('.') != -1 }>{ file.name.substr(file.name.lastIndexOf('.')) }</span></p>
|
||||
<style>
|
||||
:scope
|
||||
@ -139,6 +141,7 @@
|
||||
|
||||
</style>
|
||||
<script>
|
||||
import anime from 'animejs';
|
||||
import bytesToSize from '../../../common/scripts/bytes-to-size';
|
||||
|
||||
this.mixin('i');
|
||||
@ -199,5 +202,16 @@
|
||||
this.isDragging = false;
|
||||
this.browser.isDragSource = false;
|
||||
};
|
||||
|
||||
this.onload = () => {
|
||||
if (this.file.properties.average_color) {
|
||||
anime({
|
||||
targets: this.refs.thumbnail,
|
||||
backgroundColor: `rgba(${this.file.properties.average_color.join(',')}, 0)`,
|
||||
duration: 100,
|
||||
easing: 'linear'
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
</mk-drive-browser-file>
|
||||
|
@ -53,7 +53,13 @@
|
||||
</mk-images>
|
||||
|
||||
<mk-images-image>
|
||||
<a ref="view" href={ image.url } onmousemove={ mousemove } onmouseleave={ mouseleave } style={ 'background-image: url(' + image.url + '?thumbnail&size=512' } onclick={ click } title={ image.name }></a>
|
||||
<a ref="view"
|
||||
href={ image.url }
|
||||
onmousemove={ mousemove }
|
||||
onmouseleave={ mouseleave }
|
||||
style={ styles }
|
||||
onclick={ click }
|
||||
title={ image.name }></a>
|
||||
<style>
|
||||
:scope
|
||||
display block
|
||||
@ -74,6 +80,11 @@
|
||||
</style>
|
||||
<script>
|
||||
this.image = this.opts.image;
|
||||
this.styles = {
|
||||
'background-color': `rgb(${this.image.properties.average_color.join(',')})`,
|
||||
'background-image': `url(${this.image.url}?thumbnail&size=512)`
|
||||
};
|
||||
console.log(this.styles);
|
||||
|
||||
this.mousemove = e => {
|
||||
const rect = this.refs.view.getBoundingClientRect();
|
||||
|
@ -1,6 +1,11 @@
|
||||
<mk-drive-file-viewer>
|
||||
<div class="preview">
|
||||
<img if={ kind == 'image' } src={ file.url } alt={ file.name } title={ file.name } onload={ onImageLoaded } ref="img">
|
||||
<img if={ kind == 'image' } ref="img"
|
||||
src={ file.url }
|
||||
alt={ file.name }
|
||||
title={ file.name }
|
||||
onload={ onImageLoaded }
|
||||
style="background-color:rgb({ file.properties.average_color.join(',') })">
|
||||
<virtual if={ kind != 'image' }>%fa:file%</virtual>
|
||||
<footer if={ kind == 'image' && file.properties && file.properties.width && file.properties.height }>
|
||||
<span class="size">
|
||||
|
@ -1,7 +1,7 @@
|
||||
<mk-drive-file data-is-selected={ isSelected }>
|
||||
<a onclick={ onclick } href="/i/drive/file/{ file.id }">
|
||||
<div class="container">
|
||||
<div class="thumbnail" style={ 'background-image: url(' + file.url + '?thumbnail&size=128)' }></div>
|
||||
<div class="thumbnail" style={ thumbnail }></div>
|
||||
<div class="body">
|
||||
<p class="name"><span>{ file.name.lastIndexOf('.') != -1 ? file.name.substr(0, file.name.lastIndexOf('.')) : file.name }</span><span class="ext" if={ file.name.lastIndexOf('.') != -1 }>{ file.name.substr(file.name.lastIndexOf('.')) }</span></p>
|
||||
<!--
|
||||
@ -132,6 +132,10 @@
|
||||
|
||||
this.browser = this.parent;
|
||||
this.file = this.opts.file;
|
||||
this.thumbnail = {
|
||||
'background-color': this.file.properties.average_color ? `rgb(${this.file.properties.average_color.join(',')})` : 'transparent',
|
||||
'background-image': `url(${this.file.url}?thumbnail&size=128)`
|
||||
};
|
||||
this.isSelected = this.browser.selectedFiles.some(f => f.id == this.file.id);
|
||||
|
||||
this.browser.on('change-selection', selections => {
|
||||
|
@ -56,7 +56,7 @@
|
||||
</mk-images>
|
||||
|
||||
<mk-images-image>
|
||||
<a ref="view" href={ image.url } target="_blank" style={ 'background-image: url(' + image.url + '?thumbnail&size=512' } title={ image.name }></a>
|
||||
<a ref="view" href={ image.url } target="_blank" style={ styles } title={ image.name }></a>
|
||||
<style>
|
||||
:scope
|
||||
display block
|
||||
@ -74,5 +74,9 @@
|
||||
</style>
|
||||
<script>
|
||||
this.image = this.opts.image;
|
||||
this.styles = {
|
||||
'background-color': `rgb(${this.image.properties.average_color.join(',')})`,
|
||||
'background-image': `url(${this.image.url}?thumbnail&size=512)`
|
||||
};
|
||||
</script>
|
||||
</mk-images-image>
|
||||
|
67
tools/migration/node.2017-12-11.js
Normal file
67
tools/migration/node.2017-12-11.js
Normal file
@ -0,0 +1,67 @@
|
||||
// for Node.js interpret
|
||||
|
||||
const { default: DriveFile, getGridFSBucket } = require('../../built/api/models/drive-file')
|
||||
const { default: zip } = require('@prezzemolo/zip')
|
||||
|
||||
const _gm = require('gm');
|
||||
const gm = _gm.subClass({
|
||||
imageMagick: true
|
||||
});
|
||||
|
||||
const migrate = doc => new Promise(async (res, rej) => {
|
||||
const bucket = await getGridFSBucket();
|
||||
|
||||
const readable = bucket.openDownloadStream(doc._id);
|
||||
|
||||
gm(readable)
|
||||
.setFormat('ppm')
|
||||
.resize(1, 1)
|
||||
.toBuffer(async (err, buffer) => {
|
||||
if (err) rej(err);
|
||||
const r = buffer.readUInt8(buffer.length - 3);
|
||||
const g = buffer.readUInt8(buffer.length - 2);
|
||||
const b = buffer.readUInt8(buffer.length - 1);
|
||||
|
||||
const result = await DriveFile.update(doc._id, {
|
||||
$set: {
|
||||
'metadata.properties.average_color': [r, g, b]
|
||||
}
|
||||
})
|
||||
|
||||
res(result.ok === 1);
|
||||
});
|
||||
});
|
||||
|
||||
async function main() {
|
||||
const query = {
|
||||
contentType: {
|
||||
$in: [
|
||||
'image/png',
|
||||
'image/jpeg'
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
const count = await DriveFile.count(query);
|
||||
|
||||
const dop = Number.parseInt(process.argv[2]) || 5
|
||||
const idop = ((count - (count % dop)) / dop) + 1
|
||||
|
||||
return zip(
|
||||
1,
|
||||
async (time) => {
|
||||
console.log(`${time} / ${idop}`)
|
||||
const doc = await DriveFile.find(query, {
|
||||
limit: dop, skip: time * dop
|
||||
})
|
||||
return Promise.all(doc.map(migrate))
|
||||
},
|
||||
idop
|
||||
).then(a => {
|
||||
const rv = []
|
||||
a.forEach(e => rv.push(...e))
|
||||
return rv
|
||||
})
|
||||
}
|
||||
|
||||
main().then(console.dir).catch(console.error)
|
Loading…
Reference in New Issue
Block a user