[IMP] website: extract default website customize options into new theme_default module

This commit is contained in:
David Monjoie
2015-06-16 15:36:05 +02:00
parent 037269e9c3
commit a9a6aa7ca2
25 changed files with 237 additions and 231 deletions
-7
View File
@@ -2,13 +2,6 @@
<openerp>
<data>
<!-- Deactivate default website options before adding the theme ones -->
<template id="reset_default_options" inherit_id="website.default_options">
<xpath expr="//t[@id='default_options']" position="attributes">
<attribute name="t-if">False</attribute>
</xpath>
</template>
<template id="theme_customize" inherit_id="website.theme_customize" name="theme_customize Bootswatch">
<xpath expr="div" position="replace">
View File
+13
View File
@@ -0,0 +1,13 @@
{
'name': 'Default Website Theme',
'description': 'Default website theme to showcase customization possibilities.',
'category': 'Theme/Hidden',
'version': '1.0',
'author': 'Odoo S.A.',
'depends': ['website'],
'data': [
'views/templates.xml',
],
'application': False,
'auto_install': True,
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

+170
View File
@@ -0,0 +1,170 @@
<?xml version="1.0" encoding="utf-8"?>
<openerp>
<data>
<template id="customize_modal" inherit_id="website.theme_customize" name="treehouse Customize Modal" priority="1">
<xpath expr="div" position="replace">
<div id="theme_customize_modal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="loading_backdrop"></div>
<div class="modal-header text-center">
<button type="button" class="close">×</button>
<!-- <a class="btn btn-primary" href="/web#return_label=Website&amp;action=website.action_module_theme">Click here to change theme</a> -->
<hr style="margin: 20px -10px 10px -10px;"/>
<h4 class="modal-title">Customize this default theme</h4>
</div>
<div class="modal-body">
<h5 class="modal-h5">LAYOUT</h5>
<table name="layout">
<tr>
<td class=" text-center" width="50%">
<label class=" center-block">
<div class="text-center" style="background-image: url(/theme_default/static/src/img/theme/layout-full.gif); background-size: 100%; line-height: 40px;">FULL WIDTH</div>
<input name="layoutvar" type="radio" data-xmlid=""/>
</label>
</td>
<td class=" text-center">
<label class=" center-block">
<div class="text-center" style="background-image: url(/theme_default/static/src/img/theme/layout-boxed.gif); background-size: 100%; line-height: 40px;">BOXED</div>
<input name="layoutvar" type="radio" data-xmlid="theme_default.option_layout_boxed"/>
</label>
</td>
</tr>
</table>
<h5 class="modal-h5">MAIN COLOR</h5>
<table name="color">
<tr>
<td>
<label class="chd-color-combi">
<img src="/theme_default/static/src/img/theme/variant-stone.gif" alt="Stone" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid=""/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/theme_default/static/src/img/theme/variant-emerald.gif" alt="Emerald" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_emerald"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/theme_default/static/src/img/theme/variant-cobalt.gif" alt="Cobalt" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_cobalt"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/theme_default/static/src/img/theme/variant-amethyst.gif" alt="Amethyst" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_amethyst"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/theme_default/static/src/img/theme/variant-ruby.gif" alt="Blue" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_ruby"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/theme_default/static/src/img/theme/variant-gold.gif" alt="Gold" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_gold"/>
</label>
</td>
</tr>
</table>
<h5 class="modal-h5">FONTS COMBINATIONS</h5>
<table name="font">
<tr>
<td width="50%">
<label>
<div>
<span style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:11px">Helvetica</span>
<span style="font-family:Georgia, 'Times New Roman', Times, serif; font-size:11px" >/ Georgia</span>
</div>
<input name="theme" type="radio" data-xmlid=""/>
</label>
</td>
<td width="50%">
<label>
<div>
<span style="font-family:Georgia, 'Times New Roman', Times, serif; font-size:11px" >Georgia</span>
<span style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:11px">/ Helvetica</span>
<input name="theme" type="radio" data-xmlid="theme_default.option_font"/>
</div>
</label>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</xpath>
</template>
<template id="colors" name="Colors" inherit_id="website.assets_frontend">
<xpath expr="." position="inside">
<link rel="stylesheet" href='/theme_default/static/src/less/colors.less'/>
</xpath>
</template>
<!-- Option layout -->
<template id="option_layout_boxed" name="option_layout_boxed" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_layout_boxed.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<!-- Option color -->
<template id="option_color_stone" name="option_color_stone" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_color_stone.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_emerald" name="option_color_emerald" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_color_emerald.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_cobalt" name="option_color_cobalt" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_color_cobalt.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_amethyst" name="option_color_amethyst" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_color_amethyst.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_ruby" name="option_color_ruby" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_color_ruby.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_gold" name="option_color_gold" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_color_gold.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<!-- Option font -->
<template id="option_font" name="option_font" inherit_id="website.assets_frontend" active="False" customize_show="False">
<xpath expr="." position="inside">
<link href="/theme_default/static/src/less/option_font.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
</data>
</openerp>
-1
View File
@@ -21,7 +21,6 @@ OpenERP Website CMS
'views/website.backend.xml',
'views/website_views.xml',
'views/snippets.xml',
'views/themes.xml',
'views/res_config.xml',
'views/ir_actions.xml',
'views/website_backend_navbar.xml',
-221
View File
@@ -1,221 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<openerp>
<data>
<!--
Customize Themes
Use INPUT type 'checkbox' or 'radio' or use OPTION in select box
'data-xmlid' (optional) xml id of the template to add if the input is checked.
You can set a list of xml id separate by comma (all template is enable or
disable in same time)
'data-enable' (optional) to checked one or more HTML ids, or list separate by comma
'data-disable' (optional) to unchecked one or more HTML ids, or list separate by comma
'data-reload="/"' (optional) force the reloading of the page if the url match with
the string ( = regexp).
Otherwise, only the '/web/css/website.assets_frontend' is reloaded
For the sets (data-enable and/or data-disable without data-xmlid), the set is
automatically checked if:
- all related fields are enabled for data-enable
- all related fields are disabled for data-disable
else unchecked
HTML apply classes:
- 'checked': on the parent label when input is checked
- 'in': on the container (e.g.: bootstrap modal) after added in DOM (removed together
out is added)
- 'out': on the container 1 second before removed from ths DOM
- 'loading': on the container/modal when the new css is loading
-->
<template id="website.theme_customize" name="Theme Modal for Customization">
<div id="theme_customize_modal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<input id="less" type="checkbox" data-xmlid="website.option_bootstrap_less" style="display: none;"/>
<div class="loading_backdrop"></div>
<div class="modal-header text-center">
<button type="button" class="close">×</button>
<a class="btn btn-primary" href="/web#return_label=Website&amp;action=website.action_module_theme">Click here to change theme</a>
<hr style="margin: 20px -10px 10px -10px;"/>
<h4 class="modal-title">Customize this default theme</h4>
</div>
<div class="modal-body">
<h5 class="modal-h5">LAYOUT</h5>
<table name="layout">
<tr>
<td class=" text-center" width="50%">
<label class=" center-block">
<div class="text-center" style="background-image: url(/website/static/src/img/theme/layout-full.gif); background-size: 100%; line-height: 40px;">FULL WIDTH</div>
<input name="layoutvar" type="radio" data-xmlid=""/>
</label>
</td>
<td class=" text-center">
<label class=" center-block">
<div class="text-center" style="background-image: url(/website/static/src/img/theme/layout-boxed.gif); background-size: 100%; line-height: 40px;">BOXED</div>
<input name="layoutvar" type="radio" data-xmlid="website.option_layout_boxed" data-enable="less"/>
</label>
</td>
</tr>
</table>
<h5 class="modal-h5">MAIN COLOR</h5>
<table name="color">
<tr>
<td>
<label class="chd-color-combi">
<img src="/website/static/src/img/theme/variant-stone.gif" alt="Stone" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="" data-disable="less"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/website/static/src/img/theme/variant-emerald.gif" alt="Emerald" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="website.option_color_emerald" data-enable="less"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/website/static/src/img/theme/variant-cobalt.gif" alt="Cobalt" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="website.option_color_cobalt" data-enable="less"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/website/static/src/img/theme/variant-amethyst.gif" alt="Amethyst" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="website.option_color_amethyst" data-enable="less"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/website/static/src/img/theme/variant-ruby.gif" alt="Blue" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="website.option_color_ruby" data-enable="less"/>
</label>
</td>
<td>
<label class="chd-color-combi">
<img src="/website/static/src/img/theme/variant-gold.gif" alt="Gold" class="chd-color-combi-img"/>
<input name="colorvar" type="radio" data-xmlid="website.option_color_gold" data-enable="less"/>
</label>
</td>
</tr>
</table>
<h5 class="modal-h5">FONTS COMBINATIONS</h5>
<table name="font">
<tr>
<td width="50%">
<label>
<div>
<span style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:11px">Helvetica</span>
<span style="font-family:Georgia, 'Times New Roman', Times, serif; font-size:11px" >/ Georgia</span>
</div>
<input name="theme" type="radio" data-xmlid=""/>
</label>
</td>
<td width="50%">
<label>
<div>
<span style="font-family:Georgia, 'Times New Roman', Times, serif; font-size:11px" >Georgia</span>
<span style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:11px">/ Helvetica</span>
<input name="theme" type="radio" data-xmlid="website.option_font" data-enable="less"/>
</div>
</label>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</template>
<!-- color-picker -->
<!-- HTML class to hide option for one mode : only-text, only-bg -->
<template id="website.colorpicker" name="Color-Picker">
<table class="colorpicker">
<tr>
<td><button class="bg-primary" title="Primary Color"/></td>
<td><button class="bg-success" title="Success Color"/></td>
<td><button class="bg-info" title="Info Color"/></td>
<td><button class="bg-warning" title="Warning Color"/></td>
<td><button class="bg-danger" title="Danger Color"/></td>
</tr>
</table>
</template>
<!-- Theme -->
<!--
Group all option inside a t-if True named default_options, other theme will
set the t-if to False to disable all website options
-->
<template id="default_options" name="Default Customize Options" inherit_id="website.assets_frontend">
<xpath expr="//link[last()]" position="after">
<!-- Default options inherit from this view so we can easily disable it to reset all options -->
<t id="default_options" t-if="True"></t>
</xpath>
</template>
<!-- Option layout -->
<template id="option_layout_boxed" name="option_layout_boxed" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_layout_boxed.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<!-- Option color -->
<template id="option_color_stone" name="option_color_stone" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_color_stone.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_emerald" name="option_color_emerald" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_color_emerald.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_cobalt" name="option_color_cobalt" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_color_cobalt.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_amethyst" name="option_color_amethyst" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_color_amethyst.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_ruby" name="option_color_ruby" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_color_ruby.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<template id="option_color_gold" name="option_color_gold" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_color_gold.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
<!-- Option font -->
<template id="option_font" name="option_font" inherit_id="website.default_options" active="False" customize_show="False">
<xpath expr="//t[@id='default_options']" position="inside">
<link href="/website/static/src/less/option_font.less" rel="stylesheet" type="text/less"/>
</xpath>
</template>
</data>
</openerp>
+54 -2
View File
@@ -71,9 +71,7 @@
</template>
<template id="assets_frontend" name="Website assets">
<!-- Boostrap Fallback if server can't compute less files -->
<link id="bootstrap_css" rel="stylesheet" href='/website/static/src/less/import_bootstrap.less'/>
<link rel="stylesheet" href='/website/static/src/less/colors.less'/>
<link rel="stylesheet" href='/website/static/src/css/website.css'/>
@@ -469,6 +467,60 @@
</ul>
</template>
<!--
Customize Themes
Use INPUT type 'checkbox' or 'radio' or use OPTION in select box
'data-xmlid' (optional) xml id of the template to add if the input is checked.
You can set a list of xml id separate by comma (all template is enable or
disable in same time)
'data-enable' (optional) to checked one or more HTML ids, or list separate by comma
'data-disable' (optional) to unchecked one or more HTML ids, or list separate by comma
'data-reload="/"' (optional) force the reloading of the page if the url match with
the string ( = regexp).
Otherwise, only the '/web/css/website.assets_frontend' is reloaded
For the sets (data-enable and/or data-disable without data-xmlid), the set is
automatically checked if:
- all related fields are enabled for data-enable
- all related fields are disabled for data-disable
else unchecked
HTML apply classes:
- 'checked': on the parent label when input is checked
- 'in': on the container (e.g.: bootstrap modal) after added in DOM (removed together
out is added)
- 'out': on the container 1 second before removed from ths DOM
- 'loading': on the container/modal when the new css is loading
-->
<template id="website.theme_customize" name="Theme Modal for Customization">
<div id="theme_customize_modal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header text-center">
<h4 class="modal-title">Please install a theme in order to customize your website.</h4>
</div>
</div>
</div>
</div>
</template>
<!-- color-picker -->
<!-- HTML class to hide option for one mode : only-text, only-bg -->
<template id="website.colorpicker" name="Color-Picker">
<table class="colorpicker">
<tr>
<td><button class="bg-primary" title="Primary Color"/></td>
<td><button class="bg-success" title="Success Color"/></td>
<td><button class="bg-info" title="Info Color"/></td>
<td><button class="bg-warning" title="Warning Color"/></td>
<td><button class="bg-danger" title="Danger Color"/></td>
</tr>
</table>
</template>
<template id="kanban">
<t t-set="step"><t t-esc="step or 0"/></t>
<t t-set="scope"><t t-esc="scope or 0"/></t>