Skip to content

Commit

Permalink
readme
Browse files Browse the repository at this point in the history
  • Loading branch information
omphalos committed Aug 2, 2012
1 parent 25c0b1e commit f140b54
Show file tree
Hide file tree
Showing 4 changed files with 177 additions and 45 deletions.
61 changes: 28 additions & 33 deletions README.markdown
Original file line number Diff line number Diff line change
@@ -1,59 +1,54 @@
Basic file server supporting create, read, update, &a delete
Webservice to wrap any web resource in a header and footer. Good for wrapping javascript files in require calls.

Example: use uglify-js in the browser
==================

This package exposes a directory to create, read, update, delete operations.

Command-line usage
==================

crud-file-server [options]
wrapit [options]

This starts a file server using the specified command-line options.
This starts a wrapit web service using the specified command-line options.

-f: file system path to expose over http
-p: port to listen on (example, 85)
-q: suppress the help message


Server-Side Usage
Web service usage
=================

require('http-proxy').createServer(function (req, res, proxy) {
require('subproxy').handleRequest(subProxyHost, port, req, res, proxy);
}).listen(port);

Supported operations
====================

**GET** returns a file's contents with the correct mime type, or else the contents of a directory as a JSON array.
http://omphalos.wrapit.jit.su/**?url=**http://codemirror.net/lib/codemirror.js**&header=**provide('CodeMirror',function(require,exports,module){**&footer=**exports.CodeMirror=CodeMirror;})**&type=**text/javascript

**PUT** can be used to write a file.

**DELETE** can be used to delete a file or folder.

**POST** supports two operations, rename and create directory.
There are four parts to this, ?url &header &footer &type. Let's break that up:

http://omphalos.wrapit.jit.su/
**?url=**http://codemirror.net/lib/codemirror.js
**&header=**provide('CodeMirror',function(require,exports,module){
**&footer=**exports.CodeMirror=CodeMirror;})**&type=**text/javascript

In this case, the url is http://codemirror.net/lib/codemirror.js, which gets wrapped in a 'provide' definition using require-shim.

Of course, you can use whatever library you want. Also, you don't have to just wrap javascript files -- you can wrap css or html or anything else for that matter. **wrapit** doesn't care.

POST http://localhost/newDir?create=directory would create a directory named newDir.
Server-side usage
=================

POST http://localhost/abc.html?rename=def.html would rename abc.html to def.html.
require('http').createServer(function (req, res) {
require('wrapit').handleRequest(req, res);
}).listen(port);


Run the Example
===============

For further clarification, try running the example:

npm install crud-file-server

Navigate to the example directory (which should now be under node_modules/crud-file-server/example).

cd node_modules/crud-file-server/example

Run crud-file-server to host this directory.
There is an example.html file in the local directory, demonstrating how to run uglify-js in a web page without installing anything (even Node.js) on your local machine.

crud-file-server -p 3300
Now use your browser to navigate to http://localhost:3300/example.html.
You will see a simple client that lets you interact with your file system from the web browser.
Why might this be useful?
=========================

This utility is designed to help a web developer quickly prototype namespaced javascript code, but there are probably other uses as well.



Expand Down
25 changes: 24 additions & 1 deletion bin/wrapit
Original file line number Diff line number Diff line change
@@ -1,3 +1,26 @@
#!/usr/bin/env node

var argv = require('optimist').argv;
var server = require('../wrapit');

if(!argv.q) {
console.log('usage:');
console.log(' wrapit [options]');
console.log('');
console.log('this starts a wrapit web service using the specified command-line options');
console.log('');
console.log('options:');
console.log('');
console.log(' -p port to listen on (example, 80)');
console.log(' -q suppress this message');
console.log('');
}

var port = argv.p || 80;

require('http').createServer(function (req, res) {
require('../wrapit').handleRequest(req, res);
}).listen(81);
}).listen(port);

console.log('listening on port ' + port);

101 changes: 101 additions & 0 deletions example.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<!-- IE has problems if go to github directly, but is happy when we use wrapit instead -->
<script src="http://omphalos.wrapit.jit.su/?url=https://raw.github.com/omphalos/require-shim/master/require-shim.js" ></script>

<!-- four parts to the query string:
wrapit url: <script src="http://omphalos.wrapit.jit.su/
file header: ?header= provide('uglify-js/uglify-js', function(require, exports, module){
url to wrap: &url= https://raw.github.com/mishoo/UglifyJS/master/uglify-js.js
file footer: &footer= });"></script>
-->

<!-- reference to uglify-js/lib/consolidator -->
<script src="http://omphalos.wrapit.jit.su/
?header= provide('uglify-js/lib/consolidator', function(require, exports, module){
&url= https://raw.github.com/mishoo/UglifyJS/master/lib/consolidator.js
&footer= });">
</script>

<!-- reference to uglify-js/lib/parse-js -->
<script src="http://omphalos.wrapit.jit.su/
?header= provide('uglify-js/lib/parse-js', function(require, exports, module){
&url= https://raw.github.com/mishoo/UglifyJS/master/lib/parse-js.js
&footer= });">
</script>

<!-- reference to uglify-js/lib/process -->
<script src="http://omphalos.wrapit.jit.su/
?header= provide('uglify-js/lib/process', function(require, exports, module){
&url= https://raw.github.com/mishoo/UglifyJS/master/lib/process.js
&footer= });">
</script>

<!-- reference to uglify-js/lib/squeeze-more -->
<script src="http://omphalos.wrapit.jit.su/
?header= provide('uglify-js/lib/squeeze-more',function(require, exports, module){
&url= https://raw.github.com/mishoo/UglifyJS/master/lib/squeeze-more.js
&footer= });">
</script>

<!-- include uglify-js/uglify-js -->
<script src="http://omphalos.wrapit.jit.su/
?header= provide('uglify-js/uglify-js', function(require, exports, module){
&url= https://raw.github.com/mishoo/UglifyJS/master/uglify-js.js
&footer= });">
</script>

<!-- map uglify-js/uglify-js to uglify-js so we can just call require('uglify-js') instead of require('uglify-js/uglify-js') -->
<script type="text/javascript">
provide('uglify-js', function(require, exports, module) {
module.exports = require('uglify-js/uglify-js');
});
</script>
<body>
</body>
<h3>Demo of running a Node.js module (<a href="https://github.com/mishoo/UglifyJS/">uglify-js</a>) from the browser</h3>
<p><strong>Step #1.</strong> Put some javascript here:</p>
<textarea id="in" cols="80" rows="20" style="width:100%;" >
$('input').click(function() {
try {
var js = $('#in').val(); // grab the user's javascript

// this code is adapted from uglify-js's homepage
var uglify = require('uglify-js');
var parser = uglify.parser;
var ast = parser.parse(js);
var pro = uglify.uglify;
ast = pro.ast_mangle(ast);
ast = pro.ast_squeeze(ast);
var finalCode = pro.gen_code(ast);

// give the ugly version to the user
$('#main').html(finalCode);
} catch(err) {
$('#main').html('error: ' + err);
}
});</textarea>
<span><strong>Step #2.</strong></span>
<input type="button" id="btn" value="Click to uglify" />
<p id="main" />
<script type="text/javascript" >
$('input').click(function() {
try {
var uglify = require('uglify-js');
var parser = uglify.parser;
var js = $('#in').val();
var ast = parser.parse(js);
var pro = uglify.uglify;
ast = pro.ast_mangle(ast);
ast = pro.ast_squeeze(ast);
var finalCode = pro.gen_code(ast);
$('#main').html(finalCode);
} catch(err) {
$('#main').html('error: ' + err);
}
});
</script>
</html>
35 changes: 24 additions & 11 deletions wrapit.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,29 +3,42 @@ var request = require('request');
var fs = require('fs');

var reportError = function(res, err) {
res.statusCode = 500;
res.setHeader('Content-Type', 'application/json');
res.end(JSON.stringify(err));
console.dir(err);
try {
res.statusCode = 500;
res.setHeader('Content-Type', 'application/json');
res.end(JSON.stringify(err));
} catch(err2) {
console.log(err2);
}
};

exports.handleRequest = function(req, res, proxy) {
var url = require('url').parse(req.url);
var url = require('url').parse(req.url);
var query = require('querystring').parse(url.query);
query.url = query.url || query.u;
query.footer = query.footer || query.f;
query.header = query.header || query.h;
query.type = query.type || query.t;
if(query.url) {
query.url = query.url || query.u; // pass ?url= or ?u=
query.footer = query.footer || query.f; // pass &footer= or &f=
query.header = query.header || query.h; // pass &header= or &h=
query.type = query.type || query.t; // pass &type= or &t=
if(query.url) {
// if ?url is supplied, wrap a url
console.log(query);
request(query.url, function(err, remoteRes, body) {
if(err) {
console.dir(err);
reportError(res, err);
} else {
// &type= sets the mime type, e.g., &type=text/javascript
if(query.type) { res.setHeader('Content-Type', query.type); }

// &header= sets the header, e.g., &header=provide('uglify-js', function(require, exports,module) {
if(query.header) { res.write(query.header + '\r\n'); }
res.write(body);

// write the body (which we got from url)
res.write(body);

// &footer= sets the footer, e.g., &footer=});
if(query.footer) { res.write('\r\n' + query.footer); }

res.end();
}
});
Expand Down

0 comments on commit f140b54

Please sign in to comment.