Difference between revisions of "Common.js"

 
Line 533: Line 533:
 
         alert("Build template copied!");
 
         alert("Build template copied!");
 
     });
 
     });
});
 
 
$('#build-feedback').click(function(){
 
console.log("test4");
 
$("#build-feedback-input").html('<textarea id="build-feedback-input-area" rows="4" cols="50">test area</textarea>');
 
 
});
 
});

Latest revision as of 14:13, 23 May 2020

/* Any JavaScript here will be loaded for all users on every page load. */

//testing JQuery Plugin
/*!
 * jQuery Textarea AutoSize plugin
 * Author: Javier Julio
 * Licensed under the MIT license
 */
 

(function($, window, document, undefined) {

    var pluginName = "textareaAutoSize";
    var pluginDataName = "plugin_" + pluginName;

    var containsText = function(value) {
        return (value.replace(/\s/g, '').length > 0);
    };

    function Plugin(element, options) {
        this.element = element;
        this.$element = $(element);
        this.init();
    }

    Plugin.prototype = {
        init: function() {
            var height = this.$element.outerHeight();
            var diff = parseInt(this.$element.css('paddingBottom')) +
                parseInt(this.$element.css('paddingTop')) || 0;

            if (containsText(this.element.value)) {
                this.$element.height(this.element.scrollHeight - diff);
            }

            // keyup is required for IE to properly reset height when deleting text
            this.$element.on('input keyup', function(event) {
                var $window = $(window);
                var currentScrollPosition = $window.scrollTop();

                $(this)
                    .height(0)
                    .height(this.scrollHeight - diff);

                $window.scrollTop(currentScrollPosition);
            });
        }
    };

    $.fn[pluginName] = function(options) {
        this.each(function() {
            if (!$.data(this, pluginDataName)) {
                $.data(this, pluginDataName, new Plugin(this, options));
            }
        });
        return this;
    };

})(jQuery, window, document);

document.onload = function() {
    document.getElementById("n-Top-of-the-page").innerHTML = '<a href="#">Top of the page</a>';
};

mw.loader.load('jquery.ui.accordion');

function accordionVideos() {
    jQuery(".accordion").accordion({
        collapsible: true,
        active: false
    });
}

function RGBA(e, alpha) { //e = jQuery element, alpha = background-opacity
    b = e.css('backgroundColor');
    e.css('backgroundColor', 'rgba' + b.slice(b.indexOf('('), ((b.match(/,/g).length == 2) ? -1 : b.lastIndexOf(',') - b.length)) + ', ' + alpha + ')');
}

// after the page has loaded, add the tab and accordion formatting
jQuery(document).ready(function($) {
    mw.loader.using('jquery.ui.accordion', function() {
        accordionVideos();
    });
});

$j(function($) {
    $.fn.MetaBattleToolTip = function(options) {
        return this.each(function() {
            $(this).parent().find('.mbinfo').css({
                visibility: 'hidden',
                display: 'block'
            });
            //To create the proper width, we have to set a min-width hack. There are issues between browsers, this extra step is definitely required.
            posX = 0 - $(this).parent().offset().left;
            posY = $(window).scrollTop() - $(this).parent().offset().top;
            $(this).parent().find('.mbinfo').css({
                'top': posY,
                'left': posX
            });
            //And then here we take the height/width of what it should look like and continue.
            var optionHeight = $(this).parent().find('.mbinfo').outerHeight();
            var optionWidth = $(this).parent().find('.mbinfo').outerWidth();
            var padding = parseInt($(this).parent().find('.mbinfo').css("padding"));
            //Resetting it to be hidden by default having taken the correct parameters
            $(this).parent().find('.mbinfo').css({
                visibility: 'visible',
                display: 'none'
            });
            $(this).parent().find('.mbinfo').css('min-width', optionWidth + 'px');
            $(this).parent().css('display', 'inline');

            $(this).mousemove(function(e) {
                var winW = $(window).innerWidth();
                var winH = $(window).innerHeight();
                var parentElementOffset = $(this).parent().offset();
                var posX = e.pageX - parentElementOffset.left + 5;
                var posY = e.pageY - parentElementOffset.top - optionHeight - 30;
                // $('#mbttts-cursor-data').html('========================<br/>Window Width: '+winW+'<br/> Window Height: '+winH+'<br/> e.pageX: '+e.pageX.toFixed(0)+'<br/> e.pageY: '+e.pageY.toFixed(0)+'<br/> posX: '+posX.toFixed(0)+'<br/> posY: '+posY.toFixed(0)+'<br/> e.clientX: '+e.clientX.toFixed(0)+'<br/> e.clientY: '+e.clientY.toFixed(0)+'<br/> parentElementOffset.left: '+parentElementOffset.left.toFixed(0)+'<br/> parentElementOffset.top: '+parentElementOffset.top.toFixed(0)+'<br/> optionHeight: '+optionHeight+'<br/> optionWidth: '+optionWidth+'<br/>$(window).scrollTop(): '+$(window).scrollTop().toFixed(0)+'<br/>$(window).scrollBottom(): '+($(document).height()-$(window).innerHeight()-$(window).scrollTop()).toFixed(0)+'<br/>========================');
                if ((optionWidth + 20) > (winW - e.clientX)) {
                    //does not fit going right, will it fit going leftwards?
                    posX -= optionWidth + 10;
                    if ((optionWidth + 5) > (e.clientX)) {
                        //does not fit going left either (show as much as possible left to right starting from left)
                        posX = 0 - parentElementOffset.left;
                    }
                }
                if ((optionHeight + 30) > e.clientY) {
                    //does not fit at top, will it fit bottom side?
                    posY += optionHeight + 60;
                    if ((optionHeight + 30) > (winH - e.clientY)) {
                        //does not fit downwards either (show as much as possible top to bottom starting from top)
                        // posX = winW-optionWidth-padding*2+1;
                        posX = 0 - parentElementOffset.left;
                        posY = $(window).scrollTop() - parentElementOffset.top;
                    }
                }
                $(this).parent().find('.mbinfo').css({
                    'top': posY,
                    'left': posX
                });
                $(this).parent().find('.mbinfo').css('display', 'block');
            });

            $(this).mouseout(function() {
                $('.mbinfo').css('display', 'none');
            });
        });
    };
    $.fn.FancyBoxYouTube = function(options) {
        return this.each(function() {
            var title = $(this).text();
            var link = $(this).attr('title');
            $(this).attr('title', '');
            $(this).html('<a class="fancybox-media" title="' + title + '" href="' + link + '">' + title + '</a>');
        });
    };

    $('.mbhoveron > a').attr('title', '');

    $(".anchorize").wrap(function() {
        return "<a href='" + $(this).data('anchor') + "' target='_blank'></a>";
    });
    $(".wraplinkint").wrap(function() {
        return "<a href=\"" + $(this).data('anchor') + "\"></a>";
    });
    $(".ratingURL").wrap(function() {
        return "<a href='//metabattle.com/wiki/Special:Rating?name=" + $(this).data('name').replace(/ /g, "_") + "'></a>";
    });
    $(".linktotwitch").wrap(function() {
        return "<a href='//www.twitch.tv/" + $(this).data('channel') + "' target='_blank'></a>";
    });
    $(".categoriesFooter").each(function() {
        var item = $(this);
        item.next().after(item);
    });

    $(".builds-intro-header").click(function() {

        $header = $(this);
        //getting the next element
        $content = $header.next();
        //fix borders
        //    if ($content.is(":visible")) {
        //$header.css('border-bottom-width', '1px');
        //}
        //else {
        //$header.css('border-bottom-width', '0px');
        //}
        //open up the content needed - toggle the slide- if visible, slide up, if not slidedown.
        $content.slideToggle(500, function() {
            //execute this after slideToggle is done
        });
    });

    $('.mbhoveron').MetaBattleToolTip(); //execute before hiding any inside accordions

    $(".accordNext").next().hide(); //defaults, but hopefully gets proper widths for hoverover items

    $(".accordNext").click(function() {
        $(this).next().slideToggle(500, function() {});
        $(this).toggleClass('expanded');
        var bg = $(this).css('backgroundColor');
        var a = bg.slice(4).split(',');
        var newBg = 'rgba(' + a[0] + ',' + parseInt(a[1]) + ',' + parseInt(a[2]) + ',0.2)';
        $(this).next().css('backgroundColor', newBg);
    });

    $('.mbTV').one("click", function() {
        $(this).unbind('click');
        var width = $(this).data('width'),
            height = $(this).data('height'),
            title = $(this).text(),
            user = $(this).data('twitch-user'),
            cat = $(this).data('twitch-folder'),
            id = $(this).data('twitch-url'),
            aspectRatio = ['16', '9'],
            paddingTop = 0;
        //alert(id);
        if (typeof width === 'undefined' || typeof height === 'undefined') {
            width = 640;
            height = 390;
        }
        //$(this).after('<p style="height:'+height+'px;"><iframe width="'+width+'" height="'+height+'" src="//www.twitch.tv/'+user+'/popout?videoId='+cat+id+' scrolling="no" frameborder="0" allowfullscreen></iframe></p>');
        $(this).after('<p><object bgcolor="#000000" data="//www.twitch.tv/swflibs/TwitchPlayer.swf" height="378" id="clip_embed_player_flash" type="application/x-shockwave-flash" width="620"><param name="movie" value="//www.twitch.tv/swflibs/TwitchPlayer.swf" /><param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" /><param name="allowFullScreen" value="true" /><param name="flashvars" value="channel=' + user + '&amp;auto_play=false&amp;start_volume=25&amp;videoId=' + cat + id + '&amp;device_id=102defeec0f0166e" /></object></p>');
        //$(this).css('visibility', 'hidden');
        $(this).replaceWith('<a href="//www.twitch.tv/' + user + '/' + cat + '/' + id + '" target="_blank" class="external text">' + title + '</a>');
    });

    $('.mainpagetwitch').one("click", function() {
        $(this).unbind('click');
        var title = $(this).text(),
            user = $(this).data('twitch-user');

        //determine best width, over 970 = add chat, default video is 620x378, default chat is 350x500
        var thisWidth = $(this).width(),
            addChat = false,
            widthV = 0,
            heightV = 0,
            widthC = 350;
        if (thisWidth > 970) {
            addChat = true;
            widthV = thisWidth - 350;
        } else {
            widthV = thisWidth;
            if (widthV < 360) {
                widthV = 360;
            }
        }
        heightV = widthV / 1.64021164021164;

        if (addChat) {
            $(this).after('<p class="twitchObj"><div style="display:inline-block; border-top: 1px solid #666666;"><iframe src="//www.twitch.tv/' + user + '/embed" frameborder="0" scrolling="no" height="' + heightV + '" width="' + widthV + '"></iframe></div><div style="display:inline-block; border-top: 1px solid #F2F2F2;"><iframe src="//www.twitch.tv/' + user + '/chat?popout=" frameborder="0" scrolling="no" height="' + heightV + '" width="350"></iframe></div></p>');
        } else {
            $(this).after('<p class="twitchObj"><div style="display:inline-block; border-top: 1px solid #666666;"><iframe src="//www.twitch.tv/' + user + '/embed" frameborder="0" scrolling="no" height="' + heightV + '" width="' + widthV + '"></iframe></div></p>');
        }
        $(this).replaceWith('');
        //<a href="//www.twitch.tv/'+user+'/" target="_blank" class="external text">'+title+'</a>
        //'+user+' '+thisWidth+' '+addChat+' '+widthV+' '+heightV+'
    });

    $('.mbYT').one("click", function() {
        $(this).unbind('click');
        var width = $(this).data('width'),
            height = $(this).data('height'),
            id = $(this).data('youtube-id'),
            aspectRatio = ['16', '9'],
            paddingTop = 0;
        //alert(id);
        if (typeof width === 'undefined' || typeof height === 'undefined') {
            width = 640;
            height = 390;
        }
        $(this).after('<p style="height:' + height + 'px;"><iframe width="' + width + '" height="' + height + '" src="//www.youtube.com/embed/' + id + '?autoplay=1" frameborder="0" allowfullscreen></iframe></p>');
        //$(this).css('visibility', 'hidden');
    });
    $('.mbYTplaylist').one("click", function() {
        $(this).unbind('click');
        var width = $(this).data('width'),
            height = $(this).data('height'),
            id = $(this).data('youtubelist-id'),
            aspectRatio = ['16', '9'],
            paddingTop = 0;
        //alert(id);
        if (typeof width === 'undefined' || typeof height === 'undefined') {
            width = 640;
            height = 390;
        }
        $(this).after('<p style="height:' + height + 'px;"><iframe width="' + width + '" height="' + height + '" src="//www.youtube.com/embed/videoseries?list=' + id + '" frameborder="0" allowfullscreen></iframe></p>');
        //$(this).css('visibility', 'hidden');
    });

    $('.mbGfycat').one("click", function() {
        $(this).unbind('click');
        var size = $(this).data('size'),
            title = $(this).text(),
            id = $(this).data('id'),
            width = 640,
            height = 390; //not used below, changed to "auto"
        if (size >= 3) {
            srvr = 'giant';
        } else if (size >= 1) {
            srvr = 'fat';
        } else {
            srvr = 'zippy';
        }
        //$(this).after('<div class="gfycat"><iframe class="gfycat" src="//gfycat.com/ifr/'+id+'" frameborder="0" scrolling="no" width="'+width+'" height="auto" style="-webkit-backface-visibility: hidden;-webkit-transform: scale(1);" ></iframe></div>');
        //$("iframe.gfycat").load(function(){
        //$('#gfyVid').unwrap();
        //});
        $(this).after('<video class="gfycat" width="' + width + '" height="auto" autoplay loop poster="//thumbs.gfycat.com/' + id + '-poster.jpg" controls><source src="//' + srvr + '.gfycat.com/' + id + '.webm" type="video/webm"><source src="//' + srvr + '.gfycat.com/' + id + '.mp4" type="video/mp4"></video>');
        $(this).replaceWith('<a href="//gfycat.com/' + id + '" target="_blank" class="external text">' + title + '</a>');
    });

    $('#next-process-for-rating-submission').one("click", function(event) {
        event.preventDefault();
        $(this).hide();
        $("div.rating-rules-before-submit").show().delay(800).css("opacity", "1");
    });
    $('.more-comments-link').one("click", function(event) {
        event.preventDefault();
        $(this).hide();
        $("div.extra-votes").show().delay(800).css("opacity", "1");
    });
    $('.show-next-on-click').one("click", function(event) {
        event.preventDefault();
        $(this).hide();
        $(".show-next-on-click + *").show().delay(800).css("opacity", "1");
    });

    $('.main-page-title').parent().children(':first-child').remove();
    $('.main-page-title').parent().parent().parent().children('.firstHeading').remove();

    // remove ads off buildrating page
    $('.mw-special-Rating #mw-content-text').children().eq(0).remove();

    //tab making jazz
    //make sure these two are not in url
    //&action=history
    //&oldid=

    var makeTab = true;

    if (window.location.href.indexOf("&action=history") > -1 || window.location.href.indexOf("&oldid=") > -1 || window.location.href.indexOf("&action=edit") > -1 || $('.noarticletext > p').length) {
        makeTab = false;
    }
    if ($('body.mediawiki').hasClass("mw-special-Rating") && makeTab) {
        $('.mw-special-Rating #p-namespaces > ul > li > span > a').text("Rating");
        var CurTabData = $('.mw-special-Rating #p-namespaces > ul').html();
        var BuildName = $('#firstHeading').text().replace(/ /g, "_").replace("%", "%25");
        if (BuildName != "Recent_ratings")
            $('.mw-special-Rating #p-namespaces > ul').html('<li id="ca-nstab-build"><span><a href="/wiki/Build:' + BuildName + '">Build</a></span></li><li id="ca-talk"><span><a href="/wiki/Build_talk:' + BuildName + '" title="Discussion about the content page [alt-shift-t]" accesskey="t">Discussion</a></span></li>"' + CurTabData);
    } else if ($('body.mediawiki').hasClass("ns-3000") && makeTab) {
        if ($("#hideRatingBoxPl0x").length == 0) {
            var CurTabData = $('.ns-3000 #p-namespaces > ul').html();
            var BuildName = $('#firstHeading').text().replace(/ /g, "_").replace("%", "%25");
            $('.ns-3000 #p-namespaces > ul').html(CurTabData + '<li id="ca-nstab-special"><span><a href="/wiki/Special:Rating?name=Build:' + BuildName + '" title="This is a special page, you cannot edit the page itself">Rating</a></span></li>');
        }
    } else if ($('body.mediawiki').hasClass("ns-3001") && makeTab) {
        if ($("#hideRatingBoxPl0x").length == 0) {
            var CurTabData = $('.ns-3001 #p-namespaces > ul').html();
            var BuildName = $('#firstHeading').text().replace(/ /g, "_").replace("%", "%25");
            $('.ns-3001 #p-namespaces > ul').html(CurTabData + '<li id="ca-nstab-special"><span><a href="/wiki/Special:Rating?name=Build:' + BuildName + '" title="This is a special page, you cannot edit the page itself">Rating</a></span></li>');
        }
    }
    //Foreground Skin below
    var BuildPage = $('body.skin-foreground').hasClass("ns-3000");
    var BuildTalk = $('body.skin-foreground').hasClass("ns-3001");
    var GuidePage = $('body.skin-foreground').hasClass("ns-3006");
    var TeamPage = $('body.skin-foreground').hasClass("ns-3008");
    if ($('body.skin-foreground').hasClass("mw-special-Rating")) {
        if (makeTab) {
            var BuildName = $('#firstHeading').text().replace(/ /g, "_").replace("%", "%25");
            if (BuildName != "Recent_ratings") {
                //re-do "actions" tab here
                $('#drop1').html('<li id="ca-nstab-build"><a href="/wiki/Build:' + BuildName + '"><div class="drop-icon"><i class="fa fa-file fa-fw"></i></div>Build</a></li><li id="ca-talk" class="selected"><a href="/wiki/Build_talk:' + BuildName + '" title="Discussion about the content page [alt-shift-t]" accesskey="t"><div class="drop-icon"><i class="fa fa-comments-o fa-fw"></i></div>Discussion</a></li><li id="ca-rating"><a href="/wiki/Special:Rating?name=Build:' + BuildName + '" title="Rating for the build page [alt-shift-g]" accesskey="g"><div class="drop-icon"><i class="fa fa-balance-scale fa-fw"></i></div>Rating</a></li>');
            }
        } else {
            var BuildName = $('#firstHeading').text().replace(/ /g, "_").replace("%", "%25");
            if (BuildName == "Recent_ratings") {
                //remove actions bar
                $('#actionsbar').hide();
            }
        }
    } else if ((BuildPage || BuildTalk) && makeTab) {
        if ($("#hideRatingBoxPl0x").length == 0) {
            //var CurTabData = $('#drop1').html();
            var BuildName = $('#firstHeading').text().replace(/ /g, "_").replace("%", "%25");
            $('#drop1 li:nth-child(2)').after('<li id="ca-rating"><a href="/wiki/Special:Rating?name=Build:' + BuildName + '" title="Rating for the build page [alt-shift-g]" accesskey="g"><div class="drop-icon"><i class="fa fa-balance-scale fa-fw"></i></div>Rating</a></li>');
            if (BuildPage) {
                //add to ToC both Ratings + Comments
                $("#toc > ul").append('<li class="toclevel-1"><a href="#rating_thread"> <span class="toctext">Rating</span></a></li>' + "\n" + '<li class="toclevel-1"><a href="#disqus_thread_row"> <span class="toctext">Comment</span></a></li>');
            }
        } else if (BuildPage) {
            $(".row.ratings").remove();
            //add only Comments to ToC
            $("#toc > ul").append('<li class="toclevel-1"><a href="#disqus_thread_row"> <span class="toctext">Comment</span></a></li>');
        }
    } else if ((TeamPage || GuidePage) && makeTab) {
        $("#toc > ul").append('<li class="toclevel-1"><a href="#disqus_thread_row"> <span class="toctext">Comment</span></a></li>');
    }

    //user rating
    /*
    $("#labelForCheckboxHeart").click(function(){
      var checkbox = $("#checkboxHeart");
      // alert($("#checkboxHeart").prop("checked"));
      if(checkbox.is(":checked")) {
        // checkbox.toggle(checkbox.checked);
        checkbox.prop("checked", false);
        $("#labelForCheckboxHeart").html("<span></span>This is a bad build");
      }
      else {
        checkbox.prop("checked", true);
        // checkbox.toggle(checkbox.checked);
        $("#labelForCheckboxHeart").html("<span></span>This is a good build");
      }
    });
    */

    var text_max = 1500;
    $('#textareaCharactersLeft').html(text_max + ' characters remaining');

    $('#commentTextarea').keyup(function() {
        var text_length = $('#commentTextarea').val().length;
        var text_remaining = text_max - text_length;
        $('#textareaCharactersLeft').html(text_remaining + ' characters remaining');
    });

    $('#p-navigation > div.body > ul').children().eq(1).html('<a href="/wiki/MetaBattle:Community_portal">Community portal</a> (<a href="/wiki/MetaBattle_talk:Community_portal">talk</a>)');
    $('#p-tb-label').remove();
    $('#p-donate-label').remove();
    $('#toc').nextAll('h2:first').css({
        "width": "auto",
        "padding-top": "0",
        "margin-top": "0",
        "border-top": "0"
    });
    $('.rating-template-meta').nextAll('h2:first').css({
        "width": "auto",
        "padding-top": "0",
        "margin-top": "0",
        "border-top": "0"
    });
    $('.rating-template-non-meta').nextAll('h2:first').css({
        "width": "auto",
        "padding-top": "0",
        "margin-top": "0",
        "border-top": "0"
    });

    var img1 = new Image();
    img1.src = '//metabattle.com/wiki/skins/common/images/logo32px-glow100.png';

    $('textarea.js-auto-size').textareaAutoSize();
});

$('#dsq-app7').remove();

$(window).bind("load", function() {
    $('#dsq-app7').remove();
});

$(document).load(function() {
    $('#dsq-app7').remove();
});

/* CUSTOM JS */

/* Select a text and copy it to clipboard (requires class customjs-selectcoppy) */
function selectTextCommand(id) {
    var element = document.getElementById(id);

    if (document.selection) { // IE
        var range = document.body.createTextRange();
        range.moveToElementText(element);
        range.select();

        element.execCommand("copy");
    } else if (window.getSelection) { // Chrome, etc
        var range = document.createRange();
        range.selectNode(element);
        window.getSelection().selectAllChildren(element);
        // Temporarily enable designMode so that document.execCommand() will work
        document.designMode = "on";
        // Execute the command
        document.execCommand("copy", false, element.textContent);
        // Disable designMode
        document.designMode = "off";
    }

    var notice = element.parentNode.querySelector('.notice');
    if (notice) {
        notice.style.display = "block";
        setTimeout(function() {
            notice.style.display = "none";
        }, 2000);
    }
}

$(document).ready(function() {
    var selectCounter = 1;

    $(".customjs-selectcopy").each(function() {
        var containerId = "selectcopy" + selectCounter;
        $(this).attr('id', containerId);
        $(this).attr('onclick', 'selectTextCommand(this.id)');
        $(this)[0].addEventListener('copy', function(event) {
            event.preventDefault();
            if (event.clipboardData) {
                event.clipboardData.setData("text/plain", this.textContent);
                //console.log(event.clipboardData.getData("text"))
            }
        });

        selectCounter++;
    });
});

jQuery(document).ready(function() {
    if (jQuery('#adcontainer').height() == 0) {
        $("#blockerEnabled").css("display", "block");
    }
});

$(document).ready(function() {
    $("#copy-button").click(function() {
        var range = document.createRange();
        range.selectNode(document.getElementById("build-template-1"));
        window.getSelection().removeAllRanges();
        window.getSelection().addRange(range);
        document.execCommand("copy");
        window.getSelection().removeAllRanges();
        alert("Build template copied!");
    });
});