feat: add Live IP Cameras panel with region filtering and snapshot refresh#1734
feat: add Live IP Cameras panel with region filtering and snapshot refresh#1734anonymmaro-alt wants to merge 1 commit intokoala73:mainfrom
Conversation
…fresh Adds a new panel displaying public IP camera JPEG snapshots (traffic/city cams) organised by region (Americas, Europe, Asia, Middle East, Africa). Features a 3×2 grid and single-cam view, 6-second auto-refresh with cache busting, offline detection with retry, and IntersectionObserver-based pause when off-screen. Prefs persisted to localStorage. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
|
@anonymmaro-alt is attempting to deploy a commit to the Elie Team on Vercel. A member of the Team first needs to authorize it. |
|
This PR is still draft, do you want me to review it ? @anonymmaro-alt |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 4357b7fe11
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| expandBtn.addEventListener('click', (e) => { | ||
| e.stopPropagation(); | ||
| this.activeCam = cam; | ||
| this.setViewMode('single'); | ||
| }); |
There was a problem hiding this comment.
On screens <= 768px, our shared webcam CSS hides every .webcam-view-btn (src/styles/main.css:2878-2890). Unlike LiveWebcamsPanel, this component never forces single view on mobile and renderGrid() only wires click on the hover-only expand button, not on the cell itself. In the default viewMode: 'grid', phone users are therefore stuck in the grid with no visible way to open an individual camera.
Useful? React with 👍 / 👎.
| private get gridCams(): IpCamera[] { | ||
| return this.filteredCams.slice(0, MAX_GRID_CELLS); |
There was a problem hiding this comment.
When the region filter is all, filteredCams returns IP_CAMERAS in declaration order and gridCams immediately slices the first six. Because the list starts with four Norway cameras and two Slovenia cameras, the default “ALL” view never shows Americas, Asia, Middle East, or Africa feeds at all. LiveWebcamsPanel avoids the same issue with an explicit cross-region ALL_GRID_IDS, so this new panel currently looks Europe-only until the user drills into single view.
Useful? React with 👍 / 👎.
koala73
left a comment
koala73
left a comment
There was a problem hiding this comment.
Hey @anonymmaro-alt — great concept and clean implementation overall. Three blocking issues before this can merge:
1. Several camera URLs appear to be fabricated
The following endpoints don't match real public APIs for their stated sources — they'll show as offline immediately on deploy:
- South Korea (
kr-seoul-gwl):https://its.go.kr/readFile?fileId=camera_highway_001— ITS Korea uses a session-gated API, not a publicreadFile?fileId=endpoint - Israel (
il-tel-aviv-ayalon):https://media.waze.com/NDS2/camera?id=TLV_AYL_001— Waze has no public camera API at this path - South Africa (
za-johannesburg-n1,za-cape-town-n2):myroads.co.zais not SANRAL's official domain and has no public CCTV feed - Japan (
jp-tokyo-c2):trafficinfo.westjr.co.jpis a West Japan Railway passenger info site, not a traffic cam provider
Please replace with verified, browser-tested URLs — or drop those cameras for now. The Norway/Slovenia/CDOT/MTQ/Taiwan URLs look plausible but worth a quick browser check too.
2. closable: false — users cannot dismiss this panel
super({ id: 'live-ip-cameras', ..., closable: false });Every other panel is closable. With priority: 1 in the FULL variant and placement in the core category, this will appear by default for all users with no way to hide it. Please remove closable: false.
3. Missing common.retry i18n key
escapeHtml(t('common.retry') || 'Retry')common.retry is not added to en.json in this PR. If t() returns an empty string (rather than undefined), the || 'Retry' fallback won't fire and the retry button will be blank. Please add "retry": "Retry" under "common" in en.json.
koala73
added
the
Not Ready to Merge
2 participants
Summary
Changes
src/components/LiveIpCamerasPanel.ts— new panel componentsrc/config/panels.ts— registered in all variants + core categorysrc/app/panel-layout.ts— instantiated afterlive-webcamssrc/locales/en.json— i18n keyssrc/styles/main.css— panel-specific CSSTest plan
npm run devand verify the Live IP Cameras panel appears in the dashboardnpm run typecheckpasses with zero errors🤖 Generated with Claude Code