Treehugger

Donde

[~/srcPLgrado/treehugger(master)]$ pwd -P
/Users/casiano/local/src/javascript/PLgrado/treehugger

[~/srcPLgrado/treehugger(master)]$ git remote -v
origin  git@github.com:crguezl/treehugger.git (fetch)
origin  git@github.com:crguezl/treehugger.git (push)

https://github.com/crguezl/treehugger

learning.html

[~/srcPLgrado/treehugger(master)]$ cat learning.html 
<!DOCTYPE html>
<html>
  <head>
    <title>treehugger.js demo</title>
    <script data-main="lib/demo" src="lib/require.js"></script>
    <link rel="stylesheet" href="examples/style.css" type="text/css" />
  </head>
  <body>
  <h1>Treehugger.js playground</h1>
    <table>
    <tr>
      <th>Javascript</th>
      <th>AST</th>
    </tr>
    <tr>
      <td><textarea id="code" rows="15" cols="42">var a = 10, b;
console.log(a, b, c);</textarea></td>
      <td><textarea id="ast" rows="15" cols="42" readonly style="background-color: #eee;"></textarea></td>
    </tr>
    <tr>
      <th>Analysis code <button id="runbutton">Run</button></th>
      <th>Output</th>
    </tr>
    <tr>
      <td><textarea id="analysis" rows="15" cols="42">var declared = {console: true};

ast.traverseTopDown(
   'VarDecl(x)', function(b) {
      declared[b.x.value] = true;
   },
   'VarDeclInit(x, _)', function(b) {
      declared[b.x.value] = true;
   },
   'Var(x)', function(b) {
      if(!declared[b.x.value])
        log("Variable " + b.x.value + " is not declared.");
   }
);
</textarea></td>
      <td><textarea id="output" rows="15" cols="42" readonly style="background-color: #eee;"></textarea></td>
    </tr>
    </table>
  </body>
</html>

lib/demo.js

[~/srcPLgrado/treehugger(master)]$ cat lib/demo.js 
require({ baseUrl: "lib" }, 
    ["treehugger/tree", 
     "treehugger/traverse", 
     "treehugger/js/parse", 
     "jquery",
     "treehugger/js/acorn", // Acorn is a JavaScript parser
     "treehugger/js/acorn_loose" // This module provides an alternative 
                                 // parser with the same interface as 
                                 // `parse`, but will try to parse
                                 // anything as JavaScript, repairing 
                                 // syntax error the best it can.
    ], function(tree, traverse, parsejs, jq, acorn, acorn_loose) {
          window.acorn_loose = acorn_loose

          function log(message) {
            $("#output").val($("#output").val() + message + "\n");
          }

          function exec() {
            var js = $("#code").val();
            var analysisJs = $("#analysis").val();
            $("#output").val("");   
            
            // https://developer.mozilla.org/en-US/docs/Web/API/Performance.now()
            var t = performance.now(); 
            var ast = parsejs.parse(js);
            t -= performance.now();
            $("#ast").val(t + "\n" + ast.toPrettyString());
            try {
              eval(analysisJs);
            } catch(e) {
              $("#output").val("JS Error");
              console.log(e.message)
            }
          }

          tree.Node.prototype.log = function() {
            $("#output").val(this.toPrettyString());
          }

          require.ready(function() {
              $("#code").keyup(exec);
              $("#runbutton").click(exec);
              exec();
          });
      }
);

Véase

Casiano Rodríguez León
2016-03-27