diff --git a/Configs/BetterDiscord/plugins/BetterSyntax.plugin.js b/Configs/BetterDiscord/plugins/BetterSyntax.plugin.js new file mode 100644 index 0000000..0394389 --- /dev/null +++ b/Configs/BetterDiscord/plugins/BetterSyntax.plugin.js @@ -0,0 +1,531 @@ +/** + * @name BetterSyntax + * @author TheCommieAxolotl#0001 + * @description Lets you edit Syntax Highlighting with an easy interface and adds some useful buttons. + * @version 2.1.3 + * @authorId 538487970408300544 + * @invite 5BSWtSM3XU + * @source https://github.com/TheCommieAxolotl/BetterDiscord-Stuff/tree/main/BetterSyntax + * @updateurl https://raw.githubusercontent.com/TheCommieAxolotl/BetterDiscord-Stuff/main/BetterSyntax/BetterSyntax.plugin.js + * @donate https://github.com/sponsors/thecommieaxolotl + */ + +module.exports = (() => { + const nordTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:#81A1C1 !important}.hljs-function .hljs-title{color:#8FBCBB !important}code.hljs{background-color:#2E343F}.hljs-selector-class{color:#8FBCBB}.hljs-number{color:#B48EAD}.hljs-attribute{color:#D8DEE9}.hljs-built_in{color:#88C0D0}.hljs, .hljs + .bettersyntax-buttons{color:#81A1C1}.hljs-meta{color:#81A1C1}.hljs-string{color:#A3BE8C}.hljs-literal{color:#81A1C1}.hljs-selector-pseudo{color:#8FBCBB}.hljs-comment{color:#616E88}.hljs-bullet,.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol{color:#8FBCBB}`; + const gruvboxTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:#FB4934 !important}.hljs-title{color:#FABD2F !important}.hljs-function .hljs-title{color:#FABD2F !important}code.hljs{background-color:#282828}.hljs-selector-class{color:#B8BB26}.hljs-number{color:#D3869B}.hljs-attribute{color:#FE8019}.hljs-built_in{color:#FB4934}.hljs, .hljs + .bettersyntax-buttons{color:#EBDBB2}.hljs-meta{color:#FB4934}.hljs-string{color:#B8BB26}.hljs-literal{color:#FB4934}.hljs-selector-pseudo{color:#FABD2F}.hljs-comment{color:#928374}.hljs-doctag{color:#83A598}.hljs-bullet,.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol{color:#FB4934}`; + const tokyonightTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:#BB9AF7 !important}.hljs-function .hljs-title{color:#7AA2F7 !important}code.hljs{background-color:#1A1B26}.hljs-selector-class{color:#9ECE6A}.hljs-number{color:#FF9E64}.hljs-attribute{color:#7AA2F7}.hljs-built_in:not(.hljs-params *) {color: #0DB9D7;}.hljs-params, .hljs-params * {color: #E0AF68 !important;}.hljs, .hljs + .bettersyntax-buttons{color:#C0CAF5}.hljs-meta{color:#81A1C1}.hljs-string{color:#9ECE6A}.hljs-literal{color:#81A1C1}.hljs-selector-pseudo{color:#BB9AF7}.hljs-comment{color:#444B6A}.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol,.hljs-bullet{color:#BB9AF7}`; + const onedarkTheme = `.hljs, .hljs + .bettersyntax-buttons{color:#abb2bf;background:#282c34 !important;}.hljs-comment,.hljs-quote{color:#5c6370;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#c678dd}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e06c75}.hljs-literal{color:#56b6c2}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#98c379}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#d19a66}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#61aeee}.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}.hljs-built_in:not(.hljs-params *){color:#E06C75}.hljs-params, .hljs-params *{color: #61AFEF !important}.hljs-function{color:#E5C07B}`; + const ultraTheme = `.hljs, .hljs + .bettersyntax-buttons{color:#dcddde;background:#17161b !important;}.hljs-comment,.hljs-quote{color:#b9bbbe;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#6e6af6}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#eb8181}.hljs-literal{color:#ffce97}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#97ffa5}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#fdff97}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#97aaff}.hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}`; + + const Themes = [ + { name: "Default", desc: "Discord's default colors", value: "default", css: "" }, + { name: "Nord Theme", value: "nord", css: nordTheme }, + { name: "Gruvbox Theme", value: "gruvbox", css: gruvboxTheme }, + { name: "OneDark Theme", value: "onedark", css: onedarkTheme }, + { name: "Tokyo Night Theme", value: "tokyonight", css: tokyonightTheme }, + { name: "Ultra Theme", value: "ultra", css: ultraTheme }, + ]; + + const config = { + info: { + name: "BetterSyntax", + authors: [ + { + name: "TheCommieAxolotl", + discord_id: "538487970408300544", + }, + ], + github_raw: "https://raw.githubusercontent.com/TheCommieAxolotl/BetterDiscord-Stuff/main/BetterSyntax/BetterSyntax.plugin.js", + version: "2.1.3", + description: "Lets you edit Syntax Highlighting with an easy interface and adds some useful buttons.", + }, + + defaultConfig: [ + { + type: "category", + id: "categoryPresets", + name: "Presets", + collapsible: true, + shown: true, + settings: [ + { + type: "switch", + id: "enablePresets", + name: "Enable Preset Module", + note: "Without this, nothing in this category will apply.", + value: true, + }, + { + name: "", + id: "theme", + type: "radio", + options: Themes, + value: "default", + }, + ], + }, + { + type: "category", + id: "categoryEditor", + name: "Editor", + collapsible: true, + shown: true, + settings: [ + { + type: "switch", + id: "enableEditor", + name: "Enable Editor Module", + note: "Without this, nothing in this category will apply.", + value: false, + }, + { + type: "textbox", + id: "background", + name: "Code Background Color", + note: "Default: var(--background-secondary)", + value: "var(--background-secondary)", + }, + { + type: "textbox", + id: "defaultColor", + name: "Default Color", + note: "Default: #b9bbbe", + value: "#b9bbbe", + }, + { + type: "textbox", + id: "stringColor", + name: "String Color", + note: "Default: #2aa198", + value: "#2aa198", + }, + { + type: "textbox", + id: "commentColor", + name: "Comment Color", + note: "Default: #4f545c", + value: "#4f545c", + }, + { + type: "textbox", + id: "color1", + name: "Keyword Color", + note: "Default: #859900", + value: "#859900", + }, + { + type: "textbox", + id: "color2", + name: "Fucntion Title Color", + note: "Default: #268bd2", + value: "#268bd2", + }, + { + type: "textbox", + id: "color3", + name: "BuiltIn Color", + note: "Default: #F7768E", + value: "#F7768E", + }, + { + type: "textbox", + id: "color4", + name: "CSS BuiltIn Color", + note: "Default: #F7768E", + value: "#F7768E", + }, + { + type: "textbox", + id: "color5", + name: "Selector Color", + note: "Default: #268bd2", + value: "#268bd2", + }, + { + type: "textbox", + id: "color6", + name: "Number Color", + note: "Default: #2aa198", + value: "#2aa198", + }, + { + type: "textbox", + id: "color7", + name: "Attribute Color", + note: "Default: #b58900", + value: "#b58900", + }, + { + type: "textbox", + id: "color8", + name: "Meta Color", + note: "Default: #cb4b16", + value: "#cb4b16", + }, + { + type: "textbox", + id: "color9", + name: "Literal Color", + note: "Default: #cb4b16", + value: "#cb4b16", + }, + { + type: "textbox", + id: "color10", + name: "Pseudo Selector Color", + note: "Default: #cb4b16", + value: "#cb4b16", + }, + { + type: "textbox", + id: "other", + name: "Other Color", + note: "Default: #cb4b16", + value: "#cb4b16", + }, + ], + }, + { + type: "category", + id: "categoryLink", + name: "Link Stylesheet", + collapsible: true, + shown: true, + settings: [ + { + type: "switch", + id: "enableLink", + name: "Enable Link Module", + note: "Without this, nothing in this category will apply.", + value: false, + }, + { + type: "textbox", + placeholder: "https://styles.com/hljs.css", + id: "link", + name: "Link", + note: "Link to a hljs stylesheet", + value: "", + }, + ], + }, + { + type: "category", + id: "categoryFile", + name: "Link CSS File", + collapsible: true, + shown: true, + settings: [ + { + type: "switch", + id: "enableFile", + name: "Enable File Module", + note: "Without this, nothing in this category will apply.", + value: false, + }, + { + type: "textbox", + placeholder: "C:/User/Desktop/hljs.css", + id: "filePath", + name: "File Path", + note: "Path to a hljs stylesheet", + value: "", + }, + ], + }, + { + type: "textbox", + placeholder: "Source Code Pro", + id: "fontName", + name: "Font Name", + note: "Exact Font Name", + value: "Source Code Pro", + }, + { + type: "textbox", + placeholder: "https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@550&display=swap", + id: "fontImport", + name: "Font Import", + note: "URL to import", + value: "", + }, + { + type: "textbox", + placeholder: "0.875rem", + id: "fontSize", + name: "Font Size", + note: "Number. Default: 0.875rem", + value: "0.875rem", + }, + ], + + changelog: [ + { + title: "New Feature", + type: "added", + items: ["Added feature to load CSS from local file"], + }, + ], + }; + + return !global.ZeresPluginLibrary + ? class { + constructor() { + this._config = config; + } + getName() { + return config.info.name; + } + getAuthor() { + return config.info.authors.map((a) => a.name).join(", "); + } + getDescription() { + return config.info.description; + } + getVersion() { + return config.info.version; + } + load() { + BdApi.showConfirmationModal("Library Missing", `The library plugin needed for **${config.info.name}** is missing. Please click Download Now to install it.`, { + confirmText: "Download Now", + cancelText: "Cancel", + onConfirm: () => { + require("request").get("https://rauenzi.github.io/BDPluginLibrary/release/0PluginLibrary.plugin.js", async (error, response, body) => { + if (error) return require("electron").shell.openExternal("https://betterdiscord.app/Download?id=9"); + await new Promise((r) => require("fs").writeFile(require("path").join(BdApi.Plugins.folder, "0PluginLibrary.plugin.js"), body, r)); + }); + }, + }); + } + start() {} + stop() {} + } + : (([Plugin, Api]) => { + const plugin = (Plugin, Api) => { + const { Logger, Patcher, DCM, WebpackModules } = Api; + const { React, Webpack, ContextMenu } = BdApi; + const { Filters } = Webpack; + + const Tooltip = BdApi.Components.Tooltip; + + return class BetterSyntax extends Plugin { + async onStart() { + this.injectCSS(); + this.addButtons(); + this.patchContext(); + } + async onStop() { + Themes.forEach((theme) => BdApi.clearCSS(theme.value)); + + BdApi.clearCSS("BetterSyntaxCSS"); + BdApi.clearCSS("BetterSyntaxButtons"); + BdApi.clearCSS("BetterSyntaxEditorTheme"); + BdApi.clearCSS("BetterSyntaxHljsLink"); + BdApi.clearCSS("BetterSyntaxHljsFile"); + + Patcher.unpatchAll(); + this.contextpatch(); + } + + async patchContext() { + this.contextpatch = ContextMenu.patch("message", (tree, _) => { + tree.props.children.push( + ContextMenu.buildItem({ type: "separator" }), + ContextMenu.buildItem({ + label: "BetterSyntax", + type: "submenu", + id: "context-bettersyntax", + children: [ + ContextMenu.buildItem({ + label: "Change Theme", + type: "text", + action: () => { + this.showSettingsModal(); + }, + }), + ], + }) + ); + }); + } + + getSettingsPanel() { + const panel = this.buildSettingsPanel(); + const tip = document.createElement("div"); + + tip.innerHTML = "TIP - if you don't like any of the preset themes, you can make your own in the Editor!"; + tip.classList.add("bettersyntax-tip"); + + panel.addListener(() => { + this.injectCSS(); + }); + + let newPanel = panel.getElement(); + newPanel.insertBefore(tip, newPanel.firstChild); + + return newPanel; + } + + injectCSS() { + const editorTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:${this.settings.categoryEditor.color1}!important}.hljs-function .hljs-title{color:${this.settings.categoryEditor.color2}!important}code.hljs{background-color:${this.settings.categoryEditor.background}}.hljs-selector-class{color:${this.settings.categoryEditor.color5}}.hljs-number{color:${this.settings.categoryEditor.color6}}.hljs-attribute{color:${this.settings.categoryEditor.color7}}.hljs-built_in{color:${this.settings.categoryEditor.color3}}.css .hljs-built_in{color:${this.settings.categoryEditor.color4}}.hljs, .hljs + .bettersyntax-buttons{color:${this.settings.categoryEditor.defaultColor}}.hljs-meta{color:${this.settings.categoryEditor.color8}}.hljs-string{color:${this.settings.categoryEditor.stringColor}}.hljs-literal{color:${this.settings.categoryEditor.color9}}.hljs-selector-pseudo{color:${this.settings.categoryEditor.color10}}.hljs-comment{color:${this.settings.categoryEditor.commentColor}}.hljs-bullet,.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol{color:${this.settings.categoryEditor.other}}`; + const BetterSyntaxCSS = `@import url("https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@550&display=swap");@import url("${ + this.settings.fontImport + }");.bettersyntax-tip{color:var(--header-secondary);font-weight:500;font-family:var(--font-display);text-transform:uppercase;font-size:12px;margin-bottom:10px}code.hljs{font-size:${ + this.settings.fontSize || "0.875rem" + };font-family:"${ + this.settings.fontName + }"}.hljs{border-radius:4px;margin-bottom:10px !important;border:none !important}.collapsed > .hljs,.collapsed > .hljs *{color:transparent !important}.collapsed > .hljs{min-height:28px;max-height:28px;font-size:0;display:flex}.collapsed > .hljs .bettersyntax-buttons{margin-right:7px;margin-top:6px;pointer-events:all;top:10px}.collapsed > .hljs::before{color:white;content:"Collapsed codeblock";width:76%;height:28px;text-align:center;font-size:10pt;position:absolute;padding-top:5.5px;font-family:var(--font-primary);font-weight:500}.layerContainer-2v_Sit code.hljs{margin:15px}`; + + BdApi.injectCSS("BetterSyntaxCSS", BetterSyntaxCSS); + + if (this.settings.categoryPresets.enablePresets) { + Themes.forEach((theme) => { + if (this.settings.categoryPresets.theme == theme.value) { + BdApi.injectCSS(theme.value, theme.css); + } else { + BdApi.clearCSS(theme.value); + } + }); + } else { + Themes.forEach((theme) => BdApi.clearCSS(theme.value)); + } + + if (this.settings.categoryEditor.enableEditor) { + BdApi.injectCSS("BetterSyntaxEditorTheme", editorTheme); + } else { + BdApi.clearCSS("BetterSyntaxEditorTheme"); + } + + if (this.settings.categoryLink.enableLink) { + BdApi.injectCSS("BetterSyntaxHljsLink", `@import url("${this.settings.categoryLink.link}");`); + } else { + BdApi.clearCSS("BetterSyntaxHljsLink"); + } + + if (this.settings.categoryFile.enableFile && this.settings.categoryFile.filePath) { + const fs = require("fs"); + + let css = ""; + if (fs.existsSync(this.settings.categoryFile.filePath)) { + css = fs.readFileSync(this.settings.categoryFile.filePath, { encoding: "utf8" }); + } + + BdApi.injectCSS("BetterSyntaxHljsFile", css); + } else { + BdApi.clearCSS("BetterSyntaxHljsFile"); + } + } + + async addButtons() { + const { codeBlock } = Webpack.getModule(Filters.byProps("parse", "parseTopic")).defaultRules; + Patcher.after(codeBlock, "react", (_, [props], res) => { + if (props.type !== "codeBlock") return; + + Patcher.after(res.props.children, "type", (_, __, nestedRes) => { + nestedRes.props.className = "bettersyntax-pre"; + + nestedRes.props.children = [ + nestedRes.props.children, + React.createElement("div", { + className: "bettersyntax-buttons", + children: [ + React.createElement(Tooltip, { + text: props.lang ? `Language: ${props.lang.toUpperCase()}` : "Unknown Language", + children: (p) => + React.createElement("div", { + ...p, + className: "code-button bettersyntax-lang", + onClick: () => { + DiscordNative.clipboard.copy(props.lang); + BdApi.showToast("Copied Language", { type: "success" }); + }, + children: [ + React.createElement("svg", { + className: "icon", + viewBox: "2 2 20 20", + children: [ + React.createElement("path", { + fill: "currentColor", + d: "M6.5 8Q6.5 7 7.5 7L11.5 7Q12.5 7 12.5 8T11.5 9L7.5 9Q6.5 9 6.5 8M13.5 8Q13.5 7 14.5 7 15.5 7 15.5 8T14.5 9 13.5 8zM6.5 11Q6.5 10 7.5 10L8.5 10Q9.5 10 9.5 11T8.5 12L7.5 12Q6.5 12 6.5 11M10.5 11Q10.5 10 11.5 10L15.5 10Q16.5 10 16.5 11T15.5 12L11.5 12Q10.5 12 10.5 11M6.5 14Q6.5 13 7.5 13L11.5 13Q12.5 13 12.5 14T11.5 15L7.5 15Q6.5 15 6.5 14M13.5 14Q13.5 13 14.5 13L17.5 13Q18.5 13 18.5 14T17.5 15L14.5 15Q13.5 15 13.5 14M6.5 17Q6.5 16 7.5 16L9.5 16Q10.5 16 10.5 17T9.5 18L7.5 18Q6.5 18 6.5 17", + }), + ], + }), + ], + }), + }), + React.createElement(Tooltip, { + text: `Copy Code`, + children: (p) => + React.createElement("div", { + ...p, + className: "code-button bettersyntax-copy", + onClick: () => { + DiscordNative.clipboard.copy(props.content); + BdApi.showToast("Copied", { type: "success" }); + }, + children: [ + React.createElement("svg", { + className: "icon", + viewBox: "2 2 20 20", + children: [ + React.createElement("path", { + fill: "currentColor", + d: "M12 2ZM7 19Q6 19 6 18C6 8 6 10 6 6Q6 5 7 5h6q1 0 1 1L15 6h2q1 0 1 1v11q0 1-1 1c-2 0-2 0-3 0m0-2h1q1 0 1-1V15 9Q16 8 15 8h-1m-3 9q1 0 1-1V8Q12 7 11 7H9Q8 7 8 8v8q0 1 1 1z", + }), + ], + }), + ], + }), + }), + React.createElement(Tooltip, { + text: `Toggle Collapse`, + children: (p) => + React.createElement("div", { + ...p, + className: "code-button bettersyntax-collapse", + onClick: (ele) => { + BdApi.showToast("Toggled Collapse"); + if (ele.target.tagName == "svg") { + if (!ele.target.parentNode.parentNode.parentNode.classList.contains("collapsed")) { + ele.target.parentNode.parentNode.parentNode.classList.add("collapsed"); + } else { + ele.target.parentNode.parentNode.parentNode.classList.remove("collapsed"); + } + } else if (ele.target.tagName == "path") { + if (!ele.target.parentNode.parentNode.parentNode.parentNode.classList.contains("collapsed")) { + ele.target.parentNode.parentNode.parentNode.parentNode.classList.add("collapsed"); + } else { + ele.target.parentNode.parentNode.parentNode.parentNode.classList.remove("collapsed"); + } + } + }, + children: [ + React.createElement("svg", { + className: "icon", + viewBox: "2 2 20 20", + children: [ + React.createElement("path", { + fill: "currentColor", + d: "M6 9h12l-6 7z", + }), + ], + }), + ], + }), + }), + ], + }), + ]; + }); + }); + + const buttonsCSS = `.code-button .icon > path {color: var(--background-primary);}.code-button {background: currentColor;border-radius: 10px;}.bettersyntax-buttons{margin-left:auto;margin-top:3px;height:17.5px;width:fit-content}.code-button{display:inline-flex;background-repeat:no-repeat;cursor:pointer;height:17.5px;width:17.5px}.code-button:not(.code-button:nth-child(3)){margin-right:5px}.bettersyntax-collapse{transition:transform 0.2s ease}.collapsed .bettersyntax-collapse{transform:rotate(180deg)}pre code.hljs + .bettersyntax-buttons{background:transparent !important}`; + BdApi.injectCSS("BetterSyntaxButtons", buttonsCSS); + } + }; + }; + + return plugin(Plugin, Api); + })(global.ZeresPluginLibrary.buildPlugin(config)); +})(); +/*@end@*/