aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorMiguel Ángel Moreno <mail@migalmoreno.com>2022-12-30 01:01:26 +0100
committerMiguel Ángel Moreno <mail@migalmoreno.com>2022-12-30 01:01:26 +0100
commitc3b4e2d87a2031c3499e49f47c39c7119adeb170 (patch)
tree0c0348410a6fd3afe8a6c5e479e5660c030a0a60 /src
parent45694468ccea8219c47dfc470e9e5ef885f671bd (diff)
feat(frontend): Add basic global player
Diffstat (limited to 'src')
-rw-r--r--src/frontend/tau/components/player.cljs21
-rw-r--r--src/frontend/tau/events.cljs14
-rw-r--r--src/frontend/tau/views.cljs8
-rw-r--r--src/frontend/tau/views/player.cljs11
-rw-r--r--src/frontend/tau/views/stream.cljs6
5 files changed, 41 insertions, 19 deletions
diff --git a/src/frontend/tau/components/player.cljs b/src/frontend/tau/components/player.cljs
new file mode 100644
index 0000000..b7ba099
--- /dev/null
+++ b/src/frontend/tau/components/player.cljs
@@ -0,0 +1,21 @@
+(ns tau.components.player
+ (:require
+ [re-frame.core :as rf]
+ [reitit.frontend.easy :as rfe]
+ [tau.events :as events]))
+
+(defn global-player
+ []
+ (let [{:keys [uploader-name uploader-url name stream url service-color]} @(rf/subscribe [:global-stream])
+ show-global-player? @(rf/subscribe [:show-global-player])]
+ (when show-global-player?
+ [:div.sticky.bottom-0.z-50.bg-neutral-900.p-5.absolute
+ {:style {:borderColor service-color :borderTopWidth "2px" :borderStyle "solid"}}
+ [:div.flex.items-center.justify-between
+ [:div.flex.flex-col
+ [:a.text-xs
+ {:href (rfe/href :tau.router/stream nil {:url url})} name]
+ [:a.text-xs.text-gray-300
+ {:href (rfe/href :tau.router/channel nil {:url uploader-url})} uploader-name]]
+ [:audio {:src stream :controls true}]
+ [:i.fa-solid.fa-close.cursor-pointer {:on-click #(rf/dispatch [::events/toggle-global-player])}]]])))
diff --git a/src/frontend/tau/events.cljs b/src/frontend/tau/events.cljs
index ed01467..24da7d0 100644
--- a/src/frontend/tau/events.cljs
+++ b/src/frontend/tau/events.cljs
@@ -155,11 +155,21 @@
:nextPage (js/encodeURIComponent next-page-url)})
:db (assoc db :show-pagination-loading true)))))
+(rf/reg-event-db
+ ::change-global-stream
+ (fn [db [_ global-stream]]
+ (assoc db :global-stream global-stream)))
+
+(rf/reg-event-db
+ ::toggle-global-player
+ (fn [db _]
+ (assoc db :show-global-player (not (:show-global-player db)))))
+
(rf/reg-event-fx
::switch-to-global-player
- (fn [{:keys [db]} [_ res]]
+ (fn [{:keys [db]} [_ global-stream]]
{:db (assoc db :show-global-player true)
- :fx [[:dispatch [::change-global-search res]]]}))
+ :fx [[:dispatch [::change-global-stream global-stream]]]}))
(rf/reg-event-db
::load-services
diff --git a/src/frontend/tau/views.cljs b/src/frontend/tau/views.cljs
index 4f89fef..3201687 100644
--- a/src/frontend/tau/views.cljs
+++ b/src/frontend/tau/views.cljs
@@ -4,9 +4,9 @@
[re-frame.core :as rf]
[reagent.ratom :as ratom]
[tau.components.navigation :as navigation]
+ [tau.components.player :as player]
[tau.events :as events]
- [tau.routes :as routes]
- [tau.views.player :as player]))
+ [tau.routes :as routes]))
(defonce scroll-hook (.addEventListener js/window "scroll" #(rf/dispatch [::events/page-scroll])))
(defonce services (rf/dispatch [::events/get-services]))
@@ -82,5 +82,5 @@
[:div.flex.flex-col.justify-between.relative.font-nunito {:class "min-h-[calc(100vh-58px)]"}
(when-let [view (-> current-match :data :view)]
[view current-match])
- [player/global-player]
- [footer]]]))
+ [footer]
+ [player/global-player]]]))
diff --git a/src/frontend/tau/views/player.cljs b/src/frontend/tau/views/player.cljs
deleted file mode 100644
index 732e542..0000000
--- a/src/frontend/tau/views/player.cljs
+++ /dev/null
@@ -1,11 +0,0 @@
-(ns tau.views.player
- (:require
- [re-frame.core :as rf]))
-
-(defn global-player
- []
- (let [global-stream @(rf/subscribe [:global-stream])
- show-global-player? @(rf/subscribe [:show-global-player])]
- [:div
- [:audio {:src global-stream
- :class (when-not show-global-player? "hidden")}]]))
diff --git a/src/frontend/tau/views/stream.cljs b/src/frontend/tau/views/stream.cljs
index 033b2da..7ef9e85 100644
--- a/src/frontend/tau/views/stream.cljs
+++ b/src/frontend/tau/views/stream.cljs
@@ -16,7 +16,7 @@
description uploader-avatar uploader-author
uploader-url upload-date related-streams
thumbnail-url show-comments-loading comments-page
- show-comments] :as stream} @(rf/subscribe [:stream])
+ show-comments service-id] :as stream} @(rf/subscribe [:stream])
stream-type (-> (if (empty? video-streams) audio-streams video-streams)
last
:content)
@@ -35,7 +35,9 @@
[:div.px-4.md:p-0
[:div.flex.flex.w-full.mt-3.justify-center
[:button.border.rounded.border-black.px-3.py-1.bg-stone-800
- {:on-click #(rf/dispatch [::events/switch-to-global-player stream])}
+ {:on-click #(rf/dispatch [::events/switch-to-global-player
+ {:uploader-name uploader-author :uploader-url uploader-url
+ :name name :url url :stream stream-type :service-color service-color}])}
[:i.fa-solid.fa-headphones]]
[:a {:href url}
[:button.border.rounded.border-black.px-3.py-1.bg-stone-800.mx-2