31:T4e6,viewof url = { const textarea = html`

${new URLSearchParams(html`<a href>`.search).get("url") || `https://api.github.com/users/nasa/repos`}`;
  textarea.oninput = () => {
    textarea.style.height = "auto";
    textarea.style.height = `${textarea.scrollHeight}px`;
  };
  yield textarea;
  textarea.oninput();
  yield textarea;
}

// viewof url = {
//   const textarea = html`<textarea style='display: block;
//   box-sizing: border-box;
//   width: calc(100% + 28px);
//   font: var(--mono_fonts);
//   min-height: 33px;
//   border: none;
//   padding: 6px 10px;
//   margin: 0 -14px;
//   background: rgb(247,247,249);
//   tab-size: 2;
//   resize: none;' rows=1>${new URLSearchParams(html`<a href>`.search).get("url") || `https://api.github.com/users/observablehq/repos`}`;
//   textarea.oninput = () => {
//     textarea.style.height = "auto";
//     textarea.style.height = `${textarea.scrollHeight}px`;
//   };
//   yield textarea;
//   textarea.oninput();
//   yield textarea;
// }
32:[]
2f:{"title":"Github Api Explorer ","cells":[{"id":0,"value":"Top = md`# Github Api Explorer \n# with a focus on NASA Org Account Details\n\nA blatent rip off, I mean fork, of work by <a href=\"https://beta.observablehq.com/@peter-hartmann\">Peter Hartmann</a> in his <a href=\"https://beta.observablehq.com/@peter-hartmann/json-api-explorer\">GitHub Api Explorer</a>.\n\n\nGiven a Url it fetches a Json Api and shows the result as recursive table.\n\nAny urls returned by the Api will be clickable.  (Url substitutions in the form of '...{var}' are stripped out in an attempt to get a valid Api call.) \n\nThe initial Api Url can be provided as Url paramerer of this notebook i.e.: '?url=...'.\n\nNote GitHub limits Api requests per hour when not using an API key, see x-ratelimit in the response header below. (Currently  ${response.headers['x-ratelimit-remaining']} api requests remaining)\n\nIndex:\n- [Request Url](#RequestUrl)\n- [Api Response Headers](#ApiHeaders)\n- [Api Response Data](#ApiData)\n- [Api Response Image](#ApiImage)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":104,"value":"RequestUrl = md`<div style=\"text-align: right\"><a href='#Top'>Top</a></div>\n## Change the request Api call here:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"response = {\n  const resp = await fetch(url);\n  const headers = [...resp.headers.entries()].reduce((_, v) => (_[v[0]] = v[1], _), {});\n  let data, error, image;\n  if (false) {}\n  else if (headers['content-type'].match(/json/)) {\n    const text = await resp.text();\n    try { data = JSON.parse(text); }\n    catch (e) { error = e; }\n  }\n  else if (headers['content-type'].match(/image/)) {\n    const buffer = await resp.arrayBuffer();\n    const bytes = [].slice.call(new Uint8Array(buffer));\n    const binary = bytes.reduce((a,v)=>(a+=String.fromCharCode(v),a),'');\n    image = 'data:image/jpeg;base64,' + window.btoa(binary);\n  }\n  return { headers, data, image, error };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":34,"value":"ApiHeaders = md`<div style=\"text-align: right\"><a href='#Top'>Top</a></div>\n## Api Response Headers:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":20,"value":"html`${json2table(response.headers)}`","pinned":true,"hidden":false,"mode":"ojs"},{"id":39,"value":"ApiData = md`<div style=\"text-align: right\"><a href='#Top'>Top</a></div>\n## Api Response Data:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"html`${json2table(response.data)}`","pinned":true,"hidden":false,"mode":"ojs"},{"id":172,"value":"ApiImage = md`<div style=\"text-align: right\"><a href='#Top'>Top</a></div>\n## Api Response Image:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":228,"value":"","pinned":true,"hidden":false,"mode":"ojs"},{"id":154,"value":"html`<img src=${response.image}></img>`","pinned":true,"hidden":false,"mode":"ojs"},{"id":282,"value":"","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"function json2table(json) {\n  if (json && typeof(json) === \"object\") return `<table>${Object.keys(json).reduce((_, k) => `${_}<tr><td>${k}</td><td>${json2table(json[k])}</td></tr>`, \"\")}</table>`;\n  let text = `${json}`;\n  if (!text.match(/^https?\\:\\/\\//)) return `<pre>${text.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>')}</pre>`;\n  return `<a href=\"?url=${text.split(\"{\",1)[0]}\">${text}</a>`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":189,"value":"// import { pageAnalytics } from '@peter-hartmann/page-analytics'","pinned":false,"hidden":false,"mode":"ojs"},{"id":192,"value":"// pageAnalytics","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}
</article></body></html>