update projects

Author: yang-i-hu

assets/scripts/collapse-summary.js

@@ -0,0 +1,58 @@
+/* collapse-summary.js  ------------------------------------------------
+   Makes the “Read More / Read Less” button work on every
+   .collapse-summary block.  Works with Toha’s default HTML (which
+   already carries the .collapsed class in the markup).
+--------------------------------------------------------------------- */
+
+document.addEventListener('DOMContentLoaded', () => {
+    document.querySelectorAll('.collapse-summary').forEach(container => {
+      const text   = container.querySelector('.summary-text');
+      const button = container.querySelector('.toggle-summary');
+  
+      /* --- 1. Measure full height (temporarily un-clamp if needed) ---- */
+      const hadClass = text.classList.contains('collapsed');
+      if (hadClass) text.classList.remove('collapsed');
+      const fullHeight = text.scrollHeight;
+      if (hadClass) text.classList.add('collapsed');   // put it back
+  
+      /* --- 2. Compare with the clamped height ------------------------ */
+      const clampedHeight = text.clientHeight;
+  
+      if (fullHeight > clampedHeight) {
+        button.style.display = 'inline-block';
+      } else {
+        /* Summary is ≤2 lines → leave it expanded, hide button */
+        text.classList.remove('collapsed');
+        return;
+      }
+
+    // Helper: ask Filterizr (or any resize listener) to recalculate layout
+    function relayoutGrid() {
+        // 🔹 If Filterizr v2 is present -------------------------------
+        if (window.Filterizr && typeof window.Filterizr.refresh === 'function') {
+        // The container has class .container-filter in Toha
+        const filterInstance = window.Filterizr.getInstance('.container-filter');
+        filterInstance?.refresh();        // v2 API
+        return;
+        }
+    
+        // 🔹 Fallback: broadcast a resize event -----------------------
+        // Lots of libraries (Filterizr v1, Isotope, Masonry) listen for this
+        window.dispatchEvent(new Event('resize'));
+    }
+        
+  
+      /* --- 3. Toggle on click ---------------------------------------- */
+      button.addEventListener('click', () => {
+        const collapsed = text.classList.toggle('collapsed');
+        button.textContent = collapsed ? 'Read More' : 'Read Less';
+        
+        /* wait for the CSS transition to finish before re-laying out */
+        if (!collapsed) {          // just expanded
+            text.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
+          }
+        setTimeout(relayoutGrid, 0);   // 20 ms transition buffer
+      });
+    });
+  });
+  

assets/styles/override.scss

@@ -0,0 +1,46 @@
+/* -------------  Collapsible project summaries  ------------------- */
+.collapse-summary .summary-text {
+    position: relative;
+    line-height: 1.5;
+    overflow: hidden;
+    transition: max-height .3s ease;
+  }
+  
+  /* CLAMPED state (Toha already adds .collapsed in the markup) */
+  .collapse-summary .summary-text.collapsed {
+    max-height: calc(1.5em * 5);      /* exactly 5 lines                */
+    display: -webkit-box;
+    -webkit-line-clamp: 5;
+    -webkit-box-orient: vertical;
+  }
+  
+  /* EXPANDED state */
+  .collapse-summary .summary-text:not(.collapsed) {
+    max-height: 500px;                 /* tall enough for any summary    */
+  }
+  
+  /* Fading mask at the bottom while clamped */
+  .collapse-summary .summary-text.collapsed::after {
+    content: '';
+    position: absolute;
+    left: 0; right: 0; bottom: 0;
+    height: 1.5em;                     /* 1 line = 1.5 em                */
+    background: linear-gradient(transparent, white);
+    pointer-events: none;
+  }
+  
+  /* Dark-mode override (Toha sets [data-dark-mode]) */
+  [data-dark-mode] .collapse-summary .summary-text.collapsed::after {
+    background: linear-gradient(transparent, var(--dark-context-bg));
+  }
+  
+  /* Button */
+  .toggle-summary {
+    padding: 0;
+    font-size: .9em;
+    color: #248aaa;
+    margin-top: -.5em;
+    cursor: pointer;
+  }
+  .toggle-summary:hover { text-decoration: underline; }
+  

data/en/sections/projects.yaml

@@ -14,15 +14,28 @@ buttons:
   filter: "all"
 - name: Machine Learning
   filter: "Machine Learning"
-- name: Deep Learning
-  filter: "Deep Learning"
-- name: Time Series
-  filter: "Time Series"
+- name: Computer Vision
+  filter: "Computer Vision"
+- name: Data Science
+  filter: "Data Science"
 - name: Math
   filter: "Math"
 
 # your projects
 projects:
+
+- name: VocationalNYC
+  url: "http://vocationalnyc-env.eba-uurzafst.us-east-1.elasticbeanstalk.com/"
+  repo: https://github.com/gcivil-nyu-org/team1-wed-spring25
+  timeline: "Jan. 2025 - May 2025"
+  summary: "A full-stack platform that helps connect NYC residents with vocational programmes: Django-powered backend (PostgreSQL, WebSockets), Google Maps API for geo-search, AWS Elastic Beanstalk + Nginx deployment, and a Travis-driven CI/CD pipeline."
+  tags: ["Web Development", "Django", "PostgreSQL", "AWS", "DevOps", "JavaScript", "Python"]
+
+- name: Information Retrieval System & Retrieval-Augmented Generation
+  timeline: "Sep. 2024 – Dec. 2024"
+  summary: Built a search engine from scratch on MS MARCO—block-compressed inverted index, DAAT BM25 ranking—then refactored the pipeline with HNSW and advanced reordering to lift F1 by 25 % and systematically probe “lost-in-the-middle” bias in RAG workflows.
+  tags: ["Deep learning", "Machine Learning", "Information Retrieval", "RAG", "Search Engine", "LLM", "Python"]
+
 - name: Semantic Segmentation by Pixel-level Time Series Classification
   # logo: /images/sections/projects/STC.png
   # role: First author
@@ -46,28 +59,28 @@ projects:
   timeline: "Sep. 2023 - Nov. 2023"
   repo: https://github.com/yang-i-hu/TS_US_Candy/
   summary: The project focuses on forecasting the candy production in the U.S. based on the time series data over the past 45 years. Techniques such as Box-Cox transformation and differencing are applied to achieve stationarity, and the optimal SARIMA model is identified using ACF/PACF analysis and Maximum Likelihood Estimation. The model are further validated through comprehensive diagnostic tests and spectral analysis.
-  tags: [ "Time Series", "Statistical Modeling", "R"]
-
-- name: Digitizing Handwritten Data with OCR
-  timeline: "Oct. 2023 - Nov. 2023"
-  summary: Developed an automated workflow to scrape and process PDFs from a government website. Employed template matching and a custom-trained TrOCR model to extract handwritten data
-  tags: [ "Deep learning", "Computer Vision", "Python"]
-
+  tags: [ "Data Science", "Time Series", "Statistical Modeling", "R"]
+  
 - name: Efficient Visual Attention Design for Image Super-Resolution
   logo: /images/sections/projects/evasr.png
   role: AAAI 2024 submission
   timeline: "Mar. 2022 - May 2023"
   repo: https://github.com/yang-i-hu/EvaSR
-  summary: Replicated and analyzed 16 Super-Resolution models to assess key characteristics of success models. Collaboratively designed a CNN-based model that achieved state-of-the-art performance while reducing parameter count by 85% through the innovative use of efficient visual attention mechanisms.
-  tags: [ "Deep learning", "Computer Vision", "Image Super Resolution", "Pytorch","Python"]
+  summary: Replicated 16 SOTA SR models, discovered key architectural bottlenecks, and co-created EvaSR—an attention-augmented CNN that matches SOTA PSNR while slashing parameters by 85 % and FLOPs by 70 %.
+  tags: [ "Deep learning", "Machine Learning", "Computer Vision", "Image Super Resolution", "Pytorch","Python"]
+
+- name: Digitizing Handwritten Data with OCR
+  timeline: "Oct. 2023 - Nov. 2023"
+  summary: Automated the collection and parsing of thousands of government PDFs, then fine-tuned a TrOCR-base model with custom template-matching to hit 95 %+ character accuracy on challenging handwritten forms—reducing manual data entry time from hours to seconds.
+  tags: [ "Deep learning","Machine Learning", "Computer Vision", "Python"]
 
 - name: Soccer player transfer market value prediction
   logo: /images/sections/projects/evasr.png
   role: Machine Learning Course Project
   timeline: "Sep. 2022 - Jan. 2023"
   repo: https://github.com/yang-i-hu/TMP
-  summary: The project focuses on predicting the market value of soccer players from the top 5 leagues in the transfer market based on their match performance statistics. Eight machine learning models were tuned, including KNN, Random Forest, and Gradient-boosted Trees. The results of these models are reported along with an Exploratory Data Analysis using R markdown.
-  tags: [ "Machine Learning", "R"]
+  summary: Engineered a rich feature set from top-5-league match stats and benchmarked eight machine learning models including KNN, Random Forest, and Gradient-boosted Trees. The results are reported along with an Exploratory Data Analysis using R markdown.
+  tags: [ "Data Science", "Machine Learning", "R"]
 
 - name: Exploring SO(3) through the lens of Orbifolds
   logo: /images/sections/projects/pillowcase.png
@@ -78,7 +91,6 @@ projects:
 
 - name: Differential Geometry Calculator
   repo: https://github.com/yang-i-hu/Diff_Geo_Calculator/
-  summary: A tiny script that may help deal with the tedious calculations in differential geometry.
+  summary: Authored a lightweight Python tool that symbolically computes curvature, torsion, and Christoffel symbols—turning pages of manual tensor algebra into one-line scripts.
   tags: [ "Math", "Python"]
 
-

layouts/partials/cards/project.html

@@ -4,7 +4,7 @@
 >
   <div class="card mt-1">
     <div class="card">
-      <a href="{{ if .repo }}{{ .repo }}{{ else if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}" {{ if or .repo .url }}target="_blank" rel="noopener"{{ end }}>
+      <a href="{{ if .url }}{{ .url }}{{ else if .repo }}{{ .repo }}{{ else }}javascript:void(0){{ end }}" {{ if or .repo .url }}target="_blank" rel="noopener"{{ end }}>
         {{ if .image }}
         <div class="card-head">
           {{ $imageImage:= resources.Get .image}}
@@ -50,7 +50,12 @@ <h5 class="card-title mb-0">{{ .name }}</h5>
         </div>
       </a>
       <div class="card-body text-justify pt-1 pb-1">
-        <p>{{ .summary | markdownify }}</p>
+        <div class="collapse-summary">
+          <p class="card-text summary-text collapsed">{{ .summary | markdownify }}</p>
+          <button class="btn btn-link btn-sm toggle-summary" type="button" style="display: none;">
+            Read More
+          </button>
+        </div>
         <!-- Display project card technology tags -->
         <div class="project-card-footer">
           {{ if .tags }}

layouts/partials/custom/collapse-summary.html

@@ -0,0 +1,3 @@
+{{- $opts := dict "target" "es2019" -}}
+{{- $src  := resources.Get "scripts/collapse-summary.js" | js.Build $opts | resources.Minify -}}
+<script defer src="{{ $src.RelPermalink }}" integrity="{{ $src.Data.Integrity }}"></script>

layouts/partials/scripts.html

@@ -1 +1,2 @@
-{{ partial "helpers/script-bundle.html" }}
+{{ partial "helpers/script-bundle.html" }}
+{{ partial "custom/collapse-summary.html" . }}

public/404.html

@@ -6,7 +6,7 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 
-<link rel="stylesheet" href="/application.d79d46208302e5928f4ea03547a86d6d59c73d1126b073411867c8ec331a15fc.css" integrity="sha256-151GIIMC5ZKPTqA1R6htbVnHPREmsHNBGGfI7DMaFfw=" />
+<link rel="stylesheet" href="/application.012fbad9bd15eea7a2faa7c286d22af5d7283632c9f6ee1be941f8e89cdf0c9b.css" integrity="sha256-AS&#43;62b0V7qei&#43;qfChtIq9dcoNjLJ9u4b6UH46JzfDJs=" />
 
 
 
@@ -463,6 +463,8 @@ <h5>Contact me:</h5>
 
     <script src="/application.858f22819f97a63f4ed57dc82661bb3c05e2e327848de38bfc964289e2937aa4.js" integrity="sha256-hY8igZ&#43;Xpj9O1X3IJmG7PAXi4yeEjeOL/JZCieKTeqQ=" defer></script>
 
+<script defer src="/scripts/collapse-summary.min.js" integrity=""></script>
+