This commit is contained in:
wukko 2022-09-28 18:21:36 +06:00
parent ab7e38deb5
commit 5593b67a74
10 changed files with 77 additions and 41 deletions

View file

@ -1,7 +1,7 @@
{ {
"name": "cobalt", "name": "cobalt",
"description": "save what you love", "description": "save what you love",
"version": "3.5.5", "version": "3.6",
"author": "wukko", "author": "wukko",
"exports": "./src/cobalt.js", "exports": "./src/cobalt.js",
"type": "module", "type": "module",

View file

@ -11,7 +11,7 @@
"internetExplorerRedirect": { "internetExplorerRedirect": {
"newNT": ["6.1", "6.2", "6.3", "10.0"], "newNT": ["6.1", "6.2", "6.3", "10.0"],
"old": "https://mypal-browser.org/", "old": "https://mypal-browser.org/",
"new": "https://vivaldi.com/" "new": "https://www.mozilla.org/firefox/new/"
}, },
"donations": { "donations": {
"crypto": { "crypto": {

View file

@ -175,6 +175,9 @@ input[type="checkbox"] {
} }
#cobalt-main-box #bottom { #cobalt-main-box #bottom {
padding-top: 1.5rem; padding-top: 1.5rem;
display: flex;
flex-direction: row;
justify-content: space-between;
} }
#cobalt-main-box #bottom button { #cobalt-main-box #bottom button {
width: auto!important; width: auto!important;
@ -224,7 +227,7 @@ input[type="checkbox"] {
cursor: not-allowed; cursor: not-allowed;
} }
#footer { #footer {
bottom: 0rem; bottom: 0.8rem;
position: absolute; position: absolute;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
@ -232,6 +235,11 @@ input[type="checkbox"] {
text-align: center; text-align: center;
width: auto; width: auto;
} }
#cobalt-main-box #bottom,
#footer-buttons,
#footer-buttons, .footer-pair {
gap: 0.8rem;
}
#footer-buttons, .footer-pair { #footer-buttons, .footer-pair {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -241,7 +249,6 @@ input[type="checkbox"] {
width: auto!important; width: auto!important;
color: var(--accent-unhover-2); color: var(--accent-unhover-2);
padding: 0.6rem 1.2rem!important; padding: 0.6rem 1.2rem!important;
margin: 0.4rem;
align-content: center; align-content: center;
} }
.text-backdrop { .text-backdrop {
@ -370,7 +377,13 @@ input[type="checkbox"] {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.bottom-margin { .bottom-margin {
margin-bottom: 1rem; margin-bottom: 1rem!important;
}
.top-margin {
margin-top: 1rem!important;
}
.no-margin {
margin: 0!important;
} }
.checkbox { .checkbox {
display: inline-flex; display: inline-flex;
@ -397,9 +410,6 @@ input[type="checkbox"] {
padding-bottom: 0.4rem; padding-bottom: 0.4rem;
color: var(--accent); color: var(--accent);
} }
.extra {
margin-top: 1rem;
}
.small-padding .subtitle { .small-padding .subtitle {
margin-top: 0.5rem; margin-top: 0.5rem;
} }
@ -432,6 +442,7 @@ input[type="checkbox"] {
color: var(--background); color: var(--background);
background: var(--accent); background: var(--accent);
cursor: default; cursor: default;
z-index: 999
} }
.switches { .switches {
display: flex; display: flex;
@ -605,6 +616,9 @@ input[type="checkbox"] {
} }
} }
@media screen and (max-width: 949px) { @media screen and (max-width: 949px) {
#cobalt-main-box #bottom {
flex-direction: column;
}
#cobalt-main-box #bottom button { #cobalt-main-box #bottom button {
width: 100%!important; width: 100%!important;
} }

View file

@ -1,5 +1,4 @@
let isIOS = navigator.userAgent.toLowerCase().match("iphone os"); let isIOS = navigator.userAgent.toLowerCase().match("iphone os");
let isFirefox = navigator.userAgent.toLowerCase().match("firefox/");
let version = 10; let version = 10;
let regex = new RegExp(/https:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()!@:%_\+.~#?&\/\/=]*)/); let regex = new RegExp(/https:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()!@:%_\+.~#?&\/\/=]*)/);
@ -9,9 +8,8 @@ let switchers = {
"quality": ["max", "hig", "mid", "low"], "quality": ["max", "hig", "mid", "low"],
"audioFormat": ["best", "mp3", "ogg", "wav", "opus"] "audioFormat": ["best", "mp3", "ogg", "wav", "opus"]
} }
let checkboxes = ["disableTikTokWatermark", "fullTikTokAudio"]; let checkboxes = ["disableTikTokWatermark", "fullTikTokAudio", "disableClipboardButton"];
if (!isFirefox) checkboxes.push("disableClipboardButton"); let exceptions = { // used solely for ios devices, because they're generally less capable
let exceptions = { // used solely for ios devices, because they're less capable than everything else.
"ytFormat": "mp4", "ytFormat": "mp4",
"audioFormat": "mp3" "audioFormat": "mp3"
} }
@ -218,7 +216,13 @@ function toggle(toggl) {
updateToggle(toggl, sGet(toggl)) updateToggle(toggl, sGet(toggl))
} }
function loadSettings() { function loadSettings() {
if (sGet("disableClipboardButton") == "true" && !isFirefox) eid("pasteFromClipboard").style.display = "none"; try {
typeof(navigator.clipboard.readText)
} catch (err) {
eid("disableClipboardButton-chkbx").style.display = "none";
sSet("disableClipboardButton", "true")
}
if (sGet("disableClipboardButton") == "true") eid("pasteFromClipboard").style.display = "none";
if (sGet("alwaysVisibleButton") == "true") { if (sGet("alwaysVisibleButton") == "true") {
eid("alwaysVisibleButton").checked = true; eid("alwaysVisibleButton").checked = true;
eid("download-button").value = '>>' eid("download-button").value = '>>'

View file

@ -39,7 +39,6 @@
"SettingsAppearanceSubtitle": "appearance", "SettingsAppearanceSubtitle": "appearance",
"SettingsThemeSubtitle": "theme", "SettingsThemeSubtitle": "theme",
"SettingsFormatSubtitle": "download format", "SettingsFormatSubtitle": "download format",
"SettingsMiscSubtitle": "more settings",
"SettingsDownloadsSubtitle": "downloads", "SettingsDownloadsSubtitle": "downloads",
"SettingsQualitySubtitle": "quality", "SettingsQualitySubtitle": "quality",
"SettingsThemeAuto": "auto", "SettingsThemeAuto": "auto",
@ -84,8 +83,6 @@
"SettingsDisableChangelogOnUpdate": "don't show changelog after major updates", "SettingsDisableChangelogOnUpdate": "don't show changelog after major updates",
"SettingsRemoveWatermark": "disable watermark", "SettingsRemoveWatermark": "disable watermark",
"ErrorPopupCloseButton": "got it", "ErrorPopupCloseButton": "got it",
"ModeToggle": "mode",
"ModeToggleSmart": "smart",
"ErrorLengthAudioConvert": "current length limit for audio conversion is {s} minutes. pick \"best\" format if you want to avoid limitations.", "ErrorLengthAudioConvert": "current length limit for audio conversion is {s} minutes. pick \"best\" format if you want to avoid limitations.",
"SettingsAudioFullTikTok": "download full audio", "SettingsAudioFullTikTok": "download full audio",
"SettingsAudioFullTikTokDescription": "downloads original audio or sound used in video without any additional changes by the video author.", "SettingsAudioFullTikTokDescription": "downloads original audio or sound used in video without any additional changes by the video author.",
@ -101,6 +98,9 @@
"SettingsDisableClipboard": "hide clipboard button", "SettingsDisableClipboard": "hide clipboard button",
"FollowTwitter": "follow {appName}'s twitter account for polls, updates, and more: <a class=\"text-backdrop\" href=\"https://twitter.com/justusecobalt\" target=\"_blank\">@justusecobalt</a>", "FollowTwitter": "follow {appName}'s twitter account for polls, updates, and more: <a class=\"text-backdrop\" href=\"https://twitter.com/justusecobalt\" target=\"_blank\">@justusecobalt</a>",
"ChangelogOlder": "previous updates", "ChangelogOlder": "previous updates",
"ChangelogPressToExpand": "press to load" "ChangelogPressToExpand": "press to load",
"Miscellaneous": "miscellaneous",
"ModeToggleAuto": "auto mode",
"ModeToggleAudio": "audio mode"
} }
} }

View file

@ -101,6 +101,9 @@
"SettingsDisableClipboard": "скрыть кнопку буфера обмена", "SettingsDisableClipboard": "скрыть кнопку буфера обмена",
"FollowTwitter": "а ещё, в твиттере {appName} есть опросы, новости, и многое другое: <a class=\"text-backdrop\" href=\"https://twitter.com/justusecobalt\" target=\"_blank\">@justusecobalt</a>", "FollowTwitter": "а ещё, в твиттере {appName} есть опросы, новости, и многое другое: <a class=\"text-backdrop\" href=\"https://twitter.com/justusecobalt\" target=\"_blank\">@justusecobalt</a>",
"ChangelogOlder": "предыдущие обновления (на английском)", "ChangelogOlder": "предыдущие обновления (на английском)",
"ChangelogPressToExpand": "нажми, чтобы загрузить" "ChangelogPressToExpand": "нажми, чтобы загрузить",
"Miscellaneous": "разное",
"ModeToggleAuto": "авто режим",
"ModeToggleAudio": "аудио режим"
} }
} }

View file

@ -1,9 +1,13 @@
{ {
"current": { "current": {
"title": "tiktok support is back :D (3.5.4)", "title": "improvements all around! (3.6)",
"content": "you can download videos, sounds, and images from tiktok again!\nhuge thank you to <a class=\"text-backdrop\" href=\"https://github.com/minzique\" target=\"_blank\">@minzique</a> for finding another api endpoint that works.\n\nif you don't want to see this popup anymore, you can disable it in settings > other." "content": "- download mode switcher is moving places, it's now right next to link input area.\n- smart mode has been renamed to auto mode, because this name is easier to understand.\n- all spacings in ui have been evened out. no more eye strain.\n- clipboard button exception has been redone to prepare for adoption of readtext clipboard api in firefox.\n- cobalt is now using different tiktok api endpoint, because previous one got killed, just like the one before.\n- \"other\" settings tab has been cleaned up."
}, },
"DisableIfYouWant": "\n\nif you don't want to see this popup after every major update, you can disable it in settings > other.",
"history": [{ "history": [{
"title": "tiktok support is back :D (3.5.4)",
"content": "you can download videos, sounds, and images from tiktok again!\nhuge thank you to <a class=\"text-backdrop\" href=\"https://github.com/minzique\" target=\"_blank\">@minzique</a> for finding another api endpoint that works."
}, {
"title": "vk clips support, improved changelog system, and less bugs (3.5.2)", "title": "vk clips support, improved changelog system, and less bugs (3.5.2)",
"content": "new features: \n- added support for vk clips. {appName} now lets you download even more cringy videos!\n- added update history right to the changelog menu. it's not loaded by default to minimize page load time, but can be loaded upon pressing a button. probably someone will enjoy this.\n- as you've just read, cobalt now has on-demand blocks. they're rendered on server upon request and exist to prevent any unnecessary clutter by default. the first feature to use on-demand rendering is history of updates in changelog tab.\n\nchanges:\n- moved twitter entry to about tab and made it localized.\n- added clarity to what services exactly are supported in about tab.\n\nbug fixes:\n- cobalt should no longer crash to firefox users if they love to play around with user-agent switching.\n- vk videos of any resolution and aspect ratio should now be downloadable.\n- vk quality picking has been fixed after vk broke it for parsers on their side." "content": "new features: \n- added support for vk clips. {appName} now lets you download even more cringy videos!\n- added update history right to the changelog menu. it's not loaded by default to minimize page load time, but can be loaded upon pressing a button. probably someone will enjoy this.\n- as you've just read, cobalt now has on-demand blocks. they're rendered on server upon request and exist to prevent any unnecessary clutter by default. the first feature to use on-demand rendering is history of updates in changelog tab.\n\nchanges:\n- moved twitter entry to about tab and made it localized.\n- added clarity to what services exactly are supported in about tab.\n\nbug fixes:\n- cobalt should no longer crash to firefox users if they love to play around with user-agent switching.\n- vk videos of any resolution and aspect ratio should now be downloadable.\n- vk quality picking has been fixed after vk broke it for parsers on their side."
}, { }, {

View file

@ -17,6 +17,8 @@ export default function(string) {
content: replaceBase(i["content"]) content: replaceBase(i["content"])
} }
}); });
default:
return replaceBase(changelog[string])
} }
} catch (e) { } catch (e) {
return `!!CHANGELOG_${string}!!` return `!!CHANGELOG_${string}!!`

View file

@ -19,8 +19,20 @@ export function switcher(obj) {
</div>` </div>`
} }
export function checkbox(action, text, aria) { export function checkbox(action, text, aria, paddingType) {
return `<label class="checkbox"> let paddingClass = ` `
switch (paddingType) {
case 1:
paddingClass += "bottom-margin"
break;
case 2:
paddingClass += "top-margin"
break;
case 3:
paddingClass += "no-margin"
break;
}
return `<label id="${action}-chkbx" class="checkbox${paddingClass}">
<input id="${action}" type="checkbox" ${aria ? `aria-label="${aria}"` : ''} onclick="checkbox('${action}')"> <input id="${action}" type="checkbox" ${aria ? `aria-label="${aria}"` : ''} onclick="checkbox('${action}')">
<span>${text}</span> <span>${text}</span>
</label>` </label>`

View file

@ -26,14 +26,13 @@ for (let i in donations["other"]) {
let extr = '' let extr = ''
for (let i in donations["crypto"]) { 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>` donate += `<div class="subtitle${extr}">${i} (REPLACEME)</div><div id="don-${i}" class="text-to-copy" onClick="copy('don-${i}')">${donations["crypto"][i]}</div>`
extr = ' extra' extr = ' top-margin'
} }
export default function(obj) { export default function(obj) {
audioFormats[0]["text"] = loc(obj.lang, 'SettingsAudioFormatBest'); audioFormats[0]["text"] = loc(obj.lang, 'SettingsAudioFormatBest');
let ua = obj.useragent.toLowerCase(); let ua = obj.useragent.toLowerCase();
let isIOS = ua.match("iphone os"); let isIOS = ua.match("iphone os");
let isMobile = ua.match("android") || ua.match("iphone os"); let isMobile = ua.match("android") || ua.match("iphone os");
let isFirefox = ua.match("firefox/");
try { try {
return `<!DOCTYPE html> return `<!DOCTYPE html>
<html lang="en"> <html lang="en">
@ -108,7 +107,7 @@ export default function(obj) {
classes: ["changelog-subtitle"], classes: ["changelog-subtitle"],
nopadding: true nopadding: true
}, { }, {
text: changelogManager("content") text: changelogManager("content") + changelogManager("DisableIfYouWant")
}, { }, {
text: `<div class="category-title">${loc(obj.lang, 'ChangelogLastCommit')}</div>`, text: `<div class="category-title">${loc(obj.lang, 'ChangelogLastCommit')}</div>`,
raw: true raw: true
@ -191,7 +190,7 @@ export default function(obj) {
"text": `${loc(obj.lang, 'SettingsQualitySwitchLow')}(${quality.low}p)` "text": `${loc(obj.lang, 'SettingsQualitySwitchLow')}(${quality.low}p)`
}] }]
}) })
}) + `${!isIOS ? checkbox("downloadPopup", loc(obj.lang, 'SettingsEnableDownloadPopup'), loc(obj.lang, 'AccessibilityEnableDownloadPopup')) : ''}` }) + `${!isIOS ? checkbox("downloadPopup", loc(obj.lang, 'SettingsEnableDownloadPopup'), loc(obj.lang, 'AccessibilityEnableDownloadPopup'), 1) : ''}`
+ settingsCategory({ + settingsCategory({
name: "youtube", name: "youtube",
body: switcher({ body: switcher({
@ -225,7 +224,7 @@ export default function(obj) {
}) + settingsCategory({ }) + settingsCategory({
name: "tiktok", name: "tiktok",
title: "tiktok & douyin", title: "tiktok & douyin",
body: checkbox("fullTikTokAudio", loc(obj.lang, 'SettingsAudioFullTikTok'), loc(obj.lang, 'SettingsAudioFullTikTok')) + `<div class="explanation">${loc(obj.lang, 'SettingsAudioFullTikTokDescription')}</div>` body: checkbox("fullTikTokAudio", loc(obj.lang, 'SettingsAudioFullTikTok'), loc(obj.lang, 'SettingsAudioFullTikTok'), 3) + `<div class="explanation">${loc(obj.lang, 'SettingsAudioFullTikTokDescription')}</div>`
}) })
}, { }, {
name: "other", name: "other",
@ -246,11 +245,13 @@ export default function(obj) {
"action": "light", "action": "light",
"text": loc(obj.lang, 'SettingsThemeLight') "text": loc(obj.lang, 'SettingsThemeLight')
}] }]
}) + checkbox("alwaysVisibleButton", loc(obj.lang, 'SettingsKeepDownloadButton'), loc(obj.lang, 'AccessibilityKeepDownloadButton'), 2)
}) + settingsCategory({
name: "miscellaneous",
title: loc(obj.lang, 'Miscellaneous'),
body: checkbox("disableChangelog", loc(obj.lang, 'SettingsDisableChangelogOnUpdate'), loc(obj.lang, 'SettingsDisableChangelogOnUpdate'))
+ checkbox("disableClipboardButton", loc(obj.lang, 'SettingsDisableClipboard'), loc(obj.lang, 'SettingsDisableClipboard'))
}) })
})
+ checkbox("alwaysVisibleButton", loc(obj.lang, 'SettingsKeepDownloadButton'), loc(obj.lang, 'AccessibilityKeepDownloadButton'))
+ checkbox("disableChangelog", loc(obj.lang, 'SettingsDisableChangelogOnUpdate'), loc(obj.lang, 'SettingsDisableChangelogOnUpdate'))
+ (!isFirefox ? checkbox("disableClipboardButton", loc(obj.lang, 'SettingsDisableClipboard'), loc(obj.lang, 'SettingsDisableClipboard')) : ``)
}], }],
})} })}
${popup({ ${popup({
@ -313,9 +314,10 @@ export default function(obj) {
<button id="url-clear" onclick="clearInput()" style="display:none;">x</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="${loc(obj.lang, 'AccessibilityDownloadButton')}"> <input id="download-button" class="mono dontRead" onclick="download(document.getElementById('url-input-area').value)" type="submit" value="" disabled=true aria-label="${loc(obj.lang, 'AccessibilityDownloadButton')}">
</div> </div>
${!isFirefox ? `<div id="bottom"> <div id="bottom">
<button id="pasteFromClipboard" class="switch" onclick="pasteClipboard()" aria-label="${loc(obj.lang, 'PasteFromClipboard')}">${emoji("📋", 22)} ${loc(obj.lang, 'PasteFromClipboard')}</button> <button id="pasteFromClipboard" class="switch" onclick="pasteClipboard()" aria-label="${loc(obj.lang, 'PasteFromClipboard')}">${emoji("📋", 22)} ${loc(obj.lang, 'PasteFromClipboard')}</button>
</div>` : ''} <button id="audioMode" class="switch" onclick="toggle('audioMode')" aria-label="${loc(obj.lang, 'AccessibilityModeToggle')}">${emoji("✨", 22, 1)}</button>
</div>
</div> </div>
</div> </div>
<footer id="footer" style="visibility: hidden;"> <footer id="footer" style="visibility: hidden;">
@ -330,11 +332,6 @@ export default function(obj) {
type: "popup", type: "popup",
text: `${emoji("⚙️", 22)} ${loc(obj.lang, 'TitlePopupSettings')}`, text: `${emoji("⚙️", 22)} ${loc(obj.lang, 'TitlePopupSettings')}`,
aria: loc(obj.lang, 'AccessibilityOpenSettings') aria: loc(obj.lang, 'AccessibilityOpenSettings')
}, {
name: "audioMode",
type: "toggle",
text: emoji("✨", 22, 1),
aria: loc(obj.lang, 'AccessibilityModeToggle')
}] }]
)} )}
</footer> </footer>
@ -343,8 +340,8 @@ export default function(obj) {
noInternet: ` + "`" + loc(obj.lang, 'ErrorNoInternet') + "`" + `, noInternet: ` + "`" + loc(obj.lang, 'ErrorNoInternet') + "`" + `,
noURLReturned: ` + "`" + loc(obj.lang, 'ErrorNoUrlReturned') + "`" + `, noURLReturned: ` + "`" + loc(obj.lang, 'ErrorNoUrlReturned') + "`" + `,
unknownStatus: ` + "`" + loc(obj.lang, 'ErrorUnknownStatus') + "`" + `, unknownStatus: ` + "`" + loc(obj.lang, 'ErrorUnknownStatus') + "`" + `,
toggleDefault: '${emoji("✨")} ${loc(obj.lang, "ModeToggleSmart")} ${loc(obj.lang, "ModeToggle")}', toggleDefault: '${emoji("✨")} ${loc(obj.lang, "ModeToggleAuto")}',
toggleAudio: '${emoji("🎶")} ${loc(obj.lang, "SettingsAudioTab")} ${loc(obj.lang, "ModeToggle")}' toggleAudio: '${emoji("🎶")} ${loc(obj.lang, "ModeToggleAudio")}'
};</script> };</script>
<script type="text/javascript" src="cobalt.js"></script> <script type="text/javascript" src="cobalt.js"></script>
</html>`; </html>`;