MediaWiki:Common.js: Difference between revisions

Access restrictions were established for this page. If you see this message, you have no access to this page.

Revision as of 04:47, 21 February 2025 (view source) Sharvey (talk | contribs) mNo edit summary ← Older edit		Revision as of 04:48, 21 February 2025 (view source) Sharvey (talk | contribs) mNo edit summary Newer edit →
Line 26:		Line 26:
	function showPopup() {		function showPopup() {
	var popup = $(		var popup =
	'<div id="popup-overlay">' +		'<div id="popup-overlay">' +
	'<div id="popup-box">' +		'<div id="popup-box">' +
Line 35:		Line 35:
	'<span id="popup-close">×</span>' +		'<span id="popup-close">×</span>' +
	'</div>' +		'</div>' +
	'</div>'		'</div>';
	);
	$("body").append(popup);		$("body").append(popup);
Line 78:		Line 77:
	});		});
	// Add CSS styles		// Add CSS styles using string concatenation (ES5 compatible)
	mw.util.addCSS(`		mw.util.addCSS(
	#popup-overlay {		"#popup-overlay {" +
	position: fixed;		"position: fixed;" +
	top: 0;		"top: 0;" +
	left: 0;		"left: 0;" +
	width: 100%;		"width: 100%;" +
	height: 100%;		"height: 100%;" +
	background: rgba(0, 0, 0, 0.6);		"background: rgba(0, 0, 0, 0.6);" +
	display: flex;		"display: flex;" +
	justify-content: center;		"justify-content: center;" +
	align-items: center;		"align-items: center;" +
	z-index: 9999;		"z-index: 9999;" +
	}		"}" +
	#popup-box {		"#popup-box {" +
	background: white;		"background: white;" +
	padding: 20px;		"padding: 20px;" +
	border-radius: 10px;		"border-radius: 10px;" +
	text-align: center;		"text-align: center;" +
	width: 90%;		"width: 90%;" +
	max-width: 400px;		"max-width: 400px;" +
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);		"box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);" +
	position: relative;		"position: relative;" +
	}		"}" +
	.popup-button {		".popup-button {" +
	display: inline-block;		"display: inline-block;" +
	background: #007bff;		"background: #007bff;" +
	color: white;		"color: white;" +
	padding: 10px;		"padding: 10px;" +
	text-decoration: none;		"text-decoration: none;" +
	border-radius: 5px;		"border-radius: 5px;" +
	margin-top: 10px;		"margin-top: 10px;" +
	}		"}" +
	#popup-close {		"#popup-close {" +
	position: absolute;		"position: absolute;" +
	top: 10px;		"top: 10px;" +
	right: 15px;		"right: 15px;" +
	cursor: pointer;		"cursor: pointer;" +
	font-size: 20px;		"font-size: 20px;" +
	}		"}"
	`);		);
	}		}

---

Revision as of 04:48, 21 February 2025

console.log("Common.js is loading correctly!");

// Log the username in the console
var loggedInUser = mw.config.get('wgUserName');
console.log("Logged-in User:", loggedInUser);

// Only execute the popup script if the user is NOT logged in
if (!loggedInUser) {
    mw.loader.using(['jquery'], function () {
        $(document).ready(function () {
            var popupShown = sessionStorage.getItem("popupShown");
            var popupTimeout = 120000; // 2 minutes in milliseconds
            var timeoutTriggered = false;

            function sendAnalyticsEvent() {
                if (typeof gtag === "function") {
                    gtag('event', 'popup_shown', {
                        'event_category': 'Engagement',
                        'event_label': 'Legal Consultation Popup',
                        'value': 1
                    });
                } else {
                    console.warn("Google Analytics not detected.");
                }
            }

            function showPopup() {
                var popup = 
                    '<div id="popup-overlay">' +
                        '<div id="popup-box">' +
                            '<h2>Free Legal Consultation <br> Riverview Legal Group (Ontario)</h2>' +
                            '<p>Our primary focus is the Ontario Landlord and Tenant Board.</p>' +
                            '<p>Call us for help at (888) 655-1076</p>' +
                            '<a href="https://riverview.legal/about-us/" target="_blank" class="popup-button">Book a Consultation</a>' +
                            '<span id="popup-close">×</span>' +
                        '</div>' +
                    '</div>';

                $("body").append(popup);
                sessionStorage.setItem("popupShown", "true");

                // Send Google Analytics event
                sendAnalyticsEvent();

                // Close popup when clicking the close button or overlay
                $("#popup-close, #popup-overlay").click(function () {
                    $("#popup-overlay").fadeOut();
                });

                // Prevent clicks inside the popup from closing it
                $("#popup-box").click(function (event) {
                    event.stopPropagation();
                });

                // Remove scroll listener after triggering
                $(document).off("scroll", scrollHandler);
            }

            function scrollHandler() {
                if (!popupShown || timeoutTriggered) {
                    showPopup();
                }
            }

            // Reset popup flag on new page load
            sessionStorage.removeItem("popupShown");

            // Trigger popup when user scrolls
            $(document).one("scroll", scrollHandler);

            // Set timeout to allow popup after 2 minutes
            setTimeout(function () {
                timeoutTriggered = true;
                $(document).one("scroll", scrollHandler);
            }, popupTimeout);
        });
    });

    // Add CSS styles using string concatenation (ES5 compatible)
    mw.util.addCSS(
        "#popup-overlay {" +
            "position: fixed;" +
            "top: 0;" +
            "left: 0;" +
            "width: 100%;" +
            "height: 100%;" +
            "background: rgba(0, 0, 0, 0.6);" +
            "display: flex;" +
            "justify-content: center;" +
            "align-items: center;" +
            "z-index: 9999;" +
        "}" +
        "#popup-box {" +
            "background: white;" +
            "padding: 20px;" +
            "border-radius: 10px;" +
            "text-align: center;" +
            "width: 90%;" +
            "max-width: 400px;" +
            "box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);" +
            "position: relative;" +
        "}" +
        ".popup-button {" +
            "display: inline-block;" +
            "background: #007bff;" +
            "color: white;" +
            "padding: 10px;" +
            "text-decoration: none;" +
            "border-radius: 5px;" +
            "margin-top: 10px;" +
        "}" +
        "#popup-close {" +
            "position: absolute;" +
            "top: 10px;" +
            "right: 15px;" +
            "cursor: pointer;" +
            "font-size: 20px;" +
        "}"
    );
}