Commit e7ea564f authored by Alain Takoudjou's avatar Alain Takoudjou

slapos_monitoring: split hosting and instance view page

create page hosting subscription list and hosting subscription view, software instance list and software instance view pages.
parent 19f6c666
......@@ -145,49 +145,53 @@ gadget_monitoring_application_panel.html\n
gadget_monitoring_chart.html\n
gadget_monitoring_document_edit.html\n
gadget_monitoring_header.html\n
gadget_monitoring_hosting_overview.html\n
gadget_monitoring_hosting_subscription_list.html\n
gadget_monitoring_hosting_subscription_view.html\n
gadget_monitoring_import_export.html\n
gadget_monitoring_jio.html\n
gadget_monitoring_login.html\n
gadget_monitoring_login_widget.html\n
gadget_monitoring_main.html\n
gadget_monitoring_overview.html\n
gadget_monitoring_process_view.html\n
gadget_monitoring_promise_interface.html\n
gadget_monitoring_resource_view.html\n
gadget_monitoring_router.html\n
gadget_monitoring_settings_configurator.html\n
gadget_monitoring_software_instance_list.html\n
gadget_monitoring_software_instance_view.html\n
gadget_monitoring_status_grid.html\n
gadget_monitoring_status_list.html\n
gadget_monitoring_sync.html\n
gadget_monitoring_widget_instance_list.html\n
gadget_monitoring_widget_listbox.html\n
gadget_monitoring_widget_listview.html\n
gadget_monitoring_widget_overview.html\n
gadget_monitoring_custom.css\n
gadget_monitoring_tooltipster.css\n
gadget_monitoring_application_panel.js\n
gadget_monitoring_chart.js\n
gadget_monitoring_document_edit.js\n
gadget_monitoring_header.js\n
gadget_monitoring_hosting_overview.js\n
gadget_monitoring_hosting_subscription_list.js\n
gadget_monitoring_hosting_subscription_view.js\n
gadget_monitoring_import_export.js\n
gadget_monitoring_jio.js\n
gadget_monitoring_login.js\n
gadget_monitoring_login_widget.js\n
gadget_monitoring_main.js\n
gadget_monitoring_overview.js\n
gadget_monitoring_process_view.js\n
gadget_monitoring_promise_interface.js\n
gadget_monitoring_resource_view.js\n
gadget_monitoring_router.js\n
gadget_monitoring_software_instance_list.js\n
gadget_monitoring_software_instance_view.js\n
gadget_monitoring_static.js\n
gadget_monitoring_status_grid.js\n
gadget_monitoring_status_list.js\n
gadget_monitoring_sync.js\n
gadget_monitoring_tooltipster.min.js\n
gadget_monitoring_widget_instance_list.js\n
gadget_monitoring_widget_listbox.js\n
gadget_monitoring_widget_listview.js\n
gadget_monitoring_widget_overview.js\n
gadget_translation.js\n
gadget_translation_data.js\n
erp5_launcher.js\n
......@@ -330,7 +334,7 @@ NETWORK:\n
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.21023.22440.29593</string> </value>
<value> <string>951.30729.47924.44561</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -348,7 +352,7 @@ NETWORK:\n
</tuple>
<state>
<tuple>
<float>1464194710.25</float>
<float>1464342540.22</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -41,9 +41,9 @@
<script id="panel-template-body" type="text/x-handlebars-template">
<div class="ui-content">
<ul data-role="listview" class="ui-listview">
<li><a href="#page=hosting_overview"><i class="fa fa-globe"></i><span data-i18n="Hosting Subscriptions">Hosting Subscriptions</span></a></li>
<li><a href="#page=overview"><i class="fa fa-cube"></i><span data-i18n="Software Instances">Software Instances</span></a></li>
<li><a href="#page=status_list"><i class="fa fa-th-list"></i><span data-i18n="Promises Overview">Promises Overview</span></a></li>
<li><a href="#page=status_list"><i class="fa fa-th-list"></i><span data-i18n="Promises Status">Promises Status</span></a></li>
<li><a href="#page=software_instance_list"><i class="fa fa-cube"></i><span data-i18n="Software Instances">Software Instances</span></a></li>
<li><a href="#page=hosting_subscription_list"><i class="fa fa-globe"></i><span data-i18n="Hosting Subscriptions">Hosting Subscriptions</span></a></li>
<li><a href="#page=settings_configurator"><i class="fa fa-cog"></i><span data-i18n="Monitoring Configuration">Monitoring Configuration</span></a></li>
<li><a href="#page=import_export"><i class="fa fa-exchange"></i><span data-i18n="Import / Export">Import / Export</span></a></li>
</ul>
......
......@@ -237,7 +237,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.17777.16093.25088</string> </value>
<value> <string>951.29615.38155.21196</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -255,7 +255,7 @@
</tuple>
<state>
<tuple>
<float>1464107507.78</float>
<float>1464275565.87</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -180,7 +180,7 @@ html .ui-panel-overview table {
}
html .content-details table tr th, html .content-details table tr td {
padding: 5px;
padding: 7px;
}
html .content-details .instances-parameters table tr td {
padding: 0 0 0 10px;
......@@ -468,6 +468,9 @@ html .custom-grid-wrap table thead tr th {
color: #344558;
padding: 8px 0;
}
.graph-full {
margin: 0 20px;
}
.graph-medium {
height: 200px;
width: 100%;
......@@ -484,6 +487,10 @@ html .custom-grid-wrap table thead tr th {
font-weight: normal;
}
.hosting-block {
width: 80%;
}
/* INfo Box */
.infobox {
display: inline-block;
......@@ -812,6 +819,9 @@ margin-top: 5px;
/************** Media @ **********************/
@media all and (max-width: 62em) {
.m-hidden {
display: none;
}
form.search .ui-block-a {
width: 60%;
float: left;
......@@ -823,6 +833,21 @@ margin-top: 5px;
.ui-panel-overview {
margin: 15px 0 20px 0;
}
html .ui-content {
padding: .1em;
}
html .jqm-navmenu-panel .ui-content {
padding: 1em;
}
.graph {
margin: 10px 0;
}
.graph-full {
margin: 0 10px;
}
.hosting-block {
width: 100%;
}
html table:not(.ui-responsive) tbody tr td:first-child a, html table:not(ui-responsive) tbody tr th:first-child a {
position: relative;
}
......
......@@ -239,7 +239,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.7641.18647.23022</string> </value>
<value> <string>951.30698.54042.4164</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -257,7 +257,7 @@
</tuple>
<state>
<tuple>
<float>1464100990.73</float>
<float>1464340503.33</float>
<string>UTC</string>
</tuple>
</state>
......
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Monitoring Hosting Subscription</title>
<link href="gadget_monitoring_custom.css" rel="stylesheet" type="text/css"/>
<script src="rsvp.js"></script>
<script src="renderjs.js"></script>
<script id="template-hostings-list" type="text/x-handlebars-template">
{{#each hosting_list}}
<tr>
<td>
<a class="ui-link" href="{{href}}"><span class="label label-{{status}}">{{status}}</span></a>
</td>
<td>
<a class="ui-link" href="{{href}}">{{title}}</a>
</td>
<td>
<a class="ui-link" href="{{href}}">{{date}}</a>
</td>
</tr>
{{/each}}
</script>
<script src="gadget_monitoring_hosting_subscription_list.js"></script>
</head>
<body>
<div data-gadget-url="gadget_monitoring_jio.html" data-gadget-scope="jio_gadget" data-gadget-sandbox="public"></div>
<div data-gadget-url="gadget_monitoring_login_widget.html" data-gadget-scope="login_gadget" data-gadget-sandbox="public"></div>
<!--<div data-gadget-url="gadget_monitoring_document_edit.html" data-gadget-scope="config_gadget" data-gadget-sandbox="public"></div>-->
<div class="ui-grid-a ui-responsive">
<div class="ui-block-a">
<div class="ui-panel-overview" style="min-height: 450px;">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-globe"></i> <span>Hosting Subscriptions</span>
</div>
<div class="commands">
</div>
</div>
</div>
<div class="overview-content">
<div class="ui-listview-container">
<table class="ui-responsive ui-body-c ui-table-inset instance-overview">
<thead class="ui-bar-inherit">
<tr>
<th class="padding-10">Status</th>
<th>Name</th>
<th>Status Date</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot class="ui-bar-inherit"></tfoot>
</table>
</div>
</div>
</div>
</div>
<div class="ui-block-b" style="position: relative">
</div>
</div>
</body>
</html>
......@@ -80,7 +80,7 @@
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_monitoring_hosting_overview.html</string> </value>
<value> <string>gadget_monitoring_hosting_subscription_list.html</string> </value>
</item>
<item>
<key> <string>description</string> </key>
......@@ -90,7 +90,7 @@
</item>
<item>
<key> <string>id</string> </key>
<value> <string>gadget_monitoring_hosting_overview_html</string> </value>
<value> <string>gadget_monitoring_hosting_subscription_list_html</string> </value>
</item>
<item>
<key> <string>language</string> </key>
......@@ -110,7 +110,7 @@
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Monitoring Hosting Subscription Overview</string> </value>
<value> <string>Monitoring Hosting Subscription List</string> </value>
</item>
<item>
<key> <string>version</string> </key>
......@@ -243,7 +243,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.27801.5339.60876</string> </value>
<value> <string>951.29612.46793.45533</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -261,7 +261,7 @@
</tuple>
<state>
<tuple>
<float>1464166945.92</float>
<float>1464277179.89</float>
<string>UTC</string>
</tuple>
</state>
......
/*global window, rJS, Handlebars */
/*jslint nomen: true, indent: 2, maxerr: 3*/
(function (window, rJS, Handlebars) {
"use strict";
var gadget_klass = rJS(window),
templater = gadget_klass.__template_element,
hosting_widget_template = Handlebars.compile(
templater.getElementById("template-hostings-list").innerHTML
);
function safeGet(gadget, url) {
var document_id = 'monitor.global';
gadget.props.jio_gadget.createJio({
type: "query",
sub_storage: {
type: "drivetojiomapping",
sub_storage: {
type: "dav",
url: url
}
}
});
return gadget.props.jio_gadget.get(document_id)
.push(function (doc) {
return doc;
}, function (error) {
console.log(error);
return undefined;
});
}
function getHostingData(gadget, url_list) {
var promise_list = [],
i;
for (i = 0; i < url_list.length; i += 1) {
gadget.props.jio_gadget.createJio({
type: "query",
sub_storage: {
type: "drivetojiomapping",
sub_storage: {
type: "dav",
url: url_list[i]
}
}
});
promise_list.push(safeGet(gadget, url_list[i]));
}
return RSVP.all(promise_list);
}
gadget_klass
.ready(function (gadget) {
gadget.props = {};
gadget.props.hosting_list = [];
gadget.props.opml_key_list = [];
gadget.props.title = 'Monitoring Hosting Subscriptions';
return gadget.getDeclaredGadget("login_gadget")
.push(function (login_gadget) {
gadget.props.login_gadget = login_gadget;
});
})
.ready(function (gadget) {
return gadget.getElement()
.push(function (element) {
gadget.props.element = element;
gadget.props.render_deferred = RSVP.defer();
});
})
.ready(function (gadget) {
return gadget.getDeclaredGadget("jio_gadget")
.push(function (jio_gadget) {
gadget.props.jio_gadget = jio_gadget;
});
})
.declareAcquiredMethod("getSetting", "getSetting")
.declareAcquiredMethod("setSetting", "setSetting")
.declareAcquiredMethod("updateHeader", "updateHeader")
.declareMethod("render", function (options) {
var gadget = this,
opml_tmp_key_list,
hosting_url_list;
//return gadget.props.jio_gadget.getMonitorUrlList()
gadget.props.options = options;
return gadget.updateHeader({
title: gadget.props.title
})
.push(function () {
return gadget.getSetting('monitor_url_description');
})
.push(function (url_description_dict) {
var key,
promise_list = [];
gadget.props.opml_dict = url_description_dict;
opml_tmp_key_list = [];
for (key in url_description_dict) {
opml_tmp_key_list.push(key);
promise_list.push(gadget.props.jio_gadget.getMonitorUrlList(undefined,
url_description_dict[key].title));
}
return RSVP.all(promise_list);
})
.push(function (url_list) {
var i,
j,
promise_list = [];
for (i = 0; i < url_list.length; i += 1) {
if (url_list[i]) {
promise_list.push(getHostingData(gadget, url_list[i]));
} else {
//This Feed is not available, remove from key_list
opml_tmp_key_list[i] = undefined;
}
}
return RSVP.all(promise_list);
})
.push(function (document_list) {
var i,
status,
hosting_dict,
hosting_title,
date,
content,
j;
for (i = 0; i < opml_tmp_key_list.length; i += 1) {
if (opml_tmp_key_list[i] !== undefined) {
gadget.props.opml_key_list.push(opml_tmp_key_list[i]);
}
}
for (i = 0; i < document_list.length; i += 1) {
hosting_dict = {};
status = 'OK';
hosting_dict.instance_list = [];
date = '';
for (j = 0; j < document_list[i].length; j += 1) {
if (document_list[i][j] === undefined) {
continue;
}
hosting_dict.instance_list.push({
title: document_list[i][j].title,
status: document_list[i][j].status,
url: document_list[i][j]._links.monitor.href
});
if (document_list[i][j].status === 'ERROR') {
if (status !== 'ERROR') {
status = 'ERROR';
date = document_list[i][j].date || '';
hosting_title = document_list[i][j]['hosting-title'] || '';
}
} else if (document_list[i][j].status === 'WARNING') {
if (status !== 'ERROR' && status !== 'WARNING') {
status = 'WARNING';
date = document_list[i][j].date || '';
hosting_title = document_list[i][j]['hosting-title'] || '';
}
} else if (date === '') {
date = document_list[i][j].date || '';
hosting_title = document_list[i][j]['hosting-title'] || '';
}
}
hosting_dict.status = status;
hosting_dict.title = hosting_title;
hosting_dict.date = date;
hosting_dict.href = "#page=hosting_subscription_view&key=" +
gadget.props.opml_key_list[i];
gadget.props.hosting_list.push(hosting_dict);
}
content = hosting_widget_template({
hosting_list: gadget.props.hosting_list
});
gadget.props.element.querySelector('.ui-block-a table tbody')
.innerHTML = content;
return gadget.props.render_deferred.resolve();
});
})
.declareService(function () {
var gadget = this;
});
}(window, rJS, Handlebars));
\ No newline at end of file
......@@ -80,7 +80,7 @@
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_monitoring_hosting_overview.js</string> </value>
<value> <string>gadget_monitoring_hosting_subscription_list.js</string> </value>
</item>
<item>
<key> <string>description</string> </key>
......@@ -90,7 +90,7 @@
</item>
<item>
<key> <string>id</string> </key>
<value> <string>gadget_monitoring_hosting_overview_js</string> </value>
<value> <string>gadget_monitoring_hosting_subscription_list_js</string> </value>
</item>
<item>
<key> <string>language</string> </key>
......@@ -108,7 +108,7 @@
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Monitoring Hosting Subscription Overview Js</string> </value>
<value> <string>Monitoring Hosting Subscription list Js</string> </value>
</item>
<item>
<key> <string>version</string> </key>
......@@ -239,7 +239,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.17701.12410.54528</string> </value>
<value> <string>951.29657.60907.41591</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -257,7 +257,7 @@
</tuple>
<state>
<tuple>
<float>1464106260.69</float>
<float>1464281193.24</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -4,29 +4,13 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Monitoring Hosting Subscription</title>
<title>Monitoring Hosting Subscription View</title>
<link href="gadget_monitoring_custom.css" rel="stylesheet" type="text/css"/>
<script src="rsvp.js"></script>
<script src="renderjs.js"></script>
<script id="template-hostings-list" type="text/x-handlebars-template">
{{#each hosting_list}}
<tr rel={{index}}>
<td>
<a class="ui-link" href="#{{status}}"><span class="label label-{{status}}">{{status}}</span></a>
</td>
<td>
<a class="ui-link" href="">{{title}}</a>
</td>
<td>
<a class="ui-link" href="">{{date}}</a>
</td>
</tr>
{{/each}}
</script>
<script id="instance-details-widget-overview" type="text/x-handlebars-template">
{{#if status_list_url}}
<!--<div data-role="controlgroup">
......@@ -132,74 +116,35 @@
{{/if}}
</script>
<script src="gadget_monitoring_hosting_overview.js"></script>
<script src="gadget_monitoring_hosting_subscription_view.js"></script>
</head>
<body>
<div data-gadget-url="gadget_monitoring_jio.html" data-gadget-scope="jio_gadget" data-gadget-sandbox="public"></div>
<div data-gadget-url="gadget_monitoring_login_widget.html" data-gadget-scope="login_gadget" data-gadget-sandbox="public"></div>
<!--<div data-gadget-url="gadget_monitoring_document_edit.html" data-gadget-scope="config_gadget" data-gadget-sandbox="public"></div>-->
<div class="ui-grid-a ui-responsive">
<div class="ui-block-a">
<div class="ui-panel-overview" style="min-height: 450px;">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-globe"></i> <span>Hosting Subscriptions</span>
</div>
<div class="commands">
</div>
<div class="ui-responsive hosting-block">
<div class="signal ui-content-hidden"></div>
<div class="ui-panel-overview">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-share-alt"></i> <span></span>
</div>
</div>
<div class="overview-content">
<div class="ui-listview-container">
<table class="ui-responsive ui-body-c ui-table-inset instance-overview">
<thead class="ui-bar-inherit">
<tr>
<th class="padding-10">Status</th>
<th>Name</th>
<th>Status Date</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot class="ui-bar-inherit"></tfoot>
</table>
<div class="commands">
</div>
</div>
</div>
</div>
<div class="ui-block-b" style="position: relative">
<div class="signal ui-content-hidden"></div>
<div class="ui-panel-overview ui-content-hidden">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-share-alt"></i> <span></span>
</div>
<div class="commands">
</div>
</div>
<div class="content-details">
<h2><i class="fa fa-wrench"></i> <strong>Software Instances Parameters</strong></h2>
<div style="overflow: auto;" class="padding-lr-10 instances-parameters">
</div>
<div class="content-details">
<h2><i class="fa fa-wrench"></i> <strong>Instances Parameters</strong></h2>
<div style="overflow: auto;" class="padding-lr-10 instances-parameters">
</div>
<div class="padding-5"></div>
<h2><i class="fa fa-cubes"></i> <strong>Instances Status</strong></h2>
<div class="instances-status">
</div>
<div class="padding-5"></div>
<h2><i class="fa fa-cubes"></i> <strong>Software Instances Status</strong></h2>
<div class="instances-status">
</div>
</div>
</div>
</div>
</body>
</html>
......@@ -4,18 +4,18 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Monitoring Status Interface</title>
<title>Monitoring Software Instance List</title>
<link href="gadget_monitoring_custom.css" rel="stylesheet" type="text/css"/>
<script src="rsvp.js"></script>
<script src="renderjs.js"></script>
<script src="gadget_monitoring_overview.js"></script>
<script src="gadget_monitoring_software_instance_list.js"></script>
</head>
<body>
<div data-gadget-url="gadget_monitoring_widget_overview.html" data-gadget-scope="listview"></div>
<div data-gadget-url="gadget_monitoring_widget_instance_list.html" data-gadget-scope="listview"></div>
</body>
</html>
......@@ -80,7 +80,7 @@
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_monitoring_overview.html</string> </value>
<value> <string>gadget_monitoring_software_instance_list.html</string> </value>
</item>
<item>
<key> <string>description</string> </key>
......@@ -90,7 +90,7 @@
</item>
<item>
<key> <string>id</string> </key>
<value> <string>gadget_monitoring_overview_html</string> </value>
<value> <string>gadget_monitoring_software_instance_list_html</string> </value>
</item>
<item>
<key> <string>language</string> </key>
......@@ -110,7 +110,7 @@
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Monitoring Overview Interface</string> </value>
<value> <string>Monitoring Software Instance List</string> </value>
</item>
<item>
<key> <string>version</string> </key>
......@@ -243,7 +243,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>948.50296.46997.62737</string> </value>
<value> <string>951.29252.10342.1587</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -261,7 +261,7 @@
</tuple>
<state>
<tuple>
<float>1453979456.82</float>
<float>1464253720.38</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -22,8 +22,9 @@
"title": 'Software Instances List'
},
listview_options = {
search_page: 'overview',
search_page: 'software_instance_list',
search: options.search,
filter: options.filter,
selection: '',
column: {
select: 'title',
......@@ -40,7 +41,8 @@
{select: 'hosting-title', title: 'Date'}
],
query: {
select_list: ['title', 'status', 'date', '_links', 'state', 'hosting-title'],
select_list: ['title', 'status', 'date', '_links', 'state',
'hosting-title'],
//query: '_id:"monitor.global"',
sort_on: [["status", "ascending"]]
}
......@@ -48,23 +50,9 @@
return gadget.updateHeader(header)
.push(function () {
var filter_part_list = [],
j;
/*if (options.sort_on && options.sort_on !== 'status') {
listview_options.query.sort_on = [[options.sort_on, 'ascending']];
}*/
if (options.status && options.status !== '') {
for (j = 0; j < options.status.split('+').length; j += 1) {
filter_part_list.push('(status:"' + options.status.split('+')[j].toUpperCase() + '")');
}
listview_options.query.query += ' AND (' + filter_part_list.join(' OR ') + ')';
}
return gadget.property_dict.listview.render(listview_options);
});
})
.declareAcquiredMethod("getSetting", "getSetting")
.declareAcquiredMethod("redirect", "redirect")
.declareAcquiredMethod("updateHeader", "updateHeader");
......
......@@ -80,7 +80,7 @@
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_monitoring_overview.js</string> </value>
<value> <string>gadget_monitoring_software_instance_list.js</string> </value>
</item>
<item>
<key> <string>description</string> </key>
......@@ -90,7 +90,7 @@
</item>
<item>
<key> <string>id</string> </key>
<value> <string>gadget_monitoring_overview_js</string> </value>
<value> <string>gadget_monitoring_software_instance_list_js</string> </value>
</item>
<item>
<key> <string>language</string> </key>
......@@ -108,7 +108,7 @@
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Monitoring Overview Gadget JS</string> </value>
<value> <string>Monitoring Instance List Gadget JS</string> </value>
</item>
<item>
<key> <string>version</string> </key>
......@@ -239,7 +239,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.9445.6535.55671</string> </value>
<value> <string>951.29297.41836.68</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -257,7 +257,7 @@
</tuple>
<state>
<tuple>
<float>1464107170.21</float>
<float>1464256864.93</float>
<string>UTC</string>
</tuple>
</state>
......
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>Monitoring Software Instance</title>
<!-- renderjs -->
<script src="rsvp.js" type="text/javascript"></script>
<script src="renderjs.js" type="text/javascript"></script>
<script src="handlebars.js"></script>
<script id="details-widget-overview" type="text/x-handlebars-template">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-cubes"></i><span>
{{root_title}} >&nbsp;
{{title}}
</span>
</div>
<div class="commands">
</div>
</div>
</div>
<div class="content-details">
<div class="ui-text-left" style="padding-bottom: 15px;">
<h2><i class="fa fa-info-circle"></i> <strong>Software Instance State Information</strong></h2>
<div class="padding-10">
<div class="ui-grid-a ui-responsive">
<div class="ui-block-a">
<fieldset data-role="controlgroup" data-type="horizontal">
{{#if resource_url }}
<a href="{{resource_url}}" class="ui-btn ui-corner-all ui-btn-inline ui-mini" title="Software Instance Resource comsumption"><i class="fa fa-pie-chart"></i> Resources</a>
{{/if}}
{{#if process_url }}
<a href="{{process_url}}" class="ui-btn ui-corner-all ui-btn-inline ui-mini" title="Processes usage"><i class="fa fa-list-alt"></i> Processes</a>
{{/if}}
</fieldset>
</div>
<div class="ui-block-b">
<fieldset data-role="controlgroup" data-type="horizontal">
{{#if public_url}}
<!--<a class="ui-btn ui-corner-all ui-btn-inline ui-mini" target='_blank' href="{{public_url}}" title="Public"><i class="fa fa-folder-open-o"></i> Public</a>-->
{{/if}}
{{#if private_url}}
<a class="ui-btn ui-corner-all ui-btn-inline ui-mini" target='_blank' href="{{private_url}}" title="Browse Private Directory"><i class="fa fa-lock"></i> Private Folder</a>
{{/if}}
{{#if rss_url}}
<a class="ui-btn ui-corner-all ui-btn-inline ui-mini" target='_blank' href="{{rss_url}}" title="RSS"><i class="fa fa-rss-square"></i> RSS</a>
{{/if}}
</fieldset>
</div>
</div>
<div class="ui-grid-a ui-responsive">
{{#with instance}}
<div class="ui-block-a">
<table data-role="table" data-mode="columntoggle" class="table-stroke">
<tr>
<th><i class="fa fa-desktop m-hidden"></i> <strong>Computer</strong></th>
<td title="Computer Reference">{{computer}}</td>
</tr>
<tr>
<th><i class="fa fa-square m-hidden"></i> <strong>Computer Partition</strong></th>
<td title="Partition Reference">{{partition}}</td>
</tr>
<tr>
<th><i class="fa fa-globe m-hidden"></i> <strong>IPv4 Address</strong></th>
<td title="IPv4">{{ipv4}}</td>
</tr>
<tr>
<th><i class="fa fa-globe m-hidden"></i> <strong>IPv6 Address</strong></th>
<td title="IPv6">{{ipv6}}</td>
</tr>
<tr>
<th><strong>Software Type</strong></th>
<td title="Software type">{{software-type}}</td>
</tr>
</table>
</div>
<div class="ui-block-b">
<table data-role="table" data-mode="columntoggle" class="table-stroke">
<tr>
<th><i class="fa fa-tachometer m-hidden"></i> <strong>Status</strong></th>
<td><span class="label label-{{../status}}">{{../status}}</span></td>
</tr>
<tr>
<th><i class="fa fa-clock-o m-hidden" aria-hidden="true"></i> <strong>Report Date</strong></th>
<td title="Report Date">{{../date}}</td>
</tr>
<tr>
<th><strong>Software Release</strong></th>
<td><a style="padding: 0; min-height: initial;" href="{{software-release}}" title="{{software-release}}" target='_blank'>Click to open <i class="fa fa-external-link"></i></a></td>
</tr>
<tr>
<th></i> <strong>Promises Error</strong></th>
<td title="Number of promises error in Software Instance">{{../error}}</td>
</tr>
<tr>
<th><strong>Promises OK</strong></th>
<td title="Number of promises OK in Software Instance">{{../success}}</td>
</tr>
</table>
</div>
{{/with}}
</div>
</div>
</div>
</div>
</script>
<script id="promiselist-widget-template" type="text/x-handlebars-template">
{{#if promise_list}}
<h2><i class="fa fa-th-list"></i> <strong>Software Instance Promises</strong></h2>
<div style="overflow: auto;" class="padding-lr-10">
<table data-role="table" data-mode="columntoggle" class="table-stroke">
{{#each promise_list}}
<tr title="Promise reported at {{../date}}">
<td><a href="{{href}}">{{title}}</a></td>
<td class="m-hidden" style="text-align: center;">{{../short_date}} {{time}}</td>
<td style="text-align: center;"><span class="label label-{{status}}">{{status}}</span></td>
</tr>
{{/each}}
</table>
</div>
{{/if}}
</script>
<!-- custom script -->
<script src="gadget_monitoring_software_instance_view.js" type="text/javascript"></script>
</head>
<body>
<div data-gadget-url="gadget_monitoring_jio.html" data-gadget-scope="jio_gadget" data-gadget-sandbox="public"></div>
<div data-gadget-url="gadget_monitoring_login_widget.html" data-gadget-scope="login_gadget" data-gadget-sandbox="public"></div>
<div class="ui-panel-overview">
<div class="overview-details">
</div>
<div class="graph-full">
<h2><i class="fa fa-line-chart" aria-hidden="true"></i> <strong>Promises result progression</strong></h2>
<div data-gadget-url="gadget_erp5_graph.html" data-gadget-scope="graph_gadget" class="graph graph-medium "></div>
</div>
<div class="promise-list">
</div>
</div>
</body>
</html>
/*global window, rJS, RSVP, Handlebars, loopEventListener, $ */
/*jslint nomen: true, indent: 2 */
(function (window, rJS, RSVP, Handlebars, loopEventListener, $) {
"use strict";
/////////////////////////////////////////////////////////////////
// templates
/////////////////////////////////////////////////////////////////
var gadget_klass = rJS(window),
templater = gadget_klass.__template_element;
/////////////////////////////////////////////////////////////////
// some methods
/////////////////////////////////////////////////////////////////
gadget_klass
/////////////////////////////////////////////////////////////////
// ready
/////////////////////////////////////////////////////////////////
.ready(function (gadget) {
gadget.property_dict = {
render_deferred: RSVP.defer()
};
})
.ready(function (gadget) {
return gadget.getElement()
.push(function (element) {
gadget.property_dict.element = element;
});
})
.ready(function (gadget) {
return gadget.getDeclaredGadget("jio_gadget")
.push(function (jio_gadget) {
gadget.property_dict.jio_gadget = jio_gadget;
});
})
.ready(function (gadget) {
return gadget.getDeclaredGadget("graph_gadget")
.push(function (graph_gadget) {
gadget.property_dict.graph = graph_gadget;
});
})
.ready(function (gadget) {
return gadget.getDeclaredGadget("login_gadget")
.push(function (login_gadget) {
gadget.property_dict.login_gadget = login_gadget;
});
})
/*.ready(function (gadget) {
return gadget.getSetting('instance_overview_selection')
.push(function (selection) {
gadget.property_dict.selection = selection || '';
});
})*/
/////////////////////////////////////////////////////////////////
// published methods
/////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////
// acquired methods
/////////////////////////////////////////////////////////////////
.declareAcquiredMethod("jio_get", "jio_get")
.declareAcquiredMethod("jio_allDocs", "jio_allDocs")
.declareAcquiredMethod("getUrlFor", "getUrlFor")
.declareAcquiredMethod("translate", "translate")
.declareAcquiredMethod("redirect", "redirect")
.declareAcquiredMethod("getSetting", "getSetting")
.declareAcquiredMethod("setSetting", "setSetting")
/////////////////////////////////////////////////////////////////
// declared methods
/////////////////////////////////////////////////////////////////
.declareMethod('render', function (option_dict) {
var gadget = this,
jio_options = {
type: "query",
sub_storage: {
type: "drivetojiomapping",
sub_storage: {
type: "dav",
url: option_dict.url
}
}
},
document_id = 'monitor.global';
return new RSVP.Queue()
.push(function () {
// This is needed now to get status_data in online mode
return gadget.property_dict.login_gadget.loginRedirect(
option_dict.url,
{
page: 'software_instance_view',
url: option_dict.url
},
option_dict.title,
option_dict.root_title
);
})
.push(function (cred) {
jio_options.sub_storage.sub_storage.basic_login = cred.hash;
gadget.property_dict.jio_gadget.createJio(jio_options);
return gadget.property_dict.jio_gadget.get(
document_id
);
})
.push(function (current_document) {
var instance_content,
promise_list_template;
if (current_document.hasOwnProperty('data') &&
current_document.data.hasOwnProperty('state')) {
jio_options.sub_storage.sub_storage.url = current_document._links.private_url.href + 'data/';
instance_content = Handlebars.compile(
templater.getElementById("details-widget-overview").innerHTML
),
promise_list_template = Handlebars.compile(
templater.getElementById("promiselist-widget-template").innerHTML
);
// Create online jio
gadget.property_dict.jio_gadget.createJio(jio_options, false);
return gadget.property_dict.jio_gadget.get(
current_document.data.state
)
.push(undefined, function (error) {
console.log(error);
return {};
})
.push(function (element_dict) {
$(gadget.property_dict.element.querySelector(".ui-block-b .ui-panel-overview")).show();
var content,
promise_content,
promise_list = [],
i,
tmp_url,
tmp_process_url,
promise_data = ["Date, Success, Error, Warning"];
gadget.property_dict.promise_data = element_dict.data || promise_data;
// Resource view URLs
tmp_url = "#page=resource_view&title=" + current_document.title +
"&root=" + current_document['hosting-title'] +
"&jio_for=" + current_document._links.private_url.href;
tmp_process_url = "#page=process_view&title=" + current_document.title +
"&root=" + current_document['hosting-title'] +
"&jio_for=" + current_document._links.private_url.href;
content = instance_content({
title: current_document.title,
root_title: current_document['hosting-title'],
date: current_document.date,
status: current_document.status,
error: current_document.state.error,
success: current_document.state.success,
instance: current_document._embedded.instance || '',
public_url: current_document._links.hasOwnProperty('public_url') ? current_document._links.public_url.href : '',
private_url: current_document._links.hasOwnProperty('private_url') ? current_document._links.private_url.href : '',
rss_url: current_document._links.hasOwnProperty('rss_url') ? current_document._links.rss_url.href : '',
resource_url: tmp_url,
process_url: tmp_process_url
});
if (current_document._embedded.promises !== undefined) {
for (i = 0; i < current_document._embedded.promises.length; i += 1) {
promise_list.push(current_document._embedded.promises[i]);
promise_list[i].href = "#page=view&jio_key=" +
promise_list[i].title + '.status' + "&jio_for=" +
current_document._links.public_url.href;
}
}
promise_content = promise_list_template({
promise_list: promise_list,
date: current_document.date,
short_date: new Date(current_document.date).toISOString().split('T')[0]
});
gadget.property_dict.element.querySelector(".overview-details")
.innerHTML = content;
gadget.property_dict.element.querySelector(".promise-list")
.innerHTML = promise_content;
return $(gadget.property_dict.element.querySelectorAll('fieldset[data-role="controlgroup"]'))
.controlgroup().controlgroup('refresh');
});
}
})
.push(function () {
return gadget.property_dict.render_deferred.resolve();
});
})
/////////////////////////////////////////////////////////////////
// declared service
/////////////////////////////////////////////////////////////////
.declareService(function () {
var gadget = this;
return new RSVP.Queue()
.push(function () {
return gadget.property_dict.render_deferred.promise;
})
.push(function () {
var data = gadget.property_dict.promise_data.join('\n');
return gadget.property_dict.graph.render(
data,
{
ylabel: '<span class="graph-label"><i class="fa fa-bar-chart"></i> Success/Failure count</span>',
legend: 'always',
labelsDivStyles: { 'textAlign': 'right' }
},
"customInteractionModel"
);
});
//return RSVP.all(promise_list);
});
}(window, rJS, RSVP, Handlebars, loopEventListener, $));
......@@ -70,6 +70,9 @@
return gadget.updateHeader(header)
.push(function () {
if (options.reset_filter === "1") {
return;
}
if (!options.hasOwnProperty('search') || !options.hasOwnProperty('filter')) {
return gadget.getSetting('status_list_selection_key')
.push(function (selection) {
......@@ -88,7 +91,11 @@
filter: options.filter || '',
search: options.search || ''
};
return gadget.setSetting('status_list_selection_key', selection);
if (options.reset_filter !== "1") {
return gadget.setSetting('status_list_selection_key', selection);
} else {
return '';
}
})
.push(function () {
if (options.root_title) {
......@@ -129,26 +136,37 @@
.declareAcquiredMethod("jio_get", "jio_get")
.declareAcquiredMethod("jio_allDocs", "jio_allDocs")
.declareService(function () {
var gadget = this;
var gadget = this,
current_sync_date;
return gadget.getSetting('status_list_refresh_id')
return gadget.getSetting('latest_sync_time')
.push(function (sync_time) {
current_sync_date = sync_time;
return gadget.getSetting('status_list_refresh_id');
})
.push(function (timer_id) {
var new_timer_id;
if (timer_id) {
clearTimeout(timer_id);
clearInterval(timer_id);
}
new_timer_id = setTimeout(function(){
new_timer_id = setInterval(function(){
var hash = window.location.toString().split('#')[1],
scroll_position,
doc = document.documentElement;
if (hash.indexOf('page=status_list') >= 0) {
scroll_position = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
return gadget.renderApplication({args: gadget.property_dict.options})
.push(function () {
$(document).scrollTop(scroll_position);
return gadget.getSetting('latest_sync_time')
.push(function (sync_time) {
if (sync_time > current_sync_date) {
scroll_position = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
current_sync_date = sync_time;
return gadget.renderApplication({args: gadget.property_dict.options})
.push(function () {
$(document).scrollTop(scroll_position);
});
}
});
}
}, 120000);
}, 60000);
return gadget.setSetting('status_list_refresh_id', new_timer_id);
});
......
......@@ -239,7 +239,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.28233.17496.1826</string> </value>
<value> <string>951.30706.51220.30105</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -257,7 +257,7 @@
</tuple>
<state>
<tuple>
<float>1464193389.51</float>
<float>1464340992.01</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -25,6 +25,7 @@
<tr rel="{{index}}">
<td class="ui-text-center"><a class="ui-link" href="{{href}}">
<span class="ui-status-icon ui-status-{{status}}"></span></a></td>
<td><a class="ui-link" href="{{href}}">{{date}}</a></td>
<td><a class="ui-link" href="{{href}}">{{value}}</a></td>
<td><a class="ui-link" href="{{href}}">{{hosting_value}}</a></td>
</tr>
......@@ -62,105 +63,12 @@
</div>
</script>
<script id="details-widget-overview" type="text/x-handlebars-template">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-cubes"></i><span>
{{#if root_title}}
{{root_title}} >&nbsp;
{{/if}}
{{title}}
</span>
</div>
<div class="commands">
</div>
</div>
</div>
<div class="content-details">
<div class="ui-text-left" style="padding-bottom: 15px;">
<h2><i class="fa fa-info-circle"></i> <strong>Instance State Information</strong></h2>
<div class="padding-10">
<div class="ui-grid-a ui-responsive">
<div class="ui-block-a">
<fieldset data-role="controlgroup" data-type="horizontal">
{{#if resource_url }}
<a href="{{resource_url}}" class="ui-btn ui-corner-all ui-btn-inline ui-mini" title="Instance Resource comsumption"><i class="fa fa-pie-chart"></i> Resources</a>
{{/if}}
{{#if process_url }}
<a href="{{process_url}}" class="ui-btn ui-corner-all ui-btn-inline ui-mini" title="Processes usage"><i class="fa fa-list-alt"></i> Processes</a>
{{/if}}
</fieldset>
</div>
<div class="ui-block-b">
<fieldset data-role="controlgroup" data-type="horizontal">
{{#if public_url}}
<!--<a class="ui-btn ui-corner-all ui-btn-inline ui-mini" target='_blank' href="{{public_url}}" title="Public"><i class="fa fa-folder-open-o"></i> Public</a>-->
{{/if}}
{{#if private_url}}
<a class="ui-btn ui-corner-all ui-btn-inline ui-mini" target='_blank' href="{{private_url}}" title="Browse Private Directory"><i class="fa fa-lock"></i> Private</a>
{{/if}}
{{#if rss_url}}
<a class="ui-btn ui-corner-all ui-btn-inline ui-mini" target='_blank' href="{{rss_url}}" title="RSS"><i class="fa fa-rss-square"></i> RSS</a>
{{/if}}
</fieldset>
</div>
</div>
<table data-role="table" data-mode="columntoggle" class="ui-responsive table-stroke">
<tr>
<th><i class="fa fa-tachometer"></i> <strong>Status</strong></th>
<td><span class="label label-{{status}}">{{status}}</span></td>
<td title="Report Date">{{date}}</td>
</tr>
{{#with instance}}
<tr>
<th><i class="fa fa-desktop"></i> <strong>Computer</strong></th>
<td title="Computer Reference">{{computer}}</td>
<td title="Partition Reference">{{partition}}</td>
</tr>
<tr>
<th><i class="fa fa-globe"></i> <strong>IP Addresses</strong></th>
<td title="IPv4">{{ipv4}}</td>
<td title="IPv6">{{ipv6}}</td>
</tr>
<tr>
<th><i class="fa fa-square-o" aria-hidden="true"></i> <strong>Software Type</strong></th>
<td title="Software type">{{software-type}}</td>
<td><a style="padding: 0; min-height: initial;" href="{{software-release}}" title="{{software-release}}" target='_blank'>Click to open <i class="fa fa-external-link"></i></a></td>
</tr>
{{/with}}
</table>
</div>
</div>
</div>
</script>
<script id="promiselist-widget-template" type="text/x-handlebars-template">
{{#if promise_list}}
<h2><i class="fa fa-th-list"></i> <strong>Instance Promises List</strong></h2>
<div style="overflow: auto;" class="padding-lr-10">
<table data-role="table" data-mode="columntoggle" class="table-stroke">
{{#each promise_list}}
<tr title="Promise reported at {{../date}}">
<td><a href="{{href}}">{{title}}</a></td>
<td style="text-align: center;">{{time}}</td>
<td style="text-align: center;"><span class="label label-{{status}}">{{status}}</span></td>
</tr>
{{/each}}
</table>
</div>
{{/if}}
</script>
<!-- custom script -->
<script src="gadget_monitoring_widget_overview.js" type="text/javascript"></script>
<script src="gadget_monitoring_widget_instance_list.js" type="text/javascript"></script>
</head>
<body>
<div data-gadget-url="gadget_monitoring_jio.html" data-gadget-scope="jio_gadget" data-gadget-sandbox="public"></div>
<div data-gadget-url="gadget_monitoring_login_widget.html" data-gadget-scope="login_gadget" data-gadget-sandbox="public"></div>
<div class="overview-filter-panel">
<form class='filter'>
<h2>Configure Displayed Result</h2>
......@@ -179,32 +87,18 @@
</form>
</div>
<div class="ui-grid-a ui-responsive custom-listbox">
<div class="ui-block-a">
<div class="ui-panel-overview" style="min-height: 450px;">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-desktop"></i><span>Software Instances List</span>
</div>
<div class="commands">
</div>
<div class="ui-grid-solo ui-responsive custom-listbox">
<div class="ui-panel-overview" style="min-height: 450px;">
<div class="overview-header">
<div class='content-title ui-instance-title'>
<div class="overview-title">
<i class="fa fa-desktop"></i><span>Software Instances List</span>
</div>
<div class="commands">
</div>
</div>
<div class="overview-content">
</div>
</div>
</div>
<div class="ui-block-b" style="position: relative">
<div class="signal ui-content-hidden"></div>
<div class="ui-panel-overview">
<div class="overview-details">
</div>
<div style="margin: 0 20px;">
<div data-gadget-url="gadget_erp5_graph.html" data-gadget-scope="graph_gadget" class="graph graph-medium "></div>
</div>
<div class="promise-list">
</div>
<div class="overview-content">
</div>
</div>
</div>
......
......@@ -80,7 +80,7 @@
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_monitoring_widget_overview.html</string> </value>
<value> <string>gadget_monitoring_widget_instance_list.html</string> </value>
</item>
<item>
<key> <string>description</string> </key>
......@@ -110,7 +110,7 @@
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Monitoring Widget Overview</string> </value>
<value> <string>Monitoring Widget Software Instance List</string> </value>
</item>
<item>
<key> <string>version</string> </key>
......@@ -243,7 +243,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.27817.37423.50688</string> </value>
<value> <string>951.29269.36506.17954</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -261,7 +261,7 @@
</tuple>
<state>
<tuple>
<float>1464168027.07</float>
<float>1464254807.83</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -76,7 +76,7 @@
</item>
<item>
<key> <string>default_reference</string> </key>
<value> <string>gadget_monitoring_widget_overview.js</string> </value>
<value> <string>gadget_monitoring_widget_instance_list.js</string> </value>
</item>
<item>
<key> <string>description</string> </key>
......@@ -106,7 +106,7 @@
</item>
<item>
<key> <string>title</string> </key>
<value> <string>Monitoring Widget Overview JS</string> </value>
<value> <string>Monitoring Widget Software Instance List JS</string> </value>
</item>
<item>
<key> <string>version</string> </key>
......@@ -239,7 +239,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>951.26805.9745.42530</string> </value>
<value> <string>951.29330.13166.23057</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -257,7 +257,7 @@
</tuple>
<state>
<tuple>
<float>1464168098.17</float>
<float>1464258374.01</float>
<string>UTC</string>
</tuple>
</state>
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment