usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

(add) スクショにロゴの透かしを入れる

This commit is contained in:
kakkokari-gtyih 2024-01-09 00:12:19 +09:00
parent 5e1ed4a0c7
commit eec47b07cb
1 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
packages/frontend/src/pages/drop-and-fusion.vue
View File

@ -587,6 +587,16 @@ function updateSettings<
}); });
} }
function loadImage(url: string) {
return new Promise<HTMLImageElement>(res => {
const img = new Image();
img.src = url;
img.addEventListener('load', () => {
res(img);
});
});
}
function getGameImageDriveFile() { function getGameImageDriveFile() {
return new Promise<Misskey.entities.DriveFile | null>(res => { return new Promise<Misskey.entities.DriveFile | null>(res => {
const dcanvas = document.createElement('canvas'); const dcanvas = document.createElement('canvas');
@ -594,13 +604,18 @@ function getGameImageDriveFile() {
dcanvas.height = GAME_HEIGHT; dcanvas.height = GAME_HEIGHT;
const ctx = dcanvas.getContext('2d'); const ctx = dcanvas.getContext('2d');
if (!ctx || !canvasEl.value) return res(null); if (!ctx || !canvasEl.value) return res(null);
const dimage = new Image(); Promise.all([
dimage.src = '/client-assets/drop-and-fusion/frame-light.svg'; loadImage('/client-assets/drop-and-fusion/frame-light.svg'),
dimage.addEventListener('load', () => { loadImage('/client-assets/drop-and-fusion/logo.png'),
]).then((images) => {
const [frame, logo] = images;
ctx.fillStyle = '#fff'; ctx.fillStyle = '#fff';
ctx.fillRect(0, 0, GAME_WIDTH, GAME_HEIGHT); ctx.fillRect(0, 0, GAME_WIDTH, GAME_HEIGHT);
ctx.drawImage(dimage, 0, 0, GAME_WIDTH, GAME_HEIGHT); ctx.drawImage(frame, 0, 0, GAME_WIDTH, GAME_HEIGHT);
ctx.drawImage(canvasEl.value!, 0, 0, GAME_WIDTH, GAME_HEIGHT); ctx.drawImage(canvasEl.value!, 0, 0, GAME_WIDTH, GAME_HEIGHT);
ctx.globalAlpha = 0.7;
ctx.drawImage(logo, GAME_WIDTH * 0.55, 6, GAME_WIDTH * 0.45, GAME_WIDTH * 0.45 * (logo.height / logo.width));
ctx.globalAlpha = 1;
dcanvas.toBlob(blob => { dcanvas.toBlob(blob => {
if (!blob) return res(null); if (!blob) return res(null);
@ -626,7 +641,8 @@ function getGameImageDriveFile() {
}, 'image/png'); }, 'image/png');
dcanvas.remove(); dcanvas.remove();
});
})
}); });
} }