updated version to alpha tag

Show response for 20x as default if response 200 is not present

Cakefile

@@ -1,6 +1,8 @@
 fs          = require 'fs'
 path        = require 'path'
 {exec}      = require 'child_process'
+less        = require 'less'
+handlebars  = require 'handlebars'
 
 sourceFiles  = [
   'SwaggerUi'
@@ -40,18 +42,17 @@ task 'dist', 'Build a distribution', ->
     templateContents = new Array remaining = templateFiles.length
     for file, index in templateFiles then do (file, index) ->
       console.log "   : Compiling src/main/template/#{file}"
-      exec "handlebars src/main/template/#{file} -f dist/_#{file}.js", (err, stdout, stderr) ->
+      fs.readFile "src/main/template/#{file}", 'utf8', (err, source) ->
         throw err if err
-        fs.readFile 'dist/_' + file + '.js', 'utf8', (err, fileContents) ->
-          throw err if err
-          templateContents[index] = fileContents
-          fs.unlink 'dist/_' + file + '.js'
-          if --remaining is 0
-            templateContents.push '\n\n'
-            fs.writeFile 'dist/_swagger-ui-templates.js', templateContents.join('\n\n'), 'utf8', (err) ->
-              throw err if err
-              build()
-
+        compiled = handlebars.precompile(source)
+        templateContents[index] = '(function() {\n  var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};\ntemplates[\'' + file.replace('.handlebars', '') + '\'] = template(' + compiled + ');\n})();'
+        fs.unlink 'dist/_' + file + '.js', (err) ->
+          console.log "#{err.code}: #{err.path}" unless err.code == 'ENOENT'
+        if --remaining is 0
+          templateContents.push '\n\n'
+          fs.writeFile 'dist/_swagger-ui-templates.js', templateContents.join('\n\n'), 'utf8', (err) ->
+            throw err if err
+            build()
 
   build = ->
     console.log '   : Collecting Coffeescript source...'
@@ -64,20 +65,38 @@ task 'dist', 'Build a distribution', ->
         throw err if err
         fs.unlink 'dist/_swagger-ui.coffee'
         console.log '   : Combining with javascript...'
-        exec 'cat src/main/javascript/doc.js dist/_swagger-ui-templates.js dist/_swagger-ui.js > dist/swagger-ui.js', (err, stdout, stderr) ->
-          throw err if err
-          fs.unlink 'dist/_swagger-ui.js'
-          fs.unlink 'dist/_swagger-ui-templates.js'
-          console.log '   : Minifying all...'
-          exec 'java -jar "./bin/yuicompressor-2.4.7.jar" --type js -o ' + 'dist/swagger-ui.min.js ' + 'dist/swagger-ui.js', (err, stdout, stderr) ->
+
+        fs.readFile 'package.json', 'utf8', (err, fileContents) ->
+          obj = JSON.parse(fileContents)
+          exec 'echo "// swagger-ui.js" > dist/swagger-ui.js'
+          exec 'echo "// version ' + obj.version + '" >> dist/swagger-ui.js'
+          exec 'cat src/main/javascript/doc.js dist/_swagger-ui-templates.js dist/_swagger-ui.js >> dist/swagger-ui.js', (err, stdout, stderr) ->
             throw err if err
-            pack()
+            fs.unlink 'dist/_swagger-ui.js'
+            fs.unlink 'dist/_swagger-ui-templates.js'
+            console.log '   : Minifying all...'
+            exec 'java -jar "./bin/yuicompressor-2.4.7.jar" --type js -o ' + 'dist/swagger-ui.min.js ' + 'dist/swagger-ui.js', (err, stdout, stderr) ->
+              throw err if err
+              lessc()
+
+  lessc = ->
+    # Someone who knows CoffeeScript should make this more Coffee-licious
+    console.log '   : Compiling LESS...'
+
+    less.render fs.readFileSync("src/main/less/screen.less", 'utf8'), (err, css) ->
+      fs.writeFileSync("src/main/html/css/screen.css", css)
+    less.render fs.readFileSync("src/main/less/reset.less", 'utf8'), (err, css) ->
+      fs.writeFileSync("src/main/html/css/reset.css", css)
+    pack()
 
   pack = ->
     console.log '   : Packaging...'
     exec 'cp -r lib dist'
+    console.log '   : Copied swagger-ui libs'
     exec 'cp -r node_modules/swagger-client/lib/swagger.js dist/lib'
+    console.log '   : Copied swagger dependencies'
     exec 'cp -r src/main/html/* dist'
+    console.log '   : Copied html dependencies'
     console.log '   !'
 
 task 'spec', "Run the test suite", ->
@@ -107,6 +126,7 @@ task 'watch', 'Watch source files for changes and autocompile', ->
   watchFiles("src/main/template")
   watchFiles("src/main/javascript")
   watchFiles("src/main/html")
+  watchFiles("src/main/less")
   watchFiles("src/test")
 
 notify = (message) ->
@@ -115,4 +135,4 @@ notify = (message) ->
 #  options =
 #    title: 'CoffeeScript'
 #    image: 'bin/CoffeeScript.png'
-#  try require('growl') message, options
+#  try require('growl') message, options

LICENSE

@@ -0,0 +1,11 @@
+Copyright 2014 Reverb Technologies, Inc.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at [apache.org/licenses/LICENSE-2.0](http://www.apache.org/licenses/LICENSE-2.0)
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

README.md

@@ -1,13 +1,30 @@
-Swagger UI
-==========
+# Swagger UI
 
-Swagger UI is part of [Swagger](http://swagger.wordnik.com/) project.  The Swagger project allows you to produce, visualize and consume your OWN RESTful services.  No proxy or 3rd party services required.  Do it your own way.
+
+Swagger UI is part of Swagger project.  The Swagger project allows you to produce, visualize and consume your OWN RESTful services.  No proxy or 3rd party services required.  Do it your own way.
 
 Swagger UI is a dependency-free collection of HTML, Javascript, and CSS assets that dynamically
-generate beautiful documentation and sandbox from a [Swagger-compliant](https://github.com/wordnik/swagger-core/wiki) API. Because Swagger UI has no dependencies, you can host it in any server environment, or on your local machine.
+generate beautiful documentation and sandbox from a Swagger-compliant API. Because Swagger UI has no dependencies, you can host it in any server environment, or on your local machine.
 
-How to Use It
--------------
+## What's Swagger?
+
+The goal of Swagger™ is to define a standard, language-agnostic interface to REST APIs which allows both humans and computers to discover and understand the capabilities of the service without access to source code, documentation, or through network traffic inspection. When properly defined via Swagger, a consumer can understand and interact with the remote service with a minimal amount of implementation logic. Similar to what interfaces have done for lower-level programming, Swagger removes the guesswork in calling the service.
+
+
+Check out [Swagger-Spec](https://github.com/wordnik/swagger-spec) for additional information about the Swagger project, including additional libraries with support for other languages and more. 
+
+
+## Compatability
+The Swagger Specification has undergone 3 revisions since initial creation in 2010.  The swagger-ui project has the following compatibilies with the swagger specification:
+
+Swagger UI Version | Release Date | Swagger Spec compatability | Notes | Status
+------------------ | ------------ | -------------------------- | ----- | ------
+2.0.25 (in development)  | n/a          | 1.1, 1.2, 2.0 | [master](https://github.com/wordnik/swagger-ui/tree/master) | [Issues](https://github.com/wordnik/swagger-ui/milestones/v2.1.0)
+2.0.24             | 2014-09-12   | 1.1, 1.2 | [tag v2.0.24](https://github.com/wordnik/swagger-ui/tree/v2.0.24) | 
+1.0.13             | 2013-03-08   | 1.1, 1.2 | [tag v1.0.13](https://github.com/wordnik/swagger-ui/tree/v1.0.13) |
+1.0.1              | 2011-10-11   | 1.0, 1.1 | [tag v1.0.1](https://github.com/wordnik/swagger-ui/tree/v1.0.1)   |
+
+## How to Use It
 
 ### Download
 You can use the swagger-ui code AS-IS!  No need to build or recompile--just clone this repo and use the pre-built files in the `dist` folder.  If you like swagger-ui as-is, stop here.
@@ -52,8 +69,10 @@ To use swagger-ui you should take a look at the [source of swagger-ui html page]
 * *dom_id parameter* is the the id of a dom element inside which SwaggerUi will put the user interface for swagger
 * *booleanValues* SwaggerUI renders boolean data types as a dropdown. By default it provides a 'true' and 'false' string as the possible choices. You can use this parameter to change the values in dropdown to be something else, for example 0 and 1 by setting booleanValues to new Array(0, 1)
 * *docExpansion* controls how the API listing is displayed. It can be set to 'none' (default), 'list' (shows operations for each resource), or 'full' (fully expanded: shows operations and their details)
+* *sorter* apply a sort to the API list. It can be 'alpha' (sort paths alphanumerically) or 'method' (sort operations by HTTP method). Default is the order returned by the server unchanged.
 * *onComplete* is a callback function parameter which can be passed to be notified of when SwaggerUI has completed rendering successfully.
 * *onFailure* is a callback function parameter which can be passed to be notified of when SwaggerUI encountered a failure was unable to render.
+* *highlightSizeThreshold* any size response below this threshold will be highlighted syntactically, attempting to highlight large responses can lead to browser hangs, not including a threshold will default to highlight all returned responses
 * All other parameters are explained in greater detail below
 
 
@@ -85,15 +104,15 @@ window.authorizations.add("key", new ApiKeyAuthorization("Authorization", "XXXX"
 
 Note!  You can pass multiple header params on a single request, just use unique names for them (`key` is used in the above example).
 
-How to Improve It
------------------
+## How to Improve It
 
 Create your own fork of [wordnik/swagger-ui](https://github.com/wordnik/swagger-ui)
 
 To share your changes, [submit a pull request](https://github.com/wordnik/swagger-ui/pull/new/master).
 
-License
--------
+Since the javascript files are compiled from coffeescript, please submit changes in the *.coffee files!  We have to reject changes only in the .js files as they will be lost on each build of the ui.
+
+## License
 
 Copyright 2011-2013 Wordnik, Inc.
 

dist/css/reset.css

@@ -0,0 +1,125 @@
+/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+body {
+  line-height: 1;
+}
+ol,
+ul {
+  list-style: none;
+}
+blockquote,
+q {
+  quotes: none;
+}
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+  content: '';
+  content: none;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}

dist/index.html

@@ -3,9 +3,11 @@
 <head>
   <title>Swagger UI</title>
   <link href='//fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'/>
-  <link href='css/highlight.default.css' media='screen' rel='stylesheet' type='text/css'/>
+  <link href='css/reset.css' media='screen' rel='stylesheet' type='text/css'/>
   <link href='css/screen.css' media='screen' rel='stylesheet' type='text/css'/>
-  <script type="text/javascript" src="lib/shred.bundle.js" /></script>  
+  <link href='css/reset.css' media='print' rel='stylesheet' type='text/css'/>
+  <link href='css/screen.css' media='print' rel='stylesheet' type='text/css'/>
+  <script type="text/javascript" src="lib/shred.bundle.js"></script>
   <script src='lib/jquery-1.8.0.min.js' type='text/javascript'></script>
   <script src='lib/jquery.slideto.min.js' type='text/javascript'></script>
   <script src='lib/jquery.wiggle.min.js' type='text/javascript'></script>
@@ -14,48 +16,75 @@
   <script src='lib/underscore-min.js' type='text/javascript'></script>
   <script src='lib/backbone-min.js' type='text/javascript'></script>
   <script src='lib/swagger.js' type='text/javascript'></script>
+  <script src='lib/swagger-client.js' type='text/javascript'></script>
   <script src='swagger-ui.js' type='text/javascript'></script>
   <script src='lib/highlight.7.3.pack.js' type='text/javascript'></script>
+
+  <!-- enabling this will enable oauth2 implicit scope support -->
+  <script src='lib/swagger-oauth.js' type='text/javascript'></script>
   <script type="text/javascript">
     $(function () {
-      window.swaggerUi = new SwaggerUi({
-      url: "http://petstore.swagger.wordnik.com/api/api-docs",
-      dom_id: "swagger-ui-container",
-      supportedSubmitMethods: ['get', 'post', 'put', 'delete'],
-      onComplete: function(swaggerApi, swaggerUi){
-        if(console) {
-          console.log("Loaded SwaggerUI")
-        }
-        $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
-      },
-      onFailure: function(data) {
-        if(console) {
-          console.log("Unable to Load SwaggerUI");
-          console.log(data);
-        }
-      },
-      docExpansion: "none"
-    });
-
-    $('#input_apiKey').change(function() {
-      var key = $('#input_apiKey')[0].value;
-      console.log("key: " + key);
-      if(key && key.trim() != "") {
-        console.log("added key " + key);
-        window.authorizations.add("key", new ApiKeyAuthorization("api_key", key, "query"));
+      var url = window.location.search.match(/url=([^&]+)/);
+      if (url && url.length > 1) {
+        url = url[1];
+      } else {
+        url = "http://petstore.swagger.wordnik.com/v2/swagger.json";
       }
-    })
-    window.swaggerUi.load();
-  });
+      window.swaggerUi = new SwaggerUi({
+        url: url,
+        dom_id: "swagger-ui-container",
+        supportedSubmitMethods: ['get', 'post', 'put', 'delete'],
+        onComplete: function(swaggerApi, swaggerUi){
+          log("Loaded SwaggerUI");
+          if(typeof initOAuth == "function") {
+            /*
+            initOAuth({
+              clientId: "your-client-id",
+              realm: "your-realms",
+              appName: "your-app-name"
+            });
+            */
+          }
+          $('pre code').each(function(i, e) {
+            hljs.highlightBlock(e)
+          });
+        },
+        onFailure: function(data) {
+          log("Unable to Load SwaggerUI");
+        },
+        docExpansion: "none",
+        sorter : "alpha"
+      });
 
+      function addApiKeyAuthorization() {
+        var key = $('#input_apiKey')[0].value;
+        log("key: " + key);
+        if(key && key.trim() != "") {
+            log("added key " + key);
+            window.authorizations.add("api_key", new ApiKeyAuthorization("api_key", key, "query"));
+        }
+      }
+
+      $('#input_apiKey').change(function() {
+        addApiKeyAuthorization();
+      });
+
+      // if you have an apiKey you would like to pre-populate on the page for demonstration purposes...
+      /*
+        var apiKey = "myApiKeyXXXX123456789";
+        $('#input_apiKey').val(apiKey);
+        addApiKeyAuthorization();
+      */
+
+      window.swaggerUi.load();
+  });
   </script>
 </head>
 
-<body>
+<body class="swagger-section">
 <div id='header'>
   <div class="swagger-ui-wrap">
     <a id="logo" href="http://swagger.wordnik.com">swagger</a>
-
     <form id='api_selector'>
       <div class='input icon-btn'>
         <img id="show-pet-store-icon" src="images/pet_store_api.png" title="Show Swagger Petstore Example Apis">
@@ -70,14 +99,7 @@
   </div>
 </div>
 
-<div id="message-bar" class="swagger-ui-wrap">
-  &nbsp;
-</div>
-
-<div id="swagger-ui-container" class="swagger-ui-wrap">
-
-</div>
-
+<div id="message-bar" class="swagger-ui-wrap">&nbsp;</div>
+<div id="swagger-ui-container" class="swagger-ui-wrap"></div>
 </body>
-
 </html>

dist/lib/swagger-oauth.js

@@ -0,0 +1,211 @@
+var appName;
+var popupMask;
+var popupDialog;
+var clientId;
+var realm;
+
+function handleLogin() {
+  var scopes = [];
+
+  if(window.swaggerUi.api.authSchemes 
+    && window.swaggerUi.api.authSchemes.oauth2
+    && window.swaggerUi.api.authSchemes.oauth2.scopes) {
+    scopes = window.swaggerUi.api.authSchemes.oauth2.scopes;
+  }
+
+  if(window.swaggerUi.api
+    && window.swaggerUi.api.info) {
+    appName = window.swaggerUi.api.info.title;
+  }
+
+  if(popupDialog.length > 0)
+    popupDialog = popupDialog.last();
+  else {
+    popupDialog = $(
+      [
+        '<div class="api-popup-dialog">',
+        '<div class="api-popup-title">Select OAuth2.0 Scopes</div>',
+        '<div class="api-popup-content">',
+          '<p>Scopes are used to grant an application different levels of access to data on behalf of the end user. Each API may declare one or more scopes.',
+            '<a href="#">Learn how to use</a>',
+          '</p>',
+          '<p><strong>' + appName + '</strong> API requires the following scopes. Select which ones you want to grant to Swagger UI.</p>',
+          '<ul class="api-popup-scopes">',
+          '</ul>',
+          '<p class="error-msg"></p>',
+          '<div class="api-popup-actions"><button class="api-popup-authbtn api-button green" type="button">Authorize</button><button class="api-popup-cancel api-button gray" type="button">Cancel</button></div>',
+        '</div>',
+        '</div>'].join(''));
+    $(document.body).append(popupDialog);
+
+    popup = popupDialog.find('ul.api-popup-scopes').empty();
+    for (i = 0; i < scopes.length; i ++) {
+      scope = scopes[i];
+      str = '<li><input type="checkbox" id="scope_' + i + '" scope="' + scope.scope + '"/>' + '<label for="scope_' + i + '">' + scope.scope;
+      if (scope.description) {
+        str += '<br/><span class="api-scope-desc">' + scope.description + '</span>';
+      }
+      str += '</label></li>';
+      popup.append(str);
+    }
+  }
+
+  var $win = $(window),
+    dw = $win.width(),
+    dh = $win.height(),
+    st = $win.scrollTop(),
+    dlgWd = popupDialog.outerWidth(),
+    dlgHt = popupDialog.outerHeight(),
+    top = (dh -dlgHt)/2 + st,
+    left = (dw - dlgWd)/2;
+
+  popupDialog.css({
+    top: (top < 0? 0 : top) + 'px',
+    left: (left < 0? 0 : left) + 'px'
+  });
+
+  popupDialog.find('button.api-popup-cancel').click(function() {
+    popupMask.hide();
+    popupDialog.hide();
+  });
+  popupDialog.find('button.api-popup-authbtn').click(function() {
+    popupMask.hide();
+    popupDialog.hide();
+
+    var authSchemes = window.swaggerUi.api.authSchemes;
+    var host = window.location;
+    var pathname = location.pathname.substring(0, location.pathname.lastIndexOf("/"));
+    var redirectUrl = host.protocol + '//' + host.host + pathname + "/o2c.html";
+    var url = null;
+
+    for (var key in authSchemes) {
+      if (authSchemes.hasOwnProperty(key)) {
+        var o = authSchemes[key].grantTypes;
+        for(var t in o) {
+          if(o.hasOwnProperty(t) && t === 'implicit') {
+            var dets = o[t];
+            url = dets.loginEndpoint.url + "?response_type=token";
+            window.swaggerUi.tokenName = dets.tokenName;
+          }
+        }
+      }
+    }
+    var scopes = []
+    var o = $('.api-popup-scopes').find('input:checked');
+
+    for(k =0; k < o.length; k++) {
+      scopes.push($(o[k]).attr("scope"));
+    }
+
+    window.enabledScopes=scopes;
+
+    url += '&redirect_uri=' + encodeURIComponent(redirectUrl);
+    url += '&realm=' + encodeURIComponent(realm);
+    url += '&client_id=' + encodeURIComponent(clientId);
+    url += '&scope=' + encodeURIComponent(scopes);
+
+    window.open(url);
+  });
+
+  popupMask.show();
+  popupDialog.show();
+  return;
+}
+
+
+function handleLogout() {
+  for(key in window.authorizations.authz){
+    window.authorizations.remove(key)
+  }
+  window.enabledScopes = null;
+  $('.api-ic.ic-on').addClass('ic-off');
+  $('.api-ic.ic-on').removeClass('ic-on');
+
+  // set the info box
+  $('.api-ic.ic-warning').addClass('ic-error');
+  $('.api-ic.ic-warning').removeClass('ic-warning');
+}
+
+function initOAuth(opts) {
+  var o = (opts||{});
+  var errors = [];
+
+  appName = (o.appName||errors.push("missing appName"));
+  popupMask = (o.popupMask||$('#api-common-mask'));
+  popupDialog = (o.popupDialog||$('.api-popup-dialog'));
+  clientId = (o.clientId||errors.push("missing client id"));
+  realm = (o.realm||errors.push("missing realm"));
+
+  if(errors.length > 0){
+    log("auth unable initialize oauth: " + errors);
+    return;
+  }
+
+  $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
+  $('.api-ic').click(function(s) {
+    if($(s.target).hasClass('ic-off'))
+      handleLogin();
+    else {
+      handleLogout();
+    }
+    false;
+  });
+}
+
+function onOAuthComplete(token) {
+  if(token) {
+    if(token.error) {
+      var checkbox = $('input[type=checkbox],.secured')
+      checkbox.each(function(pos){
+        checkbox[pos].checked = false;
+      });
+      alert(token.error);
+    }
+    else {
+      var b = token[window.swaggerUi.tokenName];
+      if(b){
+        // if all roles are satisfied
+        var o = null;
+        $.each($('.auth #api_information_panel'), function(k, v) {
+          var children = v;
+          if(children && children.childNodes) {
+            var requiredScopes = [];
+            $.each((children.childNodes), function (k1, v1){
+              var inner = v1.innerHTML;
+              if(inner)
+                requiredScopes.push(inner);
+            });
+            var diff = [];
+            for(var i=0; i < requiredScopes.length; i++) {
+              var s = requiredScopes[i];
+              if(window.enabledScopes && window.enabledScopes.indexOf(s) == -1) {
+                diff.push(s);
+              }
+            }
+            if(diff.length > 0){
+              o = v.parentNode;
+              $(o.parentNode).find('.api-ic.ic-on').addClass('ic-off');
+              $(o.parentNode).find('.api-ic.ic-on').removeClass('ic-on');
+
+              // sorry, not all scopes are satisfied
+              $(o).find('.api-ic').addClass('ic-warning');
+              $(o).find('.api-ic').removeClass('ic-error');
+            }
+            else {
+              o = v.parentNode;
+              $(o.parentNode).find('.api-ic.ic-off').addClass('ic-on');
+              $(o.parentNode).find('.api-ic.ic-off').removeClass('ic-off');
+
+              // all scopes are satisfied
+              $(o).find('.api-ic').addClass('ic-info');
+              $(o).find('.api-ic').removeClass('ic-warning');
+              $(o).find('.api-ic').removeClass('ic-error');          
+            }
+          }
+        });
+
+        window.authorizations.add("oauth2", new ApiKeyAuthorization("Authorization", "Bearer " + b, "header"));
+      }
+    }
+  }
+}

dist/o2c.html

@@ -0,0 +1,15 @@
+<script>
+var qp = null;
+if(window.location.hash) {
+  qp = location.hash.substring(1);
+}
+else {
+  qp = location.search.substring(1);
+}
+qp = qp ? JSON.parse('{"' + qp.replace(/&/g, '","').replace(/=/g,'":"') + '"}',
+  function(key, value) {
+    return key===""?value:decodeURIComponent(value) }
+  ):{}
+window.opener.onOAuthComplete(qp);
+window.close();
+</script>

index.js

@@ -0,0 +1,7 @@
+var pack = require('./package');
+var path = require('path');
+
+module.exports = {
+    version: pack.version,
+    dist: path.resolve(__dirname, 'dist')
+};

lib/swagger-oauth.js

@@ -0,0 +1,211 @@
+var appName;
+var popupMask;
+var popupDialog;
+var clientId;
+var realm;
+
+function handleLogin() {
+  var scopes = [];
+
+  if(window.swaggerUi.api.authSchemes 
+    && window.swaggerUi.api.authSchemes.oauth2
+    && window.swaggerUi.api.authSchemes.oauth2.scopes) {
+    scopes = window.swaggerUi.api.authSchemes.oauth2.scopes;
+  }
+
+  if(window.swaggerUi.api
+    && window.swaggerUi.api.info) {
+    appName = window.swaggerUi.api.info.title;
+  }
+
+  if(popupDialog.length > 0)
+    popupDialog = popupDialog.last();
+  else {
+    popupDialog = $(
+      [
+        '<div class="api-popup-dialog">',
+        '<div class="api-popup-title">Select OAuth2.0 Scopes</div>',
+        '<div class="api-popup-content">',
+          '<p>Scopes are used to grant an application different levels of access to data on behalf of the end user. Each API may declare one or more scopes.',
+            '<a href="#">Learn how to use</a>',
+          '</p>',
+          '<p><strong>' + appName + '</strong> API requires the following scopes. Select which ones you want to grant to Swagger UI.</p>',
+          '<ul class="api-popup-scopes">',
+          '</ul>',
+          '<p class="error-msg"></p>',
+          '<div class="api-popup-actions"><button class="api-popup-authbtn api-button green" type="button">Authorize</button><button class="api-popup-cancel api-button gray" type="button">Cancel</button></div>',
+        '</div>',
+        '</div>'].join(''));
+    $(document.body).append(popupDialog);
+
+    popup = popupDialog.find('ul.api-popup-scopes').empty();
+    for (i = 0; i < scopes.length; i ++) {
+      scope = scopes[i];
+      str = '<li><input type="checkbox" id="scope_' + i + '" scope="' + scope.scope + '"/>' + '<label for="scope_' + i + '">' + scope.scope;
+      if (scope.description) {
+        str += '<br/><span class="api-scope-desc">' + scope.description + '</span>';
+      }
+      str += '</label></li>';
+      popup.append(str);
+    }
+  }
+
+  var $win = $(window),
+    dw = $win.width(),
+    dh = $win.height(),
+    st = $win.scrollTop(),
+    dlgWd = popupDialog.outerWidth(),
+    dlgHt = popupDialog.outerHeight(),
+    top = (dh -dlgHt)/2 + st,
+    left = (dw - dlgWd)/2;
+
+  popupDialog.css({
+    top: (top < 0? 0 : top) + 'px',
+    left: (left < 0? 0 : left) + 'px'
+  });
+
+  popupDialog.find('button.api-popup-cancel').click(function() {
+    popupMask.hide();
+    popupDialog.hide();
+  });
+  popupDialog.find('button.api-popup-authbtn').click(function() {
+    popupMask.hide();
+    popupDialog.hide();
+
+    var authSchemes = window.swaggerUi.api.authSchemes;
+    var host = window.location;
+    var pathname = location.pathname.substring(0, location.pathname.lastIndexOf("/"));
+    var redirectUrl = host.protocol + '//' + host.host + pathname + "/o2c.html";
+    var url = null;
+
+    for (var key in authSchemes) {
+      if (authSchemes.hasOwnProperty(key)) {
+        var o = authSchemes[key].grantTypes;
+        for(var t in o) {
+          if(o.hasOwnProperty(t) && t === 'implicit') {
+            var dets = o[t];
+            url = dets.loginEndpoint.url + "?response_type=token";
+            window.swaggerUi.tokenName = dets.tokenName;
+          }
+        }
+      }
+    }
+    var scopes = []
+    var o = $('.api-popup-scopes').find('input:checked');
+
+    for(k =0; k < o.length; k++) {
+      scopes.push($(o[k]).attr("scope"));
+    }
+
+    window.enabledScopes=scopes;
+
+    url += '&redirect_uri=' + encodeURIComponent(redirectUrl);
+    url += '&realm=' + encodeURIComponent(realm);
+    url += '&client_id=' + encodeURIComponent(clientId);
+    url += '&scope=' + encodeURIComponent(scopes);
+
+    window.open(url);
+  });
+
+  popupMask.show();
+  popupDialog.show();
+  return;
+}
+
+
+function handleLogout() {
+  for(key in window.authorizations.authz){
+    window.authorizations.remove(key)
+  }
+  window.enabledScopes = null;
+  $('.api-ic.ic-on').addClass('ic-off');
+  $('.api-ic.ic-on').removeClass('ic-on');
+
+  // set the info box
+  $('.api-ic.ic-warning').addClass('ic-error');
+  $('.api-ic.ic-warning').removeClass('ic-warning');
+}
+
+function initOAuth(opts) {
+  var o = (opts||{});
+  var errors = [];
+
+  appName = (o.appName||errors.push("missing appName"));
+  popupMask = (o.popupMask||$('#api-common-mask'));
+  popupDialog = (o.popupDialog||$('.api-popup-dialog'));
+  clientId = (o.clientId||errors.push("missing client id"));
+  realm = (o.realm||errors.push("missing realm"));
+
+  if(errors.length > 0){
+    log("auth unable initialize oauth: " + errors);
+    return;
+  }
+
+  $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
+  $('.api-ic').click(function(s) {
+    if($(s.target).hasClass('ic-off'))
+      handleLogin();
+    else {
+      handleLogout();
+    }
+    false;
+  });
+}
+
+function onOAuthComplete(token) {
+  if(token) {
+    if(token.error) {
+      var checkbox = $('input[type=checkbox],.secured')
+      checkbox.each(function(pos){
+        checkbox[pos].checked = false;
+      });
+      alert(token.error);
+    }
+    else {
+      var b = token[window.swaggerUi.tokenName];
+      if(b){
+        // if all roles are satisfied
+        var o = null;
+        $.each($('.auth #api_information_panel'), function(k, v) {
+          var children = v;
+          if(children && children.childNodes) {
+            var requiredScopes = [];
+            $.each((children.childNodes), function (k1, v1){
+              var inner = v1.innerHTML;
+              if(inner)
+                requiredScopes.push(inner);
+            });
+            var diff = [];
+            for(var i=0; i < requiredScopes.length; i++) {
+              var s = requiredScopes[i];
+              if(window.enabledScopes && window.enabledScopes.indexOf(s) == -1) {
+                diff.push(s);
+              }
+            }
+            if(diff.length > 0){
+              o = v.parentNode;
+              $(o.parentNode).find('.api-ic.ic-on').addClass('ic-off');
+              $(o.parentNode).find('.api-ic.ic-on').removeClass('ic-on');
+
+              // sorry, not all scopes are satisfied
+              $(o).find('.api-ic').addClass('ic-warning');
+              $(o).find('.api-ic').removeClass('ic-error');
+            }
+            else {
+              o = v.parentNode;
+              $(o.parentNode).find('.api-ic.ic-off').addClass('ic-on');
+              $(o.parentNode).find('.api-ic.ic-off').removeClass('ic-off');
+
+              // all scopes are satisfied
+              $(o).find('.api-ic').addClass('ic-info');
+              $(o).find('.api-ic').removeClass('ic-warning');
+              $(o).find('.api-ic').removeClass('ic-error');          
+            }
+          }
+        });
+
+        window.authorizations.add("oauth2", new ApiKeyAuthorization("Authorization", "Bearer " + b, "header"));
+      }
+    }
+  }
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "swagger-ui",
-  "version": "2.0.2",
+  "version": "2.1.0-alpha.1",
   "description": "Swagger UI is a dependency-free collection of HTML, Javascript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API",
   "scripts": {
     "build": "PATH=$PATH:./node_modules/.bin cake dist",
@@ -18,7 +18,9 @@
   "license": "Apache",
   "readmeFilename": "README.md",
   "dependencies": {
-    "coffee-script": "~1.5.0",
-    "handlebars": "~1.0.10"
+    "coffee-script": "~1.6.3",
+    "swagger-client": "2.0.41",
+    "handlebars": "~1.0.10",
+    "less": "~1.4.2"
   }
 }

src/main/coffeescript/SwaggerUi.coffee

@@ -22,9 +22,16 @@ class SwaggerUi extends Backbone.Router
     @options = options
 
     # Set the callbacks
-    @options.success = => @render()
+    @options.success = => 
+      @render()
     @options.progress = (d) => @showMessage(d)
-    @options.failure = (d) => @onLoadFailure(d)
+    @options.failure = (d) => 
+      if @api and @api.isValid is false
+        log "not a valid 2.0 spec, loading legacy client"
+        @api = new SwaggerApi(@options)
+        @api.build()
+      else
+        @onLoadFailure(d)
 
     # Create view to handle the header inputs
     @headerView = new HeaderView({el: $('#header')})
@@ -47,15 +54,15 @@ class SwaggerUi extends Backbone.Router
 
     @options.url = url
     @headerView.update(url)
-    @api = new SwaggerApi(@options)
-    @api.build()
-    @api
+
+    @api = new SwaggerClient(@options)
+    @api.build()    
 
   # This is bound to success handler for SwaggerApi
   #  so it gets called when SwaggerApi completes loading
   render:() ->
     @showMessage('Finished Loading Resource Information. Rendering Swagger UI...')
-    @mainView = new MainView({model: @api, el: $('#' + @dom_id)}).render()
+    @mainView = new MainView({model: @api, el: $('#' + @dom_id), swaggerOptions: @options}).render()
     @showMessage()
     switch @options.docExpansion
       when "full" then Docs.expandOperationsForResource('')
@@ -68,14 +75,21 @@ class SwaggerUi extends Backbone.Router
     )
 
   buildUrl: (base, url) ->
-    console.log "base is " + base
-    parts = base.split("/")
-    base = parts[0] + "//" + parts[2]
+    log "base is " + base
     if url.indexOf("/") is 0
+      parts = base.split("/")
+      base = parts[0] + "//" + parts[2]
       base + url
     else
-      base + "/" + url
-
+      endOfPath = base.length
+      if base.indexOf("?") > -1
+        endOfPath = Math.min(endOfPath, base.indexOf("?"))
+      if base.indexOf("#") > -1
+        endOfPath = Math.min(endOfPath, base.indexOf("#"))
+      base = base.substring(0, endOfPath);
+      if base.indexOf( "/", base.length - 1 ) isnt -1
+        return base + url
+      return base + "/" + url
 
   # Shows message on topbar of the ui
   showMessage: (data = '') ->

src/main/coffeescript/view/MainView.coffee

@@ -1,18 +1,58 @@
 class MainView extends Backbone.View
-  initialize: ->
+  sorters = {
+    'alpha'   : (a,b) -> return a.path.localeCompare(b.path),
+    'method'  : (a,b) -> return a.method.localeCompare(b.method),
+  }
 
+  initialize: (opts={}) ->
+    if opts.swaggerOptions.sorter
+      sorterName = opts.swaggerOptions.sorter
+      sorter = sorters[sorterName]
+      if @model.apisArray
+        for route in @model.apisArray
+          route.operationsArray.sort sorter
+        if (sorterName == "alpha") # sort top level paths if alpha 
+          @model.apisArray.sort sorter
+
+    if @model.info and @model.info.license and typeof @model.info.license is 'string'
+      name = @model.info.license
+      url = @model.info.licenseUrl
+      @model.info.license = {}
+      @model.info.license.name = name
+      @model.info.license.url = url
+
+    if !@model.info
+      @model.info = {}
+
+    if !@model.info.version
+      @model.info.version = @model.apiVersion
+
+    if @model.url.indexOf('http://localhost') is -1 and @model.swaggerVersion is 2
+      @model.validatorUrl = @model.url
+ 
   render: ->
     # Render the outer container for resources
     $(@el).html(Handlebars.templates.main(@model))
 
     # Render each resource
-    @addResource resource for resource in @model.apisArray
+
+    resources = {}
+    counter = 0
+    for resource in @model.apisArray
+      id = resource.name
+      while typeof resources[id] isnt 'undefined'
+        id = id + "_" + counter
+        counter += 1
+      resource.id = id
+      resources[id] = resource
+      @addResource resource
     @
 
   addResource: (resource) ->
     # Render a resource and add it to resources li
-    resourceView = new ResourceView({model: resource, tagName: 'li', id: 'resource_' + resource.name, className: 'resource'})
+    resource.id = resource.id.replace(/\s/g, '_')
+    resourceView = new ResourceView({model: resource, tagName: 'li', id: 'resource_' + resource.id, className: 'resource', swaggerOptions: @options.swaggerOptions})
     $('#resources').append resourceView.render().el
 
   clear: ->
-    $(@el).html ''
+    $(@el).html ''

src/main/coffeescript/view/OperationView.coffee

@@ -1,17 +1,78 @@
 class OperationView extends Backbone.View
+  invocationUrl: null
+
   events: {
-  'submit .sandbox'         : 'submitOperation'
-  'click .submit'           : 'submitOperation'
-  'click .response_hider'   : 'hideResponse'
-  'click .toggleOperation'  : 'toggleOperationContent'
+    'submit .sandbox'         : 'submitOperation'
+    'click .submit'           : 'submitOperation'
+    'click .response_hider'   : 'hideResponse'
+    'click .toggleOperation'  : 'toggleOperationContent'
+    'mouseenter .api-ic'      : 'mouseEnter'
+    'mouseout .api-ic'        : 'mouseExit'
   }
 
   initialize: ->
 
+  mouseEnter: (e) ->
+    elem = $(e.currentTarget.parentNode).find('#api_information_panel')
+    x = e.pageX
+    y = e.pageY
+    scX = $(window).scrollLeft()
+    scY = $(window).scrollTop()
+    scMaxX = scX + $(window).width()
+    scMaxY = scY + $(window).height()
+    wd = elem.width()
+    hgh = elem.height()
+
+    if (x + wd > scMaxX)
+      x = scMaxX - wd
+    if (x < scX)
+      x = scX
+    if (y + hgh > scMaxY)
+      y = scMaxY - hgh
+    if (y < scY)
+      y = scY
+    pos = {}
+    pos.top = y
+    pos.left = x
+    elem.css(pos)
+    $(e.currentTarget.parentNode).find('#api_information_panel').show()
+
+  mouseExit: (e) ->
+    $(e.currentTarget.parentNode).find('#api_information_panel').hide()
+
   render: ->
     isMethodSubmissionSupported = true #jQuery.inArray(@model.method, @model.supportedSubmitMethods) >= 0
     @model.isReadOnly = true unless isMethodSubmissionSupported
 
+    # 1.2 syntax for description was `notes`
+    @model.description = (@model.description || @model.notes)
+    if @model.description
+      @model.description = @model.description.replace(/(?:\r\n|\r|\n)/g, '<br />')
+    @model.oauth = null
+    if @model.authorizations
+      for k, v of @model.authorizations
+        if k == "oauth2"
+          if @model.oauth == null
+            @model.oauth = {}
+          if @model.oauth.scopes is undefined
+            @model.oauth.scopes = []
+          for o in v
+            @model.oauth.scopes.push o
+
+    if typeof @model.responses isnt 'undefined'
+      @model.responseMessages = []
+      for code, value of @model.responses
+        schema = null
+        schemaObj = @model.responses[code].schema
+        if schemaObj and schemaObj['$ref']
+          schema = schemaObj['$ref']
+          if schema.indexOf('#/definitions/') is 0
+            schema = schema.substring('#/definitions/'.length)
+        @model.responseMessages.push {code: code, message: value.description, responseModel: schema }
+
+    if typeof @model.responseMessages is 'undefined'
+      @model.responseMessages = []
+
     $(@el).html(Handlebars.templates.operation(@model))
 
     if @model.responseClassSignature and @model.responseClassSignature != 'string'
@@ -23,6 +84,7 @@ class OperationView extends Backbone.View
       responseSignatureView = new SignatureView({model: signatureModel, tagName: 'div'})
       $('.model-signature', $(@el)).append responseSignatureView.render().el
     else
+      @model.responseClassSignature = 'string'
       $('.model-signature', $(@el)).html(@model.type)
 
     contentTypeModel =
@@ -33,10 +95,18 @@ class OperationView extends Backbone.View
 
     for param in @model.parameters
       type = param.type || param.dataType
-      if type.toLowerCase() == 'file'
+      if typeof type is 'undefined'
+        schema = param.schema
+        if schema and schema['$ref']
+          ref = schema['$ref']
+          if ref.indexOf('#/definitions/') is 0
+            type = ref.substring('#/definitions/'.length)
+          else
+            type = ref
+      if type and type.toLowerCase() == 'file'
         if !contentTypeModel.consumes
-          console.log "set content type "
           contentTypeModel.consumes = 'multipart/form-data'
+      param.type = type
 
     responseContentTypeView = new ResponseContentTypeView({model: contentTypeModel})
     $('.response-content-type', $(@el)).append responseContentTypeView.render().el
@@ -77,13 +147,14 @@ class OperationView extends Backbone.View
     if error_free
       map = {}
       opts = {parent: @}
-      #for o in form.serializeArray()
-        #if(o.value? && jQuery.trim(o.value).length > 0)
-          #map[o.name] = o.value
+
+      isFileUpload = false
 
       for o in form.find("input")
         if(o.value? && jQuery.trim(o.value).length > 0)
           map[o.name] = o.value
+        if o.type is "file"
+          isFileUpload = true
 
       for o in form.find("textarea")
         if(o.value? && jQuery.trim(o.value).length > 0)
@@ -98,12 +169,96 @@ class OperationView extends Backbone.View
       opts.requestContentType = $("div select[name=parameterContentType]", $(@el)).val()
 
       $(".response_throbber", $(@el)).show()
-
-      @model.do(map, opts, @showCompleteStatus, @showErrorStatus, @)
+      if isFileUpload
+        @handleFileUpload map, form
+      else
+        @model.do(map, opts, @showCompleteStatus, @showErrorStatus, @)
 
   success: (response, parent) ->
     parent.showCompleteStatus response
-  
+
+  handleFileUpload: (map, form) ->
+    for o in form.serializeArray()
+      if(o.value? && jQuery.trim(o.value).length > 0)
+        map[o.name] = o.value
+
+    # requires HTML5 compatible browser
+    bodyParam = new FormData()
+    params = 0
+
+    # add params
+    for param in @model.parameters
+      if param.paramType is 'form'
+        if param.type.toLowerCase() isnt 'file' and map[param.name] != undefined
+            bodyParam.append(param.name, map[param.name])
+
+    # headers in operation
+    headerParams = {}
+    for param in @model.parameters
+      if param.paramType is 'header'
+        headerParams[param.name] = map[param.name]
+
+    # add files
+    for el in form.find('input[type~="file"]')
+      if typeof el.files[0] isnt 'undefined'
+        bodyParam.append($(el).attr('name'), el.files[0])
+        params += 1
+
+    @invocationUrl = 
+      if @model.supportHeaderParams()
+        headerParams = @model.getHeaderParams(map)
+        @model.urlify(map, false)
+      else
+        @model.urlify(map, true)
+
+    $(".request_url", $(@el)).html("<pre></pre>") 
+    $(".request_url pre", $(@el)).text(@invocationUrl);
+    
+    obj = 
+      type: @model.method
+      url: @invocationUrl
+      headers: headerParams
+      data: bodyParam
+      dataType: 'json'
+      contentType: false
+      processData: false
+      error: (data, textStatus, error) =>
+        @showErrorStatus(@wrap(data), @)
+      success: (data) =>
+        @showResponse(data, @)
+      complete: (data) =>
+        @showCompleteStatus(@wrap(data), @)
+
+    # apply authorizations
+    if window.authorizations
+      window.authorizations.apply obj
+
+    if params is 0
+      obj.data.append("fake", "true");
+
+    jQuery.ajax(obj)
+    false
+    # end of file-upload nastiness
+
+  # wraps a jquery response as a shred response
+
+  wrap: (data) ->
+    headers = {}
+    headerArray = data.getAllResponseHeaders().split("\r")
+    for i in headerArray
+      h = i.split(':')
+      if (h[0] != undefined && h[1] != undefined)
+        headers[h[0].trim()] = h[1].trim()
+
+    o = {}
+    o.content = {}
+    o.content.data = data.responseText
+    o.headers = headers
+    o.request = {}
+    o.request.url = @invocationUrl
+    o.status = data.status
+    o
+
   getSelectedValue: (select) ->
     if !select.multiple 
       select.value
@@ -195,40 +350,56 @@ class OperationView extends Backbone.View
     
 
   # puts the response data in UI
-  showStatus: (data) ->
-    content = data.content.data
-    headers = data.getHeaders()
+  showStatus: (response) ->
+    if response.content is undefined
+      content = response.data
+      url = response.url
+    else
+      content = response.content.data
+      url = response.request.url
+    headers = response.headers
 
     # if server is nice, and sends content-type back, we can use it
-    contentType = headers["Content-Type"]
+    contentType = if headers && headers["Content-Type"] then headers["Content-Type"].split(";")[0].trim() else null
 
-    if content == undefined
+    if !content
       code = $('<code />').text("no content")
       pre = $('<pre class="json" />').append(code)
-    else if contentType.indexOf("application/json") == 0 || contentType.indexOf("application/hal+json") == 0
-      code = $('<code />').text(JSON.stringify(JSON.parse(content), null, 2))
+    else if contentType is "application/json" || /\+json$/.test(contentType)
+      json = null
+      try
+        json = JSON.stringify(JSON.parse(content), null, "  ")
+      catch e
+        json = "can't parse JSON.  Raw result:\n\n" + content
+      code = $('<code />').text(json)
       pre = $('<pre class="json" />').append(code)
-    else if contentType.indexOf("application/xml") == 0
+    else if contentType is "application/xml" || /\+xml$/.test(contentType)
       code = $('<code />').text(@formatXml(content))
       pre = $('<pre class="xml" />').append(code)
-    else if contentType.indexOf("text/html") == 0
-      code = $('<code />').html(content)
+    else if contentType is "text/html"
+      code = $('<code />').html(_.escape(content))
       pre = $('<pre class="xml" />').append(code)
+    else if /^image\//.test(contentType)
+      pre = $('<img>').attr('src',url)
     else
       # don't know what to render!
       code = $('<code />').text(content)
       pre = $('<pre class="json" />').append(code)
 
     response_body = pre
-    $(".request_url").html "<pre>" + data.request.url + "</pre>"
-    $(".response_code", $(@el)).html "<pre>" + data.status + "</pre>"
+    $(".request_url", $(@el)).html("<pre></pre>") 
+    $(".request_url pre", $(@el)).text(url);
+    $(".response_code", $(@el)).html "<pre>" + response.status + "</pre>"
     $(".response_body", $(@el)).html response_body
-    $(".response_headers", $(@el)).html "<pre>" + JSON.stringify(data.getHeaders()) + "</pre>"
+    $(".response_headers", $(@el)).html "<pre>" + _.escape(JSON.stringify(response.headers, null, "  ")).replace(/\n/g, "<br>") + "</pre>"
     $(".response", $(@el)).slideDown()
     $(".response_hider", $(@el)).show()
     $(".response_throbber", $(@el)).hide()
-    hljs.highlightBlock($('.response_body', $(@el))[0])
+    response_body_el = $('.response_body', $(@el))[0]
+    # only highlight the response if response is less than threshold, default state is highlight response
+    opts = @options.swaggerOptions
+    if opts.highlightSizeThreshold && response.data.length > opts.highlightSizeThreshold then response_body_el else hljs.highlightBlock(response_body_el)
 
   toggleOperationContent: ->
-    elem = $('#' + Docs.escapeResourceName(@model.resourceName) + "_" + @model.nickname + "_" + @model.method + "_" + @model.number + "_content")
+    elem = $('#' + Docs.escapeResourceName(@model.parentId) + "_" + @model.nickname + "_content")
     if elem.is(':visible') then Docs.collapseOperation(elem) else Docs.expandOperation(elem)

src/main/coffeescript/view/ParameterView.coffee

@@ -1,10 +1,29 @@
 class ParameterView extends Backbone.View
   initialize: ->
-
+    Handlebars.registerHelper 'isArray',
+      (param, opts) ->
+        if param.type.toLowerCase() == 'array' || param.allowMultiple
+          opts.fn(@)
+        else
+          opts.inverse(@)
+          
   render: ->
     type = @model.type || @model.dataType
+
+    if typeof type is 'undefined'
+      schema = @model.schema
+      if schema and schema['$ref']
+        ref = schema['$ref']
+        if ref.indexOf('#/definitions/') is 0
+          type = ref.substring('#/definitions/'.length)
+        else
+          type = ref
+
+    @model.type = type
+    @model.paramType = @model.in || @model.paramType
     @model.isBody = true if @model.paramType == 'body'
-    @model.isFile = true if type.toLowerCase() == 'file'
+    @model.isFile = true if type and type.toLowerCase() == 'file'
+    @model.default = (@model.default || @model.defaultValue)
 
     template = @template()
     $(@el).html(template(@model))

src/main/coffeescript/view/ResourceView.coffee

@@ -1,22 +1,50 @@
 class ResourceView extends Backbone.View
   initialize: ->
+    if "" is @model.description 
+      @model.description = null
 
   render: ->
-    console.log @model.description
     $(@el).html(Handlebars.templates.resource(@model))
 
-    @number = 0
+    methods = {}
 
+    if @model.description
+      @model.summary = @model.description
     # Render each operation
-    @addOperation operation for operation in @model.operationsArray
-    @
+    for operation in @model.operationsArray
+      counter = 0
+
+      id = operation.nickname
+      while typeof methods[id] isnt 'undefined'
+        id = id + "_" + counter
+        counter += 1
+
+      methods[id] = operation
+
+      operation.nickname = id
+      operation.parentId = @model.id
+      @addOperation operation 
+
+    $('.toggleEndpointList', @el).click(this.callDocs.bind(this, 'toggleEndpointListForResource'))
+    $('.collapseResource', @el).click(this.callDocs.bind(this, 'collapseOperationsForResource'))
+    $('.expandResource', @el).click(this.callDocs.bind(this, 'expandOperationsForResource'))
+    
+    return @
 
   addOperation: (operation) ->
 
     operation.number = @number
 
     # Render an operation and add it to operations li
-    operationView = new OperationView({model: operation, tagName: 'li', className: 'endpoint'})
+    operationView = new OperationView({model: operation, tagName: 'li', className: 'endpoint', swaggerOptions: @options.swaggerOptions})
     $('.endpoints', $(@el)).append operationView.render().el
 
-    @number++
+    @number++
+
+  #
+  # Generic Event handler (`Docs` is global)
+  #
+
+  callDocs: (fnName, e) ->
+    e.preventDefault()
+    Docs[fnName](e.currentTarget.getAttribute('data-id'))

src/main/coffeescript/view/SignatureView.coffee

@@ -11,7 +11,7 @@ class SignatureView extends Backbone.View
     template = @template()
     $(@el).html(template(@model))
 
-    @switchToDescription()
+    @switchToSnippet()
 
     @isParam = @model.isParam
 

src/main/coffeescript/view/StatusCodeView.coffee

@@ -4,6 +4,17 @@ class StatusCodeView extends Backbone.View
   render: ->
     template = @template()
     $(@el).html(template(@model))
+
+    if swaggerUi.api.models.hasOwnProperty @model.responseModel
+      responseModel =
+        sampleJSON: JSON.stringify(swaggerUi.api.models[@model.responseModel].createJSONSample(), null, 2)
+        isParam: false
+        signature: swaggerUi.api.models[@model.responseModel].getMockSignature()
+
+      responseModelView = new SignatureView({model: responseModel, tagName: 'div'})
+      $('.model-signature', @$el).append responseModelView.render().el
+    else
+      $('.model-signature', @$el).html ''
     @
 
   template: ->

src/main/html/css/highlight.default.css

@@ -1,135 +0,0 @@
-/*
-
-Original style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>
-
-*/
-
-pre code {
-  display: block; padding: 0.5em;
-  background: #F0F0F0;
-}
-
-pre code,
-pre .subst,
-pre .tag .title,
-pre .lisp .title,
-pre .clojure .built_in,
-pre .nginx .title {
-  color: black;
-}
-
-pre .string,
-pre .title,
-pre .constant,
-pre .parent,
-pre .tag .value,
-pre .rules .value,
-pre .rules .value .number,
-pre .preprocessor,
-pre .ruby .symbol,
-pre .ruby .symbol .string,
-pre .aggregate,
-pre .template_tag,
-pre .django .variable,
-pre .smalltalk .class,
-pre .addition,
-pre .flow,
-pre .stream,
-pre .bash .variable,
-pre .apache .tag,
-pre .apache .cbracket,
-pre .tex .command,
-pre .tex .special,
-pre .erlang_repl .function_or_atom,
-pre .markdown .header {
-  color: #800;
-}
-
-pre .comment,
-pre .annotation,
-pre .template_comment,
-pre .diff .header,
-pre .chunk,
-pre .markdown .blockquote {
-  color: #888;
-}
-
-pre .number,
-pre .date,
-pre .regexp,
-pre .literal,
-pre .smalltalk .symbol,
-pre .smalltalk .char,
-pre .go .constant,
-pre .change,
-pre .markdown .bullet,
-pre .markdown .link_url {
-  color: #080;
-}
-
-pre .label,
-pre .javadoc,
-pre .ruby .string,
-pre .decorator,
-pre .filter .argument,
-pre .localvars,
-pre .array,
-pre .attr_selector,
-pre .important,
-pre .pseudo,
-pre .pi,
-pre .doctype,
-pre .deletion,
-pre .envvar,
-pre .shebang,
-pre .apache .sqbracket,
-pre .nginx .built_in,
-pre .tex .formula,
-pre .erlang_repl .reserved,
-pre .prompt,
-pre .markdown .link_label,
-pre .vhdl .attribute,
-pre .clojure .attribute,
-pre .coffeescript .property {
-  color: #88F
-}
-
-pre .keyword,
-pre .id,
-pre .phpdoc,
-pre .title,
-pre .built_in,
-pre .aggregate,
-pre .css .tag,
-pre .javadoctag,
-pre .phpdoc,
-pre .yardoctag,
-pre .smalltalk .class,
-pre .winutils,
-pre .bash .variable,
-pre .apache .tag,
-pre .go .typename,
-pre .tex .command,
-pre .markdown .strong,
-pre .request,
-pre .status {
-  font-weight: bold;
-}
-
-pre .markdown .emphasis {
-  font-style: italic;
-}
-
-pre .nginx .built_in {
-  font-weight: normal;
-}
-
-pre .coffeescript .javascript,
-pre .javascript .xml,
-pre .tex .formula,
-pre .xml .javascript,
-pre .xml .vbscript,
-pre .xml .css,
-pre .xml .cdata {
-  opacity: 0.5;
-}

src/main/html/css/reset.css

@@ -0,0 +1,125 @@
+/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+body {
+  line-height: 1;
+}
+ol,
+ul {
+  list-style: none;
+}
+blockquote,
+q {
+  quotes: none;
+}
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+  content: '';
+  content: none;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}

src/main/html/index.html

@@ -3,9 +3,11 @@
 <head>
   <title>Swagger UI</title>
   <link href='//fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'/>
-  <link href='css/highlight.default.css' media='screen' rel='stylesheet' type='text/css'/>
+  <link href='css/reset.css' media='screen' rel='stylesheet' type='text/css'/>
   <link href='css/screen.css' media='screen' rel='stylesheet' type='text/css'/>
-  <script type="text/javascript" src="lib/shred.bundle.js" /></script>  
+  <link href='css/reset.css' media='print' rel='stylesheet' type='text/css'/>
+  <link href='css/screen.css' media='print' rel='stylesheet' type='text/css'/>
+  <script type="text/javascript" src="lib/shred.bundle.js"></script>
   <script src='lib/jquery-1.8.0.min.js' type='text/javascript'></script>
   <script src='lib/jquery.slideto.min.js' type='text/javascript'></script>
   <script src='lib/jquery.wiggle.min.js' type='text/javascript'></script>
@@ -14,48 +16,75 @@
   <script src='lib/underscore-min.js' type='text/javascript'></script>
   <script src='lib/backbone-min.js' type='text/javascript'></script>
   <script src='lib/swagger.js' type='text/javascript'></script>
+  <script src='lib/swagger-client.js' type='text/javascript'></script>
   <script src='swagger-ui.js' type='text/javascript'></script>
   <script src='lib/highlight.7.3.pack.js' type='text/javascript'></script>
+
+  <!-- enabling this will enable oauth2 implicit scope support -->
+  <script src='lib/swagger-oauth.js' type='text/javascript'></script>
   <script type="text/javascript">
     $(function () {
-      window.swaggerUi = new SwaggerUi({
-      url: "http://petstore.swagger.wordnik.com/api/api-docs",
-      dom_id: "swagger-ui-container",
-      supportedSubmitMethods: ['get', 'post', 'put', 'delete'],
-      onComplete: function(swaggerApi, swaggerUi){
-        if(console) {
-          console.log("Loaded SwaggerUI")
-        }
-        $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
-      },
-      onFailure: function(data) {
-        if(console) {
-          console.log("Unable to Load SwaggerUI");
-          console.log(data);
-        }
-      },
-      docExpansion: "none"
-    });
-
-    $('#input_apiKey').change(function() {
-      var key = $('#input_apiKey')[0].value;
-      console.log("key: " + key);
-      if(key && key.trim() != "") {
-        console.log("added key " + key);
-        window.authorizations.add("key", new ApiKeyAuthorization("api_key", key, "query"));
+      var url = window.location.search.match(/url=([^&]+)/);
+      if (url && url.length > 1) {
+        url = url[1];
+      } else {
+        url = "http://petstore.swagger.wordnik.com/v2/swagger.json";
       }
-    })
-    window.swaggerUi.load();
-  });
+      window.swaggerUi = new SwaggerUi({
+        url: url,
+        dom_id: "swagger-ui-container",
+        supportedSubmitMethods: ['get', 'post', 'put', 'delete'],
+        onComplete: function(swaggerApi, swaggerUi){
+          log("Loaded SwaggerUI");
+          if(typeof initOAuth == "function") {
+            /*
+            initOAuth({
+              clientId: "your-client-id",
+              realm: "your-realms",
+              appName: "your-app-name"
+            });
+            */
+          }
+          $('pre code').each(function(i, e) {
+            hljs.highlightBlock(e)
+          });
+        },
+        onFailure: function(data) {
+          log("Unable to Load SwaggerUI");
+        },
+        docExpansion: "none",
+        sorter : "alpha"
+      });
 
+      function addApiKeyAuthorization() {
+        var key = $('#input_apiKey')[0].value;
+        log("key: " + key);
+        if(key && key.trim() != "") {
+            log("added key " + key);
+            window.authorizations.add("api_key", new ApiKeyAuthorization("api_key", key, "query"));
+        }
+      }
+
+      $('#input_apiKey').change(function() {
+        addApiKeyAuthorization();
+      });
+
+      // if you have an apiKey you would like to pre-populate on the page for demonstration purposes...
+      /*
+        var apiKey = "myApiKeyXXXX123456789";
+        $('#input_apiKey').val(apiKey);
+        addApiKeyAuthorization();
+      */
+
+      window.swaggerUi.load();
+  });
   </script>
 </head>
 
-<body>
+<body class="swagger-section">
 <div id='header'>
   <div class="swagger-ui-wrap">
     <a id="logo" href="http://swagger.wordnik.com">swagger</a>
-
     <form id='api_selector'>
       <div class='input icon-btn'>
         <img id="show-pet-store-icon" src="images/pet_store_api.png" title="Show Swagger Petstore Example Apis">
@@ -70,14 +99,7 @@
   </div>
 </div>
 
-<div id="message-bar" class="swagger-ui-wrap">
-  &nbsp;
-</div>
-
-<div id="swagger-ui-container" class="swagger-ui-wrap">
-
-</div>
-
+<div id="message-bar" class="swagger-ui-wrap">&nbsp;</div>
+<div id="swagger-ui-container" class="swagger-ui-wrap"></div>
 </body>
-
 </html>

src/main/html/o2c.html

@@ -0,0 +1,15 @@
+<script>
+var qp = null;
+if(window.location.hash) {
+  qp = location.hash.substring(1);
+}
+else {
+  qp = location.search.substring(1);
+}
+qp = qp ? JSON.parse('{"' + qp.replace(/&/g, '","').replace(/=/g,'":"') + '"}',
+  function(key, value) {
+    return key===""?value:decodeURIComponent(value) }
+  ):{}
+window.opener.onOAuthComplete(qp);
+window.close();
+</script>

src/main/javascript/doc.js

@@ -62,9 +62,14 @@ function clippyCopiedCallback(a) {
 }
 
 // Logging function that accounts for browsers that don't have window.console
-function log() {
-  if (window.console) console.log.apply(console,arguments);
-}
+log = function(){
+  log.history = log.history || [];
+  log.history.push(arguments);
+  if(this.console){
+    console.log( Array.prototype.slice.call(arguments)[0] );
+  }
+};
+
 // Handle browsers that do console incorrectly (IE9 and below, see http://stackoverflow.com/a/5539378/7913)
 if (Function.prototype.bind && console && typeof console.log == "object") {
     [
@@ -86,7 +91,6 @@ var Docs = {
 		switch (fragments.length) {
 			case 1:
 				// Expand all operations for the resource and scroll to it
-//				log('shebang resource:' + fragments[0]);
 				var dom_id = 'resource_' + fragments[0];
 
 				Docs.expandEndpointListForResource(fragments[0]);
@@ -94,18 +98,15 @@ var Docs = {
 				break;
 			case 2:
 				// Refer to the endpoint DOM element, e.g. #words_get_search
-//				log('shebang endpoint: ' + fragments.join('_'));
 
-                // Expand Resource
-                Docs.expandEndpointListForResource(fragments[0]);
-                $("#"+dom_id).slideto({highlight: false});
+        // Expand Resource
+        Docs.expandEndpointListForResource(fragments[0]);
+        $("#"+dom_id).slideto({highlight: false});
 
-                // Expand operation
+        // Expand operation
 				var li_dom_id = fragments.join('_');
 				var li_content_dom_id = li_dom_id + "_content";
 
-//                log("li_dom_id " + li_dom_id);
-//                log("li_content_dom_id " + li_content_dom_id);
 
 				Docs.expandOperation($('#'+li_content_dom_id));
 				$('#'+li_dom_id).slideto({highlight: false});
@@ -180,5 +181,4 @@ var Docs = {
 	collapseOperation: function(elem) {
 		elem.slideUp();
 	}
-
-};
+};

src/main/less/auth.less

@@ -0,0 +1,83 @@
+.swagger-section {
+
+.title {
+  font-style: bold;
+}
+
+.secondary_form {
+  display: none;
+}
+
+.main_image {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.oauth_body {
+  margin-left: 100px;
+  margin-right: 100px;
+}
+
+.oauth_submit {
+  text-align: center;
+}
+
+.api-popup-dialog {
+  z-index: 10000;
+  position: absolute;
+  width: 500px;
+  background: #FFF;
+  padding: 20px;
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  display: none;
+  font-size: 13px;
+  color: #777;
+
+  .api-popup-title{
+    font-size: 24px;
+    padding: 10px 0;
+  }
+
+  .api-popup-title{
+    font-size: 24px;
+    padding: 10px 0;
+  }
+
+
+  p.error-msg {
+    padding-left: 5px;
+    padding-bottom: 5px;
+  }
+
+  button.api-popup-authbtn {
+    height: 30px;
+  }
+  button.api-popup-cancel {
+    height: 30px;
+  }
+}
+
+.api-popup-scopes {
+  padding: 10px 20px;
+
+  li {
+    padding: 5px 0;
+    line-height: 20px;
+  }
+
+  .api-scope-desc {
+    padding-left: 20px;
+    font-style: italic;
+  }
+  li input {
+    position: relative;
+    top: 2px;
+  }
+}
+.api-popup-actions {
+  padding-top: 10px;
+}
+
+}

src/main/less/highlight_default.less

@@ -1,8 +1,6 @@
-/*
+/* Original style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org> */
 
-Original style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>
-
-*/
+.swagger-section {
 
 pre code {
   display: block; padding: 0.5em;
@@ -133,3 +131,5 @@ pre .xml .css,
 pre .xml .cdata {
   opacity: 0.5;
 }
+
+}

src/main/less/reset.less

@@ -0,0 +1,51 @@
+/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    font: inherit;
+    vertical-align: baseline;
+}
+
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+    display: block;
+}
+
+body {
+    line-height: 1;
+}
+
+ol, ul {
+    list-style: none;
+}
+
+blockquote, q {
+    quotes: none;
+}
+
+blockquote:before, blockquote:after,
+q:before, q:after {
+    content: '';
+    content: none;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}

src/main/less/screen.less

@@ -0,0 +1,139 @@
+@import 'src/main/less/highlight_default.less';
+@import 'src/main/less/specs.less';
+@import 'src/main/less/auth.less';
+
+.swagger-section {
+
+.access {
+    float: right;
+}
+
+.auth {
+    float: right;
+}
+
+#api_information_panel {
+    position: absolute;
+    background: #FFF;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    display: none;
+    font-size: 13px;
+    max-width: 300px;
+    line-height: 30px;
+    color: black;
+    padding: 5px;
+    p {
+        .api-msg-enabled {
+            color: green;
+        }
+        .api-msg-disabled {
+            color: red;
+        }
+    }
+}
+
+.api-ic {
+    height: 18px;
+    vertical-align: middle;
+    display: inline-block;
+    background: url(../images/explorer_icons.png) no-repeat;
+}
+
+.ic-info {
+    background-position: 0 0;
+    width: 18px;
+    margin-top: -7px;
+    margin-left: 4px;
+}
+.ic-warning {
+    background-position: -60px 0;
+    width: 18px;
+    margin-top: -7px;
+    margin-left: 4px;
+}
+.ic-error {
+    background-position: -30px 0;
+    width: 18px;
+    margin-top: -7px;
+    margin-left: 4px;
+}
+.ic-off {
+    background-position: -90px 0;
+    width: 58px;
+    margin-top: -4px;
+    cursor: pointer;
+}
+.ic-on {
+    background-position: -160px 0;
+    width: 58px;
+    margin-top: -4px;
+    cursor: pointer;
+}
+
+#header {
+    background-color: #89bf04;
+    padding: 14px;
+    a#logo {
+        font-size: 1.5em;
+        font-weight: bold;
+        text-decoration: none;
+        background: transparent url(../images/logo_small.png) no-repeat left center;
+        padding: 20px 0 20px 40px;
+        color: white;
+    }
+    form#api_selector {
+        display: block;
+        clear: none;
+        float: right;
+        .input {
+            display: block;
+            clear: none;
+            float: left;
+            margin: 0 10px 0 0;
+            input#input_apiKey {
+                width: 200px;
+            }
+            input#input_baseUrl {
+                width: 400px;
+            }
+            a#explore {
+                display: block;
+                text-decoration: none;
+                font-weight: bold;
+                padding: 6px 8px;
+                font-size: 0.9em;
+                color: white;
+                background-color: #547f00;
+                -moz-border-radius: 4px;
+                -webkit-border-radius: 4px;
+                -o-border-radius: 4px;
+                -ms-border-radius: 4px;
+                -khtml-border-radius: 4px;
+                border-radius: 4px;
+            }
+            a#explore:hover {
+                background-color: #547f00;
+            }
+            input {
+                font-size: 0.9em;
+                padding: 3px;
+                margin: 0;
+            }
+        }
+    }
+}
+
+#content_message {
+    margin: 10px 15px;
+    font-style: italic;
+    color: #999999;
+}
+
+#message-bar {
+    min-height: 30px;
+    text-align: center;
+    padding-top: 10px;
+}
+
+}

src/main/template/main.handlebars

@@ -1,22 +1,27 @@
 <div class='info' id='api_info'>
   {{#if info}}
-    <div class="info_title">{{info.title}}</div>
-    <div class="info_description">{{{info.description}}}</div>
-    {{#if info.termsOfServiceUrl}}<div class="info_tos"><a href="{{info.termsOfServiceUrl}}">Terms of service</a></div>{{/if}}
-    {{#if info.contact}}<div class='info_contact'><a href="mailto:{{info.contact}}">Contact the developer</a></div>{{/if}}
-    {{#if info.license}}<div class='info_license'><a href='{{info.licenseUrl}}'>{{info.license}}</a></div>{{/if}}
+  <div class="info_title">{{info.title}}</div>
+  <div class="info_description">{{{info.description}}}</div>
+  {{#if info.termsOfServiceUrl}}<div class="info_tos"><a href="{{info.termsOfServiceUrl}}">Terms of service</a></div>{{/if}}
+  {{#if info.contact}}<div class='info_contact'><a href="mailto:{{info.contact.name}}">Contact the developer</a></div>{{/if}}
+  {{#if info.license}}<div class='info_license'><a href='{{info.license.url}}'>{{info.license.name}}</a></div>{{/if}}
   {{/if}}
 </div>
 <div class='container' id='resources_container'>
-    <ul id='resources'>
-    </ul>
+  <ul id='resources'>
+  </ul>
 
-    <div class="footer">
-        <br>
-        <br>
-        <h4 style="color: #999">[ <span style="font-variant: small-caps">base url</span>: {{basePath}}
-        {{#if apiVersion}}
-        , <span style="font-variant: small-caps">api version</span>: {{apiVersion}}
-        {{/if}}]</h4>
+  <div class="footer">
+    <br>
+    <br>
+    <h4 style="color: #999">[ <span style="font-variant: small-caps">base url</span>: {{basePath}}
+    {{#if info.version}}
+    , <span style="font-variant: small-caps">api version</span>: {{info.version}}
+    {{/if}}]
+    {{#if validatorUrl}}
+    <span style="float:right"><a href="http://online.swagger.io/validator/debug?url={{url}}"><img id="validator" src="http://online.swagger.io/validator?url={{url}}"></a>
+    </span>
+    {{/if}}
+    </h4>
     </div>
 </div>

src/main/template/operation.handlebars

@@ -1,26 +1,42 @@
 
   <ul class='operations' >
-    <li class='{{method}} operation' id='{{resourceName}}_{{nickname}}_{{method}}_{{number}}'>
+    <li class='{{method}} operation' id='{{parentId}}_{{nickname}}'>
       <div class='heading'>
         <h3>
           <span class='http_method'>
-          <a href='#!/{{resourceName}}/{{nickname}}_{{method}}_{{number}}' class="toggleOperation">{{method}}</a>
+          <a href='#!/{{parentId}}/{{nickname}}' class="toggleOperation">{{method}}</a>
           </span>
           <span class='path'>
-          <a href='#!/{{resourceName}}/{{nickname}}_{{method}}_{{number}}' class="toggleOperation">{{path}}</a>
+          <a href='#!/{{parentId}}/{{nickname}}' class="toggleOperation">{{path}}</a>
           </span>
         </h3>
         <ul class='options'>
           <li>
-          <a href='#!/{{resourceName}}/{{nickname}}_{{method}}_{{number}}' class="toggleOperation">{{{summary}}}</a>
+          <a href='#!/{{parentId}}/{{nickname}}' class="toggleOperation">{{{summary}}}</a>
           </li>
         </ul>
       </div>
-      <div class='content' id='{{resourceName}}_{{nickname}}_{{method}}_{{number}}_content' style='display:none'>
-        {{#if notes}}
+      <div class='content' id='{{parentId}}_{{nickname}}_content' style='display:none'>
+        {{#if description}}
         <h4>Implementation Notes</h4>
-        <p>{{{notes}}}</p>
+        <p>{{{description}}}</p>
         {{/if}}
+        {{#oauth}}
+        <div class="auth">
+        <span class="api-ic ic-error"></span>{{/oauth}}
+        {{#each oauth}}
+          <div id="api_information_panel" style="top: 526px; left: 776px; display: none;">
+          {{#each this}}
+            <div title='{{{this.description}}}'>{{this.scope}}</div>
+          {{/each}}
+          </div>
+        {{/each}}
+        {{#oauth}}</div>{{/oauth}}
+        {{#oauth}}
+        <div class='access'>
+          <span class="api-ic ic-off" title="click to authenticate"></span>
+        </div>
+        {{/oauth}}
         {{#if type}}
           <h4>Response Class</h4>
           <p><span class="model-signature" /></p>
@@ -48,12 +64,13 @@
           {{/if}}
           {{#if responseMessages}}
           <div style='margin:0;padding:0;display:inline'></div>
-          <h4>Error Status Codes</h4>
+          <h4>Response Messages</h4>
           <table class='fullwidth'>
             <thead>
             <tr>
               <th>HTTP Status Code</th>
               <th>Reason</th>
+              <th>Response Model</th>
             </tr>
             </thead>
             <tbody class="operation-status">
@@ -66,7 +83,7 @@
           <div class='sandbox_header'>
             <input class='submit' name='commit' type='button' value='Try it out!' />
             <a href='#' class='response_hider' style='display:none'>Hide Response</a>
-            <img alt='Throbber' class='response_throbber' src='images/throbber.gif' style='display:none' />
+            <span class='response_throbber' style='display:none'></span>
           </div>
           {{/if}}
         </form>

src/main/template/param.handlebars

@@ -6,8 +6,8 @@
 			<input type="file" name='{{name}}'/>
 			<div class="parameter-content-type" />
 		{{else}}
-			{{#if defaultValue}}
-				<textarea class='body-textarea' name='{{name}}'>{{defaultValue}}</textarea>
+			{{#if default}}
+				<textarea class='body-textarea' name='{{name}}'>{{default}}</textarea>
 			{{else}}
 				<textarea class='body-textarea' name='{{name}}'></textarea>
 				<br />
@@ -15,10 +15,15 @@
 			{{/if}}
 		{{/if}}
 	{{else}}
-		{{#if defaultValue}}
-			<input class='parameter' minlength='0' name='{{name}}' placeholder='' type='text' value='{{defaultValue}}'/>
+		{{#if isFile}}
+			<input type="file" name='{{name}}'/>
+			<div class="parameter-content-type" />
 		{{else}}
-			<input class='parameter' minlength='0' name='{{name}}' placeholder='' type='text' value=''/>
+			{{#if default}}
+				<input class='parameter' minlength='0' name='{{name}}' placeholder='' type='text' value='{{default}}'/>
+			{{else}}
+				<input class='parameter' minlength='0' name='{{name}}' placeholder='' type='text' value=''/>
+			{{/if}}
 		{{/if}}
 	{{/if}}
 

src/main/template/param_list.handlebars

@@ -1,14 +1,14 @@
 <td class='code'>{{name}}</td>
 <td>
-  <select {{#if allowMultiple}} multiple='multiple'{{/if}} class='parameter' name='{{name}}'>
+  <select {{#isArray this}} multiple='multiple'{{/isArray}} class='parameter' name='{{name}}'>
     {{#if required}}
     {{else}}
       {{#if defaultValue}}
       {{else}}
-        {{#if allowMultiple}}
-         {{else}}
+        {{#isArray this}}
+        {{else}}
           <option selected="" value=''></option>
-         {{/if}}
+        {{/isArray}}
       {{/if}}
     {{/if}}
     {{#each allowableValues.descriptiveValues}}

src/main/template/resource.handlebars

@@ -1,27 +1,26 @@
 <div class='heading'>
   <h2>
-    <a href='#!/{{name}}' onclick="Docs.toggleEndpointListForResource('{{name}}');">{{name}}</a> {{#description}} : {{/description}}{{{description}}}
+    <a href='#!/{{id}}' class="toggleEndpointList" data-id="{{id}}">{{name}}</a> {{#summary}} : {{/summary}}{{{summary}}}
   </h2>
   <ul class='options'>
     <li>
-      <a href='#!/{{name}}' id='endpointListTogger_{{name}}'
-         onclick="Docs.toggleEndpointListForResource('{{name}}');">Show/Hide</a>
+      <a href='#!/{{id}}' id='endpointListTogger_{{id}}' class="toggleEndpointList" data-id="{{id}}">Show/Hide</a>
     </li>
     <li>
-      <a href='#' onclick="Docs.collapseOperationsForResource('{{name}}'); return false;">
+      <a href='#' class="collapseResource" data-id="{{id}}">
         List Operations
       </a>
     </li>
     <li>
-      <a href='#' onclick="Docs.expandOperationsForResource('{{name}}'); return false;">
+      <a href='#' class="expandResource" data-id={{id}}>
         Expand Operations
       </a>
     </li>
-    <li>
+    {{#url}}<li>
       <a href='{{url}}'>Raw</a>
-    </li>
+    </li>{{/url}}
   </ul>
 </div>
-<ul class='endpoints' id='{{name}}_endpoint_list' style='display:none'>
+<ul class='endpoints' id='{{id}}_endpoint_list' style='display:none'>
 
 </ul>

src/main/template/signature.handlebars

@@ -1,18 +1,18 @@
 <div>
 <ul class="signature-nav">
-    <li><a class="description-link" href="#">Model</a></li>
-    <li><a class="snippet-link" href="#">Model Schema</a></li>
+  <li><a class="description-link" href="#">Model</a></li>
+  <li><a class="snippet-link" href="#">Model Schema</a></li>
 </ul>
 <div>
 
 <div class="signature-container">
-    <div class="description">
-        {{{signature}}}
-    </div>
+  <div class="description">
+    {{{signature}}}
+  </div>
 
-    <div class="snippet">
-        <pre><code>{{sampleJSON}}</code></pre>
-        <small class="notice"></small>
-    </div>
+  <div class="snippet">
+    <pre><code>{{sampleJSON}}</code></pre>
+    <small class="notice"></small>
+  </div>
 </div>
 

src/main/template/status_code.handlebars

@@ -1,2 +1,3 @@
 <td width='15%' class='code'>{{code}}</td>
 <td>{{{message}}}</td>
+<td width='50%'><span class="model-signature" /></td>