autocomplete.cljs

(defcomponentk address-field
  "The address field uses Google Places autocomplete
   internally. Autocomplete has some issues with onChange and onBlur;
   after clicking one of the options in the dropdown (instead of
   tabbing away), the field won't update until after onBlur has
   fired.

    This component gets around that issue by waiting until the
   `place_changed` event is fired by the Autocomplete widget, and only
   then reading the value of the original input component.

   It works fine; these notes are more for help when tweaking the code
   later."
  [[:data errors default-value] owner state]
  (did-mount [_]
    
            ;; om-bootstrap sets a ref of "input" automatically.
             (let [input (om/get-node owner "input")
                   ac (m/autocomplete input #js {:types #js ["geocode"]})
                   c (m/place-changed-chan ac)]
               (go-loop []
                 (a/<! c)
                 (a/>! (:out @state) (.-value input))
                 (recur))))
  (render
   [_] (i/input {:type "text"
                 :addon-before (i/glyph "map-marker")
                 :label "Your Address:"
                 :default-value default-value
                 :on-blur (fn [e]
                            (let [s (.. e -target -value)]
                              (put! (:out @state) s)))
                 :bs-style (when errors "error")
                 :help (first errors)
                 :label-classname "col-sm-3"
                 :wrapper-classname "col-sm-5"})))