Feature #3748: Support tab

src/sunstone/public/app/app.js

@@ -30,7 +30,8 @@ define(function(require) {
     require('tabs/oneflow-dashboard'),
     require('tabs/oneflow-services-tab'),
     require('tabs/oneflow-templates-tab'),
-    require('tabs/settings-tab')
+    require('tabs/settings-tab'),
+    require('tabs/support-tab')
   ];
 
   var _commonDialogs = [

src/sunstone/public/app/tabs/support-tab.js

@@ -0,0 +1,93 @@
+define(function(require) {
+  var Buttons = require('./support-tab/buttons');
+  var Actions = require('./support-tab/actions');
+  var Table = require('./support-tab/datatable');
+  var Notifier = require('utils/notifier');
+  var SupportUtils = require('./support-tab/utils/common');
+  var Sunstone = require('sunstone');
+
+  var TemplateTitle = require('hbs!./support-tab/title');
+  var TemplateSubheader = require('hbs!./support-tab/subheader');
+
+  var TAB_ID = require('./support-tab/tabId');
+  var DATATABLE_ID = "dataTableSupport";
+
+  var _dialogs = [
+  ];
+
+  var _panels = [
+  ];
+
+  var _formPanels = [
+    //require('./support-tab/form-panels/create')
+  ];
+
+  var Tab = {
+    tabId: TAB_ID,
+    resource: 'Support',
+    title: TemplateTitle(),
+    listHeader: '<i class="fa fa-fw fa-support"></i> Commercial Support Requests',
+    info_header: '<i class="fa fa-fw fa-support"></i> Commercial Support Request',
+    subheader: TemplateSubheader(),
+    buttons: Buttons,
+    actions: Actions,
+    dataTable: new Table(DATATABLE_ID, {actions: true, info: true, oneSelection: true}),
+    panels: _panels,
+    formPanels: _formPanels,
+    dialogs: _dialogs,
+    setup: _setup
+  };
+
+  return Tab;
+
+  function _setup(context) {
+
+    SupportUtils.showSupportConnect();
+    SupportUtils.startIntervalRefresh();
+
+    $(".support_button").on("click", function(){
+      $("#li_support-tab > a").trigger("click");
+      $(".create_dialog_button", "#support-tab").trigger("click");
+      return false;
+    });
+
+    $("#support_credentials_form", context).on("submit", function(){
+      $(".submit_support_credentials_button", context).attr("disabled", "disabled");
+      $(".submit_support_credentials_button", context).html('<i class="fa fa-spinner fa-spin"></i>');
+
+      var data = {
+        email : $("#support_email", this).val(),
+        password : $("#support_password", this).val()
+      };
+
+      $.ajax({
+        url: 'support/credentials',
+        type: "POST",
+        dataType: "text",
+        data: JSON.stringify(data),
+        success: function(){
+          $(".submit_support_credentials_button", context).removeAttr("disabled");
+          $(".submit_support_credentials_button", context).html('Sign in');
+
+          Sunstone.runAction("Support.refresh");
+
+          SupportUtils.showSupportList();
+          SupportUtils.startIntervalRefresh();
+        },
+        error: function(response){
+          if (response.status=="401") {
+            Notifier.notifyError("Support credentials are incorrect");
+          } else {
+            Notifier.notifyError(response.responseText);
+          }
+
+          $(".submit_support_credentials_button", context).removeAttr("disabled");
+          $(".submit_support_credentials_button", context).html('Sign in');
+        }
+      });
+
+      return false;
+    });
+  }
+
+});

src/sunstone/public/app/tabs/support-tab/actions.js

@@ -0,0 +1,138 @@
+define(function(require) {
+  var Sunstone = require('sunstone');
+  var Notifier = require('utils/notifier');
+  var OpenNebulaSupport = require('opennebula/support');
+  var SupportUtils = require('./utils/common');
+
+  var RESOURCE = "Support";
+  var TAB_ID = require('./tabId');
+  //var CREATE_DIALOG_ID = require('./form-panels/create/formPanelId');
+
+  var _actions = {
+    "Support.list" : {
+      type: "list",
+      call: OpenNebulaSupport.list,
+      callback: function(req, list, res){
+        SupportUtils.showSupportList();
+        $(".support_open_value").text(res.open_requests);
+        $(".support_pending_value").text(res.pending_requests);
+        Sunstone.getDataTable(TAB_ID).updateView(req, res.REQUEST_POOL.REQUEST);
+      },
+      error: function(request, error_json) {
+        if (error_json.error.http_status=="401") {
+          SupportUtils.stopIntervalRefresh();
+        }
+
+        SupportUtils.showSupportConnect();
+      }
+    },
+    "Support.refresh" : {
+      type: "custom",
+      call: function() {
+        var tab = $('#' + TAB_ID);
+        if (Sunstone.rightInfoVisible(tab)) {
+          Sunstone.runAction(RESOURCE+".show", Sunstone.rightInfoResourceId(tab));
+        } else {
+          Sunstone.getDataTable(TAB_ID).waitingNodes();
+          Sunstone.runAction(RESOURCE+".list", {force: true});
+        }
+      },
+      error: function(request, error_json) {
+        SupportUtils.showSupportConnect();
+      }
+    },
+    "Support.show" : {
+      type: "single",
+      call: OpenNebulaSupport.show,
+      callback: function(request, response) {
+        //Sunstone.getDataTable(TAB_ID).updateElement(request, response);
+        if (Sunstone.rightInfoVisible($('#'+TAB_ID))) {
+          Sunstone.insertPanels(TAB_ID, response);
+        }
+      },
+      error: function(request, error_json) {
+        SupportUtils.showSupportConnect();
+      }
+    },
+ /*TODO
+    "Support.create" : {
+      type: "create",
+      call: OpenNebulaSupport.create,
+      callback: function(request, response){
+         $("a[href=back]", $("#support-tab")).trigger("click");
+        popFormDialog("create_support_request_form", $("#support-tab"));
+
+        $("a.refresh", $("#support-tab")).trigger("click");
+        //addTemplateElement(request, response);
+        //notifyCustom(tr("Request created"), " ID: " + response.VMTEMPLATE.ID, false)
+      },
+      error: function(request, error_json){
+        popFormDialog("create_support_request_form", $("#support-tab"));
+        if (error_json.error.http_status=="403") {
+          notifyError(error_json.error.message);
+        } else {
+          $("a[href=back]", $("#support-tab")).trigger("click");
+          SupportUtils.showSupportConnect();
+        }
+      }
+
+    },
+
+    "Support.create_dialog" : {
+      type: "custom",
+      call: function(){
+        Sunstone.popUpFormPanel(
+          "create_support_request_form",
+          "support-tab",
+          "create",
+          false,
+          function(context){});
+      }
+    },
+
+    "Support.update" : {
+      type: "single",
+      call: OpenNebulaSupport.update,
+      callback: function(request, response){
+        $("a.refresh", $("#support-tab")).trigger("click");
+        notifyMessage(tr("Comment added correctly"));
+      },
+      error: function(request, response){
+        popFormDialog("create_template_form", $("#templates-tab"));
+        SupportUtils.showSupportConnect();
+      }
+    },
+    */
+    "Support.signout" : {
+      type: "single",
+      call: function() {
+        $.ajax({
+          url: 'support/credentials',
+          type: "DELETE",
+          dataType: "text",
+          success: function(){
+            SupportUtils.showSupportConnect();
+            Sunstone.runAction("Support.refresh");
+          },
+          error: function(response){
+            if (response.status=="401") {
+              Notifier.notifyError("Support credentials are incorrect");
+            } else {
+              Notifier.notifyError(response.responseText);
+            }
+          }
+        });
+      }
+    },
+/* TODO
+    "Support.upload" : {
+      type: "single",
+      call: function() {
+        $upload_support_file.foundation("reveal", "open");
+      }
+    }
+*/
+  };
+
+  return _actions;
+});

src/sunstone/public/app/tabs/support-tab/buttons.js

@@ -0,0 +1,32 @@
+define(function(require) {
+  var Locale = require('utils/locale');
+
+  var Buttons = {
+    "Support.refresh" : {
+      type: "action",
+      layout: "refresh",
+      text: '<i class="fa fa-refresh fa fa-lg">',
+      alwaysActive: true
+    },
+    "Support.upload" : {
+      type: "action",
+      layout: "main",
+      text: '<i class="fa fa-cloud-upload" style="color: rgb(111, 111, 111)"/> '+Locale.tr("Upload a file"),
+      custom_classes: "only-right-info"
+    },
+    "Support.signout" : {
+      type: "action",
+      layout: "main",
+      text: '<i class="fa fa-sign-out fa fa-lg">',
+      tip: "Sign out of Commercial Support",
+      alwaysActive: true
+    },
+    "Support.create_dialog" : {
+      type: "create_dialog",
+      layout: "create",
+      text: "Submit a Request"
+    }
+  };
+
+  return Buttons;
+});

src/sunstone/public/app/tabs/support-tab/datatable.js

@@ -0,0 +1,73 @@
+define(function(require) {
+  /*
+    DEPENDENCIES
+   */
+
+  var TabDataTable = require('utils/tab-datatable');
+  var SunstoneConfig = require('sunstone-config');
+  var Locale = require('utils/locale');
+
+  /*
+    CONSTANTS
+   */
+
+  var RESOURCE = "Support";
+  var XML_ROOT = "REQUEST";
+  var TAB_NAME = require('./tabId');
+
+  /*
+    CONSTRUCTOR
+   */
+
+  function Table(dataTableId, conf) {
+    this.conf = conf || {};
+    this.tabId = TAB_NAME;
+    this.dataTableId = dataTableId;
+    this.resource = RESOURCE;
+    this.xmlRoot = XML_ROOT;
+
+    this.dataTableOptions = {
+      "bAutoWidth": false,
+      "bSortClasses" : false,
+      "bDeferRender": true,
+      "aoColumnDefs": [
+          {"bSortable": false, "aTargets": ["check"]},
+          {"sWidth": "35px", "aTargets": [0]},
+          {"bVisible": true, "aTargets": SunstoneConfig.tabTableColumns(TAB_NAME)},
+          {"bVisible": false, "aTargets": ['_all']}
+      ]
+    };
+
+    this.columns = [
+      "ID",
+      "Subject",
+      "Requested",
+      "Status"
+    ];
+
+
+    TabDataTable.call(this);
+  }
+
+  Table.prototype = Object.create(TabDataTable.prototype);
+  Table.prototype.constructor = Table;
+  Table.prototype.elementArray = _elementArray;
+
+  return Table;
+
+  /*
+    FUNCTION DEFINITIONS
+   */
+
+  function _elementArray(element) {
+    return [
+        '<input class="check_item" type="checkbox" id="'+RESOURCE.toLowerCase()+'_' +
+                             element.id + '" name="selected_items" value="' +
+                             element.id + '"/>',
+        element.id,
+        element.subject,
+        element.created_at,
+        element.status
+    ];
+  }
+});

src/sunstone/public/app/tabs/support-tab/subheader.hbs

@@ -0,0 +1,68 @@
+<div class="row text-left support_connect">
+  <div class="large-6 columns" style="font-">
+    <p>The Support Subscription provides expert integration and production support on supported platforms and include:</p>
+    <ul class="fa-ul" style="font-size: 14px;">
+      <li><i class="fa-li fa fa-check"></i>Problem diagnosis, resolution and bug fixing</li>
+      <li><i class="fa-li fa fa-check"></i>Solving unexpected problems when using, installing or configuring the software</li>
+      <li><i class="fa-li fa fa-check"></i>Guidance about tuning for optimal and scalable performance in your environment</li>
+      <li><i class="fa-li fa fa-check"></i>Answering “how to” questions related to standard and intended product usage</li>
+      <li><i class="fa-li fa fa-check"></i>Offering hints about how to go around missing features</li>
+      <li><i class="fa-li fa fa-check"></i>Answering questions about product adaptation and integration</li>
+    </ul>
+    <p>For more info on support subcriptions, <a href="http://opennebula.systems/support/" target="_blank">click here</a></p>
+  </div>
+  <div class="large-6 columns" style="padding: 0px 50px;">
+    <fieldset>
+      <legend>Commercial Support</legend>
+      <form id="support_credentials_form">
+        <div class="large-12 columns">
+          <label for="support_email">Email</label>
+          <input id="support_email" type="text"></input>
+        </div>
+        <div class="large-12 columns">
+          <label for="support_password">Password</label>
+          <input id="support_password" type="password"></input>
+        </div>
+        <div class="large-12 columns">
+          <button class="button right radius success submit_support_credentials_button" type="submit">Sign in</button>
+        </div>
+        <div class="large-12 columns text-center">
+          <p>or</p>
+        </div>
+        <div class="large-12 columns">
+          <a  href="http://opennebula.systems/buy/" target="_blank" class="button large-12 radius" style="color: #fff !important">Get an account</a>
+        </div>
+      </form>
+    </fieldset>
+  </div>
+</div>
+<div class="row">
+  <div class="large-12 columns text-left">
+    <h3 class="subheader"><i class="fa fa-fw fa-info-circle"></i> Additional Help Resources</h3>
+  </div>
+</div>
+<br>
+<div class="row">
+  <div class="large-6 columns">
+    <a href="http://docs.opennebula.org/4.12/" target="_blank">
+      <span class="fa-stack fa-2x" style="color: #cfcfcf;">
+       <i class="fa fa-circle fa-stack-2x"></i>
+       <i class="fa fa-book fa-stack-1x fa-inverse"></i>
+     </span>
+     <br>
+     Documentation
+   </a>
+ </div>
+ <div class="large-6 columns">
+  <a href="http://opennebula.org/support/community/" target="_blank">
+    <span class="fa-stack fa-2x" style="color: #cfcfcf;">
+     <i class="fa fa-circle fa-stack-2x"></i>
+     <i class="fa fa-comments fa-stack-1x fa-inverse"></i>
+   </span>
+   <br>
+   Community
+ </a>
+</div>
+</div>
+<br>
+<p class="text-center" style="font-size: 14px; color: #999;">This tab can be disabled in the sunstone views configuration files</p>

src/sunstone/public/app/tabs/support-tab/tabId.js

@@ -0,0 +1,3 @@
+define(function(require) {
+  return 'support-tab';
+});

src/sunstone/public/app/tabs/support-tab/title.hbs

@@ -0,0 +1,14 @@
+<span class="support_title"><i class="fa fa-lg fa-fw fa-support"></i> Support</span>
+<br>
+<div class="support_info" style="display: none;">
+  <span class="support_open">Open</span><span class="label secondary right support_open_value">-</span>
+  <br>
+  <span class="support_pending">Pending</span><span class="label right support_pending_value">-</span>
+  <br>
+  <button class="button tiny success radius support_button">Submit a Request</button>
+</div>
+<div class="support_connect" style="display: none;">
+  <span class="">Not connected</span>
+  <br>
+  <button class="button tiny success radius support_connect_button">Sign in</button>
+</div>

src/sunstone/public/app/tabs/support-tab/utils/common.js

@@ -0,0 +1,44 @@
+define(function(require) {
+  /*
+    Common functions for the support tab
+   */
+
+  var Sunstone = require('sunstone');
+
+  var TAB_ID = require('../tabId');
+
+  var support_interval_function;
+
+  function _show_support_connect() {
+    $(".support_info").hide();
+    $("#"+Sunstone.getDataTable(TAB_ID).dataTableId+"Container", "#"+TAB_ID).hide();
+    $(".support_connect").show();
+    $(".actions_row", "#"+TAB_ID).hide();
+  }
+
+  function _show_support_list() {
+    $(".support_info").show();
+    $(".support_connect").hide();
+    $(".actions_row", "#"+TAB_ID).show();
+    $("#"+Sunstone.getDataTable(TAB_ID).dataTableId+"Container", "#"+TAB_ID).show();
+  }
+
+  function _startIntervalRefresh() {
+    Sunstone.runAction('Support.list');
+
+    support_interval_function = setInterval(function(){
+      Sunstone.runAction('Support.list');
+    }, Sunstone.TOP_INTERVAL);
+  }
+
+  function _stopIntervalRefresh() {
+    clearInterval(support_interval_function);
+  }
+
+  return {
+    'showSupportConnect': _show_support_connect,
+    'showSupportList': _show_support_list,
+    'startIntervalRefresh': _startIntervalRefresh,
+    'stopIntervalRefresh': _stopIntervalRefresh,
+  };
+});