1.6.4

feat: add Fixed inner distance script

.eslintignore

@@ -0,0 +1,4 @@
+node_modules/
+.github/
+docs/
+images/

.eslintrc.json

@@ -0,0 +1,7 @@
+{
+  "extends": ["@excalidraw/eslint-config"],
+  "rules": {
+    "import/no-anonymous-default-export": "off",
+    "no-restricted-globals": "off"
+  }
+}

.github/workflows/codeql-analysis.yml

@@ -0,0 +1,70 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: "CodeQL"
+
+on:
+  push:
+    branches: [ master ]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [ master ]
+  schedule:
+    - cron: '38 14 * * 4'
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language: [ 'javascript' ]
+        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
+        # Learn more about CodeQL language support at https://git.io/codeql-language-support
+
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v2
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v1
+      with:
+        languages: ${{ matrix.language }}
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file.
+        # Prefix the list here with "+" to use these queries and those in the config file.
+        # queries: ./path/to/local/query, your-org/your-repo/queries@main
+
+    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+    # If this step fails, then you should remove it and run the build manually (see below)
+    - name: Autobuild
+      uses: github/codeql-action/autobuild@v1
+
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 https://git.io/JvXDl
+
+    # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+    #    and modify them (or add more) to build your code if your project
+    #    uses a compiled language
+
+    #- run: |
+    #   make bootstrap
+    #   make release
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v1

.replit

@@ -0,0 +1,2 @@
+language = "nodejs"
+run = "npm run dev"

README.md

@@ -1,58 +1,58 @@
 The Obsidian-Excalidraw plugin integrates [Excalidraw](https://excalidraw.com/), a feature rich sketching tool, into Obsidian. You can store and edit Excalidraw files in your vault, you can embed drawings into your documents, and you can link to documents and other drawings to/and from Excalidraw. For a showcase of Excalidraw features, please read my blog post [here](https://www.zsolt.blog/2021/03/showcasing-excalidraw.html) and/or watch the videos below.
 
+Please upgrade to Obsidian v0.12.19 or higher to get the latest release. 
+
 ![image](https://user-images.githubusercontent.com/14358394/125159831-336d6880-e17a-11eb-8a3d-ceabc2555a08.png)
 
-# Important notice to the 1.2.0 update
-
-This version comes with tons of new features and possibilities. 
-
-Drawings you've created with version 1.1.x need to be converted to take advantage of the new features. If you want, you can also continue to use your exisiting drawings in compatibility mode (e.g. if you use Logseq and Obsidian in parallel). During conversion your existing `*.excalidraw` files will be replaced with new `*.excalidraw.md` files.
-
-## Conversion and compatibility
-To convert files you have the following options:
-- Click `CONVERT FILES` in the migration dialog when installing 1.2.0
-- In the Command Palette select `Excalidraw: Convert *.excalidraw files to *.excalidraw.md files` to convert all `*.excalidraw` files to `*.excalidraw.md` files. 
-- To convert files individually: 
-  - Right click an `*.excalidraw` file in File Explorer and select one of the following options:
-    - `*.excalidraw => *.excalidraw.md`
-    - `*.excalidraw => *.md (Logseq compatibility)`: This option will retain the original *.excalidraw file next to the new Obsidian format. Make sure you also enable additional `Compatibility features` in `Settings` for a full solution.
-  - Open a legacy `*.excalidraw` file and select `Convert to new format` from the `Options Menu` in the Excalidraw view.
-
 # Video walkthrough
 | | | |
 |----|----|----|
 |[![Obsidian-Excalidraw 1.2.0 update - Major IMPROVEMENTS](https://user-images.githubusercontent.com/14358394/124356817-7b3f3d80-dc18-11eb-932d-363bb373c5ab.jpg)](https://youtu.be/UxJLLYtgDKE)|[![1  Getting Started](https://user-images.githubusercontent.com/14358394/125160304-7f211180-e17c-11eb-8363-c52723de1ffd.jpg)](https://youtu.be/sY4FoflGaiM)|[![2  Basic shapes and features](https://user-images.githubusercontent.com/14358394/125160312-8a743d00-e17c-11eb-9fa2-490ef4cbd59e.jpg)](https://youtu.be/Iy_oVTq12Gw)|
 |[![3  Groups](https://user-images.githubusercontent.com/14358394/125160323-96f89580-e17c-11eb-9bce-8eb1067a51bb.jpg)](https://youtu.be/QOL1KF7-kdc)|[![4  Stencil](https://user-images.githubusercontent.com/14358394/125160332-9f50d080-e17c-11eb-98e9-fec60fe147d9.jpg)](https://youtu.be/aSgcbfspvfo)|[![5  embedding](https://user-images.githubusercontent.com/14358394/125160341-a546b180-e17c-11eb-9de8-d87fdc844c9c.jpg)](https://youtu.be/MaJ5jJwBRWs)|
 |[![6  Links](https://user-images.githubusercontent.com/14358394/125160346-aa0b6580-e17c-11eb-930b-4024807040d1.jpg)](https://youtu.be/MXzeCOEExNo)|[![7  Markdown](https://user-images.githubusercontent.com/14358394/125160354-b2fc3700-e17c-11eb-81af-9e71e461f6dd.jpg)](https://youtu.be/R0IAg0s-wQE)|[![8  Templates](https://user-images.githubusercontent.com/14358394/125160360-b8f21800-e17c-11eb-8bd8-79d4e3f6e92d.jpg)](https://youtu.be/ibdS7ykwpW4)|
-|[![9  Excalidraw Automate](https://user-images.githubusercontent.com/14358394/125160367-bdb6cc00-e17c-11eb-92f1-6f59faea85fd.jpg)](https://youtu.be/VRZVujfVab0)|[![10  Miscellaneous](https://user-images.githubusercontent.com/14358394/125160374-c3141680-e17c-11eb-8cc2-dfaffd903d15.jpg)](https://youtu.be/D1iBYo1_jjc)||
+|[![9  Excalidraw Automate](https://user-images.githubusercontent.com/14358394/125160367-bdb6cc00-e17c-11eb-92f1-6f59faea85fd.jpg)](https://youtu.be/VRZVujfVab0)|[![10  Miscellaneous](https://user-images.githubusercontent.com/14358394/125160374-c3141680-e17c-11eb-8cc2-dfaffd903d15.jpg)](https://youtu.be/D1iBYo1_jjc)|[![Image Elements](https://user-images.githubusercontent.com/14358394/138607067-ccb62f92-48a4-4880-ac6e-68c1bf86ac2c.png)](https://www.youtube.com/watch?v=_c_0zpBJ4Xc&)|
+|[![LaTex Demo](https://user-images.githubusercontent.com/14358394/143732412-1c65227e-4381-406d-847a-b001ab3506ca.jpg)](https://youtu.be/r08wk-58DPk)|[![markdown embeds](https://user-images.githubusercontent.com/14358394/143732440-90bfa029-8615-462e-ada3-c903d71a82c9.jpg)](https://youtu.be/tsecSfnTMow)|[![markdownAdvanced](https://user-images.githubusercontent.com/14358394/143783906-15cee494-c6d5-4495-a2ca-74634e4e7355.jpg)](https://youtu.be/K6qZkTz8GHs)|
+|[![Script Engine](https://user-images.githubusercontent.com/14358394/145684531-8d9c2992-59ac-4ebc-804a-4cce1777ded2.jpg)](https://youtu.be/hePJcObHIso)|[![sticky notes thumbnail](https://user-images.githubusercontent.com/14358394/147283367-e5689385-ea51-4983-81a3-04d810d39f62.jpg)](https://youtu.be/NOuddK6xrr8)|[![plugin store](https://user-images.githubusercontent.com/14358394/147889174-6c306d0d-2d29-46cc-a53f-3f0013cf14de.jpg)](https://youtu.be/lzYdOQ6z8F0)|
+|[![fourtfont](https://user-images.githubusercontent.com/14358394/149659524-2a4e0a24-40c9-4e66-a6b1-c92f3b88ecd5.jpg)](https://youtu.be/eKFmrSQhFA4)|[![thumbnail](https://user-images.githubusercontent.com/14358394/151705333-54e9ffd2-0bd7-4d02-b99e-0bd4e4708d4d.jpg)](https://youtu.be/qbPIAZguJeo)|[![Thumbnail](https://user-images.githubusercontent.com/14358394/152585752-7eb0371f-0bab-40f6-a194-3b48e5811735.jpg)](https://youtu.be/2Y8OhkGiTHg)|
+
 
 # Key features
-- The plugin aims to integrate Excalidraw seemlessly into Obsidian including Command Palette actions, File Explorer features, Option Menu commands, and the Ribbon Button.
-- CTRL+Click on the ribbon button, or in the file explorer to create / open drawings in a new pane.
-- Settings will allow you to customzie Excalidraw to your needs:
+- The plugin aims to integrate Excalidraw seamlessly into Obsidian including Command Palette actions, File Explorer features, Option Menu commands, and the Ribbon Button.
+- CTRL/CMD+Click on the ribbon button, or in the file explorer to create / open drawings in a new pane.
+- Settings will allow you to customize Excalidraw to your needs:
   - Default folder for new drawings and define custom filename pattern for new drawings.
   - Template for new drawings. The template will restore stroke properties. This means you can set up defaults in your template for stroke color, stroke width, opacity, font family, font size, fill style, stroke style, etc. This also applies to ExcalidrawAutomate.
-  - If portability is important to you: Auto-export SVG and/or PNG files including keep-in-sync feature so you can embed svg/png into your documents instead of embedding excalidraw files.
+  - If portability is important to you: Auto-export SVG and/or PNG files including keep-in-sync feature so you can embed SVG/PNG into your documents instead of embedding excalidraw files.
   - Specify the default width of embedded drawings.
   - Compatibility features to auto-export and keep in sync markdown excalidraw files and legacy .excalidraw files.
-  - Experimental feature to add custom TAG to file expolorer to mark drawing files.
+  - Experimental feature to add custom TAG to file explorer to mark drawing files.
   - Enable / disable autosave.
-- You can customize the size and position of the embedded images using the `[[image.excalidraw|100]]`, `[[image.excalidraw|100x100]]`, `[[image.excalidraw|100|left]]`, `[[image.excalidraw|right-wrap]]`, formatting options. `[[<filename.excalidraw>|<width>x<height>|<alignment>]]`. You can add your custom alignment via css. Any text that appears in `<alignment>` will be added to the rendered SVG element style and to the wrapper DIV element. Check below and styles.css for more insight.
+- You can customize the size and position of the embedded images using the `![[image.excalidraw|100]]`, `![[image.excalidraw|100x100]]`, `![[image.excalidraw|100|left]]`, `![[image.excalidraw|right-wrap]]`, formatting options. `![[<filename.excalidraw>|<width>x<height>|<alignment>]]`. You can add your custom alignment via CSS. Any text that appears in `<alignment>` will be added to the rendered SVG element style and to the wrapper DIV element. Check below and styles.css for more insight.
 - Supports hyperlinks e.g. `https://zsolt.blog`, `[Obsidian](https://obsidian.md)`, and internal links e.g. `[[My file in vault|Alias]]` in drawing text. 
-  - Links will update when files are moved or renamed, if you have the Obsidian setting Files & Links/Automatically Update Internal Links enalbled.
+  - Links will update when files are moved or renamed, if you have the Obsidian setting Files & Links/Automatically Update Internal Links enabled.
   - Links in drawings will show up in backlinks of documents
   - Transclusions are supported 
     - `![[myfile#^blockref]]` will convert in the drawing into the transcluded text of the block
     - `![[myfile#section]]` also works, this will transclude the section
     - you can also specify word wrapping for transcluded text by adding the max character count in curly brackets right after the transclusion e.g. `![[myfile#^blockref]]{40}` will wrap text at 40 characters.
   - For convenience you can also use the command palette to insert links into drawings
-  - CTRL/META + hover to bring up the Obsidian quick preview for the link. (On Mac it is CTRL+CMD+hover).
-  - CTRL/META + CLICK a text element to open it as a link.
-  - CTRL/META + ALT + CLICK to create the file (if it does not yet exist) and open it
-  - CTRL/META + SHIFT + CLICK to open the file in a new pane
-  - CTRL/META + ALT + SHIFT + CLICK to create the file (if it does not yet exist) and open it in a new pane
+  - CTRL/CMD + hover to bring up the Obsidian quick preview for the link. (On Mac it is CTRL+CMD+hover).
+  - CTRL/CMD + CLICK a text element to open it as a link.
+  - CTRL/CMD + ALT + CLICK to create the file (if it does not yet exist) and open it
+  - CTRL/CMD + SHIFT + CLICK to open the file in a new pane
+  - CTRL/CMD + ALT + SHIFT + CLICK to create the file (if it does not yet exist) and open it in a new pane
 - Using the block reference you can also reference & transclude text that appears on drawings, in other documents
-- Insert LaTex symbols and simple formulas using the Command Palette action "Insert LaTeX-symbol". Some symbols may not display properly using the "Hand-drawn" font. If that is the case try using the "Normal" or "Code" fonts.
+- Insert LaTeX formulas using the Command Palette action "Insert LaTeX formula". You can edit formulas either in Markdown view, or by CTRL/CMD + Click on the formula.
+- Drag & Drop support
+  - You can drag files from the Obsidian file explorer and they will become links to those files in Excalidraw.
+  - Dragging image files (PNG, SVG, JPG, Excalidraw) from obsidian files explorer while pressing the CTRL/CMD button will embed the image into your drawing.
+  - You can drag and drop images from outside obsidian onto Excalidraw. These images will be embedded into your drawing and saved to Obsidian.
+  - You can drag and drop text from Markdown views onto Excalidraw.
+  - You can drag and drop web addresses from your browser and they will become links.
+- Image support
+  - On iOS and Android you can add images from your camera by pressing the add image button in Excalidraw.
+  - You can copy/paste images into your drawing. Images will be saved in your vault.
+  - You can drag and drop images as explained above.
 - Since 1.2.0 Drawing files are stored in Markdown files
   - You can add tags to drawings
   - You can add metadata to the YAML front matter of drawings
@@ -62,18 +62,30 @@ To convert files you have the following options:
     - `excalidraw-link-prefix: "📍"` preview prefix for internal links
     - `excalidraw-url-prefix: "🌐"` preview prefix for external links
     - `excalidraw-link-brackets: true|false` whether or not to display brackets around links in preview
-- Includes full [Templater](https://silentvoid13.github.io/Templater/) and [Dataview](https://blacksmithgu.github.io/obsidian-dataview/docs/api/intro/) support through ExcalidrawAutomate. Check out the [detailed help + examples](https://zsviczian.github.io/obsidian-excalidraw-plugin/)
+    - `excalidraw-default-mode: view|zen` Open this document in view mode or zen mode by defult. Default view mode is excellent for presentation slides.
+- Embed complete markdown files into your drawings
+  - Drag from the desired file from the Obsidian file explorer and hold down CTRL/CMD while dropping the file onto the canvas.
+  - Use the command palette action: `Insert markdown file from vault`
+  - Use custom woff, woff2 or TTF font to display the document, you can set the default font to use under Excalidraw Settings.
+  - You can set a custom css for rendering the snapshot image of your markdown document. Only operating system standard fonts are supported as the font-family ([Win10](https://docs.microsoft.com/en-us/typography/fonts/windows_10_font_list), [Mac & iOS](https://developer.apple.com/fonts/system-fonts/)), plus you can set one additional custom font using the setting explained above. (for a demonstration watch this [video](https://youtu.be/K6qZkTz8GHs) and check out this [sample css](https://github.com/zsviczian/obsidian-excalidraw-plugin/discussions/281)).
+    - To help with styling you can observe the SVG snapshot of the markdown document created by Excalidraw. Open Obsidian Developer Console (CTRL+Shift+i) and execute the following command: `ExcalidrawAutomate.mostRecentMarkdownSVG`
+  - You can control appearance of the embedded markdown file on a file by file bases by adding the following front matter keys to your markdown document:
+    - `excalidraw-font: Virgil|Cascadia|font_file_name.extension`
+    - `excalidraw-font-color: css-color-name|#HEXcolor|any-other-html-standard-format`, you can find css color names [here](https://www.w3schools.com/colors/colors_names.asp).
+    - `excalidraw-css: "css-filename|css snippet"`
+  - Switch to markdown view or use CTRL/CMD+ALT/OPT click on the image to edit properties of the embed: `[[filename#^blockref|WIDTHxMAXHEIGHT]]`
+- Includes full [QuickAdd](https://github.com/chhoumann/quickadd), [Templater](https://silentvoid13.github.io/Templater/) and [Dataview](https://blacksmithgu.github.io/obsidian-dataview/docs/api/intro/) support through ExcalidrawAutomate. Check out the [detailed help + examples](https://zsviczian.github.io/obsidian-excalidraw-plugin/). I also have a [YouTube ExcalidrawAutomate Playlist](https://www.youtube.com/playlist?list=PL6mqgtMZ4NP1IR4nXxSlMA4PA5E-qpyHZ) with lots of examples.
+  - Since 1.5.0 you can easily execute ExcalidrawAutomate macros and assign command palette shortcuts to them, using the ScriptEngine. You will find an intro video and a growing library of ready to install scripts [here](https://github.com/zsviczian/obsidian-excalidraw-plugin/tree/master/ea-scripts).
 - REQUIRES AN OBSIDIAN SYNC SUBSCRIPTION: Full drawing file history and synchronization between devices
 - Multilanguage support: if you'd like to help out by translating the plugin, please get in contact with me.
 
 # Known issues
 - Mobile support
-  - Positioning of the pen gets misaligned after you open the command palette.
   - Partially mitigated in 1.0.10 by the introduction of autosave: Your drawing will not be saved when you terminate the mobile app by closing the Obsidian task. 
+- Text elements "jumps off screen" when editing, if drawing is zoomed in and text element does not fit the visible screen area. I am working on a resolution.
 
 # Tips and tricks
-- If you want to sketch in fullscreen, I recommend installing the [Fullscreen Focus Mode](https://github.com/razumihin/obsidian-fullscreen-plugin) plugin.
-- [Ozan's Image in Editor Plugin](https://github.com/ozntel/oz-image-in-editor-obsidian). In a nice collaboration with Ozan, his Image-in-Editor plugin now supports Excalidraw. I recommend installing his plugin to display drawings also in Edit mode. Note that Ozan's plugin will only display Excalidraw drawings if the link ends with `.md` or `.excalidraw`. i.e. the following drawing will show in Edit Mode `![[My Drawing.md]]`, but wiki links such as `[[My Drawing]]` will not.
+- [Ozan's Image in Editor Plugin](https://github.com/ozntel/oz-image-in-editor-obsidian). In a nice collaboration with Ozan, his Image-in-Editor plugin now supports Excalidraw. I recommend installing his plugin to display drawings also in Edit mode. 
 
 # Feedback, questions, ideas, problems
 Join the conversation about the Excalidraw plugin on [forum.obsidian.md](https://forum.obsidian.md/t/excalidraw-full-featured-sketching-plugin-in-obsidian)

TODO.md

@@ -0,0 +1,14 @@
+[x] do not embed font into SVG when embedding Excalidraw into other Excalidraw
+[x] add ```html <SVG>...</SVG> ``` codeblock to excalidraw markdown
+[x] read pre-saved `<SVG>` when generating image preview
+[x] update code to adopt change files moving from AppState to App 
+- Add "files" to legacy excalidraw export
+
+[x] PNG preview
+[x] markdown embed SVG 190
+[x] markdown embed PNG
+[x] embed Excalidraw into other Excalidraw
+
+
+
+

docs/API/attributes_functions_overview.md

@@ -3,136 +3,198 @@
 Here's the interface implemented by ExcalidrawAutomate:
 
 ```typescript
-export interface ExcalidrawAutomate extends Window {
-  ExcalidrawAutomate: {
-    plugin: ExcalidrawPlugin;
-    elementsDict: {};
-    style: {
-      strokeColor: string;
-      backgroundColor: string;
-      angle: number;
-      fillStyle: FillStyle;
-      strokeWidth: number;
-      storkeStyle: StrokeStyle;
-      roughness: number;
-      opacity: number;
-      strokeSharpness: StrokeSharpness;
-      fontFamily: number;
-      fontSize: number;
-      textAlign: string;
-      verticalAlign: string;
-      startArrowHead: string;
-      endArrowHead: string;
-    }
-    canvas: {
-      theme: string, 
-      viewBackgroundColor: string, 
-      gridSize: number
-    };
-    setFillStyle (val:number): void;
-    setStrokeStyle (val:number): void;
-    setStrokeSharpness (val:number): void;
-    setFontFamily (val:number): void;
-    setTheme (val:number): void;
-    addToGroup (objectIds:[]):string;
-    toClipboard (templatePath?:string): void;
-    getElements ():ExcalidrawElement[];
-    getElement (id:string):ExcalidrawElement;
-    create (
-      params?: {
-        filename?: string, 
-        foldername?:string, 
-        templatePath?:string, 
-        onNewPane?: boolean,
-        frontmatterKeys?:{
-          "excalidraw-plugin"?: "raw"|"parsed",
-          "excalidraw-link-prefix"?: string,
-          "excalidraw-link-brackets"?: boolean,
-          "excalidraw-url-prefix"?: string
-        }
-      }
-    ):Promise<string>;
-    createSVG (templatePath?:string):Promise<SVGSVGElement>;
-    createPNG (templatePath?:string):Promise<any>;
-    wrapText (text:string, lineLen:number):string;
-    addRect (topX:number, topY:number, width:number, height:number):string;
-    addDiamond (topX:number, topY:number, width:number, height:number):string;
-    addEllipse (topX:number, topY:number, width:number, height:number):string;
-    addBlob (topX:number, topY:number, width:number, height:number):string;
-    addText (
-      topX:number, 
-      topY:number, 
-      text:string, 
-      formatting?: {
-        wrapAt?:number, 
-        width?:number, 
-        height?:number,
-        textAlign?: string, 
-        box?: "box"|"blob"|"ellipse"|"diamond", 
-        boxPadding?: number
-      },
-      id?:string
-    ):string;
-    addLine(points: [[x:number,y:number]]):string;
-    addArrow (
-      points: [[x:number,y:number]],
-      formatting?: {
-        startArrowHead?:string,
-        endArrowHead?:string,
-        startObjectId?:string,
-        endObjectId?:string
-      }
-    ):string ;
-    connectObjects (
-      objectA: string, 
-      connectionA: ConnectionPoint, 
-      objectB: string, 
-      connectionB: ConnectionPoint, 
-      formatting?: {
-        numberOfPoints?: number,
-        startArrowHead?:string,
-        endArrowHead?:string, 
-        padding?: number
-      }
-    ):void;
-    clear (): void;
-    reset (): void;
-    isExcalidrawFile (f:TFile): boolean;  
-    //view manipulation
-    targetView: ExcalidrawView;
-    setView (view:ExcalidrawView|"first"|"active"):ExcalidrawView;
-    getExcalidrawAPI ():any;
-    getViewElements ():ExcalidrawElement[];
-    deleteViewElements (el: ExcalidrawElement[]):boolean;
-    getViewSelectedElement( ):ExcalidrawElement;
-    getViewSelectedElements ():ExcalidrawElement[];
-    viewToggleFullScreen (forceViewMode?:boolean):void;
-    connectObjectWithViewSelectedElement (
-      objectA:string,
-      connectionA: ConnectionPoint, 
-      connectionB: ConnectionPoint, 
-      formatting?: {
-        numberOfPoints?: number,
-        startArrowHead?:string,
-        endArrowHead?:string, 
-        padding?: number
-      }
-    ):boolean;
-    addElementsToView (repositionToCursor:boolean, save:boolean):Promise<boolean>;
-    onDropHook (data: {
-      ea: ExcalidrawAutomate, 
-      event: React.DragEvent<HTMLDivElement>,
-      draggable: any, //Obsidian draggable object
-      type: "file"|"text"|"unknown",
-      payload: {
-        files: TFile[], //TFile[] array of dropped files
-        text: string, //string 
-      },
-      excalidrawFile: TFile, //the file receiving the drop event
-      view: ExcalidrawView, //the excalidraw view receiving the drop
-      pointerPosition: {x:number, y:number} //the pointer position on canvas at the time of drop
-    }):boolean;
+export interface ExcalidrawAutomate {
+  plugin: ExcalidrawPlugin;
+  elementsDict: {}; //contains the ExcalidrawElements currently edited in Automate indexed by el.id
+  imagesDict: {}; //the images files including DataURL, indexed by fileId
+  style: {
+    strokeColor: string; //https://www.w3schools.com/colors/default.asp
+    backgroundColor: string;
+    angle: number; //radian
+    fillStyle: FillStyle; //type FillStyle = "hachure" | "cross-hatch" | "solid"
+    strokeWidth: number;
+    strokeStyle: StrokeStyle; //type StrokeStyle = "solid" | "dashed" | "dotted"
+    roughness: number;
+    opacity: number;
+    strokeSharpness: StrokeSharpness; //type StrokeSharpness = "round" | "sharp"
+    fontFamily: number; //1: Virgil, 2:Helvetica, 3:Cascadia, 4:LocalFont
+    fontSize: number;
+    textAlign: string; //"left"|"right"|"center"
+    verticalAlign: string; //"top"|"bottom"|"middle" :for future use, has no effect currently
+    startArrowHead: string; //"triangle"|"dot"|"arrow"|"bar"|null
+    endArrowHead: string;
   };
+  canvas: {
+    theme: string; //"dark"|"light"
+    viewBackgroundColor: string;
+    gridSize: number;
+  };
+  setFillStyle(val: number): void; //0:"hachure", 1:"cross-hatch" 2:"solid"
+  setStrokeStyle(val: number): void; //0:"solid", 1:"dashed", 2:"dotted"
+  setStrokeSharpness(val: number): void; //0:"round", 1:"sharp"
+  setFontFamily(val: number): void; //1: Virgil, 2:Helvetica, 3:Cascadia
+  setTheme(val: number): void; //0:"light", 1:"dark"
+  addToGroup(objectIds: []): string;
+  toClipboard(templatePath?: string): void;
+  getElements(): ExcalidrawElement[]; //get all elements from ExcalidrawAutomate elementsDict
+  getElement(id: string): ExcalidrawElement; //get single element from ExcalidrawAutomate elementsDict
+  create(params?: {
+    //create a drawing and save it to filename
+    filename?: string; //if null: default filename as defined in Excalidraw settings
+    foldername?: string; //if null: default folder as defined in Excalidraw settings
+    templatePath?: string;
+    onNewPane?: boolean;
+    frontmatterKeys?: {
+      "excalidraw-plugin"?: "raw" | "parsed";
+      "excalidraw-link-prefix"?: string;
+      "excalidraw-link-brackets"?: boolean;
+      "excalidraw-url-prefix"?: string;
+    };
+  }): Promise<string>;
+  createSVG(
+    templatePath?: string,
+    embedFont?: boolean,
+    exportSettings?: ExportSettings, //use ExcalidrawAutomate.getExportSettings(boolean,boolean)
+    loader?: EmbeddedFilesLoader, //use ExcalidrawAutomate.getEmbeddedFilesLoader(boolean?)
+    theme?: string,
+  ): Promise<SVGSVGElement>;
+  createPNG(
+    templatePath?: string,
+    scale?: number,
+    exportSettings?: ExportSettings, //use ExcalidrawAutomate.getExportSettings(boolean,boolean)
+    loader?: EmbeddedFilesLoader, //use ExcalidrawAutomate.getEmbeddedFilesLoader(boolean?)
+    theme?: string,
+  ): Promise<any>;
+  wrapText(text: string, lineLen: number): string;
+  addRect(topX: number, topY: number, width: number, height: number): string;
+  addDiamond(topX: number, topY: number, width: number, height: number): string;
+  addEllipse(topX: number, topY: number, width: number, height: number): string;
+  addBlob(topX: number, topY: number, width: number, height: number): string;
+  addText(
+    topX: number,
+    topY: number,
+    text: string,
+    formatting?: {
+      wrapAt?: number;
+      width?: number;
+      height?: number;
+      textAlign?: string;
+      box?: boolean | "box" | "blob" | "ellipse" | "diamond"; //if !null, text will be boxed
+      boxPadding?: number;
+    },
+    id?: string,
+  ): string;
+  addLine(points: [[x: number, y: number]]): string;
+  addArrow(
+    points: [[x: number, y: number]],
+    formatting?: {
+      startArrowHead?: string;
+      endArrowHead?: string;
+      startObjectId?: string;
+      endObjectId?: string;
+    },
+  ): string;
+  addImage(topX: number, topY: number, imageFile: TFile): Promise<string>;
+  addLaTex(topX: number, topY: number, tex: string): Promise<string>;
+  connectObjects(
+    objectA: string,
+    connectionA: ConnectionPoint, //type ConnectionPoint = "top" | "bottom" | "left" | "right" | null
+    objectB: string,
+    connectionB: ConnectionPoint, //when passed null, Excalidraw will automatically decide
+    formatting?: {
+      numberOfPoints?: number; //points on the line. Default is 0 ie. line will only have a start and end point
+      startArrowHead?: string; //"triangle"|"dot"|"arrow"|"bar"|null
+      endArrowHead?: string; //"triangle"|"dot"|"arrow"|"bar"|null
+      padding?: number;
+    },
+  ): void;
+  clear(): void; //clear elementsDict and imagesDict only
+  reset(): void; //clear() + reset all style values to default
+  isExcalidrawFile(f: TFile): boolean; //returns true if MD file is an Excalidraw file
+  //view manipulation
+  targetView: ExcalidrawView; //the view currently edited
+  setView(view: ExcalidrawView | "first" | "active"): ExcalidrawView;
+  getExcalidrawAPI(): any; //https://github.com/excalidraw/excalidraw/tree/master/src/packages/excalidraw#ref
+  getViewElements(): ExcalidrawElement[]; //get elements in View
+  deleteViewElements(el: ExcalidrawElement[]): boolean;
+  getViewSelectedElement(): ExcalidrawElement; //get the selected element in the view, if more are selected, get the first
+  getViewSelectedElements(): ExcalidrawElement[];
+  getViewFileForImageElement(el: ExcalidrawElement): TFile | null; //Returns the TFile file handle for the image element
+  copyViewElementsToEAforEditing(elements: ExcalidrawElement[]): void; //copies elements from view to elementsDict for editing
+  viewToggleFullScreen(forceViewMode?: boolean): void;
+  connectObjectWithViewSelectedElement( //connect an object to the selected element in the view
+    objectA: string, //see connectObjects
+    connectionA: ConnectionPoint,
+    connectionB: ConnectionPoint,
+    formatting?: {
+      numberOfPoints?: number;
+      startArrowHead?: string;
+      endArrowHead?: string;
+      padding?: number;
+    },
+  ): boolean;
+  addElementsToView( //Adds elements from elementsDict to the current view
+    repositionToCursor?: boolean, //default is false
+    save?: boolean, //default is true
+    //newElementsOnTop controls whether elements created with ExcalidrawAutomate
+    //are added at the bottom of the stack or the top of the stack of elements already in the view
+    //Note that elements copied to the view with copyViewElementsToEAforEditing retain their
+    //position in the stack of elements in the view even if modified using EA
+    newElementsOnTop?: boolean, //default is false, i.e. the new elements get to the bottom of the stack
+  ): Promise<boolean>;
+  onDropHook(data: {
+    //if set Excalidraw will call this function onDrop events
+    ea: ExcalidrawAutomate;
+    event: React.DragEvent<HTMLDivElement>;
+    draggable: any; //Obsidian draggable object
+    type: "file" | "text" | "unknown";
+    payload: {
+      files: TFile[]; //TFile[] array of dropped files
+      text: string; //string
+    };
+    excalidrawFile: TFile; //the file receiving the drop event
+    view: ExcalidrawView; //the excalidraw view receiving the drop
+    pointerPosition: { x: number; y: number }; //the pointer position on canvas at the time of drop
+  }): boolean; //a return of true will stop the default onDrop processing in Excalidraw
+  mostRecentMarkdownSVG: SVGSVGElement; //Markdown renderer will drop a copy of the most recent SVG here for debugging purposes
+  getEmbeddedFilesLoader(isDark?: boolean): EmbeddedFilesLoader; //utility function to generate EmbeddedFilesLoader object
+  getExportSettings( //utility function to generate ExportSettings object
+    withBackground: boolean,
+    withTheme: boolean,
+  ): ExportSettings;
+  getBoundingBox(elements: ExcalidrawElement[]): {
+    //get bounding box of elements
+    topX: number; //bounding box is the box encapsulating all of the elements completely
+    topY: number;
+    width: number;
+    height: number;
+  };
+  //elements grouped by the highest level groups
+  getMaximumGroups(elements: ExcalidrawElement[]): ExcalidrawElement[][];
+  //gets the largest element from a group. useful when a text element is grouped with a box, and you want to connect an arrow to the box
+  getLargestElement(elements: ExcalidrawElement[]): ExcalidrawElement;
+  // Returns 2 or 0 intersection points between line going through `a` and `b`
+  // and the `element`, in ascending order of distance from `a`.
+  intersectElementWithLine(
+    element: ExcalidrawBindableElement,
+    a: readonly [number, number],
+    b: readonly [number, number],
+    gap?: number, //if given, element is inflated by this value
+  ): Point[];
+
+  //See OCR plugin for example on how to use scriptSettings
+  activeScript: string; //Set automatically by the ScriptEngine
+  getScriptSettings(): {}; //Returns script settings. Saves settings in plugin settings, under the activeScript key
+  setScriptSettings(settings: any): Promise<void>; //sets script settings.
+  openFileInNewOrAdjacentLeaf(file: TFile): WorkspaceLeaf; //Open a file in a new workspaceleaf or reuse an existing adjacent leaf depending on Excalidraw Plugin Settings
+  measureText(text: string): { width: number; height: number }; //measure text size based on current style settings
+  //verifyMinimumPluginVersion returns true if plugin version is >= than required
+  //recommended use:
+  //if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.20")) {new Notice("message");return;}
+  verifyMinimumPluginVersion(requiredVersion: string): boolean;
+  selectElementsInView(elements: ExcalidrawElement[]): void; //sets selection in view
+  generateElementId(): string; //returns an 8 character long random id
+  cloneElement(element: ExcalidrawElement): ExcalidrawElement; //Returns a clone of the element with a new id
 }
 ```
 

docs/API/introduction.md

@@ -1,6 +1,6 @@
 # [◀ Excalidraw Automate How To](../readme.md)
 ## Introduction to the API
-You can access Excalidraw Automate via the ExcalidrawAutomate object. I recommend starting your Automate scripts with the following code:
+You can access Excalidraw Automate via the ExcalidrawAutomate object. I recommend starting Templater, DataView and QuickAdd scripts with the following code:
 
 *Use CTRL+Shift+V to paste code into Obsidian!*
 ```javascript
@@ -8,10 +8,12 @@ const ea = ExcalidrawAutomate;
 ea.reset();
 ```
 
-The first line creates a practical constant so you can avoid writing ExcalidrawAutomate 100x times.
+The first line creates a constant so you can avoid writing ExcalidrawAutomate 100x times.
 
 The second line resets ExcalidrawAutomate to defaults. This is important as you will not know which template you executed before, thus you won't know what state you left Excalidraw in.
 
+**⚠ Note:** In case you are using the Excalidraw plugin's built in [Scripting Engine](../ExcalidrawScriptsEngine.md), the engine will take care of initializing the `ea` object.
+
 ### Basic logic of using Excalidraw Automate
 1. Set the styling of the elements you want to draw
 2. Add elements. As you add elements, each new element is added one layer above the previous, thus in case of overlapping objects the later one will be on the top of the prior one.
@@ -19,7 +21,7 @@ The second line resets ExcalidrawAutomate to defaults. This is important as you
 
 You can change the styling between adding different elements. My logic for separating element styling and creation is based on the assumption that you will probably set a stroke color, stroke style, stroke roughness, etc. and draw most of your elements using that. There would be no point in setting all these parameters each time you add an element.
 
-### Before we dive deeper, here are three a simple example Templater scripts
+### Before we dive deeper, here are three a simple example [Templater](https://github.com/SilentVoid13/Templater) scripts
 #### Create a new drawing with custom name, in a custom folder, using a template
 This simple script gives you significant additional flexibility over Excalidraw Plugin settings to name your drawings, place them into folders, and to apply templates.
 

docs/Examples/dataviewjs_familytree.md

@@ -29,11 +29,11 @@ function crawl(subtasks) {
   return size;
 }
 
-const tasks = dv.page("Demo.md").file.tasks[0];
+const tasks = dv.page("FamilyTree.md").file.tasks[0];
 tasks["size"] = crawl(tasks.subtasks);
 
 const width = 300;
-const height = 100;
+const height = 150;
 const ea = ExcalidrawAutomate;
 ea.reset();
 
@@ -56,7 +56,7 @@ function buildMindmap(subtasks, depth, offset, parentObjectID) {
  
 }
 
-tasks["objectID"] = ea.addText(width*1.5,width,tasks.text,{box:true, textAlign:"center"});    
+tasks["objectID"] = ea.addText(width*1.5,height*(tasks.size-1),tasks.text,{box:true, textAlign:"center"});    
 buildMindmap(tasks.subtasks, 2, 0, tasks.objectID);
 
 ea.createSVG().then((svg)=>dv.span(svg.outerHTML));

docs/ExcalidrawScriptsEngine.md

@@ -0,0 +1,401 @@
+# [◀ Excalidraw Automate How To](./readme.md)
+
+[![Script Engine](https://user-images.githubusercontent.com/14358394/145684531-8d9c2992-59ac-4ebc-804a-4cce1777ded2.jpg)](https://youtu.be/hePJcObHIso)
+
+## Introduction
+Place your ExcalidrawAutomate Scripts into the folder defined in Excalidraw Settings. The Scripts folder may not be the root folder of your Vault.
+
+![image](https://user-images.githubusercontent.com/14358394/145673547-b4f57d01-3643-40f9-abfd-14c3bfa5ab93.png)
+
+EA scripts may be markdown files, plain text files, or .js files. The only requirement is that they must contain valid JavaScript code. 
+
+![image](https://user-images.githubusercontent.com/14358394/145673674-bb59f227-8eea-43dc-83b8-4d750e1920a8.png)
+
+You will be able to access your scripts from Excalidraw via the Obsidian Command Palette. 
+
+![image](https://user-images.githubusercontent.com/14358394/145673652-6b1713e2-edc8-4bc8-8246-3f8df8a4b273.png)
+
+This will allow you to assign hotkeys to your favorite scripts just like to any other Obsidian command. 
+
+![image](https://user-images.githubusercontent.com/14358394/145673633-83b6c969-cead-429b-9721-fd047f980279.png)
+
+## Script development
+An Excalidraw script will automatically receive two objects:
+- `ea`: The Script Enginge will initialize the `ea` object including setting the active view to the View from which the script was called.
+- `utils`: I have borrowed functions exposed on utils from [QuickAdd](https://github.com/chhoumann/quickadd/blob/master/docs/QuickAddAPI.md), though currently not all QuickAdd utility functions are implemented in Excalidraw. As of now, these are the available functions. See the example below for details.
+  - `inputPrompt: (header: string, placeholder?: string, value?: string, buttons?: [{caption:string, action:Function}])`
+    - Opens a prompt that asks for an input. Returns a string with the input.
+    - You need to await the result of inputPrompt.
+    - `buttons.action(input: string) => string`. The button action will receive the current input string. If action returns null, the input will be unchanged. If action returns a string, the inputPrompt will resolve to this value.
+```typescript
+let fileType = "";
+const filename = await utils.inputPrompt (
+  "Filename for new document",
+  "Placeholder",
+  "DefaultFilename.md",
+  [
+    {
+      caption: "Markdown",
+      action: ()=>{fileType="md";return;}
+		},
+    {
+      caption: "Excalidraw",
+      action: ()=>{fileType="ex";return;}
+    }
+  ]
+);
+
+```
+  - `suggester: (displayItems: string[], items: any[], hint?: string, instructions?:Instruction[])`
+    - Opens a suggester. Displays the displayItems and returns the corresponding item from items[].
+    - You need to await the result of suggester.
+    - If the user cancels (ESC), suggester will return `undefined`
+    - Hint and instructions are optional.
+    ```typescript
+      interface Instruction {
+        command: string;
+        purpose: string;
+      }
+    ```
+  - Scripts may have settings. These settings are stored as part of plugin settings and may be also changed by the user via the Obsidian plugin settings window.
+    - You can access settings for the active script using `ea.getScriptSettings()` and store settings values with `ea.setScriptSettings(settings:any)`
+    - Rules for displaying script settings in plugin settings are:
+      - If the setting is a simple literal (boolean, number, string) these will be displayed as such in settings. The name of the setting will be the key for the value.
+    ```javascript
+    ea.setScriptSettings({ 
+      "value 1": true, 
+      "value 2": 1,
+      "value 3": "my string"
+    })
+    ```
+    ![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/SimpleSettings.jpg)
+      - If the setting is an object and follows the below structure then a description and a valueset may also be added. Values may also be hidden from the user using the `hidden` key.
+      ```javascript
+      ea.setScriptSettings({
+        "value 1": {
+          "value": true,
+          "description": "This is the description for my boolean value"
+        },
+        "value 2": {
+          "value": 1,
+          "description": "This is the description for my numeric value"
+        },
+        "value 3": {
+          "value": "my string",
+          "description": "This is the description for my string value",
+          "valueset": ["allowed 1","allowed 2","allowed 3"]
+        },
+        "value 4": {
+          "value": "my value",
+          "hidden": true
+        }        
+      });
+      ```
+      ![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/ComplexSettings.jpg)
+
+---------
+
+## Example Excalidraw Automate Scripts
+
+These scripts are available as downloadable `.md` files on GitHub in [this](https://github.com/zsviczian/obsidian-excalidraw-plugin/tree/master/ea-scripts) folder 📂.
+
+### Add box around selected elements
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-box-elements.jpg)
+
+This script will add an encapsulating box around the currently selected elements in Excalidraw
+```javascript
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//check if settings exist. If not, set default values on first run
+if(!settings["Default padding"]) {
+	settings = {
+		"Prompt for padding?": true,
+	  "Default padding" : {
+			value: 10,
+		  description: "Padding between the bounding box of the selected elements, and the box the script creates"
+		}
+	};
+	ea.setScriptSettings(settings);
+}
+
+let padding = settings["Default padding"].value;
+
+if(settings["Prompt for padding?"]) {
+	padding = parseInt (await utils.inputPrompt("padding?","number",padding.toString()));
+}
+
+if(isNaN(padding)) {
+  new Notice("The padding value provided is not a number");
+  return;
+}
+elements = ea.getViewSelectedElements();
+const box = ea.getBoundingBox(elements);
+color = ea
+        .getExcalidrawAPI()
+        .getAppState()
+        .currentItemStrokeColor;
+//uncomment for random color:
+//color = '#'+(Math.random()*0xFFFFFF<<0).toString(16).padStart(6,"0");
+ea.style.strokeColor = color;
+id = ea.addRect(
+	box.topX - padding,
+	box.topY - padding,
+	box.width + 2*padding,
+	box.height + 2*padding
+);
+ea.copyViewElementsToEAforEditing(elements);
+ea.addToGroup([id].concat(elements.map((el)=>el.id)));
+ea.addElementsToView(false);
+```
+
+----
+
+### Connect selected elements with an arrow
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-connect-elements.jpg)
+
+This script will connect two objects with an arrow. If either of the objects are a set of grouped elements (e.g. a text element grouped with an encapsulating rectangle), the script will identify these groups, and connect the arrow to the largest object in the group (assuming you want to connect the arrow to the box around the text element).
+```javascript
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Starting arrowhead"]) {
+	settings = {
+	  "Starting arrowhead" : {
+			value: "none",
+      valueset: ["none","arrow","triangle","bar","dot"]
+		},
+		"Ending arrowhead" : {
+			value: "triangle",
+      valueset: ["none","arrow","triangle","bar","dot"]
+		},
+		"Line points" : {
+			value: 1,
+      description: "Number of line points between start and end"
+		}
+	};
+	ea.setScriptSettings(settings);
+}
+
+const arrowStart = settings["Starting arrowhead"].value === "none" ? null : settings["Starting arrowhead"].value;
+const arrowEnd = settings["Ending arrowhead"].value === "none" ? null : settings["Ending arrowhead"].value;
+const linePoints = Math.floor(settings["Line points"].value);
+
+const elements = ea.getViewSelectedElements();
+ea.copyViewElementsToEAforEditing(elements);
+groups = ea.getMaximumGroups(elements);
+
+if(groups.length !== 2) {
+  //unfortunately getMaxGroups returns duplicated resultset for sticky notes
+  //needs additional filtering
+  cleanGroups=[];
+  idList = [];
+  for (group of groups) {
+    keep = true;
+    for(item of group) if(idList.contains(item.id)) keep = false;
+    if(keep) {
+      cleanGroups.push(group);
+      idList = idList.concat(group.map(el=>el.id))
+    }
+  }
+  if(cleanGroups.length !== 2) return;
+  groups = cleanGroups;
+}
+
+els = [ 
+  ea.getLargestElement(groups[0]),
+  ea.getLargestElement(groups[1])
+];
+
+ea.style.strokeColor = els[0].strokeColor;
+ea.style.strokeWidth = els[0].strokeWidth;
+ea.style.strokeStyle = els[0].strokeStyle;
+ea.style.strokeSharpness = els[0].strokeSharpness;
+
+ea.connectObjects(
+  els[0].id,
+  null,
+  els[1].id,
+  null, 
+  {
+	endArrowHead: arrowEnd,
+	startArrowHead: arrowStart, 
+	numberOfPoints: linePoints
+  }
+);
+ea.addElementsToView();
+```
+
+----
+### Reverse selected arrows
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-reverse-arrow.jpg)
+
+Reverse the direction of **arrows** within the scope of selected elements.
+
+```javascript
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="arrow");
+if(!elements || elements.length===0) return;
+elements.forEach((el)=>{
+	const start = el.startArrowhead;
+	el.startArrowhead = el.endArrowhead;
+	el.endArrowhead = start;
+});
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();
+```
+
+----
+
+### Set line width of selected elements
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-stroke-width.jpg)
+
+This is helpful, for example, when you scale freedraw sketches and want to reduce or increase their line width.
+```javascript
+let width = (ea.getViewSelectedElement().strokeWidth??1).toString();
+width = await utils.inputPrompt("Width?","number",width);
+const elements=ea.getViewSelectedElements();
+ea.copyViewElementsToEAforEditing(elements);
+ea.getElements().forEach((el)=>el.strokeWidth=width);
+ea.addElementsToView();
+```
+
+----
+
+### Set grid size
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-grid.jpg)
+
+The default grid size in Excalidraw is 20. Currently there is no way to change the grid size via the user interface. 
+```javascript
+const grid = parseInt(await utils.inputPrompt("Grid size?",null,"20"));
+const api = ea.getExcalidrawAPI();
+let appState = api.getAppState();
+appState.gridSize = grid;
+api.updateScene({
+  appState,
+  commitToHistory:false
+});
+```
+
+----
+
+### Set element dimensions and position
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-dimensions.jpg)
+
+Currently there is no way to specify the exact location and size of objects in Excalidraw. You can bridge this gap with the following simple script.
+```javascript
+const elements = ea.getViewSelectedElements();
+if(elements.length === 0) return;
+const el = ea.getLargestElement(elements);
+const sizeIn = [el.x,el.y,el.width,el.height].join(",");
+let res = await utils.inputPrompt("x,y,width,height?",null,sizeIn);
+res = res.split(",");
+if(res.length !== 4) return;
+let size = [];
+for (v of res) {
+  const i = parseInt(v);
+  if(isNaN(i)) return;
+  size.push(i);
+}
+el.x = size[0];
+el.y = size[1];
+el.width = size[2];
+el.height = size[3];
+ea.copyViewElementsToEAforEditing([el]);
+ea.addElementsToView();
+```
+
+----
+
+### Bullet points
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-bullet-point.jpg)
+
+This script will add a small circle to the top left of each text element in the selection and add the text and the "bullet point" into a group.
+```javascript
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+ea.copyViewElementsToEAforEditing(elements);
+const padding = 10;
+elements.forEach((el)=>{
+  ea.style.strokeColor = el.strokeColor;
+  const size = el.fontSize/2;
+  const ellipseId = ea.addEllipse(
+    el.x-padding-size,
+    el.y+size/2,
+    size,
+    size
+  );
+  ea.addToGroup([el.id,ellipseId]);
+});
+ea.addElementsToView();
+```
+
+----
+
+### Split text by lines
+**!!!Requires Excalidraw 1.5.1 or higher**
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-split-lines.jpg)
+
+Split lines of text into separate text elements for easier reorganization
+```javascript
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+elements.forEach((el)=>{
+  ea.style.strokeColor = el.strokeColor;
+  ea.style.fontFamily  = el.fontFamily;
+  ea.style.fontSize    = el.fontSize;
+  const text = el.text.split("\n");
+  for(i=0;i<text.length;i++) {
+	ea.addText(el.x,el.y+i*el.height/text.length,text[i]);
+  }
+});
+ea.addElementsToView();
+ea.deleteViewElements(elements);
+```
+
+----
+
+### Set Text Alignment
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-text-align.jpg)
+
+Sets text alignment of text block (cetner, right, left). Useful if you want to set a keyboard shortcut for selecting text alignment.
+```javascript
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+if(elements.length===0) return;
+let align = ["left","right","center"];
+align = await utils.suggester(align,align);
+elements.forEach((el)=>el.textAlign = align);
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();
+```
+
+----
+
+### Set Font Family
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-font-family.jpg)
+
+Sets font family of the text block (Virgil, Helvetica, Cascadia). Useful if you want to set a keyboard shortcut for selecting font family.
+```javascript
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+if(elements.length===0) return;
+let font = ["Virgil","Helvetica","Cascadia"];
+font = parseInt(await utils.suggester(font,["1","2","3"]));
+if (isNaN(font)) return;
+elements.forEach((el)=>el.fontFamily = font);
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();
+```

docs/_config.yml

@@ -1 +1 @@
-theme: jekyll-theme-leap-day
+theme: jekyll-theme-hacker

docs/readme.md

@@ -1,18 +1,21 @@
 # Excalidraw Automate How To
 
-Excalidraw Automate allows you to create Excalidraw drawings using the [Templater](https://silentvoid13.github.io/Templater/docs/) plugin, and to generate embedded SVG and PNG images using [DataviewJS](https://blacksmithgu.github.io/obsidian-dataview/docs/api/intro/)
+Use ExcalidrawAutomate to create or manipulate Excalidraw drawings using the [ExcalidrawAutomate Script Engine](ExcalidrawScriptsEngine.md), the [Templater](https://silentvoid13.github.io/Templater/docs/) or the [QuickAdd](https://github.com/chhoumann/quickadd) plugins, and to generate embedded SVG and PNG images using [DataviewJS](https://blacksmithgu.github.io/obsidian-dataview/docs/api/intro/)
 
-With a little work, using Excalidraw Automate you can generate simple mindmaps, build a family tree, fill out SVG forms, create customized charts, etc. based on documents in your vault.
+With a little work, using ExcalidrawAutomate you can generate simple mindmaps, build a family tree, fill out SVG forms, create customized charts, or automate simple tasks (i.e. create macros) in Excalidraw.
 ![image](https://user-images.githubusercontent.com/14358394/117549619-bae41180-b03b-11eb-968d-c909e79a7524.png)
 
 ## API documentation
-- [Introduction to the API](API/introduction.md)
+- **start here** [Introduction to the API](API/introduction.md)
 - [Overview of Attributes and Functions](API/attributes_functions_overview.md)
 - [Element Sytle](API/element_style.md)
 - [Canvas Style](API/canvas_style.md)
 - [Adding Objects](API/objects.md)
 - [Utility Functions](API/utility.md)
 
+## ExcalidrawAutomate Script Engine
+I recommend using the Scripts Engine for "Macro" like automation, when you want to automate a few simple steps, such as adding a box around a text element, or connecting two objects with an arrow, or setting line width or the grid to a custom value.  
+- [ExcalidrawAutomate Script Engine](ExcalidrawScriptsEngine.md).
 
 ## Examples
 - **Templater** 

ea-scripts/Add Connector Point.md

@@ -0,0 +1,25 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-bullet-point.jpg)
+
+This script will add a small circle to the top left of each text element in the selection and add the text and the "bullet point" into a group.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+ea.copyViewElementsToEAforEditing(elements);
+const padding = 10;
+elements.forEach((el)=>{
+  ea.style.strokeColor = el.strokeColor;
+  const size = el.fontSize/2;
+  const ellipseId = ea.addEllipse(
+    el.x-padding-size,
+    el.y+size/2,
+    size,
+    size
+  );
+  ea.addToGroup([el.id,ellipseId]);
+});
+ea.addElementsToView();

ea-scripts/Add Link to Existing File and Open.md

@@ -0,0 +1,65 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-link-and-open.jpg)
+
+Prompts for a file from the vault. Adds a link to the selected element pointing to the selected file. You can control in settings to open the file in the current active pane or an adjacent pane.
+
+```javascript
+*/
+
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+
+if(!settings["Open link in active pane"]) {
+  settings = {
+    "Open link in active pane": {
+      value: false,
+      description: "Open the link in the current active pane (on) or a new pane (off)."
+	},
+    ...settings
+  };
+  ea.setScriptSettings(settings);
+}
+
+const openInCurrentPane = settings["Open link in active pane"].value;
+
+elements = ea.getViewSelectedElements();
+if(elements.length === 0) {
+  new Notice("No selected elements");
+  return;
+}
+
+const files = app.vault.getFiles()
+const filePaths = files.map((f)=>f.path);
+file = await utils.suggester(filePaths,files,"Select a file");
+
+if(!file) return;
+
+const link = `[[${app.metadataCache.fileToLinktext(file,ea.targetView.file.path,true)}]]`;
+
+ea.style.backgroundColor = "transparent";
+ea.style.strokeColor = "rgba(70,130,180,0.05)"
+ea.style.strokeWidth = 2;
+ea.style.roughness = 0;
+
+if(elements.lenght===1 && elements[0].type !== "text") {
+  ea.copyViewElementsToEAforEditing(elements);
+	ea.getElements()[0].link = link;
+} else {
+  const b = ea.getBoundingBox(elements);
+  const id = ea.addEllipse(b.topX+b.width-5, b.topY, 5, 5);
+  ea.getElement(id).link = link;
+  ea.copyViewElementsToEAforEditing(elements);
+  ea.addToGroup(elements.map((e)=>e.id).concat([id]));
+}
+await ea.addElementsToView(false,true,true);
+ea.selectElementsInView(ea.getElements());
+
+if(openInCurrentPane) {
+	app.workspace.openLinkText(file.path,ea.targetView.file.path,false);
+  return;
+}
+ea.openFileInNewOrAdjacentLeaf(file);

ea-scripts/Add Link to New Page and Open.md

@@ -0,0 +1,91 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-link-to-new-page-and-pen.jpg)
+
+Prompts for filename. Offers option to create and open a new Markdown or Excalidraw document. Adds link pointing to the new file, to the selected objects in the drawing. You can control in settings to open the file in the current active pane or an adjacent pane.
+
+```javascript
+*/
+
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.6.1")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+const BLANK_DRAWING = ["---","","excalidraw-plugin: parsed","","---","==⚠ Switch to EXCALIDRAW VIEW in the MORE OPTIONS menu of this document. ⚠==","","","%%","# Drawing","\x60\x60\x60json",'{"type":"excalidraw","version":2,"source":"https://excalidraw.com","elements":[],"appState":{"gridSize":null,"viewBackgroundColor":"#ffffff"}}',"\x60\x60\x60","%%"].join("\n");
+
+settings = ea.getScriptSettings();
+
+if(!settings["Open link in active pane"]) {
+  settings = {
+    "Open link in active pane": {
+      value: false,
+      description: "Open the link in the current active pane (on) or a new pane (off)."
+	},
+    ...settings
+  };
+  ea.setScriptSettings(settings);
+}
+
+const openInCurrentPane = settings["Open link in active pane"].value;
+
+elements = ea.getViewSelectedElements();
+if(elements.length === 0) {
+  new Notice("No selected elements");
+  return;
+}
+
+const activeFile = ea.targetView.file;
+const prefix = activeFile.basename;
+const timestamp = moment(Date.now()).format(ea.plugin.settings.drawingFilenameDateTime);
+
+let fileType = "";
+const filename = await utils.inputPrompt (
+  "Filename for new document",
+  "",
+  `${prefix} - ${timestamp}`,
+  [
+    {
+      caption: "Markdown",
+      action: ()=>{fileType="md";return;}
+		},
+    {
+      caption: "Excalidraw",
+      action: ()=>{fileType="ex";return;}
+    }
+  ]
+);
+
+if(!filename || filename === "") return;
+const filepath = activeFile.path.replace(activeFile.name,`${filename}.md`);
+
+const file = await app.fileManager.createNewMarkdownFileFromLinktext(filepath);
+if(file && fileType==="ex") {
+	await app.vault.modify(file,BLANK_DRAWING);
+	await new Promise(r => setTimeout(r, 100)); //wait for metadata cache to update, so file opens as excalidraw
+}
+
+const link = `[[${app.metadataCache.fileToLinktext(file,ea.targetView.file.path,true)}]]`;
+
+ea.style.backgroundColor = "transparent";
+ea.style.strokeColor = "rgba(70,130,180,0.05)"
+ea.style.strokeWidth = 2;
+ea.style.roughness = 0;
+
+if(elements.lenght===1 && elements[0].type !== "text") {
+  ea.copyViewElementsToEAforEditing(elements);
+	ea.getElements()[0].link = link;
+} else {
+  const b = ea.getBoundingBox(elements);
+  const id = ea.addEllipse(b.topX+b.width-5, b.topY, 5, 5);
+  ea.getElement(id).link = link;
+  ea.copyViewElementsToEAforEditing(elements);
+  ea.addToGroup(elements.map((e)=>e.id).concat([id]));
+}
+await ea.addElementsToView(false,true,true);
+ea.selectElementsInView(ea.getElements());
+
+if(openInCurrentPane) {
+	app.workspace.openLinkText(file.path,ea.targetView.file.path,false);
+  return;
+}
+ea.openFileInNewOrAdjacentLeaf(file);

ea-scripts/Add Next Step in Process.md

@@ -0,0 +1,133 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-process-step.jpg)
+
+This script will prompt you for the title of the process step, then will create a stick note with the text. If an element is selected then the script will connect this new step with an arrow to the previous step (the selected element). If no element is selected, then the script assumes this is the first step in the process and will only output the sticky note with the text that was entered.
+
+```javascript
+*/
+
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.24")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Starting arrowhead"]) {
+	settings = {
+	  "Starting arrowhead" : {
+			value: "none",
+      valueset: ["none","arrow","triangle","bar","dot"]
+		},
+		"Ending arrowhead" : {
+			value: "triangle",
+      valueset: ["none","arrow","triangle","bar","dot"]
+		},
+		"Line points" : {
+			value: 0,
+      description: "Number of line points between start and end"
+		},
+		"Gap between elements": {
+			value: 100
+		},
+		"Wrap text at (number of characters)": {
+			value: 25,
+		},
+		"Fix width": {
+			value: true,
+			description: "The object around the text should have fix width to fit the wrapped text"
+		}
+	};
+	ea.setScriptSettings(settings);
+}
+
+const arrowStart = settings["Starting arrowhead"].value === "none" ? null : settings["Starting arrowhead"].value;
+const arrowEnd = settings["Ending arrowhead"].value === "none" ? null : settings["Ending arrowhead"].value;
+
+// workaround until https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/388 is fixed
+if (!arrowEnd) ea.style.endArrowHead = null;
+if (!arrowStart) ea.style.startArrowHead = null;
+
+const linePoints = Math.floor(settings["Line points"].value);
+const gapBetweenElements = Math.floor(settings["Gap between elements"].value);
+const wrapLineLen = Math.floor(settings["Wrap text at (number of characters)"].value);
+const fixWidth = settings["Fix width"];
+
+const textPadding = 10;
+const text = await utils.inputPrompt("Text?");
+const elements = ea.getViewSelectedElements();
+const isFirst = (!elements || elements.length === 0);
+
+const width = ea.measureText("w".repeat(wrapLineLen)).width;
+
+let id = "";
+
+if(!isFirst) {
+  const fromElement = ea.getLargestElement(elements);
+  ea.copyViewElementsToEAforEditing([fromElement]);
+
+  const previousTextElements = elements.filter((el)=>el.type==="text");
+  if(previousTextElements.length>0) {
+    const el = previousTextElements[0];
+    ea.style.strokeColor = el.strokeColor;
+    ea.style.fontSize    = el.fontSize;
+    ea.style.fontFamily  = el.fontFamily;
+  }
+
+	textWidth = ea.measureText(text).width;
+
+  id = ea.addText(
+    fixWidth 
+    ? fromElement.x+fromElement.width/2-width/2
+    : fromElement.x+fromElement.width/2-textWidth/2-textPadding,
+    fromElement.y+fromElement.height+gapBetweenElements,
+    text,
+    {
+      wrapAt: wrapLineLen,
+      textAlign: "center",
+      box: "rectangle",
+      ...fixWidth
+      ? {width: width, boxPadding:0}
+      : {boxPadding: textPadding}
+    }
+  );
+
+  ea.connectObjects(
+    fromElement.id,
+    null,
+    id,
+    null,
+    {
+	  endArrowHead: arrowEnd,
+	  startArrowHead: arrowStart,
+	  numberOfPoints: linePoints
+    }
+  );
+
+	const rect = ea.getElement(id);
+  rect.strokeColor = fromElement.strokeColor;
+  rect.strokeWidth = fromElement.strokeWidth;
+	rect.strokeStyle = fromElement.strokeStyle;
+	rect.roughness = fromElement.roughness;
+	rect.strokeSharpness = fromElement.strokeSharpness;
+	rect.backgroundColor = fromElement.backgroundColor;
+  rect.fillStyle = fromElement.fillStyle;
+
+  await ea.addElementsToView(false);
+} else {
+  id = ea.addText(
+    0,
+    0,
+    text,
+    {
+      wrapAt: wrapLineLen,
+      textAlign: "center",
+      box: "rectangle",
+      boxPadding: textPadding,
+		  ...fixWidth?{width: width}:null
+    }
+  );
+  await ea.addElementsToView(true);
+}
+
+ea.selectElementsInView([ea.getElement(id)]);

ea-scripts/Box Each Selected Groups.md

@@ -0,0 +1,181 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-box-each-selected-groups.png)
+
+This script will add encapsulating boxes around each of the currently selected groups in Excalidraw.
+
+You can focus on content creation first, and then batch add consistent style boxes to each group of text.
+
+Tips 1: You can copy the desired style to the global state using script `Copy Selected Element Style to Global`, then add boxes with the same global style using script `Box Each Selected Groups`.
+
+Tips 2: Next you can use scripts `Expand rectangles horizontally keep text centered` and `Expand rectangles vertically keep text centered` to make the boxes the same size, if you wish.
+
+Tips 3: If you want the left and right margins to be different from the top and bottom margins, input something like `32,16`, this will create a box with left and right margins of `32` and top and bottom margins of `16`.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default padding"]) {
+	settings = {
+	  "Prompt for padding?": true,
+	  "Default padding" : {
+			value: 10,
+		  description: "Padding between the bounding box of the selected elements, and the box the script creates"
+	  },
+	  "Remember last padding?": false
+	};
+	ea.setScriptSettings(settings);
+}
+
+let paddingStr = settings["Default padding"].value.toString();
+const rememberLastPadding = settings["Remember last padding?"];
+
+if(settings["Prompt for padding?"]) {
+	paddingStr = await utils.inputPrompt("padding?","string",paddingStr);
+}
+if(!paddingStr) {
+	return;
+}
+if(rememberLastPadding) {
+	settings["Default padding"].value = paddingStr;
+	ea.setScriptSettings(settings);
+}
+var paddingLR = 0;
+var paddingTB = 0;
+if(paddingStr.indexOf(',') > 0) {
+	const paddingParts = paddingStr.split(',');
+	paddingLR = parseInt(paddingParts[0]);
+	paddingTB = parseInt(paddingParts[1]);
+}
+else {
+	paddingLR = paddingTB = parseInt(paddingStr);
+}
+
+if(isNaN(paddingLR) || isNaN(paddingTB)) {
+	return;
+}
+
+const selectedElements = ea.getViewSelectedElements();
+const groups = ea.getMaximumGroups(selectedElements);
+const allIndividualArrows = ea.getMaximumGroups(ea.getViewElements())
+	.reduce((result, group) => (group.length === 1 && (group[0].type === 'arrow' || group[0].type === 'line')) ? 
+			[...result, group[0]] : result, []);
+for(const elements of groups) {
+	if(elements.length === 1 && elements[0].type ==="arrow" || elements[0].type==="line") {
+		// individual arrows or lines are not affected
+		continue;
+	}
+	const box = ea.getBoundingBox(elements);
+	color = ea
+			.getExcalidrawAPI()
+			.getAppState()
+			.currentItemStrokeColor;
+	// use current stroke with and style
+	const appState = ea.getExcalidrawAPI().getAppState();
+	const strokeWidth = appState.currentItemStrokeWidth;
+	const strokeStyle = appState.currentItemStrokeStyle;
+	const strokeSharpness = appState.currentItemStrokeSharpness;
+	const roughness = appState.currentItemRoughness;
+	const fillStyle = appState.currentItemFillStyle;
+	const backgroundColor = appState.currentItemBackgroundColor;
+	ea.style.strokeWidth = strokeWidth;
+	ea.style.strokeStyle = strokeStyle;
+	ea.style.strokeSharpness = strokeSharpness;
+	ea.style.roughness = roughness;
+	ea.style.fillStyle = fillStyle;
+	ea.style.backgroundColor = backgroundColor;	
+	ea.style.strokeColor = color;
+
+	const id = ea.addRect(
+		box.topX - paddingLR,
+		box.topY - paddingTB,
+		box.width + 2*paddingLR,
+		box.height + 2*paddingTB
+	);
+
+	// Change the join point in the group to the new box
+	const elementsWithBounded = elements.filter(el => (el.boundElements || []).length > 0);
+	const boundedElementsCollection = elementsWithBounded.reduce((result, el) => [...result, ...el.boundElements], []);
+	for(const el of elementsWithBounded) {
+		el.boundElements = [];
+	}
+
+	const newRect = ea.getElement(id);
+	newRect.boundElements = boundedElementsCollection;
+
+    const elementIds = elements.map(el => el.id);
+
+	const startBindingLines = allIndividualArrows.filter(el => elementIds.includes((el.startBinding||{}).elementId));
+	for(startBindingLine of startBindingLines) {
+		startBindingLine.startBinding.elementId = id;
+		recalculateStartPointOfLine(startBindingLine, newRect);
+	}
+
+	const endBindingLines = allIndividualArrows.filter(el => elementIds.includes((el.endBinding||{}).elementId));
+	for(endBindingLine of endBindingLines) {
+		endBindingLine.endBinding.elementId = id;
+		recalculateEndPointOfLine(endBindingLine, newRect);
+	}
+
+	ea.copyViewElementsToEAforEditing(elements);
+	ea.addToGroup([id].concat(elements.map((el)=>el.id)));
+	ea.addElementsToView(false);
+	ea.reset();
+}
+
+function recalculateStartPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[1][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[1][1];
+
+	line.startBinding.gap = 8;
+	line.startBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.startBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+		line.points[0] = [0, 0];
+		for(var i = 1; i<line.points.length; i++) {
+			line.points[i][0] -= intersectA[0][0] - line.x;
+			line.points[i][1] -= intersectA[0][1] - line.y;
+		}
+		line.x = intersectA[0][0];
+		line.y = intersectA[0][1];
+	}
+}
+
+function recalculateEndPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[line.points.length-2][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[line.points.length-2][1];
+
+	line.endBinding.gap = 8;
+	line.endBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.endBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+    	line.points[line.points.length - 1] = [intersectA[0][0] - line.x, intersectA[0][1] - line.y];
+	}
+}

ea-scripts/Box Selected Elements.md

@@ -0,0 +1,55 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-box-elements.jpg)
+
+This script will add an encapsulating box around the currently selected elements in Excalidraw.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default padding"]) {
+	settings = {
+		"Prompt for padding?": true,
+	  "Default padding" : {
+			value: 10,
+		  description: "Padding between the bounding box of the selected elements, and the box the script creates"
+		}
+	};
+	ea.setScriptSettings(settings);
+}
+
+let padding = settings["Default padding"].value;
+
+if(settings["Prompt for padding?"]) {
+	padding = parseInt (await utils.inputPrompt("padding?","number",padding.toString()));
+}
+
+if(isNaN(padding)) {
+  new Notice("The padding value provided is not a number");
+  return;
+}
+elements = ea.getViewSelectedElements();
+const box = ea.getBoundingBox(elements);
+color = ea
+        .getExcalidrawAPI()
+        .getAppState()
+        .currentItemStrokeColor;
+//uncomment for random color:
+//color = '#'+(Math.random()*0xFFFFFF<<0).toString(16).padStart(6,"0");
+ea.style.strokeColor = color;
+id = ea.addRect(
+	box.topX - padding,
+	box.topY - padding,
+	box.width + 2*padding,
+	box.height + 2*padding
+);
+ea.copyViewElementsToEAforEditing(elements);
+ea.addToGroup([id].concat(elements.map((el)=>el.id)));
+ea.addElementsToView(false);

ea-scripts/Change shape of selected elements.md

@@ -0,0 +1,16 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-change-shape.jpg)
+
+The script allows you to change the shape of selected Rectangles, Diamonds and Ellipses. 
+
+```javascript
+*/
+const shapesDispaly=["○ ellipse","□ rectangle","◇ diamond"];
+const shapes=["ellipse","rectangle","diamond"];
+elements = ea.getViewSelectedElements().filter(el=>shapes.contains(el.type));
+newShape = await utils.suggester(shapesDispaly, shapes);
+if(!newShape) return;
+
+elements.forEach(el=>el.type = newShape);
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();

ea-scripts/Connect elements.md

@@ -0,0 +1,81 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-connect-elements.jpg)
+
+This script will connect two objects with an arrow. If either of the objects are a set of grouped elements (e.g. a text element grouped with an encapsulating rectangle), the script will identify these groups, and connect the arrow to the largest object in the group (assuming you want to connect the arrow to the box around the text element).
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Starting arrowhead"]) {
+	settings = {
+	  "Starting arrowhead" : {
+			value: "none",
+      valueset: ["none","arrow","triangle","bar","dot"]
+		},
+		"Ending arrowhead" : {
+			value: "triangle",
+      valueset: ["none","arrow","triangle","bar","dot"]
+		},
+		"Line points" : {
+			value: 1,
+      description: "Number of line points between start and end"
+		}
+	};
+	ea.setScriptSettings(settings);
+}
+
+const arrowStart = settings["Starting arrowhead"].value === "none" ? null : settings["Starting arrowhead"].value;
+const arrowEnd = settings["Ending arrowhead"].value === "none" ? null : settings["Ending arrowhead"].value;
+const linePoints = Math.floor(settings["Line points"].value);
+
+
+
+const elements = ea.getViewSelectedElements();
+ea.copyViewElementsToEAforEditing(elements);
+groups = ea.getMaximumGroups(elements);
+if(groups.length !== 2) {
+  //unfortunately getMaxGroups returns duplicated resultset for sticky notes
+  //needs additional filtering
+  cleanGroups=[];
+  idList = [];
+  for (group of groups) {
+    keep = true;
+    for(item of group) if(idList.contains(item.id)) keep = false;
+    if(keep) {
+      cleanGroups.push(group);
+      idList = idList.concat(group.map(el=>el.id))
+    }
+  }
+  if(cleanGroups.length !== 2) return;
+  groups = cleanGroups;
+}
+els = [ 
+  ea.getLargestElement(groups[0]),
+  ea.getLargestElement(groups[1])
+];
+
+ea.style.strokeColor = els[0].strokeColor;
+ea.style.strokeWidth = els[0].strokeWidth;
+ea.style.strokeStyle = els[0].strokeStyle;
+ea.style.strokeSharpness = els[0].strokeSharpness;
+ea.connectObjects(
+  els[0].id,
+  null,
+  els[1].id,
+  null, 
+  {
+	endArrowHead: arrowEnd,
+	startArrowHead: arrowStart, 
+	numberOfPoints: linePoints
+  }
+);
+ea.addElementsToView(false,true,true);

ea-scripts/Convert freedraw to line.md

@@ -0,0 +1,64 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-convert-freedraw-to-line.jpg)
+
+Convert selected freedraw objects into editable lines. This will allow you to adjust your drawings by dragging line points and will also allow you to select shape fill in case of enclosed lines. You can adjust conversion point density in settings.
+
+```javascript
+*/
+
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Point density"]) {
+  settings = {
+    "Point density" : {
+      value: "7:1",
+      valueset: ["1:1","2:1","3:1","4:1","5:1","6:1","7:1","8:1","9:1","10:1","11:1"],
+      description: "A freedraw object has many points. Converting freedraw to a line with too many points will result in an impractical object that is hard to edit. This setting sepcifies how many points from freedraw should be averaged to form a point on the line"
+    },
+  };
+  ea.setScriptSettings(settings);
+}
+
+const scale = settings["Point density"].value;
+const setSize = parseInt(scale.substring(0,scale.indexOf(":")));
+
+const elements = ea.getViewSelectedElements().filter(el=>el.type==="freedraw");
+if(elements.length === 0) {
+	new Notice("No freedraw object is selected");
+}
+
+
+ea.style.roughness=0;
+ea.style.strokeSharpness="round";
+
+elements.forEach((el)=>{
+	points = [];
+  points.push(el.points[0]);
+  for(i=1;i<el.points.length;i+=setSize) {
+		point = [0,0];
+    count = 0;
+    for(p of el.points.slice(i,i+setSize)) {
+			point = [ point[0]+p[0] , point[1]+p[1] ];
+			count++;
+		}
+		point = [point[0]/count,point[1]/count];
+	  points.push(point);
+	}
+	const lineId = ea.addLine(points);
+  const line = ea.getElement(lineId);
+  line.strokeWidth = el.strokeWidth*3;
+  line.strokeColor = el.strokeColor;
+  line.width = el.width;
+  line.height = el.height;
+  line.x = el.x;
+  line.y = el.y;
+});
+
+ea.deleteViewElements(elements);
+await ea.addElementsToView(false,true,true);
+ea.selectElementsInView(ea.getElements());

ea-scripts/Convert selected text elements to sticky notes.md

@@ -0,0 +1,51 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-textelement-to-transparent-stickynote.png)
+
+Converts selected plain text elements to sticky notes with transparent background and transparent stroke color. Essentially converts text element into a wrappable format.
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Border color"]) {
+	settings = {
+	  "Border color" : {
+			value: "#000000",
+      description: "Any legal HTML color (#000000, rgb, color-name, etc.). Set to 'transparent' for transparent color."
+		},
+		"Background color" : {
+			value: "transparent",
+      description: "Background color of the sticky note. Set to 'transparent' for transparent color."
+		},
+		"Background fill style" : {
+			value: "solid",
+      description: "Fill style of the sticky note",
+		  valueset: ["hachure","cross-hatch","solid"]
+		}
+	};
+	ea.setScriptSettings(settings);
+}
+
+const strokeColor = settings["Border color"].value;
+const backgroundColor = settings["Background color"].value;
+const fillStyle = settings["Background fill style"].value;
+
+elements = ea.getViewSelectedElements()
+             .filter((el)=>(el.type==="text")&&(el.containerId===null));
+if(elements.length===0) return;
+ea.style.strokeColor = strokeColor;
+ea.style.backgroundColor = backgroundColor;
+ea.style.fillStyle = fillStyle;
+const padding = 6;
+elements.forEach((el)=>{
+  const id = ea.addRect(el.x-padding,el.y-padding,el.width+2*padding,el.height+2*padding);
+  ea.getElement(id).boundElements=[{type:"text",id:el.id}];
+  el.containerId = id;
+});
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();

ea-scripts/Convert text to link with folder and alias.md

@@ -0,0 +1,32 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+Converts text elements to links pointing to a file in a selected folder and with the alias set as the original text. The script will prompt the user to select an existing folder from the vault.
+`original text` => `[[selected folder/original text|original text]]`
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+folders = new Set();
+app.vault.getFiles().forEach((f)=>
+  folders.add(f.path.substring(0,f.path.lastIndexOf("/")))
+);
+
+f = Array.from(folders);
+folder = await utils.suggester(f,f);
+folder = folder??""; //if exiting suggester with ESC
+folder = folder === "" ? folder : folder + "/";
+
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+
+elements.forEach((el)=>{
+  el.rawText = "[["+folder+el.rawText+"|"+el.rawText+"]]";
+  el.text = "[["+folder+el.text+"|"+el.text+"]]";
+  el.originalText = "[["+folder+el.originalText+"|"+el.originalText+"]]";
+})
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();

ea-scripts/Copy Selected Element Styles to Global.md

@@ -0,0 +1,43 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-copy-selected-element-styles-to-global.png)
+
+This script will copy styles of any selected element into Excalidraw's global styles.
+
+After copying the styles of element such as box, text, or arrow using this script, You can then use Excalidraw's box, arrow, and other tools to create several elements with the same style. This is sometimes more convenient than `Copy Styles` and `Paste Styles`, especially when used with the script `Box Each Selected Groups`.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+
+const element = ea.getViewSelectedElement();
+const appState = ea.getExcalidrawAPI().getAppState();
+
+if(!element) {
+	return;
+}
+
+appState.currentItemStrokeWidth = element.strokeWidth;
+appState.currentItemStrokeStyle = element.strokeStyle;
+appState.currentItemStrokeSharpness = element.strokeSharpness;
+appState.currentItemRoughness = element.roughness;
+appState.currentItemFillStyle = element.fillStyle;
+appState.currentItemBackgroundColor = element.backgroundColor;
+appState.currentItemStrokeColor = element.strokeColor;
+
+if(element.type === 'text') {
+	appState.currentItemFontFamily = element.fontFamily;
+	appState.currentItemFontSize = element.fontSize;
+	appState.currentItemTextAlign = element.textAlign;
+}
+
+if(element.type === 'arrow') {
+	appState.currentItemStartArrowhead = element.startArrowhead;
+	appState.currentItemEndArrowhead = element.endArrowhead;
+}

ea-scripts/Create new markdown file and embed into active drawing.md

@@ -0,0 +1,21 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-create-and-embed-new-markdown-file.jpg)
+
+The script will prompt you for a filename, then create a new markdown document with the file name provided, open the new markdown document in an adjacent pane, and embed the markdown document into the active Excalidraw drawing.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+let folder = ea.targetView.file.path;
+folder = folder.lastIndexOf("/")===-1?"":folder.substring(0,folder.lastIndexOf("/"))+"/";
+const fname = await utils.inputPrompt("Filename for new file","Filename",folder);
+const file = await app.fileManager.createAndOpenMarkdownFile(fname,true);
+await ea.addImage(0,0,file);
+ea.addElementsToView(true,true);

ea-scripts/Darken background color.md

@@ -0,0 +1,289 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/darken-lighten-background-color.png)
+
+This script darkens the background color of the selected element by 2% at a time. 
+
+You can use this script several times until you are satisfied. It is recommended to set a shortcut key for this script so that you can quickly try to DARKEN and LIGHTEN the color effect.
+
+In contrast to the `Modify background color opacity` script, the advantage is that the background color of the element is not affected by the canvas color, and the color value does not appear in a strange rgba() form.
+
+The color conversion method was copied from [color-convert](https://github.com/Qix-/color-convert).
+
+```javascript
+*/
+
+const elements = ea
+  .getViewSelectedElements()
+  .filter((el) =>
+    ["rectangle", "ellipse", "diamond", "image", "line"].includes(el.type)
+  );
+ea.copyViewElementsToEAforEditing(elements);
+for (const el of ea.getElements()) {
+  const color = colorNameToHex(el.backgroundColor);
+  const rgbColor = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(color);
+  if (rgbColor) {
+    const r = parseInt(rgbColor[1], 16);
+    const g = parseInt(rgbColor[2], 16);
+    const b = parseInt(rgbColor[3], 16);
+    const originalRgb = [r, g, b];
+    const hsl = rgbToHsl(originalRgb);
+    const step = 2;
+    const newLightness = hsl[2] - step;
+    if (newLightness > 0) {
+      hsl[2] = newLightness;
+    }
+    const newRgb = hslToRgb(hsl);
+    el.backgroundColor = "#" + rgbToHexString(newRgb);
+  }
+}
+ea.addElementsToView(false, false);
+
+function rgbToHexString(args) {
+  const integer =
+    ((Math.round(args[0]) & 0xff) << 16) +
+    ((Math.round(args[1]) & 0xff) << 8) +
+    (Math.round(args[2]) & 0xff);
+
+  const string = integer.toString(16).toUpperCase();
+  return "000000".substring(string.length) + string;
+}
+
+function hslToRgb(hsl) {
+  const h = hsl[0] / 360;
+  const s = hsl[1] / 100;
+  const l = hsl[2] / 100;
+  let t2;
+  let t3;
+  let val;
+
+  if (s === 0) {
+    val = l * 255;
+    return [val, val, val];
+  }
+
+  if (l < 0.5) {
+    t2 = l * (1 + s);
+  } else {
+    t2 = l + s - l * s;
+  }
+
+  const t1 = 2 * l - t2;
+
+  const rgb = [0, 0, 0];
+  for (let i = 0; i < 3; i++) {
+    t3 = h + (1 / 3) * -(i - 1);
+    if (t3 < 0) {
+      t3++;
+    }
+
+    if (t3 > 1) {
+      t3--;
+    }
+
+    if (6 * t3 < 1) {
+      val = t1 + (t2 - t1) * 6 * t3;
+    } else if (2 * t3 < 1) {
+      val = t2;
+    } else if (3 * t3 < 2) {
+      val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
+    } else {
+      val = t1;
+    }
+
+    rgb[i] = val * 255;
+  }
+
+  return rgb;
+}
+
+function rgbToHsl(rgb) {
+  const r = rgb[0] / 255;
+  const g = rgb[1] / 255;
+  const b = rgb[2] / 255;
+  const min = Math.min(r, g, b);
+  const max = Math.max(r, g, b);
+  const delta = max - min;
+  let h;
+  let s;
+
+  if (max === min) {
+    h = 0;
+  } else if (r === max) {
+    h = (g - b) / delta;
+  } else if (g === max) {
+    h = 2 + (b - r) / delta;
+  } else if (b === max) {
+    h = 4 + (r - g) / delta;
+  }
+
+  h = Math.min(h * 60, 360);
+
+  if (h < 0) {
+    h += 360;
+  }
+
+  const l = (min + max) / 2;
+
+  if (max === min) {
+    s = 0;
+  } else if (l <= 0.5) {
+    s = delta / (max + min);
+  } else {
+    s = delta / (2 - max - min);
+  }
+
+  return [h, s * 100, l * 100];
+}
+
+function colorNameToHex(color) {
+  const colors = {
+    aliceblue: "#f0f8ff",
+    antiquewhite: "#faebd7",
+    aqua: "#00ffff",
+    aquamarine: "#7fffd4",
+    azure: "#f0ffff",
+    beige: "#f5f5dc",
+    bisque: "#ffe4c4",
+    black: "#000000",
+    blanchedalmond: "#ffebcd",
+    blue: "#0000ff",
+    blueviolet: "#8a2be2",
+    brown: "#a52a2a",
+    burlywood: "#deb887",
+    cadetblue: "#5f9ea0",
+    chartreuse: "#7fff00",
+    chocolate: "#d2691e",
+    coral: "#ff7f50",
+    cornflowerblue: "#6495ed",
+    cornsilk: "#fff8dc",
+    crimson: "#dc143c",
+    cyan: "#00ffff",
+    darkblue: "#00008b",
+    darkcyan: "#008b8b",
+    darkgoldenrod: "#b8860b",
+    darkgray: "#a9a9a9",
+    darkgreen: "#006400",
+    darkkhaki: "#bdb76b",
+    darkmagenta: "#8b008b",
+    darkolivegreen: "#556b2f",
+    darkorange: "#ff8c00",
+    darkorchid: "#9932cc",
+    darkred: "#8b0000",
+    darksalmon: "#e9967a",
+    darkseagreen: "#8fbc8f",
+    darkslateblue: "#483d8b",
+    darkslategray: "#2f4f4f",
+    darkturquoise: "#00ced1",
+    darkviolet: "#9400d3",
+    deeppink: "#ff1493",
+    deepskyblue: "#00bfff",
+    dimgray: "#696969",
+    dodgerblue: "#1e90ff",
+    firebrick: "#b22222",
+    floralwhite: "#fffaf0",
+    forestgreen: "#228b22",
+    fuchsia: "#ff00ff",
+    gainsboro: "#dcdcdc",
+    ghostwhite: "#f8f8ff",
+    gold: "#ffd700",
+    goldenrod: "#daa520",
+    gray: "#808080",
+    green: "#008000",
+    greenyellow: "#adff2f",
+    honeydew: "#f0fff0",
+    hotpink: "#ff69b4",
+    "indianred ": "#cd5c5c",
+    indigo: "#4b0082",
+    ivory: "#fffff0",
+    khaki: "#f0e68c",
+    lavender: "#e6e6fa",
+    lavenderblush: "#fff0f5",
+    lawngreen: "#7cfc00",
+    lemonchiffon: "#fffacd",
+    lightblue: "#add8e6",
+    lightcoral: "#f08080",
+    lightcyan: "#e0ffff",
+    lightgoldenrodyellow: "#fafad2",
+    lightgrey: "#d3d3d3",
+    lightgreen: "#90ee90",
+    lightpink: "#ffb6c1",
+    lightsalmon: "#ffa07a",
+    lightseagreen: "#20b2aa",
+    lightskyblue: "#87cefa",
+    lightslategray: "#778899",
+    lightsteelblue: "#b0c4de",
+    lightyellow: "#ffffe0",
+    lime: "#00ff00",
+    limegreen: "#32cd32",
+    linen: "#faf0e6",
+    magenta: "#ff00ff",
+    maroon: "#800000",
+    mediumaquamarine: "#66cdaa",
+    mediumblue: "#0000cd",
+    mediumorchid: "#ba55d3",
+    mediumpurple: "#9370d8",
+    mediumseagreen: "#3cb371",
+    mediumslateblue: "#7b68ee",
+    mediumspringgreen: "#00fa9a",
+    mediumturquoise: "#48d1cc",
+    mediumvioletred: "#c71585",
+    midnightblue: "#191970",
+    mintcream: "#f5fffa",
+    mistyrose: "#ffe4e1",
+    moccasin: "#ffe4b5",
+    navajowhite: "#ffdead",
+    navy: "#000080",
+    oldlace: "#fdf5e6",
+    olive: "#808000",
+    olivedrab: "#6b8e23",
+    orange: "#ffa500",
+    orangered: "#ff4500",
+    orchid: "#da70d6",
+    palegoldenrod: "#eee8aa",
+    palegreen: "#98fb98",
+    paleturquoise: "#afeeee",
+    palevioletred: "#d87093",
+    papayawhip: "#ffefd5",
+    peachpuff: "#ffdab9",
+    peru: "#cd853f",
+    pink: "#ffc0cb",
+    plum: "#dda0dd",
+    powderblue: "#b0e0e6",
+    purple: "#800080",
+    rebeccapurple: "#663399",
+    red: "#ff0000",
+    rosybrown: "#bc8f8f",
+    royalblue: "#4169e1",
+    saddlebrown: "#8b4513",
+    salmon: "#fa8072",
+    sandybrown: "#f4a460",
+    seagreen: "#2e8b57",
+    seashell: "#fff5ee",
+    sienna: "#a0522d",
+    silver: "#c0c0c0",
+    skyblue: "#87ceeb",
+    slateblue: "#6a5acd",
+    slategray: "#708090",
+    snow: "#fffafa",
+    springgreen: "#00ff7f",
+    steelblue: "#4682b4",
+    tan: "#d2b48c",
+    teal: "#008080",
+    thistle: "#d8bfd8",
+    tomato: "#ff6347",
+    turquoise: "#40e0d0",
+    violet: "#ee82ee",
+    wheat: "#f5deb3",
+    white: "#ffffff",
+    whitesmoke: "#f5f5f5",
+    yellow: "#ffff00",
+    yellowgreen: "#9acd32",
+  };
+  if (typeof colors[color.toLowerCase()] != "undefined")
+    return colors[color.toLowerCase()];
+  return color;
+}

ea-scripts/Elbow connectors.md

@@ -0,0 +1,56 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/elbow-connectors.png)
+
+This script converts the selected connectors to elbows.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+const elements = ea.getViewSelectedElements();
+
+const lines = elements.filter((el)=>el.type==="arrow" || el.type==="line");
+
+for (const line of lines) {
+  if (line.points.length >= 3) {
+    for (var i = 0; i < line.points.length - 2; i++) {
+      var p1;
+      var p3;
+      if (line.points[i][0] < line.points[i + 2][0]) {
+        p1 = line.points[i];
+        p3 = line.points[i+2];
+      } else {
+        p1 = line.points[i + 2];
+        p3 = line.points[i];
+      }
+      const p2 = line.points[i + 1];
+
+      if (p1[0] === p3[0]) {
+        continue;
+      }
+
+      const k = (p3[1] - p1[1]) / (p3[0] - p1[0]);
+      const b = p1[1] - k * p1[0];
+
+      y0 = k * p2[0] + b;
+      const up = p2[1] < y0;
+
+      if ((k > 0 && !up) || (k < 0 && up)) {
+        p2[0] = p1[0];
+        p2[1] = p3[1];
+      } else {
+        p2[0] = p3[0];
+        p2[1] = p1[1];
+      }
+    }
+  }
+}
+
+ea.copyViewElementsToEAforEditing(lines);
+ea.addElementsToView();

ea-scripts/Expand rectangles horizontally keep text centered.md

@@ -0,0 +1,146 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)
+
+This script expands the width of the selected rectangles until they are all the same width and keep the text centered.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+
+const elements = ea.getViewSelectedElements();
+const topGroups = ea.getMaximumGroups(elements);
+const allIndividualArrows = ea.getMaximumGroups(ea.getViewElements())
+	.reduce((result, group) => (group.length === 1 && (group[0].type === 'arrow')) ? 
+			    [...result, group[0]] : result, []);
+
+const groupWidths = topGroups
+  .map((g) => {
+    if(g.length === 1 && (g[0].type === 'arrow' || g[0].type === 'line')) {
+      // ignore individual lines
+      return { minLeft: 0, maxRight: 0 };
+    }
+    return g.reduce(
+      (pre, cur, i) => {
+        if (i === 0) {
+          return {
+            minLeft: cur.x,
+            maxRight: cur.x + cur.width,
+            index: i,
+          };
+        } else {
+          return {
+            minLeft: cur.x < pre.minLeft ? cur.x : pre.minLeft,
+            maxRight:
+              cur.x + cur.width > pre.maxRight
+                ? cur.x + cur.width
+                : pre.maxRight,
+            index: i,
+          };
+        }
+      },
+      { minLeft: 0, maxRight: 0 }
+    );
+  })
+  .map((r) => {
+    r.width = r.maxRight - r.minLeft;
+    return r;
+  });
+
+const maxGroupWidth = Math.max(...groupWidths.map((g) => g.width));
+
+for (var i = 0; i < topGroups.length; i++) {
+  const rects = topGroups[i]
+    .filter((el) => el.type === "rectangle")
+    .sort((lha, rha) => lha.x - rha.x);
+  const texts = topGroups[i]
+    .filter((el) => el.type === "text")
+    .sort((lha, rha) => lha.x - rha.x);
+  const groupWith = groupWidths[i].width;
+  if (groupWith < maxGroupWidth) {
+    const distance = maxGroupWidth - groupWith;
+    const perRectDistance = distance / rects.length;
+    for (var j = 0; j < rects.length; j++) {
+      const rect = rects[j];
+      const rectLeft = rect.x;
+      const rectTop = rect.y;
+      const rectRight = rect.x + rect.width;
+      const rectBottom = rect.y + rect.height;
+      
+      rect.x = rect.x + perRectDistance * j - perRectDistance / 2;
+      rect.width += perRectDistance;
+      
+      const textsWithRect = texts.filter(text => text.x >= rectLeft && text.x <= rectRight
+        && text.y >= rectTop && text.y <= rectBottom);
+      for(const text of textsWithRect) {
+        text.x = text.x + perRectDistance * j;
+      }
+
+      // recalculate the position of the points
+      const startBindingLines = allIndividualArrows.filter(el => (el.startBinding||{}).elementId === rect.id);
+     	for(startBindingLine of startBindingLines) {
+     		recalculateStartPointOfLine(startBindingLine, rect);
+     	}
+     
+     	const endBindingLines = allIndividualArrows.filter(el => (el.endBinding||{}).elementId === rect.id);
+     	for(endBindingLine of endBindingLines) {
+     		recalculateEndPointOfLine(endBindingLine, rect);
+     	}
+    }
+  }
+}
+
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);
+
+function recalculateStartPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[1][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[1][1];
+
+	line.startBinding.gap = 8;
+	line.startBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.startBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+		line.points[0] = [0, 0];
+		for(var i = 1; i<line.points.length; i++) {
+			line.points[i][0] -= intersectA[0][0] - line.x;
+			line.points[i][1] -= intersectA[0][1] - line.y;
+		}
+		line.x = intersectA[0][0];
+		line.y = intersectA[0][1];
+	}
+}
+
+function recalculateEndPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[line.points.length-2][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[line.points.length-2][1];
+
+	line.endBinding.gap = 8;
+	line.endBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.endBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+    	line.points[line.points.length - 1] = [intersectA[0][0] - line.x, intersectA[0][1] - line.y];
+	}
+}

ea-scripts/Expand rectangles horizontally.md

@@ -0,0 +1,133 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)
+
+This script expands the width of the selected rectangles until they are all the same width.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+
+const elements = ea.getViewSelectedElements();
+const topGroups = ea.getMaximumGroups(elements);
+const allIndividualArrows = ea.getMaximumGroups(ea.getViewElements())
+	.reduce((result, group) => (group.length === 1 && (group[0].type === 'arrow' || group[0].type === 'line')) ? 
+			[...result, group[0]] : result, []);
+
+const groupWidths = topGroups
+  .map((g) => {
+    if(g.length === 1 && (g[0].type === 'arrow' || g[0].type === 'line')) {
+      // ignore individual lines
+      return { minLeft: 0, maxRight: 0 };
+    }
+    return g.reduce(
+      (pre, cur, i) => {
+        if (i === 0) {
+          return {
+            minLeft: cur.x,
+            maxRight: cur.x + cur.width,
+            index: i,
+          };
+        } else {
+          return {
+            minLeft: cur.x < pre.minLeft ? cur.x : pre.minLeft,
+            maxRight:
+              cur.x + cur.width > pre.maxRight
+                ? cur.x + cur.width
+                : pre.maxRight,
+            index: i,
+          };
+        }
+      },
+      { minLeft: 0, maxRight: 0 }
+    );
+  })
+  .map((r) => {
+    r.width = r.maxRight - r.minLeft;
+    return r;
+  });
+
+const maxGroupWidth = Math.max(...groupWidths.map((g) => g.width));
+
+for (var i = 0; i < topGroups.length; i++) {
+  const rects = topGroups[i]
+    .filter((el) => el.type === "rectangle")
+    .sort((lha, rha) => lha.x - rha.x);
+  
+  const groupWith = groupWidths[i].width;
+  if (groupWith < maxGroupWidth) {
+    const distance = maxGroupWidth - groupWith;
+    const perRectDistance = distance / rects.length;
+    for (var j = 0; j < rects.length; j++) {
+      const rect = rects[j];
+      rect.x = rect.x + perRectDistance * j;
+      rect.width += perRectDistance;
+
+      // recalculate the position of the points
+      const startBindingLines = allIndividualArrows.filter(el => (el.startBinding||{}).elementId === rect.id);
+     	for(startBindingLine of startBindingLines) {
+     		recalculateStartPointOfLine(startBindingLine, rect);
+     	}
+     
+     	const endBindingLines = allIndividualArrows.filter(el => (el.endBinding||{}).elementId === rect.id);
+     	for(endBindingLine of endBindingLines) {
+     		recalculateEndPointOfLine(endBindingLine, rect);
+     	}
+    }
+  }
+}
+
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);
+
+function recalculateStartPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[1][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[1][1];
+
+	line.startBinding.gap = 8;
+	line.startBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.startBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+		line.points[0] = [0, 0];
+		for(var i = 1; i<line.points.length; i++) {
+			line.points[i][0] -= intersectA[0][0] - line.x;
+			line.points[i][1] -= intersectA[0][1] - line.y;
+		}
+		line.x = intersectA[0][0];
+		line.y = intersectA[0][1];
+	}
+}
+
+function recalculateEndPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[line.points.length-2][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[line.points.length-2][1];
+
+	line.endBinding.gap = 8;
+	line.endBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.endBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+    	line.points[line.points.length - 1] = [intersectA[0][0] - line.x, intersectA[0][1] - line.y];
+	}
+}

ea-scripts/Expand rectangles vertically keep text centered.md

@@ -0,0 +1,146 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)
+
+This script expands the height of the selected rectangles until they are all the same height and keep the text centered.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+
+const elements = ea.getViewSelectedElements();
+const topGroups = ea.getMaximumGroups(elements);
+const allIndividualArrows = ea.getMaximumGroups(ea.getViewElements())
+	.reduce((result, group) => (group.length === 1 && (group[0].type === 'arrow' || group[0].type === 'line')) ? 
+			[...result, group[0]] : result, []);
+
+const groupHeights = topGroups
+  .map((g) => {
+    if(g.length === 1 && (g[0].type === 'arrow' || g[0].type === 'line')) {
+      // ignore individual lines
+      return { minTop: 0, maxBottom: 0 };
+    }
+    return g.reduce(
+      (pre, cur, i) => {
+        if (i === 0) {
+          return {
+            minTop: cur.y,
+            maxBottom: cur.y + cur.height,
+            index: i,
+          };
+        } else {
+          return {
+            minTop: cur.y < pre.minTop ? cur.y : pre.minTop,
+            maxBottom:
+              cur.y + cur.height > pre.maxBottom
+                ? cur.y + cur.height
+                : pre.maxBottom,
+            index: i,
+          };
+        }
+      },
+      { minTop: 0, maxBottom: 0 }
+    );
+  })
+  .map((r) => {
+    r.height = r.maxBottom - r.minTop;
+    return r;
+  });
+
+const maxGroupHeight = Math.max(...groupHeights.map((g) => g.height));
+
+for (var i = 0; i < topGroups.length; i++) {
+  const rects = topGroups[i]
+    .filter((el) => el.type === "rectangle")
+    .sort((lha, rha) => lha.y - rha.y);
+  const texts = topGroups[i]
+    .filter((el) => el.type === "text")
+    .sort((lha, rha) => lha.y - rha.y);
+  const groupWith = groupHeights[i].height;
+  if (groupWith < maxGroupHeight) {
+    const distance = maxGroupHeight - groupWith;
+    const perRectDistance = distance / rects.length;
+    for (var j = 0; j < rects.length; j++) {
+      const rect = rects[j];
+      const rectLeft = rect.x;
+      const rectTop = rect.y;
+      const rectRight = rect.x + rect.width;
+      const rectBottom = rect.y + rect.height;
+
+      rect.y = rect.y + perRectDistance * j - perRectDistance / 2;
+      rect.height += perRectDistance;
+
+      const textsWithRect = texts.filter(text => text.x >= rectLeft && text.x <= rectRight
+        && text.y >= rectTop && text.y <= rectBottom);
+      for(const text of textsWithRect) {
+        text.y = text.y + perRectDistance * j;
+      }
+
+      // recalculate the position of the points
+      const startBindingLines = allIndividualArrows.filter(el => (el.startBinding||{}).elementId === rect.id);
+     	for(startBindingLine of startBindingLines) {
+     		recalculateStartPointOfLine(startBindingLine, rect);
+     	}
+     
+     	const endBindingLines = allIndividualArrows.filter(el => (el.endBinding||{}).elementId === rect.id);
+     	for(endBindingLine of endBindingLines) {
+     		recalculateEndPointOfLine(endBindingLine, rect);
+     	}
+    }
+  }
+}
+
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);
+
+function recalculateStartPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[1][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[1][1];
+
+	line.startBinding.gap = 8;
+	line.startBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.startBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+		line.points[0] = [0, 0];
+		for(var i = 1; i<line.points.length; i++) {
+			line.points[i][0] -= intersectA[0][0] - line.x;
+			line.points[i][1] -= intersectA[0][1] - line.y;
+		}
+		line.x = intersectA[0][0];
+		line.y = intersectA[0][1];
+	}
+}
+
+function recalculateEndPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[line.points.length-2][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[line.points.length-2][1];
+
+	line.endBinding.gap = 8;
+	line.endBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.endBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+    	line.points[line.points.length - 1] = [intersectA[0][0] - line.x, intersectA[0][1] - line.y];
+	}
+}

ea-scripts/Expand rectangles vertically.md

@@ -0,0 +1,131 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)
+
+This script expands the height of the selected rectangles until they are all the same height.
+
+```javascript
+*/
+
+const elements = ea.getViewSelectedElements();
+const topGroups = ea.getMaximumGroups(elements);
+const allLines = ea.getViewElements().filter(el => el.type === 'arrow' || el.type === 'line');
+const allIndividualArrows = ea.getMaximumGroups(ea.getViewElements())
+	.reduce((result, group) => (group.length === 1 && (group[0].type === 'arrow' || group[0].type === 'line')) ? 
+			[...result, group[0]] : result, []);
+
+const groupHeights = topGroups
+  .map((g) => {
+    if(g.length === 1 && (g[0].type === 'arrow' || g[0].type === 'line')) {
+      // ignore individual lines
+      return { minTop: 0, maxBottom: 0 };
+    }
+    return g.reduce(
+      (pre, cur, i) => {
+        if (i === 0) {
+          return {
+            minTop: cur.y,
+            maxBottom: cur.y + cur.height,
+            index: i,
+          };
+        } else {
+          return {
+            minTop: cur.y < pre.minTop ? cur.y : pre.minTop,
+            maxBottom:
+              cur.y + cur.height > pre.maxBottom
+                ? cur.y + cur.height
+                : pre.maxBottom,
+            index: i,
+          };
+        }
+      },
+      { minTop: 0, maxBottom: 0 }
+    );
+  })
+  .map((r) => {
+    r.height = r.maxBottom - r.minTop;
+    return r;
+  });
+
+const maxGroupHeight = Math.max(...groupHeights.map((g) => g.height));
+
+for (var i = 0; i < topGroups.length; i++) {
+  const rects = topGroups[i]
+    .filter((el) => el.type === "rectangle")
+    .sort((lha, rha) => lha.y - rha.y);
+    
+  const groupWith = groupHeights[i].height;
+  if (groupWith < maxGroupHeight) {
+    const distance = maxGroupHeight - groupWith;
+    const perRectDistance = distance / rects.length;
+    for (var j = 0; j < rects.length; j++) {
+      const rect = rects[j];
+      rect.y = rect.y + perRectDistance * j;
+      rect.height += perRectDistance;
+
+      // recalculate the position of the points
+      const startBindingLines = allIndividualArrows.filter(el => (el.startBinding||{}).elementId === rect.id);
+     	for(startBindingLine of startBindingLines) {
+     		recalculateStartPointOfLine(startBindingLine, rect);
+     	}
+     
+     	const endBindingLines = allIndividualArrows.filter(el => (el.endBinding||{}).elementId === rect.id);
+     	for(endBindingLine of endBindingLines) {
+     		recalculateEndPointOfLine(endBindingLine, rect);
+     	}
+    }
+  }
+}
+
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);
+
+function recalculateStartPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[1][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[1][1];
+
+	line.startBinding.gap = 8;
+	line.startBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.startBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+		line.points[0] = [0, 0];
+		for(var i = 1; i<line.points.length; i++) {
+			line.points[i][0] -= intersectA[0][0] - line.x;
+			line.points[i][1] -= intersectA[0][1] - line.y;
+		}
+		line.x = intersectA[0][0];
+		line.y = intersectA[0][1];
+	}
+}
+
+function recalculateEndPointOfLine(line, el) {
+	const aX = el.x + el.width/2;
+    const bX = line.x + line.points[line.points.length-2][0];
+    const aY = el.y + el.height/2;
+    const bY = line.y + line.points[line.points.length-2][1];
+
+	line.endBinding.gap = 8;
+	line.endBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.endBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+    	line.points[line.points.length - 1] = [intersectA[0][0] - line.x, intersectA[0][1] - line.y];
+	}
+}

ea-scripts/Fixed horizontal distance between centers.md

@@ -0,0 +1,72 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-horizontal-distance-between-centers.png)
+
+This script arranges the selected elements horizontally with a fixed center spacing.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default distance"]) {
+	settings = {
+	  "Prompt for distance?": true,
+	  "Default distance" : {
+		value: 10,
+		description: "Fixed horizontal distance between centers"
+	  },
+	  "Remember last distance?": false
+	};
+	ea.setScriptSettings(settings);
+}
+
+let distanceStr = settings["Default distance"].value.toString();
+const rememberLastDistance = settings["Remember last distance?"];
+
+if(settings["Prompt for distance?"]) {
+    distanceStr = await utils.inputPrompt("distance?","number",distanceStr);
+}
+
+const distance = parseInt(distanceStr);
+if(isNaN(distance)) {
+  return;
+}
+if(rememberLastDistance) {
+	settings["Default distance"].value = distance;
+	ea.setScriptSettings(settings);
+}
+const elements=ea.getViewSelectedElements();
+const topGroups = ea.getMaximumGroups(elements)
+    .filter(els => !(els.length === 1 && els[0].type ==="arrow")); // ignore individual arrows
+const groups = topGroups.sort((lha,rha) => lha[0].x - rha[0].x);
+
+for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const preGroup = groups[i-1];
+        const curGroup = groups[i];
+
+        const preLeft = Math.min(...preGroup.map(el => el.x));
+        const preRight = Math.max(...preGroup.map(el => el.x + el.width));
+        const preCenter = preLeft + (preRight - preLeft) / 2;
+        const curLeft = Math.min(...curGroup.map(el => el.x));
+        const curRight = Math.max(...curGroup.map(el => el.x + el.width));
+        const curCenter = curLeft + (curRight - curLeft) / 2;
+        const distanceBetweenCenters = curCenter -  preCenter - distance;
+
+        for(const curEl of curGroup) {
+            curEl.x = curEl.x - distanceBetweenCenters;
+        }
+    }
+}
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);

ea-scripts/Fixed inner distance.md

@@ -0,0 +1,126 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-inner-distance.png)
+
+This script arranges selected elements and groups with a fixed inner distance.
+
+Tips: You can use the `Box Selected Elements` and `Dimensions` scripts to create rectangles of the desired size, then use the `Change shape of selected elements` script to convert the rectangles to ellipses, and then use the `Fixed inner distance` script regains a desired inner distance.
+
+Inspiration: #394
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default distance"]) {
+	settings = {
+	  "Prompt for distance?": true,
+	  "Default distance" : {
+		value: 10,
+		description: "Fixed horizontal distance between centers"
+	  },
+	  "Remember last distance?": false
+	};
+	ea.setScriptSettings(settings);
+}
+
+let distanceStr = settings["Default distance"].value.toString();
+const rememberLastDistance = settings["Remember last distance?"];
+
+if(settings["Prompt for distance?"]) {
+    distanceStr = await utils.inputPrompt("distance?","number",distanceStr);
+}
+
+const borders = ["top", "bottom", "left", "right"];
+const fromBorder = await utils.suggester(borders, borders, "from border?");
+
+if(!fromBorder) {
+  return;
+}
+
+const distance = parseInt(distanceStr);
+if(isNaN(distance)) {
+  return;
+}
+if(rememberLastDistance) {
+	settings["Default distance"].value = distance;
+	ea.setScriptSettings(settings);
+}
+const elements=ea.getViewSelectedElements();
+const topGroups = ea.getMaximumGroups(elements)
+    .filter(els => !(els.length === 1 && els[0].type ==="arrow")); // ignore individual arrows
+
+if(topGroups.length <= 1) {
+  new Notice("At least 2 or more elements or groups should be selected.");
+  return;
+}
+
+if(fromBorder === 'top') {
+  const groups = topGroups.sort((lha,rha) => Math.min(...lha.map(t => t.y)) - Math.min(...rha.map(t => t.y)));
+  const firstGroupTop = Math.min(...groups[0].map(el => el.y));
+  
+  for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const curGroup = groups[i];
+        const moveDistance = distance * i;
+        for(const curEl of curGroup) {
+          curEl.y = firstGroupTop + moveDistance;
+        }
+    }
+  }   
+}
+else if(fromBorder === 'bottom') {
+  const groups = topGroups.sort((lha,rha) => Math.min(...lha.map(t => t.y + t.height)) - Math.min(...rha.map(t => t.y + t.height))).reverse();
+  const firstGroupBottom = Math.max(...groups[0].map(el => el.y + el.height));
+  
+  for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const curGroup = groups[i];
+        const moveDistance = distance * i;
+        for(const curEl of curGroup) {
+           curEl.y = firstGroupBottom - moveDistance - curEl.height;
+        }
+    }
+  }   
+}
+else if(fromBorder === 'left') {
+  const groups = topGroups.sort((lha,rha) => Math.min(...lha.map(t => t.x)) - Math.min(...rha.map(t => t.x)));
+  const firstGroupLeft = Math.min(...groups[0].map(el => el.x));
+  
+  for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const curGroup = groups[i];
+        const moveDistance = distance * i;
+        for(const curEl of curGroup) {
+          curEl.x = firstGroupLeft + moveDistance;
+        }
+    }
+  }   
+}
+else if(fromBorder === 'right') {
+  const groups = topGroups.sort((lha,rha) => Math.min(...lha.map(t => t.x + t.width)) - Math.min(...rha.map(t => t.x + t.width))).reverse();
+  const firstGroupRight = Math.max(...groups[0].map(el => el.x + el.width));
+  
+  for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const curGroup = groups[i];
+        const moveDistance = distance * i;
+        for(const curEl of curGroup) {
+           curEl.x = firstGroupRight - moveDistance - curEl.width;
+        }
+    }
+  }   
+}
+
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);

ea-scripts/Fixed spacing.md

@@ -0,0 +1,67 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fix-space-demo.png)
+
+The script arranges the selected elements horizontally with a fixed spacing.
+
+When we create an architecture diagram or mind map, we often need to arrange a large number of elements in a fixed spacing. `Fixed spacing` and `Fixed vertical Distance` scripts can save us a lot of time.
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default spacing"]) {
+	settings = {
+	  "Prompt for spacing?": true,
+	  "Default spacing" : {
+		value: 10,
+		description: "Fixed horizontal spacing between elements"
+	  },
+	  "Remember last spacing?": false
+	};
+	ea.setScriptSettings(settings);
+}
+
+let spacingStr = settings["Default spacing"].value.toString();
+const rememberLastSpacing = settings["Remember last spacing?"];
+
+if(settings["Prompt for spacing?"]) {
+    spacingStr = await utils.inputPrompt("spacing?","number",spacingStr);
+}
+
+const spacing = parseInt(spacingStr);
+if(isNaN(spacing)) {
+  return;
+}
+if(rememberLastSpacing) {
+	settings["Default spacing"].value = spacing;
+	ea.setScriptSettings(settings);
+}
+const elements=ea.getViewSelectedElements();
+const topGroups = ea.getMaximumGroups(elements)
+    .filter(els => !(els.length === 1 && els[0].type ==="arrow")); // ignore individual arrows
+const groups = topGroups.sort((lha,rha) => lha[0].x - rha[0].x);
+
+for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const preGroup = groups[i-1];
+        const curGroup = groups[i];
+
+        const preRight = Math.max(...preGroup.map(el => el.x + el.width));
+        const curLeft = Math.min(...curGroup.map(el => el.x));
+        const distance = curLeft -  preRight - spacing;
+
+        for(const curEl of curGroup) {
+            curEl.x = curEl.x - distance;
+        }
+    }
+}
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);

ea-scripts/Fixed vertical distance between centers.md

@@ -0,0 +1,74 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-vertical-distance-between-centers.png)
+
+This script arranges the selected elements vertically with a fixed center spacing.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default distance"]) {
+	settings = {
+	  "Prompt for distance?": true,
+	  "Default distance" : {
+		value: 10,
+		description: "Fixed vertical distance between centers"
+	  },
+	  "Remember last distance?": false
+	};
+	ea.setScriptSettings(settings);
+}
+
+let distanceStr = settings["Default distance"].value.toString();
+const rememberLastDistance = settings["Remember last distance?"];
+
+if(settings["Prompt for distance?"]) {
+    distanceStr = await utils.inputPrompt("distance?","number",distanceStr);
+}
+
+const distance = parseInt(distanceStr);
+if(isNaN(distance)) {
+  return;
+}
+if(rememberLastDistance) {
+	settings["Default distance"].value = distance;
+	ea.setScriptSettings(settings);
+}
+const elements=ea.getViewSelectedElements(); 
+const topGroups = ea.getMaximumGroups(elements)
+    .filter(els => !(els.length === 1 && els[0].type ==="arrow")); // ignore individual arrows
+const groups = topGroups.sort((lha,rha) => lha[0].y - rha[0].y);
+
+for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const preGroup = groups[i-1];
+        const curGroup = groups[i];
+
+        const preTop = Math.min(...preGroup.map(el => el.y));
+        const preBottom = Math.max(...preGroup.map(el => el.y + el.height));
+        const preCenter = preTop + (preBottom - preTop) / 2;
+        const curTop = Math.min(...curGroup.map(el => el.y));
+        const curBottom = Math.max(...curGroup.map(el => el.y + el.height));
+        const curCenter = curTop + (curBottom - curTop) / 2;
+        const distanceBetweenCenters = curCenter - preCenter - distance;
+
+        for(const curEl of curGroup) {
+            curEl.y = curEl.y - distanceBetweenCenters;
+        }
+    }
+}
+
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);

ea-scripts/Fixed vertical distance.md

@@ -0,0 +1,67 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-vertical-distance.png)
+
+The script arranges the selected elements vertically with a fixed spacing.
+
+When we create an architecture diagram or mind map, we often need to arrange a large number of elements in a fixed spacing. `Fixed spacing` and `Fixed vertical Distance` scripts can save us a lot of time.
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default spacing"]) {
+	settings = {
+	  "Prompt for spacing?": true,
+	  "Default spacing" : {
+		value: 10,
+		description: "Fixed vertical spacing between elements"
+	  },
+	  "Remember last spacing?": false
+	};
+	ea.setScriptSettings(settings);
+}
+
+let spacingStr = settings["Default spacing"].value.toString();
+const rememberLastSpacing = settings["Remember last spacing?"];
+
+if(settings["Prompt for spacing?"]) {
+    spacingStr = await utils.inputPrompt("spacing?","number",spacingStr);
+}
+
+const spacing = parseInt(spacingStr);
+if(isNaN(spacing)) {
+  return;
+}
+if(rememberLastSpacing) {
+	settings["Default spacing"].value = spacing;
+	ea.setScriptSettings(settings);
+}
+const elements=ea.getViewSelectedElements(); 
+const topGroups = ea.getMaximumGroups(elements)
+    .filter(els => !(els.length === 1 && els[0].type ==="arrow")); // ignore individual arrows
+const groups = topGroups.sort((lha,rha) => lha[0].y - rha[0].y);
+
+for(var i=0; i<groups.length; i++) {
+    if(i > 0) {
+        const preGroup = groups[i-1];
+        const curGroup = groups[i];
+
+        const preBottom = Math.max(...preGroup.map(el => el.y + el.height));
+        const curTop = Math.min(...curGroup.map(el => el.y));
+        const distance = curTop -  preBottom - spacing;
+
+        for(const curEl of curGroup) {
+            curEl.y = curEl.y - distance;
+        }
+    }
+}
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView(false, false);

ea-scripts/Lighten background color.md

@@ -0,0 +1,289 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/darken-lighten-background-color.png)
+
+This script lightens the background color of the selected element by 2% at a time. 
+
+You can use this script several times until you are satisfied. It is recommended to set a shortcut key for this script so that you can quickly try to DARKEN and LIGHTEN the color effect.
+
+In contrast to the `Modify background color opacity` script, the advantage is that the background color of the element is not affected by the canvas color, and the color value does not appear in a strange rgba() form.
+
+The color conversion method was copied from [color-convert](https://github.com/Qix-/color-convert).
+
+```javascript
+*/
+
+const elements = ea
+  .getViewSelectedElements()
+  .filter((el) =>
+    ["rectangle", "ellipse", "diamond", "image", "line"].includes(el.type)
+  );
+ea.copyViewElementsToEAforEditing(elements);
+for (const el of ea.getElements()) {
+  const color = colorNameToHex(el.backgroundColor);
+  const rgbColor = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(color);
+  if (rgbColor) {
+    const r = parseInt(rgbColor[1], 16);
+    const g = parseInt(rgbColor[2], 16);
+    const b = parseInt(rgbColor[3], 16);
+    const originalRgb = [r, g, b];
+    const hsl = rgbToHsl(originalRgb);
+    const step = 2;
+    const newLightness = hsl[2] + step;
+    if (newLightness < 100) {
+      hsl[2] = newLightness;
+    }
+    const newRgb = hslToRgb(hsl);
+    el.backgroundColor = "#" + rgbToHexString(newRgb);
+  }
+}
+ea.addElementsToView(false, false);
+
+function rgbToHexString(args) {
+  const integer =
+    ((Math.round(args[0]) & 0xff) << 16) +
+    ((Math.round(args[1]) & 0xff) << 8) +
+    (Math.round(args[2]) & 0xff);
+
+  const string = integer.toString(16).toUpperCase();
+  return "000000".substring(string.length) + string;
+}
+
+function hslToRgb(hsl) {
+  const h = hsl[0] / 360;
+  const s = hsl[1] / 100;
+  const l = hsl[2] / 100;
+  let t2;
+  let t3;
+  let val;
+
+  if (s === 0) {
+    val = l * 255;
+    return [val, val, val];
+  }
+
+  if (l < 0.5) {
+    t2 = l * (1 + s);
+  } else {
+    t2 = l + s - l * s;
+  }
+
+  const t1 = 2 * l - t2;
+
+  const rgb = [0, 0, 0];
+  for (let i = 0; i < 3; i++) {
+    t3 = h + (1 / 3) * -(i - 1);
+    if (t3 < 0) {
+      t3++;
+    }
+
+    if (t3 > 1) {
+      t3--;
+    }
+
+    if (6 * t3 < 1) {
+      val = t1 + (t2 - t1) * 6 * t3;
+    } else if (2 * t3 < 1) {
+      val = t2;
+    } else if (3 * t3 < 2) {
+      val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
+    } else {
+      val = t1;
+    }
+
+    rgb[i] = val * 255;
+  }
+
+  return rgb;
+}
+
+function rgbToHsl(rgb) {
+  const r = rgb[0] / 255;
+  const g = rgb[1] / 255;
+  const b = rgb[2] / 255;
+  const min = Math.min(r, g, b);
+  const max = Math.max(r, g, b);
+  const delta = max - min;
+  let h;
+  let s;
+
+  if (max === min) {
+    h = 0;
+  } else if (r === max) {
+    h = (g - b) / delta;
+  } else if (g === max) {
+    h = 2 + (b - r) / delta;
+  } else if (b === max) {
+    h = 4 + (r - g) / delta;
+  }
+
+  h = Math.min(h * 60, 360);
+
+  if (h < 0) {
+    h += 360;
+  }
+
+  const l = (min + max) / 2;
+
+  if (max === min) {
+    s = 0;
+  } else if (l <= 0.5) {
+    s = delta / (max + min);
+  } else {
+    s = delta / (2 - max - min);
+  }
+
+  return [h, s * 100, l * 100];
+}
+
+function colorNameToHex(color) {
+  const colors = {
+    aliceblue: "#f0f8ff",
+    antiquewhite: "#faebd7",
+    aqua: "#00ffff",
+    aquamarine: "#7fffd4",
+    azure: "#f0ffff",
+    beige: "#f5f5dc",
+    bisque: "#ffe4c4",
+    black: "#000000",
+    blanchedalmond: "#ffebcd",
+    blue: "#0000ff",
+    blueviolet: "#8a2be2",
+    brown: "#a52a2a",
+    burlywood: "#deb887",
+    cadetblue: "#5f9ea0",
+    chartreuse: "#7fff00",
+    chocolate: "#d2691e",
+    coral: "#ff7f50",
+    cornflowerblue: "#6495ed",
+    cornsilk: "#fff8dc",
+    crimson: "#dc143c",
+    cyan: "#00ffff",
+    darkblue: "#00008b",
+    darkcyan: "#008b8b",
+    darkgoldenrod: "#b8860b",
+    darkgray: "#a9a9a9",
+    darkgreen: "#006400",
+    darkkhaki: "#bdb76b",
+    darkmagenta: "#8b008b",
+    darkolivegreen: "#556b2f",
+    darkorange: "#ff8c00",
+    darkorchid: "#9932cc",
+    darkred: "#8b0000",
+    darksalmon: "#e9967a",
+    darkseagreen: "#8fbc8f",
+    darkslateblue: "#483d8b",
+    darkslategray: "#2f4f4f",
+    darkturquoise: "#00ced1",
+    darkviolet: "#9400d3",
+    deeppink: "#ff1493",
+    deepskyblue: "#00bfff",
+    dimgray: "#696969",
+    dodgerblue: "#1e90ff",
+    firebrick: "#b22222",
+    floralwhite: "#fffaf0",
+    forestgreen: "#228b22",
+    fuchsia: "#ff00ff",
+    gainsboro: "#dcdcdc",
+    ghostwhite: "#f8f8ff",
+    gold: "#ffd700",
+    goldenrod: "#daa520",
+    gray: "#808080",
+    green: "#008000",
+    greenyellow: "#adff2f",
+    honeydew: "#f0fff0",
+    hotpink: "#ff69b4",
+    "indianred ": "#cd5c5c",
+    indigo: "#4b0082",
+    ivory: "#fffff0",
+    khaki: "#f0e68c",
+    lavender: "#e6e6fa",
+    lavenderblush: "#fff0f5",
+    lawngreen: "#7cfc00",
+    lemonchiffon: "#fffacd",
+    lightblue: "#add8e6",
+    lightcoral: "#f08080",
+    lightcyan: "#e0ffff",
+    lightgoldenrodyellow: "#fafad2",
+    lightgrey: "#d3d3d3",
+    lightgreen: "#90ee90",
+    lightpink: "#ffb6c1",
+    lightsalmon: "#ffa07a",
+    lightseagreen: "#20b2aa",
+    lightskyblue: "#87cefa",
+    lightslategray: "#778899",
+    lightsteelblue: "#b0c4de",
+    lightyellow: "#ffffe0",
+    lime: "#00ff00",
+    limegreen: "#32cd32",
+    linen: "#faf0e6",
+    magenta: "#ff00ff",
+    maroon: "#800000",
+    mediumaquamarine: "#66cdaa",
+    mediumblue: "#0000cd",
+    mediumorchid: "#ba55d3",
+    mediumpurple: "#9370d8",
+    mediumseagreen: "#3cb371",
+    mediumslateblue: "#7b68ee",
+    mediumspringgreen: "#00fa9a",
+    mediumturquoise: "#48d1cc",
+    mediumvioletred: "#c71585",
+    midnightblue: "#191970",
+    mintcream: "#f5fffa",
+    mistyrose: "#ffe4e1",
+    moccasin: "#ffe4b5",
+    navajowhite: "#ffdead",
+    navy: "#000080",
+    oldlace: "#fdf5e6",
+    olive: "#808000",
+    olivedrab: "#6b8e23",
+    orange: "#ffa500",
+    orangered: "#ff4500",
+    orchid: "#da70d6",
+    palegoldenrod: "#eee8aa",
+    palegreen: "#98fb98",
+    paleturquoise: "#afeeee",
+    palevioletred: "#d87093",
+    papayawhip: "#ffefd5",
+    peachpuff: "#ffdab9",
+    peru: "#cd853f",
+    pink: "#ffc0cb",
+    plum: "#dda0dd",
+    powderblue: "#b0e0e6",
+    purple: "#800080",
+    rebeccapurple: "#663399",
+    red: "#ff0000",
+    rosybrown: "#bc8f8f",
+    royalblue: "#4169e1",
+    saddlebrown: "#8b4513",
+    salmon: "#fa8072",
+    sandybrown: "#f4a460",
+    seagreen: "#2e8b57",
+    seashell: "#fff5ee",
+    sienna: "#a0522d",
+    silver: "#c0c0c0",
+    skyblue: "#87ceeb",
+    slateblue: "#6a5acd",
+    slategray: "#708090",
+    snow: "#fffafa",
+    springgreen: "#00ff7f",
+    steelblue: "#4682b4",
+    tan: "#d2b48c",
+    teal: "#008080",
+    thistle: "#d8bfd8",
+    tomato: "#ff6347",
+    turquoise: "#40e0d0",
+    violet: "#ee82ee",
+    wheat: "#f5deb3",
+    white: "#ffffff",
+    whitesmoke: "#f5f5f5",
+    yellow: "#ffff00",
+    yellowgreen: "#9acd32",
+  };
+  if (typeof colors[color.toLowerCase()] != "undefined")
+    return colors[color.toLowerCase()];
+  return color;
+}

ea-scripts/Modify background color opacity.md

@@ -0,0 +1,216 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-modify-background-color-opacity.png)
+
+This script changes the opacity of the background color of the selected boxes.
+
+The default background color in Excalidraw is so dark that the text is hard to read. You can lighten the color a bit by setting transparency. And you can tweak the transparency over and over again until you're happy with it.
+
+Although excalidraw has the opacity option in its native property Settings, it also changes the transparency of the border. Use this script to change only the opacity of the background color without affecting the border.
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.21")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Default opacity"]) {
+	settings = {
+	  "Prompt for opacity?": true,
+	  "Default opacity" : {
+		value: 0.6,
+		description: "Element's background color transparency"
+	  },
+	  "Remember last opacity?": false
+	};
+	ea.setScriptSettings(settings);
+}
+
+let opacityStr = settings["Default opacity"].value.toString();
+const rememberLastOpacity = settings["Remember last opacity?"];
+
+if(settings["Prompt for opacity?"]) {
+    opacityStr = await utils.inputPrompt("Background color opacity?","number",opacityStr);
+}
+
+const alpha = parseFloat(opacityStr);
+if(isNaN(alpha)) {
+  return;
+}
+if(rememberLastOpacity) {
+	settings["Default opacity"].value = alpha;
+	ea.setScriptSettings(settings);
+}
+const elements=ea.getViewSelectedElements().filter((el)=>["rectangle","ellipse","diamond","line","image"].includes(el.type));
+ea.copyViewElementsToEAforEditing(elements);
+ea.getElements().forEach((el)=>{
+	const color = colorNameToHex(el.backgroundColor);
+    const rgbColor = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(color);
+    if(rgbColor) {
+        const r = parseInt(rgbColor[1], 16);
+        const g = parseInt(rgbColor[2], 16);
+        const b = parseInt(rgbColor[3], 16);
+        el.backgroundColor=`rgba(${r},${g},${b},${alpha})`;
+    }
+    else {
+        const rgbaColor = /^rgba\((\d+,\d+,\d+,)(\d*\.?\d*)\)$/i.exec(color);
+        if(rgbaColor) {
+            el.backgroundColor=`rgba(${rgbaColor[1]}${alpha})`;
+        }
+    }
+});
+ea.addElementsToView(false, false);
+
+function colorNameToHex(color) {
+  const colors = {
+    "aliceblue":"#f0f8ff",
+    "antiquewhite":"#faebd7",
+    "aqua":"#00ffff",
+    "aquamarine":"#7fffd4",
+    "azure":"#f0ffff",
+    "beige":"#f5f5dc",
+    "bisque":"#ffe4c4",
+    "black":"#000000",
+    "blanchedalmond":"#ffebcd",
+    "blue":"#0000ff",
+    "blueviolet":"#8a2be2",
+    "brown":"#a52a2a",
+    "burlywood":"#deb887",
+    "cadetblue":"#5f9ea0",
+    "chartreuse":"#7fff00",
+    "chocolate":"#d2691e",
+    "coral":"#ff7f50",
+    "cornflowerblue":"#6495ed",
+    "cornsilk":"#fff8dc",
+    "crimson":"#dc143c",
+    "cyan":"#00ffff",
+    "darkblue":"#00008b",
+    "darkcyan":"#008b8b",
+    "darkgoldenrod":"#b8860b",
+    "darkgray":"#a9a9a9",
+    "darkgreen":"#006400",
+    "darkkhaki":"#bdb76b",
+    "darkmagenta":"#8b008b",
+    "darkolivegreen":"#556b2f",
+    "darkorange":"#ff8c00",
+    "darkorchid":"#9932cc",
+    "darkred":"#8b0000",
+    "darksalmon":"#e9967a",
+    "darkseagreen":"#8fbc8f",
+    "darkslateblue":"#483d8b",
+    "darkslategray":"#2f4f4f",
+    "darkturquoise":"#00ced1",
+    "darkviolet":"#9400d3",
+    "deeppink":"#ff1493",
+    "deepskyblue":"#00bfff",
+    "dimgray":"#696969",
+    "dodgerblue":"#1e90ff",
+    "firebrick":"#b22222",
+    "floralwhite":"#fffaf0",
+    "forestgreen":"#228b22",
+    "fuchsia":"#ff00ff",
+    "gainsboro":"#dcdcdc",
+    "ghostwhite":"#f8f8ff",
+    "gold":"#ffd700",
+    "goldenrod":"#daa520",
+    "gray":"#808080",
+    "green":"#008000",
+    "greenyellow":"#adff2f",
+    "honeydew":"#f0fff0",
+    "hotpink":"#ff69b4",
+    "indianred ":"#cd5c5c",
+    "indigo":"#4b0082",
+    "ivory":"#fffff0",
+    "khaki":"#f0e68c",
+    "lavender":"#e6e6fa",
+    "lavenderblush":"#fff0f5",
+    "lawngreen":"#7cfc00",
+    "lemonchiffon":"#fffacd",
+    "lightblue":"#add8e6",
+    "lightcoral":"#f08080",
+    "lightcyan":"#e0ffff",
+    "lightgoldenrodyellow":"#fafad2",
+    "lightgrey":"#d3d3d3",
+    "lightgreen":"#90ee90",
+    "lightpink":"#ffb6c1",
+    "lightsalmon":"#ffa07a",
+    "lightseagreen":"#20b2aa",
+    "lightskyblue":"#87cefa",
+    "lightslategray":"#778899",
+    "lightsteelblue":"#b0c4de",
+    "lightyellow":"#ffffe0",
+    "lime":"#00ff00",
+    "limegreen":"#32cd32",
+    "linen":"#faf0e6",
+    "magenta":"#ff00ff",
+    "maroon":"#800000",
+    "mediumaquamarine":"#66cdaa",
+    "mediumblue":"#0000cd",
+    "mediumorchid":"#ba55d3",
+    "mediumpurple":"#9370d8",
+    "mediumseagreen":"#3cb371",
+    "mediumslateblue":"#7b68ee",
+    "mediumspringgreen":"#00fa9a",
+    "mediumturquoise":"#48d1cc",
+    "mediumvioletred":"#c71585",
+    "midnightblue":"#191970",
+    "mintcream":"#f5fffa",
+    "mistyrose":"#ffe4e1",
+    "moccasin":"#ffe4b5",
+    "navajowhite":"#ffdead",
+    "navy":"#000080",
+    "oldlace":"#fdf5e6",
+    "olive":"#808000",
+    "olivedrab":"#6b8e23",
+    "orange":"#ffa500",
+    "orangered":"#ff4500",
+    "orchid":"#da70d6",
+    "palegoldenrod":"#eee8aa",
+    "palegreen":"#98fb98",
+    "paleturquoise":"#afeeee",
+    "palevioletred":"#d87093",
+    "papayawhip":"#ffefd5",
+    "peachpuff":"#ffdab9",
+    "peru":"#cd853f",
+    "pink":"#ffc0cb",
+    "plum":"#dda0dd",
+    "powderblue":"#b0e0e6",
+    "purple":"#800080",
+    "rebeccapurple":"#663399",
+    "red":"#ff0000",
+    "rosybrown":"#bc8f8f",
+    "royalblue":"#4169e1",
+    "saddlebrown":"#8b4513",
+    "salmon":"#fa8072",
+    "sandybrown":"#f4a460",
+    "seagreen":"#2e8b57",
+    "seashell":"#fff5ee",
+    "sienna":"#a0522d",
+    "silver":"#c0c0c0",
+    "skyblue":"#87ceeb",
+    "slateblue":"#6a5acd",
+    "slategray":"#708090",
+    "snow":"#fffafa",
+    "springgreen":"#00ff7f",
+    "steelblue":"#4682b4",
+    "tan":"#d2b48c",
+    "teal":"#008080",
+    "thistle":"#d8bfd8",
+    "tomato":"#ff6347",
+    "turquoise":"#40e0d0",
+    "violet":"#ee82ee",
+    "wheat":"#f5deb3",
+    "white":"#ffffff",
+    "whitesmoke":"#f5f5f5",
+    "yellow":"#ffff00",
+    "yellowgreen":"#9acd32"
+  };
+  if (typeof colors[color.toLowerCase()] != 'undefined')
+    return colors[color.toLowerCase()];
+  return color;
+}

ea-scripts/Normalize Selected Arrows.md

@@ -0,0 +1,74 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-normalize-selected-arrows.png)
+
+This script will reset the start and end positions of the selected arrows. The arrow will point to the center of the connected box and will have a gap of 8px from the box.
+
+Tips: If you are drawing a flowchart, you can use `Normalize Selected Arrows` script to correct the position of the start and end points of the arrows, then use `Elbow connectors` script, and you will get the perfect connecting line!
+
+```javascript
+*/
+const selectedIndividualArrows = ea.getMaximumGroups(ea.getViewSelectedElements())
+	.reduce((result, group) => (group.length === 1 && (group[0].type === 'arrow' || group[0].type === 'line')) ? 
+			[...result, group[0]] : result, []);
+
+const allElements = ea.getViewElements();
+for(const arrow of selectedIndividualArrows) {
+	const startBindingEl = allElements.filter(el => el.id === (arrow.startBinding||{}).elementId)[0];
+	const endBindingEl = allElements.filter(el => el.id === (arrow.endBinding||{}).elementId)[0];
+
+	if(startBindingEl) {
+		recalculateStartPointOfLine(arrow, startBindingEl, endBindingEl);
+	}
+	if(endBindingEl) {
+		recalculateEndPointOfLine(arrow, endBindingEl, startBindingEl);
+	}
+}
+
+ea.copyViewElementsToEAforEditing(selectedIndividualArrows);
+ea.addElementsToView();
+
+function recalculateStartPointOfLine(line, el, elB) {
+	const aX = el.x + el.width/2;
+    const bX = (line.points.length <=2 && elB) ? elB.x + elB.width/2 : line.x + line.points[1][0];
+    const aY = el.y + el.height/2;
+    const bY = (line.points.length <=2 && elB) ? elB.y + elB.height/2 : line.y + line.points[1][1];
+
+	line.startBinding.gap = 8;
+	line.startBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.startBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+		line.points[0] = [0, 0];
+		for(var i = 1; i<line.points.length; i++) {
+			line.points[i][0] -= intersectA[0][0] - line.x;
+			line.points[i][1] -= intersectA[0][1] - line.y;
+		}
+		line.x = intersectA[0][0];
+		line.y = intersectA[0][1];
+	}
+}
+
+function recalculateEndPointOfLine(line, el, elB) {
+	const aX = el.x + el.width/2;
+    const bX = (line.points.length <=2 && elB) ? elB.x + elB.width/2 : line.x + line.points[line.points.length-2][0];
+    const aY = el.y + el.height/2;
+    const bY = (line.points.length <=2 && elB) ? elB.y + elB.height/2 : line.y + line.points[line.points.length-2][1];
+
+	line.endBinding.gap = 8;
+	line.endBinding.focus = 0;
+	const intersectA = ea.intersectElementWithLine(
+            	el,
+				[bX, bY],
+            	[aX, aY],
+            	line.endBinding.gap
+          	);
+
+    if(intersectA.length > 0) {
+    	line.points[line.points.length - 1] = [intersectA[0][0] - line.x, intersectA[0][1] - line.y];
+	}
+}

ea-scripts/OCR - Optical Character Recognition.md

@@ -0,0 +1,120 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-ocr.jpg)
+
+THIS SCRIPT REQUIRES EXCALIDRAW 1.5.15
+
+The script will 
+  1) send the selected image file to [taskbone.com](https://taskbone.com) to exctract the text from the image, and
+  2) will add the text to your drawing as a text element
+
+I recommend also installing the [Transfer TextElements to Excalidraw markdown metadata](Transfer%20TextElements%20to%20Excalidraw%20markdown%20metadata.md) script as well.
+
+The script is based on [@schlundd](https://github.com/schlundd)'s [Obsidian-OCR-Plugin](https://github.com/schlundd/obsidian-ocr-plugin)
+
+See ScriptEngine documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.24")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+let token = ea.getScriptSettings().token?.value??ea.getScriptSettings().token; 
+const BASE_URL = "https://ocr.taskbone.com";
+
+//convert setting to 1.5.21 format
+if(token && !ea.getScriptSettings().token.value) {
+  ea.setScriptSettings({token: {value: token, hidden: true}});
+}
+
+//get new token if token was not provided
+if (!token) {
+  const tokenResponse = await fetch(
+	BASE_URL + "/get-new-token", {
+	  method: 'post'
+  });
+  if (tokenResponse.status === 200) {
+    jsonResponse = await tokenResponse.json();
+	token = jsonResponse.token;
+	ea.setScriptSettings({token: {value: token, hidden: true}});
+  } else {
+	notice(`Taskbone OCR Error: ${tokenResponse.status}\nPlease try again later.`);
+	return;
+  }
+}
+
+//get image element
+//if multiple image elements were selected prompt user to choose
+const imageElements = ea.getViewSelectedElements().filter((el)=>el.type==="image");
+
+//need to save the view to ensure recently pasted images are saved as files
+await ea.targetView.save(); 
+
+let selectedImageElement = null;
+switch (imageElements.length) {
+  case 0: 
+    return;
+  case 1: 
+    selectedImageElement = imageElements[0];
+    break;
+  default:
+	const files = imageElements.map((el)=>ea.getViewFileForImageElement(el));
+	selectedImageElement = await utils.suggester(files.map((f)=>f.name),imageElements);
+    break;
+}
+
+if(!selectedImageElement) {
+  notice("No image element was selected");
+  return;
+}
+const imageFile = ea.getViewFileForImageElement(selectedImageElement);
+if(!imageFile) {
+  notice("Can read image file");
+  return;
+}
+
+//Execute the OCR
+let text = null;
+const fileBuffer = await app.vault.readBinary(imageFile);
+const formData = new FormData();
+formData.append("image", new Blob([fileBuffer]))
+try {
+  const response = await fetch(
+	BASE_URL + "/get-text", { 
+	  headers: {
+		Authorization: "Bearer " + token
+	  },
+	  method: "post",
+	  body: formData
+	});
+  if (response.status == 200) {
+	jsonResponse = await response.json();
+	text = jsonResponse?.text;
+	} else {
+	  notice(`Could not read Text from ${file.path}:\n Error: ${response.status}`);
+	  return;
+	}
+} catch (error) {
+  notice(`The OCR service seems unavailable right now. Please try again later.`);
+  return;
+}
+
+if(!text) {
+  notice("No text found");
+  return;
+}
+console.log({text});
+
+//add text element to drawing
+const id = ea.addText(selectedImageElement.x,selectedImageElement.y+selectedImageElement.height,text);
+await ea.addElementsToView();
+ea.selectElementsInView([ea.getElement(id)]);
+ea.getExcalidrawAPI().zoomToFit(ea.getViewSelectedElements(),1);
+
+//utility function
+function notice(message) {
+  new Notice(message,10000);
+  console.log(message);
+}

ea-scripts/README.md

@@ -0,0 +1,57 @@
+# Excalidraw Script Engine scripts library
+Click to watch the intro video:
+
+[![Script Engine](https://user-images.githubusercontent.com/14358394/145684531-8d9c2992-59ac-4ebc-804a-4cce1777ded2.jpg)](https://youtu.be/hePJcObHIso)
+
+See the [Excalidraw Script Engine](https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html) documentation for more details.
+
+## How to install scripts into your Obsidian Vault
+Open the script you are interested in and save it to your Obsidian Vault including the first line `/*`, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+
+## List of available scripts
+|Title|Description|Icon|Contributor|
+|----|----|----|----|
+|[Add Connector Point](Add%20Connector%20Point.md)|This script will add a small circle to the top left of each text element in the selection and add the text and the "bullet point" into a group.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-bullet-point.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Add Link to Existing File and Open](Add%20Link%20to%20Existing%20File%20and%20Open.md)|Prompts for a file from the vault. Adds a link to the selected element pointing to the selected file. You can control in settings to open the file in the current active pane or an adjacent pane.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-link-and-open.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Add Link to New Page and Open](Add%20Link%20and%20Open%20Page.md)|Prompts for filename. Offers option to create and open a new Markdown or Excalidraw document. Adds link pointing to the new file, to the selected objects in the drawing. You can control in settings to open the file in the current active pane or an adjacent pane.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-link-to-new-page-and-pen.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Add Next Step in Process](Add%20Link%20to%20New%20Page%20and%20Open.md)|This script will prompt you for the title of the process step, then will create a stick note with the text. If an element is selected then the script will connect this new step with an arrow to the previous step (the selected element). If no element is selected, then the script assumes this is the first step in the process and will only output the sticky note with the text that was entered.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-process-step.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Box Each Selected Groups](Box%20Each%20Selected%20Groups.md)|This script will add encapsulating boxes around each of the currently selected groups in Excalidraw.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-box-each-selected-groups.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Box Selected Elements](Box%20Selected%20Elements.md)|This script will add an encapsulating box around the currently selected elements in Excalidraw.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-box-elements.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Change shape of selected elements](Change%20shape%20of%20selected%20elements.md)|The script allows you to change the shape of selected Rectangles, Diamonds and Ellipses|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-change-shape.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Connect elements](Connect%20elements.md)|This script will connect two objects with an arrow. If either of the objects are a set of grouped elements (e.g. a text element grouped with an encapsulating rectangle), the script will identify these groups, and connect the arrow to the largest object in the group (assuming you want to connect the arrow to the box around the text element).|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-connect-elements.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Convert freedraw to line](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Convert%20freedraw%20to%20line.md)|Convert selected freedraw objects into editable lines. This will allow you to adjust your drawings by dragging line points and will also allow you to select shape fill in case of enclosed lines. You can adjust conversion point density in settings|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-convert-freedraw-to-line.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Convert selected text elements to sticky notes](Convert%20selected%20text%20elements%20to%20sticky%20notes.md)|Converts selected plain text elements to sticky notes with transparent background and transparent stroke color. Essentially converts text element into a wrappable format.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-textelement-to-transparent-stickynote.png)|[@zsviczian](https://github.com/zsviczian)|
+|[Convert text to link with folder and alias](Convert%20text%20to%20link%20with%20folder%20and%20alias.md)|Converts text elements to links pointing to a file in a selected folder and with the alias set as the original text. The script will prompt the user to select an existing folder from the vault.|`original text` => `[[selected folder/original text\|original text]]`|[@zsviczian](https://github.com/zsviczian)|
+|[Copy Selected Element Styles to Global](Copy%20Selected%20Element%20Styles%20to%20Global)|This script will copy styles of any selected element into Excalidraw's global styles.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-copy-selected-element-styles-to-global.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Create new markdown file and embed into active drawing](Create%20new%20markdown%20file%20and%20embed%20into%20active%20drawing.md)|The script will prompt you for a filename, then create a new markdown document with the file name provided, open the new markdown document in an adjacent pane, and embed the markdown document into the active Excalidraw drawing.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-create-and-embed-new-markdown-file.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Darken background color](Darken%20background%20color.md)|This script darkens the background color of the selected element by 2% at a time. You can use this script several times until you are satisfied. It is recommended to set a shortcut key for this script so that you can quickly try to DARKEN and LIGHTEN the color effect. In contrast to the `Modify background color opacity` script, the advantage is that the background color of the element is not affected by the canvas color, and the color value does not appear in a strange rgba() form.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/darken-lighten-background-color.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Elbow connectors](Elbow%20connectors.md)|This script converts the selected connectors to elbows.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/elbow-connectors.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Expand rectangles horizontally keep text centered](Expand%20rectangles%20horizontally%20keep%20text20%centered.md)|This script expands the width of the selected rectangles until they are all the same width and keep the text centered.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)|[@1-2-3](https://github.com/1-2-3)|
+|[Expand rectangles horizontally](Expand%20rectangles%20horizontally.md)|This script expands the width of the selected rectangles until they are all the same width.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)|[@1-2-3](https://github.com/1-2-3)|
+|[Expand rectangles vertically keep text centered](Expand%20rectangles%20vertically%20keep%20text%20centered.md)|This script expands the height of the selected rectangles until they are all the same height and keep the text centered.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)|[@1-2-3](https://github.com/1-2-3)|
+|[Expand rectangles vertically](Expand%20rectangles%20vertically.md)|This script expands the height of the selected rectangles until they are all the same height.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif)|[@1-2-3](https://github.com/1-2-3)|
+|[Fixed horizontal distance between centers](Fixed%20horizontal%20distance%20between%20centers.md)|This script arranges the selected elements horizontally with a fixed center spacing.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-horizontal-distance-between-centers.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Fixed inner distance](Fixed%20inner%20distance.md)|This script arranges selected elements and groups with a fixed inner distance.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-inner-distance.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Fixed spacing](Fixed%20spacing.md)|The script arranges the selected elements horizontally with a fixed spacing. When we create an architecture diagram or mind map, we often need to arrange a large number of elements in a fixed spacing. `Fixed spacing` and `Fixed vertical Distance` scripts can save us a lot of time.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fix-space-demo.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Fixed vertical distance between centers](Fixed%20vertical%20distance%20between%20centers.md)|This script arranges the selected elements vertically with a fixed center spacing.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-vertical-distance-between-centers.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Fixed vertical distance](Fixed%20vertical%20distance.md)|The script arranges the selected elements vertically with a fixed spacing. When we create an architecture diagram or mind map, we often need to arrange a large number of elements in a fixed spacing. `Fixed spacing` and `Fixed vertical Distance` scripts can save us a lot of time.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-vertical-distance.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Lighten background color](Lighten%20background%20color.md)|This script lightens the background color of the selected element by 2% at a time. You can use this script several times until you are satisfied. It is recommended to set a shortcut key for this script so that you can quickly try to DARKEN and LIGHTEN the color effect.In contrast to the `Modify background color opacity` script, the advantage is that the background color of the element is not affected by the canvas color, and the color value does not appear in a strange rgba() form.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/darken-lighten-background-color.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Modify background color opacity](Modify%20background%20color%20opacity.md)|This script changes the opacity of the background color of the selected boxes. The default background color in Excalidraw is so dark that the text is hard to read. You can lighten the color a bit by setting transparency. And you can tweak the transparency over and over again until you're happy with it. Although excalidraw has the opacity option in its native property Settings, it also changes the transparency of the border. Use this script to change only the opacity of the background color without affecting the border.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-modify-background-color-opacity.png)|[@1-2-3](https://github.com/1-2-3)|
+|[Normalize Selected Arrows](Normalize%20Selected%20Arrows.md)|This script will reset the start and end positions of the selected arrows. The arrow will point to the center of the connected box and will have a gap of 8px from the box.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-normalize-selected-arrows.png)|[@1-2-3](https://github.com/1-2-3)|
+|[OCR - Optical Character Recognition](OCR%20-%20Optical%20Character%20Recognition.md)|The script will  1) send the selected image file to [taskbone.com](https://taskbone.com) to exctract the text from the image, and 2) will add the text to your drawing as a text element.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-ocr.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Reverse arrows](Reverse%20arrows.md)|Reverse the direction of **arrows** within the scope of selected elements.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-reverse-arrow.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Scribble Helper](Scribble%20Helper.md)|iOS scribble helper for better handwriting experience with text elements. If no elements are selected then the creates a text element at pointer position and you can use the edit box to modify the text with scribble. If a text element is selected then opens the input prompt where you can modify this text with scribble.|![]('https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-scribble-helper.jpg')|[@zsviczian](https://github.com/zsviczian)|
+|[Select Elements of Type](Select%20Elements%20of%20Type.md)|Prompts you with a list of the different element types in the active image. Only elements of the selected type will be selected on the canvas. If nothing is selected when running the script, then the script will process all the elements on the canvas. If some elements are selected when the script is executed, then the script will only process the selected elements.<br>The script is useful when, for example, you want to bring to front all the arrows, or want to change the color of all the text elements, etc.|![]('https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-select-element-of-type.jpg')|[@zsviczian](https://github.com/zsviczian)|
+|[Set background color of unclosed line object by adding a shadow clone](Set%20background%20color%20of%20unclosed%20line%20object%20by%20adding%20a%20shadow%20clone.md)|Use this script to set the background color of unclosed (i.e. open) line objects by creating a clone of the object. The script will set the stroke color of the clone to transparent and will add a straight line to close the object. Use settings to define the default background color, the fill style, and the strokeWidth of the clone. By default the clone will be grouped with the original object, you can disable this also in settings.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-dimensions.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Set Dimensions](Set%20Dimensions.md)|Currently there is no way to specify the exact location and size of objects in Excalidraw. You can bridge this gap with the following simple script.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-dimensions.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Set Font Family](Set%20Font%20Family.md)|Sets font family of the text block (Virgil, Helvetica, Cascadia). Useful if you want to set a keyboard shortcut for selecting font family.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-font-family.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Set Grid](Set%20Grid.md)|The default grid size in Excalidraw is 20. Currently there is no way to change the grid size via the user interface. This script offers a way to bridge this gap.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-grid.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Set Link Alias](Set20%Link20%Alias.md)|Iterates all of the links in the selected TextElements and prompts the user to set or modify the alias for each link found.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-set-link-alias.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Set stroke width of selected elements](Set%20Stroke%20Width%20of%20Selected%20Elements.md)|This script will set the stroke width of selected elements. This is helpful, for example, when you scale freedraw sketches and want to reduce or increase their line width.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-stroke-width.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Split text by lines](Split%20text%20by%20lines.md)|Split lines of text into separate text elements for easier reorganization|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-split-lines.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Set Text Alignment](Set%20Text%20Alignment.md)|Sets text alignment of text block (cetner, right, left). Useful if you want to set a keyboard shortcut for selecting text alignment.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-text-align.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Transfer TextElements to Excalidraw markdown metadata](Transfer%20TextElements%20to%20Excalidraw%20markdown%20metadata.md)|The script will delete the selected text elements from the canvas and will copy the text from these text elements into the Excalidraw markdown file as metadata. This means, that the text will no longer be visible in the drawing, however you will be able to search for the text in Obsidian and find the drawing containing this image.|![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-text-to-metadata.jpg)|[@zsviczian](https://github.com/zsviczian)|
+|[Zoom to Fit Selected Elements](Zoom%20to%20Fit%20Selected%20Elements.md)|Similar to Excalidraw standard SHIFT+2 feature: Zoom to fit selected elements, but with the ability to zoom to 1000%. Inspiration: [#272](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/272)||[@zsviczian](https://github.com/zsviczian)|

ea-scripts/Reverse arrows.md

@@ -0,0 +1,23 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-reverse-arrow.jpg)
+
+Reverse the direction of **arrows** within the scope of selected elements.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="arrow");
+if(!elements || elements.length===0) return;
+elements.forEach((el)=>{
+	const start = el.startArrowhead;
+	el.startArrowhead = el.endArrowhead;
+	el.endArrowhead = start;
+});
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();

ea-scripts/Scribble Helper.md

@@ -0,0 +1,29 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-scribble-helper.jpg)
+
+iOS scribble helper for better handwriting experience with text elements. If no elements are selected then the creates a text element at pointer position and you can use the edit box to modify the text with scribble. If a text element is selected then opens the input prompt where you can modify this text with scribble.
+
+```javascript
+*/
+
+
+elements = ea.getViewSelectedElements().filter(el=>el.type==="text");
+if(elements.length > 1) {
+  new Notice ("Select only 1 or 0 text elements.")
+  return;
+}
+
+const text = await utils.inputPrompt("Edit text","",(elements.length === 1)?elements[0].rawText:"");
+if(!text) return;
+
+if(elements.length === 1) {
+	ea.copyViewElementsToEAforEditing(elements);
+  ea.getElements()[0].originalText = text;
+  ea.getElements()[0].text = text;
+  ea.getElements()[0].rawText = text;
+  await ea.addElementsToView(false,true);
+  return;
+}
+
+ea.addText(0,0,text);
+await ea.addElementsToView(true, true, true);

ea-scripts/Select Elements of Type.md

@@ -0,0 +1,47 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-select-element-of-type.jpg)
+Prompts you with a list of the different element types in the active image. Only elements of the selected type will be selected on the canvas. If nothing is selected when running the script, then the script will process all the elements on the canvas. If some elements are selected when the script is executed, then the script will only process the selected elements.
+
+The script is useful when, for example, you want to bring to front all the arrows, or want to change the color of all the text elements, etc.
+
+```javascript
+*/
+
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.24")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+let elements = ea.getViewSelectedElements();
+if(elements.length === 0) elements = ea.getViewElements();
+if(elements.length === 0) {
+  new Notice("There are no elements in the view");
+  return;
+}
+
+typeSet = new Set();
+elements.forEach(el=>typeSet.add(el.type));
+let elementType = Array.from(typeSet)[0];
+		
+if(typeSet.size > 1) {
+	elementType = await utils.suggester(
+	  Array.from(typeSet).map((item) => { 
+		  switch(item) {
+				case "line": return "— line";
+				case "ellipse": return "○ ellipse";
+	      case "rectangle": return "□ rectangle";
+	      case "diamond": return "◇ diamond";
+	      case "arrow": return "→ arrow";
+	      case "freedraw": return "✎ freedraw";
+	      case "image": return "🖼 image";
+	      case "text": return "A text";
+	      default: return item;
+	    }
+		}),
+	  Array.from(typeSet)
+	);
+} 
+
+if(!elementType) return;
+
+ea.selectElementsInView(elements.filter(el=>el.type === elementType));

ea-scripts/Set Dimensions.md

@@ -0,0 +1,39 @@
+/*
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-dimensions.jpg)
+
+Currently there is no way to specify the exact location and size of objects in Excalidraw. You can bridge this gap with the following simple script. 
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+const elements = ea.getViewSelectedElements();
+if(elements.length === 0) return;
+const el = ea.getLargestElement(elements);
+const sizeIn = [
+  Math.round(el.x),
+  Math.round(el.y),
+  Math.round(el.width),
+  Math.round(el.height)
+].join(",");
+let res = await utils.inputPrompt("x,y,width,height?",null,sizeIn);
+res = res.split(",");
+if(res.length !== 4) return;
+let size = [];
+for (v of res) {
+  const i = parseInt(v);
+  if(isNaN(i)) return;
+  size.push(i);
+}
+el.x = size[0];
+el.y = size[1];
+el.width = size[2];
+el.height = size[3];
+ea.copyViewElementsToEAforEditing([el]);
+ea.addElementsToView();

ea-scripts/Set Font Family.md

@@ -0,0 +1,18 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-font-family.jpg)
+
+Sets font family of the text block (Virgil, Helvetica, Cascadia). Useful if you want to set a keyboard shortcut for selecting font family.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+if(elements.length===0) return;
+let font = ["Virgil","Helvetica","Cascadia"];
+font = parseInt(await utils.suggester(font,["1","2","3"]));
+if (isNaN(font)) return;
+elements.forEach((el)=>el.fontFamily = font);
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();

ea-scripts/Set Grid.md

@@ -0,0 +1,19 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-grid.jpg)
+
+The default grid size in Excalidraw is 20. Currently there is no way to change the grid size via the user interface. This script offers a way to bridge this gap.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+const grid = parseInt(await utils.inputPrompt("Grid size?",null,"20"));
+if(isNaN(grid)) return; //this is to avoid passing an illegal value to Excalidraw
+const api = ea.getExcalidrawAPI();
+let appState = api.getAppState();
+appState.gridSize = grid;
+api.updateScene({
+  appState,
+  commitToHistory:false
+});

ea-scripts/Set Link Alias.md

@@ -0,0 +1,53 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-set-link-alias.jpg)
+
+Iterates all of the links in the selected TextElements and prompts the user to set or modify the alias for each link found.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+// `[[markdown links]]`
+for(el of elements) { //doing for instead of .forEach due to await inputPrompt
+  parts = el.rawText.split(/(\[\[[\w\W]*?]])/);
+  newText = "";
+  for(t of parts) { //doing for instead of .map due to await inputPrompt
+	if(!t.match(/(\[\[[\w\W]*?]])/)) {
+	  newText += t;
+    } else {
+      original = t.split(/\[\[|]]/)[1];
+	  cut = original.indexOf("|");
+	  alias = cut === -1 ? "" : original.substring(cut+1);
+	  link = cut === -1 ? original : original.substring(0,cut);
+      alias = await utils.inputPrompt(`Alias for [[${link}]]`,"type alias here",alias);
+	  newText += `[[${link}|${alias}]]`;
+    }
+  }
+  el.rawText = newText;
+};
+
+// `[wiki](links)`
+for(el of elements) { //doing for instead of .forEach due to await inputPrompt
+  parts = el.rawText.split(/(\[[\w\W]*?]\([\w\W]*?\))/);
+  newText = "";
+  for(t of parts) { //doing for instead of .map due to await inputPrompt
+	if(!t.match(/(\[[\w\W]*?]\([\w\W]*?\))/)) {
+	  newText += t;
+    } else {
+	  alias = t.match(/\[([\w\W]*?)]/)[1];
+	  link = t.match(/\(([\w\W]*?)\)/)[1];
+      alias = await utils.inputPrompt(`Alias for [[${link}]]`,"type alias here",alias);
+	  newText += `[[${link}|${alias}]]`;
+    }
+  }
+  el.rawText = newText;
+};
+
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();

ea-scripts/Set Stroke Width of Selected Elements.md

@@ -0,0 +1,16 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-stroke-width.jpg)
+
+This script will set the stroke width of selected elements. This is helpful, for example, when you scale freedraw sketches and want to reduce or increase their line width.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+let width = (ea.getViewSelectedElement().strokeWidth??1).toString();
+width = await utils.inputPrompt("Width?","number",width);
+const elements=ea.getViewSelectedElements();
+ea.copyViewElementsToEAforEditing(elements);
+ea.getElements().forEach((el)=>el.strokeWidth=width);
+ea.addElementsToView();

ea-scripts/Set Text Alignment.md

@@ -0,0 +1,17 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-text-align.jpg)
+
+Sets text alignment of text block (cetner, right, left). Useful if you want to set a keyboard shortcut for selecting text alignment.
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+if(elements.length===0) return;
+let align = ["left","right","center"];
+align = await utils.suggester(align,align);
+elements.forEach((el)=>el.textAlign = align);
+ea.copyViewElementsToEAforEditing(elements);
+ea.addElementsToView();

ea-scripts/Set background color of unclosed line object by adding a shadow clone.md

@@ -0,0 +1,80 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-set-background-color-of-unclosed-line.jpg)
+
+Use this script to set the background color of unclosed (i.e. open) line objects by creating a clone of the object. The script will set the stroke color of the clone to transparent and will add a straight line to close the object. Use settings to define the default background color, the fill style, and the strokeWidth of the clone. By default the clone will be grouped with the original object, you can disable this also in settings.
+
+```javascript
+*/
+
+if(!ea.verifyMinimumPluginVersion || !ea.verifyMinimumPluginVersion("1.5.26")) {
+  new Notice("This script requires a newer version of Excalidraw. Please install the latest version.");
+  return;
+}
+
+settings = ea.getScriptSettings();
+//set default values on first run
+if(!settings["Background Color"]) {
+  settings = {
+    "Background Color" : {
+      value: "DimGray",
+      description: "Default background color of the 'shadow' object. Any valid html css color value",
+    },
+	  "Fill Style": {
+		  value: "hachure",
+			valueset: ["hachure","cross-hatch","solid"],
+			description: "Default fill style of the 'shadow' object."
+		},
+	  "Inherit fill stroke width": {
+		  value: true,
+			description: "This will impact the densness of the hachure or cross-hatch fill. Use the stroke width of the line object for which the shadow is created. If set to false, the script will use a stroke width of 2."
+		},
+		"Group 'shadow' with original": {
+		  value: true,
+			description: "If the toggle is on then the shadow object that is created will be grouped with the unclosed original object."
+		}
+  };
+  ea.setScriptSettings(settings);
+}
+
+const inheritStrokeWidth = settings["Inherit fill stroke width"].value;
+const backgroundColor = settings["Background Color"].value;
+const fillStyle = settings["Fill Style"].value;
+const shouldGroup = settings["Group 'shadow' with original"].value;
+
+const elements = ea.getViewSelectedElements().filter(el=>el.type==="line");
+if(elements.length === 0) {
+	new Notice("No line object is selected");
+}
+
+ea.copyViewElementsToEAforEditing(elements);
+elementsToMove = [];
+
+elements.forEach((el)=>{
+  const newEl = ea.cloneElement(el);
+  ea.elementsDict[newEl.id] = newEl;
+	newEl.roughness = 1;
+	if(!inheritStrokeWidth) newEl.strokeWidth = 2;
+  newEl.strokeColor = "transparent";
+  newEl.backgroundColor = backgroundColor;
+	newEl.fillStyle = fillStyle;
+	const i = el.points.length-1;
+	newEl.points.push([ 
+    //adding an extra point close to the last point in case distance is long from last point to origin and there is a sharp bend. This will avoid a spike due to a tight curve.
+		el.points[i][0]*0.9,
+    el.points[i][1]*0.9,
+	]);
+  newEl.points.push([0,0]);
+	if(shouldGroup) ea.addToGroup([el.id,newEl.id]);
+  elementsToMove.push({fillId: newEl.id, shapeId: el.id});
+});
+
+await ea.addElementsToView();
+elementsToMove.forEach((x)=>{
+  const viewElements = ea.getViewElements();
+  ea.moveViewElementToZIndex(
+		x.fillId,
+    viewElements.indexOf(viewElements.filter(el=>el.id === x.shapeId)[0])-1
+	)
+});
+
+ea.selectElementsInView(ea.getElements());

ea-scripts/Split text by lines.md

@@ -0,0 +1,27 @@
+/*
+## requires Excalidraw 1.5.1 or higher
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-split-lines.jpg)
+
+Split lines of text into separate text elements for easier reorganization
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+elements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+elements.forEach((el)=>{
+  ea.style.strokeColor = el.strokeColor;
+  ea.style.fontFamily  = el.fontFamily;
+  ea.style.fontSize    = el.fontSize;
+  const text = el.text.split("\n");
+  for(i=0;i<text.length;i++) {
+	ea.addText(el.x,el.y+i*el.height/text.length,text[i]);
+  }
+});
+ea.addElementsToView();
+ea.deleteViewElements(elements);

ea-scripts/Transfer TextElements to Excalidraw markdown metadata.md

@@ -0,0 +1,44 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-text-to-metadata.jpg)
+
+The script will delete the selected text elements from the canvas and will copy the text from these text elements into the Excalidraw markdown file as metadata. This means, that the text will no longer be visible in the drawing, however you will be able to search for the text in Obsidian and find the drawing containing this image.
+
+See ScriptEngine documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+//get text elements
+
+const textElements = ea.getViewSelectedElements().filter((el)=>el.type==="text");
+
+if(textElements.length===0) {
+  notice("No text elements were selected")
+  return;
+}
+
+metadata = "# Metadata\n" + textElements
+           .map((el)=>el.rawText.replaceAll(/%|\^/g,"_")) //cleaning these characters for safety, might not be needed
+           .join("/n") + "\n";
+
+ea.deleteViewElements(textElements);
+await ea.targetView.save();
+data = await app.vault.read(ea.targetView.file);
+splitAfterFrontmatter = data.split(/(^---[\w\W]*?---\n)/);
+if(splitAfterFrontmatter.length !== 3) {
+  notice("Error locating frontmatter in markdown file");
+  console.log({file:ea.targetView.file});
+  return;
+}
+newData = splitAfterFrontmatter[1]+metadata+splitAfterFrontmatter[2]
+await app.vault.modify(ea.targetView.file,newData);
+
+//utility function
+function notice(message) {
+  new Notice(message);
+  console.log(message);
+}

ea-scripts/Zoom to Fit Selected Elements.md

@@ -0,0 +1,15 @@
+/*
+![](https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-download-raw.jpg)
+
+Download this file and save to your Obsidian Vault including the first line, or open it in "Raw" and copy the entire contents to Obsidian.
+
+Similar to Excalidraw standard SHIFT+2 feature: Zoom to fit selected elements, but with the ability to zoom to 1000%. Inspiration: [#272](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/272)
+
+See documentation for more details:
+https://zsviczian.github.io/obsidian-excalidraw-plugin/ExcalidrawScriptsEngine.html
+
+```javascript
+*/
+elements = ea.getViewSelectedElements();
+api = ea.getExcalidrawAPI();
+api.zoomToFit(elements,10);

ea-scripts/index.md

@@ -0,0 +1,314 @@
+If you are enjoying the Excalidraw plugin then please support my work and enthusiasm by buying me a coffee on [https://ko-fi/zsolt](https://ko-fi.com/zsolt).
+
+[<img src="https://user-images.githubusercontent.com/14358394/115450238-f39e8100-a21b-11eb-89d0-fa4b82cdbce8.png" class="coffee">](https://ko-fi.com/zsolt) 
+
+---
+
+Jump ahead to the [[#List of available scripts]]
+
+# Intorducing Excalidraw Automate Script Engine
+<iframe width="560" height="315" src="https://www.youtube.com/embed/hePJcObHIso" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+
+Script Engine scripts are installed in the `Downloaded` subfolder of the `Excalidraw Automate script folder` specified in plugin settings.
+
+In the `Command Palette` installed scripts are prefixed with `Downloaded/`, thus you can always know if you are executing a local script of your own, or one that you have downloaded from GitHub.
+
+## Attention developers and hobby hackers
+<img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/hobby-programmer.svg' align='left' style='background-color:whitesmoke; width:80px; margin-right:15px; margin-bottom:10px;'/>
+If you want to modify scripts, I recommend moving them to the `Excalidraw Automate script folder` or a different subfolder under the script folder. Scripts in the `Downloaded` folder will be overwritten when you click the `Update this script` button. Note also, that at this time, I do not check if the script file has been updated on GitHub, thus the `Update this script` button is always visible once you have installed a script, not only when an update is availble (hope to build this feature in the future).
+
+I would love to include your contribution in the script library. If you have a script of your own that you would like to share with the community, please open a [PR](https://github.com/zsviczian/obsidian-excalidraw-plugin/pulls) on GitHub. Be sure to include the following in your pull request
+- The [script file](https://github.com/zsviczian/obsidian-excalidraw-plugin/tree/master/ea-scripts) with a self explanetory name. The name of the file will be the name of the script in the Command Palette.
+- An [image](https://github.com/zsviczian/obsidian-excalidraw-plugin/tree/master/images) explaining the scripts purpose. Remember a picture speaks thousand words!
+- An update to this file [ea-scripts/index.md](https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/index.md)
+
+---
+
+# List of available scripts
+- [[#Add Connector Point]]
+- [[#Add Link to Existing File and Open]]
+- [[#Add Link to New Page and Open]]
+- [[#Add Next Step in Process]]
+- [[#Box Each Selected Groups]]
+- [[#Box Selected Elements]]
+- [[#Change shape of selected elements]]
+- [[#Connect elements]]
+- [[#Convert freedraw to line]]
+- [[#Convert selected text elements to sticky notes]]
+- [[#Convert text to link with folder and alias]]
+- [[#Copy Selected Element Styles to Global]]
+- [[#Create new markdown file and embed into active drawing]]
+- [[#Darken background color]]
+- [[#Elbow connectors]]
+- [[#Expand rectangles horizontally keep text centered]]
+- [[#Expand rectangles horizontally]]
+- [[#Expand rectangles vertically keep text centered]]
+- [[#Expand rectangles vertically]]
+- [[#Fixed horizontal distance between centers]]
+- [[#Fixed inner distance]]
+- [[#Fixed spacing]]
+- [[#Fixed vertical distance between centers]]
+- [[#Fixed vertical distance]]
+- [[#Lighten background color]]
+- [[#Modify background color opacity]]
+- [[#Normalize Selected Arrows]]
+- [[#OCR - Optical Character Recognition]]
+- [[#Reverse arrows]]
+- [[#Scribble Helper]]
+- [[#Select Elements of Type]]
+- [[#Set background color of unclosed line object by adding a shadow clone]]
+- [[#Set Dimensions]]
+- [[#Set Font Family]]
+- [[#Set Grid]]
+- [[#Set Link Alias]]
+- [[#Set Stroke Width of Selected Elements]]
+- [[#Set Text Alignment]]
+- [[#Split text by lines]]
+- [[#Transfer TextElements to Excalidraw markdown metadata]]
+- [[#Zoom to Fit Selected Elements]]
+
+## Add Connector Point
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Add%20Connector%20Point.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Add%20Connector%20Point.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will add a small circle to the top left of each text element in the selection and add the text and the "connector point" to a group. You can use the connector points to link text elements with an arrow (in for example a Wardley Map).<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-bullet-point.jpg'></td></tr></table>
+
+## Add Link to Existing File and Open
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Add%20Link%20to%20Existing%20File%20and%20Open.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Add%20Link%20to%20Existing%20File%20and%20Open.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Prompts for a file from the vault. Adds a link to the selected element pointing to the selected file. You can control in settings to open the file in the current active pane or an adjacent pane.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-link-and-open.jpg'></td></tr></table>
+
+## Add Link to New Page and Open
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Add%20Link%20to%20New%20Page%20and%20Open.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Add%20Link%20to%20New%20Page%20and%20Open.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Prompts for filename. Offers option to create and open a new Markdown or Excalidraw document. Adds link pointing to the new file, to the selected objects in the drawing. You can control in settings to open the file in the current active pane or an adjacent pane.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-link-to-new-page-and-pen.jpg'></td></tr></table>
+
+## Add Next Step in Process
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Add%20Next%20Step%20in%20Process.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Add%20Next%20Step%20in%20Process.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will prompt you for the title of the process step, then will create a stick note with the text. If an element is selected then the script will connect this new step with an arrow to the previous step (the selected element). If no element is selected, then the script assumes this is the first step in the process and will only output the sticky note with the text that was entered.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-add-process-step.jpg'></td></tr></table>
+
+## Box Each Selected Groups
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Box%20Each%20Selected%20Groups.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Box%20Each%20Selected%20Groups.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will add encapsulating boxes around each of the currently selected groups in Excalidraw.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-box-each-selected-groups.png'></td></tr></table>
+
+## Box Selected Elements
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Box%20Selected%20Elements.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Box%20Selected%20Elements.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will add an encapsulating box around the currently selected elements in Excalidraw.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-box-elements.jpg'></td></tr></table>
+
+## Change shape of selected elements
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Change%20shape%20of%20selected%20elements.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Change%20shape%20of%20selected%20elements.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">The script allows you to change the shape of selected Rectangles, Diamonds and Ellipses.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-change-shape.jpg'></td></tr></table>
+
+## Connect elements
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Connect%20elements.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Connect%20elements.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will connect two objects with an arrow. If either of the objects are a set of grouped elements (e.g. a text element grouped with an encapsulating rectangle), the script will identify these groups, and connect the arrow to the largest object in the group (assuming you want to connect the arrow to the box around the text element).<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-connect-elements.jpg'></td></tr></table>
+
+## Convert freedraw to line
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Convert%20freedraw%20to%20line.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Convert%20freedraw%20to%20line.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Convert selected freedraw objects into editable lines. This will allow you to adjust your drawings by dragging line points and will also allow you to select shape fill in case of enclosed lines. You can adjust conversion point density in settings.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-convert-freedraw-to-line.jpg'></td></tr></table>
+
+## Convert selected text elements to sticky notes
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Convert%20selected%20text%20elements%20to%20sticky%20notes.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Convert%20selected%20text%20elements%20to%20sticky%20notes.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Converts selected plain text elements to sticky notes with transparent background and transparent stroke color (default setting, can be changed in plugin settings). Essentially converts text element into a wrappable format.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-textelement-to-transparent-stickynote.png'></td></tr></table>
+
+## Convert text to link with folder and alias
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Convert%20text%20to%20link%20with%20folder%20and%20alias.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Convert%20text%20to%20link%20with%20folder%20and%20alias.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Converts text elements to links pointing to a file in a selected folder and with the alias set as the original text. The script will prompt the user to select an existing folder from the vault.<br><code>original text</code> - <code>[[selected folder/original text|original text]]</code></td></tr></table>
+
+## Copy Selected Element Styles to Global
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Copy%20Selected%20Element%20Styles%20to%20Global.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Copy%20Selected%20Element%20Styles%20to%20Global.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will copy styles of any selected element into Excalidraw's global styles.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-copy-selected-element-styles-to-global.png'></td></tr></table>
+
+## Create new markdown file and embed into active drawing
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Create%20new%20markdown%20file%20and%20embed%20into%20active%20drawing.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Create%20new%20markdown%20file%20and%20embed%20into%20active%20drawing.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">The script will prompt you for a filename, then create a new markdown document with the file name provided, open the new markdown document in an adjacent pane, and embed the markdown document into the active Excalidraw drawing.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-create-and-embed-new-markdown-file.jpg'></td></tr></table>
+
+## Darken background color
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Darken%20background%20color.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Darken%20background%20color.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script darkens the background color of the selected element by 2% at a time. You can use this script several times until you are satisfied. It is recommended to set a shortcut key for this script so that you can quickly try to DARKEN and LIGHTEN the color effect. In contrast to the `Modify background color opacity` script, the advantage is that the background color of the element is not affected by the canvas color, and the color value does not appear in a strange rgba() form.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/darken-lighten-background-color.png'></td></tr></table>
+
+## Elbow connectors
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Elbow%20connectors.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Elbow%20connectors.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script converts the selected connectors to elbows.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/elbow-connectors.png'></td></tr></table>
+
+## Expand rectangles horizontally keep text centered
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Expand%20rectangles%20horizontally%20keep%20text%20centered.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Expand%20rectangles%20horizontally%20keep%20text%20centered.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script expands the width of the selected rectangles until they are all the same width and keep the text centered.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif'></td></tr></table>
+
+## Expand rectangles horizontally
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Expand%20rectangles%20horizontally.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Expand%20rectangles%20horizontally.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script expands the width of the selected rectangles until they are all the same width.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif'></td></tr></table>
+
+## Expand rectangles vertically keep text centered
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Expand%20rectangles%20vertically%20keep%20text%20centered.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Expand%20rectangles%20vertically%20keep%20text%20centered.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script expands the height of the selected rectangles until they are all the same height and keep the text centered.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif'></td></tr></table>
+
+## Expand rectangles vertically
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Expand%20rectangles%20vertically.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Expand%20rectangles%20vertically.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script expands the height of the selected rectangles until they are all the same height.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-expand-rectangles.gif'></td></tr></table>
+
+## Fixed horizontal distance between centers
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Fixed%20horizontal%20distance%20between%20centers.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Fixed%20horizontal%20distance%20between%20centers.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script arranges the selected elements horizontally with a fixed center spacing.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-horizontal-distance-between-centers.png'></td></tr></table>
+
+## Fixed inner distance
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Fixed%20inner%20distance.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Fixed%20inner%20distance.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script arranges selected elements and groups with a fixed inner distance.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-inner-distance.png'></td></tr></table>
+
+## Fixed spacing
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Fixed%20spacing.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Fixed%20spacing.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">The script arranges the selected elements horizontally with a fixed spacing. When we create an architecture diagram or mind map, we often need to arrange a large number of elements in a fixed spacing. `Fixed spacing` and `Fixed vertical Distance` scripts can save us a lot of time.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fix-space-demo.png'></td></tr></table>
+
+## Fixed vertical distance between centers
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Fixed%20vertical%20distance%20between%20centers.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Fixed%20vertical%20distance%20between%20centers.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script arranges the selected elements vertically with a fixed center spacing.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-vertical-distance-between-centers.png'></td></tr></table>
+
+## Fixed vertical distance
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Fixed%20vertical%20distance.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Fixed%20vertical%20distance.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">The script arranges the selected elements vertically with a fixed spacing. When we create an architecture diagram or mind map, we often need to arrange a large number of elements in a fixed spacing. `Fixed spacing` and `Fixed vertical Distance` scripts can save us a lot of time.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-fixed-vertical-distance.png'></td></tr></table>
+
+## Lighten background color
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Lighten%20background%20color.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Lighten%20background%20color.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script lightens the background color of the selected element by 2% at a time. You can use this script several times until you are satisfied. It is recommended to set a shortcut key for this script so that you can quickly try to DARKEN and LIGHTEN the color effect.In contrast to the `Modify background color opacity` script, the advantage is that the background color of the element is not affected by the canvas color, and the color value does not appear in a strange rgba() form.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/darken-lighten-background-color.png'></td></tr></table>
+
+## Modify background color opacity
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Modify%20background%20color%20opacity.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Modify%20background%20color%20opacity.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script changes the opacity of the background color of the selected boxes. The default background color in Excalidraw is so dark that the text is hard to read. You can lighten the color a bit by setting transparency. And you can tweak the transparency over and over again until you're happy with it. Although excalidraw has the opacity option in its native property Settings, it also changes the transparency of the border. Use this script to change only the opacity of the background color without affecting the border.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-modify-background-color-opacity.png'></td></tr></table>
+
+## Normalize Selected Arrows
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Normalize%20Selected%20Arrows.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/1-2-3'>@1-2-3</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Normalize%20Selected%20Arrows.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will reset the start and end positions of the selected arrows. The arrow will point to the center of the connected box and will have a gap of 8px from the box.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-normalize-selected-arrows.png'></td></tr></table>
+
+## OCR - Optical Character Recognition
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/OCR%20-%20Optical%20Character%20Recognition.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/OCR%20-%20Optical%20Character%20Recognition.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">REQUIRES EXCALIDRAW 1.5.15<br>The script will  1) send the selected image file to [taskbone.com](https://taskbone.com) to exctract the text from the image, and 2) will add the text to your drawing as a text element.<br><mark>⚠ Note that you will need to manually paste your token into the script after the first run! ⚠</mark><br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-ocr.jpg'><br><iframe width="560" height="315" src="https://www.youtube.com/embed/W2NMzR8s4eE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></td></tr></table>
+
+## Reverse arrows
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Reverse%20arrows.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Reverse%20arrows.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Reverse the direction of **arrows** within the scope of selected elements.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-reverse-arrow.jpg'></td></tr></table>
+
+## Scribble Helper
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Scribble%20Helper.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Scribble%20Helper.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">iOS scribble helper for better handwriting experience with text elements. If no elements are selected then the creates a text element at pointer position and you can use the edit box to modify the text with scribble. If a text element is selected then opens the input prompt where you can modify this text with scribble.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-scribble-helper.jpg'></td></tr></table>
+
+## Select Elements of Type
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Select%20Elements%20of%20Type.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Select%20Elements%20of%20Type.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Prompts you with a list of the different element types in the active image. Only elements of the selected type will be selected on the canvas. If nothing is selected when running the script, then the script will process all the elements on the canvas. If some elements are selected when the script is executed, then the script will only process the selected elements.<br>The script is useful when, for example, you want to bring to front all the arrows, or want to change the color of all the text elements, etc.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-select-element-of-type.jpg'></td></tr></table>
+
+## Set background color of unclosed line object by adding a shadow clone
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Set%20background%20color%20of%20unclosed%20line%20object%20by%20adding%20a%20shadow%20clone.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Set%20background%20color%20of%20unclosed%20line%20object%20by%20adding%20a%20shadow%20clone.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Use this script to set the background color of unclosed (i.e. open) line objects by creating a clone of the object. The script will set the stroke color of the clone to transparent and will add a straight line to close the object. Use settings to define the default background color, the fill style, and the strokeWidth of the clone. By default the clone will be grouped with the original object, you can disable this also in settings.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-set-background-color-of-unclosed-line.jpg'></td></tr></table>
+
+## Set Dimensions
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Set%20Dimensions.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Set%20Dimensions.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Currently there is no way to specify the exact location and size of objects in Excalidraw. You can bridge this gap with the following simple script.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-dimensions.jpg'></td></tr></table>
+
+## Set Font Family
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Set%20Font%20Family.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Set%20Font%20Family.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Sets font family of the text block (Virgil, Helvetica, Cascadia). Useful if you want to set a keyboard shortcut for selecting font family.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-font-family.jpg'></td></tr></table>
+
+## Set Grid
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Set%20Grid.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Set%20Grid.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">The default grid size in Excalidraw is 20. Currently there is no way to change the grid size via the user interface. This script offers a way to bridge this gap.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-grid.jpg'></td></tr></table>
+
+## Set Link Alias
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Set%20Link%20Alias.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Set%20Link%20Alias.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Iterates all of the links in the selected TextElements and prompts the user to set or modify the alias for each link found.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-set-link-alias.jpg'></td></tr></table>
+
+## Set Stroke Width of Selected Elements
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Set%20Stroke%20Width%20of%20Selected%20Elements.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Set%20Stroke%20Width%20of%20Selected%20Elements.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">This script will set the stroke width of selected elements. This is helpful, for example, when you scale freedraw sketches and want to reduce or increase their line width.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-stroke-width.jpg'></td></tr></table>
+
+## Set Text Alignment
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Set%20Text%20Alignment.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Set%20Text%20Alignment.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Sets text alignment of text block (cetner, right, left). Useful if you want to set a keyboard shortcut for selecting text alignment.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-text-align.jpg'></td></tr></table>
+
+## Split text by lines
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Split%20text%20by%20lines.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Split%20text%20by%20lines.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Split lines of text into separate text elements for easier reorganization<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-split-lines.jpg'></td></tr></table>
+
+## Transfer TextElements to Excalidraw markdown metadata
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Transfer%20TextElements%20to%20Excalidraw%20markdown%20metadata.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Transfer%20TextElements%20to%20Excalidraw%20markdown%20metadata.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">The script will delete the selected text elements from the canvas and will copy the text from these text elements into the Excalidraw markdown file as metadata. This means, that the text will no longer be visible in the drawing, however you will be able to search for the text in Obsidian and find the drawing containing this image.<br><img src='https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/images/scripts-text-to-metadata.jpg'></td></tr></table>
+
+## Zoom to Fit Selected Elements
+```excalidraw-script-install
+https://raw.githubusercontent.com/zsviczian/obsidian-excalidraw-plugin/master/ea-scripts/Zoom%20to%20Fit%20Selected%20Elements.md
+```
+<table><tr  valign='top'><td class="label">Author</td><td class="data"><a href='https://github.com/zsviczian'>@zsviczian</a></td></tr><tr valign='top'><td class="label">Source</td><td class="data"><a href='https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Zoom%20to%20Fit%20Selected%20Elements.md'>File on GitHub</a></td></tr><tr valign='top'><td class="label">Description</td><td class="data">Similar to Excalidraw standard SHIFT+2 feature: Zoom to fit selected elements, but with the ability to zoom to 1000%. Inspiration: [#272](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/272)</td></tr></table>

manifest.json

@@ -1,8 +1,8 @@
 {
 	"id": "obsidian-excalidraw-plugin",
 	"name": "Excalidraw",
-	"version": "1.3.20",
-	"minAppVersion": "0.12.0",
+	"version": "1.6.4",
+	"minAppVersion": "0.12.16",
 	"description": "An Obsidian plugin to edit and view Excalidraw drawings",
 	"author": "Zsolt Viczian",
 	"authorUrl": "https://zsolt.blog",

package.json

@@ -1,40 +1,53 @@
 {
   "name": "obsidian-excalidraw-plugin",
-  "version": "1.1.10",
+  "version": "1.3.21",
   "description": "This is an Obsidian.md plugin that lets you view and edit Excalidraw drawings",
   "main": "main.js",
   "scripts": {
     "dev": "cross-env NODE_ENV=development rollup --config rollup.config.js -w",
-    "build": "cross-env NODE_ENV=production rollup --config rollup.config.js"
+    "build": "cross-env NODE_ENV=production rollup --config rollup.config.js",
+    "code:fix": "eslint --max-warnings=0 --ext .ts,.tsx ./src --fix"
   },
   "keywords": [],
   "author": "",
   "license": "MIT",
   "dependencies": {
-    "@zsviczian/excalidraw": "0.10.0-obsidian-1",
-    "monkey-around": "^2.2.0",
+    "@zsviczian/excalidraw": "0.10.0-obsidian-45",
+    "monkey-around": "^2.3.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-scripts": "^1.1.5",
-    "roughjs": "4.4.1"
+    "react-scripts": "^5.0.0",
+    "roughjs": "^4.5.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.15.5",
-    "@babel/preset-env": "^7.15.6",
-    "@babel/preset-react": "^7.14.5",
+    "@babel/core": "^7.16.12",
+    "@babel/preset-env": "^7.16.11",
+    "@babel/preset-react": "^7.16.7",
     "@rollup/plugin-babel": "^5.3.0",
-    "@rollup/plugin-commonjs": "^21.0.0",
-    "@rollup/plugin-node-resolve": "^13.0.5",
-    "@rollup/plugin-replace": "^2.4.2",
-    "@rollup/plugin-typescript": "^8.2.5",
+    "@rollup/plugin-commonjs": "^21.0.1",
+    "@rollup/plugin-node-resolve": "^13.1.3",
+    "@rollup/plugin-replace": "^3.0.1",
+    "@rollup/plugin-typescript": "^8.3.0",
+    "@types/js-beautify": "^1.13.3",
     "@types/node": "^15.12.4",
-    "@types/react-dom": "^17.0.9",
+    "@types/react-dom": "^17.0.11",
+    "@popperjs/core": "^2.11.2",
     "cross-env": "^7.0.3",
-    "nanoid": "^3.1.23",
-    "obsidian": "^0.12.16",
-    "rollup": "^2.52.3",
-    "rollup-plugin-visualizer": "^5.5.2",
+    "html2canvas": "^1.4.0",
+    "nanoid": "^3.1.31",
+    "obsidian": "^0.13.21",
+    "rollup": "^2.66.0",
+    "rollup-plugin-visualizer": "^5.5.4",
     "tslib": "^2.3.1",
-    "typescript": "^4.4.3"
-  }
+    "typescript": "^4.5.5",
+    "eslint-config-prettier": "8.3.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "prettier": "^2.5.1",
+    "@excalidraw/eslint-config": "1.0.0",
+    "@excalidraw/prettier-config": "1.0.2"
+  },
+  "resolutions": {
+    "@typescript-eslint/typescript-estree": "5.3.0"
+  },
+  "prettier": "@excalidraw/prettier-config"
 }

rollup.config.js

@@ -15,12 +15,10 @@ export default {
     dir: '.',
     sourcemap: 'inline',
     format: 'cjs',
-    exports: 'default'
+    exports: 'default',
   },
   external: ['obsidian'],
   plugins: [
-    typescript({inlineSources: !isProd}),
-    nodeResolve({ browser: true, preferBuiltins: true }),
     replace({
       preventAssignment: true,
       "process.env.NODE_ENV": JSON.stringify(env.NODE_ENV),
@@ -29,6 +27,8 @@ export default {
       exclude: "node_modules/**"
     }),
     commonjs(),
+    nodeResolve({ browser: true, preferBuiltins: true }),
+    typescript({inlineSources: !isProd}),
     visualizer(),
-  ]
+  ],
 };

src/EmbeddedFileLoader.ts

@@ -0,0 +1,556 @@
+import { FileId } from "@zsviczian/excalidraw/types/element/types";
+import { BinaryFileData, DataURL } from "@zsviczian/excalidraw/types/types";
+import { App, MarkdownRenderer, Notice, TFile } from "obsidian";
+import {
+  CASCADIA_FONT,
+  fileid,
+  FRONTMATTER_KEY_FONT,
+  FRONTMATTER_KEY_FONTCOLOR,
+  FRONTMATTER_KEY_MD_STYLE,
+  IMAGE_TYPES,
+  nanoid,
+  VIRGIL_FONT,
+} from "./constants";
+import { createSVG } from "./ExcalidrawAutomate";
+import { ExcalidrawData, getTransclusion } from "./ExcalidrawData";
+import { ExportSettings } from "./ExcalidrawView";
+import { t } from "./lang/helpers";
+import { tex2dataURL } from "./LaTeX";
+import ExcalidrawPlugin from "./main";
+import {
+  errorlog,
+  getDataURL,
+  getFontDataURL,
+  getImageSize,
+  getLinkParts,
+  LinkParts,
+  svgToBase64,
+} from "./Utils";
+
+export declare type MimeType =
+  | "image/svg+xml"
+  | "image/png"
+  | "image/jpeg"
+  | "image/gif"
+  | "application/octet-stream";
+export type FileData = BinaryFileData & {
+  size: Size;
+  hasSVGwithBitmap: boolean;
+};
+
+export type Size = {
+  height: number;
+  width: number;
+};
+
+export class EmbeddedFile {
+  public file: TFile = null;
+  public isSVGwithBitmap: boolean = false;
+  private img: string = ""; //base64
+  private imgInverted: string = ""; //base64
+  public mtime: number = 0; //modified time of the image
+  private plugin: ExcalidrawPlugin;
+  public mimeType: MimeType = "application/octet-stream";
+  public size: Size = { height: 0, width: 0 };
+  public linkParts: LinkParts;
+
+  constructor(plugin: ExcalidrawPlugin, hostPath: string, imgPath: string) {
+    this.plugin = plugin;
+    this.resetImage(hostPath, imgPath);
+  }
+
+  public resetImage(hostPath: string, imgPath: string) {
+    this.imgInverted = this.img = "";
+    this.mtime = 0;
+    this.linkParts = getLinkParts(imgPath);
+    if (!this.linkParts.path) {
+      new Notice(`Excalidraw Error\nIncorrect embedded filename: ${imgPath}`);
+      return;
+    }
+    if (!this.linkParts.width) {
+      this.linkParts.width = this.plugin.settings.mdSVGwidth;
+    }
+    if (!this.linkParts.height) {
+      this.linkParts.height = this.plugin.settings.mdSVGmaxHeight;
+    }
+    this.file = this.plugin.app.metadataCache.getFirstLinkpathDest(
+      this.linkParts.path,
+      hostPath,
+    );
+    if (!this.file) {
+      new Notice(
+        `Excalidraw Warning: could not find image file: ${imgPath}`,
+        5000,
+      );
+    }
+  }
+
+  private fileChanged(): boolean {
+    if (!this.file) {
+      return false;
+    }
+    return this.mtime != this.file.stat.mtime;
+  }
+
+  public setImage(
+    imgBase64: string,
+    mimeType: MimeType,
+    size: Size,
+    isDark: boolean,
+    isSVGwithBitmap: boolean,
+  ) {
+    if (!this.file) {
+      return;
+    }
+    if (this.fileChanged()) {
+      this.imgInverted = this.img = "";
+    }
+    this.mtime = this.file.stat.mtime;
+    this.size = size;
+    this.mimeType = mimeType;
+    switch (isDark && isSVGwithBitmap) {
+      case true:
+        this.imgInverted = imgBase64;
+        break;
+      case false:
+        this.img = imgBase64;
+        break; //bitmaps and SVGs without an embedded bitmap do not need a negative image
+    }
+    this.isSVGwithBitmap = isSVGwithBitmap;
+  }
+
+  public isLoaded(isDark: boolean): boolean {
+    if (!this.file) {
+      return true;
+    }
+    if (this.fileChanged()) {
+      return false;
+    }
+    if (this.isSVGwithBitmap && isDark) {
+      return this.imgInverted !== "";
+    }
+    return this.img !== "";
+  }
+
+  public getImage(isDark: boolean) {
+    if (!this.file) {
+      return "";
+    }
+    if (isDark && this.isSVGwithBitmap) {
+      return this.imgInverted;
+    }
+    return this.img; //images that are not SVGwithBitmap, only the light string is stored, since inverted and non-inverted are ===
+  }
+}
+
+export class EmbeddedFilesLoader {
+  private plugin: ExcalidrawPlugin;
+  private processedFiles: Map<string, number> = new Map<string, number>();
+  private isDark: boolean;
+  public terminate = false;
+  public uid: string;
+
+  constructor(plugin: ExcalidrawPlugin, isDark?: boolean) {
+    this.plugin = plugin;
+    this.isDark = isDark;
+    this.uid = nanoid();
+  }
+
+  public async getObsidianImage(inFile: TFile | EmbeddedFile): Promise<{
+    mimeType: MimeType;
+    fileId: FileId;
+    dataURL: DataURL;
+    created: number;
+    hasSVGwithBitmap: boolean;
+    size: { height: number; width: number };
+  }> {
+    if (!this.plugin || !inFile) {
+      return null;
+    }
+    const file: TFile = inFile instanceof EmbeddedFile ? inFile.file : inFile;
+    const linkParts =
+      inFile instanceof EmbeddedFile
+        ? inFile.linkParts
+        : {
+            original: file.path,
+            path: file.path,
+            isBlockRef: false,
+            ref: null,
+            width: this.plugin.settings.mdSVGwidth,
+            height: this.plugin.settings.mdSVGmaxHeight,
+          };
+    //to block infinite loop of recursive loading of images
+    const count = this.processedFiles.has(file.path)
+      ? this.processedFiles.get(file.path)
+      : 0;
+    if (file.extension === "md" && count > 2) {
+      new Notice(t("INFINITE_LOOP_WARNING") + file.path, 6000);
+      return null;
+    }
+    this.processedFiles.set(file.path, count + 1);
+    let hasSVGwithBitmap = false;
+    const app = this.plugin.app;
+    const isExcalidrawFile = this.plugin.isExcalidrawFile(file);
+    if (
+      !(
+        IMAGE_TYPES.contains(file.extension) ||
+        isExcalidrawFile ||
+        file.extension === "md"
+      )
+    ) {
+      return null;
+    }
+    const ab = await app.vault.readBinary(file);
+
+    const getExcalidrawSVG = async (isDark: boolean) => {
+      //debug({where:"EmbeddedFileLoader.getExcalidrawSVG",uid:this.uid,file:file.name});
+      const exportSettings: ExportSettings = {
+        withBackground: false,
+        withTheme: false,
+      };
+      const svg = await createSVG(
+        file.path,
+        true,
+        exportSettings,
+        this,
+        null,
+        null,
+        null,
+        [],
+        this.plugin,
+      );
+      //https://stackoverflow.com/questions/51154171/remove-css-filter-on-child-elements
+      const imageList = svg.querySelectorAll(
+        "image:not([href^='data:image/svg'])",
+      );
+      if (imageList.length > 0) {
+        hasSVGwithBitmap = true;
+      }
+      if (hasSVGwithBitmap && isDark) {
+        const THEME_FILTER = "invert(100%) hue-rotate(180deg) saturate(1.25)";
+        imageList.forEach((i) => {
+          const id = i.parentElement?.id;
+          svg.querySelectorAll(`use[href='#${id}']`).forEach((u) => {
+            u.setAttribute("filter", THEME_FILTER);
+          });
+        });
+      }
+      if (!hasSVGwithBitmap && svg.getAttribute("hasbitmap")) {
+        hasSVGwithBitmap = true;
+      }
+      const dURL = svgToBase64(svg.outerHTML) as DataURL;
+      return dURL as DataURL;
+    };
+
+    const excalidrawSVG = isExcalidrawFile
+      ? await getExcalidrawSVG(this.isDark)
+      : null;
+    let mimeType: MimeType = "image/svg+xml";
+    if (!isExcalidrawFile) {
+      switch (file.extension) {
+        case "png":
+          mimeType = "image/png";
+          break;
+        case "jpeg":
+          mimeType = "image/jpeg";
+          break;
+        case "jpg":
+          mimeType = "image/jpeg";
+          break;
+        case "gif":
+          mimeType = "image/gif";
+          break;
+        case "svg":
+        case "md":
+          mimeType = "image/svg+xml";
+          break;
+        default:
+          mimeType = "application/octet-stream";
+      }
+    }
+    const dataURL =
+      excalidrawSVG ??
+      (file.extension === "svg"
+        ? await getSVGData(app, file)
+        : file.extension === "md"
+        ? await convertMarkdownToSVG(this.plugin, file, linkParts)
+        : await getDataURL(ab, mimeType));
+    const size = await getImageSize(
+      excalidrawSVG ??
+        (file.extension === "md" ? dataURL : app.vault.getResourcePath(file)),
+    );
+    return {
+      mimeType,
+      fileId: await generateIdFromFile(ab),
+      dataURL,
+      created: file.stat.mtime,
+      hasSVGwithBitmap,
+      size,
+    };
+  }
+
+  public async loadSceneFiles(
+    excalidrawData: ExcalidrawData,
+    addFiles: Function,
+  ) {
+    const entries = excalidrawData.getFileEntries();
+    //debug({where:"EmbeddedFileLoader.loadSceneFiles",uid:this.uid,isDark:this.isDark,sceneTheme:excalidrawData.scene.appState.theme});
+    if (this.isDark === undefined) {
+      this.isDark = excalidrawData.scene.appState.theme === "dark";
+    }
+    let entry;
+    const files: FileData[] = [];
+    while (!this.terminate && !(entry = entries.next()).done) {
+      const embeddedFile: EmbeddedFile = entry.value[1];
+      if (!embeddedFile.isLoaded(this.isDark)) {
+        //debug({where:"EmbeddedFileLoader.loadSceneFiles",uid:this.uid,status:"embedded Files are not loaded"});
+        const data = await this.getObsidianImage(embeddedFile);
+        if (data) {
+          files.push({
+            mimeType: data.mimeType,
+            id: entry.value[0],
+            dataURL: data.dataURL,
+            created: data.created,
+            size: data.size,
+            hasSVGwithBitmap: data.hasSVGwithBitmap,
+          });
+        }
+      } else if (embeddedFile.isSVGwithBitmap) {
+        files.push({
+          mimeType: embeddedFile.mimeType,
+          id: entry.value[0],
+          dataURL: embeddedFile.getImage(this.isDark) as DataURL,
+          created: embeddedFile.mtime,
+          size: embeddedFile.size,
+          hasSVGwithBitmap: embeddedFile.isSVGwithBitmap,
+        });
+      }
+    }
+
+    let equation;
+    const equations = excalidrawData.getEquationEntries();
+    while (!this.terminate && !(equation = equations.next()).done) {
+      if (!excalidrawData.getEquation(equation.value[0]).isLoaded) {
+        const latex = equation.value[1].latex;
+        const data = await tex2dataURL(latex, this.plugin);
+        if (data) {
+          files.push({
+            mimeType: data.mimeType,
+            id: equation.value[0],
+            dataURL: data.dataURL,
+            created: data.created,
+            size: data.size,
+            hasSVGwithBitmap: false,
+          });
+        }
+      }
+    }
+
+    if (this.terminate) {
+      return;
+    }
+    //debug({where:"EmbeddedFileLoader.loadSceneFiles",uid:this.uid,status:"add Files"});
+    try {
+      //in try block because by the time files are loaded the user may have closed the view
+      addFiles(files, this.isDark);
+    } catch (e) {
+      errorlog({ where: "EmbeddedFileLoader.loadSceneFiles", error: e });
+    }
+  }
+}
+
+const getSVGData = async (app: App, file: TFile): Promise<DataURL> => {
+  const svg = await app.vault.read(file);
+  return svgToBase64(svg) as DataURL;
+};
+
+const convertMarkdownToSVG = async (
+  plugin: ExcalidrawPlugin,
+  file: TFile,
+  linkParts: LinkParts,
+): Promise<DataURL> => {
+  //1.
+  //get the markdown text
+  let text = (await getTransclusion(linkParts, plugin.app, file)).contents;
+  if (text === "") {
+    text =
+      "# Empty markdown file\nCTRL+Click here to open the file for editing in the current active pane, or CTRL+SHIFT+Click to open it in an adjacent pane.";
+  }
+
+  //2.
+  //get styles
+  const fileCache = plugin.app.metadataCache.getFileCache(file);
+  let fontDef: string;
+  let fontName = plugin.settings.mdFont;
+  if (
+    fileCache?.frontmatter &&
+    fileCache.frontmatter[FRONTMATTER_KEY_FONT] != null
+  ) {
+    fontName = fileCache.frontmatter[FRONTMATTER_KEY_FONT];
+  }
+  switch (fontName) {
+    case "Virgil":
+      fontDef = VIRGIL_FONT;
+      break;
+    case "Cascadia":
+      fontDef = CASCADIA_FONT;
+      break;
+    case "":
+      fontDef = "";
+      break;
+    default:
+      const font = await getFontDataURL(plugin.app, fontName, file.path);
+      fontDef = font.fontDef;
+      fontName = font.fontName;
+  }
+
+  const fontColor = fileCache?.frontmatter
+    ? fileCache.frontmatter[FRONTMATTER_KEY_FONTCOLOR] ??
+      plugin.settings.mdFontColor
+    : plugin.settings.mdFontColor;
+
+  let style = fileCache?.frontmatter
+    ? fileCache.frontmatter[FRONTMATTER_KEY_MD_STYLE] ?? ""
+    : "";
+  let frontmatterCSSisAfile = false;
+  if (style && style != "") {
+    const f = plugin.app.metadataCache.getFirstLinkpathDest(style, file.path);
+    if (f) {
+      style = await plugin.app.vault.read(f);
+      frontmatterCSSisAfile = true;
+    }
+  }
+  if (
+    !frontmatterCSSisAfile &&
+    plugin.settings.mdCSS &&
+    plugin.settings.mdCSS != ""
+  ) {
+    const f = plugin.app.metadataCache.getFirstLinkpathDest(
+      plugin.settings.mdCSS,
+      file.path,
+    );
+    if (f) {
+      style += `\n${await plugin.app.vault.read(f)}`;
+    }
+  }
+
+  //3.
+  //SVG helper functions
+  //the SVG will first have ~infinite height. After sizing this will be reduced
+  let svgStyle = ` width="${linkParts.width}px" height="100000"`;
+  let foreignObjectStyle = ` width="${linkParts.width}px" height="100%"`;
+
+  const svg = (xml: string, xmlFooter: string, style?: string) =>
+    `<svg xmlns="http://www.w3.org/2000/svg"${svgStyle}>${
+      style ? `<style>${style}</style>` : ""
+    }<foreignObject x="0" y="0"${foreignObjectStyle}>${xml}${
+      xmlFooter //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/286#issuecomment-982179639
+    }</foreignObject>${
+      fontDef !== "" ? `<defs><style>${fontDef}</style></defs>` : ""
+    }</svg>`;
+
+  //4.
+  //create document div - this will be the contents of the foreign object
+  const mdDIV = createDiv();
+  mdDIV.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
+  mdDIV.setAttribute("class", "excalidraw-md-host");
+  //  mdDIV.setAttribute("style",style);
+  if (fontName !== "") {
+    mdDIV.style.fontFamily = fontName;
+  }
+  mdDIV.style.overflow = "auto";
+  mdDIV.style.display = "block";
+  if (fontColor && fontColor != "") {
+    mdDIV.style.color = fontColor;
+  }
+
+  await MarkdownRenderer.renderMarkdown(text, mdDIV, file.path, plugin);
+  mdDIV
+    .querySelectorAll(":scope > *[class^='frontmatter']")
+    .forEach((el) => mdDIV.removeChild(el));
+
+  //5.1
+  //get SVG size.
+  //First I need to create a fully self contained copy of the document to convert
+  //blank styles into inline styles using computedStyle
+  const iframeHost = document.body.createDiv();
+  iframeHost.style.display = "none";
+  const iframe = iframeHost.createEl("iframe");
+  const iframeDoc = iframe.contentWindow.document;
+  if (style) {
+    const styleEl = iframeDoc.createElement("style");
+    styleEl.type = "text/css";
+    styleEl.innerHTML = style;
+    iframeDoc.head.appendChild(styleEl);
+  }
+  const stylingDIV = iframeDoc.importNode(mdDIV, true);
+  iframeDoc.body.appendChild(stylingDIV);
+  const footerDIV = createDiv();
+  footerDIV.setAttribute("class", "excalidraw-md-footer");
+  iframeDoc.body.appendChild(footerDIV);
+
+  iframeDoc.body.querySelectorAll("*").forEach((el: HTMLElement) => {
+    const elementStyle = el.style;
+    const computedStyle = window.getComputedStyle(el);
+    let style = "";
+    for (const prop in elementStyle) {
+      if (elementStyle.hasOwnProperty(prop)) {
+        style += `${prop}: ${computedStyle[prop]};`;
+      }
+    }
+    el.setAttribute("style", style);
+  });
+
+  const xmlINiframe = new XMLSerializer().serializeToString(stylingDIV);
+  const xmlFooter = new XMLSerializer().serializeToString(footerDIV);
+  document.body.removeChild(iframeHost);
+
+  //5.2
+  //get SVG size
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(
+    svg(xmlINiframe, xmlFooter),
+    "image/svg+xml",
+  );
+  const svgEl = doc.firstElementChild;
+  const host = createDiv();
+  host.appendChild(svgEl);
+  document.body.appendChild(host);
+  const footerHeight = svgEl.querySelector(
+    ".excalidraw-md-footer",
+  ).scrollHeight;
+  const height =
+    svgEl.querySelector(".excalidraw-md-host").scrollHeight + footerHeight;
+  const svgHeight = height <= linkParts.height ? height : linkParts.height;
+  document.body.removeChild(host);
+
+  //finalize SVG
+  svgStyle = ` width="${linkParts.width}px" height="${svgHeight}px"`;
+  foreignObjectStyle = ` width="${linkParts.width}px" height="${svgHeight}px"`;
+  mdDIV.style.height = `${svgHeight - footerHeight}px`;
+  mdDIV.style.overflow = "hidden";
+  const xml = new XMLSerializer().serializeToString(mdDIV);
+  const finalSVG = svg(xml, '<div class="excalidraw-md-footer"></div>', style);
+  plugin.ea.mostRecentMarkdownSVG = parser.parseFromString(
+    finalSVG,
+    "image/svg+xml",
+  ).firstElementChild as SVGSVGElement;
+  return svgToBase64(finalSVG) as DataURL;
+};
+
+const generateIdFromFile = async (file: ArrayBuffer): Promise<FileId> => {
+  let id: FileId;
+  try {
+    const hashBuffer = await window.crypto.subtle.digest("SHA-1", file);
+    id =
+      // convert buffer to byte array
+      Array.from(new Uint8Array(hashBuffer))
+        // convert to hex string
+        .map((byte) => byte.toString(16).padStart(2, "0"))
+        .join("") as FileId;
+  } catch (error) {
+    errorlog({ where: "EmbeddedFileLoader.generateIdFromFile", error });
+    id = fileid() as FileId;
+  }
+  return id;
+};