simon/IReadIt
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Small cosmetic improvements

Browse source
This commit is contained in:
Simon Brooke 2019-02-18 14:38:53 +00:00
parent deaba3ff47
commit aff1e90ceb
3 changed files with 59 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
resources/html/home.html
View file

@ -4,14 +4,19 @@
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Welcome to ireadit</title> <title>Welcome to ireadit</title>
<style>
.row { padding: 0.25em; }
div.hidden { display: none; }
</style>
</head> </head>
<body> <body>
<div id="app"> <div id="app">
<div id="main-container" class="container-fluid">
<h1> <h1>
I Read It <em>is loading</em> I Read It <em>is loading</em>
</h1> </h1>
<div class="splash-screen"> <div class="splash-screen row">
<div class="sk-fading-circle"> <div class="sk-fading-circle">
<div class="sk-circle1 sk-circle"></div> <div class="sk-circle1 sk-circle"></div>
<div class="sk-circle2 sk-circle"></div> <div class="sk-circle2 sk-circle"></div>
@ -31,6 +36,7 @@
You must enable JavaScript to use the I Read It app. You must enable JavaScript to use the I Read It app.
</p> </p>
</div> </div>
</div>
<!-- scripts and styles --> <!-- scripts and styles -->
{% style "/assets/bootstrap/css/bootstrap.min.css" %} {% style "/assets/bootstrap/css/bootstrap.min.css" %}

21
src/cljs/ireadit/events.cljs
View file

@ -20,12 +20,6 @@
(fn [db [_ docs]] (fn [db [_ docs]]
(assoc db :docs 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 (rf/reg-event-fx
:fetch-docs :fetch-docs
(fn [_ _] (fn [_ _]
@ -47,7 +41,13 @@
:response-format (ajax/json-response-format) :response-format (ajax/json-response-format)
:on-success [:set-transcription] :on-success [:set-transcription]
:on-failure [:bad-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 (rf/reg-event-fx
:bad-transcription :bad-transcription
@ -55,7 +55,7 @@
[{db :db} [_ response]] [{db :db} [_ response]]
;; TODO: signal something has failed? It doesn't matter very much, unless it keeps failing. ;; 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)) (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 (rf/reg-event-db
:common/set-error :common/set-error
@ -89,3 +89,8 @@
(fn [db _] (fn [db _]
(:transcription db))) (:transcription db)))
(rf/reg-sub
:pending
(fn [db _]
(:pending db)))

15
src/cljs/ireadit/views/form.cljs
View file

@ -11,6 +11,12 @@
[secretary.core :as secretary]) [secretary.core :as secretary])
(:import goog.History)) (:import goog.History))
(defn maybe-disable [m]
(if
@(rf/subscribe [:pending])
(assoc m :disabled "disabled")
m))
(defn form-page [] (defn form-page []
[:div.container-fluid {:id "main-container"} [: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"]] [b/Label {:for "image-url" :title "URL of the image you wish to transcribe"}"Image URL"]]
[:div.col-sm-9 [:div.col-sm-9
[b/Input {:id "image-url" :type "text" :size "80" [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 [b/Row
[:div.col-sm-3 [:div.col-sm-3
[b/Label {:for "send"} "To transcribe the image"]] [b/Label {:for "send"} "To transcribe the image"]]
[:div.col-sm-9 [: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]
[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/Alert {:color "success"} @(rf/subscribe [:transcription])]]]
[b/Row [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])]]]]]) [b/Alert {:color "warning"} @(rf/subscribe [:common/error])]]]]])