             (dom/i
               #js {:className "glyphicon glyphicon-calendar"})))))))
 
-(defn render-state
+(defn validation-summary
   [for-state]
+  (let [summary-errors (summary-errors for-state)]
+    (dom/div
+      #js {:className
+           (str "alert entry-form-errors"
+                (if (active-errors for-state) " alert-danger" " alert-success")
+                (when summary-errors " entry-form-errors-has-errors"))}
+      "There is a problem with one or more fields in the form, please correct them:"
+      (dom/ul
+        #js {:className "entry-form-errors-list-container"}
+        (map #(-> (dom/li #js {:key (get % 0)}
+                          (dom/strong nil (get % 0))
+                          (str " "(get % 1))))
+             summary-errors)))))
+
+(defn time-input [id value on-change]
+  (dom/input
+    #js {:id id
+         :className "form-control time-entry-input"
+         :type "text"
+         :name id
+         :value value
+         :size "5"
+         :maxLength "5"
+         :autoComplete "off"
+         :placeholder "Time"
+         :onFocus #(.. % -target select)
+         :onChange #(on-change (.. % -target -value))
+         :onBlur #(on-change (expand-time (.. % -target -value)))
+         :onKeyDown #(when (= (.-keyCode %) 13)
+                       (on-change (expand-time (.. % -target -value))))}))
+
+(defn date-time-entry-row [for-state]
+  (let [{:keys [input-entry
+                dispatch!
+                ]} for-state
+        {:keys [startTime endTime selected-date comment isBillable
+                formWasSubmitted submit-time-state selected-item
+                entry-id]} input-entry
+        {:keys [project-id task-id]} selected-item
+        editing? (integer? (parse-float entry-id))
+        failed-fields (into {} (active-errors for-state))
+        start-time-error? (failed-fields "Start time")
+        end-time-error? (failed-fields "End time")
+        on-change-start-time (fn [start-time]
+                               (dispatch! {:action :change-start-time
+                                           :start-time start-time}))
+        on-change-end-time (fn [end-time]
+                             (dispatch! {:action :change-end-time
+                                         :end-time end-time}))
+        time-errors? (or start-time-error? end-time-error?)]
+    (dom/div
+      #js {:className "form-group"}
+      (dom/label
+        #js {:className "control-label col-md-2"}
+        "Date:")
+      (dom/div
+        #js {:className "col-md-10"}
+        (dom/div
+          #js {:className "form-inline form-inline-no-horz-margin"}
+          (dom/div
+            #js {:className "form-group"}
+            (om/build datepicker
+                      {:input-name "for-date"
+                       :selected-date selected-date
+                       :onChangeDate #(dispatch!
+                                        (actions/change-entry-page-date %))}))
+          " "
+          (dom/div
+            #js {:className (str "form-group"
+                                 (when start-time-error?  " has-error"))}
+            (dom/label #js {:htmlFor "start-time"} "From:")
+            " "
+            (time-input "start-time" startTime on-change-start-time))
+          " "
+          (dom/div
+            #js {:className (str "form-group"
+                                 (when end-time-error? " has-error"))}
+            (dom/label #js {:htmlFor "end-time"} "To:")
+            " "
+            (time-input "end-time" endTime on-change-end-time))
+          " "
+          (dom/div #js {:className "form-group help-block"} "Use format 13:37")
+          (dom/div
+            #js {:className (when time-errors? "has-error")}
+            (dom/span
+              #js {:className "help-block entry-forms-errors-date-time-errors"}
+              (when start-time-error?
+                (dom/span nil (str "Start time: " start-time-error?)
+                          (dom/br nil)))
+              (when end-time-error?
+                (dom/span nil (str "End time: " end-time-error?))))))))))
+
+(defn comment-row [for-state]
+  (let [{:keys [input-entry
+                dispatch!]} for-state
+        {:keys [comment]} input-entry]
+
+    (dom/div
+      #js {:className "form-group"}
+      (dom/label
+        #js {:className "col-md-2 control-label"
+             :htmlFor "opmerking"}
+        "Comment:")
+      (dom/div
+        #js {:className "col-md-10"}
+        (dom/input
+          #js {:type "text"
+               :name "comment"
+               :value comment
+               :onChange #(dispatch! {:action :change-comment
+                                      :comment (.. % -target -value)})
+               :id "comment"
+               :className "form-control"})
+        (dom/span
+          #js {:className "help-block"}
+          "Provide any details that can help the customer understand what you've worked on.")))))
+
+(defn billable?-row [for-state]
+  (let [{:keys [input-entry
+                dispatch!]} for-state
+        {:keys [isBillable]} input-entry]
+    (dom/div
+      #js {:className "form-group"}
+      (dom/div
+        #js {:className "col-md-offset-2 col-md-10"}
+        (dom/div
+          #js {:className "checkbox"}
+          nil
+          (dom/label
+            nil
+            (dom/input
+              #js {:type "checkbox"
+                   :id "billable"
+                   :name "billable?"
+                   :checked isBillable
+                   :onChange #(dispatch! {:action :change-billable?
+                                          :billable? (.. % -target -checked)})})
+            "This entry is billable"))))))
+
+(defn btn-row [for-state]
   (let [{:keys [input-entry
                 dispatch!
                 ]} for-state

                                            :autoclose true })
          (.. $input-element datepicker
              (on "changeDate"
                  #((or (:onChangeDate data)
                        identity) %)))
          (. $show-btn on "click" #(.datepicker $input-element "show"))))

      om/IWillUnmount

    [alibi.entry-page-state :as state :refer [validate-form]]))

(defn parse-float [v] (js/parseFloat v))

(defn active-errors
  [for-state]
  (let [{:keys [input-entry]} for-state
        {:keys [formWasSubmitted]} input-entry]
    (seq (when formWasSubmitted
           (validate-form input-entry)))))

(defn summary-errors
  [for-state]
  (let [{:keys [input-entry]} for-state
        {:keys [formWasSubmitted submit-time-state]} input-entry]
    (seq (when formWasSubmitted
           (validate-form submit-time-state)))))

(defn on-form-submit [entry on-error event]
  (log "submit")
