update
This commit is contained in:
parent
ffc3614d87
commit
88800a938e
10 changed files with 299 additions and 203 deletions
|
|
@ -14,8 +14,13 @@ This repo is only a proof of concept to see how Poke will run in Astro. A lot of
|
|||
- [ ] Dedicated Redirect Page
|
||||
- [ ] Should pull from instances list (git.poketube.fun, not Codeberg)
|
||||
- [ ] Search
|
||||
- Revamp Experience
|
||||
- Filters
|
||||
- Auto Complete
|
||||
- [ ] Video Page
|
||||
- [ ] Toggle:
|
||||
- [ ] Audio Only
|
||||
- [ ] Autoplay
|
||||
- [ ] User Settings
|
||||
- [ ] Invidious Server Selection
|
||||
- [ ] SafeTwitch Backend Server Selection
|
||||
|
|
@ -23,12 +28,10 @@ This repo is only a proof of concept to see how Poke will run in Astro. A lot of
|
|||
- [ ] Video Player
|
||||
- [ ] Toggle:
|
||||
- [ ] Proxy
|
||||
- [ ] Audio Only
|
||||
- [ ] Autoplay
|
||||
- [ ] Theme
|
||||
- [ ] Preferred Language (For audio track on YouTube)
|
||||
- [ ] Custom CSS/JS
|
||||
- [ ] Import/Export YouTube Subscription
|
||||
- [ ] Import/Export YouTube Subscription (Use local session, no database crap)
|
||||
- [ ] Import/Export Poke User Settings
|
||||
- [x] Add Twitch Support, use [SafeTwitch Backend](https://codeberg.org/SafeTwitch/safetwitch-backend)
|
||||
|
||||
|
|
|
|||
|
|
@ -1,169 +0,0 @@
|
|||
---
|
||||
// Properties
|
||||
const {
|
||||
Icon
|
||||
} = Astro.props
|
||||
|
||||
// i18n
|
||||
import i18next, { t } from "i18next";
|
||||
import { Trans, HeadHrefLangs } from "astro-i18next/components";
|
||||
|
||||
// Icons
|
||||
import {
|
||||
Menu,
|
||||
Settings,
|
||||
ProfileCircle,
|
||||
CircleSpark,
|
||||
Youtube,
|
||||
OpenNewWindow,
|
||||
ViewGrid,
|
||||
Arcade,
|
||||
InfoCircle,
|
||||
PrivacyPolicy,
|
||||
Code,
|
||||
Language,
|
||||
NavArrowLeft,
|
||||
NavArrowRight,
|
||||
List
|
||||
} from '@iconoir/vue'
|
||||
|
||||
// Check URL
|
||||
if (Astro.url.pathname.startsWith('/watch')) {
|
||||
var WatchPage = true
|
||||
} else {
|
||||
var WatchPage = false
|
||||
}
|
||||
---
|
||||
|
||||
<button class="dropdown-button" onclick="ToggleHeaderDropdown()"><Menu/></button>
|
||||
<div id="primary" class="header-dropdown">
|
||||
<p>{t('dropdown.Options')}</p>
|
||||
<a onclick="ToggleHeaderDropdown(); ToggleHeaderLanguageDropdown()" style="justify-content: space-between;"><div><Language/> {t('dropdown.Language')}</div> <NavArrowRight/></a>
|
||||
<a href=""><ProfileCircle/> {t('dropdown.Account')}</a>
|
||||
<a href=""><Settings/> {t('dropdown.Settings')}</a>
|
||||
<a href=""><List/> {t('dropdown.Instances')}</a>
|
||||
|
||||
<p>{t('dropdown.Hub')}</p>
|
||||
<a data-astro-prefetch href=""><ViewGrid/> {t('dropdown.Apps')}</a>
|
||||
<a data-astro-prefetch href=""><Arcade/> {t('dropdown.Games')}</a>
|
||||
|
||||
<!-- Only show this if the end-user is watching a video -->
|
||||
{WatchPage ?
|
||||
<p>{t('dropdown.Openin')}</p>
|
||||
<a href=""><CircleSpark/> {t('dropdown.LiteMode')}</a>
|
||||
<a href=""><Youtube/> {t('dropdown.YouTube')}</a>
|
||||
<a href=""><OpenNewWindow/> {t('dropdown.Invidious')}</a>
|
||||
<a href=""><OpenNewWindow/> {t('dropdown.Pipe')}</a>
|
||||
:
|
||||
null
|
||||
}
|
||||
|
||||
<p>{t('dropdown.Other')}</p>
|
||||
<a data-astro-prefetch href="/about/"><InfoCircle/> {t('dropdown.About')}</a>
|
||||
<a data-astro-prefetch href=""><PrivacyPolicy/> {t('dropdown.Privacy')}</a>
|
||||
<a data-astro-prefetch href=""><Code/> {t('dropdown.SourceCode')}</a>
|
||||
</div>
|
||||
<div id="language" class="header-dropdown">
|
||||
<p>{t('dropdown.Language')}</p>
|
||||
<a onclick="ToggleHeaderDropdown(); ToggleHeaderLanguageDropdown()"><NavArrowLeft/> {t("dropdown.GoBack")}</a>
|
||||
<a href="/api/language/en/">English</a>
|
||||
<a href="/api/language/jp/">日本語</a>
|
||||
</div>
|
||||
|
||||
<script is:inline>
|
||||
/*
|
||||
@licstart The following is the entire license notice for the
|
||||
JavaScript code in this page.
|
||||
|
||||
Copyright (C) 2024 SudoVanilla
|
||||
|
||||
The JavaScript code in this page is free software: you can
|
||||
redistribute it and/or modify it under the terms of the GNU
|
||||
General Public License (GNU GPL) as published by the Free Software
|
||||
Foundation, either version 3 of the License, or (at your option)
|
||||
any later version. The code is distributed WITHOUT ANY WARRANTY;
|
||||
without even the implied warranty of MERCHANTABILITY or FITNESS
|
||||
FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
|
||||
|
||||
As additional permission under GNU GPL version 3 section 7, you
|
||||
may distribute non-source (e.g., minimized or compacted) forms of
|
||||
that code without the copy of the GNU GPL normally required by
|
||||
section 4, provided you include this license notice and a URL
|
||||
through which recipients can access the Corresponding Source.
|
||||
|
||||
|
||||
@licend The above is the entire license notice
|
||||
for the JavaScript code in this page.
|
||||
*/
|
||||
function ToggleHeaderDropdown() {
|
||||
var HeaderDropdown = document.querySelector(".header-dropdown#primary");
|
||||
if (HeaderDropdown.style.display === "flex") {
|
||||
HeaderDropdown.style.display = "none";
|
||||
} else {
|
||||
HeaderDropdown.style.display = "flex";
|
||||
}
|
||||
}
|
||||
function ToggleHeaderLanguageDropdown() {
|
||||
var HeaderLanguageDropdown = document.querySelector(".header-dropdown#language");
|
||||
if (HeaderLanguageDropdown.style.display === "flex") {
|
||||
HeaderLanguageDropdown.style.display = "none";
|
||||
} else {
|
||||
HeaderLanguageDropdown.style.display = "flex";
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.dropdown-button {
|
||||
color: white;
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
aspect-ratio: 1;
|
||||
padding: 4px 6px;
|
||||
&:hover {
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
svg {
|
||||
width: 18px;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
.header-dropdown {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
right: 24px;
|
||||
background: transparent;
|
||||
border-radius: 12px;
|
||||
gap: 6px;
|
||||
padding: 12px 6px 8px 6px;
|
||||
backdrop-filter: blur(24px) brightness(0.1) contrast(0.9);
|
||||
z-index: 5;
|
||||
p {
|
||||
margin: 0px 0px 0px 12px;
|
||||
color: gray;
|
||||
font-size: 12px;
|
||||
}
|
||||
a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
font-size: 14px;
|
||||
text-decoration: none;
|
||||
padding: 6px 12px !important;
|
||||
aspect-ratio: inherit !important;
|
||||
min-width: 200px;
|
||||
border-radius: 6px;
|
||||
&:hover {
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -10,6 +10,7 @@ const {
|
|||
BorderColor = "#222222",
|
||||
BorderWidth = "1px",
|
||||
BorderRadius = "4px",
|
||||
BackDrop,
|
||||
|
||||
// Optionals Options
|
||||
Target = "_self",
|
||||
|
|
@ -28,12 +29,13 @@ const {
|
|||
+ '; border-color: ' + BorderColor
|
||||
+ '; border-width: ' + BorderWidth
|
||||
+ '; border-radius: ' + BorderRadius
|
||||
+ '; backdrop-filter: ' + BackDrop
|
||||
}
|
||||
>
|
||||
<slot/>
|
||||
</a>
|
||||
|
||||
<style lang="scss" is:global>
|
||||
<style lang="scss" is:global define:vars={{ BorderRadius }}>
|
||||
.generic-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -42,12 +44,15 @@ const {
|
|||
border-style: solid;
|
||||
text-decoration: none;
|
||||
max-width: max-content;
|
||||
&:hover {
|
||||
filter: brightness(0.75);
|
||||
}
|
||||
svg {
|
||||
background: rgba(255,255,255,0.1);
|
||||
border-radius: 4px 0px 0px 4px;
|
||||
// background: rgba(255,255,255,0.1);
|
||||
border-radius: var(--BorderRadius) 0px 0px var(--BorderRadius);
|
||||
padding: 6px;
|
||||
margin: -1px;
|
||||
margin-right: 6px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -23,13 +23,13 @@ const {
|
|||
|
||||
// Components
|
||||
import { ViewTransitions } from 'astro:transitions';
|
||||
import { fade } from "astro/virtual-modules/transitions.js";
|
||||
import { slide } from "astro/virtual-modules/transitions.js";
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<ViewTransitions transition:animate={fade} />
|
||||
<ViewTransitions transition:animate={slide} />
|
||||
<title>{Title}</title>
|
||||
<link href=/favicon.ico rel=icon>
|
||||
<link rel="manifest" href="/manifest.json">
|
||||
|
|
|
|||
|
|
@ -5,8 +5,7 @@ import { Trans, HeadHrefLangs } from "astro-i18next/components";
|
|||
|
||||
// Components
|
||||
import { Image } from 'astro:assets';
|
||||
import { actions } from "astro:actions";
|
||||
import Dropdown from '@components/Dropdown.astro'
|
||||
import Button from '@components/generic/Button.astro'
|
||||
|
||||
// Images
|
||||
import Poke from '@assets/poke-text.svg'
|
||||
|
|
@ -17,8 +16,28 @@ import {
|
|||
Gamepad,
|
||||
Settings,
|
||||
Search,
|
||||
Language
|
||||
ProfileCircle,
|
||||
CircleSpark,
|
||||
Youtube,
|
||||
OpenNewWindow,
|
||||
ViewGrid,
|
||||
Arcade,
|
||||
InfoCircle,
|
||||
PrivacyPolicy,
|
||||
Code,
|
||||
Language,
|
||||
NavArrowLeft,
|
||||
NavArrowRight,
|
||||
List
|
||||
} from '@iconoir/vue'
|
||||
import { Menu } from "@iconoir/vue";
|
||||
|
||||
// Check URL
|
||||
if (Astro.url.pathname.startsWith('/watch')) {
|
||||
var WatchPage = true
|
||||
} else {
|
||||
var WatchPage = false
|
||||
}
|
||||
---
|
||||
|
||||
<header>
|
||||
|
|
@ -26,15 +45,56 @@ import {
|
|||
<div class="header-start">
|
||||
<a href={'/'}><Image src={Poke} alt="Poke Logo" height={24} /></a>
|
||||
</div>
|
||||
<div class="header-center">
|
||||
<form>
|
||||
<input type="search" placeholder={t('header.search')}/>
|
||||
<button onclick="Search()"><Search/></button>
|
||||
</form>
|
||||
<!-- <div id="results"></div> -->
|
||||
</div>
|
||||
<div class="header-center"></div>
|
||||
<div class="header-end">
|
||||
<Dropdown/>
|
||||
<Button
|
||||
BackDrop="blur(6px) brightness(1)"
|
||||
Background="transparent"
|
||||
BorderColor="transparent"
|
||||
Color="white"
|
||||
BorderRadius="3rem"
|
||||
><Search width={16}/> Search</Button>
|
||||
<Button
|
||||
BackDrop="blur(6px) brightness(1)"
|
||||
Background="transparent"
|
||||
BorderColor="transparent"
|
||||
Color="white"
|
||||
BorderRadius="3rem"
|
||||
Onclick="ToggleHeaderDropdown()"
|
||||
><Menu width={16}/> Menu</Button>
|
||||
</div>
|
||||
<div id="primary" class="header-dropdown">
|
||||
<p>{t('dropdown.Options')}</p>
|
||||
<a onclick="ToggleHeaderDropdown(); ToggleHeaderLanguageDropdown()" style="justify-content: space-between;"><div><Language/> {t('dropdown.Language')}</div> <NavArrowRight/></a>
|
||||
<a href=""><ProfileCircle/> {t('dropdown.Account')}</a>
|
||||
<a href=""><Settings/> {t('dropdown.Settings')}</a>
|
||||
<a href=""><List/> {t('dropdown.Instances')}</a>
|
||||
|
||||
<p>{t('dropdown.Hub')}</p>
|
||||
<a data-astro-prefetch href=""><ViewGrid/> {t('dropdown.Apps')}</a>
|
||||
<a data-astro-prefetch href=""><Arcade/> {t('dropdown.Games')}</a>
|
||||
|
||||
<!-- Only show this if the end-user is watching a video -->
|
||||
{WatchPage ?
|
||||
<p>{t('dropdown.Openin')}</p>
|
||||
<a href=""><CircleSpark/> {t('dropdown.LiteMode')}</a>
|
||||
<a href=""><Youtube/> {t('dropdown.YouTube')}</a>
|
||||
<a href=""><OpenNewWindow/> {t('dropdown.Invidious')}</a>
|
||||
<a href=""><OpenNewWindow/> {t('dropdown.Pipe')}</a>
|
||||
:
|
||||
null
|
||||
}
|
||||
|
||||
<p>{t('dropdown.Other')}</p>
|
||||
<a data-astro-prefetch href="/about/"><InfoCircle/> {t('dropdown.About')}</a>
|
||||
<a data-astro-prefetch href=""><PrivacyPolicy/> {t('dropdown.Privacy')}</a>
|
||||
<a data-astro-prefetch href=""><Code/> {t('dropdown.SourceCode')}</a>
|
||||
</div>
|
||||
<div id="language" class="header-dropdown">
|
||||
<p>{t('dropdown.Language')}</p>
|
||||
<a onclick="ToggleHeaderDropdown(); ToggleHeaderLanguageDropdown()"><NavArrowLeft/> {t("dropdown.GoBack")}</a>
|
||||
<a href="/api/language/en/">English</a>
|
||||
<a href="/api/language/jp/">日本語</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
|
@ -61,6 +121,117 @@ section 4, provided you include this license notice and a URL
|
|||
through which recipients can access the Corresponding Source.
|
||||
|
||||
|
||||
@licend The above is the entire license notice
|
||||
for the JavaScript code in this page.
|
||||
*/
|
||||
|
||||
// Dismiss when the end-user clicks else where
|
||||
document.body.addEventListener("click", function (evt) {
|
||||
document.querySelector(".header-dropdown#primary").style.display = "none";
|
||||
});
|
||||
|
||||
// Toggle Primary Dropdown
|
||||
function ToggleHeaderDropdown() {
|
||||
var HeaderDropdown = document.querySelector(".header-dropdown#primary");
|
||||
if (HeaderDropdown.style.display === "flex") {
|
||||
setTimeout(() => {
|
||||
HeaderDropdown.style.display = "none";
|
||||
}, 0o100);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
HeaderDropdown.style.display = "flex";
|
||||
}, 0o100);
|
||||
}
|
||||
}
|
||||
|
||||
// Toggle Language Dropdown
|
||||
function ToggleHeaderLanguageDropdown() {
|
||||
var HeaderLanguageDropdown = document.querySelector(".header-dropdown#language");
|
||||
if (HeaderLanguageDropdown.style.display === "flex") {
|
||||
HeaderLanguageDropdown.style.display = "none";
|
||||
} else {
|
||||
HeaderLanguageDropdown.style.display = "flex";
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.dropdown-button {
|
||||
color: white;
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
aspect-ratio: 1;
|
||||
padding: 4px 6px;
|
||||
&:hover {
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
svg {
|
||||
width: 18px;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
.header-dropdown {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
right: 24px;
|
||||
background: transparent;
|
||||
border-radius: 12px;
|
||||
gap: 6px;
|
||||
padding: 12px 6px 8px 6px;
|
||||
backdrop-filter: blur(24px) brightness(0.1) contrast(0.9);
|
||||
z-index: 5;
|
||||
p {
|
||||
margin: 0px 0px 0px 12px;
|
||||
color: gray;
|
||||
font-size: 12px;
|
||||
}
|
||||
a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
font-size: 14px;
|
||||
text-decoration: none;
|
||||
padding: 6px 12px !important;
|
||||
aspect-ratio: inherit !important;
|
||||
min-width: 200px;
|
||||
border-radius: 6px;
|
||||
&:hover {
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script is:inline>
|
||||
/*
|
||||
@licstart The following is the entire license notice for the
|
||||
JavaScript code in this page.
|
||||
|
||||
Copyright (C) 2024 SudoVanilla
|
||||
|
||||
The JavaScript code in this page is free software: you can
|
||||
redistribute it and/or modify it under the terms of the GNU
|
||||
General Public License (GNU GPL) as published by the Free Software
|
||||
Foundation, either version 3 of the License, or (at your option)
|
||||
any later version. The code is distributed WITHOUT ANY WARRANTY;
|
||||
without even the implied warranty of MERCHANTABILITY or FITNESS
|
||||
FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
|
||||
|
||||
As additional permission under GNU GPL version 3 section 7, you
|
||||
may distribute non-source (e.g., minimized or compacted) forms of
|
||||
that code without the copy of the GNU GPL normally required by
|
||||
section 4, provided you include this license notice and a URL
|
||||
through which recipients can access the Corresponding Source.
|
||||
|
||||
|
||||
@licend The above is the entire license notice
|
||||
for the JavaScript code in this page.
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ import Chan from '@assets/chan/v2.png'
|
|||
<Base Title="Poke" Description="▶▶ Poke - The privacy app of your dreams!">
|
||||
<video playsinline autoplay muted loop class="landing-background" src="/flurry-background.webm" type="video/webm"/>
|
||||
<div class="landing">
|
||||
<h1>{t("landing.heading")}</h1>
|
||||
<h1><span style="-webkit-text-stroke: 1px white; color: transparent;">{t("landing.heading1")}</span> {t("landing.heading2")}</h1>
|
||||
<p style="max-width: 800px;">{t("landing.description")}</p>
|
||||
|
||||
<div style="display: flex; gap: 12px;">
|
||||
|
|
@ -122,6 +122,20 @@ video {
|
|||
opacity: .27;
|
||||
pointer-events: none;
|
||||
}
|
||||
.inline-it {
|
||||
position: fixed;
|
||||
top: 64px;
|
||||
left: inherit;
|
||||
width: 404px !important;
|
||||
height: max-content;
|
||||
object-fit: cover;
|
||||
z-index: 1;
|
||||
opacity: 1;
|
||||
border-radius: 14px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.landing {
|
||||
margin: auto;
|
||||
position: relative;
|
||||
|
|
|
|||
71
src/pages/search-start.astro
Normal file
71
src/pages/search-start.astro
Normal file
|
|
@ -0,0 +1,71 @@
|
|||
---
|
||||
// Layout
|
||||
import Base from "@layouts/Default.astro";
|
||||
|
||||
// i18n
|
||||
import i18next, { t } from "i18next";
|
||||
import { Trans, HeadHrefLangs } from "astro-i18next/components";
|
||||
|
||||
// Fetch Suggestions
|
||||
|
||||
---
|
||||
|
||||
<Base Title="Poke" Description="▶▶ Poke - The privacy app of your dreams!">
|
||||
<input type="search" placeholder="Poke Search..."/>
|
||||
<div class="suggestions">
|
||||
<p style="display: none" id="yt-text">YouTube Suggestions:</p>
|
||||
<div id="suggestions-for-youtube"></div>
|
||||
</div>
|
||||
</Base>
|
||||
|
||||
<script is:inline>
|
||||
/*
|
||||
@licstart The following is the entire license notice for the
|
||||
JavaScript code in this page.
|
||||
|
||||
Copyright (C) 2024 SudoVanilla
|
||||
|
||||
The JavaScript code in this page is free software: you can
|
||||
redistribute it and/or modify it under the terms of the GNU
|
||||
General Public License (GNU GPL) as published by the Free Software
|
||||
Foundation, either version 3 of the License, or (at your option)
|
||||
any later version. The code is distributed WITHOUT ANY WARRANTY;
|
||||
without even the implied warranty of MERCHANTABILITY or FITNESS
|
||||
FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
|
||||
|
||||
As additional permission under GNU GPL version 3 section 7, you
|
||||
may distribute non-source (e.g., minimized or compacted) forms of
|
||||
that code without the copy of the GNU GPL normally required by
|
||||
section 4, provided you include this license notice and a URL
|
||||
through which recipients can access the Corresponding Source.
|
||||
|
||||
|
||||
@licend The above is the entire license notice
|
||||
for the JavaScript code in this page.
|
||||
*/
|
||||
|
||||
// When the end-user starts typing, trigget the fetch function
|
||||
document.querySelector('input[type="search"]').addEventListener('input', function(e) {
|
||||
if (e.target.value !== '') {
|
||||
document.getElementById('yt-text').style.display = 'inherit'
|
||||
GetResults()
|
||||
}
|
||||
else {null}
|
||||
});
|
||||
|
||||
// Fetch
|
||||
function GetResults() {
|
||||
var SearchValue = document.querySelector('input[type="search"]').value
|
||||
var YouTubeSuggestions = document.getElementById('suggestions-for-youtube')
|
||||
fetch(`https://yt.sudovanilla.org/api/v1/search/suggestions?q=${SearchValue}`)
|
||||
.then(response => response.json())
|
||||
.then(data => {YouTubeSuggestions.innerHTML = ListOfSuggestionsYT(data)})
|
||||
}
|
||||
|
||||
// Create List
|
||||
function ListOfSuggestionsYT(data) {
|
||||
const text = data.suggestions.map(data => `<li><a href="/search?query=${data}">${data}</a></li>`).join("\n")
|
||||
return `<ul class="suggestions">${text}</ul>`
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
@ -14,15 +14,14 @@ const comments = await fetch('https://' + DEFAULT_INVIDIOUS_INSTANCE + "/api/v1/
|
|||
---
|
||||
|
||||
<Base Title={video.title}>
|
||||
<div class="video-container">
|
||||
<video
|
||||
autoplay
|
||||
controls
|
||||
poster={'https://i.ytimg.com/vi/' + video.videoId + '/maxresdefault.jpg'}
|
||||
video-title={video.title}
|
||||
style="width: 100%;"
|
||||
src={'https://' + DEFAULT_INVIDIOUS_INSTANCE + '/latest_version?id=' + video.videoId}
|
||||
>
|
||||
</video>
|
||||
</div>
|
||||
<video
|
||||
class="inline-it"
|
||||
autoplay
|
||||
controls
|
||||
poster={'https://i.ytimg.com/vi/' + video.videoId + '/maxresdefault.jpg'}
|
||||
video-title={video.title}
|
||||
style="width: 100%;"
|
||||
src={'https://' + DEFAULT_INVIDIOUS_INSTANCE + '/latest_version?id=' + video.videoId}
|
||||
>
|
||||
</video>
|
||||
</Base>
|
||||
|
|
@ -23,7 +23,8 @@
|
|||
"GoBack": "Go Back"
|
||||
},
|
||||
"landing": {
|
||||
"heading": "PRIVACY APP OF YOUR DREAMS",
|
||||
"heading1": "PRIVACY APP",
|
||||
"heading2": "OF YOUR DREAMS",
|
||||
"description": "Poke is a free software youtube front-end, search engine, translator, map app and even more!!1!! Watch silly videos, search stuff on the internet and do all of that and more anonymously in this all-in-one privacy app!!!1! :3",
|
||||
"why": "Why Choose Poke?",
|
||||
"Card1Title": "No Tracking and Ads",
|
||||
|
|
|
|||
|
|
@ -23,7 +23,8 @@
|
|||
"GoBack": "戻る"
|
||||
},
|
||||
"landing": {
|
||||
"heading": "あなたの夢のプライバシーアプリ",
|
||||
"heading1": "のプライバシーアプリ",
|
||||
"heading2": "君の夢の",
|
||||
"description": "Pokeは、無料のソフトウェアyoutubeフロントエンド、検索エンジン、翻訳者、マップアプリなどです!!1!! サイレント動画を見ると、インターネット上のものを検索し、このオールインワンのプライバシーアプリで、そのすべてを匿名で行います!",
|
||||
"why": "ポケモンを選ぶ理由?",
|
||||
"Card1Title": "追跡および広告無し",
|
||||
|
|
|
|||
Reference in a new issue