diff --git a/doc/user/events/widget.rst b/doc/user/events/widget.rst index bf816dd386..8182db5fc4 100644 --- a/doc/user/events/widget.rst +++ b/doc/user/events/widget.rst @@ -253,18 +253,21 @@ If you want, you can suppress us loading the widget and/or modify the user data If you then later want to trigger loading the widgets, just call ``window.PretixWidget.buildWidgets()``. -Waiting for the widget to load ------------------------------- +Waiting for the widget to load or close +--------------------------------------- -If you want to run custom JavaScript once the widget is fully loaded, you can register a callback function. Note that -this function might be run multiple times, for example if you have multiple widgets on a page or if the user switches -e.g. from an event list to an event detail view:: +If you want to run custom JavaScript once the widget is fully loaded or when it is closed, you can register callback +functions. Note that these function might be run multiple times, for example if you have multiple widgets on a page +or if the user switches e.g. from an event list to an event detail view:: diff --git a/src/pretix/static/pretixpresale/js/widget/widget.js b/src/pretix/static/pretixpresale/js/widget/widget.js index d88b2943f1..c5b3542c2f 100644 --- a/src/pretix/static/pretixpresale/js/widget/widget.js +++ b/src/pretix/static/pretixpresale/js/widget/widget.js @@ -747,6 +747,7 @@ Vue.component('pretix-overlay', { this.$root.frame_shown = false; this.$root.parent.frame_dismissed = true; this.$root.parent.reload(); + this.$root.trigger_close_callback(); }, iframeLoaded: function () { if (this.$root.frame_loading) { @@ -1368,6 +1369,13 @@ var shared_root_methods = { } }); }, + trigger_close_callback: function () { + this.$nextTick(function () { + for (var i = 0; i < window.PretixWidget._closed.length; i++) { + window.PretixWidget._closed[i]() + } + }); + }, reload: function () { var url; if (this.$root.is_button) { @@ -1791,9 +1799,13 @@ var create_button = function (element) { widgetlist = []; buttonlist = []; window.PretixWidget._loaded = []; +window.PretixWidget._closed = []; window.PretixWidget.addLoadListener = function (f) { window.PretixWidget._loaded.push(f); } +window.PretixWidget.addCloseListener = function (f) { + window.PretixWidget._closed.push(f); +} window.PretixWidget.buildWidgets = function () { document.createElement("pretix-widget"); document.createElement("pretix-button");