Small cosmetic improvements

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

View file

@ -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" %}

View file

@ -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)))

View file

@ -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])]]]]])