From 06151b22c53d1c36c606a42235f7132b71e89692 Mon Sep 17 00:00:00 2001 From: Jacob Strieb Date: Sun, 19 Jul 2020 17:10:25 -0400 Subject: [PATCH] Update bookmarklet and put in its own file --- README.md | 17 +++++++------ bookmarklet.js | 69 ++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 78 insertions(+), 8 deletions(-) create mode 100644 bookmarklet.js diff --git a/README.md b/README.md index 217e1e0..a3c6578 100644 --- a/README.md +++ b/README.md @@ -109,10 +109,10 @@ editor](http://jstrieb.github.io/urlpages/editor). - My personal website - Code in the code editor [here](https://tinyurl.com/y64dmsqm) - - "Published" version [here](https://tinyurl.com/y5mpq8zh) + - "Published" version [here](https://tinyurl.com/y5w9ybk2) - Bookmarklet setup page - - Code in the code editor [here](http://tinyurl.com/y6rrrlnm) - - "Published" version [here](http://tinyurl.com/y5khpxpt) + - Code in the code editor [here](https://tinyurl.com/y5r8y4v4) + - "Published" version [here](https://tinyurl.com/y3lw36uh) - A page with embedded images (no external image host) - Code in the code editor [here](http://jstrieb.github.io/urlpages/examples/embed-code.html) @@ -124,7 +124,7 @@ The following examples were cloned from existing pages using the bookmarklet. - My dad's food blog [here](http://jstrieb.github.io/urlpages/examples/food-blog.html) - The entire [editor](http://jstrieb.github.io/urlpages/editor) encoded in the - URL [here](https://tinyurl.com/y62y9abz) + URL [here](https://tinyurl.com/y6nx5347) - This GitHub project page [here](http://jstrieb.github.io/urlpages/examples/project-page.html) - A cloned New York Times Article @@ -135,10 +135,11 @@ The following examples were cloned from existing pages using the bookmarklet. Currently, the bookmarklet is very much in-development (read: mostly doesn't work). Feel free to try it anyway by visiting the link below and following the -instructions, or pasting the code below into a bookmark: -- [Bookmarklet instruction page](http://tinyurl.com/y5khpxpt) -- `javascript:window.open("http://jstrieb.github.io/urlpages/#" + - btoa(encodeURIComponent(document.documentElement.outerHTML)), "_blank")` +instructions. +- [Bookmarklet instruction page](https://tinyurl.com/y3lw36uh) + +Code for the bookmarklet can be found in +[`bookmarklet.js`](https://github.com/jstrieb/urlpages/blob/master/bookmarklet.js). The bookmarklet enables some of the most interesting and promising opportunities for URL Pages. Namely: cloning pages for archival purposes, diff --git a/bookmarklet.js b/bookmarklet.js new file mode 100644 index 0000000..b62a97c --- /dev/null +++ b/bookmarklet.js @@ -0,0 +1,69 @@ +(() => { + var b64 = (() => { + function generateIndexDict(a) { + let result = {}; + for (let i = 0; i < a.length; i++) { + result[a[i]] = i; + } + return result; + } + const _a = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"; + const _aRev = generateIndexDict(_a); + _aRev["-"] = _aRev["+"]; + _aRev["_"] = _aRev["/"]; + + const _enc = new TextEncoder("utf-8"); + const _dec = new TextDecoder("utf-8"); + + return { + encode: function(s) { + return this.binaryToBase64(this.asciiToBinary(s)); + }, + + asciiToBinary: function(text) { + return _enc.encode(text); + }, + + binaryToBase64: function(originalBytes) { + let length = originalBytes.length; + let added = (length % 3 == 0) ? 0 : (3 - length % 3); + let bytes = new Uint8Array(length + added); + bytes.set(originalBytes); + + let output = ""; + for (let i = 0; i < bytes.length; i += 3) { + output += _a[ bytes[i] >>> 2 ]; + output += _a[ ((bytes[i] & 0x3) << 4) | (bytes[i + 1] >>> 4) ]; + output += _a[ ((bytes[i + 1] & 0xF) << 2) | (bytes[i + 2] >>> 6) ]; + output += _a[ bytes[i + 2] & 0x3F ]; + } + + if (added > 0) { + output = output.slice(0, -added) + ("=".repeat(added)); + } + + return output; + }, + } + })(); + + + var api = { + VERSION: "0.2.0", + + getViewLink: function(pageData) { + var urlData = { + version: this.VERSION, + compressed: false, + body: pageData, + }; + + const hashObject = b64.encode(JSON.stringify(urlData)); + return `http://jstrieb.github.io/urlpages/#${hashObject}`; + }, + }; + + + javascript:window.open(api.getViewLink(document.documentElement.outerHTML), "_blank"); + +})();