2018-03-09 20:18:59 +00:00
|
|
|
import $ from 'jquery';
|
2018-01-11 04:16:27 +00:00
|
|
|
import axios from '../lib/utils/axios_utils';
|
|
|
|
import { __ } from '../locale';
|
|
|
|
import Flash from '../flash';
|
|
|
|
import LazyLoader from '../lazy_loader';
|
2018-03-27 17:17:36 +00:00
|
|
|
import { togglePopover } from '../shared/popover';
|
2018-01-11 04:16:27 +00:00
|
|
|
|
|
|
|
export const getSelector = highlightId => `.js-feature-highlight[data-highlight=${highlightId}]`;
|
|
|
|
|
|
|
|
export function dismiss(highlightId) {
|
2018-10-10 06:18:49 +00:00
|
|
|
axios
|
|
|
|
.post(this.attr('data-dismiss-endpoint'), {
|
|
|
|
feature_name: highlightId,
|
|
|
|
})
|
|
|
|
.catch(() =>
|
|
|
|
Flash(
|
|
|
|
__(
|
|
|
|
'An error occurred while dismissing the feature highlight. Refresh the page and try dismissing again.',
|
|
|
|
),
|
|
|
|
),
|
|
|
|
);
|
2018-01-11 04:16:27 +00:00
|
|
|
|
|
|
|
togglePopover.call(this, false);
|
|
|
|
this.hide();
|
|
|
|
}
|
|
|
|
|
|
|
|
export function inserted() {
|
|
|
|
const popoverId = this.getAttribute('aria-describedby');
|
|
|
|
const highlightId = this.dataset.highlight;
|
|
|
|
const $popover = $(this);
|
|
|
|
const dismissWrapper = dismiss.bind($popover, highlightId);
|
|
|
|
|
2018-10-10 06:18:49 +00:00
|
|
|
$(`#${popoverId} .dismiss-feature-highlight`).on('click', dismissWrapper);
|
2018-01-11 04:16:27 +00:00
|
|
|
|
|
|
|
const lazyImg = $(`#${popoverId} .feature-highlight-illustration`)[0];
|
|
|
|
if (lazyImg) {
|
|
|
|
LazyLoader.loadImage(lazyImg);
|
|
|
|
}
|
|
|
|
}
|