Updates to UI
This commit is contained in:
parent
32329bcce4
commit
90986beb92
@ -87,10 +87,9 @@
|
|||||||
var _easeTime = 400;
|
var _easeTime = 400;
|
||||||
var _height = 500;
|
var _height = 500;
|
||||||
var _padding = 10;
|
var _padding = 10;
|
||||||
var _panelSize = 20;
|
var _panelSize = 40;
|
||||||
var _modeSize = 20;
|
|
||||||
var _tickSize = 5;
|
var _tickSize = 5;
|
||||||
var _width = 120;
|
var _width = 125;
|
||||||
|
|
||||||
var _indicatorAnim = null;
|
var _indicatorAnim = null;
|
||||||
var _bracketAnim = null;
|
var _bracketAnim = null;
|
||||||
@ -111,7 +110,7 @@
|
|||||||
_densitySize,
|
_densitySize,
|
||||||
0,
|
0,
|
||||||
_width - (_bracketSize + _densitySize),
|
_width - (_bracketSize + _densitySize),
|
||||||
_height - (_panelSize + _modeSize)
|
_height - _panelSize
|
||||||
).attr({
|
).attr({
|
||||||
cursor: 'crosshair',
|
cursor: 'crosshair',
|
||||||
stroke: _borderColor,
|
stroke: _borderColor,
|
||||||
@ -123,7 +122,7 @@
|
|||||||
0,
|
0,
|
||||||
0,
|
0,
|
||||||
_densitySize,
|
_densitySize,
|
||||||
_height - (_panelSize + _modeSize)
|
_height - _panelSize
|
||||||
).attr({
|
).attr({
|
||||||
stroke: _borderColor
|
stroke: _borderColor
|
||||||
});
|
});
|
||||||
@ -131,7 +130,7 @@
|
|||||||
// panel
|
// panel
|
||||||
_elements.panel = _canvas.rect(
|
_elements.panel = _canvas.rect(
|
||||||
0,
|
0,
|
||||||
_height - (_panelSize + _modeSize),
|
_height - _panelSize,
|
||||||
_width - _bracketSize,
|
_width - _bracketSize,
|
||||||
_panelSize
|
_panelSize
|
||||||
).attr({
|
).attr({
|
||||||
@ -141,11 +140,12 @@
|
|||||||
// label
|
// label
|
||||||
_elements.label = _canvas.text(
|
_elements.label = _canvas.text(
|
||||||
(_width - _bracketSize) / 2,
|
(_width - _bracketSize) / 2,
|
||||||
_height - (_panelSize / 2 + _modeSize),
|
_height - _panelSize * 3 / 4,
|
||||||
_name
|
_name
|
||||||
).attr({
|
).attr({
|
||||||
'dominant-baseline': 'middle',
|
'dominant-baseline': 'middle',
|
||||||
'text-anchor': 'middle'
|
'text-anchor': 'middle',
|
||||||
|
'font-weight': 'bold'
|
||||||
});
|
});
|
||||||
|
|
||||||
// bracketBg
|
// bracketBg
|
||||||
@ -153,7 +153,7 @@
|
|||||||
_width - _bracketSize,
|
_width - _bracketSize,
|
||||||
0,
|
0,
|
||||||
_bracketSize,
|
_bracketSize,
|
||||||
_height - (_panelSize + _modeSize)
|
_height - _panelSize
|
||||||
).attr({
|
).attr({
|
||||||
fill: _bracketColorBg
|
fill: _bracketColorBg
|
||||||
});
|
});
|
||||||
@ -297,19 +297,22 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function updateMode() {
|
function updateMode() {
|
||||||
|
var modeText = '( ' + _data.mode + ' )';
|
||||||
|
|
||||||
if (_.has(_elements, 'mode')) {
|
if (_.has(_elements, 'mode')) {
|
||||||
_elements.mode.attr({
|
_elements.mode.attr({
|
||||||
text: _data.mode
|
text: modeText
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
_elements.mode = _canvas.text(
|
_elements.mode = _canvas.text(
|
||||||
(_width - _bracketSize) / 2,
|
(_width - _bracketSize) / 2,
|
||||||
_height - _modeSize / 2,
|
_height - _panelSize / 4,
|
||||||
_data.mode
|
modeText
|
||||||
).attr({
|
).attr({
|
||||||
'dominant-baseline': 'middle',
|
'dominant-baseline': 'middle',
|
||||||
'text-anchor': 'middle'
|
'text-anchor': 'middle',
|
||||||
|
cursor: 'hand'
|
||||||
}).click(modeClick);
|
}).click(modeClick);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -454,7 +457,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function modeClick(event, x, y) {
|
function modeClick(event, x, y) {
|
||||||
var mode = _data.mode === 'prod' ? 'dist' : 'prod';
|
var mode = _data.mode === 'product' ? 'distance' : 'product';
|
||||||
updateState(_data.value, mode);
|
updateState(_data.value, mode);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
14
types.go
14
types.go
@ -29,7 +29,7 @@ type modeType int
|
|||||||
const (
|
const (
|
||||||
ModeTypeNone modeType = iota
|
ModeTypeNone modeType = iota
|
||||||
ModeTypeProduct
|
ModeTypeProduct
|
||||||
ModeTypeDist
|
ModeTypeDistance
|
||||||
)
|
)
|
||||||
|
|
||||||
type featureMap map[string]float64
|
type featureMap map[string]float64
|
||||||
@ -199,9 +199,9 @@ func (s recordSorter) Swap(i, j int) {
|
|||||||
func (m modeType) String() string {
|
func (m modeType) String() string {
|
||||||
switch m {
|
switch m {
|
||||||
case ModeTypeProduct:
|
case ModeTypeProduct:
|
||||||
return "prod"
|
return "product"
|
||||||
case ModeTypeDist:
|
case ModeTypeDistance:
|
||||||
return "dist"
|
return "distance"
|
||||||
default:
|
default:
|
||||||
return "invalid"
|
return "invalid"
|
||||||
}
|
}
|
||||||
@ -209,10 +209,10 @@ func (m modeType) String() string {
|
|||||||
|
|
||||||
func strToModeType(mode string) modeType {
|
func strToModeType(mode string) modeType {
|
||||||
switch mode {
|
switch mode {
|
||||||
case "prod":
|
case "product":
|
||||||
return ModeTypeProduct
|
return ModeTypeProduct
|
||||||
case "dist":
|
case "distance":
|
||||||
return ModeTypeDist
|
return ModeTypeDistance
|
||||||
default:
|
default:
|
||||||
return ModeTypeNone
|
return ModeTypeNone
|
||||||
}
|
}
|
||||||
|
2
util.go
2
util.go
@ -81,7 +81,7 @@ func compare(features1 featureMap, features2 featureMap, modes modeMap) float64
|
|||||||
value2, _ := features2[key]
|
value2, _ := features2[key]
|
||||||
|
|
||||||
switch mode, _ := modes[key]; mode {
|
switch mode, _ := modes[key]; mode {
|
||||||
case ModeTypeDist:
|
case ModeTypeDistance:
|
||||||
result += 1 - math.Abs(value1-value2)
|
result += 1 - math.Abs(value1-value2)
|
||||||
default:
|
default:
|
||||||
result += value1 * value2
|
result += value1 * value2
|
||||||
|
Loading…
Reference in New Issue
Block a user