diff --git a/static/abaev-html.css b/static/abaev-html.css index 59721b0..c116b5d 100644 --- a/static/abaev-html.css +++ b/static/abaev-html.css @@ -455,13 +455,40 @@ details[open] summary {} dialog {} dialog::backdrop {} -dialog#modal_map > article { +dialog > article { width: 75vw !important; height: 85vh !important; max-width: 75vw !important; max-height: 85vh !important; } +dialog#modal_searchResults > article { + padding-top: 0; + padding-bottom: 0; +} + +dialog#modal_searchResults > article > table > thead { + position: sticky; + top: 0; + z-index: 1055; +} + +dialog#modal_searchResults > article > header { + position: sticky; + top: 0; + z-index: 1055; +} +dialog#modal_searchResults > article > footer { + position: sticky; + bottom: 0; + z-index: 1055; +} + +/*dialog#modal_searchResults > article > p > table > tbody { + height:100%; + overflow-y: scroll; +}*/ + /* Some form fields, `details`, elements with `tabindex`, and possibly other elements can be focussed. You should use `:focus-visible` instead of `:focus` whenever possible. As the former is not yet widely supported, you need to do it diff --git a/static/abaev.js b/static/abaev.js index 44aa781..63ce6a2 100644 --- a/static/abaev.js +++ b/static/abaev.js @@ -1,28 +1,10 @@ $( document ).ready(function() { + // GLOBALS // Link elements that do not have href out of the box $('.link').on("click", function () { window.location=$(this)[0].dataset.href+window.location.search+window.location.hash; }); - function bindMapOpen() { - // $('#modal_map').data('abv-entry',$(this).data('abv-entry')); - // $('#modal_map')[0].showModal(); - let url = `./dict/map-info/${$(this).data('abv-entry')}`; - - fetch(url) - .then(res => res.json()) - .then(out => { - $('#modal_map').data('map',out); - $('#modal_map')[0].showModal(); - }) - .catch(err => console.log(err)); - } - - // Event to open map modal. We have to bind it - // when the button is shown, otherwise it will - // not work for newly loaded entries. - $('.abv-map').on("click", bindMapOpen); - // init Infinite Scroll $('main').infiniteScroll({ path: '.pagination__next', @@ -31,10 +13,71 @@ $( document ).ready(function() { //hideNav: '.pagination', }); + // SEARCH RESULTS MODAL + $('#abv-btn-searchResults').on("click", function () { + $('#modal_searchResults')[0].showModal(); + }); + + // Close search modal + $('.abv-close-search').on("click", function () { + $('#modal_searchResults')[0].close(); + }); + + // MAP MODAL + // This event binding is done on page load and also whenever new entries are loaded. + bindMapOpen = function () { + let url = `./dict/map-info/${$(this).data('abv-entry')}`; + + fetch(url) + .then(res => res.json()) + .then(out => { + $('#modal_map').data('map',out); + $('#modal_map')[0].showModal(); + }) + .catch(err => console.log(err)); + }; + + // Event to open map modal. + $('.abv-map').on("click", bindMapOpen); + $('main').on( 'append.infiniteScroll', function( event, body, path, response ) { $('.abv-map').on("click", bindMapOpen); }); + // Close map modal + $('.abv-close-map').on("click", function () { + $('#modal_map')[0].close(); + }); + + // Load map data when dialog opens + $('#modal_map').on("toggle", function () { + map = document.getElementById('map_display'); + var layout = { + // title: { + // text: 'Canadian cities', + // font: { + // family: 'Droid Serif, serif', + // size: 16 + // } + // }, + geo: { + scope: 'world', + resolution: 50, + fitbounds: 'locations', + showrivers: true, + rivercolor: '#fff', + showlakes: true, + lakecolor: '#fff', + showland: true, + landcolor: '#EAEAAE', + showcountries: false, + subunitcolor: '#d3d3d3' + } + }; + Plotly.newPlot(map, [$(this).data('map')], layout); + }); + + // HASH NAVIGATION // If the hash is on the page, scroll a little bit above to account for top nav height if ( $(decodeURI(document.location.hash)).length > 0) { window.scrollBy(0,-$('header').height()); @@ -54,6 +97,7 @@ $( document ).ready(function() { } }); + // ENTRY LIST SIDE PANEL // Function to scroll the entry list to the selected entry OR to the first entry displayed on the current page if there is no hash in the URL function scrollView() { var $container = $('#entrylist') @@ -108,39 +152,6 @@ $( document ).ready(function() { return false; }); - // Close map modal - $('.abv-close-map').on("click", function () { - $('#modal_map')[0].close(); - }); - - // Load map data when dialog opens - $('#modal_map').on("toggle", function () { - map = document.getElementById('map_display'); - var layout = { - // title: { - // text: 'Canadian cities', - // font: { - // family: 'Droid Serif, serif', - // size: 16 - // } - // }, - geo: { - scope: 'world', - resolution: 50, - fitbounds: 'locations', - showrivers: true, - rivercolor: '#fff', - showlakes: true, - lakecolor: '#fff', - showland: true, - landcolor: '#EAEAAE', - showcountries: false, - subunitcolor: '#d3d3d3' - } - }; - Plotly.newPlot(map, [$(this).data('map')], layout); - }); - // Event handler to show subentries $('#show-re').on("change", function () { if($(this).prop('checked')) { diff --git a/xq/restx_dict_cached.xq b/xq/restx_dict_cached.xq index 02445c1..24a5b79 100644 --- a/xq/restx_dict_cached.xq +++ b/xq/restx_dict_cached.xq @@ -120,7 +120,7 @@ declare function page:header($lang as xs:string, $href-other as xs:string) { , - + , if (session:get('searchN') and session:get('searchN') < array:size(session:get('searchData'))) then -

Map

+
+ +

{if ($lang = 'ru') then 'Карта' else 'Map'}

- + - {if (session:get('searchQuery')) then + + {if (exists(session:get('searchData'))) then +
+
+
+ + + + + + + + + + { + for $res in session:get('searchData')?* + count $pos + return + + + + + } + +
{if ($lang = 'ru') then '№' else 'No.'}{if ($lang = 'ru') then 'Лемма' else 'Lemma'}{if ($lang = 'ru') then 'Фрагмент' else 'Fragment'}
{$pos} + + { + abv-m:entry-form-by-id($res('entry_id')) + } + + + { + xquery:eval($res('path')(1), {'': doc(`abaevdict_{$lang}/xml/{$res('entry_id')}.xml`)}) + } +
+ +
}