{"version":3,"sources":["webpack:////Users/xingli/Documents/projects/projects/ara-fe/src/views/widgets/generalSearchAutoCompleteWidget/js/generalSearchAutoCompleteWidget.js","webpack:///./api.js"],"names":["Api","__webpack_require__","_utils","CLS","WG","GeneralSearchAutoCompleteWidget","el","_classCallCheck","this","$el","$","emptyMessage","data","id","$searchResult","find","$searchInp","$searchList","searchPagePath","$courseSearchBtn","closest","length","initCourseSearchBtn","init","handleSearchInput","handleKeyboard","_this","on","selectSearchLink","_","debounce","search","bind","e","_this2","searchTerm","val","addClass","searchCall","then","isSuccessful","res","hits","renderedHtml","i","result","newText","matchResult","query","url","encodeURI","html","handleDocumentClick","removeClass","catch","error","endpoint","getApi","encodeURIComponent","text","matcher","RegExp","replace","term","$activeItem","$firstItem","keyword","window","location","prop","_this3","key","closeSearch","navigateSearch","isDown","$lastItem","$nextItem","next","$prevItem","prev","_this4","timeout","hasClass","$siteHeader","setTimeout","_this5","utils","docClick","fetch","headers","Content-Type","response","json","Promise","resolve","reject","callApi","arguments","undefined","method","body","JSON","stringify","Headers","credentials","status","successful"],"mappings":"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","file":"widget-1.317c86355b23b3978b5f.js","sourcesContent":["// CONSTANTS are all caps.\nconst NS = 'GeneralSearchAutoCompleteWidget';\nconst CLS = 'generalSearchAutoCompleteWidget';\nconst WG = '.' + CLS + '-';\nconst CLS_ACTIVE = 'is-active';\nconst CLS_HIDE = 'd-none';\n\n// Import stuff here if you need to or even better to import them dynamically\n// import $ from 'jquery'\nimport * as Api from '../../../../global/js/api';\nimport _ from 'lodash';\nimport {utils} from 'global/js/utils';\n\n\nexport class GeneralSearchAutoCompleteWidget {\n\tconstructor(el) {\n\t\tthis.el = el;\n\t\tthis.$el = $(el);\n\n\t\tthis.emptyMessage = this.$el.data('emptyMessage') || 'No result.';\n\t\tthis.id = this.$el.data('id');\n\t\tthis.$searchResult = this.$el.find(`${WG}searchResult`);\n\t\tthis.$searchInp = this.$el.find(`${WG}searchInput`);\n\t\tthis.$searchList = this.$el.find(`${WG}searchList`);\n\t\tthis.searchPagePath = this.$el.data('search-page');\n\n\t\t// this is for course search block button\n\t\tthis.$courseSearchBtn = this.$el.closest('.courseSearchBlock').find('.courseSearchBlock-card-body-btn');\n\t\tconsole.log(this.$courseSearchBtn);\n\n\t\tif(this.$courseSearchBtn.length >= 1 ) {\n\t\t\tthis.initCourseSearchBtn()\n\t\t}\n\n\t\tthis.init();\n\t}\n\n\tinit() {\n\t\tconsole.log(this.searchPagePath, this.$el);\n\n\t\tthis.handleSearchInput();\n\t\tthis.handleKeyboard();\n\t}\n\n\tinitCourseSearchBtn() {\n\t\tthis.$courseSearchBtn.on('click', () => {\n\t\t\tconsole.log(12);\n\t\t\tthis.selectSearchLink();\n\t\t});\n\t}\n\n\n\thandleSearchInput() {\n\t\tconst This = this;\n\t\tThis.$searchInp.on('input', _.debounce(This.search.bind(This), 500));\n\t}\n\n\tsearch(e) {\n\t\tlet searchTerm = this.$searchInp.val();\n\n\t\tif (searchTerm.length < 3) {\n\t\t\tthis.$searchResult.addClass(CLS_HIDE);\n\t\t\treturn;\n\t\t}\n\n\t\tthis.searchCall(searchTerm).then((data) => {\n\t\t\tif (Api.isSuccessful(data)) {\n\t\t\t\t// http://www.mocky.io/v2/5dca28d433000071003deb58\n\t\t\t\tlet res = data.hits || [];\n\t\t\t\tif (res.length > 0) {\n\t\t\t\t\tlet renderedHtml = '';\n\t\t\t\t\tfor (let i = 0; i < res.length; i++) {\n\t\t\t\t\t\tlet result = res[i];\n\t\t\t\t\t\tlet newText = this.matchResult(result.query);\n\t\t\t\t\t\tlet param = encodeURI(result.query);\n\t\t\t\t\t\tlet url = result.url;\n\n\t\t\t\t\t\trenderedHtml += `\n\t\t\t\t\t\t<li class=\"${CLS}-searchItem\">\n\t\t\t\t\t\t\t<a href=\"${url}\" class=\"${CLS}-searchLink\">${newText}</a>\n\t\t\t\t\t\t</li>`;\n\t\t\t\t\t}\n\n\t\t\t\t\tthis.$searchList.html(renderedHtml);\n\t\t\t\t} else {\n\t\t\t\t\tconsole.log(res);\n\t\t\t\t\treturn;\n\t\t\t\t\t// if api call empty results\n\t\t\t\t\t// let empty = `<li class=\"${CLS}-searchEmpty\">${this.emptyMessage}</li>`;\n\t\t\t\t\t// this.$searchList.html(empty);\n\t\t\t\t}\n\n\t\t\t\tthis.handleDocumentClick();\n\t\t\t\tthis.$searchResult.removeClass(CLS_HIDE);\n\t\t\t}\n\t\t}).catch((error) => {\n\t\t\tconsole.log(NS, 'search error', error);\n\t\t\t// if api call error\n\t\t\t// this.$searchList.html(`\n\t\t\t// \t<li class=\"${CLS}-searchError text-danger\">There was an error.</li>\n\t\t\t// `);\n\t\t\t// this.$searchResult.removeClass(CLS_HIDE);\n\t\t});\n\t}\n\n\tsearchCall(searchTerm) {\n\t\tif (!searchTerm || searchTerm == '') return;\n\n\t\tconst $wg = $(this.$el);\n\t\tlet endpoint = $wg.data('searchEndpoint');\n\t\treturn Api.getApi(endpoint + '?prefix=' + encodeURIComponent(searchTerm) + '&size=5' + `&id=${this.id}`);\n\t}\n\n\t// match result with search term\n\tmatchResult(text) {\n\t\tlet searchTerm = this.$searchInp.val();\n\t\tlet matcher = new RegExp(searchTerm, 'gi');\n\n\t\treturn _.replace(text, matcher, (term) => {\n\t\t\treturn `<span class=\"${CLS}-searchMatched\">${term}</span>`;\n\t\t});\n\t}\n\n\tselectSearchLink() {\n\t\tlet $activeItem = this.$searchList.find(`${WG}searchItem.${CLS_ACTIVE}`);\n\t\tlet url = '';\n\n\t\tconsole.log('hello...', $activeItem);\n\n\t\tif($activeItem.length === 0) {\n\t\t\tlet $firstItem = this.$searchList.find(`${WG}searchItem:first-child`);\n\t\t\tif($firstItem.length === 0) {\n\t\t\t\tlet keyword = this.$el.find('.generalSearchAutoCompleteWidget-searchInput').val();\n\t\t\t\turl = `${this.searchPagePath}?keyword=${keyword}`;\n\t\t\t\tconsole.log(url);\n\t\t\t\twindow.location = url;\n\t\t\t\treturn;\n\t\t\t}\n\t\t\turl = $firstItem.find(`${WG}searchLink`).prop('href');\n\t\t} else {\n\t\t\turl = $activeItem.find(`${WG}searchLink`).prop('href');\n\t\t}\n\n\t\tconsole.log(url);\n\t\twindow.location = url;\n\t}\n\n\thandleKeyboard() {\n\t\tthis.$searchInp.on('keyup', (e) => {\n\t\t\t// console.log(e.key);\n\t\t\tswitch(e.key) {\n\t\t\t\tcase 'Escape':\n\t\t\t\t\tthis.closeSearch();\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'Enter':\n\t\t\t\t\tthis.selectSearchLink();\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\tthis.navigateSearch(false);\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\tthis.navigateSearch(true);\n\t\t\t\t\tbreak;\n\n\t\t\t\tdefault:\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t});\n\t}\n\n\tnavigateSearch(isDown) {\n\t\tlet $items = this.$searchList.find(`${WG}searchItem`);\n\t\tif($items.length === 0) return;\n\n\t\tlet $activeItem = this.$searchList.find(`${WG}searchItem.${CLS_ACTIVE}`);\n\t\tlet $firstItem = this.$searchList.find(`${WG}searchItem:first-child`);\n\t\tlet $lastItem = this.$searchList.find(`${WG}searchItem:last-child`);\n\n\t\t// check if there is active item\n\t\tif($activeItem.length === 0) {\n\t\t\tisDown ? $firstItem.addClass(CLS_ACTIVE) : $lastItem.addClass(CLS_ACTIVE);\n\t\t} else {\n\t\t\t$activeItem.removeClass(CLS_ACTIVE);\n\n\t\t\tif(isDown) {\n\t\t\t\tlet $nextItem = $activeItem.next();\n\t\t\t\t$nextItem.length === 0 ? $firstItem.addClass(CLS_ACTIVE) : $nextItem.addClass(CLS_ACTIVE);\n\t\t\t} else {\n\t\t\t\tlet $prevItem = $activeItem.prev();\n\t\t\t\t$prevItem.length === 0 ? $lastItem.addClass(CLS_ACTIVE) : $prevItem.addClass(CLS_ACTIVE);\n\t\t\t}\n\t\t}\n\t}\n\n\tcloseSearch() {\n\t\tlet timeout = 0;\n\t\tthis.$searchResult.addClass(CLS_HIDE);\n\n\t\tif (this.$el.hasClass(`${CLS}--siteHeader`)) {\n\t\t\tlet $siteHeader = this.$el.closest('.intranetSiteHeader');\n\t\t\tif($siteHeader.length) {\n\t\t\t\t$siteHeader.removeClass('is-searchActive');\n\t\t\t\ttimeout = 300;\n\t\t\t}\n\t\t}\n\n\t\t// timeout to wait for animation complete\n\t\tsetTimeout(() => {\n\t\t\tthis.$searchInp.val('');\n\t\t\tthis.$searchList.html('');\n\t\t}, timeout);\n\t}\n\n\thandleDocumentClick() {\n\t\tutils.docClick(() => {\n\t\t\tthis.closeSearch();\n\t\t}, null, [CLS]);\n\t}\n\n\t// Add more functions like on above here\n}\n","// fetch with GET does not allow body data\nexport function getApi(url) {\n\treturn fetch(url, {\n\t\theaders: {\n\t\t\t'Content-Type': 'application/json',\n\t\t},\n\t})\n\t\t.then((response) => response.json())\n\t\t.then((response) => Promise.resolve(response))\n\t\t.catch((error) => {\n\t\t\tPromise.reject(error);\n\t\t});\n}\n\n// fetch with POST and others (DELETE, etc.)\nexport function callApi(url, data = {}, method = 'POST', headers = {}) {\n\theaders['Content-Type'] = 'application/json';\n\n\treturn fetch(url, {\n\t\tmethod: method,\n\t\tbody: JSON.stringify(data),\n\t\theaders: new Headers(headers),\n\t\tcredentials: 'same-origin',\n\t})\n\t.then((response) => response && response.json())\n\t.then((response) => Promise.resolve(response))\n\t.catch((error) => Promise.reject(error));\n}\n\n\nexport function isSuccessful(data) {\n\treturn (data.status == 200 || data.status == 'ok' || data.status == 'SUCCESS' || data.successful == true);\n}\n"],"sourceRoot":""}