diff --git a/ea-scripts/Shade Master.md b/ea-scripts/Shade Master.md
index 1f1cb1c..65c340e 100644
--- a/ea-scripts/Shade Master.md
+++ b/ea-scripts/Shade Master.md
@@ -15,7 +15,7 @@ Holding down both SHIFT and CTRL/CMD when clicking the script button will toggle
```js*/
-if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("2.7.3")) {
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.7.19")) {
new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
return;
}
@@ -91,12 +91,12 @@ function modifyColor(color, modifiers) {
function showSettingsModal() {
const modal = new ea.obsidian.Modal(app);
let dirty = false;
-
+
modal.onOpen = () => {
- const {contentEl} = modal;
-
- contentEl.createEl('h2', {text: 'Shade Master'});
-
+ const { contentEl } = modal;
+ modal.bgOpacity = 0;
+ contentEl.createEl('h2', { text: 'Shade Master' });
+
const instructions = contentEl.createDiv();
instructions.innerHTML = `
Instructions
@@ -118,8 +118,8 @@ function showSettingsModal() {
.addText(text => text
.setValue(settings["Step size"].value.toString())
.onChange(value => {
- val = parseFloat(value);
- if(isNaN(val)) {
+ const val = parseFloat(value);
+ if (isNaN(val)) {
new Notice("Enter a valid number");
return;
}
@@ -145,8 +145,8 @@ function showSettingsModal() {
new ea.obsidian.Setting(contentEl)
.setName(ACTION)
.setDesc("Sets which aspect of the color should be modified")
- .addDropdown(dropdown=>dropdown
- .addOptions(ACTIONS.reduce((acc, key) => { acc[key] = key; return acc;}, {}))
+ .addDropdown(dropdown => dropdown
+ .addOptions(ACTIONS.reduce((acc, key) => { acc[key] = key; return acc; }, {}))
.setValue(settings[ACTION].value)
.onChange(value => {
settings[ACTION].value = value;
@@ -158,10 +158,12 @@ function showSettingsModal() {
.setButtonText("Close")
.setCta(true)
.onClick(() => modal.close()));
+
+ makeModalDraggable(modal.modalEl); // Add draggable functionality
};
modal.onClose = () => {
- if(dirty) {
+ if (dirty) {
ea.setScriptSettings(settings);
}
};
@@ -169,6 +171,47 @@ function showSettingsModal() {
modal.open();
}
+/**
+ * Add draggable functionality to the modal element.
+ * @param {HTMLElement} modalEl - The modal element to make draggable.
+ */
+function makeModalDraggable(modalEl) {
+ let isDragging = false;
+ let startX, startY, initialX, initialY;
+
+ const header = modalEl.querySelector('.modal-titlebar') || modalEl; // Default to modalEl if no titlebar
+ header.style.cursor = 'move';
+
+ header.addEventListener('mousedown', (e) => {
+ isDragging = true;
+ startX = e.clientX;
+ startY = e.clientY;
+ const rect = modalEl.getBoundingClientRect();
+ initialX = rect.left;
+ initialY = rect.top;
+
+ modalEl.style.position = 'absolute';
+ modalEl.style.margin = '0'; // Reset margin to avoid issues
+ modalEl.style.left = `${initialX}px`;
+ modalEl.style.top = `${initialY}px`;
+ });
+
+ document.addEventListener('mousemove', (e) => {
+ if (!isDragging) return;
+
+ const dx = e.clientX - startX;
+ const dy = e.clientY - startY;
+
+ modalEl.style.left = `${initialX + dx}px`;
+ modalEl.style.top = `${initialY + dy}px`;
+ });
+
+ document.addEventListener('mouseup', () => {
+ isDragging = false;
+ });
+}
+
+
// Main script execution
const allElements = ea.getViewSelectedElements();
const regularElements = allElements.filter(el =>