Commit da4ec6ab authored by bbaer's avatar bbaer
Browse files

added update Background and some mousechecks

parent e91e0924
......@@ -18,6 +18,7 @@ var QfqNS = QfqNS || {};
$(function (n) {
n.Fabric = function() {
this.parentElement = {};
this.rotation = 0;
this.controlElement = {};
this.emojiContainer = {};
this.eventEmitter = new EventEmitter();
......@@ -37,6 +38,7 @@ $(function (n) {
this.drawTextBoxMode = false;
this.emojiMode = false;
this.isHighlightMode = false;
this.isMouseMode = false;
this.isDrawingMode = true;
this.isDown = false;
this.origX = 0;
......@@ -128,10 +130,8 @@ $(function (n) {
var that = this;
$.each(this.myModes.modes, function(i, o) {
if (o.name == that.myModes.currentMode) {
console.log(o.requiresDrawing);
if (o.requiresDrawing) {
that.qFabric.canvas.isDrawingMode = true;
console.log(that.qFabric);
} else {
that.qFabric.canvas.isDrawingMode = false;
}
......@@ -147,7 +147,6 @@ $(function (n) {
that.qFabric[o.toggle] = true;
}
if (o.hasToggleElement) {
console.log(o.toggleElement);
that.qFabric[o.toggleElement].slideToggle();
}
} else {
......@@ -375,7 +374,9 @@ $(function (n) {
n.Fabric.prototype.dragEndEvent = function(e) {
if (this.dragAndDrop) {
this.emojiAdd(this.dndData, e);
if (this.mouseInsideCanvas) {
this.emojiAdd(this.dndData, e);
}
this.dndData = '';
this.dragAndDrop = false;
}
......@@ -389,16 +390,16 @@ $(function (n) {
console.log("resize canvas started");
var backgroundSizing = false;
var oldWidth = this.canvas.getWidth();
console.log("canvas: " + oldWidth);
var backgroundImageWidth = this.canvas.backgroundImage.width || 0;
console.log("bgimage: " + backgroundImageWidth);
if (this.canvas.backgroundImage) {
var backgroundImageWidth = this.canvas.backgroundImage.getWidth() || 0;
} else {
var backgroundImageWidth = 0;
}
if (oldWidth !== backgroundImageWidth && backgroundImageWidth !== 0) {
oldWidth = backgroundImageWidth;
backgroundSizing = true;
}
console.log("canvas oldWidth: " + oldWidth);
var newWidth = this.parentElement.innerWidth();
console.log("html: " + newWidth);
if (newWidth !== oldWidth) {
var scaleMultiplier = newWidth / oldWidth;
var oldHeight;
......@@ -436,8 +437,8 @@ $(function (n) {
};
n.Fabric.prototype.setBackground = function () {
var that = this;
if (this.backgroundImage) {
var that = this;
fabric.Image.fromURL(this.backgroundImage, function(img) {
img.set({
width: that.canvas.width,
......@@ -445,7 +446,8 @@ $(function (n) {
originX: 'left',
originY: 'top',
lockUniScaling: true,
centeredScaling: true
centeredScaling: true,
centeredRotation: true
});
that.canvas.setBackgroundImage(img, that.canvas.renderAll.bind(that.canvas));
});
......@@ -460,10 +462,28 @@ $(function (n) {
originX: 'left',
originY: 'top',
lockUniScaling: true,
centeredScaling: true
centeredScaling: true,
centeredRotation: true
});
this.canvas.setBackgroundImage(0, this.canvas.renderAll.bind(this.canvas));
img.rotate(this.rotation);
img.onload = function() { that.canvas.renderAll(); };
this.canvas.setBackgroundImage(img, this.canvas.renderAll.bind(this.canvas));
this.canvas.renderAll();
}
};
n.Fabric.prototype.updateBackground = function () {
if (this.canvas.backgroundImage) {
console.log("set");
this.canvas.backgroundImage.setWidth(this.canvas.getWidth());
this.canvas.backgroundImage.setHeight(this.canvas.getHeight());
this.canvas.renderAll();
} else {
console.log("later");
var that = this;
setTimeout(function () {
that.updateBackground();
}, 200);
}
};
......@@ -620,7 +640,6 @@ $(function (n) {
// Default Canvas mouse events are currently strangely implemented.
n.Fabric.prototype.defaultMouseUpEvent = function(e) {
console.log("Default Mouse Up Event");
if (this.moveMode) {
this.deactivatePanning();
}
......@@ -633,11 +652,6 @@ $(function (n) {
if (this.isZoomMode) {
this.zoomCanvas(e, 0.1);
}
if (this.dragAndDrop) {
console.log("dnd mouseUp");
}
};
n.Fabric.prototype.defaultRightClickHandler = function(e) {
......@@ -702,17 +716,43 @@ $(function (n) {
this.delete();
break;
case "rotateRight":
this.rotateRight(90);
this.rotateCanvas(90);
break;
default:
console.error("unrecognized mode");
}
};
n.Fabric.prototype.rotateRight = function(degrees) {
var currentAngle = this.canvas.backgroundImage.angle;
this.canvas.backgroundImage.setAngle(currentAngle + degrees);
this.resizeCanvas();
n.Fabric.prototype.rotateCanvas = function(degrees) {
var newHeight = this.canvas.getWidth();
var newWidth = this.canvas.getHeight();
this.setRotation(this.rotation + degrees);
this.canvas.setHeight(newHeight);
this.canvas.setWidth(newWidth);
this.canvas.backgroundImage.rotate(this.rotation);
this.canvas.resizeCanvas();
};
n.Fabric.prototype.setRotation = function(degrees) {
var mirror = false;
if (degrees < 0) {
degrees = Math.abs(degrees);
mirror = true;
}
while (degrees > 360) {
degrees = degrees - 360;
}
if (mirror) {
degrees = 360 - degrees;
}
if (degrees >= 0 && degrees <= 360) {
this.rotation = degrees;
} else {
console.error("You broke the laws of mathematics!");
}
};
n.Fabric.prototype.delete = function() {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment