https://www.sanitana.com/o/local-brands-theme/js/lib/scrollSync.js

1/*
2 * jQuery scrollsync Plugin
3 * version: 1.0 (30 -Jun-2009)
4 * Copyright (c) 2009 Miquel Herrera
5 *
6 * Dual licensed under the MIT and GPL licenses:
7 *   http://www.opensource.org/licenses/mit-license.php
8 *   http://www.gnu.org/licenses/gpl.html
9 *
10 */
11;(function($){ // secure $ jQuery alias
12
13/**
14 * Synchronizes scroll of one element (first matching targetSelector filter)
15 * with all the rest meaning that the rest of elements scroll will follow the 
16 * matched one.
17 * 
18 * options is composed of the following properties:
19 *    ------------------------------------------------------------------------
20 *    targetSelector    | A jQuery selector applied to filter. The first element of
21 *                    | the resulting set will be the target all the rest scrolls
22 *                    | will be synchronised against. Defaults to ':first' which 
23 *                    | selects the first element in the set.
24 *    ------------------------------------------------------------------------
25 *    axis            | sets the scroll axis which will be synchronised, can be
26 *                    | x, y or xy. Defaults to xy which will synchronise both.
27 *    ------------------------------------------------------------------------
28 */
29$.fn.scrollsync = function( options ){
30    var settings = $.extend(
31            {   
32                targetSelector:':first',
33                axis: 'xy'
34            },options || {});
35    
36    
37    function scrollHandler(event) {
38        if (event.data.xaxis){
39            event.data.followers.scrollLeft(event.data.target.scrollLeft());
40        }
41        if (event.data.yaxis){
42            event.data.followers.scrollTop(event.data.target.scrollTop());
43        }
44    }
45    
46    // Find target to follow and separate from followers
47    settings.target = this.filter(settings.targetSelector).filter(':first');
48    settings.followers=this.not(settings.target); // the rest of elements
49
50    // Parse axis
51    settings.xaxis= (settings.axis=='xy' || settings.axis=='x') ? true : false; 
52    settings.yaxis= (settings.axis=='xy' || settings.axis=='y') ? true : false;
53    if (!settings.xaxis && !settings.yaxis) return;  // No axis left 
54    
55    // bind scroll event passing array of followers
56    settings.target.bind('scroll', settings, scrollHandler);
57    
58}; // end plugin scrollsync
59
60})( jQuery ); // confine scope
61
62/*
63 * jQuery dragscrollable Plugin
64 * version: 1.0 (25-Jun-2009)
65 * Copyright (c) 2009 Miquel Herrera
66 *
67 * Dual licensed under the MIT and GPL licenses:
68 *   http://www.opensource.org/licenses/mit-license.php
69 *   http://www.gnu.org/licenses/gpl.html
70 *
71 */
72;(function($){ // secure $ jQuery alias
73
74/**
75 * Adds the ability to manage elements scroll by dragging
76 * one or more of its descendant elements. Options parameter
77 * allow to specifically select which inner elements will
78 * respond to the drag events.
79 * 
80 * options properties:
81 * ------------------------------------------------------------------------        
82 *  dragSelector         | jquery selector to apply to each wrapped element 
83 *                       | to find which will be the dragging elements. 
84 *                       | Defaults to '>:first' which is the first child of 
85 *                       | scrollable element
86 * ------------------------------------------------------------------------        
87 *  acceptPropagatedEvent| Will the dragging element accept propagated 
88 *                         | events? default is yes, a propagated mouse event 
89 *                         | on a inner element will be accepted and processed.
90 *                         | If set to false, only events originated on the
91 *                         | draggable elements will be processed.
92 * ------------------------------------------------------------------------
93 *  preventDefault       | Prevents the event to propagate further effectivey
94 *                       | dissabling other default actions. Defaults to true
95 * ------------------------------------------------------------------------
96 *  
97 *  usage examples:
98 *
99 *  To add the scroll by drag to the element id=viewport when dragging its 
100 *  first child accepting any propagated events
101 *    $('#viewport').dragscrollable(); 
102 *
103 *  To add the scroll by drag ability to any element div of class viewport
104 *  when dragging its first descendant of class dragMe responding only to
105 *  evcents originated on the '.dragMe' elements.
106 *    $('div.viewport').dragscrollable({dragSelector:'.dragMe:first',
107 *                                      acceptPropagatedEvent: false});
108 *
109 *  Notice that some 'viewports' could be nested within others but events
110 *  would not interfere as acceptPropagatedEvent is set to false.
111 *        
112 */
113
114
115$.fn.dragscrollable = function( options ){
116   
117    var settings = $.extend(
118        {   
119            dragSelector:'>:first',
120            acceptPropagatedEvent: true,
121            preventDefault: true
122        },options || {});
123 
124    var dragscroll= {
125        mouseDownHandler : function(event) {
126            // mousedown, left click, check propagation
127            if (event.which!=1 ||
128                (!event.data.acceptPropagatedEvent && event.target != this)){ 
129                return false; 
130            }
131            
132            // Initial coordinates will be the last when dragging
133            event.data.lastCoord = {left: event.clientX, top: event.clientY}; 
134            event.data.initCoord = event.data.lastCoord
135            
136            $.event.add( document, "mouseup", 
137                         dragscroll.mouseUpHandler, event.data );
138            $.event.add( document, "mousemove", 
139                         dragscroll.mouseMoveHandler, event.data );
140            if (event.data.preventDefault) {
141                event.preventDefault();
142                return false;
143            }
144        },
145        mouseMoveHandler : function(event) { // User is dragging
146            // How much did the mouse move?
147            
148            var delta = {left: (event.clientX - event.data.lastCoord.left),
149                         top: (event.clientY - event.data.lastCoord.top)};

150            
151            // Set the scroll position relative to what ever the scroll is now
152            event.data.scrollable.scrollLeft(
153                            event.data.scrollable.scrollLeft() - delta.left);
154            event.data.scrollable.scrollTop(
155                            event.data.scrollable.scrollTop() - delta.top);
156            
157            // Save where the cursor is
158            event.data.lastCoord={left: event.clientX, top: event.clientY}
159            if (event.data.preventDefault) {
160                event.preventDefault();
161                return false;
162            }
163
164        },
165        mouseUpHandler : function(event) { // Stop scrolling
166            $.event.remove( document, "mousemove", dragscroll.mouseMoveHandler);
167            $.event.remove( document, "mouseup", dragscroll.mouseUpHandler);
168            if (event.data.preventDefault) {
169                console.log(event.data.lastCoord.left == event.data.initCoord.left);
170                // Change by Mateus Guerra, based in solution found in stack overflow
171                // https://stackoverflow.com/questions/13513077/disable-links-when-clicking-and-dragging-to-scroll-jquery
172                // Test if event scroll displacement left or top are unequal in order to prevent click 
173                if(event.data.lastCoord.left != event.data.initCoord.left || event.data.lastCoord.top != event.data.initCoord.top ){
174                    obj = $(this); 
175                    $('a', obj).on('click', function(event) {
176                     event.preventDefault();                      
177                    });
178                    setTimeout(function(){$('a', obj).off('click'); },300);
179                }
180                event.preventDefault();
181                return false;
182            }
183        }
184    }
185    
186    // set up the initial events
187    this.each(function() {
188        // closure object data for each scrollable element
189        var data = {scrollable : $(this),
190                    acceptPropagatedEvent : settings.acceptPropagatedEvent,
191                    preventDefault : settings.preventDefault }
192        // Set mouse initiating event on the desired descendant
193        $(this).find(settings.dragSelector).
194                        bind('mousedown', data, dragscroll.mouseDownHandler);
195    });
196}; //end plugin dragscrollable
197
198})( jQuery ); // confine scope