deploy: 87bfd47

ninjamar · Apr 17, 2024 · 8f0366c · 8f0366c
1 parent 450c60d
commit 8f0366c
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 15 deletions.
diff --git a/projects/editor/src/editor/editor.js b/projects/editor/src/editor/editor.js
@@ -3,7 +3,8 @@
     Copyright (c) 2024 ninjamar
     https://github.com/ninjamar/editor
 */
-import { toggleStyle, styles,  styleAction, ElementOptions, createOptionsFromElement, extractGreatestParent, removeStyle } from "./style.js";
+import { toggleStyle, styles,  styleAction, ElementOptions, createOptionsFromElement, getAllAppliedStyles, extractGreatestParent, removeStyle } from "./style.js";
+import { attributesToDict } from "./utils.js";
 
 // Set options for the context menu
 const menuOptions = {
@@ -288,20 +289,23 @@ export class Editor {
             item.classList.remove("editor-context-menu-active");
         }
         let parent = extractGreatestParent(range);
+        let options = getAllAppliedStyles(range.commonAncestorContainer).filter(x => x instanceof HTMLElement).map(x => new ElementOptions(x.tagName, attributesToDict(x.attributes)));;
+
         if (parent.firstElementChild){
-            let options = createOptionsFromElement(parent.firstElementChild);
-            for (let option of options){
-                // Special handling for A tags
-                if (option.tagName == "A"){
-                    this.menu.querySelector("[name='LINK']").parentElement.classList.add("editor-context-menu-active");
-                } else {
-                    // Iterate over every tag in the menu bar
-                    for (let key of Object.keys(menuOptions.listeners)){
-                        // Check equality with styles[key]
-                        // Use optional chaining
-                        if (styles[key]?.applied.equals(option)){
-                            this.menu.querySelector(`[name='${key}']`).parentElement.classList.add("editor-context-menu-active");
-                        }
+            options = options.concat(createOptionsFromElement(parent.firstElementChild));
+        }
+
+        for (let option of options){
+            // Special handling for A tags
+            if (option.tagName == "A"){
+                this.menu.querySelector("[name='LINK']").parentElement.classList.add("editor-context-menu-active");
+            } else {
+                // Iterate over every tag in the menu bar
+                for (let key of Object.keys(menuOptions.listeners)){
+                    // Check equality with styles[key]
+                    // Use optional chaining
+                    if (styles[key]?.applied.equals(option)){
+                        this.menu.querySelector(`[name='${key}']`).parentElement.classList.add("editor-context-menu-active");
                     }
                 }
             }

diff --git a/projects/editor/src/editor/style.js b/projects/editor/src/editor/style.js
@@ -190,11 +190,12 @@ export function extractGreatestParent(range){
  * Get all applied style for an element
  * TODO: This should probably be called getAllParentElements
  *
+ * @export
  * @param {HTMLElement} element - Element to check
  * @param {HTMLElement} [max=document.body] - Maxomum parent
  * @returns {Array.<HTMLElement>} - All applied styles
  */
-function getAllAppliedStyles(element, max = document.body){
+export function getAllAppliedStyles(element, max = document.body){
     let curr = element;
     let styles = [curr];
     while (curr.parentElement && curr.parentElement != max){