droom 0.0.1

data/app/assets/javascripts/droom/map.js.coffee

@@ -0,0 +1,123 @@
+jQuery ($) ->
+  $.infowindows = []
+  
+  class Map
+    constructor: (element) ->
+      @container = $(element)
+      lat = @container.attr('data-lat') || 22.280147
+      lng = @container.attr('data-lng') || 114.158302
+      zoom = @container.attr('data-zoom') || 12
+      @map = new google.maps.Map element,
+        center: new google.maps.LatLng lat, lng
+        zoom: parseInt(zoom)
+        mapTypeId: google.maps.MapTypeId.ROADMAP
+        mapTypeControlOptions: 
+          style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
+
+    getMap: () =>
+      @map  
+  
+  class Point
+    constructor: (point, map) ->
+      @_lat = point.lat
+      @_lng = point.lng
+      @_map = map
+      @_events = point.events
+      @_postcode = point.postcode      
+      @id = point.id
+      @_name = point.name
+      @_address = point.address
+      @_editable = $.ed
+      @_marker = new google.maps.Marker
+        position: new google.maps.LatLng @_lat, @_lng
+        map: @_map
+        icon: $.set_icon(@_events.length)
+        draggable: $.map_editable
+      @infowindow()
+      google.maps.event.addListener @_marker, "click", @click
+      google.maps.event.addListener @_marker, "dragstart", @dragstart
+      google.maps.event.addListener @_marker, "dragend", @dragend
+      @_infowindow.open(@_map) if parseInt($.urlParam("id"), 10) == @id
+      
+      
+    infowindow: () =>
+      content = $("<div class='window'><h2>#{@_name}</h2>#{@_address.replace(/\n/g, ",")}<div class='window_venue_events'></div></div>")
+      $.each @_events, (i, evt) =>
+        content.find('.window_venue_events').append "<li><a href='/events/#{evt.id}'>#{evt.name}</a> <span class='pale'>#{evt.datestring}</span></li>"
+      @_infowindow = new google.maps.InfoWindow
+        position: new google.maps.LatLng @_lat, @_lng
+        content: content.prop('outerHTML')
+        marker: @_marker
+      $.infowindows.push @_infowindow
+
+    click: (e) =>
+      $.each $.infowindows, (i, iw) =>
+        iw.close()
+      @_infowindow.open(@_map)
+      
+    dragstart: (e) =>
+      @_infowindow?.close()
+
+    dragend: (e) =>
+      position = @_marker.getPosition()
+      $.ajax 
+        type: 'POST'
+        url: "/venues/#{@id}",
+        data: 
+          _method: "PUT"
+          venue:
+            lat: position.lat()
+            lng: position.lng()
+        dataType: 'json'
+        success: () ->
+          console.log "venue updated"
+        
+
+  $.fn.init_map = () ->
+    @each ->
+      $.gmap = new Map(@).getMap()
+      $.map_editable = $(@).hasClass('editable')
+      if $(@).hasClass('small')
+        $(@).show_venue()
+      else
+        $(@).show_venues()
+  
+  $.fn.show_venues = () ->
+    @each ->
+      map = $.gmap
+      if src = $(@).attr("data-url")
+        $.getJSON src, (response) =>
+          bounds = new google.maps.LatLngBounds()
+          $.each response, (i, venue) =>
+            latlng = new google.maps.LatLng venue.lat, venue.lng
+            bounds.extend latlng
+            venue = new Point venue, map
+          
+          temporary_zoom_limiter = google.maps.event.addListener map, 'bounds_changed', ->
+            map.setZoom(17) if map.getZoom() > 17
+            google.maps.event.removeListener(temporary_zoom_limiter);
+
+          map.fitBounds bounds
+
+  $.fn.show_venue = () ->
+    @each ->
+      map = $.gmap
+      if src = $(@).attr("data-url")
+        $.getJSON src, (venue) =>
+          latlng = new google.maps.LatLng venue.lat, venue.lng
+          marker = new google.maps.Marker
+            position: latlng
+            map: map
+            icon: $.set_icon(venue.events.length)
+          map.setCenter(latlng)
+
+
+  $.urlParam = (name) ->
+    results = new RegExp("[\\?&]" + name + "=([^&#]*)").exec(window.location.href)
+    return 0  unless results
+    results[1] or 0
+
+  $.set_icon = (size) ->
+    name = if size > 0 then "place_busy" else "place_quiet"
+    new google.maps.MarkerImage "/assets/droom/#{name}.png", new google.maps.Size(36, 36), new google.maps.Point(0, 0), new google.maps.Point(18, 18)
+  

data/app/assets/javascripts/droom/sort.js.coffee

@@ -0,0 +1,126 @@
+jQuery ($) ->
+  $.headers = []
+  
+  $.params = (name) ->
+    decodeURIComponent $.urlParam(name)
+    
+  class TableSort
+    constructor: (element, options) ->
+      @order = options.order
+      @sort = options.sort
+      @table = $(element)
+      @body = @table.find('tbody')
+      @_original_content = @body.children()
+      @sort = $.params("sort")
+      @order = $.params("order")
+      @headers = @table.find('th a.sorter')
+      $.each @headers, (i, header) =>
+        header = new SortLink header, @
+        $.headers.push header
+      @activate()
+      @table.bind "refresh", @update
+      if Modernizr.history
+        $(window).bind 'popstate', @restoreState
+    
+    resort: (sort, order) =>
+      sort ?= "name"
+      order ?= "ASC"
+      @sort = sort
+      @order = order
+      @get("/documents.js?sort=#{sort}&order=#{order}")
+    
+    update: () =>
+      @body.fadeTo('fast', 0.2)
+      $.ajax
+        url: "/documents.js?sort=#{@sort}&order=#{@order}"
+        dataType: "html"
+        success: @display
+
+    get: (url) =>
+      @body.fadeTo('fast', 0.2)
+      $.ajax
+        url: (url)
+        dataType: "html"
+        success: @refresh
+
+    refresh: (data, textStatus, jqXHR) =>
+      @clear()
+      @saveState(data) if Modernizr.history
+      @display(data)
+      
+    display: (data) =>
+      replacement = $(data)
+      @body.after(replacement)
+      @body.remove()
+      @body = replacement
+      @body.fadeTo('fast', 1)
+      @body.activate()
+      @activate()
+
+    activate: () =>
+      @body.find('a.popup').popup_remote_content()
+      @body.find('.pagination').find('a').retable(@)
+      @body.refresher()
+      
+    clear: () =>
+      @body.children().remove()
+      
+    saveState: (results) =>
+      url = window.location.pathname + '?sort=' + encodeURIComponent(@sort) + '&order=' + encodeURIComponent(@order)
+      state = 
+        html: results
+        sort: @sort
+        order: @order
+      history.pushState state, "New page title", url
+
+    restoreState: (e) =>
+      event = e.originalEvent
+      if event.state? && event.state.html?
+        @clear()
+        @order = event.state.order
+        @sort = event.state.sort
+        @display(event.state.html)
+        $.each $.headers, (i, header) =>
+          header.check()
+        
+
+  class SortLink
+    constructor: (element, table) ->
+      @table = table
+      @_link = $(element)
+      @_sort = @_link.attr("data-sort")
+      @_link.bind "click", @click
+      @check()
+      @_order = @_link.attr("data-order")
+      
+    check: () =>
+      if @table.sort == @_sort
+        @table.headers.removeAttr('data-order')
+        @_link.attr("data-order", @table.order)
+      
+    click: (e) =>
+      e.preventDefault()
+      @table.headers.removeAttr('data-order')
+      if @_order == "ASC"
+        @_link.attr('data-order', 'DESC')
+        @_order = "DESC"
+      else
+        @_link.attr('data-order', 'ASC')
+        @_order = "ASC"
+      @table.resort(@_sort, @_order)
+      
+
+  $.fn.table_sort = (options) ->
+    @each ->
+      new TableSort @, options
+    @
+
+  $.fn.retable = (table) ->
+    @click (e) ->
+      e.preventDefault() if e
+      url = $(@).attr('href')
+      table.get(url)
+    @
+
+
+

data/app/assets/javascripts/droom/suggester.js.coffee

@@ -0,0 +1,230 @@
+jQuery ($) ->
+
+  #    The Suggester is a polymorphic suggestion engine able to support any number of object types
+  #    without really knowing what they are.
+  #    
+  #    * calling
+  #    * data structure
+  #    * object types
+  #  
+  $.fn.suggestible = (options) ->
+    options = $.extend(
+      submit_form: true
+      threshold: 3
+    , options)
+    @each ->
+      new Suggester(@, options)
+    @
+
+  $.fn.venue_picker = (options) ->
+    options = $.extend(
+      submit_form: true
+      threshold: 1
+      type: 'venue'
+    , options)
+    @each ->
+      new Suggester(@, options)
+    @
+
+  $.fn.person_picker = (options) ->
+    options = $.extend(
+      submit_form: true
+      threshold: 1
+      type: 'person'
+    , options)
+    @each ->
+      target = $(@).siblings('.person_picker_target')
+      $(@).bind "keyup", () =>
+        target.val null
+      suggester = new Suggester(@, options)
+      suggester.options.afterSelect = () ->
+        id = JSON.parse(suggester.request.responseText)[0].id
+        target.val id
+        suggester.form.submit()
+    @
+
+  $.fn.group_picker = (options) ->
+    options = $.extend(
+      submit_form: true
+      threshold: 1
+      type: 'group'
+    , options)
+    @each ->
+      target = $(@).siblings('.group_picker_target')
+      $(@).bind "keyup", () =>
+        target.val null
+      suggester = new Suggester(@, options)
+      suggester.options.afterSelect = () ->
+        id = JSON.parse(suggester.request.responseText)[0].id
+        target.val id
+        suggester.form.submit()
+    @
+
+
+  class Suggester
+    constructor: (element, options) ->
+      @prompt = $(element)
+      @type = @prompt.attr('data-type')
+      @form = @prompt.parents("form")
+      if options.type
+        @url = "/suggestions/#{options.type}"
+      else
+        @url = "/suggestions"
+      @options = $.extend(
+        url: @url
+        fill_field: true
+        empty_field: false
+        submit_form: false
+        threshold: 2
+        afterSuggest: null
+        afterSelect: null
+      , options)
+      @container = $("<ul class=\"suggestions\"></ul>").insertAfter(@prompt)
+      @button = @form.find("a.search")
+      @previously = null
+      @request = null
+      @visible = false
+      @suggestions = []
+      @suggestion = null
+      @cache = {}
+      @blanks = []
+      
+      @prompt.keyup @key
+      @form.submit @hide
+      @
+      
+    place: () =>
+      @container.css
+        top: @prompt.position().top + @prompt.outerHeight() - 2
+        left: @prompt.position().left
+        width: @prompt.outerWidth() - 2
+
+    reset: () =>
+      @container.empty()
+      @suggestions = []
+      @suggestion = null
+
+    pend: () =>
+      @place()
+      @reset()
+      @button.addClass "waiting"
+
+    get: (e) =>
+      @pend()
+      query = @prompt.val()
+      if query.length >= @options.threshold and query isnt @previously
+        if @cache[query]
+          @suggest @cache[query]
+        else if @previously_blank(query)
+          @suggest []
+        else
+          @request.abort()  if @request
+          @request = $.getJSON(@options.url, "term=" + encodeURIComponent(query), (suggestions) =>
+            @cache[query] = suggestions
+            @blanks.push query  if suggestions.length is 0
+            @suggest suggestions
+          )
+      else
+        @hide()
+
+    suggest: (suggestions) =>
+      @button.removeClass "waiting"
+      @show()
+      if suggestions.length > 0
+        $.each suggestions, (i, suggestion) =>
+          link = $("<a href=\"#\">#{suggestion.text}</a>")
+          link.hover () =>
+            @hover(link)
+            link.click (e) =>
+              @select(e, link)
+          $("<li></li>").addClass(suggestion.type).append(link).appendTo @container
+
+        @suggestions = @container.find("a")
+      else
+        @hide()
+      @options.afterSuggest.call @, suggestions  if @options.afterSuggest
+
+    select: (e, selection) =>
+      e.preventDefault()  if e
+      selection ?= $(@suggestions.get(@suggestion))
+      value = selection.text()
+      if @options.fill_field
+        @prompt.val value
+      else @prompt.val ""  if @options.empty_field
+      @form.submit()  if @options.submit_form
+      @options.afterSelect.call @, value  if @options.afterSelect
+      @hide()
+
+    show: () =>
+      unless @visible
+        @container.fadeIn "slow"
+        @visible = true
+
+    hide: () =>
+      if @visible
+        @container.fadeOut "fast"
+        @visible = false
+
+    key: (e) =>
+      key_code = e.which
+      if @movement(key_code)
+        @show() if @suggestions.length > 0
+        if @visible
+          @movement(key_code).call @, e
+          e.preventDefault()
+          e.stopPropagation()
+      else
+        @get e
+
+    movement: (key_code) =>
+      switch key_code
+        when 27 # escape
+          @hide
+        when 33 # page up
+          @first
+        when 38 # up
+          @previous
+        when 40 # down
+          @next
+        when 33 # page down
+          @last
+        when 9 # tab
+          @next
+        when 13 # enter
+          @select
+
+    next: (e) =>
+      if @suggestion is null or @suggestion >= @suggestions.length - 1
+        @first()
+      else
+        @highlight @suggestion + 1
+
+    previous: (e) =>
+      if @suggestion <= 0
+        @last()
+      else
+        @highlight @suggestion - 1
+
+    first: (e) =>
+      @highlight 0
+
+    last: (e) =>
+      @highlight @suggestions.length - 1
+
+    hover: (link) =>
+      @highlight @suggestions.index(link) # this will be the hovered link
+
+    highlight: (i) =>
+      @unHighlight @suggestion  if @suggestion isnt null
+      $(@suggestions.get(i)).addClass "hover"
+      @suggestion = i
+
+    unHighlight: (i) =>
+      $(@suggestions.get(i)).removeClass "hover"
+      @suggestion = null
+
+    previously_blank: (query) =>
+      if @blanks.length > 0
+        blank_re = new RegExp("(" + @blanks.join("|") + ")")
+        return blank_re.test(query)
+      false