https://cpq.gefran.com/store/_ui/responsive/common/js/Imager.min.js

1;(function (window, document) {
2	'use strict';
3
4	var  nextTick, addEvent;
5	nextTick = window.requestAnimationFrame ||
6			   window.mozRequestAnimationFrame ||
7			   window.webkitRequestAnimationFrame ||
8			   function (callback) {
9				   window.setTimeout(callback, 1000 / 60);
10			   };
11
12	addEvent = (function(){
13		if (document.addEventListener){
14			return function addStandardEventListener(el, eventName, fn){
15				return el.addEventListener(eventName, fn, false);
16			};
17		}
18		else {
19			return function addIEEventListener(el, eventName, fn){
20				return el.attachEvent('on'+eventName, fn);
21			};
22		}
23	})();
24
25	function Imager (elements, opts) {
26		var self = this,doc  = document;
27		opts = opts || {};
28
29		this.elements         = elements || '.js-responsive-image';
30		this.className        = opts.className || 'js-responsive-image-replaced';
31		this.onResize         = opts.hasOwnProperty('onResize') ? opts.onResize : true;
32		this.onImagesReplaced = opts.onImagesReplaced || function () {};
33
34		this.eles = $(elements);
35		nextTick(function(){self.init();});
36	}
37
38	Imager.prototype.init = function(){
39		this.checkImagesNeedReplacing(this.eles);
40		if(this.onResize){this.registerResizeEvent();}
41	};
42
43	Imager.prototype.checkImagesNeedReplacing = function (images) {
44		var self = this;
45
46		if (!this.isResizing) {
47			this.isResizing = true;
48
49			images.each(function(){self.replaceImagesBasedOnScreenDimensions(this);});
50			
51			this.isResizing = false;
52			this.onImagesReplaced(images);
53		}
54	};
55
56	Imager.prototype.replaceImagesBasedOnScreenDimensions = function (image) {
57		var src,availableWidths = [],srcARRAY,cwidth;
58
59		if( $(image).attr("data-media")!=undefined){
60			var eMedia = $(image).attr("data-media")
61			$(image).removeAttr("data-media")
62			eMedia = JSON.parse(eMedia)
63			$.each(eMedia, function(key, value) {
64				  availableWidths.push(parseInt(key));
65			});
66			$(image).data("width",availableWidths);
67			$(image).data("media",eMedia);
68		}
69
70		srcARRAY = $(image).data("media");
71		cwidth = Imager.getClosestValue(window.innerWidth, $.extend([],$(image).data("width")));
72
73		if(!srcARRAY[cwidth] || image.src == srcARRAY[cwidth]){return;}
74		image.src = srcARRAY[cwidth];
75	};
76
77	Imager.getClosestValue = function getClosestValue(baseValue, candidates){
78		if(baseValue >= candidates[0] && candidates.length > 1){
79			candidates.shift()
80			getClosestValue(baseValue,candidates)
81		}
82		return candidates[0];
83	}
84
85	Imager.prototype.registerResizeEvent = function(){
86		var self = this;
87		addEvent(window, 'resize', function(){
88			self.checkImagesNeedReplacing(self.eles);
89		});
90	};
91
92	if (typeof module === 'object' && typeof module.exports === 'object') {
93		module.exports = exports = Imager;
94	} else if (typeof define === 'function' && define.amd) {
95		define(function () { return Imager; });
96	} else if (typeof window === 'object') {
97		window.Imager = Imager;
98	}
99
100}(window, document));