Skip to content

Commit

Permalink
feat: add axes filter guards to prevent filters from spilling out of …
Browse files Browse the repository at this point in the history 
…the axis limits
  • Loading branch information
@hkang1
hkang1 committed Feb 3, 2022
1 parent c676fa9 commit 4949d2d
Show file tree
Hide file tree
Showing 5 changed files with 156 additions and 138 deletions.
68 changes: 36 additions & 32 deletions dist/hermes.cjs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1455,6 +1455,40 @@ class Hermes {
}
this._ = _;
}
updateActiveFilter(finalize = false) {
if (!this._)
return;
const _dl = this._.dims.list;
const _drag = this.drag;
const _drs = _drag.shared;
const _drf = _drag.filters;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
if (_drag.type !== DragType.DimensionFilterCreate || !_drf.key)
return;
// Update filter data before removing reference.
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
// Cap the p1 position to the axis limits.
let p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
p1 = Math.min(axisStop[filterKey] - axisStart[filterKey], Math.max(0, p1));
_drf.active.p1 = p1;
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
// Whether or not to finalize active filter and removing reference to it.
if (!finalize)
return;
// Swap p0 and p1 if p1 is less than p0.
if (_drf.active.p1 < _drf.active.p0) {
const [tempP, tempValue] = [_drf.active.p1, _drf.active.value1];
[_drf.active.p1, _drf.active.value1] = [_drf.active.p0, _drf.active.value0];
[_drf.active.p0, _drf.active.value0] = [tempP, tempValue];
}
// Overwrite active filter to remove reference to filter in filters list.
_drf.active = FILTER;
_drf.key = undefined;
this.mergeFilters();
}
mergeFilters() {
Object.keys(this.filters).forEach(key => {
const filters = this.filters[key] || [];
Expand Down Expand Up @@ -1680,10 +1714,8 @@ class Hermes {
const _drag = this.drag;
const _drs = this.drag.shared;
const _drd = this.drag.dimension;
const _drf = this.drag.filters;
const _dl = this._.dims.list;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
_drs.p1 = { x, y };
_drd.offset = {
x: isHorizontal ? _drs.p1.x - _drs.p0.x : 0,
Expand All @@ -1710,46 +1742,18 @@ class Hermes {
}
}
// Update dimension filter creating dragging data.
if (_drag.type === DragType.DimensionFilterCreate && _drf.key) {
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
_drf.active.p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
}
this.updateActiveFilter();
this.calculate();
}
handleMouseUp(e) {
if (!this._ || this.drag.type === DragType.None)
return;
const [x, y] = [e.clientX, e.clientY];
const _drag = this.drag;
const _drs = this.drag.shared;
const _drf = this.drag.filters;
const _dl = this._.dims.list;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
_drs.p1 = { x, y };
if (_drag.type === DragType.DimensionFilterCreate && _drf.key) {
// Update filter data before removing reference.
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
_drf.active.p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
// Swap p0 and p1 if p1 is less than p0.
if (_drf.active.p1 < _drf.active.p0) {
const [tempP, tempValue] = [_drf.active.p1, _drf.active.value1];
[_drf.active.p1, _drf.active.value1] = [_drf.active.p0, _drf.active.value0];
[_drf.active.p0, _drf.active.value0] = [tempP, tempValue];
}
// Overwrite active filter to remove reference to filter in filters list.
_drf.active = FILTER;
_drf.key = undefined;
}
this.updateActiveFilter(true);
// Reset drag info.
this.drag = clone(DRAG);
this.mergeFilters();
this.calculate();
}
}
Expand Down
1 change: 1 addition & 0 deletions dist/hermes.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ declare class Hermes {
private calculate;
private calculateScales;
private calculateLayout;
private updateActiveFilter;
private mergeFilters;
private draw;
private drawDebugOutline;
Expand Down
68 changes: 36 additions & 32 deletions dist/hermes.esm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1453,6 +1453,40 @@ class Hermes {
}
this._ = _;
}
updateActiveFilter(finalize = false) {
if (!this._)
return;
const _dl = this._.dims.list;
const _drag = this.drag;
const _drs = _drag.shared;
const _drf = _drag.filters;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
if (_drag.type !== DragType.DimensionFilterCreate || !_drf.key)
return;
// Update filter data before removing reference.
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
// Cap the p1 position to the axis limits.
let p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
p1 = Math.min(axisStop[filterKey] - axisStart[filterKey], Math.max(0, p1));
_drf.active.p1 = p1;
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
// Whether or not to finalize active filter and removing reference to it.
if (!finalize)
return;
// Swap p0 and p1 if p1 is less than p0.
if (_drf.active.p1 < _drf.active.p0) {
const [tempP, tempValue] = [_drf.active.p1, _drf.active.value1];
[_drf.active.p1, _drf.active.value1] = [_drf.active.p0, _drf.active.value0];
[_drf.active.p0, _drf.active.value0] = [tempP, tempValue];
}
// Overwrite active filter to remove reference to filter in filters list.
_drf.active = FILTER;
_drf.key = undefined;
this.mergeFilters();
}
mergeFilters() {
Object.keys(this.filters).forEach(key => {
const filters = this.filters[key] || [];
Expand Down Expand Up @@ -1678,10 +1712,8 @@ class Hermes {
const _drag = this.drag;
const _drs = this.drag.shared;
const _drd = this.drag.dimension;
const _drf = this.drag.filters;
const _dl = this._.dims.list;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
_drs.p1 = { x, y };
_drd.offset = {
x: isHorizontal ? _drs.p1.x - _drs.p0.x : 0,
Expand All @@ -1708,46 +1740,18 @@ class Hermes {
}
}
// Update dimension filter creating dragging data.
if (_drag.type === DragType.DimensionFilterCreate && _drf.key) {
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
_drf.active.p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
}
this.updateActiveFilter();
this.calculate();
}
handleMouseUp(e) {
if (!this._ || this.drag.type === DragType.None)
return;
const [x, y] = [e.clientX, e.clientY];
const _drag = this.drag;
const _drs = this.drag.shared;
const _drf = this.drag.filters;
const _dl = this._.dims.list;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
_drs.p1 = { x, y };
if (_drag.type === DragType.DimensionFilterCreate && _drf.key) {
// Update filter data before removing reference.
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
_drf.active.p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
// Swap p0 and p1 if p1 is less than p0.
if (_drf.active.p1 < _drf.active.p0) {
const [tempP, tempValue] = [_drf.active.p1, _drf.active.value1];
[_drf.active.p1, _drf.active.value1] = [_drf.active.p0, _drf.active.value0];
[_drf.active.p0, _drf.active.value0] = [tempP, tempValue];
}
// Overwrite active filter to remove reference to filter in filters list.
_drf.active = FILTER;
_drf.key = undefined;
}
this.updateActiveFilter(true);
// Reset drag info.
this.drag = clone(DRAG);
this.mergeFilters();
this.calculate();
}
}
Expand Down
68 changes: 36 additions & 32 deletions dist/hermes.iife.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1456,6 +1456,40 @@ var Hermes = (function () {
}
this._ = _;
}
updateActiveFilter(finalize = false) {
if (!this._)
return;
const _dl = this._.dims.list;
const _drag = this.drag;
const _drs = _drag.shared;
const _drf = _drag.filters;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
if (_drag.type !== DragType.DimensionFilterCreate || !_drf.key)
return;
// Update filter data before removing reference.
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
// Cap the p1 position to the axis limits.
let p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
p1 = Math.min(axisStop[filterKey] - axisStart[filterKey], Math.max(0, p1));
_drf.active.p1 = p1;
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
// Whether or not to finalize active filter and removing reference to it.
if (!finalize)
return;
// Swap p0 and p1 if p1 is less than p0.
if (_drf.active.p1 < _drf.active.p0) {
const [tempP, tempValue] = [_drf.active.p1, _drf.active.value1];
[_drf.active.p1, _drf.active.value1] = [_drf.active.p0, _drf.active.value0];
[_drf.active.p0, _drf.active.value0] = [tempP, tempValue];
}
// Overwrite active filter to remove reference to filter in filters list.
_drf.active = FILTER;
_drf.key = undefined;
this.mergeFilters();
}
mergeFilters() {
Object.keys(this.filters).forEach(key => {
const filters = this.filters[key] || [];
Expand Down Expand Up @@ -1681,10 +1715,8 @@ var Hermes = (function () {
const _drag = this.drag;
const _drs = this.drag.shared;
const _drd = this.drag.dimension;
const _drf = this.drag.filters;
const _dl = this._.dims.list;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
_drs.p1 = { x, y };
_drd.offset = {
x: isHorizontal ? _drs.p1.x - _drs.p0.x : 0,
Expand All @@ -1711,46 +1743,18 @@ var Hermes = (function () {
}
}
// Update dimension filter creating dragging data.
if (_drag.type === DragType.DimensionFilterCreate && _drf.key) {
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
_drf.active.p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
}
this.updateActiveFilter();
this.calculate();
}
handleMouseUp(e) {
if (!this._ || this.drag.type === DragType.None)
return;
const [x, y] = [e.clientX, e.clientY];
const _drag = this.drag;
const _drs = this.drag.shared;
const _drf = this.drag.filters;
const _dl = this._.dims.list;
const isHorizontal = this.options.direction === Direction.Horizontal;
const filterKey = isHorizontal ? 'y' : 'x';
_drs.p1 = { x, y };
if (_drag.type === DragType.DimensionFilterCreate && _drf.key) {
// Update filter data before removing reference.
const bound = _dl[_drs.index].layout.bound;
const axisStart = _dl[_drs.index].layout.axisStart;
const axisStop = _dl[_drs.index].layout.axisStop;
_drf.active.p1 = _drs.p1[filterKey] - bound[filterKey] - axisStart[filterKey];
_drf.active.value1 = getAxisPositionValue(_drf.active.p1, axisStop[filterKey] - axisStart[filterKey], this.dimensions[_drs.index].axis.scale);
// Swap p0 and p1 if p1 is less than p0.
if (_drf.active.p1 < _drf.active.p0) {
const [tempP, tempValue] = [_drf.active.p1, _drf.active.value1];
[_drf.active.p1, _drf.active.value1] = [_drf.active.p0, _drf.active.value0];
[_drf.active.p0, _drf.active.value0] = [tempP, tempValue];
}
// Overwrite active filter to remove reference to filter in filters list.
_drf.active = FILTER;
_drf.key = undefined;
}
this.updateActiveFilter(true);
// Reset drag info.
this.drag = clone(DRAG);
this.mergeFilters();
this.calculate();
}
}
Expand Down
Loading

0 comments on commit 4949d2d

Please sign in to comment.