# Trip App for LG WebOS TV

A bus tracking and information display application for LG WebOS TV, ported from Android TV.

## Features

- **Real-time Bus Tracking**: Shows active trips and stop information
- **Video Content**: Plays welcome videos, advertisements, and music videos
- **Audio Announcements**: Plays MP3 files for stop announcements
- **API Integration**: Fetches data from bus tracking API
- **TV-Optimized UI**: Landscape orientation with video player and route list
- **WebOS Integration**: Native WebOS TV services and remote control support

## Project Structure

```
webos-trip-app/
├── appinfo.json          # WebOS app configuration
├── index.html            # Main HTML file
├── css/
│   └── style.css         # Main stylesheet
├── js/
│   ├── app.js            # Main application controller
│   ├── api-manager.js    # API communication
│   ├── video-manager.js  # Video playback management
│   ├── audio-manager.js  # Audio announcement handling
│   ├── ui-manager.js     # UI updates and interactions
│   └── webOSTV.js        # WebOS TV service integration
├── assets/
│   ├── videos/           # Video files (welcome, ads, music)
│   └── audio/            # Audio announcement files
├── package.json          # Node.js dependencies
└── README.md             # This file
```

## Setup and Development

### Prerequisites

1. **LG WebOS TV SDK**: Download from [LG Developer](https://webostv.developer.lge.com/)
2. **Node.js**: Version 14 or higher
3. **LG WebOS TV**: For testing (or use emulator)

### Installation

1. **Clone or download the project**:
   ```bash
   cd webos-trip-app
   ```

2. **Install dependencies**:
   ```bash
   npm install
   ```

3. **Start development server**:
   ```bash
   npm start
   ```

4. **Open in browser**:
   - Navigate to `http://localhost:8080`
   - The app will run in your browser for testing

### WebOS TV Deployment

1. **Enable Developer Mode** on your LG WebOS TV:
   - Install "Developer Mode" app from LG Content Store
   - Connect to your developer account
   - Enable Developer Mode

2. **Package the app**:
   ```bash
   # Create IPK package (requires WebOS SDK)
   ares-package webos-trip-app
   ```

3. **Install on TV**:
   ```bash
   # Install via WebOS SDK
   ares-install com.android.trip.webos_1.0.0_all.ipk
   ```

## Configuration

### API Configuration

The app connects to the bus tracking API. Update the API configuration in `js/api-manager.js`:

```javascript
this.baseUrl = 'https://kl.busz.in/api/where';
this.apiKey = '9c41db6e-f97a-4e00-8732-c820ac25bc8b';
```

### App Configuration

Update `appinfo.json` with your app details:

```json
{
  "id": "com.android.trip.webos",
  "vendor": "Your Company",
  "title": "Trip App"
}
```

## Usage

1. **Login**: Enter your Block ID and optional Ad Link
2. **Automatic Updates**: The app fetches trip data every 5 seconds
3. **Video Playback**: Plays welcome videos, ads, and music videos in sequence
4. **Audio Announcements**: Plays stop announcements when approaching stops
5. **Route Display**: Shows upcoming stops with departure times

## TV Remote Navigation

- **Arrow Keys**: Navigate between UI elements
- **Enter/OK**: Select/activate focused element
- **Back**: Go back or close modals
- **Home**: Return to TV home screen
- **Menu**: Access app menu (if implemented)

## File Structure Details

### Core Files

- **`app.js`**: Main application controller, handles initialization and app flow
- **`api-manager.js`**: Manages all API communications with retry logic
- **`video-manager.js`**: Handles video playback cycle and ad caching
- **`audio-manager.js`**: Manages MP3 announcements with fallback support
- **`ui-manager.js`**: Updates UI elements and handles user interactions
- **`webOSTV.js`**: WebOS TV service integration and remote control

### Assets

Place your media files in the `assets/` directory:

- **`assets/videos/`**: Welcome videos, ads, and music videos
- **`assets/audio/`**: MP3 files for stop announcements

## API Endpoints

The app uses the following API endpoints:

- **Active Trip**: `GET /trip-for-vehicle/{blockId}.json`
- **Trip Details**: `GET /trip-details/{tripId}.json`
- **Stop Info**: `GET /stop/{stopId}.json`
- **Route Info**: `GET /route/{routeId}.json`

## Troubleshooting

### Common Issues

1. **Video not playing**: Check video file paths and formats
2. **Audio not working**: Verify MP3 files exist and are accessible
3. **API errors**: Check network connectivity and API key
4. **TV remote not working**: Ensure WebOS TV service is properly initialized

### Debug Mode

Enable debug logging by opening browser console (F12) to see detailed logs.

## Development in Cursor

This project is designed to work seamlessly in Cursor:

1. **Open the project** in Cursor
2. **Install dependencies**: Run `npm install` in terminal
3. **Start development server**: Run `npm start`
4. **Edit files**: Use Cursor's features for development
5. **Test in browser**: Open `http://localhost:8080`

## Differences from Android Version

- **Platform**: WebOS instead of Android
- **Language**: JavaScript instead of Java
- **UI Framework**: HTML/CSS instead of Android XML
- **Media Player**: HTML5 Video/Audio instead of ExoPlayer
- **Storage**: localStorage instead of SharedPreferences
- **Services**: WebOS TV services instead of Android services

## Contributing

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Test on WebOS TV
5. Submit a pull request

## License

MIT License - see LICENSE file for details.

## Support

For issues and questions:
- Check the troubleshooting section
- Review WebOS TV documentation
- Contact the development team
