Merge pull request #175 from bitmovin/feature/fix-tv-samples

Fix tv samples

.gitignore

@@ -4,3 +4,12 @@ node_modules
 **/*.DS_Store
 *.DS_Store
 .vscode
+**/bitmovin-player-yospace.js
+tizen/*.wgt
+WebOS/*.ipk
+tizen/index.html
+tizen/js/*.js
+WebOS/index.html
+WebOS/js/*.js
+generic-tv/index.html
+generic-tv/js/*.js

README.md

@@ -112,7 +112,7 @@ const bitmovinYospacePlayer = new BitmovinYospacePlayer(Player, playerContainer,
 tweaks: {
  ...
  file_protocol : true, // Required if app is being loaded from file system
- app_id : "Ff4zhu5kqV.TizenBitmovinPlayerAppMode" // this Tizen App Id should also be allow-listed in Player License and optionally, Analytics License
+ app_id : "Ff4zhu5kqV.TizenBitmovinPlayerAppMode" // This should be your Tizen App Id which needs to be allow-listed in Player License and optionally, Analytics License
 }
 ```
 
@@ -132,7 +132,39 @@ const yospaceConfig = {
 #### Tizen Demo
 
 - Run `npm run build-tv`
-- Import the Tizen folder(as General -> Existing Project) into your Tizen Studio and run as a Tizen Web Application
+- Import the `tizen` folder (as General -> Existing Project) into Tizen Studio and run as a Tizen Web Application, or open the folder in Visual Studio Code with the tizen-tv extension.
+
+### WebOS
+
+#### WebOS Config
+
+- Include the following Tweaks to the PlayerConfig:
+
+```
+tweaks: {
+ ...
+ file_protocol : true, // Required if app is being loaded from file system
+ app_id : "com.bitmovin.yospace.demo" // This should be your WebOS App Id which needs to be allow-listed in Player License and optionally, Analytics License
+}
+```
+
+- Make sure the app_id is allow-listed in your Player's License
+- In the `YospaceConfig` set the param `YospaceConfig.disableServiceWorker` to `true`
+- In the `YospaceConfig` set the param `YospaceConfig.useWebos` to `true`
+
+```ts
+// Yospace configuration
+const yospaceConfig = {
+ ...
+ disableServiceWorker: true, // Disable Service Worker for Tizen Web App use
+ useTizen: true,
+};
+```
+
+#### Tizen Demo
+
+- Run `npm run build-tv`
+- Open the `WebOS` folder in Visual Studio Code with the WebOS TV extension, or use the WebOS CLI directly.
 
 ## Limitations
 

WebOS/README.md

@@ -1,30 +1,18 @@
-# bitmovin-player-webos-demo
+# Bitmovin Player Yospace Integration WebOS Sample
 
-This repository contains a sample app that used the Bitmovin HTML5 Player (version 8) on LG webOS
+This folder contains a sample for how to use the Bitmovin Player Yospace Integration library in LG WebOS TV apps.
 
-### Using the Sample App with webOS IDE
+## Getting started
 
-1. Download [webOS IDE](http://webostv.developer.lge.com/sdk/download/download-sdk/)
-2. Open the sample app with webOS IDE
-3. Connect your TV Device. This [tutorial](http://webostv.developer.lge.com/develop/app-test/) is a good reference
-4. Input your player key into `src/main.js`
-5. Run/debug the sample app. If you debug, you will see Chrome developer tools launch. This will enable you to debug, monitor network requests, and execute commands through the javascript console.
+Run `npm run build-tv` (or `npm run build-tv:dev`) in the project root to build the library and copy all required files, including the sample web page and Javascript files, to the correct location in this folder.
 
-### Using the Sample App with webOS CLI
+Open this `WebOS` folder in Visual Studio Code with the `webOS TV` extension to create a package and launch on the TV as usual.
 
-1. Install dependencies with `npm install`
-2. Activate developer mode on your TV device and use passphrase to run `npm run connect <ip|host> <passphrase>`
-3. Input your player key into `src/main.js`
-4. Build the `ipk` package running `npm run build`
-5. Install the app to your device `DEVICE=<ip|host> npm run push`
-6. You can debug the app with remote debugger with `DEVICE=<ip|host> npm run debug`
-
-- note: If you are having problem with permissions for ares CLI try `chmod +x node_modules/ares-webos-sdk/bin/*`
-- tip: If continuous running of `DEVICE=<ip|host> npm run debug` does not work you first need to kill the app by running `DEVICE=<ip|host> npm run stop` and then run debug again.
+Please note that changes in the `WebOS/index.html` and `WebOS/js/*` files will be overwritten by the build tooling, changes should be made in the [../web/](../web/) folder only.
 
 ### Notes for developing your own app
 
-Make sure to enable `file_protocol` and set your `app_id` in the `tweaks` section of your config
+Make sure to enable `file_protocol` and set your `app_id` in the `tweaks` section of your config. The `app_id` should be your `app_id`.
 
 ```
 var conf = {
@@ -41,9 +29,3 @@ var conf = {
  }
 };
 ```
-
-### Additional Documentation
-
-Complete API documentation is available at https://developer.bitmovin.com/hc/en-us
-
-Other demo applications https://bitmovin.com/demo/

WebOS/appinfo.json

@@ -1,6 +1,6 @@
 {
  "vendor": "Bitmovin",
- "icon": "src/images/bitmovin-icon-small.png",
+ "icon": "images/bitmovin-icon-small.png",
  "main": "index.html",
  "id": "com.bitmovin.bitmovinyospaceplayer",
  "title": "Application",