https://comerciojusto.org/wp-content/plugins/comerciojusto_features/resources/app.js?ver=1790936484

1var $ = jQuery;
2
3class FilterAndSearchApp
4{
5    constructor(all_posts)
6    {
7        this.all_posts = collect( all_posts );
8        this.filtered_posts = this.all_posts;
9        this.last_search = null;
10        this.posts_container = $('#posts-container');
11        this.filter_listeners();
12    }
13
14    resetPosts( event )
15    {
16        var obj = event.data.obj;
17        if (this.filtered_posts)
18        {
19            this.filtered_posts = this.all_posts;
20        } else {
21            obj.filtered_posts = obj.all_posts;        
22        }
23        event.data.obj.send_event('posts_list_change');
24    }
25        
26    filter_listeners()
27    {
28        $( '.category-filter' ).bind( 'click', { obj: this }, this.termFilter );
29        $( '.content-search').bind( 'keyup change touchend', { obj: this }, this.searchDelay );
30        $( '.category-reset' ).bind( 'click', { obj: this }, this.resetPosts );
31    }
32    
33    termFilter( event )
34    {
35        var obj = event.data.obj;
36        var term_id = $(event.currentTarget).data('term');
37        if (term_id) {
38            obj.filtered_posts = obj.all_posts.filter(
39                (value, key) => collect(value.terms).contains('id', term_id)
40            );
41        } else {
42        	obj.filtered_posts = obj.all_posts;
43        }
44
45        //console.log("..termFilter");
46        obj.send_event('posts_list_change');
47    }
48    
49    searchDelay( event )
50    {
51        var obj = event.data.obj;
52        var wto;
53        var c = String.fromCharCode(event.keyCode);
54        var searchText = $.trim( $( event.currentTarget ).val() );
55        var isWordCharacter = c.match(/\w/);
56        var isBackspaceOrDelete = (event.keyCode == 8 || event.keyCode == 46);
57        if (( isWordCharacter || isBackspaceOrDelete ) && searchText.length > 2) {
58              clearTimeout(wto);
59              wto = setTimeout(function() {
60                   obj.postSearch( event );
61              }, 1000);
62        }
63    }
64    
65    resetPostsList( event )
66    {
67        var obj = event.data.obj;
68        //~ this.filtered_posts = obj.all_posts;
69        var filters = $('.category-filter-active');
70        event.currentTarget = filters;
71        obj.termFilter( event );
72        event.data.obj.send_event('posts_list_change');
73    }
74    
75    postSearch( event )
76    {
77        var ww = $( window ).width();
78        var obj = event.data.obj;
79        var search_text = $.trim($( event.currentTarget ).val());
80        search_text = v.chain(search_text)
81            .lowerCase()
82            .latinise()
83            .value();
84                        
85        if (  (this.last_search !== search_text) && search_text.length > 2)
86        {
87            this.last_search = search_text;
88            this.filtered_posts = obj.all_posts.filter(
89                (value, key) => v.chain(value.post_title).lowerCase().latinise().value().includes(search_text)
90            );
91            if (this.filtered_posts.count() == 0)
92            {
93                this.filtered_posts = obj.all_posts.filter(
94                    (value, key) => value.post_content.toLowerCase().includes(search_text)
95                );
96            }
97            var count = this.filtered_posts.count();
98            $('#search_text-count').text(count);
99            $( ".category-filter" ).each(function() {
100				$( this ).removeClass( "active" );
101			});
102			//~ if ( ww < 992 ) {
103				//~ $( "#accordionUnicaWrapper" ).removeClass( "show" );
104			//~ }
105            event.data.obj.send_event('posts_list_change');
106        }
107    }
108    
109    getTemplate(template_url, callback) {
110        var Html = null;
111        $.ajax({
112            type: "GET",
113            url: template_url,
114            async: false,
115            dataType: "html",
116            success: 
117                function(response){
118                    Html = response;
119
120            },
121            error: function(request, status, error) {
122                alert(status);
123                
124            }
125        });
126        //~ console.log(Html);
127        return Html;
128    }
129    
130    paginatePosts( event )
131    {
132       event.data.obj.buildPostsList( event );
133    }
134
135}
136
137let mixinEvents = {
138    bind(element, event_type, handler)
139    {
140        $( element ).unbind( event_type );
141        $( element ).bind( event_type, {obj: this}, handler );
142    },
143
144    send_event( event_type )
145    {
146        $.event.trigger({'type':event_type});
147    }
148}
149
150let mixinPagination = {
151    paginator(posts, current_page)
152    {
153        let page = current_page || 1;
154        let per_page = this.per_page_posts || 10;
155        let offset = (page - 1) * per_page;
156        let paginated_posts = posts.slice(offset).slice(0, per_page);
157        let total_pages = Math.ceil(posts.length / per_page);
158        if (paginated_posts.length < per_page ) {
159            paginated_posts = posts;
160        }
161        return {
162            page: page,
163            per_page: per_page,
164            prev_page: page - 1 ? page - 1 : null,
165            next_page: (total_pages > page) ? page + 1 : null,
166            total: posts.length,
167            total_pages: total_pages,
168            posts: paginated_posts,
169            ofset: offset
170        };
171    }
172
173}
174
175
176class CardsAndMapApp extends FilterAndSearchApp
177{
178    static per_page_posts = 10;
179    
180    constructor(all_posts)
181    {
182        super(all_posts);
183        this.posts_container = $('#posts-container');
184        this.posts_list_template = 'posts_list.html';
185        this.last_search = null;
186        this.map_id = 'map';
187        this.listeners();
188    }
189
190    init()
191    {
192        this.initMap();
193        this.send_event('reset');
194    }
195
196    // bind(element, event_type, handler)
197    // {
198    //     $( element ).unbind( event_type );
199    //     $( element ).bind( event_type, {obj: this}, handler );
200    // }
201    
202    listeners()
203    {
204        this.map_listeners();
205        this.card_listeners();
206    }
207    
208    card_listeners()
209    {
210        this.bind('.paginator-item', 'click', this.paginatePosts);
211        this.bind( document, 'reset', this.resetPostsList);
212        this.bind( document, 'posts_list_change', this.buildPostsList);
213    }
214
215    map_listeners()
216    {
217        this.bind( '.zoom-in', 'click',this.zoomIn );
218        this.bind( '.zoom-out', 'click',this.zoomOut );
219        this.bind( document, 'reset', this.resetMap );
220        this.bind( document, 'posts_list_change', this.changeMap );
221    }
222   
223    buildPostsList( event )
224    {
225        // console.log("buildPostsList");
226        var page = $(event.currentTarget).data('page');
227        var obj = event.data.obj;
228        var data = obj.paginator( obj.filtered_posts.toArray(), page );
229        obj.posts_container.html( nunjucks.render(obj.posts_list_template, data) );
230        obj.listeners();
231        obj.buildMap();
232    }
233
234    initMap()
235    {
236        //~ console.log("!");
237        console.log($('#' + this.map_id));
238        if ($('#' + this.map_id).length ) {
239
240            const bounds = new L.LatLngBounds(new L.LatLng(39.44, this.map_lng), new L.LatLng(39, this.map_lng + 1));
241            const tiles = L.tileLayer(this.map_url, {
242                attribution: this.map_attribution,
243                subdomains: 'abcd',
244                minZoom: 2,
245                maxZoom: 20,
246                zoomSnap: 0.50,
247                //maxZoom: 19,
248                ext: 'png'
249            });
250            this.markers = L.markerClusterGroup({
251                showCoverageOnHover: false,
252                maxClusterRadius: 40
253            });
254            const myIcon = L.divIcon({className: 'comerciojusto-marker-icon-undefined'});
255            this.map = L.map(this.map_id, {
256                center: bounds.getCenter(),
257                scrollWheelZoom: false,
258                zoomControl: false
259            }

259).setView([this.map_lat, this.map_lng], this.map_zoom);
260            L.control.zoom({
261                position: 'bottomright'
262            }).addTo(this.map);
263            tiles.addTo(this.map);
264        }
265    }
266
267    changeMap( event )
268    {
269        console.log("changeMap");
270        var obj = event.data.obj;
271        obj.buildMap();
272        
273    }
274    
275    resetMap( event )
276    {
277        console.log("reset");
278        var filters = $('.category-filter-active');
279        event.currentTarget = filters;
280        event.data.obj.termFilter( event );
281    }
282    
283    zoomIn( event )
284    {
285       event.data.obj.map.zoomIn();
286    }
287    
288    zoomOut( event )
289    {
290       event.data.obj.map.zoomOut();
291    }
292    
293    buildMap()
294    {
295        console.log("buildMap");
296        if ($('#' + this.map_id).length ) {
297            this.markers.clearLayers();
298            //~ console.log(this.disable_filter);
299            if (this.disable_filter) {
300                var workon_list = this.all_posts;
301            } else {
302                var workon_list = this.filtered_posts;
303            }
304            // if (this.marker_class) {
305            //     var mainIcon = L.divIcon({className: this.marker_class});
306            // } else {
307            //     var mainIcon = L.divIcon({className: 'comerciojusto-marker-icon'});
308            // }
309            if (this.marker_class) {
310                var marker_icon_class = this.marker_class;
311            } else {
312                var marker_icon_class = 'comerciojusto-marker-icon';
313            }
314            // console.log(this.marker_class);
315            // console.log(mainIcon);
316            // console.log(workon_list);
317            workon_list.each((post) => {
318                if ( post.lat && post.lon && Array.isArray(post.lat) == false ) {
319                    if (post.main_term.id) {
320                        // mainIcon = L.divIcon({className: 'comerciojusto-marker-icon-' + post.main_term.id});
321                        var mainIcon = L.divIcon({className: marker_icon_class + ' ' + marker_icon_class + '-' + post.main_term.id});
322                    } else {
323                        var mainIcon = L.divIcon({className: marker_icon_class});
324                    }
325                    var marker = L.marker([ post.lat, post.lon ], {icon: mainIcon});
326                    marker.bindTooltip( post.post_title ).openTooltip();
327                    marker.node_id = post.id;
328                    marker.node = post;
329                    marker.addTo(this.markers)
330                        .on('click', this.markerOnClick, this );
331                }
332            });
333            //~ console.log(this.markers);
334            this.map.addLayer(this.markers);
335            this.filtered_posts = this.all_posts;
336            //~ console.log(this.map_lat);
337            //~ console.log(this.map_lng);
338            //~ console.log(this.map_zoom);
339            this.map.setView([this.map_lat, this.map_lng], this.map_zoom);
340        }
341    }
342    
343    markerOnClick( event )
344    {
345        var node_id = event.target.node_id;
346        var node = this.all_posts.where('id',node_id).first();
347        this.cardBuild( node );
348    }
349
350    cardBuild( node )
351    {
352        var offCanvas = $('#offcanvasTop');
353        var rendered = nunjucks.render('offcanvas.html', { node: node });
354        this.map.setView({ lat: node.lat, lng: node.lon });
355        offCanvas.html(rendered).offcanvas('show');
356    }
357}
358
359Object.assign(CardsAndMapApp.prototype, mixinEvents, mixinPagination);
360
361window.CardsAndMapApp = CardsAndMapApp;
362// window.mixinPagination =  mixinPagination;
363// window.MapApp = MapApp;
364// window.CardsApp = CardsApp;