|
|
| Line 58: |
Line 58: |
| } | | } |
| } | | } |
| });
| |
| });
| |
|
| |
|
| |
|
| |
|
| |
| mw.loader.using('mediawiki.api', function () {
| |
| $(document).ready(function () {
| |
| // Override default search suggestions
| |
| var $searchInput = $('#searchInput');
| |
|
| |
| $searchInput.on('input', function () {
| |
| var query = $searchInput.val();
| |
| if (query.length < 2) return;
| |
|
| |
| new mw.Api().get({
| |
| action: 'query',
| |
| generator: 'prefixsearch',
| |
| gpssearch: query,
| |
| gpsnamespace: 0,
| |
| gpslimit: 5,
| |
| prop: 'pageimages',
| |
| piprop: 'thumbnail',
| |
| pithumbsize: 50,
| |
| format: 'json'
| |
| }).done(function (data) {
| |
| var $resultsBox = $('#searchResultsBox');
| |
| if ($resultsBox.length === 0) {
| |
| $resultsBox = $('<div id="searchResultsBox"></div>').css({
| |
| 'position': 'absolute',
| |
| 'background': '#fff',
| |
| 'border': '1px solid #ccc',
| |
| 'z-index': 1000,
| |
| 'width': $searchInput.outerWidth()
| |
| }).insertAfter($searchInput);
| |
| }
| |
| $resultsBox.empty();
| |
|
| |
| if (data.query && data.query.pages) {
| |
| var pages = Object.values(data.query.pages);
| |
| pages.forEach(function (page) {
| |
| var thumb = page.thumbnail ? page.thumbnail.source : 'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg';
| |
| var $item = $('<div></div>').css({
| |
| 'display': 'flex',
| |
| 'align-items': 'center',
| |
| 'padding': '5px',
| |
| 'cursor': 'pointer'
| |
| });
| |
|
| |
| var $img = $('<img>').attr('src', thumb).css({
| |
| 'width': '40px',
| |
| 'height': '40px',
| |
| 'margin-right': '8px',
| |
| 'object-fit': 'cover'
| |
| });
| |
|
| |
| var $title = $('<span></span>').text(page.title);
| |
|
| |
| $item.append($img).append($title);
| |
|
| |
| $item.on('click', function () {
| |
| window.location.href = mw.util.getUrl(page.title);
| |
| });
| |
|
| |
| $resultsBox.append($item);
| |
| });
| |
| }
| |
| });
| |
| });
| |
|
| |
| // Hide results when clicking outside
| |
| $(document).on('click', function (e) {
| |
| if (!$(e.target).closest('#searchInput, #searchResultsBox').length) {
| |
| $('#searchResultsBox').remove();
| |
| }
| |
| });
| |
| }); | | }); |
| }); | | }); |