adaptive.js 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750
  1. $axure.internal(function($ax) {
  2. $ax.adaptive = {};
  3. $axure.utils.makeBindable($ax.adaptive, ["viewChanged"]);
  4. var _auto = true;
  5. var _autoIsHandledBySidebar = false;
  6. var _views;
  7. var _idToView;
  8. var _enabledViews = [];
  9. var _initialViewToLoad;
  10. var _initialViewSizeToLoad;
  11. var _loadFinished = false;
  12. $ax.adaptive.loadFinished = function() {
  13. if(_loadFinished) return;
  14. _loadFinished = true;
  15. if($ax.adaptive.currentViewId) $ax.viewChangePageAndMasters();
  16. else $ax.postAdaptiveViewChanged();
  17. };
  18. var _handleResize = function(forceSwitchTo) {
  19. if(!_auto) return;
  20. if(_auto && _autoIsHandledBySidebar && !forceSwitchTo) return;
  21. var $window = $(window);
  22. var height = $window.height();
  23. var width = $window.width();
  24. var toView = _getAdaptiveView(width, height);
  25. var toViewId = toView && toView.id;
  26. _switchView(toViewId, forceSwitchTo);
  27. };
  28. var _setAuto = $ax.adaptive.setAuto = function(val) {
  29. if(_auto != val) {
  30. _auto = Boolean(val);
  31. }
  32. };
  33. var _setLineImage = function(id, imageUrl) {
  34. $jobj(id).attr('src', imageUrl);
  35. };
  36. var _switchView = function (viewId, forceSwitchTo) {
  37. //if(!$ax.pageData.isAdaptiveEnabled) return;
  38. var previousViewId = $ax.adaptive.currentViewId;
  39. if(typeof previousViewId == 'undefined') previousViewId = '';
  40. if(typeof viewId == 'undefined') viewId = '';
  41. if (viewId == previousViewId) {
  42. if(forceSwitchTo) $ax.postAdaptiveViewChanged(forceSwitchTo);
  43. return;
  44. }
  45. $ax('*').each(function(obj, elementId) {
  46. if (!$ax.public.fn.IsTreeNodeObject(obj.type)) return;
  47. if(!obj.hasOwnProperty('isExpanded')) return;
  48. var query = $ax('#' + elementId);
  49. var defaultExpanded = obj.isExpanded;
  50. query.expanded(defaultExpanded);
  51. });
  52. // reset all the inline positioning from move and rotate actions including size and transformation
  53. $axure('*').each(function (diagramObject, elementId) {
  54. if(diagramObject.isContained) return;
  55. if($ax.getParentRepeaterFromElementIdExcludeSelf(elementId)) return;
  56. var element = document.getElementById(elementId);
  57. if(element) {
  58. var resetCss = {
  59. top: "", left: "", width: "", height: "", opacity: "",
  60. transform: "", webkitTransform: "", MozTransform: "", msTransform: "", OTransform: ""
  61. };
  62. var query = $(element);
  63. query.css(resetCss);
  64. var isPanel = $ax.public.fn.IsDynamicPanel(diagramObject.type);
  65. if(!isPanel || diagramObject.fitToContent) { //keeps size on the panel states when switching adaptive views to optimize fit to panel
  66. if(diagramObject.fitToContent) $ax.dynamicPanelManager.setFitToContentCss(elementId, true);
  67. var children = query.children();
  68. if(children.length) children.css(resetCss);
  69. }
  70. $ax.dynamicPanelManager.resetFixedPanel(diagramObject, element);
  71. $ax.dynamicPanelManager.resetAdaptivePercentPanel(diagramObject, element);
  72. }
  73. });
  74. $ax.adaptive.currentViewId = viewId; // we need to set this so the enabled and selected styles will apply properly
  75. if(previousViewId) {
  76. $ax.style.clearAdaptiveStyles();
  77. $('*').removeClass(previousViewId);
  78. } else {
  79. $ax.style.reselectElements();
  80. }
  81. $axure('*').each(function (obj, elementId) {
  82. if($ax.getParentRepeaterFromElementIdExcludeSelf(elementId)) return;
  83. $ax.style.updateElementIdImageStyle(elementId); // When image override exists, fix styling/borders
  84. });
  85. //$ax.style.startSuspendTextAlignment();
  86. // reset all the images only if we're going back to the default view
  87. if(!viewId) {
  88. $axure('*').each(function (diagramObject, elementId) {
  89. if($ax.getParentRepeaterFromElementIdExcludeSelf(elementId)) return;
  90. $ax.placeholderManager.refreshPlaceholder(elementId);
  91. var images = diagramObject.images;
  92. if(diagramObject.type == 'horizontalLine' || diagramObject.type == 'verticalLine') {
  93. var startImg = images['start~'];
  94. _setLineImage(elementId + "_start", startImg);
  95. var endImg = images['end~'];
  96. _setLineImage(elementId + "_end", endImg);
  97. var lineImg = images['line~'];
  98. _setLineImage(elementId + "_line", lineImg);
  99. } else if(diagramObject.type == $ax.constants.CONNECTOR_TYPE) {
  100. _setAdaptiveConnectorImages(elementId, images, '');
  101. } else if(images) {
  102. $ax.style.updateImage(elementId);
  103. }
  104. //align all text
  105. var child = $jobj(elementId).children('.text');
  106. if(child.length) $ax.style.transformTextWithVerticalAlignment(child[0].id, function() { });
  107. });
  108. // we have to reset visibility if we aren't applying a new view
  109. $ax.visibility.resetLimboAndHiddenToDefaults();
  110. $ax.visibility.clearMovedAndResized();
  111. $ax.repeater.refreshAllRepeaters();
  112. $ax.dynamicPanelManager.updateParentsOfNonDefaultFitPanels();
  113. $ax.dynamicPanelManager.updatePercentPanelCache($ax('*'));
  114. $ax.expr.updateAutoFitted();
  115. } else {
  116. $ax.visibility.clearLimboAndHidden();
  117. $ax.visibility.clearMovedAndResized();
  118. _applyView(viewId);
  119. $ax.repeater.refreshAllRepeaters();
  120. $ax.dynamicPanelManager.updateAllLayerSizeCaches();
  121. $ax.dynamicPanelManager.updateParentsOfNonDefaultFitPanels();
  122. $ax.expr.updateAutoFitted();
  123. }
  124. $ax.annotation.updateAllFootnotes();
  125. //$ax.style.resumeSuspendTextAlignment();
  126. $ax.adaptive.triggerEvent('viewChanged', {});
  127. if(_loadFinished) $ax.viewChangePageAndMasters(forceSwitchTo);
  128. };
  129. var _getImageWithTag = function(image, tag) {
  130. var flattened = {};
  131. for (var component in image) {
  132. var componentImage = image[component][tag];
  133. if(componentImage) flattened[component] = componentImage;
  134. }
  135. return flattened;
  136. }
  137. // gets the inheritance chain of a particular view.
  138. var _getAdaptiveIdChain = $ax.adaptive.getAdaptiveIdChain = function(viewId) {
  139. if(!viewId) return [];
  140. var view = _idToView[viewId];
  141. var chain = [];
  142. var current = view;
  143. while(current) {
  144. chain[chain.length] = current.id;
  145. current = _idToView[current.baseViewId];
  146. }
  147. return chain.reverse();
  148. };
  149. var _getMasterAdaptiveIdChain = $ax.adaptive.getMasterAdaptiveIdChain = function (masterId, viewId) {
  150. if (!viewId) return [];
  151. var master = $ax.pageData.masters[masterId];
  152. var masterViews = master.adaptiveViews;
  153. var idToMasterView = {};
  154. if (masterViews && masterViews.length > 0) {
  155. for (var i = 0; i < masterViews.length; i++) {
  156. var view = masterViews[i];
  157. idToMasterView[view.id] = view;
  158. }
  159. }
  160. if (!idToMasterView) return [];
  161. var view = idToMasterView[viewId];
  162. var chain = [];
  163. var current = view;
  164. while (current) {
  165. chain[chain.length] = current.id;
  166. current = idToMasterView[current.baseViewId];
  167. }
  168. return chain.reverse();
  169. };
  170. var _getPageStyle = $ax.adaptive.getPageStyle = function() {
  171. var currentViewId = $ax.adaptive.currentViewId;
  172. var adaptiveChain = _getAdaptiveIdChain(currentViewId);
  173. var currentStyle = $.extend({}, $ax.pageData.page.style);
  174. for(var i = 0; i < adaptiveChain.length; i++) {
  175. var viewId = adaptiveChain[i];
  176. $.extend(currentStyle, $ax.pageData.page.adaptiveStyles[viewId]);
  177. }
  178. return currentStyle;
  179. };
  180. var _setAdaptiveLineImages = function(elementId, images, viewIdChain) {
  181. for(var i = viewIdChain.length - 1; i >= 0; i--) {
  182. var viewId = viewIdChain[i];
  183. var startImg = images['start~' + viewId];
  184. if(startImg) {
  185. _setLineImage(elementId + "_start", startImg);
  186. var endImg = images['end~' + viewId];
  187. _setLineImage(elementId + "_end", endImg);
  188. var lineImg = images['line~' + viewId];
  189. _setLineImage(elementId + "_line", lineImg);
  190. break;
  191. }
  192. }
  193. };
  194. var _setAdaptiveConnectorImages = function (elementId, images, view) {
  195. var conn = $jobj(elementId);
  196. var count = conn.children().length-1; // -1 for rich text panel
  197. for(var i = 0; i < count; i++) {
  198. var img = images['' + i + '~' + view];
  199. $jobj(elementId + '_seg' + i).attr('src', img);
  200. }
  201. };
  202. var _applyView = $ax.adaptive.applyView = function(viewId, query) {
  203. var limboIds = {};
  204. var hiddenIds = {};
  205. var jquery;
  206. if(query) {
  207. jquery = query.jQuery();
  208. jquery = jquery.add(jquery.find('*'));
  209. var jqueryAnn = $ax.annotation.jQueryAnn(query);
  210. jquery = jquery.add(jqueryAnn);
  211. } else {
  212. jquery = $('*').not('#ios-safari-fixed');
  213. query = $ax('*');
  214. }
  215. jquery.addClass(viewId);
  216. var viewIdChain = _getAdaptiveIdChain(viewId);
  217. // this could be made more efficient by computing it only once per object
  218. query.each(function(diagramObject, elementId) {
  219. _applyAdaptiveViewOnObject(diagramObject, elementId, viewIdChain, viewId, limboIds, hiddenIds);
  220. });
  221. $ax.visibility.addLimboAndHiddenIds(limboIds, hiddenIds, query);
  222. //$ax.dynamicPanelManager.updateAllFitPanelsAndLayerSizeCaches();
  223. $ax.dynamicPanelManager.updatePercentPanelCache(query);
  224. };
  225. var _applyAdaptiveViewOnObject = function(diagramObject, elementId, viewIdChain, viewId, limboIds, hiddenIds) {
  226. var adaptiveChain = [];
  227. for(var i = 0; i < viewIdChain.length; i++) {
  228. var viewId = viewIdChain[i];
  229. var viewStyle = diagramObject.adaptiveStyles[viewId];
  230. if(viewStyle) {
  231. adaptiveChain[adaptiveChain.length] = viewStyle;
  232. if (viewStyle.size) $ax.public.fn.convertToSingleImage($jobj(elementId));
  233. }
  234. }
  235. var state = $ax.style.generateState(elementId);
  236. // set the image
  237. var images = diagramObject.images;
  238. if(images) {
  239. if(diagramObject.type == 'horizontalLine' || diagramObject.type == 'verticalLine') {
  240. _setAdaptiveLineImages(elementId, images, viewIdChain);
  241. } else if (diagramObject.type == $ax.constants.CONNECTOR_TYPE) {
  242. _setAdaptiveConnectorImages(elementId, images, viewId);
  243. } else if (diagramObject.generateCompound) {
  244. var compoundUrl = _matchImageCompound(diagramObject, elementId, viewIdChain, state);
  245. if (compoundUrl) $ax.style.applyImage(elementId, compoundUrl, state);
  246. }else {
  247. var imgUrl = _matchImage(elementId, images, viewIdChain, state);
  248. if(imgUrl) $ax.style.applyImage(elementId, imgUrl, state);
  249. }
  250. }
  251. // addaptive override style (not including default style props)
  252. var adaptiveStyle = $ax.style.computeAllOverrides(elementId, undefined, state, viewId);
  253. // this style INCLUDES the object's my style
  254. var compoundStyle = $.extend({}, diagramObject.style, adaptiveStyle);
  255. // if (diagramObject.owner.type == 'Axure:Master' && diagramObject.adaptiveStyles) {
  256. // adaptiveStyle = $ax.style.computeFullStyle(elementId, state, viewId);
  257. // }
  258. if(!diagramObject.isContained) {
  259. $ax.style.setAdaptiveStyle(elementId, adaptiveStyle);
  260. }
  261. var scriptId = $ax.repeater.getScriptIdFromElementId(elementId);
  262. if(compoundStyle.limbo && !diagramObject.isContained) limboIds[scriptId] = true;
  263. // sigh, javascript. we need the === here because undefined means not overriden
  264. if(compoundStyle.visible === false) hiddenIds[scriptId] = true;
  265. };
  266. var _matchImage = function (id, images, viewIdChain, state, doNotDecomposeState) {
  267. const overrideState = $ax.style.highestPriorityBaseState(state);
  268. const override = $ax.style.getElementImageOverride(id, overrideState);
  269. if(override) return override;
  270. if(!images) return undefined;
  271. const scriptId = $ax.repeater.getScriptIdFromElementId(id);
  272. // first check all the images for this state
  273. for(let i = viewIdChain.length - 1; i >= 0; i--) {
  274. const viewId = viewIdChain[i];
  275. const img = findImage(images, scriptId, state, viewId);
  276. if (img) return img;
  277. }
  278. // check for the default state style
  279. // try to find an image for the default state or for the highest priority state if no default was found. RP-1854
  280. const defaultStateImage = findImage(images, scriptId, state) || findImage(images, scriptId, overrideState);
  281. if (defaultStateImage) return defaultStateImage;
  282. if(doNotDecomposeState) return undefined;
  283. state = $ax.style.decomposeState(state);
  284. if (state) return _matchImage(scriptId, images, viewIdChain, state);
  285. // SHOULD NOT REACH HERE! NORMAL SHOULD ALWAYS CATCH AT THE DEFAULT!
  286. return images['normal~']; // this is the default
  287. };
  288. let findImage = function(images, scriptId, state, viewId) {
  289. if(!images) return undefined;
  290. if(!viewId) viewId = "";
  291. let withScript = scriptId + "~" + state + "~" + viewId;
  292. let img = images[withScript];
  293. if(!img) img = images[state + "~" + viewId];
  294. return img;
  295. }
  296. var _matchImageCompound = function(diagramObject, id, viewIdChain, state) {
  297. var images = [];
  298. for(var i = 0; i < diagramObject.compoundChildren.length; i++) {
  299. var component = diagramObject.compoundChildren[i];
  300. images[component] = _matchImage(id, diagramObject.images[component], viewIdChain, state);
  301. }
  302. return images;
  303. };
  304. $ax.adaptive.getImageForStateAndView = function(id, state) {
  305. var viewIdChain = _getAdaptiveIdChain($ax.adaptive.currentViewId);
  306. var diagramObject = $ax.getObjectFromElementId(id);
  307. if (diagramObject.generateCompound) return _matchImageCompound(diagramObject, id, viewIdChain, state);
  308. else return _matchImage(id, diagramObject.images, viewIdChain, state);
  309. };
  310. var _getAdaptiveView = function(winWidth, winHeight) {
  311. var _isViewOneGreaterThanTwo = function (view1, view2, winHeight) {
  312. if (view1.size.width > view2.size.width) return true;
  313. if (view1.size.width == view2.size.width) {
  314. if (view2.size.height <= winHeight) return view1.size.height > view2.size.height && view1.size.height <= winHeight;
  315. else return view1.size.height < view2.size.height;
  316. }
  317. return false;
  318. };
  319. var _isViewOneLessThanTwo = function(view1, view2) {
  320. var width2 = view2.size.width || 1000000; // artificially large number
  321. var height2 = view2.size.height || 1000000;
  322. var width1 = view1.size.width || 1000000;
  323. var height1 = view1.size.height || 1000000;
  324. return width1 < width2 || (width1 == width2 && height1 < height2);
  325. };
  326. var _isWindowWidthGreaterThanViewWidth = function(view, width) {
  327. return width >= view.size.width;
  328. };
  329. var _isWindowWidthLessThanViewWidth = function(view1, width) {
  330. var viewWidth = view1.size.width || 1000000;
  331. return width <= viewWidth;
  332. };
  333. var greater = undefined;
  334. var less = undefined;
  335. var defaultView = $ax.pageData.defaultAdaptiveView;
  336. if (_isWindowWidthGreaterThanViewWidth(defaultView, winWidth, winHeight)) greater = defaultView;
  337. less = defaultView;
  338. for(var i = 0; i < _enabledViews.length; i++) {
  339. var view = _enabledViews[i];
  340. if(_isWindowWidthGreaterThanViewWidth(view, winWidth, winHeight)) {
  341. if(!greater || _isViewOneGreaterThanTwo(view, greater, winHeight)) greater = view;
  342. }
  343. if(_isWindowWidthLessThanViewWidth(view, winWidth, winHeight)) {
  344. if(!less || _isViewOneLessThanTwo(view, less)) less = view;
  345. }
  346. }
  347. return greater || less;
  348. };
  349. var _isAdaptiveInitialized = function() {
  350. return typeof _idToView != 'undefined';
  351. };
  352. $ax.messageCenter.addMessageListener(function(message, data) {
  353. //If the adaptive plugin hasn't been initialized yet then
  354. //save the view to load so that it can get set when initialize occurs
  355. if (message == 'switchAdaptiveView') {
  356. if (!$axure.utils.isInPlayer()) return;
  357. var href = decodeURI(window.location.href.split('?')[0]);
  358. var lastSlash = href.lastIndexOf('/');
  359. href = href.substring(lastSlash + 1);
  360. if(href != data.src) return;
  361. var view = data.view == 'auto' ? undefined : (data.view == 'default' ? '' : data.view);
  362. if(!_isAdaptiveInitialized()) {
  363. _initialViewToLoad = view;
  364. } else _handleLoadViewId(view);
  365. } else if (message == 'setAdaptiveViewForSize') {
  366. if (!$axure.utils.isInPlayer()) return;
  367. _autoIsHandledBySidebar = true;
  368. if(!_isAdaptiveInitialized()) {
  369. _initialViewSizeToLoad = data;
  370. } else _handleSetViewForSize(data.width, data.height);
  371. } else if (message == 'getScale') {
  372. if (!$axure.utils.isInPlayer()) return;
  373. var prevScaleN = data.prevScaleN;
  374. var newScaleN = 1;
  375. var contentOriginOffset = 0;
  376. var $body = $('body');
  377. $body.css('height', '');
  378. if (data.scale != 0 && data.scale != 3) {
  379. var adjustScrollScale = false;
  380. if ($('html').getNiceScroll().length == 0 && !MOBILE_DEVICE) {
  381. //adding nicescroll so width is correct when getting scale
  382. _addNiceScroll($('html'), { emulatetouch: false, horizrailenabled: false, spacebarenabled: false }, true);
  383. adjustScrollScale = true;
  384. }
  385. $('html').css('overflow-x', 'hidden');
  386. var view = $ax.adaptive.currentViewId ? _idToView[$ax.adaptive.currentViewId] : $ax.pageData.defaultAdaptiveView;
  387. var bodyWidth = view.size.width;
  388. // screen width does not adjust on screen rotation for iOS (width is always shorter screen measurement)
  389. var isLandscape = window.orientation != 0 && window.orientation != 180;
  390. var mobileWidth = (IOS ? (isLandscape ? window.screen.height : window.screen.width) : window.screen.width) - data.panelWidthOffset;
  391. var scaleN = newScaleN = (MOBILE_DEVICE ? mobileWidth : data.mainFrameWidth) / bodyWidth;
  392. if (data.scale == 2) {
  393. var pageSize = $ax.public.fn.getPageSize();
  394. var hScaleN = (MOBILE_DEVICE ? data.viewportHeight : data.mainFrameHeight) / Math.max(1, pageSize.bottom);
  395. if (hScaleN < scaleN) {
  396. scaleN = newScaleN = hScaleN;
  397. }
  398. var isCentered = $body.css('position') == 'relative';
  399. if (isCentered) contentOriginOffset = scaleN * (bodyWidth / 2);
  400. }
  401. if ((SAFARI && IOS) || SHARE_APP) {
  402. var pageSize = $ax.public.fn.getPageSize();
  403. $body.first().css('height', pageSize.bottom + 'px');
  404. } //else $body.css('height', $body.height() + 'px');
  405. if (adjustScrollScale) {
  406. _removeNiceScroll($('html'), true);
  407. _addNiceScroll($('html'), { emulatetouch: false, horizrailenabled: false, spacebarenabled: false, cursorwidth: Math.ceil(6 / newScaleN) + 'px', cursorborder: 1 / newScaleN + 'px solid #fff', cursorborderradius: 5 / newScaleN + 'px' }, true);
  408. }
  409. } else {
  410. if (data.scale == 0) {
  411. scaleN = newScaleN = 1;
  412. }
  413. if (data.scale == 3) {
  414. const zoom = $(document).find("html").attr("zoom") ? parseInt($(document).find("html").attr("zoom"),10) : 100;
  415. scaleN = newScaleN = zoom/100;
  416. }
  417. }
  418. var contentScale = {
  419. scaleN: newScaleN,
  420. prevScaleN: prevScaleN,
  421. contentOriginOffset: contentOriginOffset,
  422. clipToView: data.clipToView,
  423. mainFrameHeight: data.mainFrameHeight,
  424. mainFrameWidth: data.mainFrameWidth,
  425. viewportHeight: data.viewportHeight,
  426. viewportWidth: data.viewportWidth,
  427. panelWidthOffset: data.panelWidthOffset,
  428. scale: data.scale
  429. };
  430. $axure.messageCenter.postMessage('setContentScale', contentScale);
  431. } else if (message == 'setDeviceMode') {
  432. if (!$axure.utils.isInPlayer()) return;
  433. _isDeviceMode = data.device;
  434. if (data.device) {
  435. // FIXES firefox cursor not staying outside initial device frame border
  436. // SAFARI needs entire content height so that trackpad can be disabled
  437. //if (FIREFOX || (SAFARI && !IOS)) {
  438. // var pageSize = $ax.public.fn.getPageSize();
  439. // $('html').css('height', pageSize.bottom + 'px');
  440. //}
  441. _removeNiceScroll($('html'), true);
  442. if (!MOBILE_DEVICE) {
  443. _addNiceScroll($('html'), { emulatetouch: true, horizrailenabled: false, spacebarenabled: false }, true);
  444. $('html').addClass('mobileFrameCursor');
  445. $('html').css('cursor', 'url(resources/css/images/touch.cur), auto');
  446. $('html').css('cursor', 'url(resources/css/images/touch.svg) 32 32, auto');
  447. $('html').css('overflow-x', 'hidden');
  448. if (IE) {
  449. document.addEventListener("click", function () {
  450. // IE still sometimes wants an argument here
  451. this.activeElement.releasePointerCapture();
  452. }, false);
  453. }
  454. if ($axure.browser.isEdge) {
  455. document.addEventListener("pointerdown", function (e) {
  456. this.activeElement.releasePointerCapture(e.pointerId);
  457. }, false);
  458. }
  459. $ax.dynamicPanelManager.initMobileScroll();
  460. }
  461. // Gives horizontal scroll to android in 100% (handled outside of iframe)
  462. $('html').css('overflow-x', 'hidden');
  463. $('body').css('margin', '0px');
  464. $(function () { _setHorizontalScroll(false); });
  465. } else {
  466. _removeNiceScroll($('html'), true);
  467. const zoom = $(document).find("html").attr("zoom") ? parseInt($(document).find("html").attr("zoom"),10) : 100;
  468. if (zoom == 100){
  469. $('html').css('overflow-x', '');
  470. }
  471. $('html').css('cursor', '');
  472. //$('html').removeAttr('style');
  473. $('body').css('margin', '');
  474. $('html').removeClass('mobileFrameCursor');
  475. $(function () { _setHorizontalScroll(!data.scaleToWidth); });
  476. $ax.dynamicPanelManager.initMobileScroll();
  477. }
  478. }
  479. });
  480. var _isDeviceMode = false;
  481. $ax.adaptive.isDeviceMode = function () {
  482. return _isDeviceMode;
  483. }
  484. var _isHtmlQuery = function ($container) { return $container.length > 0 && $container[0] == $('html')[0]; }
  485. var _removeNiceScroll = $ax.adaptive.removeNiceScroll = function ($container, blockResetScroll) {
  486. if (!blockResetScroll) {
  487. $container.scrollLeft(0);
  488. $container.scrollTop(0);
  489. }
  490. var nS = $container.getNiceScroll();
  491. var emulateTouch = nS.length > 0 && nS[0].opt.emulateTouch;
  492. nS.remove();
  493. //clean up nicescroll css
  494. $container.css({ 'overflow': '' });
  495. if (IE) $container.css({ '-ms-overflow-y': '', 'overflow-y': '', '-ms-overflow-style': '', '-ms-touch-action': '' });
  496. if (!emulateTouch) return;
  497. if (_isHtmlQuery($container)) {
  498. $('.scrollContainer').remove();
  499. $('#base').off('mouseleave.ax');
  500. } else {
  501. $container.off('mouseleave.ax');
  502. }
  503. }
  504. var _addNiceScrollExitDetector = function ($container) {
  505. if (_isHtmlQuery($container)) {
  506. var isScrollContainerExist = $('.scrollContainer').length > 0;
  507. // add a fixed div the size of the frame that will not move as we scroll like html,body,#base,children
  508. // so we are able to detect when the mouse leaves that frame area if there is no existing DOM element
  509. var $scrollContainer = isScrollContainerExist ? $('.scrollContainer') : $("<div class='scrollContainer'></div>");
  510. var $body = $('body');
  511. $scrollContainer.css({
  512. 'position': 'fixed',
  513. 'width': $body.width(),
  514. 'height': $body.height()
  515. });
  516. // we want #base div to handle the event so that it bubbles up from the scrollContainer div which
  517. // handles the bounds of the frame in case there was no previously exisiting child to bubble up the
  518. // event or if the user has clicked on an existing child node to start the emulated touch scroll
  519. var $base = $('#base');
  520. $base.on('mouseleave.ax', function (e) {
  521. var nS = $container.getNiceScroll();
  522. for (var i = 0; i < nS.length; ++i)
  523. nS[i].ontouchend(e);
  524. });
  525. // need to prepend so it is first child in DOM and doesn't block mouse events to other children which
  526. // would make them unable to scroll
  527. if (!isScrollContainerExist){
  528. $base.prepend($scrollContainer);
  529. }
  530. } else {
  531. $container.on('mouseleave.ax', function (e) {
  532. var nS = $container.getNiceScroll();
  533. for (var i = 0; i < nS.length; ++i)
  534. nS[i].ontouchend(e);
  535. });
  536. }
  537. }
  538. var _addNiceScroll = $ax.adaptive.addNiceScroll = function ($container, options, blockResetScroll) {
  539. if (!blockResetScroll) {
  540. $container.scrollLeft(0);
  541. $container.scrollTop(0);
  542. }
  543. $container.niceScroll(options);
  544. // RP-581 add handling to stop scroll on mouse leave if enable cursor-drag scrolling like touch devices in desktop computer
  545. if (options.emulatetouch) _addNiceScrollExitDetector($container);
  546. //clean up nicescroll css so child scroll containers show scrollbars in IE
  547. if (IE) $container.css({ '-ms-overflow-y': '', '-ms-overflow-style': '' });
  548. if(IOS) $container.css({ 'overflow-y': ''});
  549. }
  550. //given the element, find the container that's using nice scroll (including the element itself)
  551. $ax.adaptive.getNiceScrollContainer = function(element) {
  552. var parent = element;
  553. while(parent) {
  554. if($(parent).getNiceScroll().length > 0) return parent;
  555. parent = parent.parentElement;
  556. }
  557. return undefined;
  558. }
  559. $ax.adaptive.updateMobileScrollOnBody = function () {
  560. var niceScroll = $('html').getNiceScroll();
  561. if (niceScroll.length == 0) return;
  562. niceScroll.resize();
  563. }
  564. var _setTrackpadHorizontalScroll = function (active) {
  565. var preventScroll = function (e) {
  566. if (Math.abs(e.wheelDeltaX) != 0) {
  567. e.preventDefault();
  568. }
  569. }
  570. if (!active) {
  571. document.body.addEventListener("mousewheel", preventScroll, { passive: false });
  572. document.getElementById('html').addEventListener("mousewheel", preventScroll, { passive: false });
  573. } else {
  574. document.body.removeEventListener("mousewheel", preventScroll, { passive: false });
  575. document.getElementById('html').removeEventListener("mousewheel", preventScroll, { passive: false });
  576. }
  577. }
  578. var _setHorizontalScroll = function (active) {
  579. var $body = $(document);
  580. if (!active) {
  581. $body.bind('scroll', function () {
  582. if ($body.scrollLeft() !== 0) {
  583. $body.scrollLeft(0);
  584. }
  585. });
  586. } else {
  587. $body.unbind('scroll');
  588. }
  589. }
  590. $ax.adaptive.setAdaptiveView = function(view) {
  591. var viewIdForSitemapToUnderstand = view == 'auto' ? undefined : (view == 'default' ? '' : view);
  592. if(!_isAdaptiveInitialized()) {
  593. _initialViewToLoad = viewIdForSitemapToUnderstand;
  594. } else _handleLoadViewId(viewIdForSitemapToUnderstand);
  595. };
  596. $ax.adaptive.initialize = function() {
  597. _views = $ax.pageData.adaptiveViews;
  598. _idToView = {};
  599. var useViews = $ax.document.configuration.useViews;
  600. if(_views && _views.length > 0) {
  601. for(var i = 0; i < _views.length; i++) {
  602. var view = _views[i];
  603. _idToView[view.id] = view;
  604. if(useViews) _enabledViews[_enabledViews.length] = view;
  605. }
  606. if(_autoIsHandledBySidebar && _initialViewSizeToLoad) _handleSetViewForSize(_initialViewSizeToLoad.width, _initialViewSizeToLoad.height);
  607. else _handleLoadViewId(_initialViewToLoad);
  608. }
  609. $axure.resize(function(e) {
  610. _handleResize();
  611. $ax.postResize(e); //window resize fires after view changed
  612. });
  613. };
  614. var _handleLoadViewId = function (loadViewId, forceSwitchTo) {
  615. if(typeof loadViewId != 'undefined') {
  616. _setAuto(false);
  617. _switchView(loadViewId != 'default' ? loadViewId : '', forceSwitchTo);
  618. } else {
  619. _setAuto(true);
  620. _handleResize(forceSwitchTo);
  621. }
  622. };
  623. var _handleSetViewForSize = function (width, height) {
  624. var toView = _getAdaptiveView(width, height);
  625. var toViewId = toView && toView.id;
  626. _switchView(toViewId, "auto");
  627. };
  628. $ax.adaptive.getSketchKey = function() {
  629. return $ax.pageData.sketchKeys[$ax.adaptive.currentViewId || ''];
  630. }
  631. });