User:Bradv/Scripts/Quickview.js

//User:Bradv/Scripts/Quickview.js (function( $, mw ) {   'use strict';

var quickview = { typeEnum: { CONTRIBS : 1, WATCHLIST : 2, RECENT: 3, RELATED: 4, HISTORY: 5, CATEGORY: 6, RESULTS: 7, DELCONTRIBS: 8, LOG: 9 },       type: 0, styleSheet: null, chkEnabled: null, changeslist: null, selector: null, init: function(qvType) { quickview.type = qvType; quickview.styleSheet = mw.util.addCSS(               ":root { --width: 40vw } " +                "body.quickview {margin-right: var(--width)} " +                "body.quickview #p-personal {margin-right: var(--width)} " +                "body.quickview #right-navigation {margin-right: var(--width)} " +                "body:not(.quickview) #quickview {display: none} " +                "#quickview {position:fixed; top: 0; right: 0; bottom: 0; width: var(--width); border-left: 2px solid #a7d7f9; box-shadow: 0px 0px 4px 2px #eee; background-color: #fcfdfe; padding-top:10px;} " +                "#quickview:before {top: -100px; content: ; position: absolute; left: -30px; width: 0; height: 0; border: 15px solid transparent; border-right-color: #a7d7f9; margin-top:-15px;} " +                "#quickview:after  {top: -100px; content: ; position: absolute; left: -25px; width: 0; height: 0; border: 15px solid transparent; border-right-color: transparent; margin-top:-15px;} " + "#quickview-slider {position:absolute; top: 20px; left: -10px; bottom: 0; width: 15px; opacity: 0; cursor: ew-resize; } " + "#quickview-content {overflow: auto scroll; height: calc(100% - 120px); width: calc(100% - 20px); padding: 10px 10px 100px; line-height: 1.6; font-size: 0.875em;} " + "#quickview-content .mw-revslider-container, #quickview-content .ve-init-mw-diffPage-diffMode {display:none} " + "#quickview-content > #empty {position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #a7d7f9; font-size: 1.5em; font-weight: bold; text-align:center;} " + "#quickview-content > #empty img {width: 30px; height: 30px; opacity:0.5;} " + "#quickview-content > #empty #empty-sub {font-size: 0.8em; font-weight: normal; padding-top: 1em;} " + "#quickview-content > #empty #empty-sub a {opacity: 0.5} " + ".quickview-active, .quickview-active:link, .quickview-active:active, .quickview-active:hover, .quickview-active:visited { color: orange !important; text-shadow: 0px 0px 1px white !important} " + "#quickview-popout {display:block; position:absolute; top:0; left:0px; width: 10px; height: 10px; background-color: #a7d7f9; padding: 1px; line-height:8px;} " + "#quickview-popout img {width: 8px; height: 8px;} " + "body.quickview .mw-changeslist-legend {display:none;} " + ""           );            if ([quickview.typeEnum.WATCHLIST, quickview.typeEnum.RECENT, quickview.typeEnum.RELATED].indexOf(qvType)>-1 && $("#mw-content-text > .mw-rcfilters-ui-changesListWrapperWidget").length) {               quickview.changeslist = ".mw-rcfilters-ui-changesListWrapperWidget";                quickview.selector = ".mw-rcfilters-ui-changesListWrapperWidget > *:not(.mw-changeslist-legend) a:not(.mw-unwatch-link)";            } else if (qvType == quickview.typeEnum.CONTRIBS && $(".mw-contributions-list").length) {                quickview.changeslist = ".mw-contributions-list";                quickview.selector = ".mw-contributions-list a";            } else if (qvType == quickview.typeEnum.DELCONTRIBS && $("#mw-content-text > ul").length) {                quickview.changeslist = "#mw-content-text > ul";                quickview.selector = "#mw-content-text > ul a";            } else if (qvType == quickview.typeEnum.HISTORY && $("ul#pagehistory").length) {                quickview.changeslist = "ul#pagehistory"; quickview.selector = "ul#pagehistory a"; } else if (qvType == quickview.typeEnum.CATEGORY && $(".mw-category").length) { quickview.changeslist = ".mw-category-generated"; quickview.selector = ".mw-category-generated a"; console.log("category"); } else if (qvType == quickview.typeEnum.RESULTS && $(".searchresults").length) { quickview.changeslist = ".mw-search-results"; quickview.selector = ".mw-search-result-heading a"; } else if (qvType == quickview.typeEnum.LOG && $("#mw-content-text ul").length) { quickview.changeslist = "#mw-content-text ul"; quickview.selector = "#mw-content-text ul li a"; } else { console.log("Quickview did not load."); return; }           console.log("Quickview: " + qvType); mw.loader.load("mediawiki.diff.styles");

var quickviewWrapper = document.createElement("div"); quickviewWrapper.id="quickview"; var quickviewContent = document.createElement("div"); quickviewContent.id="quickview-content"; $("body").append(quickviewWrapper); $(quickviewWrapper).append(quickviewContent); var quickviewPopout = document.createElement("a"); quickviewPopout.id="quickview-popout"; quickviewPopout.target="_blank"; var img = document.createElement("img"); img.src = "https://upload.wikimedia.org/wikipedia/commons/e/eb/OOjs_UI_icon_newWindow-ltr.svg"; quickviewPopout.append(img); $(quickviewWrapper).append(quickviewPopout);

quickview.chkEnabled = new OO.ui.CheckboxInputWidget( {               value: 'quickview',                selected: true,            } ); var fieldset = new OO.ui.FieldsetLayout( {id: 'quickview-fieldset'} ); fieldset.addItems( [new OO.ui.FieldLayout(quickview.chkEnabled, { label: $( ' Load links in split screen (Quickview) ' ), align: 'inline' } ) ] );           $(quickview.changeslist).before(fieldset.$element); quickview.chkEnabled.on("change", function(value) {               if (value) quickview.enable; else quickview.disable;            }); $(document).scroll(quickview.scroll); if (localStorage.getItem("quickview:" + quickview.type)=="disabled") { quickview.chkEnabled.setSelected(false); } else { quickview.enable; }

var quickviewSlider = document.createElement("div"); quickviewSlider.id="quickview-slider"; $(quickviewWrapper).append(quickviewSlider); var qvs = $(quickviewSlider); qvs.mousedown(function(event) {               if (event.which==1) {                    qvs.mm = function(event) {                        event.preventDefault;                        quickview.resize("calc(100vw - 12px - " + event.pageX + "px)", true);                    }                    $("body").mousemove(qvs.mm);                    $("body").mouseup(function(event) { $("body").off("mousemove", qvs.mm); quickview.resize; });               }            });

console.log("Quickview loaded"); },       scroll: function { if (quickview.sstemp) { $(quickview.sstemp.ownerNode).remove; }           var active = $(".quickview-active"); if (active.length) { var pos = $(active).offset.top - $(document).scrollTop + ($(active).outerHeight/2); quickview.sstemp = mw.util.addCSS('#quickview:before {top: ' + pos + 'px} #quickview:after {top: ' + pos + 'px}'); }       },        clickhandler: function(event) { var target = event.currentTarget; event.preventDefault; function msg(text) { var c = $("#quickview-content"); c.empty; var div = document.createElement("div"); div.id="empty"; div.append(document.createTextNode(text)); c.append(div); }           function msgLoading { var c = $("#quickview-content"); c.empty; var div = document.createElement("div"); div.id="empty"; var svg = document.createElement("img"); svg.src="https://upload.wikimedia.org/wikipedia/commons/3/30/Chromiumthrobber.svg"; div.append(svg); c.append(div); }           function msgErr(url) { var c = $("#quickview-content"); c.empty; var div = document.createElement("div"); div.id="empty"; c.append(div); $(div).html("Page could not be displayed. Open in new tab."); }           function load(url) { $("#quickview-popout").attr("href", url); $("#quickview-content").load(url + " #mw-content-text", function(response, status, xhr) {                   if(status=="success") {                        var content = $("#quickview-content");                        if (content.children.length===0) msg("No results");                        $(content).find("form.mw-contributions-form").remove;                        $("#quickview-content form[action]").attr('target', '_blank')                        $(content).find("a[href]:not([href^='#'])").attr('target', '_blank');

if (url.indexOf("#")>=0) { var hash = url.substring(url.indexOf("#")+1); hash = $.escapeSelector(hash); $(content).scrollTop($("#quickview-content #" + hash).offset.top-$(content).offset.top); }                       try { $("#quickview-content .mw-collapsible").makeCollapsible; } catch (e) {}                   } else { console.log(xhr); msgErr(url); }               });            }            var url = target.href;            $(".quickview-active").removeClass("quickview-active");            $(target).addClass("quickview-active");            $("#quickview-content").empty;            msgLoading;            load(url);            quickview.show;        },        observer: null,        enable: function {            localStorage.setItem("quickview:" + quickview.type, "enabled");            function bind {                $(quickview.selector).click(quickview.clickhandler);                quickview.scroll;            }            quickview.observer = new MutationObserver(bind);            quickview.observer.observe($(quickview.changeslist).get(0), {childList: true, subtree: true});            bind;        },        disable: function {            localStorage.setItem("quickview:" + quickview.type, "disabled"); if (quickview.observer) quickview.observer.disconnect; $(quickview.selector).off("click"); quickview.hide; },       show: function { $("body").addClass("quickview"); quickview.scroll; quickview.resize; },       hide: function { $("body").removeClass("quickview"); $(".quickview-active").removeClass("quickview-active"); quickview.resize; },       resize: function(val, suppresstrigger) { if (val) document.body.style.setProperty('--width', val); if (!suppresstrigger) window.dispatchEvent(new Event('resize')); }   };

var cspn = mw.config.get("wgCanonicalSpecialPageName"); if (cspn=="Contributions") { mw.loader.using("mediawiki.util").then(function {            quickview.init(quickview.typeEnum.CONTRIBS)        }); } else if (cspn=="DeletedContributions") { mw.loader.using("mediawiki.util").then(function {            quickview.init(quickview.typeEnum.DELCONTRIBS)        }); } else if (cspn=="Watchlist") { mw.loader.using("mediawiki.rcfilters.filters.ui").then(function {            quickview.init(quickview.typeEnum.WATCHLIST)        }); } else if (cspn=="Recentchanges") { mw.loader.using("mediawiki.rcfilters.filters.ui").then(function {            quickview.init(quickview.typeEnum.RECENT)        }); } else if (cspn=="Recentchangeslinked") { mw.loader.using("mediawiki.rcfilters.filters.ui").then(function {            quickview.init(quickview.typeEnum.RELATED)        }); } else if (mw.config.get("wgAction")=="history") { mw.loader.using("mediawiki.util").then(function {            quickview.init(quickview.typeEnum.HISTORY)        }); } else if (mw.config.get("wgCanonicalNamespace")=="Category") { mw.loader.using(["mediawiki.util", "oojs-ui-core"]).then(function {            quickview.init(quickview.typeEnum.CATEGORY)        }); } else if (cspn=="Search") { mw.loader.using("mediawiki.util").then(function {			quickview.init(quickview.typeEnum.RESULTS)		}); } else if (cspn=="Log" || cspn=="CheckUserLog") { mw.loader.using(["mediawiki.util", "oojs-ui-core"]).then(function {            quickview.init(quickview.typeEnum.LOG)        }); } }(jQuery, mediaWiki ));