{"id":49898416,"url":"https://github.com/pibulus/juicy-sounds","last_synced_at":"2026-05-16T01:37:25.827Z","repository":{"id":311930589,"uuid":"1045431064","full_name":"pibulus/juicy-sounds","owner":"pibulus","description":"A delightful sound library for web interfaces that actually feels good. Pure audio juice, no corporate beeps.","archived":false,"fork":false,"pushed_at":"2026-03-21T06:17:58.000Z","size":7015,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-03-21T22:21:21.717Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pibulus.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-08-27T06:49:53.000Z","updated_at":"2026-03-21T06:18:02.000Z","dependencies_parsed_at":"2025-08-27T23:26:59.982Z","dependency_job_id":"020409fc-fe90-4d9f-8407-f4b4d56b86ce","html_url":"https://github.com/pibulus/juicy-sounds","commit_stats":null,"previous_names":["pibulus/juicy-sounds"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/pibulus/juicy-sounds","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pibulus%2Fjuicy-sounds","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pibulus%2Fjuicy-sounds/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pibulus%2Fjuicy-sounds/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pibulus%2Fjuicy-sounds/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pibulus","download_url":"https://codeload.github.com/pibulus/juicy-sounds/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pibulus%2Fjuicy-sounds/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33087028,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-15T20:25:35.270Z","status":"ssl_error","status_checked_at":"2026-05-15T20:25:34.732Z","response_time":103,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-05-16T01:37:25.174Z","updated_at":"2026-05-16T01:37:25.818Z","avatar_url":"https://github.com/pibulus.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Juicy Sounds 🍊\n\nDead simple mechanical keyboard sounds for web apps. Make typing feel amazing.\n\n## ✨ Features\n\n- 🎹 **Real Mechanical Keyboard Sounds** - Cherry MX Black recordings with 88+ keys mapped\n- 🔧 **Framework Agnostic** - Works with Fresh, Next.js, Vite, SvelteKit, or vanilla JS\n- 🎚️ **Simple API** - One class, intuitive methods, graceful fallbacks\n- 🪶 **Lightweight** - No complex dependencies, just Web Audio API\n- 🎯 **Plug \u0026 Play** - Copy files, import, done\n- 📱 **Mobile Ready** - Handles autoplay policies and suspended audio contexts\n- ⚡ **Performance Optimized** - Preloading, caching, debouncing, proper cleanup\n- 🛡️ **Error Resilient** - Retry logic, graceful degradation, network failure recovery\n\n## 🎹 Quick Start\n\n```javascript\nimport { SimpleTypeWriter } from './SimpleTypeWriter.js';\n\nconst typewriter = new SimpleTypeWriter({\n  basePath: '/sounds/keyboard-packs/' // Framework-dependent, see below\n});\n\nawait typewriter.init();\ntypewriter.attach('input, textarea');\n```\n\n## 🚀 Framework Integration\n\n### Fresh / Deno\n\n**Step 1**: Copy sound files\n```bash\ncp -r sounds/keyboard-packs static/sounds/\n```\n\n**Step 2**: Import and use\n```javascript\nimport { SimpleTypeWriter } from \"../utils/SimpleTypeWriter.js\";\n\nconst typewriter = new SimpleTypeWriter({\n  basePath: '/sounds/keyboard-packs/'\n});\n\nawait typewriter.init();\ntypewriter.attach('input, textarea');\n```\n\n### Next.js / React\n\n**Step 1**: Copy sound files\n```bash\ncp -r sounds/keyboard-packs public/sounds/\n```\n\n**Step 2**: Import and use\n```javascript\nimport { SimpleTypeWriter } from '@/utils/SimpleTypeWriter';\n\nuseEffect(() =\u003e {\n  const typewriter = new SimpleTypeWriter({\n    basePath: '/sounds/keyboard-packs/'\n  });\n\n  typewriter.init().then(() =\u003e {\n    typewriter.attach('input, textarea');\n  });\n\n  return () =\u003e typewriter.dispose();\n}, []);\n```\n\n### Vite / SvelteKit\n\n**Step 1**: Copy sound files\n```bash\ncp -r sounds/keyboard-packs public/sounds/  # Vite\ncp -r sounds/keyboard-packs static/sounds/  # SvelteKit\n```\n\n**Step 2**: Import and use\n```javascript\nimport { SimpleTypeWriter } from './SimpleTypeWriter';\n\nconst typewriter = new SimpleTypeWriter({\n  basePath: '/sounds/keyboard-packs/'\n});\n\nawait typewriter.init();\ntypewriter.attach('input, textarea');\n```\n\n### Vanilla HTML\n\n**Step 1**: Include the script\n```html\n\u003cscript type=\"module\"\u003e\n  import { SimpleTypeWriter } from './src/SimpleTypeWriter.js';\n\n  const typewriter = new SimpleTypeWriter({\n    basePath: './sounds/keyboard-packs/'\n  });\n\n  await typewriter.init();\n  typewriter.attach('input, textarea');\n\u003c/script\u003e\n```\n\n## 🔧 Configuration Options\n\n```javascript\nconst typewriter = new SimpleTypeWriter({\n  volume: 0.3,                         // Volume (0-1, default: 0.3)\n  enabled: true,                        // Enable/disable sounds (default: true)\n  pack: 'cherry-mx-black',              // Sound pack name (default: 'cherry-mx-black')\n  basePath: '/sounds/keyboard-packs/',  // Where to find sound files\n  debug: false,                         // Enable console logging (default: false)\n  debounceMs: 10,                       // Min ms between sounds (default: 10)\n  retryAttempts: 3,                     // Network retry attempts (default: 3)\n  preloadOnHover: true,                 // Preload when hovering inputs (default: true)\n  cacheBuffers: true                    // Cache decoded audio buffers (default: true)\n});\n```\n\n## 🐛 Debugging Integration Issues\n\nIf sounds aren't loading, use the test helper:\n\n```javascript\nconst typewriter = new SimpleTypeWriter();\nawait typewriter.testConnection(); // Check if files are accessible\n\n// Console output shows:\n// ✅ Success! Found: Cherry MX Black\n// Keys mapped: 88\n// OR\n// ❌ HTTP 404 - Config file not found\n// Expected location: /sounds/keyboard-packs/cherry-mx-black/config.json\n```\n\n## 📁 File Structure\n\nYour project should look like:\n\n**Fresh / Next.js / Vite:**\n```\nyour-project/\n├── static/ (or public/)\n│   └── sounds/\n│       └── keyboard-packs/\n│           └── cherry-mx-black/\n│               ├── config.json (7.4KB)\n│               └── sound.ogg (2.7MB)\n└── utils/\n    └── SimpleTypeWriter.js\n```\n\n**Vanilla HTML:**\n```\nyour-project/\n├── sounds/\n│   └── keyboard-packs/\n│       └── cherry-mx-black/\n│           ├── config.json\n│           └── sound.ogg\n└── src/\n    └── SimpleTypeWriter.js\n```\n\n## 🎛️ API Reference\n\n### Methods\n\n```javascript\n// Initialize and load sounds\nawait typewriter.init();\nawait typewriter.init('cherry-mx-black'); // Load specific pack\n\n// Attach to elements\ntypewriter.attach('input, textarea');     // CSS selector\ntypewriter.attach('#my-input');           // Single element\n\n// Switch sound packs\nawait typewriter.setPack('cherry-mx-black');\n\n// Mobile/Chrome audio context fix\nawait typewriter.resumeAudioContext();    // Call on user interaction\n\n// Debug connection\nawait typewriter.testConnection();        // Returns true/false\n\n// Controls\ntypewriter.enable();                      // Enable sounds\ntypewriter.disable();                     // Disable sounds\ntypewriter.setVolume(0.5);                // Set volume (0-1)\n\n// Cleanup\ntypewriter.detach();                      // Remove from all elements\ntypewriter.dispose();                     // Full cleanup\n```\n\n### Events\n\nSounds play automatically on `keydown` events for attached elements. All 88 keys are mapped including:\n- Letters A-Z\n- Numbers 0-9\n- Space, Enter, Backspace, Tab, Escape\n- Shift, Control, Alt, Command/Windows\n- Punctuation: . , / ; ' [ ]\n\n## 🎨 Available Sound Packs\n\nCurrently included:\n- **cherry-mx-black** - Cherry MX Black mechanical switches (2.7MB)\n\nMore packs coming soon! Contribute your own recordings.\n\n## 📦 Installation\n\n**Manual (Current method)**\n```bash\n# Clone or download this repo\ngit clone https://github.com/pibulus/juicy-sounds.git\n\n# Copy into your project\ncp -r juicy-sounds/sounds/keyboard-packs your-project/static/sounds/\ncp juicy-sounds/src/SimpleTypeWriter.js your-project/utils/\n```\n\n**NPM (Coming Soon)**\n```bash\nnpm install @juicy-sounds/typewriter\n```\n\n## License\n\nMIT - Use it however you want!\n\n---\n\n_Simple tools for juicy interfaces_ 🍊","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpibulus%2Fjuicy-sounds","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpibulus%2Fjuicy-sounds","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpibulus%2Fjuicy-sounds/lists"}