-
- I Read It is loading
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+ I Read It is loading
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
{% style "/assets/bootstrap/css/bootstrap.min.css" %}
diff --git a/src/cljs/ireadit/events.cljs b/src/cljs/ireadit/events.cljs
index 211fdfc..0a28266 100644
--- a/src/cljs/ireadit/events.cljs
+++ b/src/cljs/ireadit/events.cljs
@@ -20,12 +20,6 @@
(fn [db [_ docs]]
(assoc db :docs docs)))
-(rf/reg-event-db
- :set-transcription
- (fn [db [_ response]]
- (js/console.log (str "Failed to fetch transcription data" response))
- (assoc db :transcription response)))
-
(rf/reg-event-fx
:fetch-docs
(fn [_ _]
@@ -47,7 +41,13 @@
:response-format (ajax/json-response-format)
:on-success [:set-transcription]
:on-failure [:bad-transcription]}
- :db (dissoc (dissoc db :transcription) :common/error)})))
+ :db (assoc (dissoc (dissoc db :transcription) :common/error) :pending true)})))
+
+(rf/reg-event-db
+ :set-transcription
+ (fn [db [_ response]]
+ (js/console.log (str "Failed to fetch transcription data" response))
+ (dissoc (assoc db :transcription response) :pending)))
(rf/reg-event-fx
:bad-transcription
@@ -55,7 +55,7 @@
[{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))
- (assoc db :common/error response)))
+ (dissoc (assoc db :common/error response) :pending)))
(rf/reg-event-db
:common/set-error
@@ -89,3 +89,8 @@
(fn [db _]
(:transcription db)))
+(rf/reg-sub
+ :pending
+ (fn [db _]
+ (:pending db)))
+
diff --git a/src/cljs/ireadit/views/form.cljs b/src/cljs/ireadit/views/form.cljs
index d1476f6..c68e0a8 100644
--- a/src/cljs/ireadit/views/form.cljs
+++ b/src/cljs/ireadit/views/form.cljs
@@ -11,6 +11,12 @@
[secretary.core :as secretary])
(:import goog.History))
+(defn maybe-disable [m]
+ (if
+ @(rf/subscribe [:pending])
+ (assoc m :disabled "disabled")
+ m))
+
(defn form-page []
[:div.container-fluid {:id "main-container"}
@@ -21,17 +27,18 @@
[b/Label {:for "image-url" :title "URL of the image you wish to transcribe"}"Image URL"]]
[:div.col-sm-9
[b/Input {:id "image-url" :type "text" :size "80"
- :on-change #(rf/dispatch [:set-url (.-value (.-target %))])}]]]
+ :on-change #(rf/dispatch [:set-url (.-value (.-target %))])
+ }]]]
[b/Row
[:div.col-sm-3
[b/Label {:for "send"} "To transcribe the image"]]
[:div.col-sm-9
- [b/Button {:id "send" :on-click #(rf/dispatch [:fetch-transcription])} "Transcribe!"]]]
+ [b/Button (maybe-disable {:id "send" :on-click #(rf/dispatch [:fetch-transcription])}) "Transcribe!"]]]
[b/Row]
[b/Row
- [:div.col-sm-12
+ [:div.col-sm-12 {:class (if @(rf/subscribe [:transcription]) "visible" "hidden")}
[b/Alert {:color "success"} @(rf/subscribe [:transcription])]]]
[b/Row
- [:div.col-sm-12
+ [:div.col-sm-12 {:class (if @(rf/subscribe [:common/error]) "visible" "hidden")}
[b/Alert {:color "warning"} @(rf/subscribe [:common/error])]]]]])