Difference between revisions of "MediaWiki:Common.js"

Revision as of 00:59, 12 September 2018

/* Scripts within main function will load on all pages for all users */
(function main() {
  /* Cowboy Changes
    // Propegation Test
    // jQuery on every page
    //
    //
    //
     */

  /* Ideas to implement
    //
    // Investigation List page popup in bottom right to notify of popup on-click functionality
    //
    // Load images when popup is opened instead of loading image into every row to optimize load performance
        Alternately explore using {{tableDraw}} to put static hidden images on page when the row's query is made
        taking load off JS since elements do not need to be created on each page load.
    //
    // Detection of weird characters in titles to form them correctly for links and content (ie + -> %2B)
    //
    // Subtle info popup to inform about row click popup on investigation list page
    //
    // EditorTools functionality
    //
    // Much sweeter main page
    //
    // When you get a page that doesn't exist, use smw to query about it. If a page is found that way, redirect to it
        In this way, case-misspellings like Inside arg will correct if a page exists with that name, ie Inside ARG (the actual page)
    //
    // Send "winners" to external site (mattb.xyz) for verification as way of tracking. Enter code to reveal prize
        This way it is known when the prize needs to be renewed
     */

  /* Function to load jQuery into a page */

  function jQueryLoad(code) {

    var jQuery = document.createElement('script');
    jQuery.setAttribute('src', '//code.jquery.com/jquery-3.3.1.min.js');
    jQuery.setAttribute('async', 'true');
    jQuery.setAttribute('integrity', 'sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=');
    jQuery.setAttribute('crossorigin', 'anonymous');

    jQueryLoad.onload = (function () {
      console.log('jQuery version ' + jQuery.src + ' is loaded.');
      jQuery.onload = code;
    })();

    document.getElementsByTagName('head')[0].appendChild(jQuery);
  }


  /* Function to load jQuery (prerequisite) and jQueryUI into a page */

  function jQueryUILoad(code) {

    var jQueryUI = document.createElement('script');
    jQueryUI.setAttribute('src', '//code.jquery.com/ui/1.12.1/jquery-ui.min.js');
    jQueryUI.setAttribute('integrity', 'sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=');
    jQueryUI.setAttribute('crossorigin', 'anonymous');

    var jQueryCSS = document.createElement('link');
    jQueryCSS.setAttribute('rel', 'stylesheet');
    jQueryCSS.setAttribute('href', '//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css');

    document.getElementsByTagName('head')[0].appendChild(jQueryUI);
    document.getElementsByTagName('head')[0].appendChild(jQueryCSS);

    jQueryUILoad.onload = (function () {
      console.log('jQueryUI version ' + jQueryUI.src + ' is loaded.');
      jQueryUI.onload = code;
    })();
  }

  /* Function to capture page's URL from meta properties */

  var checkURL = (function checkURL() {
    var metas = document.getElementsByTagName('meta');

    for (var i = 0; i < metas.length; i++) {
      if (metas[i].getAttribute('property') === 'og:url') {
        return metas[i].getAttribute('content');
      }
    }

    return '';
  })();

  /* User Verification */

  setTimeout(function() {
    var whoAmI = (function () {
      var claim = '';
      if(document.getElementById('pt-userpage')) {
        claim = document.getElementById('pt-userpage').innerText;
      }
      if (claim.match('Mattyb') || claim.match('Lucario') || claim.match('Crash') || claim.match('Picapi')) {
        return true;
      } else {
        return false;
      }
    })();

    /* Function to obstruct prying eyes */

    // Bail out if it isn't a common code page
    if (checkURL.match('Common.')) {
      (function hideCode() {
        if (whoAmI === false) {
          document.getElementById('content').innerHTML = '<span>[REDACTED]</span><!--nothingtoseehere ?-->';
          //document.getElementsByClassName('mw-code')[0].innerText = '[REDACTED]';
          //document.getElementById('ca-viewsource').style = 'display:none';
          //document.getElementById('ca-history').style = 'display:none';
        }
      })();
    }
  }, 50);

  /* Load jQuery on every page */

  jQueryLoad(function() {

    /* Popup onclick for SMW matty tables */
    // Bail out if it isn't the Investigation List page
    if (checkURL.match('List_of_Investigations')) {

      jQueryUILoad(function tablePopup() {

        // Define vars
        var animationReady = false;
        var clicked;
        var cnt = 0;

        // Create variable clicked to capture clicked elements
        this.addEventListener('click', clicked = function (event) {
          return $(event.target);
        });

        // Iterate n to loop through each table row
        for (var n = 1; cnt === 0; n++) {

          var tableRow = 'tableRow' + n;

          // Check that the table row exists
          if ($(tableRow) != null) {

            // Select the table row and set it's ID selector
            var row = document.getElementById(tableRow);

            // Break the loop if the row is null
            if (row === null) {
              break;
            }

            // Set the id for the dialog elements that are hidden on the page and a identifier for the dialog on screen
            var dialogID = '#dialog' + n;
            var uiID = 1;

            // Add the click event listener and popup function to the given row
            row.addEventListener('click', function (dialogID, clicked) {

              // Check if what has been clicked is a table element of some kind
              if (!clicked.target.parentElement.id.toString().match('tableRow')) ;

              //Only proceed if not a link
              else {

                // Create the popup & define settings
                $(dialogID).dialog({
                  modal: true,
                  minHeight: 300,
                  minWidth: 600,
                  width: 900,
                  dialogClass: dialogID,
                  position: {my: 'center', at: 'center', of: '#' + clicked.target.parentElement.id},
                  create: function () {

                    // When creating a given dialog, grab the title and form it into a link
                    var thisDialog = document.getElementById('ui-id-' + uiID);
                    var title = thisDialog.innerHTML;
                    thisDialog.innerHTML = '<span style="color: #b02e2e !important; padding-left:74px !important;"><a href="https://wiki.gamedetectives.net/index.php?title=' + title + '">' + title + '</a></span>';
                    uiID++;
                  },

                  open: function () {
                    setTimeout(function () {
                      animationReady = true;
                    }, 500);
                  },
                  show: {effect: 'clip', direction: 'vertical', duration: 500, easing: 'swing', delay: 100},
                  hide: 'fade',
                  beforeClose: function () {

                    // Before a dialog closes, animate the border using transfer
                    $(dialogID).transfer({
                      to: '#' + clicked.target.parentElement.id,
                    });
                  },
                  close: function (row) {

                    // Once the dialog closes, figure out which row it came from by capturing the current value of row
                    return function () {
                      var thisRowID = row.target.getAttribute('id').replace('dialog', '#tableRow');

                      // Add animation classes to the given row
                      $(thisRowID).addClass('tableAnimation');

                      // Remove the animation classes as soon as the animation is finished
                      setTimeout(function () {
                        $(thisRowID).removeClass('tableAnimation');
                      }, 500);
                    }(row);
                  },
                  buttons: [
                    {
                      text: 'Close',
                      icon: 'ui-icon-closethick',
                      click: function () {

                        // Close the dialog when the close button is clicked
                        $(this).dialog('close');
                      }
                    }
                  ]
                });
              }

              // Bind dialogID to function
            }.bind(null, dialogID));

            // Force animations and css styles on grumpy rows
            if (document.getElementById('tableCol1-' + n).innerText.match('2077')) {
              $(row).addClass('tableRowCP');
            }
            else if (document.getElementById('tableCol1-' + n).innerText.match('2015')) {
              $(row).addClass('tableRow');
            }

            // Define variables to be used for the title of the popup by grabbing the title from the name col of the row the popup came from
            var nameCol = document.getElementById('tableCol1-' + n).innerText;
            var nameColID = nameCol.replace(/ /g, '_');

            // Define variables for populating popup content from code and from user
            var dialogContent = '';
            var userDialogContent = '';

            // Check if there is user-defined popup content for a given ARG
            if (document.getElementById(nameColID + '-popup') != null) {

              // If there is, set a var to it
              userDialogContent = document.getElementById(nameColID + '-popup').innerHTML;
            }

            // If there isn't, set a var to a premade string
            else {
              dialogContent = 'Popup content for ' + nameCol + ' coming soon!';
            }

            // Insert the popup's HTML into the row is belongs to and add content
            row.innerHTML += ('<div style="display:none" id="dialog' + n + '"' + ' title="' + nameCol + '"' + n + '"></a>' + '\n' +
              '<div>' + dialogContent + '\n' +
              userDialogContent + '</div>\n' +
              '</div>');
          }
        }

        // Listen for document clicks on the modal overlay to enable closing of dialog when clicking outside popup
        $(document).click(function (clicked) {
          if (clicked.target.classList[0] === 'ui-widget-overlay' && animationReady === true) {
            $('.ui-dialog-titlebar-close').trigger('click');
            animationReady = false;
          }
        });
      });
      if (document.getElementById('catlinks') != null) {
        document.getElementById('catlinks').style = 'display:none';
      }
    }

    /* Function to check if a given element is in view */

    if(checkURL.match('Monte')) {

      (function tocMagic() {

        function Utils() {

        }

        Utils.prototype = {
          constructor: Utils,
          isElementInView: function getCurrentView(element, fullyInView) {
            var pageTop = $(window).scrollTop();
            var pageBottom = pageTop + $(window).height();
            var elementTop = $(element).offset().top;
            var elementBottom = elementTop + $(element).height();

            if (fullyInView === true) {
              return ((pageTop < elementTop) && (pageBottom > elementBottom));
            } else {
              return ((elementTop <= pageBottom) && (elementBottom >= pageTop));
            }
          }
        };

        var Utils = new Utils();

        var isElementInView = Utils.isElementInView($('#toc'), false);
        var elementViewCount = 0;
        var tocFloat = document.createElement('div');
        tocFloat.setAttribute('class', 'toc');
        tocFloat.setAttribute('class', 'tocFloat');
        tocFloat.innerHTML += document.getElementById('toc').innerHTML;
        tocFloat.innerHTML = tocFloat.innerHTML.replace('Contents', '');
        tocFloat.innerHTML = tocFloat.innerHTML.replace('[<a role="button" tabindex="0" class="togglelink">hide</a>]', '');
        tocFloat.innerHTML = tocFloat.innerHTML.replace('&nbsp;&nbsp;', 'Contents');

        document.onscroll = function () {

          isElementInView = Utils.isElementInView($('#toc'), false);

          if (!isElementInView) {
            if (elementViewCount === 0) {
              tocFloat.style = 'display:show';
              document.getElementById('mw-panel').appendChild(tocFloat);
              console.log('element out of view');
            }
            elementViewCount++;
          }
          else {
            elementViewCount = 0;
            tocFloat.style = 'display:none';
          }
        };
      })();
    }


    /* Script for building EditorTools page */

    // Bail out if it isn't the Editor Tools page
    /*if (checkURL.match('EditorTools')) {
        jQueryUILoad(function() {
          // Using jQuery
          $.ajax( {
            url: remoteUrlWithOrigin,
            data: queryData,
            dataType: 'json',
            type: 'POST',
            headers: { 'Api-User-Agent': 'GameDetectives EditorTools (https://wiki.gamedetectives.net/index.php?title=EditorTools; [email protected])' },
            success: function(data) {
              // do something with data
            }
          } );

        } );
      }*/


    /* Say Hello */

    (function helloThere() {
      if (checkURL.match('Main_Page')) {
        console.log('\n' +
          '                          ........                          \n' +
          '                  hs+:.````` ` ` ````.:+sh                  \n' +
          '        _ on+so/:.` ` ` ` ` ` ` ` ` ` ` ` .:\\os+no _       \n' +
          '      /e ` ` ` ` ` ` W E L C O M E `T`O` ` ` ` ` ` e\\      \n' +
          '     c` ` ` ` ` G A M E `D`E`T`E`C`T`I`V`E`S` ` ` ` ` r     \n' +
          '     H ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` `t     \n' +
          '    e.` ` ` ` ` ` ` ` ` -:. ` ` `.:-` ` ` ` ` ` ` ` ` .a    \n' +
          '   c-` ` ` ` ` ` ` ` `/dNNNh/--/hNNNd/ ` ` ` ` ` ` ` ` `p   \n' +
          ' K+.` ` ` ` ` ` ` ` `+NNNNNNNNNNNNNNNN+ ` ` ` ` ` ` ` ` `+N \n' +
          '+ ` ` ` ` ` ` ` ` ` sNNNNNNNNNNNNNNNNNNs ` ` ` ` ` ` ` ` ` o\n' +
          'O` ` ` ` ` ` ` ` ` sNNNNNNNNNNNNNNNNNNNNs ` ` ` ` ` ` ` ` `+\n' +
          'U ` ` ` ` ` ` ` ` oNNNNNNNNNNNNNNNNNNNNNNo ` ` ` ` ` ` ` ` s\n' +
          'T` ` ` ` ` ` ` ` /mmmmmmmmmmmmmmmmmmmmmmmm/ ` ` ` ` ` ` ` `u\n' +
          '+ ` ` ` ` ` .:+oymNNNNNNNNNNNNNNNNNNNNNNNNmyo+:. ` ` ` ` ` +\n' +
          'O` ` ` -:+shhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhbb+:- ` ` `D              Like what you see? Get Involved!\n' +
          'U ` ` ` ` ` ` ` ` ` ./oosso/-``./+ooo+:. ` ` ` ` ` ` ` ` ` N\n' +
          'R` ` ` ` ` ` ` ` ` -mNNNNNNNm::mNNNNNNNd- ` ` ` ` ` ` ` ` `I             https://discord.gamedetectives.net\n' +
          '+ ` ` ` ` ` ` ` ` `-mNNNNNNNh..hNNNNNNNm.` ` ` ` ` ` ` ` ``F              https://twitter.com/G_detectives\n' +
          'A` ` ` ` ` ` ` ` ` `:dNNNNh/```./hNNNNd-` ` ` ` ` ` ` ` ` `+                 https://gamedetectives.net\n' +
          'R ` ` ` ` ` ` ` ` ` `.:+/-````````-/+: ` ` ` ` ` ` ` ` ` ` D\n' +
          'G` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` E\n' +
          '+/` ` ` ` .os+:.` ` ` ` ` ` ` ` ` ` ` ` ` ` .:+so.` ` ` ` `O          Want cooler stuff? Support GD on Patreon!\n' +
          ' A ` ` ` ` .racecar/.` ` ` ` ` ` ` ` ` ./racecar.` ` ` ` `c \n' +
          ' `c ` ` ` ` `sNNNNNNs ` ` ` ` ` ` ` ` `sNNNNNNs ` ` ` ` `s`            https://www.patreon.com/gamedetectives/\n' +
          '  a` `/oxbyttamNNNNNmy+. ` ` ` ` ` `.+ymNNNNNmattybxo/ ` i  \n' +
          '  D/` .diNNNNNNNNNNER+:os/. ` ` `./so:+NNNNNNNNNNNNOd.` /d  \n' +
          '  `e-` :mNNNNNNNNNNNNm-``-++:` :++-``-mNNNNNNNNNNNNm:` -+`  \n' +
          '   `M.` /mNNNNNNNNNNNNd.```-shhs-```.dNNNNNNNNNNNNm/` .N`   \n' +
          '    `Y.` :mNNNNNNNNNNNNs`.yummmmuy.`sNNNNNNNNNNNNm:` .i`    \n' +
          '     `+.` -hNNNNNNNNNNNN/smmmmmmmms/NNNNNNNNNNNNh-` .+`     \n' +
          '       V:` .omNNNNNNNNNNmmmmmmmmmmmmNNNNNNNNNNom.` :s       \n' +
          '        I+. `-omNNNNNNNNNNmmmmmmmmNNNNNNNNNNom-` .u         \n' +
          '         `S: ` :hNNNNNNNNNNmmmmmmNNNNNNNNNNh: ` :+`         \n' +
          '           `i:` `:ymNNNNNNNmmmmmmNNNNNNNmy:` `:N`           \n' +
          '             `t/.` .+hNNNNNNmmmmNNNNNNh+. `./I`             \n' +
          '               `+u: ` -ohmNNHmmENNmho- ` :jO`               \n' +
          '                  `s+: ` ./shmmhs/. ` :t+`                  \n' +
          '                     `on/.` `..` `./dI`                     \n' +
          '                        ``+R/--/eD``                        '
        );
      }
      else {
        console.log('\n' +
          '                          ........                          \n' +
          '                  hs+:.````` ` ` ````.:+sh                  \n' +
          '        _ on+so/:.` ` ` ` ` ` ` ` ` ` ` ` .:\\os+no _       \n' +
          '      /e ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` e\\      \n' +
          '     c` ` ` ` ` G A M E `D`E`T`E`C`T`I`V`E`S` ` ` ` ` r     \n' +
          '     H ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` `t     \n' +
          '    e.` ` ` ` ` ` ` ` ` -:. ` ` `.:-` ` ` ` ` ` ` ` ` .a    \n' +
          '   c-` ` ` ` ` ` ` ` `/dNNNh/--/hNNNd/ ` ` ` ` ` ` ` ` `p   \n' +
          ' K+.` ` ` ` ` ` ` ` `+NNNNNNNNNNNNNNNN+ ` ` ` ` ` ` ` ` `+N \n' +
          '+ ` ` ` ` ` ` ` ` ` sNNNNNNNNNNNNNNNNNNs ` ` ` ` ` ` ` ` ` o\n' +
          'O` ` ` ` ` ` ` ` ` sNNNNNNNNNNNNNNNNNNNNs ` ` ` ` ` ` ` ` `+\n' +
          'U ` ` ` ` ` ` ` ` oNNNNNNNNNNNNNNNNNNNNNNo ` ` ` ` ` ` ` ` s\n' +
          'T` ` ` ` ` ` ` ` /mmmmmmmmmmmmmmmmmmmmmmmm/ ` ` ` ` ` ` ` `u\n' +
          '+ ` ` ` ` ` .:+oymNNNNNNNNNNNNNNNNNNNNNNNNmyo+:. ` ` ` ` ` +\n' +
          'O` ` ` -:+shhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhbb+:- ` ` `D              Like what you see? Get Involved!\n' +
          'U ` ` ` ` ` ` ` ` ` ./oosso/-``./+ooo+:. ` ` ` ` ` ` ` ` ` N\n' +
          'R` ` ` ` ` ` ` ` ` -mNNNNNNNm::mNNNNNNNd- ` ` ` ` ` ` ` ` `I             https://discord.gamedetectives.net\n' +
          '+ ` ` ` ` ` ` ` ` `-mNNNNNNNh..hNNNNNNNm.` ` ` ` ` ` ` ` ``F              https://twitter.com/G_detectives\n' +
          'A` ` ` ` ` ` ` ` ` `:dNNNNh/```./hNNNNd-` ` ` ` ` ` ` ` ` `+                 https://gamedetectives.net\n' +
          'R ` ` ` ` ` ` ` ` ` `.:+/-````````-/+: ` ` ` ` ` ` ` ` ` ` D\n' +
          'G` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` E\n' +
          '+/` ` ` ` .os+:.` ` ` ` ` ` ` ` ` ` ` ` ` ` .:+so.` ` ` ` `O          Want cooler stuff? Support GD on Patreon!\n' +
          ' A ` ` ` ` .racecar/.` ` ` ` ` ` ` ` ` ./racecar.` ` ` ` `c \n' +
          ' `c ` ` ` ` `sNNNNNNs ` ` ` ` ` ` ` ` `sNNNNNNs ` ` ` ` `s`            https://www.patreon.com/gamedetectives/\n' +
          '  a` `/oxbyttamNNNNNmy+. ` ` ` ` ` `.+ymNNNNNmattybxo/ ` i  \n' +
          '  D/` .diNNNNNNNNNNER+:os/. ` ` `./so:+NNNNNNNNNNNNOd.` /d  \n' +
          '  `e-` :mNNNNNNNNNNNNm-``-++:` :++-``-mNNNNNNNNNNNNm:` -+`  \n' +
          '   `M.` /mNNNNNNNNNNNNd.```-shhs-```.dNNNNNNNNNNNNm/` .N`   \n' +
          '    `Y.` :mNNNNNNNNNNNNs`.yummmmuy.`sNNNNNNNNNNNNm:` .i`    \n' +
          '     `+.` -hNNNNNNNNNNNN/smmmmmmmms/NNNNNNNNNNNNh-` .+`     \n' +
          '       V:` .omNNNNNNNNNNmmmmmmmmmmmmNNNNNNNNNNom.` :s       \n' +
          '        I+. `-omNNNNNNNNNNmmmmmmmmNNNNNNNNNNom-` .u         \n' +
          '         `S: ` :hNNNNNNNNNNmmmmmmNNNNNNNNNNh: ` :+`         \n' +
          '           `i:` `:ymNNNNNNNmmmmmmNNNNNNNmy:` `:N`           \n' +
          '             `t/.` .+hNNNNNNmmmmNNNNNNh+. `./I`             \n' +
          '               `+u: ` -ohmNNHmmENNmho- ` :jO`               \n' +
          '                  `s+: ` ./shmmhs/. ` :t+`                  \n' +
          '                     `on/.` `..` `./dI`                     \n' +
          '                        ``+R/--/eD``                        '
        );
      }
    })();
  });
})();