ie.js.orig 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324
  1. 
  2. // ******* Internet Explorer MANAGER ******** //
  3. //this is to handle all the stupid IE Stuff
  4. $axure.internal(function($ax) {
  5. if(!$.browser.msie) return;
  6. var _ieColorManager = {};
  7. if(Number($.browser.version) < 9) $ax.ieColorManager = _ieColorManager;
  8. var _applyIEFixedPosition = function() {
  9. if(Number($.browser.version) >= 7) return;
  10. $axure(function(diagramObject) { return diagramObject.fixedVertical; }).$()
  11. .appendTo($('body'))
  12. .css('position', 'absolute').css('margin-left', 0 + 'px').css('margin-top', 0 + 'px');
  13. var handleScroll = function() {
  14. $axure(function(diagramObject) { return diagramObject.fixedVertical; })
  15. .each(function(diagramObject, elementId) {
  16. var win = $(window);
  17. var windowWidth = win.width();
  18. var windowHeight = win.height();
  19. var windowScrollLeft = win.scrollLeft();
  20. var windowScrollTop = win.scrollTop();
  21. var newLeft = 0;
  22. var newTop = 0;
  23. var elementQuery = $('#' + elementId);
  24. var width = elementQuery.width();
  25. var height = elementQuery.height();
  26. var horz = diagramObject.fixedHorizontal;
  27. if(horz == 'left') {
  28. newLeft = windowScrollLeft + diagramObject.fixedMarginHorizontal;
  29. } else if(horz == 'center') {
  30. newLeft = windowScrollLeft + ((windowWidth - width) / 2) + diagramObject.fixedMarginHorizontal;
  31. } else if(horz == 'right') {
  32. newLeft = windowScrollLeft + windowWidth - width - diagramObject.fixedMarginHorizontal;
  33. }
  34. var vert = diagramObject.fixedVertical;
  35. if(vert == 'top') {
  36. newTop = windowScrollTop + diagramObject.fixedMarginVertical;
  37. } else if(vert == 'middle') {
  38. newTop = windowScrollTop + ((windowHeight - height) / 2) + diagramObject.fixedMarginVertical;
  39. } else if(vert == 'bottom') {
  40. newTop = windowScrollTop + windowHeight - height - diagramObject.fixedMarginVertical;
  41. }
  42. elementQuery.css('top', newTop + 'px').css('left', newLeft + 'px');
  43. });
  44. };
  45. $(window).scroll(handleScroll);
  46. $axure.resize(handleScroll);
  47. handleScroll();
  48. };
  49. var _applyBackground = function() {
  50. if(Number($.browser.version) >= 9) return;
  51. var styleChain = $ax.adaptive.getAdaptiveIdChain($ax.adaptive.currentViewId);
  52. var argb = _getArgb($ax.pageData.page, styleChain);
  53. var hexColor = _getHexColor(argb, false);
  54. if(hexColor) $('body').css('background-color', hexColor);
  55. _applyBackgroundToQuery($ax('*'));
  56. };
  57. var _applyBackgroundToQuery = function(query) {
  58. if(Number($.browser.version) >= 9) return;
  59. var styleChain = $ax.adaptive.getAdaptiveIdChain($ax.adaptive.currentViewId);
  60. query.each(function(obj, elementId) {
  61. if(obj.type == 'dynamicPanel') {
  62. var stateCount = obj.diagrams.length;
  63. for(var j = 0; j < stateCount; j++) {
  64. var stateId = $ax.repeater.applySuffixToElementId(elementId, '_state' + j);
  65. var argb = _getArgb(obj.diagrams[j], styleChain);
  66. var hexColor = _getHexColor(argb, true);
  67. if(hexColor) $jobj(stateId).css('background-color', hexColor);
  68. }
  69. } else if(obj.type == 'repeater') {
  70. }
  71. });
  72. };
  73. _ieColorManager.applyBackground = _applyBackgroundToQuery;
  74. var _getArgb = function(diagram, styleChain) {
  75. var argb = undefined;
  76. for(var i = 0; i < styleChain.length && !argb; i++) {
  77. var style = diagram.adaptiveStyles[styleChain[i]];
  78. argb = style.fill && style.fill.color;
  79. }
  80. if(!argb) argb = diagram.style.fill.color;
  81. return argb;
  82. };
  83. var gMult = 256;
  84. var rMult = gMult * 256;
  85. var aMult = rMult * 256;
  86. var _getHexColor = function(argb, allowWhite) {
  87. var a = Math.floor(argb / aMult);
  88. argb -= a * aMult;
  89. var r = Math.floor(argb / rMult);
  90. argb -= r * rMult;
  91. var g = Math.floor(argb / gMult);
  92. var b = argb - g * gMult;
  93. return _getColorFromArgb(a, r, g, b, allowWhite);
  94. };
  95. var _getColorFromArgb = function(a, r, g, b, allowWhite) {
  96. if(Number($.browser.version) >= 9) return undefined;
  97. //convert the color with alpha to a color with no alpha (assuming white background)
  98. r = Math.min((r * a) / 255 + 255 - a, 255);
  99. g = Math.min((g * a) / 255 + 255 - a, 255);
  100. b = Math.min((b * a) / 255 + 255 - a, 255);
  101. if(a == 0) return undefined;
  102. if(!allowWhite && (r == 255 && g == 255 && b == 255)) return undefined;
  103. var color = '#';
  104. color += Math.floor(r / 16).toString(16);
  105. color += Math.floor(r % 16).toString(16);
  106. color += Math.floor(g / 16).toString(16);
  107. color += Math.floor(g % 16).toString(16);
  108. color += Math.floor(b / 16).toString(16);
  109. color += Math.floor(b % 16).toString(16);
  110. return color;
  111. };
  112. _ieColorManager.getColorFromArgb = _getColorFromArgb;
  113. var getIEOffset = function(transform, rect) {
  114. var translatedVertexes = [
  115. $axure.utils.Vector2D(0, 0), //we dont translate, so the orgin is fixed
  116. transform.mul($axure.utils.Vector2D(0, rect.height)),
  117. transform.mul($axure.utils.Vector2D(rect.width, 0)),
  118. transform.mul($axure.utils.Vector2D(rect.width, rect.height))];
  119. var minX = 0, minY = 0, maxX = 0, maxY = 0;
  120. $.each(translatedVertexes, function(index, p) {
  121. minX = Math.min(minX, p.x);
  122. minY = Math.min(minY, p.y);
  123. maxX = Math.max(maxX, p.x);
  124. maxY = Math.max(maxY, p.y);
  125. });
  126. return $axure.utils.Vector2D(
  127. (maxX - minX - rect.width) / 2,
  128. (maxY - minY - rect.height) / 2);
  129. };
  130. var _filterFromTransform = function(transform) {
  131. return "progid:DXImageTransform.Microsoft.Matrix(M11=" + transform.m11 +
  132. ", M12=" + transform.m12 + ", M21=" + transform.m21 +
  133. ", M22=" + transform.m22 + ", SizingMethod='auto expand')";
  134. };
  135. var _applyIERotation = function() {
  136. if(Number($.browser.version) >= 9) return;
  137. $axure(function(diagramObject) {
  138. return ((diagramObject.style.rotation && Math.abs(diagramObject.style.rotation) > 0.1)
  139. || (diagramObject.style.textRotation && Math.abs(diagramObject.style.textRotation) > 0.1))
  140. && !diagramObject.isContained;
  141. }).each(function(diagramObject, elementId) {
  142. var rotation = diagramObject.style.rotation || 0;
  143. var $element = $('#' + elementId);
  144. var width = $element.width();
  145. var height = $element.height();
  146. var originX = width / 2;
  147. var originY = height / 2;
  148. var shapeIeOffset;
  149. $element.children().each(function() {
  150. var $child = $(this);
  151. var childWidth = $child.width();
  152. var childHeight = $child.height() + $child.position().top;
  153. var centerX = $child.position().left + (childWidth / 2);
  154. var centerY = $child.position().top + (childHeight / 2);
  155. var deltaX = centerX - originX;
  156. var deltaY = centerY - originY;
  157. var effectiveRotation = rotation;
  158. var textObject = $ax.getObjectFromElementId($child.attr('id'));
  159. if(textObject) {
  160. if(textObject.style.textRotation) effectiveRotation = textObject.style.textRotation;
  161. else return;
  162. }
  163. var transform = $ax.utils.Matrix2D.identity().rotate(effectiveRotation);
  164. var filter = _filterFromTransform(transform);
  165. $child.css('filter', filter)
  166. .width(childWidth + 1)
  167. .height(childHeight + 1);
  168. var p = transform.mul($ax.utils.Vector2D(deltaX, deltaY));
  169. var ieOffset = getIEOffset(transform, { width: childWidth, height: childHeight });
  170. if(!textObject) {
  171. shapeIeOffset = ieOffset;
  172. } else {
  173. // This is a close approximation, but not exact
  174. if(diagramObject.style.verticalAlignment != 'top') ieOffset.y -= shapeIeOffset.y + Math.abs(shapeIeOffset.x);
  175. }
  176. $child.css("margin-left", -ieOffset.x - deltaX + p.x).css("margin-top", -ieOffset.y - deltaY + p.y);
  177. });
  178. });
  179. };
  180. var _fixIEStretchBackground = function() {
  181. if(Number($.browser.version) >= 9) return;
  182. var pageStyle = $ax.adaptive.getPageStyle();
  183. if(!pageStyle.imageRepeat || pageStyle.imageRepeat == 'auto') return;
  184. $('body').css('background-image', 'none');
  185. var viewId = $ax.adaptive.currentViewId;
  186. var imageInfo = viewId ? $ax.pageData.viewIdToBackgroundImageInfo && $ax.pageData.viewIdToBackgroundImageInfo[viewId] : $ax.pageData.defaultBackgroundImageInfo;
  187. if(imageInfo && imageInfo.path) {
  188. if($('#bg_img').length == 0) $('body').append('<img id="bg_img"/>');
  189. $('#bg_img').attr('src', imageInfo.path).css('position', 'fixed').css('z-index', '-10000');
  190. _resizeIEBackground();
  191. } else $('#bg_img').remove();
  192. };
  193. var _resizeIEBackground = function() {
  194. if(Number($.browser.version) >= 9) return;
  195. //var page = $ax.pageData.page;
  196. var viewId = $ax.adaptive.currentViewId;
  197. var pageStyle = $ax.adaptive.getPageStyle();
  198. if(!$ax.pageData.defaultBackgroundImageInfo && !$ax.pageData.viewIdToBackgroundImageInfo) return;
  199. var imageInfo = viewId ? $ax.pageData.viewIdToBackgroundImageInfo[viewId] : $ax.pageData.defaultBackgroundImageInfo;
  200. if(!imageInfo) return;
  201. var imageWidth = imageInfo.width;
  202. var imageHeight = imageInfo.height;
  203. var windowWidth = $(window).width();
  204. var windowHeight = $(window).height();
  205. var isCover = pageStyle.imageRepeat == 'cover';
  206. var wRatio = windowWidth / imageWidth;
  207. var hRatio = windowHeight / imageHeight;
  208. var ratio = wRatio;
  209. if(isCover) {
  210. if(hRatio > wRatio) ratio = hRatio;
  211. } else {
  212. if(hRatio < wRatio) ratio = hRatio;
  213. }
  214. var width = imageWidth * ratio;
  215. var height = imageHeight * ratio;
  216. var left = '0px';
  217. if((isCover && width > windowWidth) || (!isCover && width < windowWidth)) {
  218. if(pageStyle.imageHorizontalAlignment == 'center') {
  219. left = ((windowWidth - width) / 2) + 'px';
  220. } else if(pageStyle.imageHorizontalAlignment == 'far') {
  221. left = (windowWidth - width) + 'px';
  222. }
  223. }
  224. var top = '0px';
  225. if((isCover && height > windowHeight) || (!isCover && height < windowHeight)) {
  226. if(pageStyle.imageVerticalAlignment == 'center') {
  227. top = ((windowHeight - height) / 2) + 'px';
  228. } else if(pageStyle.imageVerticalAlignment == 'far') {
  229. top = (windowHeight - height) + 'px';
  230. }
  231. }
  232. $('#bg_img').css('top', top).css('left', left).css('width', width).css('height', height);
  233. };
  234. var _fixAllPngs = function() {
  235. if(!(/MSIE ((5\.5)|6)/.test(window.navigator.userAgent) && window.navigator.platform == "Win32")) return;
  236. $('img[src$=".png"]').each(function() {
  237. if(!this.complete) {
  238. this.onload = function() { $axure.utils.fixPng(this); };
  239. } else {
  240. $axure.utils.fixPng(this);
  241. }
  242. });
  243. };
  244. var _fixInputSize = function() {
  245. if(Number($.browser.version) >= 8) return;
  246. var inputs = $('input').not(':input[type=button], :input[type=submit], :input[type=radio], :input[type=checkbox]');
  247. inputs.each(function() {
  248. var $input = $(this);
  249. $input.css('height', ($input.height() - 4 + 'px')).css('width', ($input.width() - 2 + 'px'));
  250. });
  251. var textAreas = $('textarea');
  252. textAreas.each(function() {
  253. var $textArea = $(this);
  254. $textArea.css('height', ($textArea.height() - 6 + 'px')).css('width', ($textArea.width() - 6 + 'px'));
  255. });
  256. };
  257. $(document).ready(function() {
  258. _fixIEStretchBackground();
  259. _applyIEFixedPosition();
  260. $axure.resize(function() {
  261. _resizeIEBackground();
  262. });
  263. $ax.adaptive.bind('viewChanged', function() {
  264. _fixIEStretchBackground();
  265. _applyBackground();
  266. });
  267. _fixAllPngs();
  268. _applyIERotation();
  269. _applyBackground();
  270. _fixInputSize();
  271. });
  272. });