Fix: Peepare css for drag / swipe in rtl mode

django-cms · Mar 30, 2024 · a92379f · a92379f
1 parent cb9c8e4
commit a92379f
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 11 deletions.
diff --git a/private/css/cms.dialog.css b/private/css/cms.dialog.css
@@ -4,15 +4,17 @@ dialog.cms-dialog {
     resize: both;
     top: 50%;
     left: 50%;
+    inset-inline-start: 50%;
+    inset-inline-end: unset;
     transform: translate(calc(-50% + 250px), calc(-50% + 121px));
     width: 32rem;
     height: 24rem;
     min-height: 16rem;
     min-width: 16rem;
     .cms-modal-foot {
-        margin-right: 1rem;
+        margin-inline-end: 1rem;
         .cms-modal-buttons {
-            padding-right: 10px;
+            padding-inline-end: 10px;
         }
     }
     .cms-modal-body iframe {
@@ -22,6 +24,11 @@ dialog.cms-dialog {
     }
 }
 
+[dir="rtl"] dialog.cms-dialog {
+    inset-inline-start: unset;
+    inset-inline-end: 50%;
+}
+
 dialog.cms-form-dialog {
     &::before {
         position: absolute;

diff --git a/private/js/cms.editor.js b/private/js/cms.editor.js
@@ -280,23 +280,31 @@ class CMSEditor {
                         }
                         return response.text();
                 }).then(body => {
-                        // Read the CMS databridge values from the response
-                        // The regexes are used to extract the databridge values from the response.
-                        // This depends on the exact format django CMS core returns it. This will need to be adjusted
-                        // if the format changes.
-                        // Fallback solution is to reload the page as djagocms-text-ckeditor used to do.
-                        const regex1  = /^\s*Window\.CMS\.API\.Helpers\.dataBridge\s=\s(.*?);$/gmu.exec(body);
-                        const regex2  = /^\s*Window\.CMS\.API\.Helpers\.dataBridge\.structure\s=\s(.*?);$/gmu.exec(body);
+                    // Read the CMS databridge values from the response, either directly or from a script tag or
+                    //  from the response using regex.
+                    // This depends on the exact format django CMS core returns it. This will need to be adjusted
+                    // if the format changes.
+                    // Fallback solution is to reload the page as djagocms-text-ckeditor used to do.
+                    const dom = document.createElement('div');
+                    dom.innerHTML = body;
+                    const script = dom.querySelector('script#data-bridge');
+                    if (script) {
+                        this.CMS.API.Helpers.dataBridge = JSON.parse(script.textContent);
+                    } else {
+                        const regex1 = /^\s*Window\.CMS\.API\.Helpers\.dataBridge\s=\s(.*?);$/gmu.exec(body);
+                        const regex2 = /^\s*Window\.CMS\.API\.Helpers\.dataBridge\.structure\s=\s(.*?);$/gmu.exec(body);
                         if (regex1 && regex2 && this.CMS) {
                             this.CMS.API.Helpers.dataBridge = JSON.parse(regex1[1]);
                             this.CMS.API.Helpers.dataBridge.structure = JSON.parse(regex2[1]);
-                            this.CMS.API.StructureBoard.handleEditPlugin(this.CMS.API.Helpers.dataBridge);
-                            this._loadToolbar();
                         } else {
                             // No databridge found
                             // Reload
                             this.CMS.API.Helpers.reloadBrowser('REFRESH_PAGE');
+                            return;
                         }
+                    }
+                    this.CMS.API.StructureBoard.handleEditPlugin(this.CMS.API.Helpers.dataBridge);
+                    this._loadToolbar();
                 })
                 .catch(error => {
                         el.dataset.changed = 'true';