| 3963 | `, | 3963 | `, |
| 3964 | })); | 3964 | })); |
| 3965 | SlashCommandParser.addCommandObject(SlashCommand.fromProps({ | 3965 | SlashCommandParser.addCommandObject(SlashCommand.fromProps({ |
| | 3966 | name: 'css-var', |
| | 3967 | /** @param {{to: string, varname: string }} args @param {string} value @returns {string} */ |
| | 3968 | callback: (args, value) => { |
| | 3969 | // Map enum to target selector |
| | 3970 | const targetSelector = { |
| | 3971 | chat: '#chat', |
| | 3972 | background: '#bg1', |
| | 3973 | gallery: '#draggable_gallery', |
| | 3974 | zoomedAvatar: 'div.zoomed_avatar', |
| | 3975 | }[args.to || 'chat']; |
| | 3976 | |
| | 3977 | if (!targetSelector) { |
| | 3978 | toastr.error(`Invalid target: ${args.to}`); |
| | 3979 | return; |
| | 3980 | } |
| | 3981 | |
| | 3982 | if (!args.varname) { |
| | 3983 | toastr.error('CSS variable name is required'); |
| | 3984 | return; |
| | 3985 | } |
| | 3986 | if (!args.varname.startsWith('--')) { |
| | 3987 | toastr.error('CSS variable names must start with "--"'); |
| | 3988 | return; |
| | 3989 | } |
| | 3990 | |
| | 3991 | const elements = document.querySelectorAll(targetSelector); |
| | 3992 | if (elements.length === 0) { |
| | 3993 | toastr.error(`No elements found for ${args.to ?? 'chat'} with selector "${targetSelector}"`); |
| | 3994 | return; |
| | 3995 | } |
| | 3996 | |
| | 3997 | elements.forEach(element => { |
| | 3998 | element.style.setProperty(args.varname, value); |
| | 3999 | }); |
| | 4000 | |
| | 4001 | console.info(`Set CSS variable "${args.varname}" to "${value}" on "${targetSelector}"`); |
| | 4002 | }, |
| | 4003 | namedArgumentList: [ |
| | 4004 | SlashCommandNamedArgument.fromProps({ |
| | 4005 | name: 'varname', |
| | 4006 | description: 'CSS variable name (starting with double dashes)', |
| | 4007 | typeList: [ARGUMENT_TYPE.STRING], |
| | 4008 | isRequired: true, |
| | 4009 | }), |
| | 4010 | SlashCommandNamedArgument.fromProps({ |
| | 4011 | name: 'to', |
| | 4012 | description: 'The target element to which the CSS variable will be applied', |
| | 4013 | typeList: [ARGUMENT_TYPE.STRING], |
| | 4014 | enumList: [ |
| | 4015 | new SlashCommandEnumValue('chat', null, enumTypes.enum, enumIcons.message), |
| | 4016 | new SlashCommandEnumValue('background', null, enumTypes.enum, enumIcons.image), |
| | 4017 | new SlashCommandEnumValue('zoomedAvatar', null, enumTypes.enum, enumIcons.character), |
| | 4018 | new SlashCommandEnumValue('gallery', null, enumTypes.enum, enumIcons.image), |
| | 4019 | ], |
| | 4020 | defaultValue: 'chat', |
| | 4021 | }), |
| | 4022 | ], |
| | 4023 | unnamedArgumentList: [ |
| | 4024 | SlashCommandArgument.fromProps({ |
| | 4025 | description: 'CSS variable value', |
| | 4026 | typeList: [ARGUMENT_TYPE.STRING], |
| | 4027 | isRequired: true, |
| | 4028 | }), |
| | 4029 | ], |
| | 4030 | helpString: ` |
| | 4031 | <div> |
| | 4032 | Sets a CSS variable to a specified value on a target element. |
| | 4033 | <br /> |
| | 4034 | Only setting of variable names is supported. They have to be prefixed with double dashes ("--exampleVar"). |
| | 4035 | Setting actual CSS properties is not supported. Custom CSS in the theme settings can be used for that. |
| | 4036 | <br /><br /> |
| | 4037 | <b>This value will be gone after a page reload!</b> |
| | 4038 | </div> |
| | 4039 | <div> |
| | 4040 | <strong>Example:</strong> |
| | 4041 | <ul> |
| | 4042 | <li> |
| | 4043 | <pre><code>/css-var varname="--SmartThemeBodyColor" #ff0000</code></pre> |
| | 4044 | Sets the text color of the chat to red |
| | 4045 | </li> |
| | 4046 | <li> |
| | 4047 | <pre><code>/css-var to=zoomedAvatar varname="--SmartThemeBlurStrength" 0</code></pre> |
| | 4048 | Remove the blur from the zoomed avatar |
| | 4049 | </li> |
| | 4050 | </ul> |
| | 4051 | </div> |
| | 4052 | `, |
| | 4053 | })); |
| | 4054 | SlashCommandParser.addCommandObject(SlashCommand.fromProps({ |
| 3966 | name: 'movingui', | 4055 | name: 'movingui', |
| 3967 | callback: setmovingUIPreset, | 4056 | callback: setmovingUIPreset, |
| 3968 | unnamedArgumentList: [ | 4057 | unnamedArgumentList: [ |