support view

js/apps/system/_admin/aardvark/APP/frontend/js/routers/router.js

@@ -39,7 +39,8 @@
       "nodes": "nodes",
       "node/:name": "node",
       "logs": "logs",
-      "helpus": "helpUs"
+      "helpus": "helpUs",
+      "support": "support"
     },
 
     execute: function(callback, args) {
@@ -665,6 +666,19 @@
       this.helpUsView.render();
     },
 
+    support: function (initialized) {
+      this.checkUser();
+      if (!initialized) {
+        this.waitForInit(this.support.bind(this));
+        return;
+      }
+      if (!this.testView) {
+        this.supportView = new window.SupportView({
+        });
+      }
+      this.supportView.render();
+    },
+
     workMonitor: function (initialized) {
       this.checkUser();
       if (!initialized) {

js/apps/system/_admin/aardvark/APP/frontend/js/templates/navigationView.ejs

@@ -33,6 +33,7 @@
       <li class="logs-menu"><a id="logs" class="tab" href="#logs"><i class="fa fa-file-text"></i>Logs</a></li>
     <% } %>
     <li class="navbar-spacer big"></li>
+    <li class="support-menu"><a id="support" class="tab" href="#support"><i class="fa fa-support"></i>Support</a></li>
     <li class="helpus-menu"><a id="helpus" class="tab" href="#helpus"><i class="fa fa-heart"></i>Help Us</a></li>
     <!--
     <li class="navbar-spacer big"></li>

js/apps/system/_admin/aardvark/APP/frontend/js/templates/supportView.ejs

@@ -0,0 +1,72 @@
+<script id="supportView.ejs" type="text/template">
+
+  <div class="supportView">
+    <ul class="subMenuEntries subViewNavbar">
+      <li id="community-support" class="subMenuEntry active"><a>Community</a></li>
+      <li id="documentation-support" class="subMenuEntry "><a>Documentation</a></li>
+      <li id="swagger-support" class="subMenuEntry "><a>HTTP API</a></li>
+    </ul>
+ 
+    <div class="innerContent" id="supportContent">
+
+      <div id="community">
+
+      </div>
+
+      <div id="swagger" style="display: none; height: 100%;">
+      </div>
+
+      <div id="documentation" style="display: none">
+
+
+      <div class="center">
+        Documentation
+        Find manuals for ArangoDB, AQL, Foxx and many other useful ressources
+      </div>
+
+        <div class="pure-u" style="width: 100%;">
+
+          <div class="pure-u-1-1 pure-u-sm-1-2 pure-u-md-1-3">
+            <div class="title">
+              ArangoDB Manual
+            </div>
+            <ul class="menu">
+              <li><a href="#">Getting started</a></li>
+              <li><a href="#">Scalability</a></li>
+              <li><a href="#">Data models and &amp; modeling</a></li>
+              <li><a href="#">Graphs</a></li>
+            </ul>
+          </div>
+
+          <div class="pure-u-1-1 pure-u-sm-1-2 pure-u-md-1-3">
+            <div class="title">
+              AQL Docs
+            </div>
+            <ul class="menu">
+              <li><a href="#">Getting started</a></li>
+              <li><a href="#">Scalability</a></li>
+              <li><a href="#">Data models and &amp; modeling</a></li>
+              <li><a href="#">Graphs</a></li>
+            </ul>
+          </div>
+
+          <div class="pure-u-1-1 pure-u-sm-1-2 pure-u-md-1-3">
+            <div class="title">
+              Foxx Framework
+            </div>
+            <ul class="menu">
+              <li><a href="#">Getting started</a></li>
+              <li><a href="#">Scalability</a></li>
+              <li><a href="#">Data models and &amp; modeling</a></li>
+              <li><a href="#">Graphs</a></li>
+            </ul>
+          </div>
+
+
+        </div>
+      </div>
+     </div>
+
+   </div>
+
+</script>

js/apps/system/_admin/aardvark/APP/frontend/js/views/supportView.js

@@ -0,0 +1,61 @@
+/*jshint browser: true */
+/*jshint unused: false */
+/*global _, arangoHelper, Backbone, templateEngine, $, window*/
+(function () {
+  "use strict";
+
+  window.SupportView = Backbone.View.extend({
+
+    el: "#content",
+
+    template: templateEngine.createTemplate("supportView.ejs"),
+
+    events: {
+      "click .subViewNavbar .subMenuEntry" : "toggleViews"
+    },
+
+    render: function () {
+      this.$el.html(this.template.render({}));
+    },
+
+    resize: function() {
+      $('.innerContent').height($('.centralRow').height() - 170);
+    },
+
+    renderSwagger: function() {
+      var path = window.location.pathname.split("/");
+      var url = window.location.protocol + "//" + window.location.hostname + ":" + window.location.port + "/" + path[1] + "/" + path[2]  + "/_admin/aardvark/api/index.html";
+      $('#swagger').html('');
+      $('#swagger').append(
+        '<iframe src="' + url + '" style="border:none"></iframe>'
+      );
+    },
+
+    toggleViews: function(e) {
+      var self = this;
+      var id = e.currentTarget.id.split('-')[0];
+      var views = ['community', 'documentation', 'swagger'];
+
+      _.each(views, function(view) {
+        if (id !== view) {
+          $('#' + view).hide();
+        }
+        else {
+          if (id === 'swagger') {
+            self.renderSwagger();
+            $('#swagger iframe').css('height', '100%');
+            $('#swagger iframe').css('width', '100%');
+            $('#swagger iframe').css('margin-top', '-13px');
+            self.resize();
+          }
+          $('#' + view).show();
+        }
+      });
+
+      $('.subMenuEntries').children().removeClass('active');
+      $('#' + id + '-support').addClass('active');
+
+    }
+
+  });
+}());