foliage 0.1.0

data/app/assets/javascripts/foliage/path.js.coffee

@@ -0,0 +1,76 @@
+# Foliage.Paths class
+# displays crumbs by intervention as a path
+#
+# @data is an array of hashes containing info to display
+# @layer is the layer name
+#
+# ==== examples
+#
+# @data is an array of hashes built according to the following model:
+# * minimal example of a hash representing a crumb:
+#   item  {
+#           name:         <intervention name>,  # may be the date, the doer's name,
+#                                               # whatever you want as long as all the crumbs
+#                                               # for a given intervention have the same one.
+#                                               # This is what is called in the
+#                                               # FoliageHelper to build the legend if
+#                                               # you wrote something like:
+#                                               #   = foliage do |leaf|
+#                                               #     - leaf.serie :crumbs, my_array_of_crumbs_hashes
+#                                               #     - leaf.paths :name, :crumbs
+#                                               # :name being the @layer parameter the constructor requires.
+#           nature:       crumb.nature,         # proper to the crumb. May be one of the natures
+#                                               # enumerated in Crumb model.
+#                                               # this option is used to display particular points
+#                                               # bigger and to change the path opacity for parts
+#                                               # that correspond to actual works (points between a
+#                                               # hard_start) and a hard_stop crumb
+#           shape:        crumb.geolocation,    # proper to the crumb. contains the actual crumb
+#                                               # location as a Charta::Geometry object.
+#                                               # This is what is used to draw the crumb on the map
+#  }
+class Foliage.Path
+
+  constructor: (@layer, @data, @options = {}) ->
+    if this.valid()
+      @options.color ?= Foliage.colors[0]
+      @options.fillColor ?= @options.color
+      console.log "Paths computed", @options
+    else
+      console.warn "Invalid paths"
+
+  # Build layer as wanted
+  buildLayerGroup: (widget, globalStyle = {}) ->
+    group = []
+    for crumb in @data
+      crumbLayer = new L.circleMarker(new L.geoJson(crumb.shape).getBounds().getCenter(), $.extend(true, {}, globalStyle, @options, {className: "crumb crumb-#{crumb.name}"}))
+      widget._bindPopup(crumbLayer, crumb)
+      group.push(crumbLayer)
+      previous_crumb = @data[@data.indexOf(crumb) - 1]
+      if previous_crumb
+        points = []
+        points.push(new L.geoJson(previous_crumb.shape).getBounds().getCenter())
+        points.push(new L.geoJson(crumb.shape).getBounds().getCenter())
+        crumbLayer = new L.polyline(points, $.extend(true, {}, globalStyle, @options))
+        group.push(crumbLayer)
+    return group
+
+  # Build HTML legend for given paths computed layer
+  buildLegend: () ->
+    html  = "<div class='leaflet-legend-item' id='legend-#{@layer.name}'>"
+    html += "<div class='leaflet-legend-body leaflet-categories-scale'>"
+    html += "<span class='leaflet-categories-items'>"
+    html += "<span class='leaflet-categories-item'>"
+    html += "<i class='leaflet-categories-sample' style='background-color: #{@options.color};'></i>"
+    html += " #{@layer.label}"
+    html += "</span>"
+    html += "</span>"
+    html += "</div>"
+    html += "</div>"
+    return html
+
+  # Check if paths are valid
+  valid: () ->
+    true
+
+Foliage.registerLayerType "path", Foliage.Path

data/app/assets/javascripts/foliage/paths.js.coffee

@@ -0,0 +1,131 @@
+# Foliage.Paths class
+# displays crumbs by intervention as a path
+#
+# @data is an array of hashes containing info to display
+# @layer is the layer name
+#
+# ==== examples
+#
+# @data is an array of hashes built according to the following model:
+# * minimal example of a hash representing a crumb:
+#   item  {
+#           name:         <intervention name>,  # may be the date, the doer's name,
+#                                               # whatever you want as long as all the crumbs
+#                                               # for a given intervention have the same one.
+#                                               # This is what is called in the
+#                                               # FoliageHelper to build the legend if
+#                                               # you wrote something like:
+#                                               #   = foliage do |leaf|
+#                                               #     - leaf.serie :crumbs, my_array_of_crumbs_hashes
+#                                               #     - leaf.paths :name, :crumbs
+#                                               # :name being the @layer parameter the constructor requires.
+#           nature:       crumb.nature,         # proper to the crumb. May be one of the natures
+#                                               # enumerated in Crumb model.
+#                                               # this option is used to display particular points
+#                                               # bigger and to change the path opacity for parts
+#                                               # that correspond to actual works (points between a
+#                                               # hard_start) and a hard_stop crumb
+#           shape:        crumb.geolocation,    # proper to the crumb. contains the actual crumb
+#                                               # location as a Charta::Geometry object.
+#                                               # This is what is used to draw the crumb on the map
+#  }
+class Foliage.Paths
+
+  constructor: (@layer, @data, options = {}) ->
+    @items = []
+    property = @layer.reference
+    for crumb in @data
+      unless this.itemFor(crumb[property])
+        @items.push
+          name: crumb[property]
+
+    if this.valid()
+      @items = @items.sort (a, b) ->
+        a.name > b.name
+      @colors = options.colors ? []
+      if @items.length > @colors.length
+        for x in [@colors.length..@items.length]
+          @colors.push(Foliage.colors[x] ? "#000000")
+      for item, index in @items
+        item.fillColor = @colors[index]
+
+      console.log "Paths computed"
+    else
+      console.warn "Invalid paths"
+
+  # Build layer as wanted
+  buildLayerGroup: (widget, globalStyle = {}) ->
+    group = []
+    # defining styles
+    strokeWidth = 4
+    crumbStyle =
+      radius: strokeWidth
+      stroke: true
+      weight: strokeWidth/2
+      color: "#000000"
+      fillColor: "#FFFFFF"
+      opacity: 1
+    lineStyle =
+      weight: strokeWidth
+      stroke: true
+      color: this.itemFor(@data[0][@layer.reference]).fillColor
+      fillColor: "rgba(0,0,0,0)"
+      opacity: 1
+
+    # drawing line
+    points = []
+    current_name = @data[0].name
+    current_color = this.itemFor(@data[0][@layer.reference]).fillColor
+    for crumb in @data
+      if crumb.name != current_name
+        lineStyle.color = current_color
+        lineLayer = new L.polyline(points, $.extend(true, {}, globalStyle, lineStyle))
+        group.push(lineLayer)
+        points = []
+        current_name = crumb.name
+        current_color = this.itemFor(crumb[@layer.reference]).fillColor
+      points.push(new L.geoJson(crumb.shape).getBounds().getCenter())
+    if points.length > 0
+      lineStyle.color = current_color
+      lineLayer = new L.polyline(points, $.extend(true, {}, globalStyle, lineStyle))
+      group.push(lineLayer)
+    # drawing circles
+    for crumb in @data
+      crumbStyle.color= this.itemFor(crumb[@layer.reference]).fillColor
+      if crumb.nature == 'hard_start'
+        crumbStyle.fillColor = "#000000"
+      if crumb.nature == 'hard_stop'
+        crumbStyle.fillColor = "#FFFFFF"
+      crumbLayer = new L.circleMarker(new L.geoJson(crumb.shape).getBounds().getCenter(), $.extend(true, {}, globalStyle, crumbStyle))
+      widget._bindPopup(crumbLayer, crumb)
+      group.push(crumbLayer)
+    group
+
+  # Build HTML legend for given paths computed layer
+  buildLegend: () ->
+    html  = "<div class='leaflet-legend-item' id='legend-#{@layer.name}'>"
+    html += "<h3>#{@layer.label}</h3>"
+    html += "<div class='leaflet-legend-body leaflet-categories-scale'>"
+    html += "<span class='leaflet-categories-items'>"
+    for name, item of @items
+      html += "<span class='leaflet-categories-item'>"
+      html += "<i class='leaflet-categories-sample' style='background-color: #{item.fillColor};'></i>"
+      html += " #{item.name}"
+      html += "</span>"
+    html += "</span>"
+    html += "</div>"
+    html += "</div>"
+    return html
+
+  # Returns the item matching the given name
+  itemFor: (name) ->
+    back = null
+    @items.forEach (item, index, array) ->
+      back = item if item.name == name
+    return back
+
+  # Check if paths are valid
+  valid: () ->
+    @items.length > 0
+
+Foliage.registerLayerType "paths", Foliage.Paths

data/app/assets/javascripts/foliage/point_group.js.coffee

@@ -0,0 +1,83 @@
+class Foliage.PointGroup
+
+  constructor: (@layer, @data, @options = {}) ->
+    @items = []
+    console.log "Layer: ", @layer
+    for zone in @data
+      lnglat = zone.shape.coordinates
+      @items.push
+        name: zone.name
+        point: [lnglat[1], lnglat[0]]
+        radius: zone.radius ? @options.radius
+        group: zone.group
+        fillColor: zone.shapeColor
+        popup: zone.popup
+        sensorId: zone.sensorId
+    if this.valid()
+      @items = @items.sort (a, b) ->
+        a.name > b.name
+      @groups = {}
+      for {group, name, fillColor} in @items
+        @groups[group] or= fillColor
+      console.log "Point group computed"
+    else
+      console.warn "Invalid categories"
+
+  # Build layer as wanted
+  buildLayerGroup: (widget, globalStyle = {}) ->
+    group = []
+    # Shadow
+    if @options.stroke
+      for zone in @items
+        zoneStyle =
+          fillColor: zone.color ? @options.color
+          radius: (zone.radius ? @options.radius) + @options.weight
+          stroke: false
+          fillOpacity: 0.8
+        console.log zone.point
+        shadow = new L.circleMarker(zone.point, zoneStyle)
+        shadow.markerSensorId = zone.sensorId
+        group.push shadow
+    # Core
+    for zone in @items
+      console.log zone
+      zoneStyle =
+        fillColor: zone.fillColor ? @options.fillColor
+        radius: zone.radius ? @options.radius
+        stroke: false
+        fillOpacity: 1
+      console.log zoneStyle
+      zoneLayer = new L.circleMarker(zone.point, zoneStyle)
+      zoneLayer.sensorId = zone.sensorId
+      widget._bindPopup(zoneLayer, zone)
+      group.push(zoneLayer)
+    group
+
+  # Build HTML legend for given points computed layer
+  buildLegend: () ->
+    html  = "<div class='leaflet-legend-item' id='legend-#{@layer.name}'>"
+    html += "<h3>#{@layer.label}</h3>"
+    html += "<div class='leaflet-legend-body leaflet-categories-scale'>"
+    html += "<span class='leaflet-categories-items'>"
+    for group in Object.keys(@groups)
+      html += "<span class='leaflet-categories-item'>"
+      html += "<i class='leaflet-categories-sample' style='background-color: #{@groups[group]};'></i>"
+      html += " <span class='leaflet-categories-item_label'>#{group}</span>"
+      html += "</span>"
+    html += "</span>"
+    html += "</div>"
+    html += "</div>"
+    return html
+
+  # Returns the item matching the given name
+  itemFor: (name) ->
+    back = null
+    @items.forEach (item, index, array) ->
+      back = item if item.name == name
+    return back
+
+  # Check if categories are valid
+  valid: () ->
+    @items.length > 0
+
+Foliage.registerLayerType "point_group", Foliage.PointGroup

data/app/assets/javascripts/foliage/points.js.coffee

@@ -0,0 +1,79 @@
+class Foliage.Points
+
+  constructor: (@layer, @data, @options = {}) ->
+    @items = []
+    console.log "Layer: ", @layer
+    for zone in @data
+      lnglat = zone.shape.coordinates
+      @items.push
+        name: zone.name
+        point: [lnglat[1], lnglat[0]]
+        radius: zone.radius ? @options.radius
+    if this.valid()
+      @items = @items.sort (a, b) ->
+        a.name > b.name
+      @colors = @options.colors ? []
+      if @items.length > @colors.length
+        for x in [@colors.length..@items.length]
+          @colors.push(Foliage.colors[x] ? "#000000")
+      for item, index in @items
+        item.fillColor = @colors[index]
+      console.log "Points computed"
+    else
+      console.warn "Invalid categories"
+
+  # Build layer as wanted
+  buildLayerGroup: (widget, globalStyle = {}) ->
+    group = []
+    # Shadow
+    if @options.stroke
+      for zone in @items
+        zoneStyle =
+          fillColor: zone.color ? @options.color
+          radius: (zone.radius ? @options.radius) + @options.weight
+          stroke: false
+          fillOpacity: 0.8
+        console.log zone.point
+        group.push new L.circleMarker(zone.point, zoneStyle)
+    # Core
+    for zone in @items
+      console.log zone
+      zoneStyle =
+        fillColor: zone.fillColor ? @options.fillColor
+        radius: zone.radius ? @options.radius
+        stroke: false
+        fillOpacity: 1
+      console.log zoneStyle
+      zoneLayer = new L.circleMarker(zone.point, zoneStyle)
+      widget._bindPopup(zoneLayer, zone)
+      group.push(zoneLayer)
+    group
+
+  # Build HTML legend for given points computed layer
+  buildLegend: () ->
+    html  = "<div class='leaflet-legend-item' id='legend-#{@layer.name}'>"
+    html += "<h3>#{@layer.label}</h3>"
+    html += "<div class='leaflet-legend-body leaflet-categories-scale'>"
+    html += "<span class='leaflet-categories-items'>"
+    for name, item of @items
+      html += "<span class='leaflet-categories-item'>"
+      html += "<i class='leaflet-categories-sample' style='background-color: #{item.fillColor};'></i>"
+      html += " #{item.name}"
+      html += "</span>"
+    html += "</span>"
+    html += "</div>"
+    html += "</div>"
+    return html
+
+  # Returns the item matching the given name
+  itemFor: (name) ->
+    back = null
+    @items.forEach (item, index, array) ->
+      back = item if item.name == name
+    return back
+
+  # Check if categories are valid
+  valid: () ->
+    @items.length > 0
+
+Foliage.registerLayerType "points", Foliage.Points

data/app/assets/javascripts/foliage/simple.js.coffee

@@ -0,0 +1,35 @@
+class Foliage.Simple
+
+  constructor: (@layer, @data, @options = {}) ->
+
+  # Build layer as wanted
+  buildLayerGroup: (widget, globalStyle = {}) ->
+    group = []
+    for zone in @data
+      zoneLayer = new L.GeoJSON(zone.shape, globalStyle)
+      label = new L.GhostLabel(className: 'leaflet-ghost-label', toBack: false).setContent(zone.name).toCentroidOfBounds(zoneLayer.getLayers()[0].getLatLngs())
+      widget.ghostLabelCluster.bind label, zoneLayer.getLayers()[0]
+      widget._bindPopup(zoneLayer, zone)
+      group.push(zoneLayer)
+    group
+
+  # Build HTML legend for given categories computed layer
+  buildLegend: () ->
+    html  = "<div class='leaflet-legend-item' id='legend-#{@layer.name}'>"
+    # html += "<h3>#{@layer.label}</h3>"
+    html += "<div class='leaflet-legend-body leaflet-categories-scale'>"
+    html += "<span class='leaflet-categories-items'>"
+    html += "<span class='leaflet-categories-item'>"
+    html += "<i class='leaflet-categories-sample' style='background-color: #{@layer.fillColor || @options.parent.options.layerDefaults[@layer.type].fillColor };'></i>"
+    html += " <span class='leaflet-categories-item_label'>#{@layer.label}</span>"
+    html += "</span>"
+    html += "</span>"
+    html += "</div>"
+    html += "</div>"
+    return html
+
+  # Check if categories are valid
+  valid: () ->
+    true
+
+Foliage.registerLayerType "simple", Foliage.Simple

data/app/assets/javascripts/leaflet/geographic_util.js.coffee

@@ -0,0 +1,23 @@
+L.GeographicUtil = L.extend L.GeographicUtil || {},
+  geod: GeographicLib.Geodesic.WGS84
+
+# Use Karney distance formula
+# ([lat, lng], [lat, lng]) -> Number (in meters)
+  distance: (a, b) ->
+    r = @geod.Inverse(a[0], a[1], b[0], b[1])
+    r.s12.toFixed(3)
+
+  Polygon: (points) -> # (Array of [lat,lng] pair)
+    @geod = GeographicLib.Geodesic.WGS84
+    @poly = @geod.Polygon(false)
+    for point in points
+      @poly.AddPoint point[0], point[1]
+
+    @poly = @poly.Compute(false, true)
+    return
+
+L.GeographicUtil.Polygon.prototype =
+  perimeter: ->
+    @poly.perimeter
+  area: ->
+    Math.abs @poly.area

data/app/assets/javascripts/leaflet/ghost_label.js.coffee

@@ -0,0 +1,100 @@
+###
+# Extend L.Label to provide a label on centroid, calculated from a L.Latlng[]
+# options:
+#   toBack {boolean} if true, label is set to objectsPane, allowing to be covered by higher level pane
+#   opacity: {string} ([0..1] | 'inherit') inherit allows to use opacity in your class. Default: 'inherit'
+ ###
+L.GhostLabel = L.Label.extend
+  __initialize: L.Label::initialize
+  _onAdd: L.Label.prototype.onAdd
+  __updateContent: L.Label.prototype._updateContent
+  __setOpacity: L.Label::setOpacity
+
+  initialize: (options, source) ->
+    options.opacity ||= 'inherit'
+
+    @__initialize.apply @, arguments
+
+  ###
+  # Set the latLng[] to calculate the centroid
+   ###
+  toCentroidOfBounds: (latLngs) ->
+    # To center of bounds if centroid can't be calculated during onAdd
+    @_latlng = L.latLngBounds(latLngs).getCenter()
+    @_latLngs = latLngs
+    return this
+
+  onAdd: (map) ->
+    # Don't hide labels on click
+    @options.noHide = true
+
+    if @options.toBack
+      @options.pane = 'objectsPane'
+
+    @_onAdd.apply this, arguments
+
+    map.on 'zoomend', @_onZoomEnd, @
+
+    if @options.toBack
+      # ZIndex 3 is default index of objectsPane
+      @updateZIndex '3'
+
+      @_updatePosition()
+    return
+
+  setOpacity: (opacity) ->
+    unless opacity is 'inherit'
+      @__setOpacity.call @, opacity
+
+  getLatLng: ->
+    @_latlng
+
+  _onZoomEnd: (e) ->
+    @getCenter(e.target)
+
+  getCenter: (map)->
+    if @_latLngs
+      poly = L.polygon(@_latLngs)
+      poly._map = @_map || map
+      @_latlng = poly.__getCenter()
+
+    @_latlng
+
+
+  ###
+  # Override to set position on pos, considering label center
+   ###
+  _setPosition: (pos) ->
+    map = @_map
+    container = @_container
+    labelWidth = @_labelWidth
+    labelHeight = @_labelHeight || 0
+
+    pos = pos.add(L.point(-labelWidth/2, -labelHeight/2))
+    L.DomUtil.setPosition container, pos
+    return
+
+  ###
+  #  Override to set position on pos, considering label center
+   ###
+  _updateContent: ->
+    @__updateContent.call this
+    @_labelHeight = @_container.offsetHeight if @_container
+
+
+L.extendedMethods =
+  # Allow to be updated
+  bindGhostLabel: (object, options) ->
+
+    if !@label
+      @label = object
+
+    if !@_showLabelAdded
+      @on 'remove', @_hideLabel, @
+
+    @_showLabelAdded = true
+    return
+
+L.Polygon.include L.extendedMethods
+L.FeatureGroup.include L.extendedMethods
+