[auth]: Api key, basic authorization in main view

src/main/html/css/print.css

@@ -124,11 +124,11 @@
   display: block;
   overflow-x: auto;
   padding: 0.5em;
-  background: #F0F0F0;
+  background: #f0f0f0;
 }
 .swagger-section .hljs,
 .swagger-section .hljs-subst {
-  color: #444;
+  color: #444444;
 }
 .swagger-section .hljs-keyword,
 .swagger-section .hljs-attribute,
@@ -143,7 +143,7 @@
 .swagger-section .hljs-bullet,
 .swagger-section .hljs-code,
 .swagger-section .hljs-addition {
-  color: #1F811F;
+  color: #1f811f;
 }
 .swagger-section .hljs-regexp,
 .swagger-section .hljs-symbol,
@@ -152,7 +152,7 @@
 .swagger-section .hljs-link,
 .swagger-section .hljs-selector-attr,
 .swagger-section .hljs-selector-pseudo {
-  color: #BC6060;
+  color: #bc6060;
 }
 .swagger-section .hljs-type,
 .swagger-section .hljs-string,
@@ -173,7 +173,7 @@
   color: #888888;
 }
 .swagger-section .hljs-meta {
-  color: #2B6EA1;
+  color: #2b6ea1;
 }
 .swagger-section .hljs-emphasis {
   font-style: italic;
@@ -1181,10 +1181,6 @@
 .swagger-section .oauth_submit {
   text-align: center;
 }
-.swagger-section .authorize__btn:hover {
-  text-decoration: underline;
-  cursor: pointer;
-}
 .swagger-section .auth_container .basic_auth__title {
   color: #547f00;
   font-size: 1.2em;

src/main/html/css/screen.css

@@ -124,11 +124,11 @@
   display: block;
   overflow-x: auto;
   padding: 0.5em;
-  background: #F0F0F0;
+  background: #f0f0f0;
 }
 .swagger-section .hljs,
 .swagger-section .hljs-subst {
-  color: #444;
+  color: #444444;
 }
 .swagger-section .hljs-keyword,
 .swagger-section .hljs-attribute,
@@ -143,7 +143,7 @@
 .swagger-section .hljs-bullet,
 .swagger-section .hljs-code,
 .swagger-section .hljs-addition {
-  color: #1F811F;
+  color: #1f811f;
 }
 .swagger-section .hljs-regexp,
 .swagger-section .hljs-symbol,
@@ -152,7 +152,7 @@
 .swagger-section .hljs-link,
 .swagger-section .hljs-selector-attr,
 .swagger-section .hljs-selector-pseudo {
-  color: #BC6060;
+  color: #bc6060;
 }
 .swagger-section .hljs-type,
 .swagger-section .hljs-string,
@@ -173,7 +173,7 @@
   color: #888888;
 }
 .swagger-section .hljs-meta {
-  color: #2B6EA1;
+  color: #2b6ea1;
 }
 .swagger-section .hljs-emphasis {
   font-style: italic;
@@ -1181,10 +1181,6 @@
 .swagger-section .oauth_submit {
   text-align: center;
 }
-.swagger-section .authorize__btn:hover {
-  text-decoration: underline;
-  cursor: pointer;
-}
 .swagger-section .auth_container .basic_auth__title {
   color: #547f00;
   font-size: 1.2em;

src/main/javascript/view/ApiKeyButton.js

@@ -14,7 +14,7 @@ SwaggerUi.Views.ApiKeyButton = Backbone.View.extend({ // TODO: append this to gl
   },
 
   render: function(){
-    this.$el.html(this.template(this.model));
+    $(this.el).html(this.template(this.model));
 
     return this;
   },

src/main/javascript/view/MainView.js

@@ -89,9 +89,18 @@ SwaggerUi.Views.MainView = Backbone.View.extend({
     $(this.el).html(Handlebars.templates.main(this.model));
     this.model.securityDefinitions = this.model.securityDefinitions || {};
 
-    if (this.model.securityDefinitions) {
+    for (name in this.model.securityDefinitions) {
-      this.authView = new SwaggerUi.Views.AuthView({model: this.model.securityDefinitions});
+      auth = this.model.securityDefinitions[name];
-      this.$('.authorize-wrapper').append(this.authView.render().el);
+
+      if (auth.type === 'apiKey') {
+        authEl = new SwaggerUi.Views.ApiKeyButton({model: auth, router:  this.router}).render().el;
+        $('.auth_main_container').append(authEl);
+      }
+
+      if (auth.type === 'basic' && $('.auth_main_container .basic_auth_container').length === 0) {
+        authEl = new SwaggerUi.Views.BasicAuthButton({model: auth, router: this.router}).render().el;
+        $('.auth_main_container').append(authEl);
+      }
     }
 
     // Render each resource

src/main/javascript/view/OperationView.js

@@ -91,54 +91,9 @@ SwaggerUi.Views.OperationView = Backbone.View.extend({
       this.model.isReadOnly = true;
     }
     this.model.description = this.model.description || this.model.notes;
-    this.model.oauth = null;
+
-    modelAuths = this.model.authorizations || this.model.security;
+    this.handleAuth();
-    if (modelAuths) {
+
-      if (Array.isArray(modelAuths)) {
-        for (l = 0, len = modelAuths.length; l < len; l++) {
-          auths = modelAuths[l];
-          for (key in auths) {
-            for (a in this.auths) {
-              auth = this.auths[a];
-              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);
-                    }
-                  }
-                }
-              }
-            }
-          }
-        }
-      } else {
-        for (k in modelAuths) {
-          v = modelAuths[k];
-          if (k === 'oauth2') {
-            if (this.model.oauth === null) {
-              this.model.oauth = {};
-            }
-            if (this.model.oauth.scopes === void 0) {
-              this.model.oauth.scopes = [];
-            }
-            for (m = 0, len1 = v.length; m < len1; m++) {
-              o = v[m];
-              this.model.oauth.scopes.push(o);
-            }
-          }
-        }
-      }
-    }
     if (typeof this.model.responses !== 'undefined') {
       this.model.responseMessages = [];
       ref2 = this.model.responses;
@@ -849,6 +804,95 @@ SwaggerUi.Views.OperationView = Backbone.View.extend({
       }
     }
     return null;
+  },
+
+  handleAuth: function () {
+    var modelAuths, auths, i, l, len, len1, ref1, scopeIndex;
+    var definitionsMap = {};
+
+    this.auths = this.auths || [];
+
+    for (l = 0, len = this.auths.length; l < len; l++) {
+      definitionsMap[this.auths[l].name] = this.auths[l].value;
+    }
+
+    this.model.oauth = null;
+
+    modelAuths = this.model.authorizations || this.model.security;
+
+    if (!modelAuths) { return null; }
+
+    if (Array.isArray(modelAuths)) {
+      modelAuths.forEach(function (security) {
+        for (i in security) {
+          security[i] = security[i] || {};
+          switch (security[i].type) {
+            case 'apiKey': break;
+            case 'basic': break;
+            default:
+                  //handle from definitions
+          }
+        }
+      });
+    }
+
+
+    if (Array.isArray(modelAuths)) {
+      for (l = 0, len = modelAuths.length; l < len; l++) {
+
+        //auths - single auth from security
+        auths = modelAuths[l];
+        for (key in auths) {
+
+          //this.auths - auth from definitions
+          for (a in this.auths) {
+            //auth - one single auth from definition
+            auth = this.auths[a];
+
+            // if security name is in definitions
+            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);
+                  }
+                }
+              }
+              //if (auth.type === 'apiKey') {
+              //  console.log('apiKey')
+              //}
+            }
+          }
+        }
+      }
+    } else {
+      for (k in modelAuths) {
+        v = modelAuths[k];
+        if (k === 'oauth2') {
+          if (this.model.oauth === null) {
+            this.model.oauth = {};
+          }
+          if (this.model.oauth.scopes === void 0) {
+            this.model.oauth.scopes = [];
+          }
+          for (m = 0, len1 = v.length; m < len1; m++) {
+            o = v[m];
+            this.model.oauth.scopes.push(o);
+          }
+        }
+      }
+    }
+
   }
 
 });

src/main/less/auth.less

@@ -19,13 +19,6 @@
 
   .oauth_submit { text-align: center; }
 
-  .authorize__btn {
-    &:hover {
-      text-decoration: underline;
-      cursor: pointer;
-    }
-  }
-
   .auth_container {
 
     .basic_auth__title {

src/main/template/main.handlebars

@@ -16,8 +16,6 @@
 <div class='container' id='resources_container'>
   <div class="auth_main_container"></div>
 
-  <div class='authorize-wrapper'></div>
-
   <ul id='resources'></ul>
 
   <div class="footer">