|
|
(3 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
− | //April Fools 4/1/2020 Code =======================================
| |
− | opts = {
| |
− | pageSelector: ".page-Main_Page",
| |
− | AprilFoolEnable: true,
| |
− | className: 'april-fools',
| |
− | frequency: 0.1,
| |
− | expiryThresholdMs: 2000,
| |
− | addStyleIntvl: null,
| |
− | clearStyleIntvl: null,
| |
− | maxFlicks: 18,
| |
− | minFlicks: 6,
| |
− | };
| |
| | | |
− | // The "oh dear gods my eyes, turn it off" Button
| |
− | $(function(){
| |
− | var r = $('<input type="checkbox" name="chkAprilFoolEnable" value="3" class="lcs_check lcs_tt1" checked="checked" autocomplete="off" />');
| |
− | var AprilFoolText = '<div style="margin-bottom:1em; padding:0em; font-size: 20px; font-weight:bold; text-align:center; border:1px solid #f43e29; background: #060606; width:auto; color: #ffffff;">The UniWiki is being invaded by the Triglavians!!!</div>';
| |
− | $(opts.pageSelector + " .mw-parser-output").prepend(AprilFoolText, 'Triglavian Invasion' , r);
| |
− | startUpAprilFools();
| |
− | });
| |
− |
| |
− | function startUpAprilFools(){
| |
− | opts.addStyleIntvl = setInterval(function() {addStyleToRandomWordsInJQueryObject($(opts.pageSelector + ' .mw-parser-output'), opts)}, 2000);
| |
− | addStyleToRandomWordsInJQueryObject($(opts.pageSelector + " .mw-parser-output"), opts);
| |
− | opts.clearStyleIntvl = setInterval(function() {removeExpiredStyles(opts)}, 2000);
| |
− | opts.AprilFoolEnable = true;
| |
− | }
| |
− |
| |
− | function shutDownAprilFools(){
| |
− | opts.AprilFoolEnable = false;
| |
− | clearInterval(opts.addStyleIntvl);
| |
− | clearInterval(opts.clearInterval);
| |
− | $('span.april-fools').contents().unwrap();
| |
− | $('.AF2020_trig').hide();
| |
− | $('.AF2020_orig').show();
| |
− | }
| |
− |
| |
− | function addStyleToText(text, className, ratio) {
| |
− | tokens = text.split(' ');
| |
− | result = '';
| |
− | for (var i = 0; i < tokens.length; i++) {
| |
− | orig_token = tokens[i];
| |
− | if (tokens[i].trim() === '') {
| |
− | result += orig_token;
| |
− | continue;
| |
− | }
| |
− | const shouldAddStyle = ratio > Math.random();
| |
− | if (shouldAddStyle) {
| |
− | addStyle = '<span class="' + className + '" data-timestamp=' + Date.now() + '>' + tokens[i] + '</span>';
| |
− | tokens[i] = addStyle;
| |
− | //tokens[i] = `<span class="${className}" data-timestamp="${Date.now()}">${tokens[i]}</span>`
| |
− | }
| |
− | //result += tokens[i];
| |
− | }
| |
− | result = tokens.join(' ');
| |
− | return result;
| |
− | }
| |
− |
| |
− | function addStyleToRandomWordsInJQueryObject(jqueryObject, opts) {
| |
− | if (opts.AprilFoolEnable === false) { return };
| |
− | cur_time = Date.now()
| |
− | var objects = [jqueryObject];
| |
− | while (objects.length > 0) {
| |
− | const object = objects.pop();
| |
− | var $object = $(object);
| |
− | if (object.nodeType === Node.TEXT_NODE) {
| |
− | if (object.textContent.trim() !== ''){
| |
− | const result = addStyleToText(object.textContent, opts.className, opts.frequency);
| |
− | $object.replaceWith(result);
| |
− | }
| |
− | }
| |
− | else {
| |
− | const contents = $object.contents();
| |
− | objects = objects.concat(contents.toArray());
| |
− | }
| |
− | }
| |
− | flicker_text(cur_time);
| |
− | flicker_images();
| |
− | }
| |
− |
| |
− | function removeExpiredStyles(opts) {
| |
− | const spans = $('span.april-fools').filter(function(_, s) {
| |
− | const timestamp = s.attributes['data-timestamp'].value;
| |
− | return (Date.now() - timestamp) > opts.expiryThresholdMs;
| |
− | })
| |
− | .contents()
| |
− | .unwrap();
| |
− | }
| |
− |
| |
− | function flicker_text(cur_time){
| |
− | var amount = Math.round(Math.random() * (opts.maxFlicks-opts.minFlicks) + opts.minFlicks);
| |
− | const spans = $('span.april-fools').filter(function(_, s) {
| |
− | const timestamp = s.attributes['data-timestamp'].value;
| |
− | return timestamp > cur_time;
| |
− | })
| |
− | if (amount %2 === 1) { amount++}
| |
− | for(var iter = 0; iter < amount; iter++)
| |
− | {
| |
− | spans.toggleClass('april-fools');
| |
− | sleep = Math.round(Math.random() * 1000)
| |
− | //await sleep(Math.round(Math.random() * 100));
| |
− | setTimeout(function() {spans.toggleClass('april-fools');}, sleep )
| |
− | }
| |
− | spans.toggleClass('april-fools', true);
| |
− | }
| |
− |
| |
− | function flicker_images(){
| |
− | if (opts.frequency < Math.random()) { return };
| |
− | var amount = Math.round(Math.random() * (opts.maxFlicks-opts.minFlicks) + opts.minFlicks);
| |
− | const trigs = $('.AF2020_trig')
| |
− | const origs = $('.AF2020_orig')
| |
− | for(var iter = 0; iter < amount; iter++)
| |
− | {
| |
− | sleep = Math.round(Math.random() * 1000);
| |
− | setTimeout(function() {trigs.toggle(); origs.toggle();}, sleep )
| |
− | }
| |
− | }
| |
− |
| |
− | // On/Off switch code==========================
| |
− | (function($){
| |
− | "use strict";
| |
− | if(typeof($.fn.lc_switch) != 'undefined') {return false;} // prevent multiple script inits
| |
− |
| |
− | $.fn.lc_switch = function(on_text, off_text) {
| |
− | // destruct
| |
− | $.fn.lcs_destroy = function() {
| |
− | $(this).each(function() {
| |
− | var $wrap = $(this).parents('.lcs_wrap');
| |
− | $wrap.children().not('input').remove();
| |
− | $(this).unwrap();
| |
− | });
| |
− | return true;
| |
− | };
| |
− |
| |
− | // set to ON
| |
− | $.fn.lcs_on = function() {
| |
− | $(this).each(function(i, v) {
| |
− | var $wrap = $(this).parents('.lcs_wrap'),
| |
− | $input = $wrap.find('input');
| |
− | // if is already on - skip
| |
− | if($wrap.find('.lcs_on').length) {
| |
− | return true;
| |
− | }
| |
− | (typeof($.fn.prop) == 'function') ? $input.prop('checked', true) : $input.attr('checked', true);
| |
− | $input.trigger('lcs-on');
| |
− | $input.trigger('lcs-statuschange');
| |
− | $wrap.find('.lcs_switch').removeClass('lcs_off').addClass('lcs_on');
| |
− | // if radio - disable other ones
| |
− | if( $wrap.find('.lcs_switch').hasClass('lcs_radio_switch') ) {
| |
− | var f_name = $input.attr('name');
| |
− | $wrap.parents('form').find('input[name='+f_name+']').not($input).lcs_off();
| |
− | }
| |
− | });
| |
− | return true;
| |
− | };
| |
− |
| |
− | // set to OFF
| |
− | $.fn.lcs_off = function() {
| |
− | $(this).each(function() {
| |
− | var $wrap = $(this).parents('.lcs_wrap'),
| |
− | $input = $wrap.find('input');
| |
− |
| |
− | // if is already off - skip
| |
− | if(!$wrap.find('.lcs_on').length) {
| |
− | return true;
| |
− | }
| |
− |
| |
− | // uncheck
| |
− | (typeof($.fn.prop) == 'function') ? $input.prop('checked', false) : $input.attr('checked', false);
| |
− |
| |
− | $input.trigger('lcs-off');
| |
− | $input.trigger('lcs-statuschange');
| |
− | $wrap.find('.lcs_switch').removeClass('lcs_on').addClass('lcs_off');
| |
− | });
| |
− | return true;
| |
− | };
| |
− |
| |
− | // toggle status
| |
− | $.fn.lcs_toggle = function() {
| |
− | $(this).each(function() {
| |
− |
| |
− | // not for radios
| |
− | if( $(this).hasClass('lcs_radio_switch')) {
| |
− | return true;
| |
− | }
| |
− | ($(this).is(':checked')) ? $(this).lcs_off() : $(this).lcs_on();
| |
− | });
| |
− | return true;
| |
− | };
| |
− |
| |
− | // construct
| |
− | return this.each(function(){
| |
− | // check against double init
| |
− | if( !$(this).parent().hasClass('lcs_wrap') ) {
| |
− | // default texts
| |
− | var ckd_on_txt = (typeof(on_text) == 'undefined') ? 'ON' : on_text,
| |
− | ckd_off_txt = (typeof(off_text) == 'undefined') ? 'OFF' : off_text;
| |
− | // labels structure
| |
− | var on_label = (ckd_on_txt) ? '<div class="lcs_label lcs_label_on">'+ ckd_on_txt +'</div>' : '',
| |
− | off_label = (ckd_off_txt) ? '<div class="lcs_label lcs_label_off">'+ ckd_off_txt +'</div>' : '';
| |
− | // default states
| |
− | var disabled = ($(this).is(':disabled')) ? true : false,
| |
− | active = ($(this).is(':checked')) ? true : false;
| |
− | var status_classes = '';
| |
− | status_classes += (active) ? ' lcs_on' : ' lcs_off';
| |
− | if(disabled) {
| |
− | status_classes += ' lcs_disabled';
| |
− | }
| |
− | // wrap and append
| |
− | var structure =
| |
− | '<div class="lcs_switch '+status_classes+'">' +
| |
− | '<div class="lcs_cursor"></div>' +
| |
− | on_label + off_label +
| |
− | '</div>';
| |
− | if( $(this).is(':input') && ($(this).attr('type') == 'checkbox' || $(this).attr('type') == 'radio') ) {
| |
− | $(this).wrap('<div class="lcs_wrap"></div>');
| |
− | $(this).parent().append(structure);
| |
− | $(this).parent().find('.lcs_switch').addClass('lcs_'+ $(this).attr('type') +'_switch');
| |
− | }
| |
− | }
| |
− | });
| |
− | };
| |
− |
| |
− | // handlers
| |
− | $(document).ready(function() {
| |
− | // on click
| |
− | $(document).on('click tap', '.lcs_switch:not(.lcs_disabled)', function(e) {
| |
− | if( $(this).hasClass('lcs_on') ) {
| |
− | if( !$(this).hasClass('lcs_radio_switch') ) { // not for radio
| |
− | $(this).lcs_off();
| |
− | }
| |
− | } else {
| |
− | $(this).lcs_on();
| |
− | }
| |
− | });
| |
− |
| |
− | // on checkbox status change
| |
− | $(document).on('change', '.lcs_wrap input', function() {
| |
− | ( $(this).is(':checked') ) ? $(this).lcs_on() : $(this).lcs_off();
| |
− | });
| |
− | });
| |
− | })(jQuery);
| |
− |
| |
− | $(document).ready(function(e) {
| |
− | $('input').lc_switch("Enabled", "Disabled");
| |
− | // triggered each time a field is checked
| |
− | $(document).on('lcs-on', '.lcs_check', function() {
| |
− | //handle chkSysMineable
| |
− | if($(this).attr("name") == 'chkAprilFoolEnable') {
| |
− | opts.AprilFoolEnable = true;
| |
− | startUpAprilFools();
| |
− | };
| |
− | });
| |
− | // triggered each time a field is unchecked
| |
− | $(document).on('lcs-off', '.lcs_check', function() {
| |
− | //handle chkSysMineable
| |
− | if($(this).attr("name") == 'chkAprilFoolEnable') {
| |
− | opts.AprilFoolEnable = false;
| |
− | shutDownAprilFools();
| |
− | };
| |
− | });
| |
− | });
| |
− | //END April Fools 4/1/2020 Code =======================================
| |