MediaWiki:Gadget-PatentPopup.js

From WikiPatents
Jump to navigation Jump to search

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
$(function() {
    // Create and append styles
    $('<style>')
        .text(`
            .patent-popup {
                position: fixed;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%) scale(0.1);
                background-color: #f8f9fa;
                padding: 20px;
                border-radius: 10px;
                box-shadow: 0 5px 30px rgba(0,0,0,0.3);
                width: 300px;
                opacity: 0;
                transition: all 0.3s ease-in-out;
                z-index: 1000;
            }
            .patent-popup.show {
                opacity: 1;
                transform: translate(-50%, -50%) scale(1);
            }
            .patent-popup h2 {
                margin-top: 0;
                color: #333;
            }
            .patent-popup p {
                color: #666;
            }
            .patent-cta-button {
                display: block;
                width: 100%;
                padding: 10px;
                background-color: #007bff;
                color: white;
                border: none;
                border-radius: 5px;
                font-size: 16px;
                cursor: pointer;
                transition: background-color 0.2s;
            }
            .patent-cta-button:hover {
                background-color: #0056b3;
            }
        `)
        .appendTo('head');

    // Create popup element
    var $popup = $('<div>')
        .addClass('patent-popup')
        .html(`
            <h2>Patent Application Monitoring</h2>
            <p>Want to monitor Patent Applications? Submit your custom request and get a free weekly report!</p>
            <button class="patent-cta-button">Get Alerts</button>
        `)
        .appendTo('body');

    // Show popup after a short delay
    setTimeout(function() {
        $popup.addClass('show');
    }, 1000);

    // Add click event to the CTA button
    $popup.find('.patent-cta-button').on('click', function() {
        window.open('https://docs.google.com/forms/d/e/1FAIpQLSfvGeHyDW-ND9TqqVhbPOrYsKWsvUgFp9Rl-gfsyZCaLp7fXA/viewform?usp=sf_link', '_blank');
        $popup.removeClass('show');
    });
});