{"version":3,"sources":["webpack:////Users/xingli/Documents/projects/projects/ara-fe/src/views/widgets/searchPageAutoCompleteWidget/js/searchPageAutoCompleteWidget.js","webpack:///./api.js"],"names":["Api","__webpack_require__","_utils","CLS","WG","SearchPageAutoCompleteWidget","el","_classCallCheck","this","$el","$","emptyMessage","data","id","$searchResult","find","$searchInp","$searchList","searchPagePath","init","handleSearchInput","handleKeyboard","on","_","debounce","search","bind","e","_this","searchTerm","val","length","addClass","searchCall","then","isSuccessful","res","hits","renderedHtml","i","result","newText","matchResult","query","encodeURI","url","html","handleDocumentClick","removeClass","currentTarget","selectSearchLink","catch","error","endpoint","getApi","encodeURIComponent","text","matcher","RegExp","replace","term","fromClick","$activeItem","closeSearch","trigger","_this2","key","navigateSearch","isDown","$firstItem","$lastItem","$nextItem","next","$prevItem","prev","timeout","hasClass","$siteHeader","closest","setTimeout","_this3","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-3.317c86355b23b3978b5f.js","sourcesContent":["\n// CONSTANTS are all caps.\nconst NS = 'SearchPageAutoCompleteWidget';\nconst CLS = 'searchPageAutoCompleteWidget';\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 SearchPageAutoCompleteWidget {\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\tthis.init();\n\t}\n\n\tinit() {\n\t\tthis.handleSearchInput();\n\t\tthis.handleKeyboard();\n\t}\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\t// <a href=\"${url}\" class=\"${CLS}-searchLink\">${newText}</a>\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<div class=\"${CLS}-searchLink\" data-query=\"${result.query}\">${newText}</div>\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\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}\n\n\n\t\t\t\tthis.handleDocumentClick();\n\t\t\t\tthis.$searchResult.removeClass(CLS_HIDE);\n\n\t\t\t\t$(`.searchPageAutoCompleteWidget-searchItem`).on('click', (e) => {\n\t\t\t\t\t$(e.currentTarget).addClass('is-active');\n\t\t\t\t\tthis.selectSearchLink(true);\n\n\t\t\t\t})\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(fromClick) {\n\t\tlet $activeItem = this.$searchList.find(`${WG}searchItem.${CLS_ACTIVE}`);\n\t\tlet query = '';\n\n\t\tconsole.log($activeItem);\n\n\t\tif($activeItem.length === 0) {\n\t\t\tquery = this.$el.find('.searchPageAutoCompleteWidget-searchInput').val();\n\t\t} else {\n\t\t\tquery = $activeItem.find(`${WG}searchLink`).data('query');\n\t\t}\n\n\t\t// trigger api call search results !!!!!!!\n\t\tconsole.log('hello...', $activeItem, query);\n\t\tthis.$el.find('.searchPageAutoCompleteWidget-searchInput').val(query);\n\t\tthis.closeSearch();\n\n\t\t// if from click trigger re-render\n\t\t// if not, enter will auto-trigger re-render\n\t\tif(fromClick) {\n\t\t\tthis.$searchInp.trigger('renderCourseSearchContainer', {});\n\t\t}\n\n\t\t$activeItem.removeClass(CLS_ACTIVE);\n\t}\n\n\thandleKeyboard() {\n\t\tthis.$searchInp.on('keyup', (e) => {\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\tthis.closeSearch();\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\n\t\t// let $currentActiveItem = this.$searchList.find(`${WG}searchItem.${CLS_ACTIVE}`);\n\t\t// let query = $currentActiveItem.find(`${WG}searchLink`).data('query')\n\t\t// this.$el.find('.searchPageAutoCompleteWidget-searchInput').val(query);\n\t\t// console.log('current active keyword', $currentActiveItem, query);\n\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\t// this.$searchInp.val('');\n\t\t\t// this.$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":""}