Jump to content

MediaWiki:Common.js: Difference between revisions

From Iskomunidad
No edit summary
No edit summary
Line 148: Line 148:
  /* UP Diliman Main Map */
  /* UP Diliman Main Map */
  (function () {
  (function () {
    'use strict';
    'use strict';


    var upDilimanBounds = [
    var upDilimanBounds = [
        [14.640, 121.055], // Southwest
        [14.640, 121.055],
        [14.665, 121.085] // Northeast
        [14.665, 121.085]
    ];
    ];


    function restrictMap(map) {
    function installUpDilimanRestriction() {
        if (!map || !map.getContainer) {
        if (typeof window.L === 'undefined' || !L.Map) {
            return;
            return false;
        }
        }


        var container = map.getContainer();
        if (L.Map.prototype._upDilimanRestrictionInstalled) {
            return true;
        }


        if (!container ||
        L.Map.prototype._upDilimanRestrictionInstalled = true;
            !container.closest('#up-diliman-main-map')) {
            return;
        }


        map.setMaxBounds(upDilimanBounds);
        L.Map.addInitHook(function () {
        map.setMinZoom(15);
            var map = this;
        map.options.maxBoundsViscosity = 1.0;
            var container = map.getContainer();
    }


    function hookLeaflet() {
            if (!container) {
        if (typeof window.L === 'undefined' || !L.Map) {
                return;
            return false;
            }
        }


        if (L.Map.prototype._upDilimanHookInstalled) {
            if (!container.closest('#up-diliman-main-map')) {
            return true;
                return;
        }
            }


        L.Map.prototype._upDilimanHookInstalled = true;
            map.setMaxBounds(upDilimanBounds);
            map.options.maxBoundsViscosity = 1.0;
        });


        /*
        return true;
          * Apply to maps created after this script loads.
    }
          */
        L.Map.addInitHook(function () {
            restrictMap(this);
        });


        /*
    /*
          * Also catch maps that already exist.
    * Wait for Leaflet to become available.
          *
    */
          * Maps creates a Leaflet map on the .maps-map element.
    var attempts = 0;
          * We can identify it through Leaflet's event handlers by
          * temporarily listening for map movement.
          */
        var containers = document.querySelectorAll(
            '#up-diliman-main-map .leaflet-container'
        );


        containers.forEach(function (container) {
    var timer = setInterval(function () {
            /*
        attempts++;
              * Trigger a resize event. This gives Leaflet an opportunity
              * to expose the existing map through its normal event flow.
              */
            var event = document.createEvent('Event');
            event.initEvent('resize', true, true);
            container.dispatchEvent(event);
        });


        return true;
        if (installUpDilimanRestriction() || attempts >= 50) {
    }
            clearInterval(timer);
        }
    }, 100);


    /*
}());
      * Wait for Leaflet and Maps to initialize.
      */
    var attempts = 0;
 
    var timer = setInterval(function () {
        attempts++;
 
        if (hookLeaflet()) {
            clearInterval(timer);
        }
 
        if (attempts >= 50) {
            clearInterval(timer);
        }
    }, 100);
 
}());
  /* End of UP Diliman Main Map */
  /* End of UP Diliman Main Map */

Revision as of 06:07, 25 September 2026

/* For Main Page Announcement area //this code pulls from the https://ilc.upd.edu.ph/all-posts-and-announcements/ PAGE */
console.log("JS WORKING");

(function () {

    console.log("RUNNING IMMEDIATELY");

    const container =
        document.getElementById("ilc-announcements");

    console.log("Container:", container);

    if (!container) return;

    container.innerHTML = "Loading script...";

    fetch("https://ilc.upd.edu.ph/wp-json/wp/v2/posts?per_page=5")
        .then(res => res.json())
        .then(posts => {

            let html = "";

            posts.forEach(post => {
                html += `
                    <p>
                        <a href="${post.link}" target="_blank">
                            ${post.title.rendered}
                        </a>
                    </p>
                `;
            });

            container.innerHTML = html;

        })
        .catch(err => {
            console.error("FETCH ERROR:", err);
            container.innerHTML = "<p>Failed to load announcements</p>";
        });

})();
/*end of new code */

/* Any JavaScript here will be loaded for all users on every page load. */
$(window).on('load', function(){
	$('#site-tools ul').append("<li><a href='https://iskwiki.upd.edu.ph' target='_blank'>Flipbook</li>");
});

/*Helpdesk bubble*/
/*
$(function () {
    var bubble = $('<div id="ost-bubble">💬</div>');
    var panel = $('<div id="ost-panel"><iframe src="https://helpdesk.ilc.upd.edu.ph/o.php"></iframe></div>');

    $('body').append(bubble).append(panel);

    bubble.on('click', function () {
        panel.toggle();
    });
});
*/
/* Helpdesk bubble */
$(function () {
    var bubble = $('<div id="ost-bubble">' +
    				'<img src="https://helpdesk.ilc.upd.edu.ph/images/ilc-images/Helpdesk-logo-bubble.png" alt="💬">' +
    				'</div>');

    var panel = $(
        '<div id="ost-panel">' +
            '<div id="ost-panel-header">' +
                '<img src="https://helpdesk.ilc.upd.edu.ph/logo.php" alt="Helpdesk" style="height:80px;"> ' +
                '<span id="ost-panel-close">&times;</span>' +
            '</div>' +
            '<div id="ost-panel-body">' +
                '<iframe src="https://helpdesk.ilc.upd.edu.ph/o.php"></iframe>' +
            '</div>' +
            '<div id="ost-panel-footer">' +
                '' +
            '</div>' +
        '</div>'
    );

    $('body').append(bubble).append(panel);

    bubble.on('click', function () {
        panel.toggleClass('ost-open');
    });

    panel.find('#ost-panel-close').on('click', function () {
        panel.removeClass('ost-open');
    });
});

/*Pop-up*/
$(function () {
    // Change this whenever you update the popup
    const popupVersion = "welcome-v1";

    // Only show once on initial visit
    if (localStorage.getItem(popupVersion)) {
        return;
    }
	
	//shows after browse time elapse
	 let elapsed = 0;
    const interval = 100; // 1 msecond

    const timer = setInterval(function () {
        if (!document.hidden) {
            elapsed += interval;
        }

        if (elapsed >= 6000) {
            clearInterval(timer);
            showPopup();
        }
    }, interval);
	
function showPopup() {
    const overlay = $(`
        <div id="welcome-overlay">
            <div id="welcome-popup">
                <button id="welcome-close">&times;</button>

                <a href="https://upsystemdiliman.qualtrics.com/jfe/form/SV_3r4gfKrUHQxo6c6" target="_blank">
                <img src="/images/Survey-link.png"
                alt="Survey Link" id="welcome-image">
				</a>
				
            </div>
        </div>
    `);

    $("body").append(overlay);

    function closePopup() {
        localStorage.setItem(popupVersion, "shown");
        overlay.fadeOut(300, function () {
            overlay.remove();
        });
    }

    $("#welcome-close").on("click", closePopup);
}
});

  /* Maps */
 /* UP Diliman Main Map */
 (function () {
    'use strict';

    var upDilimanBounds = [
        [14.640, 121.055],
        [14.665, 121.085]
    ];

    function installUpDilimanRestriction() {
        if (typeof window.L === 'undefined' || !L.Map) {
            return false;
        }

        if (L.Map.prototype._upDilimanRestrictionInstalled) {
            return true;
        }

        L.Map.prototype._upDilimanRestrictionInstalled = true;

        L.Map.addInitHook(function () {
            var map = this;
            var container = map.getContainer();

            if (!container) {
                return;
            }

            if (!container.closest('#up-diliman-main-map')) {
                return;
            }

            map.setMaxBounds(upDilimanBounds);
            map.options.maxBoundsViscosity = 1.0;
        });

        return true;
    }

    /*
     * Wait for Leaflet to become available.
     */
    var attempts = 0;

    var timer = setInterval(function () {
        attempts++;

        if (installUpDilimanRestriction() || attempts >= 50) {
            clearInterval(timer);
        }
    }, 100);

}());
 /* End of UP Diliman Main Map */