normalized editor range widgets + added the image (oops ;) )...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-11-29 01:32:20 +04:00
parent 7dec24aa82
commit 8684411e2d
2 changed files with 23 additions and 5 deletions

View File

@ -85,7 +85,11 @@ function loadSliderState(){
// set the saved values...
while(state.length > 0){
var e = $('#'+state.pop())
.val(parseFloat(state.pop()))
if(e.prop('normalize')){
e.val(v2r(parseFloat(state.pop())))
} else {
e.val(parseFloat(state.pop()))
}
}
}
@ -106,6 +110,19 @@ function clearStates(){
$('.state').remove()
}
function makeRange(){
}
var C = 43.47
function r2v(r){
return Math.pow(Math.E, r/C)
}
function v2r(v){
return Math.log(v)*C
}
</script>
<body>
<img id="image" src="image.jpg">
@ -115,17 +132,18 @@ function clearStates(){
<div>
<div>
<span>Brightness:</span>
<input type="range" id="brightness" onchange="updateFilter($('#image'), this.id, this.valueAsNumber);" value="1" step="0.01" min="0" max="10" list="0" default="1">
<input type="range" id="brightness" onchange="updateFilter($('#image'), this.id, r2v(this.valueAsNumber));" value="0" step="0.01" min="-100" max="100" normalize default="0">
<!--input type="range" id="brightness" onchange="updateFilter($('#image'), this.id, this.valueAsNumber);" value="1" step="0.001" min="0" max="10" list="0" default="1"-->
<button class="reset" onclick="resetPrevRange(this)">x</button>
</div>
<div>
<span>Contrast:</span>
<input type="range" id="contrast" onchange="updateFilter($('#image'), this.id, this.valueAsNumber);" value="1" step="0.01" min="0" max="10" default="1">
<input type="range" id="contrast" onchange="updateFilter($('#image'), this.id, r2v(this.valueAsNumber));" value="0" step="0.01" min="-100" max="100" normalize default="0">
<button class="reset" onclick="resetPrevRange(this)">x</button>
</div>
<div>
<span>Saturation:</span>
<input type="range" id="saturate" onchange="updateFilter($('#image'), this.id, this.valueAsNumber);" value="1" step="0.01" min="0" max="10" default="1">
<input type="range" id="saturate" onchange="updateFilter($('#image'), this.id, r2v(this.valueAsNumber));" value="0" step="0.01" min="-100" max="100" normalize default="0">
<button class="reset" onclick="resetPrevRange(this)">x</button>
</div>
<div>
@ -153,7 +171,7 @@ function clearStates(){
</details>
<details>
<summary>States</summary>
<summary>Snapshots</summary>
<div>
<div class="states">
</div>

BIN
ui/experiments/image.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB