diff --git a/svelte/src/filesystem/FileStats.svelte b/svelte/src/filesystem/FileStats.svelte index ff6f9fe..42a42a2 100644 --- a/svelte/src/filesystem/FileStats.svelte +++ b/svelte/src/filesystem/FileStats.svelte @@ -46,14 +46,11 @@ const update_base = async base => { transfer_used = j.transfer_free + j.transfer_paid } socket.onerror = err => { - if (socket === null) { - return - } console.error("WS error", err) - socket.close() - socket = null error_msg = "failed to get stats, retrying..." + close_socket() + window.setTimeout(() => { if (socket === null) { update_base(base) diff --git a/svelte/src/filesystem/edit_window/Branding.js b/svelte/src/filesystem/edit_window/Branding.js index dabb474..58d057a 100644 --- a/svelte/src/filesystem/edit_window/Branding.js +++ b/svelte/src/filesystem/edit_window/Branding.js @@ -37,30 +37,35 @@ const add_styles = (style, properties) => { if (properties.brand_input_color) { style.input_background = properties.brand_input_color style.input_hover_background = properties.brand_input_color - style.input_text = add_light(properties.brand_input_color, 70) + style.input_text = add_contrast(properties.brand_input_color, 70) } if (properties.brand_highlight_color) { style.highlight_color = properties.brand_highlight_color style.highlight_background = properties.brand_highlight_color - style.highlight_text_color = add_light(properties.brand_highlight_color, 70) - style.link_color = properties.brand_highlight_color + style.highlight_text_color = add_contrast(properties.brand_highlight_color, 70) + + // If we have a body colour to compare it to we use the highlight colour + // to generate the link colour + if (properties.brand_body_color) { + style.link_color = generate_link_color(properties.brand_highlight_color, properties.brand_body_color) + } } if (properties.brand_danger_color) { style.danger_color = properties.brand_danger_color - style.danger_text_color = add_light(properties.brand_danger_color, 70) + style.danger_text_color = add_contrast(properties.brand_danger_color, 70) } if (properties.brand_background_color) { style.background_color = properties.brand_background_color style.background = properties.brand_background_color - style.background_text_color = add_light(properties.brand_background_color, 70) + style.background_text_color = add_contrast(properties.brand_background_color, 70) style.background_pattern_color = properties.brand_background_color } if (properties.brand_body_color) { style.body_color = properties.brand_body_color style.body_background = properties.brand_body_color - style.body_text_color = add_light(properties.brand_body_color, 70) + style.body_text_color = add_contrast(properties.brand_body_color, 70) style.shaded_background = set_alpha(properties.brand_body_color, 0.8) - style.separator = add_light(properties.brand_body_color, 5) + style.separator = add_contrast(properties.brand_body_color, 6) style.shadow_color = darken(properties.brand_body_color, 0.8) } if (properties.brand_card_color) { @@ -74,7 +79,7 @@ const add_styles = (style, properties) => { } } -const add_light = (color, amt) => { +const add_contrast = (color, amt) => { let hsl = rgb2hsl(parse(color)) // Convert hex to hsl // If the lightness is less than 40 it is considered a dark colour. This // threshold is 40 instead of 50 because overall dark text is more legible @@ -99,3 +104,17 @@ const set_alpha = (color, amt) => { rgb.push(amt) return "rgba(" + rgb.join(", ") + ")" } + +const generate_link_color = (link_color, body_color) => { + let link = rgb2hsl(parse(link_color)) + let body = rgb2hsl(parse(body_color)) + + // If the body and link colours are both dark we lighten the link, and the + // other way around too + if (body[2] < 50 && link[2] < 50) { + link[2] = link[2] + 40 // Dark color, add lightness + } else if (body[2] > 50 && link[2] > 50) { + link[2] = link[2] - 40 // Light color, remove lightness + } + return rgb2hex(hsl2rgb(link)) // Convert back to hex +} diff --git a/svelte/src/filesystem/viewers/Torrent.svelte b/svelte/src/filesystem/viewers/Torrent.svelte index 3651118..828a39e 100644 --- a/svelte/src/filesystem/viewers/Torrent.svelte +++ b/svelte/src/filesystem/viewers/Torrent.svelte @@ -119,6 +119,76 @@ const copy_magnet = () => { + +
+ How do I download this? (expand for more information) +

+ This is a torrent file, which means you will need a torrent client to + download it. Here are some good torrent clients for various platforms: +

+ +

+ After installing your torrent client you will be able to use the + Open magnet link + button to download the files in your torrent client. +

+

What is a torrent?

+

+ BitTorrent is a + peer-to-peer network for sharing files. This torrent file does not + actually contain the files listed below, instead it contains + instructions for your torrent client to download the files from + other people who happen to be downloading the same files currently. + This means that instead of connecting to a single server (like + pixeldrain), you will be connecting to other people on the internet + to download these files. +

+

+ Torrents are a highly efficient and free method of transferring + files over the internet. Since the bandwidth is shared directly + between users there is no need for expensive servers to host the + files for you. +

+

Is this safe?

+

+ Your torrent client will make sure that the files you receive from + your peers are actually what they say it is. This makes it just as + safe as any other form of downloading. Like always when downloading + files you still need to be aware of what you are downloading. Don't + just blindly trust any file anyone sends you. +

+

Is it private?

+

+ When downloading a torrent file you will be part of the so-called + 'torrent swarm'. Anyone in the swarm can see each other's IP + addresses. This is not a bad thing on its own, but there a few cases + in which this can be abused. +

+

+ Anyone in the swarm will be able to see what you are downloading, + even across different torrents. This is something to keep in mind + when downloading torrents. If someone can link your IP address to + your identity then there are ways to find out which files you have + downloaded in the past (provided that your IP address has not + changed since then). +

+

+ If you are downloading copyrighted material (which I do not condone) + then rightsholders will be able to see your IP address. In most + cases this is not a problem because your ISP will still protect your + identity. But there are some countries (notably the USA) where your + ISP will not respect your right to privacy and the rightsholder will + be able to contact you. If this worries you then you should look + into VPN services to protect your privacy, like Mullvad. +

+
+ + {#if status === "finished"}

Files in this torrent

diff --git a/svelte/src/filesystem/viewers/Zip.svelte b/svelte/src/filesystem/viewers/Zip.svelte index d117cf9..4300aa1 100644 --- a/svelte/src/filesystem/viewers/Zip.svelte +++ b/svelte/src/filesystem/viewers/Zip.svelte @@ -1,7 +1,7 @@ - - -{#each Object.entries(item.children) as [name, child]} - {#if child.children} -
- - {name} ({formatDataVolume(child.size, 3)}) - - -
- {/if} -{/each} - - - - -