Feature/draw

build/Gruntfile.js

@@ -93,6 +93,7 @@ module.exports = function(grunt) {
 		this.word = null;
 		this.cell = null;
 		this.slide = null;
+		this.draw = null;
 
 		this.append(pathConfigs);
 	}
@@ -132,9 +133,10 @@ module.exports = function(grunt) {
 		appendOption.call(this, 'word');
 		appendOption.call(this, 'cell');
 		appendOption.call(this, 'slide');
+		appendOption.call(this, 'draw');
 	};
 	CConfig.prototype.valid = function () {
-		return this.externs && this.word && this.cell && this.slide;
+		return this.externs && this.word && this.cell && this.slide && this.draw;
 	};
 
 	function getExterns(config) {
@@ -176,6 +178,7 @@ module.exports = function(grunt) {
 	const word = path.join(deploy, 'word');
 	const cell = path.join(deploy, 'cell');
 	const slide = path.join(deploy, 'slide');
+	const draw = path.join(deploy, 'draw');
 
 	const level = grunt.option('level') || 'ADVANCED';
 	const formatting = grunt.option('formatting') || '';
@@ -236,6 +239,7 @@ module.exports = function(grunt) {
 	const configWord = configs.word['sdk'];
 	const configCell = configs.cell['sdk'];
 	const configSlide = configs.slide['sdk'];
+	const configDraw = configs.draw['sdk'];
 
 	const compilerArgs = getExterns(configs.externs);
 	if (formatting) {
@@ -301,6 +305,10 @@ module.exports = function(grunt) {
 		grunt.initConfig(getCompileConfig(getFilesMin(configSlide), getFilesAll(configSlide), 'sdk-all-min', 'sdk-all', 'slide', path.join(slide , '/')));
 		grunt.task.run('closure-compiler');
 	});
+	grunt.registerTask('compile-draw', 'Compile Draw SDK', function () {
+		grunt.initConfig(getCompileConfig(getFilesMin(configDraw), getFilesAll(configDraw), 'sdk-all-min', 'sdk-all', 'draw', path.join(draw , '/')));
+		grunt.task.run('closure-compiler');
+	});
 	grunt.registerTask('copy-maps', 'Copy maps from deploy to build', function() {
 		grunt.initConfig({
 			copy: {
@@ -351,6 +359,22 @@ module.exports = function(grunt) {
 							}
 						}
 					]
+				},
+				draw: {
+					files: [
+						{
+							expand: true,
+							cwd: draw,
+							src: [
+								'sdk-all-min.js.map',
+								'sdk-all.js.map',
+							],
+							dest: 'maps',
+							rename: function (dest, src) {
+								return path.join(dest , src.replace('sdk', 'draw'));
+							}
+						}
+					]
 				}
 			},
 			clean: {
@@ -365,13 +389,15 @@ module.exports = function(grunt) {
 						path.join(cell, 'sdk-all.js.map'),
 						path.join(slide, 'sdk-all-min.js.map'),
 						path.join(slide, 'sdk-all.js.map'),
+						path.join(draw, 'sdk-all-min.js.map'),
+						path.join(draw, 'sdk-all.js.map'),
 					]
 				}
 			}
 		});
 		grunt.task.run('copy', 'clean');
 	});
-	grunt.registerTask('compile-sdk', ['compile-word', 'compile-cell', 'compile-slide']);
+	grunt.registerTask('compile-sdk', ['compile-word', 'compile-cell', 'compile-slide', 'compile-draw']);
 	grunt.registerTask('clean-deploy', 'Clean deploy folder before deploying', function () {
 		grunt.initConfig({
 			clean: {
@@ -490,6 +516,7 @@ module.exports = function(grunt) {
 		writeScripts(configs.word['sdk'], 'word');
 		writeScripts(configs.cell['sdk'], 'cell');
 		writeScripts(configs.slide['sdk'], 'slide');
+		writeScripts(configs.draw['sdk'], 'draw');
 	});
 	const defaultTasks = ['clean-deploy', 'compile-sdk', 'copy-other'];
 	if (grunt.option('map')) {

cell/model/DrawingObjects/Format/ShapePrototype.js

@@ -678,6 +678,9 @@ CShape.prototype.recalcText = function()
     this.recalcInfo.recalculateTransformText = true;
 };
 
+/**
+ * @memberof CShape
+ */
 CShape.prototype.recalculate = function ()
 {
     if(this.bDeleted)

common/Drawings/ArcTo.js

@@ -37,8 +37,9 @@
     var HitInBezier4 = AscFormat.HitInBezier4;
 
     // arcTo new version
-    function Arc3(ctx, fX, fY, fWidth, fHeight, fStartAngle, fSweepAngle)
+    function Arc3(ctx, fX, fY, fWidth, fHeight, fStartAngle, fSweepAngle, ellipseRotation)
     {
+        // Params transform
         var sin1 = Math.sin(fStartAngle);
         var cos1 = Math.cos(fStartAngle);
 
@@ -49,11 +50,13 @@
         var cx = fX - l * cos1;
         var cy = fY - l * sin1;
 
-        Arc2(ctx, cx - fWidth, cy - fHeight, 2 * fWidth, 2 * fHeight, fStartAngle, fSweepAngle);
+        // ellipseRotation can be undefined in old version calls and it is passed down anyway
+        Arc2(ctx, cx - fWidth, cy - fHeight, 2 * fWidth, 2 * fHeight, fStartAngle, fSweepAngle, ellipseRotation);
     }
 
-    function Arc2(ctx, fX, fY, fWidth, fHeight, fStartAngle, fSweepAngle)
+    function Arc2(ctx, fX, fY, fWidth, fHeight, fStartAngle, fSweepAngle, ellipseRotation)
     {
+        // Calls Ellipse or EllipseArc
         if (0 >= fWidth || 0 >= fHeight)
             return;
 
@@ -74,6 +77,8 @@
         var bClockDirection = false;
         var fEndAngle = (2 * Math.PI) -(fSweepAngle + fStartAngle);
         var fSrtAngle = (2 * Math.PI) - fStartAngle;
+        // by this moment we have endAngle( = fEndAngle) and startAngle( = fSrtAngle) clockwise
+
         if( fSweepAngle > 0 )
             bClockDirection = true;
 
@@ -83,12 +88,14 @@
         }
         else
         {
-            EllipseArc(ctx, fX + fWidth / 2, fY + fHeight / 2, fWidth / 2, fHeight / 2, fSrtAngle, fEndAngle, bClockDirection);
+            EllipseArc(ctx, fX + fWidth / 2, fY + fHeight / 2, fWidth / 2, fHeight / 2, fSrtAngle, fEndAngle, bClockDirection, ellipseRotation);
         }
     }
 
     function AngToEllPrm(fAngle, fXRad, fYRad)
     {
+        // to ellipse parametric equation angle parameter - t
+        // https://www.mathopenref.com/coordparamellipse.html
         return Math.atan2( Math.sin( fAngle ) / fYRad,  Math.cos( fAngle ) / fXRad );
     }
 
@@ -103,8 +110,9 @@
         ctx._c(fX - fXRad * c_fKappa, fY - fYRad, fX - fXRad, fY - fYRad * c_fKappa, fX - fXRad, fY);
     }
 
-    function EllipseArc(ctx, fX, fY, fXRad, fYRad, fAngle1, fAngle2, bClockDirection)
+    function EllipseArc(ctx, fX, fY, fXRad, fYRad, fAngle1, fAngle2, bClockDirection, ellipseRotation)
     {
+        // If arc comes through 0 angle - splits one to two EllipseArc2 calls
         while ( fAngle1 < 0 )
             fAngle1 += (2 * Math.PI);
 
@@ -117,35 +125,45 @@
         while ( fAngle2 >= (2 * Math.PI) )
             fAngle2 -= (2 * Math.PI);
 
+        // fX = cx, fY = cy, fAngle1 = startAngle, fAngle2 = endAngle
+        // rotatePoint added later for ellipse rotation. it is arc start point.
+        // it is not used if ellipseRotation not used
+        let rotatePoint = {x : fX + fXRad * Math.cos( AngToEllPrm( fAngle1, fXRad, fYRad ) ),
+            y : fY + fYRad * Math.sin( AngToEllPrm( fAngle1, fXRad, fYRad ) )};
+        // let rotatePoint = {x : fX - fXRad, y : fY};
         if ( !bClockDirection )
         {
             if ( fAngle1 <= fAngle2 )
-                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, fAngle2, false);
+                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, fAngle2, false, ellipseRotation, rotatePoint);
             else
             {
-                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, 2 * Math.PI, false);
-                EllipseArc2(ctx, fX, fY, fXRad, fYRad, 0, fAngle2, false);
+                // if arc comes through 0 angle - split it
+                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, 2 * Math.PI, false, ellipseRotation, rotatePoint);
+                EllipseArc2(ctx, fX, fY, fXRad, fYRad, 0, fAngle2, false, ellipseRotation, rotatePoint);
             }
         }
         else
         {
             if ( fAngle1 >= fAngle2 )
-                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, fAngle2, true);
+                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, fAngle2, true, ellipseRotation, rotatePoint);
             else
             {
-                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, 0, true);
-                EllipseArc2(ctx, fX, fY, fXRad, fYRad, 2 * Math.PI, fAngle2, true);
+                // if arc comes through 0 angle - split it
+                EllipseArc2(ctx, fX, fY, fXRad, fYRad, fAngle1, 0, true, ellipseRotation, rotatePoint);
+                EllipseArc2(ctx, fX, fY, fXRad, fYRad, 2 * Math.PI, fAngle2, true, ellipseRotation, rotatePoint);
             }
         }
     }
 
-    function EllipseArc2(ctx, fX, fY, fXRad, fYRad, dAngle1, dAngle2, bClockDirection)
+    function EllipseArc2(ctx, fX, fY, fXRad, fYRad, dAngle1, dAngle2, bClockDirection, ellipseRotation, rotatePoint)
     {
+        // Splits calls to EllipseArc3 on each quadrant
         var nFirstPointQuard  = ((2 * dAngle1 / Math.PI) >> 0) + 1;
         var nSecondPointQuard = ((2 * dAngle2 / Math.PI) >> 0) + 1;
         nSecondPointQuard = Math.min( 4, Math.max( 1, nSecondPointQuard ) );
         nFirstPointQuard  = Math.min( 4, Math.max( 1, nFirstPointQuard ) );
 
+        // fX = cx, fY = cy, fAngle1 = startAngle, fAngle2 = endAngle
         var fStartX = fX + fXRad * Math.cos( AngToEllPrm( dAngle1, fXRad, fYRad ) );
         var fStartY = fY + fYRad * Math.sin( AngToEllPrm( dAngle1, fXRad, fYRad ) );
 
@@ -167,7 +185,7 @@
                 if ( !( nIndex == nFirstPointQuard ) )
                     dStartAngle = (nIndex - 1 ) * Math.PI / 2;
 
-                EndPoint = EllipseArc3(ctx, fX, fY, fXRad, fYRad, AngToEllPrm( dStartAngle, fXRad, fYRad ), AngToEllPrm( dEndAngle, fXRad, fYRad ), false);
+                EndPoint = EllipseArc3(ctx, fX, fY, fXRad, fYRad, AngToEllPrm( dStartAngle, fXRad, fYRad ), AngToEllPrm( dEndAngle, fXRad, fYRad ), false, ellipseRotation, rotatePoint);
             }
         }
         else
@@ -183,32 +201,81 @@
                 else
                     dEndAngle = dAngle2;
 
-                EndPoint = EllipseArc3(ctx, fX, fY, fXRad, fYRad, AngToEllPrm( dStartAngle, fXRad, fYRad ), AngToEllPrm( dEndAngle, fXRad, fYRad ), false);
+                EndPoint = EllipseArc3(ctx, fX, fY, fXRad, fYRad, AngToEllPrm( dStartAngle, fXRad, fYRad ), AngToEllPrm( dEndAngle, fXRad, fYRad ), false, ellipseRotation, rotatePoint);
             }
         }
     }
 
-    function EllipseArc3(ctx, fX, fY, fXRad, fYRad, dAngle1, dAngle2, bClockDirection)
+    function EllipseArc3(ctx, fX, fY, fXRad, fYRad, dAngle1, dAngle2, bClockDirection, ellipseRotation, rotatePoint)
     {
+        // fX = cx, fY = cy, fAngle1 = startAngle after AngToEllPrm, fAngle2 = endAngle after AngToEllPrm
+
         var fAlpha = Math.sin( dAngle2 - dAngle1 ) * ( Math.sqrt( 4.0 + 3.0 * Math.tan( (dAngle2 - dAngle1) / 2.0 ) * Math.tan( (dAngle2 - dAngle1) / 2.0 ) ) - 1.0 ) / 3.0;
 
         var sin1 = Math.sin(dAngle1);
         var cos1 = Math.cos(dAngle1);
         var sin2 = Math.sin(dAngle2);
         var cos2 = Math.cos(dAngle2);
 
+        // calculate start point
         var fX1 = fX + fXRad * cos1;
         var fY1 = fY + fYRad * sin1;
 
+        // calculate end point
         var fX2 = fX + fXRad * cos2;
         var fY2 = fY + fYRad * sin2;
 
+        // bezier control point 1
         var fCX1 = fX1 - fAlpha * fXRad * sin1;
         var fCY1 = fY1 + fAlpha * fYRad * cos1;
 
+        // bezier control point 2
         var fCX2 = fX2 + fAlpha * fXRad * sin2;
         var fCY2 = fY2 - fAlpha * fYRad * cos2;
 
+        if (ellipseRotation !== undefined) {
+            // https://www.figma.com/file/hs43oiAUyuoqFULVoJ5lyZ/EllipticArcConvert?type=design&node-id=265-2&mode=design&t=pla9h2OkZAde8Xim-0
+            // ellipseRotation = 0;
+            // TODO import
+            /**
+             * afin rotate clockwise
+             * @param {number} x
+             * @param {number} y
+             * @param {number} radiansRotateAngle radians Rotate AntiClockWise Angle. E.g. 30 degrees rotates does DOWN.
+             * @returns {{x: number, y: number}} point
+             */
+            function rotatePointAroundCordsStartClockWise(x, y, radiansRotateAngle) {
+                let newX = x * Math.cos(radiansRotateAngle) + y * Math.sin(radiansRotateAngle);
+                let newY = x * (-1) * Math.sin(radiansRotateAngle) + y * Math.cos(radiansRotateAngle);
+                return {x : newX, y: newY};
+            }
+
+            let startPointRelative = {x : fX1 - rotatePoint.x, y : rotatePoint.y - fY1};
+            let endPointRelative = {x : fX2 - rotatePoint.x, y : rotatePoint.y - fY2};
+            let controlPoint1Relative = {x : fCX1 - rotatePoint.x, y : rotatePoint.y - fCY1};
+            let controlPoint2Relative = {x : fCX2 - rotatePoint.x, y : rotatePoint.y - fCY2};
+
+            let startPointRelativeRotated = rotatePointAroundCordsStartClockWise(startPointRelative.x, startPointRelative.y, ellipseRotation);
+            let endPointRelativeRotated = rotatePointAroundCordsStartClockWise(endPointRelative.x, endPointRelative.y, ellipseRotation);
+            let controlPoint1RelativeRotated = rotatePointAroundCordsStartClockWise(controlPoint1Relative.x, controlPoint1Relative.y, ellipseRotation);
+            let controlPoint2RelativeRotated = rotatePointAroundCordsStartClockWise(controlPoint2Relative.x, controlPoint2Relative.y, ellipseRotation);
+
+            // go to initial cord system
+            let startPointRotated = {x : startPointRelativeRotated.x + rotatePoint.x, y : rotatePoint.y - startPointRelativeRotated.y};
+            let endPointRotated = {x : endPointRelativeRotated.x + rotatePoint.x, y : rotatePoint.y - endPointRelativeRotated.y};
+            let controlPoint1Rotated = {x : controlPoint1RelativeRotated.x + rotatePoint.x, y : rotatePoint.y - controlPoint1RelativeRotated.y};
+            let controlPoint2Rotated = {x : controlPoint2RelativeRotated.x + rotatePoint.x, y : rotatePoint.y - controlPoint2RelativeRotated.y};
+
+            fX1 = startPointRotated.x;
+            fY1 = startPointRotated.y;
+            fX2 = endPointRotated.x;
+            fY2 = endPointRotated.y;
+            fCX1 = controlPoint1Rotated.x;
+            fCY1 = controlPoint1Rotated.y;
+            fCX2 = controlPoint2Rotated.x;
+            fCY2 = controlPoint2Rotated.y;
+        }
+
         if ( !bClockDirection )
         {
             ctx._c(fCX1, fCY1, fCX2, fCY2, fX2, fY2);

common/Drawings/CommonController.js

@@ -9744,7 +9744,17 @@
 			this.Bounds.CheckPoint(_x1, _y1);
 			this.Bounds.CheckPoint(_x2, _y2);
 		};
-
+		/**
+		 * @param {{x: Number, y: Number, z? :Number}[]} points
+		 */
+		CSlideBoundsChecker.prototype.checkPoints = function (points) {
+			let thisContext = this;
+			points.forEach(function(point) {
+				let x = thisContext.m_oFullTransform.TransformPointX(point.x, point.y);
+				let y = thisContext.m_oFullTransform.TransformPointX(point.x, point.y);
+				thisContext.Bounds.CheckPoint(x, y);
+			})
+		};
 		// images
 		CSlideBoundsChecker.prototype.drawImage2 = function(img, x, y, w, h) {
 			var _x1 = this.m_oFullTransform.TransformPointX(x, y);

common/Drawings/Format/ChartSpace.js

@@ -10418,6 +10418,14 @@ function(window, undefined) {
 		ret.setFill(new AscFormat.CNoFill());
 		return ret;
 	}
+	function CreatePatternFillUniFill(ftype, BgColorUnicolor, FgColorUnicolor) {
+		var oUniFill = new AscFormat.CUniFill();
+		oUniFill.fill = new AscFormat.CPattFill();
+		oUniFill.fill.ftype = ftype;
+		oUniFill.fill.fgClr = FgColorUnicolor;
+		oUniFill.fill.bgClr = BgColorUnicolor;
+		return oUniFill;
+	}
 
 
 	function CreateView3d(nRotX, nRotY, bRAngAx, nDepthPercent) {
@@ -11978,6 +11986,7 @@ function(window, undefined) {
 	window['AscFormat'].CreateUnifillSolidFillSchemeColor = CreateUnifillSolidFillSchemeColor;
 	window['AscFormat'].CreateNoFillLine = CreateNoFillLine;
 	window['AscFormat'].CreateNoFillUniFill = CreateNoFillUniFill;
+	window['AscFormat'].CreatePatternFillUniFill = CreatePatternFillUniFill;
 	window['AscFormat'].CreateView3d = CreateView3d;
 	window['AscFormat'].CreateLineChart = CreateLineChart;
 	window['AscFormat'].CreateBarChart = CreateBarChart;