https://www.abct.org/wp-content/plugins/wpdevart_chart_premium/front/js/front_popup.js?ver=10.0

1function wpdaOrgChartPopup() {
2	this.defParams = {
3		'ClickAreaClass': 'wpda_tree_open_popup_el',
4		'contentClass': 'wpda_tree_popup_content',
5		'adminBarHeight': '0',
6		'currentView': 'desktop',
7		'elementIndex': 0,
8		'offsettop': 0,
9		'closeSectionHeight': 0,
10		'popupWindowHeight': 0,
11		'popupWindowWidth': 0,
12		'events': new Array(),
13	};
14	this.innerElements = {};
15	this.popupElements = new Array();
16}
17
18wpdaOrgChartPopup.prototype.init = function () {
19	let self = this;
20	this.calcViewType();
21	this.loadElements();
22	this.fixThemeValues();
23	this.addElementsFunctionality();
24	window.addEventListener('resize', function () {
25		self.resizePopup();
26	});
27}
28
29wpdaOrgChartPopup.prototype.loadElements = function () {
30	let popupLinks = document.getElementsByClassName(this.defParams.ClickAreaClass), i = 0;
31	while (i in popupLinks) {
32		this.popupElements[i] = {};
33		this.popupElements[i]['clickElement'] = popupLinks[i];
34		if (this.popupElements[i]['clickElement'].getElementsByClassName('wpda_tree_popup_content')[0] != null) {
35			this.popupElements[i]['popupContent'] = this.popupElements[i]['clickElement'].getElementsByClassName('wpda_tree_popup_content')[0];
36		} else {
37			this.popupElements[i]['popupContent'] = this.popupElements[i]['clickElement'].parentElement.getElementsByClassName('wpda_tree_popup_content')[0];
38		}
39		this.popupElements[i]['popupTheme'] = this.popupElements[i]['popupContent'].getAttribute('date-popup-theme');
40		i++;
41		if (i > 10000) {
42			alert("error in js");
43			break;
44		}
45	}
46}
47wpdaOrgChartPopup.prototype.addElementsFunctionality = function () {
48	let self = this, i = 0;
49	while (i in this.popupElements) {
50		(function (j) {
51			self.popupElements[j]['clickElement'].addEventListener('click', function () {
52				self.defParams['elementIndex'] = j;
53				self.createOverlay(j);
54				self.createPopup(j);
55			})
56		}(i))
57		i++;
58	}
59}
60
61wpdaOrgChartPopup.prototype.createOverlay = function (elementIndex) {
62	let self = this, themeId = this.popupElements[elementIndex]['popupTheme']
63	this.innerElements['overlay'] = this.createHtmlElement('div', { 'id': 'wpdaOrgChartOverlay', 'style': 'position:fixed;left:0px;top:0px;width:100%;height:100%;background-image: linear-gradient(' + this.gradientToString(wpda_org_chart_popup_theme[themeId]['overlay_bg_color']) + ');' });
64	document.getElementsByTagName('body')[0].appendChild(this.innerElements['overlay']);
65	if (wpda_org_chart_popup_theme[themeId]['close_aditional'] == 'esc_click') {
66		this.innerElements['overlay'].addEventListener('click', function () {
67			self.remove();
68		})
69		let eventObject = {};
70		eventObject['eventFunction'] = function (e) {
71			if (e.code == 'Escape' || e.key == 'escape') {
72				self.remove();
73			}
74		}
75		eventObject['eventName'] = 'keydown';
76		eventObject['element'] = document;
77		self.defParams['events'].push(eventObject);
78		eventObject['element'].addEventListener(eventObject['eventName'], eventObject['eventFunction'])
79	}
80	if (wpda_org_chart_popup_theme[themeId]['close_aditional'] == 'esc') {
81		let eventObject = {};
82		eventObject['eventFunction'] = function (e) {
83			if (e.code == 'Escape' || e.key == 'escape') {
84				self.remove();
85			}
86		}
87		eventObject['eventName'] = 'keydown';
88		eventObject['element'] = document;
89		self.defParams['events'].push(eventObject);
90		eventObject['element'].addEventListener(eventObject['eventName'], eventObject['eventFunction'])
91	}
92	if (wpda_org_chart_popup_theme[themeId]['close_aditional'] == 'click') {
93		this.innerElements['overlay'].addEventListener('click', function () {
94			self.remove();
95		})
96	}
97}
98
99wpdaOrgChartPopup.prototype.createCloseSection = function (elementIndex) {
100	let self = this, themeId = this.popupElements[elementIndex]['popupTheme'], theme = wpda_org_chart_popup_theme[themeId];
101	if (theme['close_button_text']['desktop'] != '') {
102		let fontStyle = '';
103		fontStyle += 'font-family:' + theme['close_button_text_font_family'] + ';';
104		fontStyle += 'color:' + theme['close_button_text_color'] + ';';
105		fontStyle += 'font-size:' + theme['close_button_text_font_size']['desktop'] + theme['close_button_text_font_size']['metric_desktop'] + ';';
106		fontStyle += 'letter-spacing:' + theme['close_button_text_letter_spacing']['desktop'] + theme['close_button_text_letter_spacing']['metric_desktop'] + ';';
107		fontStyle += 'line-height:' + theme['close_button_text_line_height']['desktop'] + theme['close_button_text_line_height']['metric_desktop'] + ';';
108		fontStyle += 'font-weight:' + theme['close_button_text_font_weight'] + ';'
109		fontStyle += 'font-style:' + theme['close_button_text_font_style'] + ';'
110
111		if (theme['close_section_type'] == 'section') {
112			this.innerElements['closeSection'] = this.createHtmlElement('div', { 'id': 'wpd

112aOrgChartCloseSection', 'style': 'text-align: right;border-bottom:' + this.borderToString(theme['close_section_border_bottom_width'], theme['close_section_border_bottom_type'], theme['close_section_border_bottom_color'] + ';' + 'background-color:' + theme['close_button_section_bg_color'] + ';') });
113			var textSpan = this.createHtmlElement('span', { 'style': fontStyle }, theme['close_button_text']['desktop']);
114			this.innerElements['closeSection'].appendChild(textSpan);
115			this.innerElements['popupWindow'].prepend(this.innerElements['closeSection']);
116			this.defParams['closeSectionHeight'] = this.innerElements['closeSection'].getBoundingClientRect().height;
117		} else {
118			var textSpan = this.createHtmlElement('span', { 'style': 'position:absolute;right: 5px;z-index:9999;' + fontStyle }, theme['close_button_text']['desktop']);
119			this.innerElements['popupWindow'].prepend(textSpan);
120		}
121		textSpan.addEventListener('click', function () {
122			self.remove();
123		})
124	}
125}
126
127wpdaOrgChartPopup.prototype.createPopup = function (elementIndex) {
128	let self = this, themeId = this.popupElements[elementIndex]['popupTheme'], theme = wpda_org_chart_popup_theme[themeId], classs = '', duration = 50;
129	if( theme['popup_animation_time'] != null && typeof(theme['popup_animation_time']['desktop']) != 'undefined' ){
130		duration = Math.max(50, parseInt(theme['popup_animation_time']['desktop']));
131	}
132	if (theme['popup_animation_type'] != 'disable') {
133		classs = 'wpda_animation_' + theme['popup_animation_type'];
134		setTimeout(function () {
135			self.innerElements['popupWindow'].setAttribute('class', '');
136		}, duration)
137	}
138	this.innerElements['popupWindow'] = this.createHtmlElement('div', { 'id': 'wpdaOrgChartPopupWindow' });
139	this.innerElements['popupWindow'].appendChild(this.popupElements[elementIndex]['popupContent'].children[0]);
140	document.getElementsByTagName('body')[0].appendChild(this.innerElements['popupWindow']);
141	this.innerElements['popupWindow'].setAttribute('style', this.popupStyle(themeId));
142	// left and top value need generate after popup width and height is initial
143	this.innerElements['popupWindow'].style.left = this.leftPosition(themeId);
144	this.innerElements['popupWindow'].style.top = this.topPosition(themeId);
145	this.innerElements['popupWindow'].style.animationDuration = duration + 'ms';
146	self.innerElements['popupWindow'].setAttribute('class', classs);
147	this.createCloseSection(elementIndex);	
148	this.innerElements['popupWindow'].getElementsByClassName('wpda_popup_innerhtml')[0].style.paddingTop = theme['padding'][this.defParams['currentView'] +'_top'] + 'px ';
149	this.innerElements['popupWindow'].getElementsByClassName('wpda_popup_innerhtml')[0].style.paddingRight = theme['padding'][this.defParams['currentView'] +'_right'] + 'px ';
150	this.innerElements['popupWindow'].getElementsByClassName('wpda_popup_innerhtml')[0].style.paddingBottom = theme['padding'][this.defParams['currentView'] +'_bottom'] + 'px ';
151	this.innerElements['popupWindow'].getElementsByClassName('wpda_popup_innerhtml')[0].style.paddingLeft = theme['padding'][this.defParams['currentView'] +'_left'] + 'px';
152	console.log(this.innerElements['popupWindow'].offsetHeight)
153	this.innerElements['popupWindow'].getElementsByClassName('wpda_popup_innerhtml')[0].style.maxHeight = this.innerElements['popupWindow'].offsetHeight - parseInt(theme['popup_border_width']['desktop']) * 2 - parseInt(this.defParams['closeSectionHeight']) + 1 + 'px';
154}
155
156wpdaOrgChartPopup.prototype.leftPosition = function (themeId) {
157	let theme = wpda_org_chart_popup_theme[themeId], metricView = 'metric_' + this.defParams['currentView'];
158	if (theme['popup_width'][this.defParams['currentView']] != '') {
159		var el_width = theme['popup_width'][this.defParams['currentView']] + theme['popup_width'][metricView];
160	}
161	if (this.innerElements['popupWindow'].getBoundingClientRect != null) {
162		var el_width = this.innerElements['popupWindow'].getBoundingClientRect().width;
163	}
164	if (!(typeof (el_width) != 'undefined' && el_width != 0)) {
165		var el_width = '550';
166	}
167	switch (parseInt(theme['popup_position'])) {
168		case 1:
169		case 4:
170		case 7:
171			return 0 + 'px';
172			break;
173		case 2:
174		case 5:

175		case 8:
176			return (this.innerElements['overlay'].offsetWidth - parseInt(el_width)) / 2 + 'px';
177			break;
178		case 3:
179		case 6:
180		case 9:
181			return (this.innerElements['overlay'].offsetWidth - parseInt(el_width)) + 'px';
182			break;
183	}
184}
185
186wpdaOrgChartPopup.prototype.topPosition = function (themeId) {
187	let theme = wpda_org_chart_popup_theme[themeId], metricView = 'metric_' + this.defParams['currentView'], offsetTop = 0;
188	if (theme['popup_width'][this.defParams['currentView']] != '') {
189		var el_height = theme['popup_height'][this.defParams['currentView']] + theme['popup_height'][metricView];
190	}
191	if (this.innerElements['popupWindow'].getBoundingClientRect != null) {
192		var el_height = this.innerElements['popupWindow'].getBoundingClientRect().height;
193	}
194	if (!(typeof (el_height) != 'undefined' && el_height != 0)) {
195		var el_height = '550';
196	}
197	if (theme['popup_fixed_postion'] == 'relative') {
198		offsetTop = window.scrollY;
199	}
200	switch (parseInt(theme['popup_position'])) {
201		case 1:
202		case 2:
203		case 3:
204			return offsetTop + 'px';
205			break;
206		case 4:
207		case 5:
208		case 6:
209			return (this.innerElements['overlay'].offsetHeight - parseInt(el_height)) / 2 + offsetTop + 'px';
210			break;
211		case 7:
212		case 8:
213		case 9:
214			return (this.innerElements['overlay'].offsetHeight - parseInt(el_height)) + offsetTop + 'px';
215			break;
216	}
217}
218
219wpdaOrgChartPopup.prototype.resizePopup = function () {
220	let self = this;
221	self.calcViewType();
222	if (self.innerElements['popupWindow'] != null) {
223		self.innerElements['popupWindow'].setAttribute('style', self.popupStyle(self.popupElements[self.defParams['elementIndex']]['popupTheme']));
224		self.innerElements['popupWindow'].style.left = self.leftPosition(self.popupElements[self.defParams['elementIndex']]['popupTheme']);
225		self.innerElements['popupWindow'].style.top = self.topPosition(self.popupElements[self.defParams['elementIndex']]['popupTheme']);
226	}
227}
228
229
230wpdaOrgChartPopup.prototype.OffsetFromTop = function () {
231	let top = (window.pageYOffset || document.documentElement.scrollTop) - (document.documentElement.clientTop || 0);
232	this.param.OffsetFromTop = top;
233}
234
235wpdaOrgChartPopup.prototype.remove = function () {
236	let self = this;
237	this.popupElements[this.defParams['elementIndex']]['popupContent'].appendChild(this.innerElements['popupWindow'].getElementsByClassName('wpda_popup_innerhtml')[0]);
238	for (let j = 0; j < self.defParams['events'].length; j++) {
239		self.defParams['events'][j]['element'].removeEventListener(self.defParams['events'][j]['eventName'], self.defParams['events'][j]['eventFunction']);
240	}
241	this.innerElements['popupWindow'].remove();
242	this.innerElements['overlay'].remove();
243}
244
245wpdaOrgChartPopup.prototype.calculateAdminBarHeight = function () {
246	wv = window.innerWidth;
247	wh = window.innerHeight;
248	let adminBar = document.getElementById('wpadminbar');
249	if (adminBar == null) return;
250	if (typeof (adminBar.getBoundingClientRect) != 'undefined') {
251		this.param.adminBarHeight = adminBar.getBoundingClientRect().height;
252		return;
253	}
254	this.param.adminBarHeight = '32';
255}
256
257wpdaOrgChartPopup.prototype.popupStyle = function (themeId) {
258	let self = this;
259	let style = '', positionConvert = { 'relative': 'absolute', 'fixed': 'fixed' }, theme = wpda_org_chart_popup_theme[themeId], metricView = 'metric_' + this.defParams['currentView'], animDuration = 50;
260	style += 'position:' + positionConvert[theme['popup_fixed_postion']]; // inside parameter value is fixed or relative
261	style += ';background-image: linear-gradient(' + this.gradientToString(theme['popup_bg_color']) + ');';
262	style += ';border:' + this.borderToString(theme['popup_border_width'], theme['popup_border_type'], theme['popup_border_color']);
263	style += ';border-radius:' + parseInt(theme['popup_border_radius']['desktop']) + theme['popup_border_radius']['metric_desktop'];
264	if (theme['popup_width'][this.defParams['currentView']] != '') {
265		style += ";max-width:" + theme['popup_width'][this.defParams['currentView']] + theme['popup_width'][metricView];
266	}
267	if (theme['popup_height'][this.defParams['currentView']] != '') {
268		style += ";max-height:" + theme['popup_height'][this.defParams['currentView']] + theme['popup_height'][metricView];
269	}
270	return style;
271}
272
273wpdaOrgChartPopup.prototype.calcViewType = function () {
274	if (window.innerWidth < parseInt(wpda_org_chart_responsive_sizes['mobile'])) {
275		this.defParams['currentView'] = 'mobile';
276		return;
277	}
278	if (window.innerWidth < parseInt(wpda_org_chart_responsive_sizes['tablet'])) {
279		this.defParams['currentView'] = 'tablet';
280		return;
281	}
282	this.defParams['currentView'] = 'desktop';
283	return;
284}
285/*helper functions*/
286wpdaOrgChartPopup.prototype.createHtmlElement = function (tag = "", attr = {}, innerHTML = "") {
287	let el = document.createElement(tag);
288	for (const key in attr) {
289		el.setAttribute(key, attr[key]);
290	}
291	if (innerHTML != '') {

292		el.innerHTML = innerHTML;
293	}
294	return el;
295}
296
297wpdaOrgChartPopup.prototype.gradientToString = function (gradient) {
298	if (gradient == null) {
299		return '';
300	}
301	let color1 = "rgba(255,255,255,0)", color2 = "rgba(255,255,255,0)", direction = "to left";
302	if ("color1" in gradient && "color2" in gradient && "gradient" in gradient) {
303		color1 = gradient['color1'];
304		color2 = gradient['color2'];
305		if (gradient['gradient'] != 'none') {
306			direction = gradient['gradient'];
307		} else {
308			color2 = color1;
309		}
310	}
311	return direction + ',' + color1 + ',' + color2;
312}
313
314wpdaOrgChartPopup.prototype.borderToString = function (borderWidth, borderType, borderColor) {
315	return border = parseInt(borderWidth['desktop']) + borderWidth['metric_desktop'] + " " + borderType + " " + borderColor;
316}
317
318wpdaOrgChartPopup.prototype.fixThemeValues = function () {
319	let types = ['desktop', 'tablet', 'mobile'];
320	if (typeof wpda_org_chart_popup_theme != 'undefined')
321		for (let i = 0; i < wpda_org_chart_popup_theme.length; i++) {
322			if (typeof (wpda_org_chart_popup_theme[i]) == 'undefined')
323				continue;
324			for (const key in wpda_org_chart_popup_theme[i]) {
325				// if value is not numeric then metric is empty
326				if (typeof (wpda_org_chart_popup_theme[i][key]) == 'object' && wpda_org_chart_popup_theme[i][key] != null) {
327					for (let k = 0; k < types.length; k++) {
328						if (types[k] in wpda_org_chart_popup_theme[i][key] && wpda_org_chart_popup_theme[i][key]['desktop'] != '') {
329							if ('metric_' + types[k] in wpda_org_chart_popup_theme[i][key] && wpda_org_chart_popup_theme[i][key]['metric_' + types[k]] != '') {
330								if (isNaN(wpda_org_chart_popup_theme[i][key][types[k]])) {
331									wpda_org_chart_popup_theme[i][key]['metric_' + types[k]] = '';
332								}
333							}
334						}
335					}
336				}
337				// if mobile and tablet value don't filled it's equaled desktop value(on responsive parameters)
338				if (typeof (wpda_org_chart_popup_theme[i][key]) == 'object' && wpda_org_chart_popup_theme[i][key] != null) {
339					if ('desktop' in wpda_org_chart_popup_theme[i][key] && wpda_org_chart_popup_theme[i][key]['desktop'] != '') {
340						if ('mobile' in wpda_org_chart_popup_theme[i][key] && wpda_org_chart_popup_theme[i][key]['mobile'] == '') {
341							wpda_org_chart_popup_theme[i][key]['mobile'] = wpda_org_chart_popup_theme[i][key]['desktop'];
342							if ('metric_desktop' in wpda_org_chart_popup_theme[i][key] && 'metric_mobile' in wpda_org_chart_popup_theme[i][key])
343								wpda_org_chart_popup_theme[i][key]['metric_mobile'] = wpda_org_chart_popup_theme[i][key]['metric_desktop'];
344						}
345						if ('tablet' in wpda_org_chart_popup_theme[i][key] && wpda_org_chart_popup_theme[i][key]['tablet'] == '') {
346							wpda_org_chart_popup_theme[i][key]['tablet'] = wpda_org_chart_popup_theme[i][key]['desktop'];
347							if ('metric_desktop' in wpda_org_chart_popup_theme[i][key] && 'metric_tablet' in wpda_org_chart_popup_theme[i][key])
348								wpda_org_chart_popup_theme[i][key]['metric_tablet'] = wpda_org_chart_popup_theme[i][key]['metric_desktop'];
349						}
350					}
351				}
352
353			}
354		}
355}
356
357document.addEventListener('DOMContentLoaded', function () {
358	var wpdaOrgChartPopupObject = new wpdaOrgChartPopup();
359	wpdaOrgChartPopupObject.init();
360})