MediaWiki:Common.js: различия между версиями

Фармакология: поиск и фильтры каталога карточек v1
Фармакология: раскрытие карточек мышью и клавиатурой
Строка 328: Строка 328:
     function normalize(value) {
     function normalize(value) {
         return String(value || '').toLocaleLowerCase('ru-RU').replace(/\s+/g, ' ').trim();
         return String(value || '').toLocaleLowerCase('ru-RU').replace(/\s+/g, ' ').trim();
    }
    function setCardOpen(card, open) {
        var summary = card.querySelector('.pharma-card__summary');
        card.classList.toggle('is-open', open);
        if (summary) {
            summary.setAttribute('aria-expanded', open ? 'true' : 'false');
        }
     }
     }


Строка 342: Строка 350:


         root.setAttribute('data-pharma-ready', 'true');
         root.setAttribute('data-pharma-ready', 'true');
        cards.forEach(function (card) {
            var summary = card.querySelector('.pharma-card__summary');
            if (!summary) {
                return;
            }
            summary.addEventListener('click', function (event) {
                if (event.target.closest('a')) {
                    return;
                }
                setCardOpen(card, !card.classList.contains('is-open'));
            });
            summary.addEventListener('keydown', function (event) {
                if (event.key === 'Enter' || event.key === ' ') {
                    event.preventDefault();
                    setCardOpen(card, !card.classList.contains('is-open'));
                }
            });
        });


         var toolbar = document.createElement('div');
         var toolbar = document.createElement('div');
Строка 425: Строка 454:
                 card.hidden = !show;
                 card.hidden = !show;
                 if (!show) {
                 if (!show) {
                     card.open = false;
                     setCardOpen(card, false);
                 }
                 }
                 if (show) {
                 if (show) {
Строка 459: Строка 488:
             cards.forEach(function (card) {
             cards.forEach(function (card) {
                 if (!card.hidden) {
                 if (!card.hidden) {
                     card.open = true;
                     setCardOpen(card, true);
                 }
                 }
             });
             });
Строка 466: Строка 495:
         closeAll.addEventListener('click', function () {
         closeAll.addEventListener('click', function () {
             cards.forEach(function (card) {
             cards.forEach(function (card) {
                 card.open = false;
                 setCardOpen(card, false);
             });
             });
         });
         });

Версия от 00:57, 22 августа 2026

/* Variables for interface text used throughout the script, for ease of translating */
var i18n = {
    // Collapsible elements and page loader
    hideText: 'скрыть',
    showText: 'показать',
    
    // Page loader
    loadErrorTitle: 'Возникла ошибка при загрузке содержимого'
};

/**
 * Instead of cluttering up the global scope with
 * variables, they should instead be set as a
 * property of this global variable
 *
 * E.g: Instead of
 *   myVar = 'blah';
 * use
 *   mcw.myVar = 'blah';
 */
var mcw = window.mcw = {};

/* Keep track of delegated events on dynamic content */
mcw.events = {};

// Добавляет ссылку для редактирования нулевого раздела (введения; преамбулы)
    var wgNamespaceNumber = mw.config.get( 'wgNamespaceNumber' );
    var wgPageName = mw.config.get( 'wgPageName' );

    if (wgNamespaceNumber > -1){ 
        var edittopHTML = '<span class="mw-editsection">' +
        '<span class="mw-editsection-bracket" style="margin-right: 0.25em;color: #555555;">[</span>' +
        '<a href="/index.php?title=' + wgPageName + '&amp;action=edit&amp;section=0" title="Править «введение» этой страницы">править введение</a>' +
        '<span class="mw-editsection-bracket" style="margin-left: 0.25em;color: #555555;">]</span>' +
        '</span>';
        $('#firstHeading').append(edittopHTML);
    }

// Честно стащено с бывшей официальной Minecraft Wiki
// Добавляет кнопку для очистки кэша
if ( !$( '#ca-purge' ).length ) {
    $( '#p-cactions' ).find( 'ul' ).append(
        $( '<li>' ).attr( { 'id': 'ca-purge', 'class': 'mw-list-item' } ).append(
            $( '<a>' ).attr( { 'href': mw.util.getUrl( null, { action: 'purge' } ), 'title': 'Очистить серверный кэш страницы' } ).append(
                $( '<span>' ).text( 'Очистить кэш' )
            )
        )
    );
}
// Если кнопка «Ещё» у нас скрыта, отображаем её, но не на спецстраницах.
if ($( '#p-cactions' ).hasClass( 'emptyPortlet' ) & !$( '#p-views' ).hasClass( 'emptyPortlet' )){
	$( '#p-cactions' ).removeClass( 'emptyPortlet' )
}
// Меняем обычную ссылку очистки кэша на API-запрос, чтобы избежать окна подтверждения
mw.loader.using( 'mediawiki.api' ).then( function() {
    $( '#ca-purge a' ).on( 'click', function( e ) {
        new mw.Api().post( {
            action: 'purge',
            titles: mw.config.get( 'wgPageName' )
        } ).then( function() {
            location.reload();
        }, function() {
            mw.notify( 'Purge failed', { type: 'error' } );
        } );
        
        e.preventDefault();
    } );
} );

// from Minecraft Wiki
/* Добавляет кнопку «Вверх» слева */
function scrollTop(){
    $(window).scroll(function(e) {
	    if($(window).scrollTop()>0) {
	    	$("#scroll-top").fadeIn(300);
	    } else{ 
	    	$("#scroll-top").fadeOut(300);
	    }
    });
}

/* Fired whenever wiki content is added. (#mw-content-text, live preview, load page, etc.) */
mw.hook( 'wikipage.content' ).add( function( $wikipageContent ) {

$(function(){
	$("footer#footer").append($("<span></span>")
		.attr({
			"id": "scroll-top",
			"title": "Наверх"
		})
	);
	$("#scroll-top").click(function(e) {
		$('body,html').animate({scrollTop:0},300);
		});
	scrollTop();
});

// Только при редактировании, вне режима визуального редактора добавляем викификатор или панель редактирования в целом.
if ( mw.config.get( 'wgAction' ) == 'edit' || mw.config.get( 'wgAction' ) == 'submit' ) {
	console.log('MediaWiki:Common.js — editFunction start');
	if ( !mw.user.options.get( 'usebetatoolbar' ) || mw.user.options.get( 'usebetatoolbar' ) == '0' || mw.user.options.get( 'usebetatoolbar' ) == '' ) {
		mw.loader.load('MediaWiki:LegacyToolbar.js?action=raw&ctype=text/javascript');
		console.log('MediaWiki:Common.js — legacyToolbar enabled');
	}
	else {
		mw.loader.load( 'MediaWiki:Wikificator.js?action=raw&ctype=text/javascript' );
		console.log('MediaWiki:Common.js — Wikificator enabled with betatoolbar');
	};
	console.log('MediaWiki:Common.js — after Wikificator call msg');
}

/**
 * Page loader
 *
 * Allows a page to be downloaded and displayed on demand.
 * Use with Template:LoadPage and Template:LoadBox
 */

( function() {
	var $loadPage = $wikipageContent.find( '.load-page' );
	if ( !$loadPage.length ) {
		return;
	}
	
	// We need the spinner to show loading is happening, but we don't want
	// to have a delay while the module downloads, so we'll load this now,
	// regardless of if something is clicked
	mw.loader.load( 'jquery.spinner' );
	
	// Create button starting with hide text
	// Will be changed to the show text while calculating the maximum button size
	var $buttonTemplate = $( '<span>' ).addClass( 'mw-editsection-like load-page-button' )
		.append( '[ ', $( '<span>' ).addClass( 'jslink' ).text( i18n.hideText ), ' ]' );
	
	var extractList = function( $contentContainer, listClass ) {
		var $content = $contentContainer.find( '.mw-parser-output > ul > li > ul' ).children( ':not(.nbttree-inherited)' );
		if ( listClass ) {
			$content.addClass( listClass );
		}
		
		return $content;
	};
	
	$loadPage.each( function() {
		var $body = $( this );
		var page = $body.data( 'page' );
		if ( !page ) {
			return;
		}
		
		var template = $body.data( 'template' );
		var treeview = $body.data( 'treeview' );
		var treeviewClass = $body.data( 'treeviewclass' );
		var $heading;
		var $contentContainer;
		var $content;
		var $button = $buttonTemplate.clone();
		var $buttonLink = $button.find( '.jslink' );
		if ( treeview ) {
			$heading = $body;
			$contentContainer = $( '<div>' );
		} else {
			$heading = $body.children().first();
			$contentContainer = $body.find( '.load-page-content' );
		}
		
		// Add the button
		$heading.append( $button );
		
		// Move the edit button to the right spot
		$contentContainer.find( '.mw-editsection, .mw-editsection-like' ).insertAfter( $button );
		
		// Find max button width, and set its min-width to it
		var hideWidth = $button.width();
		$buttonLink.text( i18n.showText );
		var showWidth = $button.width();
		
		if ( hideWidth !== showWidth ) {
			$button.css( 'min-width', hideWidth > showWidth ? hideWidth : showWidth );
		}
		
		$buttonLink.click( function() {
			if ( $body.hasClass( 'pageloader-contentloaded' ) ) {
				if ( $buttonLink.text() === i18n.showText ) {
					if ( treeview ) {
						$content.insertAfter( $body );
					} else {
						$contentContainer.show();
					}
					$buttonLink.text( i18n.hideText );
				} else {
					if ( treeview ) {
						$content.detach();
					} else {
						$contentContainer.hide();
					}
					$buttonLink.text( i18n.showText );
				}
				return;
			}
			
			// See if this was loaded elsewhere before making a request
			var gotContent;
			$( '.pageloader-contentloaded' ).each( function() {
				var $fLoader = $( this );
				if ( $fLoader.data( 'page' ) === page && $fLoader.data( 'pageloader-content' ) ) {
					$contentContainer.html( $fLoader.data( 'pageloader-content' ) ).removeClass( 'noscript' );
					mw.hook( 'wikipage.content' ).fire( $contentContainer );
					
					if ( treeview ) {
						$body.find( '.noscript' ).remove();
						$content = extractList( $contentContainer, treeviewClass );
						$content.insertAfter( $body );
					}
					
					$buttonLink.text( i18n.hideText );
					$body.addClass( 'pageloader-contentloaded' );
					gotContent = true;
					return false;
				}
			} );
			if ( gotContent ) {
				return;
			}
			
			// Just in-case the spinner module is still not ready yet
			var $spinner = $();
			mw.loader.using( 'jquery.spinner', function() {
				// $spinner will be false if the content somehow loaded before the module did
				if ( $spinner ) {
					$spinner = $.createSpinner().addClass( 'mw-editsection-like' )
						.css( 'min-width', $button.css( 'min-width' ) );
					$button.hide().after( $spinner );
				}
			} );
			
			var requestData = {
				action: 'parse',
				prop: 'text'
			};
			if ( template ) {
				requestData.page = page;
			} else {
				requestData.title = mw.config.get( 'wgPageName' );
				requestData.text = '{' + '{:' + page + '}}';
			}
			new mw.Api().get( requestData ).done( function( data ) {
				var html = data.parse.text['*'];
				$contentContainer.html( html ).removeClass( 'noscript' );
				
				// Resolve self-links
				if ( template ) {
					var curPage = '/' + mw.config.get( 'wgPageName' );
					$contentContainer.find( 'a' ).each( function() {
						var $link = $( this );
						if ( $link.attr( 'href' ) === curPage ) {
							$link.replaceWith( $( '<strong>' ).addClass( 'selflink' ).append( $link.contents() ) );
						}
					} );
					html = $contentContainer.html();
				}
				
				$body.data( 'pageloader-content', html );
				
				// Fire content hook on the new content, running all this stuff again and more :)
				mw.hook( 'wikipage.content' ).fire( $contentContainer );
				
				if ( treeview ) {
					$body.find( '.noscript' ).remove();
					$content = extractList( $contentContainer, treeviewClass );
					$content.insertAfter( $body );
				}
				
				$spinner.remove();
				$spinner = false;
				$buttonLink.text( i18n.hideText );
				$button.show();
				$body.addClass( 'pageloader-contentloaded' );
			} ).fail( function( _, error ) {
				$spinner.remove();
				$spinner = false;
				$button.show();
				
				var errorText = '';
				if ( error.textStatus ) {
					errorText = error.textStatus;
				} else if ( error.error ) {
					errorText = error.error.info;
				}
				
				mw.notify( errorText, { title: i18n.loadErrorTitle, autoHide: false } );
			} );
		} );
	} );
}() );

/**
 * Element animator
 *
 * Will cycle the active class on any child elements
 * within an element with the animated class.
 */
( function() {
	if ( !mcw.animate ) {
		mcw.animate = setInterval( function() {
			$( '.animated' ).each( function() {
				var $elem = $( this );
				var $current = $elem.children( '.active' );
				var $next = $current.nextAll( ':not(.skip):first' );
				// Loop back to the start
				if ( !$next.length ) {
					$next = $elem.children( ':not(.skip):first' );
				}
				$current.removeClass( 'active' );
				$next.addClass( 'active' );
			} );
		}, 2000 );
	}
}() );

} );
/* End wiki content hook */

/* === Dark Paradise: Pharmacology catalog v1 START === */
(function () {
    'use strict';

    function normalize(value) {
        return String(value || '').toLocaleLowerCase('ru-RU').replace(/\s+/g, ' ').trim();
    }

    function setCardOpen(card, open) {
        var summary = card.querySelector('.pharma-card__summary');
        card.classList.toggle('is-open', open);
        if (summary) {
            summary.setAttribute('aria-expanded', open ? 'true' : 'false');
        }
    }

    function initPharmaCatalog(root) {
        if (!root || root.getAttribute('data-pharma-ready') === 'true') {
            return;
        }

        var grid = root.querySelector('.pharma-catalog__grid');
        var cards = Array.prototype.slice.call(root.querySelectorAll('.pharma-card'));
        if (!grid || !cards.length) {
            return;
        }

        root.setAttribute('data-pharma-ready', 'true');

        cards.forEach(function (card) {
            var summary = card.querySelector('.pharma-card__summary');
            if (!summary) {
                return;
            }

            summary.addEventListener('click', function (event) {
                if (event.target.closest('a')) {
                    return;
                }
                setCardOpen(card, !card.classList.contains('is-open'));
            });

            summary.addEventListener('keydown', function (event) {
                if (event.key === 'Enter' || event.key === ' ') {
                    event.preventDefault();
                    setCardOpen(card, !card.classList.contains('is-open'));
                }
            });
        });

        var toolbar = document.createElement('div');
        toolbar.className = 'pharma-catalog__toolbar';
        toolbar.setAttribute('role', 'search');

        var searchWrap = document.createElement('div');
        searchWrap.className = 'pharma-catalog__search-wrap';

        var search = document.createElement('input');
        search.className = 'pharma-catalog__search';
        search.type = 'search';
        search.placeholder = 'Название, эффект или ингредиент…';
        search.setAttribute('aria-label', 'Поиск реагента по названию, эффекту или ингредиенту');
        searchWrap.appendChild(search);

        var filters = document.createElement('div');
        filters.className = 'pharma-catalog__filters';
        var filterItems = [
            ['all', 'Все'],
            ['heat', 'С нагревом'],
            ['botany', 'Ботаника'],
            ['external', 'Внешние'],
            ['danger', 'Опасные']
        ];

        filterItems.forEach(function (item, index) {
            var button = document.createElement('button');
            button.type = 'button';
            button.className = 'pharma-catalog__filter';
            button.textContent = item[1];
            button.setAttribute('data-pharma-filter', item[0]);
            button.setAttribute('aria-pressed', index === 0 ? 'true' : 'false');
            filters.appendChild(button);
        });

        var meta = document.createElement('div');
        meta.className = 'pharma-catalog__meta';

        var status = document.createElement('span');
        status.setAttribute('aria-live', 'polite');

        var actions = document.createElement('span');
        actions.className = 'pharma-catalog__actions';

        var openAll = document.createElement('button');
        openAll.type = 'button';
        openAll.className = 'pharma-catalog__action';
        openAll.textContent = 'Раскрыть найденные';

        var closeAll = document.createElement('button');
        closeAll.type = 'button';
        closeAll.className = 'pharma-catalog__action';
        closeAll.textContent = 'Свернуть все';

        actions.appendChild(openAll);
        actions.appendChild(closeAll);
        meta.appendChild(status);
        meta.appendChild(actions);

        toolbar.appendChild(searchWrap);
        toolbar.appendChild(filters);
        toolbar.appendChild(meta);
        root.insertBefore(toolbar, grid);

        var empty = document.createElement('div');
        empty.className = 'pharma-catalog__empty';
        empty.textContent = 'Ничего не найдено. Попробуйте другое название, эффект или ингредиент.';
        empty.hidden = true;
        grid.appendChild(empty);

        var activeFilter = 'all';

        function applyFilters() {
            var query = normalize(search.value);
            var visible = 0;

            cards.forEach(function (card) {
                var tags = normalize(card.getAttribute('data-pharma-tags')).split(' ');
                var matchesFilter = activeFilter === 'all' || tags.indexOf(activeFilter) !== -1;
                var matchesSearch = !query || normalize(card.textContent).indexOf(query) !== -1;
                var show = matchesFilter && matchesSearch;
                card.hidden = !show;
                if (!show) {
                    setCardOpen(card, false);
                }
                if (show) {
                    visible += 1;
                }
            });

            status.textContent = 'Показано ' + visible + ' из ' + cards.length;
            empty.hidden = visible !== 0;
        }

        search.addEventListener('input', applyFilters);
        search.addEventListener('keydown', function (event) {
            if (event.key === 'Escape' && search.value) {
                search.value = '';
                applyFilters();
            }
        });

        filters.addEventListener('click', function (event) {
            var button = event.target.closest('[data-pharma-filter]');
            if (!button) {
                return;
            }
            activeFilter = button.getAttribute('data-pharma-filter');
            Array.prototype.forEach.call(filters.querySelectorAll('[data-pharma-filter]'), function (item) {
                item.setAttribute('aria-pressed', item === button ? 'true' : 'false');
            });
            applyFilters();
        });

        openAll.addEventListener('click', function () {
            cards.forEach(function (card) {
                if (!card.hidden) {
                    setCardOpen(card, true);
                }
            });
        });

        closeAll.addEventListener('click', function () {
            cards.forEach(function (card) {
                setCardOpen(card, false);
            });
        });

        applyFilters();
    }

    function bootPharmaCatalogs() {
        Array.prototype.forEach.call(document.querySelectorAll('.pharma-catalog'), initPharmaCatalog);
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', bootPharmaCatalogs);
    } else {
        bootPharmaCatalogs();
    }
}());
/* === Dark Paradise: Pharmacology catalog v1 END === */