8 Commits

Author SHA1 Message Date
cottongin
ffc8f2a558 add version info 2026-01-17 19:09:53 -05:00
cottongin
5223c9697f tweak README 2026-01-17 18:45:02 -05:00
cottongin
fdc96965f3 add README 2026-01-17 18:42:03 -05:00
cottongin
c24e6f1344 code refactor, cleanup 2026-01-17 18:26:36 -05:00
cottongin
3aa5c6ad44 add cursor folder to .gitignore 2026-01-17 17:42:56 -05:00
cottongin
ce98b75c54 tweak reel sizes, fix end-of-tape procedure 2026-01-17 17:36:51 -05:00
cottongin
62eba51514 added display FX, moved IDEAS for future reference 2026-01-17 15:12:54 -05:00
cottongin
c10cd26e1d initial ideas 2026-01-17 14:18:25 -05:00
6 changed files with 2970 additions and 2268 deletions

4
.gitignore vendored
View File

@@ -1,2 +1,4 @@
.DS_Store
.old/
.old/
.cursor/
tag-release.sh

20
README.md Normal file
View File

@@ -0,0 +1,20 @@
# Cassette Player
Simple HTML/JS/CSS Cassette Player
## Instructions for hosting
1. Clone or download this repository.
- if downloading as a zip file, extract to a temporary folder
2. Copy or move the relevant files to the location you want to host them from. **Keep all files together in the same location/folder**.
- `index.html` - main HTML file
- `app.js` - main app JavaScript file
- `styles.css` - app styling CSS file
- `background.png` - image for player background
3. Navigate to `http://<yourhost.com>/path/to/where/you/saved/index.html` in your browser.
### Alternatively, if just previewing
1. Unzip to a temporary folder.
2. Open `index.html` in your browser. (`ctrl/cmd+o`, drag and drop, etc.)
a. or navigate to the file manually in your address bar (e.g. `file:///Users/username/tempfolder/cassette-player/index.html`)

1397
app.js Normal file

File diff suppressed because it is too large Load Diff

94
archive/IDEAS.md Normal file
View File

@@ -0,0 +1,94 @@
Let me take a look at what's currently in the project to understand the existing features and theme better.
[1 tool called]
This is a really well-crafted project with a lot of nice details already. Let me put together some ideas for easter eggs and tweaks that would fit the retro dystopian/broken cassette player theme.
Based on what I see in the code, you already have:
- CRT scanlines and flicker effects
- Cracked display overlay
- Worn/faded button icons
- Damage texture overlay
- Tape wind sound effects
- Bouncing track name marquee
Here are some ideas that would complement the existing aesthetic:
---
## Visual Glitch / Distortion Effects
1. **Random screen glitches** - Occasional RGB channel separation or horizontal displacement that happens randomly or when interacting with controls (like the display is malfunctioning)
2. **Dead pixels** - A few permanently "stuck" green pixels on the CRT display
3. **Screen burn-in** - Faint ghost image of "PLAY" or old track names that lingers on the display
4. **Intermittent display failure** - Rare chance of the display going dark for a split second then flickering back on
5. **VHS tracking lines** - Occasional horizontal noise bars that scroll up the display
---
## Audio Quirks
6. **Tape flutter/wow** - Subtle pitch wobble effect using Web Audio API's `playbackRate` with slight random variations, like a worn tape mechanism
7. **Random audio dropouts** - Very brief moments where audio cuts out or gets muffled (like dirty tape heads)
8. **Static between tracks** - White noise/hiss during track transitions
9. **"Tape eating" event** - Rare chance when pressing play/stop that triggers a tape-eating sound effect and animation where the tape visually tangles
---
## Hidden Interactions
10. **Konami code** - Entering the classic code unlocks a secret mode (different color scheme, hidden track, or "repaired" mode where everything works perfectly)
11. **Thump to fix** - Double-clicking/tapping the cassette housing "thumps" the player, which could temporarily fix glitches or cause new ones
12. **Secret button combo** - Holding certain buttons together reveals hidden content or debug info
13. **Dust accumulation** - Animated dust particles that slowly build up on the display, clickable to "wipe clean"
---
## Dystopian Theme Additions
14. **Redacted track names** - Occasional text that appears with black boxes like "[REDACTED]" or "TRACK ██ - ████████"
15. **Surveillance indicator** - Small red "REC" light in the corner that occasionally blinks, or a subtle camera icon
16. **Propaganda interruptions** - Random brief messages that flash on screen like "COMPLIANCE IS FREEDOM" or "REPORT SUSPICIOUS ACTIVITY"
17. **Emergency broadcast** - Rare event where audio cuts to an emergency alert tone with scrolling text
18. **Signal interference** - Brief moments where the display shows "NO SIGNAL" or "WEAK SIGNAL"
---
## Time-Based Behaviors
19. **Midnight mode** - Different behavior or color scheme between certain hours (dimmer, more glitchy, or eerier)
20. **Battery drain simulation** - After extended use, everything gradually slows down and gets distorted until "recharged" (refreshing the page)
---
## Fun Visual Additions
21. **Tape label graffiti/stickers** - Small worn stickers or handwritten notes on the cassette
22. **Cigarette burn marks** - Subtle burn marks on the player casing
23. **Fingerprint smudges** - Subtle smudges on the tape window or display
24. **"Property of..." label** - A worn/scratched identification label with mysterious text
---
Would you like me to create a plan to implement some of these? If so, which ones appeal to you most? I can group them into:
- **Quick wins** (CSS-only or simple JS)
- **Medium effort** (Web Audio effects, animations)
- **Larger features** (Konami code, emergency broadcast system)

2296
index.html

File diff suppressed because it is too large Load Diff

1427
styles.css Normal file

File diff suppressed because it is too large Load Diff