CruisersWiki:Chartlet-navionics.js

From CruisersWiki

//

/*
   Chartlet.js

   Copyright (c) 2016 Vadim Shlyakhov
   Licensed MIT
*/

(function () {

    var navKey = 'Navionics_webapi_00572';

    var $chartlets = $('.cw-chartlet');
    if ($chartlets.length === 0) {
        return;
    }

    var standalone_div = $('#cw-chartlet-standalone')[0];
    var standalone = !! standalone_div;

    function initWebApi () {
        var $chartlet = $(this);
        var params = parseParams(standalone ? location.hash.slice(1) : $chartlet.text());

        var mapParams = {
            tagId: this,
            navKey: navKey,
            zoom: +(params.zoom || 0),
            center: [+(params.lon || 0), +(params.lat || 0)],
            // distanceUnit: JNC.DISTANCE_UNIT.NAUTICAL, 
            // depthUnit: JNC.DEPTH_UNIT.METERS,
            // safetyDepth: JNC.SAFETY_DEPTH_LEVEL.METERS_10,
            layer: {
                'N': JNC.MAP_LAYERS.NO_OVERLAY,
                'T': JNC.MAP_LAYERS.TERRAIN,
                'S': JNC.MAP_LAYERS.SATELLITE
            } [params.layer ? params.layer.toUpperCase() : 'N'],
            DistanceUnitControl: false,
            DepthUnitControl: false,
            DistanceControl: false,
            // LayerControl: false,
            SonarControl: false,
            // ZoomControl: false,
        };

        var webapi = new JNC.Views.BoatingNavionicsMap(mapParams);

        // put cross to navionics-map-container
        $chartlet.children('.navionics-map-container').append(
            $('<img class="cw-chartlet-cross" src="data:image/gif;base64,R0lGODlhDQANAKEAAAAAANjY2Nra2gAAACH5BAEKAAMALAAAAAANAA0AAAImnB15ewHBmIOxvWrpESKlxwWcAJTmCYweOY4MixlwTGpVHQ+dPRQAOw==">'
        ));

        if (standalone) {
            initStandalone (webapi, params);

            // load kml
    
            if (params.page) {
                loadWikiScript('CruisersWiki:GetKml.js', function () {
                        getKmlUri(
                            {page: params.page, decorated: true},
                            function (kml_uri) {
                                if (kml_uri) {
                                    var kml_layer = webapi.loadKml(kml_uri, false /* do not move/resize */);
                                    if (kml_layer) {
                                        var src = kml_layer.getSource();
                                        src.once('addfeature', function(e) {
                                            console.log('KML layer ' + kml_layer.getSource().getFeatures().length);
                                        });
                                    }
                                }
                            }
                        );
                });
            }
        }
    }

    function initStandalone (webapi, params) {
        webapi.showDistanceUnitControl(true);
        webapi.showDepthUnitControl(true);
        webapi.showDistanceControl(true);
        // webapi.showLayerControl(true);
        webapi.showSonarControl(true);
        // webapi.showSonarcharts(true);
        // webapi.showZoomControl(true);
        webapi.showScaleLineControl(true);
        
        var doNotTrackHash = false;
        var setHashTimeoutID = null;

        var onChangeCenterZoom = function () {
            var setHashDelay = 1000;

            var setHash = function () {
                var bounds = webapi.getBoundsArea();
                params.lon = (bounds[2] + bounds[0]) / 2;
                params.lat = (bounds[3] + bounds[1]) / 2;
                params.zoom = webapi.getZoom() - zoomDelta;
                //console.log(center, zoom);
                var layer_parm = params.layer ? '|layer=' + params.layer : '';
                var page_parm = params.page ? '|page=' + params.page : '';
        
                doNotTrackHash = true;

                location.hash= 'lat=' + round(params.lat) + '|lon=' + round(params.lon) + '|zoom=' + params.zoom 
                    + layer_parm + page_parm;

                setHashTimeoutID = null;
            };

            if (setHashTimeoutID) {
                window.clearTimeout(setHashTimeoutID);
            }
            setHashTimeoutID = window.setTimeout(setHash, setHashDelay);
        };
        
        JNC.Events.on("map:centerchange", onChangeCenterZoom);
        JNC.Events.on("map:zoomchange", onChangeCenterZoom);

        var trackHash = function trackHash() {
            if (!location.hash || doNotTrackHash) {
                doNotTrackHash = false;
                return;
            }
            params = parseParams(location.hash.slice(1));
            if (params.lat != null && params.lon != null) {
                webapi.goToCoord(params.lon, params.lat, params.zoom);
            }
        };

        window.onhashchange = trackHash;
    }

    function dmsh2deg(dmsh) {
        var dmsFactors = [1, 60, 3600];
        var deg = 0;
        if (!dmsh)
            return deg;

        var parts = dmsh.split('_');
        for (var i=0, li = parts.length; i < li; i++) {
            var p = parts[i];
            if (isNaN(+ p)) {
                if (p == 'S' || p == 's' || p == 'W' || p == 'w')
                    deg = -deg;
                break;
            } else {
                deg += p / dmsFactors[i];
            }
        }
        return deg;
    }

    var zoomDelta = -3; // adjust to Navionics zoom levels

    function parseParams(param_str) {

        var out = {};
        var params = param_str.split('|');

        for (var i=0, li = params.length; i < li; i++) {
            var keyVal = params[i].split('=', 2);
            var key = keyVal[0].toLowerCase();
            var val = keyVal[1];
            if (key == 'lon') {
                out.lon = dmsh2deg(val);
            } else if (key == 'lat') {
                out.lat = dmsh2deg(val);
            } else if (key == 'zoom') {
                out.zoom = +(val || 12) + zoomDelta;
            } else if (key == 'layer') {
                out.layer = val || 'N';
            } else if (key == 'page') {
                out.page = val;
            }
        }
        return out;
    }

    function round(val) {
        var fact = 100000;
        return Math.round(val * fact) / fact;
    }

    if (standalone && location.hash) {
        $('body').empty().append(standalone_div);
        $('body').addClass('cw-chartlet-extend');
    }

    // set location for Navionics images
    $('body').attr('data-root', 'http://webapiv2.navionics.com/dist/webapi/images');
    
    loadCss('http://webapiv2.navionics.com/dist/webapi/webapi.min.css');
    loadWikiCss('CruisersWiki:Chartlet.css');
    loadScript('http://webapiv2.navionics.com/dist/webapi/webapi.min.no-dep.js',     
        function () {
            if (typeof JNC === 'undefined') {
                return;
            }
            $chartlets.each(initWebApi);
        }
    );

})();
//