aboutsummaryrefslogtreecommitdiff
path: root/src/frontend
diff options
context:
space:
mode:
authorMiguel Ángel Moreno <mail@migalmoreno.com>2024-01-23 13:03:54 +0100
committerMiguel Ángel Moreno <mail@migalmoreno.com>2024-01-23 13:03:54 +0100
commit8258620eab20b4a53e6cc921d884b0aa886b8565 (patch)
tree6d27a8b68b128cf155fd837f6a1faf9796f7b219 /src/frontend
parent552d4c01aec14263310222f1b92f7a7e2349ce2b (diff)
feat(frontend): move loading icon to layout components
Diffstat (limited to 'src/frontend')
-rw-r--r--src/frontend/tubo/components/audio_player.cljs19
-rw-r--r--src/frontend/tubo/components/comments.cljs3
-rw-r--r--src/frontend/tubo/components/items.cljs4
-rw-r--r--src/frontend/tubo/components/layout.cljs12
-rw-r--r--src/frontend/tubo/components/loading.cljs8
-rw-r--r--src/frontend/tubo/views/channel.cljs3
-rw-r--r--src/frontend/tubo/views/kiosk.cljs1
-rw-r--r--src/frontend/tubo/views/playlist.cljs1
-rw-r--r--src/frontend/tubo/views/search.cljs1
-rw-r--r--src/frontend/tubo/views/stream.cljs3
10 files changed, 20 insertions, 35 deletions
diff --git a/src/frontend/tubo/components/audio_player.cljs b/src/frontend/tubo/components/audio_player.cljs
index f688e50..cd2d581 100644
--- a/src/frontend/tubo/components/audio_player.cljs
+++ b/src/frontend/tubo/components/audio_player.cljs
@@ -5,7 +5,7 @@
[reagent.dom :as rdom]
[re-frame.core :as rf]
[reitit.frontend.easy :as rfe]
- [tubo.components.loading :as loading]
+ [tubo.components.layout :as layout]
[tubo.components.player :as player]
[tubo.events :as events]
[tubo.util :as util]))
@@ -66,17 +66,12 @@
[player/button [:i.fa-solid.fa-backward]
#(rf/dispatch [::events/set-player-time (- @!elapsed-time 5)])]
[player/button
- (if @!player
- (if loading?
- [loading/loading-icon service-color "text-2xl"]
- (if paused?
- [:i.fa-solid.fa-play
- {:on-click #(rf/dispatch [::events/player-paused false])}]
- [:i.fa-solid.fa-pause
- {:on-click #(rf/dispatch [::events/player-paused true])}]))
- [:i.fa-solid.fa-play
- {:on-click #(rf/dispatch [::events/player-paused true])}])
- nil
+ (if (or loading? (not @!player))
+ [layout/loading-icon service-color "text-2xl"]
+ (if paused?
+ [:i.fa-solid.fa-play]
+ [:i.fa-solid.fa-pause]))
+ #(rf/dispatch [::events/player-paused (not paused?)])
:show-on-mobile? true
:extra-styles "lg:text-2xl"]
[player/button [:i.fa-solid.fa-forward]
diff --git a/src/frontend/tubo/components/comments.cljs b/src/frontend/tubo/components/comments.cljs
index 5990534..4a94e07 100644
--- a/src/frontend/tubo/components/comments.cljs
+++ b/src/frontend/tubo/components/comments.cljs
@@ -3,7 +3,6 @@
[re-frame.core :as rf]
[reitit.frontend.easy :as rfe]
[tubo.components.layout :as layout]
- [tubo.components.loading :as loading]
[tubo.events :as events]
[tubo.util :as util]))
@@ -71,7 +70,7 @@
[comment-item (assoc reply :key i :author-name author-name :author-avatar author-avatar)])])])]
(when (:url next-page)
(if pagination-loading?
- (loading/loading-icon service-color)
+ (layout/loading-icon service-color)
[:div.flex.justify-center
[layout/secondary-button
"Show more comments"
diff --git a/src/frontend/tubo/components/items.cljs b/src/frontend/tubo/components/items.cljs
index 91040c7..e1cdfe9 100644
--- a/src/frontend/tubo/components/items.cljs
+++ b/src/frontend/tubo/components/items.cljs
@@ -2,7 +2,7 @@
(:require
[re-frame.core :as rf]
[reitit.frontend.easy :as rfe]
- [tubo.components.loading :as loading]
+ [tubo.components.layout :as layout]
[tubo.events :as events]
[tubo.util :as util]))
@@ -107,4 +107,4 @@
(for [[i item] (map-indexed vector related-streams)]
^{:key i} [generic-item item service-color bookmarks])])
(when-not (empty? next-page-url)
- [loading/loading-icon service-color "text-2xl" (when-not pagination-loading? "invisible")])]))
+ [layout/loading-icon service-color "text-2xl" (when-not pagination-loading? "invisible")])]))
diff --git a/src/frontend/tubo/components/layout.cljs b/src/frontend/tubo/components/layout.cljs
index 51847b8..59c695c 100644
--- a/src/frontend/tubo/components/layout.cljs
+++ b/src/frontend/tubo/components/layout.cljs
@@ -1,7 +1,6 @@
(ns tubo.components.layout
(:require
- [re-frame.core :as rf]
- [tubo.components.loading :as loading]))
+ [re-frame.core :as rf]))
(defn logo []
[:img.mb-1
@@ -9,6 +8,13 @@
:style {:maxHeight "25px" :maxWidth "40px"}
:title "Tubo"}])
+(defn loading-icon
+ [service-color & styles]
+ [:div.w-full.flex.justify-center.items-center.flex-auto
+ [:i.fas.fa-circle-notch.fa-spin
+ {:class (apply str (if (> (count styles) 1) (interpose " " styles) styles))
+ :style {:color service-color}}]])
+
(defn focus-overlay [on-click-cb active?]
[:div.w-full.fixed.min-h-screen.right-0.top-0.transition-all.delay-75.ease-in-out
{:class "bg-black/50"
@@ -22,7 +28,7 @@
service-color @(rf/subscribe [:service-color])]
[:div.flex.flex-col.flex-auto.items-center.px-5.py-4
(if page-loading?
- [loading/loading-icon service-color "text-5xl"]
+ [loading-icon service-color "text-5xl"]
[:div.flex.flex-col.flex-auto.w-full {:class "lg:w-4/5 xl:w-3/5"}
(map-indexed #(with-meta %2 {:key %1}) children)])]))
diff --git a/src/frontend/tubo/components/loading.cljs b/src/frontend/tubo/components/loading.cljs
deleted file mode 100644
index 08c37de..0000000
--- a/src/frontend/tubo/components/loading.cljs
+++ /dev/null
@@ -1,8 +0,0 @@
-(ns tubo.components.loading)
-
-(defn loading-icon
- [service-color & styles]
- [:div.w-full.flex.justify-center.items-center.flex-auto
- [:i.fas.fa-circle-notch.fa-spin
- {:class (apply str (if (> (count styles) 1) (interpose " " styles) styles))
- :style {:color service-color}}]])
diff --git a/src/frontend/tubo/views/channel.cljs b/src/frontend/tubo/views/channel.cljs
index 643acaf..00dc12f 100644
--- a/src/frontend/tubo/views/channel.cljs
+++ b/src/frontend/tubo/views/channel.cljs
@@ -3,7 +3,6 @@
[re-frame.core :as rf]
[tubo.components.items :as items]
[tubo.components.layout :as layout]
- [tubo.components.loading :as loading]
[tubo.events :as events]))
(defn channel
@@ -12,8 +11,6 @@
related-streams next-page]} @(rf/subscribe [:channel])
next-page-url (:url next-page)
service-color @(rf/subscribe [:service-color])
- page-loading? @(rf/subscribe [:show-page-loading])
- pagination-loading? @(rf/subscribe [:show-pagination-loading])
scrolled-to-bottom? @(rf/subscribe [:scrolled-to-bottom])]
(when scrolled-to-bottom?
(rf/dispatch [::events/channel-pagination url next-page-url]))
diff --git a/src/frontend/tubo/views/kiosk.cljs b/src/frontend/tubo/views/kiosk.cljs
index f30bea6..ed6cd09 100644
--- a/src/frontend/tubo/views/kiosk.cljs
+++ b/src/frontend/tubo/views/kiosk.cljs
@@ -3,7 +3,6 @@
[re-frame.core :as rf]
[tubo.components.items :as items]
[tubo.components.layout :as layout]
- [tubo.components.loading :as loading]
[tubo.events :as events]))
(defn kiosk
diff --git a/src/frontend/tubo/views/playlist.cljs b/src/frontend/tubo/views/playlist.cljs
index fc92a35..0f2325a 100644
--- a/src/frontend/tubo/views/playlist.cljs
+++ b/src/frontend/tubo/views/playlist.cljs
@@ -4,7 +4,6 @@
[reitit.frontend.easy :as rfe]
[tubo.components.items :as items]
[tubo.components.layout :as layout]
- [tubo.components.loading :as loading]
[tubo.events :as events]))
(defn playlist
diff --git a/src/frontend/tubo/views/search.cljs b/src/frontend/tubo/views/search.cljs
index 551fbfb..aab6dc7 100644
--- a/src/frontend/tubo/views/search.cljs
+++ b/src/frontend/tubo/views/search.cljs
@@ -3,7 +3,6 @@
[re-frame.core :as rf]
[reitit.frontend.easy :as rfe]
[tubo.components.items :as items]
- [tubo.components.loading :as loading]
[tubo.components.layout :as layout]
[tubo.events :as events]))
diff --git a/src/frontend/tubo/views/stream.cljs b/src/frontend/tubo/views/stream.cljs
index 4f9bf4f..3f096fb 100644
--- a/src/frontend/tubo/views/stream.cljs
+++ b/src/frontend/tubo/views/stream.cljs
@@ -5,7 +5,6 @@
[tubo.events :as events]
[tubo.components.items :as items]
[tubo.components.layout :as layout]
- [tubo.components.loading :as loading]
[tubo.components.comments :as comments]
[tubo.components.video-player :as player]
[tubo.util :as util]))
@@ -124,7 +123,7 @@
(rf/dispatch [::events/toggle-stream-layout :show-comments])
(rf/dispatch [::events/get-comments url]))}])]
(if show-comments-loading
- [loading/loading-icon service-color "text-2xl"]
+ [layout/loading-icon service-color "text-2xl"]
(when (and show-comments comments-page)
[comments/comments comments-page uploader-name uploader-avatar url]))])
(when (and show-related? (not (empty? related-streams)))