Possibly-working?

src/cljs/ireadit/core.cljs

@@ -8,6 +8,7 @@
             [markdown.core :refer [md->html]]
             [ireadit.ajax :as ajax]
             [ireadit.events]
+            [ireadit.views.form :as form]
             [secretary.core :as secretary])
   (:import goog.History))
 
@@ -34,7 +35,8 @@
      [b/Collapse {:is-open @expanded? :navbar true}
       [b/Nav {:class-name "mr-auto" :navbar true}
        [nav-link "#/" "Home" :home]
-       [nav-link "#/about" "About" :about]]]]))
+       [nav-link "#/about" "About" :about]
+       [nav-link "#/transcribe" "Transcribe" :transcribe]]]]))
 
 (defn about-page []
   [:div.container
@@ -51,7 +53,8 @@
 
 (def pages
   {:home #'home-page
-   :about #'about-page})
+   :about #'about-page
+   :transcribe #'form/form-page})
 
 (defn page []
   [:div
@@ -69,6 +72,9 @@
 (secretary/defroute "/about" []
   (rf/dispatch [:navigate :about]))
 
+(secretary/defroute "/transcribe" []
+  (rf/dispatch [:navigate :transcribe]))
+
 ;; -------------------------
 ;; History
 ;; must be called after routes have been defined

src/cljs/ireadit/events.cljs

@@ -1,9 +1,15 @@
 (ns ireadit.events
   (:require [re-frame.core :as rf]
-            [ajax.core :as ajax]))
+            [ajax.core :as ajax]
+            [cemerick.url :refer (url-encode)]))
 
 ;;dispatchers
 
+(rf/reg-event-db
+ :set-url
+ (fn [db [_ url]]
+   (assoc db :url url)))
+
 (rf/reg-event-db
   :navigate
   (fn [db [_ page]]
@@ -14,6 +20,11 @@
   (fn [db [_ docs]]
     (assoc db :docs docs)))
 
+(rf/reg-event-db
+  :set-transcription
+  (fn [db [_ transcription]]
+    (assoc db :transcription transcription)))
+
 (rf/reg-event-fx
   :fetch-docs
   (fn [_ _]
@@ -22,6 +33,27 @@
                   :response-format (ajax/raw-response-format)
                   :on-success       [:set-docs]}}))
 
+(rf/reg-event-fx
+ :fetch-transcription
+ (fn [{db :db} _]
+   (let [uri (str "http://loriner.journeyman.cc:8888/v1/tesseract/" (url-encode (:url db)))]
+     (js/console.log
+      (str
+       "Fetching transcription data: " uri))
+     {:http-xhrio {:method          :post
+                   :uri             uri
+                   :format          (ajax/json-request-format)
+                   :response-format (ajax/json-response-format {:keywords? true})
+                   :on-success      [:set-transcription]
+                   :on-failure      [:bad-transcription]}})))
+
+(rf/reg-event-fx
+  :bad-transcription
+  (fn
+    [{db :db} [_ response]]
+    ;; TODO: signal something has failed? It doesn't matter very much, unless it keeps failing.
+    (js/console.log (str "Failed to fetch transcription data" response))))
+
 (rf/reg-event-db
   :common/set-error
   (fn [db [_ error]]
@@ -43,3 +75,14 @@
   :common/error
   (fn [db _]
     (:common/error db)))
+
+(rf/reg-sub
+ :url
+  (fn [db _]
+    (:url db)))
+
+(rf/reg-sub
+  :transcription
+  (fn [db _]
+    (:transcription db)))
+

src/cljs/ireadit/views/form.cljs

@@ -0,0 +1,29 @@
+(ns ireadit.views.form
+  (:require [baking-soda.core :as b]
+            [day8.re-frame.http-fx]
+            [reagent.core :as r]
+            [re-frame.core :as rf]
+            [goog.events :as events]
+            [goog.history.EventType :as HistoryEventType]
+            [markdown.core :refer [md->html]]
+            [ireadit.ajax :as ajax]
+            [ireadit.events]
+            [secretary.core :as secretary])
+  (:import goog.History))
+
+
+(defn form-page []
+  [:div
+   [:h1 "Transcribe the text of an image"]
+   [:div.container {:id "main-container"}
+    [:div
+     [:p.widget
+      [b/Label {:for "image-url" :title "URL of the image you wish to transcribe"}"Image URL"]
+      [b/Input {:id "image-url" :type "text" :size "80"
+                :on-change #(rf/dispatch [:set-url (.-value (.-target %))])}]]
+     [:p.widget
+      [b/Label {:for "send"} "To transcribe the image"]
+      [b/Button {:id "send" :on-click #(rf/dispatch [:fetch-transcription])} "Transcribe!"]]]
+    [:div.transcription @(rf/subscribe [:transcription])]
+    ]])
+