{"id":28417075,"url":"https://github.com/progamergov/html-360-viewer","last_synced_at":"2026-02-23T03:09:46.801Z","repository":{"id":292910775,"uuid":"982328100","full_name":"ProGamerGov/html-360-viewer","owner":"ProGamerGov","description":"A lightweight, browser-based viewer for 360-degree images and videos. No additional setup required, just open the HTML file in any modern browser.","archived":false,"fork":false,"pushed_at":"2025-12-13T20:21:01.000Z","size":1731,"stargazers_count":20,"open_issues_count":0,"forks_count":4,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-01-28T01:09:33.181Z","etag":null,"topics":["360","360-degree","360-image","360-photo","360-video","360-viewer","360vr","equirectangular","html","image-sphere","pano","panorama","photo-sphere-viewer","spherical-photo","viewer","virtual-reality","vr","vr360"],"latest_commit_sha":null,"homepage":"https://progamergov.github.io/html-360-viewer/","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/ProGamerGov.png","metadata":{"files":{"readme":"ReadMe.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":"CITATION.cff","codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-05-12T18:02:56.000Z","updated_at":"2026-01-16T04:45:24.000Z","dependencies_parsed_at":"2025-05-12T19:50:48.952Z","dependency_job_id":"0da3fb5a-c940-4252-97a7-a85e95fc99e3","html_url":"https://github.com/ProGamerGov/html-360-viewer","commit_stats":null,"previous_names":["progamergov/html-360-viewer"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ProGamerGov/html-360-viewer","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProGamerGov%2Fhtml-360-viewer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProGamerGov%2Fhtml-360-viewer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProGamerGov%2Fhtml-360-viewer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProGamerGov%2Fhtml-360-viewer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ProGamerGov","download_url":"https://codeload.github.com/ProGamerGov/html-360-viewer/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ProGamerGov%2Fhtml-360-viewer/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29735994,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-23T02:24:00.660Z","status":"ssl_error","status_checked_at":"2026-02-23T02:22:56.087Z","response_time":90,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6: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":["360","360-degree","360-image","360-photo","360-video","360-viewer","360vr","equirectangular","html","image-sphere","pano","panorama","photo-sphere-viewer","spherical-photo","viewer","virtual-reality","vr","vr360"],"created_at":"2025-06-04T02:45:35.896Z","updated_at":"2026-02-23T03:09:46.793Z","avatar_url":"https://github.com/ProGamerGov.png","language":"HTML","readme":"# 360° Image \u0026 Video Viewer\n\nA lightweight, browser-based viewer for 360-degree images and videos. No additional setup required, just open the HTML file in any modern browser.\n\n\n\u003cdiv align=\"left\"\u003e\n \u003cimg src=\"examples/example_image.png\" width=\"710px\"\u003e\n\u003c/div\u003e\n\nTry it out here: https://progamergov.github.io/html-360-viewer\n\nSupports:\n\n* 360° panoramic **images**, most formats supported by browsers, like [JPEG](https://en.wikipedia.org/wiki/JPEG) (includes '.jpg'), [PNG](https://en.wikipedia.org/wiki/PNG), [WebP](https://en.wikipedia.org/wiki/WebP), etc.\n* 360° **videos** in [.mp4](https://en.wikipedia.org/wiki/MP4_file_format) and [.webm](https://en.wikipedia.org/wiki/WebM) format. Works as a 360 video player.\n* Monoscopic 360 images and stereo images in **top-bottom** and **left-right** layouts\n\n\n## 🧪 Compatibility\n\nWorks on all major web browsers that [A-Frame](https://aframe.io/docs/1.7.0/introduction/faq.html) supports.\n\n* [Firefox](https://en.wikipedia.org/wiki/Firefox)\n* [Chrome](https://en.wikipedia.org/wiki/Google_Chrome) (including Chromium based browsers like [Brave](https://en.wikipedia.org/wiki/Brave_(web_browser)) \u0026 [Opera](https://en.wikipedia.org/wiki/Opera_(web_browser)))\n* [Microsoft Edge](https://en.wikipedia.org/wiki/Microsoft_Edge)\n* [Safari](https://www.apple.com/ca/safari/)\n\nWorks on [all VR headsets supported by A-Frame](https://aframe.io/docs/1.7.0/introduction/vr-headsets-and-webxr-browsers.html).\n\n* [Meta Quest](https://en.wikipedia.org/wiki/Meta_Quest) (all versions)\n* [Valve Index](https://en.wikipedia.org/wiki/Valve_Index)\n* [HTC Vive](https://en.wikipedia.org/wiki/HTC_Vive)\n* [Vive Focus](https://en.wikipedia.org/wiki/HTC_Vive)\n* [Apple Vision Pro](https://en.wikipedia.org/wiki/Apple_Vision_Pro)\n* [Oculus Go](https://en.wikipedia.org/wiki/Oculus_Go)\n* [Oculus Rift](https://en.wikipedia.org/wiki/Oculus_Rift)\n\n## 🚀 Features\n\n* **Drag \u0026 Drop** support for instant media viewing\n* **Stereo toggle** switch between monoscopic and stereo images (mono/top-bottom/side-by-side)\n* **Zooming** via mouse wheel or pinch gesture\n* **Interactive panning** with mouse or touch\n* **Fullscreen** mode via the bottom right button. Opens in VR headset if supported.\n* **Screenshot** functionality (UI hidden in capture)\n* **Video controls**: play/pause, timeline slider\n\n\n## 📦 Getting Started\n\n**Option 1 – Local Use**\n\n1. Download or clone this repository.\n2. Open `viewer360.html` in your browser.\n3. Drag and drop a supported 360° image or video file, or click \"Select Media\" to browse.\n\n**Option 2 – Web Demo**\n\n1. Visit the [live demo](https://progamergov.github.io/html-360-viewer) in your browser.\n2. Upload a 360° image or video to start viewing.\n\n**Option 3 – Local Copy**\n\n1. Copy the full contents of `viewer360.html` into a new text file.\n2. Rename the file to something like `viewer360.html` (make sure it ends in `.html`).\n3. Open it in your browser.\n\n\n## 🕹️ Controls\n\n| Action             | How to Use                                   |\n| ------------------ | -------------------------------------------- |\n| Pan View           | Left-click + drag or touch + drag            |\n| Zoom               | Mouse wheel or pinch gesture                 |\n| Fullscreen         | Browser fullscreen and VR headset control    |\n| Stereo Toggle      | Bottom-left \"Stereo\" button                  |\n| Screenshot         | Camera icon at bottom center                 |\n| Upload/Reset Media | \"Upload\" button below controls               |\n| Play/Pause Video   | Play/pause button on video controls          |\n| Seek in Video      | Use the timeline slider                      |\n\n\n## 🤝 Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n\n\n## 🔬 Citation\n\nIf you use this library in your research or project, please refer to the included [CITATION.cff](CITATION.cff) file or cite it as follows:\n\n### BibTeX\n```bibtex\n@misc{egan2025html360viewer,\n  title={Browser-Based Viewer for 360 Images and Videos},\n  author={Egan, Ben},\n  year={2025},\n  publisher={GitHub},\n  howpublished={\\url{https://github.com/ProGamerGov/html-360-viewer}}\n}\n```\n\n### APA Style\n```\nEgan, B. (2025). Browser-Based Viewer for 360 Images and Videos [Computer software]. GitHub. https://github.com/ProGamerGov/html-360-viewer\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprogamergov%2Fhtml-360-viewer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fprogamergov%2Fhtml-360-viewer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprogamergov%2Fhtml-360-viewer/lists"}