macchiato
/
pages
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Prevent having to press back button twice

file-group-page
bat 3 years ago
parent
2a48c53875
commit
04c70bb6c5
1 changed files with 21 additions and 16 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 37
      components/page.js

37
components/page.js
View File

@ -16,16 +16,24 @@ const frameHtml = `<!doctype html>
</style> </style>
</head> </head>
<body> <body>
<iframe srcdoc="" sandbox="allow-scripts allow-top-navigation"></iframe>
${'<'}script type="module"> ${'<'}script type="module">
const frame = document.getElementsByTagName('iframe')[0] let frame = undefined
addEventListener('message', event => { addEventListener('message', event => {
let isNew = false
const d = event.data const d = event.data
if (Array.isArray(d) && d[0] === 'srcdoc') { if (Array.isArray(d) && d[0] === 'srcdoc') {
isNew = frame === undefined
if (isNew) {
frame = document.createElement('iframe')
frame.sandbox = "allow-scripts allow-top-navigation"
}
frame.srcdoc = d[1] frame.srcdoc = d[1]
} else { } else if (frame !== undefined) {
frame.postMessage(event.data) frame.postMessage(event.data)
} }
if (isNew) {
document.body.appendChild(frame)
}
}) })
${'</'}script> ${'</'}script>
</body> </body>
@ -88,30 +96,27 @@ export class Page extends HTMLElement {
initFrame() { initFrame() {
const wrap = document.createElement('div') const wrap = document.createElement('div')
this.shadowRoot.appendChild(wrap) this.shadowRoot.appendChild(wrap)
const tmp = document.createElement('iframe') const frame = document.createElement('iframe')
if (this.csp !== undefined) { if (this.csp !== undefined) {
tmp.sandbox = "allow-same-origin allow-scripts allow-top-navigation" frame.sandbox = "allow-same-origin allow-scripts allow-top-navigation"
const url = new URL( const url = new URL(
'/-/frame', location.href '/-/frame', location.href
) )
url.searchParams.set('csp', this.csp) url.searchParams.set('csp', this.csp)
url.searchParams.set('html', frameHtml) url.searchParams.set('html', frameHtml)
tmp.src = url.href frame.src = url.href
} else { } else {
tmp.sandbox = "allow-scripts" frame.sandbox = "allow-scripts allow-top-navigation"
tmp.srcdoc = frameHtml frame.srcdoc = frameHtml
} }
wrap.insertAdjacentHTML( frame.addEventListener('load', () => {
'beforeend', tmp.outerHTML this.display(this.body)
) })
const frames = wrap.getElementsByTagName('iframe') wrap.appendChild(frame)
this.frame = frames[frames.length - 1] this.frame = frame
this.textArea.addEventListener('blur', e => { this.textArea.addEventListener('blur', e => {
this.display(e.target.value) this.display(e.target.value)
}) })
this.frame.addEventListener('load', () => {
this.display(this.body)
})
} }
display(value) { display(value) {

Write Preview
Loading…
Cancel
Save