https://www.glasir.fo/wp-content/themes/lunnar-glasir/js/search.js?ver=1.1.9

1(function () {
2    new Vue({
3        el: "#search-overlay",
4
5        data() {
6            return {
7                // Handle search
8                searchOpen: false,
9                searchValue: "",
10                delayTimer: null,
11                showClearIcon: false,
12
13                // Handle results
14                searchResults: [],
15                showResults: false,
16                renderResultsContainer: false,
17
18                // Handling Pagination
19                pageSize: 10,
20                currentPage: 0,
21                numberOfPages: 0,
22                hasPrevious: false,
23                hasNext: false,
24                numberOfResults: 0,
25
26                // Post type translations
27                postTypeMapping: {
28                    starvsfolk: "Starvsfólk",
29                    page: "Síða",
30                    post: "Grein",
31                    "collection-post": "Grein (Miðnámsrit)",
32                },
33            };
34        },
35
36        mounted() {
37            document.addEventListener("click", this.handleClick);
38
39            // Close search on Escape
40            document.addEventListener('keyup', (e) => {
41                if (e.key === 'Escape') {
42                    this.closeSearch();
43                }
44            });
45        },
46
47        watch: {
48            searchValue(searchValue) {
49                clearTimeout(this.delayTimer);
50                this.showClearIcon = searchValue.length > 0;
51
52                if (searchValue.length > 1) {
53                    const self = this;
54
55                    this.delayTimer = setTimeout(() => {
56                        self.handleSearch();
57                    }, 200);
58
59                    return;
60                }
61
62                this.clearResultList();
63            },
64
65            searchOpen(searchOpen) {
66                if (!searchOpen) {
67                    this.searchValue = "";
68                }
69            },
70        },
71
72        methods: {
73            // Handle search
74            handleSearch() {
75                index
76                    .search(this.searchValue, {
77                        hitsPerPage: this.pageSize,
78                        page: this.currentPage,
79                    })
80                    .then((result) => {
81                        this.numberOfResults = result.nbHits;
82                        this.numberOfPages = result.nbHits / this.pageSize;
83                        this.hasPrevious = this.currentPage !== 0;
84                        this.hasNext =
85                            this.currentPage <
86                            result.nbHits / this.pageSize - 1;
87
88                        this.searchResults = result.hits;
89                        this.renderResultsContainer = true;
90
91                        if (result.nbHits === 0) {
92                            this.showResults = false;
93                            return;
94                        }
95
96                        this.showResults = true;
97                    });
98            },
99
100            clearResultList() {
101                this.searchResults = [];
102
103                this.currentPage = 0;
104                this.numberOfPages = 0;
105                this.numberOfResults = 0;
106                this.hasPrevious = false;
107                this.hasNext = false;
108
109                this.renderResultsContainer = false;
110            },
111
112            // Handle pagination
113            previousPage() {
114                if (this.currentPage > 0) {
115                    this.currentPage = this.currentPage - 1;
116                    this.handleSearch();
117                }
118            },
119
120            nextPage() {
121                if (this.currentPage < this.numberOfPages) {
122                    this.currentPage = this.currentPage + 1;
123                    this.handleSearch();
124                }
125            },
126
127            // Event listener
128            handleClick(e) {
129                if (
130                    e.target.closest(".user-menu--search") ||
131                    e.target.closest(".menu--search") ||
132                    e.target.closest(".search-bg") ||
133                    e.target.closest(".close-icon")
134                ) {
135                    e.preventDefault();
136                    if (this.searchOpen) {
137                        this.searchOpen = false;

138                        return;
139                    }
140
141                    this.searchOpen = true;
142
143                    const searchInput = document.querySelector('.search-container input');
144
145                    if (searchInput) {
146                        searchInput.focus();
147                    }
148                }
149            },
150
151            // Open search
152            openSearch() {
153                this.searchOpen = true;
154            },
155
156            // Close search
157            closeSearch() {
158                this.searchOpen = false;
159            },
160
161            handleContent(content) {
162                if (content.length > 60) {
163                    return content.substring(0, 60) + "...";
164                }
165
166                return content;
167            },
168        },
169    });
170})();