{# Renders view-source in the browser, triggered by the view-source menu item with custom variables. 
Odysseus does it this way, as opposed to using Scratch as both applications are capable of rendering text
and Odysseus is better suited to the Read-only nature of this feature.

The styling of this page matches Scratch''s defaults.

A custom favicon is used to indicate this is a view-source tab and
    information about the source page is displayed in the usual places.
Line numbers are not included as the developer of our syntax highlighting library
    wishes to discourage them and I (Adrian Cochrane) am not missing them. #}
<!DOCTYPE html>
<html>
<head>
  <title>[text-html]{{ title }}</title>

  <style>
    @import url(odysseus:ext/hljs-solarized-light.css);
    body {background: #fdf6e3;} /* To match Solarized Light */
    pre.hljs {
        overflow-x: visible;
        padding: 0;
    }
  </style>
  <script src="odysseus:ext/highlight.pack.js"></script>
  <base href="{{ url }}" />
</head>
<body>
  <pre>{{ source }}</pre>
  <script src="odysseus:ext/highlight.pack.js"></script>
  <script>
    var code = document.querySelector("pre");
    // Autolink any resources (uses the above base URL to resolve relative links)
    // highlight.js will be able to merge these links in with it's highlighting.
    // FIXME can't handle & in URIs, and those render as ugly &amp;'s
    var linkedCode = code.innerHTML.replace(
        /((?:url\(|&lt;(?:a|link|script|img)[^&]+(?:src|href)\s*=\s*)['"]?)(.*?)('|"|\)|\s|&gt;)/g,
        (match, prefix, url, suffix) => {
          url = url.replace("&amp;", "&"); // Undo HTML auto-escaping so these links work. 
          return prefix + url.link(url) + suffix
        })
    code.innerHTML = linkedCode
    // FIXME freezing hazard when viewing the source of large pages
    hljs.highlightBlock(code);
  </script>
</body>
</html>
