From 1724a505b861e47b0c00ef56c8d3b192d3ecc81d Mon Sep 17 00:00:00 2001 From: JuanCarlos Date: Mon, 10 Feb 2014 13:41:32 -0600 Subject: [PATCH] agregar comentarios a places.js.coffee --- app/assets/javascripts/places.js.coffee | 134 +++++++++++++----------- 1 file changed, 72 insertions(+), 62 deletions(-) diff --git a/app/assets/javascripts/places.js.coffee b/app/assets/javascripts/places.js.coffee index 6f33b4e..3b4991e 100644 --- a/app/assets/javascripts/places.js.coffee +++ b/app/assets/javascripts/places.js.coffee @@ -1,15 +1,45 @@ -# Place all the behaviors and hooks related to the matching controller here. -# All this logic will automatically be available in application.js. -# You can use CoffeeScript in this file: http://coffeescript.org/ +# Script para controlar el comportamiento de los mapas +# y la ubicación de los puntos. unless navigator.geolocation then console.log("No geoloc") -success = (position) -> +## Init de variables "globales" para los mapas +# TODO: ¿Es posible NO utilizar el objeto window +# para salir del closure en Coffeescript y poder +# implementar Google Maps de forma más limpia? +###### +infowindow = new google.maps.InfoWindow({ + maxWidth: 300 + }) +window.markers = [] +window.infowindows = [] +window.current_points = [] +###### + +#jQuery document.ready +# +$ -> + console.log "poss" + window.map = gm_init() + load_all_points(map) + google.maps.event.addListener(map, 'dragend', moviendo_mapa) + navigator.geolocation.getCurrentPosition(loc_success, loc_error) + submit_ajax_form() + get_current_location() + +# Google Maps init script. +# Mapa localizado en el Zócalo de la Ciudad de México +gm_init = -> + gm_center = new google.maps.LatLng(19.49, -99.2033) + gm_map_type = google.maps.MapTypeId.ROADMAP + map_options = { center: gm_center, zoom: 14, mapTypeId: gm_map_type } + new google.maps.Map(@map_canvas, map_options) + +#### Browser Geolocation methods +loc_success = (position) -> console.log "position disponible" latitude = position.coords.latitude longitude = position.coords.longitude - #@map = gm_init(latitude, longitude) - #load_points(@map center = new google.maps.LatLng(latitude,longitude) console.log(latitude, longitude) @@ -20,59 +50,32 @@ success = (position) -> icon: { url: 'arrows.png' } - delete_markers(window.map) + # Clean map + clean_map(window.map) load_from_position(window.map, latitude, longitude) -error = (err) -> +loc_error = (err) -> console.log "no position disponible" - +#### /Browser Geolocation Methods -gm_init = -> - gm_center = new google.maps.LatLng(19.49, -99.2033) - gm_map_type = google.maps.MapTypeId.ROADMAP - map_options = { center: gm_center, zoom: 14, mapTypeId: gm_map_type } - new google.maps.Map(@map_canvas, map_options) - -#gm_center = (map, lat, lon) -> - - -infowindow = new google.maps.InfoWindow({ - maxWidth: 300 - }) -window.markers = [] -window.infowindows = [] -window.current_points = [] - -$ -> - console.log "poss" - window.map = gm_init() - load_points(map) - google.maps.event.addListener(map, 'dragend', moviendo_mapa) - navigator.geolocation.getCurrentPosition(success,error) - ajaxtrue() - getLocationNow() - # - -load_from_position = (map, lat, lon) -> - callback = (data) -> display_on_map(data, map) - $.get '/lugares', {latitude: lat, longitude: lon}, callback, 'json' - - -load_points = (map) -> +# '/hospitales' es un endpoint que trae todos los puntos +# en caso de que no se obtenga una posición mediante el browser +load_all_points = (map) -> callback = (data) -> display_on_map(data, map) $.get '/hospitales.json', {}, callback, 'json' + +# Obtiene puntos para desplegar en el mapa a partir +# de un endpoint. en éste caso '/lugares', sin embargo, éste +# puede cambiar dependiendo las necesidades del end-user. +load_from_position = (map, lat, lon) -> + callback_to_map = (data) -> display_on_map(data, map) + $.get '/lugares', {latitude: lat, longitude: lon}, callback_to_map, 'json' -set_marker_map = (map) -> - #indow.center_marker.setMap(map) - for marker in window.markers - console.log("marcador") - marker.setMap(map) - +# A partir de un JSON con array de objetos, genera un nuevo +# marker y adjuntar la referencia de window.map display_on_map = (data, map) -> - #console.log(map) - #console.log(data.centros[0]) set_marker_map(null) for centro in data.centros create_marker(centro, map) @@ -80,8 +83,12 @@ display_on_map = (data, map) -> console.log "total marcadores " + window.markers.length create_cards() -create_marker = (point, map) -> +set_marker_map = (map) -> + for marker in window.markers + console.log("marcador") + marker.setMap(map) +create_marker = (point, map) -> content_string = '
' + '
' + '

' + point.nombre + '

' + @@ -112,14 +119,6 @@ create_marker = (point, map) -> ) -delete_markers = (map)-> - console.log("borrando") - console.log (window.markers) - set_marker_map(null) - window.markers = [] - window.infowindows = [] - window.current_points = [] - moviendo_mapa = -> centro_pos = window.map.getCenter() distancia_centro = google.maps.geometry.spherical.computeDistanceBetween(centro_pos, window.center_marker.getPosition()); @@ -128,7 +127,7 @@ moviendo_mapa = -> #console.log window.markers create_cards() if distancia_centro > 3000 - delete_markers(window.map) + clean_map(window.map) window.center_marker.setMap(null) window.center_marker = null load_from_position(window.map, centro_pos.lat(), centro_pos.lng()) @@ -139,6 +138,16 @@ moviendo_mapa = -> url: 'arrows.png' } +clean_map = (map)-> + console.log("borrando") + console.log (window.markers) + set_marker_map(null) + window.markers = [] + window.infowindows = [] + window.current_points = [] + + + create_cards = -> $("#tarjetas div").remove() $("#tarjetas").append(card(point)) for point in window.current_points @@ -156,13 +165,14 @@ card = (point) -> telefonos_centro + hacer_cita + "
" -ajaxtrue = -> + +submit_ajax_form = -> $("#forma_busqueda").bind('ajax:success', (evt, data, status, xhr) -> - delete_markers(window.map) + clean_map(window.map) display_on_map(data, map) ) -getLocationNow = -> +get_current_location = -> mostrar_todos = -> console.log "wooo" navigator.geolocation.getCurrentPosition(success,error)