https://alenka.capital/static/category/search.js

1
2var $searchForm;
3var $searchField;
4var $searchRemoveBtn;
5var timer;
6
7function init_search() {
8    
9    $searchForm = $('.feed__search-form');
10    $searchField = $('.feed__search-field');
11    $searchRemoveBtn = $('.feed__search-remove');
12    
13    $searchField.on('focus', function() {
14        
15        $(this).addClass('feed__search-field_active');
16        
17    });
18    
19    $searchField.on('keyup', function() {
20        
21        search_rm_btn();
22        
23        if (timer) clearTimeout(timer);
24        timer = setTimeout(search_start, 1000);
25        
26    });
27    
28    $searchField.on('blur', function() {
29        
30        $(this).removeClass('feed__search-field_active');
31        
32    });
33    
34    $('.feed__search-remove').on('click', function() {
35        
36        $searchField.val('');
37        search_rm_btn();
38        search_start();
39        
40    });
41    
42    $searchForm.on('submit', function() {
43        
44        search_start();
45        
46        return false;
47        
48    });
49    
50    $('.feed__search-mobile span').on('click', function() {
51        
52        $('.feed__head').addClass('feed__head-insearch');
53        $searchField.focus();
54        search_rm_btn(true);
55        
56    });
57    
58    search_rm_btn();
59    
60};
61
62function search_start(action) {
63    
64    if (timer) clearTimeout(timer);
65    
66    var length = $searchField.val().length;
67    
68    if (length >=1 && length <= 2) return;
69    
70    $.ajax({
71        url: '/category/view/',
72        type: 'GET',
73        data: $searchForm.serialize(),
74        success: function (data) {
75            
76            $('body').html(data);
77            $('body,html').animate({scrollTop: 0}, 'slow');
78            
79        },
80    });
81    
82}
83
84function search_rm_btn(action) {
85    
86    var action = action || ($searchField.val().length ? true : false);
87    
88    if (action == true) {
89        
90        $searchRemoveBtn.css('opacity', '1');
91        $searchField.css('padding', '8px 20px 8px 20px');
92        
93    }
94    
95    else {
96        
97        $searchRemoveBtn.css('opacity', '0');
98        $searchField.css('padding', '8px 0px 8px 20px');
99        $('.feed__head').removeClass('feed__head-insearch');
100        
101    }
102    
103}
104