@@ -51,8 +51,11 @@
       };
     }
 
+    // IE 10 doesn’t support console.debug
+    var consoleDebug = console.debug || console.log
+
     console.log = customLog(console.log.bind(console), document.getElementById("console-log"));
-    console.debug = customLog(console.log.bind(console), document.getElementById("console-log"));
+    console.debug = customLog(consoleDebug.bind(console), document.getElementById("console-log"));
     console.warn = customLog(console.warn.bind(console), document.getElementById("console-log"));
     console.error = customLog(console.error.bind(console), document.getElementById("console-log"));
   </script>
<%- partial('partials/sidebar', { type: page.type, index: page.index }) %>
<div class="Content js-Content <%- page.type ? page.type + ' with-sidebar' : '' %>">
  <h1><%- page.title %> Example</h1>

  <%- page.content %>

  <p>Please see <a href="/docs/">documentation</a> for details.</p>

  <hr>

  <p>Hey there stranger! Uppy <img src="/images/emojis/dog.png" width="14" align="absmiddle">
    is actively developed and the example section
    is our playground. Things might not work, but we're working hard to improve.</p>
  <p>We're on a monthly release cycle and our latest version is
    <a href="https://github.com/transloadit/uppy/blob/master/CHANGELOG.md#<%- theme.uppy_version_anchor %>">v<%- theme.uppy_version %></a>,
    but the example pages reflect the latest work in our master branch. Here's
    <a href="https://github.com/transloadit/uppy/compare/v<%- theme.uppy_version %>...master">what changed in master since v<%- theme.uppy_version %></a>
    in terms of commits, while the CHANGELOG
    provides a higher level view of the things planned for our
    <a href="https://github.com/transloadit/uppy/blob/master/CHANGELOG.md#next">next release</a>.</p>

  <!-- Add textarea already so it's available immediately for logging.
  It is later made visible, and moved into the #console-wrapper to position it in layout how
  you see fit. -->

  <blockquote>Files from the examples are uploaded to our test servers and deleted daily.</blockquote>

  <textarea id="console-log" class="Console"></textarea>
  <script>
    function customLog (log, container) {
      return function () {
        var text = [];
        // loop through `arguments`, because console.log accepts multiple
        var args = Array.prototype.slice.call(arguments);
        args.forEach(function (arg) {
          if (arg !== (arg + '')) {
            // try/catch to prevent TypeError: cyclic object value
            try {
              arg = JSON.stringify(arg);
            } catch (err) {}
          }
          text.push(arg);
        })

        text = text.join(' ');

        log(text);

        container.value += text + '\n';
        container.scrollTop = container.scrollHeight;
      };
    }

    console.log = customLog(console.log.bind(console), document.getElementById("console-log"));
    console.debug = customLog(console.log.bind(console), document.getElementById("console-log"));
    console.warn = customLog(console.warn.bind(console), document.getElementById("console-log"));
    console.error = customLog(console.error.bind(console), document.getElementById("console-log"));
  </script>

  <script>
    // #console-log textarea is declared earlier so it's available immediately for logging.
    // Here it is made visible, and moved into the #console-wrapper, so you can position it in the layout how
    // you see fit.
    document.getElementById('console-wrapper').appendChild(document.getElementById('console-log'));
    document.getElementById('console-log').style.display = 'block';
  </script>

  <div class="footer">Caught a mistake or want to contribute to the documentation?
     <a href="https://github.com/transloadit/uppy/blob/master/website/src/<%- page.source %>" rel="noreferrer noopener" target="_blank">Edit/fork this page directly on Github</a>!
  </div>
</div>

I guess we don't need `console.log =` here then, because `.debug` calls `.log` when needed? But it's a minor detail, it's not hurting anything.