gmaps.js.coffee in ab_admin-0.2.0

- old
+ new

@@ -1,122 +1,118 @@
 class window.GeoInput
-  constructor: (@dom_lat, @dom_lon, @dom_zoom, @options={}) ->
+  @default_lat = 55.7427928
+  @default_lon = 55.7427928
+
+  constructor: (@cont, @options={}) ->
+    @prefix = @cont.attr('id').replace(/_geo_input$/, '')
     defaults =
-      lat: 55.7427928
-      lon: 37.61540089999994
-      zoom: 12
-      doom_map: 'admin_map'
-      types: ['geocode']
-      map_options: {}
+      lat: GeoInput.default_lat
+      lon: GeoInput.default_lon
+      autocomplete: true
+
     _.defaults(@options, defaults)
-    @callback = window[@options.callback] if _.isFunction(window[@options.callback])
-    @marker_callback = window[@options.marker_callback] if _.isFunction(window[@options.marker_callback])
-    @lat_el = $('#' + @dom_lat)
-    @lon_el = $('#' + @dom_lon);
-    @zoom_el = $('#' + @dom_zoom);
 
-    @lat = parseFloat(@lat_el.val()) or @options.lat
-    @lon = parseFloat(@lon_el.val()) or @options.lon
-    @zoom = parseInt(@zoom_el.val(), 10) or @options.zoom
-    @lat_lon = new google.maps.LatLng(@lat, @lon)
-    @initGMap()
+    @initElements()
+    @initPoint()
+    @initMap()
     @initMarker()
+    @initHandlers()
+    @initAutocomplete() if @options.autocomplete
 
-  initGMap: ->
-    map_options =
-      zoom: @zoom,
-      center: @lat_lon,
-      mapTypeId: google.maps.MapTypeId.ROADMAP
-#      scrollwheel: false
-    _.defaults(@options.map_options, map_options)
-    @map = new google.maps.Map(document.getElementById(@options.doom_map), @options.map_options)
+  initElements: ->
+    for el in ['lat', 'lon', 'map', 'zoom', 'geo_ac']
+      @options["#{el}_id"] ||= "#{@prefix}_#{el}"
+      this["#{el}_el"] = $("##{@options["#{el}_id"]}")
 
-    google.maps.event.addListener @map, 'zoom_changed', =>
-      @zoom_el.val(@map.getZoom())
+  initPoint: ->
+    @lat = parseFloat(@lat_el.val()) or @options.lat
+    @lon = parseFloat(@lon_el.val()) or @options.lon
+    @zoom = parseInt(@zoom_el.val(), 10) or 12
+    @point = new google.maps.LatLng(@lat, @lon)
 
-  setInputs: (pos) ->
-    @lat_el.val(pos.lat())
-    @lon_el.val(pos.lng())
-    @zoom_el.val(@map.getZoom())
+  initHandlers: ->
+    @cont.bind 'geo_input:zoom_changed', (e) =>
+      @zoom_el.val(e.zoom)
 
-  initMarker: ->
-    marker_options =
-      position: @lat_lon,
-      map: @map,
-      draggable: true
+    @cont.bind 'geo_input:dragend', (e) =>
+      @map.setCenter(e.point)
+      @setInputs(e.point)
 
-    @marker = new google.maps.Marker(marker_options)
-    @infowindow = new google.maps.InfoWindow()
+    @cont.bind 'geo_input:place_changed', (e) =>
+      @setPlace(e.place)
 
-    google.maps.event.addListener @marker, 'dragend', (event) =>
-      @marker_callback.call(this, event.latLng) if @marker_callback
-      @map.setCenter(event.latLng)
-      pos = @marker.getPosition()
-      @setInputs(pos)
-
-  initAutocomplete: (dom_input='geo_autocomplete') ->
-    input = document.getElementById(dom_input)
-    opts =
-      types: @options.types
-      language: I18n.locale
-#      componentRestrictions: {country: 'ru'}
-    opts.types = @typesByPrefix() if @options.prefix
-#    log opts
-    autocomplete = new google.maps.places.Autocomplete(input, opts)
-    autocomplete.bindTo('bounds', @map)
-    google.maps.event.addListener autocomplete, 'place_changed', =>
-      place = autocomplete.getPlace()
-      @callback.call(this, place) if @callback
-      @setPlace(place)
-
-    $('#'+ dom_input).live "keypress", (e) ->
+    @geo_ac_el.keypress (e) ->
       e.preventDefault() if e.keyCode == 13
 
   setPlace: (place) =>
     return unless place.geometry
-    pos = place.geometry.location
+    point = place.geometry.location
     if place.geometry.viewport
       @map.fitBounds(place.geometry.viewport)
     else
-      @map.setCenter(pos)
+      @map.setCenter(point)
       @map.setZoom(17)
 
-    @marker.setPosition(pos)
-    @setInputs(pos)
+    @marker.setPosition(point)
+    @setInputs(point)
 
+  setInputs: (point) ->
+    @lat_el.val(point.lat())
+    @lon_el.val(point.lng())
+    @zoom_el.val(@map.getZoom())
 
-  typesByPrefix: ->
-    if _.include(['region', 'district', 'sub_district'], @options.prefix)
-      ['(regions)']
-    else if _.include(['location'], @options.prefix)
-      ['(cities)']
-    else
-      ['geocode']
+  initMap: ->
+    map_defaults =
+      zoom: @zoom,
+      center: @point,
+      mapTypeId: google.maps.MapTypeId.ROADMAP
+      scrollwheel: false
 
-  initAutocompleteCustom: (dom_input='geo_autocomplete') ->
-    input = document.getElementById(dom_input)
-    opts =
+    @options.map_options ||= {}
+    _.defaults(@options.map_options, map_defaults)
+    @map = new google.maps.Map(@map_el[0], @options.map_options)
+
+    google.maps.event.addListener @map, 'zoom_changed', =>
+      @cont.trigger
+        type: 'geo_input:zoom_changed'
+        zoom: @map.getZoom()
+
+  initMarker: ->
+    marker_defaults =
+      position: @point,
+      map: @map,
+      draggable: true
+
+    @options.marker_options ||= {}
+    _.defaults(@options.marker_options, marker_defaults)
+
+    @marker = new google.maps.Marker(@options.marker_options)
+    @infowindow = new google.maps.InfoWindow()
+
+    google.maps.event.addListener @marker, 'dragend', (e) =>
+      @cont.trigger
+        type: 'geo_input:dragend'
+        point: e.latLng
+
+  initAutocomplete: ->
+    geo_ac_defaults =
+      language: I18n.locale
       types: ['geocode']
-#      componentRestrictions: {country: 'ru'}
-    autocomplete = new google.maps.places.Autocomplete(input, opts)
+
+    @options.geo_ac_options ||= {}
+    _.defaults(@options.geo_ac_options, geo_ac_defaults)
+    autocomplete = new google.maps.places.Autocomplete(@geo_ac_el[0], @options.geo_ac_options)
     autocomplete.bindTo('bounds', @map)
     google.maps.event.addListener autocomplete, 'place_changed', =>
-      place = autocomplete.getPlace()
-      @callback.call(this, place) if @callback
-      return unless place.geometry
-      pos = place.geometry.location
-      if place.geometry.viewport
-        @map.fitBounds(place.geometry.viewport)
-      else
-        @map.setCenter(pos)
-        @map.setZoom(17)
+      @cont.trigger
+        type: 'geo_input:place_changed'
+        place: autocomplete.getPlace()
 
-      @marker.setPosition(pos)
-      @setInputs(pos)
+$.fn.geoInput = (options) ->
+  $el = $(this)
+  $el.data('geoInput') or $el.data('geoInput', new GeoInput($el, options))
 
-    $('#'+ dom_input).live "keypress", (e) ->
-      e.preventDefault() if e.keyCode == 13
 
 window.codeLatLng = (lat, lng, callback = null) ->
   window.geocoder ||= new google.maps.Geocoder()
   lat = parseFloat(lat)
   lng = parseFloat(lng)
@@ -142,6 +138,39 @@
 window.getPlaceComponent = (place, component) ->
   res = _.filter place.address_components, (el) ->
     _.include(el.types, component)
   res[0]
 
+
+
+#  typesByPrefix: ->
+#    if _.include(['region', 'district', 'sub_district'], @options.prefix)
+#      ['(regions)']
+#    else if _.include(['location'], @options.prefix)
+#      ['(cities)']
+#    else
+#      ['geocode']
+
+#  initAutocompleteCustom: (dom_input='geo_autocomplete') ->
+#    input = document.getElementById(dom_input)
+#    opts =
+#      types: ['geocode']
+##      componentRestrictions: {country: 'ru'}
+#    autocomplete = new google.maps.places.Autocomplete(input, opts)
+#    autocomplete.bindTo('bounds', @map)
+#    google.maps.event.addListener autocomplete, 'place_changed', =>
+#      place = autocomplete.getPlace()
+#      @callback.call(this, place) if @callback
+#      return unless place.geometry
+#      pos = place.geometry.location
+#      if place.geometry.viewport
+#        @map.fitBounds(place.geometry.viewport)
+#      else
+#        @map.setCenter(pos)
+#        @map.setZoom(17)
+#
+#      @marker.setPosition(pos)
+#      @setInputs(pos)
+#
+#    $('#'+ dom_input).live "keypress", (e) ->
+#      e.preventDefault() if e.keyCode == 13
 