mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-08-14 23:57:27 +00:00
Sticky header (#37)
This commit is contained in:
commit
7bbc3ade9b
20 changed files with 424 additions and 494 deletions
623
package-lock.json
generated
623
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -18,7 +18,7 @@
|
|||
"linkify-html": "4.1.3",
|
||||
"linkifyjs": "4.1.3",
|
||||
"qrcode": "^1.5.3",
|
||||
"shaka-player": "4.8.3",
|
||||
"shaka-player": "4.8.4",
|
||||
"vue": "3.4.27",
|
||||
"vue-i18n": "9.13.1",
|
||||
"vue-router": "4.3.2"
|
||||
|
|
105
pnpm-lock.yaml
generated
105
pnpm-lock.yaml
generated
|
@ -27,8 +27,8 @@ dependencies:
|
|||
specifier: ^1.5.3
|
||||
version: 1.5.3
|
||||
shaka-player:
|
||||
specifier: 4.8.3
|
||||
version: 4.8.3
|
||||
specifier: 4.8.4
|
||||
version: 4.8.4
|
||||
vue:
|
||||
specifier: 3.4.27
|
||||
version: 3.4.27(typescript@5.4.5)
|
||||
|
@ -151,7 +151,7 @@ packages:
|
|||
engines: {node: '>=6.9.0'}
|
||||
dependencies:
|
||||
'@babel/highlight': 7.24.5
|
||||
picocolors: 1.0.0
|
||||
picocolors: 1.0.1
|
||||
dev: true
|
||||
|
||||
/@babel/compat-data@7.24.4:
|
||||
|
@ -407,7 +407,7 @@ packages:
|
|||
'@babel/helper-validator-identifier': 7.24.5
|
||||
chalk: 2.4.2
|
||||
js-tokens: 4.0.0
|
||||
picocolors: 1.0.0
|
||||
picocolors: 1.0.1
|
||||
dev: true
|
||||
|
||||
/@babel/parser@7.24.5:
|
||||
|
@ -1289,7 +1289,7 @@ packages:
|
|||
babel-plugin-polyfill-corejs2: 0.4.11(@babel/core@7.24.5)
|
||||
babel-plugin-polyfill-corejs3: 0.10.4(@babel/core@7.24.5)
|
||||
babel-plugin-polyfill-regenerator: 0.6.2(@babel/core@7.24.5)
|
||||
core-js-compat: 3.37.0
|
||||
core-js-compat: 3.37.1
|
||||
semver: 6.3.1
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
|
@ -1726,7 +1726,7 @@ packages:
|
|||
js-yaml: 4.1.0
|
||||
json5: 2.2.3
|
||||
pathe: 1.1.2
|
||||
picocolors: 1.0.0
|
||||
picocolors: 1.0.1
|
||||
source-map-js: 1.2.0
|
||||
unplugin: 1.10.1
|
||||
vue-i18n: 9.13.1(vue@3.4.27)
|
||||
|
@ -2056,29 +2056,25 @@ packages:
|
|||
resolution: {integrity: sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==}
|
||||
dev: true
|
||||
|
||||
/@types/semver@7.5.8:
|
||||
resolution: {integrity: sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==}
|
||||
dev: true
|
||||
|
||||
/@types/trusted-types@2.0.7:
|
||||
resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
|
||||
dev: true
|
||||
|
||||
/@typescript-eslint/scope-manager@7.8.0:
|
||||
resolution: {integrity: sha512-viEmZ1LmwsGcnr85gIq+FCYI7nO90DVbE37/ll51hjv9aG+YZMb4WDE2fyWpUR4O/UrhGRpYXK/XajcGTk2B8g==}
|
||||
/@typescript-eslint/scope-manager@7.9.0:
|
||||
resolution: {integrity: sha512-ZwPK4DeCDxr3GJltRz5iZejPFAAr4Wk3+2WIBaj1L5PYK5RgxExu/Y68FFVclN0y6GGwH8q+KgKRCvaTmFBbgQ==}
|
||||
engines: {node: ^18.18.0 || >=20.0.0}
|
||||
dependencies:
|
||||
'@typescript-eslint/types': 7.8.0
|
||||
'@typescript-eslint/visitor-keys': 7.8.0
|
||||
'@typescript-eslint/types': 7.9.0
|
||||
'@typescript-eslint/visitor-keys': 7.9.0
|
||||
dev: true
|
||||
|
||||
/@typescript-eslint/types@7.8.0:
|
||||
resolution: {integrity: sha512-wf0peJ+ZGlcH+2ZS23aJbOv+ztjeeP8uQ9GgwMJGVLx/Nj9CJt17GWgWWoSmoRVKAX2X+7fzEnAjxdvK2gqCLw==}
|
||||
/@typescript-eslint/types@7.9.0:
|
||||
resolution: {integrity: sha512-oZQD9HEWQanl9UfsbGVcZ2cGaR0YT5476xfWE0oE5kQa2sNK2frxOlkeacLOTh9po4AlUT5rtkGyYM5kew0z5w==}
|
||||
engines: {node: ^18.18.0 || >=20.0.0}
|
||||
dev: true
|
||||
|
||||
/@typescript-eslint/typescript-estree@7.8.0(typescript@5.4.5):
|
||||
resolution: {integrity: sha512-5pfUCOwK5yjPaJQNy44prjCwtr981dO8Qo9J9PwYXZ0MosgAbfEMB008dJ5sNo3+/BN6ytBPuSvXUg9SAqB0dg==}
|
||||
/@typescript-eslint/typescript-estree@7.9.0(typescript@5.4.5):
|
||||
resolution: {integrity: sha512-zBCMCkrb2YjpKV3LA0ZJubtKCDxLttxfdGmwZvTqqWevUPN0FZvSI26FalGFFUZU/9YQK/A4xcQF9o/VVaCKAg==}
|
||||
engines: {node: ^18.18.0 || >=20.0.0}
|
||||
peerDependencies:
|
||||
typescript: '*'
|
||||
|
@ -2086,8 +2082,8 @@ packages:
|
|||
typescript:
|
||||
optional: true
|
||||
dependencies:
|
||||
'@typescript-eslint/types': 7.8.0
|
||||
'@typescript-eslint/visitor-keys': 7.8.0
|
||||
'@typescript-eslint/types': 7.9.0
|
||||
'@typescript-eslint/visitor-keys': 7.9.0
|
||||
debug: 4.3.4
|
||||
globby: 11.1.0
|
||||
is-glob: 4.0.3
|
||||
|
@ -2099,30 +2095,27 @@ packages:
|
|||
- supports-color
|
||||
dev: true
|
||||
|
||||
/@typescript-eslint/utils@7.8.0(eslint@8.57.0)(typescript@5.4.5):
|
||||
resolution: {integrity: sha512-L0yFqOCflVqXxiZyXrDr80lnahQfSOfc9ELAAZ75sqicqp2i36kEZZGuUymHNFoYOqxRT05up760b4iGsl02nQ==}
|
||||
/@typescript-eslint/utils@7.9.0(eslint@8.57.0)(typescript@5.4.5):
|
||||
resolution: {integrity: sha512-5KVRQCzZajmT4Ep+NEgjXCvjuypVvYHUW7RHlXzNPuak2oWpVoD1jf5xCP0dPAuNIchjC7uQyvbdaSTFaLqSdA==}
|
||||
engines: {node: ^18.18.0 || >=20.0.0}
|
||||
peerDependencies:
|
||||
eslint: ^8.56.0
|
||||
dependencies:
|
||||
'@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0)
|
||||
'@types/json-schema': 7.0.15
|
||||
'@types/semver': 7.5.8
|
||||
'@typescript-eslint/scope-manager': 7.8.0
|
||||
'@typescript-eslint/types': 7.8.0
|
||||
'@typescript-eslint/typescript-estree': 7.8.0(typescript@5.4.5)
|
||||
'@typescript-eslint/scope-manager': 7.9.0
|
||||
'@typescript-eslint/types': 7.9.0
|
||||
'@typescript-eslint/typescript-estree': 7.9.0(typescript@5.4.5)
|
||||
eslint: 8.57.0
|
||||
semver: 7.6.2
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
- typescript
|
||||
dev: true
|
||||
|
||||
/@typescript-eslint/visitor-keys@7.8.0:
|
||||
resolution: {integrity: sha512-q4/gibTNBQNA0lGyYQCmWRS5D15n8rXh4QjK3KV+MBPlTYHpfBUT3D3PaPR/HeNiI9W6R7FvlkcGhNyAoP+caA==}
|
||||
/@typescript-eslint/visitor-keys@7.9.0:
|
||||
resolution: {integrity: sha512-iESPx2TNLDNGQLyjKhUvIKprlP49XNEK+MvIf9nIO7ZZaZdbnfWKHnXAgufpxqfA0YryH8XToi4+CjBgVnFTSQ==}
|
||||
engines: {node: ^18.18.0 || >=20.0.0}
|
||||
dependencies:
|
||||
'@typescript-eslint/types': 7.8.0
|
||||
'@typescript-eslint/types': 7.9.0
|
||||
eslint-visitor-keys: 3.4.3
|
||||
dev: true
|
||||
|
||||
|
@ -2195,7 +2188,7 @@ packages:
|
|||
resolution: {integrity: sha512-F3yZza5cqVJudg6YNp4IxaUWK+9vHVXCMyKDbShi4WUY4fdFwc7c/NU20CnO50K4mB+764K06ocXUr2RsMULlA==}
|
||||
engines: {node: '>=14'}
|
||||
dependencies:
|
||||
'@typescript-eslint/utils': 7.8.0(eslint@8.57.0)(typescript@5.4.5)
|
||||
'@typescript-eslint/utils': 7.9.0(eslint@8.57.0)(typescript@5.4.5)
|
||||
'@unocss/config': 0.60.2
|
||||
'@unocss/core': 0.60.2
|
||||
magic-string: 0.30.10
|
||||
|
@ -2381,7 +2374,7 @@ packages:
|
|||
'@babel/preset-env': 7.24.5(@babel/core@7.24.5)
|
||||
browserslist: 4.23.0
|
||||
browserslist-to-esbuild: 2.1.1(browserslist@4.23.0)
|
||||
core-js: 3.37.0
|
||||
core-js: 3.37.1
|
||||
magic-string: 0.30.10
|
||||
regenerator-runtime: 0.14.1
|
||||
systemjs: 6.15.1
|
||||
|
@ -2593,7 +2586,7 @@ packages:
|
|||
dependencies:
|
||||
'@babel/core': 7.24.5
|
||||
'@babel/helper-define-polyfill-provider': 0.6.2(@babel/core@7.24.5)
|
||||
core-js-compat: 3.37.0
|
||||
core-js-compat: 3.37.1
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
dev: true
|
||||
|
@ -2658,10 +2651,10 @@ packages:
|
|||
engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
|
||||
hasBin: true
|
||||
dependencies:
|
||||
caniuse-lite: 1.0.30001617
|
||||
electron-to-chromium: 1.4.763
|
||||
caniuse-lite: 1.0.30001618
|
||||
electron-to-chromium: 1.4.768
|
||||
node-releases: 2.0.14
|
||||
update-browserslist-db: 1.0.15(browserslist@4.23.0)
|
||||
update-browserslist-db: 1.0.16(browserslist@4.23.0)
|
||||
dev: true
|
||||
|
||||
/buffer-from@1.1.2:
|
||||
|
@ -2699,8 +2692,8 @@ packages:
|
|||
engines: {node: '>=6'}
|
||||
dev: false
|
||||
|
||||
/caniuse-lite@1.0.30001617:
|
||||
resolution: {integrity: sha512-mLyjzNI9I+Pix8zwcrpxEbGlfqOkF9kM3ptzmKNw5tizSyYwMe+nGLTqMK9cO+0E+Bh6TsBxNAaHWEM8xwSsmA==}
|
||||
/caniuse-lite@1.0.30001618:
|
||||
resolution: {integrity: sha512-p407+D1tIkDvsEAPS22lJxLQQaG8OTBEqo0KhzfABGk0TU4juBNDSfH0hyAp/HRyx+M8L17z/ltyhxh27FTfQg==}
|
||||
dev: true
|
||||
|
||||
/chalk@2.4.2:
|
||||
|
@ -2792,14 +2785,14 @@ packages:
|
|||
resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
|
||||
dev: true
|
||||
|
||||
/core-js-compat@3.37.0:
|
||||
resolution: {integrity: sha512-vYq4L+T8aS5UuFg4UwDhc7YNRWVeVZwltad9C/jV3R2LgVOpS9BDr7l/WL6BN0dbV3k1XejPTHqqEzJgsa0frA==}
|
||||
/core-js-compat@3.37.1:
|
||||
resolution: {integrity: sha512-9TNiImhKvQqSUkOvk/mMRZzOANTiEVC7WaBNhHcKM7x+/5E1l5NvsysR19zuDQScE8k+kfQXWRN3AtS/eOSHpg==}
|
||||
dependencies:
|
||||
browserslist: 4.23.0
|
||||
dev: true
|
||||
|
||||
/core-js@3.37.0:
|
||||
resolution: {integrity: sha512-fu5vHevQ8ZG4og+LXug8ulUtVxjOcEYvifJr7L5Bfq9GOztVqsKd9/59hUk2ZSbCrS3BqUr3EpaYGIYzq7g3Ug==}
|
||||
/core-js@3.37.1:
|
||||
resolution: {integrity: sha512-Xn6qmxrQZyB0FFY8E3bgRXei3lWDJHhvI+u0q9TKIYM49G8pAr0FgnnrFRAmsbptZL1yxRADVXn+x5AGsbBfyw==}
|
||||
requiresBuild: true
|
||||
dev: true
|
||||
|
||||
|
@ -2953,12 +2946,12 @@ packages:
|
|||
jake: 10.9.1
|
||||
dev: true
|
||||
|
||||
/electron-to-chromium@1.4.763:
|
||||
resolution: {integrity: sha512-k4J8NrtJ9QrvHLRo8Q18OncqBCB7tIUyqxRcJnlonQ0ioHKYB988GcDFF3ZePmnb8eHEopDs/wPHR/iGAFgoUQ==}
|
||||
/electron-to-chromium@1.4.768:
|
||||
resolution: {integrity: sha512-z2U3QcvNuxdkk33YV7R1bVMNq7fL23vq3WfO5BHcqrm4TnDGReouBfYKLEFh5umoK1XACjEwp8mmnhXk2EJigw==}
|
||||
dev: true
|
||||
|
||||
/eme-encryption-scheme-polyfill@2.1.2:
|
||||
resolution: {integrity: sha512-ccDEgbk5+hJbzEDcUkID0chK+vy/pXi1oQIIADGpyYdZThAbLLod7WZKryU32IWmFX4BAWmzZtf4LeUnnNzcQQ==}
|
||||
/eme-encryption-scheme-polyfill@2.1.3:
|
||||
resolution: {integrity: sha512-MLF/qy30Byiay963acUmnCRVYlUnep5C3XjY+XKQR6kmYEEEM/KMf1ZnvmFXwALsxLIYBibziiHneDQObTH7Tw==}
|
||||
dev: false
|
||||
|
||||
/emoji-regex@8.0.0:
|
||||
|
@ -4314,8 +4307,8 @@ packages:
|
|||
resolution: {integrity: sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==}
|
||||
dev: true
|
||||
|
||||
/picocolors@1.0.0:
|
||||
resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
|
||||
/picocolors@1.0.1:
|
||||
resolution: {integrity: sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==}
|
||||
|
||||
/picomatch@2.3.1:
|
||||
resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
|
||||
|
@ -4353,7 +4346,7 @@ packages:
|
|||
engines: {node: ^10 || ^12 || >=14}
|
||||
dependencies:
|
||||
nanoid: 3.3.7
|
||||
picocolors: 1.0.0
|
||||
picocolors: 1.0.1
|
||||
source-map-js: 1.2.0
|
||||
|
||||
/prelude-ls@1.2.1:
|
||||
|
@ -4617,11 +4610,11 @@ packages:
|
|||
has-property-descriptors: 1.0.2
|
||||
dev: true
|
||||
|
||||
/shaka-player@4.8.3:
|
||||
resolution: {integrity: sha512-VTyNNiKZe/hqtcSnRIUZTAwYARFi0CY4nBVSH/5+X+X9yToNaqxoikt0RvhtrtGCWKJNNefd/6QKGBpWLOzb+Q==}
|
||||
/shaka-player@4.8.4:
|
||||
resolution: {integrity: sha512-LtPUioN0/kwLi5ewSFaoSUpQgA01XxaSa7vneCiXP8AMIdIWVM+pk/lFetwW0br26H8Lb79djiU+5vhJujEBjQ==}
|
||||
engines: {node: '>=14'}
|
||||
dependencies:
|
||||
eme-encryption-scheme-polyfill: 2.1.2
|
||||
eme-encryption-scheme-polyfill: 2.1.3
|
||||
dev: false
|
||||
|
||||
/shebang-command@2.0.0:
|
||||
|
@ -5064,15 +5057,15 @@ packages:
|
|||
engines: {node: '>=4'}
|
||||
dev: true
|
||||
|
||||
/update-browserslist-db@1.0.15(browserslist@4.23.0):
|
||||
resolution: {integrity: sha512-K9HWH62x3/EalU1U6sjSZiylm9C8tgq2mSvshZpqc7QE69RaA2qjhkW2HlNA0tFpEbtyFz7HTqbSdN4MSwUodA==}
|
||||
/update-browserslist-db@1.0.16(browserslist@4.23.0):
|
||||
resolution: {integrity: sha512-KVbTxlBYlckhF5wgfyZXTWnMn7MMZjMu9XG8bPlliUOP9ThaF4QnhP8qrjrH7DRzHfSk0oQv1wToW+iA5GajEQ==}
|
||||
hasBin: true
|
||||
peerDependencies:
|
||||
browserslist: '>= 4.21.0'
|
||||
dependencies:
|
||||
browserslist: 4.23.0
|
||||
escalade: 3.1.2
|
||||
picocolors: 1.0.0
|
||||
picocolors: 1.0.1
|
||||
dev: true
|
||||
|
||||
/uri-js@4.4.1:
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<!-- eslint-disable-next-line vue/no-v-html -->
|
||||
<span v-if="showFullText" class="contentText" v-html="fullText()" />
|
||||
<!-- eslint-disable-next-line vue/no-v-html -->
|
||||
<span v-else v-html="colapsedText()" />
|
||||
<span v-else v-html="collapsedText()" />
|
||||
<span v-if="text.length > visibleLimit && !showFullText">...</span>
|
||||
<button
|
||||
v-if="text.length > visibleLimit"
|
||||
|
@ -38,7 +38,7 @@ export default {
|
|||
fullText() {
|
||||
return purifyHTML(rewriteDescription(this.text));
|
||||
},
|
||||
colapsedText() {
|
||||
collapsedText() {
|
||||
return purifyHTML(rewriteDescription(this.text.slice(0, this.visibleLimit)));
|
||||
},
|
||||
},
|
||||
|
|
|
@ -33,8 +33,13 @@
|
|||
<div class="comment-footer my-1 flex items-center gap-3">
|
||||
<div class="i-fa6-solid:thumbs-up" />
|
||||
<span v-text="numberFormat(comment.likeCount)" />
|
||||
<i v-if="comment.hearted" class="i-fa6-solid:heart" />
|
||||
<img v-if="comment.creatorReplied" :src="uploaderAvatarUrl" class="h-5 w-5 rounded-full" />
|
||||
<i v-if="comment.hearted" class="i-fa6-solid:heart" :title="$t('actions.creator_liked')" />
|
||||
<img
|
||||
v-if="comment.creatorReplied"
|
||||
:src="uploaderAvatarUrl"
|
||||
class="h-5 w-5 rounded-full"
|
||||
:title="$t('actions.creator_replied')"
|
||||
/>
|
||||
</div>
|
||||
<template v-if="comment.repliesPage && (!loadingReplies || !showingReplies)">
|
||||
<div class="cursor-pointer" @click="loadReplies">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="flex justify-center">
|
||||
<h1 v-t="'titles.login'" class="my-4 text-center font-bold" />
|
||||
<TooltipIcon class="mb-6" icon="i-fa6-solid:circle-info" :tooltip="$t('info.login_note')" />
|
||||
<i class="i-fa6-solid:circle-info ml-2 mt-6 cursor-pointer" :title="$t('info.login_note')" />
|
||||
</div>
|
||||
<hr />
|
||||
<div class="w-full flex items-center justify-center text-center">
|
||||
|
@ -36,12 +36,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import TooltipIcon from "./TooltipIcon.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
TooltipIcon,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
username: null,
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<nav class="relative w-full flex flex-wrap items-center justify-center px-2 pb-2.5 sm:px-4">
|
||||
<nav class="relative w-full flex flex-wrap items-center justify-center px-2 pb-2.5 sm:px-4 sticky top-0">
|
||||
<div class="flex flex-1 justify-start">
|
||||
<router-link class="flex items-center text-3xl font-bold font-sans" :to="homePagePath"
|
||||
><img
|
||||
|
@ -216,7 +216,7 @@ export default {
|
|||
|
||||
<style>
|
||||
.search-container {
|
||||
@apply relative inline-flex items-center;
|
||||
@apply relative inline-flex items-center sticky top-12;
|
||||
}
|
||||
.delete-search {
|
||||
@apply absolute right-3 cursor-pointer rounded-full bg-[#ccc] w-4 h-4 text-center text-black opacity-50 hover:(opacity-70) text-size-[10px];
|
||||
|
|
|
@ -6,10 +6,10 @@
|
|||
|
||||
<CollapsableText v-if="playlist?.description" :text="playlist.description" />
|
||||
|
||||
<div class="mt-1 flex <md:flex-col md:items-center justify-between">
|
||||
<div class="mt-1 flex justify-between <md:flex-col md:items-center">
|
||||
<div>
|
||||
<router-link class="link flex items-center gap-3" :to="playlist.uploaderUrl || '/'">
|
||||
<img loading="lazy" :src="playlist.uploaderAvatar" class="rounded-full h-12" />
|
||||
<img loading="lazy" :src="playlist.uploaderAvatar" class="h-12 rounded-full" />
|
||||
<strong v-text="playlist.uploader" />
|
||||
</router-link>
|
||||
</div>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="flex justify-center">
|
||||
<h1 v-t="'titles.register'" class="my-4 text-center font-bold" />
|
||||
<TooltipIcon class="mb-6" icon="i-fa6-solid:circle-info" :tooltip="$t('info.register_note')" />
|
||||
<i class="i-fa6-solid:circle-info ml-2 mt-6 cursor-pointer" :title="$t('info.register_note')" />
|
||||
</div>
|
||||
<hr />
|
||||
<div class="flex flex-col items-center justify-center text-center">
|
||||
|
@ -20,7 +20,7 @@
|
|||
<div class="flex justify-center">
|
||||
<input
|
||||
v-model="password"
|
||||
class="input w-full"
|
||||
class="input h-auto w-full"
|
||||
:type="showPassword ? 'text' : 'password'"
|
||||
autocomplete="password"
|
||||
:placeholder="$t('login.password')"
|
||||
|
@ -34,7 +34,7 @@
|
|||
<div class="flex justify-center">
|
||||
<input
|
||||
v-model="passwordConfirm"
|
||||
class="input w-full"
|
||||
class="input h-auto w-full"
|
||||
:type="showConfirmPassword ? 'text' : 'password'"
|
||||
autocomplete="password"
|
||||
:placeholder="$t('login.password_confirm')"
|
||||
|
@ -65,10 +65,9 @@
|
|||
<script>
|
||||
import { isEmail } from "../utils/Misc.js";
|
||||
import ConfirmModal from "./ConfirmModal.vue";
|
||||
import TooltipIcon from "./TooltipIcon.vue";
|
||||
|
||||
export default {
|
||||
components: { ConfirmModal, TooltipIcon },
|
||||
components: { ConfirmModal },
|
||||
data() {
|
||||
return {
|
||||
username: null,
|
||||
|
|
|
@ -1,29 +0,0 @@
|
|||
<template>
|
||||
<div id="container" class="m-2 self-center">
|
||||
<div :class="icon" class="cursor-pointer"></div>
|
||||
<p id="tooltip" class="absolute mr-[20vw] mt-2 hidden rounded-l bg-gray-800 px-2 py-1 text-gray-200">
|
||||
{{ tooltip }}
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
icon: {
|
||||
type: String, // the class name of a font awesome icon
|
||||
required: true,
|
||||
},
|
||||
tooltip: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#container:hover #tooltip {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
|
@ -31,16 +31,32 @@
|
|||
class="absolute top-8 rounded bg-black/80 p-2 text-lg backdrop-blur-sm"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<ModalComponent v-if="showSpeedModal" @close="showSpeedModal = false">
|
||||
<h2 v-t="'actions.playback_speed'" />
|
||||
<div class="flex flex-col">
|
||||
<input
|
||||
v-model="playbackSpeedInput"
|
||||
class="input my-3"
|
||||
type="text"
|
||||
:placeholder="$t('actions.playback_speed')"
|
||||
@keyup.enter="setSpeedFromInput()"
|
||||
/>
|
||||
<button v-t="'actions.okay'" class="btn ml-auto w-min" @click="setSpeedFromInput()" />
|
||||
</div>
|
||||
</ModalComponent>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import "shaka-player/dist/controls.css";
|
||||
import { parseTimeParam } from "@/utils/Misc";
|
||||
import ModalComponent from "./ModalComponent.vue";
|
||||
|
||||
const shaka = import("shaka-player/dist/shaka-player.ui.js");
|
||||
const hotkeys = import("hotkeys-js");
|
||||
|
||||
export default {
|
||||
components: { ModalComponent },
|
||||
props: {
|
||||
video: {
|
||||
type: Object,
|
||||
|
@ -66,6 +82,8 @@ export default {
|
|||
destroying: false,
|
||||
inSegment: false,
|
||||
isHoveringTimebar: false,
|
||||
showSpeedModal: false,
|
||||
playbackSpeedInput: null,
|
||||
currentTime: 0,
|
||||
seekbarPadding: 2,
|
||||
error: 0,
|
||||
|
@ -106,7 +124,7 @@ export default {
|
|||
this.hotkeysPromise.then(() => {
|
||||
var self = this;
|
||||
this.$hotkeys(
|
||||
"f,m,j,k,l,c,space,up,down,left,right,0,1,2,3,4,5,6,7,8,9,shift+n,shift+,,shift+.,alt+p,return,.,,",
|
||||
"f,m,j,k,l,c,space,up,down,left,right,0,1,2,3,4,5,6,7,8,9,shift+n,shift+s,shift+,,shift+.,alt+p,return,.,,",
|
||||
function (e, handler) {
|
||||
const videoEl = self.$refs.videoEl;
|
||||
switch (handler.key) {
|
||||
|
@ -196,11 +214,14 @@ export default {
|
|||
self.$emit("navigateNext");
|
||||
e.preventDefault();
|
||||
break;
|
||||
case "shift+s":
|
||||
self.showSpeedModal = true;
|
||||
break;
|
||||
case "shift+,":
|
||||
self.$player.trickPlay(Math.max(videoEl.playbackRate - 0.25, 0.25));
|
||||
self.adjustPlaybackSpeed(videoEl.playbackRate - 0.25);
|
||||
break;
|
||||
case "shift+.":
|
||||
self.$player.trickPlay(Math.min(videoEl.playbackRate + 0.25, 2));
|
||||
self.adjustPlaybackSpeed(videoEl.playbackRate + 0.25);
|
||||
break;
|
||||
case "alt+p":
|
||||
document.pictureInPictureElement
|
||||
|
@ -651,7 +672,19 @@ export default {
|
|||
this.$refs.videoEl.currentTime = time;
|
||||
}
|
||||
},
|
||||
|
||||
adjustPlaybackSpeed(newSpeed) {
|
||||
const normalizedSpeed = Math.min(4, Math.max(0.25, newSpeed));
|
||||
this.$player.trickPlay(normalizedSpeed);
|
||||
},
|
||||
setSpeedFromInput() {
|
||||
try {
|
||||
const newSpeed = Number(this.playbackSpeedInput);
|
||||
this.adjustPlaybackSpeed(newSpeed);
|
||||
} catch (err) {
|
||||
alert(this.$t("actions.invalid_input"));
|
||||
}
|
||||
this.showSpeedModal = false;
|
||||
},
|
||||
updateMarkers() {
|
||||
const markers = this.$refs.container.querySelector(".shaka-ad-markers");
|
||||
const array = ["to right"];
|
||||
|
|
|
@ -546,33 +546,13 @@ export default {
|
|||
this.fetchSponsors().then(data => (this.sponsors = data));
|
||||
},
|
||||
async getComments() {
|
||||
this.fetchComments().then(data => {
|
||||
this.rewriteComments(data.comments);
|
||||
this.comments = data;
|
||||
});
|
||||
this.comments = await this.fetchComments();
|
||||
},
|
||||
async fetchSubscribedStatus() {
|
||||
if (!this.channelId) return;
|
||||
|
||||
this.subscribed = await this.fetchSubscriptionStatus(this.channelId);
|
||||
},
|
||||
rewriteComments(data) {
|
||||
data.forEach(comment => {
|
||||
const parser = new DOMParser();
|
||||
const xmlDoc = parser.parseFromString(comment.commentText, "text/html");
|
||||
xmlDoc.querySelectorAll("a").forEach(elem => {
|
||||
if (!elem.innerText.match(/(?:[\d]{1,2}:)?(?:[\d]{1,2}):(?:[\d]{1,2})/))
|
||||
elem.outerHTML = elem.getAttribute("href");
|
||||
});
|
||||
comment.commentText = xmlDoc
|
||||
.querySelector("body")
|
||||
.innerHTML.replaceAll(/(?:http(?:s)?:\/\/)?(?:www\.)?youtube\.com(\/[/a-zA-Z0-9_?=&-]*)/gm, "$1")
|
||||
.replaceAll(
|
||||
/(?:http(?:s)?:\/\/)?(?:www\.)?youtu\.be\/(?:watch\?v=)?([/a-zA-Z0-9_?=&-]*)/gm,
|
||||
"/watch?v=$1",
|
||||
);
|
||||
});
|
||||
},
|
||||
subscribeHandler() {
|
||||
this.toggleSubscriptionState(this.channelId, this.subscribed).then(success => {
|
||||
if (success) this.subscribed = !this.subscribed;
|
||||
|
@ -616,7 +596,6 @@ export default {
|
|||
}).then(json => {
|
||||
this.comments.nextpage = json.nextpage;
|
||||
this.loading = false;
|
||||
this.rewriteComments(json.comments);
|
||||
this.comments.comments = this.comments.comments.concat(json.comments);
|
||||
});
|
||||
}
|
||||
|
|
|
@ -156,7 +156,11 @@
|
|||
"concurrent_prefetch_limit": "Concurrent Stream Prefetch Limit",
|
||||
"customize": "Customize",
|
||||
"invalid_url": "Invalid URL!",
|
||||
"add": "Add"
|
||||
"add": "Add",
|
||||
"creator_replied": "Creator replied",
|
||||
"creator_liked": "Creator liked",
|
||||
"playback_speed": "Playback speed",
|
||||
"invalid_input": "Invalid input"
|
||||
},
|
||||
"comment": {
|
||||
"pinned_by": "Pinned by {author}",
|
||||
|
|
|
@ -156,7 +156,9 @@
|
|||
"customize": "Kohanda",
|
||||
"invalid_url": "Vigane URL!",
|
||||
"add": "Lisa",
|
||||
"delete_group_confirm": "Kas kustutame selle grupi?"
|
||||
"delete_group_confirm": "Kas kustutame selle grupi?",
|
||||
"creator_replied": "Autor vastas",
|
||||
"creator_liked": "Autorile meeldis see"
|
||||
},
|
||||
"preferences": {
|
||||
"has_cdn": "CDN'i olek?",
|
||||
|
|
|
@ -151,7 +151,12 @@
|
|||
"download_frame": "Keret letöltése",
|
||||
"customize": "Testreszab",
|
||||
"invalid_url": "Érvénytelen URL!",
|
||||
"add": "Hozzáadás"
|
||||
"add": "Hozzáadás",
|
||||
"delete_group_confirm": "Törli ezt a csoportot?",
|
||||
"creator_replied": "A készítő válaszolt",
|
||||
"creator_liked": "A készítő kedvelte",
|
||||
"playback_speed": "Visszajátszási sebesség",
|
||||
"invalid_input": "Érvénytelen bevitel"
|
||||
},
|
||||
"video": {
|
||||
"ratings_disabled": "Értékelések Letiltva",
|
||||
|
|
|
@ -155,7 +155,8 @@
|
|||
"concurrent_prefetch_limit": "同時に先読みするストリーム数上限",
|
||||
"add": "追加",
|
||||
"invalid_url": "無効なURLです!",
|
||||
"customize": "追加"
|
||||
"customize": "追加",
|
||||
"delete_group_confirm": "このグループを削除しますか?"
|
||||
},
|
||||
"comment": {
|
||||
"pinned_by": "{author} によって固定",
|
||||
|
|
|
@ -127,7 +127,12 @@
|
|||
"clone_playlist": "Klonēt Atskaņošanas Saturu",
|
||||
"uses_api_from": "Izmanto API no ",
|
||||
"add_to_playlist": "Pievienot Atskaņošanas Sarakstam",
|
||||
"instances_not_shown": "Publiskās instances, kas šeit nav redzamas, pašlaik nav pieejamas."
|
||||
"instances_not_shown": "Publiskās instances, kas šeit nav redzamas, pašlaik nav pieejamas.",
|
||||
"delete_group_confirm": "Vai vēlaties dzēst šo grupu?",
|
||||
"concurrent_prefetch_limit": "Vienlaicīgu Straumju Ielādes Limits",
|
||||
"customize": "Pielāgot",
|
||||
"invalid_url": "Nederīgs URL!",
|
||||
"add": "Pievienot"
|
||||
},
|
||||
"search": {
|
||||
"all": "YouTube: Visi",
|
||||
|
@ -161,7 +166,9 @@
|
|||
"playlists": "Atskaņošanas saraksts",
|
||||
"register": "Reģistrēties",
|
||||
"player": "Atskaņotājs",
|
||||
"dearrow": "DeArrow"
|
||||
"dearrow": "DeArrow",
|
||||
"albums": "Albumi",
|
||||
"custom_instances": "Pielāgotas instances"
|
||||
},
|
||||
"video": {
|
||||
"all": "Visi",
|
||||
|
@ -207,7 +214,9 @@
|
|||
"has_cdn": "Vai ir satura piegādes tīkls?",
|
||||
"instance_name": "Instances Nosaukums",
|
||||
"registered_users": "Reģistrētie Lietotāji",
|
||||
"instance_locations": "Instances Atrašanās Vietas"
|
||||
"instance_locations": "Instances Atrašanās Vietas",
|
||||
"uptime_30d": "Darbspējas laiks (30d)",
|
||||
"api_url": "Api URL"
|
||||
},
|
||||
"login": {
|
||||
"username": "Lietotājvārds",
|
||||
|
|
|
@ -156,7 +156,11 @@
|
|||
"customize": "Dostosuj",
|
||||
"invalid_url": "Nieprawidłowy adres URL!",
|
||||
"add": "Dodaj",
|
||||
"delete_group_confirm": "Usunąć tę grupę?"
|
||||
"delete_group_confirm": "Usunąć tę grupę?",
|
||||
"creator_replied": "Twórca odpowiedział",
|
||||
"creator_liked": "Twórca polubił",
|
||||
"invalid_input": "Nieprawidłowe dane wejściowe",
|
||||
"playback_speed": "Szybkość odtwarzania"
|
||||
},
|
||||
"comment": {
|
||||
"pinned_by": "Przypięty przez {author}",
|
||||
|
|
|
@ -155,7 +155,12 @@
|
|||
"concurrent_prefetch_limit": "Предел одновременной предзагрузки трансляций",
|
||||
"customize": "Персонализация",
|
||||
"invalid_url": "Неправильная ссылка!",
|
||||
"add": "Добавить"
|
||||
"add": "Добавить",
|
||||
"creator_replied": "Ответ автора",
|
||||
"creator_liked": "Автор оценил",
|
||||
"playback_speed": "Скорость воспроизведения",
|
||||
"invalid_input": "Некорректный ввод",
|
||||
"delete_group_confirm": "Удалить группу?"
|
||||
},
|
||||
"comment": {
|
||||
"pinned_by": "Закреплено пользователем {author}",
|
||||
|
|
|
@ -132,7 +132,11 @@
|
|||
"invalid_url": "Geçersiz URL!",
|
||||
"customize": "Özelleştir",
|
||||
"add": "Ekle",
|
||||
"delete_group_confirm": "Bu grup silinsin mi?"
|
||||
"delete_group_confirm": "Bu grup silinsin mi?",
|
||||
"creator_replied": "Oluşturan yanıtladı",
|
||||
"creator_liked": "Oluşturan beğendi",
|
||||
"playback_speed": "Oynatma hızı",
|
||||
"invalid_input": "Geçersiz giriş"
|
||||
},
|
||||
"player": {
|
||||
"watch_on": "{0} üzerinde görüntüle",
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue