|
|
|
@ -36,11 +36,9 @@ export class Page extends HTMLElement { |
|
|
|
super() |
|
|
|
const shadow = this.attachShadow({mode: 'open'}) |
|
|
|
this.textArea = document.createElement('textarea') |
|
|
|
this.header = document.createElement('h1') |
|
|
|
this.textArea.addEventListener('input', e => { |
|
|
|
const path = this.getAttribute('path') |
|
|
|
localStorage.setItem( |
|
|
|
path, |
|
|
|
this.path, |
|
|
|
e.target.value |
|
|
|
) |
|
|
|
}) |
|
|
|
@ -51,10 +49,9 @@ export class Page extends HTMLElement { |
|
|
|
} |
|
|
|
|
|
|
|
connectedCallback() { |
|
|
|
const path = this.getAttribute('path') |
|
|
|
this.header.innerText = path |
|
|
|
this.textArea.value = localStorage.getItem( |
|
|
|
path |
|
|
|
this.path |
|
|
|
) ?? '' |
|
|
|
const style = document.createElement('style') |
|
|
|
style.textContent = ` |
|
|
|
@ -64,8 +61,11 @@ export class Page extends HTMLElement { |
|
|
|
font-family: sans-serif; |
|
|
|
} |
|
|
|
textarea { |
|
|
|
width: 94vw; |
|
|
|
height: 45vh; |
|
|
|
width: 100%; |
|
|
|
margin: 0 5px; |
|
|
|
padding: 5px; |
|
|
|
|
|
|
|
height: 50vh; |
|
|
|
} |
|
|
|
iframe { |
|
|
|
border: none; |
|
|
|
@ -74,7 +74,7 @@ export class Page extends HTMLElement { |
|
|
|
} |
|
|
|
` |
|
|
|
this.shadowRoot.append(style) |
|
|
|
if (path.startsWith('/sandbox/')) { |
|
|
|
if (this.path.startsWith('/sandbox/')) { |
|
|
|
this.initFrame() |
|
|
|
} |
|
|
|
} |
|
|
|
|