fix: ribbon commands + special logos

This commit is contained in:
Phillip Bronzel 2022-12-16 09:35:45 +01:00
parent 540a1be863
commit 62d4ac2957
18 changed files with 199 additions and 158 deletions

View file

@ -1,7 +1,7 @@
{
"id": "cmdr",
"name": "Commander",
"version": "0.4.4",
"version": "0.4.5",
"minAppVersion": "1.1.0",
"description": "Customize your workspace by adding commands everywhere, create Macros and supercharge your mobile toolbar.",
"author": "jsmorabito & phibr0",

View file

@ -1,6 +1,6 @@
{
"name": "cmdr",
"version": "0.4.2",
"version": "0.4.5",
"description": "Customize your workspace by adding commands /everywhere/.",
"main": "main.js",
"scripts": {
@ -44,7 +44,6 @@
"typescript": "^4.9.3"
},
"dependencies": {
"@codemirror/lang-javascript": "^6.1.1",
"array-move": "^4.0.0",
"canvas-confetti": "^1.6.0",
"preact": "^10.11.3"

View file

@ -5,7 +5,6 @@ specifiers:
'@codemirror/commands': ^6.1.2
'@codemirror/lang-css': ^6.0.1
'@codemirror/lang-html': ^6.3.1
'@codemirror/lang-javascript': ^6.1.1
'@codemirror/language': github:lishid/cm-language
'@codemirror/lint': ^6.1.0
'@codemirror/search': ^6.2.3
@ -33,7 +32,6 @@ specifiers:
typescript: ^4.9.3
dependencies:
'@codemirror/lang-javascript': 6.1.1
array-move: 4.0.0
canvas-confetti: 1.6.0
preact: 10.11.3
@ -79,6 +77,7 @@ packages:
'@codemirror/state': 6.1.4
'@codemirror/view': 6.6.0
'@lezer/common': 1.0.2
dev: true
/@codemirror/commands/6.1.2:
resolution: {integrity: sha512-sO3jdX1s0pam6lIdeSJLMN3DQ6mPEbM4yLvyKkdqtmd/UDwhXA5+AwFJ89rRXm6vTeOXBsE5cAmlos/t7MJdgg==}
@ -135,6 +134,7 @@ packages:
'@codemirror/view': 6.6.0
'@lezer/common': 1.0.2
'@lezer/javascript': 1.3.1
dev: true
/@codemirror/language/0.19.10:
resolution: {integrity: sha512-yA0DZ3RYn2CqAAGW62VrU8c4YxscMQn45y/I9sjBlqB1e2OTQLg4CCkMBuMSLXk4xaqjlsgazeOQWaJQOKfV8Q==}
@ -155,6 +155,7 @@ packages:
'@lezer/highlight': 1.1.3
'@lezer/lr': 1.2.5
style-mod: 4.0.0
dev: true
/@codemirror/lint/6.1.0:
resolution: {integrity: sha512-mdvDQrjRmYPvQ3WrzF6Ewaao+NWERYtpthJvoQ3tK3t/44Ynhk8ZGjTSL9jMEv8CgSMogmt75X8ceOZRDSXHtQ==}
@ -162,6 +163,7 @@ packages:
'@codemirror/state': 6.1.4
'@codemirror/view': 6.6.0
crelt: 1.0.5
dev: true
/@codemirror/rangeset/0.19.9:
resolution: {integrity: sha512-V8YUuOvK+ew87Xem+71nKcqu1SXd5QROMRLMS/ljT5/3MCxtgrRie1Cvild0G/Z2f1fpWxzX78V0U4jjXBorBQ==}
@ -186,6 +188,7 @@ packages:
/@codemirror/state/6.1.4:
resolution: {integrity: sha512-g+3OJuRylV5qsXuuhrc6Cvs1NQluNioepYMM2fhnpYkNk7NgX+j0AFuevKSVKzTDmDyt9+Puju+zPdHNECzCNQ==}
dev: true
/@codemirror/text/0.19.6:
resolution: {integrity: sha512-T9jnREMIygx+TPC1bOuepz18maGq/92q2a+n4qTqObKwvNMg+8cMTslb8yxeEDEq7S3kpgGWxgO1UWbQRij0dA==}
@ -208,6 +211,7 @@ packages:
'@codemirror/state': 6.1.4
style-mod: 4.0.0
w3c-keyname: 2.2.6
dev: true
/@esbuild/android-arm/0.15.16:
resolution: {integrity: sha512-nyB6CH++2mSgx3GbnrJsZSxzne5K0HMyNIWafDHqYy7IwxFc4fd/CgHVZXr8Eh+Q3KbIAcAe3vGyqIPhGblvMQ==}
@ -233,6 +237,7 @@ packages:
/@lezer/common/1.0.2:
resolution: {integrity: sha512-SVgiGtMnMnW3ActR8SXgsDhw7a0w0ChHSYAyAUxxrOiJ1OqYWEKk/xJd84tTSPo1mo6DXLObAJALNnd0Hrv7Ng==}
dev: true
/@lezer/css/1.1.0:
resolution: {integrity: sha512-3dc6l8ZQOOAZUhNk6ekrkaZ6iJScn0QKxsmKgmn0BsaIXePqgPPk3d1iqo/d7laICE6eYrLpxm5HrGyNyR0hfQ==}
@ -245,6 +250,7 @@ packages:
resolution: {integrity: sha512-3vLKLPThO4td43lYRBygmMY18JN3CPh9w+XS2j8WC30vR4yZeFG4z1iFe4jXE43NtGqe//zHW5q8ENLlHvz9gw==}
dependencies:
'@lezer/common': 1.0.2
dev: true
/@lezer/html/1.2.0:
resolution: {integrity: sha512-T6sseEJQPTFayX3h9DINh7KyFBwCjEtrqQRD+7USmtkJh1xHDutsB6KYHKveSd+TbsedIPAcZwar+gkHl1rVSw==}
@ -259,6 +265,7 @@ packages:
dependencies:
'@lezer/highlight': 1.1.3
'@lezer/lr': 1.2.5
dev: true
/@lezer/lr/0.15.8:
resolution: {integrity: sha512-bM6oE6VQZ6hIFxDNKk8bKPa14hqFrV07J/vHGOeiAbJReIaQXmkVb6xQu4MR+JBTLa5arGRyAAjJe1qaQt3Uvg==}
@ -270,6 +277,7 @@ packages:
resolution: {integrity: sha512-f9319YG1A/3ysgUE3bqCHEd7g+3ZZ71MWlwEc42mpnLVYXgfJJgtu1XAyBB4Kz8FmqmnFe9caopDqKeMMMAU6g==}
dependencies:
'@lezer/common': 1.0.2
dev: true
/@nodelib/fs.scandir/2.1.5:
resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
@ -621,6 +629,7 @@ packages:
/crelt/1.0.5:
resolution: {integrity: sha512-+BO9wPPi+DWTDcNYhr/W90myha8ptzftZT+LwcmUbbok0rcP/fequmFYCw8NMoH7pkAZQzU78b3kYrlua5a9eA==}
dev: true
/cross-spawn/6.0.5:
resolution: {integrity: sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==}
@ -1758,6 +1767,7 @@ packages:
/style-mod/4.0.0:
resolution: {integrity: sha512-OPhtyEjyyN9x3nhPsu76f52yUGXiZcgvsrFVtvTkyGRQJ0XK+GPc6ov1z+lRpbeabka+MYEQxOYRnt5nF30aMw==}
dev: true
/supports-color/5.5.0:
resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
@ -1856,6 +1866,7 @@ packages:
/w3c-keyname/2.2.6:
resolution: {integrity: sha512-f+fciywl1SJEniZHD6H+kUO8gOnwIr7f4ijKA6+ZvJFjeGi1r4PDLl53Ayud9O/rk64RqgoQine0feoeOU0kXg==}
dev: true
/web-streams-polyfill/3.2.1:
resolution: {integrity: sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q==}
@ -1906,3 +1917,4 @@ packages:
'@lezer/highlight': 1.1.3
'@lezer/lr': 1.2.5
style-mod: 4.0.0
dev: true

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 5.2 KiB

View file

@ -0,0 +1 @@
<svg width="152" height="220" viewBox="0 0 127 184" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.82568 174.501L23.3257 131.001C52.8749 137.508 72.6181 143.564 103.826 135.001C111.05 148.279 114.101 161.223 121.326 174.501C115.575 171.676 112.747 171.756 108.326 174.501C102.171 170.814 100.059 172.108 96.3257 174.501C88.1576 168.27 84.0522 170.116 76.8257 174.501C70.342 169.446 66.8634 169.941 60.8257 174.501C51.247 168.701 46.9661 170.784 39.3364 174.496L39.3257 174.501C33.6234 170.857 30.5816 171.207 25.3257 174.501C18.7562 170.383 14.8574 171.426 7.82568 174.501Z" fill="#8B6CEF" stroke="#8B6CEF" stroke-width="4" /><path d="M80.3257 164.501V181.501H68.3257" stroke="#FF820F" stroke-width="5" stroke-linecap="round" /><path d="M48.3257 164.501V181.501H36.3257" stroke="#FF820F" stroke-width="5" stroke-linecap="round" /><path d="M87.1257 80.501C96.6257 80.501 104.326 88.201 104.326 97.701V149.301C104.326 158.801 96.6257 166.501 87.1257 166.501H41.5257C32.0257 166.501 24.3257 158.801 24.3257 149.301V97.701C24.3257 88.201 32.0257 80.501 41.5257 80.501H87.1257ZM87.1257 84.501H41.5257C34.2257 84.501 28.3257 90.401 28.3257 97.701V135.301C28.3257 142.601 34.2257 148.501 41.5257 148.501H87.1257C94.4257 148.501 100.326 142.601 100.326 135.301V97.701C100.326 90.401 94.4257 84.501 87.1257 84.501ZM66.3257 98.501V113.001L78.7257 105.501L80.8257 108.901L68.2257 116.501L80.8257 124.101L78.7257 127.501L66.3257 120.001V134.501H62.3257V120.001L49.9257 127.501L47.8257 124.101L60.4257 116.501L47.8257 108.901L49.9257 105.501L62.3257 113.001V98.501H66.3257ZM100.326 146.301C97.1257 150.101 92.4257 152.501 87.1257 152.501H41.5257C36.2257 152.501 31.5257 150.101 28.3257 146.301V149.301C28.3257 156.601 34.2257 162.501 41.5257 162.501H87.1257C94.4257 162.501 100.326 156.601 100.326 149.301V146.301Z" fill="#FF820F" stroke="#FF820F" /><path d="M102.326 133.501L119.326 144.105" stroke="#FF820F" stroke-width="5" stroke-linecap="round" /><path d="M7.22161 120.99L26.3257 133.116" stroke="#FF820F" stroke-width="5" stroke-linecap="round" /><path d="M9.32568 136.501L3.32568 105.501" stroke="black" stroke-width="4" /><path d="M3.36682 105.807L1.95891 99.5009" stroke="white" stroke-width="4" /><path d="M39.8257 78.501H88.3257L58.8257 7.00098L39.8257 78.501Z" fill="#8B6CEF" stroke="#8B6CEF" stroke-width="4" /><path d="M70.3257 57.119L69.6786 59.1104L69.5664 59.4559H69.2031H67.1092L68.8032 60.6866L69.0971 60.9002L68.9849 61.2457L68.3378 63.237L70.0318 62.0063L70.3257 61.7928L70.6196 62.0063L72.3136 63.237L71.6665 61.2457L71.5543 60.9002L71.8481 60.6866L73.5421 59.4559H71.4483H71.085L70.9727 59.1104L70.3257 57.119Z" fill="#FFF50F" stroke="#FFF50F" /><path d="M58.3537 35.403L55.5616 39.5509L55.3588 39.8523L55.0095 39.7525L50.2018 38.3788L53.2839 42.316L53.5078 42.602L53.3049 42.9034L50.5129 47.0512L55.2098 45.3367L55.551 45.2121L55.7749 45.4982L58.857 49.4353L58.6778 44.4385L58.6647 44.0755L59.006 43.9509L63.7029 42.2364L58.8952 40.8627L58.5459 40.7629L58.5329 40.3999L58.3537 35.403Z" fill="#FFF50F" stroke="#FFF50F" /><path d="M22.8257 125.501C51.8148 144.152 71.5061 151.504 105.826 131.001" stroke="#5845CF" stroke-width="4" /><path d="M58.101 145.285C57.3014 146.027 56.7929 146.859 56.5843 147.564C56.3685 148.293 56.5117 148.696 56.6741 148.871C56.8366 149.046 57.2281 149.219 57.9715 149.059C58.69 148.903 59.5579 148.458 60.3574 147.716C61.1569 146.975 61.6654 146.142 61.8741 145.437C62.0899 144.708 61.9467 144.305 61.7843 144.13C61.6218 143.955 61.2302 143.782 60.4869 143.942C59.7683 144.098 58.9005 144.543 58.101 145.285Z" stroke="#5845CF" stroke-width="2" /><path d="M63.7886 148.113C64.5322 149.072 65.3943 149.731 66.1439 150.049C66.9278 150.381 67.3663 150.268 67.5492 150.126C67.7321 149.984 67.9514 149.588 67.8244 148.746C67.703 147.94 67.2791 146.941 66.5354 145.982C65.7917 145.023 64.9296 144.364 64.18 144.046C63.3962 143.714 62.9577 143.827 62.7748 143.969C62.5919 144.111 62.3726 144.508 62.4995 145.349C62.6209 146.155 63.0449 147.154 63.7886 148.113Z" stroke="#5845CF" stroke-width="2" /><ellipse rx="41.5" ry="4" transform="matrix(-1 0 0 1 62.8257 79.501)" fill="#8B6CEF" /><path d="M48.7999 64.3399L48.7051 67.8856L48.6954 68.2487L48.3471 68.3517L44.9456 69.3573L48.2885 70.5431L48.6309 70.6645L48.6212 71.0276L48.5264 74.5733L50.6872 71.7605L50.9085 71.4724L51.2508 71.5939L54.5937 72.7796L52.5863 69.8554L52.3807 69.5559L52.602 69.2679L54.7627 66.455L51.3613 67.4606L51.0129 67.5636L50.8073 67.2641L48.7999 64.3399Z" fill="#FFF50F" stroke="#FFF50F" /></svg>

After

Width:  |  Height:  |  Size: 4.4 KiB

View file

@ -11,21 +11,22 @@ import {
RibbonManager,
StatusBarManager,
} from "./manager/commands";
import { Action, CommanderSettings, Macro } from "./types";
import { Action, CommanderSettings } from "./types";
import CommanderSettingTab from "./ui/settingTab";
import SettingTabModal from "./ui/settingTabModal";
import './styles/styles.scss';
import './styles/advanced-toolbar.scss';
import "./styles/styles.scss";
import "./styles/advanced-toolbar.scss";
import { updateHiderStylesheet } from "./util";
import registerCustomIcons from "./ui/icons";
import LeftRibbonManager from "./manager/commands/leftRibbonManager";
export default class CommanderPlugin extends Plugin {
public settings: CommanderSettings;
public manager: {
editorMenu: EditorMenuCommandManager;
fileMenu: FileMenuCommandManager;
leftRibbon: RibbonManager;
leftRibbon: LeftRibbonManager;
//rightRibbon: RibbonManager,
//titleBar: TitleBarManager,
statusBar: StatusBarManager;
@ -33,18 +34,18 @@ export default class CommanderPlugin extends Plugin {
explorerManager: ExplorerManager;
};
async executeStartupMacros() {
public async executeStartupMacros(): Promise<void> {
const ref = setTimeout(() => {
this.settings.macros.forEach((macro, idx) => {
this.settings.macros.forEach(async (macro, idx) => {
if (macro.startup) {
this.executeMacro(idx);
await this.executeMacro(idx);
}
});
}, 1000);
this.register(() => clearTimeout(ref));
}
async executeMacro(id: number) {
public async executeMacro(id: number): Promise<void> {
const macro = this.settings.macros[id];
if (!macro) throw new Error("Macro not found");
@ -77,6 +78,7 @@ export default class CommanderPlugin extends Plugin {
public async onload(): Promise<void> {
await this.loadSettings();
delete this.settings.hide.leftRibbon;
registerCustomIcons();
@ -86,7 +88,7 @@ export default class CommanderPlugin extends Plugin {
this.settings.editorMenu
),
fileMenu: new FileMenuCommandManager(this, this.settings.fileMenu),
leftRibbon: new RibbonManager("left", this),
leftRibbon: new LeftRibbonManager(this),
//rightRibbon: new RibbonManager("right", this),
//titleBar: new TitleBarManager(this, this.settings.titleBar),
statusBar: new StatusBarManager(this, this.settings.statusBar),
@ -141,7 +143,7 @@ export default class CommanderPlugin extends Plugin {
await this.saveData(this.settings);
}
public listActiveToolbarCommands(): String[] {
public listActiveToolbarCommands(): string[] {
//@ts-ignore
const activeCommands = this.app.vault.getConfig(
"mobileToolbarCommands"

View file

@ -99,13 +99,11 @@ export default class ExplorerManager extends CommandManagerBase {
const setNormal = (): void => {
btn.empty();
btn.style.setProperty("--icon-size", `12px`);
setIcon(btn, pair.icon);
btn.onclick = (): void => app.commands.executeCommandById(pair.id);
};
const setRemovable = (): void => {
btn.empty();
btn.style.setProperty("--icon-size", `12px`);
setIcon(btn, "trash");
btn.onclick = async (): Promise<void> => {
if (

View file

@ -0,0 +1,61 @@
import CommanderPlugin from "src/main";
import { CommandIconPair } from "src/types";
import CommandManagerBase from "./commandManager";
export default class LeftRibbonManager extends CommandManagerBase {
public plugin: CommanderPlugin;
//private addBtn: HTMLDivElement;
public constructor(plugin: CommanderPlugin) {
super(plugin, plugin.settings.leftRibbon);
this.plugin = plugin;
app.workspace.onLayoutReady(() => {
this.plugin.settings.leftRibbon.forEach((pair) =>
this.addCommand(pair, false)
);
// if (this.plugin.settings.showAddCommand) {
// this.plugin.addRibbonIcon("plus", t("Add new"), async () =>
// this.addCommand(await chooseNewCommand(plugin))
// );
// }
});
}
public async addCommand(
pair: CommandIconPair,
newlyAdded = true
): Promise<void> {
if (newlyAdded) {
this.plugin.settings.leftRibbon.push(pair);
await this.plugin.saveSettings();
}
this.plugin.addRibbonIcon(pair.icon, pair.name, () =>
app.commands.executeCommandById(pair.id)
);
this.plugin.register(() => this.removeCommand(pair, false));
}
public async removeCommand(
pair: CommandIconPair,
remove = true
): Promise<void> {
if (remove) {
this.plugin.settings.leftRibbon.remove(pair);
await this.plugin.saveSettings();
}
// @ts-expect-error
const nativeAction = app.workspace.leftRibbon.items.find(
// @ts-expect-error
(i) => i.icon === pair.icon && i.name === i.name
);
if (nativeAction) {
nativeAction.buttonEl.remove();
}
// @ts-expect-error
app.workspace.leftRibbon.items.remove(nativeAction);
}
// eslint-disable-next-line @typescript-eslint/no-empty-function
public reorder(): void {}
}

View file

@ -43,37 +43,44 @@ abstract class Base extends CommandManagerBase {
event.stopImmediatePropagation();
if (!optionMenu) {
optionMenu = new Menu()
.addItem(item => {
item
.setTitle(t("Change Icon"))
.addItem((item) => {
item.setTitle(t("Change Icon"))
.setIcon("box")
.onClick(async () => {
const newIcon = await (new ChooseIconModal(plugin)).awaitSelection();
const newIcon = await new ChooseIconModal(
plugin
).awaitSelection();
if (newIcon && newIcon !== cmdPair.icon) {
cmdPair.icon = newIcon;
await plugin.saveSettings();
}
});
})
.addItem(item => {
item
.setTitle(t("Rename"))
.addItem((item) => {
item.setTitle(t("Rename"))
.setIcon("text-cursor-input")
.onClick(async () => {
const newName = await (new ChooseCustomNameModal(cmdPair.name)).awaitSelection();
const newName =
await new ChooseCustomNameModal(
cmdPair.name
).awaitSelection();
if (newName && newName !== cmdPair.name) {
cmdPair.name = newName;
await plugin.saveSettings();
}
});
})
.addItem(item => {
.addItem((item) => {
item.dom.addClass("is-warning");
item
.setTitle(t("Delete"))
item.setTitle(t("Delete"))
.setIcon("lucide-trash")
.onClick(async () => {
if (!plugin.settings.confirmDeletion || (await new ConfirmDeleteModal(plugin).didChooseRemove())) {
if (
!plugin.settings.confirmDeletion ||
(await new ConfirmDeleteModal(
plugin
).didChooseRemove())
) {
removeMenu();
}
});
@ -83,9 +90,7 @@ abstract class Base extends CommandManagerBase {
optionMenu.hide();
optionMenu = null;
}
});
optionEl.style.setProperty("--icon-size", `16px`);
setIcon(optionEl, "more-vertical");
item.dom.append(optionEl);

View file

@ -54,7 +54,6 @@ export default class StatusBarManager extends CommandManagerBase {
});
this.plugin.register(() => this.addBtn.remove());
this.addBtn.style.setProperty("--icon-size", `12px`);
setIcon(this.addBtn, "plus");
this.addBtn.onclick = async (): Promise<void> => {
const pair = await chooseNewCommand(this.plugin);
@ -95,13 +94,11 @@ export default class StatusBarManager extends CommandManagerBase {
const setNormal = (): void => {
btn.empty();
btn.style.setProperty("--icon-size", `12px`);
setIcon(btn, pair.icon);
btn.onclick = (): void => app.commands.executeCommandById(pair.id);
};
const setRemovable = (): void => {
btn.empty();
btn.style.setProperty("--icon-size", `12px`);
setIcon(btn, "trash");
btn.onclick = async (): Promise<void> => {
if (!this.plugin.settings.confirmDeletion || (await new ConfirmDeleteModal(this.plugin).didChooseRemove())) {

View file

@ -395,8 +395,8 @@
display: flex;
> svg {
width: 70px;
height: 70px;
width: 90px;
height: 90px;
}
}

View file

@ -34,7 +34,7 @@ export interface CommanderSettings {
macros: Macro[];
hide: {
statusbar: string[];
leftRibbon: string[];
leftRibbon?: string[];
};
spacing: number;
advancedToolbar: AdvancedToolbarSettings;
@ -108,7 +108,7 @@ declare module "obsidian" {
callback: () => void;
}[];
collapseButtonEl: HTMLElement;
ribbonItemsEl?: HTMLElement;
ribbonItemsEl: HTMLElement;
addRibbonItemButton: (
icon: string,
name: string,

View file

@ -166,28 +166,40 @@ export default function AdvancedToolbarSettings({ plugin }: { plugin: CommanderP
const ref = useRef<HTMLDivElement>(null);
useEffect(() => {
render(ref.current!, plugin);
if (ref.current) {
render(ref.current, plugin);
}
return () => ref.current && ref.current.empty();
}, []);
return (
<Fragment>
<div className="cmdr-sep-con callout" data-callout="info">
<span className="cmdr-callout-warning"><ObsidianIcon icon="alert-circle" /> {"Info"}</span>
<span className="cmdr-callout-warning">
<ObsidianIcon icon="alert-circle" /> {"Info"}
</span>
<p className="cmdr-warning-description">
{"The Toolbar is only available in Obsidian Mobile. "}
{Platform.isMobile && <>
{"To configure which Commands show up in the Toolbar, open the Mobile Settings."}
</>
}
{Platform.isMobile && (
<>
{
"To configure which Commands show up in the Toolbar, open the Mobile Settings."
}
</>
)}
</p>
{Platform.isMobile && <button onClick={(): void => {
app.setting.openTabById("mobile");
}} className="mod-cta">
{"Open Mobile Settings"}
</button>
}
{Platform.isMobile && (
<button
onClick={(): void => {
app.setting.openTabById("mobile");
}}
className="mod-cta"
>
{"Open Mobile Settings"}
</button>
)}
</div>
<div ref={ref} style={{ paddingBottom: "256px" }} />
<div ref={ref} style={{ paddingBottom: "128px" }} />
</Fragment>
);
}

View file

@ -1,6 +1,24 @@
import { h } from "preact";
import { memo } from "preact/compat";
import logo from "src/assets/commander-logo.svg";
import christmasLogo from "src/assets/commander-logo-christmas.svg";
import halloweenLogo from "src/assets/commander-logo-halloween.svg";
import { moment } from "obsidian";
export default function Logo(): h.JSX.Element {
return <div class="cmdr-icon-wrapper" dangerouslySetInnerHTML={{ __html: logo }} />;
const specialLogos: { [month: number]: string } = {
9: halloweenLogo,
11: christmasLogo,
};
function Logo(): h.JSX.Element {
return (
<div
class="cmdr-icon-wrapper"
dangerouslySetInnerHTML={{
__html: specialLogos[moment().month()] ?? logo,
}}
/>
);
}
export default memo(Logo);

View file

@ -5,8 +5,6 @@ import { Macro, Action, MacroItem } from "src/types";
import { getCommandFromId, ObsidianIcon } from "src/util";
import AddCommandModal from "../addCommandModal";
import ChooseIconModal from "../chooseIconModal";
import ChangeableText from "./ChangeableText";
import CustomJSModal from "./customJSModal";
import { SliderComponent } from "./settingComponent";
interface MacroBuilderProps {
@ -15,7 +13,12 @@ interface MacroBuilderProps {
onSave: (macro: Macro) => void;
onCancel: () => void;
}
export default function ({ plugin, macro, onSave, onCancel }: MacroBuilderProps): h.JSX.Element {
export default function ({
plugin,
macro,
onSave,
onCancel,
}: MacroBuilderProps): h.JSX.Element {
const [name, setName] = useState(macro.name || "Macro Name");
const [icon, setIcon] = useState(macro.icon || "star");
const [startup, setStartup] = useState(macro.startup || false);
@ -42,11 +45,6 @@ export default function ({ plugin, macro, onSave, onCancel }: MacroBuilderProps)
]);
};
const handleAddCustomJS = async () => {
//new CustomJSModal(plugin).open();
//setMacroCommands([...macroCommands, { action: Action.CUSTOM_JS, code: "" }]);
};
return (
<div>
<div class="setting-item cmdr-mm-item">

View file

@ -1,89 +0,0 @@
import { Modal, TextAreaComponent } from "obsidian";
import CommanderPlugin from "src/main";
import { defaultKeymap, history, historyKeymap, indentWithTab } from "@codemirror/commands";
import { javascript } from "@codemirror/lang-javascript";
import {
bracketMatching,
defaultHighlightStyle,
foldGutter,
foldKeymap,
indentOnInput,
syntaxHighlighting,
} from "@codemirror/language";
import { EditorState, Extension } from "@codemirror/state";
import {
drawSelection,
dropCursor,
EditorView,
highlightSpecialChars,
keymap,
lineNumbers,
rectangularSelection,
} from "@codemirror/view";
import { autocompletion, closeBrackets, closeBracketsKeymap, completionKeymap } from "@codemirror/autocomplete";
import { highlightSelectionMatches, searchKeymap } from "@codemirror/search";
export const basicSetup: Extension[] = [
lineNumbers(),
// highlightActiveLineGutter(),
highlightSpecialChars(),
history(),
javascript(),
foldGutter(),
drawSelection(),
dropCursor(),
EditorState.allowMultipleSelections.of(true),
indentOnInput(),
syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
EditorView.lineWrapping,
bracketMatching(),
closeBrackets(),
autocompletion(),
rectangularSelection(),
highlightSelectionMatches(),
keymap.of([
...closeBracketsKeymap,
...defaultKeymap,
...searchKeymap,
...historyKeymap,
indentWithTab,
...foldKeymap,
...completionKeymap,
]),
].filter(ext => ext);
function editorFromTextArea(textarea: HTMLTextAreaElement, extensions: Extension) {
let view = new EditorView({
state: EditorState.create({ doc: textarea.value, extensions }),
});
textarea.parentNode!.insertBefore(view.dom, textarea);
textarea.style.display = "none";
if (textarea.form)
textarea.form.addEventListener("submit", () => {
textarea.value = view.state.doc.toString();
});
return view;
}
export default class CustomJSModal extends Modal {
private plugin: CommanderPlugin;
editor: EditorView;
public constructor(
plugin: CommanderPlugin,
) {
super(app);
this.plugin = plugin;
}
public onOpen(): void {
this.titleEl.setText("Macro Builder");
const customCSSEl = new TextAreaComponent(this.contentEl);
this.editor = editorFromTextArea(customCSSEl.inputEl, basicSetup);
}
public onClose(): void {
this.containerEl.empty();
this.editor?.destroy();
}
}

View file

@ -131,7 +131,22 @@ export default function settingTabComponent({
<CommandViewer
manager={plugin.manager.leftRibbon}
plugin={plugin}
/>
>
<hr />
<div
className="cmdr-sep-con callout"
data-callout="warning"
>
<span className="cmdr-callout-warning">
Reordering/Sorting
</span>
<p className="cmdr-warning-description">
As of Obsidian 1.1.0 you can reorder the Buttons
in the left ribbon by dragging. This will
replace the old sorting feature.
</p>
</div>
</CommandViewer>
),
},
// {

View file

@ -43,12 +43,15 @@ interface ObsidianIconProps extends ComponentProps<"div"> {
icon: string;
size?: number;
}
export function ObsidianIcon({ icon, size, ...props }: ObsidianIconProps): h.JSX.Element {
export function ObsidianIcon({
icon,
size,
...props
}: ObsidianIconProps): h.JSX.Element {
const iconEl = useRef<HTMLDivElement>(null);
useLayoutEffect(() => {
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
iconEl.current!.style.setProperty("--icon-size", `${size}px`);
setIcon(iconEl.current!, icon);
}, [icon, size]);
@ -57,7 +60,12 @@ export function ObsidianIcon({ icon, size, ...props }: ObsidianIconProps): h.JSX
export function isModeActive(mode: string): boolean {
const { isMobile, appId } = app;
return mode === "any" || mode === appId || (mode === "mobile" && isMobile) || (mode === "desktop" && !isMobile);
return (
mode === "any" ||
mode === appId ||
(mode === "mobile" && isMobile) ||
(mode === "desktop" && !isMobile)
);
}
export function updateHiderStylesheet(settings: CommanderSettings): void {
@ -65,14 +73,17 @@ export function updateHiderStylesheet(settings: CommanderSettings): void {
for (const id of settings.hide.statusbar) {
style += `div.status-bar-item.plugin-${id} {display: none !important; content-visibility: hidden;}`;
}
for (const name of settings.hide.leftRibbon) {
style += `div.side-dock-ribbon-action[aria-label="${name}"] {display: none !important; content-visibility: hidden;}`;
}
document.head.querySelector("style#cmdr")?.remove();
if (style) {
document.head.appendChild(createEl("style", { attr: { "id": "cmdr" }, text: style, type: "text/css" }));
document.head.appendChild(
createEl("style", {
attr: { id: "cmdr" },
text: style,
type: "text/css",
})
);
}
}