User:Monster Domosed/common.js: Difference between revisions

No edit summary
No edit summary
Line 1: Line 1:
(function () {
(function () {
     'use strict';
     'use strict';
    document.documentElement.classList.add('usericon-loading');


     var availableIcons = [
     var availableIcons = [
Line 50: Line 52:


     function getCachedIcon() {
     function getCachedIcon() {
         return localStorage.getItem(PREFERENCE_KEY) || 'rem';
         return localStorage.getItem(PREFERENCE_KEY);
     }
     }


Line 63: Line 65:
     }
     }


    // =========================
    // FAST LOAD (NO WAIT)
    // =========================
     function applyStoredIcon() {
     function applyStoredIcon() {
         applyIcon(getCachedIcon());
         var icon = getCachedIcon();
 
        // fallback ONLY if nothing exists yet
        if (!icon) {
            icon = 'rem';
            setCachedIcon(icon);
        }


         // background sync (keeps devices in sync)
         applyIcon(icon);
        var api = new mw.Api();
        api.get({
            action: 'query',
            meta: 'userinfo',
            uiprop: 'options'
        }).done(function (data) {
            var serverIcon =
                data.query.userinfo.options[PREFERENCE_KEY] || 'rem';


             if (serverIcon !== getCachedIcon()) {
        // now safe to show UI
                setCachedIcon(serverIcon);
        document.documentElement.classList.remove('usericon-loading');
                applyIcon(serverIcon);
 
             }
        // background sync with server (cross-device sync)
        mw.loader.using(['mediawiki.api'], function () {
            var api = new mw.Api();
 
             api.get({
                action: 'query',
                meta: 'userinfo',
                uiprop: 'options'
            }).done(function (data) {
                var serverIcon =
                    data.query.userinfo.options[PREFERENCE_KEY] || 'rem';
 
                if (serverIcon !== icon) {
                    setCachedIcon(serverIcon);
                    applyIcon(serverIcon);
                }
             });
         });
         });
     }
     }


     // =========================
     // =========================
     // ICON SELECTOR UI
     // ICON SELECTOR
     // =========================
     // =========================
     function createIconSelector() {
     function createIconSelector() {
         var currentIcon = getCachedIcon();
         var currentIcon = getCachedIcon() || 'rem';


         var html = '<div id="usericon-selector">' +
         var html = '<div id="usericon-selector">' +
Line 128: Line 141:
         applyIcon(iconId);
         applyIcon(iconId);


         var api = new mw.Api();
         mw.loader.using(['mediawiki.api'], function () {
            var api = new mw.Api();


        api.saveOption(PREFERENCE_KEY, iconId)
            api.saveOption(PREFERENCE_KEY, iconId)
            .done(function () {
                .done(function () {
                mw.notify('Icon updated successfully!', {
                    mw.notify('Icon updated and synced across devices!', {
                     type: 'success'
                        type: 'success'
                     });
                })
                .fail(function () {
                    mw.notify('Failed to save icon.', {
                        type: 'error'
                    });
                 });
                 });
            })
        });
            .fail(function () {
                mw.notify('Failed to save icon.', {
                    type: 'error'
                });
            });
     }
     }


Line 146: Line 161:
     // INIT
     // INIT
     // =========================
     // =========================
     mw.loader.using(['mediawiki.api', 'mediawiki.util'], function () {
     mw.loader.using(['mediawiki.util'], function () {
         applyStoredIcon();
         applyStoredIcon();