Skip to content

Instantly share code, notes, and snippets.

@bleonard252
Last active June 27, 2020 10:53
Show Gist options
  • Save bleonard252/8886ba6a2f27408e1abcfc2a1ad734fc to your computer and use it in GitHub Desktop.
Save bleonard252/8886ba6a2f27408e1abcfc2a1ad734fc to your computer and use it in GitHub Desktop.
Myfile viewer
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Myfile Tester/Viewer/Thing</title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/abodelot/jquery.json-viewer@master/json-viewer/jquery.json-viewer.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/abodelot/jquery.json-viewer@master/json-viewer/jquery.json-viewer.css">
</head>
<body>
<div id="viewer-root">
</div>
<pre id="json-renderer"></pre>
<script>
var myfileaddr = (location.hash.startsWith("#!") ? location.hash.slice(2) : "")
function linkparser(link) {
var linkparts = link.match(/\[(.*?)\]\((.*?)\)/) || null
if (linkparts) return `<a href="${linkparts[1]}">${linkparts[2]}</a>`
else return `<a href="${link}">${link}</a>`
}
function processJSONPResponse(json) {return json}
function fpr() {$.ajax(
{url:(myfileaddr.match(/^\w*:\/\//) ? myfileaddr+"?type=json" : "https://"+myfileaddr+"?type=json"),
headers: {"Accept": "application/json"}})
.then((data) => {
var myfile = data;
//else return false;
$("#viewer-root").children().remove();
if (myfile.picture) $("#viewer-root").append($(`<img src="${myfile.picture}">`));
if (myfile.name) $("#viewer-root").append($(`<h1>${myfile.name}</h1>`));
if (myfile.description) $("#viewer-root").append($(`<p>${myfile.description}</p>`));
if (myfile.links && myfile.links.length)
$("#viewer-root").append($(`<ul>
${myfile.links.map((val,i,a) => {return `<li>${linkparser(val)}</li>`}).join("\n")}
</ul>`));
$('#json-renderer').jsonViewer(myfile);
})}
if (myfileaddr != "") fpr();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment