svn commit: r1788132 - /openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js

[so...@apache.org]

Author: solomax
Date: Wed Mar 22 16:19:36 2017
New Revision: 1788132

URL: http://svn.apache.org/viewvc?rev=1788132&view=rev
Log:
[OPENMEETINGS-551] arrow seems to work

Modified:
    openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js

Modified: openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js
URL: http://svn.apache.org/viewvc/openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js?rev=1788132&r1=1788131&r2=1788132&view=diff
==============================================================================
--- openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js (original)
+++ openmeetings/application/trunk/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/wb.js Wed Mar 22 16:19:36 2017
@@ -40,45 +40,6 @@ var UUID = (function() {
 	}
 	return self;
 })();
-// Based on https://groups.google.com/d/msg/fabricjs/TSwLHzLsP_w/-sE8WBDq6QIJ
-fabric.LineArrow = fabric.util.createClass(fabric.Line, {
-	type: 'lineArrow'
-	, initialize: function(element, options) {
-		options || (options = {});
-		this.callSuper('initialize', element, options);
-	}
-	, toObject: function() {
-		return fabric.util.object.extend(this.callSuper('toObject'));
-	}
-	, _render: function(ctx) {
-		this.callSuper('_render', ctx);
-
-		// do not render if width/height are zeros or object is not visible
-		if (this.width === 0 || this.height === 0 || !this.visible) return;
-
-		ctx.save();
-		var xDiff = this.x2 - this.x1;
-		var yDiff = this.y2 - this.y1;
-		var angle = Math.atan2(yDiff, xDiff);
-		ctx.translate((this.x2 - this.x1) / 2, (this.y2 - this.y1) / 2);
-		ctx.rotate(angle);
-		ctx.beginPath();
-		// move 10px in front of line to start the arrow so it does not have the
-		// square line end showing in front (0,0)
-		ctx.moveTo(10, 0);
-		ctx.lineTo(-20, 15);
-		ctx.lineTo(-20, -15);
-		ctx.closePath();
-		this._renderFill(ctx);
-		this._renderStroke(ctx);
-		ctx.restore();
-	}
-});
-fabric.LineArrow.fromObject = function (object, callback) {
-	callback && callback(new fabric.LineArrow([object.x1, object.y1, object.x2, object.y2],object));
-};
-fabric.LineArrow.async = true;
-
 var Pointer = function(canvas, s) {
 	return {
 		activate: function() {
@@ -310,14 +271,53 @@ var Ellipse = function(canvas, s) {
 var Arrow = function(canvas, s) {
 	var arrow = Line(canvas, s);
 	arrow.createShape = function() {
-		arrow.obj = new fabric.LineArrow([arrow.orig.x, arrow.orig.y, arrow.orig.x, arrow.orig.y], {
-			strokeWidth: arrow.stroke.width
-			, fill: arrow.fill.enabled ? arrow.fill.color : 'rgba(0,0,0,0)'
-			, stroke: arrow.stroke.enabled ? arrow.stroke.color : 'rgba(0,0,0,0)'
-			, opacity: arrow.opacity
-		});
+		arrow.obj = new fabric.Polygon([
+			{x: 0, y: 0},
+			{x: 0, y: 0},
+			{x: 0, y: 0},
+			{x: 0, y: 0},
+			{x: 0, y: 0},
+			{x: 0, y: 0},
+			{x: 0, y: 0}]
+			, {
+				left: arrow.orig.x
+				, top: arrow.orig.y
+				, angle: 0
+				, strokeWidth: arrow.stroke.width
+				, fill: arrow.fill.enabled ? arrow.fill.color : 'rgba(0,0,0,0)'
+				, stroke: arrow.stroke.enabled ? arrow.stroke.color : 'rgba(0,0,0,0)'
+			});
+
 		return arrow.obj;
 	};
+	arrow.updateShape = function(pointer) {
+		var dx = pointer.x - arrow.orig.x
+		, dy = pointer.y - arrow.orig.y
+		, d = Math.sqrt(dx * dx + dy * dy)
+		, sw = d > 40 ? 20 : 5
+		, hl = d > 40 ? 30 : 10
+		, h = 1.5 * sw
+		, points = [
+			{x: 0, y: sw},
+			{x: Math.max(0, d - hl), y: sw},
+			{x: Math.max(0, d - hl), y: h},
+			{x: d, y: 3 * sw / 4},
+			{x: Math.max(0, d - hl), y: 0},
+			{x: Math.max(0, d - hl), y: sw / 2},
+			{x: 0, y: sw / 2}];
+		arrow.obj.set({
+			points: points
+			, angle: Math.atan2(dy, dx) * 180 / Math.PI
+			, width: d
+			, height: h
+			, maxX: d
+			, maxY: h
+			, pathOffset: {
+				x: d / 2,
+				y: h / 2
+			}
+		});
+	};
 	arrow.internalActivate = function() {
 		arrow.enableAllProps(s);
 	};
@@ -343,7 +343,6 @@ var Clipart = function(canvas, btn) {
 		if (!art.obj) {
 			return; // not ready
 		}
-		//TODO height == width
 		var dx = pointer.x - art.orig.x, dy = pointer.y - art.orig.y;
 		var d = Math.sqrt(dx * dx + dy * dy);
 		art.obj.set({