2023-12-25 17:57:33 +00:00
|
|
|
import { checkbox, collapsibleList, explanation, footerButtons, multiPagePopup, popup, popupWithBottomButtons, sep, settingsCategory, switcher, socialLink, socialLinks, urgentNotice, keyboardShortcuts, webLoc, sponsoredList, betaTag, linkSVG } from "./elements.js";
|
2023-12-25 11:46:33 +00:00
|
|
|
import { services as s, authorInfo, version, repo, donations, supportedAudio, links } from "../config.js";
|
2022-08-12 14:36:19 +01:00
|
|
|
import { getCommitInfo } from "../sub/currentCommit.js";
|
|
|
|
|
import loc from "../../localization/manager.js";
|
|
|
|
|
import emoji from "../emoji.js";
|
2022-09-11 16:04:06 +01:00
|
|
|
import changelogManager from "../changelog/changelogManager.js";
|
2022-08-12 14:36:19 +01:00
|
|
|
|
|
|
|
|
let com = getCommitInfo();
|
|
|
|
|
|
2023-08-22 20:03:31 +01:00
|
|
|
let enabledServices = Object.keys(s).filter(p => s[p].enabled).sort().map((p) => {
|
2022-12-06 19:21:07 +00:00
|
|
|
return `<br>• ${s[p].alias ? s[p].alias : p}`
|
2023-01-29 18:17:33 +00:00
|
|
|
}).join('').substring(4)
|
2022-08-12 14:36:19 +01:00
|
|
|
|
|
|
|
|
let donate = ``
|
|
|
|
|
let donateLinks = ``
|
|
|
|
|
let audioFormats = supportedAudio.map((p) => {
|
2022-08-16 08:14:19 +01:00
|
|
|
return { "action": p }
|
2022-08-12 14:36:19 +01:00
|
|
|
})
|
|
|
|
|
audioFormats.unshift({ "action": "best" })
|
2022-11-20 13:46:08 +00:00
|
|
|
for (let i in donations["links"]) {
|
|
|
|
|
donateLinks += `<a id="don-${i}" class="switch autowidth" href="${donations["links"][i]}" target="_blank">REPLACEME ${i}</a>`
|
2022-08-12 14:36:19 +01:00
|
|
|
}
|
|
|
|
|
let extr = ''
|
|
|
|
|
for (let i in donations["crypto"]) {
|
|
|
|
|
donate += `<div class="subtitle${extr}">${i} (REPLACEME)</div><div id="don-${i}" class="text-to-copy" onClick="copy('don-${i}')">${donations["crypto"][i]}</div>`
|
2022-09-28 13:21:36 +01:00
|
|
|
extr = ' top-margin'
|
2022-08-12 14:36:19 +01:00
|
|
|
}
|
2023-01-13 18:34:48 +00:00
|
|
|
|
2022-08-12 14:36:19 +01:00
|
|
|
export default function(obj) {
|
2023-01-13 18:34:48 +00:00
|
|
|
const t = (str, replace) => { return loc(obj.lang, str, replace) };
|
2023-08-04 19:43:12 +01:00
|
|
|
|
2022-09-08 17:02:55 +01:00
|
|
|
let ua = obj.useragent.toLowerCase();
|
|
|
|
|
let isIOS = ua.match("iphone os");
|
|
|
|
|
let isMobile = ua.match("android") || ua.match("iphone os");
|
2023-03-09 18:41:17 +00:00
|
|
|
|
2023-09-08 11:01:54 +01:00
|
|
|
let platform = isMobile ? "m" : "d";
|
2023-03-09 18:41:17 +00:00
|
|
|
if (isMobile && isIOS) platform = "i";
|
|
|
|
|
|
2023-01-13 18:34:48 +00:00
|
|
|
audioFormats[0]["text"] = t('SettingsAudioFormatBest');
|
|
|
|
|
|
2022-08-12 14:36:19 +01:00
|
|
|
try {
|
2023-08-04 19:43:12 +01:00
|
|
|
return `
|
|
|
|
|
<!DOCTYPE html>
|
2023-07-14 17:19:58 +01:00
|
|
|
<html lang="${obj.lang}">
|
2022-08-12 14:36:19 +01:00
|
|
|
<head>
|
2024-01-13 00:20:36 +00:00
|
|
|
<meta charset="utf-8">
|
2024-01-12 23:43:26 +00:00
|
|
|
<meta name="viewport" content="viewport-fit=cover, width=device-width, height=device-height, initial-scale=1, maximum-scale=${isIOS ? `1` : `5`}">
|
2022-08-12 14:36:19 +01:00
|
|
|
|
2023-08-04 19:43:12 +01:00
|
|
|
<title>${t("AppTitleCobalt")}</title>
|
2022-08-12 14:36:19 +01:00
|
|
|
|
2024-01-13 00:01:31 +00:00
|
|
|
<meta property="og:url" content="${process.env.webURL}">
|
2024-01-12 23:43:26 +00:00
|
|
|
<meta property="og:title" content="${t("AppTitleCobalt")}">
|
|
|
|
|
<meta property="og:description" content="${t('EmbedBriefDescription')}">
|
2024-01-13 00:01:31 +00:00
|
|
|
<meta property="og:image" content="${process.env.webURL}icons/generic.png">
|
2024-01-12 23:43:26 +00:00
|
|
|
<meta name="title" content="${t("AppTitleCobalt")}">
|
|
|
|
|
<meta name="description" content="${t('AboutSummary')}">
|
|
|
|
|
<meta name="theme-color" content="#000000">
|
|
|
|
|
<meta name="twitter:card" content="summary">
|
2023-08-04 19:43:12 +01:00
|
|
|
|
|
|
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
|
|
|
|
<meta name="apple-mobile-web-app-title" content="${t("AppTitleCobalt")}">
|
2022-08-12 14:36:19 +01:00
|
|
|
|
2024-01-12 23:43:26 +00:00
|
|
|
<link rel="icon" type="image/x-icon" href="icons/favicon.ico">
|
|
|
|
|
<link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png">
|
|
|
|
|
<link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png">
|
2023-08-04 19:43:12 +01:00
|
|
|
|
2024-01-12 23:43:26 +00:00
|
|
|
<link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png">
|
|
|
|
|
|
|
|
|
|
<link rel="manifest" href="manifest.webmanifest">
|
2024-01-12 23:44:30 +00:00
|
|
|
<link rel="preload" href="fonts/notosansmono.css" as="style">
|
|
|
|
|
<link rel="stylesheet" href="fonts/notosansmono.css">
|
2024-01-12 23:43:26 +00:00
|
|
|
<link rel="stylesheet" href="cobalt.css">
|
2022-08-12 14:36:19 +01:00
|
|
|
|
|
|
|
|
</head>
|
2024-01-17 12:04:02 +00:00
|
|
|
<body id="cobalt-body" ${platform === "d" ? 'class="desktop"' : ''}>
|
2024-01-12 23:43:26 +00:00
|
|
|
<noscript>
|
|
|
|
|
<div style="margin: 2rem;">${t('NoScriptMessage')}</div>
|
|
|
|
|
</noscript>
|
2022-08-12 14:36:19 +01:00
|
|
|
${multiPagePopup({
|
|
|
|
|
name: "about",
|
2023-08-04 19:43:12 +01:00
|
|
|
closeAria: t('AccessibilityGoBack'),
|
2022-08-12 14:36:19 +01:00
|
|
|
tabs: [{
|
|
|
|
|
name: "about",
|
2023-01-13 18:34:48 +00:00
|
|
|
title: `${emoji("🐲")} ${t('AboutTab')}`,
|
2022-08-12 14:36:19 +01:00
|
|
|
content: popup({
|
|
|
|
|
name: "about",
|
|
|
|
|
header: {
|
|
|
|
|
aboveTitle: {
|
2023-01-13 18:34:48 +00:00
|
|
|
text: t('MadeWithLove'),
|
2022-08-12 14:36:19 +01:00
|
|
|
url: authorInfo.link
|
|
|
|
|
},
|
2023-08-04 19:43:12 +01:00
|
|
|
closeAria: t('AccessibilityGoBack'),
|
2023-01-29 18:17:33 +00:00
|
|
|
title: `${emoji("🔮", 30)} ${t('TitlePopupAbout')}`
|
2022-08-12 14:36:19 +01:00
|
|
|
},
|
|
|
|
|
body: [{
|
2023-01-13 18:34:48 +00:00
|
|
|
text: t('AboutSummary')
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2023-01-29 18:17:33 +00:00
|
|
|
text: collapsibleList([{
|
2023-08-04 19:43:12 +01:00
|
|
|
name: "services",
|
2023-08-11 16:53:30 +01:00
|
|
|
title: `${emoji("🔗")} ${t("CollapseServices")}`,
|
2023-09-16 18:38:07 +01:00
|
|
|
body: `${enabledServices}`
|
|
|
|
|
+ `<div class="explanation embedded">${t("SupportNotAffiliated")}`
|
|
|
|
|
+ `${obj.lang === "ru" ? `<br>${t("SupportMetaNoticeRU")}` : ''}`
|
|
|
|
|
+ `</div>`
|
|
|
|
|
+ `${t("ServicesNote")}`
|
2023-08-11 16:53:30 +01:00
|
|
|
}, {
|
|
|
|
|
name: "keyboard",
|
|
|
|
|
title: `${emoji("⌨")} ${t("CollapseKeyboard")}`,
|
|
|
|
|
body:
|
|
|
|
|
`${t("KeyboardShortcutsIntro")}
|
|
|
|
|
${keyboardShortcuts([{
|
|
|
|
|
items: [{
|
|
|
|
|
combo: "Shift+D",
|
|
|
|
|
name: t("PasteFromClipboard")
|
|
|
|
|
}, {
|
|
|
|
|
combo: "Shift+K",
|
|
|
|
|
name: t("ModeToggleAuto")
|
|
|
|
|
}, {
|
|
|
|
|
combo: "Shift+L",
|
|
|
|
|
name: t("ModeToggleAudio")
|
|
|
|
|
}]
|
|
|
|
|
}, {
|
|
|
|
|
items: [{
|
2023-12-20 18:31:48 +00:00
|
|
|
combo: "⌘/Ctrl+V",
|
2023-08-11 16:53:30 +01:00
|
|
|
name: t("KeyboardShortcutQuickPaste")
|
|
|
|
|
}, {
|
2023-08-13 19:09:50 +01:00
|
|
|
combo: "Esc",
|
2023-08-11 16:53:30 +01:00
|
|
|
name: t("KeyboardShortcutClear")
|
|
|
|
|
}, {
|
|
|
|
|
combo: "Esc",
|
|
|
|
|
name: t("KeyboardShortcutClosePopup")
|
|
|
|
|
}]
|
|
|
|
|
}, {
|
|
|
|
|
items: [{
|
|
|
|
|
combo: "Shift+B",
|
|
|
|
|
name: t("AboutTab")
|
|
|
|
|
}, {
|
|
|
|
|
combo: "Shift+N",
|
|
|
|
|
name: t("ChangelogTab")
|
|
|
|
|
}, {
|
|
|
|
|
combo: "Shift+M",
|
|
|
|
|
name: t("TitlePopupSettings")
|
|
|
|
|
}]
|
|
|
|
|
}])}`
|
2023-01-29 18:17:33 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
name: "support",
|
2023-08-11 16:53:30 +01:00
|
|
|
title: `${emoji("❤️🩹")} ${t("CollapseSupport")}`,
|
2023-12-25 11:46:33 +00:00
|
|
|
body: `${t("SupportSelfTroubleshooting")}`
|
|
|
|
|
+ `${socialLink(emoji("📢"), t("StatusPage"), links.statusPage)}`
|
|
|
|
|
+ `${socialLink(emoji("🔧"), t("TroubleshootingGuide"), links.troubleshootingGuide)}`
|
2024-01-13 00:20:36 +00:00
|
|
|
+ `<br>`
|
2023-12-25 11:46:33 +00:00
|
|
|
+ `${t("FollowSupport")}`
|
|
|
|
|
+ `${socialLinks(obj.lang)}`
|
2024-01-13 00:20:36 +00:00
|
|
|
+ `<br>`
|
2023-12-25 11:46:33 +00:00
|
|
|
+ `${t("SourceCode")}`
|
|
|
|
|
+ `${socialLink(emoji("🐙"), repo.replace("https://github.com/", ''), repo)}`
|
2023-01-29 18:17:33 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
name: "privacy",
|
2023-08-11 16:53:30 +01:00
|
|
|
title: `${emoji("🔒")} ${t("CollapsePrivacy")}`,
|
2023-08-04 19:43:12 +01:00
|
|
|
body: t("PrivacyPolicy")
|
2023-08-13 19:09:50 +01:00
|
|
|
}, {
|
|
|
|
|
name: "legal",
|
|
|
|
|
title: `${emoji("📑")} ${t("CollapseLegal")}`,
|
|
|
|
|
body: t("FairUse")
|
2023-01-29 18:17:33 +00:00
|
|
|
}])
|
2023-10-12 12:33:26 +01:00
|
|
|
},
|
|
|
|
|
...(process.env.showSponsors ?
|
|
|
|
|
[{
|
|
|
|
|
text: t("SponsoredBy"),
|
|
|
|
|
classes: ["sponsored-by-text"],
|
|
|
|
|
nopadding: true
|
|
|
|
|
}, {
|
|
|
|
|
text: sponsoredList(),
|
|
|
|
|
raw: true
|
|
|
|
|
}] : []
|
|
|
|
|
)]
|
2022-08-12 14:36:19 +01:00
|
|
|
})
|
|
|
|
|
}, {
|
|
|
|
|
name: "changelog",
|
2023-01-13 18:34:48 +00:00
|
|
|
title: `${emoji("🎉")} ${t('ChangelogTab')}`,
|
2022-08-12 14:36:19 +01:00
|
|
|
content: popup({
|
|
|
|
|
name: "changelog",
|
|
|
|
|
header: {
|
2023-08-04 19:43:12 +01:00
|
|
|
closeAria: t('AccessibilityGoBack'),
|
2023-01-13 18:34:48 +00:00
|
|
|
title: `${emoji("🪄", 30)} ${t('TitlePopupChangelog')}`
|
2022-08-12 14:36:19 +01:00
|
|
|
},
|
|
|
|
|
body: [{
|
2023-01-13 18:34:48 +00:00
|
|
|
text: `<div class="category-title">${t('ChangelogLastMajor')}</div>`,
|
2022-08-12 14:36:19 +01:00
|
|
|
raw: true
|
2022-11-12 16:40:11 +00:00
|
|
|
}, {
|
2024-01-14 23:53:06 +00:00
|
|
|
text: (() => {
|
|
|
|
|
const banner = changelogManager('banner');
|
|
|
|
|
if (!banner) return '';
|
|
|
|
|
return `<div class="changelog-banner">
|
|
|
|
|
<img class="changelog-img" ` +
|
|
|
|
|
`src="${banner.url}" ` +
|
|
|
|
|
`alt="${banner.alt.replaceAll('"', '"')}" ` +
|
|
|
|
|
`width="${banner.width}" ` +
|
|
|
|
|
`height="${banner.height}" ` +
|
|
|
|
|
`onerror="this.style.opacity=0" loading="lazy">
|
|
|
|
|
</div>`;
|
|
|
|
|
})(),
|
2022-11-12 16:40:11 +00:00
|
|
|
raw: true
|
2023-08-04 19:43:12 +01:00
|
|
|
}, {
|
|
|
|
|
text: changelogManager("version"),
|
|
|
|
|
classes: ["changelog-tags"],
|
|
|
|
|
nopadding: true
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2022-09-11 16:04:06 +01:00
|
|
|
text: changelogManager("title"),
|
2022-08-12 14:36:19 +01:00
|
|
|
classes: ["changelog-subtitle"],
|
|
|
|
|
nopadding: true
|
2022-08-19 18:54:20 +01:00
|
|
|
}, {
|
2022-10-02 15:13:33 +01:00
|
|
|
text: changelogManager("content")
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
text: sep(),
|
|
|
|
|
raw: true
|
|
|
|
|
},{
|
|
|
|
|
text: `<a class="text-backdrop changelog-tag-version" href="${repo}/commit/${obj.hash}">#${obj.hash}</a>`,
|
|
|
|
|
classes: ["changelog-tags"],
|
|
|
|
|
nopadding: true
|
|
|
|
|
}, {
|
|
|
|
|
text: com[0],
|
2022-08-12 14:36:19 +01:00
|
|
|
classes: ["changelog-subtitle"],
|
|
|
|
|
nopadding: true
|
|
|
|
|
}, {
|
|
|
|
|
text: com[1]
|
2022-09-11 16:04:06 +01:00
|
|
|
}, {
|
2023-01-13 18:34:48 +00:00
|
|
|
text: `<div class="category-title">${t('ChangelogOlder')}</div>`,
|
2022-09-11 16:04:06 +01:00
|
|
|
raw: true
|
|
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
text: `
|
|
|
|
|
<div id="changelog-history">
|
|
|
|
|
<button class="switch bottom-margin" onclick="loadOnDemand('changelog-history', '0')">${t("ChangelogPressToExpand")}</button>
|
|
|
|
|
</div>`,
|
2022-09-11 16:04:06 +01:00
|
|
|
raw: true
|
2022-08-12 14:36:19 +01:00
|
|
|
}]
|
|
|
|
|
})
|
|
|
|
|
}, {
|
|
|
|
|
name: "donate",
|
2023-05-17 17:50:11 +01:00
|
|
|
title: `${emoji("💖")} ${t('DonationsTab')}`,
|
2022-08-12 14:36:19 +01:00
|
|
|
content: popup({
|
|
|
|
|
name: "donate",
|
|
|
|
|
header: {
|
2023-08-04 19:43:12 +01:00
|
|
|
closeAria: t('AccessibilityGoBack'),
|
2023-01-13 18:34:48 +00:00
|
|
|
title: emoji("💸", 30) + t('TitlePopupDonate')
|
2022-08-12 14:36:19 +01:00
|
|
|
},
|
|
|
|
|
body: [{
|
2023-01-13 18:34:48 +00:00
|
|
|
text: `<div class="category-title">${t('DonateSub')}</div>`,
|
|
|
|
|
raw: true
|
|
|
|
|
}, {
|
2024-01-13 00:20:36 +00:00
|
|
|
text: `
|
|
|
|
|
<div class="changelog-banner">
|
2023-08-11 16:53:30 +01:00
|
|
|
<img class="changelog-img" ` +
|
2024-01-13 00:20:36 +00:00
|
|
|
`src="updateBanners/catsleep.webp" ` +
|
2024-01-17 10:47:08 +00:00
|
|
|
`alt="${t("DonateImageDescription")}" ` +
|
2023-08-11 16:53:30 +01:00
|
|
|
`width="480" ` +
|
|
|
|
|
`height="270" ` +
|
2024-01-13 00:20:36 +00:00
|
|
|
`onerror="this.style.opacity=0" loading="lazy">
|
2023-08-04 19:43:12 +01:00
|
|
|
</div>`,
|
2022-11-20 13:46:08 +00:00
|
|
|
raw: true
|
|
|
|
|
}, {
|
2023-01-13 18:34:48 +00:00
|
|
|
text: t('DonateExplanation')
|
|
|
|
|
}, {
|
|
|
|
|
text: donateLinks.replace(/REPLACEME/g, t('DonateVia')),
|
2022-08-12 14:36:19 +01:00
|
|
|
raw: true
|
|
|
|
|
}, {
|
2023-01-13 18:34:48 +00:00
|
|
|
text: t('DonateLinksDescription'),
|
2022-08-12 14:36:19 +01:00
|
|
|
classes: ["explanation"]
|
|
|
|
|
}, {
|
2022-12-17 11:09:49 +00:00
|
|
|
text: sep(),
|
2022-11-20 13:46:08 +00:00
|
|
|
raw: true
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2023-01-13 18:34:48 +00:00
|
|
|
text: donate.replace(/REPLACEME/g, t('ClickToCopy')),
|
2022-11-20 13:46:08 +00:00
|
|
|
classes: ["desc-padding"]
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2022-12-17 11:09:49 +00:00
|
|
|
text: sep(),
|
2022-11-20 13:46:08 +00:00
|
|
|
raw: true
|
|
|
|
|
}, {
|
2023-01-13 18:34:48 +00:00
|
|
|
text: t('DonateHireMe', authorInfo.link),
|
2022-11-20 13:46:08 +00:00
|
|
|
classes: ["desc-padding"]
|
2022-08-12 14:36:19 +01:00
|
|
|
}]
|
|
|
|
|
})
|
|
|
|
|
}],
|
|
|
|
|
})}
|
|
|
|
|
${multiPagePopup({
|
|
|
|
|
name: "settings",
|
2023-08-04 19:43:12 +01:00
|
|
|
closeAria: t('AccessibilityGoBack'),
|
2022-08-12 14:36:19 +01:00
|
|
|
header: {
|
|
|
|
|
aboveTitle: {
|
2023-03-09 18:41:17 +00:00
|
|
|
text: `v.${version}-${obj.hash}${platform} (${obj.branch})`,
|
2022-08-22 15:10:54 +01:00
|
|
|
url: `${repo}/commit/${obj.hash}`
|
2022-08-12 14:36:19 +01:00
|
|
|
},
|
2023-01-13 18:34:48 +00:00
|
|
|
title: `${emoji("⚙️", 30)} ${t('TitlePopupSettings')}`
|
2022-08-12 14:36:19 +01:00
|
|
|
},
|
|
|
|
|
tabs: [{
|
|
|
|
|
name: "video",
|
2023-01-13 18:34:48 +00:00
|
|
|
title: `${emoji("🎬")} ${t('SettingsVideoTab')}`,
|
2022-08-12 14:36:19 +01:00
|
|
|
content: settingsCategory({
|
|
|
|
|
name: "downloads",
|
2023-02-26 16:49:25 +00:00
|
|
|
title: t('SettingsQualitySubtitle'),
|
2022-08-12 14:36:19 +01:00
|
|
|
body: switcher({
|
2022-11-04 08:49:58 +00:00
|
|
|
name: "vQuality",
|
2023-01-13 18:34:48 +00:00
|
|
|
explanation: t('SettingsQualityDescription'),
|
2022-08-12 14:36:19 +01:00
|
|
|
items: [{
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "max",
|
|
|
|
|
text: "8k+"
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "2160",
|
|
|
|
|
text: "4k"
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "1440",
|
|
|
|
|
text: "1440p"
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "1080",
|
|
|
|
|
text: "1080p"
|
2023-02-26 16:49:25 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "720",
|
|
|
|
|
text: "720p"
|
2023-02-26 16:49:25 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "480",
|
|
|
|
|
text: "480p"
|
2023-02-26 16:49:25 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "360",
|
|
|
|
|
text: "360p"
|
2022-08-12 14:36:19 +01:00
|
|
|
}]
|
|
|
|
|
})
|
2023-01-13 18:34:48 +00:00
|
|
|
})
|
|
|
|
|
+ settingsCategory({
|
2024-01-13 00:25:18 +00:00
|
|
|
name: "tiktok-watermark",
|
2023-07-14 17:19:58 +01:00
|
|
|
title: "tiktok",
|
2023-08-04 19:43:12 +01:00
|
|
|
body: checkbox([{
|
|
|
|
|
action: "disableTikTokWatermark",
|
|
|
|
|
name: t("SettingsRemoveWatermark"),
|
|
|
|
|
padding: "no-margin"
|
|
|
|
|
}])
|
2023-01-13 18:34:48 +00:00
|
|
|
})
|
2024-01-17 05:38:51 +00:00
|
|
|
+ settingsCategory({
|
|
|
|
|
name: "twitter",
|
|
|
|
|
title: "twitter",
|
|
|
|
|
body: checkbox([{
|
|
|
|
|
action: "twitterGif",
|
|
|
|
|
name: t("SettingsTwitterGif"),
|
|
|
|
|
padding: "no-margin"
|
|
|
|
|
}])
|
|
|
|
|
+ explanation(t('SettingsTwitterGifDescription'))
|
|
|
|
|
})
|
2023-01-13 18:34:48 +00:00
|
|
|
+ settingsCategory({
|
2023-10-12 18:14:54 +01:00
|
|
|
name: "codec",
|
|
|
|
|
title: t('SettingsCodecSubtitle'),
|
2023-01-13 18:34:48 +00:00
|
|
|
body: switcher({
|
2023-02-26 16:49:25 +00:00
|
|
|
name: "vCodec",
|
|
|
|
|
explanation: t('SettingsCodecDescription'),
|
2023-01-13 18:34:48 +00:00
|
|
|
items: [{
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "h264",
|
|
|
|
|
text: "h264 (mp4)"
|
2023-02-26 16:49:25 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "av1",
|
|
|
|
|
text: "av1 (mp4)"
|
2023-01-13 18:34:48 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "vp9",
|
|
|
|
|
text: "vp9 (webm)"
|
2023-01-13 18:34:48 +00:00
|
|
|
}]
|
2022-08-16 11:31:41 +01:00
|
|
|
})
|
2023-01-13 18:34:48 +00:00
|
|
|
})
|
2023-03-15 16:18:31 +00:00
|
|
|
+ settingsCategory({
|
2023-10-12 18:14:54 +01:00
|
|
|
name: "vimeo",
|
|
|
|
|
title: t('SettingsVimeoPrefer'),
|
2023-03-15 16:18:31 +00:00
|
|
|
body: switcher({
|
|
|
|
|
name: "vimeoDash",
|
|
|
|
|
explanation: t('SettingsVimeoPreferDescription'),
|
|
|
|
|
items: [{
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "false",
|
|
|
|
|
text: "progressive"
|
2023-03-15 16:18:31 +00:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "true",
|
|
|
|
|
text: "dash"
|
2023-03-15 16:18:31 +00:00
|
|
|
}]
|
|
|
|
|
})
|
|
|
|
|
})
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
|
|
|
|
name: "audio",
|
2023-01-13 18:34:48 +00:00
|
|
|
title: `${emoji("🎶")} ${t('SettingsAudioTab')}`,
|
2022-08-12 14:36:19 +01:00
|
|
|
content: settingsCategory({
|
|
|
|
|
name: "general",
|
2023-02-26 16:49:25 +00:00
|
|
|
title: t('SettingsFormatSubtitle'),
|
2023-08-04 19:43:12 +01:00
|
|
|
body: switcher({
|
|
|
|
|
name: "aFormat",
|
|
|
|
|
explanation: t('SettingsAudioFormatDescription'),
|
|
|
|
|
items: audioFormats
|
|
|
|
|
})
|
|
|
|
|
+ sep(0)
|
|
|
|
|
+ checkbox([{
|
|
|
|
|
action: "muteAudio",
|
|
|
|
|
name: t("SettingsVideoMute"),
|
|
|
|
|
padding: "no-margin"
|
|
|
|
|
}])
|
|
|
|
|
+ explanation(t('SettingsVideoMuteExplanation'))
|
|
|
|
|
})
|
|
|
|
|
+ settingsCategory({
|
|
|
|
|
name: "dub",
|
|
|
|
|
title: t("SettingsAudioDub"),
|
|
|
|
|
body: switcher({
|
|
|
|
|
name: "dubLang",
|
|
|
|
|
explanation: t('SettingsAudioDubDescription'),
|
|
|
|
|
items: [{
|
|
|
|
|
action: "original",
|
|
|
|
|
text: t('SettingsDubDefault')
|
|
|
|
|
}, {
|
|
|
|
|
action: "auto",
|
|
|
|
|
text: t('SettingsDubAuto')
|
|
|
|
|
}]
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
+ settingsCategory({
|
2024-01-13 00:25:18 +00:00
|
|
|
name: "tiktok-audio",
|
2023-08-04 19:43:12 +01:00
|
|
|
title: "tiktok",
|
|
|
|
|
body: checkbox([{
|
|
|
|
|
action: "fullTikTokAudio",
|
|
|
|
|
name: t("SettingsAudioFullTikTok"),
|
|
|
|
|
padding: "no-margin"
|
|
|
|
|
}])
|
|
|
|
|
+ explanation(t('SettingsAudioFullTikTokDescription'))
|
|
|
|
|
})
|
2022-08-12 14:36:19 +01:00
|
|
|
}, {
|
|
|
|
|
name: "other",
|
2023-01-13 18:34:48 +00:00
|
|
|
title: `${emoji("🪅")} ${t('SettingsOtherTab')}`,
|
2022-08-12 14:36:19 +01:00
|
|
|
content: settingsCategory({
|
|
|
|
|
name: "appearance",
|
2023-01-13 18:34:48 +00:00
|
|
|
title: t('SettingsAppearanceSubtitle'),
|
2022-08-12 14:36:19 +01:00
|
|
|
body: switcher({
|
|
|
|
|
name: "theme",
|
|
|
|
|
items: [{
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "auto",
|
|
|
|
|
text: t('SettingsThemeAuto')
|
2022-08-16 08:14:19 +01:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "dark",
|
|
|
|
|
text: t('SettingsThemeDark')
|
2022-08-16 08:14:19 +01:00
|
|
|
}, {
|
2023-08-04 19:43:12 +01:00
|
|
|
action: "light",
|
|
|
|
|
text: t('SettingsThemeLight')
|
2022-08-12 14:36:19 +01:00
|
|
|
}]
|
2023-08-04 19:43:12 +01:00
|
|
|
})
|
|
|
|
|
})
|
2023-10-12 18:14:54 +01:00
|
|
|
+ settingsCategory({
|
|
|
|
|
name: "filename",
|
2023-10-14 17:51:53 +01:00
|
|
|
title: t('FilenameTitle'),
|
2023-10-12 18:14:54 +01:00
|
|
|
body: switcher({
|
|
|
|
|
name: "filenamePattern",
|
|
|
|
|
items: [{
|
|
|
|
|
action: "classic",
|
|
|
|
|
text: t('FilenamePatternClassic')
|
|
|
|
|
}, {
|
|
|
|
|
action: "basic",
|
|
|
|
|
text: t('FilenamePatternBasic')
|
2023-10-14 17:51:53 +01:00
|
|
|
}, {
|
|
|
|
|
action: "pretty",
|
|
|
|
|
text: t('FilenamePatternPretty')
|
2023-10-12 18:14:54 +01:00
|
|
|
}, {
|
|
|
|
|
action: "nerdy",
|
|
|
|
|
text: t('FilenamePatternNerdy')
|
|
|
|
|
}]
|
|
|
|
|
})
|
2023-10-14 17:51:53 +01:00
|
|
|
+ `<div id="filename-preview">
|
|
|
|
|
<div id="video-filename" class="filename-item line">
|
|
|
|
|
${emoji('🎞️', 32, 1, 1)}
|
|
|
|
|
<div class="filename-container">
|
|
|
|
|
<div class="filename-label">${t('Preview')}</div>
|
|
|
|
|
<div id="video-filename-text"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="audio-filename" class="filename-item">
|
|
|
|
|
${emoji('🎧', 32, 1, 1)}
|
|
|
|
|
<div class="filename-container">
|
|
|
|
|
<div class="filename-label">${t('Preview')}</div>
|
|
|
|
|
<div id="audio-filename-text"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>`
|
|
|
|
|
+ explanation(t('FilenameDescription'))
|
2023-10-12 18:14:54 +01:00
|
|
|
})
|
2023-08-04 19:43:12 +01:00
|
|
|
+ settingsCategory({
|
|
|
|
|
name: "accessibility",
|
|
|
|
|
title: t('Accessibility'),
|
|
|
|
|
body: checkbox([{
|
|
|
|
|
action: "alwaysVisibleButton",
|
|
|
|
|
name: t("SettingsKeepDownloadButton"),
|
|
|
|
|
aria: t("AccessibilityKeepDownloadButton")
|
|
|
|
|
}, {
|
|
|
|
|
action: "reduceTransparency",
|
|
|
|
|
name: t("SettingsReduceTransparency")
|
|
|
|
|
}, {
|
|
|
|
|
action: "disableAnimations",
|
|
|
|
|
name: t("SettingsDisableAnimations"),
|
|
|
|
|
padding: "no-margin"
|
|
|
|
|
}])
|
|
|
|
|
})
|
|
|
|
|
+ settingsCategory({
|
2022-09-28 13:21:36 +01:00
|
|
|
name: "miscellaneous",
|
2023-01-13 18:34:48 +00:00
|
|
|
title: t('Miscellaneous'),
|
2023-08-04 19:43:12 +01:00
|
|
|
body: checkbox([{
|
|
|
|
|
action: "downloadPopup",
|
|
|
|
|
name: t("SettingsEnableDownloadPopup"),
|
|
|
|
|
aria: t("AccessibilityEnableDownloadPopup")
|
2023-08-24 09:31:39 +01:00
|
|
|
}, {
|
|
|
|
|
action: "disableMetadata",
|
2023-09-06 15:01:17 +01:00
|
|
|
name: t("SettingsDisableMetadata")
|
|
|
|
|
}, {
|
|
|
|
|
action: "disableChangelog",
|
|
|
|
|
name: t("SettingsDisableNotifications"),
|
2023-08-24 09:31:39 +01:00
|
|
|
padding: "no-margin"
|
2023-08-04 19:43:12 +01:00
|
|
|
}])
|
2022-09-08 17:02:55 +01:00
|
|
|
})
|
2023-09-08 22:10:43 +01:00
|
|
|
}]
|
2022-08-12 14:36:19 +01:00
|
|
|
})}
|
2023-07-18 20:50:51 +01:00
|
|
|
${popupWithBottomButtons({
|
|
|
|
|
name: "picker",
|
2023-08-04 19:43:12 +01:00
|
|
|
closeAria: t('AccessibilityGoBack'),
|
2023-07-18 20:50:51 +01:00
|
|
|
header: {
|
2023-08-13 20:36:19 +01:00
|
|
|
title: `${emoji("🧮", 30)} <div id="picker-title"></div>`,
|
2023-07-18 20:50:51 +01:00
|
|
|
explanation: `<div id="picker-subtitle"></div>`,
|
|
|
|
|
},
|
|
|
|
|
buttons: [`<a id="picker-download" class="switch" target="_blank" href="/">${t('ImagePickerDownloadAudio')}</a>`],
|
|
|
|
|
content: '<div id="picker-holder"></div>'
|
|
|
|
|
})}
|
2023-08-04 19:43:12 +01:00
|
|
|
<div id="popup-download-container" class="popup-from-bottom">
|
|
|
|
|
${popup({
|
2022-08-12 14:36:19 +01:00
|
|
|
name: "download",
|
2023-08-04 19:43:12 +01:00
|
|
|
standalone: true,
|
|
|
|
|
buttonOnly: true,
|
2023-09-06 14:37:03 +01:00
|
|
|
classes: ["small"],
|
2023-08-04 19:43:12 +01:00
|
|
|
header: {
|
|
|
|
|
closeAria: t('AccessibilityGoBack'),
|
|
|
|
|
emoji: emoji("🐱", 78, 1, 1),
|
|
|
|
|
title: t('TitlePopupDownload')
|
|
|
|
|
},
|
|
|
|
|
body: switcher({
|
|
|
|
|
name: "download",
|
|
|
|
|
explanation: `${!isIOS ? t('DownloadPopupDescription') : t('DownloadPopupDescriptionIOS')}`,
|
|
|
|
|
items: `<a id="pd-download" class="switch full" target="_blank" href="/"><span>${t('Download')}</span></a>
|
|
|
|
|
<div id="pd-share" class="switch full">${t('ShareURL')}</div>
|
|
|
|
|
<div id="pd-copy" class="switch full">${t('CopyURL')}</div>`
|
|
|
|
|
}),
|
|
|
|
|
buttonText: t('PopupCloseDone')
|
|
|
|
|
})}
|
|
|
|
|
</div>
|
|
|
|
|
<div id="popup-error-container" class="popup-from-bottom">
|
|
|
|
|
${popup({
|
|
|
|
|
name: "error",
|
|
|
|
|
standalone: true,
|
|
|
|
|
buttonOnly: true,
|
2023-09-06 14:37:03 +01:00
|
|
|
classes: ["small"],
|
2023-08-04 19:43:12 +01:00
|
|
|
header: {
|
|
|
|
|
title: t('TitlePopupError'),
|
|
|
|
|
emoji: emoji("😿", 78, 1, 1),
|
|
|
|
|
},
|
2023-09-08 22:10:43 +01:00
|
|
|
body: `<div id="desc-error" class="desc-padding subtext desc-error"></div>`,
|
|
|
|
|
buttonText: t('ErrorPopupCloseButton')
|
|
|
|
|
})}
|
|
|
|
|
</div>
|
|
|
|
|
<div id="popup-migration-container" class="popup-from-bottom">
|
|
|
|
|
${popup({
|
|
|
|
|
name: "migration",
|
|
|
|
|
standalone: true,
|
|
|
|
|
buttonOnly: true,
|
|
|
|
|
classes: ["small"],
|
|
|
|
|
header: {
|
|
|
|
|
title: t('NewDomainWelcomeTitle'),
|
|
|
|
|
emoji: emoji("😸", 78, 1, 1),
|
|
|
|
|
},
|
|
|
|
|
body: `<div id="desc-migration" class="desc-padding subtext desc-error">${t('NewDomainWelcome')}</div>`,
|
2023-08-04 19:43:12 +01:00
|
|
|
buttonText: t('ErrorPopupCloseButton')
|
|
|
|
|
})}
|
2023-09-08 22:10:43 +01:00
|
|
|
<div id="popup-backdrop-message" onclick="popup('message', 0)"></div>
|
2023-08-04 19:43:12 +01:00
|
|
|
</div>
|
|
|
|
|
<div id="popup-backdrop" onclick="hideAllPopups()"></div>
|
2023-08-13 19:09:50 +01:00
|
|
|
<div id="home" style="visibility:hidden">
|
2023-08-11 16:53:30 +01:00
|
|
|
${urgentNotice({
|
2023-12-25 18:08:58 +00:00
|
|
|
emoji: "🫧",
|
|
|
|
|
text: t("UpdateNewYears"),
|
2023-12-02 06:54:27 +00:00
|
|
|
visible: true,
|
2023-09-08 22:10:43 +01:00
|
|
|
action: "popup('about', 1, 'changelog')"
|
2023-08-11 16:53:30 +01:00
|
|
|
})}
|
2023-08-13 19:09:50 +01:00
|
|
|
<div id="cobalt-main-box" class="center">
|
2023-10-28 13:51:20 +01:00
|
|
|
<div id="logo">${t("AppTitleCobalt")}${betaTag()}</div>
|
2023-08-04 19:43:12 +01:00
|
|
|
<div id="download-area">
|
|
|
|
|
<div id="top">
|
2023-12-25 17:57:33 +00:00
|
|
|
<div id="link-icon">${linkSVG}</div>
|
2024-01-17 11:08:01 +00:00
|
|
|
<input id="url-input-area" class="mono" type="text" autocomplete="off" spellcheck="false" maxlength="256" autocapitalize="off" placeholder="${t('LinkInput')}" aria-label="${t('AccessibilityInputArea')}" oninput="button()">
|
2023-08-04 19:43:12 +01:00
|
|
|
<button id="url-clear" onclick="clearInput()" style="display:none;">x</button>
|
2024-01-13 00:20:36 +00:00
|
|
|
<input id="download-button" class="mono dontRead" onclick="download(document.getElementById('url-input-area').value)" type="submit" value="" disabled aria-label="${t('AccessibilityDownloadButton')}">
|
2023-08-04 19:43:12 +01:00
|
|
|
</div>
|
|
|
|
|
<div id="bottom">
|
|
|
|
|
<button id="paste" class="switch" onclick="pasteClipboard()" aria-label="${t('PasteFromClipboard')}">${emoji("📋", 22)} ${t('PasteFromClipboard')}</button>
|
|
|
|
|
${switcher({
|
|
|
|
|
name: "audioMode",
|
|
|
|
|
noParent: true,
|
|
|
|
|
items: [{
|
|
|
|
|
action: "false",
|
|
|
|
|
text: `${emoji("✨")} ${t("ModeToggleAuto")}`
|
|
|
|
|
}, {
|
|
|
|
|
action: "true",
|
|
|
|
|
text: `${emoji("🎶")} ${t("ModeToggleAudio")}`
|
|
|
|
|
}]
|
|
|
|
|
})}
|
|
|
|
|
</div>
|
2022-09-28 13:21:36 +01:00
|
|
|
</div>
|
2022-08-12 14:36:19 +01:00
|
|
|
</div>
|
2023-08-13 19:09:50 +01:00
|
|
|
<footer id="footer">
|
2023-08-04 19:43:12 +01:00
|
|
|
${footerButtons([{
|
|
|
|
|
name: "about",
|
|
|
|
|
type: "popup",
|
|
|
|
|
text: `${emoji("🐲" , 22)} ${t('AboutTab')}`,
|
|
|
|
|
aria: t('AccessibilityOpenAbout')
|
|
|
|
|
}, {
|
|
|
|
|
name: "about",
|
|
|
|
|
type: "popup",
|
|
|
|
|
context: "donate",
|
|
|
|
|
text: `${emoji("💖", 22)} ${t('Donate')}`,
|
|
|
|
|
aria: t('AccessibilityOpenDonate')
|
|
|
|
|
}, {
|
|
|
|
|
name: "settings",
|
|
|
|
|
type: "popup",
|
|
|
|
|
text: `${emoji("⚙️", 22)} ${t('TitlePopupSettings')}`,
|
|
|
|
|
aria: t('AccessibilityOpenSettings')
|
|
|
|
|
}])}
|
|
|
|
|
</footer>
|
2022-08-12 14:36:19 +01:00
|
|
|
</div>
|
2024-01-13 00:20:36 +00:00
|
|
|
<script>
|
2024-01-14 16:40:41 +00:00
|
|
|
let defaultApiUrl = '${process.env.apiURL ? process.env.apiURL : ''}';
|
|
|
|
|
const loc = ${webLoc(t,
|
|
|
|
|
[
|
|
|
|
|
'ErrorNoInternet',
|
|
|
|
|
'ErrorNoUrlReturned',
|
|
|
|
|
'ErrorUnknownStatus',
|
|
|
|
|
'ChangelogPressToHide',
|
|
|
|
|
'MediaPickerTitle',
|
|
|
|
|
'MediaPickerExplanationPhone',
|
|
|
|
|
'MediaPickerExplanationPC',
|
|
|
|
|
'ImagePickerTitle',
|
|
|
|
|
'ImagePickerExplanationPhone',
|
|
|
|
|
'ImagePickerExplanationPC',
|
|
|
|
|
'FeatureErrorGeneric',
|
|
|
|
|
'ClipboardErrorNoPermission',
|
|
|
|
|
'ClipboardErrorFirefox',
|
|
|
|
|
'DataTransferSuccess',
|
|
|
|
|
'DataTransferError',
|
|
|
|
|
'FilenamePreviewVideoTitle',
|
|
|
|
|
'FilenamePreviewAudioTitle',
|
|
|
|
|
'FilenamePreviewAudioAuthor'
|
|
|
|
|
])}
|
|
|
|
|
</script>
|
2024-01-13 00:20:36 +00:00
|
|
|
<script src="cobalt.js"></script>
|
2022-08-12 14:36:19 +01:00
|
|
|
</body>
|
2023-08-04 19:43:12 +01:00
|
|
|
</html>
|
|
|
|
|
`
|
2022-08-12 14:36:19 +01:00
|
|
|
} catch (err) {
|
2023-01-13 18:34:48 +00:00
|
|
|
return `${t('ErrorPageRenderFail', obj.hash)}`;
|
2022-08-12 14:36:19 +01:00
|
|
|
}
|
|
|
|
|
}
|
