mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[IMP] owl: update to v0.13.0
This commit is contained in:
+30
-27
@@ -39,26 +39,32 @@ const DEFAULT_HTML = `<!DOCTYPE html>
|
||||
</html>
|
||||
`;
|
||||
|
||||
const APP_PY = `import sys
|
||||
import thread
|
||||
import webbrowser
|
||||
const APP_PY = `#!/usr/bin/env python3
|
||||
|
||||
import threading
|
||||
import time
|
||||
|
||||
import BaseHTTPServer, SimpleHTTPServer
|
||||
from http.server import SimpleHTTPRequestHandler, HTTPServer
|
||||
|
||||
def start_server():
|
||||
httpd = BaseHTTPServer.HTTPServer(('127.0.0.1', 3600), SimpleHTTPServer.SimpleHTTPRequestHandler)
|
||||
SimpleHTTPRequestHandler.extensions_map['.js'] = 'application/javascript'
|
||||
httpd = HTTPServer(('0.0.0.0', 3600), SimpleHTTPRequestHandler)
|
||||
httpd.serve_forever()
|
||||
|
||||
thread.start_new_thread(start_server,())
|
||||
url = 'http://127.0.0.1:3600'
|
||||
webbrowser.open_new(url)
|
||||
|
||||
while True:
|
||||
try:
|
||||
time.sleep(1)
|
||||
except KeyboardInterrupt:
|
||||
sys.exit(0)
|
||||
if __name__ == "__main__":
|
||||
print("Owl Application")
|
||||
print("---------------")
|
||||
print("Server running on: {}".format(url))
|
||||
threading.Thread(target=start_server, daemon=True).start()
|
||||
|
||||
while True:
|
||||
try:
|
||||
time.sleep(1)
|
||||
except KeyboardInterrupt:
|
||||
httpd.server_close()
|
||||
quit(0)
|
||||
`;
|
||||
|
||||
/**
|
||||
@@ -242,20 +248,20 @@ class App extends owl.Component {
|
||||
});
|
||||
}
|
||||
updateCode(ev) {
|
||||
this.state[ev.type] = ev.value;
|
||||
this.state[ev.detail.type] = ev.detail.value;
|
||||
}
|
||||
toggleLayout() {
|
||||
this.state.splitLayout = !this.state.splitLayout;
|
||||
}
|
||||
updatePanelHeight(ev) {
|
||||
if (!ev.delta) {
|
||||
if (!ev.detail.delta) {
|
||||
return;
|
||||
}
|
||||
let height = this.state.topPanelHeight;
|
||||
if (!height) {
|
||||
height = document.getElementsByClassName("tabbed-editor")[0].clientHeight;
|
||||
}
|
||||
this.state.topPanelHeight = height + ev.delta;
|
||||
this.state.topPanelHeight = height + ev.detail.delta;
|
||||
}
|
||||
|
||||
async downloadCode() {
|
||||
@@ -287,10 +293,11 @@ class TabbedEditor extends owl.Component {
|
||||
this.sessions[tab].setUndoManager(new ace.UndoManager());
|
||||
}
|
||||
}
|
||||
this.editor = null;
|
||||
}
|
||||
|
||||
mounted() {
|
||||
this.editor = ace.edit(this.refs.editor);
|
||||
this.editor = this.editor || ace.edit(this.refs.editor);
|
||||
|
||||
this.editor.setValue(this.props[this.state.currentTab], -1);
|
||||
this.editor.setFontSize("12px");
|
||||
@@ -314,20 +321,16 @@ class TabbedEditor extends owl.Component {
|
||||
const session = this.sessions[this.state.currentTab];
|
||||
session.setValue(this.props[this.state.currentTab], -1);
|
||||
this.editor.setSession(session);
|
||||
}
|
||||
|
||||
willUnmount() {
|
||||
this.editor.destroy();
|
||||
delete this.editor;
|
||||
this.editor.resize();
|
||||
}
|
||||
|
||||
setTab(tab) {
|
||||
if (this.state.currentTab !== tab) {
|
||||
this.state.currentTab = tab;
|
||||
const session = this.sessions[this.state.currentTab];
|
||||
session.doc.setValue(this.props[tab], -1);
|
||||
this.editor.setSession(session);
|
||||
}
|
||||
if (this.state.currentTab !== tab) {
|
||||
this.state.currentTab = tab;
|
||||
const session = this.sessions[this.state.currentTab];
|
||||
session.doc.setValue(this.props[tab], -1);
|
||||
this.editor.setSession(session);
|
||||
}
|
||||
}
|
||||
|
||||
onMouseDown(ev) {
|
||||
|
||||
@@ -185,4 +185,6 @@ body {
|
||||
font-size: 30px;
|
||||
color: darkred;
|
||||
text-align: center;
|
||||
padding-left: 30px;
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
@@ -85,7 +85,7 @@ const WIDGET_COMPOSITION_XML = `<templates>
|
||||
|
||||
<div t-name="App">
|
||||
<t t-widget="ClickCounter"/>
|
||||
<t t-widget="InputWidget" t-props="{reverse: true}"/>
|
||||
<t t-widget="InputWidget" reverse="true"/>
|
||||
</div>
|
||||
</templates>`;
|
||||
|
||||
@@ -287,7 +287,7 @@ const LIFECYCLE_DEMO_XML = `<templates>
|
||||
<button t-on-click="increment">Increment</button>
|
||||
<button t-on-click="toggleSubWidget">ToggleSubWidget</button>
|
||||
<div t-if="state.flag">
|
||||
<t t-widget="HookWidget" t-props="{n:state.n}"/>
|
||||
<t t-widget="HookWidget" n="state.n"/>
|
||||
</div>
|
||||
</div>
|
||||
<div t-name="HookWidget" t-on-click="increment">Demo Sub Widget. Props: <t t-esc="props.n"/>. State: <t t-esc="state.n"/>. (click on me to update me)</div>
|
||||
@@ -515,7 +515,7 @@ const TODO_APP_STORE_XML = `<templates>
|
||||
<label for="toggle-all"></label>
|
||||
<ul class="todo-list">
|
||||
<t t-foreach="visibleTodos" t-as="todo">
|
||||
<t t-widget="TodoItem" t-key="todo.id" t-props="todo"/>
|
||||
<t t-widget="TodoItem" t-key="todo.id" id="todo.id" completed="todo.completed" title="todo.title"/>
|
||||
</t>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
+12
-10
@@ -11,7 +11,9 @@
|
||||
</div>
|
||||
|
||||
<div t-name="App" class="playground">
|
||||
<div class="left-bar" t-att-style="leftPaneStyle" t-att-class="{split: state.splitLayout}">
|
||||
<div class="left-bar" t-att-class="{split: state.splitLayout}"
|
||||
t-att-style="leftPaneStyle"
|
||||
t-on-updateCode="updateCode">
|
||||
<div class="menubar">
|
||||
<a class="btn run-code flash" t-on-click="runCode" title="Execute this Code">▶ Run</a>
|
||||
<select t-on-change="setSample">
|
||||
@@ -22,20 +24,20 @@
|
||||
<a class="btn flash" t-on-click="downloadCode" title="Download a Zip with this Code"><i class="fas fa-download"></i></a>
|
||||
<a class="layout-selector flash" t-on-click="toggleLayout" title="Toggle Layout"><i class="fas" t-att-class="state.splitLayout ? 'fa-toggle-on' : 'fa-toggle-off'"></i></a>
|
||||
</div>
|
||||
<t t-widget="TabbedEditor"
|
||||
js="state.js"
|
||||
css="!state.splitLayout and state.css"
|
||||
xml="!state.splitLayout and state.js"
|
||||
t-att-style="topEditorStyle"/>
|
||||
<t t-if="state.splitLayout">
|
||||
<t t-widget="TabbedEditor"
|
||||
t-props="{js:state.js, css:false, xml: false}"
|
||||
t-on-updateCode="updateCode"
|
||||
t-att-style="topEditorStyle"/>
|
||||
<div class="separator horizontal"/>
|
||||
<t t-widget="TabbedEditor" t-keepalive="1"
|
||||
t-props="{js:false, css:state.css, xml: state.xml, resizeable: true}"
|
||||
t-on-updateCode="updateCode"
|
||||
js="false"
|
||||
css="state.css"
|
||||
xml="state.xml"
|
||||
resizeable="true"
|
||||
t-on-updatePanelHeight="updatePanelHeight"/>
|
||||
</t>
|
||||
<t t-else="1">
|
||||
<t t-widget="TabbedEditor" t-props="{js:state.js, css:state.css, xml: state.xml, display: 'js|xml|css'}" t-on-updateCode="updateCode"/>
|
||||
</t>
|
||||
</div>
|
||||
<div class="separator vertical" t-on-mousedown="onMouseDown"/>
|
||||
<div class="right-pane" t-att-style="rightPaneStyle">
|
||||
|
||||
Reference in New Issue
Block a user