Skip to content

Commit

Permalink
Refactor HTML and JavaScript so Projects and Projects-Check page shar…
Browse files Browse the repository at this point in the history
…e same files (#5978)

* Modify to include current-projects.html

* Refactor filter display and data handling for projects-check page

* Fix filter categorization pages with projects

- Create Tools section in tdm-calculator.md and transfer Figma
- Move Figma and Miro to Tools section and remove Technologies section in youthjusticenav.md
  • Loading branch information
jphamtv authored Jan 2, 2024
1 parent 227694b commit cfe7ae6
Show file tree
Hide file tree
Showing 4 changed files with 25 additions and 12 deletions.
3 changes: 2 additions & 1 deletion _projects/tdm-calculator.md
Original file line number Diff line number Diff line change
Expand Up @@ -63,11 +63,12 @@ technologies:
- Microsoft SQL Server
- Docker
- Azure App Service
- Figma
location:
# - Downtown LA
- Remote
partner: LA Department of Transportation and Los Angeles City Planning
tools:
- Figma
program-area:
- Environment
visible: true
Expand Down
5 changes: 2 additions & 3 deletions _projects/youthjusticenav.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,15 +58,14 @@ looking:
skill: UI Designer
- category: UI/UX
skill: UX Researcher
technologies:
- Figma
- Miro
location:
- Remote
partner: UCLA School of Law, Golden Gate University School of Law
tools:
- Figma
- Google Docs
- Google Sheets
- Miro
program-area:
- Justice
visible: true
Expand Down
27 changes: 20 additions & 7 deletions assets/js/current-projects.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,11 @@ document.addEventListener("DOMContentLoaded",function(){
if(filterName === "programs"){
filterTitle = "program areas"
} else if(filterName === 'technologies') {
filterTitle = 'languages / technologies'
if (window.location.pathname === '/projects-check/') {
filterTitle = filterName;
} else {
filterTitle = 'languages / technologies'
}
filterValue.sort((a,b)=> {
a = a.toLowerCase()
b = b.toLowerCase()
Expand All @@ -34,7 +38,7 @@ document.addEventListener("DOMContentLoaded",function(){
return 0;
})
} else {
filterTitle = filterName
filterTitle = filterName;
}
document.querySelector('.filter-list').insertAdjacentHTML( 'beforeend', dropDownFilterComponent( filterName,filterValue,filterTitle) );
if (document.getElementById(filterName).getElementsByTagName("li").length > 8) {
Expand Down Expand Up @@ -194,14 +198,21 @@ function projectDataSorter(projectdata){
* Returns a filter object -> {filter_type1:[filter_value1,filter_value2], filter_type2:[filter_value1,filter_value2], ... }
*/
function createFilter(sortedProjectData){
return {
if (window.location.pathname === '/projects-check/') {
return {
'technologies': [...new Set(sortedProjectData.map(item => (item.project.technologies?.length > 0) ? [item.project.technologies].flat() : '').flat() ) ].filter(v=>v!='').sort(),
'languages': [...new Set(sortedProjectData.map(item => (item.project.languages?.length > 0) ? [item.project.languages].flat() : '').flat() ) ].filter(v=>v!='').sort(),
'tools': [...new Set(sortedProjectData.map(item => (item.project.tools?.length > 0) ? [item.project.tools].flat() : '').flat() ) ].filter(v=>v!='').sort(),
}
} else {
return {
// 'looking': [ ... new Set( (sortedProjectData.map(item => item.project.looking ? item.project.looking.map(item => item.category) : '')).flat() ) ].filter(v=>v!='').sort(),
// ^ See issue #1997 for more info on why this is commented out
'programs': [...new Set(sortedProjectData.map(item => item.project.programAreas ? item.project.programAreas.map(programArea => programArea) : '').flat() ) ].filter(v=>v!='').sort(),
'technologies': [...new Set(sortedProjectData.map(item => (item.project.technologies && item.project.languages?.length > 0) ? [item.project.languages, item.project.technologies].flat() : '').flat() ) ].filter(v=>v!='').sort(),
'status': [... new Set(sortedProjectData.map(item => item.project.status))].sort(),

}
'status': [... new Set(sortedProjectData.map(item => item.project.status))].sort()
}
}
}

/**
Expand Down Expand Up @@ -627,7 +638,9 @@ function projectCardComponent(project){
<li class="project-card" id="${ project.identification }"
data-status="${project.status}"
data-looking="${project.looking ? [... new Set(project.looking.map(looking => looking.category)) ] : ''}"
data-technologies="${(project.technologies && project.languages) ? [... new Set(project.technologies.map(tech => tech)), project.languages.map(lang => lang)] : project.languages.map(lang => lang) }"
data-technologies="${(project.technologies && project.languages) ? [... new Set(project.technologies.map(tech => tech)), project.languages.map(lang => lang)] : project.languages.map(lang => lang) }"
data-languages="${project.languages ? [... new Set(project.languages.map(lang => lang))] : '' }"
data-tools="${project.tools ? [... new Set(project.tools.map(tool => tool))] : '' }"
data-location="${project.location? project.location.map(city => city) : '' }"
data-programs="${project.programAreas ? project.programAreas.map(programArea => programArea) : '' }"
data-description="${project.description}"
Expand Down
2 changes: 1 addition & 1 deletion pages/projects-check.html
Original file line number Diff line number Diff line change
Expand Up @@ -20,4 +20,4 @@ <h1>Our Projects</h1>
<img src="/assets/images/projects-page/projects-hero.svg" alt="">
</div>

{%- include current-projects-check.html -%}
{%- include current-projects.html -%}

0 comments on commit cfe7ae6

Please sign in to comment.