{"id":22724536,"url":"https://github.com/binghuan/photobooth","last_synced_at":"2026-04-20T09:32:41.695Z","repository":{"id":25764210,"uuid":"29202368","full_name":"binghuan/photobooth","owner":"binghuan","description":null,"archived":false,"fork":false,"pushed_at":"2025-07-31T10:55:58.000Z","size":2592,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"gh-pages","last_synced_at":"2025-07-31T14:22:45.849Z","etag":null,"topics":["javascript","lbs","webapp"],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/binghuan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-01-13T17:38:16.000Z","updated_at":"2025-07-31T10:56:01.000Z","dependencies_parsed_at":"2022-08-24T14:14:07.601Z","dependency_job_id":null,"html_url":"https://github.com/binghuan/photobooth","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/binghuan/photobooth","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/binghuan%2Fphotobooth","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/binghuan%2Fphotobooth/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/binghuan%2Fphotobooth/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/binghuan%2Fphotobooth/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/binghuan","download_url":"https://codeload.github.com/binghuan/photobooth/tar.gz/refs/heads/gh-pages","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/binghuan%2Fphotobooth/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32041340,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-20T00:18:06.643Z","status":"online","status_checked_at":"2026-04-20T02:00:06.527Z","response_time":94,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["javascript","lbs","webapp"],"created_at":"2024-12-10T15:07:02.073Z","updated_at":"2026-04-20T09:32:41.688Z","avatar_url":"https://github.com/binghuan.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# Photo Booth Finder\n\n\u003cimg src=\"Icon.png\" width=\"auto\" height=\"240px\"\u003e\n\nA location-based web application to help users find nearby photo booths in Taiwan. The app uses geolocation to calculate distances and provides a searchable list of photo booth locations with their operating hours and addresses.\n\n## 🌐 Live Demo\n\nLaunch the web app: \u003ca href=\"http://binghuan.github.io/photobooth/\"\u003ehttp://binghuan.github.io/photobooth/\u003c/a\u003e\n\nBlog post: \u003ca href=\"http://studiobinghuan.blogspot.tw/2015/01/photo-booth-finder.html?view=flipcard\"\u003eRead more about this project\u003c/a\u003e\n\n## 🚀 Features\n\n- **Geolocation-based search**: Automatically finds your current location and calculates distances to nearby photo booths\n- **Real-time filtering**: Search functionality to filter photo booth locations by name or address\n- **Distance calculation**: Shows distance from your current location to each photo booth in meters\n- **Operating hours**: Displays opening and closing times for each location\n- **Interactive maps**: Click on addresses to open Google Maps for navigation\n- **Mobile-responsive**: Optimized for mobile devices with touch-friendly interface\n- **Material Design**: Built with Angular Material for a modern, clean UI\n\n## 🛠️ Technology Stack\n\n- **Frontend Framework**: AngularJS (v1.x)\n- **UI Framework**: Angular Material Design\n- **Styling**: CSS3 with Material Design components\n- **Geolocation**: HTML5 Geolocation API\n- **Maps Integration**: Google Maps\n- **Dependencies**:\n  - Angular Animate\n  - Angular Aria\n  - HammerJS (for touch gestures)\n\n## 📱 Mobile Features\n\n- Apple mobile web app capable\n- Custom app icons for iOS devices\n- Responsive design for various screen sizes\n- Touch-friendly interface with Material Design components\n\n## 🗺️ Data\n\nThe application includes a comprehensive database of photo booth locations across Taiwan, including:\n- Location names and descriptions\n- Complete addresses\n- Operating hours\n- GPS coordinates (latitude and longitude)\n- Special notes and accessibility information\n\n## 🔧 Project Structure\n\n```\nphotobooth/\n├── index.html                 # Main HTML file\n├── components/               # Third-party libraries\n│   ├── angular/             # AngularJS framework\n│   ├── angular-material/    # Material Design components\n│   ├── angular-animate/     # Animation support\n│   ├── angular-aria/        # Accessibility features\n│   └── hammerjs/           # Touch gesture library\n├── javascripts/\n│   ├── selfiestatiion.js           # Main application logic\n│   └── selfiestatiionJsonData.js   # Photo booth location data\n├── stylesheets/\n│   └── style.css           # Custom styles\n├── icons/                  # App icons for various devices\n└── images/                # Application images\n```\n\n## 🚀 Setup and Installation\n\n### Prerequisites\n- Node.js and npm (for development)\n- Web server (for serving static files)\n\n### Local Development\n\n1. **Clone the repository**\n   ```bash\n   git clone https://github.com/binghuan/photobooth.git\n   cd photobooth\n   ```\n\n2. **Install dependencies** (if using build tools)\n   ```bash\n   npm install\n   ```\n\n3. **Build the project** (if webpack is configured)\n   ```bash\n   webpack\n   ```\n\n4. **Serve the application**\n   \n   Option 1: Using a simple HTTP server\n   ```bash\n   python -m http.server 8000\n   # or\n   python3 -m http.server 8000\n   ```\n   \n   Option 2: Using Node.js http-server\n   ```bash\n   npx http-server\n   ```\n   \n   Option 3: Using VS Code Live Server extension\n\n5. **Open in browser**\n   Navigate to `http://localhost:8000` (or the port shown by your server)\n\n### Deployment\n\nThe app is designed to be deployed as a static website. It's currently hosted on GitHub Pages at the `gh-pages` branch.\n\n## 🌍 Browser Compatibility\n\n- Modern browsers with HTML5 geolocation support\n- Mobile browsers (iOS Safari, Chrome Mobile, etc.)\n- Desktop browsers (Chrome, Firefox, Safari, Edge)\n\n## 📍 How It Works\n\n1. **Location Detection**: The app requests permission to access your location using HTML5 geolocation API\n2. **Distance Calculation**: Calculates the distance from your location to each photo booth using the Haversine formula\n3. **Sorting \u0026 Display**: Photo booths are sorted by distance and displayed in a Material Design list\n4. **Search \u0026 Filter**: Users can search for specific locations using the search box\n5. **Navigation**: Clicking on an address opens Google Maps for turn-by-turn navigation\n\n## 🎨 Design Features\n\n- Clean, minimalist Material Design interface\n- Loading animations while fetching geolocation\n- Responsive layout that works on all device sizes\n- Touch-friendly buttons and interactions\n- Color-coded distance indicators\n\n## 🤝 Contributing\n\nContributions are welcome! If you'd like to add more photo booth locations or improve the application:\n\n1. Fork the repository\n2. Create a feature branch (`git checkout -b feature/new-locations`)\n3. Add your changes to `javascripts/selfiestatiionJsonData.js` for new locations\n4. Commit your changes (`git commit -am 'Add new photo booth locations'`)\n5. Push to the branch (`git push origin feature/new-locations`)\n6. Create a Pull Request\n\n### Adding New Locations\n\nTo add new photo booth locations, add entries to the `importedDataArray` in `selfiestatiionJsonData.js`:\n\n```javascript\n{\n  \"location\": \"Location Name\",\n  \"opentime\": \"08:00~22:00\",\n  \"address\": \"Complete address\",\n  \"latitude\": \"25.0000000\",\n  \"longitude\": \"121.0000000\"\n}\n```\n\n## 🐛 Known Issues\n\n- Geolocation may not work on some older browsers\n- Distance calculation assumes straight-line distance, not walking/driving distance\n- Some photo booth locations may have outdated operating hours\n\n## 🔮 Future Enhancements\n\n- Real-time availability status\n- User reviews and ratings\n- Photo booth type categories (color, black \u0026 white, etc.)\n- Walking directions integration\n- Offline support with service workers\n\n## 👨‍💻 Author\n\n**Bing-Huan Lin**\n- Blog: [Studio Bing-Huan](http://studiobinghuan.blogspot.tw/)\n- GitHub: [@binghuan](https://github.com/binghuan)\n\n---\n\n*Built with ❤️ using AngularJS and Material Design*\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbinghuan%2Fphotobooth","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbinghuan%2Fphotobooth","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbinghuan%2Fphotobooth/lists"}