{"version":3,"file":"../GuideSingleMultiPicker.js","names":["GuideSingleMultiPicker","me","this","selectedJurisdictionList","selectedRegionList","selectedQuestionList","jurisdictionQuickLookup","questionsQuickLookup","jurisdictionCheckboxList","guideErrorMessages","guideBuildLoading","guideBuildDisplay","jurisdictionsPopulated","questionsPopulated","Init","console","log","document","querySelector","getElementById","queryParams","URLSearchParams","window","location","search","get","q","split","length","forEach","el","checked","bind","querySelectorAll","val","index","push","id","parseInt","getAttribute","element","replaceAll","jArray","addJurisdictionToSelectedList","renderJurisdictionList","checkboxes","switchStage","breadcrumb","last","lastElementChild","removeChild","children","newA","createElement","classList","add","setAttribute","innerHTML","appendChild","buildFilters","getTableListing","checkBoxGroups","singleMultiItems","stage1QuestionNext","stage1QuestionNextBottom","stage2QuestionNext","stage2QuestionBack","stage3QuestionBack","showAllJurisdictions","showAllStage3","stage3ApplyFilters","jurisdictionCheckboxes","jurisdictionCheckbox","selectAllQuestions","selectAllJurisdictions","selectAllJurisdictionsInGroup","questionCheckboxes","mobileJursdictionDropdown","href","options","addEventListener","e","preventDefault","toTab","wrapper","closest","activeTab","t","remove","tc","className","replace","c","previousElementSibling","addQuestionToSelectedList","value","childChecks","target","checkall","params","set","history","replaceState","pathname","scrollToAnchorIDVanilla","showErrorMessage","currentUrl","URL","pushState","event","state","reload","json","topic","guideTitle","jurisdictions","commaEncodeForJson","questions","commaEncodeQuestions","regions","commaEncodedRegions","JSON","stringify","alert","delete","contains","hideJurisdictionsCaption","showAllJurisdictionsCaption","elVal","removeJurisdictionFromSelectedList","name","parentNode","ele","targetEle","targetId","selecting","targetDivs","checkbox","eleName","eleID","addJurisdictionToSelected","removeQuestionFromSelectedList","selectAllBox","selector","groupContainers","group","box","groupId","questionEle","questionId","currentTarget","questionCheckboxList","message","clearErrorMessage","suppressRefresh","newList","find","o","clicked","splice","commaEncodeList","join","caption","isAutoComplete","item","confirm","globalThis","v","template","parent","found","warn","qIDs","jIDs","getSearchResultsQuery","then","result","setTimeout","body","calculateHeight","applyClicks","anchors","getElementsByTagName","i","encoded","region","includes","toStage","autoCompleteElement","autoCompleteJS","autoComplete","autoCompleteConfig","Promise","resolve","reject","searchParams","fetch","method","headers","Accept","response","text","catch","error","tableClose","commaEncode","valueA","label","isQuestions","commaDecode","commaDecodeList","decoded","onload"],"sources":["GuideSingleMultiPicker.js"],"sourcesContent":["var GuideSingleMultiPicker = {\r\n me: this,\r\n selectedJurisdictionList: [],\r\n selectedRegionList: [],\r\n selectedQuestionList: [],\r\n jurisdictionQuickLookup: [],\r\n questionsQuickLookup: [],\r\n jurisdictionCheckboxList: [],\r\n guideErrorMessages: null,\r\n\r\n guideBuildLoading: null,\r\n guideBuildDisplay: null,\r\n jurisdictionsPopulated: false,\r\n questionsPopulated: false,\r\n\r\n Init: function () {\r\n console.log('Init GuideSingleMultiPicker')\r\n this.guideErrorMessages = document.querySelector('.guideErrorMessages');\r\n this.guideBuildLoading = document.getElementById('IGResultsLoading');\r\n this.guideBuildDisplay = document.getElementById('IGResults');\r\n var queryParams = new URLSearchParams(window.location.search);\r\n if (queryParams.get('questions') != null) {\r\n var q = queryParams.get('questions').split(\",\");\r\n this.selectedQuestionList = q;\r\n if (this.selectedQuestionList.length > 0) {\r\n this.questionsPopulated = true;\r\n }\r\n q.forEach(function (el) {\r\n var checkbox = document.getElementById(\"GQ_\" + el);\r\n checkbox.checked = true;\r\n }.bind(this));\r\n }\r\n jurisdictionCheckboxList = document.querySelectorAll('#jurisdictionCheckboxes input[type=checkbox]:not(.jurisdictionSelectAll)');\r\n jurisdictionCheckboxList.forEach((val, index) => {\r\n this.jurisdictionQuickLookup.push({ id: parseInt(val.getAttribute('id')), element: val });\r\n });\r\n if (queryParams.get('jurisdictions') != null) {\r\n var temp = queryParams.get('jurisdictions').replaceAll(\", \", \"*\");\r\n var j = temp.split(\",\");\r\n /* console.log(\"J: %o Query params: %o\", j, temp);*/\r\n j.forEach(function (el) {\r\n var val = el.replaceAll(\"*\", \", \");\r\n var jArray = val.split(\"-\");\r\n /* console.log(\"JArray: %o\", jArray);*/\r\n var checkbox = document.getElementById(jArray[1]);\r\n\r\n checkbox.checked = true;\r\n /* console.log(\"Checkbox: %o\", checkbox);*/\r\n this.addJurisdictionToSelectedList(jArray[0], jArray[1]);\r\n // Find each checkbox and set checked to true\r\n this.renderJurisdictionList();\r\n }.bind(this));\r\n if (this.selectedJurisdictionList.length > 0) {\r\n this.jurisdictionsPopulated = true;\r\n }\r\n }\r\n if (queryParams.get('stage') != null) {\r\n if (queryParams.get('stage') == \"questions\") {\r\n var checkboxes = document.querySelectorAll('#questionsContainer input[type=checkbox]');\r\n var checked = true;\r\n checkboxes.forEach(function (el) {\r\n /* console.log(\"EL: %o\", el.checked);*/\r\n if (el.checked == false) {\r\n checked = false;\r\n }\r\n });\r\n document.getElementById(\"selectAllQuestions\").checked = checked;\r\n\r\n this.switchStage(2);\r\n var breadcrumb = document.querySelector(\".breadcrumb\");\r\n var last = breadcrumb.lastElementChild;\r\n breadcrumb.removeChild(breadcrumb.children[2]);\r\n console.log(\"Breadcrumb : %o\", last);\r\n var newA = document.createElement('a');\r\n newA.classList.add(\"breadcrumb__link\");\r\n newA.setAttribute('href', \"/resources/guides-toolkits/global-practice-guides/\");\r\n newA.innerHTML = \"Global practice guides\";\r\n\r\n breadcrumb.appendChild(newA);\r\n breadcrumb.appendChild(last);\r\n }\r\n else if (queryParams.get('stage') == \"report\") {\r\n //var json = {\r\n // 'topic': guideTitle,\r\n // 'jurisdictions': commaEncodeForJson(this.selectedJurisdictionList),\r\n // 'questions': commaEncodeQuestions(this.selectedQuestionList, true),\r\n // 'regions': this.commaEncodedRegions(),\r\n\r\n //};\r\n\r\n //console.log(\"Json object: %o\", JSON.stringify(json));\r\n this.buildFilters();\r\n // Go to stage 3\r\n this.switchStage(3);\r\n this.getTableListing();\r\n }\r\n }\r\n if (this.jurisdictionsPopulated && this.questionsPopulated) {\r\n // Go straight to guide page\r\n }\r\n\r\n console.log(\"Jurisdictions: %o, Questions: %o\", queryParams.get('jurisdictions'), queryParams.get('questions'))\r\n let checkBoxGroups = document.querySelectorAll('.singleMultiSwitcher .parentItem');\r\n let singleMultiItems = document.querySelectorAll('.singleMultiSwitcher .tab a');\r\n let stage1QuestionNext = document.getElementById('stage1QuestionNext');\r\n let stage1QuestionNextBottom = document.getElementById('stage1QuestionNextBottom');\r\n let stage2QuestionNext = document.getElementById('stage2QuestionNext');\r\n let stage2QuestionBack = document.getElementById('stage2QuestionBack');\r\n let stage3QuestionBack = document.getElementById('stage3QuestionBack');\r\n let JurisdictionDropDown = document.getElementById('guideJurisdiction');\r\n let showAllJurisdictions = document.getElementById('showAllJurisdictions');\r\n let showAllStage3 = document.getElementById('stage3ShowAll');\r\n let stage3ApplyFilters = document.getElementById('stage3ApplyFilters');\r\n let jurisdictionCheckboxes = document.getElementById('jurisdictionCheckboxes');\r\n let jurisdictionCheckbox = document.querySelectorAll('.jurisdiction-checkbox');\r\n let reportCheckbox = document.querySelectorAll('.report-checkbox');\r\n let JurisdictionQuestionNext = document.getElementById('JurisdictionQuestionNext');\r\n let selectAllQuestions = document.getElementById('selectAllQuestionsLabel');\r\n let selectAllJurisdictions = document.getElementById('selectAllJurisdictionsLabel');\r\n let selectAllJurisdictionsInGroup = document.querySelectorAll('.jurisdictionSelectAllInGroup');\r\n let questionCheckboxes = document.querySelectorAll('#questionsContainer .guides__checkbox-label');\r\n let mobileJursdictionDropdown = document.getElementById('mobileJurisdictionSelecter')\r\n\r\n var url = window.location.href;\r\n var queryParams = new URLSearchParams(window.location.search);\r\n\r\n var urlKeywords, urlJurisdictions, urlQuestions;\r\n urlKeywords = urlJurisdictions = urlQuestions = '';\r\n console.log(\"DROPDOWN VALUE: %o\", document.getElementById(\"mobileJurisdictionSelecter\").options[0]);\r\n\r\n // document.getElementById(\"mobileGuideNext\").setAttribute(\"href\", document.getElementById('mobileJurisdictionSelecter').value);\r\n /* console.log(\"Url: %o, Query params: %o\", url, queryParams);*/\r\n // Switch between single and multi\r\n singleMultiItems.forEach(function (el) {\r\n el.addEventListener('click', function (e) {\r\n e.preventDefault();\r\n let toTab = el.classList.length > 0 ? el.classList[0] : '';\r\n //console.log('Switch tab : ' + toTab);\r\n\r\n let wrapper = el.closest('.singleMultiSwitcher');\r\n\r\n // Tab title\r\n let activeTab = el.closest('.tab');\r\n wrapper.querySelectorAll('.tab').forEach(function (t) { t.classList.remove('active'); }); // Make all tabs inactive\r\n //console.log(wrapper.querySelectorAll('.tab'));\r\n activeTab.classList.add('active'); // Make clicked tab active\r\n\r\n // Tab Content\r\n wrapper.querySelectorAll('.tabContent').forEach(function (tc) { tc.classList.add('hidden');; }); // Hide all content tabs\r\n let className = '.tabContent.' + toTab.replace(' active', '');\r\n let contentDiv = wrapper.querySelector(className); // Show clicked content\r\n contentDiv.classList.remove('hidden');\r\n }.bind(this));\r\n }.bind(this));\r\n //document.getElementById('guideBack').addEventListener('click', function (e) {\r\n // e.preventDefault();\r\n // history.back();\r\n //});\r\n questionCheckboxes.forEach(function (el) {\r\n el.addEventListener('click', function (e) {\r\n var c = el.previousElementSibling;\r\n /* console.log(\"prev sibling: %o\", c);*/\r\n this.addQuestionToSelectedList(c.value);\r\n }.bind(this));\r\n }.bind(this));\r\n\r\n // Top level checkbox group - Select / unselect all\r\n checkBoxGroups.forEach(function (el) {\r\n el.addEventListener('click', function (e) {\r\n let childChecks = e.target.closest('li').querySelectorAll('ul li div.checkbox-container input');\r\n let checkall = e.target.checked;\r\n childChecks.forEach(function (el) {\r\n if (checkall) {\r\n el.checked = true;\r\n } else {\r\n el.checked = false;\r\n }\r\n });\r\n }.bind(this));\r\n }.bind(this));\r\n\r\n // Next button on stage 1 - Questions\r\n stage1QuestionNext.addEventListener('click', function (e) {\r\n let childChecks = document.querySelectorAll('#jurisdictionList div'); // Only check nested\r\n\r\n //console.log(childChecks);\r\n if (childChecks.length > 0) {\r\n var params = new URLSearchParams(window.location.search);\r\n params.set('stage', \"questions\");\r\n var sparam = '' + params;\r\n if (sparam !== '') {\r\n window.history.replaceState({}, '', window.location.pathname + '?' + params);\r\n } else {\r\n window.history.replaceState({}, '', window.location.pathname);\r\n }\r\n\r\n this.switchStage(2);\r\n scrollToAnchorIDVanilla('topOfQuestionCheckboxes');\r\n } else {\r\n // Anchor to top and show error message\r\n this.showErrorMessage('Please select at least one jurisdiction');\r\n }\r\n }.bind(this));\r\n stage1QuestionNextBottom.addEventListener('click', function (e) {\r\n let childChecks = document.querySelectorAll('#jurisdictionList div'); // Only check nested\r\n //console.log(childChecks);\r\n if (childChecks.length > 0) {\r\n this.switchStage(2);\r\n scrollToAnchorIDVanilla('topOfQuestionCheckboxes');\r\n } else {\r\n // Anchor to top and show error message\r\n this.showErrorMessage('Please select at least one jurisdiction');\r\n }\r\n }.bind(this));\r\n stage2QuestionNext.addEventListener('click', function (e) {\r\n let childChecks = document.querySelectorAll('#questionsContainer input[type=checkbox]:checked');\r\n //console.log('Checked questions : %o', childChecks);\r\n // this.selectedQuestionList = []; // clear it out\r\n if (childChecks.length > 0) {\r\n // Save the checked items\r\n //childChecks.forEach((c) => {\r\n // this.selectedQuestionList.push(parseInt(c.value));\r\n //});\r\n var params = new URLSearchParams(window.location.search);\r\n params.set('stage', \"report\");\r\n var sparam = '' + params;\r\n if (sparam !== '') {\r\n window.history.replaceState({}, '', window.location.pathname + '?' + params);\r\n } else {\r\n window.history.replaceState({}, '', window.location.pathname);\r\n }\r\n const currentUrl = new URL(window.location);\r\n window.history.pushState({}, '', currentUrl);\r\n window.addEventListener('popstate', function (event) {\r\n event.preventDefault();\r\n var params = new URLSearchParams(window.location.search);\r\n params.set('stage', \"questions\");\r\n var sparam = '' + params;\r\n if (sparam !== '') {\r\n window.history.replaceState({}, '', window.location.pathname + '?' + params);\r\n } else {\r\n window.history.replaceState({}, '', window.location.pathname);\r\n }\r\n\r\n if (event.state != null) {\r\n location.reload();\r\n }\r\n });\r\n //const currentUrl = new URL(window.location);\r\n //window.history.pushState({}, '', currentUrl);\r\n //addEventListener('popstate', () => { location.reload() });\r\n\r\n // Create Json String\r\n var json = {\r\n 'topic': guideTitle,\r\n 'jurisdictions': commaEncodeForJson(this.selectedJurisdictionList),\r\n 'questions': commaEncodeQuestions(this.selectedQuestionList, true),\r\n 'regions': this.commaEncodedRegions(),\r\n // 'questions': [\"What is the key anti-bribery and corruption legislation in your jurisdiction\", \"Who is subject to the legislation?\",\" Is requesting or accepting a bribe prohibited by the legislation?\"] ,\r\n };\r\n\r\n console.log(\"Json object: %o\", JSON.stringify(json));\r\n this.buildFilters();\r\n // Go to stage 3\r\n this.switchStage(3);\r\n this.getTableListing();\r\n } else {\r\n // Anchor to top and show error message\r\n this.showErrorMessage('Please select at least one question');\r\n }\r\n }.bind(this));\r\n\r\n stage3ApplyFilters.addEventListener('click', function (e) {\r\n if (this.selectedQuestionList.length > 0) {\r\n // Hide jurisdiction list if visible\r\n jurisdictionCheckboxes.classList.add(\"hidden\");\r\n // Go to stage 3\r\n this.switchStage(3);\r\n scrollToAnchorIDVanilla('topOfIGResults');\r\n this.getTableListing();\r\n } else {\r\n alert('Lost track of questions');\r\n }\r\n }.bind(this));\r\n\r\n stage2QuestionBack.addEventListener('click', function (e) {\r\n var params = new URLSearchParams(window.location.search);\r\n\r\n params.delete('stage');\r\n\r\n var sparam = '' + params;\r\n if (sparam !== '') {\r\n window.history.replaceState({}, '', window.location.pathname + '?' + params);\r\n } else {\r\n window.history.replaceState({}, '', window.location.pathname);\r\n }\r\n this.switchStage(1);\r\n }.bind(this));\r\n\r\n stage3QuestionBack.addEventListener('click', function (e) {\r\n this.switchStage(2);\r\n }.bind(this));\r\n\r\n showAllJurisdictions.addEventListener('click', function (e) {\r\n if (jurisdictionCheckboxes.classList.contains(\"hidden\")) {\r\n jurisdictionCheckboxes.classList.remove(\"hidden\");\r\n showAllJurisdictions.value = hideJurisdictionsCaption; // This is a global var in /blocklist/components/practiceGuideSingleMultiPicker\r\n }\r\n else {\r\n jurisdictionCheckboxes.classList.add(\"hidden\");\r\n showAllJurisdictions.value = showAllJurisdictionsCaption; // This is a global var in /blocklist/components/practiceGuideSingleMultiPicker\r\n }\r\n }.bind(this));\r\n\r\n showAllStage3.addEventListener('click', function (e) {\r\n if (jurisdictionCheckboxes.classList.contains(\"hidden\")) {\r\n jurisdictionCheckboxes.classList.remove(\"hidden\");\r\n showAllStage3.value = \"Hide\";\r\n }\r\n else {\r\n jurisdictionCheckboxes.classList.add(\"hidden\");\r\n showAllStage3.value = \"Show all\";\r\n }\r\n }.bind(this));\r\n\r\n jurisdictionCheckbox.forEach(function (el) {\r\n el.addEventListener('click', function (e) {\r\n var elVal = parseInt(el.value);\r\n var region = el.getAttribute(\"data-group-title\");\r\n /* console.log(\"Region: %o\", this.jurisdictionQuickLookup);*/\r\n if (el.checked == false) {\r\n this.removeJurisdictionFromSelectedList(elVal);\r\n }\r\n else {\r\n this.addJurisdictionToSelectedList(el.name, elVal);\r\n }\r\n this.renderJurisdictionList();\r\n }.bind(this));\r\n }.bind(this));\r\n\r\n mobileJursdictionDropdown.addEventListener('change', function (e) {\r\n document.getElementById(\"mobileGuideNext\").setAttribute(\"href\", this.value);\r\n });\r\n\r\n document.getElementById(\"mobileGuideNext\").addEventListener('click', function (e) {\r\n if (this.getAttribute(\"href\") == '') {\r\n e.preventDefault();\r\n }\r\n });\r\n // Remove buttons on the selected jurisdictions\r\n document.getElementById(\"jurisdictionList\").addEventListener(\"click\", function (e) {\r\n if (e.target && e.target.parentNode.classList.contains('jurisdiction-item')) {\r\n // Do something\r\n //console.log('clicked checkbox with id : %o ', e.target.parentNode.getAttribute('data-id'));\r\n this.removeJurisdictionFromSelectedList(parseInt(e.target.parentNode.getAttribute('data-id')));\r\n }\r\n }.bind(this));\r\n\r\n // Select all / None jurisdiction buttons\r\n document.querySelectorAll(\".guides__checkbox-title .selectAllNone\").forEach((ele) => {\r\n ele.addEventListener(\"click\", function (e) {\r\n console.log('Clicked select all none');\r\n //if (e.target && e.target.classList.contains('selectAllNone')) {\r\n // Kill the click action\r\n e.preventDefault();\r\n\r\n var targetEle = e.target;\r\n\r\n var targetId = `CBGroup_${targetEle.parentNode.getAttribute('data-group-id')}`;\r\n\r\n let selecting = false;\r\n if (targetEle.classList.contains('all')) {\r\n selecting = true;\r\n }\r\n\r\n /* console.log('targetId : %o', targetId);*/\r\n var targetDivs = document.querySelectorAll('.' + targetId);\r\n var checkboxes = [];\r\n targetDivs.forEach((val, index) => {\r\n var allCheckboxes = val.querySelectorAll('input[type = checkbox]');\r\n allCheckboxes.forEach((checkbox, index) => {\r\n checkboxes.push(checkbox);\r\n });\r\n });\r\n\r\n // var targetDiv = document.getElementById(targetId);\r\n // var checkboxes = targetDiv.querySelectorAll('input[type = checkbox]');\r\n\r\n let shouldSkip = false;\r\n checkboxes.forEach((c) => {\r\n if (shouldSkip) {\r\n return;\r\n }\r\n var eleName = c.getAttribute('name');\r\n var eleID = parseInt(c.getAttribute('id'));\r\n\r\n //c.checked = selecting;\r\n if (!selecting) {\r\n this.removeJurisdictionFromSelectedList(eleID, true);\r\n }\r\n else {\r\n //if (this.selectedJurisdictionList.length == 5) {\r\n // alert('Only a maximum of 5 jursidictions can be selected at once.');\r\n // shouldSkip = true;\r\n // return;\r\n\r\n //}\r\n // else {\r\n this.addJurisdictionToSelected(eleName, eleID, true);\r\n // }\r\n }\r\n });\r\n\r\n this.renderJurisdictionList();\r\n //}\r\n }.bind(this));\r\n });\r\n selectAllQuestions.addEventListener('click', function (e) {\r\n let checkbox = document.getElementById('selectAllQuestions');\r\n\r\n var selecting = false;\r\n\r\n if (checkbox.checked == false) {\r\n checkbox.checked = true;\r\n selecting = true;\r\n }\r\n else {\r\n checkbox.checked = false;\r\n }\r\n var checkboxes = this.questionsQuickLookup;\r\n\r\n checkboxes.forEach((c) => {\r\n c.element.checked = selecting;\r\n if (selecting) {\r\n this.addQuestionToSelectedList(c.element.value);\r\n }\r\n else {\r\n this.removeQuestionFromSelectedList(c.element.value);\r\n }\r\n });\r\n if (!selecting) {\r\n this.selectedQuestionList = [];\r\n this.buildFilters();\r\n }\r\n }.bind(this));\r\n\r\n selectAllJurisdictions.addEventListener('click', function (e) {\r\n let checkbox = document.getElementById('selectAllJurisdictions');\r\n\r\n var selecting = false;\r\n\r\n if (checkbox.checked == false) {\r\n //checkbox.checked = true;\r\n selecting = true;\r\n }\r\n else {\r\n //checkbox.checked = false;\r\n }\r\n var checkboxes = this.jurisdictionQuickLookup;\r\n\r\n checkboxes.forEach((c) => {\r\n c.element.checked = selecting;\r\n if (selecting) {\r\n this.addJurisdictionToSelectedList(c.element.name, c.element.value);\r\n\r\n selectAllJurisdictionsInGroup.forEach(function (selectAllBox) {\r\n selectAllBox.checked = true;\r\n });\r\n }\r\n else {\r\n this.removeJurisdictionFromSelectedList(c.element.value);\r\n\r\n selectAllJurisdictionsInGroup.forEach(function (selectAllBox) {\r\n selectAllBox.checked = false;\r\n });\r\n }\r\n });\r\n if (!selecting) {\r\n this.selectedJurisdictionList = [];\r\n this.buildFilters();\r\n }\r\n\r\n this.renderJurisdictionList();\r\n }.bind(this));\r\n\r\n selectAllJurisdictionsInGroup.forEach(function (selectAllBox) {\r\n selectAllBox.addEventListener('click', function (e) {\r\n\r\n var selecting = false;\r\n\r\n if (selectAllBox.checked == true) {\r\n //checkbox.checked = true;\r\n selecting = true;\r\n }\r\n\r\n var selectAllBoxVal = parseInt(selectAllBox.value);\r\n var selector = \".CBGroup_\" + selectAllBoxVal;\r\n var groupContainers = document.querySelectorAll(selector);\r\n\r\n //The checkboxes might be split across multiple groups in different columns, so we need to collate them\r\n var checkboxes = [];\r\n groupContainers.forEach((group) => {\r\n var boxes = group.querySelectorAll('.jurisdiction-checkbox');\r\n boxes.forEach((box) => {\r\n checkboxes.push(box);\r\n });\r\n });\r\n\r\n checkboxes.forEach((c) => {\r\n c.checked = selecting;\r\n if (selecting) {\r\n this.addJurisdictionToSelectedList(c.name, c.value);\r\n }\r\n else {\r\n this.removeJurisdictionFromSelectedList(c.value);\r\n }\r\n });\r\n\r\n if (selecting) {\r\n this.buildFilters();\r\n }\r\n\r\n this.renderJurisdictionList();\r\n\r\n if (selecting) {\r\n scrollToAnchorIDVanilla(\"autoCompleteStage1\");\r\n }\r\n\r\n }.bind(this));\r\n }.bind(this));\r\n\r\n document.querySelectorAll(\"a.guides__question-list-group\").forEach((ele) => {\r\n ele.addEventListener(\"click\", function (e) {\r\n var groupId = e.target.getAttribute('data-group-id');\r\n console.log(groupId);\r\n\r\n document.querySelectorAll(`input[data-group-id=\"${groupId}\"]`).forEach((questionEle) => {\r\n var questionId = questionEle.value;\r\n\r\n if (questionEle.checked) {\r\n questionEle.checked = false;\r\n this.removeQuestionFromSelectedList(questionId);\r\n }\r\n else {\r\n questionEle.checked = true;\r\n this.addQuestionToSelectedList(questionId);\r\n }\r\n });\r\n }.bind(this));\r\n });\r\n\r\n // Select all / None question buttons\r\n document.querySelectorAll(\"#questionsContainer .selectAllNoneQuestions\").forEach((ele) => {\r\n ele.addEventListener(\"click\", function (e) {\r\n console.log('Clicked select all none question');\r\n\r\n e.preventDefault();\r\n\r\n let selecting = false;\r\n if (e.currentTarget.classList.contains('all')) {\r\n selecting = true;\r\n }\r\n\r\n var checkboxes = this.questionsQuickLookup;\r\n\r\n checkboxes.forEach((c) => {\r\n c.element.checked = selecting;\r\n });\r\n }.bind(this));\r\n });\r\n\r\n // Jurisdiction quick lookup\r\n jurisdictionCheckboxList = document.querySelectorAll('#jurisdictionCheckboxes input[type=checkbox]:not(.jurisdictionSelectAll)');\r\n jurisdictionCheckboxList.forEach((val, index) => {\r\n this.jurisdictionQuickLookup.push({ id: parseInt(val.getAttribute('id')), element: val });\r\n });\r\n // Question quick lookup\r\n let questionCheckboxList = document.querySelectorAll('#questionsContainer input[type=checkbox]');\r\n\r\n questionCheckboxList.forEach((val, index) => {\r\n this.questionsQuickLookup.push({ id: parseInt(val.getAttribute('id')), element: val });\r\n });\r\n console.log(questionCheckboxList);\r\n\r\n // Title\r\n // document.getElementById('guide--title').innerHTML = guideTitle;\r\n\r\n // Debug\r\n //this.selectedJurisdictionList.push({ id: 42254, caption: 'Canada, Ontario' });\r\n //this.selectedJurisdictionList.push({ id: 42265, caption: 'Canda, Quebec' });\r\n //console.log('this.selectedJurisdictionList : %o ', this.selectedJurisdictionList);\r\n //this.renderJurisdictionList();\r\n }, // Init\r\n\r\n showErrorMessage: function (message) {\r\n this.guideErrorMessages.innerHTML = message;\r\n this.guideErrorMessages.classList.remove('hidden');\r\n scrollToAnchorIDVanilla('guideErrorMessages');\r\n },\r\n clearErrorMessage: function () {\r\n this.guideErrorMessages.classList.add('hidden');\r\n this.guideErrorMessages.innerHTML = '';\r\n },\r\n\r\n removeJurisdictionFromSelectedList: function (id, suppressRefresh = false) {\r\n //alert(\"Removed\");\r\n var newList = this.selectedJurisdictionList;\r\n /* console.log(\"NEw list: %o, Id: %o\", newList, id);*/\r\n this.selectedJurisdictionList.forEach((val, index) => {\r\n if (val.id == id) {\r\n // Remove from the checkbox list\r\n let found = newList.find(o => o.id == id);\r\n found.clicked = false;\r\n\r\n // Remove from the array\r\n newList.splice(index, 1);\r\n }\r\n });\r\n\r\n this.selectedJurisdictionList = newList;\r\n if (!suppressRefresh) {\r\n this.renderJurisdictionList();\r\n }\r\n this.buildFilters();\r\n },\r\n buildFilters: function () {\r\n //console.log(' In filters : %o', filterObj.city.join());\r\n var params = new URLSearchParams(window.location.search);\r\n console.log(\"J: %o\", this.selectedJurisdictionList);\r\n this.selectedJurisdictionList.length > 0 ? params.set('jurisdictions', commaEncodeList(this.selectedJurisdictionList, false).join()) : params.delete('jurisdictions');\r\n this.selectedQuestionList.length > 0 ? params.set('questions', commaEncodeList(this.selectedQuestionList, true).join()) : params.delete('questions');\r\n\r\n var sparam = '' + params;\r\n if (sparam !== '') {\r\n window.history.replaceState({}, '', window.location.pathname + '?' + params);\r\n } else {\r\n window.history.replaceState({}, '', window.location.pathname);\r\n }\r\n },\r\n addJurisdictionToSelectedList: function (caption, id, isAutoComplete = false) {\r\n // Already in the list?\r\n for (let item of this.selectedJurisdictionList) {\r\n //if (this.selectedJurisdictionList.length == 5) {\r\n // alert('Only a maximum of 5 jursidictions can be selected at once.');\r\n // return false;\r\n\r\n //}\r\n if (item.id == id) {\r\n if (isAutoComplete) { // Auto complete searched for existing result\r\n if (confirm('This items has already been added. Do you want to remove it?')) {\r\n this.removeJurisdictionFromSelectedList(id);\r\n }\r\n }\r\n this.buildFilters();\r\n return false;\r\n }\r\n }\r\n\r\n // Not got this one\r\n this.selectedJurisdictionList.push({ id: id, caption: caption });\r\n this.buildFilters();\r\n\r\n return true;\r\n },\r\n addQuestionToSelectedList: function (id) {\r\n console.log(\"Question id: %o\", id);\r\n // Already in the list?\r\n for (let item of this.selectedQuestionList) {\r\n if (item == id) {\r\n this.removeQuestionFromSelectedList(id);\r\n\r\n this.buildFilters();\r\n return false;\r\n }\r\n }\r\n\r\n // Not got this one\r\n this.selectedQuestionList.push(id);\r\n console.log(\"Selected Question list: %o\", this.selectedQuestionList);\r\n this.buildFilters();\r\n return true;\r\n },\r\n removeQuestionFromSelectedList: function (id, suppressRefresh = false) {\r\n //alert(\"Removed\");\r\n var newList = this.selectedQuestionList;\r\n\r\n this.selectedQuestionList.forEach((val, index) => {\r\n if (val == id) {\r\n // Remove from the checkbox list\r\n let found = newList.find(o => o === id);\r\n found.clicked = false;\r\n\r\n // Remove from the array\r\n newList.splice(index, 1);\r\n }\r\n });\r\n console.log(\"New list: %o\", newList);\r\n this.selectedQuestionList = newList;\r\n\r\n this.buildFilters();\r\n },\r\n renderJurisdictionList: function () {\r\n console.log('Render list with : %o', this.selectedJurisdictionList);\r\n var globalThis = this;\r\n\r\n // Clear everything out\r\n document.getElementById('jurisdictionList').innerHTML = '';\r\n jurisdictionCheckboxList.forEach((v) => {\r\n v.checked = false;\r\n })\r\n\r\n // Re-apply all\r\n this.selectedJurisdictionList.forEach((val, index) => {\r\n // Top templates\r\n let id = val.id;\r\n let caption = val.caption;\r\n let template = `