https://paginehoreca.it/templates/general_olx/js/jquery.flModal.js

1/**
2 * jQuery modal window plugin by Flynax 
3 *
4 */
5(function($){
6    $.flModal = function(el, options){
7        var base = this;
8        var lock = false;
9        var direct = false;
10        var fullscreen_mode = false;
11        
12        // access to jQuery and DOM versions of element
13        base.$el = $(el);
14        base.el = el;
15        
16        base.objHeight = 0;
17        base.objWidth = 0;
18        base.sourceContent = false;
19
20        // add a reverse reference to the DOM object
21        base.$el.data("flModal", base);
22
23        base.init = function(){
24            base.options = $.extend({},$.flModal.defaultOptions, options);
25
26            // initialize working object id
27            if ( $(base.el).attr('id') ) {
28                base.options.id = $(base.el).attr('id');
29            }
30            else {
31                $(base.el).attr('id', base.options.id);
32            }
33            
34            fullscreen_mode = false;
35
36            // add mask on click
37            if ( base.options.click ) {
38                base.$el.click(function(){
39                    base.mask();
40                    base.loadContent();
41                });
42            }
43            else {
44                base.mask();
45                base.loadContent();
46            }
47        };
48
49        base.mask = function() {
50            var dom = '<div id="modal_mask" class="w-100"><div id="modal_block" class="modal_block"></div></div>';
51            
52            $('body').append(dom);
53            
54            if ( media_query == 'mobile' ) {
55                base.options.width = base.options.height = '100%';
56            }
57
58            if ( base.options.fill_edge ) {
59                $('#modal_block').addClass('fill-edge');
60            }
61
62            if ( base.options.width == '100%' && base.options.height == '100%' ) {
63                fullscreen_mode = true;
64                $('body > *:visible:not(#modal_mask)').addClass('tmp-hidden').hide();
65                $('#modal_block').addClass('fullscreen');
66                $('#modal_mask').show();
67                var width = '100%';
68                var height = '100%';
69            }
70            else {
71                var width = $(document).width();
72                var height = $(document).height();
73            }
74
75            $('#modal_mask').width(width);
76            $('#modal_mask').height(height);
77            $('#modal_block').width(base.options.width).height(base.options.height);
78
79            if ( !fullscreen_mode ) {
80                // on resize
81                $(window).bind('resize', base.resize);
82            
83                // on scroll    
84                if ( base.options.scroll ) {
85                    $(window).bind('scroll', base.scroll);
86                }
87            }
88        };
89        
90        base.resize = function() {
91            if ( lock )
92                return;
93
94            var width = $(window).width();
95            var height = $(document).height();
96            $('#modal_mask').width(width);
97            $('#modal_mask').height(height);
98            
99            var margin = ($(window).height()/2)-base.objHeight + $(window).scrollTop();
100            $('#modal_block').stop().animate({marginTop: margin});
101            
102            var margin = base.objWidth * -1;
103            $('#modal_block').stop().animate({marginLeft: margin});
104        };
105        
106        base.scroll = function() {
107            if (lock || media_query == 'tablet')
108                return;
109
110            var margin = ($(window).height()/2)-base.objHeight + $(window).scrollTop();
111            $('#modal_block').stop().animate({marginTop: margin});
112        };
113        
114        base.loadContent = function() {
115            /* load main block source */
116            var dom = '<div class="inner"><div class="modal_content"></div><div class="close" title="'+lang['close']+'"><div></div></div></div>';
117            $('div#modal_block').html(dom);
118
119            /* load content */
120            var content = '';
121            var caption_class = base.options.type ? ' '+base.options.type : '';
122            base.options.caption = base.options.type && !base.options.caption ? lang[base.options.type] : base.options.caption;
123            
124            /* save source */
125            if ( base.options.source ) {
126                if ( $(base.options.source + ' > div.tmp-dom').length > 0 ) {
127                    base.sourceContent = $(base.options.source + ' > div.tmp-dom');
128                    direct = true;
129                }
130                else {
131                    base.sourceContent = $(base.options.source).html();
132                }
133            }
134            
135            /* build content */
136            content = base.options.caption ? '<div class="caption'+caption_class+'">'+ base.options.caption + '</div>': '';
137            content += base.options.content ? base.options.content : '';
138            
139            /* clear soruce objects to avoid id overload */
140            if ( base.options.source && !direct ) {
141                $(base.options.source).html('');
142                content += !base.options.content ? base.sourceContent : '';
143            }
144            
145            
146            $('div#modal_block div.inner div.modal_content').html(content);
147            
148            if ( base.options.source && direct ) {
149                $('div#modal_block div.inner div.modal_content').append(base.sourceContent);
150            }
151            
152            if ( base.options.prompt ) {
153                var prompt = '<div class="prompt"><input name="ok" type="button" value="Ok" /> <a class="close" href="javascript:void(0)">'+lang['cancel']+'</a></div>';
154                $('div#modal_block div.inner div.modal_content').append(prompt);
155            }
156            
157            if ( base.options.ready ) {
158                base.options.ready();
159            }
160            
161            $('#modal_block input[name=close], #modal_block .close').click(function(){
162                base.closeWindow();
163            });
164            
165            if ( base.options.prompt ) {
166                $('#modal_block div.prompt input[name=close]').click(function(){
167                    base.closeWindow();
168                });
169                $('#modal_block div.prompt input[name=ok]').click(function(){
170                    var func = base.options.prompt;
171                    func += func.indexOf('(') < 0 ? '()' : '';
172                    eval(func);
173                    base.closeWindow();
174                });
175            }
176            
177            /* set initial sizes */
178            if ( !fullscreen_mode ) {
179                base.objHeight = $('#modal_block').height()/2;
180                base.objWidth = $('#modal_block').width()/2;
181                
182                var setTop = ($(window).height()/2) - base.objHeight + $(window).scrollTop();
183                $('#modal_block').css('marginTop', setTop);
184                var setLeft = base.objWidth * -1;
185                $('#modal_block').css('marginLeft', setLeft);
186            }
187            
188            $('#modal_mask').click(function(e){
189                if ( $(e.target).attr('id') == 'modal_mask' ) {
190                    base.closeWindow();
191                }
192            });
193            
194            $('#modal_block div.close').click(function(){
195                base.closeWindow();
196            });
197        };
198        
199        base.closeWindow = function() {
200            lock = true;
201            
202            $('#modal_block').animate({opacity: 0});
203            $('#modal_mask').animate({opacity: 0}, function(){
204                $(this).remove();
205                $('#modal_block').remove();
206                
207                if ( base.options.source ) {
208                    $(base.options.source).append(base.sourceContent);
209                }
210                
211                lock = false;

212            });
213
214            $(window).unbind('resize', base.resize);
215            $(window).unbind('scroll', base.scroll);
216
217            if ( fullscreen_mode ) {
218                $('body > *.tmp-hidden').show().removeClass('tmp-hidden');
219            }
220        };
221        
222        // run initializer
223        base.init();
224    };
225
226    $.flModal.defaultOptions = {
227        scroll: true,
228        type: false,
229        width: 340,
230        height: 230,
231        source: false,
232        content: false,
233        caption: false,
234        prompt: false,
235        click: true,
236        ready: false,
237        fill_edge: false
238    };
239    
240
241
242    $.fn.flModal = function(options){
243        return this.each(function(){
244            (new $.flModal(this, options));
245        });
246    };
247
248})(jQuery);