geometry.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301
  1. // ******* Region MANAGER ******** //
  2. $axure.internal(function($ax) {
  3. var _geometry = $ax.geometry = {};
  4. var regionMap = {};
  5. var regionList = [];
  6. var _unregister = function(label) {
  7. var regionIndex = regionList.indexOf(label);
  8. if(regionIndex != -1) {
  9. var end = $ax.splice(regionList, regionIndex + 1);
  10. $ax.splice(regionList, regionIndex, regionList.length - regionIndex);
  11. regionList = regionList.concat(end);
  12. }
  13. delete regionMap[label];
  14. };
  15. _geometry.unregister = _unregister;
  16. var clear = function() {
  17. regionMap = {};
  18. regionList = [];
  19. };
  20. var _polygonRegistered = function(label) {
  21. return Boolean(regionMap[label]);
  22. };
  23. _geometry.polygonRegistered = _polygonRegistered;
  24. // Must be counterclockwise, or enter/exit will be wrong
  25. var _registerPolygon = function(label, points, callback, info) {
  26. var regionIndex = regionList.indexOf(label);
  27. if(regionIndex == -1) regionList.push(label);
  28. regionMap[label] = { points: points, callback: callback, info: info };
  29. };
  30. _geometry.registerPolygon = _registerPolygon;
  31. var _getPolygonInfo = function(label) {
  32. if(!_polygonRegistered(label)) return undefined;
  33. return regionMap[label].info;
  34. };
  35. _geometry.getPolygonInfo = _getPolygonInfo;
  36. var _genRect = function(info, roundHalfPixel) {
  37. var x = info.pagex;
  38. var y = info.pagey;
  39. var w = info.width;
  40. var h = info.height;
  41. if(roundHalfPixel) {
  42. if(x % 1 != 0) {
  43. x = Math.floor(x);
  44. w++;
  45. }
  46. if(y % 1 != 0) {
  47. y = Math.floor(y);
  48. h++;
  49. }
  50. }
  51. var r = x + w;
  52. var b = y + h;
  53. var rect = {
  54. X: function() { return x; },
  55. Y: function() { return y; },
  56. Wigth: function() { return w; },
  57. Height: function() { return h; },
  58. Left: function() { return x; },
  59. Right: function() { return r; },
  60. Top: function() { return y; },
  61. Bottom: function() { return b; }
  62. };
  63. return rect;
  64. };
  65. _geometry.genRect = _genRect;
  66. var _genPoint = function(x, y) {
  67. return { x: x, y: y };
  68. };
  69. _geometry.genPoint = _genPoint;
  70. var oldPoint = _genPoint(0, 0);
  71. _geometry.tick = function(x, y, end) {
  72. var lastPoint = oldPoint;
  73. var nextPoint = oldPoint = _genPoint(x, y);
  74. var line = { p1: lastPoint, p2: nextPoint };
  75. if(!regionList.length) return;
  76. for(var i = 0; i < regionList.length; i++) {
  77. var region = regionMap[regionList[i]];
  78. var points = region.points;
  79. if(!region.checked) {
  80. if(!_checkInside(points, $ax.mouseLocation)) {
  81. region.callback({ outside: true });
  82. continue;
  83. }
  84. region.checked = true;
  85. }
  86. for(var j = 0; j < points.length; j++) {
  87. var startSegment = points[j];
  88. var endSegment = points[(j + 1) % points.length];
  89. var intersectInfo = linesIntersect(line, { p1: startSegment, p2: endSegment });
  90. if(intersectInfo) {
  91. region.callback(intersectInfo);
  92. break;
  93. }
  94. }
  95. }
  96. if(end) clear();
  97. };
  98. // Info if the one line touches the other (even barely), false otherwise
  99. // Info includes point, if l1 is entering or exiting l2, and any ties that happened, or parallel info
  100. var linesIntersect = function(l1, l2) {
  101. var retval = {};
  102. var ties = {};
  103. var l1p1 = l1.p1.x < l1.p2.x || (l1.p1.x == l1.p2.x && l1.p1.y < l1.p2.y) ? l1.p1 : l1.p2;
  104. var l1p2 = l1.p1.x < l1.p2.x || (l1.p1.x == l1.p2.x && l1.p1.y < l1.p2.y) ? l1.p2 : l1.p1;
  105. var m1 = (l1p2.y - l1p1.y) / (l1p2.x - l1p1.x);
  106. var l2p1 = l2.p1.x < l2.p2.x || (l2.p1.x == l2.p2.x && l2.p1.y < l2.p2.y) ? l2.p1 : l2.p2;
  107. var l2p2 = l2.p1.x < l2.p2.x || (l2.p1.x == l2.p2.x && l2.p1.y < l2.p2.y) ? l2.p2 : l2.p1;
  108. var m2 = (l2p2.y - l2p1.y) / (l2p2.x - l2p1.x);
  109. var l1Vert = l1.p1.x == l1.p2.x;
  110. var l2Vert = l2.p1.x == l2.p2.x;
  111. if(l1Vert || l2Vert) {
  112. if(l1Vert && l2Vert) {
  113. // If the lines don't follow the same path, return
  114. if(l1p1.x != l2p1.x) return false;
  115. // if they never meet, return
  116. if(l1p2.y < l2p1.y || l1p1.y > l2p2.y) return false;
  117. var firstVert = l1p1.y >= l2p1.y ? l1p1 : l2p1;
  118. var secondVert = l1p2.y <= l2p2.y ? l1p2 : l2p2;
  119. // First is from the perspective of l1
  120. retval.parallel = {
  121. first: l1p1 == l1.p1 ? firstVert : secondVert,
  122. second: l1p2 == l1.p2 ? secondVert : firstVert,
  123. sameDirection: (l1p1 == l1.p1) == (l2p1 == l2.p1)
  124. };
  125. return retval;
  126. }
  127. var x1 = l2Vert ? l1p1.x : l2p1.x;
  128. var x2 = l2Vert ? l1p2.x : l2p2.x;
  129. var xVert = l2Vert ? l2p1.x : l1p1.x;
  130. var y = l2Vert ? l1p1.y + (xVert - x1) * m1 : l2p1.y + (xVert - x1) * m2;
  131. var y1 = l2Vert ? l2p1.y : l1p1.y;
  132. var y2 = l2Vert ? l2p2.y : l1p2.y;
  133. if(xVert >= x1 && xVert <= x2 && y >= y1 && y <= y2) {
  134. retval.point = { x: xVert, y: y };
  135. retval.exiting = l2Vert == (y1 == (l2Vert ? l2.p1.y : l1.p1.y)) == (x1 == (l2Vert ? l1.p1.x : l2.p1.x));
  136. retval.entering = !retval.exiting;
  137. // Calculate ties
  138. if(x1 == xVert) {
  139. ties[l2Vert ? 'l1' : 'l2'] = (x1 == (l2Vert ? l1.p1.x : l2.p1.x)) ? 'start' : 'end';
  140. retval.ties = ties;
  141. } else if(x2 == xVert) {
  142. ties[l2Vert ? 'l1' : 'l2'] = (x2 == (l2Vert ? l1.p2.x : l2.p2.x)) ? 'end' : 'start';
  143. retval.ties = ties;
  144. }
  145. if(y1 == y) {
  146. ties[l2Vert ? 'l2' : 'l1'] = (y1 == (l2Vert ? l2.p1.y : l1.p1.y)) ? 'start' : 'end';
  147. retval.ties = ties;
  148. } else if(y2 == y) {
  149. ties[l2Vert ? 'l2' : 'l1'] = (y2 == (l2Vert ? l2.p2.y : l1.p2.y)) ? 'end' : 'start';
  150. retval.ties = ties;
  151. }
  152. return retval;
  153. }
  154. return false;
  155. }
  156. // If here, no vertical lines
  157. if(m1 == m2) {
  158. // If the lines don't follow the same path, return
  159. if(l1p1.y != (l2p1.y + (l1p1.x - l2p1.x) * m1)) return false;
  160. // if they never meet, return
  161. if(l1p2.x < l2p1.x || l1p1.x > l2p2.x) return false;
  162. var first = l1p1.x >= l2p1.x ? l1p1 : l2p1;
  163. var second = l1p2.x <= l2p2.x ? l1p2 : l2p2;
  164. // First is from the perspective of l1
  165. retval.parallel = {
  166. first: l1p1 == l1.p1 ? first : second,
  167. second: l1p2 == l1.p2 ? second : first,
  168. sameDirection: (l1p1 == l1.p1) == (l2p1 == l2.p1)
  169. };
  170. return retval;
  171. }
  172. var x = (l2p1.y - l2p1.x * m2 - l1p1.y + l1p1.x * m1) / (m1 - m2);
  173. // Check if x is out of bounds
  174. if(x >= l1p1.x && x <= l1p2.x && x >= l2p1.x && x <= l2p2.x) {
  175. var y = l1p1.y + (x - l1p1.x) * m1;
  176. retval.point = { x: x, y: y };
  177. retval.entering = m1 > m2 == (l1p1 == l1.p1) == (l2p1 == l2.p1);
  178. retval.exiting = !retval.entering;
  179. // Calculate ties
  180. if(l1.p1.x == x) {
  181. ties.l1 = 'start';
  182. retval.ties = ties;
  183. } else if(l1.p2.x == x) {
  184. ties.l1 = 'end';
  185. retval.ties = ties;
  186. }
  187. if(l2.p1.x == x) {
  188. ties.l2 = 'start';
  189. retval.ties = ties;
  190. } else if(l2.p2.x == x) {
  191. ties.l2 = 'end';
  192. retval.ties = ties;
  193. }
  194. return retval;
  195. }
  196. return false;
  197. };
  198. var _checkInsideRegion = function(label, point) {
  199. if(!_polygonRegistered(label)) return false;
  200. return _checkInside(regionMap[label].points, point || $ax.mouseLocation);
  201. };
  202. _geometry.checkInsideRegion = _checkInsideRegion;
  203. // Returns true if point is inside the polygon, including ties
  204. var _checkInside = function(polygon, point) {
  205. // Make horizontal line wider than the polygon, with the y of point to test location
  206. var firstX = polygon[0].x;
  207. var secondX = firstX;
  208. var i;
  209. for(i = 1; i < polygon.length; i++) {
  210. var polyX = polygon[i].x;
  211. firstX = Math.min(firstX, polyX);
  212. secondX = Math.max(secondX, polyX);
  213. }
  214. var line = {
  215. p1: _genPoint(--firstX, point.y),
  216. p2: _genPoint(++secondX, point.y)
  217. };
  218. // If entered true, with closest intersection says you are inside the polygon.
  219. var entered = false;
  220. // Closest is the closest intersection to the left of the point
  221. var closest = line.p1.x;
  222. // This is for if intersections hit the same point, to find out which is correct
  223. var cos = -2;
  224. var getCos = function(line) {
  225. var x = line.p2.x - line.p1.x;
  226. var y = line.p2.y - line.p1.y;
  227. return x / Math.sqrt(x * x + y * y);
  228. };
  229. for(i = 0; i < polygon.length; i++) {
  230. var polyLine = { p1: polygon[i], p2: polygon[(i + 1) % polygon.length] };
  231. var intersectInfo = linesIntersect(line, polyLine);
  232. if(!intersectInfo) continue;
  233. if(intersectInfo.parallel) {
  234. // Only really care about this if it actually touches the point
  235. if(intersectInfo.parallel.first.x <= point.x && intersectInfo.parallel.second.x >= point.x) return true;
  236. continue;
  237. }
  238. var intersectionX = intersectInfo.point.x;
  239. if(intersectionX > point.x || intersectionX < closest) continue;
  240. if(intersectionX == point.x) return true;
  241. // If closer than last time, reset cosine.
  242. if(intersectionX != closest) cos = -2;
  243. // For getting cosine, need to possibly reverse the direction of polyLine.
  244. if(intersectInfo.ties) {
  245. // Tie must be on l2, if the ties is end, reverse so cosine indicates how close the angle is to that of 'point' from here.
  246. if(intersectInfo.ties.l2 == 'end') polyLine = { p1: polyLine.p2, p2: polyLine.p1 };
  247. } else {
  248. // It is on both side, so you can take the larger one
  249. if(polyLine.p1.x > polyLine.p2.x) polyLine = { p1: polyLine.p2, p2: polyLine.p1 };
  250. }
  251. var currCos = getCos(polyLine);
  252. if(currCos > cos) {
  253. cos = currCos;
  254. closest = intersectionX;
  255. entered = intersectInfo.entering;
  256. }
  257. }
  258. return entered;
  259. };
  260. _geometry.checkInside = _checkInside;
  261. });