<commit_before>{% extends "common/base.html" %} {% block title %} <title>OOI User Interface - API Documentation</title> {% endblock %} {% block beforebootstrap %} {% endblock %} {% block head %} <link href="/css/custom/banner.css" rel="stylesheet" type="text/css" /> <link href="/css/custom/navbar.css" rel="stylesheet" type="text/css" /> <link href="/css/custom/custom.css" rel="stylesheet" type="text/css" /> <link href="/css/common/patchNotes.css" rel="stylesheet" type="text/css" /> <!-- Partials --> <script src="/js/partials/compiled/index.js" type="text/javascript"></script> <script src="/js/compiled/index.js" type="text/javascript"></script> <script src="/js/partials/compiled/landingPages.js" type="text/javascript"></script> <script src="/js/compiled/landingPages.js" type="text/javascript"></script> <script src="/js/partials/compiled/patch_notes.js" type="text/javascript"></script> <script src="/js/models/common/uiPatchNotes.js" type="text/javascript"></script> <script src="/js/models/common/uFramePatchNotes.js" type="text/javascript"></script>
  <script src="/js/views/common/PatchNotes.js" type="text/javascript"></script>

  <link href="/css/json2html/google-code-prettify/prettify.css" rel="stylesheet">
  <link href='/css/json2html/layout.css' media='all' type='text/css' rel='stylesheet'/>
  <link href='/css/json2html/index.css' media='all' type='text/css' rel='stylesheet'/>
  <script src="/js/core/json2html/jquery.json2html.js" type="text/javascript"></script>
  <script src="/js/core/json2html/json2html.js" type="text/javascript"></script>

{% endblock %}



{%block body %}
  <div class="container-fluid">
    <div id="navbar" class="row"></div>
  </div>

  <div id="wrapper" style="padding-left: 0px">
    <div id="page-content-wrapper">
      <div class="container-fluid">

        <div class="row">
          <div class="col-xs-6 col-sm-6 col-md-6" id="apimenu"><h1>OOI API Menu</h1></div>
          <div class="col-xs-6 col-sm-6 col-md-6" id="apimenuDynamic"><h1>Definitions & Examples</h1><h3 style="text-align: left;" id="selectedApi"></h3></div>
        </div>

        <div class="row">
          <div class="col-xs-6 col-sm-6 col-md-6" id="ui"><h2></h2><pre id="currentDoc" style="height: 60vh;"></pre></div>
          <div class="col-xs-6 col-sm-6 col-md-6" id="uiDynamic"></div>
        </div>

      </div><!--container-fluid -->
    </div><!-- page-content-wrapper -->
  </div><!-- wrapper -->

  <!-- fade in image -->
  <script>
    $(document).ready(function() {
      $(".delayImg").each(function() {
        this.onload = function() {
          $(this).animate({opacity: 1}, 2000);
        };
        this.src = this.getAttribute("delayedSrc");
      });
    });
  </script>

  <script type="text/javascript">

    var bannerTitle = "OOI API Documentation";
    var userInfo = {};

    var checkUser = function() {
      var userModel = new UserModel();
      userModel.url = '/api/current_user';


      //var userInfo = {};
      userModel.fetch({
        success: function (collection, response, options) {
          // console.log('user response:');
          // console.log(response);
          userInfo['api_user_name'] = response.api_user_name;
          userInfo['api_user_token'] = response.api_user_token;
          // console.log('userInfo');
          // console.log(userInfo);
        },
        error: function( req, status, err ) {
          // console.log('error');
          // console.log(req.statusText);
        }
      });
    };

    var openHelp = function(title, route){
      $.ajax(route, {
        type: 'GET',
        dataType: 'json',
        async: false,
        headers: {
          "Authorization": "Basic " + btoa(userInfo.api_user_name + ":" + userInfo.api_user_token)
        },
        success: function( response ) {
          // console.log('help response');
          // console.log(response);
          $('#ui').find('#currentDoc').replaceWith("<pre id=\"currentDoc\" style=\"height: 60vh;\">" + _.escape(response.message) + '</pre>');
          // console.log(resp);
          if (route !== '/api/m2m/help' && route !== '/api/m2m/help/12587') {
            openHelpJson(title, route);
          }else{
            $('#uiDynamic').html('');
            $('#selectedApi').text(title);
          }

          if (route == '/api/m2m/help/12587' || route.indexOf('12587') !== -1){
            var actionButtons = "<div id='assetButtons' style='display: flex; flex-flow: wrap; justify-content: left;'>";
            {#
            http://server/api/m2m/help/12587                # This help message
            http://server/api/m2m/help/12587/asset          # uframe REST queries for asset objects
            http://server/api/m2m/help/12587/event          # uframe REST queries for event(s)
            http://server/api/m2m/help/12587/deployment     # uframe REST queries for deployment events
            http://server/api/m2m/help/12587/cal            # uframe REST queries for calibration events
            http://server/api/m2m/help/12587/cruise         # uframe REST queries for cruise events
            http://server/api/m2m/help/12587/status         # uframe REST queries for status events
            http://server/api/m2m/help/12587/all            # uframe REST queries for all topics
            #}

            actionButtons += "<button type='button' title='Asset Objects' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Asset Objects', '/api/m2m/help/12587/asset');\"><i style='font-size:14px;float:left;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i>Asset Objects</button>";

            actionButtons += "<button type='button' title='Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Events', '/api/m2m/help/12587/event');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Events</button>";

            actionButtons += "<button type='button' title='Deployment Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Deployment Events', '/api/m2m/help/12587/deployment');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Deployment Events</button>";

            actionButtons += "<button type='button' title='Calibration Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Calibration Events', '/api/m2m/help/12587/cal');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Calibration Events</button>";

            actionButtons += "<button type='button' title='Cruise Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Cruise Events', '/api/m2m/help/12587/cruise');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Cruise Events</button>";

            actionButtons += "<button type='button' title='Status Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Status Events', '/api/m2m/help/12587/status');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Status Events</button>";

            actionButtons += "<button type='button' title='All Topics' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - All Topics', '/api/m2m/help/12587/all');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>All Topics</button>";

            actionButtons += "</div></div>";
            $('#apimenu').find('#assetButtons').remove();
            $('#apimenu').append(actionButtons);
          }else{
            $('#apimenu').find('#assetButtons').remove();
          }

        },
        error: function( req, status, err ) {
          // console.log(req);
          var errorMessage = '<div><h3>An error occurred getting M2M help documentation for the current user:</h3></div>';
          errorMessage += '<div><h4>' + req.statusText + '</h4></div>';
          errorMessage += '</br>';
          if(req.responseJSON){
            errorMessage += '<div><h4>' + req.responseJSON['message'] + '</h4></div>';
          }

          var errorModal = new ModalDialogView();
          errorModal.show({
            message: errorMessage,
            type: "danger"
          });
        }
      });
    };

    var openHelpJson = function(title, route){
      $.ajax(route+"?json=True", {
        type: 'GET',
        dataType: 'json',
        async: false,
        headers: {
          "Authorization": "Basic " + btoa(userInfo.api_user_name + ":" + userInfo.api_user_token)
        },
        success: function( response ) {
          // console.log('help json response');
          // console.log(response);

          var dynamicOutput = "";
          _.each(response.message, function(helpItem){
            // console.log('helpItem');
            // console.log(helpItem);
            dynamicOutput += "[" + helpItem.endpoint + "] " + helpItem['description'] + "<br>";
          });

          //$('#uiDynamic').find('#currentDynamic').replaceWith("<pre id=\"currentDynamic\" style=\"height: 60vh;\">" + dynamicOutput + '</pre>');
          visualize(response.message, route);
          $('#selectedApi').text(title);
          // console.log(resp);
        },
        error: function( req, status, err ) {
          // console.log(req);
          var errorMessage = '<div><h3>An error occurred getting M2M help documentation for the current user:</h3></div>';
          errorMessage += '<div><h4>' + req.statusText + '</h4></div>';
          errorMessage += '</br>';
          if(req.responseJSON){
            errorMessage += '<div><h4>' + req.responseJSON['message'] + '</h4></div>';
          }

          var errorModal = new ModalDialogView();
          errorModal.show({
            message: errorMessage,
            type: "danger"
          });
        }
      });
    };

    var transforms = {
      'object':{'tag':'div','class':'package ${show} ${type}','children':[
        {'tag':'div','class':'header','children':[
          {'tag':'div','class':function(obj){

            var classes = ["arrow"];

            if( getValue(obj.value) !== undefined ) classes.push("hide");

            return(classes.join(' '));
          }},
          {'tag':'span','class':'name','html':'${name}'},
          {'tag':'span','class':'value','html':function(obj) {
            var value = getValue(obj.value);
            if( value !== undefined ) return(" : " + value);
            else return('');
          }}
          //,{'tag':'span','class':'type','html':'${type}'}
        ]},
        {'tag':'div','class':'children','children':function(obj){return(children(obj.value));}}
      ]}
    };

    function visualize(json, headerText) {

      $('#uiDynamic').html('');

      $('#uiDynamic').json2html(convert(headerText,json,'open'),transforms.object);

      regEvents();
    }

    function getValue(obj) {
      var type = $.type(obj);

      //Determine if this object has children
      switch(type) {
        case 'array':
        case 'object':
          return(undefined);
          break;

        case 'function':
          //none
          return('function');
          break;

        case 'string':
          return("'" + obj + "'");
          break;

        default:
          return(obj);
          break;
      }
    }

    //Transform the children
    function children(obj){
      var type = $.type(obj);

      //Determine if this object has children
      switch(type) {
        case 'array':
        case 'object':
          return(json2html.transform(obj,transforms.object));
          break;

        default:
          //This must be a litteral
          break;
      }
    }

    function convert(name,obj,show) {

      var type = $.type(obj);

      if(show === undefined) show = 'closed';

      var children = [];

      //Determine the type of this object
      switch(type) {
        case 'array':
          //Transform array
          //Itterrate through the array and add it to the elements array
          var len=obj.length;
          for(var j=0;j<len;++j){
            //Concat the return elements from this objects tranformation
            var title = j;
            // console.log(obj);
            if(($.type(obj[j]) === 'object') && obj[j].hasOwnProperty('description')){
              title = obj[j].description;
            }
            if(($.type(obj[j]) === 'object') && obj[j].hasOwnProperty('sample_request')){
              title = obj[j].sample_request;
            }
            children[j] = convert(title,obj[j]);
          }
          break;

        case 'object':
          //Transform Object
          var j = 0;
          for(var prop in obj) {
            children[j] = convert(prop,obj[prop]);
            j++;
          }
          break;

        default:
          //This must be a litteral (or function)
          children = obj;
          break;
      }

      return( {'name':name,'value':children,'type':type,'show':show} );

    }

    function regEvents() {

      $('.header').click(function(){
        var parent = $(this).parent();

        if(parent.hasClass('closed')) {
          parent.removeClass('closed');
          parent.addClass('open');
        } else {
          parent.removeClass('open');
          parent.addClass('closed');
        }
      });
    }

    _.extend(OOI.prototype, Backbone.Events,  {
      login: new LoginModel(),
      views: {},
      collections: {
        organizations: new Organizations()
      },
      models: {},

      start: function() {
        var self = this;
        this.login.fetch({async:false});
        //--------------------------------------------------------------------------------
        // Views
        //--------------------------------------------------------------------------------
        this.views.banner = new BannerView({bannerTitle});
        $('body').prepend(this.views.banner.el);

        if (!_.isUndefined(this.views.banner) && this.views.banner.checkStreaming()){
          $('#wrapper').addClass('news-active');
          $('.container-fluid.banner-image').addClass('news-active');
        }

        this.views.navbar = new NavbarView({
          el: $('#navbar')
        });

        this.views.landingPagesTOC = new LandingPagesTOC({
          collection: this.collections.organizations
        });
        $('#sidebar-wrapper').html(this.views.landingPagesTOC.el);
      }
    });

    // Instantiate the application for this page
    var ooi = new OOI();

    $(document).ready(function() {
      ooi.start();

      // console.log('this.login');
      // console.log(ooi.login);

      if (ooi.login.loggedIn()) {
        checkUser();
        openHelp('Home', '/api/m2m/help');

        var actionButtons = "<div style='display: flex; flex-flow: wrap; justify-content: left;'>";
        {#                http://server/api/m2m/help/12575     Preload information (streams, parameters, etc.)

                http://server/api/m2m/help/12576     Sensor Inventory
                http://server/api/m2m/help/12577     Alerts and Alarms
                http://server/api/m2m/help/12578     Quality Control (QC)
                http://server/api/m2m/help/12580     Annotations
                http://server/api/m2m/help/12586     Vocabulary
                http://server/api/m2m/help/12587     Asset Management Subsystem#}

        actionButtons += "<button type='button' title='Home' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Home', '/api/m2m/help');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-home' aria-hidden='true'></i>Home</button>";

        actionButtons += "<button type='button' title='Preload (streams, parameters, etc.)' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Preload', '/api/m2m/help/12575');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Preload<br>(streams, parameters, etc.)</button>";

        actionButtons += "<button type='button' title='Sensor Inventory' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Sensor Inventory', '/api/m2m/help/12576');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Sensor Inventory</button>";

        actionButtons += "<button type='button' title='Alerts and Alarms' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Alerts and Alarms', '/api/m2m/help/12577');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Alerts &<br>Alarms</button>";

        actionButtons += "<button type='button' title='Quality Control (QC)' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Quality Control', '/api/m2m/help/12578');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Quality Control<br>(QC)</button>";

        actionButtons += "<button type='button' title='Annotations' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Annotations', '/api/m2m/help/12580');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Annotations</button>";

        actionButtons += "<button type='button' title='Vocabulary' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Vocabulary', '/api/m2m/help/12586');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Vocabulary</button>";

        actionButtons += "<button type='button' title='Asset Management Subsystem' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management Subsystem', '/api/m2m/help/12587');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Asset Management<br>Subsystem</button>";

        actionButtons += "</div>";
        $('#apimenu').append(actionButtons);
      }else{
        $('#ui').append('Please log in to access the OOI API Documentation');
      }
    });
  </script>


{% endblock %}
<commit_msg>Formats sample_response in M2M help.<commit_after>{% extends "common/base.html" %} {% block title %} <title>OOI User Interface - API Documentation</title> {% endblock %} {% block beforebootstrap %} {% endblock %} {% block head %} <link href="/css/custom/banner.css" rel="stylesheet" type="text/css" /> <link href="/css/custom/navbar.css" rel="stylesheet" type="text/css" /> <link href="/css/custom/custom.css" rel="stylesheet" type="text/css" /> <link href="/css/common/patchNotes.css" rel="stylesheet" type="text/css" /> <!-- Partials --> <script src="/js/partials/compiled/index.js" type="text/javascript"></script> <script src="/js/compiled/index.js" type="text/javascript"></script> <script src="/js/partials/compiled/landingPages.js" type="text/javascript"></script> <script src="/js/compiled/landingPages.js" type="text/javascript"></script> <script src="/js/partials/compiled/patch_notes.js" type="text/javascript"></script> <script src="/js/models/common/uiPatchNotes.js" type="text/javascript"></script> <script src="/js/models/common/uFramePatchNotes.js" type="text/javascript"></script>
  <script src="/js/views/common/PatchNotes.js" type="text/javascript"></script>

  <link href="/css/json2html/google-code-prettify/prettify.css" rel="stylesheet">
  <link href='/css/json2html/layout.css' media='all' type='text/css' rel='stylesheet'/>
  <link href='/css/json2html/index.css' media='all' type='text/css' rel='stylesheet'/>
  <script src="/js/core/json2html/jquery.json2html.js" type="text/javascript"></script>
  <script src="/js/core/json2html/json2html.js" type="text/javascript"></script>

{% endblock %}



{%block body %}
  <div class="container-fluid">
    <div id="navbar" class="row"></div>
  </div>

  <div id="wrapper" style="padding-left: 0px">
    <div id="page-content-wrapper">
      <div class="container-fluid">

        <div class="row">
          <div class="col-xs-6 col-sm-6 col-md-6" id="apimenu"><h1>OOI API Menu</h1></div>
          <div class="col-xs-6 col-sm-6 col-md-6" id="apimenuDynamic"><h1>Definitions & Examples</h1><h3 style="text-align: left;" id="selectedApi"></h3></div>
        </div>

        <div class="row">
          <div class="col-xs-6 col-sm-6 col-md-6" id="ui"><h2></h2><pre id="currentDoc" style="height: 60vh;"></pre></div>
          <div class="col-xs-6 col-sm-6 col-md-6" id="uiDynamic"></div>
        </div>

      </div><!--container-fluid -->
    </div><!-- page-content-wrapper -->
  </div><!-- wrapper -->

  <!-- fade in image -->
  <script>
    $(document).ready(function() {
      $(".delayImg").each(function() {
        this.onload = function() {
          $(this).animate({opacity: 1}, 2000);
        };
        this.src = this.getAttribute("delayedSrc");
      });
    });
  </script>

  <script type="text/javascript">

    var bannerTitle = "OOI API Documentation";
    var userInfo = {};

    var checkUser = function() {
      var userModel = new UserModel();
      userModel.url = '/api/current_user';


      //var userInfo = {};
      userModel.fetch({
        success: function (collection, response, options) {
          // console.log('user response:');
          // console.log(response);
          userInfo['api_user_name'] = response.api_user_name;
          userInfo['api_user_token'] = response.api_user_token;
          // console.log('userInfo');
          // console.log(userInfo);
        },
        error: function( req, status, err ) {
          // console.log('error');
          // console.log(req.statusText);
        }
      });
    };

    var openHelp = function(title, route){
      $.ajax(route, {
        type: 'GET',
        dataType: 'json',
        async: false,
        headers: {
          "Authorization": "Basic " + btoa(userInfo.api_user_name + ":" + userInfo.api_user_token)
        },
        success: function( response ) {
          // console.log('help response');
          // console.log(response);
          $('#ui').find('#currentDoc').replaceWith("<pre id=\"currentDoc\" style=\"height: 60vh;\">" + _.escape(response.message) + '</pre>');
          // console.log(resp);
          if (route !== '/api/m2m/help' && route !== '/api/m2m/help/12587') {
            openHelpJson(title, route);
          }else{
            $('#uiDynamic').html('');
            $('#selectedApi').text(title);
          }

          if (route == '/api/m2m/help/12587' || route.indexOf('12587') !== -1){
            var actionButtons = "<div id='assetButtons' style='display: flex; flex-flow: wrap; justify-content: left;'>";
            {#
            http://server/api/m2m/help/12587                # This help message
            http://server/api/m2m/help/12587/asset          # uframe REST queries for asset objects
            http://server/api/m2m/help/12587/event          # uframe REST queries for event(s)
            http://server/api/m2m/help/12587/deployment     # uframe REST queries for deployment events
            http://server/api/m2m/help/12587/cal            # uframe REST queries for calibration events
            http://server/api/m2m/help/12587/cruise         # uframe REST queries for cruise events
            http://server/api/m2m/help/12587/status         # uframe REST queries for status events
            http://server/api/m2m/help/12587/all            # uframe REST queries for all topics
            #}

            actionButtons += "<button type='button' title='Asset Objects' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Asset Objects', '/api/m2m/help/12587/asset');\"><i style='font-size:14px;float:left;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i>Asset Objects</button>";

            actionButtons += "<button type='button' title='Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Events', '/api/m2m/help/12587/event');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Events</button>";

            actionButtons += "<button type='button' title='Deployment Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Deployment Events', '/api/m2m/help/12587/deployment');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Deployment Events</button>";

            actionButtons += "<button type='button' title='Calibration Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Calibration Events', '/api/m2m/help/12587/cal');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Calibration Events</button>";

            actionButtons += "<button type='button' title='Cruise Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Cruise Events', '/api/m2m/help/12587/cruise');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Cruise Events</button>";

            actionButtons += "<button type='button' title='Status Events' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - Status Events', '/api/m2m/help/12587/status');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Status Events</button>";

            actionButtons += "<button type='button' title='All Topics' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management - All Topics', '/api/m2m/help/12587/all');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>All Topics</button>";

            actionButtons += "</div></div>";
            $('#apimenu').find('#assetButtons').remove();
            $('#apimenu').append(actionButtons);
          }else{
            $('#apimenu').find('#assetButtons').remove();
          }

        },
        error: function( req, status, err ) {
          // console.log(req);
          var errorMessage = '<div><h3>An error occurred getting M2M help documentation for the current user:</h3></div>';
          errorMessage += '<div><h4>' + req.statusText + '</h4></div>';
          errorMessage += '</br>';
          if(req.responseJSON){
            errorMessage += '<div><h4>' + req.responseJSON['message'] + '</h4></div>';
          }

          var errorModal = new ModalDialogView();
          errorModal.show({
            message: errorMessage,
            type: "danger"
          });
        }
      });
    };

    var openHelpJson = function(title, route){
      $.ajax(route+"?json=True", {
        type: 'GET',
        dataType: 'json',
        async: false,
        headers: {
          "Authorization": "Basic " + btoa(userInfo.api_user_name + ":" + userInfo.api_user_token)
        },
        success: function( response ) {
          // console.log('help json response');
          // console.log(response);

          var dynamicOutput = "";
          _.each(response.message, function(helpItem){
            // console.log('helpItem');
            // console.log(helpItem);
            dynamicOutput += "[" + helpItem.endpoint + "] " + helpItem['description'] + "<br>";
          });

          //$('#uiDynamic').find('#currentDynamic').replaceWith("<pre id=\"currentDynamic\" style=\"height: 60vh;\">" + dynamicOutput + '</pre>');
          visualize(response.message, route);
          $('#selectedApi').text(title);
          // console.log(resp);
        },
        error: function( req, status, err ) {
          // console.log(req);
          var errorMessage = '<div><h3>An error occurred getting M2M help documentation for the current user:</h3></div>';
          errorMessage += '<div><h4>' + req.statusText + '</h4></div>';
          errorMessage += '</br>';
          if(req.responseJSON){
            errorMessage += '<div><h4>' + req.responseJSON['message'] + '</h4></div>';
          }

          var errorModal = new ModalDialogView();
          errorModal.show({
            message: errorMessage,
            type: "danger"
          });
        }
      });
    };

    var transforms = {
      'object':{'tag':'div','class':'package ${show} ${type}','children':[
        {'tag':'div','class':'header','children':[
          {'tag':'div','class':function(obj){

            var classes = ["arrow"];

            if( getValue(obj.value) !== undefined ) classes.push("hide");

            return(classes.join(' '));
          }},
          {'tag':'span','class':'name','html':'${name}'},
          {'tag':'span','class':'value','html':function(obj) {
            var value = getValue(obj.value);
            if( value !== undefined ) return(" : " + value);
            else return('');
          }}
          //,{'tag':'span','class':'type','html':'${type}'}
        ]},
        {'tag':'div','class':'children','children':function(obj){return(children(obj.value));}}
      ]}
    };

    function visualize(json, headerText) {

      $('#uiDynamic').html('');

      $('#uiDynamic').json2html(convert(headerText,json,'open'),transforms.object);

      regEvents();
    }

    function getValue(obj) {
      var type = $.type(obj);

      //Determine if this object has children
      switch(type) {
        case 'array':
        case 'object':
          return(undefined);
          break;

        case 'function':
          //none
          return('function');
          break;

        case 'string':
          return("'" + obj + "'");
          break;

        default:
          return(obj);
          break;
      }
    }

    //Transform the children
    function children(obj){
      var type = $.type(obj);

      //Determine if this object has children
      switch(type) {
        case 'array':
        case 'object':
          return(json2html.transform(obj,transforms.object));
          break;

        default:
          //This must be a litteral
          break;
      }
    }

    function convert(name,obj,show) {

      var type = $.type(obj);

      if(show === undefined) show = 'closed';

      var children = [];

      //Determine the type of this object
      switch(type) {
        case 'array':
          //Transform array
          //Itterrate through the array and add it to the elements array
          var len=obj.length;
          for(var j=0;j<len;++j){
            //Concat the return elements from this objects tranformation
            var title = j;
            // console.log(obj);
            if(($.type(obj[j]) === 'object') && obj[j].hasOwnProperty('description')){
              title = obj[j].description;
            }
            if(($.type(obj[j]) === 'object') && obj[j].hasOwnProperty('sample_request')){
              title = obj[j].sample_request;
            }
            if(($.type(obj[j]) === 'object') && obj[j].hasOwnProperty('sample_response')){
              //title = 'SAMPLES';
              obj[j].sample_response = "<pre>"+JSON.stringify(obj[j].sample_response, null, 2)+"</pre>";
            }
            if(($.type(obj[j]) === 'object') && obj[j].hasOwnProperty('sample_data')){
              //title = 'SAMPLES';
              obj[j].sample_data = "<pre>"+JSON.stringify(obj[j].sample_data, null, 2)+"</pre>";
            }
            children[j] = convert(title,obj[j]);
          }
          break;

        case 'object':
          //Transform Object
          var j = 0;
          for(var prop in obj) {
            children[j] = convert(prop,obj[prop]);
            j++;
          }
          break;

        default:
          //This must be a litteral (or function)
          children = obj;
          break;
      }

      return( {'name':name,'value':children,'type':type,'show':show} );

    }

    function regEvents() {

      $('.header').click(function(){
        var parent = $(this).parent();

        if(parent.hasClass('closed')) {
          parent.removeClass('closed');
          parent.addClass('open');
        } else {
          parent.removeClass('open');
          parent.addClass('closed');
        }
      });
    }

    _.extend(OOI.prototype, Backbone.Events,  {
      login: new LoginModel(),
      views: {},
      collections: {
        organizations: new Organizations()
      },
      models: {},

      start: function() {
        var self = this;
        this.login.fetch({async:false});
        //--------------------------------------------------------------------------------
        // Views
        //--------------------------------------------------------------------------------
        this.views.banner = new BannerView({bannerTitle});
        $('body').prepend(this.views.banner.el);

        if (!_.isUndefined(this.views.banner) && this.views.banner.checkStreaming()){
          $('#wrapper').addClass('news-active');
          $('.container-fluid.banner-image').addClass('news-active');
        }

        this.views.navbar = new NavbarView({
          el: $('#navbar')
        });

        this.views.landingPagesTOC = new LandingPagesTOC({
          collection: this.collections.organizations
        });
        $('#sidebar-wrapper').html(this.views.landingPagesTOC.el);
      }
    });

    // Instantiate the application for this page
    var ooi = new OOI();

    $(document).ready(function() {
      ooi.start();

      // console.log('this.login');
      // console.log(ooi.login);

      if (ooi.login.loggedIn()) {
        checkUser();
        openHelp('Home', '/api/m2m/help');

        var actionButtons = "<div style='display: flex; flex-flow: wrap; justify-content: left;'>";
        {#                http://server/api/m2m/help/12575     Preload information (streams, parameters, etc.)

                http://server/api/m2m/help/12576     Sensor Inventory
                http://server/api/m2m/help/12577     Alerts and Alarms
                http://server/api/m2m/help/12578     Quality Control (QC)
                http://server/api/m2m/help/12580     Annotations
                http://server/api/m2m/help/12586     Vocabulary
                http://server/api/m2m/help/12587     Asset Management Subsystem#}

        actionButtons += "<button type='button' title='Home' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Home', '/api/m2m/help');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-home' aria-hidden='true'></i>Home</button>";

        actionButtons += "<button type='button' title='Preload (streams, parameters, etc.)' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Preload', '/api/m2m/help/12575');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Preload<br>(streams, parameters, etc.)</button>";

        actionButtons += "<button type='button' title='Sensor Inventory' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Sensor Inventory', '/api/m2m/help/12576');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Sensor Inventory</button>";

        actionButtons += "<button type='button' title='Alerts and Alarms' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Alerts and Alarms', '/api/m2m/help/12577');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Alerts &<br>Alarms</button>";

        actionButtons += "<button type='button' title='Quality Control (QC)' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Quality Control', '/api/m2m/help/12578');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Quality Control<br>(QC)</button>";

        actionButtons += "<button type='button' title='Annotations' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Annotations', '/api/m2m/help/12580');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Annotations</button>";

        actionButtons += "<button type='button' title='Vocabulary' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Vocabulary', '/api/m2m/help/12586');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Vocabulary</button>";

        actionButtons += "<button type='button' title='Asset Management Subsystem' style='float:left; margin: 5px; max-width: 125px;' id='goPreload' class='btn btn-default' onclick=\"openHelp('Asset Management Subsystem', '/api/m2m/help/12587');\"><i style='font-size:14px;float:center;pointer-events: none;' class='fa fa-book' aria-hidden='true'></i><br>Asset Management<br>Subsystem</button>";

        actionButtons += "</div>";
        $('#apimenu').append(actionButtons);
      }else{
        $('#ui').append('Please log in to access the OOI API Documentation');
      }
    });
  </script>


{% endblock %}

{'fraction_non_alphanumeric': 0.1944221664553851, 'fraction_numerical': 0.01777352340051225, 'mean_word_length': 2.669451300550598, 'pattern_counts': {'":': 8, '<': 375, '<?xml version=': 0, '>': 373, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2747467', 'n_tokens_mistral': 12112, 'n_tokens_neox': 11473, 'n_words': 2148}