Add OL Style on selected section

1 files changed, 45 insertions, 14 deletions

diff --git a/app/assets/javascripts/route_section.js.coffee b/app/assets/javascripts/route_section.js.coffee
index f2e494c0c..74f095772 100644
--- a/app/assets/javascripts/route_section.js.coffee
+++ b/app/assets/javascripts/route_section.js.coffee
@@ -4,6 +4,7 @@ class @RouteSectionMap
 
     routeSectionOption = $("option[value=#{route_section_id}]")
     routeSectionOption.parent().val route_section_id
+    RouteSectionMap.changeStyle(routeSectionOption.parent())
 
     $('#map-selection').show()
     $('#empty-map-selection').hide()
@@ -16,7 +17,49 @@ class @RouteSectionMap
     $('#map-selection').hide()
     $('#empty-map-selection').show()
 
+  @editRoute = (el) ->
+    new_route_section_id = $(el).val()
+    edit_link = $(el).closest("tr").find("a.edit-route-section")
+
+    # Save edit link to play with it
+    unless edit_link.data("href-pattern")?
+      edit_link.data "href-pattern", edit_link.attr('href').replace(new RegExp("/route_sections/([0-9]+)/edit"), "/route_sections/:id/edit")
+
+    if !!new_route_section_id
+      edit_link.removeClass "disabled"
+      edit_link.attr 'href', edit_link.data("href-pattern").replace(/:id/, new_route_section_id)
+    else
+      edit_link.addClass "disabled"
+      edit_link.attr 'href', '#'
+
+  @featureStyle = (id, erase) ->
+    if id
+      features = route_section_geometry.getFeaturesByAttribute('id', id.toString())
+      if features.length > 0
+        feature = features[0]
+        style = null
+        if !erase
+          style =
+            strokeWidth: 3
+            strokeColor: 'green'
+        feature.style = style
+        feature.layer.redraw()
+
+  @changeStyle = (el) ->
+    id = $(el).val()
+    options = $(el).find('option').map(->
+      $(this).val()
+    )
+    $.each options, (key, value) ->
+      RouteSectionMap.featureStyle value, true
+      return
+    RouteSectionMap.featureStyle id, false
+
 jQuery ->
+  $route_sections_selector = $('[name^="route_sections_selector[sections_attributes]"]')
+  $.each $route_sections_selector, (index, el) ->
+    RouteSectionMap.changeStyle el
+
   if $("#map.route_section").length > 0 and user_geometry?
     projWGS84 = new OpenLayers.Projection("EPSG:4326")
     proj900913 = new OpenLayers.Projection("EPSG:900913")
@@ -33,20 +76,8 @@ jQuery ->
     })
 
   $('#new_route_sections_selector select').on 'change', ->
-    new_route_section_id = $(this).val()
-
-    edit_link = $(this).closest("tr").find("a.edit-route-section")
-
-    # Save edit link to play with it
-    unless edit_link.data("href-pattern")?
-      edit_link.data "href-pattern", edit_link.attr('href').replace(new RegExp("/route_sections/([0-9]+)/edit"), "/route_sections/:id/edit")
-
-    if !!new_route_section_id
-      edit_link.removeClass "disabled"
-      edit_link.attr 'href', edit_link.data("href-pattern").replace(/:id/, new_route_section_id)
-    else
-      edit_link.addClass "disabled"
-      edit_link.attr 'href', '#'
+    RouteSectionMap.changeStyle this
+    RouteSectionMap.editRoute this
 
   $('form.route_section').find('button[type="submit"]').on 'click', (e) ->
     e.preventDefault();