<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>API Docs</title>
  <link rel="SHORTCUT ICON" href="images/favicon.ico"/>
  <link href='css/typography.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'/>
  <link href='css/reset.css' media='print' rel='stylesheet' type='text/css'/>
  <link href='css/print.css' media='print' rel='stylesheet' type='text/css'/>
  <!--Custom: Take from application\frontend\nfv-client\dist\optimize\resources\nfv\css\style.css-->
  <link href='css/custom-style.css' rel='stylesheet' type='text/css'/>
  <!--/Custom: Take from application\frontend\nfv-client\dist\optimize\resources\nfv\css\style.css-->

  <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>
  <script src='lib/jquery.ba-bbq.min.js' type='text/javascript'></script>
  <script src='lib/handlebars-2.0.0.js' type='text/javascript'></script>
  <script src='lib/underscore-min.js' type='text/javascript'></script>
  <script src='lib/backbone-min.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>
  <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.protocol + "//" + window.location.host;
      if (window.location.pathname.indexOf('/api-docs') > 0) {
        url += window.location.pathname.substring(0, window.location.pathname.indexOf('/api-docs'))
      }
      url += "/activity-spec-api-docs/api.json";
      log('API URL: ' + url);

      // Pre load translate...
      if(window.SwaggerTranslator) {
        window.SwaggerTranslator.translate();
      }
      window.swaggerUi = new SwaggerUi({
        url: url,
        dom_id: "swagger-ui-container",
        supportedSubmitMethods: ['get', 'post', 'put', 'delete', 'patch'],
        onComplete: function(swaggerApi, swaggerUi){
          if(typeof initOAuth == "function") {
            initOAuth({
              clientId: "your-client-id",
              clientSecret: "your-client-secret",
              realm: "your-realms",
              appName: "your-app-name", 
              scopeSeparator: ","
            });
          }

          if(window.SwaggerTranslator) {
            window.SwaggerTranslator.translate();
          }

          $('pre code').each(function(i, e) {
            hljs.highlightBlock(e)
          });

        },
        onFailure: function(data) {
          log("Unable to Load SwaggerUI");
        },
        docExpansion: "none",
        apisSorter: "alpha",
        showRequestHeaders: false
      });


      window.swaggerUi.load();

      function log() {
        if ('console' in window) {
          console.log.apply(console, arguments);
        }
      }
  });
  </script>

    <!-- Hide the swagger io  -->
    <style>
        .footer a, .footer img{
            display: none !important;
        }
    </style>
</head>

<body class="swagger-section">

<!--NCSO script-->
<script>

  //SET TITLE - START
  function pollData() {
    if(!(document.querySelector('#api_info .info_title') && document.querySelector('#api_info .info_title').innerText)) {
      setTimeout(pollData, 50);
    }
    else {
      setData();
    }
  }

  function setData() {
    document.querySelector('[data-uxf-point="main-title"]').innerText = document.querySelector('#api_info .info_title').innerText;
    document.querySelector('#api_info .info_title').innerText = '';
  }

  pollData();
  //SET TITLE - END

  var __LOGIN_REST_STATUS = {OPEN: 'OPEN', SEND: 'SEND'};
  var __loginPath = '/auth/tokens', __isLoginInProcess, __xAuthToken;

  function isAuthanticationRest(path) {
      return path.endsWith(__loginPath);
  }

  //Proxy requests - START

  //Proxy Open Method
  (function() {
      var proxiedOpen = window.XMLHttpRequest.prototype.open;
      window.XMLHttpRequest.prototype.open = function(method, path) {
          if(isAuthanticationRest(path)) {
              __isLoginInProcess = true;
          }
          else {
              __isLoginInProcess = false;
          }
          return proxiedOpen.apply(this, Array.prototype.slice.call(arguments));
      };
  })();

  //Proxy Send Method - X-AUTH-STUFF
  (function() {
      var proxiedSend = window.XMLHttpRequest.prototype.send;
      window.XMLHttpRequest.prototype.send = function() {
          if(__isLoginInProcess) {
              proxyAuthanticationCallback(this);
          }
          return proxiedSend.apply(this, Array.prototype.slice.call(arguments));
      };
  })();

  //Proxy Authantication Callback Method - X-AUTH-STUFF
  function proxyAuthanticationCallback(xhrObject) {
      var proxy = xhrObject.onreadystatechange;
      xhrObject.onreadystatechange = function() {
          if (xhrObject.readyState == 4) {
              if(xhrObject.status == 200 || xhrObject.status == 401) {
                  window.swaggerUi.api.clientAuthorizations.remove('X-AUTH-TOKEN');
                  if(xhrObject.status == 200) {
                      var key = xhrObject.getResponseHeader('x-auth-token');
                      if(key && key.trim() != "") {
                          var apiKeyAuth = new SwaggerClient.ApiKeyAuthorization("X-AUTH-TOKEN", key, "header");
                          window.swaggerUi.api.clientAuthorizations.add("X-AUTH-TOKEN", apiKeyAuth);
                          console.log("added x-auth-key ", key);
                      }
                  }
              }
          }
          return proxy.apply(xhrObject, Array.prototype.slice.call(arguments));
      }
  }

  //Proxy Send Method - CUSTOM HEADERS STUFF
  (function () {
      var proxiedSend = window.XMLHttpRequest.prototype.send;
      window.XMLHttpRequest.prototype.send = function () {
          var headerItems = document.querySelectorAll('.custom-headers .headers-list .header-item');
          if (headerItems) {
              Array.prototype.forEach.call(headerItems, function (header) {
                  var headerName = header.querySelector('.header-name').value;
                  var headerValue = header.querySelector('.header-value').value;
                  if (headerName && headerValue) {
                      this.setRequestHeader(headerName, headerValue);
                  }
              }, this);
          }
          return proxiedSend.apply(this, Array.prototype.slice.call(arguments));
      };
  })();

  //Proxy requests - END

</script>

<div data-uxf-point="nfv-header" class="nfv-header">
  <div class="header-content-wrapper">
    <div data-uxf-point="nfv-logo" class="nfv-logo"><a href="../ncso/landingpage.html">VENDOR</a></div>
    <div data-uxf-point="header-title" class="header-title">
      <div data-uxf-point="main-title" class="main-title"></div>
      <div data-uxf-point="version-controller" class="version-select"></div>
      <div data-uxf-point="sub-title" class="sub-title"></div>
    </div>
  </div>
</div>

<div class="custom-headers">
    <style>
        .custom-headers {
            margin-left: 124px;
            width: 500px;
            border: 1px solid #419EF1;
        }

        .custom-headers .headers-title {
            background-color: #0F6AB4;
            height: 24px;
            color: white;
            text-align: center;
            font-size: 1.2em;
        }

        .custom-headers .headers-list .header-item {
            display: flex;
            justify-content: space-around;
            padding: 10px 5px 0 5px;
        }

        .custom-headers .headers-list .header-item.default-item .header-col.header-delete {
            visibility: hidden;
        }

        .custom-headers .headers-list .header-item.default-item .header-col.header-name {
            pointer-events: none;
        }

        .custom-headers .headers-list .header-item .header-col.header-delete {
            cursor: pointer;
            align-self: center;
        }

        .custom-headers .add-header {
            text-align: right;
            padding: 5px;
            border-top: 1px solid #0F6AB4;
            margin-top: 10px;
            background-color: #E7F6EC;
        }

        .custom-headers .add-header .add-header-button, .custom-headers .add-header .reset-header-button {

            text-decoration: none;
            color: white;
            display: inline-block;
            width: 50px;
            font-size: 0.9em;
            text-align: center;
            padding: 7px 0 4px;
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
            -o-border-radius: 2px;
            -ms-border-radius: 2px;
            -khtml-border-radius: 2px;
            border-radius: 2px;
            background-color: #0f6ab4;
            cursor: pointer;
        }

        .custom-headers .add-header .reset-header-button {

        }
    </style>
    <div class="headers-title">Custom Headers</div>
    <div class="headers-list">
        <!--Dynamically add headers using addHeaderItem function-->
    </div>
    <div class="add-header">
        <span class="reset-header-button" onclick="resetHeaderItems();">Reset</span>
        <span class="add-header-button" onclick="addHeaderItem();">Add</span>
    </div>
    <script>
        function addHeaderItem(defaultName, defaultValue) {

            var headerItemName = document.createElement('input');
            headerItemName.type = 'text';
            headerItemName.value = defaultName || '';
            headerItemName.classList.add('header-col', 'header-name');

            var headerItemValue = document.createElement('input');
            headerItemValue.type = 'text';
            headerItemValue.value = defaultValue || '';
            headerItemValue.classList.add('header-col', 'header-value');

            var headerItemDelete = document.createElement('div');
            headerItemDelete.innerHTML = '&#10006;';
            headerItemDelete.classList.add('header-col', 'header-delete');

            var headerItem = document.createElement('div');
            headerItem.classList.add('header-item');
            headerItem.appendChild(headerItemName);
            headerItem.appendChild(headerItemValue);
            headerItem.appendChild(headerItemDelete);

            headerItemDelete.onclick = function () {
                headersList.removeChild(headerItem);
            };

            var headersList = document.querySelector('.custom-headers .headers-list');
            headersList.appendChild(headerItem);

            return headerItem;
        }
        function resetHeaderItems() {
            var headersList = document.querySelector('.custom-headers .headers-list');
            while (headersList.firstChild) {
                headersList.removeChild(headersList.firstChild);
            }
            var defaultHeaderItem = addHeaderItem('USER_ID');
            defaultHeaderItem.classList.add('default-item');
        }
        resetHeaderItems();
    </script>
</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>