Skip to content

Commit

Permalink
Merge pull request #87 from BobbyWibowo/pr-3.2.13
Browse files Browse the repository at this point in the history
feat: 3.2.13 bug fixes + more hacks for vencord plugin edition
  • Loading branch information
Pitu authored Aug 5, 2023
2 parents 0c794c5 + 23df32c commit 19b78ad
Show file tree
Hide file tree
Showing 10 changed files with 465 additions and 78 deletions.
6 changes: 6 additions & 0 deletions .editorconfig
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,12 @@ end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true

[*.md]
indent_style = space
indent_size = 4
insert_final_newline = true
trim_trailing_whitespace = false

[*.json]
indent_style = space
indent_size = 2
3 changes: 3 additions & 0 deletions .github/workflows/deploy.yml
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,9 @@ jobs:
- name: Build application (BetterDiscord plugin)
run: yarn build-bd

- name: Build application (Vencord plugin)
run: yarn build-vc

- uses: EndBug/add-and-commit@v6
with:
branch: master
Expand Down
40 changes: 29 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,27 +8,45 @@
[![Support me](https://img.shields.io/badge/Support-Buy%20me%20a%20coffee-yellow.svg?style=flat-square)](https://www.buymeacoffee.com/kana)

### What does this do?

You know how LINE and Telegram have this beautiful sticker system where you can send different reactions with just one click? This is a new approach at doing exactly that but on Discord!

[It looks like this](https://chibisafe.moe/owdxQF9m.mp4)

### How even?

By injecting the script into Discord it will automatically pull a curated list of sticker packs from [chibisafe](https://chibisafe.moe) and add them to your Discord client. After that a heart button will appear in your message bar where you'll be able to see all the stickers!


### Can I make this permanent?
You can! Currently the best way to get this up and running is by using [BetterDiscord](https://github.com/rauenzi/BetterDiscordApp/releases) . Make sure to head to the [Magane website](https://magane.moe) for instructions on how to install it. If you have another injector already set up and running you could theoretically just feed it the Magane script and see if it works:
```
https://raw.githubusercontent.com/Pitu/Magane/master/dist/magane.min.js
```

You can!

Currently the best way to get this up and running is by using [BetterDiscord](https://github.com/rauenzi/BetterDiscordApp/releases), but we also have experimental support for [Vencord](https://vencord.dev/).

#### BetterDiscord

- Grab the pre-built plugin file from [https://magane.moe/api/dist/betterdiscord](https://magane.moe/api/dist/.etterdiscord).
- Place the plugin file into your BetterDiscord's **plugins** directory.
- Activate Magane from Discord's **User Settings > BetterDiscord > Plugins**.

#### Vencord

> This is for the more advanced users.
> Be advised that Magane's update checker is not available on Vencord.
- Grab the pre-built plugin file, `magane.vencord.js`, from this repo's dist directory, [https://github.com/Pitu/Magane/tree/master/dist](https://github.com/Pitu/Magane/tree/master/dist).
- Download Vencord git from `https://github.com/Vendicated/Vencord`.
- Follow its advanced user's installation guide at `https://github.com/Vendicated/Vencord/blob/main/docs/1_INSTALLING.md`.
- In Vencord git directory, navigate to `src`, then create `userplugins` directory (e.g. `/path/to/vencord/src/userplugins`).
- Drop Magane plugin into it.
- Rebuild Vencord (`pnpm build`), then restart your Discord.
- Optionally, if you had not done it before, you must inject Vencord into your Discord installation (`pnpm inject`).
- Activate Magane from Discord's **User Settings > Vencord > Plugins**.

### So how exactly do I use it after adding the script?

It's very easy.
After opening the sticker popup click on the little tool icon and you'll see a list of available sticker packs. Clicking on a sticker pack will subscribe you to it, making every sticker on that pack available on the main window. You can also right click any sticker in the list and add them to your favorites for easy access! To remove one, right click on it again.

### Give me the code, I want to run this right now!
Press `Ctrl + Shift + i` or `CMD + Option + i` to open DevTools, and paste the following code inside:
```js
document.head.appendChild(document.createElement('script')).setAttribute("src", "https://magane.moe/api/dist/magane")
```

> Injecting random code into your Discord client could be harmful, that's why I provide the full source code so you can check out exactly what the script does. This plugin makes use of your personal token to make a request to the Discord api each time you click a sticker and never leaves nor does it do anything else with it. The script found in `/dist` is generated, webpacked and babeled from the source by running `npm run webpack`.
Or just watch [the preview](https://chibisafe.moe/owdxQF9m.mp4) again.
8 changes: 5 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "magane",
"version": "3.2.12",
"version": "3.2.13",
"description": "A lie about a lie... It turns inside-out on itself.",
"author": "Pitu <[email protected]>",
"license": "MIT",
Expand All @@ -18,12 +18,14 @@
"build": "rollup -c",
"dev": "rollup -c -w",
"build-bd": "rollup -c rollup-bd.config.js",
"dev-bd": "rollup -c rollup-bd.config.js -w"
"dev-bd": "rollup -c rollup-bd.config.js -w",
"build-vc": "rollup -c rollup-vencord.config.js",
"dev-vc": "rollup -c rollup-vencord.config.js -w"
},
"devDependencies": {
"@rollup/plugin-commonjs": "^11.1.0",
"@rollup/plugin-node-resolve": "^11.2.1",
"@rollup/plugin-replace": "^4.0.0",
"@rollup/plugin-replace": "^5.0.2",
"eslint": "^6.8.0",
"eslint-config-aqua": "^7.2.0",
"eslint-plugin-svelte3": "^2.7.3",
Expand Down
5 changes: 3 additions & 2 deletions rollup-bd.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,8 @@ export default {
// Normalize basename
const id = pkg + path.basename(fileId).replace(/\./, '_');
// Arguably hacky.., but cleanest method that I could think of
return 'if (typeof global.MAGANE_STYLES !== "object") global.MAGANE_STYLES = {};\n' +
`global.MAGANE_STYLES["${id}"] = ${cssVariableName};`;
return 'if (typeof window.MAGANE_STYLES !== "object") window.MAGANE_STYLES = {};\n' +
`window.MAGANE_STYLES["${id}"] = ${cssVariableName};`;
}
}),
resolve({
Expand Down Expand Up @@ -90,6 +90,7 @@ export default {
}),
Boolean(process.env.BD_PLUGIN_PATH) &&
command(`cp --force "${file}" "${process.env.BD_PLUGIN_PATH}"`, {
once: false,
wait: true
})
],
Expand Down
112 changes: 112 additions & 0 deletions rollup-vencord.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
import svelte from 'rollup-plugin-svelte';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import command from 'rollup-plugin-command';
import { terser } from 'rollup-plugin-terser';
import replace from '@rollup/plugin-replace';
import postcss from 'rollup-plugin-postcss';
import postcssPresetEnv from 'postcss-preset-env';
import autoPreprocess from 'svelte-preprocess';
import path from 'path';

const production = !process.env.ROLLUP_WATCH;
const file = path.resolve(__dirname, production ? 'dist' : 'dist-dev', 'magane.vencord.js');

export default {
input: 'src/vencord-main.js',
output: {
file,
format: 'cjs',
name: 'app',
// BetterDiscord won't make sourcemaps available to DevTools anyways,
// and we are not minifying processed output to follow BetterDiscord guidelines,
// so might as well not generate them altogether.
sourcemap: false
},
plugins: [
svelte({
dev: !production,
emitCss: true,
preprocess: autoPreprocess()
}),
postcss({
extensions: ['.css', '.scss'],
plugins: [
postcssPresetEnv()
],
inject: (cssVariableName, fileId) => {
// Extract packaga name if available
const match = fileId.match(/[\/]node_modules[\/](.*?)[\/]/);
let pkg = '';
if (match) pkg = `${match[1]}-`;
// Normalize basename
const id = pkg + path.basename(fileId).replace(/\./, '_');
// Arguably hacky.., but cleanest method that I could think of
return 'if (typeof window.MAGANE_STYLES !== "object") window.MAGANE_STYLES = {};\n' +
`window.MAGANE_STYLES["${id}"] = ${cssVariableName};`;
}
}),
resolve({
browser: true
}),
commonjs(),
production && terser({
ecma: 2017,
compress: {
keep_classnames: true,
keep_fnames: true,
passes: 1
},
mangle: false,
output: {
beautify: true,
keep_numbers: true,
indent_level: 4
}
}),
production && replace({
delimiters: ['', ''],
preventAssignment: false,
values: {
' ': '\t'
}
}),
production && replace({
delimiters: ['', ''],
preventAssignment: false,
values: {
'"use strict";': '"use strict"\n__VencordImports__;'
}
}),
!production && replace({
delimiters: ['', ''],
preventAssignment: false,
values: {
'\'use strict\';': '\'use strict\';\n__VencordImports__;'
}
}),
replace({
delimiters: ['', ''],
preventAssignment: false,
values: {
'__VencordImports__;': 'import definePlugin from "@utils/types";\nimport { findByPropsLazy, findLazy } from "@webpack";\nimport { Alerts, Toasts } from "@webpack/common";',
'VencordApi.': '',

// Svelte syntax, lmao..
'$$invalidate(0, mountType)': '$$invalidate(0, mountType = MountType.VENCORD)',

// This is so hacky, lmao
'var vencordMain = definePlugin({': 'export default definePlugin({',
'module.exports = vencordMain;': ''
}
}),
Boolean(process.env.VENCORD_PLUGIN_PATH) &&
command(`cp --force "${file}" "${process.env.VENCORD_PLUGIN_PATH}"`, {
once: false,
wait: true
})
],
watch: {
clearScreen: false
}
};
Loading

0 comments on commit 19b78ad

Please sign in to comment.