3.9 KiB
Deploy Admin Panel with Upload Feature
Quick guide to deploy the enhanced admin panel with manual upload capability.
What Changed
✅ Admin Panel: Added drag-and-drop video upload ✅ Empty State: Improved UI when no videos exist ✅ Upload API: New endpoint for browser-based uploads ✅ Progress Tracking: Real-time upload progress bars
Prerequisites
- ✅ Worker already deployed
- ✅ KV namespace created (VIDEO_METADATA)
- ✅ Admin password set
- ✅ Wrangler CLI authenticated
If you haven't set these up yet, run:
./scripts/setup-admin.sh
Deploy Steps
1. Build the Enhanced Worker
cd /home/jeffe/Github/obs-r2-uploader
python3 scripts/build-worker.py
This embeds the updated admin.html with upload features into the worker.
2. Verify Configuration
Make sure worker/wrangler.toml has:
[[kv_namespaces]]
binding = "VIDEO_METADATA"
id = "your_kv_namespace_id" # Should already be set
[[r2_buckets]]
binding = "R2_BUCKET"
bucket_name = "obs-videos"
3. Deploy to Cloudflare
cd worker
wrangler deploy
Expected output:
Published obs-video-server (X.XX sec)
https://videos.jeffemmett.com
4. Test the Upload Feature
- Visit:
https://videos.jeffemmett.com/admin - Login with your admin password
- Look for the green 📤 Upload Video button in the header
- Click it and try uploading a video
5. Test Empty State (Optional)
If you have no videos yet:
- The admin panel should show a nice empty state
- With the message "No videos yet"
- And an upload button
Verification Checklist
- Admin panel loads without errors
- Upload button visible in header
- Can open upload modal
- Can drag-and-drop video files
- Can click to browse files
- Upload progress bar shows
- Video appears in list after upload
- Can set visibility after upload
- Empty state shows when no videos (if applicable)
Rollback (If Needed)
If something goes wrong, you can rollback:
cd worker
git checkout HEAD~1 video-server.js
wrangler deploy
Or redeploy the previous version:
wrangler rollback
Troubleshooting
Upload button not showing
# Clear browser cache
# Hard refresh: Ctrl+Shift+R (Windows/Linux) or Cmd+Shift+R (Mac)
# Or try incognito mode
Upload fails with 404
Check that the upload endpoint exists:
# In worker/video-server.js, search for:
# path === '/admin/api/upload'
Should be present in the deployed worker.
"Not found" error
Make sure you built the worker first:
python3 scripts/build-worker.py
Then deploy again.
KV namespace errors
Verify KV namespace:
wrangler kv:namespace list
Update wrangler.toml with correct ID if needed.
Quick Deploy Command
One-liner to rebuild and deploy:
python3 scripts/build-worker.py && cd worker && wrangler deploy && cd ..
What to Expect
Before Deployment
- No upload button in admin
- Empty state just says "No videos found"
- Can only upload via command line
After Deployment
- Green upload button in admin header
- Nice empty state with icon and message
- Can drag-and-drop videos
- Real-time upload progress
- Automatic list refresh after upload
Next Steps
After successful deployment:
- Test Upload: Upload a test video via admin panel
- Set Visibility: Try changing video visibility settings
- Share Videos: Copy shareable links
- Create Clips: Test the clip generation feature
- Read Docs: Check UPLOAD_FEATURE.md for full details
Support
Having issues? Check:
- ADMIN.md - Admin panel documentation
- UPLOAD_FEATURE.md - Upload feature details
- SETUP.md - Initial setup guide
Or check worker logs:
wrangler tail
Deployment Version: 1.1 Last Updated: 2024-11-22