Difference between revisions of "MediaWiki:Common.js"

From WikiPatents
Jump to navigation Jump to search
Line 16: Line 16:
 
});
 
});
  
 +
// Wrap everything in an Immediately Invoked Function Expression (IIFE)
 +
(function() {
 +
    // Use a unique key for this script
 +
    var SCRIPT_KEY = 'patentAlertScriptExecuted';
  
// Flag to ensure the script only runs once
+
    // Function to check if the script has already run
var patentAlertScriptExecuted = false;
+
    function hasScriptRun() {
 +
        return window[SCRIPT_KEY] === true;
 +
    }
 +
 
 +
    // Function to mark the script as run
 +
    function markScriptAsRun() {
 +
        window[SCRIPT_KEY] = true;
 +
    }
 +
 
 +
    // Main function to create popup and banner
 +
    function createPatentAlert() {
 +
        // Check if the script has already been executed
 +
        if (hasScriptRun()) return;
  
$(function() {
+
        // Mark the script as run
    // Check if the script has already been executed
+
        markScriptAsRun();
    if (patentAlertScriptExecuted) return;
 
    patentAlertScriptExecuted = true;
 
  
    // Check if the alert has been shown in the last 24 hours
+
        // Check if the alert has been shown in the last 24 hours
    var lastShown = localStorage.getItem('patentAlertLastShown');
+
        var lastShown = localStorage.getItem('patentAlertLastShown');
    var now = new Date().getTime();
+
        var now = new Date().getTime();
   
 
    if (!lastShown || now - lastShown > 24 * 60 * 60 * 1000) {
 
        // Create and show popup
 
        createPopup();
 
 
          
 
          
         // Create and show banner
+
         if (!lastShown || now - lastShown > 24 * 60 * 60 * 1000) {
        createBanner();
+
            // Create and show popup
 +
            createPopup();
 +
           
 +
            // Create and show banner
 +
            createBanner();
 +
        }
 
     }
 
     }
});
 
  
function createPopup() {
+
    function createPopup() {
    var $popup = $('<div>')
+
        var $popup = $('<div>')
        .css({
+
            .css({
            position: 'fixed',
+
                position: 'fixed',
            top: '50%',
+
                top: '50%',
            left: '50%',
+
                left: '50%',
            transform: 'translate(-50%, -50%)',
+
                transform: 'translate(-50%, -50%)',
            backgroundColor: 'rgba(255, 255, 255, 0.95)',
+
                backgroundColor: 'rgba(255, 255, 255, 0.95)',
            padding: '30px',
+
                padding: '30px',
            borderRadius: '20px',
+
                borderRadius: '20px',
            border: '8px solid #ffbe18',
+
                border: '8px solid #ffbe18',
            boxShadow: '0 10px 40px rgba(0,0,0,0.2)',
+
                boxShadow: '0 10px 40px rgba(0,0,0,0.2)',
            width: '400px',
+
                width: '400px',
            maxWidth: '90%',
+
                maxWidth: '90%',
            zIndex: 1000,
+
                zIndex: 1000,
            fontFamily: 'Arial, sans-serif',
+
                fontFamily: 'Arial, sans-serif',
            textAlign: 'center'
+
                textAlign: 'center'
        })
+
            })
        .html('<h2 style="color: #333; font-size: 24px; margin-bottom: 20px;">Patent Application Monitoring</h2>' +
+
            .html('<h2 style="color: #333; font-size: 24px; margin-bottom: 20px;">Patent Application Monitoring</h2>' +
              '<p style="color: #555; font-size: 16px; line-height: 1.5; margin-bottom: 25px;">Want to monitor Patent Applications? Submit your custom request and get a free weekly report!</p>' +
+
                  '<p style="color: #555; font-size: 16px; line-height: 1.5; margin-bottom: 25px;">Want to monitor Patent Applications? Submit your custom request and get a free weekly report!</p>' +
              '<button id="patentAlertButton">Get Alerts</button>')
+
                  '<button id="patentAlertButton">Get Alerts</button>')
        .appendTo('body');
+
            .appendTo('body');
  
    $('#patentAlertButton').css({
+
        $('#patentAlertButton').css({
        display: 'inline-block',
+
            display: 'inline-block',
        padding: '12px 24px',
+
            padding: '12px 24px',
        backgroundColor: '#ffbe18',
+
            backgroundColor: '#ffbe18',
        color: '#333',
+
            color: '#333',
        border: 'none',
 
        borderRadius: '25px',
 
        fontSize: '18px',
 
        fontWeight: 'bold',
 
        cursor: 'pointer',
 
        transition: 'background-color 0.3s, transform 0.1s',
 
        outline: 'none'
 
    }).on('click', function() {
 
        window.open('https://docs.google.com/forms/d/e/1FAIpQLSfvGeHyDW-ND9TqqVhbPOrYsKWsvUgFp9Rl-gfsyZCaLp7fXA/viewform?usp=sf_link', '_blank');
 
        $popup.fadeOut(300);
 
        localStorage.setItem('patentAlertLastShown', new Date().getTime());
 
    }).on('mouseover', function() {
 
        $(this).css('backgroundColor', '#e5ab16');
 
    }).on('mouseout', function() {
 
        $(this).css('backgroundColor', '#ffbe18');
 
    }).on('mousedown', function() {
 
        $(this).css('transform', 'scale(0.95)');
 
    }).on('mouseup', function() {
 
        $(this).css('transform', 'scale(1)');
 
    });
 
 
 
    // Add close button
 
    $('<button>')
 
        .text('×')
 
        .css({
 
            position: 'absolute',
 
            top: '10px',
 
            right: '10px',
 
            background: 'none',
 
 
             border: 'none',
 
             border: 'none',
             fontSize: '24px',
+
            borderRadius: '25px',
             color: '#666',
+
             fontSize: '18px',
             cursor: 'pointer'
+
             fontWeight: 'bold',
         })
+
             cursor: 'pointer',
        .on('click', function() {
+
            transition: 'background-color 0.3s, transform 0.1s',
 +
            outline: 'none'
 +
         }).on('click', function() {
 +
            window.open('https://docs.google.com/forms/d/e/1FAIpQLSfvGeHyDW-ND9TqqVhbPOrYsKWsvUgFp9Rl-gfsyZCaLp7fXA/viewform?usp=sf_link', '_blank');
 
             $popup.fadeOut(300);
 
             $popup.fadeOut(300);
 
             localStorage.setItem('patentAlertLastShown', new Date().getTime());
 
             localStorage.setItem('patentAlertLastShown', new Date().getTime());
         })
+
         }).on('mouseover', function() {
         .appendTo($popup);
+
            $(this).css('backgroundColor', '#e5ab16');
 +
        }).on('mouseout', function() {
 +
            $(this).css('backgroundColor', '#ffbe18');
 +
        }).on('mousedown', function() {
 +
            $(this).css('transform', 'scale(0.95)');
 +
         }).on('mouseup', function() {
 +
            $(this).css('transform', 'scale(1)');
 +
        });
  
    // Show popup with fade-in effect
+
        // Add close button
    setTimeout(function() {
+
        $('<button>')
        $popup.hide().fadeIn(500);
+
            .text('×')
    }, 1000);
+
            .css({
}
+
                position: 'absolute',
 +
                top: '10px',
 +
                right: '10px',
 +
                background: 'none',
 +
                border: 'none',
 +
                fontSize: '24px',
 +
                color: '#666',
 +
                cursor: 'pointer'
 +
            })
 +
            .on('click', function() {
 +
                $popup.fadeOut(300);
 +
                localStorage.setItem('patentAlertLastShown', new Date().getTime());
 +
            })
 +
            .appendTo($popup);
  
function createBanner() {
+
        // Show popup with fade-in effect
    var $banner = $('<div>')
+
        setTimeout(function() {
        .css({
+
            $popup.hide().fadeIn(500);
            position: 'fixed',
+
         }, 1000);
            top: '0',
+
    }
            left: '0',
 
            width: '100%',
 
            backgroundColor: '#ffbe18',
 
            padding: '10px',
 
            boxShadow: '0 2px 10px rgba(0,0,0,0.1)',
 
            zIndex: 999,
 
            fontFamily: 'Arial, sans-serif',
 
            textAlign: 'center',
 
            display: 'flex',
 
            justifyContent: 'center',
 
            alignItems: 'center'
 
         })
 
        .html('<p style="color: #333; font-size: 16px; margin: 0 20px 0 0;">Want to monitor Patent Applications? Get a free weekly report!</p>' +
 
              '<button id="patentAlertBannerButton">Get Alerts</button>')
 
        .prependTo('body');
 
  
     $('#patentAlertBannerButton').css({
+
     function createBanner() {
        display: 'inline-block',
+
        var $banner = $('<div>')
        padding: '8px 16px',
+
            .css({
        backgroundColor: '#333',
+
                position: 'fixed',
        color: '#fff',
+
                top: '0',
        border: 'none',
+
                left: '0',
        borderRadius: '25px',
+
                width: '100%',
        fontSize: '14px',
+
                backgroundColor: '#ffbe18',
        fontWeight: 'bold',
+
                padding: '10px',
        cursor: 'pointer',
+
                boxShadow: '0 2px 10px rgba(0,0,0,0.1)',
        transition: 'background-color 0.3s',
+
                zIndex: 999,
        outline: 'none'
+
                fontFamily: 'Arial, sans-serif',
    }).on('click', function() {
+
                textAlign: 'center',
        window.open('https://docs.google.com/forms/d/e/1FAIpQLSfvGeHyDW-ND9TqqVhbPOrYsKWsvUgFp9Rl-gfsyZCaLp7fXA/viewform?usp=sf_link', '_blank');
+
                display: 'flex',
    }).on('mouseover', function() {
+
                justifyContent: 'center',
        $(this).css('backgroundColor', '#555');
+
                alignItems: 'center'
    }).on('mouseout', function() {
+
            })
        $(this).css('backgroundColor', '#333');
+
            .html('<p style="color: #333; font-size: 16px; margin: 0 20px 0 0;">Want to monitor Patent Applications? Get a free weekly report!</p>' +
    });
+
                  '<button id="patentAlertBannerButton">Get Alerts</button>')
 +
            .prependTo('body');
  
    // Add close button for banner
+
        $('#patentAlertBannerButton').css({
    $('<button>')
+
            display: 'inline-block',
        .text('×')
+
            padding: '8px 16px',
        .css({
+
            backgroundColor: '#333',
             background: 'none',
+
             color: '#fff',
 
             border: 'none',
 
             border: 'none',
             fontSize: '20px',
+
            borderRadius: '25px',
             color: '#333',
+
             fontSize: '14px',
 +
             fontWeight: 'bold',
 
             cursor: 'pointer',
 
             cursor: 'pointer',
             marginLeft: '20px'
+
             transition: 'background-color 0.3s',
        })
+
            outline: 'none'
        .on('click', function() {
+
        }).on('click', function() {
            $banner.slideUp(300);
+
            window.open('https://docs.google.com/forms/d/e/1FAIpQLSfvGeHyDW-ND9TqqVhbPOrYsKWsvUgFp9Rl-gfsyZCaLp7fXA/viewform?usp=sf_link', '_blank');
         })
+
        }).on('mouseover', function() {
         .appendTo($banner);
+
            $(this).css('backgroundColor', '#555');
 +
        }).on('mouseout', function() {
 +
            $(this).css('backgroundColor', '#333');
 +
        });
 +
 
 +
        // Add close button for banner
 +
        $('<button>')
 +
            .text('×')
 +
            .css({
 +
                background: 'none',
 +
                border: 'none',
 +
                fontSize: '20px',
 +
                color: '#333',
 +
                cursor: 'pointer',
 +
                marginLeft: '20px'
 +
            })
 +
            .on('click', function() {
 +
                $banner.slideUp(300);
 +
            })
 +
            .appendTo($banner);
 +
 
 +
        // Show banner with slide-down effect
 +
         $banner.hide().slideDown(500);
 +
 
 +
        // Adjust body padding to accommodate the banner
 +
         $('body').css('padding-top', $banner.outerHeight());
 +
    }
  
     // Show banner with slide-down effect
+
     // Use jQuery's ready function to ensure the DOM is fully loaded
     $banner.hide().slideDown(500);
+
     $(document).ready(createPatentAlert);
  
     // Adjust body padding to accommodate the banner
+
     // Also attach to window.onload as a fallback
     $('body').css('padding-top', $banner.outerHeight());
+
     window.addEventListener('load', createPatentAlert);
}
+
})();

Revision as of 06:37, 6 September 2024

mw.loader.load('https://static.addtoany.com/menu/page.js');

$(document).ready(function() {
    if ($('#content').length) {
        $('#content').append('<div class="a2a_kit a2a_kit_size_32 a2a_default_style">' +
            '<a class="a2a_dd" href="https://www.addtoany.com/share"></a>' +
            '<a class="a2a_button_email"></a>' +
            '<a class="a2a_button_x"></a>' +
            '<a class="a2a_button_telegram"></a>' +
            '<a class="a2a_button_whatsapp"></a>' +
            '<a class="a2a_button_facebook"></a>' +
            '<a class="a2a_button_facebook_messenger"></a>' +
            '<a class="a2a_button_google_gmail"></a>' +
            '</div>');
    }
});

// Wrap everything in an Immediately Invoked Function Expression (IIFE)
(function() {
    // Use a unique key for this script
    var SCRIPT_KEY = 'patentAlertScriptExecuted';

    // Function to check if the script has already run
    function hasScriptRun() {
        return window[SCRIPT_KEY] === true;
    }

    // Function to mark the script as run
    function markScriptAsRun() {
        window[SCRIPT_KEY] = true;
    }

    // Main function to create popup and banner
    function createPatentAlert() {
        // Check if the script has already been executed
        if (hasScriptRun()) return;

        // Mark the script as run
        markScriptAsRun();

        // Check if the alert has been shown in the last 24 hours
        var lastShown = localStorage.getItem('patentAlertLastShown');
        var now = new Date().getTime();
        
        if (!lastShown || now - lastShown > 24 * 60 * 60 * 1000) {
            // Create and show popup
            createPopup();
            
            // Create and show banner
            createBanner();
        }
    }

    function createPopup() {
        var $popup = $('<div>')
            .css({
                position: 'fixed',
                top: '50%',
                left: '50%',
                transform: 'translate(-50%, -50%)',
                backgroundColor: 'rgba(255, 255, 255, 0.95)',
                padding: '30px',
                borderRadius: '20px',
                border: '8px solid #ffbe18',
                boxShadow: '0 10px 40px rgba(0,0,0,0.2)',
                width: '400px',
                maxWidth: '90%',
                zIndex: 1000,
                fontFamily: 'Arial, sans-serif',
                textAlign: 'center'
            })
            .html('<h2 style="color: #333; font-size: 24px; margin-bottom: 20px;">Patent Application Monitoring</h2>' +
                  '<p style="color: #555; font-size: 16px; line-height: 1.5; margin-bottom: 25px;">Want to monitor Patent Applications? Submit your custom request and get a free weekly report!</p>' +
                  '<button id="patentAlertButton">Get Alerts</button>')
            .appendTo('body');

        $('#patentAlertButton').css({
            display: 'inline-block',
            padding: '12px 24px',
            backgroundColor: '#ffbe18',
            color: '#333',
            border: 'none',
            borderRadius: '25px',
            fontSize: '18px',
            fontWeight: 'bold',
            cursor: 'pointer',
            transition: 'background-color 0.3s, transform 0.1s',
            outline: 'none'
        }).on('click', function() {
            window.open('https://docs.google.com/forms/d/e/1FAIpQLSfvGeHyDW-ND9TqqVhbPOrYsKWsvUgFp9Rl-gfsyZCaLp7fXA/viewform?usp=sf_link', '_blank');
            $popup.fadeOut(300);
            localStorage.setItem('patentAlertLastShown', new Date().getTime());
        }).on('mouseover', function() {
            $(this).css('backgroundColor', '#e5ab16');
        }).on('mouseout', function() {
            $(this).css('backgroundColor', '#ffbe18');
        }).on('mousedown', function() {
            $(this).css('transform', 'scale(0.95)');
        }).on('mouseup', function() {
            $(this).css('transform', 'scale(1)');
        });

        // Add close button
        $('<button>')
            .text('×')
            .css({
                position: 'absolute',
                top: '10px',
                right: '10px',
                background: 'none',
                border: 'none',
                fontSize: '24px',
                color: '#666',
                cursor: 'pointer'
            })
            .on('click', function() {
                $popup.fadeOut(300);
                localStorage.setItem('patentAlertLastShown', new Date().getTime());
            })
            .appendTo($popup);

        // Show popup with fade-in effect
        setTimeout(function() {
            $popup.hide().fadeIn(500);
        }, 1000);
    }

    function createBanner() {
        var $banner = $('<div>')
            .css({
                position: 'fixed',
                top: '0',
                left: '0',
                width: '100%',
                backgroundColor: '#ffbe18',
                padding: '10px',
                boxShadow: '0 2px 10px rgba(0,0,0,0.1)',
                zIndex: 999,
                fontFamily: 'Arial, sans-serif',
                textAlign: 'center',
                display: 'flex',
                justifyContent: 'center',
                alignItems: 'center'
            })
            .html('<p style="color: #333; font-size: 16px; margin: 0 20px 0 0;">Want to monitor Patent Applications? Get a free weekly report!</p>' +
                  '<button id="patentAlertBannerButton">Get Alerts</button>')
            .prependTo('body');

        $('#patentAlertBannerButton').css({
            display: 'inline-block',
            padding: '8px 16px',
            backgroundColor: '#333',
            color: '#fff',
            border: 'none',
            borderRadius: '25px',
            fontSize: '14px',
            fontWeight: 'bold',
            cursor: 'pointer',
            transition: 'background-color 0.3s',
            outline: 'none'
        }).on('click', function() {
            window.open('https://docs.google.com/forms/d/e/1FAIpQLSfvGeHyDW-ND9TqqVhbPOrYsKWsvUgFp9Rl-gfsyZCaLp7fXA/viewform?usp=sf_link', '_blank');
        }).on('mouseover', function() {
            $(this).css('backgroundColor', '#555');
        }).on('mouseout', function() {
            $(this).css('backgroundColor', '#333');
        });

        // Add close button for banner
        $('<button>')
            .text('×')
            .css({
                background: 'none',
                border: 'none',
                fontSize: '20px',
                color: '#333',
                cursor: 'pointer',
                marginLeft: '20px'
            })
            .on('click', function() {
                $banner.slideUp(300);
            })
            .appendTo($banner);

        // Show banner with slide-down effect
        $banner.hide().slideDown(500);

        // Adjust body padding to accommodate the banner
        $('body').css('padding-top', $banner.outerHeight());
    }

    // Use jQuery's ready function to ensure the DOM is fully loaded
    $(document).ready(createPatentAlert);

    // Also attach to window.onload as a fallback
    window.addEventListener('load', createPatentAlert);
})();