maglevcms 2.0.0.beta1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/frontend/editor/components/section-highlighter/index.vue +2 -2
- data/app/frontend/editor/layouts/app.vue +13 -1
- data/app/frontend/editor/services/live-preview.js +11 -1
- data/app/frontend/live-preview-client/iframe-decorator.js +5 -4
- data/app/frontend/live-preview-client/message.js +1 -0
- data/app/frontend/live-preview-client/rails.js +11 -1
- data/lib/maglev/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: f5927f846b9b6ff6238c335be6238e4d6a6f821ff938f703d3e52c371059d3c3
|
4
|
+
data.tar.gz: 6e7293b7cfd56fb7ed7c95571a08b8fa9b27bb6837175926d9ac24e51133d337
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 2d800cf00c89cec1d2bc92b8106eb2bff7fc42db0abfbb80e528df13ab72133211ab6b6ccec6e27ad6bbf293cdc100c058c99ed17f67f0881532cc5756e0767a
|
7
|
+
data.tar.gz: aba0b9aaf8a65f6119a23e3f15e618ad657832fc9bbf0f20cad4bef1a72355b4fe7085948c86a5453a46723f8f13aff06fdcbf2732c4bafd42b04ea0b4ed64c1
|
@@ -73,11 +73,11 @@ export default {
|
|
73
73
|
methods: {
|
74
74
|
onPreviewScroll(event) {
|
75
75
|
this.isScrolling = true
|
76
|
-
this.boundingRect = event.detail.boundingRect
|
76
|
+
this.boundingRect = event.detail.boundingRect
|
77
77
|
this.waitUntilScrollingDone()
|
78
78
|
},
|
79
79
|
onEndPreviewScrolling() {
|
80
|
-
this.isScrolling = false
|
80
|
+
this.isScrolling = false
|
81
81
|
this.applyStyle(this.boundingRect)
|
82
82
|
},
|
83
83
|
applyStyle(boundingRect) {
|
@@ -9,7 +9,11 @@
|
|
9
9
|
</template>
|
10
10
|
|
11
11
|
<template v-slot:slide-pane>
|
12
|
-
<transition
|
12
|
+
<transition
|
13
|
+
name="slide"
|
14
|
+
mode="out-in"
|
15
|
+
v-on:before-enter="beforeEnter"
|
16
|
+
v-on:after-enter="afterEnter">
|
13
17
|
<router-view name="slide-pane" />
|
14
18
|
</transition>
|
15
19
|
</template>
|
@@ -26,5 +30,13 @@ import SidebarNav from '@/components/sidebar-nav/index.vue'
|
|
26
30
|
export default {
|
27
31
|
name: 'AppLayout',
|
28
32
|
components: { Layout, HeaderNav, SidebarNav },
|
33
|
+
methods: {
|
34
|
+
beforeEnter() {
|
35
|
+
this.services.livePreview.simulateFakeScroll()
|
36
|
+
},
|
37
|
+
afterEnter() {
|
38
|
+
this.services.livePreview.pingSection(this.currentSection?.id)
|
39
|
+
},
|
40
|
+
},
|
29
41
|
}
|
30
42
|
</script>
|
@@ -26,6 +26,12 @@ export const removeSection = (sectionId) => {
|
|
26
26
|
postMessage('section:remove', { sectionId })
|
27
27
|
}
|
28
28
|
|
29
|
+
export const pingSection = (sectionId) => {
|
30
|
+
if (!sectionId) return
|
31
|
+
postMessage('section:ping', { sectionId })
|
32
|
+
}
|
33
|
+
|
34
|
+
|
29
35
|
// === Block related actions ===
|
30
36
|
export const addBlock = (content, section, sectionBlock) => {
|
31
37
|
postMessage('block:add', { content, section, sectionBlock })
|
@@ -43,6 +49,10 @@ export const removeBlock = (content, section, sectionBlockId) => {
|
|
43
49
|
postMessage('block:remove', { content, section, sectionBlockId })
|
44
50
|
}
|
45
51
|
|
52
|
+
export const simulateFakeScroll = () => {
|
53
|
+
notifyScrolling(null)
|
54
|
+
}
|
55
|
+
|
46
56
|
// === Other actions ===
|
47
57
|
|
48
58
|
export const updateStyle = (content, style) => {
|
@@ -113,7 +123,7 @@ const openSettingPane = (name, params) => {
|
|
113
123
|
})
|
114
124
|
}
|
115
125
|
|
116
|
-
const notifyScrolling = (boundingRect) => {
|
126
|
+
export const notifyScrolling = (boundingRect) => {
|
117
127
|
const event = new CustomEvent('maglev:preview:scroll', {
|
118
128
|
detail: { boundingRect },
|
119
129
|
})
|
@@ -62,8 +62,9 @@ const selectHoveredSectionAtStartup = (previewDocument, stickySectionIds) => {
|
|
62
62
|
setTimeout(() => {
|
63
63
|
const section = previewDocument.querySelector('[data-maglev-section-id]:hover')
|
64
64
|
|
65
|
-
if (section)
|
66
|
-
onSectionHovered(previewDocument, section, stickySectionIds)
|
65
|
+
if (section) {
|
66
|
+
onSectionHovered(previewDocument, section, stickySectionIds, true)
|
67
|
+
}
|
67
68
|
}, 200)
|
68
69
|
}
|
69
70
|
|
@@ -116,10 +117,10 @@ const listenScrolling = (previewDocument) => {
|
|
116
117
|
addEventListener(previewDocument, 'scroll', scrollNotifier)
|
117
118
|
}
|
118
119
|
|
119
|
-
const onSectionHovered = (previewDocument, el, stickySectionIds) => {
|
120
|
+
const onSectionHovered = (previewDocument, el, stickySectionIds, force = false) => {
|
120
121
|
const sectionId = el.dataset.maglevSectionId
|
121
122
|
|
122
|
-
if (hoveredSectionId !== sectionId) {
|
123
|
+
if (hoveredSectionId !== sectionId || force) {
|
123
124
|
postMessage('section:hover', {
|
124
125
|
sectionId,
|
125
126
|
sectionRect: el.getBoundingClientRect(),
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import axios from 'axios'
|
2
2
|
import { debounce } from './utils'
|
3
3
|
import runScripts from './run-scripts'
|
4
|
+
import { postMessage } from './message'
|
4
5
|
|
5
6
|
const parentDocument = window.parent.document
|
6
7
|
const previewDocument = window.document
|
@@ -21,6 +22,7 @@ const start = () => {
|
|
21
22
|
window.addEventListener('maglev:section:move', moveSections)
|
22
23
|
window.addEventListener('maglev:section:update', updateSection)
|
23
24
|
window.addEventListener('maglev:section:remove', removeSection)
|
25
|
+
window.addEventListener('maglev:section:ping', pingSection)
|
24
26
|
window.addEventListener('maglev:block:add', replaceSection)
|
25
27
|
window.addEventListener('maglev:block:move', replaceSection)
|
26
28
|
window.addEventListener('maglev:block:update', updateBlock)
|
@@ -71,10 +73,18 @@ const updateSection = (event) => {
|
|
71
73
|
const removeSection = (event) => {
|
72
74
|
const { sectionId } = event.detail
|
73
75
|
const selector = `[data-maglev-section-id='${sectionId}']`
|
74
|
-
|
76
|
+
const element = previewDocument.querySelector(selector)
|
75
77
|
element.remove()
|
76
78
|
}
|
77
79
|
|
80
|
+
const pingSection = (event) => {
|
81
|
+
const { sectionId } = event.detail
|
82
|
+
const selector = `[data-maglev-section-id='${sectionId}']`
|
83
|
+
const element = previewDocument.querySelector(selector)
|
84
|
+
// hack to force the highlighter bar to be updated with the correct dimensions
|
85
|
+
postMessage('scroll', { boundingRect: element.getBoundingClientRect() })
|
86
|
+
}
|
87
|
+
|
78
88
|
// === Block related actions ===
|
79
89
|
|
80
90
|
const updateBlock = (event) => {
|
data/lib/maglev/version.rb
CHANGED