Commit graph

56 commits

Author SHA1 Message Date
Michael David Kuckuk
b38df2fbe3
Create stories for layout testing (#2722)
* Inject services with useContext

* Extract service for video settings

* Create mock factories for services

* Create test data for chat history

* Add story to visualize different layouts

* Fix renaming mistake

* Add landscape and portrait viewports

* Add landscape stories

---------

Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2023-02-26 16:54:28 -08:00
Michael David Kuckuk
25119561fb
Give chat a min-height that other elements yield to on mobile clients (#2676)
* Add className prop to some components

* Give mobile chatbox height priority over other elements

* Optimize for mobile landscape mode

* Make thumbnail background black

* Fix overflow issues on narrow screens

* Adjust layout for offline mode on mobile

* Fix main content width on Desktop

* Fix offline layout for desktop
2023-02-08 18:50:58 -08:00
imgbot[bot]
e977279eef
[ImgBot] Optimize images (#2654)
*Total -- 14,486.60kb -> 13,473.50kb (6.99%)

/static/img/emoji/blob/ablobaww.gif -- 401.59kb -> 221.70kb (44.79%)
/static/img/emoji/blob/ablobdancer.gif -- 33.43kb -> 24.81kb (25.78%)
/static/img/emoji/blob/ablobthinking.gif -- 82.81kb -> 61.59kb (25.62%)
/web/stories/assets/mocks/offline-state.png -- 25.70kb -> 19.44kb (24.34%)
/web/.storybook/story-assets/project/sticker-bigtech-alt.png -- 161.87kb -> 131.11kb (19%)
/static/img/emoji/blob/blobwave.png -- 7.84kb -> 6.55kb (16.44%)
/static/web/img/platformlogos/fediverse.svg -- 18.53kb -> 15.55kb (16.08%)
/web/public/img/platformlogos/fediverse.svg -- 18.53kb -> 15.55kb (16.08%)
/static/img/emoji/blob/blobaww.png -- 8.72kb -> 7.38kb (15.32%)
/web/.storybook/story-assets/project/owncast-background.png -- 3,228.15kb -> 2,739.00kb (15.15%)
/static/img/emoji/blob/ablobgift.gif -- 205.24kb -> 174.65kb (14.91%)
/web/.storybook/story-assets/project/logo-translucent-grey.svg -- 7.51kb -> 6.45kb (14.22%)
/web/components/video/airplay.svg -- 1.36kb -> 1.18kb (13.35%)
/static/web/_next/static/media/airplay.1a413e9c.svg -- 1.36kb -> 1.18kb (13.35%)
/static/img/emoji/conigliolo96/conigliolo15.gif -- 34.76kb -> 30.12kb (13.35%)
/static/img/emoji/conigliolo96/conigliolo1.gif -- 34.66kb -> 30.03kb (13.35%)
/static/img/emoji/conigliolo96/conigliolo17.gif -- 35.63kb -> 30.90kb (13.26%)
/static/img/emoji/blob/blobdancer.png -- 9.63kb -> 8.42kb (12.5%)
/static/img/emoji/blob/blobthinking.png -- 11.07kb -> 9.69kb (12.43%)
/static/web/img/platformlogos/matrix.svg -- 1.21kb -> 1.06kb (12.32%)
/web/public/img/platformlogos/matrix.svg -- 1.21kb -> 1.06kb (12.32%)
/static/web/img/platformlogos/xmpp.svg -- 4.23kb -> 3.73kb (11.83%)
/web/public/img/platformlogos/xmpp.svg -- 4.23kb -> 3.73kb (11.83%)
/static/img/emoji/blob/ablobcry.gif -- 42.70kb -> 37.93kb (11.16%)
/web/stories/assets/mocks/follow-modal.png -- 100.92kb -> 90.24kb (10.59%)
/static/img/emoji/dog/img347.svg -- 17.25kb -> 15.50kb (10.13%)
/static/img/emoji/blob/blobjam.png -- 12.81kb -> 11.56kb (9.71%)
/static/img/emoji/blob/blobyum.png -- 9.49kb -> 8.58kb (9.58%)
/static/img/emoji/blob/ablobsleep.gif -- 45.52kb -> 41.19kb (9.52%)
/static/img/emoji/dog/img346.svg -- 15.84kb -> 14.36kb (9.39%)
/static/img/emoji/dog/img327.svg -- 16.52kb -> 14.99kb (9.27%)
/static/img/emoji/blob/blobangry.png -- 8.23kb -> 7.49kb (9.06%)
/static/img/emoji/blob/ablobwave.gif -- 77.02kb -> 70.13kb (8.94%)
/static/img/emoji/dog/img091.svg -- 14.19kb -> 12.94kb (8.82%)
/static/img/emoji/dog/img001.svg -- 15.80kb -> 14.42kb (8.74%)
/static/img/emoji/dog/img093.svg -- 14.39kb -> 13.13kb (8.7%)
/static/img/emoji/dog/img203.svg -- 15.82kb -> 14.45kb (8.61%)
/static/img/emoji/conigliolo96/conigliolo25.gif -- 38.86kb -> 35.54kb (8.54%)
/static/img/emoji/blob/blobyes.png -- 13.01kb -> 11.91kb (8.49%)
/static/img/emoji/blob/blobthanks.png -- 11.97kb -> 10.97kb (8.38%)
/static/img/emoji/dog/img288.svg -- 16.43kb -> 15.10kb (8.07%)
/static/img/emoji/blob/ablobblewobble.gif -- 16.01kb -> 14.80kb (7.56%)
/static/img/emoji/conigliolo96/conigliolo28.gif -- 38.59kb -> 35.80kb (7.22%)
/static/img/emoji/conigliolo96/conigliolo21.gif -- 38.29kb -> 35.64kb (6.92%)
/static/img/emoji/dog/img352.svg -- 22.09kb -> 20.57kb (6.9%)
/web/stories/assets/mocks/notify-popup.png -- 48.11kb -> 45.48kb (5.46%)
/static/web/img/indieauth.png -- 9.85kb -> 9.32kb (5.38%)
/web/public/img/indieauth.png -- 9.85kb -> 9.32kb (5.38%)
/web/stories/assets/mocks/chatmessage-system.png -- 33.28kb -> 31.55kb (5.19%)
/static/img/emoji/blob/ablobcheer.gif -- 37.57kb -> 35.74kb (4.86%)
/static/img/emoji/blob/ablobattention.gif -- 36.55kb -> 34.81kb (4.76%)
/static/img/logo.png -- 127.20kb -> 121.26kb (4.68%)
/web/.storybook/story-assets/project/logo-glare-outlined.png -- 127.20kb -> 121.26kb (4.68%)
/web/.storybook/story-assets/project/kiss-cut-stickers-5.5x5.5-default-60874a6c11849.png -- 127.20kb -> 121.26kb (4.68%)
/web/stories/assets/mocks/chatmessage-action.png -- 9.85kb -> 9.39kb (4.66%)
/web/.storybook/story-assets/project/header.png -- 57.15kb -> 54.50kb (4.63%)
/web/stories/assets/mocks/chatmessage-user.png -- 37.25kb -> 35.79kb (3.91%)
/static/img/emoji/blob/ablobgiggle.gif -- 228.77kb -> 221.60kb (3.13%)
/web/stories/assets/mocks/notify-modal.png -- 63.75kb -> 61.91kb (2.89%)
/web/.storybook/story-assets/tshirt/all-over-print-womens-crew-neck-t-shirt-white-back-6087418b62999.png -- 724.91kb -> 705.22kb (2.72%)
/web/.storybook/story-assets/tshirt/all-over-print-mens-crew-neck-t-shirt-white-front-60873dde51eb3.png -- 689.98kb -> 671.76kb (2.64%)
/web/.storybook/story-assets/tshirt/all-over-print-mens-crew-neck-t-shirt-white-back-60873dde52297.png -- 682.39kb -> 664.39kb (2.64%)
/web/.storybook/story-assets/tshirt/all-over-print-womens-crew-neck-t-shirt-white-front-6087418b626d5.png -- 760.09kb -> 740.90kb (2.53%)
/web/.storybook/story-assets/tshirt/all-over-print-womens-crew-neck-t-shirt-white-back-6087418b62aa4.png -- 530.18kb -> 524.45kb (1.08%)
/web/stories/assets/mocks/fediauth-modal.png -- 76.13kb -> 75.33kb (1.05%)
/web/.storybook/story-assets/tshirt/all-over-print-mens-crew-neck-t-shirt-white-back-60873dde523ae.png -- 604.79kb -> 598.44kb (1.05%)
/web/.storybook/story-assets/tshirt/all-over-print-mens-crew-neck-t-shirt-white-front-60873dde52064.png -- 689.60kb -> 682.66kb (1.01%)
/web/stories/assets/mocks/indieauth-modal.png -- 97.92kb -> 96.98kb (0.96%)
/web/.storybook/story-assets/tshirt/all-over-print-womens-crew-neck-t-shirt-white-front-6087418b62878.png -- 533.18kb -> 528.58kb (0.86%)
/web/stories/assets/mocks/followers-tab.png -- 145.22kb -> 143.97kb (0.86%)
/web/.storybook/story-assets/tshirt/all-over-print-womens-crew-neck-t-shirt-white-right-6087418b62c88.png -- 459.98kb -> 456.04kb (0.86%)
/static/img/emoji/blob/blobscream.png -- 11.65kb -> 11.55kb (0.82%)
/web/.storybook/story-assets/tshirt/all-over-print-mens-crew-neck-t-shirt-white-back-60873dde524ca.png -- 612.37kb -> 607.37kb (0.82%)
/web/.storybook/story-assets/tshirt/all-over-print-womens-crew-neck-t-shirt-white-left-6087418b62b91.png -- 501.58kb -> 497.80kb (0.75%)
/static/img/emoji/blob/ablobparty.gif -- 254.34kb -> 252.42kb (0.75%)
/web/.storybook/story-assets/tshirt/all-over-print-mens-crew-neck-t-shirt-white-right-60873dde52184.png -- 481.94kb -> 478.58kb (0.7%)
/web/stories/assets/mocks/single-follower.png -- 51.88kb -> 51.54kb (0.65%)
/web/.storybook/story-assets/tshirt/all-over-print-mens-crew-neck-t-shirt-white-left-60873dde525e2.png -- 597.15kb -> 593.50kb (0.61%)
/static/img/emoji/mutant/grumpy_block.svg -- 1.01kb -> 1.01kb (0.29%)
/static/img/emoji/mutant/tennis.svg -- 1.02kb -> 1.01kb (0.29%)
/static/img/emoji/mutant/studio_microphone.svg -- 1.17kb -> 1.17kb (0.25%)
/static/img/emoji/mutant/eye.svg -- 1.43kb -> 1.43kb (0.2%)
/static/img/emoji/mutant/singer.svg -- 2.92kb -> 2.92kb (0.17%)
/static/img/emoji/mutant/technologist.svg -- 3.08kb -> 3.08kb (0.16%)
/static/img/emoji/mutant/softball.svg -- 2.30kb -> 2.30kb (0.13%)
/static/img/emoji/mutant/8_ball.svg -- 1.75kb -> 1.75kb (0.11%)
/static/img/emoji/mutant/football.svg -- 1.93kb -> 1.92kb (0.1%)
/static/img/emoji/mutant/jack_o_lantern.svg -- 1.99kb -> 1.98kb (0.1%)
/static/img/emoji/mutant/cat_kiss.svg -- 3.37kb -> 3.37kb (0.09%)
/static/img/emoji/mutant/blep.svg -- 3.43kb -> 3.43kb (0.09%)
/static/img/emoji/mutant/cat_pouting.svg -- 3.69kb -> 3.69kb (0.08%)
/static/img/emoji/mutant/student.svg -- 2.47kb -> 2.47kb (0.08%)
/static/img/emoji/mutant/cat_grin.svg -- 3.74kb -> 3.74kb (0.08%)
/static/img/emoji/mutant/cat_heart_eyes.svg -- 3.81kb -> 3.81kb (0.08%)
/static/img/emoji/mutant/cat_devious.svg -- 3.87kb -> 3.87kb (0.08%)
/static/img/emoji/mutant/skull.svg -- 2.58kb -> 2.58kb (0.08%)
/static/img/emoji/mutant/cat_crying.svg -- 4.19kb -> 4.19kb (0.07%)
/static/img/emoji/mutant/cat_joy.svg -- 4.21kb -> 4.21kb (0.07%)
/static/img/emoji/mutant/cat_smile.svg -- 4.25kb -> 4.25kb (0.07%)
/static/img/emoji/mutant/office_worker.svg -- 3.00kb -> 3.00kb (0.07%)
/static/img/emoji/mutant/chef.svg -- 3.09kb -> 3.09kb (0.06%)
/static/img/emoji/mutant/cat_scream.svg -- 4.93kb -> 4.93kb (0.06%)
/static/img/emoji/mutant/astronaut.svg -- 3.40kb -> 3.40kb (0.06%)
/static/img/emoji/mutant/artist.svg -- 3.66kb -> 3.65kb (0.05%)
/static/img/emoji/mutant/skull_and_crossbones.svg -- 5.04kb -> 5.04kb (0.04%)
/static/img/emoji/mutant/detective.svg -- 5.35kb -> 5.35kb (0.04%)

Signed-off-by: ImgBotApp <ImgBotHelp@gmail.com>
Co-authored-by: ImgBotApp <ImgBotHelp@gmail.com>
2023-01-31 09:12:51 -08:00
Gabe Kangas
9877d115ee
Update how the player resizes to fit. Closes #2360 2023-01-29 17:10:44 -08:00
Gabe Kangas
fb4b0a56cc
Fix player sizing in different viewports. Closes #2360 2023-01-28 18:16:31 -08:00
Gabe Kangas
e6be36af31
Add aria-label to player settings button. For #1826 2023-01-23 19:36:28 -08:00
Gabe Kangas
24f6bb1ea5
Add aria-title attribute to video player. For #1826 2023-01-23 19:28:32 -08:00
Gabe Kangas
cdaae66e94
Add skip links for content, player and footer. For #1826 2023-01-21 23:22:28 -08:00
Gabe Kangas
f725bc28f4
Make the player fit the full width but content stay the same. For #2360 2023-01-21 12:50:36 -08:00
Michael David Kuckuk
2f2300db8d
Add initiallyMuted query parameter to embed player (#2539)
* Add query param to initially mute embed player

* Add stories for embed player

* Improve VideoJS typing
2022-12-31 16:08:54 -08:00
Gabe Kangas
9ed14ca73f
Refactor player button to fix Safari issues. Closes #2440 2022-12-15 21:28:09 -08:00
Gabe Kangas
4eb25e3509
Remove log message 2022-11-20 13:27:42 -08:00
Gabe Kangas
d0cc0d8e56
Play around with sizing and placement of player. For #2204 and #2303 2022-11-19 13:35:37 -08:00
Gabe Kangas
62c556aa2a
Add video playlist cachebuster. Closes #2349 2022-11-17 22:10:53 -08:00
Gabe Kangas
9ca012cc8b
Fix settings items not being returned 2022-11-12 23:42:33 -08:00
Gabe Kangas
ac32e691a0
Fix some playery errors and layout issues 2022-11-12 23:36:00 -08:00
Gabe Kangas
d81b6803d2
Settings items text color 2022-11-12 23:35:59 -08:00
Gabe Kangas
00dc8c6802
Use updated MenuButton creation 2022-11-12 23:35:59 -08:00
t1enne
917248fc5b moved footer to layout. changed some css 2022-10-22 10:46:17 +02:00
Gabe Kangas
27565c2b02
Show play button on player pause. Closes #2206 2022-10-12 19:24:41 -07:00
Gabe Kangas
d40e66b7ef
Stop playback metrics on player unmount 2022-10-12 19:15:47 -07:00
Gabe Kangas
88bb8336f3
Fix player not staying inline on iOS. Closes #2097 2022-10-12 17:53:37 -07:00
Gabe Kangas
23b5468ed4
Fix error thrown by player after player is unmounted 2022-10-08 17:51:17 -07:00
Gabe Kangas
6773fc37a5
Fix space bar moving page. Closes #2110 2022-10-08 17:15:19 -07:00
Gabe Kangas
ded47a0c25
Make live indicator use our theme colors. For #1899 2022-10-08 16:51:49 -07:00
Cleo John
34f35974e0
Change Airplay to SVG and refactor (#2156)
* Replaced airplay.png with airplay.svg

* Refactor VideoJS.scss to propper scss syntax

* Fix for the messup I made during the refactor

* fix airplay size

* hotfix fixed aircast styling
2022-10-06 18:57:49 -07:00
James Young
d1f3fffe2f
reafctor: normalize component formatting (#2082)
* refactor: move/rename BanUserButton file

* refactor: move/rename Chart file

* refactor: update generic component filenames to PascalCase

* refactor: update config component filenames to PascalCase

* refactor: update AdminLayout component filename to PascalCase

* refactor: update/move VideoJS component

* chore(eslint): disable bad react/require-default-props rule

* refactor: normalize ActionButton component

* refactor: normalize ActionButtonRow component

* refactor: normalize FollowButton component

* refactor: normalize NotifyButton component

* refactor: normalize ChatActionMessage component

* refactor: normalize ChatContainer component

* refactor: normalize ChatJoinMessage component

* refactor: normalize ChatModerationActionMenu component

* refactor: normalize ChatModerationDetailsModal component

* refactor: normalize ChatModeratorNotification component

* refactor: normalize ChatSocialMessage component

* refactor: normalize ChatSystemMessage component

* refactor: normalize ChatTextField component

* refactor: normalize ChatUserBadge component

* refactor: normalize ChatUserMessage component

* refactor: normalize ContentHeader component

* refactor: normalize OwncastLogo component

* refactor: normalize UserDropdown component

* chore(eslint): modify react/function-component-definition rule

* refactor: normalize CodecSelector component

* refactor: update a bunch of functional components using eslint

* refactor: update a bunch of functional components using eslint, pt2

* refactor: update a bunch of functional components using eslint, pt3

* refactor: replace all component->component default imports with named imports

* refactor: replace all component-stories->component default imports with named imports

* refactor: remove default exports from most components

* chore(eslint): add eslint config files for the components and pages dirs

* fix: use-before-define error in ChatContainer

* Fix ChatContainer import

* Only process .tsx files in Next builds

Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2022-09-07 00:00:28 -07:00
James Young
5ebbbb8bf2
refactor(stories): co-locate stories with components (#2078)
* refactor: move ActionButton component

* refactor: move BanUserButton component

* refactor: move ChatActionMessage component

* refactor: move ChatContainer component

* refactor: move AuthModal component

* refactor: move BrowserNotifyModal component

* refactor: move ChatUserMessage component

* refactor: move ChatJoinMessage component

* refactor: move ChatTextField component

* refactor: move ChatUserBadge component

* refactor: move FollowerCollection and SingleFollower components

* fix: bad import path

* refactor: move FollowModal component

* refactor: move Modal component

* refactor: move ContentHeader component

* refactor: move ChatSystemMessage component

* refactor: move Header component

* refactor: move Footer component

* refactor: move StatusBar component

* refactor: move OfflineBanner component

* refactor: move OwncastPlayer component

* refactor: move IndieAuthModal component

* refactor: move SocialLinks component

* refactor: move VideoPoster component

* refactor: move FollowModal component

* refactor: move FediAuthModal.tsx component

* refactor: move UserDropdown component

* refactor: move ChatSocialMessage component

* refactor: move Logo component

* refactor: move NotifyReminderPopup component

* refactor: move NameChangeModal component

* refactor: move FatalErrorStateModal component

* refactor: move ChatModeratorNotification component

* refactor: move ChatModerationActionMenu and ChatModerationDetailsModal components

* refactor: move CustomPageContent component

* refactor: move storybook Introduction file

* refactor: update storybook story import path

* refactor: move storybook preview styles

* refactor: move storybook doc pages

* refactor: move Color and ImageAsset components

* fix: bad import path

* fix: bad import path in story file
2022-09-03 11:38:52 -07:00
gingervitis
d5fa81f76e
Draft: rough-ish draft of proposed color theme changes (#2067)
* color experimentation and troubleshooting

* create color scheme, assign colors, more ant overrides

* fun selection color

* Prettified Code!

* Correctly import opensans

* Prettified Code!

* Organize+standardize colors/names and update the app to use them

* Prettified Code!

* Use css var references instead of resolving value of vars in css files

* Prettified Code!

Co-authored-by: gingervitis <gingervitis@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
Co-authored-by: gabek <gabek@users.noreply.github.com>
2022-08-29 23:17:12 -07:00
Gabe Kangas
75b90179b8
Experiment with some custom player styling. For #1899 2022-08-18 19:59:17 -07:00
Gabe Kangas
6ee2866260
Handle player being removed 2022-07-12 14:30:21 -07:00
Gabe Kangas
255585cd9f
Update components to use the new style/color names 2022-07-10 16:45:19 -07:00
t1enne
efbe6907ac Reworked mobile UI for some components 2022-07-08 22:20:22 +02:00
t1enne
ffc73f2760 Added chat tab on mobile layouts and other changes to mobile UI 2022-07-08 09:10:18 +02:00
t1enne
d12712a107 Changed chat behaviour
added recoil value isMobile to determine which chat to display and
style. #1978

changed the player to actually span across the viewport without the
black borders around it.
2022-07-03 12:36:30 +02:00
Gabe Kangas
3c43db4d86
Make video poster fill player and not use the logo. For #1857 2022-06-29 14:01:41 -07:00
Gabe Kangas
0c439ccba4
Add AirPlay support to player. Closes #1963 2022-06-21 15:38:37 -07:00
Gabe Kangas
8624358dde
Add latency compensator to player. Closes #1931 2022-06-19 21:23:26 -07:00
Gabe Kangas
1dbeac422f
Add player settings menu. Closes #1932 2022-06-19 13:49:42 -07:00
Gabe Kangas
221b9c8f0f
Add playback performance metrics. Closes #1930 2022-06-02 14:34:32 -07:00
Gabe Kangas
04597908a5
Add keyboard shortcuts for player controls. For #1892 2022-06-02 13:50:16 -07:00
Gabe Kangas
da0a2f5f5d
Fix play button z-index + add basic player theme 2022-05-26 21:44:54 -07:00
Gabe Kangas
1d213b71d4
Support changing your own name and handling name change events 2022-05-26 13:52:04 -07:00
Gabe Kangas
7b1667bf6a
Refactor app state to be a state machine with access selectors 2022-05-25 21:47:09 -07:00
Gabe Kangas
72c01e1b9a
Fix web project build errors 2022-05-11 23:31:31 -07:00
Gabe Kangas
ff6886575f
Add player poster 2022-05-10 15:36:09 -07:00
Gabe Kangas
d6e0b55337
Missing file 2022-05-09 13:06:17 -07:00
Gabe Kangas
97762c17b0
Add viewer ping + volume saving to player 2022-05-08 23:42:40 -07:00
Gabe Kangas
f835ae5086
Add action buttons and status bar 2022-05-07 16:13:06 -07:00
Gabe Kangas
448c23d097
Use some style values so it looks like this page is making progress 2022-05-07 10:25:04 -07:00