Adapt permalink loading

3 files changed, 105 insertions, 20 deletions

diff --git a/chimere/static/chimere/css/styles.css b/chimere/static/chimere/css/styles.css
index 0539a67..c0c3cdc 100644
--- a/chimere/static/chimere/css/styles.css
+++ b/chimere/static/chimere/css/styles.css
@@ -1682,14 +1682,19 @@ span#permalink, .navbar-nav .lbl, #areas-div label, #permalink, #simple_button,
     padding: 0px 0px 0px 0.5em;
 }
 
-#permalink, #simple_button-lnk lbl{
+#simple_button-lnk lbl{
     padding: 0 0.8em;
 }
 
+#permalink{
+    padding: 10px 0.8em;
+}
+
 #areas-div{
     line-height:42px;
 }
 
+.nav-pills > li#permalink-lnk > a > .fa,
 .nav-pills > li#simple_button-lnk > a > .fa{
     color:#777;
 }
diff --git a/chimere/static/chimere/js/base.js b/chimere/static/chimere/js/base.js
index d7a9695..0085cd7 100644
--- a/chimere/static/chimere/js/base.js
+++ b/chimere/static/chimere/js/base.js
@@ -1,5 +1,5 @@
 /* base function shared by some pages */
-/* Copyright (C) 2009-2014  Étienne Loks <etienne.loks_AT_peacefrogsDOTnet>
+/* Copyright (C) 2009-2016  Étienne Loks <etienne.loks_AT_peacefrogsDOTnet>
 
 This program is free software: you can redistribute it and/or modify
 it under the terms of the GNU General Public License as
@@ -125,7 +125,7 @@ function share_link_update(){
                 share_id = share_id.split('_')[0];
             }
         }
-        var params = $('#permalink a').attr('href').split('/');
+        var params = $('#permalink').attr('href').split('/');
         url += share_id + params[params.length-1];
         $.ajax({url: url,
             dataType: "html",
diff --git a/chimere/static/chimere/js/jquery.chimere.js b/chimere/static/chimere/js/jquery.chimere.js
index 64ad2b1..b42ec33 100644
--- a/chimere/static/chimere/js/jquery.chimere.js
+++ b/chimere/static/chimere/js/jquery.chimere.js
@@ -193,9 +193,7 @@ function transformCoordToLonLat(coord) {
         */
         var defaults = {
             restricted_extent: false,
-            permalink_label: null,
-            permalink_div: null,
-            permalink: null, // OL Control, could be overrided
+            permalink: null, // permalink initialization
             map_layers: null,
             selected_map_layer: null,
             dynamic_categories: false,
@@ -668,7 +666,7 @@ function transformCoordToLonLat(coord) {
                     methods.loadGeoObjects();
                 }
             });
-
+            if (settings.permalink) methods._param_map_from_permalink();
 
             return;
 
@@ -746,7 +744,7 @@ function transformCoordToLonLat(coord) {
         },
         _move_end: function(e){
             settings._reload_on_move(e);
-            console.log(methods._get_permalink());
+            methods._get_permalink();
         },
         _get_permalink: function(e){
             var view = settings.map.getView();
@@ -799,7 +797,7 @@ function transformCoordToLonLat(coord) {
                     steps += geom[0].toFixed(5) + ':' + geom[1].toFixed(5);
                 }
             }
-            return view.getZoom() + ';'
+            settings.permalink = view.getZoom() + ';'
                 + center[0].toFixed(5) + ':'
                 + center[1].toFixed(5) + ';'
                 + layers + ';'
@@ -810,6 +808,91 @@ function transformCoordToLonLat(coord) {
                 + routing_start + ';'
                 + routing_end + ';'
                 + steps;
+            var uri = extra_url
+            if (settings.area_id) uri += settings.area_id + "/";
+            $("#permalink").attr('href', uri + "#" + settings.permalink);
+            return settings.permalink
+        },
+        _param_map_from_permalink: function(){
+            var items = settings.permalink.split(';');
+
+            var zoom = items[0];
+
+            var center = items[1].split(':');
+            center = [Math.round(center[0] * 1000) / 1000,
+                      Math.round(center[1] * 1000) / 1000];
+            var center = ol.proj.transform(
+                        center,
+                        EPSG_DISPLAY_PROJECTION,
+                        EPSG_PROJECTION);
+            var layers = items[2];
+            var checked_categories = items[3].split('-');
+            var current_feature = items[4];
+            var routing_speed = items[5];
+            var routing_transport = items[6];
+            var routing_start = items[7];
+            var routing_end = items[8];
+            var steps = items[9];
+
+            var view = settings.map.getView();
+            methods._set_animation();
+            view.setZoom(zoom);
+            view.setCenter(center);
+            /*
+            var center = ol.proj.transform(
+                        view.getCenter(),
+                        EPSG_PROJECTION,
+                        EPSG_DISPLAY_PROJECTION);
+            var layers = '';
+            $.each(settings.map.getLayers().getArray(), function(i, l){
+                var idx = l.getProperties()['base-layer-idx'];
+                if (typeof idx != 'undefined' && l.getVisible()){
+                    if (layers != '') layers += ':';
+                    layers += idx;
+                }
+            });
+
+            var current_feature = '';
+            if (settings.current_feature)
+                current_feature = settings.current_feature.getId();
+            var routing_speed = '';
+            if (settings.routing_speed)
+                routing_speed = settings.routing_speed;
+            var routing_transport = '';
+            if (settings.routing_transport)
+                routing_transport = settings.routing_transport;
+            var routing_start = '';
+            if (settings.routing_start){
+                var geom = ol.proj.transform(
+                    settings.routing_start.getGeometry().getCoordinates(),
+                    EPSG_PROJECTION,
+                    EPSG_DISPLAY_PROJECTION);
+                routing_start = geom[0].toFixed(5) + ':' + geom[1].toFixed(5);
+            }
+            var routing_end = '';
+            if (settings.routing_end){
+                var geom = ol.proj.transform(
+                    settings.routing_end.getGeometry().getCoordinates(),
+                    EPSG_PROJECTION,
+                    EPSG_DISPLAY_PROJECTION);
+                routing_end = geom[0].toFixed(5) + ':' + geom[1].toFixed(5);
+            }
+            var steps = '';
+            if (settings.routing_steps){
+                for (var i = 0; i < settings.routing_steps.length; i++){
+                    var geom = ol.proj.transform(
+                        settings.routing_steps[i].getGeometry().getCoordinates(),
+                        EPSG_PROJECTION,
+                        EPSG_DISPLAY_PROJECTION);
+                    if (i > 0) steps += ';';
+                    steps += geom[0].toFixed(5) + ':' + geom[1].toFixed(5);
+                }
+            }
+            var uri = extra_url
+            if (settings.area_id) uri += settings.area_id + "/";
+            $("#permalink").attr('href', uri + "#" + settings.permalink);
+            return settings.permalink
+            */
         },
         _register_popuphovering: function(){
             $(document).on({
@@ -1183,9 +1266,9 @@ function transformCoordToLonLat(coord) {
                 settings.routing_transport ||
                 settings.routing_start ||
                 settings.routing_end){
-                $("#permalink a").removeAttr("disabled");
+                $("#permalink").removeAttr("disabled");
             } else {
-                $("#permalink a").attr("disabled", "disabled");
+                $("#permalink").attr("disabled", "disabled");
             }
         },
         /* Preload icons */
@@ -1516,7 +1599,7 @@ function transformCoordToLonLat(coord) {
                     methods.hidePopup(e);
                     _toggle_subcategories($(this));
                     methods.loadGeoObjects();
-                    settings.permalink.updateLink();
+                    methods._get_permalink();
                 });
                 $('.subcategories li input').bind("click", function (e) {
                     $('#search-result').html('');
@@ -1533,8 +1616,7 @@ function transformCoordToLonLat(coord) {
                     }
                     methods.loadGeoObjects();
                     _toggle_categories($(this));
-                    // OL-3 permalink
-                    // settings.permalink.updateLink();
+                    methods._get_permalink();
                     if ($('#layer_cat_'+c_name).length){
                         $('#layer_cat_'+c_name).prop("checked",
                                                      this.checked);
@@ -1543,7 +1625,7 @@ function transformCoordToLonLat(coord) {
                 });
                 $('#display_submited_check').bind("click", function () {
                     methods.loadGeoObjects();
-                    settings.permalink.updateLink();
+                    methods._get_permalink();
                 });
                 // Zoom to category
                 $(".zoom_to_category").bind("click", function (e) {
@@ -1740,7 +1822,7 @@ function transformCoordToLonLat(coord) {
                 if (!settings.explicit_popup_hide){
                     settings.current_popup.groupDiv.onclick = methods.hidePopup;
                 }
-                settings.permalink.updateLink();
+                methods._get_permalink();
                 methods.update_permalink_activation();
             }
             var _repan_popup = function(){
@@ -2360,8 +2442,7 @@ function transformCoordToLonLat(coord) {
             settings.current_itinerary_number = 0;
             settings.current_routes_features = [];
             settings.routingFeatures.clear();
-            // TODO ol3
-            // settings.permalink.updateLink();
+            methods._get_permalink();
         },
         // display a route
         route: function(){
@@ -2397,8 +2478,7 @@ function transformCoordToLonLat(coord) {
                 }
                 uri += step[0] + '_' + step[1];
             }
-            // TODO ol3
-            // settings.permalink.updateLink();
+            methods._get_permalink();
             $.ajax({url: uri,
                     dataType: "json",
                     success: function (data) {