kyy/swagger-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of github.com:toke/swagger-ui

Browse Source
This commit is contained in:
Thomas Kerpe
2015-09-15 16:22:11 +02:00
parent 84337d5a0b 736e7cd90e
commit 4e6669d63f
41 changed files with 2368 additions and 1858 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/main/html/css/screen.css
View File

@@ -1155,8 +1155,16 @@
.swagger-section .auth {
float: right;
}
.swagger-section #api_information_panel {
position: absolute;
.swagger-section .api-ic {
height: 18px;
vertical-align: middle;
display: inline-block;
background: url(../images/explorer_icons.png) no-repeat;
}
.swagger-section .api-ic .api_information_panel {
position: relative;
margin-top: 20px;
margin-left: -5px;
background: #FFF;
border: 1px solid #ccc;
border-radius: 5px;
@@ -1167,34 +1175,32 @@
color: black;
padding: 5px;
}
.swagger-section #api_information_panel p .api-msg-enabled {
.swagger-section .api-ic .api_information_panel p .api-msg-enabled {
color: green;
}
.swagger-section #api_information_panel p .api-msg-disabled {
.swagger-section .api-ic .api_information_panel p .api-msg-disabled {
color: red;
}
.swagger-section .api-ic {
height: 18px;
vertical-align: middle;
display: inline-block;
background: url(../images/explorer_icons.png) no-repeat;
.swagger-section .api-ic:hover .api_information_panel {
position: absolute;
display: block;
}
.swagger-section .ic-info {
background-position: 0 0;
width: 18px;
margin-top: -7px;
margin-top: -6px;
margin-left: 4px;
}
.swagger-section .ic-warning {
background-position: -60px 0;
width: 18px;
margin-top: -7px;
margin-top: -6px;
margin-left: 4px;
}
.swagger-section .ic-error {
background-position: -30px 0;
width: 18px;
margin-top: -7px;
margin-top: -6px;
margin-left: 4px;
}
.swagger-section .ic-off {

23
src/main/html/index.html
View File

@@ -1,6 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Swagger UI</title>
<link rel="icon" type="image/png" href="images/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="images/favicon-16x16.png" sizes="16x16" />
@@ -21,6 +22,11 @@
<script src='lib/marked.js' type='text/javascript'></script>
<script src='lib/swagger-oauth.js' type='text/javascript'></script>
<!-- Some basic translations -->
<!-- <script src='lang/translator.js' type='text/javascript'></script> -->
<!-- <script src='lang/ru.js' type='text/javascript'></script> -->
<!-- <script src='lang/en.js' type='text/javascript'></script> -->
<script type="text/javascript">
$(function () {
var url = window.location.search.match(/url=([^&]+)/);
@@ -29,6 +35,11 @@
} else {
url = "http://petstore.swagger.io/v2/swagger.json";
}
// Pre load translate...
if(window.SwaggerTranslator) {
window.SwaggerTranslator.translate();
}
window.swaggerUi = new SwaggerUi({
url: url,
dom_id: "swagger-ui-container",
@@ -37,11 +48,17 @@
if(typeof initOAuth == "function") {
initOAuth({
clientId: "your-client-id",
clientSecret: "your-client-secret",
realm: "your-realms",
appName: "your-app-name"
appName: "your-app-name",
scopeSeparator: ","
});
}
if(window.SwaggerTranslator) {
window.SwaggerTranslator.translate();
}
$('pre code').each(function(i, e) {
hljs.highlightBlock(e)
});
@@ -91,12 +108,12 @@
<form id='api_selector'>
<div class='input'><input placeholder="http://example.com/api" id="input_baseUrl" name="baseUrl" type="text"/></div>
<div class='input'><input placeholder="api_key" id="input_apiKey" name="apiKey" type="text"/></div>
<div class='input'><a id="explore" href="#">Explore</a></div>
<div class='input'><a id="explore" href="#" data-sw-translate>Explore</a></div>
</form>
</div>
</div>
<div id="message-bar" class="swagger-ui-wrap">&nbsp;</div>
<div id="message-bar" class="swagger-ui-wrap" data-sw-translate>&nbsp;</div>
<div id="swagger-ui-container" class="swagger-ui-wrap"></div>
</body>
</html>

12
src/main/javascript/SwaggerUi.js
View File

@@ -173,9 +173,13 @@ window.SwaggerUi = Backbone.Router.extend({
if (data === undefined) {
data = '';
}
$('#message-bar').removeClass('message-fail');
$('#message-bar').addClass('message-success');
$('#message-bar').text(data);
var $msgbar = $('#message-bar');
$msgbar.removeClass('message-fail');
$msgbar.addClass('message-success');
$msgbar.html(data);
if(window.SwaggerTranslator) {
window.SwaggerTranslator.translate($msgbar);
}
},
// shows message in red
@@ -253,7 +257,7 @@ window.SwaggerUi.Views = {};
});
} else if (typeof exports === 'object') {
// Node. Does not work with strict CommonJS, but
// only CommonJS-like enviroments that support module.exports,
// only CommonJS-like environments that support module.exports,
// like Node.
module.exports = factory(require('b'));
} else {

12
src/main/javascript/helpers/handlebars.js
View File

@@ -11,6 +11,14 @@ Handlebars.registerHelper('renderTextParam', function(param) {
var isArray = param.type.toLowerCase() === 'array' || param.allowMultiple;
var defaultValue = isArray && Array.isArray(param.default) ? param.default.join('\n') : param.default;
var dataVendorExtensions = Object.keys(param).filter(function(property) {
// filter X-data- properties
return property.match(/^X-data-/i) !== null;
}).reduce(function(result, property) {
// remove X- from property name, so it results in html attributes like data-foo='bar'
return result += ' ' + property.substring(2, property.length) + '=\'' + param[property] + '\'';
}, '');
if (typeof defaultValue === 'undefined') {
defaultValue = '';
}
@@ -24,7 +32,7 @@ Handlebars.registerHelper('renderTextParam', function(param) {
}
if(isArray) {
result = '<textarea class=\'body-textarea' + (param.required ? ' required' : '') + '\' name=\'' + param.name + '\'' + idAtt;
result = '<textarea class=\'body-textarea' + (param.required ? ' required' : '') + '\' name=\'' + param.name + '\'' + idAtt + dataVendorExtensions;
result += ' placeholder=\'Provide multiple values in new lines' + (param.required ? ' (at least one required).' : '.') + '\'>';
result += defaultValue + '</textarea>';
} else {
@@ -33,7 +41,7 @@ Handlebars.registerHelper('renderTextParam', function(param) {
parameterClass += ' required';
}
result = '<input class=\'' + parameterClass + '\' minlength=\'' + (param.required ? 1 : 0) + '\'';
result += ' name=\'' + param.name +'\' placeholder=\'' + (param.required ? '(required)' : '') + '\'' + idAtt;
result += ' name=\'' + param.name +'\' placeholder=\'' + (param.required ? '(required)' : '') + '\'' + idAtt + dataVendorExtensions;
result += ' type=\'' + type + '\' value=\'' + defaultValue + '\'/>';
}
return new Handlebars.SafeString(result);

2
src/main/javascript/view/MainView.js
View File

@@ -62,7 +62,7 @@ SwaggerUi.Views.MainView = Backbone.View.extend({
this.model.validatorUrl = null;
} else {
// Default validator
if(window.location.protocol === 'https') {
if(window.location.protocol === 'https:') {
this.model.validatorUrl = 'https://online.swagger.io/validator';
}
else {

41
src/main/javascript/view/OperationView.js
View File

@@ -9,7 +9,6 @@ SwaggerUi.Views.OperationView = Backbone.View.extend({
'click .response_hider' : 'hideResponse',
'click .toggleOperation' : 'toggleOperationContent',
'mouseenter .api-ic' : 'mouseEnter',
'mouseout .api-ic' : 'mouseExit',
'dblclick .curl' : 'selectText',
},
@@ -33,7 +32,7 @@ SwaggerUi.Views.OperationView = Backbone.View.extend({
range.moveToElementText(text);
range.select();
} else if (window.getSelection) {
selection = window.getSelection();
selection = window.getSelection();
range = document.createRange();
range.selectNodeContents(text);
selection.removeAllRanges();
@@ -72,11 +71,6 @@ SwaggerUi.Views.OperationView = Backbone.View.extend({
pos.top = y;
pos.left = x;
elem.css(pos);
$(e.currentTarget.parentNode).find('#api_information_panel').show();
},
mouseExit: function(e) {
$(e.currentTarget.parentNode).find('#api_information_panel').hide();
},
// Note: copied from CoffeeScript compiled file
@@ -95,22 +89,23 @@ SwaggerUi.Views.OperationView = Backbone.View.extend({
for (l = 0, len = modelAuths.length; l < len; l++) {
auths = modelAuths[l];
for (key in auths) {
auth = auths[key];
for (a in this.auths) {
auth = this.auths[a];
if (auth.type === 'oauth2') {
this.model.oauth = {};
this.model.oauth.scopes = [];
ref1 = auth.value.scopes;
for (k in ref1) {
v = ref1[k];
scopeIndex = auths[key].indexOf(k);
if (scopeIndex >= 0) {
o = {
scope: k,
description: v
};
this.model.oauth.scopes.push(o);
if (key === auth.name) {
if (auth.type === 'oauth2') {
this.model.oauth = {};
this.model.oauth.scopes = [];
ref1 = auth.value.scopes;
for (k in ref1) {
v = ref1[k];
scopeIndex = auths[key].indexOf(k);
if (scopeIndex >= 0) {
o = {
scope: k,
description: v
};
this.model.oauth.scopes.push(o);
}
}
}
}
@@ -144,8 +139,8 @@ SwaggerUi.Views.OperationView = Backbone.View.extend({
schemaObj = this.model.responses[code].schema;
if (schemaObj && schemaObj.$ref) {
schema = schemaObj.$ref;
if (schema.indexOf('#/definitions/') === 0) {
schema = schema.substring('#/definitions/'.length);
if (schema.indexOf('#/definitions/') !== -1) {
schema = schema.replace(/^.*#\/definitions\//, '');
}
}
this.model.responseMessages.push({

4
src/main/javascript/view/SignatureView.js
View File

@@ -52,7 +52,9 @@ SwaggerUi.Views.SignatureView = Backbone.View.extend({
if (e) { e.preventDefault(); }
var textArea = $('textarea', $(this.el.parentNode.parentNode.parentNode));
if ($.trim(textArea.val()) === '') {
// Fix for bug in IE 10/11 which causes placeholder text to be copied to "value"
if ($.trim(textArea.val()) === '' || textArea.prop('placeholder') === textArea.val()) {
textArea.val(this.model.sampleJSON);
}
}

58
src/main/less/screen.less
View File

@@ -12,50 +12,58 @@
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;
.api_information_panel {
position: relative;
margin-top: 20px;
margin-left: -5px;
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:hover {
.api_information_panel {
position: absolute;
display: block;
}
}
.ic-info {
background-position: 0 0;
width: 18px;
margin-top: -7px;
margin-top: -6px;
margin-left: 4px;
}
.ic-warning {
background-position: -60px 0;
width: 18px;
margin-top: -7px;
margin-top: -6px;
margin-left: 4px;
}
.ic-error {
background-position: -30px 0;
width: 18px;
margin-top: -7px;
margin-top: -6px;
margin-left: 4px;
}
.ic-off {
@@ -136,4 +144,4 @@
padding-top: 10px;
}
}
}

3
src/main/template/apikey_button_view.handlebars
View File

@@ -3,7 +3,6 @@
<div class='key_input_container'>
<div class='auth_label'><label for='input_apiKey_entry'>{{keyName}}</label></div>
<input placeholder='api_key' class='auth_input' id='input_apiKey_entry' name='apiKey' type='text'/>
<div class='auth_submit'><a class='auth_submit_button' id='apply_api_key' href='#''>apply</a></div>
<div class='auth_submit'><a class='auth_submit_button' id='apply_api_key' href='#' data-sw-translate>apply</a></div>
</div>
</div>

4
src/main/template/basic_auth_button_view.handlebars
View File

@@ -1,9 +1,9 @@
<div class='auth_button' id='basic_auth_button'><img class='auth_icon' src='images/password.jpeg'></div>
<div class='auth_container' id='basic_auth_container'>
<div class='key_input_container'>
<div class="auth_label"><label for="input_username">Username</label></div>
<div class="auth_label"><label for="input_username" data-sw-translate>Username</label></div>
<input placeholder="username" class="auth_input" id="input_username" name="username" type="text"/>
<div class="auth_label"><label for="password">Password</label></div>
<div class="auth_label"><label for="password" data-sw-translate>Password</label></div>
<input placeholder="password" class="auth_input" id="input_password" name="password" type="password"/>
<div class='auth_submit'><a class='auth_submit_button' id="apply_basic_auth" href="#">apply</a></div>
</div>

2
src/main/template/content_type.handlebars
View File

@@ -1,4 +1,4 @@
<label for="{{contentTypeId}}">Response Content Type</label>
<label data-sw-translate for="{{contentTypeId}}">Response Content Type</label>
<select name="contentType" id="{{contentTypeId}}">
{{#if produces}}
{{#each produces}}

10
src/main/template/main.handlebars
View File

@@ -6,10 +6,10 @@
<p>{{externalDocs.description}}</p>
<a href="{{externalDocs.url}}" target="_blank">{{externalDocs.url}}</a>
{{/if}}
{{#if info.termsOfServiceUrl}}<div class="info_tos"><a href="{{info.termsOfServiceUrl}}">Terms of service</a></div>{{/if}}
{{#if info.contact.name}}<div class='info_name'>Created by {{info.contact.name}}</div>{{/if}}
{{#if info.contact.url}}<div class='info_url'>See more at <a href="{{info.contact.url}}">{{info.contact.url}}</a></div>{{/if}}
{{#if info.contact.email}}<div class='info_email'><a href="mailto:{{info.contact.email}}?subject={{info.title}}">Contact the developer</a></div>{{/if}}
{{#if info.termsOfServiceUrl}}<div class="info_tos"><a href="{{info.termsOfServiceUrl}}" data-sw-translate>Terms of service</a></div>{{/if}}
{{#if info.contact.name}}<div class='info_name' data-sw-translate>Created by {{info.contact.name}}</div>{{/if}}
{{#if info.contact.url}}<div class='info_url' data-sw-translate>See more at <a href="{{info.contact.url}}">{{info.contact.url}}</a></div>{{/if}}
{{#if info.contact.email}}<div class='info_email'><a href="mailto:{{info.contact.email}}?subject={{info.title}}" data-sw-translate>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>
@@ -19,7 +19,7 @@
<div class="footer">
<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}}
, <span style="font-variant: small-caps" data-sw-translate>api version</span>: {{info.version}}
{{/if}}]
{{#if validatorUrl}}
<span style="float:right"><a href="{{validatorUrl}}/debug?url={{url}}"><img id="validator" src="{{validatorUrl}}?url={{url}}"></a>

44
src/main/template/operation.handlebars
View File

@@ -26,22 +26,22 @@
{{/if}}
{{#oauth}}
<div class="auth">
<span class="api-ic ic-error"></span>{{/oauth}}
<span class="api-ic ic-error">{{/oauth}}
{{#each oauth}}
<div id="api_information_panel" style="top: 526px; left: 776px; display: none;">
<div class="api_information_panel">
{{#each this}}
<div title='{{{this.description}}}'>{{this.scope}}</div>
{{/each}}
</div>
{{/each}}
{{#oauth}}</div>{{/oauth}}
{{#oauth}}</span></div>{{/oauth}}
{{#oauth}}
<div class='access'>
<span class="api-ic ic-off" title="click to authenticate"></span>
</div>
{{/oauth}}
{{#if type}}
<h4>Response Class (Status {{successCode}})</h4>
<h4><span data-sw-translate>Response Class</span> (<span data-sw-translate>Status</span> {{successCode}})</h4>
<p><span class="model-signature" /></p>
<br/>
<div class="response-content-type" />
@@ -49,15 +49,15 @@
<form accept-charset='UTF-8' class='sandbox'>
<div style='margin:0;padding:0;display:inline'></div>
{{#if parameters}}
<h4>Parameters</h4>
<h4 data-sw-translate>Parameters</h4>
<table class='fullwidth'>
<thead>
<tr>
<th style="width: 100px; max-width: 100px">Parameter</th>
<th style="width: 310px; max-width: 310px">Value</th>
<th style="width: 200px; max-width: 200px">Description</th>
<th style="width: 100px; max-width: 100px">Parameter Type</th>
<th style="width: 220px; max-width: 230px">Data Type</th>
<th style="width: 100px; max-width: 100px" data-sw-translate>Parameter</th>
<th style="width: 310px; max-width: 310px" data-sw-translate>Value</th>
<th style="width: 200px; max-width: 200px" data-sw-translate>Description</th>
<th style="width: 100px; max-width: 100px" data-sw-translate>Parameter Type</th>
<th style="width: 220px; max-width: 230px" data-sw-translate>Data Type</th>
</tr>
</thead>
<tbody class="operation-params">
@@ -67,14 +67,14 @@
{{/if}}
{{#if responseMessages}}
<div style='margin:0;padding:0;display:inline'></div>
<h4>Response Messages</h4>
<h4 data-sw-translate>Response Messages</h4>
<table class='fullwidth'>
<thead>
<tr>
<th>HTTP Status Code</th>
<th>Reason</th>
<th>Response Model</th>
<th>Headers</th>
<th data-sw-translate>HTTP Status Code</th>
<th data-sw-translate>Reason</th>
<th data-sw-translate>Response Model</th>
<th data-sw-translate>Headers</th>
</tr>
</thead>
<tbody class="operation-status">
@@ -85,8 +85,8 @@
{{#if isReadOnly}}
{{else}}
<div class='sandbox_header'>
<input class='submit' type='button' value='Try it out!' />
<a href='#' class='response_hider' style='display:none'>Hide Response</a>
<input class='submit' type='button' value='Try it out!' data-sw-translate/>
<a href='#' class='response_hider' style='display:none' data-sw-translate>Hide Response</a>
<span class='response_throbber' style='display:none'></span>
</div>
{{/if}}
@@ -94,17 +94,17 @@
<div class='response' style='display:none'>
<h4>Curl</h4>
<div class='block curl'></div>
<h4>Request URL</h4>
<h4 data-sw-translate>Request URL</h4>
<div class='block request_url'></div>
{{#if showRequestHeaders}}
<h4>Request Headers</h4>
<h4 data-sw-translate>Request Headers</h4>
<div class='block request_headers'></div>
{{/if}}
<h4>Response Body</h4>
<h4 data-sw-translate>Response Body</h4>
<div class='block response_body'></div>
<h4>Response Code</h4>
<h4 data-sw-translate>Response Code</h4>
<div class='block response_code'></div>
<h4>Response Headers</h4>
<h4 data-sw-translate>Response Headers</h4>
<div class='block response_headers'></div>
</div>
</div>

2
src/main/template/param_list.handlebars
View File

@@ -1,4 +1,4 @@
<td class='code{{#if required}} required{{/if}}'><label for='{{valueId}}'>{{name}}</labe></td>
<td class='code{{#if required}} required{{/if}}'><label for='{{valueId}}'>{{name}}</label></td>
<td>
<select {{#isArray this}} multiple="multiple"{{/isArray}} class="parameter {{#if required}} required {{/if}}" name="{{name}}" id="{{valueId}}">

8
src/main/template/resource.handlebars
View File

@@ -4,21 +4,21 @@
</h2>
<ul class='options'>
<li>
<a href='#!/{{id}}' id='endpointListTogger_{{id}}' class="toggleEndpointList" data-id="{{id}}">Show/Hide</a>
<a href='#!/{{id}}' id='endpointListTogger_{{id}}' class="toggleEndpointList" data-id="{{id}}" data-sw-translate>Show/Hide</a>
</li>
<li>
<a href='#' class="collapseResource" data-id="{{id}}">
<a href='#' class="collapseResource" data-id="{{id}}" data-sw-translate>
List Operations
</a>
</li>
<li>
<a href='#' class="expandResource" data-id="{{id}}">
<a href='#' class="expandResource" data-id="{{id}}" data-sw-translate>
Expand Operations
</a>
</li>
{{#if url}}
<li>
<a href='{{url}}'>Raw</a>
<a href='{{url}}' data-sw-translate>Raw</a>
</li>
{{/if}}
</ul>

2
src/main/template/response_content_type.handlebars
View File

@@ -1,4 +1,4 @@
<label for="{{responseContentTypeId}}">Response Content Type</label>
<label data-sw-translate for="{{responseContentTypeId}}">Response Content Type</label>
<select name="responseContentType" id="{{responseContentTypeId}}">
{{#if produces}}
{{#each produces}}

4
src/main/template/signature.handlebars
View File

@@ -1,7 +1,7 @@
<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="#" data-sw-translate>Model</a></li>
<li><a class="snippet-link" href="#" data-sw-translate>Model Schema</a></li>
</ul>
<div>