OpenID Connect RP support for customer accounts

src/pretix/static/pretixpresale/js/postmessage.js

@@ -0,0 +1,10 @@
+/*global $ */
+
+$(function () {
+    window.addEventListener("message", (event) => {
+        if (event.data && event.data.__process === "popup_close") {
+            window.close()
+        }
+    });
+    window.opener.postMessage(JSON.parse($("#postmessage").text()), $("#origin").text())
+})

src/pretix/static/pretixpresale/js/ui/sso.js

@@ -0,0 +1,51 @@
+/*global $ */
+
+$(function () {
+    var popup_window = null
+    var popup_check_interval = null
+
+    $("#popupmodal").removeAttr("hidden");
+
+    $("a[data-open-in-popup-window]").on("click", function (e) {
+        e.preventDefault()
+
+        $("#popupmodal a").attr("href", this.href)
+
+        var url = this.href
+        if (url.includes("?")) {
+            url += "&popup_origin=" + window.location.origin
+        } else {
+            url += "?popup_origin=" + window.location.origin
+        }
+        popup_window = window.open(
+            url,
+            "presale-popup",
+            "scrollbars=yes,resizable=yes,status=yes,location=yes,toolbar=no,menubar=no,width=940,height=620,left=50,top=50"
+        )
+        $("body").addClass("has-popup")
+
+        popup_check_interval = window.setInterval(function () {
+            if (popup_window.closed) {
+                $("body").removeClass("has-popup")
+                window.clearInterval(popup_check_interval)
+            }
+        }, 250)
+
+        return false
+    });
+
+    window.addEventListener("message", function (event) {
+        if (event.source !== popup_window)
+            return
+        if (event.data && event.data.__process === "customer_sso_popup") {
+            if (event.data.status === "ok") {
+                $("#login_sso_data").val(event.data.value)
+                $("#login_sso_data").closest("form").get(0).submit()
+            } else {
+                alert(event.data.value)  // todo
+            }
+            event.source.postMessage({'__process': 'popup_close'}, "*")
+        }
+        console.log(event)
+    }, false);
+})

src/pretix/static/pretixpresale/scss/main.scss

@@ -166,7 +166,7 @@ body.loading .container {
     font-size: 120px;
     color: $brand-primary;
 }
-#loadingmodal, #ajaxerr, #cookie-consent-modal {
+#loadingmodal, #ajaxerr, #cookie-consent-modal, #popupmodal {
     position: fixed;
     top: 0;
     left: 0;
@@ -183,6 +183,11 @@ body.loading .container {
         font-size: 200px;
         color: $brand-primary;
     }
+    &#popupmodal .big-icon {
+        margin-top: 10px;
+        font-size: 100px;
+        color: $brand-primary;
+    }
 
     .modal-card {
         margin: 50px auto 0;
@@ -231,7 +236,7 @@ body.loading .container {
     }
 }
 @media (max-width: 700px) {
-    #loadingmodal, #ajaxerr, #cookie-consent-modal {
+    #loadingmodal, #ajaxerr, #cookie-consent-modal, #popupmodal {
         .modal-card {
             margin: 25px auto 0;
             max-height: calc(100vh - 50px - 20px);
@@ -253,7 +258,7 @@ body.loading .container {
     background: rgba(236, 236, 236, .9);
 }
 
-.loading #loadingmodal, .ajaxerr #ajaxerr {
+.loading #loadingmodal, .ajaxerr #ajaxerr, .has-popup #popupmodal {
     opacity: 1;
     visibility: visible;
     transition: opacity .5s ease-in-out;