github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

Backport PR #8442

Browse source 
---------

**Commit 1:**
re-adds the dragula base styles

* Original sha: ee6962c8e8
* Authored by Jim Unger <bigfunger@gmail.com> on 2016-09-22T21:57:29Z

**Commit 2:**
used string templates for test descriptors

* Original sha: 6797ca5ddd
* Authored by Jim Unger <bigfunger@gmail.com> on 2016-09-22T22:00:01Z

**Commit 3:**
fixed some re-ordering edge cases and agg_group now uses group instead of vis.aggs

* Original sha: f4717fa5eb
* Authored by Jim Unger <bigfunger@gmail.com> on 2016-09-22T22:01:18Z

**Commit 4:**
renamed baseIndex to indexOffset

* Original sha: 5d5b581399
* Authored by Jim Unger <bigfunger@gmail.com> on 2016-09-23T18:09:38Z
This commit is contained in:
Elastic Jasper 2016-09-23 15:45:14 -04:00
parent 49e858d133
commit b233029c57
5 changed files with 46 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/core_plugins/kibana/public/visualize/editor/__tests__/draggable.js
View file

@ -7,7 +7,7 @@ let init;
let $rootScope;
let $compile;
describe('draggable_* directives', function () {
describe(`draggable_* directives`, function () {
beforeEach(ngMock.module('kibana'));
beforeEach(ngMock.inject(function ($injector) {
@ -35,36 +35,36 @@ describe('draggable_* directives', function () {
};
}));
describe('draggable_container directive', function () {
it('should expose the drake', function () {
describe(`draggable_container directive`, function () {
it(`should expose the drake`, function () {
const { $scope } = init();
expect($scope.drake).to.be.an(Object);
});
it('should expose the controller', function () {
it(`should expose the controller`, function () {
const { $scope } = init();
expect($scope.draggableContainerCtrl).to.be.an(Object);
});
it('should pull item list from directive attribute', function () {
it(`should pull item list from directive attribute`, function () {
const { $scope, $parentScope } = init();
expect($scope.draggableContainerCtrl.getList()).to.eql($parentScope.items);
});
it('should not be able to move extraneous DOM elements', function () {
it(`should not be able to move extraneous DOM elements`, function () {
const bare = angular.element(`<div>`);
const { $scope } = init();
expect($scope.drake.canMove(bare[0])).to.eql(false);
});
it('should not be able to move non-[draggable-item] elements', function () {
it(`should not be able to move non-[draggable-item] elements`, function () {
const bare = angular.element(`<div>`);
const { $scope, $elem } = init();
$elem.append(bare);
expect($scope.drake.canMove(bare[0])).to.eql(false);
});
it('shouldn\'t be able to move extraneous [draggable-item] elements', function () {
it(`shouldn't be able to move extraneous [draggable-item] elements`, function () {
const anotherParent = angular.element(`<div draggable-container="items">`);
const item = angular.element(`<div draggable-item="items[0]">`);
const scope = $rootScope.$new();
@ -76,7 +76,7 @@ describe('draggable_* directives', function () {
expect($scope.drake.canMove(item[0])).to.eql(false);
});
it('shouldn\'t be able to move [draggable-item] if it has a handle', function () {
it(`shouldn't be able to move [draggable-item] if it has a handle`, function () {
const { $scope, $elem } = init(`
<div draggable-item="items[0]">
<div draggable-handle></div>
@ -86,7 +86,7 @@ describe('draggable_* directives', function () {
expect($scope.drake.canMove(item[0])).to.eql(false);
});
it('should be able to move [draggable-item] by its handle', function () {
it(`should be able to move [draggable-item] by its handle`, function () {
const { $scope, $elem } = init(`
<div draggable-item="items[0]">
<div draggable-handle></div>
@ -97,8 +97,8 @@ describe('draggable_* directives', function () {
});
});
describe('draggable_item', function () {
it('should be required to be a child to [draggable-container]', function () {
describe(`draggable_item`, function () {
it(`should be required to be a child to [draggable-container]`, function () {
const item = angular.element(`<div draggable-item="items[0]">`);
const scope = $rootScope.$new();
expect(() => {
@ -108,7 +108,7 @@ describe('draggable_* directives', function () {
});
});
describe('draggable_handle', function () {
describe(`draggable_handle`, function () {
it('should be required to be a child to [draggable-item]', function () {
const handle = angular.element(`<div draggable-handle>`);
const scope = $rootScope.$new();

2
src/core_plugins/kibana/public/visualize/editor/agg_group.html
View file

@ -3,7 +3,7 @@
{{ groupName }}
</div>
<div ng-class="groupName" draggable-container="vis.aggs" class="vis-editor-agg-group">
<div ng-class="groupName" draggable-container="group" class="vis-editor-agg-group">
<!-- wrapper needed for nesting-indicator -->
<div ng-repeat="agg in group" draggable-item="agg" class="vis-editor-agg-wrapper">
<!-- agg.html - controls for aggregation -->

11
src/core_plugins/kibana/public/visualize/editor/agg_group.js
View file

@ -43,7 +43,16 @@ uiModules
});
$scope.$on('agg-drag-start', e => $scope.dragging = true);
$scope.$on('agg-drag-end', e => $scope.dragging = false);
$scope.$on('agg-drag-end', e => {
$scope.dragging = false;
//the aggs have been reordered in [group] and we need
//to apply that ordering to [vis.aggs]
const indexOffset = $scope.vis.aggs.indexOf($scope.group[0]);
_.forEach($scope.group, (agg, index) => {
_.move($scope.vis.aggs, agg, indexOffset + index);
});
});
}
};

27
src/core_plugins/kibana/public/visualize/editor/draggable_container.js
View file

@ -69,19 +69,34 @@ uiModules
const list = $scope.draggableContainerCtrl.getList();
const itemScope = $(el).scope();
const item = itemScope.draggableItemCtrl.getItem();
const toIndex = getSiblingItemIndex(list, sibling);
const fromIndex = list.indexOf(item);
const siblingIndex = getItemIndexFromElement(list, sibling);
const toIndex = getTargetIndex(list, fromIndex, siblingIndex);
_.move(list, item, toIndex);
}
function getSiblingItemIndex(list, sibling) {
if (!sibling) { // means the item was dropped at the end of the list
function getTargetIndex(list, fromIndex, siblingIndex) {
if (siblingIndex === -1) {
// means the item was dropped at the end of the list
return list.length - 1;
} else if (fromIndex < siblingIndex) {
// An item moving from a lower index to a higher index will offset the
// index of the earlier items by one.
return siblingIndex - 1;
}
const siblingScope = $(sibling).scope();
const siblingItem = siblingScope.draggableItemCtrl.getItem();
const siblingIndex = list.indexOf(siblingItem);
return siblingIndex;
}
function getItemIndexFromElement(list, element) {
if (!element) return -1;
const scope = $(element).scope();
const item = scope.draggableItemCtrl.getItem();
const index = list.indexOf(item);
return index;
}
}
};

2
src/ui/public/styles/base.less
View file

@ -660,4 +660,4 @@ fieldset {
}
}
@import (reference) "~dragula/dist/dragula.css";
@import "~dragula/dist/dragula.css";