Browse Source

Added two distance-based types of errorPixelTransform

pull/29/head
Kamil Bielawski 10 years ago
parent
commit
09c923dbba
  1. 14
      demoassets/main.js
  2. 4
      index.html
  3. 21
      resemble.js

14
demoassets/main.js

@ -151,6 +151,20 @@ $(function(){
resembleControl.repaint(); resembleControl.repaint();
} }
else else
if($this.is('#flatWithDistanceBasedIntensity')){
resemble.outputSettings({
errorType: 'flatWithDistanceBasedIntensity'
});
resembleControl.repaint();
}
else
if($this.is('#movementWithDistanceBasedIntensity')){
resemble.outputSettings({
errorType: 'movementWithDistanceBasedIntensity'
});
resembleControl.repaint();
}
else
if($this.is('#opaque')){ if($this.is('#opaque')){
resemble.outputSettings({ resemble.outputSettings({
transparency: 1 transparency: 1

4
index.html

@ -102,6 +102,8 @@
<div class="btn-group buttons" style="display:none"> <div class="btn-group buttons" style="display:none">
<button class="btn active" id="flat">Flat</button> <button class="btn active" id="flat">Flat</button>
<button class="btn" id="movement">Movement</button> <button class="btn" id="movement">Movement</button>
<button class="btn" id="flatWithDistanceBasedIntensity">Flat with distance-based intensity</button>
<button class="btn" id="movementWithDistanceBasedIntensity">Movement with distance-based intensity</button>
</div> </div>
<div class="btn-group buttons" style="display:none"> <div class="btn-group buttons" style="display:none">
@ -188,4 +190,4 @@ resemble(file).compareTo(file2).onComplete(function(){
<script src="resemble.js"></script> <script src="resemble.js"></script>
<script src="demoassets/main.js"></script> <script src="demoassets/main.js"></script>
</body> </body>
</html> </html>

21
resemble.js

@ -15,6 +15,10 @@ URL: https://github.com/Huddle/Resemble.js
alpha: 255 alpha: 255
}; };
function colorsDistance(c1, c2){
return (Math.abs(c1.r - c2.r) + Math.abs(c1.g - c2.g) + Math.abs(c1.b - c2.b))/3;
}
var errorPixelTransform = { var errorPixelTransform = {
flat : function (d1, d2){ flat : function (d1, d2){
return { return {
@ -31,6 +35,23 @@ URL: https://github.com/Huddle/Resemble.js
b: ((d2.b*(errorPixelColor.blue/255)) + errorPixelColor.blue)/2, b: ((d2.b*(errorPixelColor.blue/255)) + errorPixelColor.blue)/2,
a: d2.a a: d2.a
} }
},
flatWithDistanceBasedIntensity: function (d1, d2){
return {
r: errorPixelColor.red,
g: errorPixelColor.green,
b: errorPixelColor.blue,
a: colorsDistance(d1, d2)
}
},
movementWithDistanceBasedIntensity: function (d1, d2){
var ratio = colorsDistance(d1, d2)/255 * 0.8;
return {
r: ((1-ratio)*(d2.r*(errorPixelColor.red/255)) + ratio*errorPixelColor.red),
g: ((1-ratio)*(d2.g*(errorPixelColor.green/255)) + ratio*errorPixelColor.green),
b: ((1-ratio)*(d2.b*(errorPixelColor.blue/255)) + ratio*errorPixelColor.blue),
a: d2.a
}
} }
}; };

Loading…
Cancel
Save