<commit_before>{% load leaflet_tags %}
{% load geojson_tags %}

{% block extra_assets %}
    {% leaflet_js %}
    {% leaflet_css %}
{% endblock %}

{% block content %}
    <html>
        <style>
            .leaflet-container {  /* all maps */
                width:  100%;
                height: 100%;
            }

            body {
                padding: 0;
                margin: 0;
            }
        </style>

        <body>
            <h1>Replay Vehicle Motion</h1>
        
            <script type="text/javascript">
                var waypoints = {{ waypoints|geojsonfeature:"vehicle_info"|safe }};

                var markers = [];
                
                function formatPopupContent(vehicle, track) {
                    var text = "<p><img src=" + vehicle[1] + " height='50px'></p><p>" + "<b>" + vehicle[0] +"</b>" + 
                               "<br>Time: " + track[3] +
                               "<br>Speed: " + Math.round(track[4] * 3.6) + " km/h" + 
                               "<br>Altitude: " + track[2] + " m" +
                               "<br>Climb: " + track[5] + " m/s" +
                               "<br>Odometer: " + track[6] + " km";
                    return text;
                }
                
                function animate() {
                    for (i = 0; i < markers.length; i++) {
                        var marker = markers[i];
                        var track = marker.track[marker.cnt];
                        marker.marker.setLatLng(L.latLng(track[1], track[0]));
                        marker.popup.setContent(formatPopupContent(marker.vehicle, track));
                        if (++(marker.cnt) >= marker.track.length) {
                            marker.cnt = 0;
                        }
                    }
                }

                function getNearest(coordinates, point) {
                    var x = (coordinates[0][0] - point[0]);
                    var y =  (coordinates[0][1] - point[1]);
                    var d = {index: 0, distance: x*x + y*y};
                    var nd = 0;
                    for (i = 1; i < coordinates.length; i++) {
                        x = (coordinates[i][0] - point[0]);
                        y =  (coordinates[i][1] - point[1]);
                        nd = x*x + y*y;
                        if (nd < d.distance) {
                            d = {index: i, distance: nd};
                        }
                    }
                    return d.index;
                }
                                
                // event handlers for waypoints
                function onWaypointClick(e) {
                    var feature = e.target.feature;
                    var i = getNearest(feature.geometry.coordinates, [e.latlng.lng, e.latlng.lat]);
                    var popup = L.popup()
                        .setLatLng(e.latlng)
                        .setContent(formatPopupContent(feature.properties.vehicle_info, feature.geometry.coordinates[i]));
                    e.target._map.openPopup(popup);
                }
                function onEachFeature(feature, layer) {
                    layer.on('click', onWaypointClick);
                }

                function main_map_init(map, options) {

                    // place makers
                    var features = waypoints.features;
                    for (i = 0; i < features.length; i++) {
                        var track = features[i].geometry.coordinates;
                        var veh_info = features[i].properties.vehicle_info;
                        if (location != null) {
                            var marker = L.marker(track[0]);
                            var popup = L.popup();
                            marker.bindPopup(popup);
                            marker.addTo(map);
                            markers.push({marker: marker, popup: popup, track: track, cnt: 0, vehicle: veh_info});
                        }
                    }
                    
                    // waypoints line style
                    var lineStyle = {
                        "color": "Red",
                        "weight": 5,
                        "opacity": 0.65
                    };
                    
                    // create waypoints
                    var tracks = L.geoJson(waypoints, {
                        style: lineStyle,
                        onEachFeature: onEachFeature
                    });

                    // set map viewport
                    var group = new L.featureGroup([tracks]);
                    map.fitBounds(group.getBounds());
                    tracks.addTo(map);
                    
                    // start animation
                    setInterval(animate, 200);

                }
            </script>
            
        </body>

        {% leaflet_map "main" callback="main_map_init" %}

    </html>
{% endblock %}
<commit_msg>tracking.html: Fixed bug with empty array<commit_after>{% load leaflet_tags %}
{% load geojson_tags %}

{% block extra_assets %}
    {% leaflet_js %}
    {% leaflet_css %}
{% endblock %}

{% block content %}
    <html>
        <style>
            .leaflet-container {  /* all maps */
                width:  100%;
                height: 100%;
            }

            body {
                padding: 0;
                margin: 0;
            }
        </style>

        <body>
            <h1>Replay Vehicle Motion</h1>
        
            <script type="text/javascript">
                var waypoints = {{ waypoints|geojsonfeature:"vehicle_info"|safe }};

                var markers = [];
                
                function formatPopupContent(vehicle, track) {
                    var text = "<p><img src=" + vehicle[1] + " height='50px'></p><p>" + "<b>" + vehicle[0] +"</b>" + 
                               "<br>Time: " + track[3] +
                               "<br>Speed: " + Math.round(track[4] * 3.6) + " km/h" + 
                               "<br>Altitude: " + track[2] + " m" +
                               "<br>Climb: " + track[5] + " m/s" +
                               "<br>Odometer: " + track[6] + " km";
                    return text;
                }
                
                function animate() {
                    for (i = 0; i < markers.length; i++) {
                        var marker = markers[i];
                        var track = marker.track[marker.cnt];
                        marker.marker.setLatLng(L.latLng(track[1], track[0]));
                        marker.popup.setContent(formatPopupContent(marker.vehicle, track));
                        if (++(marker.cnt) >= marker.track.length) {
                            marker.cnt = 0;
                        }
                    }
                }

                function getNearest(coordinates, point) {
                    var x = (coordinates[0][0] - point[0]);
                    var y =  (coordinates[0][1] - point[1]);
                    var d = {index: 0, distance: x*x + y*y};
                    var nd = 0;
                    for (i = 1; i < coordinates.length; i++) {
                        x = (coordinates[i][0] - point[0]);
                        y =  (coordinates[i][1] - point[1]);
                        nd = x*x + y*y;
                        if (nd < d.distance) {
                            d = {index: i, distance: nd};
                        }
                    }
                    return d.index;
                }
                                
                // event handlers for waypoints
                function onWaypointClick(e) {
                    var feature = e.target.feature;
                    var i = getNearest(feature.geometry.coordinates, [e.latlng.lng, e.latlng.lat]);
                    var popup = L.popup()
                        .setLatLng(e.latlng)
                        .setContent(formatPopupContent(feature.properties.vehicle_info, feature.geometry.coordinates[i]));
                    e.target._map.openPopup(popup);
                }
                function onEachFeature(feature, layer) {
                    layer.on('click', onWaypointClick);
                }

                function main_map_init(map, options) {

                    // place makers
                    var features = waypoints.features;
                    for (i = 0; i < features.length; i++) {
                        var track = features[i].geometry.coordinates;
                        var veh_info = features[i].properties.vehicle_info;
                        if (track.length > 0) {
                            var marker = L.marker(track[0]);
                            var popup = L.popup();
                            marker.bindPopup(popup);
                            marker.addTo(map);
                            markers.push({marker: marker, popup: popup, track: track, cnt: 0, vehicle: veh_info});
                        }
                    }
                    
                    // waypoints line style
                    var lineStyle = {
                        "color": "Red",
                        "weight": 5,
                        "opacity": 0.65
                    };
                    
                    // create waypoints
                    var tracks = L.geoJson(waypoints, {
                        style: lineStyle,
                        onEachFeature: onEachFeature
                    });

                    // set map viewport
                    var group = new L.featureGroup([tracks]);
                    map.fitBounds(group.getBounds());
                    tracks.addTo(map);
                    
                    // start animation
                    setInterval(animate, 200);

                }
            </script>
            
        </body>

        {% leaflet_map "main" callback="main_map_init" %}

    </html>
{% endblock %}

{'fraction_non_alphanumeric': 0.11431451612903226, 'fraction_numerical': 0.009778225806451614, 'mean_word_length': 0.9122976098689283, 'pattern_counts': {'":': 6, '<': 53, '<?xml version=': 0, '>': 48, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5516207', 'n_tokens_mistral': 2658, 'n_tokens_neox': 2374, 'n_words': 491}