annotation.js
7.7 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
// ******* Annotation MANAGER ******** //
$axure.internal(function($ax) {
var NOTE_SIZE = 10;
var _annotationManager = $ax.annotation = {};
var _updateLinkLocations = $ax.annotation.updateLinkLocations = function(elementId) {
var textId = $ax.GetTextPanelId(elementId);
if(!textId) return;
var rotation = $ax.getObjectFromElementId(elementId).style.rotation;
//we have to do this because webkit reports the post-transform position but when you set positions it's pre-transform
if(WEBKIT && rotation) {
//we can dynamiclly rotate a widget now, show need to remember the transform rather than just remove it
//here jquery.css will return 'none' if element is display none
var oldShapeTransform = document.getElementById(elementId).style['-webkit-transform'];
var oldTextTransform = document.getElementById(textId).style['-webkit-transform'];
$('#' + elementId).css('-webkit-transform', 'scale(1)');
$('#' + textId).css('-webkit-transform', 'scale(1)');
}
$('#' + textId).find('div[id$="_ann"]').each(function(index, value) {
var elementId = value.id.replace('_ann', '');
var $link = $('#' + elementId);
var annPos = $link.position();
annPos.left += $link.width();
//var annPos = $(value).position();
var left = annPos.left;// - NOTE_SIZE;
var top = annPos.top - 5;
$(value).css('left', left).css('top', top);
});
//undo the transform reset
if(WEBKIT && rotation) {
$('#' + elementId).css('-webkit-transform', oldShapeTransform || '');
$('#' + textId).css('-webkit-transform', oldTextTransform || '');
}
};
var _toggleAnnotationDialog = function (elementId, event) {
let win = $(window);
let scrollY = win.scrollTop();
let scrollX = win.scrollLeft();
let x = event.pageX - scrollX;
let y = event.pageY - scrollY;
let frameElement = window.frameElement;
let parent = window.parent;
//ann dialog is relative to mainFrame, exclude the mainFrame location so the notes shows up correctly in device mode
while(frameElement && frameElement.name !== 'mainFrame') {
let rect = frameElement.getBoundingClientRect();
x += rect.x;
y += rect.y;
if(!parent) break;
frameElement = parent.frameElement;
parent = parent.parent;
}
let messageData = { id: elementId, x: x, y: y }
if (!$axure.utils.isInPlayer()) messageData.page = $ax.pageData.notesData;
$ax.messageCenter.postMessage('toggleAnnDialog', messageData);
}
$ax.annotation.initialize = function () {
_createFootnotes($ax('*'), true);
}
var _createFootnotes = $ax.annotation.createFootnotes = function(query, create) {
if(!$ax.document.configuration.showAnnotations) return;
var widgetNotes = $ax.pageData.notesData.widgetNotes;
if (widgetNotes) {
var ownerToFns = $ax.pageData.notesData.ownerToFns;
if(!$.isEmptyObject(ownerToFns)) {
query.each(function(dObj, elementId) {
var fns = ownerToFns[dObj.id];
if (fns !== undefined) {
var elementIdQuery = $('#' + elementId);
if (dObj.type == 'hyperlink') {
var parentId = $ax.GetParentIdFromLink(elementId);
if (create) {
elementIdQuery.after("<div id='" + elementId + "_ann' class='annnote'>​</div>");
appendFns($('#' + elementId + "_ann"), fns);
}
_updateLinkLocations(parentId);
} else {
if (create) {
elementIdQuery.after("<div id='" + elementId + "_ann' class='annnote'>​</div>");
appendFns($('#' + elementId + "_ann"), fns);
}
_adjustIconLocation(elementId, dObj);
}
if (create) {
$('#' + elementId + "_ann").click(function (e) {
_toggleAnnotationDialog(dObj.id, e);
return false;
});
var isVisible = true;
var isMaster = $ax.public.fn.IsReferenceDiagramObject(dObj.type);
if (isMaster) isVisible = dObj.visible;
else isVisible = $ax.visibility.IsIdVisible(elementId);
if (!isVisible) {
var ann = document.getElementById(elementId + "_ann");
if (ann) $ax.visibility.SetVisible(ann, false);
}
}
}
});
}
}
function appendFns($parent, fns) {
for (var index = 0; index < fns.length; index++) {
$parent.append("<div class='annnotelabel' >" + fns[index] + "</div>");
}
}
};
$ax.annotation.updateAllFootnotes = function () {
_createFootnotes($ax('*'), false);
}
$ax.annotation.jQueryAnn = function(query) {
var elementIds = [];
query.each(function(diagramObject, elementId) {
if(diagramObject.annotation) elementIds[elementIds.length] = elementId;
});
var elementIdSelectors = jQuery.map(elementIds, function(elementId) { return '#' + elementId + '_ann'; });
var jQuerySelectorText = (elementIdSelectors.length > 0) ? elementIdSelectors.join(', ') : '';
return $(jQuerySelectorText);
};
$(window.document).ready(function() {
//$ax.annotation.InitializeAnnotations($ax(function(dObj) { return dObj.annotation; }));
$ax.messageCenter.addMessageListener(function(message, data) {
//If the annotations are being hidden via the Sitemap toggle button, hide any open dialogs
if(message == 'annotationToggle') {
if (data == true) {
$('div.annnote').show();
} else {
$('div.annnote').hide();
}
}
});
});
//adjust annotation location to a element's top right corner
var _adjustIconLocation = $ax.annotation.adjustIconLocation = function(id, dObj) {
var ann = document.getElementById(id + "_ann");
if(ann) {
var corners = $ax.public.fn.getCornersFromComponent(id);
var width = $(ann).width();
var newTopRight = $ax.public.fn.vectorPlus(corners.relativeTopRight, corners.centerPoint);
//note size is 14x8, this is how rp calculated it as well
ann.style.left = (newTopRight.x - width) + "px";
var elementType = dObj ? dObj.type : $ax.getTypeFromElementId(id);
var yOffset = $ax.public.fn.IsTableCell(elementType) ? 0 : -8;
ann.style.top = (newTopRight.y + yOffset) + "px";
}
var ref = document.getElementById(id + "_ref");
if(ref) {
if(!corners) corners = $ax.public.fn.getCornersFromComponent(id);
var newBottomRight = $ax.public.fn.vectorPlus(corners.relativeBottomRight, corners.centerPoint);
ref.style.left = (newBottomRight.x - 8) + 'px';
ref.style.top = (newBottomRight.y - 10) + 'px';
}
}
});