Fixes after overall review (#1362)

This commit is contained in:
Juanka Rodríguez 2019-04-15 17:40:30 +02:00 committed by Jesús Ángel
parent ec28b8b280
commit 7bb0b46cf8
24 changed files with 14971 additions and 1268 deletions

View File

@ -1,4 +1,4 @@
node_modules/
public/utils/codemirror/
public/kibana-integrations/
public/utils/table-col-resizable.js
public/utils/jquery-ui.js

View File

@ -193,7 +193,7 @@ import './utils/fontawesome/css/font-awesome.min.css';
// Dev tools
import './utils/codemirror';
import './utils/table-col-resizable';
import './utils/jquery-ui';
// Material
import 'angular-material/angular-material.css';

View File

@ -158,6 +158,13 @@ export class DecodersController {
return this.$sce.trustAsHtml(coloredString);
}
switchLocalDecoders() {
this.removeFilter('path');
if (!this.showingLocalDecoders) {
this.appliedFilters.push({ name: 'path', value: 'etc/decoders' });
}
}
/**
* This perfoms a search by a given term
* @param {String} term
@ -165,12 +172,14 @@ export class DecodersController {
search(term) {
if (term && term.startsWith('path:') && term.split('path:')[1].trim()) {
this.custom_search = '';
if (!this.showingLocalDecoders) {
const filter = { name: 'path', value: term.split('path:')[1].trim() };
this.appliedFilters = this.appliedFilters.filter(
item => item.name !== 'path'
);
this.appliedFilters.push(filter);
this.$scope.$broadcast('wazuhFilter', { filter });
}
} else if (
term &&
term.startsWith('file:') &&

View File

@ -35,6 +35,7 @@ export function RulesController(
* This performs a search with a given term
*/
$scope.search = term => {
let clearInput = true;
if (term && term.startsWith('group:') && term.split('group:')[1].trim()) {
$scope.custom_search = '';
const filter = { name: 'group', value: term.split('group:')[1].trim() };
@ -97,15 +98,23 @@ export function RulesController(
term.split('path:')[1].trim()
) {
$scope.custom_search = '';
if (!$scope.mctrl.showingLocalRules) {
const filter = { name: 'path', value: term.split('path:')[1].trim() };
$scope.appliedFilters = $scope.appliedFilters.filter(
item => item.name !== 'path'
);
$scope.appliedFilters.push(filter);
$scope.$broadcast('wazuhFilter', { filter });
}
} else {
clearInput = false;
$scope.$broadcast('wazuhSearch', { term, removeFilters: 0 });
}
if (clearInput) {
const searchBar = $('#search-input-rules');
searchBar.val('');
}
$scope.$applyAsync();
};
/**
@ -126,6 +135,13 @@ export function RulesController(
return filtered.length ? filtered[0].value : '';
};
$scope.switchLocalRules = () => {
$scope.removeFilter('path');
if (!$scope.mctrl.showingLocalRules) {
$scope.appliedFilters.push({ name: 'path', value: 'etc/rules' });
}
};
/**
* This a the filter given its name
* @param {String} filterName
@ -253,16 +269,19 @@ export function RulesController(
);
const response =
(((ruleReloaded || {}).data || {}).data || {}).items || [];
if (!response.length) {
$scope.currentRule = null;
$scope.closeDetailView(true);
if (response.length) {
const result = response.filter(rule => rule.details.overwrite);
$scope.currentRule = result.length ? result[0] : response[0];
} else {
$scope.currentRule = response[0];
$scope.currentRule = false;
$scope.closeDetailView(true);
}
$scope.fetchedXML = false;
} catch (error) {
errorHandler.handle(error.message || error);
}
}
$scope.editingFile = false;
$scope.$applyAsync();
appState.setNavigation({ status: true });
@ -279,6 +298,7 @@ export function RulesController(
* This function changes to the rules list view
*/
$scope.closeDetailView = clear => {
$scope.mctrl.showingLocalRules = !$scope.mctrl.showingLocalRules;
if (clear)
$scope.appliedFilters = $scope.appliedFilters.slice(
0,
@ -288,6 +308,8 @@ export function RulesController(
$scope.currentRule = false;
$scope.closeEditingFile();
$scope.$emit('removeCurrentRule');
$scope.switchLocalRules();
$scope.mctrl.showingLocalRules = !$scope.mctrl.showingLocalRules;
$scope.$applyAsync();
};
@ -297,7 +319,11 @@ export function RulesController(
apiReq
.request('get', `/rules/${incomingRule}`, {})
.then(data => {
$scope.currentRule = data.data.data.items[0];
const response = (((data || {}).data || {}).data || {}).items || [];
if (response.length) {
const result = response.filter(rule => rule.details.overwrite);
$scope.currentRule = result.length ? result[0] : response[0];
}
$scope.$emit('setCurrentRule', { currentRule: $scope.currentRule });
if (
!(Object.keys(($scope.currentRule || {}).details || {}) || []).length

View File

@ -124,12 +124,10 @@ export class SettingsController {
*/
async removeManager(item) {
try {
const currentApi = this.appState.getCurrentAPI();
let index = this.apiEntries.indexOf(item);
if (this.appState.getCurrentAPI()) {
if (
this.apiEntries[index]._id ===
JSON.parse(this.appState.getCurrentAPI()).id
) {
if (currentApi) {
if (this.apiEntries[index]._id === JSON.parse(currentApi).id) {
// We are trying to remove the one selected as default
this.appState.removeCurrentAPI();
}

View File

@ -30,7 +30,7 @@
<tfoot>
<td colspan="{{keys.length}}">
<span ng-show="!wazuh_table_loading" class="color-grey">{{ totalItems }} items</span>
<div ng-show="items.length >= itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<div ng-show="items.length > itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<ul layout="row">
<li ng-show="currentPage" class="md-padding">
<a href ng-click="prevPage()">« Prev</a>

View File

@ -103,7 +103,7 @@
<tfoot>
<td colspan="3">
<span ng-show="!wazuh_table_loading" class="color-grey">{{ totalItems }} items</span>
<div ng-show="items.length >= itemsPerPage" class="pagination pull-right"
<div ng-show="items.length > itemsPerPage" class="pagination pull-right"
style="margin:0 !important">
<ul layout="row">
<li ng-show="currentPage > 0" class="md-padding">
@ -133,12 +133,14 @@
</tfoot>
</table>
</md-card-content>
<md-card-actions layout="row" layout-align="end center"
class="wz-card-actions layout-align-end-center layout-row">
<a class="wz-text-link cursor-pointer small md-button md-ink-ripple" id="btnDownload"
ng-click="downloadCsv('/lists', currentList.name, currentList.path)">
<react-component name="EuiIcon" props="{type:'importAction', color:'primary'}" /> Formatted
</a>
<md-card-actions layout="row" layout-align="end center" class="layout-align-end-center layout-row">
<button type="button" ng-click="downloadCsv('/lists', currentList.name, currentList.path)"
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--small" id="btnDownload">
<span class="euiButtonEmpty__content">
<react-component name="EuiIcon" props="{type:'importAction'}" />
<span class="euiButtonEmpty__text">Formatted</span>
</span>
</button>
</md-card-actions>
</md-card>
</div>

View File

@ -110,8 +110,7 @@ app.directive('wzTable', function() {
// Prevents duplicated rows when resizing
let resizing = false;
$window.onresize = () => {
if (resizing) return;
$(`#table${$scope.scapepath}`).colResizable({ disable: true });
if (resizing || $scope.resizingColumns) return;
resizing = true;
clearTimeout(doit);
doit = setTimeout(() => {
@ -119,6 +118,7 @@ app.directive('wzTable', function() {
$scope.itemsPerPage = $scope.rowsPerPage;
init(true)
.then(() => {
$scope.setColResizable();
resizing = false;
})
.catch(() => (resizing = false));
@ -501,11 +501,15 @@ app.directive('wzTable', function() {
};
$scope.setColResizable = () => {
$(`#table${$scope.scapepath}`).colResizable({
liveDrag: true,
minWidth: 78,
partialRefresh: true,
draggingClass: false
$(`#table${$scope.scapepath} th`).resizable({
handles: 'e',
minWidth: 75,
start: () => {
$scope.resizingColumns = true;
},
end: () => {
$scope.resizingColumns = false;
}
});
$scope.$applyAsync();
};

View File

@ -3,49 +3,42 @@
</div>
<div ng-if="customColumns" layout="row" ng-show="!error && !wazuh_table_loading && items.length" class="columns-bar"
ng-class="{'columns-bar-active': showColumns}" ng-style="!showColumns && {'margin-bottom': '-35px'}">
<div ng-if="showColumns" class="euiCheckbox wz-margin-right-8" ng-repeat="key in originalkeys"
ng-click="updateColumns(key)">
<div ng-if="showColumns" class="euiCheckbox wz-margin-right-8" ng-repeat="key in originalkeys" ng-click="updateColumns(key)">
<input class="euiCheckbox__input" type="checkbox" aria-label="Select all rows" ng-checked="exists(key)">
<div class="euiCheckbox__square"></div>
<span class="euiCheckbox__label">{{ keyEquivalence[key.key.value || key.key] }}</span>
</div>
<span flex></span>
<span class="wz-text-link" style="line-height: 28px;" ng-click="showColumns = !showColumns" tooltip="Columns">
<span class="wz-text-link" style="line-height: 22px;z-index: 10000;" ng-click="showColumns = !showColumns" tooltip="Columns">
<react-component name="EuiIcon" props="{type:'gear'}" />
</span>
</div>
<div ng-if="!wazuh_table_loading && !isPolicyMonitoring() && !isSyscheck()" ng-show="!error && items.length">
<table class="euiTable euiTable--responsive table table-striped table-condensed table-hover no-margin-bottom"
ng-class="customColumns ? 'table-resizable' : ''" style="table-layout: fixed !important"
id="table{{scapepath}}">
<table class="table table-striped table-condensed table-hover no-margin-bottom"
ng-class="customColumns ? 'table-resizable' : 'euiTable euiTable--responsive'" id="table{{scapepath}}">
<thead class="wz-text-bold">
<th ng-repeat="key in keys" class="euiTableHeaderCell wz-text-left"
ng-style="key.width && {'width':key.width}" ng-class="{ 'cursor-pointer' : !key.nosortable}"
ng-click="!key.nosortable && sort(key)">
<span>
<th ng-repeat="key in keys" class="euiTableHeaderCell wz-text-left" ng-style="(key.width && !customColumns) && {'width':key.width}">
<p ng-class="{ 'cursor-pointer' : !key.nosortable}" ng-click="!key.nosortable && sort(key)">
{{ path === '/agents/groups' && (key.value || key) === 'count' ? 'Agents' :
keyEquivalence[key.value ||
key] || key.value || key }}
<i ng-if="!key.nosortable" class="fa wz-theader-sort-icon"
ng-class="sortValue === (key.value || key) ? (sortDir ? 'fa-sort-asc' : 'fa-sort-desc') : 'fa-sort'"
<i ng-if="!key.nosortable" class="fa wz-theader-sort-icon" ng-class="sortValue === (key.value || key) ? (sortDir ? 'fa-sort-asc' : 'fa-sort-desc') : 'fa-sort'"
aria-hidden="true"></i>
</span>
</p>
</th>
<th ng-if="(path === '/agents' || (path === '/agents/groups' && adminMode) || (isLookingGroup() && adminMode)
|| path === '/rules/files' || path === '/decoders/files' || path === '/lists/files')"
class="euiTableHeaderCell wz-text-left"
ng-class="{'col-lg-2': path !== '/agents', 'col-lg-1': path === '/agents'}">
class="euiTableHeaderCell wz-text-left">
Actions
</th>
</thead>
<tbody>
<tr ng-class="allowClick ? 'cursor-pointer' : ''" class="euiTableRow wz-word-wrap"
ng-repeat="item in pagedItems[currentPage] | filter:{item:'!'}" ng-click="clickAction(item)">
<td ng-repeat="key in keys" id="td-{{$parent.$index}}-{{$index}}"
ng-mouseover="showTooltip($parent.$index, $index, item)">
<div class="wz-text-truncatable">
<span>
<tr ng-class="allowClick ? 'cursor-pointer' : ''" class="wz-word-wrap" ng-repeat="item in pagedItems[currentPage] | filter:{item:'!'}"
ng-click="clickAction(item)">
<td ng-repeat="key in keys" id="td-{{$parent.$index}}-{{$index}}" ng-mouseover="showTooltip($parent.$index, $index, item)">
<div ng-class="customColumns ? 'wz-text-truncatable-container' : ''">
<span class="wz-text-truncatable">
{{
parseValue(key,item)
}}
@ -56,9 +49,8 @@
</div>
</td>
<td ng-if="path === '/agents'" ng-click="$event.stopPropagation()" class="cursor-default action-btn-td">
<span ng-click="clickAction(item, 'discover'); $event.stopPropagation()"
class="wz-margin-left-8 cursor-pointer" tooltip="Open Discover panel for this agent"
tooltip-placement="left" aria-hidden="true">
<span ng-click="clickAction(item, 'discover'); $event.stopPropagation()" class="wz-margin-left-8 cursor-pointer"
tooltip="Open Discover panel for this agent" tooltip-placement="left" aria-hidden="true">
<react-component name="EuiIcon" props="{type:'discoverApp', color:'primary'}" />
</span>
<span ng-click="clickAction(item, 'configuration'); $event.stopPropagation()" class="cursor-pointer"
@ -66,17 +58,15 @@
<react-component name="EuiIcon" props="{type:'wrench', color:'primary'}" />
</span>
</td>
<td ng-if="path === '/agents/groups' && adminMode" ng-click="$event.stopPropagation()"
class="cursor-default action-btn-td">
<span ng-if="removingGroup !== item.name && item.name !== 'default'"
ng-click="showConfirmRemoveGroup($event, item); $event.stopPropagation()"
ng-class="{'wz-margin-left-8': item.name !== 'default'}" class="cursor-pointer"
tooltip="Remove this group" tooltip-placement="left" aria-hidden="true">
<td ng-if="path === '/agents/groups' && adminMode" ng-click="$event.stopPropagation()" class="cursor-default action-btn-td">
<span ng-if="removingGroup !== item.name && item.name !== 'default'" ng-click="showConfirmRemoveGroup($event, item); $event.stopPropagation()"
ng-class="{'wz-margin-left-8': item.name !== 'default'}" class="cursor-pointer" tooltip="Remove this group"
tooltip-placement="left" aria-hidden="true">
<react-component name="EuiIcon" props="{type:'trash', color:'primary'}" />
</span>
<span ng-if="removingGroup !== item.name" ng-click="editGroup(item); $event.stopPropagation()"
tooltip="Edit this group configuration" tooltip-placement="left"
ng-class="{'wz-margin-left-8': item.name === 'default'}" class="cursor-pointer">
tooltip="Edit this group configuration" tooltip-placement="left" ng-class="{'wz-margin-left-8': item.name === 'default'}"
class="cursor-pointer">
<react-component name="EuiIcon" props="{type:'pencil', color:'primary'}" />
</span>
@ -86,18 +76,15 @@
removed</span>
</div>
<div layout="row">
<md-button class="cancelBtn" type="button" ng-click="cancelRemoveGroup()"><i
aria-hidden='true' class='fa fa-fw fa-close'></i> Cancel</md-button>
<md-button class="agreeBtn wz-button" type="button"
ng-click="confirmRemoveGroup(item.name)"><i aria-hidden='true'
class='fa fa-fw fa-check'></i> Confirm</md-button>
<md-button class="cancelBtn" type="button" ng-click="cancelRemoveGroup()"><i aria-hidden='true'
class='fa fa-fw fa-close'></i> Cancel</md-button>
<md-button class="agreeBtn wz-button" type="button" ng-click="confirmRemoveGroup(item.name)"><i
aria-hidden='true' class='fa fa-fw fa-check'></i> Confirm</md-button>
</div>
</div>
</td>
<td ng-if="isLookingGroup() && adminMode" ng-click="$event.stopPropagation()"
class="cursor-default action-btn-td">
<span ng-if="removingAgent !== item.id && adminMode"
ng-click="showConfirmRemoveAgentFromGroup($event, item); $event.stopPropagation()"
<td ng-if="isLookingGroup() && adminMode" ng-click="$event.stopPropagation()" class="cursor-default action-btn-td">
<span ng-if="removingAgent !== item.id && adminMode" ng-click="showConfirmRemoveAgentFromGroup($event, item); $event.stopPropagation()"
class="wz-margin-left-8 cursor-pointer" tooltip="Remove this agent from the group"
tooltip-placement="left" aria-hidden="true">
<react-component name="EuiIcon" props="{type:'trash', color:'primary'}" />
@ -109,32 +96,28 @@
this group</span>
</div>
<div layout="row">
<md-button class="cancelBtn" type="button" ng-click="cancelRemoveAgent()"><i
aria-hidden='true' class='fa fa-fw fa-close'></i> Cancel</md-button>
<md-button class="cancelBtn" type="button" ng-click="cancelRemoveAgent()"><i aria-hidden='true'
class='fa fa-fw fa-close'></i> Cancel</md-button>
<md-button class="agreeBtn wz-button" type="button" ng-click="confirmRemoveAgent(item.id)">
<i aria-hidden='true' class='fa fa-fw fa-check'></i> Confirm</md-button>
</div>
</div>
</td>
<td ng-if="path === '/rules/files' || path === '/decoders/files' || path === '/lists/files'"
ng-click="$event.stopPropagation()" class="cursor-default action-btn-td">
<span
ng-if="(item.path === 'etc/rules' || item.path === 'etc/decoders') && ((item.name && removingFile !== item.name) || (item.file && removingFile !== item.file)) && adminMode && path !== '/lists/files'"
ng-click="editFile(item, path); $event.stopPropagation()"
class="wz-margin-left-8 cursor-pointer" tooltip="Edit this file" tooltip-placement="left"
aria-hidden="true">
<td ng-if="path === '/rules/files' || path === '/decoders/files' || path === '/lists/files'" ng-click="$event.stopPropagation()"
class="cursor-default action-btn-td">
<span ng-if="(item.path === 'etc/rules' || item.path === 'etc/decoders') && ((item.name && removingFile !== item.name) || (item.file && removingFile !== item.file)) && adminMode && path !== '/lists/files'"
ng-click="editFile(item, path); $event.stopPropagation()" class="wz-margin-left-8 cursor-pointer"
tooltip="Edit this file" tooltip-placement="left" aria-hidden="true">
<react-component name="EuiIcon" props="{type:'pencil', color:'primary'}" />
</span>
<span
ng-if="(item.path === 'etc/rules' || item.path === 'etc/decoders' || path === '/lists/files') && ((item.name && removingFile !== item.name) || (item.file && removingFile !== item.file)) && adminMode"
ng-click="showConfirmRemoveFile($event, item, path); $event.stopPropagation()"
class="cursor-pointer" ng-class="{'wz-margin-left-8': path === '/lists/files'}"
tooltip="Delete this file" tooltip-placement="right" aria-hidden="true">
<span ng-if="(item.path === 'etc/rules' || item.path === 'etc/decoders' || path === '/lists/files') && ((item.name && removingFile !== item.name) || (item.file && removingFile !== item.file)) && adminMode"
ng-click="showConfirmRemoveFile($event, item, path); $event.stopPropagation()" class="cursor-pointer"
ng-class="{'wz-margin-left-8': path === '/lists/files'}" tooltip="Delete this file"
tooltip-placement="right" aria-hidden="true">
<react-component name="EuiIcon" props="{type:'trash', color:'primary'}" />
</span>
<span
ng-if="(item.path !== 'etc/rules' && item.path !== 'etc/decoders') && ((item.name && removingFile !== item.name) || (item.file && removingFile !== item.file)) && adminMode && path !== '/lists/files'"
<span ng-if="(item.path !== 'etc/rules' && item.path !== 'etc/decoders') && ((item.name && removingFile !== item.name) || (item.file && removingFile !== item.file)) && adminMode && path !== '/lists/files'"
class="wz-margin-left-8" aria-hidden="true">
-
</span>
@ -146,45 +129,39 @@
: item.file}}</b> will be deleted</span>
</div>
<div layout="row">
<md-button class="cancelBtn" type="button" ng-click="cancelRemoveFile()"><i
aria-hidden='true' class='fa fa-fw fa-close'></i> Cancel</md-button>
<md-button class="agreeBtn wz-button" type="button"
ng-click="confirmRemoveFile(item, path)"><i aria-hidden='true'
class='fa fa-fw fa-check'></i> Confirm</md-button>
<md-button class="cancelBtn" type="button" ng-click="cancelRemoveFile()"><i aria-hidden='true'
class='fa fa-fw fa-close'></i> Cancel</md-button>
<md-button class="agreeBtn wz-button" type="button" ng-click="confirmRemoveFile(item, path)"><i
aria-hidden='true' class='fa fa-fw fa-check'></i> Confirm</md-button>
</div>
</div>
</td>
</tr>
</tbody>
<tfoot>
<td
colspan="{{ (path === '/agents' || (path === '/agents/groups' && adminMode) || (isLookingGroup() && adminMode) ||
<td colspan="{{ (path === '/agents' || (path === '/agents/groups' && adminMode) || (isLookingGroup() && adminMode) ||
path === '/rules/files' || path === '/decoders/files' || path === '/lists/files') ? keys.length + 1 : keys.length}}">
<span ng-show="!wazuh_table_loading" class="color-grey">{{ totalItems }} items ({{time | number: 2}}
seconds)</span>
<div ng-show="items.length >= itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<div ng-show="items.length > itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<ul layout="row">
<li ng-show="currentPage > 0" class="md-padding">
<a href ng-click="firstPage()">First</a>
</li>
<li ng-show="currentPage" class="md-padding">
<a href ng-click="prevPage()">
<react-component name="EuiIcon" props="{type:'arrowLeft'}" />
</a>
</li>
<li ng-repeat="n in range(pagedItems.length, currentPage, currentPage + gap) "
ng-class="{'wz-text-active': n == currentPage}" ng-click="setPage()" class="md-padding">
<li ng-repeat="n in range(pagedItems.length, currentPage, currentPage + gap) " ng-class="{'wz-text-active': n == currentPage}"
ng-click="setPage()" class="md-padding">
<a href ng-bind="n + 1">1</a>
</li>
<li ng-show="currentPage < pagedItems.length - 1" class="md-padding">
<a href ng-click="nextPage()">
<react-component name="EuiIcon" props="{type:'arrowRight'}" />
</a>
</li>
<li ng-show="currentPage < pagedItems.length - 1" class="md-padding">
<a href ng-click="setPage(pagedItems.length - 1, false, true)">Last</a>
</li>
@ -196,30 +173,23 @@
</div>
<div ng-if="!wazuh_table_loading && isPolicyMonitoring()" ng-show="!error && items.length">
<table
class="euiTable euiTable--responsive table table-striped table-striped-duo table-condensed table-hover no-margin-bottom"
ng-class="customColumns ? 'table-resizable' : ''" style="table-layout: fixed !important"
id="table{{scapepath}}">
<table class="table table-striped table-striped-duo table-condensed table-hover no-margin-bottom"
ng-class="customColumns ? 'table-resizable' : 'euiTable euiTable--responsive'" id="table{{scapepath}}">
<thead class="wz-text-bold">
<th ng-repeat="key in keys" class="euiTableHeaderCell wz-text-left"
ng-style="key.width && {'width':key.width}" ng-class="{ 'cursor-pointer' : !key.nosortable }"
ng-click="!key.nosortable && sort(key)">
<span>
<th ng-repeat="key in keys" class="euiTableHeaderCell wz-text-left" ng-style="key.width && {'width':key.width}">
<p ng-class="{ 'cursor-pointer' : !key.nosortable }" ng-click="!key.nosortable && sort(key)">
{{ keyEquivalence[key.value || key] || key.value || key }}
<i ng-if="!key.nosortable" class="fa wz-theader-sort-icon"
ng-class="sortValue === (key.value || key) ? (sortDir ? 'fa-sort-asc' : 'fa-sort-desc') : 'fa-sort'"
<i ng-if="!key.nosortable" class="fa wz-theader-sort-icon" ng-class="sortValue === (key.value || key) ? (sortDir ? 'fa-sort-asc' : 'fa-sort-desc') : 'fa-sort'"
aria-hidden="true"></i>
</span>
</p>
</th>
</thead>
<tbody>
<tr class="euiTableRow wz-word-wrap cursor-pointer"
ng-repeat-start="item in pagedItems[currentPage] | filter:{item:'!'}" ng-click="expandTableRow(item)"
ng-class="{'selected': item.expanded}">
<td ng-repeat="key in keys" id="td-{{$parent.$index}}-{{$index}}"
ng-mouseover="showTooltip($parent.$index, $index, item)">
<div class="wz-text-truncatable">
<span>
<tr class="wz-word-wrap cursor-pointer" ng-repeat-start="item in pagedItems[currentPage] | filter:{item:'!'}"
ng-click="expandTableRow(item)" ng-class="{'selected': item.expanded}">
<td ng-repeat="key in keys" id="td-{{$parent.$index}}-{{$index}}" ng-mouseover="showTooltip($parent.$index, $index, item)">
<div ng-class="customColumns ? 'wz-text-truncatable-container' : ''">
<span class="wz-text-truncatable">
<span ng-show="(key.value || key ) === 'result'" class="no-wrap">
<p class="round status little" ng-class="(item.result === 'passed') ? 'teal' : 'red'">
</p>&nbsp;&nbsp;
@ -235,7 +205,7 @@
</td>
</tr>
<tr ng-show="(item.rationale || item.remediation || item.directory || (item.rules && item.rules.length) || (item.compliance && item.compliance.length)) && item.expanded"
class="euiTableRow wz-word-wrap cursor-pointer selected" ng-repeat-end=""
class="wz-word-wrap cursor-pointer selected" ng-repeat-end=""
ng-click="expandTableRow(item)">
<td colspan="{{keys.length}}" style="border-top: none">
<div layout="row" layout-padding="" class="layout-padding layout-row">
@ -244,8 +214,7 @@
<div>
<div class="euiFlexItem euiFlexItem--flexGrowZero" ng-if="item.rationale">
<div class="euiStat euiStat--leftAligned">
<p class="euiTitle euiTitle--small euiStat__title ng-binding"
style="font-size: 1.15rem;">Rationale</p>
<p class="euiTitle euiTitle--small euiStat__title ng-binding" style="font-size: 1.15rem;">Rationale</p>
<div class="euiText euiText--small euiStat__description wz-text-gray">
<p>{{item.rationale}}</p>
</div>
@ -254,8 +223,7 @@
</div>
<div class="euiFlexItem euiFlexItem--flexGrowZero" ng-if="item.remediation">
<div class="euiStat euiStat--leftAligned">
<p class="euiTitle euiTitle--small euiStat__title ng-binding"
style="font-size: 1.15rem;">Remediation</p>
<p class="euiTitle euiTitle--small euiStat__title ng-binding" style="font-size: 1.15rem;">Remediation</p>
<div class="euiText euiText--small euiStat__description wz-text-gray">
<p>{{item.remediation}}</p>
</div>
@ -264,8 +232,7 @@
</div>
<div class="euiFlexItem euiFlexItem--flexGrowZero" ng-if="item.description">
<div class="euiStat euiStat--leftAligned">
<p class="euiTitle euiTitle--small euiStat__title ng-binding"
style="font-size: 1.15rem;">Description</p>
<p class="euiTitle euiTitle--small euiStat__title ng-binding" style="font-size: 1.15rem;">Description</p>
<div class="euiText euiText--small euiStat__description wz-text-gray">
<p>{{item.description}}</p>
</div>
@ -274,8 +241,7 @@
</div>
<div class="euiFlexItem euiFlexItem--flexGrowZero" ng-if="item.directory">
<div class="euiStat euiStat--leftAligned">
<p class="euiTitle euiTitle--small euiStat__title ng-binding"
style="font-size: 1.15rem;">Path(s)</p>
<p class="euiTitle euiTitle--small euiStat__title ng-binding" style="font-size: 1.15rem;">Path(s)</p>
<div class="euiText euiText--small euiStat__description wz-text-gray">
<p>{{item.directory}}</p>
</div>
@ -297,9 +263,9 @@
</div>
<div class="euiFlexItem euiFlexItem--flexGrowZero"
ng-if="item.compliance && item.compliance.length">
<div class="euiStat euiStat--leftAligned">
<p class="euiTitle euiTitle--small euiStat__title ng-binding"
style="font-size: 1.15rem;">Compliance</p>
<p class="euiTitle euiTitle--small euiStat__title ng-binding" style="font-size: 1.15rem;">Compliance</p>
<div class="euiText euiText--small euiStat__description wz-text-gray">
<div layout="row" ng-repeat="c in item.compliance">
{{c.key}}/{{c.value}}
@ -319,24 +285,28 @@
<td colspan="{{keys.length}}">
<span ng-show="!wazuh_table_loading" class="color-grey">{{ totalItems }} items ({{time | number: 2}}
seconds)</span>
<div ng-show="items.length >= itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<div ng-show="items.length > itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<ul layout="row">
<li ng-show="currentPage > 0" class="md-padding">
<a href ng-click="firstPage()">First</a>
</li>
<li ng-show="currentPage" class="md-padding">
<a href ng-click="prevPage()">
<react-component name="EuiIcon" props="{type:'arrowLeft'}" />
</a>
</li>
<li ng-repeat="n in range(pagedItems.length, currentPage, currentPage + gap) "
ng-class="{'wz-text-active': n == currentPage}" ng-click="setPage()" class="md-padding">
<li ng-repeat="n in range(pagedItems.length, currentPage, currentPage + gap) " ng-class="{'wz-text-active': n == currentPage}"
ng-click="setPage()" class="md-padding">
<a href ng-bind="n + 1">1</a>
</li>
<li ng-show="currentPage < pagedItems.length - 1" class="md-padding">
<a href ng-click="nextPage()">
<react-component name="EuiIcon" props="{type:'arrowRight'}" />
</a>
</li>
<li ng-show="currentPage < pagedItems.length - 1" class="md-padding">
<a href ng-click="setPage(pagedItems.length - 1, false, true)">Last</a>
</li>
</ul>
</div>
</td>
@ -345,30 +315,23 @@
</div>
<div ng-if="!wazuh_table_loading && isSyscheck()" ng-show="!error && items.length">
<table
class="euiTable euiTable--responsive table table-striped table-striped-duo table-condensed table-hover no-margin-bottom"
ng-class="customColumns ? 'table-resizable' : ''" style="table-layout: fixed !important"
id="table{{scapepath}}">
<table class="table table-striped table-striped-duo table-condensed table-hover no-margin-bottom"
ng-class="customColumns ? 'table-resizable' : 'euiTable euiTable--responsive'" id="table{{scapepath}}">
<thead class="wz-text-bold">
<th ng-repeat="key in keys" class="euiTableHeaderCell wz-text-left"
ng-style="key.width && {'width':key.width}" ng-class="{ 'cursor-pointer' : !key.nosortable }"
ng-click="!key.nosortable && sort(key)">
<span>{{
<th ng-repeat="key in keys" class="euiTableHeaderCell wz-text-left" ng-style="key.width && {'width':key.width}">
<p ng-class="{ 'cursor-pointer' : !key.nosortable }" ng-click="!key.nosortable && sort(key)">{{
keyEquivalence[key.value || key] || key.value || key }}
<i ng-if="!key.nosortable" class="fa wz-theader-sort-icon"
ng-class="sortValue === (key.value || key) ? (sortDir ? 'fa-sort-asc' : 'fa-sort-desc') : 'fa-sort'"
<i ng-if="!key.nosortable" class="fa wz-theader-sort-icon" ng-class="sortValue === (key.value || key) ? (sortDir ? 'fa-sort-asc' : 'fa-sort-desc') : 'fa-sort'"
aria-hidden="true"></i>
</span>
</p>
</th>
</thead>
<tbody>
<tr class="euiTableRow wz-word-wrap cursor-pointer"
ng-repeat-start="item in pagedItems[currentPage] | filter:{item:'!'}" ng-click="expandTableRow(item)"
ng-class="{'selected': item.expanded}">
<td ng-repeat="key in keys" id="td-{{$parent.$index}}-{{$index}}"
ng-mouseover="showTooltip($parent.$index, $index, item)">
<div class="wz-text-truncatable">
<span>
<tr class="wz-word-wrap cursor-pointer" ng-repeat-start="item in pagedItems[currentPage] | filter:{item:'!'}"
ng-click="expandTableRow(item)" ng-class="{'selected': item.expanded}">
<td ng-repeat="key in keys" id="td-{{$parent.$index}}-{{$index}}" ng-mouseover="showTooltip($parent.$index, $index, item)">
<div class="wz-text-truncatable-container">
<span class="wz-text-truncatable">
{{
parseValue(key,item)
}}
@ -379,7 +342,7 @@
</div>
</td>
</tr>
<tr class="euiTableRow wz-word-wrap cursor-pointer selected" ng-show="item.expanded" ng-repeat-end=""
<tr class="wz-word-wrap cursor-pointer selected" ng-show="item.expanded" ng-repeat-end=""
ng-click="expandTableRow(item)">
<td colspan="{{keys.length}}" style="border-top: none">
<div layout="row" layout-padding="" class="layout-padding layout-row" ng-if="item.expanded">
@ -398,24 +361,28 @@
<td colspan="{{keys.length}}">
<span ng-show="!wazuh_table_loading" class="color-grey">{{ totalItems }} items ({{time | number: 2}}
seconds)</span>
<div ng-show="items.length >= itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<div ng-show="items.length > itemsPerPage" class="pagination pull-right" style="margin:0 !important">
<ul layout="row">
<li ng-show="currentPage > 0" class="md-padding">
<a href ng-click="firstPage()">First</a>
</li>
<li ng-show="currentPage" class="md-padding">
<a href ng-click="prevPage()">
<react-component name="EuiIcon" props="{type:'arrowLeft'}" />
</a>
</li>
<li ng-repeat="n in range(pagedItems.length, currentPage, currentPage + gap) "
ng-class="{'wz-text-active': n == currentPage}" ng-click="setPage()" class="md-padding">
<li ng-repeat="n in range(pagedItems.length, currentPage, currentPage + gap) " ng-class="{'wz-text-active': n == currentPage}"
ng-click="setPage()" class="md-padding">
<a href ng-bind="n + 1">1</a>
</li>
<li ng-show="currentPage < pagedItems.length - 1" class="md-padding">
<a href ng-click="nextPage()">
<react-component name="EuiIcon" props="{type:'arrowRight'}" />
</a>
</li>
<li ng-show="currentPage < pagedItems.length - 1" class="md-padding">
<a href ng-click="setPage(pagedItems.length - 1, false, true)">Last</a>
</li>
</ul>
</div>
</td>

View File

@ -26,7 +26,7 @@
<input id='wz-search-filter-bar-input' class='wz-search-filter-bar-input input' type='text' ng-model='newTag'
ng-focus='showAutocomplete(true)' ng-blur='showAutocomplete(false)' placeholder='Add filter or search'
ng-keyup='!autocompleteEnter && $event.keyCode == 13 ? addTag(true) : addSearchKey($event)' />
<a class='wz-tag-remove-button wz-padding-top-5' ng-click='removeAll()'><i class="fa fa-trash-o" aria-hidden="true"></i></a>
<a class='wz-tag-remove-button wz-padding-top-5' ng-show="groupedTagList.length" ng-click='removeAll()'><i class="fa fa-times" aria-hidden="true"></i></a>
<div id='wz-search-filter-bar-autocomplete' class='wz-search-filter-bar-autocomplete' ng-show='isAutocomplete && autocompleteContent.list.length > 0'>
<p><b>{{autocompleteContent.title}}</b></p>
<ul id='wz-search-filter-bar-autocomplete-list'>

View File

@ -39,8 +39,9 @@
}
.groupContentViewer {
height: calc(~'100vh - 410px');
min-height: 300px;
height: calc(~'100vh - 250px');
min-height: 300px!important;
overflow: auto!important;
}
.extraHeader{

View File

@ -48,7 +48,7 @@
.healthCheck {
padding-top: 200px;
background-color: #F5F5F5;
background-color: #f5f5f5;
}
.health-check-error {
@ -104,8 +104,8 @@
line-height: 1.5;
font-family: monospace;
page-break-inside: avoid;
background-color: #F9F9F9;
border: 1px solid #D9D9D9;
background-color: #f9f9f9;
border: 1px solid #d9d9d9;
border-left: 3px solid rgb(0, 121, 165);
height: 100px;
max-width: 100%;
@ -120,8 +120,8 @@
overflow: auto;
height: 100px;
margin-right: 5px;
background-color: #F9F9F9;
border: 1px solid #D9D9D9;
background-color: #f9f9f9;
border: 1px solid #d9d9d9;
word-break: break-word;
margin-bottom: 40px;
}
@ -131,7 +131,7 @@
height: 100px;
padding: 10px;
margin-left: 5px;
border: 1px solid #D9D9D9;
border: 1px solid #d9d9d9;
margin-bottom: 40px;
}
@ -161,7 +161,7 @@
.kuiLocalSearchInput,
.kuiLocalSearchInput:focus {
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.1) !important;
border: 1px solid #D9D9D9 !important;
border: 1px solid #d9d9d9 !important;
}
.euiFlexGroup .euiFlexGroup:hover {
@ -246,7 +246,7 @@ margin-top: 8px;
.btn-as-i {
background: none;
border: 0;
color: #006BB4;
color: #006bb4;
padding: 0;
margin: 0;
font-size: 20px;
@ -255,13 +255,13 @@ margin-top: 8px;
.btn-as-i:hover {
background: none !important;
color: #006BB4;
color: #006bb4;
}
/* Custom reporting button styles */
.wz-report-button:hover {
background-color: #006BB4 !important;
color: #F5F5F5;
background-color: #006bb4 !important;
color: #f5f5f5;
border-radius: 0;
}
@ -297,7 +297,7 @@ margin-top: 8px;
.input-filter-box {
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.1) !important;
border: 1px solid #D9D9D9 !important;
border: 1px solid #d9d9d9 !important;
font-size: 14px;
padding: 0px 15px;
margin-top: 18px;
@ -308,7 +308,7 @@ margin-top: 8px;
.input-filter-box:focus {
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.1) !important;
border: 1px solid #D9D9D9 !important;
border: 1px solid #d9d9d9 !important;
}
/* Custom input container styles */
@ -319,7 +319,7 @@ margin-top: 8px;
}
.wz-input-container label.md-required:after {
color: #006BB4 !important;
color: #006bb4 !important;
}
.wz-input-container input,
@ -338,7 +338,7 @@ margin-top: 8px;
word-wrap: break-word;
font-family: monospace;
background-color: #ffffff;
border: 1px solid #D9D9D9;
border: 1px solid #d9d9d9;
-webkit-box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.1);
}
@ -431,7 +431,7 @@ margin-top: 8px;
.action-btn-td {
font-size: 18px;
padding: 2px !important;
color: #006BB4;
color: #006bb4;
}
.wazuhNavDiscover .euiTab,
.wazuhNavDiscover .euiText {
@ -470,11 +470,11 @@ md-sidenav {
}
.wz-question-dev-color {
color: #b4bcc2
color: #b4bcc2;
}
.wz-dev-title {
padding-bottom: 10px
padding-bottom: 10px;
}
.wz-dev-column-separator {
@ -482,7 +482,7 @@ md-sidenav {
margin-top: 25px;
background: #dddddd;
float: left;
height: calc(~'100vh - 110px');
height: calc(~"100vh - 110px");
cursor: ew-resize;
text-align: center;
display: block !important;
@ -492,31 +492,32 @@ md-sidenav {
background-color: #cce4ed;
}
.wz-dev-column-separator:focus, .wz-dev-column-separator.active {
.wz-dev-column-separator:focus,
.wz-dev-column-separator.active {
background-color: #0079a5;
color: #FFF;
color: #fff;
}
.wz-dev-column-separator span {
height: calc(~'100vh - 110px');
height: calc(~"100vh - 110px");
display: table-cell;
vertical-align: middle;
}
#wz-dev-left-column {
width: calc(~'30% - 7px');
min-width: calc(~'20% - 7px');
max-width: calc(~'80% - 7px');
width: calc(~"30% - 7px");
min-width: calc(~"20% - 7px");
max-width: calc(~"80% - 7px");
float: left;
height: calc(~'100vh - 85px');
height: calc(~"100vh - 85px");
}
#wz-dev-right-column {
width: calc(~'70% - 7px');
min-width: calc(~'20% - 7px');
max-width: calc(~'80% - 7px');
width: calc(~"70% - 7px");
min-width: calc(~"20% - 7px");
max-width: calc(~"80% - 7px");
float: left;
height: calc(~'100vh - 85px');
height: calc(~"100vh - 85px");
}
.wz-dev-box .CodeMirror {
@ -527,7 +528,7 @@ md-sidenav {
.wz-md-card:not(.wz-metric-color) {
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.1) !important;
border: 1px solid #D3DAE6 !important;
border: 1px solid #d3dae6 !important;
overflow: hidden;
}
@ -551,20 +552,23 @@ md-sidenav {
padding: 16px 0px;
}
md-switch.md-default-theme .md-thumb, md-switch .md-thumb {
md-switch.md-default-theme .md-thumb,
md-switch .md-thumb {
border: 1px solid #d3dae6;
}
md-switch.md-default-theme .md-bar, md-switch .md-bar {
md-switch.md-default-theme .md-bar,
md-switch .md-bar {
border: 1px solid #d3dae6;
}
md-switch.md-default-theme.md-checked .md-thumb, md-switch.md-checked .md-thumb {
md-switch.md-default-theme.md-checked .md-thumb,
md-switch.md-checked .md-thumb {
background-color: rgb(0, 107, 180);
border: none;
}
.wz-select-input {
border-radius: 0;
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.1) !important;
border: 1px solid #D3DAE6;
border: 1px solid #d3dae6;
}
/* Class for responsive images */
@ -737,7 +741,7 @@ md-switch.md-default-theme.md-checked .md-thumb, md-switch.md-checked .md-thumb
}
.addGroupBtn {
background-color: #006BB4 !important;
background-color: #006bb4 !important;
height: 40px !important;
}
@ -771,17 +775,16 @@ md-switch.md-default-theme.md-checked .md-thumb, md-switch.md-checked .md-thumb
}
.updateBtn {
background: #0F9D58;
background: #0f9d58;
color: white;
}
.upgradingLabel {
color: #0F9D58;
color: #0f9d58;
padding-top: 12px;
display: block;
}
/*
* https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
* Handling long URLs on error toasts.
@ -805,7 +808,7 @@ md-switch.md-default-theme.md-checked .md-thumb, md-switch.md-checked .md-thumb
.titleSectionIdentifier {
font-size: 12px;
color: #006BB4;
color: #006bb4;
text-transform: capitalize;
}
.confirmEmbedBubble {
@ -841,15 +844,26 @@ wz-xml-file-editor {
background: #ecf6fb !important;
}
.table-striped-duo>tbody tr:not(.no-duo):nth-child(2n+1):not(:hover), .table-striped-duo>tbody tr:not(.no-duo):nth-child(2n+2):not(:hover) {
.table-striped-duo > tbody tr:not(.euiTableRow):nth-child(2n + 1):not(:hover),
.table-striped-duo > tbody tr:not(.euiTableRow):nth-child(2n + 2):not(:hover) {
background: #f9f9f9;
}
.table-striped-duo>tbody tr:not(.no-duo):nth-child(4n+1):not(:hover), .table-striped-duo>tbody tr:not(.no-duo):nth-child(4n+2):not(:hover) {
.table-striped-duo > tbody tr:not(.euiTableRow):nth-child(4n + 1):not(:hover),
.table-striped-duo > tbody tr:not(.euiTableRow):nth-child(4n + 2):not(:hover) {
background: #fff;
}
.table-resizable > thead th:not(:first-child) {
border-left: 1px dashed #dfeff8;
overflow: hidden;
}
.table-resizable > thead th:last-child .ui-resizable-handle {
display: none !important;
}
.table-resizable td + td {
width: auto;
}
.daemons-card {

1533
public/less/jquery-ui.css vendored Normal file

File diff suppressed because it is too large Load Diff

View File

@ -20,3 +20,4 @@ import './layout.less';
import './media-queries.less';
import './typography.less';
import './ui_framework.css';
import './jquery-ui.css';

View File

@ -88,6 +88,15 @@ html, body, button:not(.fa):not(.fa-times), textarea, input, select, .wz-chip {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&:before {
content: attr(data-name);
}
}
.wz-text-truncatable-container {
overflow: hidden;
width: auto;
display: grid;
}
.font-size-12 {

View File

@ -47,7 +47,6 @@ export class ApiTester {
return Promise.reject(result);
}
return result;
} catch (error) {
if (((error || {}).data || {}).code === 3099) {
// Do nothing

View File

@ -12,28 +12,23 @@
<div layout="row">
<span class="font-size-18">
<i class="fa fa-fw fa-object-group" aria-hidden="true"></i> Groups </span>
<span ng-if='adminMode' class="font-size-18 wz-text-link wz-margin-left-8"
ng-click="switchAddingGroup()">
<svg ng-if="!addingGroup" class="euiIcon euiIcon--medium" focusable="false"
xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M8 7h3.5a.5.5 0 1 1 0 1H8v3.5a.5.5 0 1 1-1 0V8H3.5a.5.5 0 0 1 0-1H7V3.5a.5.5 0 0 1 1 0V7zm-.5-7C11.636 0 15 3.364 15 7.5S11.636 15 7.5 15 0 11.636 0 7.5 3.364 0 7.5 0zm0 .882a6.618 6.618 0 1 0 0 13.236A6.618 6.618 0 0 0 7.5.882z">
<span ng-if='adminMode' class="font-size-18 wz-text-link wz-margin-left-8" ng-click="switchAddingGroup()">
<svg ng-if="!addingGroup" class="euiIcon euiIcon--medium" focusable="false" xmlns="http://www.w3.org/2000/svg"
width="16" height="16" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M8 7h3.5a.5.5 0 1 1 0 1H8v3.5a.5.5 0 1 1-1 0V8H3.5a.5.5 0 0 1 0-1H7V3.5a.5.5 0 0 1 1 0V7zm-.5-7C11.636 0 15 3.364 15 7.5S11.636 15 7.5 15 0 11.636 0 7.5 3.364 0 7.5 0zm0 .882a6.618 6.618 0 1 0 0 13.236A6.618 6.618 0 0 0 7.5.882z">
</path>
</svg>
<svg ng-if="addingGroup" class="euiIcon euiIcon--medium" focusable="false"
xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M7.5 0C11.636 0 15 3.364 15 7.5S11.636 15 7.5 15 0 11.636 0 7.5 3.364 0 7.5 0zm0 .882a6.618 6.618 0 1 0 0 13.236A6.618 6.618 0 0 0 7.5.882zM3.5 7h8a.5.5 0 1 1 0 1h-8a.5.5 0 0 1 0-1z">
<svg ng-if="addingGroup" class="euiIcon euiIcon--medium" focusable="false" xmlns="http://www.w3.org/2000/svg"
width="16" height="16" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M7.5 0C11.636 0 15 3.364 15 7.5S11.636 15 7.5 15 0 11.636 0 7.5 3.364 0 7.5 0zm0 .882a6.618 6.618 0 1 0 0 13.236A6.618 6.618 0 0 0 7.5.882zM3.5 7h8a.5.5 0 1 1 0 1h-8a.5.5 0 0 1 0-1z">
</path>
</svg>
</span>
</div>
<div layout="row" ng-if="addingGroup" ng-if='adminMode' class="wz-padding-bottom-0">
<input placeholder="Group name..." ng-model="groupToBeAdded" type="text"
class="kuiLocalSearchInput addGroupInput ng-empty ng-pristine ng-scope ng-touched ng-valid"
<input placeholder="Group name..." ng-model="groupToBeAdded" type="text" class="kuiLocalSearchInput addGroupInput ng-empty ng-pristine ng-scope ng-touched ng-valid"
aria-invalid="false">
<button type="submit" aria-label="Search" class="kuiLocalSearchButton addGroupBtn"
ng-click="createGroup(groupToBeAdded)">
<button type="submit" aria-label="Search" class="kuiLocalSearchButton addGroupBtn" ng-click="createGroup(groupToBeAdded)">
<span class="fa fa-save fa-fw" aria-hidden="true"></span>
</button>
</div>
@ -61,25 +56,21 @@
<div ng-show="editingFile">
<div layout="row" class="md-padding-h wz-margin-top-10">
<span ng-click='closeEditingFile()' class='btn btn-info'>Cancel</span>
<button ng-disabled='xmlHasErrors' ng-click='doSaveGroupAgentConfig()'
class='height-35 kuiButton kuiButton--secondary wz-margin-left-8'>
<button ng-disabled='xmlHasErrors' ng-click='doSaveGroupAgentConfig()' class='height-35 kuiButton kuiButton--secondary wz-margin-left-8'>
<span ng-show='!xmlHasErrors'>
<svg class="euiIcon euiIcon--medium" focusable="false" xmlns="http://www.w3.org/2000/svg"
width="16" height="16" viewBox="0 0 16 16">
<path
d="M5.008 2H2.282c-.181 0-.245.002-.275.007-.005.03-.007.094-.007.275v11.436c0 .181.002.245.007.275.03.005.094.007.275.007h11.436c.181 0 .245-.002.275-.007.005-.03.007-.094.007-.275V4.62c0-.13-.001-.18-.004-.204a2.654 2.654 0 0 0-.141-.147L11.73 2.145a2.654 2.654 0 0 0-.147-.141A2.654 2.654 0 0 0 11.38 2h-.388c.005.08.008.172.008.282v2.436c0 .446-.046.607-.134.77a.909.909 0 0 1-.378.378c-.163.088-.324.134-.77.134H6.282c-.446 0-.607-.046-.77-.134a.909.909 0 0 1-.378-.378C5.046 5.325 5 5.164 5 4.718V2.282c0-.11.003-.202.008-.282zM2.282 1h9.098c.259 0 .348.01.447.032a.87.87 0 0 1 .273.113c.086.054.156.11.338.293l2.124 2.124c.182.182.239.252.293.338a.87.87 0 0 1 .113.273c.023.1.032.188.032.447v9.098c0 .446-.046.607-.134.77a.909.909 0 0 1-.378.378c-.163.088-.324.134-.77.134H2.282c-.446 0-.607-.046-.77-.134a.909.909 0 0 1-.378-.378c-.088-.163-.134-.324-.134-.77V2.282c0-.446.046-.607.134-.77a.909.909 0 0 1 .378-.378c.163-.088.324-.134.77-.134zM6 2.282v2.436c0 .181.002.245.007.275.03.005.094.007.275.007h3.436c.181 0 .245-.002.275-.007.005-.03.007-.094.007-.275V2.282c0-.181-.002-.245-.007-.275A2.248 2.248 0 0 0 9.718 2H6.282c-.181 0-.245.002-.275.007-.005.03-.007.094-.007.275zM8 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm0-1a1 1 0 1 0 0-2 1 1 0 0 0 0 2z">
<path d="M5.008 2H2.282c-.181 0-.245.002-.275.007-.005.03-.007.094-.007.275v11.436c0 .181.002.245.007.275.03.005.094.007.275.007h11.436c.181 0 .245-.002.275-.007.005-.03.007-.094.007-.275V4.62c0-.13-.001-.18-.004-.204a2.654 2.654 0 0 0-.141-.147L11.73 2.145a2.654 2.654 0 0 0-.147-.141A2.654 2.654 0 0 0 11.38 2h-.388c.005.08.008.172.008.282v2.436c0 .446-.046.607-.134.77a.909.909 0 0 1-.378.378c-.163.088-.324.134-.77.134H6.282c-.446 0-.607-.046-.77-.134a.909.909 0 0 1-.378-.378C5.046 5.325 5 5.164 5 4.718V2.282c0-.11.003-.202.008-.282zM2.282 1h9.098c.259 0 .348.01.447.032a.87.87 0 0 1 .273.113c.086.054.156.11.338.293l2.124 2.124c.182.182.239.252.293.338a.87.87 0 0 1 .113.273c.023.1.032.188.032.447v9.098c0 .446-.046.607-.134.77a.909.909 0 0 1-.378.378c-.163.088-.324.134-.77.134H2.282c-.446 0-.607-.046-.77-.134a.909.909 0 0 1-.378-.378c-.088-.163-.134-.324-.134-.77V2.282c0-.446.046-.607.134-.77a.909.909 0 0 1 .378-.378c.163-.088.324-.134.77-.134zM6 2.282v2.436c0 .181.002.245.007.275.03.005.094.007.275.007h3.436c.181 0 .245-.002.275-.007.005-.03.007-.094.007-.275V2.282c0-.181-.002-.245-.007-.275A2.248 2.248 0 0 0 9.718 2H6.282c-.181 0-.245.002-.275.007-.005.03-.007.094-.007.275zM8 12a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm0-1a1 1 0 1 0 0-2 1 1 0 0 0 0 2z">
</path>
</svg> Save file
</span>
<span ng-show='xmlHasErrors' class='btn-danger'><i aria-hidden='true'
class='fa fa-fw fa-exclamation-triangle'></i>
<span ng-show='xmlHasErrors' class='btn-danger'><i aria-hidden='true' class='fa fa-fw fa-exclamation-triangle'></i>
XML format error</span>
</button>
</div>
<div class="md-padding md-padding-top-10" style="height: calc(100vh - 350px);" ng-if="fetchedXML">
<wz-xml-file-editor file-name='agent.conf' data="fetchedXML"
target-name="currentGroup.name + ' group'" valid-fn='xmlIsValid(valid)'
close-fn='closeEditingFile(reload)'>
<wz-xml-file-editor file-name='agent.conf' data="fetchedXML" target-name="currentGroup.name + ' group'"
valid-fn='xmlIsValid(valid)' close-fn='closeEditingFile(reload)'>
</wz-xml-file-editor>
</div>
</div>
@ -97,23 +88,18 @@
</div>
<!-- Search bar -->
<div layout="row"
class="wz-margin-top-16 euiFlexGroup euiFlexGroup--alignItemsCenter euiFormControlLayout__childrenWrapper md-padding-h ng-scope"
<div layout="row" class="wz-margin-top-16 euiFlexGroup euiFlexGroup--alignItemsCenter euiFormControlLayout__childrenWrapper md-padding-h ng-scope"
ng-if="!addingAgents && !file">
<input
placeholder="{{groupsSelectedTab==='files' ? 'Filter files...' : lookingGroup ? 'Filter agents...' : 'Filter groups...'}}"
ng-model="custom_search" type="text"
class="euiFieldSearch euiFieldSearch--fullWidth euiFlexItem height-35 ng-empty ng-pristine ng-touched ng-valid"
<input placeholder="{{groupsSelectedTab==='files' ? 'Filter files...' : lookingGroup ? 'Filter agents...' : 'Filter groups...'}}"
ng-model="custom_search" type="text" class="euiFieldSearch euiFieldSearch--fullWidth euiFlexItem height-35 ng-empty ng-pristine ng-touched ng-valid"
aria-invalid="false" wz-enter="search(custom_search)">
<div class="euiFormControlLayoutIcons wz-margin-left-16">
<span class="euiFormControlLayoutCustomIcon">
<react-component name="EuiIcon"
props="{type:'search', className:'euiFormControlLayoutCustomIcon__icon'}" />
<react-component name="EuiIcon" props="{type:'search', className:'euiFormControlLayoutCustomIcon__icon'}" />
</span>
</div>
<button type="submit" aria-label="Search"
class="euiFlexItem euiFlexItem--flexGrowZero height-35 kuiButton kuiButton--secondary wz-margin-left-8"
<button type="submit" aria-label="Search" class="euiFlexItem euiFlexItem--flexGrowZero height-35 kuiButton kuiButton--secondary wz-margin-left-8"
ng-click="search(custom_search)">
Search
</button>
@ -121,30 +107,26 @@
class="euiFlexItem euiFlexItem--flexGrowZero height-35 wz-margin-left-8">
<div class="euiFilterGroup"></div>
</div>
<button
ng-if="lookingGroup && currentGroup && !addingAgents && !editingFile && !file && adminMode && groupsSelectedTab==='files'"
<button ng-if="lookingGroup && currentGroup && !addingAgents && !editingFile && !file && adminMode && groupsSelectedTab==='files'"
class="euiFlexItem euiFlexItem--flexGrowZero height-35 kuiButton kuiButton--secondary ng-scope wz-margin-left-8"
ng-click="editGroupAgentConfig(currentGroup)" aria-label="Edit group configuration">
<svg class="euiIcon euiIcon--medium euiButtonIcon__icon" focusable="false" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16"
height="16" viewBox="0 0 16 16">
<defs>
<path id="pencil-a"
d="M12.148 3.148L11 2l-9 9v3h3l9-9-1.144-1.144-8.002 7.998a.502.502 0 0 1-.708 0 .502.502 0 0 1 0-.708l8.002-7.998zM11 1c.256 0 .512.098.707.293l3 3a.999.999 0 0 1 0 1.414l-9 9A.997.997 0 0 1 5 15H2a1 1 0 0 1-1-1v-3c0-.265.105-.52.293-.707l9-9A.997.997 0 0 1 11 1zM5 14H2v-3l3 3z">
<path id="pencil-a" d="M12.148 3.148L11 2l-9 9v3h3l9-9-1.144-1.144-8.002 7.998a.502.502 0 0 1-.708 0 .502.502 0 0 1 0-.708l8.002-7.998zM11 1c.256 0 .512.098.707.293l3 3a.999.999 0 0 1 0 1.414l-9 9A.997.997 0 0 1 5 15H2a1 1 0 0 1-1-1v-3c0-.265.105-.52.293-.707l9-9A.997.997 0 0 1 11 1zM5 14H2v-3l3 3z">
</path>
</defs>
<use xlink:href="#pencil-a"></use>
</svg>
Edit group configuration
</button>
<button
ng-if="lookingGroup && currentGroup && !addingAgents && !editingFile && !file && adminMode && groupsSelectedTab==='agents'"
<button ng-if="lookingGroup && currentGroup && !addingAgents && !editingFile && !file && adminMode && groupsSelectedTab==='agents'"
class="euiFlexItem euiFlexItem--flexGrowZero height-35 kuiButton kuiButton--secondary ng-scope wz-margin-left-8"
ng-click="addMultipleAgents(true)" aria-label="Add or remove agents">
<svg class="euiIcon euiIcon--medium" focusable="false" xmlns="http://www.w3.org/2000/svg"
width="16" height="16" viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M8 7h3.5a.5.5 0 1 1 0 1H8v3.5a.5.5 0 1 1-1 0V8H3.5a.5.5 0 0 1 0-1H7V3.5a.5.5 0 0 1 1 0V7zm-.5-7C11.636 0 15 3.364 15 7.5S11.636 15 7.5 15 0 11.636 0 7.5 3.364 0 7.5 0zm0 .882a6.618 6.618 0 1 0 0 13.236A6.618 6.618 0 0 0 7.5.882z">
<svg class="euiIcon euiIcon--medium" focusable="false" xmlns="http://www.w3.org/2000/svg" width="16"
height="16" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M8 7h3.5a.5.5 0 1 1 0 1H8v3.5a.5.5 0 1 1-1 0V8H3.5a.5.5 0 0 1 0-1H7V3.5a.5.5 0 0 1 1 0V7zm-.5-7C11.636 0 15 3.364 15 7.5S11.636 15 7.5 15 0 11.636 0 7.5 3.364 0 7.5 0zm0 .882a6.618 6.618 0 1 0 0 13.236A6.618 6.618 0 0 0 7.5.882z">
</path>
</svg>
Add or remove agents
@ -157,13 +139,12 @@
<md-card flex class="wz-md-card _md flex md-margin-h wz-margin-top-16" ng-if="!lookingGroup">
<md-card-content>
<div layout="row">
<wz-table custom-columns="true" flex extra-limit="100" path="'/agents/groups'"
keys="['name','count','mergedSum']" allow-click="true" row-sizes="[14,12,10]">
<wz-table custom-columns="true" flex extra-limit="100" path="'/agents/groups'" keys="['name','count','mergedSum']"
allow-click="true" row-sizes="[14,12,10]">
</wz-table>
</div>
<div layout="row" layout-align="end center">
<button type="button" ng-click="downloadCsv('/agents/groups')"
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--small">
<button type="button" ng-click="downloadCsv('/agents/groups')" class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--small">
<span class="euiButtonEmpty__content">
<react-component name="EuiIcon" props="{type:'importAction'}" />
<span class="euiButtonEmpty__text">Formatted</span>
@ -176,8 +157,7 @@
<div ng-if='!addingAgents'>
<!-- Group agents table -->
<md-card flex class="wz-md-card _md flex md-margin-h wz-margin-top-16"
ng-if="lookingGroup && groupsSelectedTab==='agents' && currentGroup">
<md-card flex class="wz-md-card _md flex md-margin-h wz-margin-top-16" ng-if="lookingGroup && groupsSelectedTab==='agents' && currentGroup">
<div layout="row" ng-show="failedErrors" class="extraHeader">
<md-list>
<md-list-item class="error-enum-configuration" ng-repeat="group in failedErrors">
@ -187,15 +167,13 @@
</md-list-item>
</md-list>
<span flex></span>
<a class='md-padding md-padding-top-10' ng-click='failedErrors = false'><i
class="fa fa-times" aria-hidden="true"></i></a>
<a class='md-padding md-padding-top-10' ng-click='failedErrors = false'><i class="fa fa-times"
aria-hidden="true"></i></a>
</div>
<md-card-content>
<div layout="row">
<wz-table flex path="'/agents/groups/' + currentGroup.name"
keys="['id','name','ip','status','os.name','os.version','version']"
allow-click="true" row-sizes="[14,12,10]"
empty-results="'No agents were added to this group.'" />
<wz-table flex custom-columns="true" path="'/agents/groups/' + currentGroup.name" keys="['id','name','ip','status','os.name','os.version','version']"
allow-click="true" row-sizes="[14,12,10]" empty-results="'No agents were added to this group.'" />
</div>
<div layout="row" ng-if="lookingGroup && groupsSelectedTab==='agents'">
<span flex></span>
@ -211,19 +189,16 @@
</md-card>
<!-- Group files table -->
<md-card flex class="wz-md-card _md flex md-margin-h wz-margin-top-16"
ng-if="lookingGroup && groupsSelectedTab==='files' && !fileViewer && currentGroup">
<md-card flex class="wz-md-card _md flex md-margin-h wz-margin-top-16" ng-if="lookingGroup && groupsSelectedTab==='files' && !fileViewer && currentGroup">
<md-card-content>
<div layout="row">
<wz-table extra-limit="100" flex path="'/agents/groups/' + currentGroup.name + '/files'"
keys="[{value:'filename',width:'300px'},'hash']" allow-click="true"
row-sizes="[16,14,12]">
<wz-table custom-columns="true" extra-limit="100" flex path="'/agents/groups/' + currentGroup.name + '/files'"
keys="[{value:'filename',width:'300px'},'hash']" allow-click="true" row-sizes="[16,14,12]">
</wz-table>
</div>
<div layout="row" ng-if="lookingGroup && groupsSelectedTab==='files' && !file">
<span flex></span>
<button type="button"
ng-click="downloadCsv('/agents/groups/' + currentGroup.name + '/files')"
<button type="button" ng-click="downloadCsv('/agents/groups/' + currentGroup.name + '/files')"
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--small">
<span class="euiButtonEmpty__content">
<react-component name="EuiIcon" props="{type:'importAction'}" />
@ -240,19 +215,17 @@
<!-- End CSV Download button section for group files -->
<!-- File JSON viewer section -->
<div flex layout="column" class="md-padding"
ng-if="lookingGroup && groupsSelectedTab==='files' && file">
<div flex layout="column" class="md-padding" ng-if="lookingGroup && groupsSelectedTab==='files' && file">
<div flex layout="column">
<div layout="row" class="wz-padding-bottom-14">
<span flex class="wz-headline-title">{{ filename }}</span>
<button class="md-icon-button" ng-if="lookingGroup" aria-label="Back"
tooltip="Close file" tooltip-placement="left" ng-click="goBackFiles()"><i
class="fa fa-fw fa-close" aria-hidden="true"></i></button>
<button class="md-icon-button" ng-if="lookingGroup" aria-label="Back" tooltip="Close file"
tooltip-placement="left" ng-click="goBackFiles()"><i class="fa fa-fw fa-close"
aria-hidden="true"></i></button>
<!--<span flex class="wz-text-right cursor-pointer color-grey" ng-click="goBackFiles()">close</span>-->
</div>
<div flex layout="column">
<pre flex
class="wz-pre groupContentViewer wzXmlEditor wz-overflow-y-auto"><code wz-dynamic="file"></code></pre>
<pre flex class="wz-pre groupContentViewer wzXmlEditor wz-overflow-y-auto"><code wz-dynamic="file"></code></pre>
</div>
</div>
</div>
@ -260,8 +233,7 @@
</div>
<div layout="row" class="md-padding" ng-if="addingAgents">
<span ng-show='!multipleSelectorLoading' class="wzMultipleSelectorCounter"><span
style='color:green'>+{{currentAdding}}</span>&nbsp;<span
<span ng-show='!multipleSelectorLoading' class="wzMultipleSelectorCounter"><span style='color:green'>+{{currentAdding}}</span>&nbsp;<span
style='color:red'>-{{currentDeleting}}</span></span>
<wz-multiple-selector class='wzMultipleSelector' available-items="availableAgents.data"
selected-items="selectedAgents.data" title-available-items="Available agents"

View File

@ -20,7 +20,8 @@
</button>
</div>
<md-chips class="wz-chips md-padding-h wz-margin-top-16" readonly="true" ng-show="dctrl.appliedFilters.length"
<md-chips class="wz-chips md-padding-h wz-margin-top-16" readonly="true" ng-hide="!dctrl.appliedFilters.length ||
(dctrl.appliedFilters.length === 1 && dctrl.includesFilter('path') && dctrl.showingLocalDecoders)"
ng-if="!dctrl.editingFile">
<md-chip class="wz-chip" ng-show="dctrl.includesFilter('file')">
<span>File: {{ dctrl.getFilter('file') }}
@ -28,7 +29,7 @@
ng-click="dctrl.removeFilter('file')"></i>
</span>
</md-chip>
<md-chip class="wz-chip" ng-show="dctrl.includesFilter('path')">
<md-chip class="wz-chip" ng-show="dctrl.includesFilter('path') && !dctrl.showingLocalDecoders">
<span>Path: {{ dctrl.getFilter('path') }}
<i class="fa fa-fw fa-times cursor-pointer" aria-hidden="true"
ng-click="dctrl.removeFilter('path')"></i>
@ -42,7 +43,7 @@
<a ng-if="adminMode" ng-click="mctrl.switchFilesSubTab('decoders')">Manage decoders files</a>
<span flex></span>
<wz-kbn-switch class="md-primary wz-no-top-bottom-margin" switch-model="dctrl.showingLocalDecoders"
switch-text="Custom decoders"></wz-kbn-switch>
switch-text="Custom decoders" switch-change="dctrl.switchLocalDecoders()"></wz-kbn-switch>
</md-card-actions>
<md-card-content class="wz-padding-bottom-0">
<wz-table custom-columns="true" ng-if="!dctrl.showingLocalDecoders"
@ -52,7 +53,7 @@
</wz-table>
<wz-table custom-columns="true" ng-if="dctrl.showingLocalDecoders" flex path="'/decoders'"
keys="['name',{value:'details.program_name',size:2,nosortable:true},{value:'details.order',size:2,nosortable:true},'file']"
implicit-filter="[{ name:'path',value: 'etc/decoders'}]" allow-click="true" row-sizes="[16,13,11]">
implicit-filter="dctrl.appliedFilters" allow-click="true" row-sizes="[16,13,11]">
</wz-table>
</md-card-content>
<md-card-actions layout="row" layout-align="end center" class="layout-align-end-center layout-row">

View File

@ -45,15 +45,15 @@
</md-card-actions>
<md-card-content>
<wz-table ng-if="filesctrl.filesSubTab === 'rules' && mctrl.onlyLocalFiles" flex path="'/rules/files'"
implicit-filter="[{name: 'path', value: 'etc/rules'}]" keys="[{value: 'file', width: '75px'}]"
implicit-filter="[{name: 'path', value: 'etc/rules'}]" keys="['file']"
allow-click="true" row-sizes="[16,13,11]" />
<wz-table ng-if="filesctrl.filesSubTab === 'rules' && !mctrl.onlyLocalFiles" flex path="'/rules/files'"
keys="[{value: 'file', width: '75px'}]" allow-click="true" row-sizes="[16,13,11]" />
keys="['file']" allow-click="true" row-sizes="[16,13,11]" />
<wz-table ng-if="filesctrl.filesSubTab === 'decoders' && mctrl.onlyLocalFiles" flex
path="'/decoders/files'" implicit-filter="[{name: 'path', value: 'etc/decoders'}]"
keys="[{value: 'file', width: '75px'}]" allow-click="true" row-sizes="[16,13,11]" />
keys="['file']" allow-click="true" row-sizes="[16,13,11]" />
<wz-table ng-if="filesctrl.filesSubTab === 'decoders' && !mctrl.onlyLocalFiles" flex
path="'/decoders/files'" keys="[{value: 'file', width: '75px'}]" allow-click="true"
path="'/decoders/files'" keys="['file']" allow-click="true"
row-sizes="[16,13,11]" />
</md-card-content>
</md-card>

View File

@ -22,14 +22,15 @@
</button>
</div>
<md-chips class="wz-chips md-padding-h wz-margin-top-16" readonly="true" ng-show="appliedFilters.length"
<md-chips class="wz-chips md-padding-h wz-margin-top-16" readonly="true" ng-hide="!appliedFilters.length ||
(appliedFilters.length === 1 && includesFilter('path') && mctrl.showingLocalRules)"
ng-if="!editingFile && !mctrl.filesSubTab">
<md-chip class="wz-chip" ng-show="includesFilter('file')">
<span>File: {{getFilter('file')}}
<i class="fa fa-fw fa-times cursor-pointer" aria-hidden="true" ng-click="removeFilter('file')"></i>
</span>
</md-chip>
<md-chip class="wz-chip" ng-show="includesFilter('path')">
<md-chip class="wz-chip" ng-show="includesFilter('path') && !mctrl.showingLocalRules">
<span>Path: {{getFilter('path')}}
<i class="fa fa-fw fa-times cursor-pointer" aria-hidden="true" ng-click="removeFilter('path')"></i>
</span>
@ -63,12 +64,12 @@
rules files</a>
<span flex></span>
<wz-kbn-switch class="md-primary wz-no-top-bottom-margin" switch-model="mctrl.showingLocalRules"
switch-text="Custom rules"></wz-kbn-switch>
switch-text="Custom rules" switch-change="switchLocalRules()"></wz-kbn-switch>
</md-card-actions>
<md-card-content class="wz-padding-bottom-0">
<wz-table custom-columns="true" flex ng-if="mctrl.showingLocalRules" path="'/rules'"
keys="[{value: 'id', width: '85px'},{value:'description', width: 'auto'},{value:'groups',nosortable:true, width: '250px'},{value:'pci',nosortable:true, width: '170px'},{value:'gdpr',nosortable:true,width: '170px'}, {value: 'level', width: '100px'}, {value:'file',width: '200px'}]"
implicit-filter="[{ name:'path',value: 'etc/rules'}]" allow-click="true" row-sizes="[16,14,12]">
implicit-filter="appliedFilters" allow-click="true" row-sizes="[16,14,12]">
</wz-table>
<wz-table custom-columns="true" ng-if="!mctrl.showingLocalRules" implicit-filter="appliedFilters" flex
path="'/rules'"

View File

@ -104,7 +104,7 @@
<!-- End add API button section -->
<!-- Add API section-->
<div layout="row" ng-show="!currentAPI || (ctrl.addManagerContainer && !ctrl.isEditing)">
<div layout="row" ng-show="!currentAPI || (ctrl.addManagerContainer && !ctrl.isEditing) || !ctrl.apiEntries.length">
<!-- Add API form -->
<form flex ng-submit="ctrl.saveSettings()" layout="column" layout-align="start stretch"
class="margin-top-30">

12677
public/utils/jquery-ui.js vendored Normal file

File diff suppressed because it is too large Load Diff

View File

@ -1,511 +0,0 @@
/**
_ _____ _ _ _
| | __ \ (_) | | | |
___ ___ | | |__) |___ ___ _ ______ _| |__ | | ___
/ __/ _ \| | _ // _ \/ __| |_ / _` | '_ \| |/ _ \
| (_| (_) | | | \ \ __/\__ \ |/ / (_| | |_) | | __/
\___\___/|_|_| \_\___||___/_/___\__,_|_.__/|_|\___|
v1.6 - jQuery plugin created by Alvaro Prieto Lauroba
Licences: MIT & GPL
Feel free to use or modify this plugin as far as my full name is kept
If you are going to use this plug-in in production environments it is
strongly recommended to use its minified version: colResizable.min.js
*/
(function(global, factory) {
typeof exports === 'object' && typeof module !== 'undefined'
? (module.exports = factory())
: typeof define === 'function' && define.amd
? define(factory)
: (global.CodeMirror = factory());
})(this, function() {
'use strict';
var d = $(document); //window object
var h = $('head'); //head object
var drag = null; //reference to the current grip that is being dragged
var tables = {}; //object of the already processed tables (table.id as key)
var count = 0; //internal count to create unique IDs when needed.
//common strings for packing
var ID = 'id';
var PX = 'px';
var SIGNATURE = 'JColResizer';
var FLEX = 'JCLRFlex';
//short-cuts
var I = parseInt;
var M = Math;
var ie = navigator.userAgent.indexOf('Trident/4.0') > 0;
var S;
try {
S = sessionStorage;
} catch (e) {} //Firefox crashes when executed as local file system
//append required CSS rules
h.append(
"<style type='text/css'> .JColResizer{table-layout:fixed;} .JColResizer > tbody > tr > td, .JColResizer > tbody > tr > th{overflow:hidden;} .JCLRgrips{ height:0px; position:relative;} .JCLRgrip{margin-left:-5px; position:absolute; z-index:5; } .JCLRgrip .JColResizer{position:absolute;background-color:red;filter:alpha(opacity=1);opacity:0;width:10px;height:100%;cursor: e-resize;top:0px} .JCLRLastGrip{position:absolute; width:1px; } .JCLRgripDrag{ border-left:1px dotted black; } .JCLRFlex{width:auto!important;} .JCLRgrip.JCLRdisabledGrip .JColResizer{cursor:default; display:none;}</style>"
);
/**
* Function to allow column resizing for table objects. It is the starting point to apply the plugin.
* @param {DOM node} tb - reference to the DOM table object to be enhanced
* @param {Object} options - some customization values
*/
var init = function(tb, options) {
var t = $(tb); //the table object is wrapped
t.opt = options; //each table has its own options available at anytime
t.mode = options.resizeMode; //shortcuts
t.dc = t.opt.disabledColumns;
if (t.opt.disable) return destroy(t); //the user is asking to destroy a previously colResized table
var id = (t.id = t.attr(ID) || SIGNATURE + count++); //its id is obtained, if null new one is generated
t.p = t.opt.postbackSafe; //short-cut to detect postback safe
if (!t.is('table') || (tables[id] && !t.opt.partialRefresh)) return; //if the object is not a table or if it was already processed then it is ignored.
if (t.opt.hoverCursor !== 'e-resize')
h.append(
"<style type='text/css'>.JCLRgrip .JColResizer:hover{cursor:" +
t.opt.hoverCursor +
'!important}</style>'
); //if hoverCursor has been set, append the style
$('.JCLRgrips').remove();
t.addClass(SIGNATURE)
.attr(ID, id)
.before('<div class="JCLRgrips"/>'); //the grips container object is added. Signature class forces table rendering in fixed-layout mode to prevent column's min-width
t.g = [];
t.c = [];
t.w = t.width();
t.gc = t.prev();
t.f = t.opt.fixed; //t.c and t.g are arrays of columns and grips respectively
if (options.marginLeft) t.gc.css('marginLeft', options.marginLeft); //if the table contains margins, it must be specified
if (options.marginRight) t.gc.css('marginRight', options.marginRight); //since there is no (direct) way to obtain margin values in its original units (%, em, ...)
t.cs =
I(
ie
? tb.cellSpacing || tb.currentStyle.borderSpacing
: t.css('border-spacing')
) || 2; //table cellspacing (not even jQuery is fully cross-browser)
t.b =
I(
ie
? tb.border || tb.currentStyle.borderLeftWidth
: t.css('border-left-width')
) || 1; //outer border width (again cross-browser issues)
// if(!(tb.style.width || tb.width)) t.width(t.width()); //I am not an IE fan at all, but it is a pity that only IE has the currentStyle attribute working as expected. For this reason I can not check easily if the table has an explicit width or if it is rendered as "auto"
tables[id] = t; //the table object is stored using its id as key
createGrips(t); //grips are created
};
/**
* This function allows to remove any enhancements performed by this plugin on a previously processed table.
* @param {jQuery ref} t - table object
*/
var destroy = function(t) {
var id = t.attr(ID),
t = tables[id]; //its table object is found
if (!t || !t.is('table')) return; //if none, then it wasn't processed
t.removeClass(SIGNATURE + ' ' + FLEX).gc.remove(); //class and grips are removed
delete tables[id]; //clean up data
};
/**
* Function to create all the grips associated with the table given by parameters
* @param {jQuery ref} t - table object
*/
var createGrips = function(t) {
var th = t.find('>thead>tr:first>th,>thead>tr:first>td'); //table headers are obtained
if (!th.length)
th = t.find(
'>tbody>tr:first>th,>tr:first>th,>tbody>tr:first>td, >tr:first>td'
); //but headers can also be included in different ways
th = th.filter(':visible'); //filter invisible columns
t.cg = t.find('col'); //a table can also contain a colgroup with col elements
t.ln = th.length; //table length is stored
if (t.p && S && S[t.id]) memento(t, th); //if 'postbackSafe' is enabled and there is data for the current table, its coloumn layout is restored
th.each(function(i) {
//iterate through the table column headers
var c = $(this); //jquery wrap for the current column
var dc = t.dc.indexOf(i) != -1; //is this a disabled column?
var g = $(t.gc.append('<div class="JCLRgrip"></div>')[0].lastChild); //add the visual node to be used as grip
g.append(dc ? '' : t.opt.gripInnerHtml).append(
'<div class="' + SIGNATURE + '"></div>'
);
if (i == t.ln - 1) {
//if the current grip is the las one
g.addClass('JCLRLastGrip'); //add a different css class to stlye it in a different way if needed
if (t.f) g.html(''); //if the table resizing mode is set to fixed, the last grip is removed since table with can not change
}
g.bind('touchstart mousedown', onGripMouseDown); //bind the mousedown event to start dragging
if (!dc) {
//if normal column bind the mousedown event to start dragging, if disabled then apply its css class
g.removeClass('JCLRdisabledGrip').bind(
'touchstart mousedown',
onGripMouseDown
);
} else {
g.addClass('JCLRdisabledGrip');
}
g.t = t;
g.i = i;
g.c = c;
c.w = c.width(); //some values are stored in the grip's node data as shortcut
t.g.push(g);
t.c.push(c); //the current grip and column are added to its table object
c.width(c.w).removeAttr('width'); //the width of the column is converted into pixel-based measurements
g.data(SIGNATURE, { i: i, t: t.attr(ID), last: i == t.ln - 1 }); //grip index and its table name are stored in the HTML
});
t.cg.removeAttr('width'); //remove the width attribute from elements in the colgroup
t.find('td, th')
.not(th)
.not('table th, table td')
.each(function() {
$(this).removeAttr('width'); //the width attribute is removed from all table cells which are not nested in other tables and dont belong to the header
});
if (!t.f) {
t.removeAttr('width').addClass(FLEX); //if not fixed, let the table grow as needed
}
syncGrips(t); //the grips are positioned according to the current table layout
//there is a small problem, some cells in the table could contain dimension values interfering with the
//width value set by this plugin. Those values are removed
};
/**
* Function to allow the persistence of columns dimensions after a browser postback. It is based in
* the HTML5 sessionStorage object, which can be emulated for older browsers using sessionstorage.js
* @param {jQuery ref} t - table object
* @param {jQuery ref} th - reference to the first row elements (only set in deserialization)
*/
var memento = function(t, th) {
var w,
m = 0,
i = 0,
aux = [],
tw;
if (th) {
//in deserialization mode (after a postback)
t.cg.removeAttr('width');
if (t.opt.flush) {
S[t.id] = '';
return;
} //if flush is activated, stored data is removed
w = S[t.id].split(';'); //column widths is obtained
tw = w[t.ln + 1];
if (!t.f && tw) {
//if not fixed and table width data available its size is restored
t.width((tw *= 1));
if (t.opt.overflow) {
//if overfolw flag is set, restore table width also as table min-width
t.css('min-width', tw + PX);
t.w = tw;
}
}
for (; i < t.ln; i++) {
//for each column
aux.push((100 * w[i]) / w[t.ln] + '%'); //width is stored in an array since it will be required again a couple of lines ahead
th.eq(i).css('width', aux[i]); //each column width in % is restored
}
for (i = 0; i < t.ln; i++) t.cg.eq(i).css('width', aux[i]); //this code is required in order to create an inline CSS rule with higher precedence than an existing CSS class in the "col" elements
} else {
//in serialization mode (after resizing a column)
S[t.id] = ''; //clean up previous data
for (; i < t.c.length; i++) {
//iterate through columns
w = t.c[i].width(); //width is obtained
S[t.id] += w + ';'; //width is appended to the sessionStorage object using ID as key
m += w; //carriage is updated to obtain the full size used by columns
}
S[t.id] += m; //the last item of the serialized string is the table's active area (width),
//to be able to obtain % width value of each columns while deserializing
if (!t.f) S[t.id] += ';' + t.width(); //if not fixed, table width is stored
}
};
/**
* Function that places each grip in the correct position according to the current table layout
* @param {jQuery ref} t - table object
*/
var syncGrips = function(t) {
t.gc.width(t.w); //the grip's container width is updated
for (var i = 0; i < t.ln; i++) {
//for each column
var c = t.c[i];
t.g[i].css({
//height and position of the grip is updated according to the table layout
left:
c.offset().left -
t.offset().left +
c.outerWidth(false) +
t.cs / 2 +
PX,
height: t.opt.headerOnly
? t.c[0].outerHeight(false)
: t.outerHeight(false)
});
}
};
/**
* This function updates column's width according to the horizontal position increment of the grip being
* dragged. The function can be called while dragging if liveDragging is enabled and also from the onGripDragOver
* event handler to synchronize grip's position with their related columns.
* @param {jQuery ref} t - table object
* @param {number} i - index of the grip being dragged
* @param {bool} isOver - to identify when the function is being called from the onGripDragOver event
*/
var syncCols = function(t, i, isOver) {
var inc = drag.x - drag.l,
c = t.c[i],
c2 = t.c[i + 1];
var w = c.w + inc;
var w2 = c2.w - inc; //their new width is obtained
c.width(w + PX);
t.cg.eq(i).width(w + PX);
if (t.f) {
//if fixed mode
c2.width(w2 + PX);
t.cg.eq(i + 1).width(w2 + PX);
} else if (t.opt.overflow) {
//if overflow is set, incriment min-width to force overflow
t.css('min-width', t.w + inc);
}
if (isOver) {
c.w = w;
c2.w = t.f ? w2 : c2.w;
}
};
/**
* This function updates all columns width according to its real width. It must be taken into account that the
* sum of all columns can exceed the table width in some cases (if fixed is set to false and table has some kind
* of max-width).
* @param {jQuery ref} t - table object
*/
var applyBounds = function(t) {
var w = $.map(t.c, function(c) {
//obtain real widths
return c.width();
});
t.width((t.w = t.width())).removeClass(FLEX); //prevent table width changes
$.each(t.c, function(i, c) {
c.width(w[i]).w = w[i]; //set column widths applying bounds (table's max-width)
});
t.addClass(FLEX); //allow table width changes
};
/**
* Event handler used while dragging a grip. It checks if the next grip's position is valid and updates it.
* @param {event} e - mousemove event binded to the window object
*/
var onGripDrag = function(e) {
if (!drag) return;
var t = drag.t; //table object reference
var oe = e.originalEvent.touches;
var ox = oe ? oe[0].pageX : e.pageX; //original position (touch or mouse)
var x = ox - drag.ox + drag.l; //next position according to horizontal mouse position increment
var mw = t.opt.minWidth,
i = drag.i; //cell's min width
var l = t.cs * 1.5 + mw + t.b;
var last = i == t.ln - 1; //check if it is the last column's grip (usually hidden)
var min = i ? t.g[i - 1].position().left + t.cs + mw : l; //min position according to the contiguous cells
var max = t.f //fixed mode?
? i == t.ln - 1
? t.w - l
: t.g[i + 1].position().left - t.cs - mw
: Infinity; //max position according to the contiguous cells
x = M.max(min, M.min(max, x)); //apply bounding
drag.x = x;
drag.css('left', x + PX); //apply position increment
if (last) {
//if it is the last grip
var c = t.c[drag.i]; //width of the last column is obtained
drag.w = c.w + x - drag.l;
}
if (t.opt.liveDrag) {
//if liveDrag is enabled
if (last) {
c.width(drag.w);
if (!t.f && t.opt.overflow) {
//if overflow is set, incriment min-width to force overflow
t.css('min-width', t.w + x - drag.l);
} else {
t.w = t.width();
}
} else {
syncCols(t, i); //columns are synchronized
}
syncGrips(t);
var cb = t.opt.onDrag; //check if there is an onDrag callback
if (cb) {
e.currentTarget = t[0];
cb(e);
} //if any, it is fired
}
return false; //prevent text selection while dragging
};
/**
* Event handler fired when the dragging is over, updating table layout
* @param {event} e - grip's drag over event
*/
var onGripDragOver = function(e) {
d.unbind('touchend.' + SIGNATURE + ' mouseup.' + SIGNATURE).unbind(
'touchmove.' + SIGNATURE + ' mousemove.' + SIGNATURE
);
$('head :last-child').remove(); //remove the dragging cursor style
if (!drag) return;
drag.removeClass(drag.t.opt.draggingClass); //remove the grip's dragging css-class
if (!(drag.x - drag.l == 0)) {
var t = drag.t;
var cb = t.opt.onResize; //get some values
var i = drag.i; //column index
var last = i == t.ln - 1; //check if it is the last column's grip (usually hidden)
var c = t.g[i].c; //the column being dragged
if (last) {
c.width(drag.w);
c.w = drag.w;
} else {
syncCols(t, i, true); //the columns are updated
}
if (!t.f) applyBounds(t); //if not fixed mode, then apply bounds to obtain real width values
syncGrips(t); //the grips are updated
if (cb) {
e.currentTarget = t[0];
cb(e);
} //if there is a callback function, it is fired
if (t.p && S) memento(t); //if postbackSafe is enabled and there is sessionStorage support, the new layout is serialized and stored
}
drag = null; //since the grip's dragging is over
};
/**
* Event handler fired when the grip's dragging is about to start. Its main goal is to set up events
* and store some values used while dragging.
* @param {event} e - grip's mousedown event
*/
var onGripMouseDown = function(e) {
var o = $(this).data(SIGNATURE); //retrieve grip's data
var t = tables[o.t],
g = t.g[o.i]; //shortcuts for the table and grip objects
var oe = e.originalEvent.touches; //touch or mouse event?
g.ox = oe ? oe[0].pageX : e.pageX; //the initial position is kept
g.l = g.position().left;
g.x = g.l;
d.bind(
'touchmove.' + SIGNATURE + ' mousemove.' + SIGNATURE,
onGripDrag
).bind('touchend.' + SIGNATURE + ' mouseup.' + SIGNATURE, onGripDragOver); //mousemove and mouseup events are bound
h.append(
"<style type='text/css'>*{cursor:" +
t.opt.dragCursor +
'!important}</style>'
); //change the mouse cursor
g.addClass(t.opt.draggingClass); //add the dragging class (to allow some visual feedback)
drag = g; //the current grip is stored as the current dragging object
if (t.c[o.i].l)
for (var i = 0, c; i < t.ln; i++) {
c = t.c[i];
c.l = false;
c.w = c.width();
} //if the colum is locked (after browser resize), then c.w must be updated
return false; //prevent text selection
};
/**
* Event handler fired when the browser is resized. The main purpose of this function is to update
* table layout according to the browser's size synchronizing related grips
*/
var onResize = function() {
for (var t in tables) {
if (tables.hasOwnProperty(t)) {
t = tables[t];
var i,
mw = 0;
t.removeClass(SIGNATURE); //firefox doesn't like layout-fixed in some cases
if (t.f) {
//in fixed mode
t.w = t.width(); //its new width is kept
for (i = 0; i < t.ln; i++) mw += t.c[i].w;
//cell rendering is not as trivial as it might seem, and it is slightly different for
//each browser. In the beginning i had a big switch for each browser, but since the code
//was extremely ugly now I use a different approach with several re-flows. This works
//pretty well but it's a bit slower. For now, lets keep things simple...
for (i = 0; i < t.ln; i++)
t.c[i].css(
'width',
M.round((1000 * t.c[i].w) / mw) / 10 + '%'
).l = true;
//c.l locks the column, telling us that its c.w is outdated
} else {
//in non fixed-sized tables
applyBounds(t); //apply the new bounds
if (t.mode == 'flex' && t.p && S) {
//if postbackSafe is enabled and there is sessionStorage support,
memento(t); //the new layout is serialized and stored for 'flex' tables
}
}
syncGrips(t.addClass(SIGNATURE));
}
}
};
//bind resize event, to update grips position
$(window).bind('resize.' + SIGNATURE, onResize);
/**
* The plugin is added to the jQuery library
* @param {Object} options - an object that holds some basic customization values
*/
$.fn.extend({
colResizable: function(options) {
var defaults = {
//attributes:
resizeMode: 'fit', //mode can be 'fit', 'flex' or 'overflow'
draggingClass: 'JCLRgripDrag', //css-class used when a grip is being dragged (for visual feedback purposes)
gripInnerHtml: '', //if it is required to use a custom grip it can be done using some custom HTML
liveDrag: false, //enables table-layout updating while dragging
minWidth: 15, //minimum width value in pixels allowed for a column
headerOnly: false, //specifies that the size of the the column resizing anchors will be bounded to the size of the first row
hoverCursor: 'e-resize', //cursor to be used on grip hover
dragCursor: 'e-resize', //cursor to be used while dragging
postbackSafe: false, //when it is enabled, table layout can persist after postback or page refresh. It requires browsers with sessionStorage support (it can be emulated with sessionStorage.js).
flush: false, //when postbakSafe is enabled, and it is required to prevent layout restoration after postback, 'flush' will remove its associated layout data
marginLeft: null, //in case the table contains any margins, colResizable needs to know the values used, e.g. "10%", "15em", "5px" ...
marginRight: null, //in case the table contains any margins, colResizable needs to know the values used, e.g. "10%", "15em", "5px" ...
disable: false, //disables all the enhancements performed in a previously colResized table
partialRefresh: false, //can be used in combination with postbackSafe when the table is inside of an updatePanel,
disabledColumns: [], //column indexes to be excluded
//events:
onDrag: null, //callback function to be fired during the column resizing process if liveDrag is enabled
onResize: null //callback function fired when the dragging process is over
};
var options = $.extend(defaults, options);
//since now there are 3 different ways of resizing columns, I changed the external interface to make it clear
//calling it 'resizeMode' but also to remove the "fixed" attribute which was confusing for many people
options.fixed = true;
options.overflow = false;
switch (options.resizeMode) {
case 'flex':
options.fixed = false;
break;
case 'overflow':
options.fixed = false;
options.overflow = true;
break;
}
return this.each(function() {
init(this, options);
});
}
});
});