mirror of
https://codeberg.org/dragongoose/safetwitch.git
synced 2024-06-29 01:19:57 +00:00
Lint/prettify
This commit is contained in:
parent
f87b235abe
commit
06b77d686c
|
|
@ -60,7 +60,7 @@ export function parseMessage(messageData: any, allBadges: Badge[]): ParsedMessag
|
|||
return {
|
||||
type: 'CLEARCHAT',
|
||||
data: {
|
||||
username: message.message.replace(/(\r\n|\n|\r)/gm, ""),
|
||||
username: message.message.replace(/(\r\n|\n|\r)/gm, ''),
|
||||
duration
|
||||
}
|
||||
}
|
||||
|
|
@ -76,11 +76,11 @@ export function parseMessage(messageData: any, allBadges: Badge[]): ParsedMessag
|
|||
}
|
||||
|
||||
export function parseChatHistory(messages: StreamMessage[], badges: Badge[]) {
|
||||
let parsedMessages = []
|
||||
const parsedMessages = []
|
||||
|
||||
for (let i = 0; i < messages.length; i++) {
|
||||
const message = messages[i]
|
||||
|
||||
|
||||
const data: ParsedMessage = {
|
||||
type: 'PRIVMSG',
|
||||
data: {
|
||||
|
|
|
|||
|
|
@ -6,12 +6,6 @@ import type { QualityLevelList, QualityLevel } from 'videojs-contrib-quality-lev
|
|||
import i18n from '@/i18n'
|
||||
import { getSetting } from '@/mixins'
|
||||
|
||||
const getQualityFromSettings = (qualityLevels) => {
|
||||
const settings = localStorage.getItem("settings")
|
||||
const parsed = JSON.parse(settings)
|
||||
return parsed.defaultQuality.selected
|
||||
}
|
||||
|
||||
export const createQualitySelector = (player: any) => {
|
||||
const qualityLevels: QualityLevelList = player.qualityLevels()
|
||||
const MenuButton = videojs.getComponent('MenuButton')
|
||||
|
|
@ -53,7 +47,7 @@ export const createQualitySelector = (player: any) => {
|
|||
}
|
||||
|
||||
// set quality on startup
|
||||
const startingQuality = getSetting("defaultQuality")
|
||||
const startingQuality = getSetting('defaultQuality')
|
||||
const id = formatedQualities.find((i) => i.name === startingQuality)?.id
|
||||
setQuality(id)
|
||||
|
||||
|
|
@ -88,4 +82,4 @@ export const createQualitySelector = (player: any) => {
|
|||
formattedLevels.push(formatedQualities)
|
||||
updateLevels()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,7 +18,16 @@ export default {
|
|||
setup() {
|
||||
return {
|
||||
langs: ['en-US', 'es-ES', 'nl-NL', 'pt-PT', 'fa-IR', 'he-IL', 'ru-RU', 'ko-KR'],
|
||||
names: ['English', 'Español', 'Nederlands', 'Português', 'فارسی', 'עִבְרִית', 'Русский', '한국어']
|
||||
names: [
|
||||
'English',
|
||||
'Español',
|
||||
'Nederlands',
|
||||
'Português',
|
||||
'فارسی',
|
||||
'עִבְרִית',
|
||||
'Русский',
|
||||
'한국어'
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -14,44 +14,52 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
toggle() {
|
||||
this.open = !this.open
|
||||
this.open = !this.open
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<nav class="flex items-center justify-between flex-wrap p-4">
|
||||
<div class="flex items-center flex-no-shrink text-white mr-6">
|
||||
<router-link to="/">
|
||||
<h1 class="font-bold text-2xl">Safe<color class="text-purple-500">Twitch</color></h1>
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<nav class="flex items-center justify-between flex-wrap p-4">
|
||||
<div class="flex items-center flex-no-shrink text-white mr-6">
|
||||
<router-link to="/">
|
||||
<h1 class="font-bold text-2xl">Safe<color class="text-purple-500">Twitch</color></h1>
|
||||
</router-link>
|
||||
<search-bar class="mt-4 mr-4 hidden sm:inline-block sm:mt-0"></search-bar>
|
||||
|
||||
<div class="text-white hidden sm:block">
|
||||
<a
|
||||
href="https://codeberg.org/dragongoose/safetwitch"
|
||||
class="mt-4 mr-4 sm:inline-block sm:mt-0"
|
||||
>{{ $t('nav.code') }}</a
|
||||
>
|
||||
<router-link to="/privacy" class="mt-4 mr-4 sm:inline-block sm:mt-0">{{
|
||||
$t('nav.privacy')
|
||||
}}</router-link>
|
||||
<language-switcher class="mt-4 sm:inline-block sm:mt-0"></language-switcher>
|
||||
</div>
|
||||
|
||||
<div class="block sm:hidden">
|
||||
<button @click="toggle" class="flex items-center px-3 py-2">
|
||||
<svg class="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||||
<title>Menu</title>
|
||||
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div :class="open ? 'block' : 'hidden'" class="w-full flex-grow">
|
||||
<div class="p-4 flex flex-col items-center space-y-5 bg-ctp-base text-white">
|
||||
<search-bar></search-bar>
|
||||
<ul class="inline-flex space-x-3 md:space-x-6 font-medium">
|
||||
<a href="https://codeberg.org/dragongoose/safetwitch">{{ $t('nav.code') }}</a>
|
||||
<router-link to="/privacy">{{ $t('nav.privacy') }}</router-link>
|
||||
<language-switcher></language-switcher>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<search-bar class="mt-4 mr-4 hidden sm:inline-block sm:mt-0"></search-bar>
|
||||
|
||||
<div class="text-white hidden sm:block">
|
||||
<a href="https://codeberg.org/dragongoose/safetwitch" class="mt-4 mr-4 sm:inline-block sm:mt-0">{{ $t('nav.code') }}</a>
|
||||
<router-link to="/privacy" class="mt-4 mr-4 sm:inline-block sm:mt-0">{{ $t('nav.privacy') }}</router-link>
|
||||
<language-switcher class="mt-4 sm:inline-block sm:mt-0"></language-switcher>
|
||||
</div>
|
||||
|
||||
<div class="block sm:hidden">
|
||||
<button @click="toggle" class="flex items-center px-3 py-2">
|
||||
<svg class="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><title>Menu</title><path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div :class="open ? 'block': 'hidden'" class="w-full flex-grow">
|
||||
<div class="p-4 flex flex-col items-center space-y-5 bg-ctp-base text-white">
|
||||
<search-bar></search-bar>
|
||||
<ul class="inline-flex space-x-3 md:space-x-6 font-medium">
|
||||
<a href="https://codeberg.org/dragongoose/safetwitch">{{ $t('nav.code') }}</a>
|
||||
<router-link to="/privacy">{{ $t('nav.privacy') }}</router-link>
|
||||
<language-switcher></language-switcher>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -5,10 +5,10 @@
|
|||
<template>
|
||||
<div class="bg-ctp-mantle mt-1 p-5 pt-3 rounded-lg w-full space-y-3">
|
||||
<div class="inline-flex w-full">
|
||||
<span class="pr-3 font-bold text-3xl">{{ $t("streamer.videos") }}</span>
|
||||
<span class="pr-3 font-bold text-3xl">{{ $t('streamer.videos') }}</span>
|
||||
</div>
|
||||
|
||||
<h1 v-if="!shelves && status === 'error'">{{ $t("streamer.videoerror") }}</h1>
|
||||
<h1 v-if="!shelves && status === 'error'">{{ $t('streamer.videoerror') }}</h1>
|
||||
|
||||
<div v-else-if="shelves" class="mb-5">
|
||||
<div class="space-y-5">
|
||||
|
|
|
|||
|
|
@ -43,22 +43,22 @@ export async function getEndpoint(endpoint: string) {
|
|||
|
||||
export function getDefaultSettings() {
|
||||
return {
|
||||
"audioOnly": {
|
||||
"name": "Audio Only",
|
||||
"selected": false,
|
||||
"type": "checkbox"
|
||||
audioOnly: {
|
||||
name: 'Audio Only',
|
||||
selected: false,
|
||||
type: 'checkbox'
|
||||
},
|
||||
"defaultQuality": {
|
||||
"name": "Default Quality",
|
||||
"options": ["160p", "360p", "480p", "720p", "1080p"],
|
||||
"selected": "480p",
|
||||
"type": "option"
|
||||
},
|
||||
"chatVisible": {
|
||||
"name": "Hide Chat",
|
||||
"selected": false,
|
||||
"type": "checkbox"
|
||||
defaultQuality: {
|
||||
name: 'Default Quality',
|
||||
options: ['160p', '360p', '480p', '720p', '1080p'],
|
||||
selected: '480p',
|
||||
type: 'option'
|
||||
},
|
||||
chatVisible: {
|
||||
name: 'Hide Chat',
|
||||
selected: false,
|
||||
type: 'checkbox'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -75,7 +75,7 @@ export function getSetting(key: string): boolean | string {
|
|||
}
|
||||
|
||||
export function chatVisible() {
|
||||
const p = getSetting("chatVisible")
|
||||
const p = getSetting('chatVisible')
|
||||
// Flip becuase on the setting page it's
|
||||
// displayed as "Hide Chat", but the value
|
||||
// is chatVisible
|
||||
|
|
|
|||
|
|
@ -18,13 +18,13 @@ export interface Metadata {
|
|||
}
|
||||
|
||||
export interface StreamMessageBadge {
|
||||
version: string
|
||||
setId: string
|
||||
version: string
|
||||
setId: string
|
||||
}
|
||||
|
||||
export interface StreamMessage {
|
||||
message: string
|
||||
username: string
|
||||
color: string
|
||||
badges: StreamMessageBadge[]
|
||||
message: string
|
||||
username: string
|
||||
color: string
|
||||
badges: StreamMessageBadge[]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ export interface MinifiedStreamer {
|
|||
}
|
||||
|
||||
export interface Video {
|
||||
type: "vod" | "clip"
|
||||
type: 'vod' | 'clip'
|
||||
preview: string
|
||||
game: MinifiedCategory
|
||||
duration: number
|
||||
|
|
|
|||
|
|
@ -35,34 +35,34 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
async getMoreStreams() {
|
||||
let bottomOfWindow =
|
||||
document.documentElement.scrollTop + window.innerHeight ===
|
||||
document.documentElement.offsetHeight
|
||||
const streams = this.data!.streams
|
||||
let bottomOfWindow =
|
||||
document.documentElement.scrollTop + window.innerHeight ===
|
||||
document.documentElement.offsetHeight
|
||||
const streams = this.data!.streams
|
||||
|
||||
if (bottomOfWindow && streams) {
|
||||
// get cursor of the last stream rendered
|
||||
const cursor = streams[streams.length - 1].cursor
|
||||
if (!cursor) return
|
||||
if (bottomOfWindow && streams) {
|
||||
// get cursor of the last stream rendered
|
||||
const cursor = streams[streams.length - 1].cursor
|
||||
if (!cursor) return
|
||||
|
||||
// get rest of streams from api
|
||||
const resData: CategoryData = await getEndpoint(
|
||||
`api/discover/${this.$route.params.game}?cursor=${cursor}`
|
||||
).catch((err) => {
|
||||
throw err
|
||||
})
|
||||
// get rest of streams from api
|
||||
const resData: CategoryData = await getEndpoint(
|
||||
`api/discover/${this.$route.params.game}?cursor=${cursor}`
|
||||
).catch((err) => {
|
||||
throw err
|
||||
})
|
||||
|
||||
let lastStreamCursor = this.data!.streams[this.data!.streams.length-1].cursor
|
||||
let newLastStreamCursor = resData.streams[resData.streams.length-1].cursor
|
||||
if (lastStreamCursor === newLastStreamCursor) {
|
||||
// Add "no more streams!" screen later
|
||||
console.log("no more streams!")
|
||||
} else {
|
||||
for (let stream of resData.streams) {
|
||||
this.data!.streams.push(stream)
|
||||
}
|
||||
let lastStreamCursor = this.data!.streams[this.data!.streams.length - 1].cursor
|
||||
let newLastStreamCursor = resData.streams[resData.streams.length - 1].cursor
|
||||
if (lastStreamCursor === newLastStreamCursor) {
|
||||
// Add "no more streams!" screen later
|
||||
console.log('no more streams!')
|
||||
} else {
|
||||
for (let stream of resData.streams) {
|
||||
this.data!.streams.push(stream)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
abbreviate
|
||||
},
|
||||
|
|
|
|||
|
|
@ -25,7 +25,10 @@ export default {
|
|||
methods: {
|
||||
filterSearches(toFilter: string) {
|
||||
const categories = this.$refs.categoryItem
|
||||
const wantedTags: string[] = toFilter.toLowerCase().split(',').filter((v) => v.toLowerCase())
|
||||
const wantedTags: string[] = toFilter
|
||||
.toLowerCase()
|
||||
.split(',')
|
||||
.filter((v) => v.toLowerCase())
|
||||
|
||||
for (let category of categories as any) {
|
||||
let tagElements = category.getElementsByTagName('span')
|
||||
|
|
@ -49,18 +52,18 @@ export default {
|
|||
}
|
||||
},
|
||||
async getNextCategory() {
|
||||
let bottomOfWindow =
|
||||
document.documentElement.scrollTop + window.innerHeight ===
|
||||
document.documentElement.offsetHeight
|
||||
if (bottomOfWindow && this.data) {
|
||||
const cursor = this.data[this.data.length - 1].cursor
|
||||
if (!cursor) return
|
||||
const res = await getEndpoint('api/discover?cursor=' + cursor)
|
||||
let bottomOfWindow =
|
||||
document.documentElement.scrollTop + window.innerHeight ===
|
||||
document.documentElement.offsetHeight
|
||||
if (bottomOfWindow && this.data) {
|
||||
const cursor = this.data[this.data.length - 1].cursor
|
||||
if (!cursor) return
|
||||
const res = await getEndpoint('api/discover?cursor=' + cursor)
|
||||
|
||||
for (let category of res) {
|
||||
this.data.push(category)
|
||||
}
|
||||
for (let category of res) {
|
||||
this.data.push(category)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
|
|
@ -142,6 +145,5 @@ export default {
|
|||
<category-preview :category-data="category"></category-preview>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -2,25 +2,25 @@
|
|||
import { getDefaultSettings } from '@/mixins'
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
let settings
|
||||
setup() {
|
||||
let settings
|
||||
|
||||
let storedSettings = localStorage.getItem("settings")
|
||||
if (storedSettings === null) {
|
||||
settings = getDefaultSettings()
|
||||
} else {
|
||||
settings = JSON.parse(storedSettings)
|
||||
}
|
||||
let storedSettings = localStorage.getItem('settings')
|
||||
if (storedSettings === null) {
|
||||
settings = getDefaultSettings()
|
||||
} else {
|
||||
settings = JSON.parse(storedSettings)
|
||||
}
|
||||
|
||||
return {
|
||||
settings
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
save() {
|
||||
const settings = JSON.stringify(this.settings)
|
||||
localStorage.setItem('settings', settings)
|
||||
},
|
||||
return {
|
||||
settings
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
save() {
|
||||
const settings = JSON.stringify(this.settings)
|
||||
localStorage.setItem('settings', settings)
|
||||
}
|
||||
// download() {
|
||||
// var hiddenElement = document.createElement('a');
|
||||
|
||||
|
|
@ -40,37 +40,42 @@ export default {
|
|||
// this.settings = file
|
||||
// this.save()
|
||||
// },
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="mx-auto w-[35rem] p-5 py-3 bg-ctp-crust rounded-md text-white">
|
||||
<h1 class="font-bold text-3xl">Settings</h1>
|
||||
<hr class="my-2">
|
||||
<ul class="w-full space-y-1">
|
||||
<li v-for="setting in settings">
|
||||
<div v-if="setting.type == 'checkbox'" class="justify-between items-center flex">
|
||||
<label :for="setting.name">{{ setting.name }}</label>
|
||||
<input :name="setting.name" type="checkbox" v-model="setting.selected">
|
||||
</div>
|
||||
<div class="mx-auto w-[35rem] p-5 py-3 bg-ctp-crust rounded-md text-white">
|
||||
<h1 class="font-bold text-3xl">Settings</h1>
|
||||
<hr class="my-2" />
|
||||
<ul class="w-full space-y-1">
|
||||
<li v-for="setting in settings" :key="setting.type">
|
||||
<div v-if="setting.type == 'checkbox'" class="justify-between items-center flex">
|
||||
<label :for="setting.name">{{ setting.name }}</label>
|
||||
<input :name="setting.name" type="checkbox" v-model="setting.selected" />
|
||||
</div>
|
||||
|
||||
<div v-else-if="setting.type == 'option'" class="justify-between items-center flex">
|
||||
<label :for="setting.name">{{ setting.name }}</label>
|
||||
<select :name="setting.name" type="checkbox" v-model="setting.selected"
|
||||
class="text-black rounded-md h-8 p-0 pr-8 pl-2">
|
||||
<option v-for="option of setting.options" :value="option">
|
||||
{{ option }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div v-else-if="setting.type == 'option'" class="justify-between items-center flex">
|
||||
<label :for="setting.name">{{ setting.name }}</label>
|
||||
<select
|
||||
:name="setting.name"
|
||||
type="checkbox"
|
||||
v-model="setting.selected"
|
||||
class="text-black rounded-md h-8 p-0 pr-8 pl-2"
|
||||
>
|
||||
<option v-for="option of setting.options" :key="option" :value="option">
|
||||
{{ option }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="space-x-2 mt-3">
|
||||
<button @click="save" class="bg-ctp-surface0 p-4 py-2 rounded-md">Save</button>
|
||||
<!-- <button @click="download" class="bg-ctp-surface0 p-4 py-2 rounded-md">Export</button>
|
||||
<div class="space-x-2 mt-3">
|
||||
<button @click="save" class="bg-ctp-surface0 p-4 py-2 rounded-md">Save</button>
|
||||
<!-- <button @click="download" class="bg-ctp-surface0 p-4 py-2 rounded-md">Export</button>
|
||||
<input type="file" @change="handleImport" name="fileinput" ref="fileinput"
|
||||
class="bg-ctp-surface0 p-4 py-2 rounded-md"> -->
|
||||
</div>
|
||||
</div></template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -168,6 +168,11 @@ export default {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<twitch-chat v-if="chatVisible()" :isLive="true" :channelName="data.login" class="h-2/3"></twitch-chat>
|
||||
<twitch-chat
|
||||
v-if="chatVisible()"
|
||||
:isLive="true"
|
||||
:channelName="data.login"
|
||||
class="h-2/3"
|
||||
></twitch-chat>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -137,6 +137,11 @@ export default {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<twitch-chat v-if="chatVisible()" :isVod="true" :channelName="data.streamer.login" ref="chat"></twitch-chat>
|
||||
<twitch-chat
|
||||
v-if="chatVisible()"
|
||||
:isVod="true"
|
||||
:channelName="data.streamer.login"
|
||||
ref="chat"
|
||||
></twitch-chat>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Reference in a new issue