merged from swagger-api

CONTRIBUTING.md

@@ -1,5 +1,5 @@
 ## Pull Requests
-Plase make your pull requests are made to the [**`develop_2.0`**](https://github.com/swagger-api/swagger-ui/tree/develop_2.0) branch at this time.
+Please open your pull requests against the [**`develop_2.0`**](https://github.com/swagger-api/swagger-ui/tree/develop_2.0) branch at this time.
 
 ## Issues
 SwaggerUI uses [SwaggerJS](https://github.com/swagger-api/swagger-js) library for many internal operations. If you see errors in

bower.json

@@ -1,7 +1,6 @@
 {
   "name": "swagger-ui",
   "main": "dist/index.html",
-  "version": "2.1.0",
   "authors": [
     "Mohsen Azimi <me@azimi.me>"
   ],

dist/css/screen.css

@@ -1155,8 +1155,16 @@
 .swagger-section .auth {
   float: right;
 }
-.swagger-section #api_information_panel {
+.swagger-section .api-ic {
-  position: absolute;
+  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 {
+.swagger-section .api-ic:hover .api_information_panel {
-  height: 18px;
+  position: absolute;
-  vertical-align: middle;
+  display: block;
-  display: inline-block;
-  background: url(../images/explorer_icons.png) no-repeat;
 }
 .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 {

dist/index.html

@@ -22,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=([^&]+)/);
@@ -30,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",
@@ -38,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)
           });
@@ -92,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>

dist/lang/en.js

@@ -0,0 +1,52 @@
+'use strict';
+
+/* jshint quotmark: double */
+window.SwaggerTranslator.learn({
+    "Warning: Deprecated":"Warning: Deprecated",
+    "Implementation Notes":"Implementation Notes",
+    "Response Class":"Response Class",
+    "Status":"Status",
+    "Parameters":"Parameters",
+    "Parameter":"Parameter",
+    "Value":"Value",
+    "Description":"Description",
+    "Parameter Type":"Parameter Type",
+    "Data Type":"Data Type",
+    "Response Messages":"Response Messages",
+    "HTTP Status Code":"HTTP Status Code",
+    "Reason":"Reason",
+    "Response Model":"Response Model",
+    "Request URL":"Request URL",
+    "Response Body":"Response Body",
+    "Response Code":"Response Code",
+    "Response Headers":"Response Headers",
+    "Hide Response":"Hide Response",
+    "Try it out!":"Try it out!",
+    "Show/Hide":"Show/Hide",
+    "List Operations":"List Operations",
+    "Expand Operations":"Expand Operations",
+    "Raw":"Raw",
+    "can't parse JSON.  Raw result":"can't parse JSON.  Raw result",
+    "Model Schema":"Model Schema",
+    "Model":"Model",
+    "apply":"apply",
+    "Username":"Username",
+    "Password":"Password",
+    "Terms of service":"Terms of service",
+    "Created by":"Created by",
+    "See more at":"See more at",
+    "Contact the developer":"Contact the developer",
+    "api version":"api version",
+    "Response Content Type":"Response Content Type",
+    "fetching resource":"fetching resource",
+    "fetching resource list":"fetching resource list",
+    "Explore":"Explore",
+    "Show Swagger Petstore Example Apis":"Show Swagger Petstore Example Apis",
+    "Can't read from server.  It may not have the appropriate access-control-origin settings.":"Can't read from server.  It may not have the appropriate access-control-origin settings.",
+    "Please specify the protocol for":"Please specify the protocol for",
+    "Can't read swagger JSON from":"Can't read swagger JSON from",
+    "Finished Loading Resource Information. Rendering Swagger UI":"Finished Loading Resource Information. Rendering Swagger UI",
+    "Unable to read api":"Unable to read api",
+    "from path":"from path",
+    "server returned":"server returned"
+});

dist/lang/es.js

@@ -0,0 +1,52 @@
+'use strict';
+
+/* jshint quotmark: double */
+window.SwaggerTranslator.learn({
+    "Warning: Deprecated":"Advertencia: Obsoleto",
+    "Implementation Notes":"Notas de implementación",
+    "Response Class":"Clase de la Respuesta",
+    "Status":"Status",
+    "Parameters":"Parámetros",
+    "Parameter":"Parámetro",
+    "Value":"Valor",
+    "Description":"Descripción",
+    "Parameter Type":"Tipo del Parámetro",
+    "Data Type":"Tipo del Dato",
+    "Response Messages":"Mensajes de la Respuesta",
+    "HTTP Status Code":"Código de Status HTTP",
+    "Reason":"Razón",
+    "Response Model":"Modelo de la Respuesta",
+    "Request URL":"URL de la Solicitud",
+    "Response Body":"Cuerpo de la Respuesta",
+    "Response Code":"Código de la Respuesta",
+    "Response Headers":"Encabezados de la Respuesta",
+    "Hide Response":"Ocultar Respuesta",
+    "Try it out!":"Pruébalo!",
+    "Show/Hide":"Mostrar/Ocultar",
+    "List Operations":"Listar Operaciones",
+    "Expand Operations":"Expandir Operaciones",
+    "Raw":"Crudo",
+    "can't parse JSON.  Raw result":"no puede parsear el JSON.  Resultado crudo",
+    "Model Schema":"Esquema del Modelo",
+    "Model":"Modelo",
+    "apply":"aplicar",
+    "Username":"Nombre de usuario",
+    "Password":"Contraseña",
+    "Terms of service":"Términos de Servicio",
+    "Created by":"Creado por",
+    "See more at":"Ver más en",
+    "Contact the developer":"Contactar al desarrollador",
+    "api version":"versión de la api",
+    "Response Content Type":"Tipo de Contenido (Content Type) de la Respuesta",
+    "fetching resource":"buscando recurso",
+    "fetching resource list":"buscando lista del recurso",
+    "Explore":"Explorar",
+    "Show Swagger Petstore Example Apis":"Mostrar Api Ejemplo de Swagger Petstore",
+    "Can't read from server.  It may not have the appropriate access-control-origin settings.":"No se puede leer del servidor. Tal vez no tiene la configuración de control de acceso de origen (access-control-origin) apropiado.",
+    "Please specify the protocol for":"Por favor, especificar el protocola para",
+    "Can't read swagger JSON from":"No se puede leer el JSON de swagger desde",
+    "Finished Loading Resource Information. Rendering Swagger UI":"Finalizada la carga del recurso de Información. Mostrando Swagger UI",
+    "Unable to read api":"No se puede leer la api",
+    "from path":"desde ruta",
+    "server returned":"el servidor retornó"
+});

dist/lang/pt.js

@@ -0,0 +1,52 @@
+'use strict';
+
+/* jshint quotmark: double */
+window.SwaggerTranslator.learn({
+    "Warning: Deprecated":"Aviso: Depreciado",
+    "Implementation Notes":"Notas de Implementação",
+    "Response Class":"Classe de resposta",
+    "Status":"Status",
+    "Parameters":"Parâmetros",
+    "Parameter":"Parâmetro",
+    "Value":"Valor",
+    "Description":"Descrição",
+    "Parameter Type":"Tipo de parâmetro",
+    "Data Type":"Tipo de dados",
+    "Response Messages":"Mensagens de resposta",
+    "HTTP Status Code":"Código de status HTTP",
+    "Reason":"Razão",
+    "Response Model":"Modelo resposta",
+    "Request URL":"URL requisição",
+    "Response Body":"Corpo da resposta",
+    "Response Code":"Código da resposta",
+    "Response Headers":"Cabeçalho da resposta",
+    "Hide Response":"Esconder resposta",
+    "Try it out!":"Tente agora!",
+    "Show/Hide":"Mostrar/Esconder",
+    "List Operations":"Listar operações",
+    "Expand Operations":"Expandir operações",
+    "Raw":"Cru",
+    "can't parse JSON.  Raw result":"Falha ao analisar JSON.  Resulto cru",
+    "Model Schema":"Modelo esquema",
+    "Model":"Modelo",
+    "apply":"Aplicar",
+    "Username":"Usuário",
+    "Password":"Senha",
+    "Terms of service":"Termos do serviço",
+    "Created by":"Criado por",
+    "See more at":"Veja mais em",
+    "Contact the developer":"Contate o desenvolvedor",
+    "api version":"Versão api",
+    "Response Content Type":"Tipo de conteúdo da resposta",
+    "fetching resource":"busca recurso",
+    "fetching resource list":"buscando lista de recursos",
+    "Explore":"Explorar",
+    "Show Swagger Petstore Example Apis":"Show Swagger Petstore Example Apis",
+    "Can't read from server.  It may not have the appropriate access-control-origin settings.":"Não é possível ler do servidor. Pode não ter as apropriadas configurações access-control-origin",
+    "Please specify the protocol for":"Por favor especifique o protocolo",
+    "Can't read swagger JSON from":"Não é possível ler o JSON Swagger de",
+    "Finished Loading Resource Information. Rendering Swagger UI":"Carregar informação de recurso finalizada. Renderizando Swagger UI",
+    "Unable to read api":"Não foi possível ler api",
+    "from path":"do caminho",
+    "server returned":"servidor retornou"
+});

dist/lang/ru.js

@@ -0,0 +1,52 @@
+'use strict';
+
+/* jshint quotmark: double */
+window.SwaggerTranslator.learn({
+    "Warning: Deprecated":"Ворнинг: Депрекейтед",
+    "Implementation Notes":"Заметки",
+    "Response Class":"Пример ответа",
+    "Status":"Статус",
+    "Parameters":"Параметры",
+    "Parameter":"Параметр",
+    "Value":"Значение",
+    "Description":"Описание",
+    "Parameter Type":"Тип параметра",
+    "Data Type":"Тип данных",
+    "HTTP Status Code":"HTTP код",
+    "Reason":"Причина",
+    "Response Model":"Структура ответа",
+    "Request URL":"URL запроса",
+    "Response Body":"Тело ответа",
+    "Response Code":"HTTP код ответа",
+    "Response Headers":"Заголовки ответа",
+    "Hide Response":"Спрятать ответ",
+    "Response Messages":"Что может прийти в ответ",
+    "Try it out!":"Попробовать!",
+    "Show/Hide":"Показать/Скрыть",
+    "List Operations":"Операции кратко",
+    "Expand Operations":"Операции подробно",
+    "Raw":"В сыром виде",
+    "can't parse JSON.  Raw result":"Не удается распарсить ответ:",
+    "Model Schema":"Структура",
+    "Model":"Описание",
+    "apply":"применить",
+    "Username":"Имя пользователя",
+    "Password":"Пароль",
+    "Terms of service":"Условия использования",
+    "Created by":"Разработано",
+    "See more at":"Еще тут",
+    "Contact the developer":"Связаться с разработчиком",
+    "api version":"Версия API",
+    "Response Content Type":"Content Type ответа",
+    "fetching resource":"Получение ресурса",
+    "fetching resource list":"Получение ресурсов",
+    "Explore":"Поехали",
+    "Show Swagger Petstore Example Apis":"Показать примеры АПИ",
+    "Can't read from server.  It may not have the appropriate access-control-origin settings.":"Не удается получить ответ от сервера. Возможно, какая-то лажа с настройками доступа",
+    "Please specify the protocol for":"Пожалуйста, укажите протогол для",
+    "Can't read swagger JSON from":"Не получается прочитать swagger json из",
+    "Finished Loading Resource Information. Rendering Swagger UI":"Загрузка информации о ресурсах завершена. Рендерим",
+    "Unable to read api":"Не удалось прочитать api",
+    "from path":"по адресу",
+    "server returned":"сервер сказал"
+});

dist/lang/translator.js

@@ -0,0 +1,39 @@
+'use strict';
+
+/**
+ * Translator for documentation pages.
+ *
+ * To enable translation you should include one of language-files in your index.html
+ * after <script src='lang/translator.js' type='text/javascript'></script>.
+ * For example - <script src='lang/ru.js' type='text/javascript'></script>
+ *
+ * If you wish to translate some new texsts you should do two things:
+ * 1. Add a new phrase pair ("New Phrase": "New Translation") into your language file (for example lang/ru.js). It will be great if you add it in other language files too.
+ * 2. Mark that text it templates this way <anyHtmlTag data-sw-translate>New Phrase</anyHtmlTag> or <anyHtmlTag data-sw-translate value='New Phrase'/>.
+ * The main thing here is attribute data-sw-translate. Only inner html, title-attribute and value-attribute are going to translate.
+ *
+ */
+window.SwaggerTranslator = {
+
+    _words:[],
+
+    translate: function(sel) {
+      var $this = this;
+      sel = sel || '[data-sw-translate]';
+
+      $(sel).each(function() {
+        $(this).html($this._tryTranslate($(this).html()));
+
+        $(this).val($this._tryTranslate($(this).val()));
+        $(this).attr('title', $this._tryTranslate($(this).attr('title')));
+      });
+    },
+
+    _tryTranslate: function(word) {
+      return this._words[$.trim(word)] !== undefined ? this._words[$.trim(word)] : word;
+    },
+
+    learn: function(wordsMap) {
+      this._words = wordsMap;
+    }
+};

dist/lib/swagger-oauth.js

@@ -5,6 +5,8 @@ var clientId;
 var realm;
 var oauth2KeyName;
 var redirect_uri;
+var clientSecret;
+var scopeSeparator;
 
 function handleLogin() {
   var scopes = [];
@@ -40,6 +42,7 @@ function handleLogin() {
     appName = window.swaggerUi.api.info.title;
   }
 
+  $('.api-popup-dialog').remove(); 
   popupDialog = $(
     [
       '<div class="api-popup-dialog">',
@@ -151,7 +154,7 @@ function handleLogin() {
     url += '&redirect_uri=' + encodeURIComponent(redirectUrl);
     url += '&realm=' + encodeURIComponent(realm);
     url += '&client_id=' + encodeURIComponent(clientId);
-    url += '&scope=' + encodeURIComponent(scopes.join(' '));
+    url += '&scope=' + encodeURIComponent(scopes.join(scopeSeparator));
     url += '&state=' + encodeURIComponent(state);
 
     window.open(url);
@@ -184,7 +187,9 @@ function initOAuth(opts) {
   popupMask = (o.popupMask||$('#api-common-mask'));
   popupDialog = (o.popupDialog||$('.api-popup-dialog'));
   clientId = (o.clientId||errors.push('missing client id'));
+  clientSecret = (o.clientSecret||errors.push('missing client secret'));
   realm = (o.realm||errors.push('missing realm'));
+  scopeSeparator = (o.scopeSeparator||' ');
 
   if(errors.length > 0){
     log('auth unable initialize oauth: ' + errors);
@@ -206,6 +211,7 @@ function initOAuth(opts) {
 window.processOAuthCode = function processOAuthCode(data) {
   var params = {
     'client_id': clientId,
+    'client_secret': clientSecret,
     'code': data.code,
     'grant_type': 'authorization_code',
     'redirect_uri': redirect_uri
@@ -240,7 +246,7 @@ window.onOAuthComplete = function onOAuthComplete(token) {
       if(b){
         // if all roles are satisfied
         var o = null;
-        $.each($('.auth #api_information_panel'), function(k, v) {
+        $.each($('.auth .api-ic .api_information_panel'), function(k, v) {
           var children = v;
           if(children && children.childNodes) {
             var requiredScopes = [];
@@ -257,7 +263,7 @@ window.onOAuthComplete = function onOAuthComplete(token) {
               }
             }
             if(diff.length > 0){
-              o = v.parentNode;
+              o = v.parentNode.parentNode;
               $(o.parentNode).find('.api-ic.ic-on').addClass('ic-off');
               $(o.parentNode).find('.api-ic.ic-on').removeClass('ic-on');
 
@@ -266,7 +272,7 @@ window.onOAuthComplete = function onOAuthComplete(token) {
               $(o).find('.api-ic').removeClass('ic-error');
             }
             else {
-              o = v.parentNode;
+              o = v.parentNode.parentNode;
               $(o.parentNode).find('.api-ic.ic-off').addClass('ic-on');
               $(o.parentNode).find('.api-ic.ic-off').removeClass('ic-off');
 

gulpfile.js

@@ -113,6 +113,12 @@ gulp.task('copy', ['less'], function() {
     .pipe(gulp.dest('./dist/lib'))
     .on('error', log);
 
+  // copy `lang` for translations
+  gulp
+    .src(['./lang/**/*.js'])
+    .pipe(gulp.dest('./dist/lang'))
+    .on('error', log);
+
   // copy all files inside html folder
   gulp
     .src(['./src/main/html/**/*'])

lang/es.js

@@ -0,0 +1,52 @@
+'use strict';
+
+/* jshint quotmark: double */
+window.SwaggerTranslator.learn({
+    "Warning: Deprecated":"Advertencia: Obsoleto",
+    "Implementation Notes":"Notas de implementación",
+    "Response Class":"Clase de la Respuesta",
+    "Status":"Status",
+    "Parameters":"Parámetros",
+    "Parameter":"Parámetro",
+    "Value":"Valor",
+    "Description":"Descripción",
+    "Parameter Type":"Tipo del Parámetro",
+    "Data Type":"Tipo del Dato",
+    "Response Messages":"Mensajes de la Respuesta",
+    "HTTP Status Code":"Código de Status HTTP",
+    "Reason":"Razón",
+    "Response Model":"Modelo de la Respuesta",
+    "Request URL":"URL de la Solicitud",
+    "Response Body":"Cuerpo de la Respuesta",
+    "Response Code":"Código de la Respuesta",
+    "Response Headers":"Encabezados de la Respuesta",
+    "Hide Response":"Ocultar Respuesta",
+    "Try it out!":"Pruébalo!",
+    "Show/Hide":"Mostrar/Ocultar",
+    "List Operations":"Listar Operaciones",
+    "Expand Operations":"Expandir Operaciones",
+    "Raw":"Crudo",
+    "can't parse JSON.  Raw result":"no puede parsear el JSON.  Resultado crudo",
+    "Model Schema":"Esquema del Modelo",
+    "Model":"Modelo",
+    "apply":"aplicar",
+    "Username":"Nombre de usuario",
+    "Password":"Contraseña",
+    "Terms of service":"Términos de Servicio",
+    "Created by":"Creado por",
+    "See more at":"Ver más en",
+    "Contact the developer":"Contactar al desarrollador",
+    "api version":"versión de la api",
+    "Response Content Type":"Tipo de Contenido (Content Type) de la Respuesta",
+    "fetching resource":"buscando recurso",
+    "fetching resource list":"buscando lista del recurso",
+    "Explore":"Explorar",
+    "Show Swagger Petstore Example Apis":"Mostrar Api Ejemplo de Swagger Petstore",
+    "Can't read from server.  It may not have the appropriate access-control-origin settings.":"No se puede leer del servidor. Tal vez no tiene la configuración de control de acceso de origen (access-control-origin) apropiado.",
+    "Please specify the protocol for":"Por favor, especificar el protocola para",
+    "Can't read swagger JSON from":"No se puede leer el JSON de swagger desde",
+    "Finished Loading Resource Information. Rendering Swagger UI":"Finalizada la carga del recurso de Información. Mostrando Swagger UI",
+    "Unable to read api":"No se puede leer la api",
+    "from path":"desde ruta",
+    "server returned":"el servidor retornó"
+});

lang/translator.js

@@ -17,10 +17,11 @@ window.SwaggerTranslator = {
 
     _words:[],
 
-    translate: function() {
+    translate: function(sel) {
       var $this = this;
+      sel = sel || '[data-sw-translate]';
 
-      $('[data-sw-translate]').each(function() {
+      $(sel).each(function() {
         $(this).html($this._tryTranslate($(this).html()));
 
         $(this).val($this._tryTranslate($(this).val()));

lib/swagger-oauth.js

@@ -5,6 +5,8 @@ var clientId;
 var realm;
 var oauth2KeyName;
 var redirect_uri;
+var clientSecret;
+var scopeSeparator;
 
 function handleLogin() {
   var scopes = [];
@@ -40,6 +42,7 @@ function handleLogin() {
     appName = window.swaggerUi.api.info.title;
   }
 
+  $('.api-popup-dialog').remove(); 
   popupDialog = $(
     [
       '<div class="api-popup-dialog">',
@@ -151,7 +154,7 @@ function handleLogin() {
     url += '&redirect_uri=' + encodeURIComponent(redirectUrl);
     url += '&realm=' + encodeURIComponent(realm);
     url += '&client_id=' + encodeURIComponent(clientId);
-    url += '&scope=' + encodeURIComponent(scopes.join(' '));
+    url += '&scope=' + encodeURIComponent(scopes.join(scopeSeparator));
     url += '&state=' + encodeURIComponent(state);
 
     window.open(url);
@@ -184,7 +187,9 @@ function initOAuth(opts) {
   popupMask = (o.popupMask||$('#api-common-mask'));
   popupDialog = (o.popupDialog||$('.api-popup-dialog'));
   clientId = (o.clientId||errors.push('missing client id'));
+  clientSecret = (o.clientSecret||errors.push('missing client secret'));
   realm = (o.realm||errors.push('missing realm'));
+  scopeSeparator = (o.scopeSeparator||' ');
 
   if(errors.length > 0){
     log('auth unable initialize oauth: ' + errors);
@@ -206,6 +211,7 @@ function initOAuth(opts) {
 window.processOAuthCode = function processOAuthCode(data) {
   var params = {
     'client_id': clientId,
+    'client_secret': clientSecret,
     'code': data.code,
     'grant_type': 'authorization_code',
     'redirect_uri': redirect_uri
@@ -240,7 +246,7 @@ window.onOAuthComplete = function onOAuthComplete(token) {
       if(b){
         // if all roles are satisfied
         var o = null;
-        $.each($('.auth #api_information_panel'), function(k, v) {
+        $.each($('.auth .api-ic .api_information_panel'), function(k, v) {
           var children = v;
           if(children && children.childNodes) {
             var requiredScopes = [];
@@ -257,7 +263,7 @@ window.onOAuthComplete = function onOAuthComplete(token) {
               }
             }
             if(diff.length > 0){
-              o = v.parentNode;
+              o = v.parentNode.parentNode;
               $(o.parentNode).find('.api-ic.ic-on').addClass('ic-off');
               $(o.parentNode).find('.api-ic.ic-on').removeClass('ic-on');
 
@@ -266,7 +272,7 @@ window.onOAuthComplete = function onOAuthComplete(token) {
               $(o).find('.api-ic').removeClass('ic-error');
             }
             else {
-              o = v.parentNode;
+              o = v.parentNode.parentNode;
               $(o.parentNode).find('.api-ic.ic-off').addClass('ic-on');
               $(o.parentNode).find('.api-ic.ic-off').removeClass('ic-off');
 

package.json

@@ -10,7 +10,7 @@
   "description": "Swagger UI is a dependency-free collection of HTML, JavaScript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API",
   "version": "2.1.0",
   "homepage": "http://swagger.io",
-  "license": "Apache 2.0",
+  "license": "Apache-2.0",
   "main": "dist/swagger-ui.js",
   "scripts": {
     "build": "gulp",

src/main/html/css/screen.css

@@ -1155,8 +1155,16 @@
 .swagger-section .auth {
   float: right;
 }
-.swagger-section #api_information_panel {
+.swagger-section .api-ic {
-  position: absolute;
+  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 {
+.swagger-section .api-ic:hover .api_information_panel {
-  height: 18px;
+  position: absolute;
-  vertical-align: middle;
+  display: block;
-  display: inline-block;
-  background: url(../images/explorer_icons.png) no-repeat;
 }
 .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 {

src/main/html/index.html

@@ -22,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=([^&]+)/);
@@ -30,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",
@@ -38,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)
           });
@@ -92,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>

src/main/javascript/SwaggerUi.js

@@ -173,9 +173,13 @@ window.SwaggerUi = Backbone.Router.extend({
     if (data === undefined) {
       data = '';
     }
-    $('#message-bar').removeClass('message-fail');
+    var $msgbar = $('#message-bar');
-    $('#message-bar').addClass('message-success');
+    $msgbar.removeClass('message-fail');
-    $('#message-bar').text(data);
+    $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 {

src/main/javascript/helpers/handlebars.js

@@ -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);

src/main/javascript/view/MainView.js

@@ -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 {

src/main/javascript/view/OperationView.js

@@ -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',
   },
 
@@ -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') {
+              if (key === auth.name) {
-                this.model.oauth = {};
+                if (auth.type === 'oauth2') {
-                this.model.oauth.scopes = [];
+                  this.model.oauth = {};
-                ref1 = auth.value.scopes;
+                  this.model.oauth.scopes = [];
-                for (k in ref1) {
+                  ref1 = auth.value.scopes;
-                  v = ref1[k];
+                  for (k in ref1) {
-                  scopeIndex = auths[key].indexOf(k);
+                    v = ref1[k];
-                  if (scopeIndex >= 0) {
+                    scopeIndex = auths[key].indexOf(k);
-                    o = {
+                    if (scopeIndex >= 0) {
-                      scope: k,
+                      o = {
-                      description: v
+                        scope: k,
-                    };
+                        description: v
-                    this.model.oauth.scopes.push(o);
+                      };
+                      this.model.oauth.scopes.push(o);
+                    }
                   }
                 }
               }

src/main/javascript/view/SignatureView.js

@@ -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);
       }
     }

src/main/less/screen.less

@@ -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 {

src/main/template/apikey_button_view.handlebars

@@ -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>
-

src/main/template/basic_auth_button_view.handlebars

@@ -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>

src/main/template/main.handlebars

@@ -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.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'>Created by {{info.contact.name}}</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'>See more at <a href="{{info.contact.url}}">{{info.contact.url}}</a></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}}">Contact the developer</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>

src/main/template/operation.handlebars

@@ -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" />
@@ -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>

src/main/template/param_list.handlebars

@@ -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}}">
 

src/main/template/resource.handlebars

@@ -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>

src/main/template/signature.handlebars

@@ -1,7 +1,7 @@
 <div>
 <ul class="signature-nav">
-  <li><a class="description-link" href="#">Model</a></li>
+  <li><a class="description-link" href="#" data-sw-translate>Model</a></li>
-  <li><a class="snippet-link" href="#">Model Schema</a></li>
+  <li><a class="snippet-link" href="#" data-sw-translate>Model Schema</a></li>
 </ul>
 <div>