FANDOM


  • About your issue in the to-do list, here is a working (?) example I got:

    function getQuery() {
        var query = {};
        for (var part of window.location.search.substring(1).split("&")) {
            var kv = part.split("=");
            if (kv.length === 2) {
                query[kv[0]] = kv[1];
            }
        }
        return query;
    }
    
    (function(mw, $) {
    
        "use strict";
    
        $(document).ready(function() {
    
            function scrollTo(content, selector) {
                var element = content.find(selector).get(0);
                if (element) {
                    element.scrollIntoView();
                }
            }
    
            var initial_hash = window.location.hash && window.location.hash !== "" ? window.location.hash : true,
                initial_tab = getQuery().tab,
                switch_hash = null,
                outer_element = $(initial_hash).get(0);
    
            function switchToTab(tab, hash) {
                $("ul.tabs li a span:contains('" + tab + "')").parent().trigger("click");
                switch_hash = hash;
            }
    
            function processTabBody(content) {
                var $content = $(content);
                if ($content.attr("class") === "tabBody selected") {
                    $content.ready(function() {
    
                        if (initial_hash) {
                            if (initial_tab) {
                                switchToTab(initial_tab, initial_hash);
                                initial_tab = null;
                            } else {
                                if (!outer_element) {
                                    scrollTo($content, initial_hash);
                                }
                                initial_hash = null;
                            }
                        } else {
                            if (switch_hash) {
                                scrollTo($content, switch_hash);
                                switch_hash = null;
                            }
                        }
    
                        $content.find(".tabview_link a").each(function() {
                            $(this).click(function(link_element) {
                                link_element.preventDefault();
                                var href = $(this).attr("href"),
                                    parts = href.split("/").pop().split("#"),
                                    tab = parts[0],
                                    hash = "#" + parts[1];
                                window.location.hash = hash;
                                switchToTab(tab, hash);
                                scrollTo($(".tabBody.selected"), hash);
                            });
                        });
    
                    });
                }
            }
    
            mw.hook("wikipage.content").add(processTabBody);
    
        });
    
    }(mediaWiki, jQuery));
    

    Using Sandbox/Quests as an example, it should:

    May need some more testing / have some edge cases.

      Loading editor
    • Wow, thanks, I'll take a look at this later.

        Loading editor
    • getQuery() is tripping up the resource minifier, particularly the for (... of ...) line. It's expecting a semi-colon somewhere for some reason.

      What exactly creates a URL that has tab=___ anyway? AFAIK tabview doesn't do that...

        Loading editor
    • for (... of ...) is ECMAScript6, maybe it wants ECMAScript5, so

      function getQuery() {
          var query = {};
          var parts = window.location.search.substring(1).split("&");
          for (var i = 0; i < parts.length; ++i) {
              var part = parts[i];
              var kv = part.split("=");
              if (kv.length === 2) {
                  query[kv[0]] = kv[1];
              }
          }
          return query;
      }
      

      the tab=___ part in the query is arbitrary, I just use it to link to a non-default tab from any external link (i.e. not tabview_link, suppose you want to link to G3 inside the Modernization tab from some other unrelated page; all three features are independent: initially it scroll using a given hash in the default tab, or switch to a tab using a given name in the query and then scroll using a given hash, and then there is switching/scrolling using tabview_link). Though query isn't supported that well by MW (can't just write [[Sandbox/Quests?tab=Modernization]]) and also any change to window.location.search will refresh the page (if I start changing it to reflect the current tab), so probably should use a part of the hash instead, with some arbitrary convention like [[Sandbox/Quests#Modernization/G3]] (should switch to the Modernization tab and then scroll to G3). Or just drop this feature (only scroll in the default tab for external links and switch/scroll for tabview_link, unable to link to a non-default tab externally).

        Loading editor
    • A FANDOM user
        Loading editor
Give Kudos to this message
You've given this message Kudos!
See who gave Kudos to this message
Community content is available under CC-BY-SA unless otherwise noted.