https://www.sinchew.com.my/public/js/easy-image-collage/public.js?ver=1.13.6

1jQuery(document).ready(function($) {
2    $('.eic-image').hover( function() {
3        $(this).find('[data-pin-log="button_pinit"]').show();
4        $(this).find('.eic-image-caption-hover').show();
5    }, function() {
6        $(this).find('[data-pin-log="button_pinit"]').hide();
7        $(this).find('.eic-image-caption-hover').hide();
8    });
9});
10
11// Based on https://github.com/kumailht/responsive-elements
12
13const responsive_breakpoint = parseInt( eic_public.responsive_breakpoint );
14const responsive_layout = '1' === eic_public.responsive_layout ? true : false;
15
16var EIC_Responsive = {
17    elementsSelector: '.eic-container',
18    maxRefreshRate: 5,
19    init: function() {
20        var self = this;
21        jQuery(function() {
22            self.el = {
23                window: jQuery(window),
24                responsive_elements: jQuery(self.elementsSelector)
25            };
26
27            self.events();
28        });
29    },
30    checkBreakpointOfAllElements: function() {
31        var self = EIC_Responsive;
32        self.el.responsive_elements.each(function(i, _el) {
33            var container = jQuery(_el);
34            self.checkBreakpointOfElement(container);
35
36            // Check if mobile or desktop version.
37            if ( container.width() < responsive_breakpoint ) {
38              container.removeClass( 'eic-container-desktop' );
39              container.addClass( 'eic-container-mobile' );
40
41              if ( responsive_layout ) {
42                container.addClass( 'eic-container-mobile-regular' );
43              }
44            } else {
45              container.addClass( 'eic-container-desktop' );
46              container.removeClass( 'eic-container-mobile' );
47              container.removeClass( 'eic-container-mobile-regular' );
48            }
49        });
50    },
51    checkBreakpointOfElement: function(_el) {
52        var frame = _el.find('.eic-frame');
53
54        var container_width = _el.width();
55        var frame_width = frame.outerWidth();
56        var orig_frame_width = frame.data('orig-width');
57        var frame_ratio = frame.data('ratio');
58
59        // Frame resize required if container is smaller or frame is smaller than original width
60        if(container_width < frame_width || frame_width < orig_frame_width) {
61            var new_frame_width = container_width;
62            if(new_frame_width > orig_frame_width) {
63                new_frame_width = orig_frame_width;
64            }
65
66            var change_ratio = new_frame_width / orig_frame_width;
67
68            // Borders
69            var orig_border = frame.data('orig-border');
70            var border = Math.ceil(orig_border * change_ratio);
71
72            // Change frame styling
73            frame
74                .css('width', new_frame_width + 'px')
75                .css('height', new_frame_width / frame_ratio + 'px')
76                .css('border-width', border + 'px');
77
78            _el.find('.eic-image').each(function() {
79                var image = jQuery(this);
80
81                if ( responsive_layout && container_width < responsive_breakpoint ) {                  
82                  // Change image styling (New)
83                  image.find('img')
84                      .style('position', 'static', 'important')
85                      .style('width', '100%', 'important')
86                      .style('height', 'auto', 'important')
87                      .style('left', '0', 'important')
88                      .style('top', '0', 'important');
89                } else {
90                  var size_x = Math.ceil(image.data('size-x') * change_ratio);
91                  var size_y = Math.ceil(image.data('size-y') * change_ratio);
92                  var pos_x = Math.ceil(image.data('pos-x') * change_ratio);
93                  var pos_y = Math.ceil(image.data('pos-y') * change_ratio);
94
95                  // Change image styling (Legacy)
96                  image
97                      .css('background-size', '' + size_x + 'px ' + size_y + 'px')
98                      .css('background-position', '' + pos_x + 'px ' + pos_y + 'px')
99                      .css('border-width', border + 'px');
100
101                  // Change image styling (New)
102                  image.find('img')
103                      .style('position', 'absolute', 'important')
104                      .style('width', '' + size_x + 'px', 'important')
105                      .style('height', '' + size_y + 'px', 'important')
106                      .style('left', '' + pos_x + 'px', 'important')
107                      .style('top', '' + pos_y + 'px', 'important');
108                }
109            });
110        }
111    },
112    events: function() {
113        this.checkBreakpointOfAllElements();
114
115        this.el.window.bind('resize', this.debounce(
116            this.checkBreakpointOfAllElements, this.maxRefreshRate));
117    },
118    // Debounce is part of Underscore.js 1.5.2 http://underscorejs.org

119    // (c) 2009-2013 Jeremy Ashkenas. Distributed under the MIT license.
120    debounce: function(func, wait, immediate) {
121        // Returns a function, that, as long as it continues to be invoked,
122        // will not be triggered. The function will be called after it stops
123        // being called for N milliseconds. If `immediate` is passed,
124        // trigger the function on the leading edge, instead of the trailing.
125        var result;
126        var timeout = null;
127        return function() {
128            var context = this,
129                args = arguments;
130            var later = function() {
131                timeout = null;
132                if (!immediate) result = func.apply(context, args);
133            };
134            var callNow = immediate && !timeout;
135            clearTimeout(timeout);
136            timeout = setTimeout(later, wait);
137            if (callNow) result = func.apply(context, args);
138            return result;
139        };
140    }
141};
142
143// Source: http://stackoverflow.com/questions/2655925/how-to-apply-important-using-css
144(function($) {    
145  if ($.fn.style) {
146    return;
147  }
148
149  // Escape regex chars with \
150  var escape = function(text) {
151    return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
152  };
153
154  // For those who need them (< IE 9), add support for CSS functions
155  var isStyleFuncSupported = !!CSSStyleDeclaration.prototype.getPropertyValue;
156  if (!isStyleFuncSupported) {
157    CSSStyleDeclaration.prototype.getPropertyValue = function(a) {
158      return this.getAttribute(a);
159    };
160    CSSStyleDeclaration.prototype.setProperty = function(styleName, value, priority) {
161      this.setAttribute(styleName, value);
162      var priority = typeof priority != 'undefined' ? priority : '';
163      if (priority != '') {
164        // Add priority manually
165        var rule = new RegExp(escape(styleName) + '\\s*:\\s*' + escape(value) +
166            '(\\s*;)?', 'gmi');
167        this.cssText =
168            this.cssText.replace(rule, styleName + ': ' + value + ' !' + priority + ';');
169      }
170    };
171    CSSStyleDeclaration.prototype.removeProperty = function(a) {
172      return this.removeAttribute(a);
173    };
174    CSSStyleDeclaration.prototype.getPropertyPriority = function(styleName) {
175      var rule = new RegExp(escape(styleName) + '\\s*:\\s*[^\\s]*\\s*!important(\\s*;)?',
176          'gmi');
177      return rule.test(this.cssText) ? 'important' : '';
178    }
179  }
180
181  // The style function
182  $.fn.style = function(styleName, value, priority) {
183    // DOM node
184    var node = this.get(0);
185    // Ensure we have a DOM node
186    if (typeof node == 'undefined') {
187      return this;
188    }
189    // CSSStyleDeclaration
190    var style = this.get(0).style;
191    // Getter/Setter
192    if (typeof styleName != 'undefined') {
193      if (typeof value != 'undefined') {
194        // Set style property
195        priority = typeof priority != 'undefined' ? priority : '';
196        style.setProperty(styleName, value, priority);
197        return this;
198      } else {
199        // Get style property
200        return style.getPropertyValue(styleName);
201      }
202    } else {
203      // Get CSSStyleDeclaration
204      return style;
205    }
206  };
207})(jQuery);
208
209EIC_Responsive.init();