Commit Graph

33 Commits

Author SHA1 Message Date
Jason 23f1618fcb
Add back 3 Stylelint configs (#4350)
* Add back @double-great/stylelint-a11y Stylelint plugin

Notably, we choose to not use the 'a11y/no-outline-none' rule. The reason for this being that our focus ring suffices for almost every use case (https://www.w3.org/WAI/WCAG22/Understanding/focus-appearance-minimum), and using the same hover and focus styling can be considered bad design in many cases. YT goes the direction of foregoing the focus ring for many of its components and choosing a barely darker color than its :hover for :focus styling, which is controversial. Accessibility-wise, at the very least, using the same hover and focus styling can be confusing, especially for sighted users who use keyboard navigation.

* Add back stylelint-config-sass-guidelines

* Add back stylelint-config-standard

* Satisfy media-prefers-reduced-motion a11y rule

This is not recognized as a fix by the rule due to its limited detection logic, so this rule is not being imported directly.

* Remove duplicate code

* Implement linting fixes

* Implement _ft-list-item.scss linting fixes excluding no-descending-specificity

Properly implementing the no-descending-specificity rule in this file seems to utterly destroy the styling. This would be its own entire initiative to unravel.

* Restart from scratch modifications of _ft-list-item.scss

* Resolve styling discrepancies introduced with ft-list-channel and ft-tooltip
2024-04-17 19:49:37 +02:00
Jason 665da2c1c3
Make certain controls non-selectable / non-draggable (#3947)
* Make settings heading text unselectable

I often encounter the issue of accidentally selecting/highlighting the settings heading text, which ends up highlighting all of the text inside of that settings tab. This is an unpleasant appearance that I have to click to remove. This change removes this issue altogether.

* Switch all instances of user-select to be only user-select and -webkit-user-select

* Make side-nav labels unselectable

* Make side-nav and channels un-draggable

* Remove selection from ft-flex-box, ft-input placeholders, and profile icons
2023-08-27 08:46:19 +08:00
Benjababe 08f8b2768a
Add updated video resolution to auto selector (#3935)
* CSS updates

* Include resolution to 'auto' in quality display

* Include auto info in video statistics

* Value integrity check in CreateDashQualitySelector
2023-08-26 18:20:55 +02:00
Emma e43fb94a35
Improving touch input by bringing in `videojs-mobile-ui` (#2719)
* Adding videojs-mobile-ui as a dependency

- Using the beta because it fixes an issue
with multiple version of videojs loading
at once.

This is related to MarmadileManteater#56.

* Mapping defaultSkipInterval to seekSeconds

* Adding CSS to prevent showing duplicate buttons

- Added a new variable `usingTouch` to selectively hide
the existing `vjs-big-play-button` when the `touch-overlay`
is visible.

* Renaming CSS class to something more specific

* Adding text-shadow behind play / pause button

This should make it more visually distinct against a
light or colorful background.

* Enabling touch-overlay anytime a touch is detected

Disabling it whenever mouse input is detected

The default behavior of `videojs-mobile-ui` is to
only work in Android and iOS, but by
forcing the touch behavior to be enabled and selectively
showing it only when touch input is detected, it should work
on any device with touch input even if the browser doesn't
detect that it is running in Android or iOS.

* Removing unnecessary code

* Removing unintentionally leftover variable

* Removing an unnecessary assignment

Adding comments to explain why a flag called
`forceForTesting` is set to true

Disabling the `lockOnRotate` flag.

* Moving this flag and wrapper class

* Adding whitespace

* Making my comment a little more consistent

* Changing the punctuation of a comment

* Adjusting the CSS to fix a firefox discrepancy

* Adding a check for mobile firefox

For whatever reason, mobile firefox sometimes
triggers onmouseover when a touch occurs, and this
is unwanted behavior.

* Adding a drop-shadow to the ff and rw icons

This should make them easier to see on top of light
videos

* Hiding the mobile play button according to setting

- Added CSS to hide the videojs-mobile-ui play button
when the `Display Play Button In Video Player` setting is disabled.

* Replacing long computed string with class binding

Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>

* Adding newline at the end of videoJS.css

Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
2022-10-24 13:49:52 -04:00
Emma ec00ee3c04
Hiding two vjs controls when the screen is narrow (#2688)
- If picture and picture is disabled, the control can be hidden
when the available screen real estate is small.
- If the width is under 680, the video is already
almost the width of the entire window, so it makes sense
to hide it.
2022-10-08 22:35:28 +02:00
absidue f4aff3964b
Fix emojis displaying incorrectly (#2327) 2022-06-19 16:44:24 -04:00
bob1520 ddce28e586
Feature: Screenshot of video (#2221)
* screenshot

* player settings, jpg & default "pictures" folder

* filename pattern

* folder placeholder update

* remove duplicate action

* update: won't save invalid pattern

* Ask for folder, toggle screenshot, modal showSaveDialog & button unfocus

* useModal
2022-05-30 15:24:34 +02:00
neko 147ebde76b
Fix thumbnail being obstructed by time tooltip (#2078)
* Fix thumbnail being obstructed by time tooltip

* Update src/renderer/videoJS.css

Co-authored-by: PikachuEXE <pikachuexe@gmail.com>

Co-authored-by: PikachuEXE <pikachuexe@gmail.com>
2022-02-21 14:11:42 +00:00
Preston cd574be4e7 Stats for nerds cleanup and fix linter errors 2022-02-19 17:17:58 -05:00
PrestonN fde06914b5 Fix issue where playback rate button would disrupt the player layout 2021-10-12 17:04:03 -04:00
Jason f801ea4b05
Integrate theater mode into mediaplayer (#1589)
* Moves theatre mode button to mediaplayer

* Accounts for 'Enable Theatre Mode by Default'

* Removes unnecessary comment

* Removes unnecessary newlines

* Rename variable for toggle theatre mode button

* Fix issue caused by missing change in rename

Co-authored-by: Preston <freetubeapp@protonmail.com>
Co-authored-by: PikachuEXE <pikachuexe@gmail.com>
2021-08-24 07:36:10 +00:00
Preston e52223c7c5 Hide volume percentage on hover 2021-05-16 21:43:34 -04:00
Preston 176d81dd6b Fix quality logic again 2021-05-15 15:08:41 -04:00
Preston 689479eb21 Channel Fixes and finish quality change logic 2021-04-30 17:18:45 -04:00
PikachuEXE 7d93217596
* Update player to hide full window button when in full screen mode (#1222) 2021-04-22 20:41:50 +02:00
Preston e0a3ef92c6 Test custom solution for quality change 2021-03-12 16:09:08 -05:00
Preston 7be4bf28f2 Create Loop Button and functionality in video player 2021-01-12 22:56:31 -05:00
Airradda f2f3274ea3
Reorder and resize playback rate menu (#854)
Reorder playback rate from 3->0.25 to 0.25->3 and resize to include an additional visible playback rate (0.25->1.5)
2020-12-15 15:09:49 -05:00
CristianMartin ad8ed9fdb0
Windowed FullScreen (#829)
* add functionality in fl-video-player and styles in videoJS.css, with the aim of having a full window button in the video player

Signed-off-by: CristianMartin <c.knoxville8@gmail.com>

* fixed up interposition with full screen

Signed-off-by: CristianMartin <c.knoxville8@gmail.com>

* incorporation of styles for the full window button, and general refactor of the functional code of the button in the ft-video-player.js class

Signed-off-by: CristianMartin <c.knoxville8@gmail.com>

* Incorporation of the icons for the full window button in the path src/renderer/assets/img/, incorporation of the icons to the css and style refactor in the code of the functionality window for the complete button

Signed-off-by: CristianMartin <c.knoxville8@gmail.com>

* final bug fix with npm run lint-fix and test run

Signed-off-by: CristianMartin <c.knoxville8@gmail.com>

* Update ft-video-player.js

 Code refactor according to the suggestions of change in the extraction, modification of the position of the buttons of fullscreen and fullwindow as suggested.

* lint error repair

* Update videoJS.css

incorporation of css styles to correctly center the icon of the new fullwindow button
2020-12-14 17:37:58 -05:00
Duane Jaspers 2c71dedb06
fix for subtitle settings values not showing up (#801) 2020-12-02 13:04:24 -05:00
TDDR 79a1555e2c
Finiashed adding overlay that displays title (#789) 2020-11-15 14:13:18 -05:00
Preston 407449ac65 Move hovered elements above static timestamp 2020-10-15 11:30:21 -04:00
Preston e2e56d63de Update video player styling 2020-08-17 17:55:50 -04:00
Cadence Ember 0fc5a40ce9
Fix subs and speed adjustment controls z-index 2020-06-19 03:37:44 +12:00
Cadence Ember 53415ba78c
Adjust video control icon sizes 2020-06-18 03:24:24 +12:00
Cadence Ember aa417030d5
Fix video controls alignment \o/ 2020-06-18 02:57:16 +12:00
Cadence Ember eb97868465
Fix videoJS progress bar hover flicker 2020-06-17 04:50:23 +12:00
Preston 6c3539943b Show icons in build and remove unused items. 2020-05-27 22:48:41 -04:00
Preston 8980dc74d2 Add full playlist functionality (Shuffle, loop, autoplay) 2020-05-17 16:12:58 -04:00
Preston 4728d38df0 Re-add Rootstate to Vuex Action and adjust position of video duration 2020-03-01 14:44:19 -05:00
Preston 77e7168c73 Full Theme Support and More Settings are Functional 2020-02-29 22:37:02 -05:00
Preston 4dc8eab9b8 Work on video player to support dash and other features
Theatre Mode
Captions
Storyboards
2020-02-18 15:59:01 -05:00
Preston ded6534d16 Push Latest Code to Repository 2020-02-16 13:30:00 -05:00