From 5c632ed2733134091eb391ee0deea7e8e63c1a2a Mon Sep 17 00:00:00 2001 From: Andrew Suzuki Date: Wed, 8 Jun 2016 19:25:27 -0400 Subject: [PATCH] login screen; block requests if logged out; tweak polling; more --- src/cljs/ulysses/components/header.cljs | 15 ++++--- src/cljs/ulysses/components/layout.cljs | 38 +++++++++++----- src/cljs/ulysses/components/misc.cljs | 7 +-- src/cljs/ulysses/config.cljs | 10 +++-- src/cljs/ulysses/core.cljs | 17 ++++--- src/cljs/ulysses/handlers.cljs | 6 ++- src/cljs/ulysses/pages/builder.cljs | 2 +- src/cljs/ulysses/pages/home.cljs | 2 +- src/cljs/ulysses/utils.cljs | 59 +++++++++++++------------ src/sass/components/_login.scss | 39 +++++++++++++--- src/sass/components/_main-logo.scss | 18 ++++++++ 11 files changed, 146 insertions(+), 67 deletions(-) diff --git a/src/cljs/ulysses/components/header.cljs b/src/cljs/ulysses/components/header.cljs index c26ae11..32eff26 100644 --- a/src/cljs/ulysses/components/header.cljs +++ b/src/cljs/ulysses/components/header.cljs @@ -18,8 +18,9 @@ :progress-lg :progress-sm)}])))) -(defn main-logo [] +(defn main-logo [& args] [:div.main-logo + {:class (some #{:large} args)} [:h1 [link [:home] {} config/site-title]] [progress]]) @@ -28,10 +29,9 @@ (let [user (subscribe [:user])] (fn [] (let [user @user] - [:div.login - (if-let [netid (:netid user)] - [:span "you are logged in as " netid] - [link "http://ulysses-api-staging.core/login" {} "log in"])])))) + (when-let [netid (:netid user)] + [:div.login-indicator + [:span "you are logged in as " netid]]))))) (defn uconn-banner-right-menu-item [href fa-id] [:li.nav-item @@ -62,7 +62,8 @@ ;; main ;; ---------------------------------------------------------------------------- -(defn header [] +(defn header [& args] [:header.header [uconn-banner] - [main-logo]]) + (when-not (some #{:hide-logo} args) + [main-logo])]) diff --git a/src/cljs/ulysses/components/layout.cljs b/src/cljs/ulysses/components/layout.cljs index 2599ef7..df923d1 100644 --- a/src/cljs/ulysses/components/layout.cljs +++ b/src/cljs/ulysses/components/layout.cljs @@ -2,10 +2,11 @@ (:require [reagent.core :as r] [re-frame.core :refer [subscribe dispatch]] [re-com.core :refer [modal-panel]] - [ulysses.components.header :refer [header]] - [ulysses.components.basic :refer [css-transition-group-standard]] + [ulysses.components.header :refer [header main-logo]] + [ulysses.components.basic :refer [css-transition-group-standard link]] [ulysses.components.misc :refer [modal-dialog]] - [ulysses.utils :refer [classes]] + [ulysses.utils :refer [classes classes-attr]] + [ulysses.config :refer [login-endpoint]] [ulysses.lib.moment :as m])) (defn footer [] @@ -25,11 +26,28 @@ [modal-dialog (assoc ms :on-close on-close)]])))) +(defn login-screen [] + [:div.login-screen + [header :hide-logo] + [:div.centered + [:div.inside + [main-logo :large] + [link + login-endpoint + (classes-attr :btn :btn-lg :btn-primary-outline) + "log in"]]]]) + (defn shell [page-name page] - [:div.shell - [header] - ; page - [css-transition-group-standard - [^{:key (name page-name)} [:div.page page]]] - [footer] - [modal-alpha]]) + (let [user (subscribe [:user])] + (fn [page-name page] + (if-let [user @user] + [:div.shell + [header] + ; page + [css-transition-group-standard + [^{:key (name page-name)} [:div.page page]]] + [footer] + [modal-alpha]] + + ; user not logged in + [login-screen])))) diff --git a/src/cljs/ulysses/components/misc.cljs b/src/cljs/ulysses/components/misc.cljs index cb28e6a..1cd3f45 100644 --- a/src/cljs/ulysses/components/misc.cljs +++ b/src/cljs/ulysses/components/misc.cljs @@ -18,12 +18,13 @@ [label (-> name keyword mechanism-to-contextual) name]) (defn grant-op-meta - [{:keys [funding-mechanism due-date url]}] + [with-link? {:keys [funding-mechanism due-date url]}] [:div.grant-op-meta [grant-op-fm-label funding-mechanism] [grant-op-time-left-label due-date] - [link url {:target "_blank"} - [label :default "view grant"]]]) + (when with-link? + [link url {:target "_blank"} + [label :default "view grant"]])]) ;; ---------------------------------------------------------------------------- ;; modal dialog diff --git a/src/cljs/ulysses/config.cljs b/src/cljs/ulysses/config.cljs index ad4aa88..d945f26 100644 --- a/src/cljs/ulysses/config.cljs +++ b/src/cljs/ulysses/config.cljs @@ -23,10 +23,14 @@ .-location .-hostname)) -(def api-endpoint +(def api-hostname (if (or debug? (string/includes? hostname "staging")) - "http://ulysses-api-staging.core/api" - "http://ulysses-api-alpha.core/api")) + "http://ulysses-api-staging.core" + "http://ulysses-api-alpha.core")) + +(def api-endpoint (str api-hostname "/api")) + +(def login-endpoint (str api-hostname "/login")) (def request-debounce-time 300) diff --git a/src/cljs/ulysses/core.cljs b/src/cljs/ulysses/core.cljs index 7322af3..59ad225 100644 --- a/src/cljs/ulysses/core.cljs +++ b/src/cljs/ulysses/core.cljs @@ -1,6 +1,6 @@ (ns ulysses.core (:require [reagent.core :as reagent] - [re-frame.core :as re-frame :refer [dispatch]] + [re-frame.core :as re-frame :refer [dispatch dispatch-sync]] [ulysses.handlers] [ulysses.subs] [ulysses.routes :as routes] @@ -17,17 +17,22 @@ (defn hook-into-browser-events [] (.addEventListener js/window "resize" - #(dispatch [:window-resize])) + (fn [] (dispatch [:window-resize]))) (.addEventListener js/window "scroll" - #(dispatch [:window-scroll]))) + (fn [] (dispatch [:window-scroll])))) (defn start-pollings [] - (js/setInterval #(dispatch [:window-resize]) 100) - (js/setInterval #(dispatch [:request-user-poll]) (* 30 1000))) + (let [pollings [[100 [:window-resize]] + [(* 30 1000) [:request-user-poll]]]] + (doseq [[time dval] pollings] + (dispatch-sync dval) + (js/setInterval + (fn [] (dispatch dval)) + time)))) (defn ^:export init [] (routes/app-routes) - (re-frame/dispatch-sync [:initialize-db]) + (dispatch-sync [:initialize-db]) (mount-root) (hook-into-browser-events) (start-pollings)) diff --git a/src/cljs/ulysses/handlers.cljs b/src/cljs/ulysses/handlers.cljs index 00be926..12a985d 100644 --- a/src/cljs/ulysses/handlers.cljs +++ b/src/cljs/ulysses/handlers.cljs @@ -87,6 +87,7 @@ (fn [db _] (request db [:login :poll] + :req-user? false :handler #(dispatch [:receive-user-poll %]) ;; if server didn't respond or an error occurred, log out :error-handler #(dispatch [:receive-user-poll false])))) @@ -94,11 +95,12 @@ (register-handler :receive-user-poll (fn [db [_ response]] - (println "login:" response) + (println "login poll:" response) (if-not (and (boolean? response) response) ;; not logged in anymore, so nil the user (assoc db :user nil) - db))) + ;; TODO request actual user + (assoc db :user true)))) ;; ---------------------------------------------------------------------------- ;; raw data diff --git a/src/cljs/ulysses/pages/builder.cljs b/src/cljs/ulysses/pages/builder.cljs index d8d3145..8b4ccf4 100644 --- a/src/cljs/ulysses/pages/builder.cljs +++ b/src/cljs/ulysses/pages/builder.cljs @@ -267,7 +267,7 @@ [:div.col-md-12 [:h3.text-xs-center.mb-15 title] [:div.text-xs-center - [grant-op-meta op]] + [grant-op-meta true op]] [:p purpose]]]]]) ;; ---------------------------------------------------------------------------- diff --git a/src/cljs/ulysses/pages/home.cljs b/src/cljs/ulysses/pages/home.cljs index d699300..a0778db 100644 --- a/src/cljs/ulysses/pages/home.cljs +++ b/src/cljs/ulysses/pages/home.cljs @@ -85,7 +85,7 @@ [:div.grant-op-box [link [:builder :grant-op-id id] {:class :inside} [:div.title title] - [grant-op-meta op] + [grant-op-meta false op] [:div.about [:p body]] [grant-op-box-initial-team initial-team]] [grant-op-box-actions id]])) diff --git a/src/cljs/ulysses/utils.cljs b/src/cljs/ulysses/utils.cljs index 5620e3e..6549c3d 100644 --- a/src/cljs/ulysses/utils.cljs +++ b/src/cljs/ulysses/utils.cljs @@ -352,39 +352,42 @@ (defn request "make an api request, with progress tracking" - [db endpoint & {:keys [verb params handler error-handler finish] + [db endpoint & {:keys [verb params req-user? handler error-handler finish] :or {verb :get params nil + req-user? true handler noop error-handler noop finish noop}}] - (let [progress-id (:next-progress-id db) - method (case verb :get ajax.core/GET - :post ajax.core/POST - :put ajax.core/PUT - :delete ajax.core/DELETE - ajax.core/GET)] - (dispatch [:progress progress-id 1]) - (method - (string/join "/" - (cons config/api-endpoint - (map - #(if (keyword? %) (name %) %) - endpoint))) - {:params - (when params - (remap url-encode-component params)) - :response-format :json - :keywords? true - :handler handler - :error-handler - (fn [e] - (dispatch [:bad-response e]) ; general error handler - (error-handler e)) ; user - :finally - (fn [e] - (dispatch [:progress progress-id 100]) ; complete progress - (finish e))})) ; user + ; only allow requests if logged in or check is bypassed + (when (or (not req-user?) (:user db)) + (let [progress-id (:next-progress-id db) + method (case verb :get ajax.core/GET + :post ajax.core/POST + :put ajax.core/PUT + :delete ajax.core/DELETE + ajax.core/GET)] + (dispatch [:progress progress-id 1]) + (method + (string/join "/" + (cons config/api-endpoint + (map + #(if (keyword? %) (name %) %) + endpoint))) + {:params + (when params + (remap url-encode-component params)) + :response-format :json + :keywords? true + :handler handler + :error-handler + (fn [e] + (dispatch [:bad-response e]) ; general error handler + (error-handler e)) ; user + :finally + (fn [e] + (dispatch [:progress progress-id 100]) ; complete progress + (finish e))}))) ; user db) ; (no direct db change) ; grant ops requests diff --git a/src/sass/components/_login.scss b/src/sass/components/_login.scss index 6ccdb56..1b1c0aa 100644 --- a/src/sass/components/_login.scss +++ b/src/sass/components/_login.scss @@ -1,10 +1,37 @@ -// login +// ---------------------------------------------------------------------------- +// Login Screen +// ---------------------------------------------------------------------------- -// NOTE -// this is within the relative uconn-banner +.login-screen { + background: $white; + display: flex; + flex-direction: column; + height: 100%; + left: 0; + position: fixed; + top: 0; + width: 100%; + z-index: 1500; + + .centered { + align-items: center; + display: flex; + flex: 1; + justify-content: center; + + .inside { + margin-bottom: 15vh; + text-align: center; + } + } +} + +// ---------------------------------------------------------------------------- +// Login Indicator +// ---------------------------------------------------------------------------- .uconn-banner { - .login { + .login-indicator { padding: .7rem 1rem 0 0; position: absolute; right: 0; @@ -12,13 +39,13 @@ } &.slim { - .login { + .login-indicator { top: 40px; } } @media screen and (max-width: 850px) { - .login { + .login-indicator { top: 40px; } } diff --git a/src/sass/components/_main-logo.scss b/src/sass/components/_main-logo.scss index bd1a4da..f727970 100644 --- a/src/sass/components/_main-logo.scss +++ b/src/sass/components/_main-logo.scss @@ -14,4 +14,22 @@ font-weight: 100; } } + + &.large { + h1 { + font-size: 6em; + + @include media-breakpoint-only(md) { + font-size: 5em; + } + + @include media-breakpoint-only(sm) { + font-size: 5em; + } + + @include media-breakpoint-only(xs) { + font-size: 3.5em; + } + } + } }