@abi-software/flatmap-viewer 2.7.2 → 2.7.3-a.2

package/src/main.js

@@ -1,272 +0,0 @@
-/******************************************************************************
-
-Flatmap viewer and annotation tool
-
-Copyright (c) 2019 - 2024 David Brooks
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-
-******************************************************************************/
-
-'use strict';
-
-//==============================================================================
-
-import { MapManager } from './flatmap-viewer';
-export { MapManager };
-
-const ALL_MARKERS = [
-// Most of these are around the heart
-    'UBERON:0003382',
-    'UBERON:0002348',
-    'UBERON:0002349',
-    'UBERON:0003379',
-    'UBERON:0001986',
-    'UBERON:0001074',
-    'UBERON:0003381',
-    'UBERON:0002165',
-    'UBERON:0002080',
-    'UBERON:0000948',
-    'UBERON:0002084',
-    'UBERON:0002078',
-    'UBERON:0002079',
-    'UBERON:0002349',
-    'UBERON:0002408',
-    'UBERON:0007240',
-    'UBERON:0002359',
-
-    'UBERON:0001508',
-    'UBERON:0037094',
-    'ILX:0738305',
-
-    'UBERON:0000948', // {className: 'heart-marker'}); // Heart
-    'UBERON:0002048', // Lung
-    'UBERON:0000945', // Stomach
-    'UBERON:0001155', // Colon
-    'UBERON:0001255', // Bladder
-    'UBERON:0001759', // Vagus
-]
-
-//==============================================================================
-
-class DrawControl
-{
-    constructor(flatmap)
-    {
-        this._flatmap = flatmap
-        this._lastEvent = null
-        this._idField = document.getElementById('drawing-id')
-
-        this._okBtn = document.getElementById('drawing-ok')
-        if (this._okBtn) {
-            this._okBtn.addEventListener('click', e => {
-                if (this._lastEvent) {
-                    const feature = this._flatmap.refreshAnnotationFeatureGeometry(this._lastEvent.feature)
-                    this._flatmap.commitAnnotationEvent(this._lastEvent)
-                    this._idField.innerText = ''
-                    this._lastEvent = null
-                    // Send `feature`, along with user comments, to the annotation service
-                }
-            })
-        }
-
-        this._cancelBtn = document.getElementById('drawing-cancel')
-        if (this._cancelBtn) {
-            this._cancelBtn.addEventListener('click', e => {
-                if (this._lastEvent) {
-                    this._flatmap.rollbackAnnotationEvent(this._lastEvent)
-                    this._idField.innerText = ''
-                    this._lastEvent = null
-                }
-            })
-        }
-    }
-
-    handleEvent(event)
-    //================
-    {
-        console.log(event)
-        if (this._idField && event.type !== 'modeChanged' && event.type !== 'selectionChanged') {
-            this._idField.innerText = `Annotation ${event.type}, Id: ${event.feature.id}`
-            this._lastEvent = event
-        }
-    }
-}
-
-//==============================================================================
-
-export async function standaloneViewer(map_endpoint=null, options={})
-{
-    const requestUrl = new URL(window.location.href);
-    if (map_endpoint == null) {
-        const parts = requestUrl.pathname.split('/');
-        map_endpoint = requestUrl.origin + (parts.slice(0, (parts[parts.length - 1] === '') ? -2 : -1)
-                                            .concat([''])
-                                            .join('/'));
-    }
-
-    const mapManager = new MapManager(map_endpoint, {
-        images: [
-            {
-                id: 'label-background',
-                url: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAmCAIAAADbSlUzAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAJOgAACToAYJjBRwAAACVSURBVFhH7dixDoJAEIThfXqMBcYKrTQ+jkYSStDYkVhZINxyEshJcZXJtC7FfNlmur9eyXb7Vqf6+bI9HUKyWkt5e4RlOF9ycerjsqbqpfefuKzNJawBWIOxBmMNxhqMNRhrMNZgrMFYg7EGYw3GGow1GGuw5dU07y4ua22nUlb3uKxd80IOx1Pjxp+f4P/P+ZButl+YrbXnPs+YmAAAAABJRU5ErkJggg==',
-                options: {
-                    content: [21, 4, 28, 33],
-                    stretchX: [[21, 28]],
-                    stretchY: [[4, 33]]
-                }
-            }
-        ]
-    });
-
-    let currentMap = null;
-    let drawControl = null;
-    let defaultBackground = localStorage.getItem('flatmap-background-colour') || 'black';
-
-    const mapOptions = Object.assign({
-        tooltips: true,
-        background: defaultBackground,
-        debug: false,
-        minimap: false,
-        showId: true,
-        showPosition: false,
-        standalone: true,
-        annotator: true,
-        flightPaths: true
-    }, options);
-
-    function loadMap(id, taxon, sex)
-    //==============================
-    {
-        if (currentMap !== null) {
-            currentMap.close();
-        }
-        if (id !== null) {
-            requestUrl.searchParams.set('id', id);
-            requestUrl.searchParams.delete('taxon');
-            requestUrl.searchParams.delete('sex');
-        } else if (taxon !== null) {
-            id = taxon;
-            requestUrl.searchParams.set('taxon', taxon);
-            if (sex !== null) {
-                requestUrl.searchParams.set('sex', sex);
-            }
-            requestUrl.searchParams.delete('id');
-        }
-
-        // Update address bar URL to current map
-        window.history.pushState('data', document.title, requestUrl);
-
-        mapManager.loadMap(id, 'map-canvas', (eventType, ...args) => {
-                if (args[0].type === 'control' && args[0].control === 'background') {
-                    mapOptions.background = args[0].value;
-                } else if (eventType === 'annotation') {
-                    drawControl.handleEvent(...args)
-                }
-            }, mapOptions)
-            .then(map => {
-/*
-                map.addMarker('UBERON:0000948', {className: 'heart-marker'}); // Heart
-                map.addMarker('UBERON:0002048'); // Lung
-                map.addMarker('UBERON:0000945'); // Stomach
-                map.addMarker('UBERON:0001155'); // Colon
-                map.addMarker('UBERON:0001255'); // Bladder
-                map.addMarker('UBERON:0001759'); // Vagus
-*/
-                map.addMarkers(ALL_MARKERS, {cluster: true})
-                currentMap = map;
-                drawControl = new DrawControl(map)
-            })
-            .catch(error => {
-                console.log(error);
-                alert(error);
-            });
-    }
-
-    const viewMapId = requestUrl.searchParams.get('id');
-    const viewMapTaxon = requestUrl.searchParams.get('taxon');
-    const viewMapSex = requestUrl.searchParams.get('sex');
-
-    const latestMaps = new Map();
-    const maps = await mapManager.allMaps();
-    for (const map of Object.values(maps)) {
-        const text = [];
-        if ('describes' in map) {
-            text.push(map.describes);
-        }
-        if ('name' in map) {
-            text.push(map.name);
-        } else {
-            text.push(map.id);
-        }
-        const mapName = text.join(' -- ')
-        if (!latestMaps.has(mapName)) {
-            latestMaps.set(mapName, map);
-        } else if (latestMaps.get(mapName).created < map.created) {
-            latestMaps.set(mapName, map);
-        }
-    }
-    // Sort in created order with most recent first
-    const sortedMaps = new Map([...latestMaps].sort((a, b) => (a[1].created < b[1].created) ? 1
-                                                            : (a[1].created > b[1].created) ? -1
-                                                            : 0));
-    let mapId = null;
-    let mapTaxon = null;
-    let mapSex = null;
-    const mapList = [];
-    for (const [name, map] of sortedMaps.entries()) {
-        const text = [ name, map.created ];
-        let selected = '';
-        const id = ('uuid' in map) ? map.uuid : map.id;
-        if (mapId === null && id === viewMapId) {
-            mapId = id;
-            selected = 'selected';
-        } else if (mapId === null
-                && mapTaxon === null
-                && map.taxon === viewMapTaxon
-                && !('biologicalSex' in map || map.biologicalSex === viewMapSex)) {
-            mapTaxon = viewMapTaxon;
-            mapSex = viewMapSex;
-            selected = 'selected';
-        }
-        mapList.push(`<option value="${id}" ${selected}>${text.join(' -- ')}</option>`);
-    }
-    mapList.splice(0, 0, '<option value="">Select flatmap...</option>');
-
-    const selector = document.getElementById('map-selector');
-    selector.innerHTML = mapList.join('');
-    selector.onchange = (e) => {
-        if (e.target.value !== '') {
-            loadMap(e.target.value);
-        }
-    }
-
-    if (mapId === null) {
-        mapId = viewMapId;
-    }
-    if (mapTaxon === null) {
-        mapTaxon = viewMapTaxon;
-    }
-    if (mapSex === null) {
-        mapTaxon = viewMapSex;
-    }
-    if (mapId === null && mapTaxon == null) {
-        mapId = selector.options[1].value;
-        selector.options[1].selected = true;
-    }
-
-    loadMap(mapId, mapTaxon, mapSex);
-}
-
-//==============================================================================
-

package/src/mapserver.js

@@ -1,64 +0,0 @@
-/******************************************************************************
-
-Flatmap viewer and annotation tool
-
-Copyright (c) 2019  David Brooks
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-
-******************************************************************************/
-
-'use strict';
-
-//==============================================================================
-
-export async function loadJSON(url)
-//=================================
-{
-    const response = await fetch(url, {
-        method: 'GET',
-        headers: {
-            "Accept": "application/json; charset=utf-8",
-            "Cache-Control": "no-store"
-        }
-    });
-    if (!response.ok) {
-        throw new Error(`Cannot access ${url}`);
-    }
-    return response.json();
-}
-
-//==============================================================================
-
-export class MapServer
-{
-    constructor(url)
-    {
-        this._url = url;
-    }
-
-    url(relativePath='')
-    //==================
-    {
-        const url = new URL(relativePath, this._url);
-        return url.href;
-    }
-
-    async loadJSON(relativePath)
-    //==========================
-    {
-        return loadJSON(this.url(relativePath));
-    }
-}
-
-//==============================================================================

package/src/mathjax.js

@@ -1,100 +0,0 @@
-
-/******************************************************************************
-
-Flatmap viewer and annotation tool
-
-Copyright (c) 2019-2023  David Brooks
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-
-******************************************************************************/
-
-/*************************************************************************
- *
- *  direct/tex2svg
- *
- *  Uses MathJax v3 to convert a TeX string to an SVG string.
- *
- * ----------------------------------------------------------------------
- *
- *  Copyright (c) 2018 The MathJax Consortium
- *
- *  Licensed under the Apache License, Version 2.0 (the "License");
- *  you may not use this file except in compliance with the License.
- *  You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- *  Unless required by applicable law or agreed to in writing, software
- *  distributed under the License is distributed on an "AS IS" BASIS,
- *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- *  See the License for the specific language governing permissions and
- *  limitations under the License.
- */
-
-//==============================================================================
-
-const EM_SIZE = 16;
-const EX_SIZE = 8;
-
-//==============================================================================
-
-//  Load the packages needed for MathJax
-import {mathjax} from 'mathjax-full/js/mathjax';
-import {TeX} from 'mathjax-full/js/input/tex';
-import {SVG} from 'mathjax-full/js/output/svg';
-import {browserAdaptor} from 'mathjax-full/js/adaptors/browserAdaptor';
-import {RegisterHTMLHandler} from 'mathjax-full/js/handlers/html';
-import {AllPackages} from 'mathjax-full/js/input/tex/AllPackages';   // required to load `textmacros`
-
-//==============================================================================
-
-//  Minimal CSS needed for stand-alone image
-export const LatexStyleRules = [
-  'svg a{fill:blue;stroke:blue}',
-  // Round the corners of filled background rectangles
-  '[data-mml-node="mstyle"]>rect[data-bgcolor="true"]{rx: 8%; ry: 12%}',
-  '[data-mml-node="merror"]>g{fill:red;stroke:red}',
-  '[data-mml-node="merror"]>rect[data-background]{fill:yellow;stroke:none}',
-  '[data-frame],[data-line]{stroke-width:70px;fill:none}',
-  '.mjx-dashed{stroke-dasharray:140}',
-  '.mjx-dotted{stroke-linecap:round;stroke-dasharray:0,140}',
-  'use[data-c]{stroke-width:3px}'
-].join('');
-
-//==============================================================================
-
-//  Create DOM adaptor and register it for HTML documents
-const adaptor = browserAdaptor();
-RegisterHTMLHandler(adaptor);
-
-//==============================================================================
-
-const tex = new TeX({packages: AllPackages}); // ['base', 'textmacros']});
-const svg = new SVG({fontCache: 'local'});
-const html = mathjax.document('', {InputJax: tex, OutputJax: svg});
-
-//==============================================================================
-
-export function latex2Svg(latex)
-{
-    const node = html.convert(latex, {
-      display: false,    // process as inline math
-      em: 2*EM_SIZE,
-      ex: 2*EX_SIZE,
-    });
-    let result = adaptor.innerHTML(node);
-    return result.replace(/<defs>/, `<defs><style>${LatexStyleRules}</style>`);
-}
-
-//==============================================================================