Difference between revisions of "MediaWiki:Common.js"

Jump to: navigation, search

Difference between revisions of "MediaWiki:Common.js"

Line 1: Line 1:
 +
; (function ($, window, document, undefined) {
 +
    // Add our plugin to fn
 +
    $.fn.extend({
 +
        // Scrollspy is the name of the plugin
 +
        scrollspyv2: function (options) {
 +
            var debug=0;
 +
            if (debug==1) { console.log("A"); }
 +
            // Define our defaults
 +
            var defaults = {
 +
                namespace: 'scrollspy',
 +
                activeClass: 'active',
 +
                animate: false,
 +
                offset: 0,
 +
                container: window
 +
            };
 +
            if (debug==1) { console.log("B"); }
 +
            // Add any overriden options to a new object
 +
            options = $.extend({}, defaults, options);
 +
            if (debug==1) { console.log("C"); }
 +
            // Adds two numbers together
 +
            var add = function (ex1, ex2) {
 +
                if (debug==1) { console.log("AD"); }
 +
                return parseInt(ex1, 10) + parseInt(ex2, 10);
 +
            }
 +
            if (debug==1) { console.log("E"); }
 +
            // Find our elements
 +
            var findElements = function (links) {
 +
                if (debug==1) { console.log("F"); }
 +
                // Declare our array
 +
                var elements = [];
 +
                // Loop through the links
 +
                for (var i = 0; i < links.length; i++) {
 +
                    if (debug==1) { console.log("G"); }
 +
                    // Get our current link
 +
                    var link = links[i];
 +
                    if (debug==1) { console.log("H"); }
 +
                    // Get our hash
 +
                    var hash = $(link).attr("href");
 +
                    if (debug==1) { console.log("I: " + hash); }
 +
                    // Store our has as an element
 +
                    var element = $(document.getElementById(hash.replace("#","")));
 +
                    if (debug==1) { console.log("J: " + element); }
 +
                    // If we have an element matching the hash
 +
                    if (element.length > 0) {
 +
                        if (debug==1) { console.log("K"); }
 +
                        // Get our offset
 +
                        var top = Math.floor(element.offset().top),
 +
                            bottom = top + Math.floor(element.outerHeight());
 +
                        if (debug==1) { console.log("L"); }
 +
                        // Add to our array
 +
                        elements.push({ element: element, hash: hash, top: top, bottom: bottom });
 +
                        if (debug==1) { console.log("M"); }
 +
                    }                   
 +
                }
 +
 +
                // Return our elements
 +
                return elements;
 +
            };
 +
 +
            // Find our link from a hash
 +
            var findLink = function (links, hash) {
 +
                // For each link
 +
                for (var i = 0; i < links.length; i++) {
 +
                    // Get our current link
 +
                    var link = $(links[i]);
 +
                    // If our hash matches the link href
 +
                    if (link.attr("href") === hash) {
 +
                        // Return the link
 +
                        return link;
 +
                    }
 +
                }
 +
            };
 +
 +
            // Reset classes on our elements
 +
            var resetClasses = function (links) {
 +
                // For each link
 +
                for (var i = 0; i < links.length; i++) {
 +
                    // Get our current link
 +
                    var link = $(links[i]);
 +
                    // Remove the active class
 +
                    link.parent().removeClass(options.activeClass);
 +
                    $('.toclevel-2').parent().hide();
 +
                }
 +
            };
 +
 +
            // For each scrollspy instance
 +
            return this.each(function () {
 +
                // Declare our global variables
 +
                var element = this,
 +
                    container = $(options.container);
 +
                // Get our objects
 +
                var links = $(element).find('.toc a');
 +
                // Loop through our links
 +
                for (var i = 0; i < links.length; i++) {
 +
                    // Get our current link
 +
                    var link = links[i];
 +
                    // Bind the click event
 +
                    $(link).on("click", function (e) {
 +
                        // Get our target
 +
                        var target = $(this).attr("href"),
 +
                            $target = $(target);
 +
 +
                        // If we have the element
 +
                        if ($target.length > 0) {
 +
                            // Get it's scroll position
 +
                            var top = add($target.offset().top, options.offset);
 +
                            // If animation is on
 +
                            if (options.animate) {
 +
                                // Animate our scroll
 +
                                $('html, body').animate({ scrollTop: top }, 1000);
 +
                            } else {
 +
                                // Scroll to our position
 +
                                window.scrollTo(0, top);
 +
                            }
 +
                            // Prevent our link
 +
                            e.preventDefault();
 +
                        }
 +
                    });
 +
                }
 +
 +
                // Get our elements
 +
                var elements = findElements(links);
 +
               
 +
                // Add a listener to the window
 +
                container.bind('scroll.' + options.namespace, function () {
 +
                   
 +
                    // Get the position and store in an object
 +
                    var position = {
 +
                        top: add($(this).scrollTop(), Math.abs(options.offset)),
 +
                        left: $(this).scrollLeft()
 +
                    };
 +
                   
 +
                    // Create a variable for our link
 +
                    var link;
 +
 +
                    // Loop through our elements
 +
                    for (var i = 0; i < elements.length; i++) {
 +
 +
                        // Get our current item
 +
                        var current = elements[i];
 +
 +
                        // If we are within the boundries of our element
 +
                        if (position.top >= current.top && position.top < current.bottom) {
 +
                           
 +
                            if (debug==1) { console.log("Top P: " + position.top + '\n' +
 +
                            "Left P: " + position.left + '\n' +
 +
                            "Top C: " + current.top + '\n' +
 +
                            "Left C: " + current.bottom); }
 +
                            // get our element
 +
                            var hash = current.hash;
 +
 +
                            // Get the link
 +
                            link = findLink(links, hash);
 +
                           
 +
                            // If we have a link
 +
                            if (link) {
 +
 +
                                // If we have an onChange function
 +
                                if (options.onChange) {
 +
 +
                                    // Fire our onChange function
 +
                                    options.onChange(current.element, $(element), position);
 +
                                }
 +
 +
                                // Reset the classes on all other link
 +
                                resetClasses(links);
 +
 +
                                // Add our active link to our parent
 +
                                link.parent().addClass(options.activeClass);
 +
                                link.parent().parent().show();
 +
                                link.siblings("ul").show();
 +
                                //link.parent().parent().siblings("ul").show();
 +
                                // break our loop
 +
                                break;
 +
                            }
 +
                        }
 +
                    }
 +
 +
                    // If we don't have a link and we have a exit function
 +
                    if (!link && options.onExit) {
 +
                       
 +
                        // Fire our onChange function
 +
                        options.onExit($(element), position);
 +
                    }
 +
                });
 +
 +
            });
 +
        }
 +
    });
 +
})(jQuery, window, document, undefined);
 +
 +
 +
 
$( document ).ready()
 
$( document ).ready()
  

Revision as of 07:04, 7 February 2019

; (function ($, window, document, undefined) {
    // Add our plugin to fn
    $.fn.extend({
        // Scrollspy is the name of the plugin
        scrollspyv2: function (options) {
            var debug=0;
            if (debug==1) { console.log("A"); }
            // Define our defaults
            var defaults = {
                namespace: 'scrollspy',
                activeClass: 'active',
                animate: false,
                offset: 0,
                container: window
            };
            if (debug==1) { console.log("B"); }
            // Add any overriden options to a new object
            options = $.extend({}, defaults, options);
            if (debug==1) { console.log("C"); }
            // Adds two numbers together
            var add = function (ex1, ex2) {
                if (debug==1) { console.log("AD"); }
                return parseInt(ex1, 10) + parseInt(ex2, 10);
            }
            if (debug==1) { console.log("E"); }
            // Find our elements
            var findElements = function (links) {
                if (debug==1) { console.log("F"); }
                // Declare our array
                var elements = [];
                // Loop through the links
                for (var i = 0; i < links.length; i++) {
                    if (debug==1) { console.log("G"); }
                    // Get our current link
                    var link = links[i];
                    if (debug==1) { console.log("H"); }
                    // Get our hash
                    var hash = $(link).attr("href");
                    if (debug==1) { console.log("I: " + hash); }
                    // Store our has as an element
                    var element = $(document.getElementById(hash.replace("#","")));
                    if (debug==1) { console.log("J: " + element); }
                    // If we have an element matching the hash
                    if (element.length > 0) {
                        if (debug==1) { console.log("K"); }
                        // Get our offset
                        var top = Math.floor(element.offset().top),
                            bottom = top + Math.floor(element.outerHeight());
                        if (debug==1) { console.log("L"); }
                        // Add to our array
                        elements.push({ element: element, hash: hash, top: top, bottom: bottom });
                        if (debug==1) { console.log("M"); }
                    }                    
                }

                // Return our elements
                return elements;
            };

            // Find our link from a hash
            var findLink = function (links, hash) {
                // For each link
                for (var i = 0; i < links.length; i++) {
                    // Get our current link
                    var link = $(links[i]);
                    // If our hash matches the link href
                    if (link.attr("href") === hash) {
                        // Return the link
                        return link;
                    }
                }
            };

            // Reset classes on our elements
            var resetClasses = function (links) {
                // For each link
                for (var i = 0; i < links.length; i++) {
                    // Get our current link
                    var link = $(links[i]);
                    // Remove the active class
                    link.parent().removeClass(options.activeClass);
                    $('.toclevel-2').parent().hide();
                }
            };

            // For each scrollspy instance
            return this.each(function () {
                // Declare our global variables
                var element = this,
                    container = $(options.container);
                // Get our objects
                var links = $(element).find('.toc a');
                // Loop through our links
                for (var i = 0; i < links.length; i++) {
                    // Get our current link
                    var link = links[i];
                    // Bind the click event
                    $(link).on("click", function (e) {
                        // Get our target
                        var target = $(this).attr("href"),
                            $target = $(target);

                        // If we have the element
                        if ($target.length > 0) {
                            // Get it's scroll position
                            var top = add($target.offset().top, options.offset);
                            // If animation is on
                            if (options.animate) {
                                // Animate our scroll
                                $('html, body').animate({ scrollTop: top }, 1000);
                            } else {
                                // Scroll to our position
                                window.scrollTo(0, top);
                            }
                            // Prevent our link
                            e.preventDefault();
                        }
                    });
                }

                // Get our elements
                var elements = findElements(links);
                
                // Add a listener to the window
                container.bind('scroll.' + options.namespace, function () {
                    
                    // Get the position and store in an object
                    var position = {
                        top: add($(this).scrollTop(), Math.abs(options.offset)),
                        left: $(this).scrollLeft()
                    };
                    
                    // Create a variable for our link
                    var link;

                    // Loop through our elements
                    for (var i = 0; i < elements.length; i++) {

                        // Get our current item
                        var current = elements[i];

                        // If we are within the boundries of our element
                        if (position.top >= current.top && position.top < current.bottom) {
                            
                            if (debug==1) { console.log("Top P: " + position.top + '\n' +
                            "Left P: " + position.left + '\n' +
                            "Top C: " + current.top + '\n' +
                            "Left C: " + current.bottom); }
                            // get our element
                            var hash = current.hash;

                            // Get the link
                            link = findLink(links, hash);
                            
                            // If we have a link
                            if (link) {

                                // If we have an onChange function
                                if (options.onChange) {

                                    // Fire our onChange function 
                                    options.onChange(current.element, $(element), position);
                                }

                                // Reset the classes on all other link
                                resetClasses(links);

                                // Add our active link to our parent
                                link.parent().addClass(options.activeClass);
                                link.parent().parent().show();
                                link.siblings("ul").show();
                                //link.parent().parent().siblings("ul").show();
                                // break our loop 
                                break;
                            }
                        }
                    }

                    // If we don't have a link and we have a exit function
                    if (!link && options.onExit) {
                        
                        // Fire our onChange function 
                        options.onExit($(element), position);
                    }
                });

            });
        }
    });
})(jQuery, window, document, undefined);



$( document ).ready()

{
    //Activate windows scroller to highlight links
    $('body').scrollspyv2();
    //Hide TOC from mobile
    $('.toc').addClass('hidden-xs');
    $('.toc').addClass('hidden-sm');
    //On scroll
    $(window).scroll(function(){
      scrollingToc();
    });
    scrollingToc();
}

function scrollingToc()
{
    if($(window).scrollTop()>150)
    {
       $('.toc').removeClass('affix-top toc-top');
       $('.toc').addClass('affix toc-scrolling');
    } else {
       $('.toc').removeClass('affix toc-scrolling');
       $('.toc').addClass('affix-top toc-top');
    }
}

//--------------------Variables for the auto highlighter---------------//
var monthNames = ["January", "February", "March", "April", "May", "June",
  "July", "August", "September", "October", "November", "December"
];

var x = new Date();
x.setMonth(x.getMonth() + 12);

var y = ' || ' + x.getFullYear() + '-' + monthNames[x.getMonth()] + '-' + x.getDate() + ' }}';

//--------------------Visible and Invisible options for the defined text (red,green,blue)---------------//
jQuery.fn.visible = function() {
    return this.css('visibility', 'visible');
};

jQuery.fn.invisible = function() {
    return this.css('visibility', 'hidden');
};

jQuery.fn.visibilityToggle = function() {
    return this.css('visibility', function(i, visibility) {
        return (visibility == 'visible') ? 'hidden' : 'visible';
    });
};

//--------------------Editing Toolbar Buttons---------------//
$.ajax({
  url: 'https://meta.wikimedia.org/w/index.php?title=User:Krinkle/Scripts/InsertWikiEditorButton.js&action=raw&ctype=text/javascript',
  dataType: 'script',
  cache: true
}).done(function () {

  krInsertWikiEditorButton({
    id: "mw-customeditbutton-policiesDiv",
    icon: "//rpm.rcabc.org/resources/assets/policiesDiv.png",
    label: 'Guiding Principles Div',
    insertBefore: '<div class="principles">',
    insertAfter: '</div>',
    sampleText: 'Guiding Principles Div'
  });

        krInsertWikiEditorButton({
    id: "mw-customeditbutton-policiesSpan",
    icon: "//rpm.rcabc.org/resources/assets/policiesSpan.png",
    label: 'Guiding Principles Span',
    insertBefore: '<span class="principles">',
    insertAfter: '</span>',
    sampleText: 'Guiding Principles Span'
  });

         krInsertWikiEditorButton({
    id: "mw-customeditbutton-policiesP",
    icon: "//rpm.rcabc.org/resources/assets/policiesP.png",
    label: 'Guiding Principles Paragraph',
    insertBefore: '<p class="principles">',
    insertAfter: '</p>',
    sampleText: 'Guiding Principles Paragraph'
  });

  krInsertWikiEditorButton({
    id: 'mw-customeditbutton-recommendedDiv',
    icon: '//rpm.rcabc.org/resources/assets/recommendationsDiv.png',
    label: 'Recommended',
    insertBefore: '<div class="recommended">',
    insertAfter: '</div>',
    sampleText: 'Recommended'
  });

       krInsertWikiEditorButton({
    id: 'mw-customeditbutton-recommendedSpan',
    icon: '//rpm.rcabc.org/resources/assets/recommendationsSpan.png',
    label: 'Recommended Span',
    insertBefore: '<span class="recommended">',
    insertAfter: '</span>',
    sampleText: 'Recommended Span'
  });

  krInsertWikiEditorButton({
    id: 'mw-customeditbutton-recommendedP',
    icon: '//rpm.rcabc.org/resources/assets/recommendationsP.png',
    label: 'Recommended Paragraph',
    insertBefore: '<p class="recommended">',
    insertAfter: '</p>',
    sampleText: 'Recommended Paragraph'
  });

  

        krInsertWikiEditorButton({
    id: 'mw-customeditbutton-referenceDiv',
    icon: '//rpm.rcabc.org/resources/assets/referenceDiv.png',
    label: 'Reference Div',
    insertBefore: '<div class="reference">',
    insertAfter: '</div>',
    sampleText: 'Reference Div'
  });

        krInsertWikiEditorButton({
    id: 'mw-customeditbutton-referenceSpan',
    icon: '//rpm.rcabc.org/resources/assets/referenceSpan.png',
    label: 'Reference Span',
    insertBefore: '<span class="reference">',
    insertAfter: '</span>',
    sampleText: 'Reference Span'
  });

        krInsertWikiEditorButton({
    id: 'mw-customeditbutton-referenceP',
    icon: '//rpm.rcabc.org/resources/assets/referenceP.png',
    label: 'Reference Paragraph',
    insertBefore: '<p class="reference">',
    insertAfter: '</p>',
    sampleText: 'Reference Paragraph'
  });
        
        krInsertWikiEditorButton({
    id: 'mw-customeditbutton-tabgroup',
    icon: '//rpm.rcabc.org/resources/assets/tabstart.png',
    label: 'Create Tab Group',
    insertBefore: '<tabs>',
    insertAfter: '</tabs>'
  });
        krInsertWikiEditorButton({
    id: 'mw-customeditbutton-tab',
    icon: '//rpm.rcabc.org/resources/assets/tab.png',
    label: 'Create Tab',
    insertBefore: '<tab name="CHANGE ME">',
    insertAfter: '</tab>'
  });
        krInsertWikiEditorButton({
    id: "mw-customeditbutton-hilite",
    icon: "//upload.wikimedia.org/wikipedia/commons/3/3f/Button_attendre.png",
    label: 'Highlight with Date',
    insertBefore: '{{hilite | ',
    insertAfter: y,
    sampleText: 'Highlight this'
  });
        krInsertWikiEditorButton({
    id: "mw-customeditbutton-hilite",
    icon: "//upload.wikimedia.org/wikipedia/commons/0/08/VisualEditor_-_Icon_-_Strikethrough-a.svg",
    label: 'Strike with Date',
    insertBefore: '{{strike| ',
    insertAfter: y,
    sampleText: 'Strike this'
  });
        krInsertWikiEditorButton({
    id: "mw-customeditbutton-tooltip",
    icon: "//upload.wikimedia.org/wikipedia/commons/2/27/Antu_help_hover.svg",
    label: 'Tooltip popout window',
    insertBefore: '<span class="tooltiptext">',
    insertAfter: '</span>',
    sampleText: 'Tooltip Popout'
  });
});
Retrieved from "http://rpm.rcabc.org/index.php?title=MediaWiki:Common.js&oldid=20233"