socmap_adf 0.0.1

data/lib/assets/javascripts/socmap_adf/modules/gmap/views/overlay.js.coffee

@@ -0,0 +1,237 @@
+class ADF.GMap.Views.Overlay extends google.maps.OverlayView
+
+  hidden: true
+  topPoint: null
+  zindex: 1
+  body: "body"
+
+  constructor: (map, view) ->
+    @map = map
+    @view = view
+    @setMap(@map)
+    @hidden = @view.hidden
+    @clickable = @view.clickable
+    @hoverable = @view.hoverable
+    @showAfterDrag = @view.showAfterDrag
+    @view.overlay = @
+    @body = @view.body if @view.body?
+    @initMarker()
+    @bindMapEvents()
+    
+  # = Marker Methods  
+  initMarker: () ->
+    @options =
+      position: @view.point,
+      map: @map
+      draggable: @view.draggable
+      zIndex: 1
+    if @view.getCustomMarker()
+      @options.icon = @view.getCustomMarker().getIcon()
+      @options.shadow = @view.getCustomMarker().getShadow()
+      @options.shape = @view.getCustomMarker().getShape()
+    else
+      @options.icon = @view.icon if @view.icon
+      @options.shadow = @view.shadow if @view.shadow
+      @options.shape = @view.shape if @view.shape
+    
+    @options.cursor = "hand"
+    if @view.draggable
+      @options.cursor = "move"
+    if @clickable
+      @options.cursor = "pointer"    
+
+    if @view.label != null
+      @options.labelContent = @view.label
+      @options.labelClass = @view.labelClass
+      @options.labelAnchor = new google.maps.Point(60, 0)
+      @marker = new MarkerWithLabel @options
+    else
+      @marker = new google.maps.Marker @options
+    @view.setMarker(@marker)
+    @bindMarkerEvents()
+
+  setDraggable: (draggable) ->
+    @options.draggable = draggable
+    @options.cursor = "hand"
+    if @view.draggable
+      @options.cursor = "move"
+    if @clickable
+      @options.cursor = "pointer"
+
+    @marker.setOptions @options
+
+  setLabel: () ->
+    @marker.setMap(null)
+    @initMarker()
+    
+  setMarkerIcon: () ->
+    @marker.setIcon(@view.icon)
+
+  getMarkerIcon: () ->
+    @marker.getIcon()
+    
+  redrawMarker: () ->
+    @marker.setMap(null) if @marker
+    @initMarker()
+    
+  getMarker: () =>
+    @marker
+
+  isClustering: () ->
+    @view.isClustering()
+
+  getData: () ->
+    @view.getData()
+
+  bindMarkerEvents: () ->
+    @markerDragstartEvent = google.maps.event.addListener @marker, 'dragstart', (e) =>
+      @hide()
+
+    @markerDragendEvent = google.maps.event.addListener @marker, 'dragend', (e) =>
+      @view.point = e.latLng
+      if @showAfterDrag
+        @show()
+        @draw()
+      @view.onMarkerMoved(@view.point)
+    
+    @markerClickEvent = google.maps.event.addDomListener @marker, 'click', (e) =>
+      if @view.clickable 
+        @view.beforeMarkerClicked()
+        if @hidden
+          @show()  
+          @draw()
+
+    @markerMouseoverEvent = google.maps.event.addDomListener @marker, 'mouseover', (e) =>
+      if @view.hoverable
+        @view.onMarkerMouseOver()
+      
+    @markerMouseoutEvent = google.maps.event.addDomListener @marker, 'mouseout', (e) =>
+      if @view.hoverable
+        @view.onMarkerMouseOut()
+
+  bindMapEvents: () ->
+    @dragstartEvent = google.maps.event.addListener @map, 'dragstart', () =>
+      @draw()
+
+    @dragendEvent = google.maps.event.addListener @map, 'dragend', () =>
+      @draw()
+
+    @centerChangedEvent = google.maps.event.addListener @map, 'center_changed', () =>
+      @draw()
+
+  unbindMapEvents: () =>
+    google.maps.event.removeListener(@dragstartEvent)
+    google.maps.event.removeListener(@dragendEvent)
+    google.maps.event.removeListener(@centerChangedEvent)   
+
+  unbindMarkerEvents: () =>
+    google.maps.event.removeListener(@markerClickEvent)
+    google.maps.event.removeListener(@markerMouseoverEvent)
+    google.maps.event.removeListener(@markerMouseoutEvent)
+    google.maps.event.clearListeners(@getMarker(), "click")
+    google.maps.event.clearListeners(@getMarker(), "mouseover")
+    google.maps.event.clearListeners(@getMarker(), "mouseout")
+      
+  # = Show or Hide overlay
+  show: ( animation = false ) ->
+    @view.beforeOverlayShowed()
+    if animation
+      $(@div).fadeIn("fast")
+    else
+      $(@div).show()
+    @hidden = false
+    @view.onOverlayShowed()
+
+  hide: ( animation = false ) ->
+    $(@div).hide()
+    @hidden = true
+
+  hideMarker: () ->
+    @hide()
+    if @marker
+      @marker.setMap(null)
+
+  showMarker: () ->
+    @show()
+    @marker.setMap(@map)
+    
+  # = Set new position
+  setPosition: (point) ->
+    @view.point = point
+    @marker.setPosition(point)
+    @draw()
+
+  getPosition: () ->
+    @view.point
+    
+  # = From OverlayView 
+  onAdd: ->
+    @div = @view.render().el
+    if @view.asLabel
+      @pane = @getPanes().overlayLayer
+      @pane.appendChild(@div)
+    else
+      $(@body).append(@div)
+      @view.onMarkerAdded(@view.point)
+
+  draw: () ->
+    overlayProjection = @getProjection()
+    if (overlayProjection != null && overlayProjection != undefined && @view.point)
+      if @view.asLabel
+        divPixel = overlayProjection.fromLatLngToDivPixel(@view.point)
+      else
+        divPixel = overlayProjection.fromLatLngToContainerPixel(@view.point)
+      
+      @left = divPixel.x + @view.left - (@view.getWidth() / 2)
+      
+      if @view.overlayPositionVertical == "top"
+        @top = divPixel.y + @view.top - @view.getHeight()
+      else
+        @top = divPixel.y + @view.top
+
+      if @top < 0
+        point = new google.maps.Point(@left, (@top / 2) + ($(window).height() / 2))
+        @topPoint = overlayProjection.fromDivPixelToLatLng(point)
+      else
+        @topPoint = @view.point
+        
+    if (@div != null)
+      $(@div).css({position: "absolute", left: @left, top: @top, "z-index" : @zindex})
+
+      if @hidden
+        $(@div).hide()
+          
+      if !@hidden
+        @show()
+
+  onRemove: () ->
+    @unbindMapEvents()
+    @unbindMarkerEvents()
+    $(@div).remove()
+    @getMarker().setMap(null)
+    @onMap = false
+    
+  setInFront: () ->
+    @zindex = @zindex + 1
+    @draw()
+
+  setBack: () ->
+    @zindex = @zindex - 1
+    @draw()
+  
+  centerToOverlay: () ->
+    if @topPoint
+      @map.setCenter(@topPoint)
+    else
+      @map.setCenter(@view.point)
+
+  centerPanToOverlay: (x = 0, y = 0) ->
+    @map.panTo(@view.point)
+    @map.panBy(x, y)
+
+  centerToMarker: () ->
+    @map.setCenter(@view.point)
+
+  redraw: (event) ->
+    @view.point = event.latLng
+    @draw()

data/lib/assets/javascripts/socmap_adf/modules/gmap/views/overlay_view.js.coffee

@@ -0,0 +1,143 @@
+class ADF.GMap.Views.OverlayView extends ADF.MVC.Views.Base
+
+  top: -60
+  overlayPositionVertical: "top"
+  left: 0
+  hidden: true
+  overlay: null
+  icon: false
+  shadow: false
+  shape: false
+  draggable: false
+  point: false
+  label: null
+  labelClass: "marker_label"
+  customMarker: null
+  zindex: 1
+  clickable: true
+  asLabel: false
+  showAfterDrag: false
+  clustering: false
+  data: 1
+
+  constructor: (options) ->
+    super(options)
+    @map = options.map
+    @point = options.point
+    @clickable = options.clickable if options.clickable?
+    @hidden = options.hidden if options.hidden?
+    @data = options.data if options.data?
+    
+  setTop: (top) ->
+    @top = top
+    @redraw()
+    
+  setPosition: (top, left) ->
+    @top = top
+    @left = left
+    @redraw()
+  
+  render: () ->
+    if @model
+      $(@el).html(@template(@model.toJSON()))
+    else
+      $(@el).html(@template)
+    @initResize()
+    @onRenderCompleted()
+    @
+
+  hide: () ->
+    @overlay.hide() if @overlay
+    
+  show: () ->
+    @overlay.show() if @overlay
+
+  hideAll: () ->
+    @hide()
+    if @marker
+      @marker.setMap(null)
+
+  showAll: () ->
+    @show()
+    @overlay.initMarker()
+    
+  redraw: () ->
+    @overlay.draw()
+
+
+  isClustering: () ->
+    @clustering
+
+  getData: () ->
+    @data
+
+  pushOverlay: () ->
+    @overlay = new ADF.GMap.Views.Overlay(@map.getGMap(), @)
+    @map.addOverlay(@overlay)
+
+  addOrChangeLocation: (point) ->
+    @point = point
+    if @overlay
+      @overlay.setMap(null)
+    else
+      @unbindMap()
+    @pushOverlay()
+
+  setMarkerIcon: (icon) ->
+    @icon = icon
+    @overlay.setMarkerIcon()
+
+  setDraggable: (draggable) ->
+    @draggable = draggable
+    @overlay.setDraggable(@draggable)
+
+  setLabel: (label) ->
+    @label = label
+    @overlay.setLabel()
+
+  remove: () ->
+    @overlay.setMap(null) if @overlay
+    @point = false
+    @overlay = null
+
+  getCustomMarker: () ->
+    @customMarker
+
+  setCustomMarker: (customMarker) ->
+    @customMarker = customMarker
+    @overlay.redrawMarker()
+    
+  getMarker: () ->
+    @overlay.getMarker()
+
+  getHeight: () ->
+    $(@el).children(":first").height()
+    
+  getWidth: () ->
+    $(@el).children(":first").width()
+
+  initResize: () ->
+    $(@el).children(":first").resize @onResize
+    
+  onResize: (e) =>
+    @redraw()
+
+  centerMap: () ->
+    @overlay.centerToOverlay()
+    
+  centerPanMap: (x = 0, y = 0) ->
+    @overlay.centerPanToOverlay(x, y)
+
+  setMarker: (marker) ->
+    @marker = marker
+
+  # Callback methods
+  onRenderCompleted: () ->
+  onMarkerAdded: () ->
+  beforeMarkerClicked: () ->
+  beforeOverlayShowed: () ->
+  onMarkerMouseOver: () ->
+  onMarkerMouseOut: () ->
+  onOverlayShowed: () ->
+  onMarkerMoved: (point) ->
+  unbindMap: () ->

data/lib/assets/javascripts/socmap_adf/modules/gmap/views/polygon.js.coffee

@@ -0,0 +1,107 @@
+class ADF.GMap.Views.Polygon extends ADF.MVC.Views.Base
+  
+  initialize: () ->
+    @mapView = @options.mapView
+    @zone = @options.model
+    @onShapeClickedCallback = @options.onShapeClicked
+    @onPolygonDrawCompleted = @options.onPolygonDrawCompleted
+    @onPolygonDrawStarted = @options.onPolygonDrawStarted
+    @pathChanged = if typeof @options.pathChanged == 'function' then @options.pathChanged
+    @initialized = false
+        
+  initZone: (allowDraw) -> 
+    @initialized = true
+    @map = @mapView.getMap().getGMap()
+    if @zone.isNew() && allowDraw
+      @startDrawing()
+    else 
+      @zone.setPolygonMap( @map )
+      @onPolygonDrawCompleted() if @onPolygonDrawCompleted? && allowDraw
+      @setPolygonHandlers() 
+    @mapView.getMap().addOverlay(@)
+  
+  isClustering: () ->
+    false
+  
+  setLabel: ( label ) ->
+    bounds = new google.maps.LatLngBounds();
+
+    i = 0
+    while i < @zone.getPolygon().getPath().length
+      bounds.extend(@zone.getPolygon().getPath().getAt(i))
+      i++
+    point = bounds.getCenter()
+    
+    unless @labelView
+      @labelView = new ADF.Map.Views.PolygonLabel
+        point: point
+        map : @mapView.getMap()
+        model: @zone
+        hidden: false
+        label: label
+    else
+      @labelView.point = point
+      @labelView.label = label
+      @labelView.render()
+    
+  startDrawing: ->
+    return if @zone.readOnly
+    @drawingManager = new google.maps.drawing.DrawingManager
+      drawingMode: google.maps.drawing.OverlayType.POLYGON
+      polygonOptions: @zone.mapObject.polygon_options_defaults
+      map: @map
+      drawingControl: false
+      
+    @onPolygonStartDrawing()
+    @onPolygonDrawStarted() if @onPolygonDrawStarted?
+    google.maps.event.addListener @drawingManager, 'polygoncomplete', @polygonCompleteHandler
+ 
+  # stopDrawing: ->
+  #   @drawingManager.setMap(null) if @drawingManager
+  
+  setFirstCoordinate: (latLng) ->
+    @first_coordinate = latLng
+    
+  getFirstCoordinate: ->
+    if @first_coordinate? then @first_coordinate else false
+    
+  stopDrawing: ->
+    @drawingManager.setDrawingMode null if @drawingManager
+            
+  getZone: ->
+    @zone
+
+  setMap: (map) ->
+    @zone.setPolygonMap(map)
+  
+  removeFromMap: () ->
+    @zone.removeFromMap()
+    @labelView.remove() if @labelView
+  
+  polygonCompleteHandler: ( newShape ) =>
+    @zone.setPolygon( newShape )
+    @setPolygonHandlers()
+    @onPolygonDrawComplete()
+    @onPolygonDrawCompleted() if @onPolygonDrawCompleted?
+
+  setPolygonHandlers: () ->
+    google.maps.event.addListener @zone.getPolygon(), 'click', @newShapeClickHandler
+    google.maps.event.addListener @map, 'click', @clearSelection
+    google.maps.event.addListener @zone.getPolygon().getPath(), 'set_at', @pathChanged
+    google.maps.event.addListener @zone.getPolygon().getPath(), 'insert_at', @pathChanged
+    google.maps.event.addListener @zone.getPolygon().getPath(), 'remove_at', @pathChanged
+    @zone.setEditable()
+    
+  clearSelection: => 
+    @zone.setUnEditable( )
+      
+  newShapeClickHandler: ( e )  =>   
+    @zone.setEditable()
+    @onShapeClicked()
+    @onShapeClickedCallback() if @onShapeClickedCallback?
+                    
+  # Callback Methods
+  onPolygonDrawComplete: ->   
+  onPolygonStartDrawing: ->
+  onShapeClicked: ->
+  pathChanged: =>

data/lib/assets/javascripts/socmap_adf/modules/image_uploader/init.js.coffee

@@ -0,0 +1,7 @@
+# Default requires for ADF modules
+#= require_self
+#= require_tree ./templates
+#= require_tree ./views
+
+ADF.ImageUploader =
+  Views: {}

data/lib/assets/javascripts/socmap_adf/modules/image_uploader/templates/main.jst.eco

@@ -0,0 +1,10 @@
+<div class="file_upload_wrap clear">
+    <a href="#" class="btn_close">X</a>
+    <div class="button_upload_pic qq-upload-button qq-upload-drop-area">
+        <img class="uploaded_picture" width="auto" width="122" height="82" style="display: none;" src="" alt="Picture" />
+        <img class="loading button_upload_pic" width="122" height="82" style="display: none;" src="/assets/loading.gif" alt="Loading" />
+        <img class="image_holder" src="/assets/bg_pic_add.png" height="82" style="display: block;" width="122" alt="Holder" />
+    </div>
+    <p>Tu vari augšuplādēt līdz <strong>2MB</strong> lielus attēlus <strong>.jpg</strong>, <strong>.jpeg</strong>, <strong>.gif</strong> un <strong>.png</strong> formātos.</p>
+    <ul class="qq-upload-list"></ul>
+</div>

data/lib/assets/javascripts/socmap_adf/modules/image_uploader/views/main.js.coffee

@@ -0,0 +1,69 @@
+class ADF.ImageUploader.Views.Main extends ADF.MVC.Views.Base
+
+  template: JST['socmap_adf/modules/image_uploader/templates/main']
+  image: null
+  events:
+    "click .btn_close" : "onCloseClicked"
+
+
+  initialize: () ->
+    _.bindAll(this, 'render')
+    @onComplete = @options.onComplete if @options.onComplete
+    @onCancel = @options.onCancel if @options.onComplete
+    @image = @options.image if @options.image
+
+  render: () ->
+    options =
+      element: $(@el).get(0)
+      action: '/api/images'
+      multiple: false
+      debug: true
+      allowedExtensions: ['jpg', 'jpeg', 'png', 'gif']
+      onComplete: @onFileUploaded
+      onProgress: @onProgress
+      template: @template()
+      sizeLimit: 2024000
+      messages:
+        typeError: "Failam {file} ir nepareizs formāts. Tikai {extensions} formāti ir atļauti."
+        sizeError: "Fails {file} ir pārāk liels. Faila maksimālais lielums {sizeLimit}."
+        minSizeError: "Faila {file} izmērs ir par mazu, minimums {minSizeLimit}."
+        emptyError: "Fails {file} ir tukšs."
+        onLeave: "Fails nav pabeidzis augšuplādi. Vai tiešām vēlaties pamest aplikāciju?"
+
+    if !@uploader
+      @uploader = new qq.FileUploader options
+    @$("ul").hide()
+    
+    if @image
+      @showImage(@image)
+    else
+      @$(".btn_close").hide()
+      @$(".image_holder").show()
+    @
+
+  onProgress: () =>
+    @$(".btn_close").hide()
+    @$(".image_holder").hide()
+    @$('.loading').show()
+
+  onFileUploaded: (id, fileName, responseJSON) =>
+    @$('.loading').hide()
+    @$(".image_holder").hide()
+    @image = responseJSON.uploader_url
+    @showImage(@image)
+    @$(".btn_close").show()
+    if @onComplete
+      @onComplete(responseJSON)
+
+  onCloseClicked: () ->
+    @$(".uploaded_picture").hide()
+    @$(".btn_close").hide()
+    @$(".image_holder").show()
+    if @onCancel
+      @onCancel()
+    return false
+
+  showImage: (image_url) ->
+    @$(".image_holder").hide()
+    @$(".uploaded_picture").attr("src", image_url)
+    @$(".uploaded_picture").show()

data/lib/assets/javascripts/socmap_adf/modules/map/init.js.coffee

@@ -0,0 +1,9 @@
+# Default requires for ADF modules
+#= require_self
+#= require_tree ./templates
+#= require_tree ./models
+#= require_tree ./views
+
+ADF.Map =
+  Models: {}
+  Views: {}

data/lib/assets/javascripts/socmap_adf/modules/map/models/custom_map.js.coffee

@@ -0,0 +1 @@
+class google.maps.CustomMap extends google.maps.Map

data/lib/assets/javascripts/socmap_adf/modules/map/models/map.js.coffee

@@ -0,0 +1,63 @@
+class ADF.Map.Models.Map extends Backbone.Model
+
+  overlays: []
+  clustered_overlays: []
+
+  maxZoomLevelForClustering: 21
+  maxZoomOnClick: 18
+
+  defaults:
+    center: new google.maps.LatLng(57,25)
+    zoom: 7
+    mapTypeId: google.maps.MapTypeId.HYBRID
+    mapTypeControl: false
+    zoomControl: true
+    zoomControlOptions:
+      style: google.maps.ZoomControlStyle.SMALL
+      position: google.maps.ControlPosition.RIGHT_TOP
+    panControl: false
+    streetViewControl: false
+
+  clusterDefaults:
+    "maxZoom": 21
+    "maxZoomOnClick": 21
+    "clusterShowType": "chart"
+
+  constructor: (options, clusterOptions) ->
+    super(options)
+    @clusterOptions = $.extend(@clusterDefaults, clusterOptions)
+    
+  initGMap: (mapElement) ->
+    @map = new google.maps.Map(document.getElementById(mapElement), @attributes)
+    @markerClusterer = new ADF.Cluster.Views.MarkerClusterer(@map, null, @clusterOptions)
+    return @map
+
+  getGMap: () ->
+    return @map
+
+  addOverlay: (overlay, clustering = false) ->
+    @overlays.push(overlay)
+    @clusterOverlay(overlay) if clustering || overlay.isClustering()
+
+  setCenter: (latLng) ->
+    @map.setCenter(latLng)
+    
+  hideZoomControl: () ->
+    @map.setOptions({zoomControl: false})
+    
+  showZoomControl: () ->
+    @map.setOptions({zoomControl: true})
+    
+  fitBounds: (bounds) ->
+    @map.fitBounds(bounds)
+
+  clearMap: () ->
+    for overlay in @overlays
+      overlay.marker.setMap(null) if overlay.marker?
+      overlay.setMap(null)
+      @markerClusterer.removeMarker(overlay) if @markerClusterer && overlay.isClustering()
+    @overlays = []
+    @markerClusterer.clearMarkers()
+
+  clusterOverlay: (overlay) ->
+    @markerClusterer.addMarker(overlay) if @markerClusterer

data/lib/assets/javascripts/socmap_adf/modules/map/templates/main.jst.eco

@@ -0,0 +1 @@
+<div id="adf_map_canvas"></div>

data/lib/assets/javascripts/socmap_adf/modules/map/templates/moving_pin.jst.eco

@@ -0,0 +1,11 @@
+<div style="position:relative;">
+<% if @label: %>
+<div class="content <%= @color %>">
+  <div class="label_block">
+    <%= @label %>
+  </div>
+  <div class="background"></div>
+</div>
+<% end %>
+<div class="new_marker"><img src="<%= @pin %>" /></div>
+</div>

data/lib/assets/javascripts/socmap_adf/modules/map/templates/tooltip.jst.eco

@@ -0,0 +1 @@
+<span></span>

data/lib/assets/javascripts/socmap_adf/modules/map/views/google_marker_clusterer.js.coffee

@@ -0,0 +1,11 @@
+class ADF.Map.Views.GoogleMarkerClusterer extends google.maps.OverlayView
+  
+  onAdd: () ->
+    @setReady_ true
+
+  draw: () ->
+
+  onRemove: () ->
+
+  constructor: (map, opt_markers, opt_options) ->
+    @map_ = map