Skip to content

Commit b40b921

Browse files
GoamanGoaman
committed
temp
1 parent 85b69ea commit b40b921

23 files changed

+122
-81
lines changed

‎addons/html_builder/static/src/builder/builder_components/builder_button.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderButton">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<button type="button" class="btn btn-primary"
77
t-att-data-action-id="this.props.action"
88
t-att-data-class-action="this.props.classAction"

‎addons/html_builder/static/src/builder/builder_components/builder_button_group.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ export class BuilderButtonGroup extends Component {
1212
static props = {
1313
...basicContainerBuilderComponentProps,
1414
id: { type: String, optional: true },
15-
dependencies: { type: [String, Array], optional: true },
1615
slots: { type: Object, optional: true },
1716
};
1817
static components = { BuilderComponent };

‎addons/html_builder/static/src/builder/builder_components/builder_button_group.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderButtonGroup">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div class="btn-group w-100" t-ref="root">
77
<t t-slot="default"/>
88
</div>

‎addons/html_builder/static/src/builder/builder_components/builder_checkbox.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderCheckbox">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div t-att-data-action-id="this.props.action">
77
<CheckBox className="getClassName()" onChange="onChange" value="state.isActive"/>
88
</div>

‎addons/html_builder/static/src/builder/builder_components/builder_colorpicker.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderColorPicker">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div>
77
<ColorSelector
88
type="this.colorType"

‎addons/html_builder/static/src/builder/builder_components/builder_context.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77

88
export class BuilderContext extends Component {
99
static template = xml`
10-
<BuilderComponent dependencies="props.dependencies">
10+
<BuilderComponent isVisible="props.isVisible">
1111
<t t-slot="default"/>
1212
</BuilderComponent>
1313
`;

‎addons/html_builder/static/src/builder/builder_components/builder_number_input.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderNumberInput">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div class="d-flex flex-row flex-nowrap align-items-center" t-att-data-action-id="props.action" style="width: 60px">
77
<input type="text" autocomplete="chrome-off" class="text-end" t-on-change="this.onChange" t-on-blur="this.onChange" t-on-input="this.onInput" t-att-value="this.state.value" />
88
<span t-out="props.unit" />

‎addons/html_builder/static/src/builder/builder_components/builder_range.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderRange">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div class="d-flex flex-row flex-nowrap align-items-center" t-att-data-action-id="props.action" style="width: 60px">
77
<input
88
type="range"

‎addons/html_builder/static/src/builder/builder_components/builder_row.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ export class BuilderRow extends Component {
1313
static props = {
1414
...basicContainerBuilderComponentProps,
1515
label: String,
16-
dependencies: { type: [String, Array], optional: true },
1716
tooltip: { type: String, optional: true },
1817
slots: { type: Object, optional: true },
1918
extraClassName: { type: String, optional: true },

‎addons/html_builder/static/src/builder/builder_components/builder_row.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderRow">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div class="d-flex p-1 px-2 hb-row" t-att-class="this.props.extraClassName || ''" t-ref="root">
77
<div class="d-flex" style="flex-grow: 0.4; flex-basis: 0; min-width: 0;" t-att-data-tooltip="props.tooltip">
88
<span class="text-nowrap text-truncate" t-out="props.label"/>

‎addons/html_builder/static/src/builder/builder_components/builder_select.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderSelect">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<!-- Render the SelectItem(s) into an invisible node to ensure the label of the
77
button is being set. -->
88
<div t-ref="root">

‎addons/html_builder/static/src/builder/builder_components/builder_select_item.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderSelectItem">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div
77
class="d-flex flex-column cursor-pointer"
88
t-att-class="{'active': this.state.isActive}"

‎addons/html_builder/static/src/builder/builder_components/builder_text_input.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BuilderTextInput">
5-
<BuilderComponent dependencies="props.dependencies">
5+
<BuilderComponent isVisible="props.isVisible">
66
<div class="d-flex flex-row flex-nowrap align-items-center" t-att-data-action-id="props.action" style="width: 60px">
77
<input
88
type="text"

‎addons/html_builder/static/src/builder/builder_components/utils.js

Lines changed: 73 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -24,32 +24,32 @@ export function useDomState(getState) {
2424
}
2525

2626
export class BuilderComponent extends Component {
27-
static template = xml`<div t-att-class="this.state.isVisible ? 'd-contents' : 'd-none'"><t t-slot="default"/></div>`;
27+
static template = xml`<div t-att-class="this.props.isVisible === false ? 'd-none' : 'd-contents'"><t t-slot="default"/></div>`;
2828
static props = {
29-
dependencies: { type: [String, { type: Array, element: String }], optional: true },
29+
isVisible: { type: Boolean, optional: true },
3030
slots: { type: Object },
3131
};
3232

33-
setup() {
34-
const isDependenciesVisible = useDependencies(this.props.dependencies);
35-
const isVisible = () =>
36-
!!this.env.getEditingElement() && (!this.props.dependencies || isDependenciesVisible());
37-
this.state = useDomState(() => ({
38-
isVisible: isVisible(),
39-
}));
40-
useBus(this.env.dependencyManager, "dependency-updated", () => {
41-
this.state.isVisible = isVisible();
42-
});
43-
if (this.props.dependencies?.length) {
44-
const listener = () => {
45-
this.state.isVisible = isVisible();
46-
};
47-
this.env.dependencyManager.addEventListener("dependency-updated", listener);
48-
onWillDestroy(() => {
49-
this.env.dependencyManager.removeEventListener("dependency-updated", listener);
50-
});
51-
}
52-
}
33+
// setup() {
34+
// // const isDependenciesVisible = useDependencies(this.props.dependencies);
35+
// // const isVisible = () =>
36+
// // !!this.env.getEditingElement() && (!this.props.dependencies || isDependenciesVisible());
37+
// // this.state = useDomState(() => ({
38+
// // isVisible: isVisible(),
39+
// // }));
40+
// // useBus(this.env.dependencyManager, "dependency-updated", () => {
41+
// // this.state.isVisible = isVisible();
42+
// // });
43+
// // if (this.props.dependencies?.length) {
44+
// // const listener = () => {
45+
// // this.state.isVisible = isVisible();
46+
// // };
47+
// // this.env.dependencyManager.addEventListener("dependency-updated", listener);
48+
// // onWillDestroy(() => {
49+
// // this.env.dependencyManager.removeEventListener("dependency-updated", listener);
50+
// // });
51+
// // }
52+
// }
5353
}
5454

5555
function querySelectorAll(targets, selector) {
@@ -112,6 +112,56 @@ export function useDependencies(dependencies) {
112112
return isDependenciesVisible;
113113
}
114114

115+
export function useIsActiveItem({ log } = {}) {
116+
const env = useEnv();
117+
const tempState = {};
118+
const warn = (...args) => {
119+
if (log) {
120+
console.warn(...args);
121+
}
122+
};
123+
window.d = env.dependencyManager;
124+
125+
function isActive(itemId) {
126+
const isActiveFn = env.dependencyManager.get(itemId)?.isActive;
127+
128+
// warn(`env.dependencyManager.get(itemId):`, env.dependencyManager.get(itemId));
129+
// warn(`isActiveFn:`, isActiveFn);
130+
if (!isActiveFn) {
131+
warn(`itemId`, itemId, env.dependencyManager.get(itemId));
132+
return false;
133+
}
134+
warn(`itemId:`, itemId, isActiveFn());
135+
return isActiveFn();
136+
}
137+
138+
const getState = () => {
139+
for (const itemId of Object.keys(tempState)) {
140+
tempState[itemId] = isActive(itemId);
141+
}
142+
return tempState;
143+
};
144+
const state = useDomState(getState);
145+
// const debouncedGetState = useDebounced(getState, 0);
146+
const listener = () => {
147+
const newState = getState();
148+
console.warn("updated!!", newState);
149+
Object.assign(state, newState);
150+
};
151+
env.dependencyManager.addEventListener("dependency-updated", listener);
152+
onWillDestroy(() => {
153+
env.dependencyManager.removeEventListener("dependency-updated", listener);
154+
});
155+
return function isActiveItem(itemId) {
156+
if (state[itemId] === undefined) {
157+
// Use a temporary state to avoid re-rendering the component.
158+
tempState[itemId] = isActive(itemId);
159+
return tempState[itemId];
160+
}
161+
return state[itemId];
162+
};
163+
}
164+
115165
export function useSelectableComponent(id, { onItemChange } = {}) {
116166
useBuilderComponent();
117167
const selectableItems = [];
@@ -544,7 +594,7 @@ export function useVisibilityObserver(contentName, callback) {
544594
export const basicContainerBuilderComponentProps = {
545595
applyTo: { type: String, optional: true },
546596
preview: { type: Boolean, optional: true },
547-
dependencies: { type: [String, Array], optional: true },
597+
isVisible: { type: [String, Array], optional: true },
548598
inheritedActions: { type: Array, element: String, optional: true },
549599
// preview: { type: Boolean, optional: true },
550600
// reloadPage: { type: Boolean, optional: true },

‎addons/html_builder/static/src/builder/components/option_container.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
import { Component, useSubEnv } from "@odoo/owl";
22
import { defaultBuilderComponents } from "../builder_components/default_builder_components";
3-
import { useVisibilityObserver, useApplyVisibility } from "../builder_components/utils";
3+
import {
4+
useVisibilityObserver,
5+
useApplyVisibility,
6+
useIsActiveItem,
7+
} from "../builder_components/utils";
48
import { DependencyManager } from "../plugins/dependency_manager";
59
import { getSnippetName } from "@html_builder/builder/utils/utils";
610

@@ -20,6 +24,7 @@ export class OptionsContainer extends Component {
2024
getEditingElements: () => [this.props.editingElement],
2125
weContext: {},
2226
});
27+
this.isActiveItem = useIsActiveItem();
2328
useVisibilityObserver("content", useApplyVisibility("root"));
2429
}
2530

‎addons/html_builder/static/src/builder/options/animate_option.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Component, onWillDestroy, useEnv } from "@odoo/owl";
33
import { registry } from "@web/core/registry";
44
import { defaultBuilderComponents } from "../builder_components/default_builder_components";
55
import { withSequence } from "@html_editor/utils/resource";
6-
import { useDomState } from "../builder_components/utils";
6+
import { useDomState, useIsActiveItem } from "../builder_components/utils";
77
import { getScrollingElement } from "@web/core/utils/scrolling";
88

99
class AnimateOptionPlugin extends Plugin {
@@ -183,6 +183,7 @@ class AnimateOption extends Component {
183183

184184
setup() {
185185
const env = useEnv();
186+
this.isActiveItem = useIsActiveItem({ log: true });
186187

187188
const dependencyManager = env.dependencyManager;
188189

‎addons/html_builder/static/src/builder/options/animate_option.xml

Lines changed: 11 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33

44
<t t-name="html_builder.AnimateOption">
55
<BuilderRow label.translate="Animation">
6-
<BuilderSelect dependencies="'!transformImage'" preview="false">
6+
<BuilderSelect isVisible="!this.isActiveItem('transformImage')" preview="false">
77
<BuilderSelectItem action="'setAnimationMode'" actionValue="''"
88
classAction="''"
99
id="'no_animation_opt'">None</BuilderSelectItem>
@@ -18,11 +18,11 @@
1818
<BuilderSelectItem action="'setAnimationMode'" actionValue="'onHover'"
1919
classAction="'o_animate_on_hover'"
2020
id="'animation_on_hover_opt'"
21-
t-if="state.canHover">On Hover</BuilderSelectItem>
21+
isVisible="state.canHover">On Hover</BuilderSelectItem>
2222
</BuilderSelect>
2323
</BuilderRow>
2424
<BuilderRow label.translate="Effect">
25-
<BuilderSelect t-if="this.state.hasAnimateClass" dependencies="'!animation_on_hover_opt'" id="'animation_effect_opt'">
25+
<BuilderSelect isVisible="state.hasAnimateClass and !this.isActiveItem('animation_on_hover_opt')" id="'animation_effect_opt'">
2626
<!-- Default value -->
2727
<!-- <div class="d-none"><BuilderSelectItem classAction="''">None</BuilderSelectItem></div> -->
2828
<BuilderSelectItem classAction="'o_anim_fade_in'"
@@ -36,7 +36,7 @@
3636
classAction="'o_anim_rotate_in'">Rotate</BuilderSelectItem>
3737
<BuilderSelectItem classAction="'o_anim_zoom_out'">Zoom Out</BuilderSelectItem>
3838
<BuilderSelectItem classAction="'o_anim_zoom_in'">Zoom In</BuilderSelectItem>
39-
<BuilderContext dependencies="'animation_on_appearance_opt'">
39+
<BuilderContext isVisible="this.isActiveItem('animation_on_appearance_opt')">
4040
<BuilderSelectItem classAction="'o_anim_flash'">Flash</BuilderSelectItem>
4141
<BuilderSelectItem classAction="'o_anim_pulse'">Pulse</BuilderSelectItem>
4242
<BuilderSelectItem classAction="'o_anim_shake'">Shake</BuilderSelectItem>
@@ -46,42 +46,22 @@
4646
</BuilderContext>
4747
</BuilderContext>
4848
</BuilderSelect>
49-
<!-- <div id="o_hover_effects_options" t-elif="state.canHover">
50-
<BuilderSelect string="Effect" class="o_we_sublevel_1" data-attribute-name="hoverEffect"
51-
data-set-img-shape-hover-effect="true">
52-
<we-button data-select-data-attribute="" data-name="hover_effect_none_opt">None</we-button>
53-
<we-button data-select-data-attribute="overlay" data-name="hover_effect_overlay_opt">Overlay</we-button>
54-
<we-button data-select-data-attribute="image_zoom_in" data-name="hover_effect_zoom_in_opt">Zoom In</we-button>
55-
<we-button data-select-data-attribute="image_zoom_out" data-name="hover_effect_zoom_out_opt">Zoom Out</we-button>
56-
<we-button data-select-data-attribute="dolly_zoom" data-name="hover_effect_dolly_zoom_opt">Dolly Zoom</we-button>
57-
<we-button data-select-data-attribute="outline" data-name="hover_effect_outline_opt">Outline</we-button>
58-
<we-button data-select-data-attribute="image_mirror_blur" data-name="hover_effect_mirror_blur_opt">Mirror Blur</we-button>
59-
</BuilderSelect>
60-
<we-range string="Intensity" class="o_we_sublevel_2" data-select-data-attribute="" data-attribute-name="hoverEffectIntensity"
61-
data-dependencies="hover_effect_zoom_in_opt, hover_effect_zoom_out_opt, hover_effect_mirror_blur_opt, hover_effect_dolly_zoom_opt"
62-
data-min="1" data-max="100" data-step="1" data-display-range-value="true" data-no-preview="true"/>
63-
<we-colorpicker string="Color" class="o_we_sublevel_2" data-set-hover-effect-color="true" data-excluded="theme, common"
64-
data-dependencies="hover_effect_dolly_zoom_opt, hover_effect_overlay_opt, hover_effect_zoom_in_opt, hover_effect_zoom_out_opt, hover_effect_outline_opt"
65-
data-no-preview="true" data-name="hover_effect_color_opt"/>
66-
<we-input string="Stroke Width" class="o_we_sublevel_2" data-select-data-attribute="" data-attribute-name="hoverEffectStrokeWidth"
67-
data-step="1" data-min="1" data-unit="px" data-dependencies="hover_effect_outline_opt" data-no-preview="true"/>
68-
</div> -->
6949
</BuilderRow>
70-
<BuilderRow label.translate="Direction" extraClassName="(state.hasAnimateClass and !state.isLimitedAnimation) ? '' : 'd-none'">
50+
<BuilderRow label.translate="Direction" isVisible="state.hasAnimateClass and !state.isLimitedAnimation">
7151
<BuilderSelect id="'animation_direction_opt'" action="'forceAnimation'">
7252
<BuilderSelectItem classAction="''"
7353
id="'animation_direction_in_place_opt'"
74-
dependencies="'!o_anim_slide_in_opt'">In Place</BuilderSelectItem>
54+
isVisible="!this.isActiveItem('o_anim_slide_in_opt')">In Place</BuilderSelectItem>
7555

76-
<BuilderContext dependencies="'!o_anim_rotate_opt'">
56+
<BuilderContext isVisible="!this.isActiveItem('o_anim_rotate_opt')">
7757
<BuilderSelectItem id="'animation_direction_from_right_opt'"
7858
classAction="'o_anim_from_right'">From Right</BuilderSelectItem>
7959
<BuilderSelectItem classAction="'o_anim_from_left'">From Left</BuilderSelectItem>
8060
<BuilderSelectItem classAction="'o_anim_from_bottom'">From Bottom</BuilderSelectItem>
8161
<BuilderSelectItem classAction="'o_anim_from_top'">From Top</BuilderSelectItem>
8262
</BuilderContext>
8363

84-
<BuilderContext dependencies="'o_anim_rotate_opt'">
64+
<BuilderContext isVisible="this.isActiveItem('o_anim_rotate_opt')">
8565
<BuilderSelectItem classAction="'o_anim_from_top_right'">From Top Right</BuilderSelectItem>
8666
<BuilderSelectItem classAction="'o_anim_from_top_left'">From Top Left</BuilderSelectItem>
8767
<BuilderSelectItem classAction="'o_anim_from_bottom_right'">From Bottom Right</BuilderSelectItem>
@@ -91,13 +71,13 @@
9171
</BuilderRow>
9272
<!-- Trigger -->
9373
<BuilderRow label.translate="Trigger">
94-
<BuilderSelect dependencies="'animation_on_appearance_opt'" id="'animation_trigger_opt'">
74+
<BuilderSelect isVisible="this.isActiveItem('animation_on_appearance_opt')" id="'animation_trigger_opt'">
9575
<BuilderSelectItem classAction="''">First Time Only</BuilderSelectItem>
9676
<BuilderSelectItem classAction="'o_animate_both_scroll'">Every Time</BuilderSelectItem>
9777
</BuilderSelect>
9878
</BuilderRow>
9979
<!-- Intensity -->
100-
<BuilderRow label.translate="Intensity" t-if="state.showIntensity">
80+
<BuilderRow label.translate="Intensity" isVisible="state.showIntensity">
10181
<BuilderRange id="'animation_intensity_opt'"
10282
action="'setAnimateIntensity'"
10383
preview="false"
@@ -106,7 +86,7 @@
10686
step="1"
10787
displayRangeValue="true"/>
10888
</BuilderRow>
109-
<BuilderContext dependencies="'animation_on_appearance_opt'">
89+
<BuilderContext isVisible="this.isActiveItem('animation_on_appearance_opt')">
11090
<!-- Start After -->
11191
<BuilderRow label.translate="Start After">
11292
<BuilderNumberInput styleAction="'animation-delay'" default="0" unit="'s'" />

‎addons/html_builder/static/src/builder/options/block_alignment_option.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<templates xml:space="preserve">
33

44
<t t-name="html_builder.BlockAlignmentOption">
5-
<BuilderRow label.translate="Alignment" dependencies="'!so_width_100'">
5+
<BuilderRow label.translate="Alignment" isVisible="!this.isActiveItem('so_width_100')">
66
<BuilderButtonGroup>
77
<BuilderButton icon="'fa-align-left'" title.translate="Left" classAction="'me-auto'"/>
88
<BuilderButton icon="'fa-align-center'" title.translate="Center" classAction="'mx-auto'"/>

0 commit comments

Comments
 (0)