geometry.js 11 KB

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