Skip to content

feat: Add Advanced Sorting Visualizer - #11001

Merged
dhairyagothi merged 1 commit into
dhairyagothi:Mainfrom
Yogender-verma:a8
Aug 7, 2026
Merged

dhairyagothi merged 1 commit into
dhairyagothi:Mainfrom
Yogender-verma:a8

Conversation

@Yogender-verma

Copy link
Copy Markdown
Contributor

📝 Pull Request Description

Related Issue

Closes #10989

Summary

Added a new advanced HTML/CSS/JS project: Advanced Sorting Visualizer. This multi-page application provides an interactive way to learn and visualize how classic sorting algorithms (Bubble, Insertion, Merge, and Quick Sort) manipulate data arrays in real-time.

Type of Change

  • 🐛 Bug fix (non-breaking change which fixes an issue)
  • ✨ New project addition
  • 🚀 New feature or UI/UX enhancement
  • ♻️ Code refactoring / clean-up
  • 📝 Documentation update
  • ⚙️ GitHub Workflow automation or DX improvements

🛠️ Changes Made

  • Created a new project folder: Added ./public/Sorting_Visualizer/.
  • Multi-Page Dashboard Architecture: Built index.html (Landing & Big-O Summaries), visualizer.html (Main interactive sandbox), and settings.html (Color Theme Configuration).
  • Algorithmic State Recording Engine (script.js):
    • To perfectly visualize recursive algorithms without blocking the UI thread or breaking the mental model with arbitrary await delay() calls, the engine instantly computes the sort in the background and records a sequential array of "animation frames" (compare, swap, overwrite).
    • A Master Animation Engine then parses these frames and plays them back sequentially on the DOM using JavaScript timing functions.
  • Interactive UI Controls: Added robust <input type="range"> sliders to dynamically control the Array Size (number of DOM bars) and the Animation Playback Speed.
  • Dynamic Theming: Implemented localStorage state management and CSS Variables via settings.html so users can define exactly what colors represent "comparing", "swapping", and "sorted" elements.

Note: Following the updated workflow, projects.json was not modified for this addition.


🧪 Testing and Verification

Local Validation

  • I have run node scripts/validateProjects.js locally and it passed with zero errors.

Browser Compatibility Check

  • Tested and verified in Google Chrome
  • Tested and verified in Mozilla Firefox
  • Tested and verified in Safari / Microsoft Edge

Responsive & Accessibility Checks

  • Verified responsive layout on Mobile viewports (using DevTools)
  • Verified responsive layout on Tablet viewports
  • Keyboard navigation and focus outlines checked
  • Semantic HTML and ARIA labels checked

🤝 Contributor Checklist

  • My code follows the code style guidelines of this project.
  • I have performed a self-review of my own code.
  • I have commented my code, particularly in hard-to-understand areas.
  • I have updated the documentation / README files accordingly.
  • My changes generate no new warnings or console errors.
  • There are no unrelated changes or formatter noise in this PR.

@vercel

vercel Bot commented Aug 2, 2026

Copy link
Copy Markdown

@Yogender-verma is attempting to deploy a commit to the Dhairya Gothi 's projects Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions

github-actions Bot commented Aug 2, 2026

Copy link
Copy Markdown
Contributor

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, please ensure that your changes align with our CONTRIBUTING.md. If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

@dhairyagothi dhairyagothi added gssoc:approved Approved by admin level:intermediate Intermediate difficulty task type:refactor Refactoring/improvement labels Aug 7, 2026
@dhairyagothi
dhairyagothi merged commit 00e3c61 into dhairyagothi:Main Aug 7, 2026
4 of 5 checks passed
@github-actions

github-actions Bot commented Aug 7, 2026

Copy link
Copy Markdown
Contributor

🎉 Your pull request has been successfully merged! 🎉 Thank you for your valuable contribution to our project. Your efforts are greatly appreciated. Feel free to reach out if you have any more contributions or if there's anything else we can assist you with. Keep up the fantastic work! 🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

gssoc:approved Approved by admin level:intermediate Intermediate difficulty task type:refactor Refactoring/improvement

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature]: Advanced Sorting Visualizer

2 participants