Adding an option to change the custom menu bar icon when triggered [All SF Symbols]
I want the icon to be like this and When I click on it it changes to this:
(Don't mind the background change)
And when clicked again it changes back and so on...
Thank you!
The easiest way to achieve this is to use a scriptable menu item.
These support a standard mode and an alternate mode. The alternate mode is activated if the provided regex matches the script output.
Here is an example:
(async ()=> {
let buttonName = 'ButtonXXXState';
let isButtonOn = await callBTT('get_string_variable', {variable_name:buttonName})
returnToBTT(isButtonOn);
})();
The script that is executed when clicking the item needs to change the state of the variable:
(async ()=> {
let buttonName = 'ButtonXXXState';
let currentState = await callBTT('get_string_variable', {variable_name: buttonName});
if (currentState === 'on') {
await callBTT('set_string_variable', {variable_name:buttonName, to: 'off'});
returnToBTT("off");
} else {
await callBTT('set_string_variable', {variable_name:buttonName, to: 'on'});
returnToBTT("on");
}
})();
Here a preset example you can try: https://share.folivora.ai/sharedPreset/77c020f3-8321-4a6e-88af-3cb7ca11f027
Thanks for the quick reply Andreas!
Tried the preset, and changed the SF Symbols:
It's functional !
But the icons...
This looks normal [Default icon]
But this OFF state has an unwanted background color. [Alternate icon]
Although I've removed the color for both:
Also, something I asked before, Is it possible to have the custom context menu along with a "run shortcut" action ?
And, is it possible to have the automation run a certain shortcut when it's on, and another when it's off.
How can I make sure that the icon reflects the shortcut it runs.
The icon might show as on (Filled fanblades icon), but it might run the wrong shortcut.
Fanblades.fill (ON state) ==> On click - Runs a turn FAN OFF shortcut.
Fanblades (OFF state) ==> On click - Runs a turn FAN ON shortcut.
It works now, but I would like to have it like a switch
Again, thank you for your help Andreas!!!
Unfortunately custom context menus currently can not be combined with other actions. This might change soon.
To run different shortcuts depending on the variable state - best call them in the Java Script:
await runAppleShortcut("Switch FAN ON");
(async ()=> {
let buttonName = 'ButtonXXXState';
let currentState = await callBTT('get_string_variable', {variable_name: buttonName});
if (currentState === 'on') {
await runAppleShortcut("Switch FAN OFF");
await callBTT('set_string_variable', {variable_name:buttonName, to: 'off'});
returnToBTT("off");
} else {
await runAppleShortcut("Switch FAN ON");
await callBTT('set_string_variable', {variable_name:buttonName, to: 'on'});
returnToBTT("on");
}
})();
To remove backgrounds, best set it to clear color:
The icon color problem is solved! Thank you 
The current setup I have for shortcuts is "FAN ON" and "FAN OFF".
I switched them in the script you suggested.
await runAppleShortcut("FAN ON");
(async ()=> {
let buttonName = 'ButtonXXXState';
let currentState = await callBTT('get_string_variable', {variable_name: buttonName});
if (currentState === 'on') {
await runAppleShortcut("FAN OFF");
await callBTT('set_string_variable', {variable_name:buttonName, to: 'off'});
returnToBTT("off");
} else {
await runAppleShortcut("FAN ON");
await callBTT('set_string_variable', {variable_name:buttonName, to: 'on'});
returnToBTT("on");
}
})();
But it didn't want to run the shortcuts (The shortcuts icon didn't do anything and the fan state didn't change)
Also, the icons don't change, IDK what happened.
The first one with the 'run shortcut' action works fine, but the icon doesn't really reflect the state of the FAN.
Thank you !
