From 6c1b17a138bab57bcbe8ed951d700ffc55823748 Mon Sep 17 00:00:00 2001 From: Alex Date: Fri, 10 Mar 2023 14:56:32 -0500 Subject: [PATCH 01/21] Code refactor --- .../career-planning-tool/wfm-filter.html | 195 +++ .../career-planning-tool/wfm-header.html | 15 + .../career-planning-tool/wfm-results.html | 133 ++ assets/js/facets.js | 1131 ----------------- .../facets-filters/facets-left-buttons.js | 312 +++++ .../facets-filters/facets-top-filters.js} | 311 ++--- assets/js/facets/facets-filters/facets.js | 348 +++++ .../js/facets/facets-result/facets-result.js | 72 ++ .../js/facets/facets-search/facets-search.js | 193 +++ assets/js/facets/facets-utility.js | 337 +++++ assets/js/{ => facets}/facets.spec.js | 0 career-planning-tool/index.html | 353 +---- 12 files changed, 1730 insertions(+), 1670 deletions(-) create mode 100644 _includes/career-planning-tool/wfm-filter.html create mode 100644 _includes/career-planning-tool/wfm-header.html create mode 100644 _includes/career-planning-tool/wfm-results.html delete mode 100644 assets/js/facets.js create mode 100644 assets/js/facets/facets-filters/facets-left-buttons.js rename assets/js/{facets-utility.js => facets/facets-filters/facets-top-filters.js} (51%) create mode 100644 assets/js/facets/facets-filters/facets.js create mode 100644 assets/js/facets/facets-result/facets-result.js create mode 100644 assets/js/facets/facets-search/facets-search.js create mode 100644 assets/js/facets/facets-utility.js rename assets/js/{ => facets}/facets.spec.js (100%) diff --git a/_includes/career-planning-tool/wfm-filter.html b/_includes/career-planning-tool/wfm-filter.html new file mode 100644 index 000000000..40f6cb8ed --- /dev/null +++ b/_includes/career-planning-tool/wfm-filter.html @@ -0,0 +1,195 @@ +
+

Filter your results

+
+ +

Job Series

+
+ {% assign series_array = "" | split: "," %} + + {% for item in site.cards %} + {% if item.category == 'career' %} + {% if series_array contains item.job_series %} + + {% else %} + {% assign series_array = series_array | push: item.job_series %} + {% endif %} + {% endif %} + {% endfor %} + + {% assign series_array = series_array | sort %} + {% for series in series_array %} + {% assign series_id = series | downcase | slice: 0, 4 |replace: ", ", "-" | replace: " ", "-" %} + + {% endfor %} +
+ +

GS Level

+
+ {% assign level_array = "" | split: "," %} + + {% for item in site.cards %} + {% if item.category == 'career' %} + {% if level_array contains item.level %} + + {% else %} + {% assign level_array = level_array | push: item.level %} + {% endif %} + {% endif %} + {% endfor %} + + {% assign level_array = level_array | numerical_sort %} + {% for level in level_array %} + {% assign level_id = level | downcase | replace: ", ", "-" | replace: " ", "-" %} + + {% endfor %} +
+ +
+

Job Specific Technical Competencies

+
+ + +
+
+
+ {% assign competency_group_array = site.cards | where: 'category', 'career' | map: 'competency_group' | uniq %} + {% assign job_comps = 'Primary,Secondary,Alternate' | split: "," %} + {% assign general_comps = site.cards | map: 'competency_group' | uniq %} + {% for comp in job_comps %} + {% assign general_comps = general_comps | where_exp: "item", "item != comp" %} + {% endfor %} + {% assign competency_sort_array = 'Personal,Project,Leading,Future Skills' | split: ',' %} + {% assign sorted_competency_group_array = "" | split: "," %} + + {% for comp in competency_sort_array %} + {% for comp2 in general_comps %} + {% if comp == comp2 %} + {% assign sorted_competency_group_array = sorted_competency_group_array | push: comp | uniq %} + {% endif %} + {% endfor %} + {% endfor %} + + {% comment %} + Loops through the job specific competencies to print their filters on the page. + {% endcomment %} + {% for competency_group in job_comps %} + {% assign competency_array = site.cards | where: 'category', 'career' | where: 'competency_group', competency_group | map: 'competency' | uniq | sort %} + + {% assign competency_group_id = competency_group | replace: ", ", "-" | replace: " ", "-" %} +
+
+
+
+ +
+
+ + +
+
+
+ {% for competency in competency_array %} + {% assign competency_id = competency | replace: ", ", "-" | replace: " ", "-" %} + + {% endfor %} +
+
+
+ {% endfor %} +
+
+

General Career
Competencies

+
+ + +
+
+
+ {% for competency_group in sorted_competency_group_array %} + {% assign competency_array = site.cards | where: 'category', 'career' | where: 'competency_group', competency_group | map: 'competency' | uniq | sort %} + + {% assign competency_group_id = competency_group | replace: ", ", "-" | replace: " ", "-" %} +
+
+
+
+ +
+
+ + +
+
+
+ {% for competency in competency_array %} + {% assign competency_id = competency | replace: ", ", "-" | replace: " ", "-" %} + + {% endfor %} +
+
+
+ {% endfor %} + +
+
+
\ No newline at end of file diff --git a/_includes/career-planning-tool/wfm-header.html b/_includes/career-planning-tool/wfm-header.html new file mode 100644 index 000000000..4818fa1df --- /dev/null +++ b/_includes/career-planning-tool/wfm-header.html @@ -0,0 +1,15 @@ +
+
+
+
back to CFO.gov
+
+
+
+

Career Planning & Training Tool (in BETA)

+
+
+

Discover the knowledge, skills, and training that can help advance your Federal career

+
+
+
+
\ No newline at end of file diff --git a/_includes/career-planning-tool/wfm-results.html b/_includes/career-planning-tool/wfm-results.html new file mode 100644 index 000000000..94b1a3f68 --- /dev/null +++ b/_includes/career-planning-tool/wfm-results.html @@ -0,0 +1,133 @@ + +
+ +
+
+ +
+ + + +
+
+ +
+ + +
+
+ + +
+ +
+
+ Clear All +
+
+ +
+ +
+
+
+ {% assign post_count = site.cards | size %} + {% assign default_page_size = 10 %} + {% assign post_pages = post_count | divided_by: default_page_size %} + {% assign post_modulus = post_count | minus: post_pages | times: default_page_size %} + {% if post_modulus > 0 %} + {% assign post_pages = post_pages | plus: 1 %} + {% endif %} +
+

1

/

{{ post_pages }}

{{ post_count }}

Results +
+
+ + +
+
+
+ + {% assign series = '501'%} + {% assign level = '7-9'%} + {% assign pcards = site.cards | where: 'series', series | where: 'level', level | where: 'competency_group', 'Primary' %} + {% assign scards = site.cards | where: 'series', series | where: 'level', level | where: 'competency_group', 'Secondary' %} + {% assign cards = pcards | concat: scards %} + {% for card in cards limit:default_page_size %} +
+
+
+
+ +
+
+
GS Level: {{ card.level }}
+
Job Series: 0{{ card.series }}
+
+
+
Competency: {{ card.competency }}
+
Type: {{ card.competency_group }}
+
+

Definition: {{ card.competency_description }}

+
+ {{ card.content }} +
+
+

Career Listing

+ {% if card.relevant_courses.size != 0 %} +
    + {% for course in card.relevant_courses %} +
  • {{ course | replace: '">', '" target="_blank" >'}}
    • + {% endfor %} +
      + {% else %} +

      No courses

      + {% endif %} +
+
+
+
+ {% endfor %} +
+
+
+

1

/

{{ post_pages }}

{{ post_count }}

Results +
+
+ + +
+
+
diff --git a/assets/js/facets.js b/assets/js/facets.js deleted file mode 100644 index bd6239297..000000000 --- a/assets/js/facets.js +++ /dev/null @@ -1,1131 +0,0 @@ -/** - * Set global values. - */ -let facetGlobalVars = { - data: [], // the array that holds the search terms and the filters - results: [], // the array that holds the results from searching a filtering - adding: false, // if adding to results - removing: false, // if removing from results - fullSet: [], // a full set of all competency_group and competencies - competency: [], // array of competencies - competency_group: [], // array of competency_groups - searchOrder: [], // hold a list of objects representing the order of a search competency, level, series etc.. - searchKeys: [ // when searching the columns to search - Competency Description, Proficiency Level Definition, Behavioral Illustrations, Relevant Courses - "title", - "competency_description", - "proficiency_level_definition", - "behavioral_illustrations", - "relevant_courses", - ], - start: 0, - perPage: parseInt($('select[name="per_page"]').val()) || 10, - totalItems: 105, // total items in results array - totalPages: 11, // total pages in results array / pagination items per page - currentPage: 1, // pagination current page - inProgressCheckAll: false // is checking all process in progress? -}; - -/** - * @file Facets code. - * Wrap all code with jQuery function. - */ -$(document).ready(function () { - - /** - * loads all md pages on init - */ - $.getJSON(window.federalist.path.baseurl + '/search.json', function (res) { - - $('#career-advancement-search-input').val(''); - if ($("#career-competency-select-all").is(":checked")) { - $("#career-competency-select-all").prop("checked", false); - } - - res.forEach(item => { - if (!facetGlobalVars.competency.includes(item.competency)) { - facetGlobalVars.competency.push(item.competency); - } - if (!facetGlobalVars.competency_group.includes(item.competency_group)) { - facetGlobalVars.competency_group.push(item.competency_group); - } - facetGlobalVars.results.push(item); - facetGlobalVars.fullSet.push(item); - }); - - $("input:checkbox").each(function () { - $(this).prop('checked', false); - }); - - $("#career-competency-select-all").on("focus", function () { - $('label[for="career-competency-select-all"]').addClass("padding-05"); - $('label[for="career-competency-select-all"]').css("outline", "0.25rem solid #2491ff"); - }); - - $("#career-competency-select-all").on("blur", function () { - $('label[for="career-competency-select-all"]').removeClass("padding-05"); - $('label[for="career-competency-select-all"]').css("outline", "none"); - }); - - $("#job-career-competency-select-all, #general-career-competency-select-all").on('change', function () { - var id = this.id; - let comps = Array.from(getVisibleFacets()); - - if (id === 'job-career-competency-select-all') { - var jobSelect = '#job-career-competency-select'; - if ($(jobSelect).text() === 'Select All') { - $(jobSelect).html("De-Select All"); - facetGlobalVars.competency_group.forEach(item => { - if (comps.some(x => x.group === item.toLowerCase())) { - let itemElement = $().createId(item); - let eventId = document.getElementById(itemElement); - if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'job-specific') { - $().toggleSelectAll(itemElement, true); - } - } - }); - } else { - $(jobSelect).html("Select All"); - facetGlobalVars.competency_group.forEach(item => { - let itemElement = $().createId(item); - let eventId = document.getElementById(itemElement); - if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'job-specific') { - $().toggleSelectAll(itemElement, false); - } - }); - } - } - if (id === 'general-career-competency-select-all') { - var generalSelect = '#general-career-competency-select'; - if ($(generalSelect).text() === 'Select All') { - $(generalSelect).html("De-Select All"); - facetGlobalVars.competency_group.forEach(item => { - if (comps.some(x => x.group === $().createId(item))) { - let itemElement = $().createId(item); - let eventId = document.getElementById(itemElement); - if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'general') { - $().toggleSelectAll(itemElement, true); - } - } - }); - } else { - $(generalSelect).html("Select All"); - facetGlobalVars.competency_group.forEach(item => { - let itemElement = $().createId(item); - let eventId = document.getElementById(itemElement); - if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'general') { - $().toggleSelectAll(itemElement, false); - } - }); - } - } - if (!ifExistsInArray('competency', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('competency'); - let major_group = ''; - if (this.id.includes('job')) { - major_group = 'job-specific'; - } else if (this.id.includes('general')) { - major_group = 'general'; - } - let checked = this.checked; - facetGlobalVars.inProgressCheckAll = true; - $('[data-filter="competency"][data-major-group="' + major_group + '"]').each((index, elem) => { - let $elem = $(elem), - comp = $elem.attr('aria-label'), - group = $elem.attr('data-group'); - if (comps.some(x => x.comp === comp && x.group.toLowerCase() === group)) { - $(elem).prop({checked: checked}); - if (elem.hasAttribute('data-group')) { - $elem.trigger('change'); - } - } - }); - facetGlobalVars.inProgressCheckAll = false; - $().getSearch(); - }); - - // create an array of everything of both disabled and active. - facetGlobalVars.competency_group.forEach(groupItem => { - let eventGroupId = $().createId(groupItem); - if (eventGroupId !== "") { - facetGlobalVars.competency.forEach(item => { - let eventId = $().createId(eventGroupId + " " + item); - if (eventId !== "") { - $("#" + eventId).on('change', function () { - if (this.checked) { - if (!ifExistsInArray('competency', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('competency'); - if (!ifExists(eventId)) { - createRemoveButtons('checkbox', eventId, this, eventGroupId, item); - } - } else { - let labelId = "#competency-group-label-" + eventGroupId; - if ($("#" + eventId).closest('.career-competency-level-4-input-group').css('display') === 'block') { - $(labelId).attr('data-state', 'disabled').html("Select All").change(); - disableGlobalSelect(eventGroupId); - } - $("#" + eventId).prop("checked", false); - let group = $("#" + eventId).data('group'); - facetGlobalVars.removing = true; - addRemoveFilterButton(group, item, null, false); - if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); - if ($("#career-competency-select-all").is(":checked")) { - $("#career-competency-select-all").prop("checked", false); - } - facetGlobalVars.data = $.grep(facetGlobalVars.data, function (e) { - return e.id !== eventId; - }); - $().adjustSearchOrder(); - if (facetGlobalVars.data.length === 0) { - facetGlobalVars.searchOrder = []; - resetFilterBlocks(); - } - $("#" + eventId + "-button").remove(); - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - } - }); - } - }); - } - }); - facetGlobalVars.competency_group.forEach(item => { - let eventId = $().createId(item); - if (eventId !== "") { - $("#" + eventId).on("focus", function () { - $('label[for="' + eventId + '"]').addClass("padding-05"); - $('label[for="' + eventId + '"]').css("outline", "0.25rem solid #2491ff"); - }); - - $("#" + eventId).on("blur", function () { - $('label[for="' + eventId + '"]').removeClass("padding-05"); - $('label[for="' + eventId + '"]').css("outline", "none"); - }); - $("#" + eventId).unbind('change').on('change', function () { - let labelId = "#competency-group-label-" + eventId, - checked; - if ($(labelId).text() === 'Select All') { - $().toggleSelectAll(eventId, true); - checked = true; - } else { - addRemoveFilterButton(eventId, '', null, true); - removeParentContainers(eventId); - $().toggleSelectAll(eventId, false); - disableGlobalSelect(eventId); - checked = false; - } - - if (checked) { - if (!ifExistsInArray('competency', facetGlobalVars.searchOrder)) { - facetGlobalVars.searchOrder.push('competency'); - } - - let comps = getVisibleFacets(); - facetGlobalVars.inProgressCheckAll = true; - comps.forEach(x => { - if (eventId === x.group) { - $('input:checkbox[data-group="' + x.group + '"][aria-label="' + x.comp + '"]').prop({'checked': true}).trigger('change'); - } - }); - facetGlobalVars.inProgressCheckAll = false; - $().getSearch(); - } else { - facetGlobalVars.adding = false; - facetGlobalVars.removing = true; - $("#" + eventId).prop("checked", false); - facetGlobalVars.competency.forEach(competencyItem => { - let eventCompetencyId = $().createId(eventId + " " + competencyItem); - if ($("#" + eventCompetencyId).data("group") === eventId) { - $("#" + eventCompetencyId).prop('checked', false); - $("#" + eventCompetencyId + "-button").remove(); - facetGlobalVars.data = $.grep(facetGlobalVars.data, function (e) { - return e.id !== eventCompetencyId; - }); - $().adjustSearchOrder(); - if (facetGlobalVars.data.length === 0) { - facetGlobalVars.searchOrder = []; - resetFilterBlocks(); - } - } - }); - $.grep(facetGlobalVars.data, function (e) { - return e.id !== eventId; - }); - $().adjustSearchOrder(); - if (facetGlobalVars.data.length === 0) { - resetFilterBlocks(); - } - $("#" + eventId + "-button").remove(); - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - } - }); - } - }); - - setTotalPages(); - }); - - /** - * Change group Select/De-Select all button. - * @param {string} eventGroupId - Group id. - */ - function disableGlobalSelect(eventGroupId) { - let labelId = $('#' + eventGroupId).data('major-group') === 'job-specific' - ? 'job-career-competency-select' : 'general-career-competency-select'; - $('#' + labelId).html('Select All').next('input').prop('checked', false); - } - - /** - * Change group Select/De-Select all button. - * @param {string} eventGroupId - Group id. - */ - function enableGlobalSelect(eventGroupId) { - let majorGroup = $('#' + eventGroupId).data('major-group'); - let status = true; - $('input.text-offscreen[data-major-group="' + majorGroup + '"]').each(function() { - if ($(this).prev('label').attr('data-state') !== 'enabled') { - status = false; - } - }); - if (status) { - let labelId = $('#' + eventGroupId).data('major-group') === 'job-specific' - ? 'job-career-competency-select' : 'general-career-competency-select'; - $('#' + labelId).html('De-Select All').next('input').prop('checked', true); - } - } - - - /** - * returns the type of filter - * @param {string} id a button id - * @returns - series, level or competency - */ - function getFilterType(id) { - const series = new RegExp('series-*'); - const level = new RegExp('GS-*'); - if (series.test(id)) return 'series'; - else if (level.test(id)) return 'level'; - return 'competency'; - } - - /** - * Create a clear all filters button - */ - function createClearButton() { - $("#career-facet-remove-all-filters-button").on('click', function () { - facetGlobalVars.adding = false; - facetGlobalVars.removing = true; - - facetGlobalVars.data.forEach(item => { - if (item.keys != null) { - $('#career-advancement-search-input').val(''); - $('#career-advancement-search-input').removeAttr('value'); - } else { - if (item.type === 'checkbox') { - $("#" + item.id).prop("checked", false); - let group = $("#" + item.id).data('group'); - if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); - if ($("#career-competency-select-all").is(":checked")) $("#career-competency-select-all").prop("checked", false); - } else $("#" + item.id).toggleClass('active'); - $("#" + item.id + "-button").remove(); - } - }) - facetGlobalVars.data = []; - facetGlobalVars.searchOrder = []; - resetFilterBlocks(); - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - - $('.career-competency-level-3-input-group label[data-state="enabled"]').attr('data-state', 'disable').html('Select All').change(); - $("#dialog").dialog().dialog("close"); - }); - } - - /** - * returns if an element exists in an array - * @param {string} elm - element in array - * @param {*} array - array to search - * @returns bool - */ - function ifExistsInArray(elm, array) { - let exists = false; - array.forEach(item => { - if (item === elm) exists = true; - }); - return exists; - } - - /** - * returns if a search or facet filter exists in the data array - * @param {string} id the id of the element - * @returns bool - */ - function ifExists(id) { - let exists = false; - facetGlobalVars.data.forEach(item => { - if (item.id === id) exists = true; - }); - return exists; - } - - /** - * returns if an item exists in the results array - * @param {string} title - the title - * @param {array} array - the array to search - * @returns - bool - */ - function ifExistsResults(title, array) { - let exists = false; - array.forEach(item => { - if (item.permalink === title) exists = true; - }); - return exists; - } - - /** - * sets totalItems in results array - */ - function setTotalItems() { - facetGlobalVars.totalItems = facetGlobalVars.results.length; - } - - /** - * sets totalPages for pagination - */ - function setTotalPages() { - if (!facetGlobalVars.results.length) { - if (facetGlobalVars.searchOrder.length) { - facetGlobalVars.totalPages = 0; - } else { - facetGlobalVars.totalPages = Math.ceil(facetGlobalVars.fullSet.length / facetGlobalVars.perPage); - } - } else { - facetGlobalVars.totalPages = Math.ceil(facetGlobalVars.results.length / facetGlobalVars.perPage); - } - } - - /** - * sets currentPage for pagination - * @param {string} page - integer representing the current page of pagination - */ - function setCurrentPage(page) { - facetGlobalVars.currentPage = page; - } - - /** - * creates a single card result and adds it to the Dom - * @param {bool} noResults true if no results false if results - * @param {object} item - and item(variables of an md file) to be made into the card html - */ - function createResults(noResults, item) { // creates a results div and contents - const outerDiv1 = document.createElement("div"); - outerDiv1.setAttribute("class", "tablet:grid-col-12 grid-spacing policy"); - const outerDiv2 = document.createElement("div"); - outerDiv2.setAttribute("class", "cfo-career-outer-box"); - outerDiv1.append(outerDiv2); - const outerDiv3 = document.createElement("div"); - outerDiv3.setAttribute("class", "cfo-career-text-container position-relative"); - outerDiv2.append(outerDiv3); - if (noResults) { - const textArea = document.createElement("p"); - textArea.setAttribute("class", "cfo-career-results-text-bold"); - outerDiv3.appendChild(textArea); - const text1 = document.createTextNode("Your search has turned up no results."); - textArea.appendChild(text1); - const textArea2 = document.createElement("p"); - outerDiv3.appendChild(textArea2); - const text2 = document.createTextNode('Check if your spelling is correct, or try removing filters. Remove quotes around phrases to match each word individually: "blue drop" will match less than blue drop.'); - textArea2.appendChild(text2); - } else { - let template = '
' - + '
GS Level: {{ card.level }}
' - + '
Job Series: {{ card.series }}
' - + '
' - + '
' - + '
Competency: {{ card.competency }}
' - + '
Type: {{ card.competency_group }}
' - + '
' - + '

Definition: {{ card.competency_description }}

'; - outerDiv3.innerHTML = template.replace('{{ card.level }}', item.level) - .replace('{{ card.series }}', item.series) - .replace('{{ card.competency }}', item.competency) - .replace('{{ card.competency_group }}', item.competency_group) - .replace('{{ card.competency_description }}', item.competency_description); - - const innerDiv2 = document.createElement("div"); - innerDiv2.setAttribute("class", "grid-row grid-gap"); - outerDiv3.append(innerDiv2); - innerDiv2.innerHTML = item.content; - - const coursesDiv = document.createElement('div'); - let courseMarkup = ''; - } else { - courseMarkup = '

No courses

'; - } - coursesDiv.innerHTML = '

Career Listing

' + courseMarkup; - outerDiv3.append(coursesDiv); - - const selectButtonWrapper = document.createElement('div'); - outerDiv3.prepend(selectButtonWrapper); - selectButtonWrapper.setAttribute("class", "select-button"); - selectButtonWrapper.innerHTML = '' - } - const resultsContainer = document.getElementById("career-search-results"); - resultsContainer.appendChild(outerDiv1); - } - - /** - * Creates a single remove button. - * Called in two places - * 1) when a button is clicked - * 2) when a checkbox is checked - * - * @param {string} inputType - The type of input - button, checkbox - * @param {string} eventTargetId - The id of the object clicked - * @param {object} button - The this representation of the object clicked - button or checkbox - * @param {string} competencyGroup - The group id of the checkbox (not used with buttons) - * @param {string} competencyTitle - The competency title (not used with buttons) - */ - function createRemoveButtons(inputType, eventTargetId, button, competencyGroup, competencyTitle) { - if (inputType === "button") { - facetGlobalVars.data.push({ - id: eventTargetId, - type: 'button', - keys: null - }); - } else { - facetGlobalVars.data.push({ - id: eventTargetId, - type: 'checkbox', - keys: null - }); - } - - facetGlobalVars.adding = true; - facetGlobalVars.removing = false; - if (eventTargetId.match("GS")) { - if (!ifExistsInArray('level', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('level'); - } - if (eventTargetId.match("series")) { - if (!ifExistsInArray('series', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('series'); - } - if (facetGlobalVars.data.length === 1) { - createClearButton(); - $("#career-facet-remove-all-filters-button").css('display', 'block'); - } - if (inputType === "button") button.toggleClass("active"); - const removeButtonA = document.createElement("a"); - removeButtonA.setAttribute("id", eventTargetId + "-button"); - removeButtonA.setAttribute("tabindex", 0); - removeButtonA.setAttribute("href", "javascript:void(0)"); - removeButtonA.setAttribute("class", "usa-tag margin-top float-left bg-white text-black border-blue padding-05 margin-1 text-no-uppercase text-no-underline"); - let removeButtonText; - if (inputType === "button") { - removeButtonText = createButtonText(eventTargetId); - } else { - removeButtonText = (' ' + competencyGroup + " - " + competencyTitle).replace(/ [\w]/g, a => a.toLocaleUpperCase()).trim(); - } - - removeButtonA.innerHTML = removeButtonText + "  "; - - if (eventTargetId.match("series")) { - const buttonJobContainer = document.getElementById("career-search-results-filter-remove-buttons-series"); - buttonJobContainer.appendChild(removeButtonA); - $("#series").css('display', 'block'); - $("#btnSeries").attr('aria-expanded', 'false'); - $("#career-search-results-filter-remove-buttons-series").attr("hidden", true); - } - if (eventTargetId.match("GS")) { - const buttonGSContainer = document.getElementById("career-search-results-filter-remove-buttons-gs"); - buttonGSContainer.appendChild(removeButtonA); - $("#gs").css('display', 'block'); - $("#btnGS").attr('aria-expanded', 'false'); - $("#career-search-results-filter-remove-buttons-gs").attr("hidden", true); - } - if (competencyGroup != null) { - removeButtonA.removeAttribute("class"); - removeButtonA.setAttribute("class", "usa-tag bg-accent-warm margin-top float-left text-black padding-05 margin-1 text-no-uppercase text-no-underline"); - - if (eventTargetId.match("primary") || eventTargetId.match("secondary") || eventTargetId.match("alternate")) { - addRemoveFilterButton(competencyGroup, competencyTitle, removeButtonA, false); - $("#job-competency").css('display', 'block'); - $("#btnJobCompetency").attr('aria-expanded', 'false'); - $("#career-search-results-filter-remove-buttons-job-competency").attr("hidden", true); - } - if (eventTargetId.match("personal") || eventTargetId.match("project") || eventTargetId.match("leading") || eventTargetId.match("future-skills")) { - addRemoveFilterButton(competencyGroup, competencyTitle, removeButtonA, false); - $("#general-competency").css('display', 'block'); - $("#btnGeneralCompetency").attr('aria-expanded', 'false'); - $("#career-search-results-filter-remove-buttons-general-competency").attr("hidden", true); - } - //if ($("#" + competencyGroup + "-button").onclick == undefined) { - // $("#" + competencyGroup + "-button").on('click', function (e) { - // e.preventDefault(); - - // }); - //} - } - - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - - $("#" + eventTargetId + "-button").on('click', function () { - removeTagFilter(inputType, button != null && button.length > 0 ? button[0].id : null, eventTargetId); - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - }); - } - - /** - * removes the filters effects - * @param {string} inputType - if a button or checkbox - * @param {string} id - the id of the button or checkbox - */ - function removeCriteria(inputType, id) { - $('#' + id + '-button').remove(); - let elem = $('#' + id); - - if (inputType === 'button') { - elem.toggleClass('active'); - } else { - elem.prop('checked', false); - let group = $("#" + eventTargetId).data('group'); - if ($("#" + group).is(":checked")) { - $("#" + group).prop("checked", false); - } - if ($("#career-competency-select-all").is(":checked")) { - $("#career-competency-select-all").prop("checked", false); - } - } - - let target = -1; - for (let i = 0, l = facetGlobalVars.data.length; i < l; i++) { - if (facetGlobalVars.data[i].id === id) { - target = i; - break; - } - } - - facetGlobalVars.data.splice(target, 1); - $().adjustSearchOrder(); - if (facetGlobalVars.data.length === 0) { - facetGlobalVars.searchOrder = []; - resetFilterBlocks(); - } - - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - if (id.match("series")) { - const seriesLength = facetGlobalVars.data.filter(i => i.id.indexOf("series") > -1); - if (seriesLength.length === 0) { - $("#series").css('display', 'none'); - } - } - if (id.match("GS")) { - const gsLength = facetGlobalVars.data.filter(i => i.id.indexOf("GS") > -1); - if (gsLength.length === 0) { - $("#gs").css('display', 'none'); - } - } - } - - - $.fn.extend({ - /** - * adjusts the searchOrder array - */ - adjustSearchOrder: function () { - let newSearchOrder = []; - facetGlobalVars.data.forEach(item => { - if (item.type === 'keys') { - if (!ifExistsInArray('search', newSearchOrder)) { - newSearchOrder.push('search'); - } - } else { - if (!ifExistsInArray(getFilterType(item.id), newSearchOrder)) { - newSearchOrder.push(getFilterType(item.id)); - } - } - }); - facetGlobalVars.searchOrder = []; - newSearchOrder.forEach(item => { - facetGlobalVars.searchOrder.push(item); - }); - }, - - /** - * Iterates over the searchOrder array and creates results based upon the filters selected - * Uses enableDisableCompetencies and the createResults - */ - getSearch: function () { - // console.log(facetGlobalVars); - facetGlobalVars.results = []; - // create a count of the the items displayed and display it. - // count all search results for an item as a sanity check and make a spread sheet. - if (facetGlobalVars.searchOrder.length > 0) { - facetGlobalVars.searchOrder.forEach((searchItem, index) => { - let newResults = []; - if (searchItem === 'search') { - // create a results array for the next search criteria - facetGlobalVars.fullSet.forEach(item => { // go over all loaded md pages - facetGlobalVars.searchKeys.forEach(term => { - facetGlobalVars.data.forEach(obj => { // go over the search and facets selected - if (obj.type === 'keys' && typeof item[term] !== "undefined") { - let stringToMatch = Array.isArray(item[term]) ? item[term].join(' ') : item[term]; - stringToMatch = stringToMatch.replace(/[^a-zA-Z0-9\s]/g, "").toLowerCase(); - if (stringToMatch.match(obj.keys.toLowerCase().replace(/[^a-zA-Z0-9\s]/g, ""))) { - if (!ifExistsResults(item.permalink, newResults)) { - newResults.push(item); - } - } - } - }); - }); - }); - } else { - // create a results array for the next search criteria - facetGlobalVars.fullSet.forEach(item => { // go over all loaded md pages - facetGlobalVars.data.forEach(obj => { // go over the search and facets selected - if (getFilterType(obj.id) === searchItem) { - let filters = item.filters.split(" "); - let val = ''; - switch (getFilterType(obj.id)) { - case 'series': // Series - val = filters[2]; - break; - case 'level': // GS Level - val = filters[1]; - break; - case 'competency': // Group - Competency - val = filters[0]; - } - - if (val.toLowerCase() === obj.id.toLowerCase()) { - if (!ifExistsResults(item.permalink, newResults)) { - newResults.push(item); - } - } - } - }); - }); - } - - // look for new filters in prior results set and if they are there - // save the prior results in to a different array. - let finishResults = []; - if (facetGlobalVars.results.length > 0) { - facetGlobalVars.results.forEach(item => { - newResults.forEach(newItem => { - if (item.permalink.toLowerCase() === newItem.permalink.toLowerCase()) { - if (!ifExistsResults(item.permalink, finishResults)) { - finishResults.push(item); - } - } - }); - }); - } else { - finishResults = newResults; - } - - // populate results with finishResults - facetGlobalVars.results = []; - finishResults.forEach(item => { - if (!ifExistsResults(item.title, facetGlobalVars.results)) { - facetGlobalVars.results.push(item); - } - }); - }); - enableDisableCompetencies(false); - $("#career-search-results").empty(); - - if (facetGlobalVars.results.length === 0) { - if (facetGlobalVars.searchOrder.length === 0) { - for (i = 0; i < Math.min(facetGlobalVars.fullSet.length, facetGlobalVars.perPage); i++) { - if (typeof (facetGlobalVars.fullSet[i]) != "undefined" && facetGlobalVars.fullSet[i] !== null) { - createResults(false, facetGlobalVars.fullSet[i]); - } - } - $(".cfo-pagination-results").text(facetGlobalVars.fullSet.length); - } else { - createResults(true); - setTotalItems(); - $(".cfo-pagination-results").text(facetGlobalVars.totalItems); - $(".cfo-page-right").attr("disabled", "disabled"); - $(".cfo-page-left").attr("disabled", "disabled"); - } - } else { - resultFullSetFilter(facetGlobalVars.results); - for (i = 0; i < Math.min(facetGlobalVars.results.length, facetGlobalVars.perPage); i++) { - if (typeof (facetGlobalVars.results[i]) != "undefined" && facetGlobalVars.results[i] !== null) { - createResults(false, facetGlobalVars.results[i]); - } - } - $(".cfo-page-left").attr("disabled", "disabled"); - $(".cfo-page-right").removeAttr("disabled"); - - setTotalItems(); - $(".cfo-pagination-results").text(facetGlobalVars.totalItems); - } - - setCurrentPage(1); - $(".cfo-pagination-page").text(facetGlobalVars.currentPage); - setTotalPages(); - $(".cfo-pagination-pages").text(facetGlobalVars.totalPages); - } else { - $("#career-search-results").empty(); - resultFullSetFilter(facetGlobalVars.fullSet); - for (i = 0; i < Math.min(facetGlobalVars.fullSet.length, facetGlobalVars.perPage); i++) { - if (typeof (facetGlobalVars.fullSet[i]) != "undefined" && facetGlobalVars.fullSet[i] !== null) { - createResults(false, facetGlobalVars.fullSet[i]); - } - } - $(".cfo-pagination-results").text(facetGlobalVars.fullSet.length); - setCurrentPage(1); - $(".cfo-pagination-page").text(facetGlobalVars.currentPage); - setTotalPages(); - $(".cfo-pagination-pages").text(facetGlobalVars.totalPages); - enableDisableCompetencies(true); - } - unselectAll(); - - if (facetGlobalVars.results.length === 0 && facetGlobalVars.data.length === 0) { - facetGlobalVars.results = facetGlobalVars.fullSet; - $('#career-facet-remove-all-filters-button').hide(); - } - }, - - /** - * creates an id from a space and/or comma delimited string - * @param {string} item - a string with spaces and/or commas - * @returns - a string delimited with dashes(-) - */ - createId: function (item) { - let newStr = item.replaceAll(', ', '-'); - let finalStr = newStr.replaceAll(' ', '-'); - return finalStr.toLowerCase(); - }, - - - /** - * Toggle Select/De-Select all button. - * @param {string} competencyGroup competency group - * @param {boolean} status True for enable De-Select All button - */ - toggleSelectAll: function (competencyGroup, status) { - let label = status ? 'De-Select All' : 'Select All'; - let state = status ? 'enabled' : 'disabled'; - $('#competency-group-label-' + competencyGroup).attr('data-state', state).html(label).change(); - if (!status) { - disableGlobalSelect(competencyGroup); - } else { - // Check global Select All status and set if it needed. - enableGlobalSelect(competencyGroup); - } - } - }); - - /** - * creates the remove button text - * @param {string} text - text to converted to name - * @returns button text - */ - function createButtonText(text) { - let part1 = text.split("-"); - if (part1[0] === 'GS') return part1[0] + " " + part1[1] + "-" + part1[2]; - else { - let removeButtonText = part1.join(" "); - return (' ' + removeButtonText).replace(/ [\w]/g, a => a.toLocaleUpperCase()).trim(); - } - } - - function getVisibleFacets() { - let filters = { - series: [], - level: [] - }; - // breakdown all relevant filters into just ones we're interested in for faceting purposes - facetGlobalVars.searchOrder.forEach(s => { - switch (s) { - case 'series': - filters[s] = facetGlobalVars.data.filter(x => x.id.match(/series-/)).map(x => x.id); - break; - case 'level': - filters[s] = facetGlobalVars.data.filter(x => x.id.match(/GS-/)).map(x => x.id); - break; - } - }); - - // filters cards to only those that match the selected, relevant filters - let items = facetGlobalVars.fullSet.filter((item) => { - let series_check = (filters.series.length === 0 || filters.series.some((y) => { - return item.filters.includes(y); - })), - level_check = (filters.level.length === 0 || filters.level.some((y) => { - return item.filters.includes(y); - })); - - return series_check && level_check; - }); - - return new Set(items.map((item) => { - return {comp: item.competency, group: item.competency_group.toLowerCase().replace(' ', '-')}; - })); - } - - /** - * Iterates through all checkboxes in results array and disable those that have no results. - * If in all mode it iterates through the full set and enables all checkboxes. - * @param {bool} all - if enable all checkboxes - */ - function enableDisableCompetencies(all) { - if (all) { - $('[data-filter="competency"]').parents('.career-competency-level-4-input-group, .career-competency-level-3-input-group').show(); - } else { - // hide everything - $('[data-filter="competency"]').parents('.career-competency-level-4-input-group').hide(); - - // and then selectively show what we want - let comps = getVisibleFacets(); - comps.forEach((item) => { - $('[data-filter="competency"][data-group="' + item.group + '"][title="' + item.comp + '"]').parents('.career-competency-level-4-input-group').show(); - }); - - // hide all competency groups - $('[data-filter="competency"]').parents('.career-competency-level-3-input-group').hide(); - - comps.forEach((item) => { - $('[data-filter="competency"][data-id="' + item.group + '"]').parents('.career-competency-level-3-input-group').show(); - }); - cleanUpData(); - } - } - - /** - * Remove hidden facets from the data array. - */ - function cleanUpData() { - // and then selectively show what we want - let comps = getVisibleFacets(); - // create values array from the facets array - let enabledFacets = []; - let notIncluded; - comps.forEach((item) => { - enabledFacets.push(item.group + '-' + $().createId(item.comp)); - }); - - notIncluded = facetGlobalVars.data.filter(function (dataItem) { - return (dataItem.type === 'checkbox' && !enabledFacets.includes(dataItem.id)); - }); - facetGlobalVars.data = facetGlobalVars.data.filter(function (dataItem) { - return (dataItem.type !== 'checkbox' || (dataItem.type === 'checkbox' && enabledFacets.indexOf(dataItem.id) !== -1)); - }); - // Reset competencies on cfoStorage. - if (notIncluded.length) { - notIncluded.forEach((item) => { - $('#' + item.id + ':checked').prop('checked', false).change(); - }); - } - - } - - /** - * Enable all competencies if Select All is checked. - */ - function enableDisabledCompetencies() { - facetGlobalVars.inProgressCheckAll = true; - // Check if we need to change label for select/de-select all - $('.career-competency-level-3-input-group label[data-state="enabled"]').each(function () { - let compGroup = $(this).next().prop('id'); - $('input[data-filter="competency"][data-group="' + compGroup + '"]:not(:checked)').each(function (index, item) { - if ($(this).closest('.career-competency-level-4-input-group').css('display') !== 'none') { - $(this).prop('checked', true).change(); - } - }); - }); - facetGlobalVars.inProgressCheckAll = false; - } - - /** - * Iterates through all buttons and links and attaches n event to them - * triggered in _includes/scripts.html - */ - $.fn.createButtonEvents = function () { - this.filter("button").each(function () { - const button = $(this); - button.on('click', function (evt) { - evt.preventDefault(); - if (button[0].classList.contains("cfo-page-right") || button[0].classList.contains("cfo-page-left") || button[0].id === "cfo-search-button") { - if (button[0].id === "cfo-search-button") { - let searchKeyword = $("#career-advancement-search-input").val().trim(); - if (searchKeyword.length > 0) { - if (!ifExistsInArray('search', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('search'); - if (facetGlobalVars.data.length) { - let searchExists = false; - facetGlobalVars.data.forEach(item => { - if (item.id === 'keys') { - item.keys = searchKeyword; - searchExists = true; - } - }); - if (!searchExists) { - facetGlobalVars.data.push({ - id: 'keys', - type: 'keys', - keys: searchKeyword - }); - } - } else { - facetGlobalVars.data.push({ - id: 'keys', - type: 'keys', - keys: searchKeyword - }); - } - } else { - if (facetGlobalVars.data.length) { - let target = -1; - for (let i = 0, l = facetGlobalVars.data.length; i < l; i++) { - if (facetGlobalVars.data[i].id === 'keys') { - target = i; - break; - } - } - if (target !== -1) { - facetGlobalVars.data.splice(target, 1); - } - } - let index = facetGlobalVars.searchOrder.indexOf('search'); - if (index !== -1) { - facetGlobalVars.searchOrder.splice(index, 1); - } - } - createClearButton(); - $("#career-facet-remove-all-filters-button").css('display', 'block'); - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - return false; - } else if (button[0].classList.contains("cfo-page-right")) { - if (facetGlobalVars.currentPage < facetGlobalVars.totalPages) { - $("#career-search-results").empty(); - setCurrentPage(facetGlobalVars.currentPage += 1); - $(".cfo-pagination-page").text(facetGlobalVars.currentPage); - let dataSet = (facetGlobalVars.results.length && facetGlobalVars.searchOrder.length) ? facetGlobalVars.results : facetGlobalVars.fullSet; - let end; - if (facetGlobalVars.currentPage === 1) { - facetGlobalVars.start = 0; - end = facetGlobalVars.perPage; - } else { - facetGlobalVars.start = (facetGlobalVars.currentPage - 1) * facetGlobalVars.perPage; - end = Math.min(facetGlobalVars.start + facetGlobalVars.perPage, dataSet.length); - } - $("#career-search-results").empty(); - resultFullSetFilter(dataSet); - for (i = facetGlobalVars.start; i < end; i++) { - if (typeof (dataSet[i]) != "undefined" && facetGlobalVars.results[i] !== null) { - createResults(false, dataSet[i]); - } - } - $(".cfo-page-left").removeAttr("disabled") - if (facetGlobalVars.currentPage === facetGlobalVars.totalPages) { - $(".cfo-page-right").attr("disabled", "disabled"); - } - } else { - $(".cfo-page-right").attr("disabled", "disabled"); - } - $("html, body").animate({scrollTop: 0}, "fast"); - return false; - } else if (button[0].classList.contains("cfo-page-left")) { - if (facetGlobalVars.currentPage > 1) { - $("#career-search-results").empty(); - setCurrentPage(facetGlobalVars.currentPage -= 1); - $(".cfo-pagination-page").text(facetGlobalVars.currentPage); - let dataSet = (facetGlobalVars.results.length && facetGlobalVars.searchOrder.length) ? facetGlobalVars.results : facetGlobalVars.fullSet; - let end; - if (facetGlobalVars.currentPage === 1) { - facetGlobalVars.start = 0; - end = facetGlobalVars.perPage; - } else { - facetGlobalVars.start = (facetGlobalVars.currentPage - 1) * facetGlobalVars.perPage; - end = Math.min(facetGlobalVars.start + facetGlobalVars.perPage, dataSet.length); - } - $("#career-search-results").empty(); - resultFullSetFilter(dataSet); - for (let i = facetGlobalVars.start; i < end; i++) { - if (typeof (dataSet[i]) != "undefined" && facetGlobalVars.results[i] !== null) { - createResults(false, dataSet[i]); - } - } - $(".cfo-page-right").removeAttr("disabled"); - if (facetGlobalVars.currentPage === 1) $(".cfo-page-left").attr("disabled", "disabled"); - } else { - $(".cfo-page-left").attr("disabled", "disabled"); - } - $("html, body").animate({scrollTop: 0}, "fast"); - return false; - } - } else if (button[0].id.match('competency-group-button')) { - $(this).parent().siblings().slideToggle(); - $(this).find('i').toggleClass('fa-plus fa-minus'); - // Set aria label - let ariaLabel = $(this).find('i').hasClass('fa-plus') ? ', collapsed' : ', expanded'; - $(this).attr('aria-label', $(this).text() + ariaLabel); - } else { - if (!ifExists(evt.target.id)) { - createRemoveButtons('button', evt.target.id, button); - } else { - removeCriteria('button', evt.target.id); - } - if (button[0].id.match('series') || button[0].id.match('GS')) { - enableDisabledCompetencies(); - } - } - }); - }); - }; - - - /** - * Filtering based on the leftspine with series,level,competency_group - */ - function resultFullSetFilter(resultFullSetFilter) { - var series_index = ['0501', '0510', '0511', '0560'].slice(0).reverse(); - var level_index = ['7-9', '10-13', '14-15'].slice(0).reverse(); - var competency_group_index = ['Primary', 'Secondary', 'Alternate', 'Personal', 'Project', 'Leading', 'Future Skills'].slice(0).reverse(); - resultFullSetFilter.sort((a, b) => { - const aseries_index = -series_index.indexOf(a.series); - const bseries_index = -series_index.indexOf(b.series); - const alevel_index = -level_index.indexOf(a.level); - const blevel_index = -level_index.indexOf(b.level); - const acompetency_group_index = -competency_group_index.indexOf(a.competency_group); - const bcompetency_group_index = -competency_group_index.indexOf(b.competency_group); - return aseries_index - bseries_index || alevel_index - blevel_index || acompetency_group_index - bcompetency_group_index; - - }); - } - - /** - * Reset filter accordions and search filters. - */ - function resetFilterBlocks() { - $("#career-facet-remove-all-filters-button").css('display', 'none'); - $("#series").css('display', 'none'); - $("#gs").css('display', 'none'); - $("#job-competency").css('display', 'none'); - $("#general-competency").css('display', 'none'); - } -}); diff --git a/assets/js/facets/facets-filters/facets-left-buttons.js b/assets/js/facets/facets-filters/facets-left-buttons.js new file mode 100644 index 000000000..07101590b --- /dev/null +++ b/assets/js/facets/facets-filters/facets-left-buttons.js @@ -0,0 +1,312 @@ + + /** + * UI: YES + * @description TODO + * + */ + function careerCompetencyOnToggle() { + + //Triggered when the user clicks on Job Specific Technical Competencies or General Career Competencies + $("#job-career-competency-select-all, #general-career-competency-select-all").on('change', function () { + var id = this.id; + // Return all items filtered by series and level if apllied + let comps = Array.from(getVisibleFacets()); + + // If the user clicked on Job Specific Technical Competencies + if (id === 'job-career-competency-select-all') { + var jobSelect = '#job-career-competency-select'; + // Toggle the text on the UI + if ($(jobSelect).text() === 'Select All') { + $(jobSelect).html("De-Select All"); + // competency_group already initialized from all item + /** + * UI: YES + * when a select all for deselect all for Job Specific is toggle, it will get all the group of the filtered item only, + * if any match job-specific group, it will toggle it + */ + facetGlobalVars.competency_group.forEach(item => { + if (comps.some(x => x.group === item.toLowerCase())) { + let itemElement = $().createId(item); + let eventId = document.getElementById(itemElement); + if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'job-specific') { + // this toggling if it apply one of the 7 parent competencies + $().toggleSelectAll(itemElement, true); + } + } + }); + } else { + $(jobSelect).html("Select All"); + facetGlobalVars.competency_group.forEach(item => { + let itemElement = $().createId(item); + let eventId = document.getElementById(itemElement); + if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'job-specific') { + $().toggleSelectAll(itemElement, false); + } + }); + } + } + if (id === 'general-career-competency-select-all') { + var generalSelect = '#general-career-competency-select'; + if ($(generalSelect).text() === 'Select All') { + $(generalSelect).html("De-Select All"); + facetGlobalVars.competency_group.forEach(item => { + if (comps.some(x => x.group === $().createId(item))) { + let itemElement = $().createId(item); + let eventId = document.getElementById(itemElement); + if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'general') { + $().toggleSelectAll(itemElement, true); + } + } + }); + } else { + $(generalSelect).html("Select All"); + facetGlobalVars.competency_group.forEach(item => { + let itemElement = $().createId(item); + let eventId = document.getElementById(itemElement); + if (eventId.hasAttribute('data-major-group') && eventId.getAttribute('data-major-group') === 'general') { + $().toggleSelectAll(itemElement, false); + } + }); + } + } + // Updating searchOrder, for this filter has been updated with competency filtering + if (!ifExistsInArray('competency', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('competency'); + let major_group = ''; + if (this.id.includes('job')) { + major_group = 'job-specific'; + } else if (this.id.includes('general')) { + major_group = 'general'; + } + let checked = this.checked; + facetGlobalVars.inProgressCheckAll = true; + /** + * All dom input element either for job specific if selected of general career if selected + */ + $('[data-filter="competency"][data-major-group="' + major_group + '"]').each((index, elem) => { + let $elem = $(elem), + comp = $elem.attr('aria-label'), + group = $elem.attr('data-group'); + // from all {competency:val, competency_group:value} from the fitered items on job-seris and gs-level, if it is matching the com or group of the imput element from the dom, + if (comps.some(x => x.comp === comp && x.group.toLowerCase() === group)) { + $(elem).prop({checked: checked}); + if (elem.hasAttribute('data-group')) { + $elem.trigger('change');// Force the element to trigger a change that will call another function for filtering. + } + } + }); + facetGlobalVars.inProgressCheckAll = false; + $().getSearch(); + }); + } + + /** + * Create a clear all filters button + */ + function createClearButton() { + $("#career-facet-remove-all-filters-button").on('click', function () { + facetGlobalVars.adding = false; + facetGlobalVars.removing = true; + + facetGlobalVars.data.forEach(item => { + if (item.keys != null) { + $('#career-advancement-search-input').val(''); + $('#career-advancement-search-input').removeAttr('value'); + } else { + if (item.type === 'checkbox') { + $("#" + item.id).prop("checked", false); + let group = $("#" + item.id).data('group'); + if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); + if ($("#career-competency-select-all").is(":checked")) $("#career-competency-select-all").prop("checked", false); + } else $("#" + item.id).toggleClass('active'); + $("#" + item.id + "-button").remove(); + } + }) + facetGlobalVars.data = []; + facetGlobalVars.searchOrder = []; + resetFilterBlocks(); + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + + $('.career-competency-level-3-input-group label[data-state="enabled"]').attr('data-state', 'disable').html('Select All').change(); + $("#dialog").dialog().dialog("close"); + }); + } + + + /** + * Creates a single remove button. + * Called in two places + * 1) when a button is clicked + * 2) when a checkbox is checked + * + * @param {string} inputType - The type of input - button, checkbox + * @param {string} eventTargetId - The id of the object clicked + * @param {object} button - The this representation of the object clicked - button or checkbox + * @param {string} competencyGroup - The group id of the checkbox (not used with buttons) + * @param {string} competencyTitle - The competency title (not used with buttons) + */ + function createRemoveButtons(inputType, eventTargetId, button, competencyGroup, competencyTitle) { + if (inputType === "button") { + facetGlobalVars.data.push({ + id: eventTargetId, + type: 'button', + keys: null + }); + } else { + facetGlobalVars.data.push({ + id: eventTargetId, + type: 'checkbox', + keys: null + }); + } + + facetGlobalVars.adding = true; + facetGlobalVars.removing = false; + if (eventTargetId.match("GS")) { + if (!ifExistsInArray('level', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('level'); + } + if (eventTargetId.match("series")) { + if (!ifExistsInArray('series', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('series'); + } + if (facetGlobalVars.data.length === 1) { + createClearButton(); + $("#career-facet-remove-all-filters-button").css('display', 'block'); + } + if (inputType === "button") button.toggleClass("active"); + const removeButtonA = document.createElement("a"); + removeButtonA.setAttribute("id", eventTargetId + "-button"); + removeButtonA.setAttribute("tabindex", 0); + removeButtonA.setAttribute("href", "javascript:void(0)"); + removeButtonA.setAttribute("class", "usa-tag margin-top float-left bg-white text-black border-blue padding-05 margin-1 text-no-uppercase text-no-underline"); + let removeButtonText; + if (inputType === "button") { + removeButtonText = createButtonText(eventTargetId); + } else { + removeButtonText = (' ' + competencyGroup + " - " + competencyTitle).replace(/ [\w]/g, a => a.toLocaleUpperCase()).trim(); + } + + removeButtonA.innerHTML = removeButtonText + "  "; + + if (eventTargetId.match("series")) { + const buttonJobContainer = document.getElementById("career-search-results-filter-remove-buttons-series"); + buttonJobContainer.appendChild(removeButtonA); + $("#series").css('display', 'block'); + $("#btnSeries").attr('aria-expanded', 'false'); + $("#career-search-results-filter-remove-buttons-series").attr("hidden", true); + } + if (eventTargetId.match("GS")) { + const buttonGSContainer = document.getElementById("career-search-results-filter-remove-buttons-gs"); + buttonGSContainer.appendChild(removeButtonA); + $("#gs").css('display', 'block'); + $("#btnGS").attr('aria-expanded', 'false'); + $("#career-search-results-filter-remove-buttons-gs").attr("hidden", true); + } + if (competencyGroup != null) { + removeButtonA.removeAttribute("class"); + removeButtonA.setAttribute("class", "usa-tag bg-accent-warm margin-top float-left text-black padding-05 margin-1 text-no-uppercase text-no-underline"); + + if (eventTargetId.match("primary") || eventTargetId.match("secondary") || eventTargetId.match("alternate")) { + addRemoveFilterButton(competencyGroup, competencyTitle, removeButtonA, false); + $("#job-competency").css('display', 'block'); + $("#btnJobCompetency").attr('aria-expanded', 'false'); + $("#career-search-results-filter-remove-buttons-job-competency").attr("hidden", true); + } + if (eventTargetId.match("personal") || eventTargetId.match("project") || eventTargetId.match("leading") || eventTargetId.match("future-skills")) { + addRemoveFilterButton(competencyGroup, competencyTitle, removeButtonA, false); + $("#general-competency").css('display', 'block'); + $("#btnGeneralCompetency").attr('aria-expanded', 'false'); + $("#career-search-results-filter-remove-buttons-general-competency").attr("hidden", true); + } + //if ($("#" + competencyGroup + "-button").onclick == undefined) { + // $("#" + competencyGroup + "-button").on('click', function (e) { + // e.preventDefault(); + + // }); + //} + } + + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + + $("#" + eventTargetId + "-button").on('click', function () { + removeTagFilter(inputType, button != null && button.length > 0 ? button[0].id : null, eventTargetId); + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + }); + } + + /** + * removes the filters effects + * @param {string} inputType - if a button or checkbox + * @param {string} id - the id of the button or checkbox + */ + function removeCriteria(inputType, id) { + $('#' + id + '-button').remove(); + let elem = $('#' + id); + + if (inputType === 'button') { + elem.toggleClass('active'); + } else { + elem.prop('checked', false); + let group = $("#" + eventTargetId).data('group'); + if ($("#" + group).is(":checked")) { + $("#" + group).prop("checked", false); + } + if ($("#career-competency-select-all").is(":checked")) { + $("#career-competency-select-all").prop("checked", false); + } + } + + let target = -1; + for (let i = 0, l = facetGlobalVars.data.length; i < l; i++) { + if (facetGlobalVars.data[i].id === id) { + target = i; + break; + } + } + + facetGlobalVars.data.splice(target, 1); + $().adjustSearchOrder(); + if (facetGlobalVars.data.length === 0) { + facetGlobalVars.searchOrder = []; + resetFilterBlocks(); + } + + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + if (id.match("series")) { + const seriesLength = facetGlobalVars.data.filter(i => i.id.indexOf("series") > -1); + if (seriesLength.length === 0) { + $("#series").css('display', 'none'); + } + } + if (id.match("GS")) { + const gsLength = facetGlobalVars.data.filter(i => i.id.indexOf("GS") > -1); + if (gsLength.length === 0) { + $("#gs").css('display', 'none'); + } + } + } + + + /** + * Enable all competencies if Select All is checked. + */ + function enableDisabledCompetencies() { + facetGlobalVars.inProgressCheckAll = true; + // Check if we need to change label for select/de-select all + $('.career-competency-level-3-input-group label[data-state="enabled"]').each(function () { + let compGroup = $(this).next().prop('id'); + $('input[data-filter="competency"][data-group="' + compGroup + '"]:not(:checked)').each(function (index, item) { + if ($(this).closest('.career-competency-level-4-input-group').css('display') !== 'none') { + $(this).prop('checked', true).change(); + } + }); + }); + facetGlobalVars.inProgressCheckAll = false; + $().getSearch(); + } diff --git a/assets/js/facets-utility.js b/assets/js/facets/facets-filters/facets-top-filters.js similarity index 51% rename from assets/js/facets-utility.js rename to assets/js/facets/facets-filters/facets-top-filters.js index 643248f19..83baa0e93 100644 --- a/assets/js/facets-utility.js +++ b/assets/js/facets/facets-filters/facets-top-filters.js @@ -9,82 +9,82 @@ * @param {object} removeButtonA - The appending text * @param {bool} removeAll - The remove button */ -let cfoStorage = new cfoStore(); -function addRemoveFilterButton(competencyGroup, competencyTitle, removeButtonA, removeAll) { - let buttonCompetencyContainer = null; - if (competencyGroup.match("primary") || competencyGroup.match("secondary") || competencyGroup.match("alternate")) { - buttonCompetencyContainer = document.getElementById("career-search-results-filter-remove-buttons-job-competency"); - } - else { - buttonCompetencyContainer = document.getElementById("career-search-results-filter-remove-buttons-general-competency"); - } - - if (!removeAll) { - //set items to local storage for popups - let competencyTitlePipeReplaced = competencyTitle.replaceAll(',', '|'); - let groupItem = cfoStorage.getItem(competencyGroup); - if (groupItem == null) { - cfoStorage.setItem(competencyGroup, JSON.stringify([competencyTitlePipeReplaced])); - } - else { - let groupItemValue = JSON.parse(groupItem); - if (!groupItemValue.includes(competencyTitlePipeReplaced)) { - groupItemValue.push(competencyTitlePipeReplaced); - } - else { - if (facetGlobalVars.removing) { - groupItemValue.splice(groupItemValue.indexOf(competencyTitlePipeReplaced), 1); - removeTagFilter('checkbox', null, competencyGroup + '-' + competencyTitle.replace(' ', '-')); - } - } - cfoStorage.setItem(competencyGroup, JSON.stringify(groupItemValue)); - } - } - else { - cfoStorage.removeItem(competencyGroup); - } - const spanStart = ''; - const spanEnd = ''; - - //set item length and name - const itemLength = removeAll ? 0 : JSON.parse(cfoStorage.getItem(competencyGroup)).length; - const itemName = ' ' + competencyGroup + ' ' + spanStart + itemLength.toString() + spanEnd; - - //handle button for duplicates - const subButton = document.getElementById(competencyGroup + "-button"); - if (itemLength == 0 && subButton !== null) { - subButton.remove(); - closeDialog(); - } - if (subButton == null && removeButtonA !== null) { - removeButtonA.setAttribute("id", competencyGroup + "-button"); - removeButtonA.setAttribute("class", "usa-tag bg-accent-warm margin-top float-left text-black padding-1 margin-1 text-capitalize text-no-underline"); - removeButtonA.innerHTML = itemName; - buttonCompetencyContainer.appendChild(removeButtonA); - } - - else if (subButton !== null) { - let replacedText = subButton.innerHTML.trim().replace(spanStart, '').replace(spanEnd, ''); - let data = replacedText.match(/\w* \d+/g); - data.forEach(function (item, index) { - if (replacedText.includes(item) && item.includes(competencyGroup)) { - subButton.setAttribute("class", "usa-tag bg-accent-warm margin-top float-left text-black padding-1 margin-1 text-capitalize text-no-underline"); - subButton.innerHTML = replacedText.replace(item, itemName); - } - }); - } - - // Set on click event for buttons. - $(buttonCompetencyContainer).find('.usa-tag').each(function() { - $(this).unbind('click').on('click', function(e) { - e.preventDefault(); - let id = $(this).attr('id'); - onSubButtonClick(id.replace('-button', '')) - }); - }); -} - -/** + let cfoStorage = new cfoStore(); + function addRemoveFilterButton(competencyGroup, competencyTitle, removeButtonA, removeAll) { + let buttonCompetencyContainer = null; + if (competencyGroup.match("primary") || competencyGroup.match("secondary") || competencyGroup.match("alternate")) { + buttonCompetencyContainer = document.getElementById("career-search-results-filter-remove-buttons-job-competency"); + } + else { + buttonCompetencyContainer = document.getElementById("career-search-results-filter-remove-buttons-general-competency"); + } + + if (!removeAll) { + //set items to local storage for popups + let competencyTitlePipeReplaced = competencyTitle.replaceAll(',', '|'); + let groupItem = cfoStorage.getItem(competencyGroup); + if (groupItem == null) { + cfoStorage.setItem(competencyGroup, JSON.stringify([competencyTitlePipeReplaced])); + } + else { + let groupItemValue = JSON.parse(groupItem); + if (!groupItemValue.includes(competencyTitlePipeReplaced)) { + groupItemValue.push(competencyTitlePipeReplaced); + } + else { + if (facetGlobalVars.removing) { + groupItemValue.splice(groupItemValue.indexOf(competencyTitlePipeReplaced), 1); + removeTagFilter('checkbox', null, competencyGroup + '-' + competencyTitle.replace(' ', '-')); + } + } + cfoStorage.setItem(competencyGroup, JSON.stringify(groupItemValue)); + } + } + else { + cfoStorage.removeItem(competencyGroup); + } + const spanStart = ''; + const spanEnd = ''; + + //set item length and name + const itemLength = removeAll ? 0 : JSON.parse(cfoStorage.getItem(competencyGroup)).length; + const itemName = ' ' + competencyGroup + ' ' + spanStart + itemLength.toString() + spanEnd; + + //handle button for duplicates + const subButton = document.getElementById(competencyGroup + "-button"); + if (itemLength == 0 && subButton !== null) { + subButton.remove(); + closeDialog(); + } + if (subButton == null && removeButtonA !== null) { + removeButtonA.setAttribute("id", competencyGroup + "-button"); + removeButtonA.setAttribute("class", "usa-tag bg-accent-warm margin-top float-left text-black padding-1 margin-1 text-capitalize text-no-underline"); + removeButtonA.innerHTML = itemName; + buttonCompetencyContainer.appendChild(removeButtonA); + } + + else if (subButton !== null) { + let replacedText = subButton.innerHTML.trim().replace(spanStart, '').replace(spanEnd, ''); + let data = replacedText.match(/\w* \d+/g); + data.forEach(function (item, index) { + if (replacedText.includes(item) && item.includes(competencyGroup)) { + subButton.setAttribute("class", "usa-tag bg-accent-warm margin-top float-left text-black padding-1 margin-1 text-capitalize text-no-underline"); + subButton.innerHTML = replacedText.replace(item, itemName); + } + }); + } + + // Set on click event for buttons. + $(buttonCompetencyContainer).find('.usa-tag').each(function() { + $(this).unbind('click').on('click', function(e) { + e.preventDefault(); + let id = $(this).attr('id'); + onSubButtonClick(id.replace('-button', '')) + }); + }); + } + + /** * Creates a sub button click. * Called in one places * 1) when a sub button on the competency group is clicked @@ -139,56 +139,6 @@ function onPopupSubButtonClick(competencyGroup, id, competencyTitle) { } } -/** - * removes a single button. - * Called in two places - * 1) when a button is clicked - * 2) when a checkbox is checked - * - * @param {string} inputType - The type of input - button, checkbox - * @param {string} eventTargetId - The id of the object clicked - * @param {string} id - The id of the object clicked - */ -function removeTagFilter(inputType, id, eventTargetId) { - facetGlobalVars.adding = false; - facetGlobalVars.removing = true; - if (inputType == "button") $("#" + id).toggleClass("active"); - else { - if (eventTargetId.indexOf("pop") < 0) { - let popElement = document.getElementById(eventTargetId.replace('primary', 'pop').replace('secondary', 'pop').replace('alternative', 'pop').replace('personal', 'pop').replace('project', 'pop').replace('leading', 'pop').replace('future-skills', 'pop') + '-button'); - if (popElement != null) { - popElement.remove(); - } - } - eventTargetId = eventTargetId.toLowerCase(); - $("#" + eventTargetId).prop("checked", false); - let group = $("#" + eventTargetId).data('group'); - if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); - if ($("#career-competency-select-all").is(":checked")) $("#career-competency-select-all").prop("checked", false); - } - facetGlobalVars.data = $.grep(facetGlobalVars.data, function (e) { - return e.id != eventTargetId; - }); - facetGlobalVars.data.forEach(function (i) { - let givenId = $().createId(eventTargetId); - if (givenId === i.id) { - facetGlobalVars.data = facetGlobalVars.data.filter(x => x.id != i.id); - } - }); - removeParentContainers(eventTargetId); - - $().adjustSearchOrder(); - if (facetGlobalVars.data.length == 0) { - facetGlobalVars.searchOrder = []; - $("#career-facet-remove-all-filters-button").css('display', 'none'); - $("#series").css('display', 'none'); - $("#gs").css('display', 'none'); - $("#job-competency").css('display', 'none'); - $("#general-competency").css('display', 'none'); - } - $("#" + eventTargetId + "-button").remove(); -} - /** * Creates a competency button. * Called in one places @@ -196,7 +146,7 @@ function removeTagFilter(inputType, id, eventTargetId) { * * @param {string} competencyGroup - The group id of the checkbox (not used with buttons) */ -function onSubButtonClick(competencyGroup) { + function onSubButtonClick(competencyGroup) { $("#dtags").html(''); let groupItem = cfoStorage.getItem(competencyGroup); if (groupItem != null) { @@ -236,83 +186,54 @@ function onSubButtonClick(competencyGroup) { } } + + /** - * Rermoves a parent container. + * removes a single button. * Called in two places - * 1) when removes a button - * 2) when unchecking + * 1) when a button is clicked + * 2) when a checkbox is checked * + * @param {string} inputType - The type of input - button, checkbox * @param {string} eventTargetId - The id of the object clicked + * @param {string} id - The id of the object clicked */ -function removeParentContainers(eventTargetId) { - if (eventTargetId.match("series")) { - const seriesLength = facetGlobalVars.data.filter(i => i.id.indexOf("series") > -1); - if (seriesLength == 0) { - $("#series").css('display', 'none'); - } - } - if (eventTargetId.match("GS")) { - const gsLength = facetGlobalVars.data.filter(i => i.id.indexOf("GS") > -1); - if (gsLength.length == 0) { - $("#gs").css('display', 'none'); - } - } - const competencyPrimaryLength = facetGlobalVars.data.filter(i => i.id.indexOf("primary") > -1); - const competencySecondaryLength = facetGlobalVars.data.filter(i => i.id.indexOf("secondary") > -1); - const competencyAlternateLength = facetGlobalVars.data.filter(i => i.id.indexOf("alternate") > -1); - if (eventTargetId.match("primary")) { - if (competencyPrimaryLength.length == 0) { - closeDialog(); - } - } - if (eventTargetId.match("secondary")) { - if (competencySecondaryLength.length == 0) { - closeDialog(); + function removeTagFilter(inputType, id, eventTargetId) { + facetGlobalVars.adding = false; + facetGlobalVars.removing = true; + if (inputType == "button") $("#" + id).toggleClass("active"); + else { + if (eventTargetId.indexOf("pop") < 0) { + let popElement = document.getElementById(eventTargetId.replace('primary', 'pop').replace('secondary', 'pop').replace('alternative', 'pop').replace('personal', 'pop').replace('project', 'pop').replace('leading', 'pop').replace('future-skills', 'pop') + '-button'); + if (popElement != null) { + popElement.remove(); + } } + eventTargetId = eventTargetId.toLowerCase(); + $("#" + eventTargetId).prop("checked", false); + let group = $("#" + eventTargetId).data('group'); + if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); + if ($("#career-competency-select-all").is(":checked")) $("#career-competency-select-all").prop("checked", false); } - if (eventTargetId.match("alternate")) { - if (competencyAlternateLength.length == 0) { - closeDialog(); + facetGlobalVars.data = $.grep(facetGlobalVars.data, function (e) { + return e.id != eventTargetId; + }); + facetGlobalVars.data.forEach(function (i) { + let givenId = $().createId(eventTargetId); + if (givenId === i.id) { + facetGlobalVars.data = facetGlobalVars.data.filter(x => x.id != i.id); } - } - if ((competencyPrimaryLength.length == 0) && (competencySecondaryLength.length == 0) && (competencyAlternateLength.length == 0)) { + }); + removeParentContainers(eventTargetId); + + $().adjustSearchOrder(); + if (facetGlobalVars.data.length == 0) { + facetGlobalVars.searchOrder = []; + $("#career-facet-remove-all-filters-button").css('display', 'none'); + $("#series").css('display', 'none'); + $("#gs").css('display', 'none'); $("#job-competency").css('display', 'none'); - } - const competencyPersonalLength = facetGlobalVars.data.filter(i => i.id.indexOf("personal") > -1); - const competencyProjectLength = facetGlobalVars.data.filter(i => i.id.indexOf("project") > -1); - const competencyLeadingLength = facetGlobalVars.data.filter(i => i.id.indexOf("leading") > -1); - const competencyFutureSkillsLength = facetGlobalVars.data.filter(i => i.id.indexOf("future-skills") > -1); - if (eventTargetId.match("personal")) { - if (competencyPersonalLength.length == 0) { - closeDialog(); - } - } - if (eventTargetId.match("project")) { - if (competencyProjectLength.length == 0) { - closeDialog(); - } - } - if (eventTargetId.match("leading")) { - if (competencyLeadingLength.length == 0) { - closeDialog(); - } - } - if (eventTargetId.match("future-skills")) { - if (competencyFutureSkillsLength.length == 0) { - closeDialog(); - } - } - if ((competencyPersonalLength.length == 0) && (competencyProjectLength.length == 0) && (competencyLeadingLength.length == 0) && (competencyFutureSkillsLength.length == 0)) { $("#general-competency").css('display', 'none'); } -} - -function closeDialog() { - if (isDialogOpen()) { - $("#dialog").dialog("close"); - } -} - -function isDialogOpen() { - return $("#dialog").hasClass('ui-dialog-content'); + $("#" + eventTargetId + "-button").remove(); } \ No newline at end of file diff --git a/assets/js/facets/facets-filters/facets.js b/assets/js/facets/facets-filters/facets.js new file mode 100644 index 000000000..df36fb54c --- /dev/null +++ b/assets/js/facets/facets-filters/facets.js @@ -0,0 +1,348 @@ +/** + * For any jquery dom reference, please use a variable where you have a proper documentation. + */ + +/** + * Set global values. + */ +let facetGlobalVars = { + data: [], // the array that holds the search terms and the filters ed: [{id: 'series-0501', type: 'button', keys: null}] + results: [], // the array that holds the results from searching a filtering + adding: false, // if adding to results + removing: false, // if removing from results + fullSet: [], // a full set of all competency_group and competencies + competency: [], // array of competencies + competency_group: [], // array of competency_groups + searchOrder: [], // hold a list of objects representing the order of a search competency, level, series etc.. + searchKeys: [ // when searching the columns to search - Competency Description, Proficiency Level Definition, Behavioral Illustrations, Relevant Courses + "title", + "competency_description", + "proficiency_level_definition", + "behavioral_illustrations", + "relevant_courses", + ], + start: 0, + perPage: parseInt($('select[name="per_page"]').val()) || 10, + totalItems: 105, // total items in results array + totalPages: 11, // total pages in results array / pagination items per page + currentPage: 1, // pagination current page + inProgressCheckAll: false // is checking all process in progress? +}; + +/** + * @file Facets code. + * Wrap all code with jQuery function. + */ +$(document).ready(function () { + + /** + * loads all md pages on init + */ + $.getJSON(window.federalist.path.baseurl + '/search.json', function (res) { + + //Initialize input field + $('#career-advancement-search-input').val(''); + if ($("#career-competency-select-all").is(":checked")) { + $("#career-competency-select-all").prop("checked", false); //--- where career-competency-select-all is defined + } + + // Looping through all the Cards + res.forEach(item => { + // Getting all items for competency filter + if (!facetGlobalVars.competency.includes(item.competency)) { + facetGlobalVars.competency.push(item.competency); + } + // Getting all items for competency group filter + if (!facetGlobalVars.competency_group.includes(item.competency_group)) { + facetGlobalVars.competency_group.push(item.competency_group); + } + // by default all items are the result + facetGlobalVars.results.push(item); + // by default all items is the full set + facetGlobalVars.fullSet.push(item); + }); + + // On init, unchecking all checkboxes + $("input:checkbox").each(function () { + $(this).prop('checked', false); + }); + + // is this being used ? + $("#career-competency-select-all").on("focus", function () { + $('label[for="career-competency-select-all"]').addClass("padding-05"); + $('label[for="career-competency-select-all"]').css("outline", "0.25rem solid #2491ff"); + }); + + // is this being used ? + $("#career-competency-select-all").on("blur", function () { + $('label[for="career-competency-select-all"]').removeClass("padding-05"); + $('label[for="career-competency-select-all"]').css("outline", "none"); + }); + + + //Called when user toggle on on Job Specific Technical Competencies or General Career Competencies + careerCompetencyOnToggle(); + + // create an array of everything of both disabled and active. + facetGlobalVars.competency_group.forEach(groupItem => { + let eventGroupId = $().createId(groupItem); + if (eventGroupId !== "") { + facetGlobalVars.competency.forEach(item => { + let eventId = $().createId(eventGroupId + " " + item); + if (eventId !== "") { + // if any check box changes + $("#" + eventId).on('change', function () { + if (this.checked) { + if (!ifExistsInArray('competency', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('competency'); + if (!ifExists(eventId)) { + createRemoveButtons('checkbox', eventId, this, eventGroupId, item); + } + } else { + let labelId = "#competency-group-label-" + eventGroupId; + if ($("#" + eventId).closest('.career-competency-level-4-input-group').css('display') === 'block') { + $(labelId).attr('data-state', 'disabled').html("Select All").change(); + disableGlobalSelect(eventGroupId); + } + $("#" + eventId).prop("checked", false); + let group = $("#" + eventId).data('group'); + facetGlobalVars.removing = true; + addRemoveFilterButton(group, item, null, false); + if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); + if ($("#career-competency-select-all").is(":checked")) { + $("#career-competency-select-all").prop("checked", false); + } + facetGlobalVars.data = $.grep(facetGlobalVars.data, function (e) { + return e.id !== eventId; + }); + $().adjustSearchOrder(); + if (facetGlobalVars.data.length === 0) { + facetGlobalVars.searchOrder = []; + resetFilterBlocks(); + } + $("#" + eventId + "-button").remove(); + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + } + }); + } + }); + } + }); + facetGlobalVars.competency_group.forEach(item => { + let eventId = $().createId(item); + if (eventId !== "") { + $("#" + eventId).on("focus", function () { + $('label[for="' + eventId + '"]').addClass("padding-05"); + $('label[for="' + eventId + '"]').css("outline", "0.25rem solid #2491ff"); + }); + + $("#" + eventId).on("blur", function () { + $('label[for="' + eventId + '"]').removeClass("padding-05"); + $('label[for="' + eventId + '"]').css("outline", "none"); + }); + $("#" + eventId).unbind('change').on('change', function () { + let labelId = "#competency-group-label-" + eventId, + checked; + if ($(labelId).text() === 'Select All') { + $().toggleSelectAll(eventId, true); + checked = true; + } else { + addRemoveFilterButton(eventId, '', null, true); + removeParentContainers(eventId); + $().toggleSelectAll(eventId, false); + disableGlobalSelect(eventId); + checked = false; + } + + if (checked) { + if (!ifExistsInArray('competency', facetGlobalVars.searchOrder)) { + facetGlobalVars.searchOrder.push('competency'); + } + + let comps = getVisibleFacets(); + facetGlobalVars.inProgressCheckAll = true; + comps.forEach(x => { + if (eventId === x.group) { + $('input:checkbox[data-group="' + x.group + '"][aria-label="' + x.comp + '"]').prop({'checked': true}).trigger('change'); + } + }); + facetGlobalVars.inProgressCheckAll = false; + $().getSearch(); + } else { + facetGlobalVars.adding = false; + facetGlobalVars.removing = true; + $("#" + eventId).prop("checked", false); + facetGlobalVars.competency.forEach(competencyItem => { + let eventCompetencyId = $().createId(eventId + " " + competencyItem); + if ($("#" + eventCompetencyId).data("group") === eventId) { + $("#" + eventCompetencyId).prop('checked', false); + $("#" + eventCompetencyId + "-button").remove(); + facetGlobalVars.data = $.grep(facetGlobalVars.data, function (e) { + return e.id !== eventCompetencyId; + }); + $().adjustSearchOrder(); + if (facetGlobalVars.data.length === 0) { + facetGlobalVars.searchOrder = []; + resetFilterBlocks(); + } + } + }); + $.grep(facetGlobalVars.data, function (e) { + return e.id !== eventId; + }); + $().adjustSearchOrder(); + if (facetGlobalVars.data.length === 0) { + resetFilterBlocks(); + } + $("#" + eventId + "-button").remove(); + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + } + }); + } + }); + + setTotalPages(); + }); + + /** + * Iterates through all buttons and links and attaches n event to them + * triggered in _includes/scripts.html + */ + $.fn.createButtonEvents = function () { + this.filter("button").each(function () { + const button = $(this); + button.on('click', function (evt) { + evt.preventDefault(); + if (button[0].classList.contains("cfo-page-right") || button[0].classList.contains("cfo-page-left") || button[0].id === "cfo-search-button") { + if (button[0].id === "cfo-search-button") { + let searchKeyword = $("#career-advancement-search-input").val().trim(); + if (searchKeyword.length > 0) { + if (!ifExistsInArray('search', facetGlobalVars.searchOrder)) facetGlobalVars.searchOrder.push('search'); + if (facetGlobalVars.data.length) { + let searchExists = false; + facetGlobalVars.data.forEach(item => { + if (item.id === 'keys') { + item.keys = searchKeyword; + searchExists = true; + } + }); + if (!searchExists) { + facetGlobalVars.data.push({ + id: 'keys', + type: 'keys', + keys: searchKeyword + }); + } + } else { + facetGlobalVars.data.push({ + id: 'keys', + type: 'keys', + keys: searchKeyword + }); + } + } else { + if (facetGlobalVars.data.length) { + let target = -1; + for (let i = 0, l = facetGlobalVars.data.length; i < l; i++) { + if (facetGlobalVars.data[i].id === 'keys') { + target = i; + break; + } + } + if (target !== -1) { + facetGlobalVars.data.splice(target, 1); + } + } + let index = facetGlobalVars.searchOrder.indexOf('search'); + if (index !== -1) { + facetGlobalVars.searchOrder.splice(index, 1); + } + } + createClearButton(); + $("#career-facet-remove-all-filters-button").css('display', 'block'); + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + return false; + } else if (button[0].classList.contains("cfo-page-right")) { + if (facetGlobalVars.currentPage < facetGlobalVars.totalPages) { + $("#career-search-results").empty(); + setCurrentPage(facetGlobalVars.currentPage += 1); + $(".cfo-pagination-page").text(facetGlobalVars.currentPage); + let dataSet = (facetGlobalVars.results.length && facetGlobalVars.searchOrder.length) ? facetGlobalVars.results : facetGlobalVars.fullSet; + let end; + if (facetGlobalVars.currentPage === 1) { + facetGlobalVars.start = 0; + end = facetGlobalVars.perPage; + } else { + facetGlobalVars.start = (facetGlobalVars.currentPage - 1) * facetGlobalVars.perPage; + end = Math.min(facetGlobalVars.start + facetGlobalVars.perPage, dataSet.length); + } + $("#career-search-results").empty(); + resultFullSetFilter(dataSet); + for (i = facetGlobalVars.start; i < end; i++) { + if (typeof (dataSet[i]) != "undefined" && facetGlobalVars.results[i] !== null) { + createResults(false, dataSet[i]); + } + } + $(".cfo-page-left").removeAttr("disabled") + if (facetGlobalVars.currentPage === facetGlobalVars.totalPages) { + $(".cfo-page-right").attr("disabled", "disabled"); + } + } else { + $(".cfo-page-right").attr("disabled", "disabled"); + } + $("html, body").animate({scrollTop: 0}, "fast"); + return false; + } else if (button[0].classList.contains("cfo-page-left")) { + if (facetGlobalVars.currentPage > 1) { + $("#career-search-results").empty(); + setCurrentPage(facetGlobalVars.currentPage -= 1); + $(".cfo-pagination-page").text(facetGlobalVars.currentPage); + let dataSet = (facetGlobalVars.results.length && facetGlobalVars.searchOrder.length) ? facetGlobalVars.results : facetGlobalVars.fullSet; + let end; + if (facetGlobalVars.currentPage === 1) { + facetGlobalVars.start = 0; + end = facetGlobalVars.perPage; + } else { + facetGlobalVars.start = (facetGlobalVars.currentPage - 1) * facetGlobalVars.perPage; + end = Math.min(facetGlobalVars.start + facetGlobalVars.perPage, dataSet.length); + } + $("#career-search-results").empty(); + resultFullSetFilter(dataSet); + for (let i = facetGlobalVars.start; i < end; i++) { + if (typeof (dataSet[i]) != "undefined" && facetGlobalVars.results[i] !== null) { + createResults(false, dataSet[i]); + } + } + $(".cfo-page-right").removeAttr("disabled"); + if (facetGlobalVars.currentPage === 1) $(".cfo-page-left").attr("disabled", "disabled"); + } else { + $(".cfo-page-left").attr("disabled", "disabled"); + } + $("html, body").animate({scrollTop: 0}, "fast"); + return false; + } + } else if (button[0].id.match('competency-group-button')) { + $(this).parent().siblings().slideToggle(); + $(this).find('i').toggleClass('fa-plus fa-minus'); + // Set aria label + let ariaLabel = $(this).find('i').hasClass('fa-plus') ? ', collapsed' : ', expanded'; + $(this).attr('aria-label', $(this).text() + ariaLabel); + } else { + if (!ifExists(evt.target.id)) { + createRemoveButtons('button', evt.target.id, button); + } else { + removeCriteria('button', evt.target.id); + } + if (button[0].id.match('series') || button[0].id.match('GS')) { + enableDisabledCompetencies(); + } + } + }); + }); + }; +}); diff --git a/assets/js/facets/facets-result/facets-result.js b/assets/js/facets/facets-result/facets-result.js new file mode 100644 index 000000000..4b9cc8557 --- /dev/null +++ b/assets/js/facets/facets-result/facets-result.js @@ -0,0 +1,72 @@ + /** + * ========== PLEASE USE A DIFFERENT FILE FOR THE RESULT PAGE ====== + * creates a single card result and adds it to the Dom + * @param {bool} noResults true if no results false if results + * @param {object} item - and item(variables of an md file) to be made into the card html + */ + function createResults(noResults, item) { // creates a results div and contents + const outerDiv1 = document.createElement("div"); + outerDiv1.setAttribute("class", "tablet:grid-col-12 grid-spacing policy"); + const outerDiv2 = document.createElement("div"); + outerDiv2.setAttribute("class", "cfo-career-outer-box"); + outerDiv1.append(outerDiv2); + const outerDiv3 = document.createElement("div"); + outerDiv3.setAttribute("class", "cfo-career-text-container position-relative"); + outerDiv2.append(outerDiv3); + if (noResults) { + const textArea = document.createElement("p"); + textArea.setAttribute("class", "cfo-career-results-text-bold"); + outerDiv3.appendChild(textArea); + const text1 = document.createTextNode("Your search has turned up no results."); + textArea.appendChild(text1); + const textArea2 = document.createElement("p"); + outerDiv3.appendChild(textArea2); + const text2 = document.createTextNode('Check if your spelling is correct, or try removing filters. Remove quotes around phrases to match each word individually: "blue drop" will match less than blue drop.'); + textArea2.appendChild(text2); + } else { + let template = '
' + + '
GS Level: {{ card.level }}
' + + '
Job Series: {{ card.series }}
' + + '
' + + '
' + + '
Competency: {{ card.competency }}
' + + '
Type: {{ card.competency_group }}
' + + '
' + + '

Definition: {{ card.competency_description }}

'; + outerDiv3.innerHTML = template.replace('{{ card.level }}', item.level) + .replace('{{ card.series }}', item.series) + .replace('{{ card.competency }}', item.competency) + .replace('{{ card.competency_group }}', item.competency_group) + .replace('{{ card.competency_description }}', item.competency_description); + + const innerDiv2 = document.createElement("div"); + innerDiv2.setAttribute("class", "grid-row grid-gap"); + outerDiv3.append(innerDiv2); + innerDiv2.innerHTML = item.content; + + const coursesDiv = document.createElement('div'); + let courseMarkup = ''; + } else { + courseMarkup = '

No courses

'; + } + coursesDiv.innerHTML = '

Career Listing

' + courseMarkup; + outerDiv3.append(coursesDiv); + + const selectButtonWrapper = document.createElement('div'); + outerDiv3.prepend(selectButtonWrapper); + selectButtonWrapper.setAttribute("class", "select-button"); + selectButtonWrapper.innerHTML = '' + } + const resultsContainer = document.getElementById("career-search-results"); + resultsContainer.appendChild(outerDiv1); +} \ No newline at end of file diff --git a/assets/js/facets/facets-search/facets-search.js b/assets/js/facets/facets-search/facets-search.js new file mode 100644 index 000000000..479d7ed91 --- /dev/null +++ b/assets/js/facets/facets-search/facets-search.js @@ -0,0 +1,193 @@ +$.fn.extend({ + /** + * adjusts the searchOrder array + */ + adjustSearchOrder: function () { + let newSearchOrder = []; + facetGlobalVars.data.forEach(item => { + if (item.type === 'keys') { + if (!ifExistsInArray('search', newSearchOrder)) { + newSearchOrder.push('search'); + } + } else { + if (!ifExistsInArray(getFilterType(item.id), newSearchOrder)) { + newSearchOrder.push(getFilterType(item.id)); + } + } + }); + facetGlobalVars.searchOrder = []; + newSearchOrder.forEach(item => { + facetGlobalVars.searchOrder.push(item); + }); + }, + + /** + * Iterates over the searchOrder array and creates results based upon the filters selected + * Uses enableDisableCompetencies and the createResults + */ + getSearch: function () { + // console.log(facetGlobalVars); + facetGlobalVars.results = []; + // create a count of the the items displayed and display it. + // count all search results for an item as a sanity check and make a spread sheet. + if (facetGlobalVars.searchOrder.length > 0) { + facetGlobalVars.searchOrder.forEach((searchItem, index) => { + let newResults = []; + if (searchItem === 'search') { + // create a results array for the next search criteria + facetGlobalVars.fullSet.forEach(item => { // go over all loaded md pages + facetGlobalVars.searchKeys.forEach(term => { + facetGlobalVars.data.forEach(obj => { // go over the search and facets selected + if (obj.type === 'keys' && typeof item[term] !== "undefined") { + let stringToMatch = Array.isArray(item[term]) ? item[term].join(' ') : item[term]; + stringToMatch = stringToMatch.replace(/[^a-zA-Z0-9\s]/g, "").toLowerCase(); + if (stringToMatch.match(obj.keys.toLowerCase().replace(/[^a-zA-Z0-9\s]/g, ""))) { + if (!ifExistsResults(item.permalink, newResults)) { + newResults.push(item); + } + } + } + }); + }); + }); + } else { + // create a results array for the next search criteria + facetGlobalVars.fullSet.forEach(item => { // go over all loaded md pages + facetGlobalVars.data.forEach(obj => { // go over the search and facets selected + if (getFilterType(obj.id) === searchItem) { + let filters = item.filters.split(" "); + let val = ''; + switch (getFilterType(obj.id)) { + case 'series': // Series + val = filters[2]; + break; + case 'level': // GS Level + val = filters[1]; + break; + case 'competency': // Group - Competency + val = filters[0]; + } + + if (val.toLowerCase() === obj.id.toLowerCase()) { + if (!ifExistsResults(item.permalink, newResults)) { + newResults.push(item); + } + } + } + }); + }); + } + + // look for new filters in prior results set and if they are there + // save the prior results in to a different array. + let finishResults = []; + if (facetGlobalVars.results.length > 0) { + facetGlobalVars.results.forEach(item => { + newResults.forEach(newItem => { + if (item.permalink.toLowerCase() === newItem.permalink.toLowerCase()) { + if (!ifExistsResults(item.permalink, finishResults)) { + finishResults.push(item); + } + } + }); + }); + } else { + finishResults = newResults; + } + + // populate results with finishResults + facetGlobalVars.results = []; + finishResults.forEach(item => { + if (!ifExistsResults(item.title, facetGlobalVars.results)) { + facetGlobalVars.results.push(item); + } + }); + }); + enableDisableCompetencies(false); + $("#career-search-results").empty(); + + if (facetGlobalVars.results.length === 0) { + if (facetGlobalVars.searchOrder.length === 0) { + for (i = 0; i < Math.min(facetGlobalVars.fullSet.length, facetGlobalVars.perPage); i++) { + if (typeof (facetGlobalVars.fullSet[i]) != "undefined" && facetGlobalVars.fullSet[i] !== null) { + createResults(false, facetGlobalVars.fullSet[i]); + } + } + $(".cfo-pagination-results").text(facetGlobalVars.fullSet.length); + } else { + createResults(true); + setTotalItems(); + $(".cfo-pagination-results").text(facetGlobalVars.totalItems); + $(".cfo-page-right").attr("disabled", "disabled"); + $(".cfo-page-left").attr("disabled", "disabled"); + } + } else { + resultFullSetFilter(facetGlobalVars.results); + for (i = 0; i < Math.min(facetGlobalVars.results.length, facetGlobalVars.perPage); i++) { + if (typeof (facetGlobalVars.results[i]) != "undefined" && facetGlobalVars.results[i] !== null) { + createResults(false, facetGlobalVars.results[i]); + } + } + $(".cfo-page-left").attr("disabled", "disabled"); + $(".cfo-page-right").removeAttr("disabled"); + + setTotalItems(); + $(".cfo-pagination-results").text(facetGlobalVars.totalItems); + } + + setCurrentPage(1); + $(".cfo-pagination-page").text(facetGlobalVars.currentPage); + setTotalPages(); + $(".cfo-pagination-pages").text(facetGlobalVars.totalPages); + } else { + $("#career-search-results").empty(); + resultFullSetFilter(facetGlobalVars.fullSet); + for (i = 0; i < Math.min(facetGlobalVars.fullSet.length, facetGlobalVars.perPage); i++) { + if (typeof (facetGlobalVars.fullSet[i]) != "undefined" && facetGlobalVars.fullSet[i] !== null) { + createResults(false, facetGlobalVars.fullSet[i]); + } + } + $(".cfo-pagination-results").text(facetGlobalVars.fullSet.length); + setCurrentPage(1); + $(".cfo-pagination-page").text(facetGlobalVars.currentPage); + setTotalPages(); + $(".cfo-pagination-pages").text(facetGlobalVars.totalPages); + enableDisableCompetencies(true); + } + unselectAll(); + + if (facetGlobalVars.results.length === 0 && facetGlobalVars.data.length === 0) { + facetGlobalVars.results = facetGlobalVars.fullSet; + $('#career-facet-remove-all-filters-button').hide(); + } + }, + + /** + * creates an id from a space and/or comma delimited string + * @param {string} item - a string with spaces and/or commas + * @returns - a string delimited with dashes(-) + */ + createId: function (item) { + let newStr = item.replaceAll(', ', '-'); + let finalStr = newStr.replaceAll(' ', '-'); + return finalStr.toLowerCase(); + }, + + + /** + * Toggle Select/De-Select all button. + * @param {string} competencyGroup competency group + * @param {boolean} status True for enable De-Select All button + */ + toggleSelectAll: function (competencyGroup, status) { + let label = status ? 'De-Select All' : 'Select All'; + let state = status ? 'enabled' : 'disabled'; + $('#competency-group-label-' + competencyGroup).attr('data-state', state).html(label).change(); + if (!status) { + disableGlobalSelect(competencyGroup); + } else { + // Check global Select All status and set if it needed. + enableGlobalSelect(competencyGroup); + } + } +}); diff --git a/assets/js/facets/facets-utility.js b/assets/js/facets/facets-utility.js new file mode 100644 index 000000000..263ababfd --- /dev/null +++ b/assets/js/facets/facets-utility.js @@ -0,0 +1,337 @@ + + + +/** + * Rermoves a parent container. + * Called in two places + * 1) when removes a button + * 2) when unchecking + * + * @param {string} eventTargetId - The id of the object clicked + */ +function removeParentContainers(eventTargetId) { + if (eventTargetId.match("series")) { + const seriesLength = facetGlobalVars.data.filter(i => i.id.indexOf("series") > -1); + if (seriesLength == 0) { + $("#series").css('display', 'none'); + } + } + if (eventTargetId.match("GS")) { + const gsLength = facetGlobalVars.data.filter(i => i.id.indexOf("GS") > -1); + if (gsLength.length == 0) { + $("#gs").css('display', 'none'); + } + } + const competencyPrimaryLength = facetGlobalVars.data.filter(i => i.id.indexOf("primary") > -1); + const competencySecondaryLength = facetGlobalVars.data.filter(i => i.id.indexOf("secondary") > -1); + const competencyAlternateLength = facetGlobalVars.data.filter(i => i.id.indexOf("alternate") > -1); + if (eventTargetId.match("primary")) { + if (competencyPrimaryLength.length == 0) { + closeDialog(); + } + } + if (eventTargetId.match("secondary")) { + if (competencySecondaryLength.length == 0) { + closeDialog(); + } + } + if (eventTargetId.match("alternate")) { + if (competencyAlternateLength.length == 0) { + closeDialog(); + } + } + if ((competencyPrimaryLength.length == 0) && (competencySecondaryLength.length == 0) && (competencyAlternateLength.length == 0)) { + $("#job-competency").css('display', 'none'); + } + const competencyPersonalLength = facetGlobalVars.data.filter(i => i.id.indexOf("personal") > -1); + const competencyProjectLength = facetGlobalVars.data.filter(i => i.id.indexOf("project") > -1); + const competencyLeadingLength = facetGlobalVars.data.filter(i => i.id.indexOf("leading") > -1); + const competencyFutureSkillsLength = facetGlobalVars.data.filter(i => i.id.indexOf("future-skills") > -1); + if (eventTargetId.match("personal")) { + if (competencyPersonalLength.length == 0) { + closeDialog(); + } + } + if (eventTargetId.match("project")) { + if (competencyProjectLength.length == 0) { + closeDialog(); + } + } + if (eventTargetId.match("leading")) { + if (competencyLeadingLength.length == 0) { + closeDialog(); + } + } + if (eventTargetId.match("future-skills")) { + if (competencyFutureSkillsLength.length == 0) { + closeDialog(); + } + } + if ((competencyPersonalLength.length == 0) && (competencyProjectLength.length == 0) && (competencyLeadingLength.length == 0) && (competencyFutureSkillsLength.length == 0)) { + $("#general-competency").css('display', 'none'); + } +} + +function closeDialog() { + if (isDialogOpen()) { + $("#dialog").dialog("close"); + } +} + +function isDialogOpen() { + return $("#dialog").hasClass('ui-dialog-content'); +} + +/** + * Change group Select/De-Select all button. + * @param {string} eventGroupId - Group id. + */ +function disableGlobalSelect(eventGroupId) { + let labelId = $('#' + eventGroupId).data('major-group') === 'job-specific' + ? 'job-career-competency-select' : 'general-career-competency-select'; + $('#' + labelId).html('Select All').next('input').prop('checked', false); +} + +/** + * Change group Select/De-Select all button. + * @param {string} eventGroupId - Group id. + */ + function enableGlobalSelect(eventGroupId) { + let majorGroup = $('#' + eventGroupId).data('major-group'); + let status = true; + $('input.text-offscreen[data-major-group="' + majorGroup + '"]').each(function() { + if ($(this).prev('label').attr('data-state') !== 'enabled') { + status = false; + } + }); + if (status) { + let labelId = $('#' + eventGroupId).data('major-group') === 'job-specific' + ? 'job-career-competency-select' : 'general-career-competency-select'; + $('#' + labelId).html('De-Select All').next('input').prop('checked', true); + } +} + +/** + * returns the type of filter + * @param {string} id a button id + * @returns - series, level or competency + */ + function getFilterType(id) { + const series = new RegExp('series-*'); + const level = new RegExp('GS-*'); + if (series.test(id)) return 'series'; + else if (level.test(id)) return 'level'; + return 'competency'; +} + +/** + * returns if an element exists in an array + * @param {string} elm - element in array + * @param {*} array - array to search + * @returns bool + */ + function ifExistsInArray(elm, array) { + let exists = false; + array.forEach(item => { + if (item === elm) exists = true; + }); + return exists; +} + +/** + * returns if an item exists in the results array + * @param {string} title - the title + * @param {array} array - the array to search + * @returns - bool + */ + function ifExistsResults(title, array) { + let exists = false; + array.forEach(item => { + if (item.permalink === title) exists = true; + }); + return exists; +} + +/** + * creates the remove button text + * @param {string} text - text to converted to name + * @returns button text + */ + function createButtonText(text) { + let part1 = text.split("-"); + if (part1[0] === 'GS') return part1[0] + " " + part1[1] + "-" + part1[2]; + else { + let removeButtonText = part1.join(" "); + return (' ' + removeButtonText).replace(/ [\w]/g, a => a.toLocaleUpperCase()).trim(); + } +} + + /** + * Iterates through all checkboxes in results array and disable those that have no results. + * If in all mode it iterates through the full set and enables all checkboxes. + * @param {bool} all - if enable all checkboxes + */ + function enableDisableCompetencies(all) { + if (all) { + $('[data-filter="competency"]').parents('.career-competency-level-4-input-group, .career-competency-level-3-input-group').show(); + } else { + // hide everything + $('[data-filter="competency"]').parents('.career-competency-level-4-input-group').hide(); + + // and then selectively show what we want + let comps = getVisibleFacets(); + comps.forEach((item) => { + $('[data-filter="competency"][data-group="' + item.group + '"][title="' + item.comp + '"]').parents('.career-competency-level-4-input-group').show(); + }); + + // hide all competency groups + $('[data-filter="competency"]').parents('.career-competency-level-3-input-group').hide(); + + comps.forEach((item) => { + $('[data-filter="competency"][data-id="' + item.group + '"]').parents('.career-competency-level-3-input-group').show(); + }); + cleanUpData(); + } +} + + /** + * Filtering based on the leftspine with series,level,competency_group + */ + function resultFullSetFilter(resultFullSetFilter) { + var series_index = ['0501', '0510', '0511', '0560'].slice(0).reverse(); + var level_index = ['7-9', '10-13', '14-15'].slice(0).reverse(); + var competency_group_index = ['Primary', 'Secondary', 'Alternate', 'Personal', 'Project', 'Leading', 'Future Skills'].slice(0).reverse(); + resultFullSetFilter.sort((a, b) => { + const aseries_index = -series_index.indexOf(a.series); + const bseries_index = -series_index.indexOf(b.series); + const alevel_index = -level_index.indexOf(a.level); + const blevel_index = -level_index.indexOf(b.level); + const acompetency_group_index = -competency_group_index.indexOf(a.competency_group); + const bcompetency_group_index = -competency_group_index.indexOf(b.competency_group); + return aseries_index - bseries_index || alevel_index - blevel_index || acompetency_group_index - bcompetency_group_index; + + }); +} + +/** + * Reset filter accordions and search filters. + */ +function resetFilterBlocks() { + $("#career-facet-remove-all-filters-button").css('display', 'none'); + $("#series").css('display', 'none'); + $("#gs").css('display', 'none'); + $("#job-competency").css('display', 'none'); + $("#general-competency").css('display', 'none'); +} + + /** + * returns if a search or facet filter exists in the data array + * @param {string} id the id of the element + * @returns bool + */ + function ifExists(id) { + let exists = false; + facetGlobalVars.data.forEach(item => { + if (item.id === id) exists = true; + }); + return exists; +} + +/** + * sets totalItems in results array + */ + function setTotalItems() { + facetGlobalVars.totalItems = facetGlobalVars.results.length; +} + +/** + * sets totalPages for pagination + */ +function setTotalPages() { + if (!facetGlobalVars.results.length) { + if (facetGlobalVars.searchOrder.length) { + facetGlobalVars.totalPages = 0; + } else { + facetGlobalVars.totalPages = Math.ceil(facetGlobalVars.fullSet.length / facetGlobalVars.perPage); + } + } else { + facetGlobalVars.totalPages = Math.ceil(facetGlobalVars.results.length / facetGlobalVars.perPage); + } +} + +/** + * sets currentPage for pagination + * @param {string} page - integer representing the current page of pagination + */ +function setCurrentPage(page) { + facetGlobalVars.currentPage = page; +} + + /** + * UI: NO + * @descriptions Filter all the set of card an return the item filter with any series or level filter applied in this structure: {competency:val, competency_group:value} + * @returns + */ + function getVisibleFacets() { + let filters = { + series: [], + level: [] + }; + // breakdown all relevant filters into just ones we're interested in for faceting purposes + facetGlobalVars.searchOrder.forEach(s => { + switch (s) { + case 'series': + // return all filters under series filter + filters[s] = facetGlobalVars.data.filter(x => x.id.match(/series-/)).map(x => x.id); + break; + case 'level': + // return all filter under level filter + filters[s] = facetGlobalVars.data.filter(x => x.id.match(/GS-/)).map(x => x.id); + break; + } + }); + + // filters cards to only those that match the selected, relevant filters + // Will only return cards already filtered by series and level + let items = facetGlobalVars.fullSet.filter((item) => { + let series_check = (filters.series.length === 0 || filters.series.some((y) => { + return item.filters.includes(y); + })), + level_check = (filters.level.length === 0 || filters.level.some((y) => { + return item.filters.includes(y); + })); + + return series_check && level_check; + }); + return new Set(items.map((item) => { + return {comp: item.competency, group: item.competency_group.toLowerCase().replace(' ', '-')}; + })); + } + + /** + * Remove hidden facets from the data array. + */ + function cleanUpData() { + // and then selectively show what we want + let comps = getVisibleFacets(); + // create values array from the facets array + let enabledFacets = []; + let notIncluded; + comps.forEach((item) => { + enabledFacets.push(item.group + '-' + $().createId(item.comp)); + }); + + notIncluded = facetGlobalVars.data.filter(function (dataItem) { + return (dataItem.type === 'checkbox' && !enabledFacets.includes(dataItem.id)); + }); + facetGlobalVars.data = facetGlobalVars.data.filter(function (dataItem) { + return (dataItem.type !== 'checkbox' || (dataItem.type === 'checkbox' && enabledFacets.indexOf(dataItem.id) !== -1)); + }); + // Reset competencies on cfoStorage. + if (notIncluded.length) { + notIncluded.forEach((item) => { + $('#' + item.id + ':checked').prop('checked', false).change(); + }); + } + + } \ No newline at end of file diff --git a/assets/js/facets.spec.js b/assets/js/facets/facets.spec.js similarity index 100% rename from assets/js/facets.spec.js rename to assets/js/facets/facets.spec.js diff --git a/career-planning-tool/index.html b/career-planning-tool/index.html index 691c4b0c8..dbdff848d 100644 --- a/career-planning-tool/index.html +++ b/career-planning-tool/index.html @@ -10,359 +10,24 @@ secondary_skip: true use_jqui: true attached: - - facets + - facets/facets-filters/facets + - facets/facets-filters/facets-left-buttons - career-planning - store - - facets-utility + - facets/facets-utility + - facets/facets-filters/facets-top-filters + - facets/facets-result/facets-result + - facets/facets-search/facets-search --- -
-
-
-
back to CFO.gov
-
-
-
-

Career Planning & Training Tool (in BETA)

-
-
-

Discover the knowledge, skills, and training that can help advance your Federal career

-
-
-
-
+{% include career-planning-tool/wfm-header.html %}
-
-

Filter your results

-
- -

Job Series

-
- {% assign series_array = "" | split: "," %} - - {% for item in site.cards %} - {% if item.category == 'career' %} - {% if series_array contains item.job_series %} - - {% else %} - {% assign series_array = series_array | push: item.job_series %} - {% endif %} - {% endif %} - {% endfor %} - - {% assign series_array = series_array | sort %} - {% for series in series_array %} - {% assign series_id = series | downcase | slice: 0, 4 |replace: ", ", "-" | replace: " ", "-" %} - - {% endfor %} -
- -

GS Level

-
- {% assign level_array = "" | split: "," %} - - {% for item in site.cards %} - {% if item.category == 'career' %} - {% if level_array contains item.level %} - - {% else %} - {% assign level_array = level_array | push: item.level %} - {% endif %} - {% endif %} - {% endfor %} - - {% assign level_array = level_array | numerical_sort %} - {% for level in level_array %} - {% assign level_id = level | downcase | replace: ", ", "-" | replace: " ", "-" %} - - {% endfor %} -
- -
-

Job Specific Technical Competencies

-
- - -
-
-
- {% assign competency_group_array = site.cards | where: 'category', 'career' | map: 'competency_group' | uniq %} - {% assign job_comps = 'Primary,Secondary,Alternate' | split: "," %} - {% assign general_comps = site.cards | map: 'competency_group' | uniq %} - {% for comp in job_comps %} - {% assign general_comps = general_comps | where_exp: "item", "item != comp" %} - {% endfor %} - {% assign competency_sort_array = 'Personal,Project,Leading,Future Skills' | split: ',' %} - {% assign sorted_competency_group_array = "" | split: "," %} - - {% for comp in competency_sort_array %} - {% for comp2 in general_comps %} - {% if comp == comp2 %} - {% assign sorted_competency_group_array = sorted_competency_group_array | push: comp | uniq %} - {% endif %} - {% endfor %} - {% endfor %} - - {% comment %} - Loops through the job specific competencies to print their filters on the page. - {% endcomment %} - {% for competency_group in job_comps %} - {% assign competency_array = site.cards | where: 'category', 'career' | where: 'competency_group', competency_group | map: 'competency' | uniq | sort %} - - {% assign competency_group_id = competency_group | replace: ", ", "-" | replace: " ", "-" %} -
-
-
-
- -
-
- - -
-
-
- {% for competency in competency_array %} - {% assign competency_id = competency | replace: ", ", "-" | replace: " ", "-" %} - - {% endfor %} -
-
-
- {% endfor %} -
-
-

General Career
Competencies

-
- - -
-
-
- {% for competency_group in sorted_competency_group_array %} - {% assign competency_array = site.cards | where: 'category', 'career' | where: 'competency_group', competency_group | map: 'competency' | uniq | sort %} - - {% assign competency_group_id = competency_group | replace: ", ", "-" | replace: " ", "-" %} -
-
-
-
- -
-
- - -
-
-
- {% for competency in competency_array %} - {% assign competency_id = competency | replace: ", ", "-" | replace: " ", "-" %} - - {% endfor %} -
-
-
- {% endfor %} - -
-
-
-
- -
-
- -
- - - -
-
- -
- - -
-
- - -
- -
-
- Clear All -
-
- -
- -
-
-
- {% assign post_count = site.cards | size %} - {% assign default_page_size = 10 %} - {% assign post_pages = post_count | divided_by: default_page_size %} - {% assign post_modulus = post_count | minus: post_pages | times: default_page_size %} - {% if post_modulus > 0 %} - {% assign post_pages = post_pages | plus: 1 %} - {% endif %} -
-

1

/

{{ post_pages }}

{{ post_count }}

Results -
-
- - -
-
-
- - {% assign series = '501'%} - {% assign level = '7-9'%} - {% assign pcards = site.cards | where: 'series', series | where: 'level', level | where: 'competency_group', 'Primary' %} - {% assign scards = site.cards | where: 'series', series | where: 'level', level | where: 'competency_group', 'Secondary' %} - {% assign cards = pcards | concat: scards %} - {% for card in cards limit:default_page_size %} -
-
-
-
- -
-
-
GS Level: {{ card.level }}
-
Job Series: 0{{ card.series }}
-
-
-
Competency: {{ card.competency }}
-
Type: {{ card.competency_group }}
-
-

Definition: {{ card.competency_description }}

-
- {{ card.content }} -
-
-

Career Listing

- {% if card.relevant_courses.size != 0 %} -
    - {% for course in card.relevant_courses %} -
  • {{ course | replace: '">', '" target="_blank" >'}}
    • - {% endfor %} -
      - {% else %} -

      No courses

      - {% endif %} -
-
-
-
- {% endfor %} -
-
-
-

1

/

{{ post_pages }}

{{ post_count }}

Results -
-
- - -
-
-
+ {% include career-planning-tool/wfm-filter.html %} + {% include career-planning-tool/wfm-results.html %}
From cc2007ee8511198f766c36b2c6ba977a4b70435b Mon Sep 17 00:00:00 2001 From: Alex Date: Mon, 13 Mar 2023 15:37:04 -0400 Subject: [PATCH 02/21] Fixing buttons top display --- _includes/career-planning-tool/wfm-results.html | 2 +- assets/css/career-planning.css | 10 +++++++++- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/_includes/career-planning-tool/wfm-results.html b/_includes/career-planning-tool/wfm-results.html index 94b1a3f68..935d35dbe 100644 --- a/_includes/career-planning-tool/wfm-results.html +++ b/_includes/career-planning-tool/wfm-results.html @@ -14,7 +14,7 @@ -
+
diff --git a/assets/css/career-planning.css b/assets/css/career-planning.css index 6891cf1fd..9c0dd5b19 100644 --- a/assets/css/career-planning.css +++ b/assets/css/career-planning.css @@ -198,7 +198,15 @@ input#career-advancement-search-input { padding: 15px; } -#career-download-buttons { +@media screen and (max-width: 770px) { + + #career-download-buttons button{ + width: 130px; + } + + #career-download-buttons{ + width: 100%; + } } From 70e398eeec4fa52aa43a1cc728f6818593fda09b Mon Sep 17 00:00:00 2001 From: Alex Date: Tue, 14 Mar 2023 11:16:59 -0400 Subject: [PATCH 03/21] Fixed responsiveness --- _includes/career-planning-tool/wfm-header.html | 12 ++++-------- _includes/career-planning-tool/wfm-results.html | 2 +- assets/css/career-planning.css | 4 ++++ career-planning-tool/index.html | 4 ++-- 4 files changed, 11 insertions(+), 11 deletions(-) diff --git a/_includes/career-planning-tool/wfm-header.html b/_includes/career-planning-tool/wfm-header.html index 4818fa1df..2579805ed 100644 --- a/_includes/career-planning-tool/wfm-header.html +++ b/_includes/career-planning-tool/wfm-header.html @@ -1,13 +1,9 @@
-
-
back to CFO.gov
-
-
-
-

Career Planning & Training Tool (in BETA)

-
-
+
+
back to CFO.gov
+
+

Career Planning & Training Tool (in BETA)

Discover the knowledge, skills, and training that can help advance your Federal career

diff --git a/_includes/career-planning-tool/wfm-results.html b/_includes/career-planning-tool/wfm-results.html index 935d35dbe..3c0db2613 100644 --- a/_includes/career-planning-tool/wfm-results.html +++ b/_includes/career-planning-tool/wfm-results.html @@ -117,7 +117,7 @@

Career Listing

{% endfor %}
-
+

1

/

{{ post_pages }}

{{ post_count }}

Results
diff --git a/assets/css/career-planning.css b/assets/css/career-planning.css index 9c0dd5b19..860f28747 100644 --- a/assets/css/career-planning.css +++ b/assets/css/career-planning.css @@ -207,6 +207,10 @@ input#career-advancement-search-input { #career-download-buttons{ width: 100%; } + + a{ + overflow-wrap: break-word !important; + } } diff --git a/career-planning-tool/index.html b/career-planning-tool/index.html index dbdff848d..76ecef884 100644 --- a/career-planning-tool/index.html +++ b/career-planning-tool/index.html @@ -24,8 +24,8 @@ {% include career-planning-tool/wfm-header.html %}
-
-
+
+
{% include career-planning-tool/wfm-filter.html %} {% include career-planning-tool/wfm-results.html %}
From c935d46fe7f44421bc7d0667ca008e4dd2b1abbe Mon Sep 17 00:00:00 2001 From: Alex Date: Wed, 15 Mar 2023 16:50:42 -0400 Subject: [PATCH 04/21] Fixed the clear all not updating the top parent select all --- .../facets-filters/facets-left-buttons.js | 35 ------------------ .../facets-filters/facets-top-filters.js | 37 +++++++++++++++++++ 2 files changed, 37 insertions(+), 35 deletions(-) diff --git a/assets/js/facets/facets-filters/facets-left-buttons.js b/assets/js/facets/facets-filters/facets-left-buttons.js index 07101590b..92f23e530 100644 --- a/assets/js/facets/facets-filters/facets-left-buttons.js +++ b/assets/js/facets/facets-filters/facets-left-buttons.js @@ -99,41 +99,6 @@ }); } - /** - * Create a clear all filters button - */ - function createClearButton() { - $("#career-facet-remove-all-filters-button").on('click', function () { - facetGlobalVars.adding = false; - facetGlobalVars.removing = true; - - facetGlobalVars.data.forEach(item => { - if (item.keys != null) { - $('#career-advancement-search-input').val(''); - $('#career-advancement-search-input').removeAttr('value'); - } else { - if (item.type === 'checkbox') { - $("#" + item.id).prop("checked", false); - let group = $("#" + item.id).data('group'); - if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); - if ($("#career-competency-select-all").is(":checked")) $("#career-competency-select-all").prop("checked", false); - } else $("#" + item.id).toggleClass('active'); - $("#" + item.id + "-button").remove(); - } - }) - facetGlobalVars.data = []; - facetGlobalVars.searchOrder = []; - resetFilterBlocks(); - if (!facetGlobalVars.inProgressCheckAll) { - $().getSearch(); - } - - $('.career-competency-level-3-input-group label[data-state="enabled"]').attr('data-state', 'disable').html('Select All').change(); - $("#dialog").dialog().dialog("close"); - }); - } - - /** * Creates a single remove button. * Called in two places diff --git a/assets/js/facets/facets-filters/facets-top-filters.js b/assets/js/facets/facets-filters/facets-top-filters.js index 83baa0e93..e54c4ba46 100644 --- a/assets/js/facets/facets-filters/facets-top-filters.js +++ b/assets/js/facets/facets-filters/facets-top-filters.js @@ -236,4 +236,41 @@ function onPopupSubButtonClick(competencyGroup, id, competencyTitle) { $("#general-competency").css('display', 'none'); } $("#" + eventTargetId + "-button").remove(); +} + +/** + * Create a clear all filters button + */ + function createClearButton() { + $("#career-facet-remove-all-filters-button").on('click', function () { + facetGlobalVars.adding = false; + facetGlobalVars.removing = true; + + facetGlobalVars.data.forEach(item => { + if (item.keys != null) { + $('#career-advancement-search-input').val(''); + $('#career-advancement-search-input').removeAttr('value'); + } else { + if (item.type === 'checkbox') { + $("#" + item.id).prop("checked", false); + let group = $("#" + item.id).data('group'); + if ($("#" + group).is(":checked")) $("#" + group).prop("checked", false); + if ($("#career-competency-select-all").is(":checked")) $("#career-competency-select-all").prop("checked", false); + } else $("#" + item.id).toggleClass('active'); + $("#" + item.id + "-button").remove(); + } + }) + facetGlobalVars.data = []; + facetGlobalVars.searchOrder = []; + resetFilterBlocks(); + if (!facetGlobalVars.inProgressCheckAll) { + $().getSearch(); + } + + //Changing the state of all the select all button from "de-select all" to "select all" + $('.career-competency-level-3-input-group label[data-state="enabled"]').attr('data-state', 'disable').html('Select All').change(); + $('#job-career-competency-select, #general-career-competency-select').html('Select All').change(); + general-career-competency-select + $("#dialog").dialog().dialog("close"); + }); } \ No newline at end of file From 33ab8665e6ebaedffd8bd919b1645d13329d935d Mon Sep 17 00:00:00 2001 From: Alex Date: Thu, 16 Mar 2023 08:45:02 -0400 Subject: [PATCH 05/21] Added changed to skip to search --- Dockerfile | 21 +++++++++++++++++++++ _includes/header.html | 2 +- docker-compose.yml | 15 +++++++++++++++ 3 files changed, 37 insertions(+), 1 deletion(-) create mode 100644 Dockerfile create mode 100644 docker-compose.yml diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 000000000..0f9be3364 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,21 @@ +FROM ruby:2.6.6 + +RUN apt-get update && \ + apt-get install --reinstall -y locales && \ + sed -i 's/# en_US.UTF-8 UTF-8/en_US.UTF-8 UTF-8/' /etc/locale.gen && \ + locale-gen en_US.UTF-8 + +ENV LANG en_US.UTF-8 +ENV LANGUAGE en_US +ENV LC_ALL en_US.UTF-8 + +RUN mkdir -p /app + +WORKDIR /app + +COPY Gemfile /app +#COPY Gemfile.lock /app + +RUN bundle install + +EXPOSE 4000 \ No newline at end of file diff --git a/_includes/header.html b/_includes/header.html index 455d8eac8..523ea292b 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -6,7 +6,7 @@ {% if page.secondary_skip %} Skip to secondary navigation {% endif %} - Skip to main content + Skip to main content
diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 000000000..e94b16e82 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,15 @@ +version: '3' +services: + node: + image: node:12 + working_dir: /app + volumes: + - .:/app:delegated + ruby: + build: . + working_dir: /app + ports: + - "4001:4000" + volumes: + - .:/app:delegated + command: bundle exec jekyll serve --host 0.0.0.0 -I \ No newline at end of file From ebd3afa541d8115dc710439bdc3f08f6739f8e71 Mon Sep 17 00:00:00 2001 From: Alex Date: Thu, 16 Mar 2023 10:14:45 -0400 Subject: [PATCH 06/21] Fixed filter --- .../facets-filters/facets-top-filters.js | 2 +- assets/js/facets/facets-filters/facets.js | 24 ++++++++++++++----- 2 files changed, 19 insertions(+), 7 deletions(-) diff --git a/assets/js/facets/facets-filters/facets-top-filters.js b/assets/js/facets/facets-filters/facets-top-filters.js index e54c4ba46..55af49ed6 100644 --- a/assets/js/facets/facets-filters/facets-top-filters.js +++ b/assets/js/facets/facets-filters/facets-top-filters.js @@ -243,6 +243,7 @@ function onPopupSubButtonClick(competencyGroup, id, competencyTitle) { */ function createClearButton() { $("#career-facet-remove-all-filters-button").on('click', function () { + location.reload(); facetGlobalVars.adding = false; facetGlobalVars.removing = true; @@ -270,7 +271,6 @@ function onPopupSubButtonClick(competencyGroup, id, competencyTitle) { //Changing the state of all the select all button from "de-select all" to "select all" $('.career-competency-level-3-input-group label[data-state="enabled"]').attr('data-state', 'disable').html('Select All').change(); $('#job-career-competency-select, #general-career-competency-select').html('Select All').change(); - general-career-competency-select $("#dialog").dialog().dialog("close"); }); } \ No newline at end of file diff --git a/assets/js/facets/facets-filters/facets.js b/assets/js/facets/facets-filters/facets.js index df36fb54c..3aac69d1c 100644 --- a/assets/js/facets/facets-filters/facets.js +++ b/assets/js/facets/facets-filters/facets.js @@ -67,16 +67,28 @@ $(document).ready(function () { $(this).prop('checked', false); }); + // For 508 when tabbing on select all for job specific + $("#job-career-competency-select-all").on("focus", function () { + $('label[for="job-career-competency-select-all"]').addClass("padding-05"); + $('label[for="job-career-competency-select-all"]').css("outline", "0.25rem solid #2491ff"); + }); + // is this being used ? - $("#career-competency-select-all").on("focus", function () { - $('label[for="career-competency-select-all"]').addClass("padding-05"); - $('label[for="career-competency-select-all"]').css("outline", "0.25rem solid #2491ff"); + $("#job-career-competency-select-all").on("blur", function () { + $('label[for="job-career-competency-select-all"]').removeClass("padding-05"); + $('label[for="job-career-competency-select-all"]').css("outline", "none"); + }); + + // For 508 when tabbing on select all for general career + $("#general-career-competency-select-all").on("focus", function () { + $('label[for="general-career-competency-select-all"]').addClass("padding-05"); + $('label[for="general-career-competency-select-all"]').css("outline", "0.25rem solid #2491ff"); }); // is this being used ? - $("#career-competency-select-all").on("blur", function () { - $('label[for="career-competency-select-all"]').removeClass("padding-05"); - $('label[for="career-competency-select-all"]').css("outline", "none"); + $("#general-career-competency-select-all").on("blur", function () { + $('label[for="general-career-competency-select-all"]').removeClass("padding-05"); + $('label[for="general-career-competency-select-all"]').css("outline", "none"); }); From c6d9ad3de86c8a204b7161a0b694f5bb6aab074c Mon Sep 17 00:00:00 2001 From: Alex Date: Thu, 16 Mar 2023 10:16:41 -0400 Subject: [PATCH 07/21] Adding docker config for mac --- Dockerfile | 21 +++++++++++++++++++++ docker-compose.yml | 15 +++++++++++++++ 2 files changed, 36 insertions(+) create mode 100644 Dockerfile create mode 100644 docker-compose.yml diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 000000000..d0145a17a --- /dev/null +++ b/Dockerfile @@ -0,0 +1,21 @@ +FROM ruby:2.6.6 + +RUN apt-get update && \ + apt-get install --reinstall -y locales && \ + sed -i 's/# en_US.UTF-8 UTF-8/en_US.UTF-8 UTF-8/' /etc/locale.gen && \ + locale-gen en_US.UTF-8 + +ENV LANG en_US.UTF-8 +ENV LANGUAGE en_US +ENV LC_ALL en_US.UTF-8 + +RUN mkdir -p /app + +WORKDIR /app + +COPY Gemfile /app +COPY Gemfile.lock /app + +RUN bundle install + +EXPOSE 4000 \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 000000000..f13db8816 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,15 @@ +version: '3' +services: + node: + image: node:12 + working_dir: /app + volumes: + - .:/app:delegated + ruby: + build: . + working_dir: /app + ports: + - "4005:4000" + volumes: + - .:/app:delegated + command: bundle exec jekyll serve --host 0.0.0.0 \ No newline at end of file From 1d3cb9f8fb9192c353d36c7d6a1620734e3aa5a0 Mon Sep 17 00:00:00 2001 From: Alex Date: Fri, 17 Mar 2023 09:46:51 -0400 Subject: [PATCH 08/21] Fixed responsiveness issues --- .../career-planning-tool/wfm-header.html | 2 +- .../career-planning-tool/wfm-results.html | 2 +- _includes/header.html | 2 +- assets/css/career-planning.css | 30 ++++++++++++++++--- 4 files changed, 29 insertions(+), 7 deletions(-) diff --git a/_includes/career-planning-tool/wfm-header.html b/_includes/career-planning-tool/wfm-header.html index 2579805ed..2790c611a 100644 --- a/_includes/career-planning-tool/wfm-header.html +++ b/_includes/career-planning-tool/wfm-header.html @@ -1,7 +1,7 @@
-
back to CFO.gov
+
back to CFO.gov

Career Planning & Training Tool (in BETA)

Discover the knowledge, skills, and training that can help advance your Federal career

diff --git a/_includes/career-planning-tool/wfm-results.html b/_includes/career-planning-tool/wfm-results.html index 3c0db2613..085345f58 100644 --- a/_includes/career-planning-tool/wfm-results.html +++ b/_includes/career-planning-tool/wfm-results.html @@ -54,7 +54,7 @@

- - + + +

diff --git a/assets/css/career-planning.css b/assets/css/career-planning.css index eb3ee1e12..584a1ca88 100644 --- a/assets/css/career-planning.css +++ b/assets/css/career-planning.css @@ -206,10 +206,16 @@ input#career-advancement-search-input { #career-download-buttons{ flex-direction: column; - width: 100% !important; + width: 100% !important; }; - #career-download-buttons button{ + #career-download-button-1{ + width: 100% !important; + }; + #career-download-button-2{ + width: 100% !important; + }; + #career-download-button-3{ width: 100% !important; }; From 641fa4236f4d555d4c5e51d71a497aba12381d1c Mon Sep 17 00:00:00 2001 From: Alex Date: Mon, 20 Mar 2023 13:11:58 -0400 Subject: [PATCH 11/21] Responsiveness issues fixed --- _includes/career-planning-tool/wfm-header.html | 2 +- _includes/career-planning-tool/wfm-results.html | 4 ++-- assets/css/career-planning.css | 14 +++++++++++--- 3 files changed, 14 insertions(+), 6 deletions(-) diff --git a/_includes/career-planning-tool/wfm-header.html b/_includes/career-planning-tool/wfm-header.html index 2790c611a..7d4111905 100644 --- a/_includes/career-planning-tool/wfm-header.html +++ b/_includes/career-planning-tool/wfm-header.html @@ -1,7 +1,7 @@
-
back to CFO.gov
+
CFO.gov Home Page

Career Planning & Training Tool (in BETA)

Discover the knowledge, skills, and training that can help advance your Federal career

diff --git a/_includes/career-planning-tool/wfm-results.html b/_includes/career-planning-tool/wfm-results.html index 120208280..d8487b3ef 100644 --- a/_includes/career-planning-tool/wfm-results.html +++ b/_includes/career-planning-tool/wfm-results.html @@ -15,7 +15,7 @@
- +
@@ -43,7 +43,7 @@

diff --git a/assets/css/career-planning.css b/assets/css/career-planning.css index 9e3da75ec..4b19c6283 100644 --- a/assets/css/career-planning.css +++ b/assets/css/career-planning.css @@ -205,7 +205,8 @@ input#career-advancement-search-input { @media screen and (max-width: 770px) { .ui-dialog{ - width: 100% !important; + width: 90% !important; + margin-left: 20px; } #career-download-buttons{ @@ -234,6 +235,15 @@ input#career-advancement-search-input { } @media screen and (max-width: 460px) { + .search-container{ + display: block; + } + + form.usa-search{ + display: block !important; + margin-right: -2rem !important; + } + a{ overflow-wrap: break-word !important; } @@ -260,6 +270,18 @@ input#career-advancement-search-input { .career-competency-toggle-button{ width: 50% !important; } + + #series-gs-container{ + flex-wrap: wrap; + } + + #series{ + margin-bottom: 0.5rem; + } + + #gs, #job-competency, #series{ + padding: 0px; + } } diff --git a/assets/js/facets/facets-filters/facets-left-buttons.js b/assets/js/facets/facets-filters/facets-left-buttons.js index 92f23e530..4746718fb 100644 --- a/assets/js/facets/facets-filters/facets-left-buttons.js +++ b/assets/js/facets/facets-filters/facets-left-buttons.js @@ -150,7 +150,7 @@ } else { removeButtonText = (' ' + competencyGroup + " - " + competencyTitle).replace(/ [\w]/g, a => a.toLocaleUpperCase()).trim(); } - + removeButtonA.setAttribute("aria-label", "Remove "+ removeButtonText + " filter"); removeButtonA.innerHTML = removeButtonText + "  "; if (eventTargetId.match("series")) { diff --git a/assets/js/facets/facets-filters/facets-top-filters.js b/assets/js/facets/facets-filters/facets-top-filters.js index 55af49ed6..ff9b16f41 100644 --- a/assets/js/facets/facets-filters/facets-top-filters.js +++ b/assets/js/facets/facets-filters/facets-top-filters.js @@ -115,7 +115,8 @@ function onPopupSubButtonClick(competencyGroup, id, competencyTitle) { //set item length and name const itemLength = groupItem != null ? JSON.parse(cfoStorage.getItem(competencyGroup)).length : 0; const itemName = ' ' + competencyGroup + ' ' + spanStart + itemLength.toString() + spanEnd; - + $(this).attr('aria-label', $(this).text() + ariaLabel); + $('
-
+
From 2b0c4c96160806237e475bfbd80fd03c2321a2d6 Mon Sep 17 00:00:00 2001 From: Alex Date: Fri, 31 Mar 2023 10:29:28 -0400 Subject: [PATCH 20/21] Sorted the filter items on the modal --- assets/js/facets/facets-filters/facets-top-filters.js | 1 + 1 file changed, 1 insertion(+) diff --git a/assets/js/facets/facets-filters/facets-top-filters.js b/assets/js/facets/facets-filters/facets-top-filters.js index ff9b16f41..e8407401e 100644 --- a/assets/js/facets/facets-filters/facets-top-filters.js +++ b/assets/js/facets/facets-filters/facets-top-filters.js @@ -153,6 +153,7 @@ function onPopupSubButtonClick(competencyGroup, id, competencyTitle) { if (groupItem != null) { let groupItems = groupItem.replace('[', '').replace(']', '').replace(', ', ' ').split(','); let groupItemsLength = groupItems.length; + groupItems.sort(); groupItems.forEach(function (i) { let givenId = "pop-" + i.replaceAll('| ', '-') From 1ece0e232fe442d63a3bda12e0218b88733f29a1 Mon Sep 17 00:00:00 2001 From: Alex Date: Mon, 24 Apr 2023 16:39:48 -0400 Subject: [PATCH 21/21] Removing these 508 fixed, creating another bug --- assets/js/facets/facets-filters/facets-top-filters.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/js/facets/facets-filters/facets-top-filters.js b/assets/js/facets/facets-filters/facets-top-filters.js index e8407401e..12e055da1 100644 --- a/assets/js/facets/facets-filters/facets-top-filters.js +++ b/assets/js/facets/facets-filters/facets-top-filters.js @@ -115,8 +115,8 @@ function onPopupSubButtonClick(competencyGroup, id, competencyTitle) { //set item length and name const itemLength = groupItem != null ? JSON.parse(cfoStorage.getItem(competencyGroup)).length : 0; const itemName = ' ' + competencyGroup + ' ' + spanStart + itemLength.toString() + spanEnd; - $(this).attr('aria-label', $(this).text() + ariaLabel); - $('