swagger-ui/js/view/MainView.js
'use strict';
SwaggerUi.Views.MainView = Backbone.View.extend({
apisSorter : {
alpha : function(a,b){ return a.name.localeCompare(b.name); }
},
operationsSorters : {
alpha : function(a,b){ return a.path.localeCompare(b.path); },
method : function(a,b){ return a.method.localeCompare(b.method); }
},
events: {
'click button' : 'buttonClickHandler'
},
initialize: function(opts){
var sorterOption, sorterFn, key, value;
opts = opts || {};
this.router = opts.router;
// Sort APIs
if (opts.swaggerOptions.apisSorter) {
sorterOption = opts.swaggerOptions.apisSorter;
if (_.isFunction(sorterOption)) {
sorterFn = sorterOption;
} else {
sorterFn = this.apisSorter[sorterOption];
}
if (_.isFunction(sorterFn)) {
this.model.apisArray.sort(sorterFn);
}
}
// Sort operations of each API
if (opts.swaggerOptions.operationsSorter) {
sorterOption = opts.swaggerOptions.operationsSorter;
if (_.isFunction(sorterOption)) {
sorterFn = sorterOption;
} else {
sorterFn = this.operationsSorters[sorterOption];
}
if (_.isFunction(sorterFn)) {
for (key in this.model.apisArray) {
this.model.apisArray[key].operationsArray.sort(sorterFn);
}
}
}
// set up the UI for input
this.model.auths = [];
for (key in this.model.securityDefinitions) {
value = this.model.securityDefinitions[key];
this.model.auths.push({
name: key,
type: value.type,
value: value
});
}
if (this.model.swaggerVersion === '2.0') {
if ('validatorUrl' in opts.swaggerOptions) {
// Validator URL specified explicitly
this.model.validatorUrl = opts.swaggerOptions.validatorUrl;
} else if (this.model.url.indexOf('localhost') > 0) {
// Localhost override
this.model.validatorUrl = null;
} else {
// Default validator
if(window.location.protocol.indexOf('http') === 0) {
this.model.validatorUrl = window.location.protocol + '//online.swagger.io/validator';
}
}
}
},
render: function(){
if (this.model.securityDefinitions) {
for (var name in this.model.securityDefinitions) {
var auth = this.model.securityDefinitions[name];
var button;
if (auth.type === 'apiKey' && $('#apikey_button').length === 0) {
button = new SwaggerUi.Views.ApiKeyButton({model: auth, router: this.router}).render().el;
$('.auth_main_container').append(button);
}
if (auth.type === 'basicAuth' && $('#basic_auth_button').length === 0) {
button = new SwaggerUi.Views.BasicAuthButton({model: auth, router: this.router}).render().el;
$('.auth_main_container').append(button);
}
}
}
// Render the outer container for resources
$(this.el).html(Handlebars.templates.main(this.model));
// Render each resource
var resources = {};
var counter = 0;
for (var i = 0; i < this.model.apisArray.length; i++) {
var resource = this.model.apisArray[i];
var id = resource.name;
while (typeof resources[id] !== 'undefined') {
id = id + '_' + counter;
counter += 1;
}
resource.id = id;
resources[id] = resource;
this.addResource(resource, this.model.auths);
}
$('.propWrap').hover(function onHover(){
$('.optionsWrapper', $(this)).show();
}, function offhover(){
$('.optionsWrapper', $(this)).hide();
});
return this;
},
addResource: function(resource, auths){
// Render a resource and add it to resources li
resource.id = resource.id.replace(/\s/g, '_');
var resourceView = new SwaggerUi.Views.ResourceView({
model: resource,
router: this.router,
tagName: 'li',
id: 'resource_' + resource.id,
className: 'resource',
auths: auths,
swaggerOptions: this.options.swaggerOptions
});
$('#resources', this.el).append(resourceView.render().el);
},
clear: function(){
$(this.el).html('');
},
buttonClickHandler: function(e){
var target = $(e.currentTarget);
if (target.attr('data-href')){
window.history.pushState(null,null,target.attr('data-href'));
}
}
});