Moved flip call to the end of drawTiles method. Just code backup

This commit is contained in:
Nelson Campos 2018-10-02 16:57:31 +01:00
parent 49e3ef6885
commit 7a7ba07902
3 changed files with 32 additions and 33 deletions

View File

@ -500,10 +500,6 @@ $.Drawer.prototype = {
if ( this.viewport.degrees !== 0 ) { if ( this.viewport.degrees !== 0 ) {
this._offsetForRotation({degrees: this.viewport.degrees}); this._offsetForRotation({degrees: this.viewport.degrees});
} else{
if(this.viewer.viewport.flipped) {
this._flip();
}
} }
if (tiledImage.getRotation(true) % 360 !== 0) { if (tiledImage.getRotation(true) % 360 !== 0) {
this._offsetForRotation({ this._offsetForRotation({
@ -512,6 +508,11 @@ $.Drawer.prototype = {
tiledImage._getRotationPoint(true), true) tiledImage._getRotationPoint(true), true)
}); });
} }
if((this.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 !== 0) || (this.viewport.degrees !== 0 && tiledImage.getRotation(true) % 360 == 0)){
if((this.viewport.flipped && !tiledImage.flipped) || (!this.viewport.flipped && tiledImage.flipped) ) {
this._flip();
}
}
context.strokeRect( context.strokeRect(
tile.position.x * $.pixelDensityRatio, tile.position.x * $.pixelDensityRatio,
@ -645,7 +646,9 @@ $.Drawer.prototype = {
context.save(); context.save();
context.translate(point.x, point.y); context.translate(point.x, point.y);
if(this.viewer.viewport.flipped){ // If viewport and tiledImage are flipped, it would draw the image without flipping
// This if sentence is intended to represent a logical XOR
if((!this.viewer.viewport.flipped && this.viewer.world._items[0].flipped) || (this.viewer.viewport.flipped && !this.viewer.world._items[0].flipped)){
context.rotate(Math.PI / 180 * -options.degrees); context.rotate(Math.PI / 180 * -options.degrees);
context.scale(-1, 1); context.scale(-1, 1);
} else{ } else{

View File

@ -147,9 +147,6 @@ $.TiledImage = function( options ) {
var degrees = options.degrees || 0; var degrees = options.degrees || 0;
delete options.degrees; delete options.degrees;
// var flipped = options.flipped || false;
// delete options.flipped;
$.extend( true, this, { $.extend( true, this, {
//internal state properties //internal state properties
@ -1887,34 +1884,31 @@ function drawTiles( tiledImage, lastDrawn ) {
.getIntegerBoundingBox() .getIntegerBoundingBox()
.times($.pixelDensityRatio); .times($.pixelDensityRatio);
if(tiledImage._drawer.viewer.viewport.flipped || tiledImage.flipped ) { // if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) {
// tiledImage._drawer._flip({}); // tiledImage._drawer._flip({});
// bounds.width = bounds.width - bounds.x; // bounds.width = bounds.width - bounds.x;
// bounds.width = tiledImage._drawer.viewer.viewport.getContainerSize().width - bounds.x; // bounds.width = tiledImage._drawer.viewer.viewport.getContainerSize().width - bounds.x;
// console.log("BOUNDS before: ", bounds);
// bounds.width = bounds.width + bounds.x;
// bounds.x = -bounds.x; // bounds.x = -bounds.x;
} // console.log("Bounds Image: ", tiledImage._drawer.viewer.viewport.getContainerSize());
// }
} }
tiledImage._drawer._clear(true, bounds); tiledImage._drawer._clear(true, bounds);
} }
console.log("BOUNDS: ", bounds); console.log("BOUNDS after: ", bounds);
// When scaling, we must rotate only when blending the sketch canvas to // When scaling, we must rotate only when blending the sketch canvas to
// avoid interpolation // avoid interpolation
if (!sketchScale) { if (!sketchScale) {
if (tiledImage.viewport.degrees !== 0) { if (tiledImage.viewport.degrees !== 0) {
console.log("tiledImage.viewport.degrees !== 0");
tiledImage._drawer._offsetForRotation({ tiledImage._drawer._offsetForRotation({
degrees: tiledImage.viewport.degrees, degrees: tiledImage.viewport.degrees,
useSketch: useSketch useSketch: useSketch
}); });
}/* else {
if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) {
console.log("FLIP");
tiledImage._drawer._flip({});
} }
}*/
if (tiledImage.getRotation(true) % 360 !== 0) { if (tiledImage.getRotation(true) % 360 !== 0) {
console.log("tiledImage.getRotation(true) % 360 !== 0");
tiledImage._drawer._offsetForRotation({ tiledImage._drawer._offsetForRotation({
degrees: tiledImage.getRotation(true), degrees: tiledImage.getRotation(true),
point: tiledImage.viewport.pixelFromPointNoRotate( point: tiledImage.viewport.pixelFromPointNoRotate(
@ -1925,7 +1919,7 @@ function drawTiles( tiledImage, lastDrawn ) {
if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){ if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){
if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) { if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) {
console.log("FLIP"); console.log("FLIP1");
tiledImage._drawer._flip({}); tiledImage._drawer._flip({});
} }
} }
@ -2000,22 +1994,17 @@ function drawTiles( tiledImage, lastDrawn ) {
if (!sketchScale) { if (!sketchScale) {
if (tiledImage.getRotation(true) % 360 !== 0) { if (tiledImage.getRotation(true) % 360 !== 0) {
tiledImage._drawer._restoreRotationChanges(useSketch); tiledImage._drawer._restoreRotationChanges(useSketch);
}/* else {
if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) {
console.log("FLIP");
tiledImage._drawer._flip({});
} }
}*/
if (tiledImage.viewport.degrees !== 0) { if (tiledImage.viewport.degrees !== 0) {
tiledImage._drawer._restoreRotationChanges(useSketch); tiledImage._drawer._restoreRotationChanges(useSketch);
} }
if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){ // if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){
if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) { // if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) {
console.log("FLIP"); // console.log("FLIP2");
tiledImage._drawer._flip({}); // tiledImage._drawer._flip({});
} // }
} // }
} }
if (useSketch) { if (useSketch) {
@ -2043,7 +2032,6 @@ function drawTiles( tiledImage, lastDrawn ) {
bounds: bounds bounds: bounds
}); });
if (sketchScale) { if (sketchScale) {
console.log("--------------------sketchScale--------------------");
if (tiledImage.getRotation(true) % 360 !== 0) { if (tiledImage.getRotation(true) % 360 !== 0) {
tiledImage._drawer._restoreRotationChanges(false); tiledImage._drawer._restoreRotationChanges(false);
} }
@ -2053,6 +2041,13 @@ function drawTiles( tiledImage, lastDrawn ) {
} }
} }
if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){
if((tiledImage._drawer.viewer.viewport.flipped && !tiledImage.flipped) || (!tiledImage._drawer.viewer.viewport.flipped && tiledImage.flipped) ) {
console.log("FLIP3");
tiledImage._drawer._flip({});
}
}
drawDebugInfo( tiledImage, lastDrawn ); drawDebugInfo( tiledImage, lastDrawn );
} }

View File

@ -1435,6 +1435,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
opacity: queueItem.options.opacity, opacity: queueItem.options.opacity,
preload: queueItem.options.preload, preload: queueItem.options.preload,
degrees: queueItem.options.degrees, degrees: queueItem.options.degrees,
flipped: queueItem.options.flipped,
compositeOperation: queueItem.options.compositeOperation, compositeOperation: queueItem.options.compositeOperation,
springStiffness: _this.springStiffness, springStiffness: _this.springStiffness,
animationTime: _this.animationTime, animationTime: _this.animationTime,