Compare commits

...

2 Commits

Author SHA1 Message Date
Ihor Hordiichuk
7eb6dd0ab0
Translated using Weblate (Ukrainian)
Currently translated at 100.0% (738 of 738 strings)

Translation: FreeTube/Translations
Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/uk/
2023-12-08 22:05:03 +01:00
ChunkyProgrammer
d6a6cc0349
use swiper.js instead of tinyslider (#4427) 2023-12-08 20:24:08 +01:00
8 changed files with 64 additions and 60 deletions

View File

@ -65,6 +65,7 @@
"marked": "^11.0.0",
"path-browserify": "^1.0.1",
"process": "^0.11.10",
"swiper": "^11.0.5",
"video.js": "7.21.5",
"videojs-contrib-quality-levels": "^3.0.0",
"videojs-http-source-selector": "^1.1.6",
@ -75,7 +76,6 @@
"vue-i18n": "^8.28.2",
"vue-observe-visibility": "^1.0.0",
"vue-router": "^3.6.5",
"vue-tiny-slider": "^0.1.39",
"vuex": "^3.6.2",
"youtubei.js": "^7.0.0"
},

View File

@ -4,20 +4,16 @@ import FtListPlaylist from '../ft-list-playlist/ft-list-playlist.vue'
import FtCommunityPoll from '../ft-community-poll/ft-community-poll.vue'
import autolinker from 'autolinker'
import VueTinySlider from 'vue-tiny-slider'
import { deepCopy, toLocalePublicationString } from '../../helpers/utils'
import { youtubeImageUrlToInvidious } from '../../helpers/api/invidious'
import 'tiny-slider/dist/tiny-slider.css'
export default defineComponent({
name: 'FtCommunityPost',
components: {
'ft-list-playlist': FtListPlaylist,
'ft-list-video': FtListVideo,
'ft-community-poll': FtCommunityPoll,
'tiny-slider': VueTinySlider
'ft-community-poll': FtCommunityPoll
},
props: {
data: {
@ -44,26 +40,15 @@ export default defineComponent({
}
},
computed: {
tinySliderOptions: function() {
return {
items: 1,
arrowKeys: false,
controls: false,
autoplay: false,
slideBy: 'page',
navPosition: 'bottom'
}
},
listType: function () {
return this.$store.getters.getListType
}
},
created: function () {
this.parseVideoData()
this.parseCommunityData()
},
methods: {
parseVideoData: function () {
parseCommunityData: function () {
if ('backstagePostThreadRenderer' in this.data) {
this.postText = 'Shared post'
this.type = 'text'

View File

@ -136,3 +136,7 @@
min-block-size: 0 !important;
padding-block-end: 20px;
}
.sliderContainer {
display: block;
}

View File

@ -56,19 +56,30 @@
class="postText"
v-html="postText"
/>
<tiny-slider
v-if="type === 'multiImage' && postContent.content.length > 0"
v-bind="tinySliderOptions"
class="slider"
>
<img
v-for="(img, index) in postContent.content"
:key="index"
:src="getBestQualityImage(img)"
class="communityImage tns-lazy-img"
alt=""
<div class="sliderContainer">
<swiper-container
v-if="type === 'multiImage' && postContent.content.length > 0"
slides-per-view="1"
navigation="true"
pagination-clickable="true"
pagination="true"
a11y="true"
class="slider"
>
</tiny-slider>
<swiper-slide
v-for="(img, index) in postContent.content"
:key="index"
lazy="true"
>
<img
:src="getBestQualityImage(img)"
class="communityImage"
alt=""
loading="lazy"
>
</swiper-slide>
</swiper-container>
</div>
<div
v-if="type === 'image' && postContent.content.length > 0"
>
@ -118,4 +129,3 @@
<script src="./ft-community-post.js" />
<style scoped src="./ft-community-post.scss" lang="scss" />
<style src="./slider-style.css" lang="css" />

View File

@ -1,11 +0,0 @@
.tns-nav .tns-nav-active {
background-color: #999;
}
.tns-nav button {
background-color: #ddd;
border-radius: 50%;
block-size: 1.5em;
padding: 0;
inline-size: 1.5em;
}

View File

@ -5,6 +5,9 @@ import router from './router/index'
import store from './store/index'
import i18n from './i18n/index'
import { library } from '@fortawesome/fontawesome-svg-core'
import { register as registerSwiper } from 'swiper/element/bundle'
// Please keep the list of constants sorted by name
// to avoid code conflict and duplicate entries
import {
@ -145,6 +148,8 @@ library.add(
faMonero
)
registerSwiper()
Vue.component('FontAwesomeIcon', FontAwesomeIcon)
/* eslint-disable-next-line no-new */

View File

@ -329,6 +329,8 @@ Settings:
Fetch Feeds from RSS: 'Отримати канали з RSS'
Manage Subscriptions: 'Керування підписками'
Fetch Automatically: Автоматично отримувати стрічку
Only Show Latest Video for Each Channel: Показувати лише останні відео для кожного
каналу
Distraction Free Settings:
Distraction Free Settings: 'Налаштування зосередження'
Hide Video Views: 'Сховати перегляди відео'
@ -369,6 +371,12 @@ Settings:
Hide Profile Pictures in Comments: Сховати зображення профілю в коментарях
Blur Thumbnails: Розмиті мініатюри
Hide Subscriptions Community: Сховати спільноту підписників
Hide Channels Invalid: Вказаний ID каналу недійсний
Hide Channels Disabled Message: Деякі канали були заблоковані за допомогою ID
і не були оброблені. Функція заблокована в той час, як ці ID оновлювалися
Hide Channels Already Exists: ID каналу вже існує
Hide Channels API Error: Помилка під час пошуку користувача з наданим ID. Перевірте
ще раз, чи правильний ID.
Data Settings:
Data Settings: 'Налаштування даних'
Select Import Type: 'Оберіть тип імпорту'
@ -483,6 +491,7 @@ Settings:
Set Password: Установити пароль
Remove Password: Вилучити пароль
Set Password To Prevent Access: Встановіть пароль, щоб запобігти доступу до налаштувань
Expand All Settings Sections: Розгорнути всі розділи налаштувань
About:
#On About page
About: 'Про'
@ -555,6 +564,11 @@ Profile:
Profile Filter: Фільтр профілю
Profile Settings: Налаштування профілю
Toggle Profile List: Перемкнути список профілів
Profile Name: Назва профілю
Edit Profile Name: Змінити назву профілю
Create Profile Name: Створити назву профілю
Open Profile Dropdown: Відкрити спадне меню профілю
Close Profile Dropdown: Закрити спадне меню профілю
Channel:
Subscriber: 'Підписник'
Subscribers: 'Підписники'
@ -757,6 +771,8 @@ Video:
'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Спілкування
наживо недоступне для цієї трансляції. Можливо, вивантажувач вимкнув його.
Pause on Current Video: Призупинити на поточному відео
Unhide Channel: Показати канал
Hide Channel: Сховати канал
Videos:
#& Sort By
Sort By:
@ -906,9 +922,9 @@ Tooltips:
Replace HTTP Cache: Вимикає дисковий HTTP-кеш Electron і вмикає власний кеш зображень
у пам'яті. Призведе до збільшення використання оперативної пам'яті.
Distraction Free Settings:
Hide Channels: Введіть назву або ID каналу, щоб сховати всі відео, списки відтворення
та сам канал від появи в пошуку, тренді, найпопулярніших і рекомендованих. Введена
назва каналу повинна повністю збігатися і чутлива до регістру.
Hide Channels: Введіть ID, щоб сховати всі відео, списки відтворення та сам канал
від появи в пошуку, тренді, найпопулярніших і рекомендованих. Введений ID каналу
повинен повністю збігатися і чутливий до регістру.
Hide Subscriptions Live: Цей параметр перевизначається загальнодоступним налаштуванням
"{appWideSetting}" у розділі "{subsection}" "{settingsSection}"
SponsorBlock Settings:
@ -996,3 +1012,6 @@ Playlist will pause when current video is finished: Добірка призуп
відео завершено
Playlist will not pause when current video is finished: Добірка не призупиняється,
коли поточне відео завершено
Channel Hidden: '{channel} додано до фільтра каналу'
Go to page: Перейти до {page}
Channel Unhidden: '{channel} вилучено з фільтра каналу'

View File

@ -5690,7 +5690,7 @@ lodash.uniq@^4.5.0:
resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
integrity sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ==
lodash@^4.17.11, lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21:
lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21:
version "4.17.21"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
@ -8038,6 +8038,11 @@ svgo@^3.0.2:
csso "^5.0.5"
picocolors "^1.0.0"
swiper@^11.0.5:
version "11.0.5"
resolved "https://registry.yarnpkg.com/swiper/-/swiper-11.0.5.tgz#6ed1ad06e6906ba42fd4b93d4988f0626a49046e"
integrity sha512-rhCwupqSyRnWrtNzWzemnBLMoyYuoDgGgspAm/8iBD3jCvAWycPLH4Z3TB0O5520DHLzMx94yUMH/B9Efpa48w==
synckit@^0.8.5:
version "0.8.5"
resolved "https://registry.yarnpkg.com/synckit/-/synckit-0.8.5.tgz#b7f4358f9bb559437f9f167eb6bc46b3c9818fa3"
@ -8123,11 +8128,6 @@ thunky@^1.0.2:
resolved "https://registry.yarnpkg.com/thunky/-/thunky-1.1.0.tgz#5abaf714a9405db0504732bbccd2cedd9ef9537d"
integrity sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==
tiny-slider@^2.9.2:
version "2.9.4"
resolved "https://registry.yarnpkg.com/tiny-slider/-/tiny-slider-2.9.4.tgz#dd5cbf3065f1688ade8383ea6342aefcba22ccc4"
integrity sha512-LAs2kldWcY+BqCKw4kxd4CMx2RhWrHyEePEsymlOIISTlOVkjfK40sSD7ay73eKXBLg/UkluAZpcfCstimHXew==
titleize@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/titleize/-/titleize-3.0.0.tgz#71c12eb7fdd2558aa8a44b0be83b8a76694acd53"
@ -8619,14 +8619,6 @@ vue-template-es2015-compiler@^1.9.0:
resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
vue-tiny-slider@^0.1.39:
version "0.1.39"
resolved "https://registry.yarnpkg.com/vue-tiny-slider/-/vue-tiny-slider-0.1.39.tgz#9301eada256fa12725b050767e1e67a287b3e3ef"
integrity sha512-dLOuMI6YyIBabXPZTQ0LL2jhOqZuwsCD7ztPEoE1ejFQ9GNxyRxwkRsIwUtVnq5SCTzQAhCYlgoibyMGoDHReA==
dependencies:
lodash "^4.17.11"
tiny-slider "^2.9.2"
vue@^2.7.15:
version "2.7.15"
resolved "https://registry.yarnpkg.com/vue/-/vue-2.7.15.tgz#94cd34e6e9f22cd2d35a02143f96a5beac1c1f54"