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

work on demo app, add demo:dev command

Browse Source
This commit is contained in:
Géry Debongnie
2019-01-21 23:08:03 +01:00
parent a357ff6b37
commit 82490b2099
7 changed files with 103 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
demo/app.scss
+48
View File
@@ -0,0 +1,48 @@
html {
height: 100%;
}
body {
height: 100%;
margin: 0;
font-family: sans-serif;
}
/* Web Client */
.o_web_client {
height: 100%;
display: grid;
grid-template-rows: 40px auto;
}
/* Navbar */
.o_navbar {
background-color: #875A7B;
color: white;
display: flex;
span.title {
font-size: 22px;
font-weight: bold;
padding: 8px;
}
ul {
list-style-type: none;
display: inline-flex;
height: 100%;
margin: 0;
}
li {
padding: 8px 12px;
font-size: 20px;
}
a {
color: white;
text-decoration: none;
}
}
demo/index.html
+1 -1
View File
@@ -5,11 +5,11 @@
<title>Odoo Web Core Demo</title>
<script src="almond.js"></script>
<script src="main.js"></script>
<link rel="stylesheet" href="app.css">
<script>
require('main');
</script>
</head>
<body>
<div id="app"></div>
</body>
</html>
demo/src/Navbar.ts
+20
View File
@@ -0,0 +1,20 @@
import Widget from "../../src/core/widget";
const template = `
<div class="o_navbar">
<span class="title">Odoo</span>
<ul>
<li t-foreach="state.items" t-as="item">
<a href="someaction"><t t-esc="item.title"/></a>
</li>
</ul>
</div>
`;
export default class Navbar extends Widget {
name = "navbar";
template = template;
state = {
items: [{title: 'Discuss'}, {title: 'CRM'}]
};
}
demo/src/RootWidget.ts
+18 -14
View File
@@ -1,27 +1,31 @@
import Widget from "../../src/core/widget";
import Counter from "./Counter";
import Navbar from "./Navbar";
const template = `
<div>
<span>Root Widget</span>
<button t-on-click="resetCounter">Reset</button>
<button t-on-click="resetCounterAsync">Reset in 3s</button>
<button t-on-click="toggle">Toggle Counter</button>
<input/>
<t t-if="state.validcounter">
<t t-widget="Counter" t-ref="counter" t-props="{initialState:4}"/>
</t>
<t t-else="1">
<t t-widget="Counter" t-ref="counter" t-props="{initialState:7}"/>
</t>
<div ref="target"/>
<div class="o_web_client">
<t t-widget="Navbar"/>
<div class="o_content">
<span>Root Widget</span>
<button t-on-click="resetCounter">Reset</button>
<button t-on-click="resetCounterAsync">Reset in 3s</button>
<button t-on-click="toggle">Toggle Counter</button>
<input/>
<t t-if="state.validcounter">
<t t-widget="Counter" t-ref="counter" t-props="{initialState:4}"/>
</t>
<t t-else="1">
<t t-widget="Counter" t-ref="counter" t-props="{initialState:7}"/>
</t>
<div ref="target"/>
</div>
</div>
`;
export default class RootWidget extends Widget {
name = "root";
template = template;
widgets = { Counter };
widgets = { Counter, Navbar };
state = { validcounter: true};
resetCounter(ev: MouseEvent) {
demo/src/main.ts
+1 -14
View File
@@ -1,23 +1,10 @@
///<amd-module name="main" />
// import QWeb from "../../src/core/qweb_vdom";
// import {init} from "../../src/libs/snabbdom/src/snabbdom"
// import h from "../../src/libs/snabbdom/src/h"
// import sdProps from "../../src/libs/snabbdom/src/modules/props"
// import sdListeners from "../../src/libs/snabbdom/src/modules/eventlisteners"
// const patch = init([sdProps, sdListeners]);
// (<any>window).h = h;
// (<any>window).patch = patch;
// (<any>window).QWeb = QWeb;
// import Counter from "./Counter";
import RootWidget from "./RootWidget";
import env from "./env";
document.addEventListener("DOMContentLoaded", async function() {
const rootWidget = new RootWidget(null);
rootWidget.setEnvironment(env);
const mainDiv = document.getElementById("app")!;
await rootWidget.mount(mainDiv);
await rootWidget.mount(document.body);
});