Various minor improvements
Boris Kubiak
parent
83abec6015
commit
9069e4673c
2
Makefile
2
Makefile
|
|
@ -1,4 +1,4 @@
|
|||
lint:
|
||||
npx prettier --write --single-quote --tab-width=4 --print-width=120 index.js *.{html,css,md}
|
||||
npx prettier@2.0.5 --write --single-quote --tab-width=4 --print-width=120 *.{js,html,css,md}
|
||||
dev:
|
||||
npx serve -s
|
||||
54
README.md
54
README.md
|
|
@ -2,9 +2,9 @@
|
|||
|
||||
[NoPaste](https://nopaste.ml/) is a client-side paste service which works with **no database**, and **no back-end code**
|
||||
|
||||
Instead, the data is **compressed** then **stored** into a unique URL that can be decoded later. For example, [this is the CSS code used by NoPaste][example]
|
||||
Instead, the data is **compressed** then **stored** into a unique URL that can be shared and decoded later. For example, [this is the CSS code used by NoPaste][example]
|
||||
|
||||
As a result, there is no risk of data being lost, censored or deleted. The whole data stored is **in the link** and nowhere else! 🤯
|
||||
As a result, there is no risk of data being lost, censored or deleted. The data is stored entirely **in the links** and nowhere else!
|
||||
|
||||
**Note:** This project is a copy of [Topaz's paste service][topaz-example], with a reworked design and a few additional features (syntax highlighting, line numbers, line wrapping, embedding...)
|
||||
|
||||
|
|
@ -12,9 +12,34 @@ As a result, there is no risk of data being lost, censored or deleted. The whole
|
|||
|
||||
When you click on "Generate Link", NoPaste compresses the whole text using the
|
||||
[LZMA algorithm](https://en.wikipedia.org/wiki/Lempel%E2%80%93Ziv%E2%80%93Markov_chain_algorithm), encodes it in
|
||||
[Base64](https://en.wikipedia.org/wiki/Base64), and puts it just after the first `/`, in the URL: `nopaste.ml/<your data goes here>`
|
||||
[Base64](https://en.wikipedia.org/wiki/Base64), and puts it in the optional URL fragment, after the first `#` symbol: `nopaste.ml/#<your data goes here>`
|
||||
|
||||
When you open a link, NoPaste reads, decodes, and decompresses whatever is after the `/`, and displays the result in the editor
|
||||
When you open a link, NoPaste reads, decodes, and decompresses whatever is after the `#`, and displays the result in the editor.
|
||||
|
||||
This process is done entirely **in your browser**, and the web server hosting NoPaste [never has access to the fragment](https://en.wikipedia.org/wiki/Fragment_identifier)
|
||||
|
||||
## Maximum sizes for links
|
||||
|
||||
NoPaste is great for sharing code snippets on various platforms.
|
||||
|
||||
These are the maximum link lengths on some apps and browsers.
|
||||
|
||||
| App | Max length |
|
||||
| ------- | ---------- |
|
||||
| Reddit | 10,000 |
|
||||
| Twitter | 4,088 |
|
||||
| Slack | 4,000 |
|
||||
| QR Code | 2,610 |
|
||||
| Bitly | 2,048 |
|
||||
|
||||
| Browser | Max length | Notes |
|
||||
| --------------- | ------------------------- | --------------------------------------- |
|
||||
| Google Chrome | (win) 32,779 (mac) 10,000 | Will not display, but larger links work |
|
||||
| Firefox | >64,000 | |
|
||||
| Microsoft IE 11 | 4,043 | Will not show more than 2,083 |
|
||||
| Microsoft Edge | 2,083 | Anything over 2083 will fail |
|
||||
| Android | 8,192 | |
|
||||
| Safari | Lots | |
|
||||
|
||||
## Embedded NoPaste snippets
|
||||
|
||||
|
|
@ -24,6 +49,21 @@ You can include NoPaste code snippets into your own website by clicking the _Emb
|
|||
|
||||
Feel free to edit the generated `height` and `width` attributes, so they suit your needs
|
||||
|
||||
[intro-img]: https://nopaste.ml/XQAAAQA6BAAAAAAAAAAFYH9Ev4Ly6wIDoAZQ25VXENWodOrWpmx8bfd8j6jeNeL/0fGICEpU6gh9GhXuFjqBBpJFOvefaxUXJquUWRQarmV+S0SHFOLUFyg/dw8OQI6RB6Y1yliOBWGL916HxAGqgwyLqjkH4w450OLk+q9oJYS6PrZfXU5uBC5DLe76OkG25ibvbsasKN51JuVyRedgoF/d7F9d6L7p02q0jHAM9pnPpKOKqlIVsNnXwYKXK10tnZ0GdiwJ3EeT//52uhw=?lang=python
|
||||
[example]: https://nopaste.ml/XQAAAQAWDQAAAAAAAAAXioAj/ZZaukKWizx++f8w08qY+xe+w0AeNB0EtEDMR1jPECOrMSz2rcy5XqUVTzusmFXo407ujwufsB1Va3cy02BV4Chx15I+SbM8Ei2WS8/MaZa0wIOjHf0s6B9Kcwi1J73qYeIcKm39PEWGnBM4Ym5aXFOF1Irrn1N95vEcl4YI+98rydudZHmsNCmt995GvCpLImwH7yj3SlMadWaQA0jHCrY1ZBvhjSJ9mAAdYjCJLduITZuXomgpqtr3sYI1WKeRGNmPSD8J8WRLtCx0BZl3yWZZrUxJbmVod8cYiPJnlO+CzQA03qA/GZnxhMYd9TPc2Xlq8UIhBX6gmvo/xhHJc/WHnuBFB32xJ37O5FZlZuXGy6wFE/lakVteoqEqgvyaoBBB7p/UrGWZ0h4Wd8Hc3ceZ7KjJwmu2wLmbnWNnZ+bpusiwWhRNzdD/7u4a0FLd21QpiH8iXr9oQOFOctkswDCs8h1dio2ZWUFDAqVC586qrdFgrKRtCuJF9Zwlf2tQLY0BvyiK0c5EedA1rXK55OevIfKb6FVCUIbJVbcV/F9HpOY94Dha5mrokfqF7zj2fzRHR/1y2LEfmnt/wxN3Y5nwbm5rH6NDsCKadz9f0HzqVmgXW6p5SaxcT472M8dwmLM6yxNp5af7bpn33zyJhBhQifJciHOVJX+7oU7hfU/dmmt2fknBqRYv1WDbypIDe1TeKBba9sW7XFJChXGjZRhtinSL94WtDc7/l/USbiv9iAfBAVHs0XzU7naUtAKUFLyDqo4UWpauv4sNzaA7n5BbvPm+/xz+0uVgBsZBUyLpz/OUNGYaqbGFv44IVt99K3/cJwu8najWju0S6JJzZsSdI4CY4fHQ8bcI+WPUDzf49CE9hxZIVO5dCjmtnXs68RqSD4/wq6IwIGS6d8oku/0R/InHjqE2dZa0tU2Ko8DIIgrDnW1DNt89D/gWOQFOXN5+o3Mp1vgQL6AImLzudbiVamcAkrAVbRDcaq3AeI3dH1gKkvDUvpbSJuc+yPFRtnDByfTxt1EQCmbbCLck2UHQF4tWtJ2eQT4ICYborFh6Ams1TsOAUua5xqYGo9HXtDLeWcz21rNOtnc+Jtc+AtMg2UmEMZJXm+Jk/n280FNm+B6hbkafsHDJNQKyxCFX+N7/1yfwgVCkCKd3Hrad8ETI5rgso718tUiC0i4odYMpHCw2WfKUZm2DCUzmcEW9v8PWIM8okPFM+NgWNhusqQsilOu3RePRWdzdMpz/vt4w6qMJZMKDq/7C8eDPoxomrVCd++WA1v7qL46pT9ivyEMoQtagUsCaaj92Y9EoVkL5BbSl9yEkRA2LEIZf//FGYpQ97eu0KWgHDpGIdoQPh7RQB7oJgSA4i2x9n6iYn0HrlJKGgw+QXskkrBlWZsxua/6MWK/bqga14G3PqoB0CFXMhRcf4d4xUJiwUURFsaisIaMQM6Sy2O9TQN8wjEE7XYRTAgLfVIG8QyH3sBqXp00UaFouDRv0jRybuh0I1weudvBlJXcpTb6S0r2DjVr0u7Uy5b9LojNdXkuMZh4vGX5ZfW0bs2H0WPG5+11buP4A4u8IXIMD76Yt+p3GylpzO1PXbIjLhP5FnEc=?lang=css
|
||||
[topaz-example]: https://topaz.github.io/paste/#XQAAAQDzAAAAAAAAAAAFFgvDUiqpf8dDPleMqfsqtbQYE28suCtDTB9iyFgGByXgSRMepMuokjoACV4UPgBzwM3p+V/N2rCi8m90FkQfsRuMJ4LrZVFgr81wKDc2okcywbJBz7OGNPpc8xu2lAkpSekqRO+I/OYMpqBE6w6JLw+cFocCptTbd+jBPuNfBVQrhYyQ3mN0BXmj+rejvVB8jG6J/HPP4u+m32pm0UBS0eb8rmaeDnanRkVI8/gs09nh8YK93sjVfIOAYOXoB2da//bUcos=
|
||||
## Generate NoPaste links
|
||||
|
||||
NoPaste links can be created easily from your system's command line:
|
||||
|
||||
```bash
|
||||
# Linux
|
||||
echo -n 'Hello World' | lzma | base64 | xargs -0 printf "https://nopaste.ml/#%s"
|
||||
|
||||
# Mac
|
||||
echo -n 'Hello World' | lzma | base64 -w0 | xargs -0 printf "https://nopaste.ml/#%s"
|
||||
|
||||
# Windows / WSL
|
||||
echo -n 'Hello World' | xz --format=lzma | base64 -w0 | printf "https://nopaste.ml/#%s" "$(cat -)"
|
||||
```
|
||||
|
||||
[intro-img]: https://nopaste.ml/?lang=python#XQAAAQA6BAAAAAAAAAAFYH9Ev4Ly6wIDoAZQ25VXENWodOrWpmx8bfd8j6jeNeL/0fGICEpU6gh9GhXuFjqBBpJFOvefaxUXJquUWRQarmV+S0SHFOLUFyg/dw8OQI6RB6Y1yliOBWGL916HxAGqgwyLqjkH4w450OLk+q9oJYS6PrZfXU5uBC5DLe76OkG25ibvbsasKN51JuVyRedgoF/d7F9d6L7p02q0jHAM9pnPpKOKqlIVsNnXwYKXK10tnZ0GdiwJ3EeT//52uhw=
|
||||
[example]: https://nopaste.ml/?lang=css#XQAAAQB2DQAAAAAAAAAXioAj/ZZaukKWizx++f8w08qY+xe+w0AeNB0EtEDMR1jPECOrMSz2rcy5XqUVTzusmFXo407ujwufsB1Va3cy02BV4Chx15I+SbM8Ei2WS8/MaZa0wIOjHf0s6B9Kcwi1J73qYeIcKm39PEWGnBM4Ym5aXFOF1Irrn1N95vEcl4YI+98rydudZHmsNCmt995GvCpLImwH7yj3SlMadWaQA0jHCrY1ZBvhjSJ9mAAdYjCJLduITZuXomgpqtr3sYI1WKeRGNmPSD8J8WRLtCx0BZl3yWZZrUxJbmVod8cYiPJnlO+CzQA03qA/GZnxhMYd9TPc2Xlq8UIhBX6gmvo/xhHJc/WHnuBFB32xJ37O5FZlZuXGy6wFE/lakVteoqEqgvyan4LfaiL0pMfYapWjV8YoPa/KyVGugANNjvtRw0hRr+Z1IgKoVL2a1xqvQiB65vIXkw68/ui82O1ko9HTbsLMHX/2/CgWZ8TkTEvgr0+dzVqQYIpaWpB3hDnUTHMkG2UehM5iJyJXAgODNqk8IiWCJn5k/j2FeFpchSTWdgi7AeaCowubmWnFTNgNFXLf5zzARWBUGQFT55TiC0ah4HL17jG3rY6fXvAXlm6CWc88ne7wF0opHkLnhfPslssDYo75hDmCfYwJ6asQ/YBkSuuLJjdCEXVjF7Pdw2FhsOiiB0gNXC6ehieM28M+PMGSDRqt0Q0KveMgE44YJ8zFOvpu2Gg41qDkrsYS7Xb/iMnHz66tt69I1rGzrHx88PuI2/CZx+kv+z7a+/Eiq4JC3KTDx4IbNUYptmrIOC2bxGrcjd8TBKGe+dNi8a/PEnXrUXc/OD7D680/Awo+scE8VKuRVN5R7OPg0tmKVQSQkyCf+I3//kGmREyhh6/bCv6tvbEc7hNPNE1js2svlVBF001JlLY7g1w6ls2pjxrKxuCLrkjba1n4s5WlfrbwcX18rqgbfL2tVibHggsy3Lgq4i7fXtuO3JifxfauO66YIRjEWFnACrHbZ14FbHDMylN7GMvo5TusxestU0s6+kiibWq2qZVpi7C5JVKURNQrGEabICn5nUDoOPMZSfNrdmlTOhu4qjKW09XdQPNazTMc83KjG1YOKNjRP23i1oav5muBFRGMDkSXt7wCgv5PCpLZM9w2jC5GCa5oHuH92IWJu5d80fvTRw3GxNQzfMRxgjzfH6xxrzu+EghhbzayUhb3U5aSRSxOtPTPfjT9mxgk7j3f1mRlbYheuhko4/LBIKYvfA5CnN2Yr3VyBYqoZ/ZgP871LU0ix8ZLeaecao0SDj6V35bZ6RB53mcU8BRPfcyZhj0H6BrFcrcfXKVwnNVro/cIrwnoG3GwlpCXGYJmDDeUdlbBj2HrVmvMncd3w8SzPtxw5RAWQP9YPJdE4Tc490BMX4zAkPqirRHLcxG/K5ECLtKtGsnCkg24+XwFo4XRcGfMsbkSSYD7oZ2HkD+1NXYqJKgk+7uee+yrYCZF6xbsb0ca/7r3w8nU9DueSa6XPiaCLSeJ+phw8iK1U4+FcCzqLW4LzgfcGjz64+HM+Xst0YuqzrAI2RU80H2Mr0FnC/qL+klbM+p0yNUBxBd4IQ64SJmh6Irgi7fZq2wfuTuVEAI1qKKwGwBQ6x9UDyY/OqkD63mtRL//oHeipA==
|
||||
[topaz-example]: https://topaz.github.io/paste/#XQAAAQADAQAAAAAAAAAFFgvDUiqpf8dDPleMqfsqtbQYE28suCtDTB9iyFgGByXgSRMepMuokjoACV4UPgBzwM3p+V/N2rCi8m90FkQfsRuMJ4LrZVFgr81wKDc2okcywbJBz7OGNPpc8xu2lAkpSekqRO+I/OYUUvgB2ckKBp+2avxmAKn6H73WV3t1D5Ip9hwthecGUnLwFSGpPFNI0zb4Ettx7QnIu6NiftBuencR3Bn/l3BNoh8M5NQL2MoInMQAnQ1gGwSQg6uEnIvK70ERxjllyP2v2fH/N5CRAA==
|
||||
|
|
|
|||
16
index.html
16
index.html
|
|
@ -7,6 +7,7 @@
|
|||
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
|
||||
/>
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||
|
||||
<title>NoPaste - No-database paste service</title>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
|
|
@ -23,8 +24,9 @@ npm/codemirror@5.52.0/theme/dracula.min.css
|
|||
<link href="/favicon.ico" rel="icon" type="image/x-icon" />
|
||||
<meta
|
||||
name="description"
|
||||
content="NoPaste is a client-side paste service which works with no database, and no back-end code. The whole data is stored in the generated links and nowhere else"
|
||||
content="NoPaste is a client-side paste service which works with no database, and no back-end code. The data is stored entirely in the links and nowhere else"
|
||||
/>
|
||||
<link rel="canonical" href="https://nopaste.ml/" />
|
||||
</head>
|
||||
<body class="m-0">
|
||||
<script>
|
||||
|
|
@ -124,10 +126,14 @@ npm/codemirror@5.52.0/theme/dracula.min.css
|
|||
<div id="description" class="hidden shadow-bottom p-3">
|
||||
NoPaste is a client-side paste service which works with <b>no database</b>, and
|
||||
<b>no back-end code</b>.<br /><br />
|
||||
Instead, the data is <b>compressed</b> then <b>stored</b> into a unique link that can be decoded
|
||||
later.<br /><br />
|
||||
As a result, there is no risk of data being lost, censored or deleted. The whole data is stored
|
||||
<b>in the link</b> and nowhere else!
|
||||
Instead, the data is <b>compressed</b> then <b>stored</b> into a unique URL that can be shared and
|
||||
decoded later.<br /><br />
|
||||
|
||||
As a result, there is no risk of data being lost, censored or deleted. The data is stored entirely
|
||||
<b>in the links</b> and nowhere else!<br /><br />
|
||||
|
||||
You can find more detailed information on
|
||||
<a href="https://github.com/bokub/nopaste" rel="noopener" target="_blank">Github</a>
|
||||
</div>
|
||||
</div>
|
||||
<svg class="hidden">
|
||||
|
|
|
|||
21
index.js
21
index.js
|
|
@ -6,7 +6,14 @@ let select = null;
|
|||
let clipboard = null;
|
||||
let statsEl = null;
|
||||
|
||||
const initCodeEditor = (initialValue) => {
|
||||
const init = () => {
|
||||
initCodeEditor();
|
||||
initLangSelector();
|
||||
initCode();
|
||||
initClipboard();
|
||||
};
|
||||
|
||||
const initCodeEditor = () => {
|
||||
CodeMirror.modeURL = 'https://cdn.jsdelivr.net/npm/codemirror@5.52.0/mode/%N/%N.js';
|
||||
editor = new CodeMirror(byId('editor'), {
|
||||
lineNumbers: true,
|
||||
|
|
@ -14,18 +21,15 @@ const initCodeEditor = (initialValue) => {
|
|||
readOnly: readOnly,
|
||||
lineWrapping: false,
|
||||
scrollbarStyle: 'simple',
|
||||
value: initialValue,
|
||||
});
|
||||
if (readOnly) {
|
||||
document.body.classList.add('readonly');
|
||||
}
|
||||
|
||||
statsEl = byId('stats');
|
||||
statsEl.innerHTML = `Length: ${initialValue.length} | Lines: ${editor['doc'].size}`;
|
||||
editor.on('change', () => {
|
||||
statsEl.innerHTML = `Length: ${editor.getValue().length} | Lines: ${editor['doc'].size}`;
|
||||
});
|
||||
initLangSelector();
|
||||
};
|
||||
|
||||
const initLangSelector = () => {
|
||||
|
|
@ -50,16 +54,14 @@ const initLangSelector = () => {
|
|||
const initCode = () => {
|
||||
const base64 = location.pathname.substr(1) || location.hash.substr(1);
|
||||
if (base64.length === 0) {
|
||||
initCodeEditor('');
|
||||
return;
|
||||
}
|
||||
decompress(base64, (code, err) => {
|
||||
if (err) {
|
||||
alert('Failed to decompress data: ' + err);
|
||||
initCodeEditor('');
|
||||
return;
|
||||
}
|
||||
initCodeEditor(code);
|
||||
editor.setValue(code);
|
||||
});
|
||||
};
|
||||
|
||||
|
|
@ -130,7 +132,7 @@ const openInNewTab = () => {
|
|||
const buildUrl = (rawData, mode) => {
|
||||
const base = `${location.protocol}//${location.host}/`;
|
||||
const query = `?lang=${encodeURIComponent(select.selected())}`;
|
||||
const url = rawData.length <= 4000 ? base + rawData + query : base + query + '#' + rawData;
|
||||
const url = base + query + '#' + rawData;
|
||||
if (mode === 'markdown') {
|
||||
return `[NoPaste snippet](${url})`;
|
||||
}
|
||||
|
|
@ -210,5 +212,4 @@ const testAllModes = () => {
|
|||
}
|
||||
};
|
||||
|
||||
initCode(); // Will decode URL, create code editor, and language selector
|
||||
initClipboard();
|
||||
init();
|
||||
|
|
|
|||
Loading…
Reference in New Issue