NextERP/owl
2
0
Fork 0
mirror of https://github.com/odoo/owl.git synced 2025-10-06 19:59:41 +07:00
Code Issues Packages Projects Releases Wiki Activity

imp: remove need for playground-iframe.html file

Browse Source
This commit is contained in:
Géry Debongnie
2019-03-29 13:44:21 +01:00
parent 9477faa52a
commit 064baedff8
3 changed files with 25 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
playground-iframe.html
-11
View File
@@ -1,11 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="libs/owl.js"></script>
</head>
<body>
</body>
</html>
src/playground.js
+12 -7
View File
@@ -62,23 +62,28 @@ class Playground extends Component {
runCode() { runCode() {
this.updateStateFromEditor(); this.updateStateFromEditor();
// inject js // create iframe
const iframe = document.createElement("iframe"); const iframe = document.createElement("iframe");
iframe.src = "playground-iframe.html";
iframe.onload = () => { iframe.onload = () => {
const doc = iframe.contentWindow.document; const doc = iframe.contentWindow.document;
const script = doc.createElement("script"); // inject js
script.type = "text/javascript"; const owlScript = doc.createElement("script");
script.innerHTML = this.state.js; owlScript.type = "text/javascript";
doc.body.appendChild(script); owlScript.src = "libs/owl.js";
owlScript.addEventListener("load", () => {
const script = doc.createElement("script");
script.type = "text/javascript";
script.innerHTML = this.state.js;
doc.body.appendChild(script);
});
doc.head.appendChild(owlScript);
// inject css // inject css
const style = document.createElement("style"); const style = document.createElement("style");
style.innerHTML = this.state.css; style.innerHTML = this.state.css;
doc.head.appendChild(style); doc.head.appendChild(style);
}; };
this.refs.content.innerHTML = ""; this.refs.content.innerHTML = "";
this.refs.content.appendChild(iframe); this.refs.content.appendChild(iframe);
} }
src/samples.js
+13 -13
View File
@@ -97,14 +97,14 @@ for (let i = 1; i < 16000; i++) {
// Counter Widget // Counter Widget
//------------------------------------------------------------------------------ //------------------------------------------------------------------------------
class Counter extends owl.core.Component { class Counter extends owl.core.Component {
inlineTemplate = \`
<div>
<button t-on-click="increment(-1)">-</button>
<span style="font-weight:bold">Value: <t t-esc="state.counter"/></span>
<button t-on-click="increment(1)">+</button>
</div>\`;
constructor(parent, props) { constructor(parent, props) {
super(parent, props); super(parent, props);
this.inlineTemplate = \`
<div>
<button t-on-click="increment(-1)">-</button>
<span style="font-weight:bold">Value: <t t-esc="state.counter"/></span>
<button t-on-click="increment(1)">+</button>
</div>\`;
this.state = { this.state = {
counter: props.initialState || 0 counter: props.initialState || 0
}; };
@@ -119,16 +119,16 @@ class Counter extends owl.core.Component {
// Message Widget // Message Widget
//------------------------------------------------------------------------------ //------------------------------------------------------------------------------
class Message extends owl.core.Component { class Message extends owl.core.Component {
inlineTemplate = \`
<div class="message">
<span class="author"><t t-esc="props.author"/></span>
<span class="msg"><t t-esc="props.msg"/></span>
<button class="remove" t-on-click="removeMessage">Remove</button>
<t t-widget="Counter" t-props="{initialState: props.id}"/>
</div>\`;
constructor(parent, props) { constructor(parent, props) {
super(parent, props); super(parent, props);
this.inlineTemplate = \`
<div class="message">
<span class="author"><t t-esc="props.author"/></span>
<span class="msg"><t t-esc="props.msg"/></span>
<button class="remove" t-on-click="removeMessage">Remove</button>
<t t-widget="Counter" t-props="{initialState: props.id}"/>
</div>\`;
this.widgets = { Counter }; this.widgets = { Counter };
} }