https://www.tkc.edu/wp-content/plugins/image-source-control/public/assets/js/captions.js?ver=2.23.0

1if ( document.readyState !== 'loading' ) {
2	ISCready();
3} else {
4	// DOMContentLoaded fires after the content is loaded, but before scripts and images.
5	document.addEventListener( 'DOMContentLoaded', ISCready );
6}
7
8// Use values from isc_front_data if available, otherwise use default values
9const ISC_FONT_SIZE                 = isc_front_data.font_size || '0.9em';
10const ISC_BACKGROUND_COLOR          = isc_front_data.background_color || '#333';
11const ISC_TEXT_COLOR                = isc_front_data.text_color || '#fff';
12const ISC_OPACITY                   = isc_front_data.opacity || 0.70;
13const ISC_PADDING                   = isc_front_data.padding || '0 0.15em';
14const ISC_DISPLAY                   = isc_front_data.display || 'block';
15const ISC_Z_INDEX                   = isc_front_data.z_index || '9999';
16const ISC_CAPTION_HORIZONTAL_MARGIN = isc_front_data.caption_horizontal_margin || 5;
17const ISC_CAPTION_VERTICAL_MARGIN   = isc_front_data.caption_vertical_margin || 5;
18
19/**
20 * Initialize ISC after the DOM was loaded
21 */
22function ISCready(){
23		/**
24		 * Move the caption into the image with a short delay so the images can fully load
25		 */
26		setTimeout( function(){
27			const captions = document.querySelectorAll( '.isc-source .isc-source-text' );
28			const l        = captions.length;
29			for ( let i = 0; i < l; i++ ) {
30				captions[i].setAttribute( "style", `position: absolute; font-size: ${ISC_FONT_SIZE}; background-color: ${ISC_BACKGROUND_COLOR}; color: ${ISC_TEXT_COLOR}; opacity: ${ISC_OPACITY}; padding: ${ISC_PADDING}; text-shadow: none; display: ${ISC_DISPLAY}` );
31				// Some themes handle the bottom padding of the attachment's div with the caption text (which is in between
32				// the image and the bottom border) not with the div itself. The following line set the padding on the bottom equal to the top.
33				captions[i].style.paddingBottom = window.getComputedStyle( captions[i] )['padding-top'];
34				// position the parent element (.isc-source)
35				isc_update_caption_position( captions[i].parentNode );
36			}
37		}, 100 );
38
39		/**
40		 * Load image source positions after the page – including images – loaded completely
41		 * this resolves occasionally misplaced sources
42		 */
43		window.addEventListener( 'load', function() {
44			// the additional timeout seems needed to make it work reliably on Firefox
45			setTimeout( function(){
46				isc_update_captions_positions();
47			}, 100 );
48		} );
49		/**
50		 * Register resize event to check caption positions
51		 */
52		window.addEventListener( 'resize', function() {
53			isc_update_captions_positions();
54		} );
55};
56
57/**
58 * Iterate through image source captions and set their position on the screen
59 */
60function isc_update_captions_positions() {
61	const captions = document.querySelectorAll( '.isc-source' );
62	const l        = captions.length;
63	for ( let i = 0; i < l; i++ ) {
64		isc_update_caption_position( captions[i] );
65	}
66}
67
68/**
69 * Position a single image source caption
70 *
71 * @param el image source caption that needs positioning
72 */
73function isc_update_caption_position( el ) {
74	const caption = el.querySelector( '.isc-source-text' );
75	if ( ! caption ) {
76		return;
77	}
78
79	let att = el.querySelector( 'img' );
80	let is_fallback = false;
81	// fall back to the current main container to get the width and height, if no image was found. This could be a background image defined in CSS
82	if ( ! att ) {
83		att = el;
84		is_fallback = true;
85	}
86	// look for the actual width and height as a fallback, if these attributes are not set
87	const attw = att instanceof HTMLImageElement ? att.width : att.offsetWidth;
88	const atth = att instanceof HTMLImageElement ? att.height : att.offsetHeight;
89
90	// relative position
91	const l = ! is_fallback ? att.offsetLeft : 0;
92	const t = ! is_fallback ? att.offsetTop : 0;
93
94	// caption width + padding & margin (after moving onto image)
95	const tw = ISCouterWidth( caption );
96	// caption height + padding (idem)
97	const th = ISCouterHeight( caption );
98
99	const attpl = ! is_fallback ? parseInt( window.getComputedStyle( att )[ 'padding-left' ].substring( 0, window.getComputedStyle( att )[ 'padding-left' ].indexOf( 'px' ) ) ) : 0;
100	const attpt = ! is_fallback ? parseInt( window.getComputedStyle( att )[ 'padding-top' ].substring( 0, window.getComputedStyle( att )[ 'padding-top' ].indexOf( 'px' ) ) ) : 0;
101	const attml = ! is_fallback ? parseInt( window.getComputedStyle( att )[ 'margin-left' ].substring( 0, window.getComputedStyle( att )[ 'margin-left' ].indexOf( 'px' ) ) ) : 0;
102	const attmt = ! is_fallback ? parseInt( window.getComputedStyle( att )[ 'margin-top' ].substring( 0, window.getComputedStyle( att )[ 'margin-top' ].indexOf( 'px' ) ) ) : 0;
103
104	// caption horizontal margin
105	const tml = ISC_CAPTION_HORIZONTAL_MARGIN;
106	// caption vertical margin
107	const tmt = ISC_CAPTION_VERTICAL_MARGIN;
108
109	const pos = isc_front_data.caption_position;
110	let posl  = 0;
111	let post  = 0;
112	switch (pos) {
113		case 'top-left':
114			posl = l + attpl + attml + tml;
115			post = t + attpt + attmt + tmt;
116			break;
117		case 'top-center':
118			posl = l + (Math.round( attw / 2 ) - (Math.round( tw / 2 ))) + attpl + attml;
119			post = t + attpt + attmt + tmt;
120			break;
121		case 'top-right':

122			posl = l - attpl + attml - tml + attw - tw;
123			post = t + attpt + attmt + tmt;
124			break;
125		case 'center':
126			posl = l + (Math.round( attw / 2 ) - (Math.round( tw / 2 ))) + attpl + attml;
127			post = t + (Math.round( atth / 2 ) - (Math.round( th / 2 ))) + attpt + attmt;
128			break;
129		case 'bottom-left':
130			posl = l + attpl + attml + tml;
131			post = t - attpt + attmt - tmt - th + atth;
132			break;
133		case 'bottom-center':
134			posl = l + (Math.round( attw / 2 ) - (Math.round( tw / 2 ))) + attpl + attml;
135			post = t + attpt + attmt - tmt - th + atth;
136			break;
137		case 'bottom-right':
138			posl = l - attpl + attml - tml + attw - tw;
139			post = t + attpt + attmt - tmt - th + atth;
140			break;
141	}
142	caption.style.left   = posl + 'px';
143	caption.style.top    = post + 'px';
144	caption.style.zIndex = ISC_Z_INDEX;
145}
146
147/**
148 * Mimics `outerWidth(true)` which includes margins
149 *
150 * @source http://youmightnotneedjquery.com/
151 */
152function ISCouterWidth(el) {
153	let style = getComputedStyle( el );
154
155	return el.offsetWidth + parseInt( style.marginLeft ) + parseInt( style.marginRight );
156}
157
158/**
159 * Mimics `outerHeight(true)` which includes margins
160 *
161 * @source http://youmightnotneedjquery.com/
162 */
163function ISCouterHeight(el) {
164	let style = getComputedStyle( el );
165
166	return el.offsetHeight + parseInt( style.marginTop ) + parseInt( style.marginBottom );
167}