├── .gitignore
├── organization_id_location.png
├── src
├── Commands.ts
├── phrases
│ └── phrases.json
├── Command.ts
├── Actions.ts
├── listeners
│ ├── ready.ts
│ └── interactionCreate.ts
├── Action.ts
├── Bot.ts
├── utils
│ ├── openai.ts
│ ├── constants.ts
│ ├── image.ts
│ └── discord.ts
├── actions
│ ├── Save.ts
│ ├── Reroll.ts
│ └── Expand.ts
└── commands
│ └── Draw.ts
├── package.json
├── tsconfig.json
├── .github
└── ISSUE_TEMPLATE
│ └── bug_report.md
├── LICENSE
└── README.md
/.gitignore:
--------------------------------------------------------------------------------
1 | dist/**
2 | node_modules/**
3 | src/utils/config.json
4 | .DS_STORE
5 |
--------------------------------------------------------------------------------
/organization_id_location.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/openai/dallify-discord-bot/HEAD/organization_id_location.png
--------------------------------------------------------------------------------
/src/Commands.ts:
--------------------------------------------------------------------------------
1 | import { Command } from "./Command";
2 | import { Draw } from "./commands/Draw";
3 |
4 | export const Commands: Command[] = [Draw];
5 |
--------------------------------------------------------------------------------
/src/phrases/phrases.json:
--------------------------------------------------------------------------------
1 | {
2 | "phrases": [
3 | "I drew this!",
4 | "Here's your picture!",
5 | "Thanks for waiting!",
6 | "I made this!",
7 | "Here you go!",
8 | "This is for you!"
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/src/Command.ts:
--------------------------------------------------------------------------------
1 | import {
2 | ChatInputCommandInteraction,
3 | ChatInputApplicationCommandData,
4 | Client,
5 | } from "discord.js";
6 |
7 | export interface Command extends ChatInputApplicationCommandData {
8 | run: (client: Client, interaction: ChatInputCommandInteraction) => void;
9 | }
10 |
--------------------------------------------------------------------------------
/src/Actions.ts:
--------------------------------------------------------------------------------
1 | import { Action } from "./Action";
2 | import { Save } from "./actions/Save";
3 | import { Reroll } from "./actions/Reroll";
4 | import { Expand } from "./actions/Expand";
5 |
6 | export const Actions: Action[] = [Save, Reroll, Expand];
7 |
8 | export function defaultActions(count: number) {
9 | return [Reroll, Save];
10 | }
11 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "main": "src/Bot.ts",
3 | "scripts": {
4 | "start": "ts-node src/Bot.ts"
5 | },
6 | "author": "OpenAI",
7 | "license": "MIT",
8 | "dependencies": {
9 | "@types/node": "^18.11.9",
10 | "@types/sharp": "^0.31.0",
11 | "axios": "^1.1.3",
12 | "discord.js": "^14.8.0",
13 | "openai": "^4.24.1",
14 | "sharp": "^0.31.1",
15 | "typescript": "^4.8.4",
16 | "ts-node": "^10.9.1"
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/listeners/ready.ts:
--------------------------------------------------------------------------------
1 | import { Client } from "discord.js";
2 | import { Commands } from "../Commands";
3 |
4 | export default (client: Client): void => {
5 | client.on("ready", async () => {
6 | if (!client.user || !client.application) {
7 | return;
8 | }
9 |
10 | // Global command registration, takes up to an hour to register.
11 | await client.application.commands.set(Commands);
12 |
13 | console.log(`${client.user.username} is online`);
14 | });
15 | };
16 |
--------------------------------------------------------------------------------
/src/Action.ts:
--------------------------------------------------------------------------------
1 | import { Client, ButtonInteraction } from "discord.js";
2 | import {Quality, Style} from "./utils/constants";
3 |
4 | // Add more to the context as your actions need them
5 | export interface CustomIdContext {
6 | count: number; // number of images in the generation
7 | quality: Quality; // quality of generation (standard/hd)
8 | style: Style; // style of generation (vivid/natural)
9 | width: number;
10 | height: number;
11 | }
12 | export interface Action {
13 | displayText: string;
14 | isAction: (customId: string) => boolean;
15 | customId: (context: CustomIdContext) => string;
16 | run: (client: Client, interaction: ButtonInteraction) => void;
17 | }
18 |
--------------------------------------------------------------------------------
/src/Bot.ts:
--------------------------------------------------------------------------------
1 | import { DISCORD_BOT_TOKEN, DISCORD_BOT_CLIENT_ID } from "./utils/constants";
2 |
3 | import { Client, ClientOptions } from "discord.js";
4 | import ready from "./listeners/ready";
5 | import interactionCreate from "./listeners/interactionCreate";
6 |
7 | // Scopes required:
8 | // bot: Send Messages, Attach Files, Use Slash Commands
9 | console.log("Use this link to add the bot to your server!");
10 | console.log(
11 | `https://discord.com/api/oauth2/authorize?client_id=${DISCORD_BOT_CLIENT_ID}&permissions=2147518464&scope=bot`
12 | );
13 |
14 | const client = new Client({
15 | intents: [],
16 | });
17 |
18 | ready(client);
19 | interactionCreate(client);
20 |
21 | client.login(DISCORD_BOT_TOKEN);
22 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "ESNext",
4 | "module": "commonjs",
5 | "rootDir": "./src/",
6 | "outDir": "./dist/",
7 | "strict": true,
8 | "moduleResolution": "node",
9 | "importHelpers": true,
10 | "experimentalDecorators": true,
11 | "esModuleInterop": true,
12 | "skipLibCheck": true,
13 | "allowSyntheticDefaultImports": true,
14 | "resolveJsonModule": true,
15 | "forceConsistentCasingInFileNames": true,
16 | "removeComments": true,
17 | "typeRoots": ["node_modules/@types"],
18 | "sourceMap": false,
19 | "baseUrl": "./"
20 | },
21 | "files": ["src/Bot.ts"],
22 | "include": ["./**/*.ts"],
23 | "exclude": ["node_modules", "dist"]
24 | }
25 |
--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/bug_report.md:
--------------------------------------------------------------------------------
1 | ---
2 | name: Bug report
3 | about: Is there a bug in the bot code?
4 | title: ''
5 | labels: bug
6 | assignees: ''
7 |
8 | ---
9 |
10 | **Describe the bug**
11 | A clear and concise description of what the bug is.
12 |
13 | **To Reproduce**
14 | Steps to reproduce the behavior:
15 | 1. Go to '...'
16 | 2. Click on '....'
17 | 3. Scroll down to '....'
18 | 4. See error
19 |
20 | **Expected behavior**
21 | A clear and concise description of what you expected to happen.
22 |
23 | **Screenshots**
24 | If applicable, add screenshots to help explain your problem.
25 |
26 | **Desktop (please complete the following information):**
27 | - Windows/OSX/Linux/etc
28 | - version
29 |
30 | **Additional context**
31 | Add any other context about the problem here.
32 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2022 OpenAI
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/src/utils/openai.ts:
--------------------------------------------------------------------------------
1 | import { OPENAI_API_KEY, OPENAI_ORGANIZATION} from "./constants";
2 | import OpenAI from "openai";
3 | import {Image, ImagesResponse} from "openai/resources";
4 |
5 | // Allow Buffer to be used for arguments that require File.
6 | declare module "buffer" {
7 | // Return any so it can be used in our SDK calls that require File.
8 | // The codegen we use makes the type File but any type that works with FormData
9 | // works.
10 | interface Buffer {
11 | toPngImageBuffer: () => any;
12 | }
13 | }
14 |
15 | // To make Buffers work in FormData without passing in options argument,
16 | // we need to tell it the file type by giving it a filepath with the extension.
17 | // Import Buffer from this file, then call toPngImageBuffer() on your Buffers
18 | // before passing them in.
19 | Buffer.prototype.toPngImageBuffer = function () {
20 | this.path = "image.png";
21 | return this;
22 | };
23 |
24 | export { Buffer } from "buffer";
25 |
26 | type OpenAIApiSize = "1024x1024" | "1024x1792" | "1792x1024" | "256x256" | "512x512";
27 |
28 | export const configuration = new OpenAI({
29 | apiKey: OPENAI_API_KEY,
30 | organization: OPENAI_ORGANIZATION,
31 | });
32 |
33 | export function imagesFromBase64Response(response: Image[]): Buffer[] {
34 | const resultData: string[] = response.map((d) => d.b64_json) as string[];
35 | return resultData.map((j) => Buffer.from(j, "base64"));
36 | }
37 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Please read!
2 |
3 |
4 | **For any problems running this specific bot:** [Discord Project Post](https://discord.com/channels/974519864045756446/1039968564699992106)
5 |
6 | **For general OpenAI API problems or questions:** [Discord API Discussions](https://discord.com/channels/974519864045756446/1037561178286739466)
7 |
8 | **For bugs in the template code:** create an Issue
9 |
10 | **For feature requests:** this repo is not accepting feature requests, you can discuss potential features in [Discord Project Post](https://discord.com/channels/974519864045756446/1039968564699992106)
11 |
12 | **For PRs:** only bug fix PRs wil be accepted. If you are implementing a new feature, please fork this repo.
13 |
14 | Thank you!
15 |
16 | ---
17 | Example code for running a Discord Bot that uses OpenAI's DALL-E api to generate AI images.
18 |
19 | This bot uses OpenAI's NodeJS SDK, and v14 of discord.js, and is written in Typescript.
20 |
21 |
22 | # Features include:
23 |
24 | - draw command to generate images (1 to 9) using the generations endpoint
25 | - save button to send images to user's DMs
26 | - reroll button to rerun that generation
27 | - expand button to zoom out of the image by using the edits (inpaint) endpoint
28 |
29 | # Discord Bot setup:
30 |
31 | https://discordjs.guide/preparations/setting-up-a-bot-application.html
32 |
33 | Your bot needs the following bot permissions:
34 |
35 | - Send Messages
36 | - Use Slash Commands
37 | - Attach Files
38 |
39 | Use the invite link in `src/Bot.ts`, which includes the above permissions.
40 |
41 | # Secrets setup:
42 |
43 | 1. Go to `src/utils/constants.ts` and follow the comments to create `src/utils/config.json`
44 | 2. Copy your bot's client id and token into `config.json`
45 | 3. Copy your server's id into `config.json` (https://support.discord.com/hc/en-us/articles/206346498-Where-can-I-find-my-User-Server-Message-ID-)
46 | 4. Copy your OpenAI API key into `config.json` (https://platform.openai.com/api-keys)
47 | 5. Copy your OpenAI Organization ID into `config.json` (https://platform.openai.com/account/organization)
48 | 
49 | # Node server setup:
50 |
51 | 1. install brew if you don't have it (https://docs.brew.sh/Installation)
52 | 2. `brew install npm` if you don't have it
53 | 3. `npm install` in repo root
54 | 4. `npm run start` in repo root
55 |
56 |
57 |
--------------------------------------------------------------------------------
/src/utils/constants.ts:
--------------------------------------------------------------------------------
1 | import * as config from "./config.json";
2 | export const DISCORD_BOT_TOKEN =
3 | process.env.DISCORD_BOT_TOKEN ?? config.DISCORD_BOT_TOKEN;
4 | export const DISCORD_BOT_CLIENT_ID =
5 | process.env.DISCORD_BOT_CLIENT_ID ?? config.DISCORD_BOT_CLIENT_ID;
6 |
7 | export const OPENAI_API_KEY =
8 | process.env.OPENAI_API_KEY ?? config.OPENAI_API_KEY;
9 |
10 | export const OPENAI_ORGANIZATION = process.env.OPENAI_ORGANIZATION ?? config.OPENAI_ORGANIZATION;
11 | export const ALLOWED_SERVER_IDS: string[] = process.env.ALLOWED_SERVER_IDS ? process.env.ALLOWED_SERVER_IDS.split(",") : config.ALLOWED_SERVER_IDS ?? []; // only servers with these ids can use the bot
12 |
13 | /* To set these constants without hardcoding, create a json file at:
14 | src/utils/config.json
15 | and set its contents to the below, with your values
16 | {
17 | "DISCORD_BOT_TOKEN": "my-discord-bot-token",
18 | "DISCORD_BOT_CLIENT_ID": "my-discord-bot-app-id",
19 | "OPENAI_API_KEY": "sk-my-openai-api-key",
20 | "OPENAI_ORGANIZATION": "my-openai-organization-id",
21 | "ALLOWED_SERVER_IDS": [
22 | "my-server-id-1",
23 | "my-server-id-2"
24 | ]
25 | }
26 | */
27 | if (!DISCORD_BOT_CLIENT_ID) {
28 | throw "DISCORD_BOT_CLIENT_ID must be set in env or config";
29 | }
30 | if (!DISCORD_BOT_TOKEN) {
31 | throw "DISCORD_BOT_TOKEN must be set in env or config";
32 | }
33 | if (!OPENAI_API_KEY) {
34 | throw "OPENAI_API_KEY must be set in env or config";
35 | }
36 | export const MAX_IMAGES = 4; // the API supports 1 to 10 images per request
37 | export const DEFAULT_IMAGES = 2; // This is used when no number is given
38 | export type Size = "1024x1024" | "1792x1024" | "1024x1792";
39 | export const DEFAULT_IMAGE_SIZE: number = 1024; // Valid options are 1024 (1024x1024), 1792 (1024x1792), -1792 (1792x1024)
40 | export const EXPAND_ACTION_PADDING = 120; // How many pixels the Expand action adds on each side.
41 | export const EXPAND_ACTION_NUM_IMAGES = 2; // how many images to show for an expand action
42 | export const LOG_ERRORS = true;
43 |
44 | // The style of the generated images. Must be one of vivid or natural. Vivid causes the model to lean towards generating hyper-real and dramatic images.
45 | // Natural causes the model to produce more natural, less hyper-real looking images.
46 | export type Style = "vivid" | "natural" | undefined | null;
47 | export const DEFAULT_STYLE: Style = "vivid";
48 | export type Quality = "standard" | "hd";
49 | export const DEFAULT_QUALITY: Quality = "standard"; // The quality of the image that will be generated. hd creates images with finer details and greater consistency across the image.
50 |
51 |
52 | if (DEFAULT_IMAGES > MAX_IMAGES) {
53 | throw `DEFAULT_IMAGES must not be greater than MAX_IMAGES`;
54 | }
55 |
56 | // The API only supports these
57 | if (![1024, 1792, -1792].includes(DEFAULT_IMAGE_SIZE)) {
58 | throw `Invalid IMAGE_SIZE ${DEFAULT_IMAGE_SIZE}`;
59 | }
60 |
--------------------------------------------------------------------------------
/src/actions/Save.ts:
--------------------------------------------------------------------------------
1 | import {
2 | AttachmentBuilder,
3 | Client,
4 | ButtonInteraction,
5 | ApplicationCommandOptionType,
6 | Embed,
7 | EmbedImageData,
8 | } from "discord.js";
9 | import { Action, CustomIdContext } from "../Action";
10 | import { fetchImagesFromComposite } from "../utils/discord";
11 |
12 | const MAX_PROMPT_CHAR_IN_FILENAME = 200;
13 |
14 | function createFileName(prompt: string, num: number): string {
15 | let trimmedPrompt = prompt.trim();
16 | if (trimmedPrompt.length > MAX_PROMPT_CHAR_IN_FILENAME) {
17 | trimmedPrompt = trimmedPrompt.substring(0, MAX_PROMPT_CHAR_IN_FILENAME);
18 | }
19 | const filename = trimmedPrompt.replace(/[/\\?%*:|"<>\n]/g, "-");
20 | return `DALL-E_${filename}_${num}.png`;
21 | }
22 |
23 | export const Save: Action = {
24 | displayText: "💌 Save",
25 | isAction: (customId: string) => {
26 | return customId.startsWith("save:");
27 | },
28 | customId: (context: CustomIdContext) => {
29 | return `save:${context.count},${context.quality},${context.style},${context.width},${context.height}`;
30 | },
31 | run: async (client: Client, interaction: ButtonInteraction) => {
32 | if (interaction.message.embeds.length == 0) {
33 | return;
34 | }
35 | const customId = interaction.customId;
36 | const matchResults = customId.match(/save:(\d)/);
37 | if (!matchResults || matchResults.length != 2) {
38 | return;
39 | }
40 | const matchParams = customId.replace("save:", "").split(",");
41 |
42 | const count = parseInt(matchParams[0]);
43 | const embed = interaction.message.embeds[0];
44 | const prompt = embed.description ?? "";
45 | const width = parseInt(matchParams[3]);
46 | const height = parseInt(matchParams[4]);
47 |
48 | const images = await fetchImagesFromComposite(embed.image, count, width, height).catch(
49 | console.error
50 | );
51 | if (images == null) {
52 | interaction
53 | .reply({
54 | ephemeral: true,
55 | content: "Failed to process images for Save.",
56 | })
57 | .catch(console.error);
58 | return;
59 | }
60 |
61 | await interaction.user
62 | .send(
63 | `Hello! You wanted me to send you the image(s) I made!\nThe prompt was: ${prompt}`
64 | )
65 | .then((message) =>
66 | interaction
67 | .reply({
68 | ephemeral: true,
69 | content: "Sending images. Check your DMs!",
70 | })
71 | .catch(console.error)
72 | )
73 | .catch((error) =>
74 | interaction
75 | .reply({
76 | ephemeral: true,
77 | content: "You have DMs disabled. I cannot send you the images!",
78 | })
79 | .catch(console.error)
80 | );
81 |
82 | await interaction.user
83 | .send({
84 | files: images.map(
85 | (img, index) =>
86 | new AttachmentBuilder(img, {
87 | name: createFileName(prompt, index + 1),
88 | })
89 | ),
90 | })
91 | .catch(console.error);
92 | },
93 | };
94 |
--------------------------------------------------------------------------------
/src/actions/Reroll.ts:
--------------------------------------------------------------------------------
1 | import { Client, ButtonInteraction } from "discord.js";
2 | import { Action, CustomIdContext } from "../Action";
3 | import {
4 | imagesFromBase64Response,
5 | configuration
6 | } from "../utils/openai";
7 | import { createResponse, processOpenAIError } from "../utils/discord";
8 | import { defaultActions } from "../Actions";
9 | import {Quality, Size, Style} from "../utils/constants";
10 |
11 | export const Reroll: Action = {
12 | displayText: "🎲 Reroll",
13 | isAction: (customId: string) => {
14 | return customId.startsWith("reroll:");
15 | },
16 | customId: (context: CustomIdContext) => {
17 | return `reroll:${context.count},${context.quality},${context.style},${context.width},${context.height}`;
18 | },
19 | run: async (client: Client, interaction: ButtonInteraction) => {
20 | if (interaction.message.embeds.length == 0) {
21 | return;
22 | }
23 | const customId = interaction.customId;
24 | const matchResults = customId.match(/reroll:(\d)/);
25 | if (!matchResults || matchResults.length != 2) {
26 | return;
27 | }
28 | // Remove reroll: from the customId and split on commas
29 | const matchParams = customId.replace("reroll:", "").split(",");
30 |
31 | // Assert that we have the count[0], quality[1], and style[2] and width[3] and height[4]
32 | if (matchParams.length != 5) {
33 | return;
34 | }
35 |
36 | const embed = interaction.message.embeds[0];
37 | const prompt = embed.description;
38 | if (prompt == null) {
39 | await interaction.reply("Prompt must exist.");
40 | return;
41 | }
42 | const count = parseInt(matchParams[0]);
43 | const uuid = interaction.user.id;
44 | const quality = matchParams[1] as Quality;
45 | const style = matchParams[2] as Style;
46 | const width = parseInt(matchParams[3]);
47 | const height = parseInt(matchParams[4]);
48 | const size = `${width}x${height}` as Size;
49 |
50 |
51 | await interaction
52 | .reply({ content: `Rerolling for <@${uuid}>... 🎲` })
53 | .catch(console.error);
54 |
55 | try {
56 | const imagePromises = Array.from({ length: count }, () =>
57 | configuration.images.generate({
58 | prompt: prompt,
59 | n: 1, // Generate only one image per call (dall-e-3 restriction)
60 | size: size,
61 | response_format: "b64_json",
62 | model: "dall-e-3",
63 | quality: quality,
64 | style: style
65 | }).then(completion => imagesFromBase64Response(completion.data))
66 | );
67 |
68 | // Wait for all promises to resolve
69 | const imageArrays = await Promise.all(imagePromises);
70 | const images = imageArrays.flat();
71 |
72 | const context: CustomIdContext = {
73 | count: count,
74 | quality: quality,
75 | style: style,
76 | width: width,
77 | height: height
78 | }
79 | const response = await createResponse(
80 | prompt,
81 | images,
82 | defaultActions(count),
83 | context,
84 | );
85 | interaction
86 | .editReply({ ...response, content: `Rerolled for <@${uuid}>! 🎲` })
87 | .catch(console.error);
88 | } catch (e) {
89 | const response = processOpenAIError(e as any, prompt);
90 | interaction.editReply({ ...response }).catch(console.error);
91 | }
92 | },
93 | };
94 |
--------------------------------------------------------------------------------
/src/listeners/interactionCreate.ts:
--------------------------------------------------------------------------------
1 | import {
2 | CommandInteraction,
3 | Client,
4 | Interaction,
5 | GuildMember,
6 | PermissionsBitField,
7 | GuildTextBasedChannel,
8 | ChatInputCommandInteraction,
9 | ButtonInteraction,
10 | BaseInteraction,
11 | } from "discord.js";
12 | import { Commands } from "../Commands";
13 | import { ALLOWED_SERVER_IDS, LOG_ERRORS } from "../utils/constants";
14 | import { Actions } from "../Actions";
15 |
16 | export default (client: Client): void => {
17 | client.on("interactionCreate", async (interaction: Interaction) => {
18 | try {
19 | if (interaction.isCommand() || interaction.isContextMenuCommand()) {
20 | await handleSlashCommand(client, interaction);
21 | } else if (interaction.isButton()) {
22 | await handleButtonAction(client, interaction);
23 | }
24 | } catch (error) {
25 | if (LOG_ERRORS) {
26 | console.log(error);
27 | }
28 | }
29 | });
30 | };
31 |
32 | function checkPermissions(interaction: BaseInteraction): string | null {
33 | if (!interaction.inGuild()) {
34 | // no DM's, change if needed
35 | if (LOG_ERRORS) {
36 | console.log("Permissions error: No guild.");
37 | }
38 | return "**Error:** You don't have permission to do that.";
39 | }
40 |
41 | if (
42 | interaction.guildId &&
43 | !ALLOWED_SERVER_IDS.includes(interaction.guildId)
44 | ) {
45 | if (LOG_ERRORS) {
46 | console.log(
47 | `Permissions error: Guild ${interaction.guildId} not allowed.`
48 | );
49 | }
50 | return "**Error:** You don't have permission to do that.";
51 | }
52 |
53 | if (
54 | !interaction.appPermissions ||
55 | !interaction.appPermissions.has(PermissionsBitField.Flags.ViewChannel)
56 | ) {
57 | // Even though commands don't need ViewChannel, you can't selectively allow
58 | // commands in certain channels, so we implement permissions by using ViewChannel.
59 | if (LOG_ERRORS) {
60 | console.log(`Permissions error: Bot has no view perms in channel.`);
61 | }
62 | return "**Error:** You don't have permission to do that.";
63 | }
64 |
65 | if (
66 | !interaction.memberPermissions ||
67 | !interaction.memberPermissions.has(PermissionsBitField.Flags.SendMessages)
68 | ) {
69 | // Match bot perms to whether user has message perm
70 | if (LOG_ERRORS) {
71 | console.log(`Permissions error: User has no send perms in channel.`);
72 | }
73 | return "**Error:** You don't have permission to do that.";
74 | }
75 |
76 | return null;
77 | }
78 |
79 | const handleSlashCommand = async (
80 | client: Client,
81 | interaction: CommandInteraction
82 | ): Promise => {
83 | const permissionCheckResult = checkPermissions(interaction);
84 | if (permissionCheckResult) {
85 | await interaction
86 | .reply({ content: permissionCheckResult, ephemeral: true })
87 | .catch(console.error);
88 | return;
89 | }
90 |
91 | const slashCommand = Commands.find((c) => c.name === interaction.commandName);
92 | if (!slashCommand) {
93 | await interaction.reply({ content: "Missing command." });
94 | return;
95 | }
96 |
97 | if (!(interaction instanceof ChatInputCommandInteraction)) {
98 | interaction.reply({ content: "You do not have permission to use this." });
99 | return;
100 | }
101 |
102 | slashCommand.run(client, interaction);
103 | };
104 |
105 | const handleButtonAction = async (
106 | client: Client,
107 | interaction: ButtonInteraction
108 | ): Promise => {
109 | const permissionCheckResult = checkPermissions(interaction);
110 | if (permissionCheckResult) {
111 | await interaction
112 | .reply({ content: permissionCheckResult, ephemeral: true })
113 | .catch(console.error);
114 | return;
115 | }
116 |
117 | const action = Actions.find((c) => c.isAction(interaction.customId));
118 | if (!action) {
119 | // unhandled here, maybe it's handled somewhere else?
120 | return;
121 | }
122 |
123 | action.run(client, interaction);
124 | };
125 |
--------------------------------------------------------------------------------
/src/utils/image.ts:
--------------------------------------------------------------------------------
1 | import { Color, SharpOptions, OverlayOptions } from "sharp";
2 | import sharp from "sharp";
3 | import {DEFAULT_IMAGE_SIZE, EXPAND_ACTION_PADDING} from "./constants";
4 |
5 | const LOGO_SIZE = 10;
6 |
7 | function createLogoConfig(colors: Color): SharpOptions {
8 | return {
9 | create: {
10 | width: LOGO_SIZE,
11 | height: LOGO_SIZE,
12 | channels: 4,
13 | background: colors,
14 | },
15 | };
16 | }
17 |
18 | export async function createLogo(): Promise {
19 | const logoParts = [
20 | {
21 | input: await sharp(createLogoConfig({ r: 255, g: 255, b: 102, alpha: 1 }))
22 | .png()
23 | .toBuffer(),
24 | left: 0,
25 | top: 0,
26 | },
27 | {
28 | input: await sharp(createLogoConfig({ r: 66, g: 255, b: 255, alpha: 1 }))
29 | .png()
30 | .toBuffer(),
31 | left: LOGO_SIZE,
32 | top: 0,
33 | },
34 | {
35 | input: await sharp(createLogoConfig({ r: 81, g: 218, b: 76, alpha: 1 }))
36 | .png()
37 | .toBuffer(),
38 | left: LOGO_SIZE * 2,
39 | top: 0,
40 | },
41 | {
42 | input: await sharp(createLogoConfig({ r: 255, g: 110, b: 60, alpha: 1 }))
43 | .png()
44 | .toBuffer(),
45 | left: LOGO_SIZE * 3,
46 | top: 0,
47 | },
48 | {
49 | input: await sharp(createLogoConfig({ r: 60, g: 70, b: 255, alpha: 1 }))
50 | .png()
51 | .toBuffer(),
52 | left: LOGO_SIZE * 4,
53 | top: 0,
54 | },
55 | ];
56 |
57 | return await sharp({
58 | create: {
59 | width: LOGO_SIZE * 5,
60 | height: LOGO_SIZE,
61 | channels: 4,
62 | background: { r: 255, g: 255, b: 255, alpha: 0 },
63 | },
64 | })
65 | .composite(logoParts)
66 | .png()
67 | .toBuffer();
68 | }
69 |
70 | export async function createTiledComposite(
71 | imageBuffers: Buffer[],
72 | imageWidth: number = DEFAULT_IMAGE_SIZE,
73 | imageHeight: number = DEFAULT_IMAGE_SIZE
74 | ): Promise {
75 | let canvasWidth = imageWidth;
76 | let canvasHeight = imageHeight;
77 |
78 | if (imageBuffers.length === 2) {
79 | canvasWidth = imageWidth * 2; // Double the width for two images side by side
80 | canvasHeight = imageHeight; // Height remains the same
81 | } else if (imageBuffers.length === 3 || imageBuffers.length === 4) {
82 | canvasWidth = imageWidth * 2; // Double the width for a 2x2 grid
83 | canvasHeight = imageHeight * 2; // Double the height for a 2x2 grid
84 | }
85 |
86 | const images: OverlayOptions[] = imageBuffers.map((buffer, i) => {
87 | let left = (i % 2) * imageWidth; // 0 for quadrant 1 and 3, imageWidth for quadrant 2 and 4
88 | let top = i < 2 ? 0 : imageHeight; // 0 for quadrants 1 and 2, imageHeight for quadrants 3 and 4
89 |
90 | return {
91 | input: buffer,
92 | left: left,
93 | top: top,
94 | };
95 | });
96 |
97 | // If there are 3 images, the last quadrant should be empty, so no need to put any image there.
98 |
99 | return await sharp({
100 | create: {
101 | width: canvasWidth,
102 | height: canvasHeight,
103 | channels: 4,
104 | background: { r: 255, g: 255, b: 255, alpha: 0 },
105 | },
106 | })
107 | .composite(images)
108 | .png()
109 | .toBuffer();
110 | }
111 |
112 |
113 | // This is no longer in use for dall-e-3.
114 | export async function expandImage(buffer: Buffer): Promise {
115 | const result = await sharp(buffer)
116 | .extend({
117 | top: EXPAND_ACTION_PADDING,
118 | bottom: EXPAND_ACTION_PADDING,
119 | left: EXPAND_ACTION_PADDING,
120 | right: EXPAND_ACTION_PADDING,
121 | background: { r: 0, g: 0, b: 0, alpha: 0 },
122 | })
123 | .resize(DEFAULT_IMAGE_SIZE)
124 | .png()
125 | .toBuffer();
126 | return result;
127 | }
128 |
129 | // We need the numberOfImages because a composite may have empty spaces when the number of images
130 | // doesn't fit neatly into the composite dimensions.
131 | export async function extractImagesFromComposite(
132 | composite: Buffer,
133 | compositeWidth: number,
134 | compositeHeight: number,
135 | numberOfImages: number,
136 | imageWidth: number = DEFAULT_IMAGE_SIZE,
137 | imageHeight: number = DEFAULT_IMAGE_SIZE
138 | ): Promise {
139 | const images = [];
140 | var i = 0;
141 | for (let y = 0; y <= compositeHeight - imageHeight; y += imageHeight) {
142 | for (let x = 0; x <= compositeWidth - imageWidth; x += imageWidth) {
143 | const image = await sharp(composite)
144 | .extract({ left: x, top: y, width: imageWidth, height: imageHeight })
145 | .png()
146 | .toBuffer();
147 |
148 | images.push(image);
149 |
150 | i += 1;
151 | if (i == numberOfImages) {
152 | return images;
153 | }
154 | }
155 | }
156 | return images;
157 | }
158 |
--------------------------------------------------------------------------------
/src/utils/discord.ts:
--------------------------------------------------------------------------------
1 | import {
2 | AttachmentBuilder,
3 | EmbedBuilder,
4 | BaseMessageOptions,
5 | ActionRowBuilder,
6 | ButtonBuilder,
7 | ButtonStyle,
8 | EmbedImageData,
9 | ActionRow,
10 | MessageActionRowComponent,
11 | } from "discord.js";
12 | import { phrases } from "../phrases/phrases.json";
13 | import { createLogo, createTiledComposite } from "./image";
14 | import { Action, CustomIdContext } from "../Action";
15 | import { extractImagesFromComposite } from "./image";
16 | import { Actions } from "../Actions";
17 | import { LOG_ERRORS } from "./constants";
18 | import axios from "axios";
19 |
20 | export async function createResponse(
21 | prompt: string,
22 | imageBuffers: Buffer[],
23 | buttonActions: Action[],
24 | context: CustomIdContext
25 | ): Promise {
26 | const logo = await createLogo();
27 | const composite = await createTiledComposite(imageBuffers, context.width, context.height);
28 | const files = [
29 | new AttachmentBuilder(logo, { name: "logo.png" }),
30 | new AttachmentBuilder(composite, { name: "DALL-E.png" }),
31 | ];
32 | const randomPhrase = phrases[Math.floor(Math.random() * phrases.length)];
33 |
34 | const embed = new EmbedBuilder()
35 | .setImage("attachment://DALL-E.png")
36 | .setColor("#2ee66b")
37 | .setTitle(randomPhrase)
38 | .setDescription(prompt) // this is always the prompt, other objects read from this directly
39 | .setFooter({
40 | text: "Generated with DALL-E API",
41 | iconURL: "attachment://logo.png",
42 | });
43 |
44 | const row = rowFromActions(buttonActions, context);
45 | if (row) {
46 | return { embeds: [embed], files: files, components: [row] };
47 | } else {
48 | return { embeds: [embed], files: files, components: [] };
49 | }
50 | }
51 |
52 | export function actionsFromRow(
53 | row: ActionRow
54 | ): Action[] {
55 | var actions = [];
56 | for (const component of row.components) {
57 | const customId = component.customId;
58 | if (customId) {
59 | const action = Actions.find((c) => c.isAction(customId));
60 | if (action) {
61 | actions.push(action);
62 | }
63 | }
64 | }
65 | return actions;
66 | }
67 |
68 | export function rowFromActions(
69 | actions: Action[],
70 | context: CustomIdContext
71 | ): ActionRowBuilder | null {
72 | if (actions.length == 0) {
73 | return null;
74 | }
75 | var row = new ActionRowBuilder();
76 | for (const action of actions) {
77 | const button = new ButtonBuilder()
78 | .setCustomId(action.customId(context))
79 | .setLabel(action.displayText)
80 | .setStyle(ButtonStyle.Secondary);
81 | row = row.addComponents(button);
82 | }
83 | return row;
84 | }
85 |
86 | export function processOpenAIError(
87 | error: any,
88 | prompt: string
89 | ): BaseMessageOptions {
90 | var result = {};
91 | const response = error.response;
92 | if (response) {
93 | if (response.status == 429) {
94 | result = {
95 | content: `**Something went wrong!** I am slightly overworked.😮💨 Please wait a few minutes and I\'ll be good to go!\n Your prompt was: ${prompt}`,
96 | };
97 | } else if (response.status >= 500 && response.status < 600) {
98 | result = {
99 | content: `**Something went wrong!** The server is experiencing issues. Please try again later.\n Your prompt was: ${prompt}`,
100 | };
101 | } else if (response.data && response.data.error) {
102 | // custom error keys from the openai api
103 | result = {
104 | content: `**Something went wrong!** ${response.data.error.message} (${response.data.error.type}) \n Your prompt was: ${prompt}`,
105 | };
106 | } else {
107 | result = {
108 | content: `**Something went wrong!** ${response.statusText} (${response.status}) \n Your prompt was: ${prompt}`,
109 | };
110 | }
111 | } else {
112 | result = {
113 | content: `**Something went wrong!** ${error} \n Your prompt was: ${prompt}`,
114 | };
115 | }
116 |
117 | return result;
118 | }
119 |
120 | export async function fetchImagesFromComposite(
121 | compositeImageData: EmbedImageData | null,
122 | count: number,
123 | imageWidth: number,
124 | imageHeight: number
125 | ): Promise {
126 | if (!compositeImageData || count == 0) {
127 | return null;
128 | }
129 | const width = compositeImageData.width;
130 | const height = compositeImageData.height;
131 | if (!width || !height) {
132 | return null;
133 | }
134 |
135 | try {
136 | const { data, status } = await axios.get(compositeImageData.url, {
137 | responseType: "arraybuffer",
138 | });
139 | let compositeBuffer = Buffer.from(data);
140 | const images = await extractImagesFromComposite(
141 | compositeBuffer,
142 | width,
143 | height,
144 | count,
145 | imageWidth,
146 | imageHeight
147 | );
148 | return images;
149 | } catch (e) {
150 | if (LOG_ERRORS) {
151 | console.log(`Save encountered an error ${e}`);
152 | }
153 | return null;
154 | }
155 | }
156 |
--------------------------------------------------------------------------------
/src/commands/Draw.ts:
--------------------------------------------------------------------------------
1 | import {
2 | ChatInputCommandInteraction,
3 | Client,
4 | ApplicationCommandType,
5 | ApplicationCommandOptionType,
6 | } from "discord.js";
7 | import { Command } from "../Command";
8 | import {
9 | MAX_IMAGES,
10 | DEFAULT_IMAGES,
11 | DEFAULT_STYLE,
12 | DEFAULT_QUALITY,
13 | Style,
14 | Quality,
15 | Size
16 | } from "../utils/constants";
17 | import { createResponse, processOpenAIError } from "../utils/discord";
18 | import {
19 | imagesFromBase64Response, configuration,
20 | } from "../utils/openai";
21 | import { defaultActions } from "../Actions";
22 | import {CustomIdContext} from "../Action";
23 |
24 | export const Draw: Command = {
25 | name: "draw",
26 | description: "Generates images with DALL-E",
27 | type: ApplicationCommandType.ChatInput,
28 | options: [
29 | {
30 | type: ApplicationCommandOptionType.String,
31 | name: "prompt",
32 | description: "Describe the image you want to generate.",
33 | required: true,
34 | },
35 | {
36 | type: ApplicationCommandOptionType.Integer,
37 | name: "n",
38 | description: `The number of images you\'d like created. Max ${MAX_IMAGES}.`,
39 | required: false,
40 | minValue: 1,
41 | maxValue: MAX_IMAGES,
42 | },
43 | {
44 | type: ApplicationCommandOptionType.String,
45 | name: "quality",
46 | description: "The quality of the images. (standard/hd)",
47 | required: false,
48 | choices: [
49 | {
50 | name: "standard",
51 | value: "standard",
52 | },
53 | {
54 | name: "hd",
55 | value: "hd",
56 | }
57 | ]
58 | },
59 | {
60 | type: ApplicationCommandOptionType.String,
61 | name: "style",
62 | description: "The style of the images. (vivid/natural)",
63 | required: false,
64 | choices: [
65 | {
66 | name: "vivid",
67 | value: "vivid",
68 | },
69 | {
70 | name: "natural",
71 | value: "natural",
72 | }
73 | ]
74 |
75 | },
76 | {
77 | type: ApplicationCommandOptionType.String,
78 | name: "size",
79 | description: "The size of the images. (1024x1024/1792x1024/1024x1792)",
80 | required: false,
81 | choices: [
82 | {
83 | name: "1024x1024",
84 | value: "1024x1024",
85 | },
86 | {
87 | name: "1792x1024",
88 | value: "1792x1024",
89 | },
90 | {
91 | name: "1024x1792",
92 | value: "1024x1792",
93 | }
94 | ]
95 | }
96 | ],
97 | run: async (client: Client, interaction: ChatInputCommandInteraction) => {
98 | const uuid = interaction.user.id;
99 | const prompt = interaction.options.getString("prompt");
100 | const count = interaction.options.getInteger("n") ?? DEFAULT_IMAGES;
101 | const style = (interaction.options.getString("style") ?? DEFAULT_STYLE) as Style;
102 | const quality = (interaction.options.getString("quality") ?? DEFAULT_QUALITY) as Quality;
103 | const size = (interaction.options.getString("size") ?? "1024x1024") as Size;
104 | const width = parseInt(size.split("x")[0]);
105 | const height = parseInt(size.split("x")[1]);
106 |
107 | if (prompt == null) {
108 | await interaction.reply("Prompt must exist.");
109 | return;
110 | }
111 |
112 | await interaction.deferReply();
113 |
114 | try {
115 | // Run the API calls in parallel and then collect afterwards
116 | const imagePromises = Array.from({ length: count }, () =>
117 | configuration.images.generate({
118 | prompt: prompt,
119 | n: 1, // Generate only one image per call (dall-e-3 restriction)
120 | size: size,
121 | response_format: "b64_json",
122 | model: "dall-e-3",
123 | quality: quality,
124 | style: style
125 | }).then(completion => imagesFromBase64Response(completion.data))
126 | );
127 |
128 | // Wait for all promises to resolve
129 | const imageArrays = await Promise.all(imagePromises);
130 | const images = imageArrays.flat();
131 |
132 | const context: CustomIdContext = {
133 | count: count,
134 | quality: quality,
135 | style: style,
136 | width: width,
137 | height: height
138 | }
139 |
140 | const response = await createResponse(
141 | prompt,
142 | images,
143 | defaultActions(count),
144 | context
145 | );
146 | interaction
147 | .followUp({ ...response, content: `<@${uuid}>` })
148 | .catch(console.error);
149 | } catch (e) {
150 | // Print the stack trace
151 | console.error(e);
152 | const response = processOpenAIError(e as any, prompt);
153 | interaction.followUp({ ...response }).catch(console.error);
154 | }
155 | },
156 | };
157 |
--------------------------------------------------------------------------------
/src/actions/Expand.ts:
--------------------------------------------------------------------------------
1 | // @ts-nocheck
2 | import {
3 | Client,
4 | ButtonInteraction,
5 | ActionRowBuilder,
6 | ButtonBuilder,
7 | ButtonStyle,
8 | ComponentType,
9 | MessageComponentInteraction,
10 | IntegrationApplication,
11 | } from "discord.js";
12 | import { Action, CustomIdContext } from "../Action";
13 | import {
14 | OPENAI_API_SIZE_ARG,
15 | openai,
16 | Buffer,
17 | imagesFromBase64Response,
18 | } from "../utils/openai";
19 | import { createResponse, processOpenAIError } from "../utils/discord";
20 | import {
21 | fetchImagesFromComposite,
22 | actionsFromRow,
23 | rowFromActions,
24 | } from "../utils/discord";
25 | import { Save } from "./Save";
26 | import { expandImage } from "../utils/image";
27 | import { EXPAND_ACTION_NUM_IMAGES, LOG_ERRORS } from "../utils/constants";
28 |
29 | export const Expand: Action = {
30 | displayText: "🔭 Expand",
31 | isAction: (customId: string) => {
32 | return customId.startsWith("expand:");
33 | },
34 | customId: (context: CustomIdContext) => {
35 | return `expand:${context.count}`;
36 | },
37 | run: async (client: Client, interaction: ButtonInteraction) => {
38 | if (interaction.message.embeds.length == 0) {
39 | interaction.deferUpdate();
40 | return;
41 | }
42 | if (interaction.message.components.length != 1) {
43 | // either missing buttons or already showing expand buttons (or other buttons)
44 | interaction.deferUpdate();
45 | return;
46 | }
47 | const customId = interaction.customId;
48 | const matchResults = customId.match(/expand:(\d)/);
49 | if (!matchResults || matchResults.length != 2) {
50 | interaction.deferUpdate();
51 | return;
52 | }
53 |
54 | const count = parseInt(matchResults[1]);
55 | if (count == 0) {
56 | interaction.deferUpdate();
57 | return;
58 | }
59 | if (count == 1) {
60 | await performExpandAction(interaction, 1, 1).catch((e) => {
61 | if (LOG_ERRORS) {
62 | console.log(e);
63 | }
64 | });
65 | return;
66 | }
67 |
68 | const existingActions = actionsFromRow(interaction.message.components[0]);
69 | const mainRow = rowFromActions(existingActions, { count: count });
70 |
71 | var row = new ActionRowBuilder();
72 | var newRows = [mainRow, row];
73 |
74 | for (var i = 0; i <= count; i++) {
75 | if (row.components.length == 5) {
76 | row = new ActionRowBuilder();
77 | newRows.push(row);
78 | }
79 | if (i == 0) {
80 | const button = new ButtonBuilder()
81 | .setCustomId(`expand_picker:close`)
82 | .setLabel(`❌`)
83 | .setStyle(ButtonStyle.Secondary);
84 | row.addComponents(button);
85 | } else {
86 | const button = new ButtonBuilder()
87 | .setCustomId(`expand_picker:${i}`)
88 | .setLabel(`🔭 ${i}`)
89 | .setStyle(ButtonStyle.Secondary);
90 | row.addComponents(button);
91 | }
92 | }
93 |
94 | await interaction.update({ components: newRows });
95 |
96 | const collector = interaction.message.createMessageComponentCollector({
97 | componentType: ComponentType.Button,
98 | time: 6000,
99 | });
100 | collector.on("collect", (i) => {
101 | if (
102 | i.user.id === interaction.user.id &&
103 | i.customId.startsWith("expand_picker:")
104 | ) {
105 | collector.stop();
106 | const matchResults = i.customId.match(/expand_picker:(\d)/);
107 | if (matchResults && matchResults.length == 2) {
108 | const step = parseInt(matchResults[1]);
109 | if (step) {
110 | performExpandAction(i, step, count).catch(console.log);
111 | return;
112 | }
113 | }
114 | i.deferUpdate();
115 | }
116 | // else don't defer reply because it is not our button and should be handled by whatever owns it
117 | });
118 |
119 | collector.on("end", (collected) => {
120 | // put old buttons back
121 | interaction.editReply({ components: [mainRow] });
122 | });
123 | },
124 | };
125 |
126 | async function performExpandAction(
127 | interaction: MessageComponentInteraction,
128 | step: number,
129 | count: number
130 | ) {
131 | if (step == 0 || interaction.message.embeds.length == 0) {
132 | return;
133 | }
134 | const embed = interaction.message.embeds[0];
135 | const images = await fetchImagesFromComposite(embed.image, count).catch(
136 | console.error
137 | );
138 | const index = step - 1;
139 |
140 | if (images == null || images.length <= index) {
141 | interaction
142 | .reply({
143 | ephemeral: true,
144 | content: "Failed to process images for Expand.",
145 | })
146 | .catch(console.error);
147 | return;
148 | }
149 |
150 | await interaction.deferReply();
151 | const prompt = embed.description ?? "";
152 | const uuid = interaction.user.id;
153 | const originalImage = images[index];
154 | const expandedImage = await expandImage(originalImage);
155 | const finalImage = expandedImage.toPngImageBuffer();
156 |
157 | try {
158 | const completion = await openai.images.edit(
159 | finalImage,
160 | finalImage,
161 | prompt,
162 | EXPAND_ACTION_NUM_IMAGES,
163 | OPENAI_API_SIZE_ARG,
164 | "b64_json"
165 | );
166 |
167 | const images = imagesFromBase64Response(completion.data);
168 | // No reroll, if user wants to reroll they can go to the original
169 | const response = await createResponse(prompt, images, [Save, Expand]);
170 | interaction
171 | .followUp({ ...response, content: `Expanded for <@${uuid}>! 🔭` })
172 | .catch(console.error);
173 | } catch (e) {
174 | const response = processOpenAIError(e as any, prompt);
175 | interaction.followUp({ ...response }).catch(console.error);
176 | }
177 | }
178 |
--------------------------------------------------------------------------------