diff --git a/static/abaev-html.css b/static/abaev-html.css index c116b5d..59721b0 100644 --- a/static/abaev-html.css +++ b/static/abaev-html.css @@ -455,40 +455,13 @@ details[open] summary {} dialog {} dialog::backdrop {} -dialog > article { +dialog#modal_map > 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 63ce6a2..405a589 100644 --- a/static/abaev.js +++ b/static/abaev.js @@ -1,9 +1,22 @@ $( 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({ @@ -13,71 +26,10 @@ $( 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()); @@ -97,7 +49,6 @@ $( 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') @@ -152,6 +103,39 @@ $( 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 24a5b79..25772f4 100644 --- a/xq/restx_dict_cached.xq +++ b/xq/restx_dict_cached.xq @@ -55,15 +55,13 @@ declare function page:header($lang as xs:string, $href-other as xs:string) {
  • { (element {if ($lang = 'ru') then 'mark' else 'a'}{ if ($lang != 'ru') then - (attribute class {'link'}, - attribute data-href {`{$href-other}`}, + (attribute onclick {`window.location='{$href-other}'+window.location.search;`}, attribute href {'#'}) else (), 'ru' }, ' / ', element {if ($lang = 'ru') then 'a' else 'mark'}{ if ($lang = 'ru') then - (attribute class {'link'}, - attribute data-href {`{$href-other}`}, + (attribute onclick {`window.location='{$href-other}'+window.location.search;`}, attribute href {'#'}) else (), 'en' }) @@ -115,15 +113,15 @@ declare function page:header($lang as xs:string, $href-other as xs:string) { else ( if (session:get('searchN') > 1) then - , - + , if (session:get('searchN') and session:get('searchN') < array:size(session:get('searchData'))) then - -

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

    +
    +

    Map

    - + - - - {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`)}) - } -
    - -
    -     } };