diff --git a/assets/images/glitch.png b/assets/images/glitch.png new file mode 100644 index 00000000..4b089f75 Binary files /dev/null and b/assets/images/glitch.png differ diff --git a/commands/avatar-edit/contrast.js b/commands/avatar-edit/contrast.js new file mode 100644 index 00000000..dddc85e4 --- /dev/null +++ b/commands/avatar-edit/contrast.js @@ -0,0 +1,47 @@ +const { Command } = require('discord.js-commando'); +const { createCanvas, loadImage } = require('canvas'); +const snekfetch = require('snekfetch'); +const { contrast } = require('../../util/Canvas'); + +module.exports = class ContrastCommand extends Command { + constructor(client) { + super(client, { + name: 'contrast', + group: 'avatar-edit', + memberName: 'contrast', + description: 'Draws a user\'s avatar, but with contrast.', + throttling: { + usages: 1, + duration: 15 + }, + clientPermissions: ['ATTACH_FILES'], + args: [ + { + key: 'user', + prompt: 'Which user would you like to edit the avatar of?', + type: 'user', + default: '' + } + ] + }); + } + + async run(msg, { user }) { + if (!user) user = msg.author; + const avatarURL = user.displayAvatarURL({ + format: 'png', + size: 512 + }); + try { + const { body } = await snekfetch.get(avatarURL); + const avatar = await loadImage(body); + const canvas = createCanvas(avatar.width, avatar.height); + const ctx = canvas.getContext('2d'); + ctx.drawImage(avatar, 0, 0); + contrast(ctx, 0, 0, avatar.width, avatar.height); + return msg.say({ files: [{ attachment: canvas.toBuffer(), name: 'contrast.png' }] }); + } catch (err) { + return msg.reply(`Oh no, an error occurred: \`${err.message}\`. Try again later!`); + } + } +}; diff --git a/commands/avatar-edit/distort.js b/commands/avatar-edit/distort.js index f778b900..f96aff15 100644 --- a/commands/avatar-edit/distort.js +++ b/commands/avatar-edit/distort.js @@ -7,6 +7,7 @@ module.exports = class DistortCommand extends Command { constructor(client) { super(client, { name: 'distort', + aliases: ['under-water'], group: 'avatar-edit', memberName: 'distort', description: 'Draws a user\'s avatar but distorted.', @@ -43,7 +44,7 @@ module.exports = class DistortCommand extends Command { const canvas = createCanvas(avatar.width, avatar.height); const ctx = canvas.getContext('2d'); ctx.drawImage(avatar, 0, 0); - distort(ctx, 0, 0, avatar.width, avatar.height, level); + distort(ctx, level, 0, 0, avatar.width, avatar.height); return msg.say({ files: [{ attachment: canvas.toBuffer(), name: 'distort.png' }] }); } catch (err) { return msg.reply(`Oh no, an error occurred: \`${err.message}\`. Try again later!`); diff --git a/commands/avatar-edit/food-broke.js b/commands/avatar-edit/food-broke.js index 53871051..b1ade962 100644 --- a/commands/avatar-edit/food-broke.js +++ b/commands/avatar-edit/food-broke.js @@ -2,6 +2,7 @@ const { Command } = require('discord.js-commando'); const { createCanvas, loadImage } = require('canvas'); const snekfetch = require('snekfetch'); const path = require('path'); +const { contrast } = require('../../util/Canvas'); module.exports = class FoodBrokeCommand extends Command { constructor(client) { @@ -41,7 +42,9 @@ module.exports = class FoodBrokeCommand extends Command { const ctx = canvas.getContext('2d'); ctx.drawImage(base, 0, 0); ctx.drawImage(avatar, 23, 9, 125, 125); + contrast(ctx, 23, 9, 125, 125); ctx.drawImage(avatar, 117, 382, 75, 75); + contrast(ctx, 117, 382, 75, 75); return msg.say({ files: [{ attachment: canvas.toBuffer(), name: 'food-broke.png' }] }); } catch (err) { return msg.reply(`Oh no, an error occurred: \`${err.message}\`. Try again later!`); diff --git a/commands/avatar-edit/glitch.js b/commands/avatar-edit/glitch.js index 38ff4278..cbe8ddf1 100644 --- a/commands/avatar-edit/glitch.js +++ b/commands/avatar-edit/glitch.js @@ -1,7 +1,7 @@ const { Command } = require('discord.js-commando'); const { createCanvas, loadImage } = require('canvas'); const snekfetch = require('snekfetch'); -const { distort } = require('../../util/Canvas'); +const path = require('path'); module.exports = class GlitchCommand extends Command { constructor(client) { @@ -33,12 +33,13 @@ module.exports = class GlitchCommand extends Command { size: 512 }); try { + const base = await loadImage(path.join(__dirname, '..', '..', 'assets', 'images', 'approved.png')); const { body } = await snekfetch.get(avatarURL); const avatar = await loadImage(body); const canvas = createCanvas(avatar.width, avatar.height); const ctx = canvas.getContext('2d'); ctx.drawImage(avatar, 0, 0); - distort(ctx, 0, 0, avatar.width, avatar.height, 20, 5); + ctx.drawImage(base, 0, 0, avatar.width, avatar.height); return msg.say({ files: [{ attachment: canvas.toBuffer(), name: 'glitch.png' }] }); } catch (err) { return msg.reply(`Oh no, an error occurred: \`${err.message}\`. Try again later!`); diff --git a/commands/avatar-edit/he-lives-in-you.js b/commands/avatar-edit/he-lives-in-you.js index 427df749..e5114363 100644 --- a/commands/avatar-edit/he-lives-in-you.js +++ b/commands/avatar-edit/he-lives-in-you.js @@ -2,6 +2,7 @@ const { Command } = require('discord.js-commando'); const { createCanvas, loadImage } = require('canvas'); const snekfetch = require('snekfetch'); const path = require('path'); +const { distort, drawImageWithTint } = require('../../util/Canvas'); module.exports = class HeLivesInYouCommand extends Command { constructor(client) { @@ -41,7 +42,8 @@ module.exports = class HeLivesInYouCommand extends Command { const ctx = canvas.getContext('2d'); ctx.drawImage(base, 0, 0); ctx.rotate(-24 * (Math.PI / 180)); - ctx.drawImage(avatar, 75, 160, 130, 150); + drawImageWithTint(ctx, avatar, '#00115d', 75, 160, 130, 150); + distort(ctx, 5, 75, 160, 130, 150); ctx.rotate(24 * (Math.PI / 180)); return msg.say({ files: [{ attachment: canvas.toBuffer(), name: 'he-lives-in-you.png' }] }); } catch (err) { diff --git a/package.json b/package.json index 8a29ab98..bf565cbf 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "xiaobot", - "version": "51.4.3", + "version": "51.5.0", "description": "Your personal server companion.", "main": "XiaoBot.js", "scripts": { diff --git a/util/Canvas.js b/util/Canvas.js index ee2611ce..ae041ff3 100644 --- a/util/Canvas.js +++ b/util/Canvas.js @@ -45,16 +45,29 @@ class CanvasUtil { return ctx; } - static distort(ctx, x, y, width, height, amplitude, strideLevel = 4) { + static contrast(ctx, x, y, width, height) { + const data = ctx.getImageData(x, y, width, height); + const factor = (259 / 100) + 1; + const intercept = 128 * (1 - factor); + for (let i = 0; i < data.data.length; i += 4) { + data.data[i] = (data.data[i] * factor) + intercept; + data.data[i + 1] = (data.data[i + 1] * factor) + intercept; + data.data[i + 2] = (data.data[i + 2] * factor) + intercept; + } + ctx.putImageData(data, x, y); + return ctx; + } + + static distort(ctx, amplitude, x, y, width, height) { const data = ctx.getImageData(x, y, width, height); const temp = ctx.getImageData(x, y, width, height); - const stride = width * strideLevel; + const stride = width * 4; for (let i = 0; i < width; i++) { for (let j = 0; j < height; j++) { const xs = Math.round(amplitude * Math.sin(2 * Math.PI * 3 * (j / height))); const ys = Math.round(amplitude * Math.cos(2 * Math.PI * 3 * (i / width))); - const dest = (j * stride) + (i * strideLevel); - const src = ((j + ys) * stride) + ((i + xs) * strideLevel); + const dest = (j * stride) + (i * 4); + const src = ((j + ys) * stride) + ((i + xs) * 4); data.data[dest] = temp.data[src]; data.data[dest + 1] = temp.data[src + 1]; data.data[dest + 2] = temp.data[src + 2];