Small cosmetic improvements
This commit is contained in:
parent
deaba3ff47
commit
aff1e90ceb
|
@ -4,14 +4,19 @@
|
|||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Welcome to ireadit</title>
|
||||
<style>
|
||||
.row { padding: 0.25em; }
|
||||
div.hidden { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="app">
|
||||
<div id="main-container" class="container-fluid">
|
||||
<h1>
|
||||
I Read It <em>is loading</em>
|
||||
</h1>
|
||||
<div class="splash-screen">
|
||||
<div class="splash-screen row">
|
||||
<div class="sk-fading-circle">
|
||||
<div class="sk-circle1 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.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- scripts and styles -->
|
||||
{% style "/assets/bootstrap/css/bootstrap.min.css" %}
|
||||
|
|
|
@ -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)))
|
||||
|
||||
|
|
|
@ -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])]]]]])
|
||||
|
||||
|
|
Loading…
Reference in a new issue