Skip to content

Instantly share code, notes, and snippets.

@DarrenSem
Last active October 15, 2023 17:28
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save DarrenSem/93a69dde8900b7a1f83937014b6bc019 to your computer and use it in GitHub Desktop.
Save DarrenSem/93a69dde8900b7a1f83937014b6bc019 to your computer and use it in GitHub Desktop.
OpenInNewWindow(data, type) - F5-REFRESHABLE! - auto-UTF8 if type==="text"! - also ContentsInNewWindow(contents = '' or [], Title, type, delimToJoinArray = "\n\n")
// contentsInNewWindow.js - F5-REFRESHABLE! - with TITLE! - (contents = '' or [], title, type = 'octet-stream', array-joining-delim = '\n\n')
// const contentsInNewWindow=(c=[],T,t="octet-stream",d="\n\n")=>{const w=open(URL.createObjectURL(new Blob([[c].flat(1/0).join(d)],{type:"text"===t?t+"/plain;charset=utf-8":t})),"_blank");return w&&!w.closed&&(w.onload=()=>w.document.title=T),w};
const contentsInNewWindow = (contents = [], title, type = ["text", "octet-stream"][1], delim = "\n\n") => {
const win = open(
URL.createObjectURL(
new Blob([
[contents].flat(1/0).join(delim)
], {
// auto-UTF8 if type === 'text', to easily ensure visible emojis etc.
type: type !== "text" ? type : (type + "/plain;charset=utf-8")
})
)
, "_blank" // new tab for [blob:<location.origin>/abc-12-34-def]
);
if(win && !win.closed)win.onload = () => win.document.title = title;
return win;
};
// var s = "🤦‍♂🌞have a great weekend "; console.log(s); console.log(s = new Blob([s], {type: "text/plain; charset=utf-8"}), s = URL.createObjectURL(s)); window.open(s); !!s;
// new tab: "🤦‍♂🌞have a great weekend "
// Blob {size: 37, type: 'text/plain; charset=utf-8'} 'blob:<location.origin>/abc-12-34-def'
// 🤦‍♂🌞have a great weekend
// returns: true
var string = "🤦‍♂🌞have a great weekend ";
var array = ["🤦‍♂", "🌞", "have a great weekend "];
var joiner = "[-_-]";
console.log(contentsInNewWindow(string, "<title: default type 'octet-stream' AKA 'application/octet-binary'>"));
// new tab: "🤦‍♂🌞have a great weekend "
// returns: Window {window: Window, self: Window, document: document, name: '', location: Location, ...}
console.log(contentsInNewWindow(string, "<title: text/plain which defaults to ;ascii>", "text/plain"));
// new tab: "🤦‍♂🌞have a great weekend "
// returns: Window {window: Window, self: Window, document: document, name: '', location: Location, ...}
console.log(contentsInNewWindow(string, "<title: auto-UTF8 - type 'text' expands to 'text/plain;utf-8'>", "text"));
// new tab: "🤦‍♂🌞have a great weekend "
// returns: Window {window: Window, self: Window, document: document, name: '', location: Location, ...}
console.log(contentsInNewWindow(array, "<title: auto-UTF8 & array-joining delim>", "text", joiner));
// new tab: "🤦‍♂[-_-]🌞[-_-]have a great weekend "
// returns: Window {window: Window, self: Window, document: document, name: '', location: Location, ...}
// contentsInNewWindow.js -- both possibilities compared(ALL survive F5 refresh)
C1=(...strings)=>{let a=document.createElement("a");a.href=URL.createObjectURL(new Blob([strings.join("\n")]),{type:"text/plain;charset=utf-8"}),a.target="_blank",a.click()};
// ^ 170 chars
C1b=(...strings)=>Object.assign(document.createElement("a"),{href:URL.createObjectURL(new Blob([strings.join("\n")],{type:"text/plain;charset=utf-8"})),target:"_blank"}).click();
// ^ 173 chars so forget this "TRICK"
C2=(...strings)=>open(URL.createObjectURL(new Blob([strings.join("\n")],{type:"text/plain;charset=utf-8"})),"_blank");
// ^ 114 chars
C3=(title,...strings)=>{let w=open(URL.createObjectURL(new Blob([strings.join("\n")],{type:"text/plain;charset=utf-8"})),"_blank");w&&!w.closed&&(w.onload=_=>{title&&(w.document.title=title)})};
// ^ 190 chars
C3b=(title,...strings)=>[open(URL.createObjectURL(new Blob([strings.join("\n")],{type:"text/plain;charset=utf-8"})),"_blank")].map(w=>w&&!w.closed&&(w.onload=_=>{title&&(w.document.title=title)}));
// ^ 192 chars so forget this "TRICK"
// openInNewWindow.js - F5-REFRESHABLE! - (data, type = 'octet-stream')
// const openInNewWindow=(d,t="octet-stream")=>Object.assign(document.createElement("a"),{href:URL.createObjectURL(new Blob([d].slice(d===void 0),{type:"text"===t?t+"/plain;charset=utf-8":t})),target:"_blank"}).click();
const openInNewWindow = (data, type = ["text", "octet-stream"][1]) => Object.assign(
document.createElement("a"), {
href: URL.createObjectURL(
new Blob([data].slice(data === undefined), {
// auto-UTF8 if type === 'text', to easily ensure visible emojis etc.
type: type !== "text" ? type : (type + "/plain;charset=utf-8")
})
)
// , filename: <omitted> = DISPLAY data in browser instead of saving file - e.g. [blob:<location.origin>/abc-12-34-def]
, target: "_blank" // new tab for [blob:<location.origin>/abc-12-34-def]
}
).click();
// var s = "🤦‍♂🌞have a great weekend "; console.log(s); console.log(s = new Blob([s], {type: "text/plain; charset=utf-8"}), s = URL.createObjectURL(s)); window.open(s); !!s;
// new tab: "🤦‍♂🌞have a great weekend "
// Blob {size: 37, type: 'text/plain; charset=utf-8'} 'blob:<location.origin>/abc-12-34-def'
// 🤦‍♂🌞have a great weekend
// returns: true
var string = "🤦‍♂🌞have a great weekend ";
var array = ["🤦‍♂", "🌞", "have a great weekend "];
console.log(openInNewWindow(string)); // default type 'octet-stream' AKA 'application/octet-binary'
// new tab: "🤦‍♂🌞have a great weekend "
// returns: undefined
console.log(openInNewWindow(string, "text/plain")); // text/plain which defaults to ;ascii
// new tab: "🤦‍♂🌞have a great weekend "
// returns: undefined
console.log(openInNewWindow(string, "text")); // auto-UTF8 - type 'text' expands to 'text/plain;utf-8'
// new tab: "🤦‍♂🌞have a great weekend "
// returns: undefined
console.log(openInNewWindow(array, "text")); // auto-UTF8 - type 'text' expands to 'text/plain;utf-8'
// new tab: "🤦‍♂,🌞,have a great weekend "
// returns: undefined
/////// examples with simple textString (output = various values for MIME type; some open SaveAs dialog)
var textString = "\nthe\n\n\tcontents";
// display text inside new tab
openInNewWindow(textString);
// display text AS PNG (will not be usable, of course) inside new tab
openInNewWindow(textString, "image/png");
// display text AS ZIP (will prompt to download, because .ZIP!) inside new tab
openInNewWindow(textString, "application/zip");
// display text AS Windows' custom MIME type for ZIP (will prompt to download, because .ZIP!) inside new tab
openInNewWindow(textString, "application/x-zip-compressed");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment