Refactor input fields.
This commit is contained in:
parent
9da8e2202e
commit
daa5652abe
|
@ -0,0 +1 @@
|
||||||
|
resources/public/dev
|
3
deps.edn
3
deps.edn
|
@ -9,5 +9,4 @@
|
||||||
com.bhauman/figwheel-main {:mvn/version "0.2.1-SNAPSHOT"}
|
com.bhauman/figwheel-main {:mvn/version "0.2.1-SNAPSHOT"}
|
||||||
cider/piggieback {:mvn/version "0.4.0"}
|
cider/piggieback {:mvn/version "0.4.0"}
|
||||||
com.bhauman/rebel-readline-cljs {:mvn/version "0.1.4"}}
|
com.bhauman/rebel-readline-cljs {:mvn/version "0.1.4"}}
|
||||||
:resource-paths ["app/data"]
|
:paths ["app" "src" "resources"]}
|
||||||
:paths ["app/data" "src"]}
|
|
||||||
|
|
|
@ -1,6 +1,4 @@
|
||||||
{:output-to "app/data/dev-main.js"
|
{:output-to "resources/public/dev-main.js"
|
||||||
:output-dir "app/data/dev"
|
|
||||||
:asset-path "app/data/dev",
|
|
||||||
:optimizations :none
|
:optimizations :none
|
||||||
:pretty-print true
|
:pretty-print true
|
||||||
:source-map true
|
:source-map true
|
||||||
|
|
|
@ -1,19 +1,2 @@
|
||||||
{:target-dir "app/data"
|
{:target-dir "app/data"
|
||||||
:watch-dirs ["src"]
|
:watch-dirs ["src"]}
|
||||||
:ring-stack-options {:params
|
|
||||||
{:urlencoded true, :multipart true, :nested true, :keywordize true},
|
|
||||||
:cookies true,
|
|
||||||
:session
|
|
||||||
{:flash true, :cookie-attrs {:http-only true, :same-site :strict}},
|
|
||||||
:static {:app "data"},
|
|
||||||
:responses {:content-types true, :default-charset "utf-8"},
|
|
||||||
:http-server-root "data"
|
|
||||||
:figwheel.server.ring/dev
|
|
||||||
{:figwheel.server.ring/fix-index-mime-type true,
|
|
||||||
:figwheel.server.ring/resource-root-index true,
|
|
||||||
:figwheel.server.ring/wrap-no-cache true,
|
|
||||||
:figwheel.server.ring/cljsjs-resources false,
|
|
||||||
:ring.middleware.not-modified/wrap-not-modified true,
|
|
||||||
:co.deps.ring-etag-middleware/wrap-file-etag true,
|
|
||||||
:ring.middleware.cors/wrap-cors true,
|
|
||||||
:ring.middleware.stacktrace/wrap-stacktrace true}}}
|
|
||||||
|
|
File diff suppressed because one or more lines are too long
Binary file not shown.
|
@ -0,0 +1,14 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html class="h-100 bg-green" lang="en">
|
||||||
|
<head>
|
||||||
|
<title>Device setup</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<link rel="stylesheet" href="tachyon.css" type="text/css"/>
|
||||||
|
<link rel="stylesheet" href="all.min.css" type="text/css"/>
|
||||||
|
</head>
|
||||||
|
<body class="h-100">
|
||||||
|
<div id="app" class="h-100"><i class="fas fa-spinner"></i>Loading</div>
|
||||||
|
<script src="dev-main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
File diff suppressed because one or more lines are too long
Binary file not shown.
|
@ -1,12 +1,11 @@
|
||||||
(ns DEMOAPP.core
|
(ns DEMOAPP.core
|
||||||
(:require [accountant.core :as accountant]
|
(:require [accountant.core :as accountant]
|
||||||
[ajax.core :refer [GET]]
|
|
||||||
[clojure.spec.alpha :as s]
|
[clojure.spec.alpha :as s]
|
||||||
[reagent.core :as reagent :refer [atom]]
|
[reagent.core :as reagent :refer [atom]]
|
||||||
[reagent.session :as session]
|
[reagent.session :as session]
|
||||||
[reitit.frontend :as reitit]))
|
[reitit.frontend :as reitit]))
|
||||||
|
|
||||||
(enable-console-print!)
|
;;(enable-console-print!)
|
||||||
(defonce form-data (atom {:device-id "" :wifi-ssid "" :wifi-key ""}))
|
(defonce form-data (atom {:device-id "" :wifi-ssid "" :wifi-key ""}))
|
||||||
|
|
||||||
(def device-id-regex #"[A-Za-z0-9]{4}")
|
(def device-id-regex #"[A-Za-z0-9]{4}")
|
||||||
|
@ -27,6 +26,20 @@
|
||||||
(:path (reitit/match-by-name router route params))
|
(:path (reitit/match-by-name router route params))
|
||||||
(:path (reitit/match-by-name router route))))
|
(:path (reitit/match-by-name router route))))
|
||||||
|
|
||||||
|
(defn form-input [name title placeholder data validator error]
|
||||||
|
[:div.mt3.dim
|
||||||
|
[:label.db.fw4.lh-copy.f6 {:for name} title]
|
||||||
|
[:input#wifi-ssid.pa2.input-reset.ba.bg-near-white.w-100.measure.b--silver
|
||||||
|
{:type "text" :name name :placeholder placeholder :autoFocus "true"
|
||||||
|
:on-change #(swap! data assoc (keyword name) (-> % .-target .-value))
|
||||||
|
:value ((keyword name) @form-data)}]
|
||||||
|
[:p (if (and (not-empty ((keyword name) @data))
|
||||||
|
(s/explain-data
|
||||||
|
(keyword 'DEMOAPP.core validator)
|
||||||
|
(:device-id @data)))
|
||||||
|
error)]])
|
||||||
|
|
||||||
|
|
||||||
; simple input form
|
; simple input form
|
||||||
(defn config-form []
|
(defn config-form []
|
||||||
[:article.black-80.db.tc.black.ba.w-100.bg-light-green.br2
|
[:article.black-80.db.tc.black.ba.w-100.bg-light-green.br2
|
||||||
|
@ -34,48 +47,26 @@
|
||||||
[:fieldset#sign_up.ba.b--transparent.ph0.mh0
|
[:fieldset#sign_up.ba.b--transparent.ph0.mh0
|
||||||
[:legend.ph0.mh0.fw6 "Device Setup"]
|
[:legend.ph0.mh0.fw6 "Device Setup"]
|
||||||
|
|
||||||
[:div.mt3.dim
|
(form-input "server" "Server" "127.0.0.1"
|
||||||
[:label.db.fw4.lh-copy.f6 {:for "device-id"} "Device Unique ID"]
|
form-data "device-id-type"
|
||||||
[:input#wifi-ssid.pa2.input-reset.ba.bg-near-white.w-100.measure.b--silver
|
"Invalid server address")
|
||||||
{:type "text" :name "device-id" :placeholder "AAAA" :autofocus "true"
|
(form-input "device-id" "Device Unique ID" "AAAA" form-data
|
||||||
:on-change #(swap! form-data assoc :device-id (-> % .-target .-value))
|
"device-id-type" "Invalid identifier, should be alphanumeric and 4 characters long.")
|
||||||
:value (:device-id @form-data)}]
|
(form-input "wifi-ssid" "WIFI SSID" "" form-data "wifi-ssid-type"
|
||||||
[:p (if (and (not-empty (:device-id @form-data))
|
"Invalid SSID, should be no more than 32 characters and must not start with !, #, or ;.")
|
||||||
(s/explain-data
|
(form-input "wifi-key" "WIFI Password" "" form-data "wifi-key-type" "No password set.")
|
||||||
::device-id-type
|
|
||||||
(:device-id @form-data)))
|
|
||||||
"Invalid identifier, should be alphanumeric and 4 characters long.")]]
|
|
||||||
|
|
||||||
[:div.mt3.dim
|
]
|
||||||
[:label.db.fw4.lh-copy.f6 {:for "wifi-ssid"} "WIFI SSID"]
|
|
||||||
[:input#wifi-ssid.pa2.input-reset.ba.bg-near-white.w-100.measure.b--silver
|
|
||||||
{:type "text" :name "wifi-ssid" :placeholder ""
|
|
||||||
:on-change #(swap! form-data assoc :wifi-ssid (-> % .-target .-value))
|
|
||||||
:value (:wifi-ssid @form-data)}]
|
|
||||||
[:p (if (and (not-empty (:device-id @form-data))
|
|
||||||
(s/explain-data
|
|
||||||
::device-id-type
|
|
||||||
(:device-id @form-data)))
|
|
||||||
"Invalid SSID, should be no more than 32 characters and must not start with !, #, or ;.")]]
|
|
||||||
|
|
||||||
[:div.mt3.dim
|
|
||||||
[:label.db.fw4.lh-copy.f6 {:for "wifi-password"} "WIFI Password"]
|
|
||||||
[:input#password.pa2.input-reset.ba.bg-near-white.w-100.measure.b--silver
|
|
||||||
{:type "password" :name "wifi-password"
|
|
||||||
:on-change #(swap! form-data assoc :wifi-key (-> % .-target .-value))
|
|
||||||
:value (:wifi-key @form-data)}]
|
|
||||||
[:p (if (and (not-empty (:wifi-key @form-data))
|
|
||||||
(s/explain-data
|
|
||||||
::wifi-ssid-type
|
|
||||||
(:wifi-key @form-data)))
|
|
||||||
"No password set.")]]]
|
|
||||||
[:div.mt3
|
[:div.mt3
|
||||||
[:input.b.ph3.pv2.input-reset.ba.b--black.bg-transparent.grow.pointer.f6.br2
|
[:input.b.ph3.pv2.input-reset.ba.b--black.bg-transparent.grow.pointer.f6.br2
|
||||||
{:type "submit" :value "Save"}]]]])
|
{:type "submit" :value "Save"}]]]])
|
||||||
|
|
||||||
(defn home-page []
|
(defn home-page []
|
||||||
[:div.w-25
|
[:div.w-25
|
||||||
[:img {:src "logo.png"}]
|
[:a.athelas.f3.link.white-70.hover-white.no-underline.flex.items-center.pa3
|
||||||
|
{:href "/"}
|
||||||
|
[:h2
|
||||||
|
[:i.fas.fa-surprise.mr3] "GASP Sensor setup"]]
|
||||||
(config-form)])
|
(config-form)])
|
||||||
|
|
||||||
(defn success-page []
|
(defn success-page []
|
||||||
|
@ -116,7 +107,6 @@
|
||||||
(fn [path]
|
(fn [path]
|
||||||
(boolean (reitit/match-by-path router path)))})
|
(boolean (reitit/match-by-path router path)))})
|
||||||
(accountant/dispatch-current!)
|
(accountant/dispatch-current!)
|
||||||
|
|
||||||
(reagent/render [current-page] (.getElementById js/document "app")))
|
(reagent/render [current-page] (.getElementById js/document "app")))
|
||||||
|
|
||||||
(startup)
|
(startup)
|
||||||
|
|
Loading…
Reference in New Issue