https://www.carrieres-sous-poissy.fr/media/plg_system_imageeffectck/js/imageeffectck.js

1/**
2 * copyright	Copyright (C) 2015 Cedric KEIFLIN alias ced1870
3 * http://www.joomlack.fr
4 * http://www.template-creator.com
5 * license		GNU/GPL
6 * Image Effect CK
7 * @version 1.1.0
8 **/
9
10(function($) {
11	var ImageEffectck = function() {
12		// var image.wrap;
13		$("img[class^='effectck'], img.fadeck, img.edafck, img.puffck").each(function(i, image) {
14			// do only if the image is not yet wrapped
15			if (! $(image).parent().is('figure')) {
16
17			var w = $(image).attr('width');
18			var fl = $(image).css('float');
19
20			$(image).wrap('<figure class="imageeffectck ' + $(image).attr('class') + '"><div class="imageeffectck_img"></div></div>');
21			image.wrap = $(image).parent().parent();
22			image.wrapinner = $(image).parent();
23
24			var props = Array('border-top-left-radius'
25			, 'border-top-right-radius'
26			, 'border-bottom-left-radius'
27			, 'border-bottom-right-radius'
28			, 'float'
29			);
30
31			for (i=0;i<props.length;i++) {
32				catchCssProperty(image, props[i]);
33			}
34
35			// fix for Chrome
36			if (parseInt(w) > 0) {
37				image.wrap.width(w).css('max-width', '100%');
38			}
39			// if (fl) image.wrap.css('float', fl);
40
41			// get the the text from the image title
42			var imgtitle, txt_title, txt_desc;
43			if (imgtitle = $(image).attr('title')) {
44				imgtitle = imgtitle.split('::');
45				if (imgtitle.length >= 1) {
46					txt_title = imgtitle[0];
47				}
48				if (imgtitle.length >= 2) {
49					txt_desc = imgtitle[1];
50				}
51			}
52
53			// remove the attribute on the image to avoid conflicts
54			$(image).attr('class', '')
55					.attr('width', '')
56					.attr('height', '')
57					.attr('title', '')
58					.css('float', '');
59
60			// create the final code
61			image.wrapinner.append('<figcaption>'
62					+'<div>'
63						+ ( txt_title ? '<div class="imageeffectck_title">' + txt_title + '</div>' : '' )
64						+ ( txt_desc ? '<div class="imageeffectck_desc">' + txt_desc + '</div>' : '' )
65						// + ( $(image).attr('href', '') ? '<a href="' + $(image).attr('href') + '"></a>' : '' ) // il faut d�tecter parent ancre >> pas besoin l'ancre s'applique sur figure
66					+'</div>'
67					+'</figcaption>')
68			}
69
70			// for mobile only, allow the 1st tap to show the effect, 2nd tap to open the link
71			// check if there is a link on the figure
72			if (image.wrap.parents('a').length) {
73				image.wrap.parents('a')[0].addEventListener("touchstart", touchStart, false);
74
75				// initialize the data if we click outside
76				image.wrap.parent('a').on('mouseleave', (function(e) {
77					$(this).data('touch', '0');
78				}));
79			}
80		});
81
82		/**
83		 * Catch the tap event on touch device
84		 * 
85		 * @param {type} event
86		 * @returns void
87		 */
88		function touchStart(event) {
89			if (! $(this).attr('rel')) {
90				if ($(this).data('touch') !== '1') {
91					$(this).data('href', $(this).attr('href'));
92					$(this).removeAttr('href');
93					$(this).data('touch', '1');
94				} else {
95					$(this).attr('href', $(this).data('href'));
96					$(this).data('touch', '0');
97				}
98			}
99		}
100
101		/**
102		 * Catch the css of the image and apply it to the figure
103		 * 
104		 * @param {type} image
105		 * @param {type} prop
106		 * @returns {undefined}
107		 */
108		function catchCssProperty(image, prop) {
109			var v = $(image).css(prop);
110			if (parseInt(v)) {
111				$(image).css(prop, '');
112				$(image.wrap).css(prop, v);
113			}
114		}
115	}
116	window.ImageEffectck = ImageEffectck;
117})(jQuery);
118
119// autoloader
120jQuery(document).ready(function(){
121	new ImageEffectck();
122});