// ******* SITEMAP TOOLBAR VIEWER ACTIONS ******** //
$axure.internal(function ($ax) {
var userTriggeredEventNames = ['onClick', 'onDoubleClick', 'onMouseOver', 'onMouseMove', 'onMouseOut', 'onMouseDown', 'onMouseUp',
'onKeyDown', 'onKeyUp', 'onFocus', 'onLostFocus', 'onTextChange', 'onSelectionChange', 'onSelectedChange', 'onSelect', 'onUnselect',
'onSwipeLeft', 'onSwipeRight', 'onSwipeUp', 'onSwipeDown', 'onDragStart', 'onDrag', 'onDragDrop', 'onScroll', 'onContextMenu', 'onMouseHover', 'onLongClick'];
//var _toggleSelectWidgetNoteForRepeater = function (repeaterId, scriptId, select) {
// var itemIds = $ax.getItemIdsForRepeater(repeaterId);
// for(var i = 0; i < itemIds.length; i++) {
// var itemId = itemIds[i];
// var elementId = $ax.repeater.createElementId(scriptId, itemId);
// if(select) $('#' + elementId).addClass('widgetNoteSelected');
// else $('#' + elementId).removeClass('widgetNoteSelected');
// }
//}
$ax.messageCenter.addMessageListener(function (message, data) {
//If annotation toggle message received from sitemap, toggle footnotes
if(message == 'toggleSelectWidgetNote') {
if (!IOS) {
$('.widgetNoteSelected').removeClass('widgetNoteSelected');
}
if(!data.value) return;
//if(lastSelectedWidgetNote == data.id) {
// lastSelectedWidgetNote = null;
// return;
//}
$ax('*').each(function(obj, elementId) {
if (obj.id == data.id) {
if (!IOS) {
$('#' + elementId).addClass('widgetNoteSelected');
}
_scrollToSelectedNote($('#' + elementId), data.view);
}
});
}
});
var _scrollToSelectedNote = function ($elmt, view) {
var isLandscape = IOS ? window.orientation != 0 && window.orientation != 180 : false;
var winWidth = !IOS ? $(window).width() : (isLandscape ? window.screen.height : window.screen.width) - view.panelWidthOffset;
var winHeight = !IOS ? $(window).height() : view.height;
var docLeft = $('html').last().scrollLeft();
var docTop = $('html').last().scrollTop();
var docRight = docLeft + winWidth;
var docBottom = docTop + winHeight;
var scale = $('#base').css('transform');;
scale = (scale == "none") ? 1 : Number(scale.substring(scale.indexOf('(') + 1, scale.indexOf(',')));
var bodyLeft = ($('body').css('left') !== undefined && $('body').css('left') !== "auto") ? Number($('body').css('left').replace('px','')) : 0;
var top = scale * Number($elmt.css('top').replace('px', ''));
var bottom = top + scale * $elmt.height();
var left = scale * Number($elmt.css('left').replace('px', '')) + bodyLeft;
var right = left + scale * $elmt.width();
var doHorizontalMove = left < docLeft || right > docRight;
var doVerticalMove = top < docTop || bottom > docBottom;
var padding = scale * 50;
var newScrollLeft = 0
if (left < docLeft) {
newScrollLeft = left - padding;
} else if (right > docRight) {
newScrollLeft = right + padding - winWidth;
}
var newScrollTop = 0
if (top < docTop) {
newScrollTop = top - padding;
} else if (bottom > docBottom) {
newScrollTop = bottom + padding - winHeight;
}
// Device Frame or Scale to width or Scale to fit (situations where there is no horizontal scroll)
if (view.h || view.scaleVal == 1 || view.scaleVal == 2) {
doHorizontalMove = false;
}
// Has Device Frame or Scale to Width and widget with note is outside of viewable panel right bounds
if ((view.scaleVal == 1 || view.h) && (left > docRight)) {
doVerticalMove = false;
}
// TODO: need to do something for dynamic panel with scroll
if (doHorizontalMove && doVerticalMove) {
$("html, body").animate({ scrollLeft: newScrollLeft, scrollTop: newScrollTop }, 300);
} else if (doHorizontalMove) {
$("html, body").animate({ scrollLeft: newScrollLeft }, 300);
} else if (doVerticalMove) {
$("html, body").animate({ scrollTop: newScrollTop }, 300);
}
}
var highlightEnabled = false;
$ax.messageCenter.addMessageListener(function(message, data) {
if(message == 'highlightInteractive') {
highlightEnabled = data == true;
_applyHighlight($ax('*'));
}
});
var _applyHighlight = $ax.applyHighlight = function(query, ignoreUnset) {
if(ignoreUnset && !highlightEnabled) return;
var pulsateClassName = 'legacyPulsateBorder';
//Determine if the widget has a defined userTriggeredEventName specified in the array above
var _isInteractive = function(diagramObject) {
if(diagramObject && diagramObject.interactionMap) {
for(var index in userTriggeredEventNames) {
if(diagramObject.interactionMap[userTriggeredEventNames[index]]) return true;
}
}
return false;
};
//Traverse through parent layers (if any) of an element and see if any have a defined userTriggeredEventName
var _findMatchInParent = function(id) {
var parents = $ax('#' + id).getParents(true, ['layer'])[0];
for(var i in parents) {
var parentId = parents[i];
var parentObj = $ax.getObjectFromScriptId(parentId);
if(_isInteractive(parentObj)) return true;
}
return false;
};
//Find all widgets with a defined userTriggeredEventName specified in the array above
var $matchingElements = query.filter(function (obj, id) {
//This prevents the top left corner of the page from highlighting with everything else
if($ax.public.fn.IsLayer(obj.type)) return false;
if(_isInteractive(obj)) return true;
else if($ax.public.fn.IsVector(obj.type) && obj.referencePageUrl) return true;
//Last check on the object's parent layer(s), if a layer has a defined userTriggeredEventName
//then we shall highlight each member of that layer TODO This is a design decision and is subject to change
return _findMatchInParent(id);
}).$();
var isHighlighted = $matchingElements.is('.' + pulsateClassName);
//Toggle the pulsate class on the matched elements
if(highlightEnabled && !isHighlighted) {
$matchingElements.addClass(pulsateClassName);
} else if(!highlightEnabled && isHighlighted) {
$matchingElements.removeClass(pulsateClassName);
}
};
var getElementsFromPoint = function (x, y) {
var elementsFromPointFn = document.elementsFromPoint || document.msElementsFromPoint;
if (typeof elementsFromPointFn === "function") {
return elementsFromPointFn.bind(document)(x, y);
}
return [];
}
$axure.getIdAndRectAtLoc = function (data) {
var element = document.elementFromPoint(data.x, data.y);
if (!element) return undefined;
var jObj = _getElementIdFromTarget(element);
if (jObj.length > 0) {
var id = jObj.attr('id');
var axObj = $ax('#' + id);
var rect = axObj.pageBoundingRect();
return { 'id': id, 'rect': rect };
}
return undefined;
}
$axure.getListOfIdAndRectAtLoc = function (data) {
var domElements = getElementsFromPoint(data.x, data.y);
if (!domElements || !domElements.length) return [];
const elements = [];
domElements.forEach(function (domElement) {
var jObj = _getElementIdFromTarget(domElement);
if (jObj.length > 0) {
var id = jObj.attr('id');
var axObj = $ax('#' + id);
var rect = axObj.pageBoundingRect();
if (elements.findIndex(function (x) { return x.id === id }) < 0) {
elements.push( { 'id': id, 'rect': rect } );
}
}
});
return elements;
}
$axure.getIdRectAndStyleAtLoc = function(data) {
var element = document.elementFromPoint(data.x, data.y);
if (!element) return undefined;
var jObj = _getElementIdFromTarget(element);
if (jObj.length > 0) {
var id = jObj.attr('id');
return $axure.getRectAndStyleById(id);
}
return undefined;
}
$axure.getListOfIdRectAndStyleAtLoc = function(data) {
var domElements = getElementsFromPoint(data.x, data.y);
if (!domElements || !domElements.length) return [];
const elements = [];
domElements.forEach(function (domElement) {
var jObj = _getElementIdFromTarget(domElement);
if (jObj.length > 0) {
var id = jObj.attr('id');
if (elements.findIndex(function (x) { return x.id === id }) < 0) {
elements.push($axure.getRectAndStyleById(id));
}
}
});
return elements;
}
$axure.getRectAndStyleById = function (id) {
var axObj = $ax('#' + id);
var rect = axObj.pageBoundingRect();
var style = $ax.style.computeFullStyle(id, $ax.style.generateState(id), $ax.adaptive.currentViewId);
style.text = axObj.text();
return { 'id': id, 'rect': rect, 'style': style };
}
$axure.isIdVisible = function (id) {
return id ? $ax.visibility.IsIdVisible(id) : false;
}
$axure.getParentElementById = function (elementId) {
if (!elementId) return undefined;
var parentId = $ax.getLayerParentFromElementId(elementId);
if (!parentId) {
return undefined;
}
return $axure.getRectAndStyleById(parentId);
}
var _getElementIdFromTarget = function (target) {
var targetId = target.id;
var jTarget = $(target);
while((!targetId || targetId.indexOf('cache') > -1) && jTarget[0].tagName != 'HTML') {
jTarget = jTarget.parent();
targetId = jTarget.attr('id');
}
if(targetId && targetId != 'base') {
var sections = targetId.split('_');
return $('#' + sections[0]);
}
return '';
}
});
