Skip to content

Commit ae175d7

Browse files
kopporkoppor
committedDec 5, 2013
Converts render.js to an AMD-aware module "restdoc-render.js"
 * renames render.js to restdoc-render.js
·
v1.0
1 parent fcc3d90 commit ae175d7

6 files changed

+153
-6
lines changed
 

‎README.md

+14-1
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,24 @@
11
restdoc-renderer
22
================
33

4-
Renderer for RestDoc specifications
4+
Renderer for RestDoc specifications.
5+
6+
Can be loaded as [requirejs] module with the name `restdoc-render`.
7+
8+
Example files
9+
-------------
10+
* [restdoc.html](restdoc.html) - basic HTML output
11+
* [restdoc-AMD.html](restdoc-AMD.html) - basic HTML output (AMD version)
12+
* [richrestdoc.html](richrestdoc.html) - HTML output with a TOC on the left side
13+
* [richrestdoc-AMD.html](richrestdoc-AMD.html) - HTML output with a TOC on the left side (AMD version)
14+
15+
The files locally work in Firefox only as Chrome does not load files using the `file://` url.
16+
See http://stackoverflow.com/a/13262673/873282 for a possible solution.
517

618
License
719
-------
820

921
Licensed under [Apache License, Version 2.0]
1022

1123
[Apache License, Version 2.0]: http://www.apache.org/licenses/LICENSE-2.0.html
24+
[requirejs]: http://requirejs.org/

‎js/restdoc-render.js

+21
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,18 @@
1414
limitations under the License.
1515
*/
1616

17+
// AMD and non-AMD compatiblitiy insired by http://tkareine.org/blog/2012/08/11/why-javascript-needs-module-definitions/ and https://github.com/blueimp/jQuery-File-Upload/blob/9.5.0/js/jquery.fileupload.js
18+
(function(factory) {
19+
if (typeof define === 'function' && define.amd) {
20+
// Register as named AMD module. Anonymous registering causes "Mismatched anonymous define() module" in requirejs 2.9.1 when script is loaded explicitly and then loaded with requirejs
21+
define("restdoc-render", ['jquery'], factory);
22+
} else {
23+
// traditional browser loading: build restdoc-renderer object "renderer" without dependencies and inject it into window object
24+
window.renderer = factory(window.jQuery);
25+
}
26+
}(function($) {
27+
'use strict';
28+
1729
var schemasByURI = {};
1830

1931
function createSchemaList(restdoc, appendElement) {
@@ -358,3 +370,12 @@ function render(file, cbBefore, contentElement, cbAfter, type) {
358370
"dataType": "json"
359371
});
360372
}
373+
374+
var module = {
375+
render: render,
376+
createSchemaList: createSchemaList,
377+
createResourceList: createResourceList,
378+
createParamList: createParamList
379+
}
380+
return module;
381+
}));

‎restdoc-AMD.html

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet">
7+
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" rel="stylesheet">
8+
<script src="http://requirejs.org/docs/release/2.1.9/minified/require.js"></script>
9+
<script>
10+
require.config({
11+
baseUrl: "js",
12+
paths: {
13+
"jquery": "http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min"
14+
}
15+
});
16+
</script>
17+
<title>RestDoc Rendering Demo (AMD version)</title>
18+
</head>
19+
<body>
20+
<div id="rendered">
21+
<h1>loading ...</h1>
22+
</div>
23+
24+
<script type="text/javascript">
25+
require(["restdoc-render", "jquery"], function(renderer, $) {
26+
renderer.render("test.json", undefined, $("#rendered"), undefined, "GET");
27+
});
28+
</script>
29+
</body>
30+
</html>
31+

‎restdoc.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ <h1>loading ...</h1>
1919
<script src="js/restdoc-render.js" type="text/javascript"></script>
2020
<script type="text/javascript">
2121
$(function() {
22-
render("test.json", undefined, $("#rendered"), undefined, "GET");
22+
renderer.render("test.json", undefined, $("#rendered"), undefined, "GET");
2323
});
2424
</script>
2525
</body>

‎richrestdoc-AMD.html

+82
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet">
7+
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" rel="stylesheet">
8+
<script src="http://requirejs.org/docs/release/2.1.9/minified/require.js"></script>
9+
<script>
10+
require.config({
11+
baseUrl: "js",
12+
paths: {
13+
"jquery": "http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min",
14+
"bootstrap": "http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap",
15+
"bootstrap-collapse": "http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap-collapse",
16+
"mustache": "http://cdnjs.cloudflare.com/ajax/libs/mustache.js/0.7.2/mustache.min"
17+
},
18+
// make bootstrap requirejs compatible
19+
shim: {
20+
'bootstrap' : ['jquery'],
21+
'bootstrap-collapse' : ['bootstrap', 'jquery']
22+
}
23+
});
24+
</script>
25+
<title>RestDoc Rich Rendering Demo (AMD version)</title>
26+
</head>
27+
<body>
28+
<div class="navbar navbar-fixed-bottom">
29+
<div class="navbar-inner">
30+
<ul class="nav pull-right">
31+
<li><a href="#schemas-anchor">Schemas</a></li>
32+
<li><a href="#headers-anchor">Headers</a></li>
33+
<li><a href="#resources-anchor">Resources</a></li>
34+
<li><a href="#params-anchor">Params</a></li>
35+
<li><a href="#oauth2-anchor">Oauth2</a></li>
36+
</ul>
37+
</div>
38+
</div>
39+
40+
<div class="container-fluid">
41+
<div class="row-fluid">
42+
<div class="span12"><h1>Project name</h1></div>
43+
</div>
44+
<div class="row-fluid">
45+
<div class="span3">
46+
<div class="well sidebar-nav">
47+
<ul class="nav nav-list">
48+
<li class="nav-header" id="schemaList">Schemas</li>
49+
<li class="nav-header">Headers</li>
50+
<li><a href="#headers-request-anchor" id="headerRequestList">Request</a></li>
51+
<li><a href="#headers-response-anchor" id="headerResponseList">Response</a></li>
52+
<li class="nav-header" id="resourceList">Resources</li>
53+
<li class="nav-header" id="paramList">Params</li>
54+
<li class="nav-header"><a href="#oauth2-anchor">Oauth2</a></li>
55+
</ul>
56+
</div>
57+
</div>
58+
<div class="span9">
59+
<div class="row-fluid" id="rendered">
60+
<h1>loading ...</h1>
61+
</div>
62+
</div>
63+
</div>
64+
<hr>
65+
<footer>
66+
<p>&copy; Company 2013</p>
67+
</footer>
68+
</div>
69+
70+
<script type="text/javascript">
71+
// "bootstrap", "bootstrap-collapse", and "mustache" have to be loaded additionally to enable advanced functionality of the renderer
72+
require(["restdoc-render", "bootstrap", "bootstrap-collapse", "mustache"], function(renderer) {
73+
renderer.render("test.json", undefined, $("#rendered"), function(restdoc) {
74+
renderer.createSchemaList(restdoc, $("#schemaList"));
75+
renderer.createResourceList(restdoc, $("#resourceList"));
76+
renderer.createParamList(restdoc, $("#paramList"));
77+
}, "GET");
78+
});
79+
</script>
80+
</body>
81+
</html>
82+

‎richrestdoc.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -58,10 +58,10 @@ <h1>loading ...</h1>
5858
<script src="js/restdoc-render.js" type="text/javascript"></script>
5959
<script type="text/javascript">
6060
$(function() {
61-
render("test.json", undefined, $("#rendered"), function(restdoc) {
62-
createSchemaList(restdoc, $("#schemaList"));
63-
createResourceList(restdoc, $("#resourceList"));
64-
createParamList(restdoc, $("#paramList"));
61+
renderer.render("test.json", undefined, $("#rendered"), function(restdoc) {
62+
renderer.createSchemaList(restdoc, $("#schemaList"));
63+
renderer.createResourceList(restdoc, $("#resourceList"));
64+
renderer.createParamList(restdoc, $("#paramList"));
6565
}, "GET");
6666
});
6767
</script>

0 commit comments

Comments
 (0)
Please sign in to comment.