denodify
Version:
Use nodejs modules in the browser. Used with bb-server and html-builder
352 lines (256 loc) • 15.2 kB
HTML
<html>
<head>
<title>denodify-helper.js</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
<link rel="stylesheet" media="all" href="docco.css" />
</head>
<body>
<div id="container">
<div id="background"></div>
<ul class="sections">
<li id="title">
<div class="annotation">
<h1>denodify-helper.js</h1>
</div>
</li>
<li id="section-1">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-1">¶</a>
</div>
</div>
<div class="content"><div class='highlight'><pre><span class="hljs-keyword">var</span> Path = <span class="hljs-built_in">require</span>(<span class="hljs-string">'path'</span>);
<span class="hljs-keyword">var</span> required = <span class="hljs-built_in">require</span>(<span class="hljs-string">'required'</span>);
<span class="hljs-keyword">var</span> fs = <span class="hljs-built_in">require</span>(<span class="hljs-string">'fs-extra'</span>);
<span class="hljs-built_in">require</span>(<span class="hljs-string">'colors'</span>);
<span class="hljs-keyword">var</span> path = [];
<span class="hljs-keyword">var</span> index = <span class="hljs-number">0</span>;
<span class="hljs-keyword">var</span> modules;
<span class="hljs-keyword">var</span> prefix = <span class="hljs-string">"denodify('replace',function(require, module, exports, __filename, __dirname, process) {"</span>;
<span class="hljs-keyword">var</span> postfix = <span class="hljs-string">"});"</span>;</pre></div></div>
</li>
<li id="section-2">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-2">¶</a>
</div>
<p>Utility functions to enable use of nodejs modules in the browser. Used in
<a href="http://github.com/Michieljoris/html-builder">html-builder</a> and
<a href="http://github.com/Michieljoris/bb-server">bb-server</a>.</p>
</div>
</li>
<li id="section-3">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-3">¶</a>
</div>
<h3 id="wrap">wrap</h3>
</div>
</li>
<li id="section-4">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-4">¶</a>
</div>
<p>Wrap a <code>string</code> of a nodejs module with the proper code to enable its use in
the browser. Specify the <code>language</code> your nodejs module is written in to match
the added code to the code of the module. Defaults to javascript.</p>
</div>
</li>
<li id="section-5">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-5">¶</a>
</div>
<p>If you leave 2 lines open at the top of every module wrap will replace the top
line with the prefix wrapping code. This way line numbers in your modules will
match the line numbers of the javascript file loaded in the browser</p>
</div>
<div class="content"><div class='highlight'><pre>exports.wrap = <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(moduleid, string)</span> {</span>
console.log(<span class="hljs-string">'in nodify.wrap'</span>, moduleid);
<span class="hljs-keyword">if</span> (string[<span class="hljs-number">0</span>] === <span class="hljs-string">'\n'</span>) string = string.slice(<span class="hljs-number">1</span>);
<span class="hljs-keyword">var</span> newPrefix = prefix.replace(<span class="hljs-regexp">/replace/g</span>, Path.join(<span class="hljs-string">'/'</span>, moduleid));</pre></div></div>
</li>
<li id="section-6">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-6">¶</a>
</div>
<p>postfix = postfix.replace(/__dirname/, Path.dirname(module));</p>
</div>
<div class="content"><div class='highlight'><pre> <span class="hljs-keyword">return</span> newPrefix + string + postfix;
};</pre></div></div>
</li>
<li id="section-7">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-7">¶</a>
</div>
<h3 id="script">script</h3>
</div>
</li>
<li id="section-8">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-8">¶</a>
</div>
<p>Script to load in your html file before all denodified scripts.</p>
</div>
<div class="content"><div class='highlight'><pre>exports.script = fs.readFileSync(__dirname + <span class="hljs-string">'/denodify.js'</span>);</pre></div></div>
</li>
<li id="section-9">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-9">¶</a>
</div>
<h3 id="tags">tags</h3>
</div>
</li>
<li id="section-10">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-10">¶</a>
</div>
<p>Given a main <code>module</code>, parses it for require calls, loads the corresponding
module files and recursively parses them. Once all dependencies are found
calls the <code>callback</code> with a list of tags that if loaded in the browser in the
listed order all dependencies would be fullfilled for each module.</p>
</div>
</li>
<li id="section-11">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-11">¶</a>
</div>
<p>Callback is called with an error if a circular dependency is found or a
dependency is found that is not in the <code>www</code> directory, or if any other error
occurs.</p>
</div>
</li>
<li id="section-12">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-12">¶</a>
</div>
<ul>
<li><code>www</code> : the directory the server’s root.</li>
<li><code>parent</code> : the path from <code>www</code> to the main module</li>
<li><code>module</code> : the id of the file if you were requiring it (without the js)</li>
<li><code>callback</code> : called as <code>callback(err, list)</code>.
Return a list of script tags to add to a html file. </li>
</ul>
</div>
<div class="content"><div class='highlight'><pre>exports.tags = <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(www, parent, module, callback, listOnly)</span> {</span>
list(www, parent, module, callback, <span class="hljs-literal">false</span>);
};</pre></div></div>
</li>
<li id="section-13">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-13">¶</a>
</div>
<h3 id="list">list</h3>
</div>
</li>
<li id="section-14">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-14">¶</a>
</div>
<p>Same as tags, however returns only the properly ordered list of module ids and
corresponding file names.</p>
</div>
<div class="content"><div class='highlight'><pre>exports.list = <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(www, parent, module, callback, listOnly)</span> {</span>
list(www, parent, module, callback, <span class="hljs-literal">true</span>);
};
exports.debug = <span class="hljs-literal">false</span>;
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">walk</span><span class="hljs-params">(module)</span> {</span>
modules[module.id] = module;
path.push(module.id);
module.index = -<span class="hljs-number">1</span>;
module.deps.forEach(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(d)</span> {</span>
d = modules[d.id] || d;
<span class="hljs-keyword">if</span> (d.index === <span class="hljs-literal">undefined</span>) walk(d);
<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (d.index < <span class="hljs-number">0</span>) {
<span class="hljs-keyword">var</span> str = <span class="hljs-string">"Module "</span> + module.id + <span class="hljs-string">" is dependent on module "</span> + d.id +
<span class="hljs-string">'. However, module '</span> + d.id + <span class="hljs-string">' is also directly or indirectly dependent on module '</span> +
module.id + <span class="hljs-string">".\nDependency path to this point: \n"</span> + path.join(<span class="hljs-string">' relies on \n'</span>) +
<span class="hljs-string">' relies on '</span> + d.id;
console.log(str.red);
}
});
module.index = index++;
path.pop();
}
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">endsWith</span><span class="hljs-params">(str, trail)</span> {</span>
<span class="hljs-keyword">return</span> (str.substr(str.length-trail.length, str.length-<span class="hljs-number">1</span>) === trail);
};
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">trailWith</span><span class="hljs-params">(str, trail)</span> {</span>
<span class="hljs-keyword">return</span> str ? (str + (!endsWith(str, trail) ? trail : <span class="hljs-string">''</span>)) : <span class="hljs-literal">undefined</span>;
};
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">list</span><span class="hljs-params">(www, parent, id, cb, listOnly)</span> {</span>
<span class="hljs-keyword">try</span>
{ www = Path.resolve(www);
parent = Path.resolve(www, parent);
debug(<span class="hljs-string">'Resolving: '</span> + id + <span class="hljs-string">' in directory '</span> + parent);
<span class="hljs-keyword">var</span> fileName = Path.resolve(parent, trailWith(id, <span class="hljs-string">'.js'</span>));
<span class="hljs-keyword">try</span> {
fs.statSync(fileName);
} <span class="hljs-keyword">catch</span>(e) { cb(e,<span class="hljs-literal">null</span>);
<span class="hljs-keyword">return</span>;}
required(fileName, {
includeSource: <span class="hljs-literal">false</span>
}, <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(err, deps)</span> {</span>
<span class="hljs-keyword">if</span> (err) <span class="hljs-keyword">throw</span> err;
<span class="hljs-keyword">else</span> {
modules = [];
walk({
id: id,
filename: fileName,
deps: deps,
index: -<span class="hljs-number">1</span>
});
<span class="hljs-keyword">var</span> list = <span class="hljs-built_in">Object</span>.keys(modules).map(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(m)</span> {</span>
m = modules[m];
<span class="hljs-keyword">var</span> startWithWwwPath = m.filename.indexOf(www) === <span class="hljs-number">0</span>;
<span class="hljs-keyword">if</span> (!startWithWwwPath)
<span class="hljs-keyword">throw</span> <span class="hljs-string">'Warning: '</span> + m.id + <span class="hljs-string">' was found outside the www directory ('</span> + www + <span class="hljs-string">')'</span>;
m.route = m.filename.slice(www.length);
debug(<span class="hljs-string">'module:'</span>,m);
<span class="hljs-keyword">return</span> m;
}).sort(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(a, b)</span> {</span>
<span class="hljs-keyword">return</span> a.index > b.index;
}).map(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(m)</span> {</span>
<span class="hljs-keyword">return</span> listOnly ?
{ id: m.id, route: m.route, filename: m.filename } :
<span class="hljs-string">"<script type=\"text/javascript\" src=\""</span> + m.route + <span class="hljs-string">"\"></script>"</span>;
});
debug(<span class="hljs-string">'Debug:\n'</span>, list);
cb(<span class="hljs-literal">null</span>, list);
}
});
} <span class="hljs-keyword">catch</span>(e) {
cb(e, <span class="hljs-literal">null</span>);
}
};
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">debug</span><span class="hljs-params">()</span> {</span>
<span class="hljs-keyword">if</span> (exports.debug) console.log.apply(console, <span class="hljs-built_in">arguments</span>);
}</pre></div></div>
</li>
<li id="section-15">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-15">¶</a>
</div>
<p>list(‘../‘, ‘./test’, ‘./m3’, function(err, tags) {
console.log();
console.log(tags);
}, true);</p>
</div>
</li>
</ul>
</div>
</body>
</html>