search

evilstreak / markdown-js

A Markdown parser for javascript
7.69k stars 863 forks source link

Browser example throws two ReferenceErrors #197

Open walterdavis opened 10 years ago

walterdavis commented 10 years ago 
ReferenceError: Can't find variable: exports (markdown.js: 1737)
ReferenceError: Can't find variable markdown (index.html: 18)

Here's the entire index.html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>Markdown.js Example</title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.7/prototype.js"></script>
</head>

  <body>
    <textarea id="text-input" oninput="this.editor.update()"
              rows="6" cols="60">Type **Markdown** here.</textarea>
    <div id="preview"> </div>

    <script src="lib/markdown.js"></script>
    <script>
      function Editor(input, preview) {
        this.update = function () {
          preview.innerHTML = markdown.toHTML(input.value); // <- line 18
        };
        input.editor = this;
        this.update();
      }
      new Editor($("text-input"), $("preview"));
    </script>
  </body>
</html>
walterdavis commented 10 years ago

I've tested this with the default HTML given in the README as well (without Prorotype.js), in three current browsers: Chrome, Safari, and Firefox (all latest public versions). All three throw the same two errors and refuse to do anything else.

niku commented 10 years ago

I ran into same error using v0.6.0-beta1. I avoid error by the following html.

<!DOCTYPE html>
<html>
  <body>
    <textarea id="text-input" oninput="this.editor.update()"
              rows="6" cols="60">Type **Markdown** here.</textarea>
    <div id="preview"> </div>
    <script>var exports = this;</script><!-- ADD HERE -->
    <script src="lib/markdown.js"></script>
    <script>
      function Editor(input, preview) {
        this.update = function () {
          var markdown = Markdown;        // ADD HERE
          preview.innerHTML = markdown.toHTML(input.value);
        };
        input.editor = this;
        this.update();
      }
      var $ = function (id) { return document.getElementById(id); };
      new Editor($("text-input"), $("preview"));
    </script>
  </body>
</html>

It works on Firefox(ver 30.0). I don't think this is good solution, but anyway it works.

niku commented 10 years ago

Oh, I'm wrong.

I downloaded "markdown-0.6.0-beta1.tar.gz". But It needs "markdown-browser-0.6.0-beta1.tar.gz" for using on the browser.

It works fine with following html in the "markdown-browser-0.6.0-beta1" directory.

<!DOCTYPE html>
<html>
  <body>
    <textarea id="text-input" oninput="this.editor.update()"
              rows="6" cols="60">Type **Markdown** here.</textarea>
    <div id="preview"> </div>
    <script src="markdown.js"></script><!-- CHANGE PATH -->
    <script>
      function Editor(input, preview) {
        this.update = function () {
          preview.innerHTML = markdown.toHTML(input.value);
        };
        input.editor = this;
        this.update();
      }
      var $ = function (id) { return document.getElementById(id); };
      new Editor($("text-input"), $("preview"));
    </script>
  </body>
</html>