    #_[signature-component]
 
    [:div
-   (input "first name" :text :person.first-name)
-   [:div.row
-    [:div.col-md-2]
-    [:div.col-md-5
-     [:div.alert.alert-danger
-      {:field :alert :id :errors.first-name}]]]
-
-   (input "last name" :text :person.last-name)
-   [:div.row
-    [:div.col-md-2]
-    [:div.col-md-5
-     [:div.alert.alert-success
-      {:field :alert :id :person.last-name :event empty?}
-      "last name is empty!"]]]
-
-   [:div.form-group
-    [:label "age"]
-    [:select.form-control {:field :list :id :person.age}
-     [:option {:key :17-} "17-"]
-     [:option {:key :18-24} "18-24"]
-     [:option {:key :25-29} "25-29"]
-     [:option {:key :30-34} "30-34"]
-     [:option {:key :35-39} "35-39"]
-     [:option {:key :40-44} "40-44"]
-     [:option {:key :45-49} "45-49"]
-     [:option {:key :50-54} "50-54"]
-     [:option {:key :55-59} "55-59"]
-     [:option {:key :60-64} "60-64"]
-     [:option {:key :65-69} "65-69"]
-     [:option {:key :70-74} "70-74"]
-     [:option {:key :75-79} "75-79"]
-     [:option {:key :80-84} "80-84"]
-     [:option {:key :85+} "85+"]]]
-
-   (input "email" :email :person.email)
-   [:div.row
-    [:div.col-md-2]
-    [:div.col-md-5
-     [:div.alert.alert-danger
-      {:field :alert :id :errors.email :event empty?}
-      "email is empty!"]]]
+    (input "first name" :text :person.first-name)
+    [:div.row
+     [:div.col-md-2]
+     [:div.col-md-5
+      [:div.alert.alert-danger
+       {:field :alert :id :errors.first-name}]]]
+
+    (input "last name" :text :person.last-name)
+    [:div.row
+     [:div.col-md-2]
+     [:div.col-md-5
+      [:div.alert.alert-success
+       {:field :alert :id :person.last-name :event empty?}
+       "last name is empty!"]]]
+
+    [:div.form-group
+     [:label "age"]
+     [:select.form-control {:field :list :id :person.age}
+      (for [a age-groups]
+        [:option {:value a :key a} (name a)])]]
+
+    (input "email" :email :person.email)
+    [:div.row
+     [:div.col-md-2]
+     [:div.col-md-5
+      [:div.alert.alert-danger
+       {:field :alert :id :errors.email :event empty?}
+       "email is empty!"]]]
 
     (radios-yes-no
      "I want to get noticed about my supported ideas progress."

(ns geoforms.forms
  (:require [json-html.core :refer [edn->hiccup]]
            [reagent.core :as reagent :refer [atom]]
            [reagent-forms.core :refer [bind-fields init-field value-of]]))


;; Example taken from https://github.com/reagent-project/reagent-forms/tree/master/forms-example


;;; DATA

;; should be in firebase

(defonce app-cms
  (atom
   {:title "Support local ideas!"
    :subtitle ""
    :instructions-district "1. Choose your district"
    :instructions-vote     "2. Check ideas you want to support!"
    :instructions-add      "3. Add your won ideas"
    :instructions-sign     "4. Sign your choices"}))

(def app-ideas
  (atom
   [{:id "i-1"
     :timestamp "2013-08-10 11:20:22"
     :districts ["Brooklyn"]
     :idea "New skatepark"
     :desc "Would be really nice to have a new skatepark"
     :links ["http://lapresse.ca/article-2"]
     :supporters [""]
     :category "Other..."}
    {:id "i-2"
     :timestamp "2013-08-10 11:20:24"
     :districts ["Manhattan"]
     :idea "More police to prevent steeling"
     :desc ""
     :links ["http://lapresse.ca/article-1"]
     :supporters [""]
     :category "Security"}
    {:id "i-3"
     :timestamp "2013-08-10 11:20:26"
     :districts ["Manhattan"]
     :idea "Create a park near fifth avenue"
     :desc "Would be awesome to have a park on broadway near fith avenue."
     :links ["http://lapresse.ca/article-56"]
     :supporters ["email@email.com" "email2@email.com" "john@hotmail.com"]
     :category "Green"}]))

(def app-users
  (atom
   [{:created "2013-08-10 11:20:22"
     :fullname "Leon Talbot"
     :email "email@email.com"
     :zip-code "G21 2C5" ;; this is canadian zip code.
     :age "32"
     :annual-revenue ""
     :subscribe-idea-alerts true
     :subscribe-volonteer-idea-alerts false
     :subscribe-district-alerts true
     :comments ""}
    {:created "2013-08-10 11:20:22"
     :fullname "John Talbot"
     :email "john@hotmail.com"
     :zip-code "G21 2C3"
     :age "33"
     :annual-revenue ""
     :subscribe-idea-alerts true
     :subscribe-volonteer-idea-alerts false
     :subscribe-district-alerts true
     :comments ""}
    {:created "2013-08-10 11:20:22"
     :fullname "Marc Talbot"
     :email "email2@email.com"
     :zip-code "G21 2C2"
     :age "34"
     :annual-revenue ""
     :subscribe-idea-alerts true
     :subscribe-volonteer-idea-alerts false
     :subscribe-district-alerts true
     :comments "better UX please. Thanks."}]))

(def app-cats
  (atom
   ["Shops" "Security" "Green" "Other..."]))

(def app-districts
  (atom ["Manhattan" "Brooklyn" "Queens" "Other districts"]))


;;; STATE

(def app-state
  (atom
   {:selected-districts @app-districts
    :added-ideas nil
    :added-user  nil}))


;;; FNS

(defn row [label input]
  [:div.row

       [bind-fields
        form-template
        doc
        (fn [document])
        (fn [document])]

       [:button.btn.btn-default
        {:on-click #(and (validate! doc)
                         (submit! doc))}
        "Submit"]])))
