Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
86 lines (77 sloc) 3.33 KB
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>webpipe.js</title>
<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet">
<meta name="viewport" content="width=device-width,initial-scale=1">
<style type="text/css">
body {
padding: 20px;
}
pre {
margin-top: 10px;
}
</style>
</head>
<body>
<h1>webpipe.js</h1>
<h4>JavaScript library for interacting with WebPipes.</h4>
<p>WebPipes are tiny HTTP programs that do one thing and do it well. They fill in the gaps. Need a proxy? Need to convert Markdown to HTML? Give a WebPipe some input, and it'll give you some output. They're a handy tool to have in your arsenal.</p>
<p><a href="http://www.webpipes.org/">Learn more at webpipes.org &rarr;</a></p>
<h2>Usage Example</h2>
<p>WebPipe.js exposes two methods: <code>webpipe.options()</code> and <code>webpipe.execute()</code>.</p>
<p>Click run below each example to see the result. Edit the code and test it again.</p>
<h3>webpipe.options(url, callback)</h3>
<p>This is a convenience function that returns the JSON descriptor for the WebPipe in question.</p>
<pre id="options-input" contenteditable>var blockURL = "http://block-parse-markdown.herokuapp.com/";
webpipe.options(blockURL, function (err, data) {
if (err) {
console.log("Error: ", err);
} else {
// Prints the webpipe.json config for the Parse Markdown webpipe.
console.log(data);
}
});</pre>
<div><button id="options-button" class="btn btn-inverse btn-small">Run</button></div>
<pre id="options-output"></pre>
<h3>webpipe.execute(url, inputs, callback)</h3>
<p>The real workhorse is <code>webpipe.execute()</code>. This handles the dirty work of executing a WebPipe.</p>
<pre id="execute-input" contenteditable>var blockURL = "http://block-parse-markdown.herokuapp.com/";
webpipe.execute(blockURL, { markdown: "*hello world*" }, function (err, data) {
if (err) {
console.log("Error: ", err);
} else {
// Prints the outputs of the WebPipe.
console.log(data);
}
});</pre>
<div><button id="execute-button" class="btn btn-inverse btn-small">Run</button></div>
<pre id="execute-output"></pre>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
<script src="../../lib/webpipe.js"></script>
<script>
function initExample(name) {
$("#"+name+"-button").click(function() {
$("#"+name+"-output").text("");
try {
fn = new Function("console", $("#"+name+"-input").text());
fn({ log: function(arg) {
for (var i = 0; i < arguments.length; i++) {
var string = typeof arguments[i] === "string" ? arguments[i] : JSON.stringify(arguments[i], null, 2);
$("#"+name+"-output").text($("#"+name+"-output").text() + string);
}
}});
} catch (e) {
alert(e);
}
});
}
$(function() {
initExample("options");
initExample("execute");
});
</script>
</body>
</html>