मीडियाविकि:Gadget-Visibility.js

/***************************************************************
 * Visibility switching:
 * * typography (long s)
 * * external links (WP, wikt, WD, etc)
 *
 * Complain to User:Inductiveload
 * 2021-03-08 - Gadget style with persistent storage
 *
 * Configuration like:
 *
 * mw.hook("Visibility.config").add(function(cfg) {
 * });
 * 
 * Future: move into a nice shiny settings dialog.
 **************************************************************/

(function($, mw) {

  var Visibility = {
    signature: "Visibility",
    cfg: {
    }
  };

  //Map of properties of the different categories of visibility switch
  var classUIProperties = {
    "typographic-long-s": {
      "selector": ".typographic-long-s",
      "category": "arch-typo",
      "text1": "s",
      "text2": "ſ",
      "text": "long s (ſ)",
      "title": "long s (ſ)",
      "buttonID": "t-showhide-long-s"
    },

    "extiw": {
      "selector": ".mw-parser-output .extiw, .mw-parser-output .external",
      "category": "links",
      "text": "interwiki links",
      "title": "links to external Wikimedia projects",
      "buttonID": "t-showhide-extiw"
    }
  };

  var strings = {
    show: "Show $1",
    hide: "Hide $1"
  };

  var categories = {
    "arch-typo": {
      "is_set": function(props) {
        return $(props.selector + ":first").text() !== props.text1;
      },
      "set": function(props, show) {
        $(props.selector).text(show ? props.text2 : props.text1);
      }
    },
    "links": {
      "is_set": function(props) {
        return !($(props.selector + ":first").hasClass("disabledlink"));
      },
      "set": function(props, show) {
        $(props.selector).toggleClass("disabledlink", !show);
      }
    }
  };

  function store_setting(key, show) {
    mw.cookie.set(key, show, {
      prefix: "gadget-typography"
    });
  }

  function get_setting(key) {
    return mw.cookie.get(key, "gadget-typography", null) === "true";
  }

  function show_hide_str(show, what) {
    return (show ? strings.show : strings.hide).replace("$1", what);
  }

  function update_link(props, shown) {
    var linkText = show_hide_str(shown, props.text);
    var linkTitle = show_hide_str(shown, props.title);

    $("#" + props.buttonID + " a")
      .attr("title", linkTitle)
      .html(linkText);
  }

  // a function to allow custom
  function setupVisibilityButton(key) {

    var props = classUIProperties[key];
    if ($(props.selector).length === 0) {
      // no elements of this type
      return;
    }

    var cookie = get_setting(key);
    var shownAlready;

    if (cookie !== null) {
      // apply the cookie value
      categories[props.category].set(props, cookie);
      shownAlready = cookie;

    } else {
      shownAlready = categories[props.category].is_set(props);
      store_setting(key, shownAlready);
    }

    var click_handler = function(key, props) {
      var shown = categories[props.category].is_set(props);
      categories[props.category].set(props, !shown);
      update_link(props, shown);
      store_setting(key, !shown);
    };

    mw.util.addPortletLink("p-do", "#", "", props.buttonID, "");
    update_link(props, !shownAlready);

    $("#" + props.buttonID)
      .click(function(e) {
        e.preventDefault();
        click_handler(key, props);
      });
  }

  function install_css() {
    var css = ".mw-parser-output a.disabledlink { color: inherit; }";
    $("<style>")
      .text(css)
      .appendTo($("head"));
  }

  // finally, fire the setup, when loaded
  $(function() {

    // user-provided configs
    mw.hook(Visibility.signature + ".config")
      .fire(Visibility.cfg);

    install_css();
    Object.keys(classUIProperties).forEach(function(key) {
      setupVisibilityButton(key);
    });
  });

}(jQuery, mediaWiki));