Commit d5c8bf40 by kevalbhatt

ATLAS-3509 : UI: Add basic search hyperlink in metric popup

parent 6050a8e6
...@@ -470,4 +470,4 @@ div.columnmanager-dropdown-container { ...@@ -470,4 +470,4 @@ div.columnmanager-dropdown-container {
.w30 { .w30 {
width: 30% !important; width: 30% !important;
} }
\ No newline at end of file
...@@ -340,6 +340,10 @@ hr[size="10"] { ...@@ -340,6 +340,10 @@ hr[size="10"] {
border: none !important; border: none !important;
} }
.no-pointer {
pointer-events: none;
}
.position-relative { .position-relative {
position: relative; position: relative;
} }
......
...@@ -96,6 +96,31 @@ define(['require', ...@@ -96,6 +96,31 @@ define(['require',
//return options.inverse(this); //return options.inverse(this);
}); });
Handlebars.registerHelper('arithmetic', function(val1, operator, val2, options) {
var v1 = parseInt(val1) || 0,
v2 = parseInt(val2) || 0;
switch (operator) {
case '+':
return (v1 + v2);
break;
case '-':
return (v1 - v2);
break;
case '/':
return (v1 / v2);
break;
case '*':
return (v1 * v2);
break;
case '%':
return (v1 % v2);
break;
default:
return 0;
break;
}
});
Handlebars.registerHelper('lookup', function(obj, field, defaulValue) { Handlebars.registerHelper('lookup', function(obj, field, defaulValue) {
return (obj[field] ? obj[field] : (defaulValue ? defaulValue : "")); return (obj[field] ? obj[field] : (defaulValue ? defaulValue : ""));
}); });
......
...@@ -14,84 +14,76 @@ ...@@ -14,84 +14,76 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<div class="panel-group" id="accordion"> <div class="panel-group" id="accordion">
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefineLabel"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefineLabel">
{{#ifCond labels.length "===" 0}} {{#ifCond labels.length "===" 0}}
<div class="panel-heading collapsed" data-toggle="collapse" href="#collapse3" aria-expanded="false" style="width: 70%"> <div class="panel-heading collapsed" data-toggle="collapse" href={{div_1.anchor}} aria-expanded="false" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Labels </a> <a>Labels </a>
</h4> </h4>
<div class="btn-group pull-left"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div> </div>
</div>
{{else}} {{else}}
<div class="panel-heading" data-toggle="collapse" href="#collapse4" aria-expanded="true" style="width: 70%"> <div class="panel-heading" data-toggle="collapse" href={{div_2.anchor}} aria-expanded="true" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Labels </a> <a>Labels </a>
</h4> </h4>
<div class="btn-group pull-left"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div> </div>
</div>
{{/ifCond}} {{/ifCond}}
{{#ifCond readOnlyEntity "===" false}} {{#ifCond readOnlyEntity "===" false}}
<div class="panel-actions"> <div class="panel-actions">
{{#ifCond swapItem "!==" true}} {{#ifCond swapItem "!==" true}}
<button class="btn btn-action btn-sm" data-id="addLabels" {{#ifCond labels.length "===" 0}} data-original-title="Add User-Defined Labels" {{else}} data-original-title="Edit User-Defined Labels" {{/ifCond}}> <button class="btn btn-action btn-sm" data-id="addLabels" {{#ifCond labels.length "===" 0}} data-original-title="Add User-Defined Labels" {{else}} data-original-title="Edit User-Defined Labels" {{/ifCond}}>
{{#ifCond labels.length "===" 0}} Add {{else}} Edit {{/ifCond}} {{#ifCond labels.length "===" 0}} Add {{else}} Edit {{/ifCond}}
</button> </button>
{{/ifCond}} {{/ifCond}}
{{#ifCond saveLabels "===" true}} {{#ifCond saveLabels "===" true}}
<button class="btn btn-action btn-sm" data-id="saveLabels" data-original-title="Save User-Defined Labels">Save</button> <button class="btn btn-action btn-sm" data-id="saveLabels" data-original-title="Save User-Defined Labels">Save</button>
{{/ifCond}} {{/ifCond}}
</div> </div>
{{/ifCond}} {{/ifCond}}
<div id={{div_1.id}} {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
<div id="collapse3" {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
{{#ifCond labels.length "===" 0}} {{#ifCond labels.length "===" 0}}
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
{{#ifCond swapItem "===" true}} {{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select> <select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}} {{else}}
<div class="badge-container"> <div class="badge-container">
{{#each labels}} {{#each labels}}
<label class="label badge-default">{{this}}</label> <label class="btn btn-action btn-sm btn-blue no-pointer">{{this}}</label>
{{/each}} {{/each}}
</div>
{{/ifCond}}
</div>
</div> </div>
{{/ifCond}}
</div>
</div> </div>
</div>
{{/ifCond}} {{/ifCond}}
</div> </div>
{{#ifCond labels.length ">" 0}} {{#ifCond labels.length ">" 0}}
<div id="collapse4" class="panel-collapse collapse in" > <div id={{div_2.id}} class="panel-collapse collapse in">
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
{{#ifCond swapItem "===" true}} {{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select> <select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}} {{else}}
<div class="badge-container"> <div class="badge-container">
{{#each labels}} {{#each labels}}
<label class="label badge-default">{{this}}</label> <label class="btn btn-action btn-sm btn-blue no-pointer">{{this}}</label>
{{/each}} {{/each}}
</div>
{{/ifCond}}
</div>
</div> </div>
{{/ifCond}}
</div>
</div> </div>
</div> </div>
</div>
{{/ifCond}} {{/ifCond}}
</div> </div>
</div> </div>
\ No newline at end of file
...@@ -38,7 +38,12 @@ ...@@ -38,7 +38,12 @@
</td > </td >
</tr> </tr>
{{/each}} {{/each}}
<tr>
<td colspan="4">
<p class="errorMsg" data-id="charSupportMsg"></p>
</td>
</tr>
{{#ifCond items.length "===" 0}} {{#ifCond items.length "===" 0}}
All properties have been removed. To add a new property, click <a href="javascript:void(0)" data-id="addItem">here</a> No properties have been created yet. To add a property, click <a href="javascript:void(0)" data-id="addItem">here</a>
{{/ifCond}} {{/ifCond}}
</table> </table>
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefine"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefine">
{{#ifCond customAttibutes.length "===" 0}} {{#ifCond customAttibutes.length "===" 0}}
<div class="panel-heading collapsed" data-toggle="collapse" href="#collapse22" aria-expanded="false" style="width: 70%"> <div class="panel-heading collapsed" data-toggle="collapse" href={{divId_1.anchor}} aria-expanded="false" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>User-defined properties </a> <a>User-defined properties </a>
</h4> </h4>
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
</div> </div>
</div> </div>
{{else}} {{else}}
<div class="panel-heading" data-toggle="collapse" href="#collapse44" aria-expanded="true" style="width: 70%"> <div class="panel-heading" data-toggle="collapse" href={{divId_2.anchor}} aria-expanded="true" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>User-defined properties </a> <a>User-defined properties </a>
</h4> </h4>
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
</div> </div>
{{/ifCond}} {{/ifCond}}
<div id="collapse22" {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}> <div id={{divId_1.id}} {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
{{#ifCond customAttibutes.length "===" 0}} {{#ifCond customAttibutes.length "===" 0}}
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
...@@ -82,7 +82,7 @@ ...@@ -82,7 +82,7 @@
</div> </div>
{{#ifCond customAttibutes.length ">" 0}} {{#ifCond customAttibutes.length ">" 0}}
<div id="collapse44" class="panel-collapse collapse in" > <div id={{divId_2.id}} class="panel-collapse collapse in" >
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
......
...@@ -36,6 +36,33 @@ ...@@ -36,6 +36,33 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="classification">
<div class="panel-heading" data-toggle="collapse" href="#classificationCountCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>Classifications <span class="count">(0)</span></a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="classificationCountCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table classificationTable">
<thead>
<tr>
<th class="">Name</th>
<th class="">Count <span class="count">(0)</span></th>
</tr>
</thead>
<tbody data-id="classification-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats">
<div class="panel-heading" data-toggle="collapse" href="#serverDetailcollapse" aria-expanded="true"> <div class="panel-heading" data-toggle="collapse" href="#serverDetailcollapse" aria-expanded="true">
<h4 class="panel-title"> <h4 class="panel-title">
...@@ -96,7 +123,7 @@ ...@@ -96,7 +123,7 @@
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div> </div>
</div> </div>
<div id="systemDetailCollapse" class="panel-collapse collapse "> <div id="systemDetailCollapse" class="panel-collapse collapse">
<div class="panel-body"> <div class="panel-body">
<div class="col-sm-6"> <div class="col-sm-6">
<div class="card-container panel panel-primary"> <div class="card-container panel panel-primary">
...@@ -143,33 +170,6 @@ ...@@ -143,33 +170,6 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="classification">
<div class="panel-heading" data-toggle="collapse" href="#classificationCountCollapse" aria-expanded="false">
<h4 class="panel-title">
<a>Classifications <span class="count">(0)</span></a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="classificationCountCollapse" class="panel-collapse collapse">
<div class="panel-body">
<table class="table stat-table classificationTable">
<thead>
<tr>
<th class="">Name</th>
<th class="">Count <span class="count">(0)</span></th>
</tr>
</thead>
<tbody data-id="classification-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div> </div>
<div class="fontLoader-relative statsLoader show"> <div class="fontLoader-relative statsLoader show">
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
......
...@@ -26,19 +26,25 @@ ...@@ -26,19 +26,25 @@
<tbody> <tbody>
{{#each data}} {{#each data}}
<tr> <tr>
<td>{{@key}}</td> <td><a class="linkClicked" href="#!/search/searchResult?searchType=basic&type={{@key}}&includeDE=true">{{@key}}&nbsp;({{arithmetic this.active '+' this.deleted}})</a></td>
{{#if this.active}} {{#if this.active}}
<td>{{this.active}}</td> <td>
<a title="Search for active entities of type '{{@key}}'" class="linkClicked" href="#!/search/searchResult?searchType=basic&type={{@key}}">{{this.active}}</a>
</td>
{{else}} {{else}}
<td>0</td> <td>0</td>
{{/if}} {{/if}}
{{#if this.deleted}} {{#if this.deleted}}
<td>{{this.deleted}}</td> <td class="readOnlyLink">
<a title="Search for deleted entities of type '{{@key}}'" class="linkClicked" href="#!/search/searchResult?searchType=basic&type={{@key}}&includeDE=true">{{this.deleted}}</a>
</td>
{{else}} {{else}}
<td>0</td> <td>0</td>
{{/if}} {{/if}}
{{#if this.shell}} {{#if this.shell}}
<td>{{this.shell}}</td> <td>
{{this.shell}}
</td>
{{else}} {{else}}
<td>0</td> <td>0</td>
{{/if}} {{/if}}
......
...@@ -882,5 +882,63 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum ...@@ -882,5 +882,63 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum
}); });
} }
} }
CommonViewFunction.CheckDuplicateAndEmptyInput = function(elements, datalist) {
var keyMap = new Map(),
validation = true,
hasDup = [];
for (var i = 0; i < elements.length; i++) {
var input = elements[i],
pEl = input.nextElementSibling,
classes = 'form-control',
val = input.value.trim();
pEl.innerText = "";
if (val === '') {
classes = 'form-control errorClass';
validation = false;
pEl.innerText = 'Required!';
} else {
if (input.tagName === 'INPUT') {
var duplicates = datalist.filter(function(c) {
return c.key === val;
});
if (keyMap.has(val) || duplicates.length > 1) {
classes = 'form-control errorClass';
hasDup.push('duplicate');
pEl.innerText = 'Duplicate key';
} else {
keyMap.set(val, val);
}
}
}
input.setAttribute('class', classes);
}
return {
validation: validation,
hasDuplicate: (hasDup.length === 0 ? false : true)
};
}
CommonViewFunction.getRandomIdAndAnchor = function() {
var randomId = "collapse_" + parseInt((Math.random() * 100)) + "_" + new Date().getUTCMilliseconds();
return {
id: randomId,
anchor: "#" + randomId
};
}
CommonViewFunction.udKeysStringParser = function(udKeys) {
var o = {};
_.each(udKeys.split(','), function(udKey) {
var ud = udKey.split(':');
o[ud[0]] = ud[1];
})
return o;
}
CommonViewFunction.udKeysObjectToStringParser = function(udKeys) {
var list = _.map(udKeys, function(udKey) {
var t = udKey.key + ':' + udKey.value;
return t;
});
return list.join(',');
}
return CommonViewFunction; return CommonViewFunction;
}); });
\ No newline at end of file
...@@ -17,14 +17,15 @@ ...@@ -17,14 +17,15 @@
*/ */
define(['require', define(['require',
'backbone', 'backbone',
'hbs!tmpl/entity/EntityLabelDefineView_tmpl', 'hbs!tmpl/entity/EntityLabelDefineView_tmpl',
'models/VEntity', 'models/VEntity',
'utils/Utils', 'utils/Utils',
'utils/Messages', 'utils/Messages',
'utils/Enums' 'utils/Enums',
], function(require, Backbone, EntityLabelDefineView_tmpl, VEntity, Utils, Messages, Enums) { 'utils/CommonViewFunction',
'use strict'; ], function(require, Backbone, EntityLabelDefineView_tmpl, VEntity, Utils, Messages, Enums, CommonViewFunction) {
'use strict';
return Backbone.Marionette.LayoutView.extend({ return Backbone.Marionette.LayoutView.extend({
_viewName: 'REntityLabelDefineView', _viewName: 'REntityLabelDefineView',
...@@ -34,7 +35,9 @@ define(['require', ...@@ -34,7 +35,9 @@ define(['require',
swapItem: this.swapItem, swapItem: this.swapItem,
labels: this.labels, labels: this.labels,
saveLabels: this.saveLabels, saveLabels: this.saveLabels,
readOnlyEntity: this.readOnlyEntity readOnlyEntity: this.readOnlyEntity,
div_1: this.dynamicId_1,
div_2: this.dynamicId_2
}; };
}, },
ui: { ui: {
...@@ -51,36 +54,56 @@ define(['require', ...@@ -51,36 +54,56 @@ define(['require',
}, },
initialize: function(options) { initialize: function(options) {
var self = this; var self = this;
_.extend(this, _.pick(options, 'entity')); _.extend(this, _.pick(options, 'entity', 'customFilter'));
this.swapItem = false, this.saveLabels = false; this.swapItem = false, this.saveLabels = false;
this.readOnlyEntity = Enums.entityStateReadOnly[this.entity.status] this.readOnlyEntity = this.customFilter === undefined ? Enums.entityStateReadOnly[this.entity.status] : this.customFilter;
this.entityModel = new VEntity(this.entity); this.entityModel = new VEntity(this.entity);
this.labels = this.entity.labels || []; this.labels = this.entity.labels || [];
this.dynamicId_1 = CommonViewFunction.getRandomIdAndAnchor();
this.dynamicId_2 = CommonViewFunction.getRandomIdAndAnchor();
}, },
onRender: function() { onRender: function() {
this.populateLabelOptions(); this.populateLabelOptions();
}, },
bindEvents: function () { bindEvents: function() {},
},
populateLabelOptions: function() { populateLabelOptions: function() {
var that = this, var that = this,
str = this.labels.map(function (label) { str = this.labels.map(function(label) {
return "<option selected > "+ label +" </option>"; return "<option selected > " + label + " </option>";
}); });
this.ui.addLabelOptions.html(str); this.ui.addLabelOptions.html(str);
this.ui.addLabelOptions.select2({ this.ui.addLabelOptions.select2({
placeholder: "Select Label", placeholder: "Select Label",
allowClear: true, allowClear: false,
tags: true, tags: true,
multiple: true multiple: true,
matcher: function(params, data) {
if (params.term === data.text) {
return data;
}
return null;
},
templateResult: this.formatResultSearch
}); });
}, },
onChangeLabelChange: function () { formatResultSearch: function(state) {
this.labels = this.ui.addLabelOptions.val(); if (!state.id) {
return state.text;
}
if (!state.element) {
return $("<span>Add<strong> '" + state.text + "'</strong></span>");
}
}, },
handleBtnClick: function () { onChangeLabelChange: function() {
this.labels = this.ui.addLabelOptions.val().map(function(v) { return _.escape(v) });
},
handleBtnClick: function() {
this.swapItem = !this.swapItem; this.swapItem = !this.swapItem;
this.saveLabels = this.swapItem === true ? true : false; if (this.customFilter === undefined) {
this.saveLabels = this.swapItem === true ? true : false;
} else {
this.saveLabels = false;
}
this.render(); this.render();
}, },
saveUserDefinedLabels: function() { saveUserDefinedLabels: function() {
...@@ -88,7 +111,7 @@ define(['require', ...@@ -88,7 +111,7 @@ define(['require',
var entityJson = that.entityModel.toJSON(); var entityJson = that.entityModel.toJSON();
if (entityJson.labels !== undefined || this.labels.length !== 0) { if (entityJson.labels !== undefined || this.labels.length !== 0) {
var payload = this.labels; var payload = this.labels;
that.entityModel.saveEntityLabels(entityJson.guid ,{ that.entityModel.saveEntityLabels(entityJson.guid, {
data: JSON.stringify(payload), data: JSON.stringify(payload),
type: 'POST', type: 'POST',
success: function() { success: function() {
...@@ -108,18 +131,18 @@ define(['require', ...@@ -108,18 +131,18 @@ define(['require',
that.saveLabels = false; that.saveLabels = false;
that.render(); that.render();
}, },
error: function (e) { error: function(e) {
that.ui.saveLabels.attr("disabled", false); that.ui.saveLabels && that.ui.saveLabels.length > 0 && that.ui.saveLabels[0].setAttribute("disabled", false);
Utils.notifySuccess({ Utils.notifySuccess({
content: e.message content: e.message
}); });
}, },
complete: function () { complete: function() {
that.ui.saveLabels.attr("disabled", false); that.ui.saveLabels && that.ui.saveLabels.length > 0 && that.ui.saveLabels[0].setAttribute("disabled", false);
that.render(); that.render();
} }
}); });
} }
} }
}); });
}); });
\ No newline at end of file
...@@ -41,7 +41,8 @@ define(['require', ...@@ -41,7 +41,8 @@ define(['require',
itemKey: "[data-type='key']", itemKey: "[data-type='key']",
itemValue: "[data-type='value']", itemValue: "[data-type='value']",
addItem: "[data-id='addItem']", addItem: "[data-id='addItem']",
deleteItem: "[data-id='deleteItem']" deleteItem: "[data-id='deleteItem']",
charSupportMsg: "[data-id='charSupportMsg']"
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
...@@ -58,24 +59,17 @@ define(['require', ...@@ -58,24 +59,17 @@ define(['require',
* @constructs * @constructs
*/ */
initialize: function(options) { initialize: function(options) {
var that = this;
this.editMode = options.mode;
if (options.items.length === 0) { if (options.items.length === 0) {
this.items = [{ key: "", value: "", mode: this.editMode}]; this.items = [{ key: "", value: ""}];
} else { } else {
this.items = options.items.map(function(m) { this.items = options.items;
m.mode = that.editMode;
return m;
});
} }
}, },
onRender: function() { onRender: function() {
}, },
onAddItemClick: function(e) { onAddItemClick: function(e) {
var el = e.currentTarget; var el = e.currentTarget;
this.items.splice(parseInt(el.dataset.index) + 1, 0, { key: "", value: "", mode: this.editMode}); this.items.splice(parseInt(el.dataset.index) + 1, 0, { key: "", value: ""});
this.render(); this.render();
}, },
onDeleteItemClick: function(e) { onDeleteItemClick: function(e) {
...@@ -85,13 +79,26 @@ define(['require', ...@@ -85,13 +79,26 @@ define(['require',
}, },
onItemKeyChange: function (e) { onItemKeyChange: function (e) {
var el = e.currentTarget; var el = e.currentTarget;
var val = el.value; this.handleCharSupport(el);
this.items[ el.dataset.index].key = val; if (!el.value.trim().includes(':')) {
this.items[ el.dataset.index].key = _.escape(el.value.trim());
}
}, },
onItemValueChange: function (e) { onItemValueChange: function (e) {
var el = e.currentTarget; var el = e.currentTarget;
var val = el.value; this.handleCharSupport(el);
this.items[ el.dataset.index].value = el.value; if (!el.value.trim().includes(':')) {
this.items[ el.dataset.index].value = _.escape(el.value.trim());
}
},
handleCharSupport: function(el) {
if (el.value.trim().includes(':')) {
el.setAttribute('class', 'form-control errorClass');
this.ui.charSupportMsg.html("These special character '(:)' are not supported.");
} else {
el.setAttribute('class', 'form-control');
this.ui.charSupportMsg.html("");
}
} }
}); });
......
...@@ -22,8 +22,9 @@ define(['require', ...@@ -22,8 +22,9 @@ define(['require',
'models/VEntity', 'models/VEntity',
'utils/Utils', 'utils/Utils',
'utils/Enums', 'utils/Enums',
'utils/Messages' 'utils/Messages',
], function(require, Backbone, EntityUserDefineView_tmpl, VEntity, Utils, Enums, Messages) { 'utils/CommonViewFunction',
], function(require, Backbone, EntityUserDefineView_tmpl, VEntity, Utils, Enums, Messages, CommonViewFunction) {
'use strict'; 'use strict';
return Backbone.Marionette.LayoutView.extend({ return Backbone.Marionette.LayoutView.extend({
...@@ -34,7 +35,9 @@ define(['require', ...@@ -34,7 +35,9 @@ define(['require',
customAttibutes: this.customAttibutes, customAttibutes: this.customAttibutes,
readOnlyEntity : this.readOnlyEntity, readOnlyEntity : this.readOnlyEntity,
swapItem: this.swapItem, swapItem: this.swapItem,
saveAttrItems: this.saveAttrItems saveAttrItems: this.saveAttrItems,
divId_1: this.dynamicId_1,
divId_2: this.dynamicId_2
}; };
}, },
ui: { ui: {
...@@ -50,12 +53,14 @@ define(['require', ...@@ -50,12 +53,14 @@ define(['require',
return events; return events;
}, },
initialize: function(options) { initialize: function(options) {
_.extend(this, _.pick(options, 'entity')); _.extend(this, _.pick(options, 'entity', 'customFilter'));
this.userDefineAttr = this.entity.customAttributes || []; this.userDefineAttr = this.entity.customAttributes || [];
this.initialCall = false; this.initialCall = false;
this.swapItem = false, this.saveAttrItems = false; this.swapItem = false, this.saveAttrItems = false;
this.readOnlyEntity = Enums.entityStateReadOnly[this.entity.status]; this.readOnlyEntity = this.customFilter === undefined ? Enums.entityStateReadOnly[this.entity.status] : this.customFilter ;
this.entityModel = new VEntity(this.entity); this.entityModel = new VEntity(this.entity);
this.dynamicId_1 = CommonViewFunction.getRandomIdAndAnchor();
this.dynamicId_2 = CommonViewFunction.getRandomIdAndAnchor();
this.generateTableFields(); this.generateTableFields();
}, },
onRender: function() { onRender: function() {
...@@ -77,7 +82,11 @@ define(['require', ...@@ -77,7 +82,11 @@ define(['require',
}, },
onAddAttrClick: function() { onAddAttrClick: function() {
this.swapItem = !this.swapItem; this.swapItem = !this.swapItem;
this.saveAttrItems = this.swapItem === true ? true : false; if (this.customFilter === undefined) {
this.saveAttrItems = this.swapItem === true ? true : false;
} else {
this.saveAttrItems = false;
}
this.initialCall = true; this.initialCall = true;
this.render(); this.render();
if (this.swapItem === true) { if (this.swapItem === true) {
...@@ -115,7 +124,7 @@ define(['require', ...@@ -115,7 +124,7 @@ define(['require',
data: JSON.stringify(payload), data: JSON.stringify(payload),
type: 'POST', type: 'POST',
success: function() { success: function() {
var msg = that.initialCall ? 'addSuccessMessage' : 'editSuccessMessage', var msg = _.isEmpty(that.customAttibutes) ? 'addSuccessMessage' : 'editSuccessMessage',
caption = "One or more user-defined propertie"; // 's' will be added in abbreviation function caption = "One or more user-defined propertie"; // 's' will be added in abbreviation function
that.customAttibutes = list; that.customAttibutes = list;
if (list.length === 0) { if (list.length === 0) {
...@@ -146,41 +155,10 @@ define(['require', ...@@ -146,41 +155,10 @@ define(['require',
var self = this; var self = this;
this.ui.saveAttrItems.attr("disabled", true); this.ui.saveAttrItems.attr("disabled", true);
var list = itemView.$el.find("[data-type]"), var list = itemView.$el.find("[data-type]"),
keyMap = new Map(),
validation = true,
hasDup = [],
dataList = []; dataList = [];
Array.prototype.push.apply(dataList, itemView.items); Array.prototype.push.apply(dataList, itemView.items);
for(var i = 0; i < list.length ; i++) { var field = CommonViewFunction.CheckDuplicateAndEmptyInput(list, dataList);
var input = list[i], if (field.validation && !field.hasDuplicate) {
type = input.dataset.type,
pEl = itemView.$el.find(input.parentElement).find('p'),
classes = 'form-control',
val = input.value.trim();
pEl[0].innerText = "";
if (val === '') {
classes = 'form-control errorClass';
validation = false;
pEl[0].innerText = 'Required!';
} else {
if (input.tagName === 'INPUT') {
var duplicates = dataList.filter(function(c) {
return c.key === val;
});
if (keyMap.has(val) || duplicates.length > 1 ) {
classes = 'form-control errorClass';
hasDup.push('duplicate');
pEl[0].innerText = 'Duplicate key';
} else {
keyMap.set(val, val);
}
}
}
input.setAttribute('class', classes);
}
if (validation && hasDup.length === 0) {
self.saveAttributes(itemView.items); self.saveAttributes(itemView.items);
} else { } else {
this.ui.saveAttrItems.attr("disabled", false); this.ui.saveAttrItems.attr("disabled", false);
......
...@@ -43,8 +43,8 @@ define(['require', ...@@ -43,8 +43,8 @@ define(['require',
regions: {}, regions: {},
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
entityHeader: "[data-id='entity'] .count", entity: "[data-id='entity']",
classificationHeader: "[data-id='classification'] .count", classification: "[data-id='classification']",
serverCard: "[data-id='server-card']", serverCard: "[data-id='server-card']",
connectionCard: "[data-id='connection-card']", connectionCard: "[data-id='connection-card']",
notificationCard: "[data-id='notification-card']", notificationCard: "[data-id='notification-card']",
...@@ -54,10 +54,8 @@ define(['require', ...@@ -54,10 +54,8 @@ define(['require',
offsetCard: "[data-id='offset-card']", offsetCard: "[data-id='offset-card']",
osCard: "[data-id='os-card']", osCard: "[data-id='os-card']",
runtimeCard: "[data-id='runtime-card']", runtimeCard: "[data-id='runtime-card']",
memoryCard: "[data-id='memory-card']" memoryCard: "[data-id='memory-card']",
memoryPoolUsage: "[data-id='memory-pool-usage-card']"
}, },
/** ui events hash */ /** ui events hash */
events: function() {}, events: function() {},
...@@ -68,6 +66,7 @@ define(['require', ...@@ -68,6 +66,7 @@ define(['require',
initialize: function(options) { initialize: function(options) {
_.extend(this, options); _.extend(this, options);
var that = this; var that = this;
this.DATA_MAX_LENGTH = 25;
var modal = new Modal({ var modal = new Modal({
title: 'Statistics', title: 'Statistics',
content: this, content: this,
...@@ -91,7 +90,12 @@ define(['require', ...@@ -91,7 +90,12 @@ define(['require',
}); });
this.modal = modal; this.modal = modal;
}, },
bindEvents: function() {}, bindEvents: function() {
var that = this;
this.$el.on('click', '.linkClicked', function() {
that.modal.close();
})
},
fetchMetricData: function(options) { fetchMetricData: function(options) {
var that = this; var that = this;
this.metricCollection.fetch({ this.metricCollection.fetch({
...@@ -114,8 +118,14 @@ define(['require', ...@@ -114,8 +118,14 @@ define(['require',
}); });
}, },
onRender: function() { onRender: function() {
this.bindEvents();
this.fetchMetricData(); this.fetchMetricData();
}, },
closePanel: function(options) {
var el = options.el;
el.find(">.panel-heading").attr("aria-expanded", "false");
el.find(">.panel-collapse.collapse").removeClass("in");
},
genrateStatusData: function(stateObject) { genrateStatusData: function(stateObject) {
var that = this, var that = this,
stats = {}; stats = {};
...@@ -135,11 +145,16 @@ define(['require', ...@@ -135,11 +145,16 @@ define(['require',
createTable: function(obj) { createTable: function(obj) {
var that = this, var that = this,
tableBody = '', tableBody = '',
type = obj.type,
data = obj.data; data = obj.data;
_.each(data, function(value, key, list) { _.each(data, function(value, key, list) {
tableBody += '<tr><td>' + key + '</td><td class="">' + that.getValue({ var newValue = that.getValue({
"value": value "value": value
}) + '</td></tr>'; });
if (type === "classification") {
newValue = '<a title="Search for entities associated with \'' + key + '\'" class="linkClicked" href="#!/search/searchResult?searchType=basic&tag=' + key + '">' + newValue + '<a>';
}
tableBody += '<tr><td>' + key + '</td><td class="">' + newValue + '</td></tr>';
}); });
return tableBody; return tableBody;
...@@ -150,8 +165,9 @@ define(['require', ...@@ -150,8 +165,9 @@ define(['require',
classificationData = data.tag || {}, classificationData = data.tag || {},
tagEntitiesData = classificationData ? classificationData.tagEntities || {} : {}, tagEntitiesData = classificationData ? classificationData.tagEntities || {} : {},
tagsCount = 0, tagsCount = 0,
newTagEntitiesData = {}; newTagEntitiesData = {},
_.each(_.sortBy(_.keys(tagEntitiesData), function(o) { tagEntitiesKeys = _.keys(tagEntitiesData);
_.each(_.sortBy(tagEntitiesKeys, function(o) {
return o.toLocaleLowerCase(); return o.toLocaleLowerCase();
}), function(key) { }), function(key) {
var val = tagEntitiesData[key]; var val = tagEntitiesData[key];
...@@ -163,10 +179,16 @@ define(['require', ...@@ -163,10 +179,16 @@ define(['require',
if (!_.isEmpty(tagEntitiesData)) { if (!_.isEmpty(tagEntitiesData)) {
this.ui.classificationCard.html( this.ui.classificationCard.html(
that.createTable({ that.createTable({
"data": tagEntitiesData "data": tagEntitiesData,
"type": "classification"
}) })
); );
this.ui.classificationHeader.html("&nbsp;(" + _.numberFormatWithComa(tagsCount) + ")"); this.ui.classification.find(".count").html("&nbsp;(" + _.numberFormatWithComa(tagsCount) + ")");
if (tagEntitiesKeys.length > this.DATA_MAX_LENGTH) {
this.closePanel({
el: this.ui.classification
})
}
} }
}, },
renderEntities: function(options) { renderEntities: function(options) {
...@@ -185,13 +207,13 @@ define(['require', ...@@ -185,13 +207,13 @@ define(['require',
type = opt.type; type = opt.type;
_.each(entityData, function(val, key) { _.each(entityData, function(val, key) {
var intVal = _.isUndefined(val) ? 0 : val; var intVal = _.isUndefined(val) ? 0 : val;
if (type === "active") { if (type == "active") {
activeEntityCount += intVal; activeEntityCount += intVal;
} }
if (type === "deleted") { if (type == "deleted") {
deletedEntityCount += intVal; deletedEntityCount += intVal;
} }
if (type === "shell") { if (type == "shell") {
shellEntityCount += intVal shellEntityCount += intVal
} }
intVal = _.numberFormatWithComa(intVal) intVal = _.numberFormatWithComa(intVal)
...@@ -217,17 +239,23 @@ define(['require', ...@@ -217,17 +239,23 @@ define(['require',
"type": "shell" "type": "shell"
}); });
if (!_.isEmpty(stats)) { if (!_.isEmpty(stats)) {
that.ui.entityCard.html( var statsKeys = _.keys(stats);
this.ui.entityCard.html(
EntityTable({ EntityTable({
"data": _.pick(stats, _.sortBy(_.keys(stats), function(o) { "data": _.pick(stats, _.sortBy(statsKeys, function(o) {
return o.toLocaleLowerCase(); return o.toLocaleLowerCase();
})), })),
}) })
); );
that.$('[data-id="activeEntity"]').html("&nbsp;(" + _.numberFormatWithComa(activeEntityCount) + ")"); this.$('[data-id="activeEntity"]').html("&nbsp;(" + _.numberFormatWithComa(activeEntityCount) + ")");
that.$('[data-id="deletedEntity"]').html("&nbsp;(" + _.numberFormatWithComa(deletedEntityCount) + ")"); this.$('[data-id="deletedEntity"]').html("&nbsp;(" + _.numberFormatWithComa(deletedEntityCount) + ")");
that.$('[data-id="shellEntity"]').html("&nbsp;(" + _.numberFormatWithComa(shellEntityCount) + ")"); this.$('[data-id="shellEntity"]').html("&nbsp;(" + _.numberFormatWithComa(shellEntityCount) + ")");
that.ui.entityHeader.html("&nbsp;(" + _.numberFormatWithComa(data.general.entityCount) + ")"); this.ui.entity.find(".count").html("&nbsp;(" + _.numberFormatWithComa(data.general.entityCount) + ")");
if (statsKeys.length > this.DATA_MAX_LENGTH) {
this.closePanel({
el: this.ui.entity
})
}
} }
}, },
renderStats: function(options) { renderStats: function(options) {
......
...@@ -508,6 +508,10 @@ hr[size="10"] { ...@@ -508,6 +508,10 @@ hr[size="10"] {
border: none !important; border: none !important;
} }
.no-pointer {
pointer-events: none;
}
.position-relative { .position-relative {
position: relative; position: relative;
} }
......
...@@ -96,6 +96,31 @@ define(['require', ...@@ -96,6 +96,31 @@ define(['require',
//return options.inverse(this); //return options.inverse(this);
}); });
Handlebars.registerHelper('arithmetic', function(val1, operator, val2, options) {
var v1 = parseInt(val1) || 0,
v2 = parseInt(val2) || 0;
switch (operator) {
case '+':
return (v1 + v2);
break;
case '-':
return (v1 - v2);
break;
case '/':
return (v1 / v2);
break;
case '*':
return (v1 * v2);
break;
case '%':
return (v1 % v2);
break;
default:
return 0;
break;
}
});
Handlebars.registerHelper('lookup', function(obj, field, defaulValue) { Handlebars.registerHelper('lookup', function(obj, field, defaulValue) {
return (obj[field] ? obj[field] : (defaulValue ? defaulValue : "")); return (obj[field] ? obj[field] : (defaulValue ? defaulValue : ""));
}); });
......
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
</div> </div>
<div class="panel-actions"> <div class="panel-actions">
<div class="pretty p-switch p-fill" style="margin-right: 20px"> <div class="pretty p-switch p-fill" style="margin-right: 20px">
<input type="checkbox" data-id="noValueToggle" title="Show Empty Values"/> <input type="checkbox" data-id="noValueToggle" />
<div class="state p-primary"> <div class="state p-primary">
<label></label> <label></label>
</div> </div>
......
...@@ -14,84 +14,76 @@ ...@@ -14,84 +14,76 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<div class="panel-group" id="accordion"> <div class="panel-group" id="accordion">
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefineLabel"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefineLabel">
{{#ifCond labels.length "===" 0}} {{#ifCond labels.length "===" 0}}
<div class="panel-heading collapsed" data-toggle="collapse" href="#collapse3" aria-expanded="false" style="width: 70%"> <div class="panel-heading collapsed" data-toggle="collapse" href={{div_1.anchor}} aria-expanded="false" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Labels </a> <a>Labels </a>
</h4> </h4>
<div class="btn-group pull-left"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div> </div>
</div>
{{else}} {{else}}
<div class="panel-heading" data-toggle="collapse" href="#collapse4" aria-expanded="true" style="width: 70%"> <div class="panel-heading" data-toggle="collapse" href={{div_2.anchor}} aria-expanded="true" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>Labels </a> <a>Labels </a>
</h4> </h4>
<div class="btn-group pull-left"> <div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div> </div>
</div>
{{/ifCond}} {{/ifCond}}
{{#ifCond readOnlyEntity "===" false}} {{#ifCond readOnlyEntity "===" false}}
<div class="panel-actions"> <div class="panel-actions">
{{#ifCond swapItem "!==" true}} {{#ifCond swapItem "!==" true}}
<button class="btn btn-action btn-sm" data-id="addLabels" {{#ifCond labels.length "===" 0}} data-original-title="Add User-Defined Labels" {{else}} data-original-title="Edit User-Defined Labels" {{/ifCond}}> <button class="btn btn-action btn-sm" data-id="addLabels" {{#ifCond labels.length "===" 0}} data-original-title="Add User-Defined Labels" {{else}} data-original-title="Edit User-Defined Labels" {{/ifCond}}>
{{#ifCond labels.length "===" 0}} Add {{else}} Edit {{/ifCond}} {{#ifCond labels.length "===" 0}} Add {{else}} Edit {{/ifCond}}
</button> </button>
{{/ifCond}} {{/ifCond}}
{{#ifCond saveLabels "===" true}} {{#ifCond saveLabels "===" true}}
<button class="btn btn-action btn-sm" data-id="saveLabels" data-original-title="Save User-Defined Labels">Save</button> <button class="btn btn-action btn-sm" data-id="saveLabels" data-original-title="Save User-Defined Labels">Save</button>
{{/ifCond}} {{/ifCond}}
</div> </div>
{{/ifCond}} {{/ifCond}}
<div id={{div_1.id}} {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
<div id="collapse3" {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
{{#ifCond labels.length "===" 0}} {{#ifCond labels.length "===" 0}}
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
{{#ifCond swapItem "===" true}} {{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select> <select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}} {{else}}
<div class="badge-container"> <div class="badge-container">
{{#each labels}} {{#each labels}}
<label class="label badge-default">{{this}}</label> <label class="btn btn-action btn-sm btn-blue no-pointer">{{this}}</label>
{{/each}} {{/each}}
</div>
{{/ifCond}}
</div>
</div> </div>
{{/ifCond}}
</div>
</div> </div>
</div>
{{/ifCond}} {{/ifCond}}
</div> </div>
{{#ifCond labels.length ">" 0}} {{#ifCond labels.length ">" 0}}
<div id="collapse4" class="panel-collapse collapse in" > <div id={{div_2.id}} class="panel-collapse collapse in">
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
{{#ifCond swapItem "===" true}} {{#ifCond swapItem "===" true}}
<select class="form-control" data-id="addLabelOptions" multiple="multiple"></select> <select class="form-control" data-id="addLabelOptions" multiple="multiple"></select>
{{else}} {{else}}
<div class="badge-container"> <div class="badge-container">
{{#each labels}} {{#each labels}}
<label class="label badge-default">{{this}}</label> <label class="btn btn-action btn-sm btn-blue no-pointer">{{this}}</label>
{{/each}} {{/each}}
</div>
{{/ifCond}}
</div>
</div> </div>
{{/ifCond}}
</div>
</div> </div>
</div> </div>
</div>
{{/ifCond}} {{/ifCond}}
</div> </div>
</div> </div>
\ No newline at end of file
...@@ -14,31 +14,34 @@ ...@@ -14,31 +14,34 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<table class="custom-table"> <table class="custom-table">
{{#each items}} {{#each items}}
<tr class="custom-tr"> <tr class="custom-tr">
<td class="custom-col-1"> <td class="custom-col-1">
<input placeholder="key" type="text" data-type="key" data-index={{@index}} class="form-control" value={{key}}></input> <input placeholder="key" type="text" data-type="key" data-index={{@index}} class="form-control" value={{key}}></input>
<p class="errorMsg"></p> <p class="errorMsg"></p>
</td > </td>
<td class="custom-col-0"> : </td > <td class="custom-col-0"> : </td>
<td class="custom-col-1"> <td class="custom-col-1">
<textarea placeholder="value" data-type="value" data-index={{@index}} class="form-control" class="form-control">{{value}}</textarea> <textarea placeholder="value" data-type="value" data-index={{@index}} class="form-control" class="form-control">{{value}}</textarea>
<p class="errorMsg"></p> <p class="errorMsg"></p>
</td > </td>
<td class="custom-col-2"> <td class="custom-col-2">
<button class="btn btn-default btn-sm" title="" data-index={{@index}} data-id="deleteItem"> <button class="btn btn-default btn-sm" title="" data-index={{@index}} data-id="deleteItem">
<i class="fa fa-minus"> </i> <i class="fa fa-minus"> </i>
</button> </button>
<button class="btn btn-default btn-sm" title="" data-index={{@index}} data-id="addItem"> <button class="btn btn-default btn-sm" title="" data-index={{@index}} data-id="addItem">
<i class="fa fa-plus"> </i> <i class="fa fa-plus"> </i>
</button> </button>
</td > </td>
</tr> </tr>
{{/each}} {{/each}}
<tr>
<td colspan="4">
<p class="errorMsg" data-id="charSupportMsg"></p>
</td>
</tr>
{{#ifCond items.length "===" 0}} {{#ifCond items.length "===" 0}}
All properties have been removed. To add a new property, click <a href="javascript:void(0)" data-id="addItem">here</a> No properties have been created yet. To add a property, click <a href="javascript:void(0)" data-id="addItem">here</a>
{{/ifCond}} {{/ifCond}}
</table> </table>
\ No newline at end of file
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefine"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="userDefine">
{{#ifCond customAttibutes.length "===" 0}} {{#ifCond customAttibutes.length "===" 0}}
<div class="panel-heading collapsed" data-toggle="collapse" href="#collapse22" aria-expanded="false" style="width: 70%"> <div class="panel-heading collapsed" data-toggle="collapse" href={{divId_1.anchor}} aria-expanded="false" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>User-defined properties </a> <a>User-defined properties </a>
</h4> </h4>
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
</div> </div>
</div> </div>
{{else}} {{else}}
<div class="panel-heading" data-toggle="collapse" href="#collapse44" aria-expanded="true" style="width: 70%"> <div class="panel-heading" data-toggle="collapse" href={{divId_2.anchor}} aria-expanded="true" style="width: 70%">
<h4 class="panel-title"> <h4 class="panel-title">
<a>User-defined properties </a> <a>User-defined properties </a>
</h4> </h4>
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
</div> </div>
{{/ifCond}} {{/ifCond}}
<div id="collapse22" {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}> <div id={{divId_1.id}} {{#ifCond swapItem "===" false}} class="panel-collapse collapse" {{else}} class="panel-collapse collapse in" {{/ifCond}}>
{{#ifCond customAttibutes.length "===" 0}} {{#ifCond customAttibutes.length "===" 0}}
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
...@@ -82,7 +82,7 @@ ...@@ -82,7 +82,7 @@
</div> </div>
{{#ifCond customAttibutes.length ">" 0}} {{#ifCond customAttibutes.length ">" 0}}
<div id="collapse44" class="panel-collapse collapse in" > <div id={{divId_2.id}} class="panel-collapse collapse in" >
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
--> -->
<div class="panel panel-default expand_collapse_panel-icon right-icons"> <div class="panel panel-default expand_collapse_panel-icon right-icons">
<div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_classfication"> <div class="panel-heading dash-button-icon clearfix" data-toggle="collapse" aria-expanded="true" href="#c_classfication">
<i class="ec-icon fa"></i> <i class="ec-icon fa"></i>
<h4 class="panel-title">Classifications</h4> <h4 class="panel-title">Classifications</h4>
<div class="btn-group pull-right"> <div class="btn-group pull-right">
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
--> -->
<div class="panel panel-default expand_collapse_panel-icon right-icons"> <div class="panel panel-default expand_collapse_panel-icon right-icons">
<div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_customFilter"> <div class="panel-heading dash-button-icon clearfix" data-toggle="collapse" aria-expanded="true" href="#c_customFilter">
<i class="ec-icon fa"></i> <i class="ec-icon fa"></i>
<h4 class="panel-title">Custom Filters</h4> <h4 class="panel-title">Custom Filters</h4>
<div class="btn-group pull-right "> <div class="btn-group pull-right ">
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
--> -->
<div class="panel panel-default expand_collapse_panel-icon right-icons"> <div class="panel panel-default expand_collapse_panel-icon right-icons">
<div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_entity"> <div class="panel-heading dash-button-icon clearfix" data-toggle="collapse" aria-expanded="true" href="#c_entity">
<i class="ec-icon fa"></i> <i class="ec-icon fa"></i>
<h4 class="panel-title">Entities</h4> <h4 class="panel-title">Entities</h4>
<div class="btn-group pull-right"> <div class="btn-group pull-right">
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
--> -->
<div class="panel panel-default expand_collapse_panel-icon right-icons"> <div class="panel panel-default expand_collapse_panel-icon right-icons">
<div class="panel-heading dash-button-icon" data-toggle="collapse" aria-expanded="true" href="#c_term"> <div class="panel-heading dash-button-icon clearfix" data-toggle="collapse" aria-expanded="true" href="#c_term">
<i class="ec-icon fa"></i> <i class="ec-icon fa"></i>
<h4 class="panel-title">Glossaries</h4> <h4 class="panel-title">Glossaries</h4>
<div class="btn-group pull-right"> <div class="btn-group pull-right">
......
...@@ -36,6 +36,33 @@ ...@@ -36,6 +36,33 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="classification">
<div class="panel-heading" data-toggle="collapse" href="#classificationCountCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>Classifications <span class="count">(0)</span></a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="classificationCountCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table classificationTable">
<thead>
<tr>
<th class="">Name</th>
<th class="">Count <span class="count">(0)</span></th>
</tr>
</thead>
<tbody data-id="classification-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats">
<div class="panel-heading" data-toggle="collapse" href="#serverDetailcollapse" aria-expanded="true"> <div class="panel-heading" data-toggle="collapse" href="#serverDetailcollapse" aria-expanded="true">
<h4 class="panel-title"> <h4 class="panel-title">
...@@ -87,8 +114,7 @@ ...@@ -87,8 +114,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="systemDetails">
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="systemDetails">
<div class="panel-heading" data-toggle="collapse" href="#systemDetailCollapse" aria-expanded="false"> <div class="panel-heading" data-toggle="collapse" href="#systemDetailCollapse" aria-expanded="false">
<h4 class="panel-title"> <h4 class="panel-title">
<a>System Details</a> <a>System Details</a>
...@@ -144,34 +170,7 @@ ...@@ -144,34 +170,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="classification">
<div class="panel-heading" data-toggle="collapse" href="#classificationCountCollapse" aria-expanded="false">
<h4 class="panel-title">
<a>Classifications <span class="count">(0)</span></a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="classificationCountCollapse" class="panel-collapse collapse">
<div class="panel-body">
<table class="table stat-table classificationTable">
<thead>
<tr>
<th class="">Name</th>
<th class="">Count <span class="count">(0)</span></th>
</tr>
</thead>
<tbody data-id="classification-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div> </div>
<div class="fontLoader-relative statsLoader show"> <div class="fontLoader-relative statsLoader show">
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
</div> </div>
\ No newline at end of file
...@@ -26,19 +26,25 @@ ...@@ -26,19 +26,25 @@
<tbody> <tbody>
{{#each data}} {{#each data}}
<tr> <tr>
<td>{{@key}}</td> <td><a class="linkClicked" href="#!/search/searchResult?searchType=basic&type={{@key}}&includeDE=true">{{@key}}&nbsp;({{arithmetic this.active '+' this.deleted}})</a></td>
{{#if this.active}} {{#if this.active}}
<td>{{this.active}}</td> <td>
<a title="Search for active entities of type '{{@key}}'" class="linkClicked" href="#!/search/searchResult?searchType=basic&type={{@key}}">{{this.active}}</a>
</td>
{{else}} {{else}}
<td>0</td> <td>0</td>
{{/if}} {{/if}}
{{#if this.deleted}} {{#if this.deleted}}
<td>{{this.deleted}}</td> <td class="readOnlyLink">
<a title="Search for deleted entities of type '{{@key}}'" class="linkClicked" href="#!/search/searchResult?searchType=basic&type={{@key}}&includeDE=true">{{this.deleted}}</a>
</td>
{{else}} {{else}}
<td>0</td> <td>0</td>
{{/if}} {{/if}}
{{#if this.shell}} {{#if this.shell}}
<td>{{this.shell}}</td> <td>
{{this.shell}}
</td>
{{else}} {{else}}
<td>0</td> <td>0</td>
{{/if}} {{/if}}
......
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
<h1 class="title"><span data-id="title"></span></h1> <h1 class="title"><span data-id="title"></span></h1>
<button type="button" data-id="editButton" class="btn btn-sm btn-action pull-right"><i class="fa fa-pencil"></i></button> <button type="button" data-id="editButton" class="btn btn-sm btn-action pull-right"><i class="fa fa-pencil"></i></button>
<p class="form-group col-sm-12" data-id="description"></p> <p class="form-group col-sm-12" data-id="description"></p>
<div class="superType form-group" style="display:none"> <div class="superType form-group col-sm-12" style="display:none">
<label class="control-label-sm-pr pull-left">Direct super-classifications:</label> <label class="control-label-sm-pr pull-left">Direct super-classifications:</label>
<div data-id="superType" class="btn-inline"> <div data-id="superType" class="btn-inline">
</div> </div>
......
...@@ -372,7 +372,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum ...@@ -372,7 +372,7 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum
return '<span class="operator">' + obj.condition + '</span>' + '(' + objToString(obj).join("") + ')'; return '<span class="operator">' + obj.condition + '</span>' + '(' + objToString(obj).join("") + ')';
} else { } else {
if (isCapsuleView) { if (isCapsuleView) {
return '<div class="capsuleView"><span class="key">' + _.escape(obj.id) + '</span><span class="operator">' + _.escape(obj.operator) + '</span><span class="value">' + _.escape(obj.value) + "</span><div class='fa fa-close clear-attr' data-type=" + type + " data-id="+_.escape(obj.id)+"></div></div>"; return '<div class="capsuleView"><span class="key">' + _.escape(obj.id) + '</span><span class="operator">' + _.escape(obj.operator) + '</span><span class="value">' + _.escape(obj.value) + "</span><div class='fa fa-close clear-attr' data-type=" + type + " data-id=" + _.escape(obj.id) + "></div></div>";
} }
return '<span class="key">' + _.escape(obj.id) + '</span><span class="operator">' + _.escape(obj.operator) + '</span><span class="value">' + _.escape(obj.value) + "</span>"; return '<span class="key">' + _.escape(obj.id) + '</span><span class="operator">' + _.escape(obj.operator) + '</span><span class="value">' + _.escape(obj.value) + "</span>";
} }
...@@ -902,5 +902,63 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum ...@@ -902,5 +902,63 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages', 'utils/Enum
}); });
} }
} }
CommonViewFunction.CheckDuplicateAndEmptyInput = function(elements, datalist, view) {
var keyMap = new Map(),
validation = true,
hasDup = [];
for (var i = 0; i < elements.length; i++) {
var input = elements[i],
pEl = input.nextElementSibling,
classes = 'form-control',
val = input.value.trim();
pEl.innerText = "";
if (val === '') {
classes = 'form-control errorClass';
validation = false;
pEl.innerText = 'Required!';
} else {
if (input.tagName === 'INPUT') {
var duplicates = datalist.filter(function(c) {
return c.key === val;
});
if (keyMap.has(val) || duplicates.length > 1) {
classes = 'form-control errorClass';
hasDup.push('duplicate');
pEl.innerText = 'Duplicate key';
} else {
keyMap.set(val, val);
}
}
}
input.setAttribute('class', classes);
}
return {
validation: validation,
hasDuplicate: (hasDup.length === 0 ? false : true)
};
}
CommonViewFunction.getRandomIdAndAnchor = function() {
var randomId = "collapse_" + parseInt((Math.random() * 100)) + "_" + new Date().getUTCMilliseconds();
return {
id: randomId,
anchor: "#" + randomId
};
}
CommonViewFunction.udKeysStringParser = function(udKeys) {
var o = {};
_.each(udKeys.split(','), function(udKey) {
var ud = udKey.split(':');
o[ud[0]] = ud[1];
})
return o;
}
CommonViewFunction.udKeysObjectToStringParser = function(udKeys) {
var list = _.map(udKeys, function(udKey) {
var t = udKey.key + ':' + udKey.value;
return t;
});
return list.join(',');
}
return CommonViewFunction; return CommonViewFunction;
}); });
\ No newline at end of file
...@@ -17,14 +17,15 @@ ...@@ -17,14 +17,15 @@
*/ */
define(['require', define(['require',
'backbone', 'backbone',
'hbs!tmpl/entity/EntityLabelDefineView_tmpl', 'hbs!tmpl/entity/EntityLabelDefineView_tmpl',
'models/VEntity', 'models/VEntity',
'utils/Utils', 'utils/Utils',
'utils/Messages', 'utils/Messages',
'utils/Enums' 'utils/Enums',
], function(require, Backbone, EntityLabelDefineView_tmpl, VEntity, Utils, Messages, Enums) { 'utils/CommonViewFunction',
'use strict'; ], function(require, Backbone, EntityLabelDefineView_tmpl, VEntity, Utils, Messages, Enums, CommonViewFunction) {
'use strict';
return Backbone.Marionette.LayoutView.extend({ return Backbone.Marionette.LayoutView.extend({
_viewName: 'REntityLabelDefineView', _viewName: 'REntityLabelDefineView',
...@@ -34,7 +35,9 @@ define(['require', ...@@ -34,7 +35,9 @@ define(['require',
swapItem: this.swapItem, swapItem: this.swapItem,
labels: this.labels, labels: this.labels,
saveLabels: this.saveLabels, saveLabels: this.saveLabels,
readOnlyEntity: this.readOnlyEntity readOnlyEntity: this.readOnlyEntity,
div_1: this.dynamicId_1,
div_2: this.dynamicId_2
}; };
}, },
ui: { ui: {
...@@ -51,36 +54,56 @@ define(['require', ...@@ -51,36 +54,56 @@ define(['require',
}, },
initialize: function(options) { initialize: function(options) {
var self = this; var self = this;
_.extend(this, _.pick(options, 'entity')); _.extend(this, _.pick(options, 'entity', 'customFilter'));
this.swapItem = false, this.saveLabels = false; this.swapItem = false, this.saveLabels = false;
this.readOnlyEntity = Enums.entityStateReadOnly[this.entity.status] this.readOnlyEntity = this.customFilter === undefined ? Enums.entityStateReadOnly[this.entity.status] : this.customFilter;
this.entityModel = new VEntity(this.entity); this.entityModel = new VEntity(this.entity);
this.labels = this.entity.labels || []; this.labels = this.entity.labels || [];
this.dynamicId_1 = CommonViewFunction.getRandomIdAndAnchor();
this.dynamicId_2 = CommonViewFunction.getRandomIdAndAnchor();
}, },
onRender: function() { onRender: function() {
this.populateLabelOptions(); this.populateLabelOptions();
}, },
bindEvents: function () { bindEvents: function() {},
},
populateLabelOptions: function() { populateLabelOptions: function() {
var that = this, var that = this,
str = this.labels.map(function (label) { str = this.labels.map(function(label) {
return "<option selected > "+ label +" </option>"; return "<option selected > " + label + " </option>";
}); });
this.ui.addLabelOptions.html(str); this.ui.addLabelOptions.html(str);
this.ui.addLabelOptions.select2({ this.ui.addLabelOptions.select2({
placeholder: "Select Label", placeholder: "Select Label",
allowClear: true, allowClear: false,
tags: true, tags: true,
multiple: true multiple: true,
matcher: function(params, data) {
if (params.term === data.text) {
return data;
}
return null;
},
templateResult: this.formatResultSearch
}); });
}, },
onChangeLabelChange: function () { formatResultSearch: function(state) {
this.labels = this.ui.addLabelOptions.val(); if (!state.id) {
return state.text;
}
if (!state.element) {
return $("<span>Add<strong> '" + state.text + "'</strong></span>");
}
}, },
handleBtnClick: function () { onChangeLabelChange: function() {
this.labels = this.ui.addLabelOptions.val().map(function(v) { return _.escape(v) });
},
handleBtnClick: function() {
this.swapItem = !this.swapItem; this.swapItem = !this.swapItem;
this.saveLabels = this.swapItem === true ? true : false; if (this.customFilter === undefined) {
this.saveLabels = this.swapItem === true ? true : false;
} else {
this.saveLabels = false;
}
this.render(); this.render();
}, },
saveUserDefinedLabels: function() { saveUserDefinedLabels: function() {
...@@ -88,12 +111,12 @@ define(['require', ...@@ -88,12 +111,12 @@ define(['require',
var entityJson = that.entityModel.toJSON(); var entityJson = that.entityModel.toJSON();
if (entityJson.labels !== undefined || this.labels.length !== 0) { if (entityJson.labels !== undefined || this.labels.length !== 0) {
var payload = this.labels; var payload = this.labels;
that.entityModel.saveEntityLabels(entityJson.guid ,{ that.entityModel.saveEntityLabels(entityJson.guid, {
data: JSON.stringify(payload), data: JSON.stringify(payload),
type: 'POST', type: 'POST',
success: function() { success: function() {
var msg = entityJson.labels === undefined ? 'addSuccessMessage' : 'editSuccessMessage', var msg = entityJson.labels === undefined ? 'addSuccessMessage' : 'editSuccessMessage',
caption = "One or more label"; caption = "One or more label";
if (payload.length === 0) { if (payload.length === 0) {
msg = 'removeSuccessMessage'; msg = 'removeSuccessMessage';
caption = "One or more existing label"; caption = "One or more existing label";
...@@ -102,19 +125,19 @@ define(['require', ...@@ -102,19 +125,19 @@ define(['require',
that.entityModel.set('labels', payload); that.entityModel.set('labels', payload);
} }
Utils.notifySuccess({ Utils.notifySuccess({
content: caption + Messages.getAbbreviationMsg(true, msg) content: caption + Messages.getAbbreviationMsg(true, msg)
}); });
that.swapItem = false; that.swapItem = false;
that.saveLabels = false; that.saveLabels = false;
that.render(); that.render();
}, },
error: function (e) { error: function(e) {
that.ui.saveLabels.attr("disabled", false); that.ui.saveLabels.attr("disabled", false);
Utils.notifySuccess({ Utils.notifySuccess({
content: e.message content: e.message
}); });
}, },
complete: function () { complete: function() {
that.ui.saveLabels.attr("disabled", false); that.ui.saveLabels.attr("disabled", false);
that.render(); that.render();
} }
...@@ -122,4 +145,4 @@ define(['require', ...@@ -122,4 +145,4 @@ define(['require',
} }
} }
}); });
}); });
\ No newline at end of file
...@@ -41,7 +41,8 @@ define(['require', ...@@ -41,7 +41,8 @@ define(['require',
itemKey: "[data-type='key']", itemKey: "[data-type='key']",
itemValue: "[data-type='value']", itemValue: "[data-type='value']",
addItem: "[data-id='addItem']", addItem: "[data-id='addItem']",
deleteItem: "[data-id='deleteItem']" deleteItem: "[data-id='deleteItem']",
charSupportMsg: "[data-id='charSupportMsg']"
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
...@@ -58,24 +59,17 @@ define(['require', ...@@ -58,24 +59,17 @@ define(['require',
* @constructs * @constructs
*/ */
initialize: function(options) { initialize: function(options) {
var that = this;
this.editMode = options.mode;
if (options.items.length === 0) { if (options.items.length === 0) {
this.items = [{ key: "", value: "", mode: this.editMode}]; this.items = [{ key: "", value: ""}];
} else { } else {
this.items = options.items.map(function(m) { this.items = options.items;
m.mode = that.editMode;
return m;
});
} }
}, },
onRender: function() { onRender: function() {
}, },
onAddItemClick: function(e) { onAddItemClick: function(e) {
var el = e.currentTarget; var el = e.currentTarget;
this.items.splice(parseInt(el.dataset.index) + 1, 0, { key: "", value: "", mode: this.editMode}); this.items.splice(parseInt(el.dataset.index) + 1, 0, { key: "", value: ""});
this.render(); this.render();
}, },
onDeleteItemClick: function(e) { onDeleteItemClick: function(e) {
...@@ -85,13 +79,26 @@ define(['require', ...@@ -85,13 +79,26 @@ define(['require',
}, },
onItemKeyChange: function (e) { onItemKeyChange: function (e) {
var el = e.currentTarget; var el = e.currentTarget;
var val = el.value; this.handleCharSupport(el);
this.items[ el.dataset.index].key = val; if (!el.value.trim().includes(':')) {
this.items[ el.dataset.index].key = _.escape(el.value.trim());
}
}, },
onItemValueChange: function (e) { onItemValueChange: function (e) {
var el = e.currentTarget; var el = e.currentTarget;
var val = el.value; this.handleCharSupport(el);
this.items[ el.dataset.index].value = el.value; if (!el.value.trim().includes(':')) {
this.items[ el.dataset.index].value = _.escape(el.value.trim());
}
},
handleCharSupport: function(el) {
if (el.value.trim().includes(':')) {
el.setAttribute('class', 'form-control errorClass');
this.ui.charSupportMsg.html("These special character '(:)' are not supported.");
} else {
el.setAttribute('class', 'form-control');
this.ui.charSupportMsg.html("");
}
} }
}); });
......
...@@ -22,8 +22,9 @@ define(['require', ...@@ -22,8 +22,9 @@ define(['require',
'models/VEntity', 'models/VEntity',
'utils/Utils', 'utils/Utils',
'utils/Enums', 'utils/Enums',
'utils/Messages' 'utils/Messages',
], function(require, Backbone, EntityUserDefineView_tmpl, VEntity, Utils, Enums, Messages) { 'utils/CommonViewFunction',
], function(require, Backbone, EntityUserDefineView_tmpl, VEntity, Utils, Enums, Messages, CommonViewFunction) {
'use strict'; 'use strict';
return Backbone.Marionette.LayoutView.extend({ return Backbone.Marionette.LayoutView.extend({
...@@ -34,7 +35,9 @@ define(['require', ...@@ -34,7 +35,9 @@ define(['require',
customAttibutes: this.customAttibutes, customAttibutes: this.customAttibutes,
readOnlyEntity : this.readOnlyEntity, readOnlyEntity : this.readOnlyEntity,
swapItem: this.swapItem, swapItem: this.swapItem,
saveAttrItems: this.saveAttrItems saveAttrItems: this.saveAttrItems,
divId_1: this.dynamicId_1,
divId_2: this.dynamicId_2
}; };
}, },
ui: { ui: {
...@@ -50,12 +53,14 @@ define(['require', ...@@ -50,12 +53,14 @@ define(['require',
return events; return events;
}, },
initialize: function(options) { initialize: function(options) {
_.extend(this, _.pick(options, 'entity')); _.extend(this, _.pick(options, 'entity', 'customFilter'));
this.userDefineAttr = this.entity.customAttributes || []; this.userDefineAttr = this.entity.customAttributes || [];
this.initialCall = false; this.initialCall = false;
this.swapItem = false, this.saveAttrItems = false; this.swapItem = false, this.saveAttrItems = false;
this.readOnlyEntity = Enums.entityStateReadOnly[this.entity.status]; this.readOnlyEntity = this.customFilter === undefined ? Enums.entityStateReadOnly[this.entity.status] : this.customFilter ;
this.entityModel = new VEntity(this.entity); this.entityModel = new VEntity(this.entity);
this.dynamicId_1 = CommonViewFunction.getRandomIdAndAnchor();
this.dynamicId_2 = CommonViewFunction.getRandomIdAndAnchor();
this.generateTableFields(); this.generateTableFields();
}, },
onRender: function() { onRender: function() {
...@@ -77,7 +82,11 @@ define(['require', ...@@ -77,7 +82,11 @@ define(['require',
}, },
onAddAttrClick: function() { onAddAttrClick: function() {
this.swapItem = !this.swapItem; this.swapItem = !this.swapItem;
this.saveAttrItems = this.swapItem === true ? true : false; if (this.customFilter === undefined) {
this.saveAttrItems = this.swapItem === true ? true : false;
} else {
this.saveAttrItems = false;
}
this.initialCall = true; this.initialCall = true;
this.render(); this.render();
if (this.swapItem === true) { if (this.swapItem === true) {
...@@ -146,41 +155,10 @@ define(['require', ...@@ -146,41 +155,10 @@ define(['require',
var self = this; var self = this;
this.ui.saveAttrItems.attr("disabled", true); this.ui.saveAttrItems.attr("disabled", true);
var list = itemView.$el.find("[data-type]"), var list = itemView.$el.find("[data-type]"),
keyMap = new Map(),
validation = true,
hasDup = [],
dataList = []; dataList = [];
Array.prototype.push.apply(dataList, itemView.items); Array.prototype.push.apply(dataList, itemView.items);
for(var i = 0; i < list.length ; i++) { var field = CommonViewFunction.CheckDuplicateAndEmptyInput(list, dataList);
var input = list[i], if (field.validation && !field.hasDuplicate) {
type = input.dataset.type,
pEl = itemView.$el.find(input.parentElement).find('p'),
classes = 'form-control',
val = input.value.trim();
pEl[0].innerText = "";
if (val === '') {
classes = 'form-control errorClass';
validation = false;
pEl[0].innerText = 'Required!';
} else {
if (input.tagName === 'INPUT') {
var duplicates = dataList.filter(function(c) {
return c.key === val;
});
if (keyMap.has(val) || duplicates.length > 1 ) {
classes = 'form-control errorClass';
hasDup.push('duplicate');
pEl[0].innerText = 'Duplicate key';
} else {
keyMap.set(val, val);
}
}
}
input.setAttribute('class', classes);
}
if (validation && hasDup.length === 0) {
self.saveAttributes(itemView.items); self.saveAttributes(itemView.items);
} else { } else {
this.ui.saveAttrItems.attr("disabled", false); this.ui.saveAttrItems.attr("disabled", false);
......
...@@ -440,7 +440,7 @@ define(['require', ...@@ -440,7 +440,7 @@ define(['require',
} }
}, },
"themes": { "themes": {
"name": that.isAssignView ? "default" : "proton", "name": that.isAssignView ? "default" : "default-dark",
"dots": true "dots": true
}, },
} }
...@@ -556,10 +556,9 @@ define(['require', ...@@ -556,10 +556,9 @@ define(['require',
createTermAction: function() { createTermAction: function() {
var that = this; var that = this;
Utils.generatePopover({ Utils.generatePopover({
el: this.$el, el: this.$('.termPopover'),
contentClass: 'termPopoverOptions', contentClass: 'termPopoverOptions',
popoverOptions: { popoverOptions: {
selector: '[rel="popover"].termPopover',
content: function() { content: function() {
var node = that.query[that.viewType], var node = that.query[that.viewType],
liString = ""; liString = "";
......
...@@ -43,8 +43,8 @@ define(['require', ...@@ -43,8 +43,8 @@ define(['require',
regions: {}, regions: {},
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
entityHeader: "[data-id='entity'] .count", entity: "[data-id='entity']",
classificationHeader: "[data-id='classification'] .count", classification: "[data-id='classification']",
serverCard: "[data-id='server-card']", serverCard: "[data-id='server-card']",
connectionCard: "[data-id='connection-card']", connectionCard: "[data-id='connection-card']",
notificationCard: "[data-id='notification-card']", notificationCard: "[data-id='notification-card']",
...@@ -66,6 +66,7 @@ define(['require', ...@@ -66,6 +66,7 @@ define(['require',
initialize: function(options) { initialize: function(options) {
_.extend(this, options); _.extend(this, options);
var that = this; var that = this;
this.DATA_MAX_LENGTH = 25;
var modal = new Modal({ var modal = new Modal({
title: 'Statistics', title: 'Statistics',
content: this, content: this,
...@@ -89,7 +90,12 @@ define(['require', ...@@ -89,7 +90,12 @@ define(['require',
}); });
this.modal = modal; this.modal = modal;
}, },
bindEvents: function() {}, bindEvents: function() {
var that = this;
this.$el.on('click', '.linkClicked', function() {
that.modal.close();
})
},
fetchMetricData: function(options) { fetchMetricData: function(options) {
var that = this; var that = this;
this.metricCollection.fetch({ this.metricCollection.fetch({
...@@ -112,8 +118,14 @@ define(['require', ...@@ -112,8 +118,14 @@ define(['require',
}); });
}, },
onRender: function() { onRender: function() {
this.bindEvents();
this.fetchMetricData(); this.fetchMetricData();
}, },
closePanel: function(options) {
var el = options.el;
el.find(">.panel-heading").attr("aria-expanded", "false");
el.find(">.panel-collapse.collapse").removeClass("in");
},
genrateStatusData: function(stateObject) { genrateStatusData: function(stateObject) {
var that = this, var that = this,
stats = {}; stats = {};
...@@ -133,11 +145,16 @@ define(['require', ...@@ -133,11 +145,16 @@ define(['require',
createTable: function(obj) { createTable: function(obj) {
var that = this, var that = this,
tableBody = '', tableBody = '',
type = obj.type,
data = obj.data; data = obj.data;
_.each(data, function(value, key, list) { _.each(data, function(value, key, list) {
tableBody += '<tr><td>' + key + '</td><td class="">' + that.getValue({ var newValue = that.getValue({
"value": value "value": value
}) + '</td></tr>'; });
if (type === "classification") {
newValue = '<a title="Search for entities associated with \'' + key + '\'" class="linkClicked" href="#!/search/searchResult?searchType=basic&tag=' + key + '">' + newValue + '<a>';
}
tableBody += '<tr><td>' + key + '</td><td class="">' + newValue + '</td></tr>';
}); });
return tableBody; return tableBody;
...@@ -148,8 +165,9 @@ define(['require', ...@@ -148,8 +165,9 @@ define(['require',
classificationData = data.tag || {}, classificationData = data.tag || {},
tagEntitiesData = classificationData ? classificationData.tagEntities || {} : {}, tagEntitiesData = classificationData ? classificationData.tagEntities || {} : {},
tagsCount = 0, tagsCount = 0,
newTagEntitiesData = {}; newTagEntitiesData = {},
_.each(_.sortBy(_.keys(tagEntitiesData), function(o) { tagEntitiesKeys = _.keys(tagEntitiesData);
_.each(_.sortBy(tagEntitiesKeys, function(o) {
return o.toLocaleLowerCase(); return o.toLocaleLowerCase();
}), function(key) { }), function(key) {
var val = tagEntitiesData[key]; var val = tagEntitiesData[key];
...@@ -161,10 +179,16 @@ define(['require', ...@@ -161,10 +179,16 @@ define(['require',
if (!_.isEmpty(tagEntitiesData)) { if (!_.isEmpty(tagEntitiesData)) {
this.ui.classificationCard.html( this.ui.classificationCard.html(
that.createTable({ that.createTable({
"data": tagEntitiesData "data": tagEntitiesData,
"type": "classification"
}) })
); );
this.ui.classificationHeader.html("&nbsp;(" + _.numberFormatWithComa(tagsCount) + ")"); this.ui.classification.find(".count").html("&nbsp;(" + _.numberFormatWithComa(tagsCount) + ")");
if (tagEntitiesKeys.length > this.DATA_MAX_LENGTH) {
this.closePanel({
el: this.ui.classification
})
}
} }
}, },
renderEntities: function(options) { renderEntities: function(options) {
...@@ -215,17 +239,23 @@ define(['require', ...@@ -215,17 +239,23 @@ define(['require',
"type": "shell" "type": "shell"
}); });
if (!_.isEmpty(stats)) { if (!_.isEmpty(stats)) {
that.ui.entityCard.html( var statsKeys = _.keys(stats);
this.ui.entityCard.html(
EntityTable({ EntityTable({
"data": _.pick(stats, _.sortBy(_.keys(stats), function(o) { "data": _.pick(stats, _.sortBy(statsKeys, function(o) {
return o.toLocaleLowerCase(); return o.toLocaleLowerCase();
})), })),
}) })
); );
that.$('[data-id="activeEntity"]').html("&nbsp;(" + _.numberFormatWithComa(activeEntityCount) + ")"); this.$('[data-id="activeEntity"]').html("&nbsp;(" + _.numberFormatWithComa(activeEntityCount) + ")");
that.$('[data-id="deletedEntity"]').html("&nbsp;(" + _.numberFormatWithComa(deletedEntityCount) + ")"); this.$('[data-id="deletedEntity"]').html("&nbsp;(" + _.numberFormatWithComa(deletedEntityCount) + ")");
that.$('[data-id="shellEntity"]').html("&nbsp;(" + _.numberFormatWithComa(shellEntityCount) + ")"); this.$('[data-id="shellEntity"]').html("&nbsp;(" + _.numberFormatWithComa(shellEntityCount) + ")");
that.ui.entityHeader.html("&nbsp;(" + _.numberFormatWithComa(data.general.entityCount) + ")"); this.ui.entity.find(".count").html("&nbsp;(" + _.numberFormatWithComa(data.general.entityCount) + ")");
if (statsKeys.length > this.DATA_MAX_LENGTH) {
this.closePanel({
el: this.ui.entity
})
}
} }
}, },
renderStats: function(options) { renderStats: function(options) {
......
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