* Improve touch input on dash quality selector
- Add `touchstart` event to quality button which toggles the `vjs-lock-showing` class used on other quality selectors
- Call `this.handleClick` from touchstart (fixes issue with `e.target` not being correct)
MarmadileManteater/FreeTubeCordova#239
* Hide the dash quality selector on `focusout`
* Use `classList.*` methods over manually editing the attributes
* De-duplicate code
* Add back line break
* Allow scroll on dash quality selector when screen is narrow
* Use flag to determine if user is scrolling or tapping
* hide the quality selector on select
(just like the other quality selectors do on mobile)
* Split view count and published date into two lines on small displays
* Add blank line
Co-authored-by: PikachuEXE <git@pikachuexe.net>
* Add blank line back
---------
Co-authored-by: PikachuEXE <git@pikachuexe.net>
* Set share playlist dropdown position to `center` w/ media query
* Remove overflow-y as it causes the overflow issue
Originally, when this overflow-y was added, the share playlist dropdown went straight down, so there would no need for the content to be able to overflow in the y direction. (FreeTubeApp/FreeTube#2281)
Now, the dropdown swings out to the left by default, and even when it is centered, it still overflows the width of the container as an intentional part of the design.
* Remove unnecessary whitespace
* Wrap long one word channel names in `infoLine`
* Set height of playlist section to auto on small devices to prevent overflow
* Center videoThumbnail in playlist sidebar to visually be the same as playlist view
* Move CSS changes closer together
* Fix `proxyVideos` setting for legacy formats & hls urls
- Replace the hostname of stream urls with the current invidious instance when `proxyVideos` is true
- Add `local` flag to iv hls URLs when proxy videos is true
* Add missing `proxyVideos` getter in `ft-video-player`
* Move change of URI to before `getProxyVideos`
* Create `getChannelInstanceLocal` function
which allows channel instances for the local API
to be set within the community posts fallback
* Remove channel variable in `getChanneLocal`
* Switch playlist fallback to calling `getChannelPlaylistsLocal`
* Prevent accidentally refetching channel instance from Local API
* Add fallback for fetching more channel videos through invidious
similar to the fallback for playlists
* Use existing `getLocalChannel` instead of creating a new function
* Prevent overflow on playlist view on small 📱displays
* Prevent transition of width on `.thumbnailImage`
* Expand styles to be responsive at more widths
* Adjust side-nav-more-options to account for `a` styles
- These nav-options were changed from `div`s to anchors, and so,
they need to be styled like the `div`s that used to be there.
* Use `inherit` instead of white
v-if="showResult(data)" evaluates once
v-if="showResult" is reactive;
`data` also doesn't need to be passed here
because it is already accessible from `this`.
* Add wrapper in `ft-input` to correct absolute pos
Previously, the action icon was absolutely positioned
to the relative `ft-input-component`; however,
when the label wrapped (on small displays), the height of the
ft-input-component changed, and the icon would overflow
the bottom of the component. Now, it should be absolutely
positioned to the relative `inputWrapper` which
begins with the top of the input element, and thus, it should
not change position based on the height of the label making it
easier to ensure it is in the right position.
* Modify wrapper to not interfere with existing components
* Make ft-input-tags `width: 100%` on small displays
There isn't a lot of screen real estate on small displays, so
this component should just expand to fill it instead of crunching
in on itself.
* Modify media queries to use more standard breakpoint
# Conflicts:
# src/renderer/components/ft-input/ft-input.css
* Hide line-break in distraction-settings on small displays
* Fix lint issue by removing self-close from `br`
It defaults to `false`. This should prevent users with
multiple displays from running into issues when they
drag the window from a portrait display to a landscape
display too quickly.
* 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>
* Implement `getRegionData` in web
- Adjust __dirname to be a more sensible value
- Add `process.env.GEOLOCATION_NAMES` for web builds to avoid having
to blindly try and fetch
* Reverting webpack changes
* Change `indexOf` to `includes`
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
* Adding a new helper `createWebURL`
It takes a given path to a resource, and it returns an
easily fetch-able absolute path
* Using `createWebUrl` inside of the locale fetch
* Using `createWebURL` inside of `getRegionData`
* Removing an unnecessary leftover import
* Wait, no I was mistaken
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
* Implementing the web callback for `showSaveDialog`
Using the native filesystem API when it is available
* Adding the `writeFileFromDialog` function
It normalizes the behavior of writing to a file handle
given by a file picker between web and electron
* Refactoring `exportFreeTubeSubscriptions`
Now, it should use the profile data stored in memory
rather than reading it from the file system (which may not
be present in web browsers), and it should also work in web
builds
* Refactoring exportYouTubeSubscriptions
Using the `writeFileFromDialog` function instead of `fs`
* Refactoring the rest of the subscription exports
Using the `writeFileFromDialog` function instead of `fs`
* Refactoring exportHistory
- Using the historyCache stored in memory instead of
reading from `fs` to get the history data
- Using `writeFileFromDialog` instead of `fs.writeFile`
* Refactoring exportPlaylists
Using `writeFileFromDialog` instead of `fs`
* Removing no longer needed `fs` import
* Removing something I was using to debug
* Fixing issue with mime types non populating in save picker
* Adding back an unintentionally removed line
Previously, only settings which have a user defined value would
be iterated on in this loop. Now, all settings that have a user defined
value or that have side effects will be iterated. This is important because
`currentLocale`'s side effect handler contains a call to `getRegionData`,
and if this side effect handler is never called, the `Region for Trending`
option in settings will never populate.
* Adding ytpl and ytsr as externals in web.config
This should get rid of those two warnings that were
showing up on web builds
* Reducing discrepancies between dev and prod in web builds
* Removing a line which would prevent hot reloading
`this.locales` is retained between hot reloads, so it shouldn't
be set to `null`.
* Adding a new flag to the dev runner
Adding a new command: `run dev:web`
* Running `loadLocale` in development web builds
* Adding a line back which was removed
* Removing a line which was added
* Adding two additional checks to the instance filter
- Checking if the instance supports the api at all
- Checking if the instance supports cors in web environments
* Removing instances without API from instances json
* Modifying the hardcoded fallbacks
* Removing a `width:auto` which was overriding
the width for a lot of .select-text
* Making the general-settings component not overflow
* Reducing margin in settings when window is narrow
* Moving invidious instance tooltip to reduce overflow
* Reducing the width of sliders to be 100% at maximum
Before this change, the preset width `380px` could easily
be wider than the window.
* Reducing overflow in Theme Settings
- Added breakpoint for theme `select`s
- Added breakpoint for the UI scale slider
* Reducing the remaining overflow in settings
This moves all of the tooltips slightly to the left
when the window is narrow to reduce overflow.
* Expanding the sponsorblock settings to full width
* Moving remaining tooltips into a fixed zone
* Floating the tooltip icon to the right
When the display is narrow, the tooltip
can sometimes overflow, and it is very
difficult to predict how it will overflow
if the tool tip icon comes directly after
a locale string.
This change floats those icons into a
centralized location where the tooltip
can be guaranteed to not overflow.
* Removing some irrelevant changes
* Reducing margin on switches
* Removing bottom margin on the last section
* Making room for overflow ellipsis
* Adding class `.containsTooltip` to `ft-toggle`
This should make is easier to style the toggles
which contain tooltips specficially.
* Modifying the media query for tooltips
* Adding a media query to reduce data settings margin
`.href` is computed from the real value of the attribute,
and this was causing an issue where isExternalLink would
classify links that should not be external links as external links.
- 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.
* Adding an import for setImmediate
`setImmediate` is a global in node, but
it is technically from the `timers` module,
and it is not global in web.
* Replacing node specific call to `setImmediate`
`setTimeout` is available globally in both node and web
* Making `pack:web` work
* Removing unnecessary extra line
* Ran `yarn install` to update the lock file
* I'm pretty sure that my lockfile was dirty
* Fixing an incorrect dependency resolution
`buffer` doesn't have to be included through browserify
* Formatting the locales pathname to be more accurate
Before this change, the URL would refer
`https://localhost//static/locales/${locale}.json`
which technically works in most web browsers,
but it does not work in Cordova at all, so this
changes the links to be more accurately:
`https://localhost/static/locales/${locale}.json`
* Removing usage of `path` because it requires a polyfill/shim
* Linting the code
* Hiding "smooth-scroll" setting when not electron
- This feature requires the restart of electron and
doesn't work in web builds.
* Removing this comment
- A safeguard was added
- This function won't be called unless IS_ELECTRON is true
- Expanded the fall-back to catch edge
cases where the instance list returns a
completely valid response of [] (an other-
wise useless response which doesn't throw
an error).
* Implementing the open file dialog in web
- Adding a new function to make loading files
from a dialog box easier in both web and electron
* Canceled should always be false
onchange is only triggered when the file picker
has a file path. If the user cancels, this function
is never called.
* Changing from `function ()` to `() => {`
* Adding a try around processing the history import
* Moving the try-catch to a smaller section
* Adding a listener to when the file picker is closed
* Fixing the grammar on my comment
* Refactoring playlist imports to use readFileFromDialog
* Refactoring handleFreetubeImportFile to use readFileFromDialog
* Refactoring handleYoutubeCsvImportFile to use readFileFromDialog
* Refactoring handleYoutubeImportFile to use readFileFromDialog
* Refactoring importOpmlYoutubeSubscriptions to use readFileFromDialog
* Refactoring importNewPipeSubscriptions to use readFileFromDialog
* Added a check
to prevent resolve from being called multiple times
* Moving the call to removeEventListener
to prevent this event from being triggered twice
* Adding extensions to the web file picker
* Hiding `Check for legacy subscriptions` in web
* Adding comments for better readability
* Correcting my vue syntax
* Added a copyToClipboard function to utils
This should make it easier to handle errors which
result from the clipboard API (which are more likely
in web builds). This should also make it easier to handle
copying to clipboard in cordova builds by abstracting the
platform specific code out of the views and moving it
all into one function.
* Moved the $t function out of utils
* Removing locale snippets I was using and am not now
* Added function comment to copyToClipboard
* Adding some missing references
* Adding an additional check
* Re-reviewing my changes, I found a mistake
* Update src/renderer/store/modules/utils.js
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
* Update static/locales/en-US.yaml
Co-authored-by: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com>
* Reverting the language back to what it was previously
* Switching to using i18n.t()
instead of handling the translations myself.
Also, it looks like eslint removed a tab.
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
Co-authored-by: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com>
* Applying a workaround for localization issue
This changes where the title comes from on the response object from ytdl.
This is related to FreeTubeApp#2530.
* Applying the same workaround on the description
* Added a fallback to videoDetails
* Adding a console error to the title try block
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
* Simplifying a loop to Array.join
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
* Adding a console error to the description try block
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
* Add a map for the description lines
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
* Added a question mark operator for descriptions
This should prevent errors from erroneously being thrown on videos
which have a blank description. If the description is undefined or does
not contain a 'runs' field, the resulting descriptionLines should be
and empty array. Then, videoDescription will be an empty string.
* Each line already contains a `\n`
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
the seconds length value provided by the API
rather than trying to pull the time from the video
element. This is related to FreeTubeApp#2492 and
MarmadileManteater#9.
Added a line to map the field "authorId" to "channelId"
on the featured channels that come from the Invidious API
because the Channel view expects related channels to have
the property "channelId". This is related to FreeTubeApp#2481.