1
This commit is contained in:
Alex Yatskov 2015-06-27 21:51:54 +09:00
parent e60923a6b4
commit 7172f341cd

View File

@ -76,6 +76,7 @@
var _fillColorPos = '#cc0000'; var _fillColorPos = '#cc0000';
var _panelColor = '#babdb6'; var _panelColor = '#babdb6';
var _tickColor = '#888a85'; var _tickColor = '#888a85';
var _bracketBgColor = '#ffffff';
var _densitySize = 10; var _densitySize = 10;
var _desatOffset = -0.3; var _desatOffset = -0.3;
@ -83,7 +84,8 @@
var _padding = 5; var _padding = 5;
var _panelSize = 20; var _panelSize = 20;
var _tickSize = 5; var _tickSize = 5;
var _bracketSize = 20; var _bracketSize = 10;
var _anchorSize = 3;
var _width = 120; var _width = 120;
var _easeTime = 400; var _easeTime = 400;
@ -207,36 +209,31 @@
} }
function updateBracket() { function updateBracket() {
var vis = _data.bracket.min <= _data.bracket.max ? 'visible' : 'hidden'; var visibility = _data.bracket.min <= _data.bracket.max ? 'visible' : 'hidden';
var minY = valueToIndicator(_data.bracket.min); var yMin = valueToIndicator(_data.bracket.min);
var maxY = valueToIndicator(_data.bracket.max); var yMax = valueToIndicator(_data.bracket.max);
var height = maxY - minY; var ySize = yMax - yMin;
var leftX = _width - _bracketSize; var xMin = _width - _bracketSize;
var midX = _width - _bracketSize / 2; var xMax = _width;
var rightX = _width;
var path = var path =
'M' + leftX + ',' + minY + 'M' + xMin + ',' + yMin +
'Q' + rightX + ' ' + minY + ',' + rightX + ' ' + (minY + height * 0.1) + 'Q' + xMax + ' ' + yMin + ',' + xMax + ' ' + (yMin + ySize * 0.025) +
'v' + (height * 0.4) + 'v' + ySize * 0.95 +
// 'A' + (_bracketSize / 2) + ' ' + (_bracketSize / 2) + ' ' + 0 + ' ' + 0 + ' ' + 0 + ' ' + rightX + ' ' + (minY + maxY) / 2 + 'Q' + xMax + ' ' + yMax + ',' + xMin + ' ' + yMax;
'v' + (height * 0.4) +
'Q' + (rightX) + ' ' + maxY + ',' + leftX + ' ' + (maxY);
console.log(path);
if (_.has(_elements, 'bracketPath')) { if (_.has(_elements, 'bracketPath')) {
_elements.bracketPath.attr({ _elements.bracketPath.attr({
visibility: vis, visibility: visibility,
path: path path: path
}); });
} }
else { else {
_elements.bracketPath = _canvas.path(path).attr({ _elements.bracketPath = _canvas.path(path).attr({
visibility: vis, visibility: visibility,
fill: '#ffffff', fill: _bracketBgColor,
strokeWidth: 1, strokeWidth: 1,
stroke: '#000000' stroke: '#000000'
}); });
@ -244,35 +241,35 @@
if (_.has(_elements, 'bracketMin')) { if (_.has(_elements, 'bracketMin')) {
_elements.bracketMin.attr({ _elements.bracketMin.attr({
visibility: vis, visibility: visibility,
cy: minY cy: yMin
}); });
} }
else { else {
_elements.bracketMin = _canvas.circle( _elements.bracketMin = _canvas.circle(
_width - _bracketSize / 2, _width - _bracketSize,
minY, yMin,
3 _anchorSize
).attr({ ).attr({
visibility: vis, visibility: visibility,
fill: '#0000ff' fill: _fillColorNeg
}); });
} }
if (_.has(_elements, 'bracketMax')) { if (_.has(_elements, 'bracketMax')) {
_elements.bracketMax.attr({ _elements.bracketMax.attr({
visibility: vis, visibility: visibility,
cy: maxY cy: yMax
}); });
} }
else { else {
_elements.bracketMax = _canvas.circle( _elements.bracketMax = _canvas.circle(
_width - _bracketSize / 2, _width - _bracketSize,
maxY, yMax,
3 _anchorSize
).attr({ ).attr({
visibility: vis, visibility: visibility,
fill: '#ff0000' fill: _fillColorPos
}); });
} }
} }