|
@@ -16,10 +16,10 @@
|
|
|
|
|
|
|
|
import $ from 'jquery';
|
|
import $ from 'jquery';
|
|
|
import * as ko from 'knockout';
|
|
import * as ko from 'knockout';
|
|
|
-import { CONTEXT_POPOVER_CLASS } from './ko.contextPopover';
|
|
|
|
|
|
|
+import { CONTEXT_POPOVER_CLASS, CONTEXT_POPOVER_HIDDEN_EVENT } from './ko.contextPopover';
|
|
|
import huePubSub from 'utils/huePubSub';
|
|
import huePubSub from 'utils/huePubSub';
|
|
|
|
|
|
|
|
-import { HIDE_EVENT } from './ko.contextPopover';
|
|
|
|
|
|
|
+import { HIDE_CONTEXT_POPOVER_EVENT } from './ko.contextPopover';
|
|
|
|
|
|
|
|
const DEFAULT_DELAY = 700;
|
|
const DEFAULT_DELAY = 700;
|
|
|
|
|
|
|
@@ -52,7 +52,7 @@ ko.bindingHandlers[NAME] = {
|
|
|
hideTimeout = window.setTimeout(() => {
|
|
hideTimeout = window.setTimeout(() => {
|
|
|
visible = false;
|
|
visible = false;
|
|
|
$(popoverSelector).off('.onHover');
|
|
$(popoverSelector).off('.onHover');
|
|
|
- huePubSub.publish(HIDE_EVENT);
|
|
|
|
|
|
|
+ huePubSub.publish(HIDE_CONTEXT_POPOVER_EVENT);
|
|
|
}, options.delay);
|
|
}, options.delay);
|
|
|
};
|
|
};
|
|
|
|
|
|
|
@@ -64,7 +64,7 @@ ko.bindingHandlers[NAME] = {
|
|
|
|
|
|
|
|
showTimeout = window.setTimeout(() => {
|
|
showTimeout = window.setTimeout(() => {
|
|
|
visible = true;
|
|
visible = true;
|
|
|
- huePubSub.publish(HIDE_EVENT);
|
|
|
|
|
|
|
+ huePubSub.publish(HIDE_CONTEXT_POPOVER_EVENT);
|
|
|
options.onHover.bind(bindingContext.$data)(
|
|
options.onHover.bind(bindingContext.$data)(
|
|
|
bindingContext.$data,
|
|
bindingContext.$data,
|
|
|
event,
|
|
event,
|
|
@@ -73,6 +73,16 @@ ko.bindingHandlers[NAME] = {
|
|
|
}, options.delay);
|
|
}, options.delay);
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
|
|
+ $element.on('click.onHover', event => {
|
|
|
|
|
+ clearTimeouts();
|
|
|
|
|
+ visible = true;
|
|
|
|
|
+ options.onHover.bind(bindingContext.$data)(
|
|
|
|
|
+ bindingContext.$data,
|
|
|
|
|
+ event,
|
|
|
|
|
+ options.positionAdjustments
|
|
|
|
|
+ );
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
$element.on('mouseenter.onHover', show);
|
|
$element.on('mouseenter.onHover', show);
|
|
|
|
|
|
|
|
$element.on('mouseleave.onHover', () => {
|
|
$element.on('mouseleave.onHover', () => {
|
|
@@ -90,12 +100,17 @@ ko.bindingHandlers[NAME] = {
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
|
|
+ const hiddenSub = huePubSub.subscribe(CONTEXT_POPOVER_HIDDEN_EVENT, () => {
|
|
|
|
|
+ visible = false;
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
ko.utils.domNodeDisposal.addDisposeCallback(element, () => {
|
|
ko.utils.domNodeDisposal.addDisposeCallback(element, () => {
|
|
|
$element.off('.onHover');
|
|
$element.off('.onHover');
|
|
|
$(popoverSelector).off('.onHover');
|
|
$(popoverSelector).off('.onHover');
|
|
|
clearTimeouts();
|
|
clearTimeouts();
|
|
|
|
|
+ hiddenSub.remove();
|
|
|
if (visible) {
|
|
if (visible) {
|
|
|
- huePubSub.publish(HIDE_EVENT);
|
|
|
|
|
|
|
+ huePubSub.publish(HIDE_CONTEXT_POPOVER_EVENT);
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|