diff --git a/resources/public/css/style.css b/resources/public/css/style.css index a6a693c..9f9f221 100644 --- a/resources/public/css/style.css +++ b/resources/public/css/style.css @@ -72,6 +72,71 @@ body { color: #999; } +.floating-overlay { + position: fixed; + top: 20px; + left: 15%; + right: 15%; + z-index: 10000; + + word-wrap: break-word; + + padding: 10px; + + border: 1px solid black; + background-color: #333; + color: white; + box-shadow: 1px 1px 1px #888888; + font-size: 20px; +} + +.floating-overlay .download-item { + padding: 5px; +} + +.floating-overlay .progress-bar { + height: 2px; + background-color: #555; + opacity: 0.5; +} + +.floating-overlay .filename { + font-weight: bold; +} + +.floating-overlay .sub { + text-align:right; +} + +.floating-overlay .waiting { + font-style: italic; +} + +.floating-overlay .controls { + margin-top: 30px; +} + +@media (max-width: 980px) { + .floating-overlay { + font-size: 15px; + } +} + +@media (max-width: 780px) { + .floating-overlay .sub { + text-align: left; + } +} + +@media (max-width: 568px) { + .floating-overlay { + top: 0px; + left: 0px; + right: 0px; + border: none; + } +} + .current-path a { padding: 0px 5px; } diff --git a/src-cljs/dakait/components.cljs b/src-cljs/dakait/components.cljs index a34cc07..87b6a32 100644 --- a/src-cljs/dakait/components.cljs +++ b/src-cljs/dakait/components.cljs @@ -4,7 +4,7 @@ [jayq.core :only [$ html append css text ajax on bind hide show attr add-class remove-class]] [dakait.net :only [http-post]] [jayq.util :only [log]]) - (:require [cljs.core.async :as async :refer [>!]] + (:require [cljs.core.async :as async :refer [chan >! put!]] [om.core :as om :include-macros true] [om.dom :as dom :include-macros true] [cljs.core.match]) @@ -81,12 +81,77 @@ :style #js {:width pc}})))))) listing))))) + +(defn- file-name [p] + (-> p + (clojure.string/split #"/") + last)) + +(defn overlay-download-summary-item + "Shows a single overlay download" + [download owner] + (reify + om/IRender + (render [_] + (dom/div nil + (apply dom/div + #js {:className "row download-item"} + (dom/div + #js {:className "col-sm-6 col-xs-12 filename"} + (file-name (:from download))) + (if-let [ds (:download-status download)] + [(dom/div #js {:className "col-sm-2 col-xs-4 sub pc"} (:percent-complete ds)) + (dom/div #js {:className "col-sm-2 col-xs-4 sub rate"} (:rate ds)) + (dom/div #js {:className "col-sm-2 col-xs-4 sub ds"} (:eta ds))] + (dom/div #js {:className "col-sm-6 sub waiting"} + "Waiting..."))) + (dom/div (clj->js {:className "progress-bar" + :style (clj->js {:width (if (:download-status download) + (get-in download [:download-status :percent-complete]) + "0%")})}) " "))))) + + + +(defn overlay-download-summary + "A floating overlay widget which shows the current status of all downloads" + [downloads owner {:keys [hide-chan] :as opts}] + (reify + om/IRender + (render [_] + (let [dls (:active downloads)] + (dom/div + #js {:className "floating-overlay"} + (if (-> dls count zero?) + (dom/div nil "There are no active downloads at this time") + (dom/div nil + (apply dom/div #js {:className "container-fluid" + :style #js {:position "relative"}} + (om/build-all overlay-download-summary-item dls)))) + (dom/div #js {:className "container-fluid controls"} + (dom/div #js {:className "col-sm-4 col-sm-offset-4"} + (dom/button #js {:type "button" + :className "btn btn-primary btn-sm btn-block" + :onClick #(put! hide-chan 0)} + "Close")))))))) + (defn download-activity-monitor "A little widget that shows download activity" [downloads owner] (reify - om/IRender - (render [_] + om/IInitState + (init-state [_] + {:show-summary false + :hide-chan (chan)}) + + om/IWillMount + (will-mount [_] + (let [c (om/get-state owner :hide-chan)] + (go (loop [v (> listing ;; Associate tag information (map #(->> %