Fix Issue 401: shift-click a spinner for a small step
git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1199 eee81c28-f429-11dd-99c0-75d572ba1dddmaster
parent
f51f2ea13f
commit
a2557bbc98
|
@ -39,6 +39,8 @@
|
||||||
* v1.6 13 Oct 2009 - Alexis Deveria - Added stepfunc function
|
* v1.6 13 Oct 2009 - Alexis Deveria - Added stepfunc function
|
||||||
* v1.7 21 Oct 2009 - Alexis Deveria - Minor fixes
|
* v1.7 21 Oct 2009 - Alexis Deveria - Minor fixes
|
||||||
* Fast-repeat for keys and live updating as you type.
|
* Fast-repeat for keys and live updating as you type.
|
||||||
|
* v1.8 12 Jan 2010 - Benjamin Thomas - Fixes for mouseout behavior.
|
||||||
|
* Added smallStep
|
||||||
|
|
||||||
Sample usage:
|
Sample usage:
|
||||||
|
|
||||||
|
@ -47,6 +49,7 @@
|
||||||
min: 0, // Set lower limit.
|
min: 0, // Set lower limit.
|
||||||
max: 100, // Set upper limit.
|
max: 100, // Set upper limit.
|
||||||
step: 1, // Set increment size.
|
step: 1, // Set increment size.
|
||||||
|
smallStep: 0.5, // Set shift-click increment size.
|
||||||
spinClass: mySpinBtnClass, // CSS class to style the spinbutton. (Class also specifies url of the up/down button image.)
|
spinClass: mySpinBtnClass, // CSS class to style the spinbutton. (Class also specifies url of the up/down button image.)
|
||||||
upClass: mySpinUpClass, // CSS class for style when mouse over up button.
|
upClass: mySpinUpClass, // CSS class for style when mouse over up button.
|
||||||
downClass: mySpinDnClass // CSS class for style when mouse over down button.
|
downClass: mySpinDnClass // CSS class for style when mouse over down button.
|
||||||
|
@ -86,7 +89,9 @@ $.fn.SpinButton = function(cfg){
|
||||||
_repeat: null,
|
_repeat: null,
|
||||||
callback: cfg && cfg.callback ? cfg.callback : null
|
callback: cfg && cfg.callback ? cfg.callback : null
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// if a smallStep isn't supplied, use half the regular step
|
||||||
|
this.spinCfg.smallStep = cfg && cfg.smallStep ? cfg.smallStep : this.spinCfg.step/2;
|
||||||
|
|
||||||
this.adjustValue = function(i){
|
this.adjustValue = function(i){
|
||||||
var v;
|
var v;
|
||||||
|
@ -95,7 +100,8 @@ $.fn.SpinButton = function(cfg){
|
||||||
} else if($.isFunction(this.spinCfg.stepfunc)) {
|
} else if($.isFunction(this.spinCfg.stepfunc)) {
|
||||||
v = this.spinCfg.stepfunc(this, i);
|
v = this.spinCfg.stepfunc(this, i);
|
||||||
} else {
|
} else {
|
||||||
v = Number(this.value) + Number(i);
|
// weirdest javascript bug ever: 5.1 + 0.1 = 5.199999999
|
||||||
|
v = Number((Number(this.value) + Number(i)).toFixed(5));
|
||||||
}
|
}
|
||||||
if (this.spinCfg.min !== null) v = Math.max(v, this.spinCfg.min);
|
if (this.spinCfg.min !== null) v = Math.max(v, this.spinCfg.min);
|
||||||
if (this.spinCfg.max !== null) v = Math.min(v, this.spinCfg.max);
|
if (this.spinCfg.max !== null) v = Math.min(v, this.spinCfg.max);
|
||||||
|
@ -146,8 +152,10 @@ $.fn.SpinButton = function(cfg){
|
||||||
if ( e.button === 0 && this.spinCfg._direction != 0) {
|
if ( e.button === 0 && this.spinCfg._direction != 0) {
|
||||||
// Respond to click on one of the buttons:
|
// Respond to click on one of the buttons:
|
||||||
var self = this;
|
var self = this;
|
||||||
|
var stepSize = e.shiftKey ? self.spinCfg.smallStep : self.spinCfg.step
|
||||||
|
|
||||||
var adjust = function() {
|
var adjust = function() {
|
||||||
self.adjustValue(self.spinCfg._direction * self.spinCfg.step);
|
self.adjustValue(self.spinCfg._direction * stepSize);
|
||||||
};
|
};
|
||||||
|
|
||||||
adjust();
|
adjust();
|
||||||
|
|
|
@ -338,7 +338,7 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
||||||
<td><div id="stroke_bg"></div><div id="stroke_color" class="color_block" title="Change stroke color"></div></td>
|
<td><div id="stroke_bg"></div><div id="stroke_color" class="color_block" title="Change stroke color"></div></td>
|
||||||
<td><div id="stroke_opacity" class="label">100 %</div></td>
|
<td><div id="stroke_opacity" class="label">100 %</div></td>
|
||||||
<td>
|
<td>
|
||||||
<input id="stroke_width" title="Change stroke width" size="2" value="5" type="text" data-attr="Stroke Width"/>
|
<input id="stroke_width" title="Change stroke width by 1, shift-click to change by 0.1" size="2" value="5" type="text" data-attr="Stroke Width"/>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<select id="stroke_style" title="Change stroke dash style">
|
<select id="stroke_style" title="Change stroke dash style">
|
||||||
|
|
|
@ -2172,7 +2172,7 @@ function svg_edit_setup() {
|
||||||
Actions.setAll();
|
Actions.setAll();
|
||||||
|
|
||||||
$('#rect_rx').SpinButton({ min: 0, max: 1000, step: 1, callback: changeRectRadius });
|
$('#rect_rx').SpinButton({ min: 0, max: 1000, step: 1, callback: changeRectRadius });
|
||||||
$('#stroke_width').SpinButton({ min: 0, max: 99, step: 1, callback: changeStrokeWidth });
|
$('#stroke_width').SpinButton({ min: 0, max: 99, step: 1, smallStep: 0.1, callback: changeStrokeWidth });
|
||||||
$('#angle').SpinButton({ min: -180, max: 180, step: 5, callback: changeRotationAngle });
|
$('#angle').SpinButton({ min: -180, max: 180, step: 5, callback: changeRotationAngle });
|
||||||
$('#font_size').SpinButton({ step: 1, min: 0.001, stepfunc: stepFontSize, callback: changeFontSize });
|
$('#font_size').SpinButton({ step: 1, min: 0.001, stepfunc: stepFontSize, callback: changeFontSize });
|
||||||
$('#group_opacity').SpinButton({ step: 5, min: 0, max: 100, callback: changeOpacity });
|
$('#group_opacity').SpinButton({ step: 5, min: 0, max: 100, callback: changeOpacity });
|
||||||
|
|
Loading…
Reference in New Issue