Add live indicator for videos, pretranslate more components.

This commit is contained in:
FireMasterK 2022-01-30 23:48:27 +00:00
parent 0a35dcfd85
commit 9b18f2eff2
No known key found for this signature in database
GPG key ID: 49451E4482CC5BCD
16 changed files with 41 additions and 39 deletions

View file

@ -13,7 +13,7 @@
</a>
<a class="ml-2" href="https://github.com/TeamPiped/Piped#donations">
<font-awesome-icon :icon="['fab', 'bitcoin']" />
<span v-text="$t('actions.donations')" />
<span v-t="'actions.donations'" />
</a>
</footer>
</div>

View file

@ -16,7 +16,7 @@
v-if="authenticated"
class="btn"
@click="subscribeHandler"
v-text="$t(`actions.${subscribed ? 'unsubscribe' : 'subscribe'}`)"
v-t="`actions.${subscribed ? 'unsubscribe' : 'subscribe'}`"
/>
<hr />

View file

@ -13,7 +13,7 @@
<div class="comment-header">
<div v-if="comment.pinned" class="comment-pinned">
<font-awesome-icon icon="thumbtack" />
<span class="ml-1.5" v-text="$t('comment.pinned_by')" />
<span class="ml-1.5" v-t="'comment.pinned_by'" />
<span v-text="uploader" />
</div>

View file

@ -1,6 +1,6 @@
<template>
<p v-text="message" />
<button @click="toggleTrace" class="btn" v-text="$t('actions.show_more')" />
<button @click="toggleTrace" class="btn" v-t="'actions.show_more'" />
<p ref="stacktrace" class="whitespace-pre-wrap" hidden v-text="error" />
</template>

View file

@ -1,5 +1,5 @@
<template>
<h1 class="font-bold text-center" v-text="$t('titles.history')" />
<h1 class="font-bold text-center" v-t="'titles.history'" />
<div class="flex">
<div>

View file

@ -23,7 +23,7 @@
/>
</div>
<div>
<a class="btn w-auto" @click="login" v-text="$t('titles.login')" />
<a class="btn w-auto" @click="login" v-t="'titles.login'" />
</div>
</form>
</div>

View file

@ -1,17 +1,13 @@
<template>
<div class="flex">
<button @click="$router.go(-1) || $router.push('/')">
<font-awesome-icon icon="chevron-left" /><span class="ml-1.5" v-text="$t('actions.back')" />
<font-awesome-icon icon="chevron-left" /><span class="ml-1.5" v-t="'actions.back'" />
</button>
</div>
<h1 v-t="'titles.preferences'" class="font-bold text-center" />
<hr />
<h2>SponsorBlock</h2>
<p>
<span v-text="$t('actions.uses_api_from')" /><a class="link" href="https://sponsor.ajay.app/"
>sponsor.ajay.app</a
>
</p>
<p><span v-t="'actions.uses_api_from'" /><a class="link" href="https://sponsor.ajay.app/">sponsor.ajay.app</a></p>
<label for="chkEnableSponsorblock"><strong v-t="'actions.enable_sponsorblock'" /></label>
<br />
<input
@ -159,19 +155,19 @@
<table class="table">
<thead>
<tr>
<th v-text="$t('preferences.instance_name')" />
<th v-text="$t('preferences.instance_locations')" />
<th v-text="$t('preferences.has_cdn')" />
<th v-text="$t('preferences.ssl_score')" />
<th v-t="'preferences.instance_name'" />
<th v-t="'preferences.instance_locations'" />
<th v-t="'preferences.has_cdn'" />
<th v-t="'preferences.ssl_score'" />
</tr>
</thead>
<tbody v-for="instance in instances" :key="instance.name">
<tr>
<td v-text="instance.name" />
<td v-text="instance.locations" />
<td v-text="$t(`actions.${instance.cdn === 'Yes' ? 'yes' : 'no'}`)" />
<td v-t="`actions.${instance.cdn === 'Yes' ? 'yes' : 'no'}`" />
<td>
<a :href="sslScore(instance.apiurl)" target="_blank" v-text="$t('actions.view_ssl_score')" />
<a :href="sslScore(instance.apiurl)" target="_blank" v-t="'actions.view_ssl_score'" />
</td>
</tr>
</tbody>

View file

@ -22,7 +22,7 @@
/>
</div>
<div>
<a class="btn w-auto" @click="register" v-text="$t('titles.register')" />
<a class="btn w-auto" @click="register" v-t="'titles.register'" />
</div>
</form>
</div>

View file

@ -25,7 +25,7 @@
</div>
<div v-if="results" class="video-grid">
<div v-for="result in results.items" :key="result.url">
<template v-for="result in results.items" :key="result.url">
<VideoItem v-if="shouldUseVideoItem(result)" :video="result" height="94" width="168" />
<div v-if="!shouldUseVideoItem(result)">
<router-link :to="result.url">
@ -53,7 +53,7 @@
<br />
</div>
</div>
</template>
</div>
</template>

View file

@ -1,5 +1,5 @@
<template>
<label for="ddlSortBy" v-text="$t('actions.sort_by')" />
<label for="ddlSortBy" v-t="'actions.sort_by'" />
<select id="ddlSortBy" v-model="selectedSort" class="select w-auto">
<option v-for="(value, key) in options" v-t="`actions.${key}`" :key="key" :value="value" />
</select>

View file

@ -1,12 +1,12 @@
<template>
<h1 class="font-bold text-center" v-text="$t('titles.subscriptions')" />
<h1 class="font-bold text-center" v-t="'titles.subscriptions'" />
<div v-if="authenticated">
<button class="btn mr-0.5">
<router-link to="/import" v-text="$t('actions.import_from_json')" />
<router-link to="/import" v-t="'actions.import_from_json'" />
</button>
<button class="btn" @click="exportHandler" v-text="$t('actions.export_to_json')" />
<button class="btn" @click="exportHandler" v-t="'actions.export_to_json'" />
</div>
<hr />
@ -21,7 +21,7 @@
<button
class="btn !w-min"
@click="handleButton(subscription)"
v-text="$t(`actions.${subscription.subscribed ? 'unsubscribe' : 'subscribe'}`)"
v-t="`actions.${subscription.subscribed ? 'unsubscribe' : 'subscribe'}`"
/>
</div>
</div>

View file

@ -4,15 +4,14 @@
<img :height="height" :width="width" class="w-full" :src="video.thumbnail" alt="" loading="lazy" />
<div class="relative text-sm">
<span
v-if="video.duration"
class="thumbnail-overlay bottom-5px right-5px px-5px"
class="thumbnail-overlay thumbnail-right"
v-if="video.duration > 0"
v-text="timeFormat(video.duration)"
/>
<span
v-if="video.watched"
class="thumbnail-overlay bottom-5px left-5px px-5px"
v-text="$t('video.watched')"
/>
<i18n-t v-else keypath="video.live" class="thumbnail-overlay thumbnail-right !bg-red-600" tag="div">
<font-awesome-icon class="!w-3" :icon="['fas', 'broadcast-tower']" />
</i18n-t>
<span v-if="video.watched" class="thumbnail-overlay bottom-5px left-5px" v-t="'video.watched'" />
</div>
<div>
@ -74,7 +73,11 @@
<style>
.thumbnail-overlay {
@apply rounded-md absolute bg-black text-white bg-opacity-75;
@apply rounded-md absolute bg-black text-white bg-opacity-75 px-5px;
}
.thumbnail-right {
@apply bottom-5px right-5px;
}
</style>

View file

@ -1,5 +1,5 @@
<template>
<div v-text="$t('actions.loading')" />
<div v-t="'actions.loading'" />
</template>
<script>

View file

@ -77,7 +77,7 @@
v-if="authenticated"
class="btn relative ml-auto"
@click="subscribeHandler"
v-text="$t(`actions.${subscribed ? 'unsubscribe' : 'subscribe'}`)"
v-t="`actions.${subscribed ? 'unsubscribe' : 'subscribe'}`"
/>
</div>
@ -86,7 +86,7 @@
<button
class="btn mb-2"
@click="showDesc = !showDesc"
v-text="$t(`actions.${showDesc ? 'minimize_description' : 'show_description'}`)"
v-t="`actions.${showDesc ? 'minimize_description' : 'show_description'}`"
/>
<!-- eslint-disable-next-line vue/no-v-html -->
<p v-show="showDesc" class="break-words" v-html="purifyHTML(video.description)" />
@ -122,7 +122,7 @@
<a
class="btn mb-2 sm:hidden"
@click="showRecs = !showRecs"
v-text="$t(`actions.${showRecs ? 'minimize_recommendations' : 'show_recommendations'}`)"
v-t="`actions.${showRecs ? 'minimize_recommendations' : 'show_recommendations'}`"
/>
<hr v-show="showRecs" />
<div v-show="showRecs || !smallView">

View file

@ -91,7 +91,8 @@
"watched": "Watched",
"sponsor_segments": "Sponsors Segments",
"ratings_disabled": "Ratings Disabled",
"chapters": "Chapters"
"chapters": "Chapters",
"live": "{0} Live"
},
"search": {
"did_you_mean": "Did you mean: {0}?"

View file

@ -13,6 +13,7 @@ import {
faLevelDownAlt,
faTv,
faLevelUpAlt,
faBroadcastTower,
} from "@fortawesome/free-solid-svg-icons";
import { faGithub, faBitcoin, faYoutube } from "@fortawesome/free-brands-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@ -32,6 +33,7 @@ library.add(
faLevelDownAlt,
faLevelUpAlt,
faTv,
faBroadcastTower,
);
import router from "@/router/router.js";