From c9eb98166c12e0ab0a539ee134818884d17d2046 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Laura=20Kl=C3=BCnder?= <laura@codingcatgirl.de>
Date: Sun, 11 Sep 2016 22:11:28 +0200
Subject: [PATCH] update editor js to only use the REST API.

---
 src/c3nav/editor/templates/editor/map.html | 72 ++++++++++++++--------
 src/c3nav/editor/urls.py                   |  5 +-
 src/c3nav/editor/views.py                  | 27 --------
 3 files changed, 48 insertions(+), 56 deletions(-)
 delete mode 100644 src/c3nav/editor/views.py

diff --git a/src/c3nav/editor/templates/editor/map.html b/src/c3nav/editor/templates/editor/map.html
index 295eaed3..02d5121b 100644
--- a/src/c3nav/editor/templates/editor/map.html
+++ b/src/c3nav/editor/templates/editor/map.html
@@ -8,9 +8,7 @@
 <script type="text/javascript">
 // Init Map
 var map = L.map('mapeditor', {
-    center: [120, 200],
     zoom: 2,
-    maxBounds: {{ bounds }},
     maxZoom: 10,
     minZoom: 1,
     crs: L.CRS.Simple,
@@ -18,29 +16,52 @@ var map = L.map('mapeditor', {
     closePopupOnClick: false,
 });
 
-// Add Source Layers
-{% for source_list in sources %}
-L.control.layers([], {
-    {% for source in source_list %}
-    "{{ source.name }}": L.imageOverlay('{% url 'editor.sources.image' source=source.name %}', {{ source.jsbounds }}),{% endfor %}
-}).addTo(map);
-{% endfor %}
-
-// Add Layer Control
-L.LevelControl = L.Control.extend({
-    options: {
-        position: 'bottomright'
-    },
-    onAdd: function (map) {
-        var container = L.DomUtil.create('div', 'leaflet-control leaflet-bar leaflet-levels'), link;
-        {% for level in levels reversed %}
-        link = L.DomUtil.create('a', '{% if forloop.last %}current{% endif %}', container);
-        link.innerHTML = '{{ level.name }}';
-        {% endfor %}
-        return container;
+$.getJSON('/api/v1/map/packages/', function(packages) {
+    var bounds = [[0, 0], [0, 0]];
+    var pkg;
+    for(var i=0;i<packages.length;i++) {
+        pkg = packages[i];
+        if (pkg.bounds === undefined) continue;
+        bounds = [[Math.min(bounds[0][0], pkg.bounds[0][0]), Math.min(bounds[0][1], pkg.bounds[0][1])],
+                  [Math.max(bounds[1][0], pkg.bounds[1][0]), Math.max(bounds[1][1], pkg.bounds[1][1])]];
     }
-});
-map.addControl(new L.LevelControl());
+    map.setMaxBounds(bounds);
+    console.log(bounds);
+    map.fitBounds(bounds, {padding: [30, 50]});
+})
+
+$.getJSON('/api/v1/map/sources/', function(sources) {
+    var layers = {};
+    var source;
+    for(var i=0;i<sources.length;i++) {
+        source = sources[i];
+        if (layers[source.package] === undefined) layers[source.package] = {}
+        layers[source.package][source.name] = L.imageOverlay('/api/v1/map/sources/'+source.name+'/image/', source.bounds);
+    }
+    for(group_name in layers) {
+        console.log(group_name);
+        L.control.layers([], layers[group_name]).addTo(map);
+    }
+})
+
+$.getJSON('/api/v1/map/levels/?ordering=-altitude', function(levels) {
+    L.LevelControl = L.Control.extend({
+        options: {
+            position: 'bottomright'
+        },
+        onAdd: function (map) {
+            var container = L.DomUtil.create('div', 'leaflet-control leaflet-bar leaflet-levels'), link;
+            var level;
+            for(var i=0;i<levels.length;i++) {
+                level = levels[i];
+                link = L.DomUtil.create('a', (i == levels.length-1) ? 'current' : '', container);
+                link.innerHTML = level.name;
+            }
+            return container;
+        }
+    });
+    map.addControl(new L.LevelControl());
+})
 
 // Default styles:
 feature_types = {
@@ -134,7 +155,7 @@ map.on('editable:drawing:commit', function (e) {
     L.popup({
         closeButton: false,
         autoClose: false,
-    }).setContent('<img src="{% static "img/loader.gif" %}">').setLatLng(e.layer.getCenter()).openOn(map);
+    }).setContent('<img src="/static/img/loader.gif">').setLatLng(e.layer.getCenter()).openOn(map);
     console.log(e.layer.toGeoJSON());
 }).on('editable:drawing:cancel', function (e) {
     if (currently_drawing === null && currently_adding === null) {
@@ -143,6 +164,5 @@ map.on('editable:drawing:commit', function (e) {
 });
 
 L.control.scale({imperial: false}).addTo(map);
-
 </script>
 {% endblock %}
diff --git a/src/c3nav/editor/urls.py b/src/c3nav/editor/urls.py
index 27290af7..8de80ab9 100644
--- a/src/c3nav/editor/urls.py
+++ b/src/c3nav/editor/urls.py
@@ -1,8 +1,7 @@
 from django.conf.urls import url
+from django.views.generic import TemplateView
 
-from . import views
 
 urlpatterns = [
-    url(r'^$', views.index, name='editor.index'),
-    url(r'^sources/image/(?P<source>[^/]+)$', views.source, name='editor.sources.image'),
+    url(r'^$', TemplateView.as_view(template_name='editor/map.html'), name='editor.index')
 ]
diff --git a/src/c3nav/editor/views.py b/src/c3nav/editor/views.py
deleted file mode 100644
index 1f6acbcc..00000000
--- a/src/c3nav/editor/views.py
+++ /dev/null
@@ -1,27 +0,0 @@
-import json
-import mimetypes
-import os
-
-from django.conf import settings
-from django.core.files import File
-from django.http import HttpResponse
-from django.shortcuts import get_object_or_404, render
-
-from ..mapdata.models import Level, Package, Source
-
-
-def index(request):
-    return render(request, 'editor/map.html', {
-        'bounds': json.dumps(Source.max_bounds()),
-        'sources': [p.sources.all().order_by('name') for p in Package.objects.all()],
-        'levels': Level.objects.order_by('altitude'),
-    })
-
-
-def source(request, source):
-    source = get_object_or_404(Source, name=source)
-    response = HttpResponse(content_type=mimetypes.guess_type(source.name)[0])
-    image_path = os.path.join(settings.MAP_ROOT, source.package.directory, 'sources', source.name)
-    for chunk in File(open(image_path, 'rb')).chunks():
-        response.write(chunk)
-    return response