Skip to content

Commit f40ca0d

Browse files
committed
[REF] website_sale: convert page options* to owl
*: all products, checkout, product, header checkout button task-3850413
1 parent a33163a commit f40ca0d

File tree

12 files changed

+735
-630
lines changed

12 files changed

+735
-630
lines changed

addons/website_sale/__manifest__.py

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,6 @@
9191
'website_sale/static/src/js/website_sale_price_range_option.js',
9292
'website_sale/static/src/js/website_sale_product_configurator.js',
9393
'website_sale/static/src/js/website_sale_utils.js',
94-
'website_sale/static/src/xml/website_sale_utils.xml',
9594
'website_sale/static/src/js/website_sale_recently_viewed.js',
9695
'website_sale/static/src/js/website_sale_tracking.js',
9796
'website/static/lib/multirange/multirange_custom.js',
@@ -135,6 +134,12 @@
135134
],
136135
'website.assets_wysiwyg': [
137136
'website_sale/static/src/scss/website_sale.editor.scss',
137+
'website_sale/static/src/js/editor/snippets.options.js',
138+
'website_sale/static/src/js/editor/snippets.options.xml',
139+
'website_sale/static/src/js/editor/pages/all_products/options.xml',
140+
'website_sale/static/src/js/editor/pages/checkout/options.js',
141+
'website_sale/static/src/js/editor/pages/checkout/options.xml',
142+
'website_sale/static/src/js/editor/pages/product/options.xml',
138143
'website_sale/static/src/snippets/s_dynamic_snippet_products/options.js',
139144
'website_sale/static/src/snippets/s_dynamic_snippet_products/options.xml',
140145
'website_sale/static/src/snippets/s_add_to_cart/options.js',
@@ -146,7 +151,6 @@
146151
],
147152
'website.assets_editor': [
148153
'website_sale/static/src/js/systray_items/*.js',
149-
'website_sale/static/src/xml/website_sale_utils.xml',
150154
],
151155
'website.backend_assets_all_wysiwyg': [
152156
'website_sale/static/src/js/components/wysiwyg_adapter/wysiwyg_adapter.js',

addons/website_sale/static/src/js/components/wysiwyg_adapter/wysiwyg_adapter.js

Lines changed: 47 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,53 @@ patch(WysiwygAdapterComponent.prototype, {
2626
this.deletedRibbonClasses = '';
2727
this.ribbonPositionClasses = {'left': 'o_ribbon_left', 'right': 'o_ribbon_right'};
2828
},
29+
/**
30+
* Returns a copy of this.ribbons.
31+
*/
32+
getRibbons() {
33+
return Object.assign({}, this.ribbons);
34+
},
35+
/**
36+
* Returns all ribbon classes, current and deleted, so they can be removed.
37+
*/
38+
getRibbonClasses() {
39+
return Object.values(this.ribbons).reduce((classes, ribbon) => {
40+
return classes + ` ${this.ribbonPositionClasses[ribbon.position]}`;
41+
}, '') + this.deletedRibbonClasses;
42+
},
43+
/**
44+
* Deletes a ribbon.
45+
*
46+
* @param {number} id - The id of the ribbon to delete.
47+
*/
48+
deleteRibbon(id) {
49+
this.deletedRibbonClasses += ` ${
50+
this.ribbonPositionClasses[this.ribbons[id].position]
51+
}`;
52+
delete this.ribbons[id];
53+
},
54+
/**
55+
* Sets a ribbon.
56+
*
57+
* @param {Object} ribbon
58+
* @property {number} ribbon.id
59+
*/
60+
setRibbon(ribbon) {
61+
const previousRibbon = this.ribbons[ribbon.id];
62+
if (previousRibbon) {
63+
this.deletedRibbonClasses += ` ${this.ribbonPositionClasses[previousRibbon.position]}`;
64+
}
65+
this.ribbons[ribbon.id] = ribbon;
66+
},
67+
/**
68+
* Sets which ribbon is used by a product template.
69+
*
70+
* @param {number} templateId - The product template's id.
71+
* @param {number|false} ribbonId - The ribbon's id.
72+
*/
73+
setProductRibbon(templateId, ribbonId) {
74+
this.productTemplatesRibbons.push({templateId, ribbonId});
75+
},
2976
/**
3077
* @override
3178
*/
@@ -131,75 +178,6 @@ patch(WysiwygAdapterComponent.prototype, {
131178
// Handlers
132179
//--------------------------------------------------------------------------
133180

134-
/**
135-
* Returns a copy of this.ribbons through a callback.
136-
*
137-
* @private
138-
*/
139-
_onGetRibbons(ev) {
140-
ev.data.callback(Object.assign({}, this.ribbons));
141-
},
142-
/**
143-
* Returns all ribbon classes, current and deleted, so they can be removed.
144-
*
145-
* @private
146-
*/
147-
_onGetRibbonClasses(ev) {
148-
const classes = Object.values(this.ribbons).reduce((classes, ribbon) => {
149-
return classes + ` ${this.ribbonPositionClasses[ribbon.position]}`;
150-
}, '') + this.deletedRibbonClasses;
151-
ev.data.callback(classes);
152-
},
153-
/**
154-
* Deletes a ribbon.
155-
*
156-
* @private
157-
*/
158-
_onDeleteRibbon(ev) {
159-
this.deletedRibbonClasses += ` ${
160-
this.ribbonPositionClasses[this.ribbons[ev.data.id].position]
161-
}`;
162-
delete this.ribbons[ev.data.id];
163-
},
164-
/**
165-
* Sets a ribbon;
166-
*
167-
* @private
168-
*/
169-
_onSetRibbon(ev) {
170-
const {ribbon} = ev.data;
171-
const previousRibbon = this.ribbons[ribbon.id];
172-
if (previousRibbon) {
173-
this.deletedRibbonClasses += ` ${this.ribbonPositionClasses[previousRibbon.position]}`;
174-
}
175-
this.ribbons[ribbon.id] = ribbon;
176-
},
177-
/**
178-
* Sets which ribbon is used by a product template.
179-
*
180-
* @private
181-
*/
182-
_onSetProductRibbon(ev) {
183-
const {templateId, ribbonId} = ev.data;
184-
this.productTemplatesRibbons.push({templateId, ribbonId});
185-
},
186-
/**
187-
* @override
188-
*/
189-
_trigger_up(ev) {
190-
const methods = {
191-
get_ribbons: this._onGetRibbons.bind(this),
192-
get_ribbon_classes: this._onGetRibbonClasses.bind(this),
193-
delete_ribbon: this._onDeleteRibbon.bind(this),
194-
set_ribbon: this._onSetRibbon.bind(this),
195-
set_product_ribbon: this._onSetProductRibbon.bind(this),
196-
}
197-
if (methods[ev.name]) {
198-
return methods[ev.name](ev);
199-
} else {
200-
return super._trigger_up(...arguments);
201-
}
202-
},
203181
// TODO this whole patch actually seems unnecessary. The bug it solved seems
204182
// to stay solved if this is removed. To investigate.
205183
/**
Lines changed: 223 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,223 @@
1+
<?xml version="1.0" encoding="UTF-8" ?>
2+
<templates xml:space="preserve">
3+
4+
<!-- All products page -->
5+
<t t-name="website_sale.WebsiteSaleGridLayout">
6+
<WeSelect title.translate="Layout" noPreview="'true'" reload="'/'">
7+
<WeButton customizeWebsiteViews="''" name="'grid_view_opt'">Grid</WeButton>
8+
<WeButton customizeWebsiteViews="'website_sale.products_list_view'">List</WeButton>
9+
</WeSelect>
10+
<WeRow title.translate="Size" class="'o_we_sublevel_1'">
11+
<WeInput setPpg="''" step="'1'" noPreview="'true'" reload="'/'"/>
12+
<span class="'mx-2 o_wsale_ppr_by'" t-att-class="{'d-none': renderContext.isListLayoutEnabled}">by</span>
13+
<WeSelect class="'o_wsale_ppr_submenu' + (renderContext.isListLayoutEnabled ? ' d-none' : '')"
14+
dependencies="'grid_view_opt'"
15+
noPreview="'true'"
16+
reload="'/'">
17+
<WeButton setPpr="'2'">2</WeButton>
18+
<WeButton setPpr="'3'">3</WeButton>
19+
<WeButton setPpr="'4'">4</WeButton>
20+
</WeSelect>
21+
</WeRow>
22+
<WeSelect title.translate="Style" class="'o_we_sublevel_1'">
23+
<WeButton selectClass="`''`"
24+
customizeWebsiteViews="''">
25+
Default
26+
</WeButton>
27+
<WeButton selectClass="`'o_wsale_design_cards'`"
28+
customizeWebsiteViews="'website_sale.products_design_card'">
29+
Cards
30+
</WeButton>
31+
<WeButton selectClass="`'o_wsale_design_thumbs'`"
32+
customizeWebsiteViews="'website_sale.products_design_thumbs'">
33+
Thumbnails
34+
</WeButton>
35+
<WeButton selectClass="`'o_wsale_design_grid'`"
36+
customizeWebsiteViews="'website_sale.products_design_grid'">
37+
Grid
38+
</WeButton>
39+
</WeSelect>
40+
<WeSelect title.translate="Images Size" class="'o_we_sublevel_1'">
41+
<WeButton selectClass="`'o_wsale_context_thumb_4_3'`"
42+
customizeWebsiteViews="'website_sale.products_thumb_4_3'">
43+
Landscape (4/3)
44+
</WeButton>
45+
<WeButton selectClass="`''`"
46+
customizeWebsiteViews="''">
47+
Default (1/1)
48+
</WeButton>
49+
<WeButton selectClass="`'o_wsale_context_thumb_4_5'`"
50+
customizeWebsiteViews="'website_sale.products_thumb_4_5'">
51+
Portrait (4/5)
52+
</WeButton>
53+
<WeButton selectClass="`'o_wsale_context_thumb_2_3'`"
54+
customizeWebsiteViews="'website_sale.products_thumb_2_3'">
55+
Vertical (2/3)
56+
</WeButton>
57+
</WeSelect>
58+
<WeButtonGroup title.translate="Fill" class="'o_we_sublevel_2'" variable="'thumb_size'">
59+
<WeButton selectClass="`''`"
60+
img="'/website/static/src/img/snippets_options/content_width_normal.svg'"
61+
customizeWebsiteViews="''">
62+
</WeButton>
63+
<WeButton selectClass="`'o_wsale_context_thumb_cover'`"
64+
name="'thumb_cover'"
65+
variable="'thumb_cover'"
66+
img="'/website/static/src/img/snippets_options/content_width_full.svg'"
67+
customizeWebsiteViews="'website_sale.products_thumb_cover'">
68+
</WeButton>
69+
</WeButtonGroup>
70+
<WeCheckbox title.translate="Search Bar"
71+
customizeWebsiteViews="'website_sale.search'"
72+
noPreview="'true'"
73+
reload="'/'"/>
74+
<WeCheckbox title.translate="Prod. Desc."
75+
customizeWebsiteViews="'website_sale.products_description'"
76+
noPreview="'true'"
77+
reload="'/'"/>
78+
<WeRow title.translate="Categories" id="o_wsale_grid_left_panel" variable="'filmstrip'">
79+
<WeButton customizeWebsiteViews="'website_sale.products_categories'"
80+
name="'categories_opt'"
81+
noPreview="'true'"
82+
reload="'/'">
83+
Left
84+
</WeButton>
85+
<WeButton customizeWebsiteViews="'website_sale.products_categories_top'"
86+
name="'categories_opt_top'"
87+
noPreview="'true'"
88+
reload="'/'">
89+
Top
90+
</WeButton>
91+
</WeRow>
92+
<WeCheckbox title.translate="Collapse Category Recursive"
93+
id="collapse_category_recursive"
94+
class="'o_we_sublevel_1'"
95+
customizeWebsiteViews="'website_sale.option_collapse_products_categories'"
96+
dependencies="'categories_opt'"
97+
noPreview="'true'"
98+
reload="'/'"/>
99+
<WeRow title.translate="Attributes" class="'o_we_full_row'">
100+
<WeButton customizeWebsiteViews="'website_sale.products_attributes'"
101+
name="'attributes_opt'"
102+
noPreview="'true'"
103+
reload="'/'">
104+
Left
105+
</WeButton>
106+
<WeButton customizeWebsiteViews="'website_sale.products_attributes_top'"
107+
name="'attributes_opt_top'"
108+
noPreview="'true'"
109+
reload="'/'">
110+
Top
111+
</WeButton>
112+
</WeRow>
113+
<WeCheckbox title.translate="Price Filter"
114+
class="'o_we_sublevel_1'"
115+
customizeWebsiteViews="'website_sale.filter_products_price'"
116+
dependencies="'attributes_opt, attributes_opt_top'"
117+
noPreview="'true'"
118+
reload="'/'"/>
119+
<WeCheckbox title.translate="Product Tags Filter"
120+
class="'o_we_sublevel_1'"
121+
customizeWebsiteViews="'website_sale.filter_products_tags'"
122+
dependencies="'attributes_opt, attributes_opt_top'"
123+
noPreview="'true'"
124+
reload="'/'"/>
125+
<WeRow title.translate="Top Bar" class="'o_we_full_row'">
126+
<WeButton customizeWebsiteViews="'website_sale.sort'"
127+
noPreview="'true'"
128+
reload="'/'">
129+
Sort by
130+
</WeButton>
131+
<WeButton customizeWebsiteViews="'website_sale.add_grid_or_list_option'"
132+
noPreview="'true'"
133+
reload="'/'">
134+
Layout
135+
</WeButton>
136+
</WeRow>
137+
<WeSelect title.translate="Default Sort" class="'o_wsale_sort_submenu'" noPreview="'true'" reload="'/'">
138+
<t t-foreach="renderContext.productSorts" t-as="query_and_label" t-key="query_and_label[0]">
139+
<WeButton setDefaultSort="query_and_label[0]"><t t-esc="query_and_label[1]"/></WeButton>
140+
</t>
141+
</WeSelect>
142+
<WeRow title.translate="Buttons" class="'o_we_full_row'">
143+
<WeButton tooltip.translate="Add to Cart"
144+
class="'fa fa-fw fa-shopping-cart o_we_add_to_cart_btn'"
145+
customizeWebsiteViews="'website_sale.products_add_to_cart'"
146+
noPreview="'true'"
147+
reload="'/'"/>
148+
</WeRow>
149+
</t>
150+
<!-- Product -->
151+
<t t-name="website_sale.WebsiteSaleProductsItem">
152+
<div class="o_wsale_soptions_menu_sizes" t-att-class="{'d-none': renderContext.isListLayoutEnabled}">
153+
<WeRow title.translate="Size">
154+
<div class="oe_size_table">
155+
<t t-foreach="[...Array(renderContext.ppr).keys()]" t-as="y" t-key="y">
156+
<div class="oe_size_row">
157+
<t t-foreach="[...Array(renderContext.ppr).keys()]" t-as="x" t-key="x">
158+
<WeButton setProductSize="`${x + 1},${y + 1}`"
159+
class="'oe_size_cell' + (x + 1 lte renderContext.selectedSize.x and y + 1 lte renderContext.selectedSize.y ? ' selected' : '')"/>
160+
</t>
161+
</div>
162+
</t>
163+
</div>
164+
</WeRow>
165+
</div>
166+
167+
<WeRow title.translate="Re-order">
168+
<WeButton tooltip.translate="Push to top" changeSequence="'top'" noPreview="'true'" class="'fa fa-fw fa-angle-double-left'"/>
169+
<WeButton tooltip.translate="Push up" changeSequence="'up'" noPreview="'true'" class="'fa fa-fw fa-angle-left'"/>
170+
<WeButton tooltip.translate="Push down" changeSequence="'down'" noPreview="'true'" class="'fa fa-fw fa-angle-right'"/>
171+
<WeButton tooltip.translate="Push to bottom" changeSequence="'bottom'" noPreview="'true'" class="'fa fa-fw fa-angle-double-right'"/>
172+
</WeRow>
173+
174+
<WeRow>
175+
<WeSelect title.translate="Ribbon" class="'o_wsale_ribbon_select'">
176+
<WeButton setRibbon="''" name="'no_ribbon_opt'">None</WeButton>
177+
<t t-foreach="renderContext.ribbons" t-as="id" t-key="id">
178+
<t t-set="ribbon" t-value="renderContext.ribbons[id]"/>
179+
<WeButton setRibbon="ribbon.id?.toString() || ''">
180+
<t t-out="ribbon.name"/>
181+
<i t-attf-class="fa fa-arrow-#{ribbon.position === 'left' ? 'left' : 'right'} ms-1"/>
182+
<span
183+
t-attf-class="o_wsale_color_preview ms-1"
184+
t-attf-style="background-color: #{ribbon.bg_color}"
185+
/>
186+
<span
187+
t-attf-class="o_wsale_color_preview ms-1"
188+
t-attf-style="background-color: #{ribbon.text_color || renderContext.defaultTextColor} !important;"
189+
/>
190+
</WeButton>
191+
</t>
192+
</WeSelect>
193+
<WeButton editRibbon="''" tooltip.translate="Edit" class="'fa fa-edit'" noPreview="'true'" dependencies="'!no_ribbon_opt'"/>
194+
<WeButton createRibbon="''" name="'create_ribbon_opt'" tooltip.translate="Create" class="'fa fa-plus text-success'" noPreview="'true'"/>
195+
</WeRow>
196+
<div name="'ribbon_customize_opt'" t-att-class="{'d-none': !renderContext.ribbonEditMode}">
197+
<WeInput title.translate="Name"
198+
class="'o_we_sublevel_1 o_we_large'"
199+
setRibbonName="'Ribbon name'"
200+
applyTo="'.o_ribbon'"/>
201+
<WeColorpicker title.translate="Background"
202+
class="'o_we_sublevel_1'"
203+
selectStyle="''"
204+
cssProperty="'background-color'"
205+
colorPrefix="'text-bg-'"
206+
applyTo="'.o_ribbon'"/>
207+
<WeColorpicker title.translate="Text"
208+
class="'o_we_sublevel_1'"
209+
selectStyle="''"
210+
cssProperty="'color'"
211+
applyTo="'.o_ribbon'"/>
212+
<WeSelect title.translate="Position" class="'o_we_sublevel_1'">
213+
<WeButton setRibbonPosition="'left'">Left</WeButton>
214+
<WeButton setRibbonPosition="'right'">Right</WeButton>
215+
</WeSelect>
216+
<WeRow title="' '">
217+
<WeButton class="'o_we_bg_danger'" deleteRibbon="''" noPreview="'true'">
218+
Delete Ribbon
219+
</WeButton>
220+
</WeRow>
221+
</div>
222+
</t>
223+
</templates>
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { registerWebsiteOption } from "@website/js/editor/snippets.registry";
2+
3+
registerWebsiteOption("WebsiteSaleCheckoutPage", {
4+
template: "website_sale.checkout_page",
5+
selector: "main:has(.oe_website_sale .o_wizard)",
6+
noCheck: true,
7+
data: {
8+
groups: ["website.group_website_designer"],
9+
pageOptions: true,
10+
},
11+
});

0 commit comments

Comments
 (0)