mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
412fda10fd
When refactoring the playground to use es-modules, a script that loads owl as a non-module was forgotten in the head of the page and causes an error in the console, as the script is not declared as type="module" despite being an es-module. This script is also useless as owl is loaded by being imported by the counter component in the page. The importmap has also been moved to the head because of a bug in firefox where importmaps can fail to be taken into account if they are after a script that is not of type="module", see: https://bugzilla.mozilla.org/show_bug.cgi?id=1833371 Closes #1436
75 lines
3.1 KiB
HTML
75 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>OWL Framework</title>
|
|
<link rel="icon" href="data:,">
|
|
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
|
|
<link rel="stylesheet" href="assets/normalize.css">
|
|
<link rel="stylesheet" href="assets/milligram.css">
|
|
<link rel="stylesheet" href="assets/highlight.tomorrow.css">
|
|
<link rel="stylesheet" href="assets/main.css">
|
|
<script type="importmap">{ "imports": { "@odoo/owl": "./owl.js" } }</script>
|
|
</head>
|
|
<body>
|
|
<header class="container">
|
|
<img class="homepage-logo" src="assets/owl_1f989.png" alt="OWL Logo">
|
|
<hgroup>
|
|
<h1>OWL Framework</h1>
|
|
<p>Mysterious OWL: A web framework for structured, dynamic and maintainable applications</p>
|
|
</hgroup>
|
|
</header>
|
|
<nav class="container">
|
|
<p>
|
|
<a href="https://github.com/odoo/owl" title="https://github.com/odoo/owl">Github</a>
|
|
•
|
|
<a href="https://github.com/odoo/owl/blob/master/doc/readme.md">Documentation</a>
|
|
•
|
|
<a href="playground/">Playground</a>
|
|
</p>
|
|
</nav>
|
|
<main>
|
|
<article class="design">
|
|
<div class="container">
|
|
<h2>Why OWL?</h2>
|
|
<div class="row">
|
|
<section class="column">
|
|
<h3>XML based</h3>
|
|
<p>Templates are based on the XML format, which allows interesting applications. For example, they could be stored in a database and modified dynamically with <tt>xpaths</tt>.</p>
|
|
</section>
|
|
<section class="column">
|
|
<h3>Templates compiled in the browser</h3>
|
|
<p>This may not be a good fit for all applications, but if you need to generate dynamically user interfaces in the browser, this is very powerful. For example, a generic form view component could generate a specific form user interface for each various models, from a XML view.</p>
|
|
</section>
|
|
<section class="column">
|
|
<h3>No toolchain required</h3>
|
|
<p>This is extremely useful for some applications, if, for various reasons (security/deployment/dynamic modules/specific assets tools), it is not ok to use standard web tools based on <tt>npm</tt>.</p>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
<article class="example">
|
|
<div class="container">
|
|
<h2>Example</h2>
|
|
<div class="row">
|
|
<section class="column">
|
|
<pre><code class="javascript"></code></pre>
|
|
</section>
|
|
<section class="column">
|
|
<pre><code class="xml"></code></pre>
|
|
<div id="app-container"></div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</main>
|
|
<footer>
|
|
<p><a href=".">OWL</a> is licensed under LGPLv3.<br>Logo from <a href="https://github.com/googlefonts/noto-emoji">Google Noto Emoji Font</a>, licensed under Apache License 2.0</p>
|
|
</footer>
|
|
<script src="assets/highlight.pack.js"></script>
|
|
<script type="module" src="display_code.js"></script>
|
|
<script type="module" src="counter.js"></script>
|
|
</body>
|
|
</html>
|