Mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/wukko/cobalt.git synced 2024-09-28 22:30:00 +01:00
Code Issues Projects Releases Packages Wiki Activity

biblically accurate HTML and clean up

Browse source 
merge pull request #317 from dumbmoron/html-cleanup
This commit is contained in:
wukko 2024-01-17 17:17:57 +06:00 committed by GitHub
commit 2332c18cee
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 166 additions and 126 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

66
src/front/cobalt.css
View file

@ -107,7 +107,7 @@ a {
color: var(--accent-subtext);
}
.switches::-webkit-scrollbar,
#popup-content::-webkit-scrollbar {
.popup-content::-webkit-scrollbar {
display: none;
}
:focus-visible {
@ -450,23 +450,23 @@ button:active,
.popup.small.visible {
transform: translate(-50%, -50%);
}
.popup.small #popup-header-contents,
.popup.small .popup-header-contents,
.popup.small .popup-content-inner,
.popup.small #popup-header {
.popup.small .popup-header {
padding: 0;
}
.popup.small #popup-header {
.popup.small .popup-header {
position: relative;
border: none;
}
.popup.small #popup-title {
.popup.small .popup-title {
margin-bottom: 0.6rem;
}
.popup.small .explanation {
margin-bottom: 0.9rem;
}
#close-error {
background: var(--accent);
.popup.small .close-error.switch {
background: var(--accent)!important;
color: var(--background);
}
.popup.scrollable {
@ -520,7 +520,7 @@ button:active,
font-size: 1.1rem;
padding-bottom: var(--padding-1);
}
#popup-desc,
.popup-desc,
.desc-error,
#popup-info-desc {
width: 100%;
@ -533,7 +533,7 @@ button:active,
.desc-error {
padding-bottom: 1.5rem;
}
#popup-title {
.popup-title {
font-size: 1.5rem;
line-height: 1.2em;
display: flex;
@ -541,11 +541,11 @@ button:active,
margin-bottom: 0.4rem;
margin-top: 0.4rem;
}
#popup-above-title {
.popup-above-title {
color: var(--accent-subtext);
font-size: 0.8rem;
}
#popup-content {
.popup-content {
overflow-x: scroll;
overflow-y: auto;
height: 100%;
@ -564,7 +564,7 @@ button:active,
.bullpadding {
padding-left: 0.58rem;
}
#popup-header {
.popup-header {
position: absolute;
z-index: 999;
padding-top: calc(env(safe-area-inset-top)/2 + 1.7rem);
@ -646,16 +646,16 @@ button:active,
.switch:focus {
box-shadow: var(--inset-focus) inset;
}
#popup-tabs .switch {
.popup-tabs .switch {
background: none;
}
.desktop #popup-tabs .switch:hover,
#popup-tabs .switch:active {
.desktop .popup-tabs .switch:hover,
.popup-tabs .switch:active {
background: var(--accent-hover-transparent);
box-shadow: 0 0 0 0.1rem var(--accent-highlight) inset;
}
.switch[data-enabled="true"],
#popup-tabs .switch[data-enabled="true"] {
.popup-tabs .switch[data-enabled="true"] {
color: var(--background);
background: var(--accent)!important;
cursor: default;
@ -693,20 +693,20 @@ button:active,
padding: var(--gap-no-icon);
overflow: clip;
}
#back-button {
.back-button {
padding: 0;
background: none;
max-width: 4rem;
font-size: 1rem;
}
#back-button svg path,
.back-button svg path,
.collapse-indicator svg path {
fill: var(--accent);
}
.popup-tab-content[data-enabled="false"] {
display: none;
}
#popup-tabs {
.popup-tabs {
z-index: 999;
bottom: 0;
position: absolute;
@ -823,7 +823,7 @@ button:active,
}
.popup-content-inner,
.tab-content-settings,
#popup-header-contents {
.popup-header-contents {
padding-left: 1rem;
padding-right: 1rem;
}
@ -947,15 +947,15 @@ button:active,
#bottom #paste,
#footer .switch,
#audioMode,
#popup-content .switches,
.popup-content .switches,
.checkbox,
.changelog-img,
.changelog-banner,
#close-error,
.close-error,
.changelog-tag-version,
#download-switcher .switch,
#popup-about .switch,
#popup-tabs .switch,
.popup-tabs .switch,
.text-to-copy,
.text-to-copy.text-backdrop,
#filename-preview {
@ -965,16 +965,16 @@ button:active,
border-radius: 3px / 4px;
}
.popup,
.scrollable #popup-content {
.scrollable .popup-content {
border-radius: 8px;
}
#popup-header .glass-bkg {
.popup-header .glass-bkg {
border-top-left-radius: 8px 9px;
border-top-right-radius: 8px 9px;
border-bottom: var(--accent-highlight) solid 0.1rem;
top: -1px;
}
#popup-tabs .glass-bkg {
.popup-tabs .glass-bkg {
border-bottom-left-radius: 8px 9px;
border-bottom-right-radius: 8px 9px;
border-top: var(--accent-highlight) solid 0.1rem;
@ -1103,12 +1103,12 @@ button:active,
padding-top: calc(env(safe-area-inset-bottom)/2 + 1rem);
}
.popup,
#popup-header .glass-bkg,
#popup-tabs .glass-bkg,
.popup-header .glass-bkg,
.popup-tabs .glass-bkg,
.glass-bkg.small {
border-radius: 0;
}
#popup-tabs .glass-bkg {
.popup-tabs .glass-bkg {
bottom: 0;
}
.switches {
@ -1141,13 +1141,13 @@ button:active,
transform: none;
transition: transform 210ms cubic-bezier(0.062, 0.82, 0.165, 1), opacity 130ms ease-in-out;
}
.popup.small #popup-header {
.popup.small .popup-header {
background: none;
}
.no-animation .popup.small {
transition: none;
}
#close-error {
.close-error {
bottom: 3rem;
}
#picker-holder::-webkit-scrollbar {
@ -1166,13 +1166,13 @@ button:active,
max-height: 100%;
box-shadow: none;
}
#popup-tabs {
.popup-tabs {
padding-bottom: calc(env(safe-area-inset-bottom)/2 + 1.5rem);
}
.popup-content-inner,
.tab-content-settings,
.popup-tabs-child,
#popup-header-contents {
.popup-header-contents {
padding-left: 0.7rem;
padding-right: 0.7rem;
}

13
src/front/cobalt.js
View file

@ -236,7 +236,7 @@ function popup(type, action, text) {
`<a class="picker-image-container" ${
isIOS ? `onClick="share('${text.arr[i]["url"]}')"` : `href="${text.arr[i]["url"]}" target="_blank"`
}>` +
`<img class="picker-image" src="${text.arr[i]["url"]}" onerror="this.parentNode.style.display='none'"></img>` +
`<img class="picker-image" src="${text.arr[i]["url"]}" onerror="this.parentNode.style.display='none'">` +
`</a>`
}
break;
@ -253,7 +253,7 @@ function popup(type, action, text) {
}>` +
`<div class="picker-element-name">${text.arr[i].type}</div>` +
`<div class="imageBlock"></div>` +
`<img class="picker-image" src="${text.arr[i]["thumb"]}" onerror="this.style.display='none'"></img>` +
`<img class="picker-image" src="${text.arr[i]["thumb"]}" onerror="this.style.display='none'">` +
`</a>`
}
eid("picker-download").classList.remove("visible");
@ -603,9 +603,9 @@ window.onload = () => {
if (setUn !== null) {
if (setUn) {
sSet("migrated", "true")
eid("desc-migration").innerHTML += `<br/><br/>${loc.DataTransferSuccess}`
eid("desc-migration").innerHTML += `<br><br>${loc.DataTransferSuccess}`
} else {
eid("desc-migration").innerHTML += `<br/><br/>${loc.DataTransferError}`
eid("desc-migration").innerHTML += `<br><br>${loc.DataTransferError}`
}
}
}
@ -616,6 +616,11 @@ window.onload = () => {
window.history.replaceState(null, '', window.location.pathname);
notificationCheck();
// fix for animations not working in Safari
if (isIOS) {
document.addEventListener('touchstart', () => {}, true);
}
}
eid("url-input-area").addEventListener("keydown", (e) => {
button();

BIN
src/front/updateBanners/shutup.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 220 KiB

BIN
src/front/updateBanners/shutup.webp Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 21 KiB

4
src/localization/languages/en.json
View file

@ -8,7 +8,7 @@
"LinkInput": "paste the link here",
"AboutSummary": "cobalt is your go-to place for downloads from social and media platforms. zero ads, trackers, or other creepy bullshit. simply paste a share link and you're ready to rock!",
"EmbedBriefDescription": "save what you love. no ads, trackers, or other creepy bullshit.",
"MadeWithLove": "made with <3 by wukko",
"MadeWithLove": "made with &lt;3 by wukko",
"AccessibilityInputArea": "link input area",
"AccessibilityOpenAbout": "open about popup",
"AccessibilityDownloadButton": "download button",
@ -152,6 +152,8 @@
"FilenamePreviewAudioAuthor": "Audio Author",
"StatusPage": "service status page",
"TroubleshootingGuide": "self-troubleshooting guide",
"DonateImageDescription": "cat sleeping on a laptop keyboard and typing letters repeatedly",
"UpdateNewYears": "new years clean up",
"SettingsTwitterGif": "convert gifs to .gif",
"SettingsTwitterGifDescription": "converting looping videos to .gif reduces quality and majorly increases file size. if you want best efficiency, keep this setting off.",
"UpdateTwitterGif": "twitter gifs and pinterest"

3
src/localization/languages/ru.json
View file

@ -8,7 +8,7 @@
"LinkInput": "вставь ссылку сюда",
"AboutSummary": "кобальт - твой друг при скачивании контента из соцсетей и других сервисов. никакой рекламы, трекеров и прочего мусора. вставляешь ссылку и получаешь файл. всё. ничего лишнего.",
"EmbedBriefDescription": "сохраняй то, что любишь. без рекламы, трекеров и лишней мороки.",
"MadeWithLove": "сделано с любовью <3",
"MadeWithLove": "сделано с любовью &lt;3",
"AccessibilityInputArea": "зона вставки ссылки",
"AccessibilityOpenAbout": "открыть окно с инфой",
"AccessibilityDownloadButton": "кнопка скачивания",
@ -154,6 +154,7 @@
"FilenamePreviewAudioAuthor": "Автор Аудио",
"StatusPage": "статус серверов",
"TroubleshootingGuide": "гайд по устранению проблем",
"DonateImageDescription": "кошка спит на клавиатуре ноутбука и многократно печатает буквы",
"UpdateNewYears": "новогодняя уборка",
"SettingsTwitterGif": "конвертировать гифки в .gif",
"SettingsTwitterGifDescription": "конвертирование зацикленного видео в .gif снижает качество и значительно увеличивает размер файла. если важна максимальная эффективность, то не используй эту функцию.",

2
src/localization/manager.js
View file

@ -17,7 +17,7 @@ export async function loadLoc() {
export function replaceBase(s) {
return s
.replace(/\n/g, '<br/>')
.replace(/\n/g, '<br>')
.replace(/{saveToGalleryShortcut}/g, links.saveToGalleryShortcut)
.replace(/{repo}/g, repo)
.replace(/{statusPage}/g, links.statusPage)

21
src/modules/changelog/changelog.json
View file

@ -5,6 +5,7 @@
"title": "new years clean up! bug fixes and fresh look for the home page",
"banner": {
"file": "catroomba.webp",
"alt": "a cat riding a roomba vacuum",
"width": 300,
"height": 168
},
@ -16,6 +17,7 @@
"title": "bugfixes and better downloads!",
"banner": {
"file": "meowthpolishegg.webp",
"alt": "meowth polishing a togepi egg",
"width": 640,
"height": 480
},
@ -26,6 +28,7 @@
"title": "customizable file names, instagram stories, and first cobalt sponsor!",
"banner": {
"file": "meowthcenter.webp",
"alt": "meowth plush in a datacenter wearing a hardhat, wielding a hammer",
"width": 851,
"height": 640
},
@ -36,6 +39,7 @@
"title": "support for twitch clips and rutube!",
"banner": {
"file": "twitchupdate.webp",
"alt": "meowth plush staring into the camera, laptop with generic purple service in the background",
"width": 851,
"height": 640
},
@ -46,6 +50,7 @@
"title": "new domain, what's coming in future, bug fixes, and more!",
"banner": {
"file": "newdomain.webp",
"alt": "text: new domain, same cobalt",
"width": 960,
"height": 540
},
@ -56,6 +61,7 @@
"title": "extended video length limit, metadata toggle, ui improvements, and more!",
"banner": {
"file": "meowthsnap.webp",
"alt": "cartoon meowth pointing paw dramatically and saying something",
"width": 500,
"height": 280
},
@ -66,6 +72,7 @@
"title": "instagram, streamable, video metadata, and more!",
"banner": {
"file": "meowthproductions.webp",
"alt": "meowth roaring in a fancy circle, à la MGM studios intro",
"width": 640,
"height": 358
},
@ -76,6 +83,7 @@
"title": "biggest ui refresh yet!",
"banner": {
"file": "meowthcooking.webp",
"alt": "meowth handling orders in a restaurant",
"width": 640,
"height": 360
},
@ -86,6 +94,7 @@
"title": "all network issues have been fixed!",
"banner": {
"file": "meowthhammer.webp",
"alt": "meowth plush holding a hammer in real life",
"width": 1280,
"height": 827
},
@ -96,6 +105,7 @@
"title": "better reliability, new infrastructure, pinterest support, and way more!",
"banner": {
"file": "catswitchboxes.webp",
"alt": "a cat climbing into two empty boxes of asahi beer",
"width": 600,
"height": 314
},
@ -105,6 +115,7 @@
"title": "instagram support, docker, and more!",
"banner": {
"file": "catphonestand.webp",
"alt": "a cat holding a phone under its chin while a person plays clash of clans on it",
"width": 451,
"height": 272
},
@ -114,6 +125,7 @@
"title": "better looks, better feel",
"banner": {
"file": "cattired.webp",
"alt": "a cat laying on a sofa face down, wiggling its tail",
"width": 640,
"height": 286
},
@ -123,6 +135,7 @@
"title": "fastest one in the game",
"banner": {
"file": "catspeed.webp",
"alt": "a cat running very fast in an exercise wheel",
"width": 640,
"height": 356
},
@ -132,6 +145,7 @@
"title": "the evil has been defeated",
"banner": {
"file": "happymeowth.webp",
"alt": "meowth jumping up into the sky very excitedly",
"width": 500,
"height": 330
},
@ -141,6 +155,7 @@
"title": "it's all about attention to detail!",
"banner": {
"file": "valentines.webp",
"alt": "relaxed meowth with sakura petals falling in front of them",
"width": 489,
"height": 374
},
@ -150,6 +165,7 @@
"title": "prettier than ever",
"banner": {
"file": "catmakeup.webp",
"alt": "a cat being brushed with a powder makeup brush",
"width": 394,
"height": 266
},
@ -159,6 +175,7 @@
"title": "we're better together! thank you for bug reports.",
"banner": {
"file": "bettertogether.webp",
"alt": "various different pokémon jumping in happiness",
"width": 640,
"height": 358
},
@ -168,6 +185,7 @@
"title": "mute videos and proper soundcloud support",
"banner": {
"file": "shutup.webp",
"alt": "a cat yawning, with a crossed out loudspeaker icon next to it",
"width": 1024,
"height": 665
},
@ -177,6 +195,7 @@
"title": "better, faster, stronger, stable",
"banner": {
"file": "meowthstrong.webp",
"alt": "meowth stretching",
"width": 500,
"height": 280
},
@ -186,6 +205,7 @@
"title": "over 1 million monthly requests. thank you.",
"banner": {
"file": "onemillionr.webp",
"alt": "cobalt logo and a confetti emoji",
"width": 1441,
"height": 1441
},
@ -199,6 +219,7 @@
"title": "developers, developers, developers, developers",
"banner": {
"file": "developers.webp",
"alt": "steve ballmer going \"developers, developers, developers\"",
"width": 640,
"height": 360
},

36
src/modules/changelog/changelogManager.js
View file

@ -5,33 +5,35 @@ let changelog = loadJSON('./src/modules/changelog/changelog.json')
export default function(string) {
try {
const currentChangelog = changelog.current;
switch (string) {
case "version":
return `<span class="text-backdrop changelog-tag-version">v.${changelog["current"]["version"]}</span>${
changelog["current"]["date"] ? `<span class="changelog-tag-date">· ${changelog["current"]["date"]}</span>` : ''
return `<span class="text-backdrop changelog-tag-version">v.${currentChangelog.version}</span>${
currentChangelog.date ? `<span class="changelog-tag-date">· ${currentChangelog.date}</span>` : ''
}`
case "title":
return replaceBase(changelog["current"]["title"]);
return replaceBase(currentChangelog.title);
case "banner":
return changelog["current"]["banner"] ? {
url: `updateBanners/${changelog["current"]["banner"]["file"]}`,
width: changelog["current"]["banner"]["width"],
height: changelog["current"]["banner"]["height"]
const currentBanner = changelog.current.banner;
return currentBanner ? {
...currentBanner,
url: `updateBanners/${currentBanner.file}`
} : false;
case "content":
return replaceBase(changelog["current"]["content"]);
return replaceBase(currentChangelog.content);
case "history":
return changelog["history"].map((i) => {
return changelog.history.map((log) => {
const banner = log.banner;
return {
title: replaceBase(i["title"]),
version: `<span class="text-backdrop changelog-tag-version">v.${i["version"]}</span>${
i["date"] ? `<span class="changelog-tag-date">· ${i["date"]}</span>` : ''
title: replaceBase(log.title),
version: `<span class="text-backdrop changelog-tag-version">v.${log.version}</span>${
log.date ? `<span class="changelog-tag-date">· ${log.date}</span>` : ''
}`,
content: replaceBase(i["content"]),
banner: i["banner"] ? {
url: `updateBanners/${i["banner"]["file"]}`,
width: i["banner"]["width"],
height: i["banner"]["height"]
content: replaceBase(log.content),
banner: banner ? {
...banner,
url: `updateBanners/${banner.file}`
} : false,
}
});

2
src/modules/emoji.js
View file

@ -62,5 +62,5 @@ export default function(emoji, size, disablePadding, fluent) {
let filePath = `emoji/${names[emoji]}.svg`;
if (fluent) filePath = `emoji/3d/${names[emoji]}.svg`;
return `<img class="emoji" draggable=false height="${size}" width="${size}" ${padding ? `style="${padding}"` : ''}alt="${emoji}" src="${filePath}" loading="lazy">`
return `<img class="emoji" draggable=false height="${size}" width="${size}" ${padding ? `style="${padding}" ` : ''}alt="${emoji}" src="${filePath}" loading="lazy">`
}

46
src/modules/pageRender/elements.js
View file

@ -59,27 +59,27 @@ export function popup(obj) {
body = ``
for (let i = 0; i < obj.body.length; i++) {
if (obj.body[i]["text"].length > 0) {
classes = obj.body[i]["classes"] ? obj.body[i]["classes"] : []
classes = obj.body[i]["classes"] ?? []
if (i !== obj.body.length - 1 && !obj.body[i]["nopadding"]) {
classes.push("desc-padding")
}
body += obj.body[i]["raw"] ? obj.body[i]["text"] : `<div id="popup-desc" class="${classes.length > 0 ? classes.join(' ') : ''}">${obj.body[i]["text"]}</div>`
body += obj.body[i]["raw"] ? obj.body[i]["text"] : `<div class="${['popup-desc', ...classes].join(' ')}">${obj.body[i]["text"]}</div>`
}
}
}
return `
${obj.standalone ? `<div id="popup-${obj.name}" class="popup center${!obj.buttonOnly ? " box" : ''}${classes.length > 0 ? ' ' + classes.join(' ') : ''}">` : ''}
<div id="popup-header" class="popup-header">
<div id="popup-header-contents">
<div class="popup-header">
<div class="popup-header-contents">
${obj.buttonOnly ? obj.header.emoji : ``}
${obj.header.aboveTitle ? `<a id="popup-above-title" target="_blank" href="${obj.header.aboveTitle.url}">${obj.header.aboveTitle.text}</a>` : ''}
${obj.header.title ? `<div id="popup-title">${obj.header.title}</div>` : ''}
${obj.header.aboveTitle ? `<a class="popup-above-title" target="_blank" href="${obj.header.aboveTitle.url}">${obj.header.aboveTitle.text}</a>` : ''}
${obj.header.title ? `<div class="popup-title">${obj.header.title}</div>` : ''}
${obj.header.subtitle ? `<div id="popup-subtitle">${obj.header.subtitle}</div>` : ''}
</div>
${!obj.buttonOnly ? `<div class="glass-bkg alone"></div>` : ''}
</div>
<div id="popup-content" class="popup-content-inner">
${body}${obj.buttonOnly ? `<button id="close-error" class="switch" onclick="popup('${obj.name}', 0)">${obj.buttonText}</button>` : ''}
<div class="popup-content popup-content-inner">
${body}${obj.buttonOnly ? `<button class="close-error switch" onclick="popup('${obj.name}', 0)">${obj.buttonText}</button>` : ''}
</div>
${classes.includes("small") ? `<div class="glass-bkg small"></div>` : ''}
${obj.standalone ? `</div>` : ''}`
@ -87,7 +87,7 @@ export function popup(obj) {
export function multiPagePopup(obj) {
let tabs = `
<button id="back-button" class="switch tab-${obj.name}" onclick="popup('${obj.name}', 0)" ${obj.closeAria ? `aria-label="${obj.closeAria}"` : ''}>
<button class="back-button switch tab-${obj.name}" onclick="popup('${obj.name}', 0)" ${obj.closeAria ? `aria-label="${obj.closeAria}"` : ''}>
${backButtonSVG}
</button>`;
@ -99,16 +99,16 @@ export function multiPagePopup(obj) {
return `
<div id="popup-${obj.name}" class="popup center box scrollable">
<div id="popup-content">
${obj.header ? `<div id="popup-header" class="popup-header">
<div id="popup-header-contents">
${obj.header.aboveTitle ? `<a id="popup-above-title" target="_blank" href="${obj.header.aboveTitle.url}">${obj.header.aboveTitle.text}</a>` : ''}
${obj.header.title ? `<div id="popup-title">${obj.header.title}</div>` : ''}
<div class="popup-content">
${obj.header ? `<div class="popup-header">
<div class="popup-header-contents">
${obj.header.aboveTitle ? `<a class="popup-above-title" target="_blank" href="${obj.header.aboveTitle.url}">${obj.header.aboveTitle.text}</a>` : ''}
${obj.header.title ? `<div class="popup-title">${obj.header.title}</div>` : ''}
${obj.header.subtitle ? `<div id="popup-subtitle">${obj.header.subtitle}</div>` : ''}
</div>
<div class="glass-bkg alone"></div>
</div>` : ''}${tabContent}</div>
<div id="popup-tabs" class="switches popup-tabs">
<div class="switches popup-tabs">
<div class="switches popup-tabs-child">${tabs}</div>
<div class="glass-bkg alone"></div>
</div>
@ -131,7 +131,7 @@ export function collapsibleList(arr) {
}
export function popupWithBottomButtons(obj) {
let tabs = `
<button id="back-button" class="switch tab-${obj.name}" onclick="popup('${obj.name}', 0)" ${obj.closeAria ? `aria-label="${obj.closeAria}"` : ''}>
<button class="back-button switch tab-${obj.name}" onclick="popup('${obj.name}', 0)" ${obj.closeAria ? `aria-label="${obj.closeAria}"` : ''}>
${backButtonSVG}
</button>`
@ -140,17 +140,17 @@ export function popupWithBottomButtons(obj) {
}
return `
<div id="popup-${obj.name}" class="popup center box scrollable">
<div id="popup-content">
${obj.header ? `<div id="popup-header" class="popup-header">
<div id="popup-header-contents">
${obj.header.aboveTitle ? `<a id="popup-above-title" target="_blank" href="${obj.header.aboveTitle.url}">${obj.header.aboveTitle.text}</a>` : ''}
${obj.header.title ? `<div id="popup-title">${obj.header.title}</div>` : ''}
<div class="popup-content">
${obj.header ? `<div class="popup-header">
<div class="popup-header-contents">
${obj.header.aboveTitle ? `<a class="popup-above-title" target="_blank" href="${obj.header.aboveTitle.url}">${obj.header.aboveTitle.text}</a>` : ''}
${obj.header.title ? `<div class="popup-title">${obj.header.title}</div>` : ''}
${obj.header.subtitle ? `<div id="popup-subtitle">${obj.header.subtitle}</div>` : ''}
${obj.header.explanation ? `<div class="explanation">${obj.header.explanation}</div>` : ''}
</div>
<div class="glass-bkg alone"></div>
</div>` : ''}${obj.content}</div>
<div id="popup-tabs" class="switches popup-tabs">
<div class="switches popup-tabs">
<div id="picker-buttons" class="switches popup-tabs-child">${tabs}</div>
<div class="glass-bkg alone"></div>
</div>
@ -171,7 +171,7 @@ export function socialLinks(lang) {
}
export function settingsCategory(obj) {
return `<div id="settings-${obj.name}" class="settings-category">
<div class="category-title">${obj.title ? obj.title : obj.name}</div>
<div class="category-title">${obj.title ?? obj.name}</div>
<div class="category-content">${obj.body}</div>
</div>`
}

9
src/modules/pageRender/onDemand.js
View file

@ -17,14 +17,15 @@ export function changelogHistory() { // blockId 0
`<div class="changelog-banner">
<img class="changelog-img" ` +
`src="${history[i]["banner"]["url"]}" ` +
`alt="${history[i]["banner"]["alt"].replaceAll('"', '&quot;')}" ` +
`width="${history[i]["banner"]["width"]}" ` +
`height="${history[i]["banner"]["height"]}" ` +
`onerror="this.style.opacity=0" loading="lazy">`+
`</img>
`
</div>` : ''}
<div id="popup-desc" class="changelog-tags">${history[i]["version"]}</div>
<div id="popup-desc" class="changelog-subtitle">${history[i]["title"]}</div>
<div id="popup-desc" class="desc-padding">${history[i]["content"]}</div>`
<div class="popup-desc changelog-tags">${history[i]["version"]}</div>
<div class="popup-desc changelog-subtitle">${history[i]["title"]}</div>
<div class="popup-desc desc-padding">${history[i]["content"]}</div>`
}
render = cleanHTML(render);
cache['0'] = render;

88
src/modules/pageRender/page.js
View file

@ -43,36 +43,40 @@ export default function(obj) {
<!DOCTYPE html>
<html lang="${obj.lang}">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="viewport-fit=cover, width=device-width, height=device-height, initial-scale=1, maximum-scale=${isIOS ? `1` : `5`}" />
<meta charset="utf-8">
<meta name="viewport" content="viewport-fit=cover, width=device-width, height=device-height, initial-scale=1, maximum-scale=${isIOS ? `1` : `5`}">
<title>${t("AppTitleCobalt")}</title>
<meta property="og:url" content="${process.env.webURL || process.env.selfURL}" />
<meta property="og:title" content="${t("AppTitleCobalt")}" />
<meta property="og:description" content="${t('EmbedBriefDescription')}" />
<meta property="og:image" content="${process.env.webURL || process.env.selfURL}icons/generic.png" />
<meta name="title" content="${t("AppTitleCobalt")}" />
<meta name="description" content="${t('AboutSummary')}" />
<meta name="theme-color" content="#000000" />
<meta name="twitter:card" content="summary" />
<meta property="og:url" content="${process.env.webURL}">
<meta property="og:title" content="${t("AppTitleCobalt")}">
<meta property="og:description" content="${t('EmbedBriefDescription')}">
<meta property="og:image" content="${process.env.webURL}icons/generic.png">
<meta name="title" content="${t("AppTitleCobalt")}">
<meta name="description" content="${t('AboutSummary')}">
<meta name="theme-color" content="#000000">
<meta name="twitter:card" content="summary">
<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")}">
<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" />
<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">
<link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png" />
<link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png">
<link rel="manifest" href="manifest.webmanifest">
<link rel="preload" href="fonts/notosansmono.css" as="style">
<link rel="stylesheet" href="fonts/notosansmono.css">
<link rel="stylesheet" href="cobalt.css">
<link rel="manifest" href="manifest.webmanifest" />
<link rel="stylesheet" href="fonts/notosansmono.css" rel="preload" />
<link rel="stylesheet" href="cobalt.css" />
</head>
<body id="cobalt-body" ${platform === "d" ? 'class="desktop"' : ''} data-nosnippet ontouchstart>
<noscript>${t('NoScriptMessage')}</noscript>
<body id="cobalt-body" ${platform === "d" ? 'class="desktop"' : ''} data-nosnippet>
<noscript>
<div style="margin: 2rem;">${t('NoScriptMessage')}</div>
</noscript>
${multiPagePopup({
name: "about",
closeAria: t('AccessibilityGoBack'),
@ -145,10 +149,10 @@ export default function(obj) {
body: `${t("SupportSelfTroubleshooting")}`
+ `${socialLink(emoji("📢"), t("StatusPage"), links.statusPage)}`
+ `${socialLink(emoji("🔧"), t("TroubleshootingGuide"), links.troubleshootingGuide)}`
+ `<br/>`
+ `<br>`
+ `${t("FollowSupport")}`
+ `${socialLinks(obj.lang)}`
+ `<br/>`
+ `<br>`
+ `${t("SourceCode")}`
+ `${socialLink(emoji("🐙"), repo.replace("https://github.com/", ''), repo)}`
}, {
@ -185,15 +189,18 @@ export default function(obj) {
text: `<div class="category-title">${t('ChangelogLastMajor')}</div>`,
raw: true
}, {
text: changelogManager("banner") ?
`<div class="changelog-banner">
<img class="changelog-img" ` +
`src="${changelogManager("banner")["url"]}" ` +
`width="${changelogManager("banner")["width"]}" ` +
`height="${changelogManager("banner")["height"]}" ` +
`onerror="this.style.opacity=0" loading="lazy">`+
`</img>
</div>`: '',
text: (() => {
const banner = changelogManager('banner');
if (!banner) return '';
return `<div class="changelog-banner">
<img class="changelog-img" ` +
`src="${banner.url}" ` +
`alt="${banner.alt.replaceAll('"', '&quot;')}" ` +
`width="${banner.width}" ` +
`height="${banner.height}" ` +
`onerror="this.style.opacity=0" loading="lazy">
</div>`;
})(),
raw: true
}, {
text: changelogManager("version"),
@ -242,13 +249,14 @@ export default function(obj) {
text: `<div class="category-title">${t('DonateSub')}</div>`,
raw: true
}, {
text: `<div class="changelog-banner">
text: `
<div class="changelog-banner">
<img class="changelog-img" ` +
`src="updateBanners/catsleep.webp"` +
`src="updateBanners/catsleep.webp" ` +
`alt="${t("DonateImageDescription")}" ` +
`width="480" ` +
`height="270" ` +
`onerror="this.style.opacity=0" loading="lazy">`+
`</img>
`onerror="this.style.opacity=0" loading="lazy">
</div>`,
raw: true
}, {
@ -319,7 +327,7 @@ export default function(obj) {
})
})
+ settingsCategory({
name: "tiktok",
name: "tiktok-watermark",
title: "tiktok",
body: checkbox([{
action: "disableTikTokWatermark",
@ -405,7 +413,7 @@ export default function(obj) {
})
})
+ settingsCategory({
name: "tiktok",
name: "tiktok-audio",
title: "tiktok",
body: checkbox([{
action: "fullTikTokAudio",
@ -578,9 +586,9 @@ export default function(obj) {
<div id="download-area">
<div id="top">
<div id="link-icon">${linkSVG}</div>
<input id="url-input-area" class="mono" type="text" autocorrect="off" maxlength="256" autocapitalize="off" placeholder="${t('LinkInput')}" aria-label="${t('AccessibilityInputArea')}" oninput="button()"></input>
<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()">
<button id="url-clear" onclick="clearInput()" style="display:none;">x</button>
<input id="download-button" class="mono dontRead" onclick="download(document.getElementById('url-input-area').value)" type="submit" value="" disabled=true aria-label="${t('AccessibilityDownloadButton')}">
<input id="download-button" class="mono dontRead" onclick="download(document.getElementById('url-input-area').value)" type="submit" value="" disabled aria-label="${t('AccessibilityDownloadButton')}">
</div>
<div id="bottom">
<button id="paste" class="switch" onclick="pasteClipboard()" aria-label="${t('PasteFromClipboard')}">${emoji("📋", 22)} ${t('PasteFromClipboard')}</button>
@ -618,7 +626,7 @@ export default function(obj) {
}])}
</footer>
</div>
<script type="text/javascript">
<script>
let defaultApiUrl = '${process.env.apiURL ? process.env.apiURL : ''}';
const loc = ${webLoc(t,
[
@ -642,7 +650,7 @@ export default function(obj) {
'FilenamePreviewAudioAuthor'
])}
</script>
<script type="text/javascript" src="cobalt.js"></script>
<script src="cobalt.js"></script>
</body>
</html>
`

2
src/modules/stream/manage.js
View file

@ -43,7 +43,7 @@ export function createStream(obj) {
exp = streamInfo.exp;
ghmac = streamInfo.hmac;
}
return `${process.env.apiURL || process.env.selfURL}api/stream?t=${streamID}&e=${exp}&h=${ghmac}`;
return `${process.env.apiURL}api/stream?t=${streamID}&e=${exp}&h=${ghmac}`;
}
export function verifyStream(id, hmac, exp) {