From 32673af014933f79a8603aaae59a3da21fe3df17 Mon Sep 17 00:00:00 2001
From: Hsieh Chin Fan <pham@topo.tw>
Date: Wed, 2 Oct 2024 19:32:52 +0800
Subject: fix: set layout attribute wisely for observer

---
 src/dumbymap.mjs |  1 +
 src/editor.mjs   | 14 +++++++-------
 2 files changed, 8 insertions(+), 7 deletions(-)

(limited to 'src')

diff --git a/src/dumbymap.mjs b/src/dumbymap.mjs
index b909fe0..a21dadb 100644
--- a/src/dumbymap.mjs
+++ b/src/dumbymap.mjs
@@ -80,6 +80,7 @@ export const markdown2HTML = (container, mdContent) => {
 }
 export const generateMaps = (container, { delay, mapCallback }) => {
   container.classList.add('Dumby')
+  container.removeAttribute('data-layout')
   container.setAttribute('data-layout', layouts[0].name)
   const htmlHolder = container.querySelector('.SemanticHtml') ?? container
   const blocks = Array.from(htmlHolder.querySelectorAll('.dumby-block'))
diff --git a/src/editor.mjs b/src/editor.mjs
index 4c50e79..2938745 100644
--- a/src/editor.mjs
+++ b/src/editor.mjs
@@ -6,25 +6,25 @@ import * as menuItem from './MenuItem'
 
 // Set up Containers {{{
 
+const context = document.querySelector('[data-mode]')
 const HtmlContainer = document.querySelector('.DumbyMap')
 const textArea = document.querySelector('.editor textarea')
 let dumbymap
 
-new window.MutationObserver(mutations => {
-  const mutation = mutations.at(-1)
-  const mode = mutation.target.getAttribute('data-mode')
+new window.MutationObserver(() => {
+  const mode = context.getAttribute('data-mode')
   const layout = HtmlContainer.getAttribute('data-layout')
   if (mode === 'editing' && layout !== 'normal') {
     HtmlContainer.setAttribute('data-layout', 'normal')
   }
-}).observe(document.querySelector('[data-mode]'), {
+}).observe(context, {
   attributes: true,
   attributeFilter: ['data-mode'],
   attributeOldValue: true
 })
 const toggleEditing = () => {
-  const mode = document.body.getAttribute('data-mode')
-  document.body.setAttribute('data-mode', mode === 'editing' ? '' : 'editing')
+  const mode = context.getAttribute('data-mode')
+  context.setAttribute('data-mode', mode === 'editing' ? '' : 'editing')
 }
 // }}}
 // Set up EasyMDE {{{
@@ -658,7 +658,7 @@ new window.MutationObserver(mutaions => {
   const mutation = mutaions.at(-1)
   const layout = HtmlContainer.getAttribute('data-layout')
   if (layout !== 'normal' || mutation.oldValue === 'normal') {
-    document.body.setAttribute('data-mode', '')
+    context.setAttribute('data-mode', '')
   }
 }).observe(HtmlContainer, {
   attributes: true,
-- 
cgit v1.2.3-70-g09d2