Added legacy support of lzma

This commit is contained in:
Simon Cambier 2023-10-30 19:57:50 +01:00
parent 42c7db0810
commit e7125bc07a
4 changed files with 37 additions and 21 deletions

View File

@ -30,7 +30,7 @@
} }
onMount(() => { onMount(() => {
languages = CodeMirror.modeInfo.map((e) => ({ languages = CodeMirror.modeInfo.map((e: any) => ({
text: e.name, text: e.name,
value: shorten(e.name), value: shorten(e.name),
data: { mime: e.mime, mode: e.mode }, data: { mime: e.mime, mode: e.mode },
@ -64,7 +64,7 @@
} }
</script> </script>
<div class="flex justify-between p-2 text-sm relative"> <div class="flex justify-between p-2 text-sm relative z-10 shadow-md">
<div>NoPaste</div> <div>NoPaste</div>
<div class="flex justify-end gap-2"> <div class="flex justify-end gap-2">
<div> <div>

2
src/globals.d.ts vendored
View File

@ -1,7 +1,7 @@
declare class LZMA { declare class LZMA {
constructor(any): {} constructor(any): {}
compress: (value: string, level: number, callback: (result: number[]) => void) => void compress: (value: string, level: number, callback: (result: number[]) => void) => void
decompress: (b: string, callback: (result: any) => void) => void decompress: (b: Uint8Array, callback: (result: string, err: any) => void) => void
} }
declare const CodeMirror: any declare const CodeMirror: any

View File

@ -1,22 +1,32 @@
// LZMA imported from <script> in index.html // LZMA imported from <script> in index.html
const blob = new Blob(['importScripts("https://cdn.jsdelivr.net/npm/lzma@2.3.2/src/lzma_worker.min.js");']); const blob = new Blob([
const lzma = new LZMA(window.URL.createObjectURL(blob)); 'importScripts("https://cdn.jsdelivr.net/npm/lzma@2.3.2/src/lzma_worker.min.js");',
])
const lzma = new LZMA(window.URL.createObjectURL(blob))
async function compress(value: string): Promise<string> { async function compress(value: string): Promise<string> {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
lzma.compress(value, 1, (numbers: number[]) => { lzma.compress(value, 1, (numbers: number[]) => {
const bytes = new Uint8Array(numbers); const bytes = new Uint8Array(numbers)
const b64 = btoa(String.fromCharCode(...bytes)) const b64 = btoa(String.fromCharCode(...bytes))
resolve(b64) resolve(b64)
}) })
}) })
} }
async function decompress(b: string): Promise<string> { async function decompress(base64: string): Promise<string> {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
lzma.decompress(b, (result: any) => { const req = new XMLHttpRequest()
resolve(result) req.open('GET', 'data:application/octet;base64,' + base64)
req.responseType = 'arraybuffer'
req.onload = (e) => {
const bytes = new Uint8Array(req.response)
lzma.decompress(bytes, (result, err) => {
if (err) reject(err)
else resolve(result)
}) })
}
req.send()
}) })
} }

View File

@ -8,13 +8,6 @@
import TopBar from '../components/TopBar.svelte' import TopBar from '../components/TopBar.svelte'
import { selectedLang, shareUrl } from '../store' import { selectedLang, shareUrl } from '../store'
const algorithm: {
compress: (data: string) => Promise<string>
decompress: (data: string) => Promise<string>
} = brotli
const host = window.location.protocol + '//' + window.location.host + '/'
let editor: Editor | null = null let editor: Editor | null = null
const readOnly = false const readOnly = false
@ -29,7 +22,12 @@
const hash = window.location.hash.slice(1) const hash = window.location.hash.slice(1)
if (hash) { if (hash) {
// decompress the data // decompress the data
const decompressed = await algorithm.decompress(hash) let decompressed: string
if (hash.startsWith('XQAAA')) {
decompressed = await lzma.decompress(hash)
} else {
decompressed = await brotli.decompress(hash)
}
// set the editor value // set the editor value
if (editor) { if (editor) {
editor.setValue(decompressed) editor.setValue(decompressed)
@ -44,7 +42,7 @@
async function updateShareUrl() { async function updateShareUrl() {
if (editor) { if (editor) {
const url = new URL(window.location.href) const url = new URL(window.location.href)
compressed = await algorithm.compress(editor.getValue()) compressed = await brotli.compress(editor.getValue())
if ($selectedLang) { if ($selectedLang) {
url.searchParams.set('l', $selectedLang) url.searchParams.set('l', $selectedLang)
} }
@ -88,9 +86,10 @@
{/if} {/if}
<div id="editor" class="grow overflow-hidden" /> <div id="editor" class="grow overflow-hidden" />
{editor?.getValue()} {editor?.getValue()}
<div class="p-2 text-sm"> <div id="footer" class="p-2 text-sm z-10">
Data length: {charLen} Data length: {charLen}
| Link length: {waiting ? '?' : $shareUrl.length} | Link length: {waiting ? '?' : $shareUrl.length}
({waiting || !compressed.length || !charLen ({waiting || !compressed.length || !charLen
@ -103,4 +102,11 @@
:global(div.CodeMirror) { :global(div.CodeMirror) {
height: 100%; height: 100%;
} }
#footer {
--tw-shadow: 0 -4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 -4px 6px -1px var(--tw-shadow-color),
0 2px 4px -2px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
</style> </style>