Notepad Tab
notepadtab.com
notepadtab.com
It would be neat to visit /app/notepad, /app/kanban, /app/todo, etc. at a localhost port, with an index of apps at /. There could even be a /get-apps page that connects to an npm-like library of single-HTML-file apps available for download from a github.io static site backed by a public repo that accepts pull requests.
I'd love to see all the VC-funded glorified desktop utilities on the web become unnecessary.
The mini-apps could store data in localStorage, but that would expose the data to other mini-apps. Maybe build an easy API that functions nearly equivalently against a Lua endpoint.
...But I've not worked out how to get RedBean serving up files outside of the zip... I'll get there.
P'raps LUA could manage the security for different static apps.... as you say.
When downloading a new mini-app, the Lua script would add it to the zip archive itself -- it can do this as far as I can tell.
The only issue I see is if you clear your browser’s cache while offline
That is at least until we get Isolated Web Apps and what ever the other proposals related to it alö called.
The web platform simply doesn’t allow you to verify the checksum of an app and reject all further requests.
I mean, at that point, why not just grab the files are host them yourself?
Salesforce is basically a smalltalk VM and dominates thanks to that
And if it is, why does it dominate "thanks to that"?
On top of this third party developers can build in stuff that is more or less first class to the system, and it can run on the third party systems but you can get away with using Salesforce's "compute". So you're shipping software for the Salesforce VM, so to speak.
I would recommend playing around with the system to see what's going on.
You're talking about progressive web apps. MacOS / iOS / Android have them, and I started using them more recently. Essentially, they're just webviews wrapped in a native app.
Mainly I am bitter because nobody has ported electron to openbsd yet, cross platform my ass.
There's a demo video on the Readme with setup instructions.
I tried this Ruby script for local hosting and it's working great for now: https://gist.github.com/jimfoltz/ee791c1bdd30ce137bc23cce826.... Just make sure you have wiki.html located alongside the script, and navigate to /wiki.html.
The next evolution would be to get it running in RedBean reliably - and maybe even get it saving Tiddlers to the built-in SQLite instance. Simon Willison's work on saving Tiddlers to SQLite in Python might be a good reference: https://github.com/simonw/datasette-tiddlywiki
data:text/html,<body contenteditable style="line-height:1.5;font-size:20px;">
For a quick and dirty save, you can press Ctrl+P to open the print window/dialog and select "Save as PDF", or you can press Ctrl+S and save as a single HTML file.
Edit: to make the text cursor focus automatically when the page loads, you can add the autofocus attribute to the body tag.
data:text/html,<html contenteditable onload="document.body.innerHTML = localStorage['text']" oninput="localStorage['text'] = document.body.innerHTML" style="line-height:1.5;font-size:20px;"> Failed to read the 'localStorage' property from 'Window': Storage is disabled inside 'data:' URLs.> Webstorage is tied to an origin. 'data:' URLs have unique origins in Blink (that is, they match no other origins, not even themselves). even if we decided that 'data:' URLs should be able to access localStorage, the data wouldn't be available next time you visited the URL, as the origins wouldn't match.
I code-golfed greyface-'s code and made the text cursor autofocus on page load:
data:text/html,<body contenteditable autofocus oninput="history.replaceState(0,0,'%23'+btoa(this.outerHTML))" onload="location.hash&& document.write(atob(location.hash.slice(1)))"># data:text/html,<body contenteditable style="line-height:1.5;font-size:20px;color:lightgray;background-color:black">Except when you brainfart on the OS shutdown and choose the wrong answer.
But yes, I even do the culling every couple of months.
It doesn't! At least when I Alt+F4 it.
> everything’s unsaved and some notes have survived dozens of reboots
Yep, this is exactly how I use it.
But somehow that one time (note: it was on the shutdown) something went terribly wrong.
I've changed machines where the user profile was in a different location, copied my AppData, and replacing the old location in Notepad++'s session.xml was enough to restore my unsaved notes.
Of course I tried everything (except looking in the shadow copy? Don't remember), but in the essence the shutdown triggered Save All workflow (somehow) and I responded with 'No'.
*weep*
Because the browser is the operating system.
I might be only half joking.
It's like that saying "The difference between a boat and a ship is that a ship can carry a boat, but a boat can't carry a ship." And I know there is jslinux but at that point we're in a Turing tarpit where you can say that the Lua VM or wasm is "an OS" and the term is just a five-dollar word for "abstraction layer". Is a function call an OS? Come on.
So I use Zim wiki instead: https://zim-wiki.org/
Can we use svg instead?
"Doesn't use analytics = respects your privacy"
https://static.cloudflareinsights.com/beacon.min.js/vef91dfe02fce4ee0ad053f6de4f175db1715022073587>Doesn't use a server = no downtimes
Except there is a server, whatever and wherever it is behind notepadtab.com.
I think PWAs might have something like that, but haven't tested it in a normal browser or tried building one.
You're probably asking about HTTPS, in which case: No. The first rule about HTTPS is no caching, because you want to validate that what you see is from the server and you can't prove that with a cache.
https://developer.mozilla.org/en-US/docs/Web/Progressive_web...
edit: I tried this and common browser security no longer allows this type of thing. 10 years ago it may have worked.
data:text/html,<body contenteditable oninput="history.replaceState(0,0,'%23'+btoa(document.body.innerHTML))" onload="if(location.hash)document.body.innerHTML=atob(location.hash.substring(1))">#SGVsbG8sIHdvcmxkIQ==Much better than a relying on an HTTP response from someone else's computer.
How can I silence the Firefox security error messages?
Anyway this one works in FF with my settings
https://gist.github.com/joakin/f05fd565e8df77a805e21d2d3469d...
> - Doesn't need cookies = immune to data loss by accident
How is this immune if you have to remember to save it manually? That seems much worse than relying on cookies. Sure you can maybe restore it from the browser history, but if cookies are not considered reliable, then the history even more so. It's easier to delete history than cookies.
This reputation profile is then used as part of the heuristic behind CloudFlare Turnstile's "Are you human?" checkbox.
This is why browsers that have NoScript enabled by default for all sites (e.g. Tor Browser), cause Cloudflare-proxied sites to throw endless security interstitials and never let you through, even when you disable NoScript for the protected website. Without reputation-profile data gathered from other sites, Cloudflare just sees a fresh browser profile making its first connection ever to some obscure site that nobody would ever actually visit as the first thing they do on a new computer. And so it thinks your browser is a (not-very-clever) bot.
I don't think it's possible for a site owner to opt out of this reputation-profile data gathering, while still relying on Cloudflare's DDoS protection.
However, I also don't believe that the data Cloudflare gathers via this route is sold to third parties. (Someone please correct me if that's wrong.)
I’m sure the author isn’t aware of it and it’s just an oversight, but still.
Why does a single static html file even need a CDN?
But anything that can be served from a cdn is better off if it fits. From a latency and bandwidth efficiency perspective
Hint: it bloody doesn't.
If this static site is sitting on a CDN or Github Pages or something, then sure, there's no need to mask its IP address.
But if this static site is hosted on a cheap VPS or on a home PC with a residential Internet connection — or generally, anything with a monthly bandwidth usage cap — then any teenager who learns its true IP address (and then checks out that IP address's provenance with a whois(1)) could decide to pay $5 to throw a botnet at it for an hour — just because they know they can take it down by spending enough of its bandwidth, and want to try it, to be able to brag to their friends that they took something down.
(Yes, teenagers today do that. The most DDoS-ed things in the world today are Minecraft servers — because teens like messing with other teens.)
---
Also, half of what makes Cloudflare useful for "DDoS protection" isn't actually its "bot fight" security system, but rather its caching layer combined with its lack of egress costs (at least until you get forced into their Enterprise billing.)
If you are hosting your content on e.g. a public S3 bucket, where you're billed for egress bandwidth, but where S3 also sends sensible long-expiry Cache-Control headers; and you put Cloudflare in front of that S3 bucket (even just Cloudflare's free-tier offering!); then suddenly your S3 bucket will only be serving requests for each resource a few times a day, rather than for every single request. 99.999% of the traffic to your bucket will be a cache hit at the Cloudflare level, and so will be only a conversation between Cloudflare and the customer, not between Cloudflare and S3. So, even in the face of a DDoS, your billing won't explode.
This is probably beyond the author's control, but they shouldn't host it somewhere that can inject scripts outside their control (like Cloudflare) and then claim "privacy".
(The Cloudflare script makes a request to `/cdn-cgi/rum`, with the full page URL in its JSON payload at `timingsV2.name`.)
Its a neat idea, but I think theres a limit to how long URLs can be.
Reassuringly:
function serialize(value) {
if (value === '') { return ''; }
const data = new TextEncoder().encode(value);
const compressed = pako.deflate(data, { level: 9 });
return Base64.fromUint8Array(compressed, true);
}A bunch of the comments talk about using in earnest- at the risk of sounding out of touch, if you want private, offline available notes, what's wrong with text files on a file system?
(I think my question looks sarcastic, but I'm genuinely interested!)
Also I prefer web apps because they are highly customisable. If I don't like something I can modify the source easily.
I stumbled upon tiddly desktop, an app that runs tiddly wikis without a browser.
I currently have a single doc file that I use like notes, as soon as I type "note" in my address bar, my browser automatically fills in the rest of the URL for the file (since I open is frequently).
The Doc file allows me to paste images, add links, or anything else essential for note taking. I don't need to save, or find the URL from browser history. Simply type and close.
For any new file, I can type Doc.new. It will work the same way.
Please explain how is it different?
- https://space-element.pages.dev
(also can be archived plainly from client side, such as with https://archive.is/uXWBQ and https://archive.is/goog.space)
This reminds me of a trivial browser notepad I hacked together a while back. Have been using this and has been indispensable - quickly open and jot down some notes. Has syntax highlighting and saves the notes to the browser db.
Save notes by copying and pasting the URL? Why not just copy and paste the text itself? I don't need formatting in my notes.
I didn't want to write them down in a text editor, because they wouldn't have been bound to my context anymore.
Hope my explanation makes sense.
Fun fact: I saw people taking notes in translate.google.com for the same reasons that I created notepadtab.com.
You can see how it works for yourself by opening your browser devtools, opening the JS console, and typing
window.location.hash = "test"
This is a solution for a problem that was solved 40 years ago.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Note App</title>
<style>
body { font-family: Arial, sans-serif; margin: 0; padding: 20px; }
textarea { width: 100%; height: 80vh; padding: 10px; font-size: 16px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box; }
</style>
</head>
<body>
<textarea id="textarea" placeholder="Write your notes here..." autofocus></textarea>
<script>
document.addEventListener('DOMContentLoaded', function() {
const textarea = document.getElementById('textarea');
const loadValue = () => {
const hash = window.location.hash;
try {
const value = hash ? decodeURIComponent(atob(hash.substring(1))) : '';
textarea.value = value;
textarea.selectionStart = value.length;
} catch (e) {
console.error('Error decoding hash:', e);
textarea.value = '';
}
};
const storeValue = (value) => window.location.hash = '#' + btoa(encodeURIComponent(value));
textarea.addEventListener('input', () => storeValue(textarea.value), false);
window.addEventListener('hashchange', loadValue);
loadValue();
});
</script>
</body>
</html>I don’t understand why people find these tools exciting/useful. I never have to worry about losing data with TextEdit because it autosaves, natively, and is accessible outside the OS that the browser has become.
Your URL is logged, therefore everything you type is readable by anyone farming your URLs.
What am I missing here, why does this seem like such a security risk.
I notice it wants to run Cloudflare insights. Do they track this?