141 lines
4.3 KiB
Markdown
141 lines
4.3 KiB
Markdown
# js-player
|
|
|
|
Вся разработка ведется в докер контейнере.
|
|
Все зависимости хранятся исключительно в нем.
|
|
Для сборки контейнера необходимо выполнить
|
|
|
|
предварительно в Docker файле надо активировать нужную строчку начального образа.
|
|
|
|
```
|
|
docker build -t voka-player .
|
|
```
|
|
|
|
Обязательно перед запуском докера создать директорию `node_modules`!
|
|
Ни в коем случае не вносить в нее какие-либо изменения.
|
|
Директория реплицируется на хост машину для удобства.
|
|
|
|
Далее требуется запустить докер композ.
|
|
|
|
```
|
|
docker-compose up -d
|
|
```
|
|
|
|
Можно запустить докер вручную:
|
|
```
|
|
docker run -p 8080:8080 -v $PWD:/usr/voka -v /usr/voka/node_modules voka-player
|
|
```
|
|
|
|
В браузере перейти на страницу `localhost:8080`.
|
|
|
|
Все внесменные изменения в `src` инициируют перекомпилляцию.
|
|
|
|
## Работаем с Tizen
|
|
|
|
https://developer.tizen.org/development/tizen-studio/download/
|
|
|
|
## Параметры для плеера
|
|
|
|
**skip** - установка значений перемотки вперед/назад в секундах
|
|
- *forward*:number - перемотка вперед
|
|
- *backward*:number - перемотка назад
|
|
максимум 300, минимум 1
|
|
При отсутсвии какого-либо значения иконка перемотки прячется
|
|
При отсутсвии skip, также прячется вся перемотка
|
|
```js
|
|
skip: {
|
|
forward: 1, // default: 10
|
|
backward: 5, // default: 10
|
|
},
|
|
```
|
|
|
|
**playbackRates** - параметры скорости воспроизведения
|
|
Массив с значениями скорости воспроизведения
|
|
При отсутствии playbackRates элемент управления прячется
|
|
```js
|
|
playbackRates: [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2]
|
|
```
|
|
|
|
**tracks** - трэки для отображения субтитров
|
|
- *kind* - тип ('subtitles')
|
|
- *src* - ссылка на субтитры
|
|
- *srclang* - язык субтитров
|
|
- *label* - название, которое будет отображаться в списке
|
|
|
|
```js
|
|
tracks: [
|
|
{
|
|
kind: "subtitles",
|
|
src: "{link}",
|
|
srclang: 'ru',
|
|
label: 'Название субтитров',
|
|
},
|
|
...
|
|
],
|
|
```
|
|
|
|
#### Параметры для отображения элементов в control-bar
|
|
|
|
Если в параметрах плеера стоит: `controls: true`, то будут отбражаться все элементы управления
|
|
|
|
**volume** - параметры для звука
|
|
- *inline* - указывает вертикально(false), горизонтально (true) будет отображатся бегунок для звука
|
|
```js
|
|
volume: {
|
|
inline: true, // default: false
|
|
},
|
|
```
|
|
|
|
**zoom** - параметры для зума
|
|
Если отсутствует, то zoom не отображается
|
|
```js
|
|
{
|
|
zoom: true,
|
|
}
|
|
```
|
|
|
|
**replay** - кнопка "начать сначала"
|
|
Если отсутствует, то replay не отображается
|
|
```js
|
|
{
|
|
replay: true,
|
|
}
|
|
```
|
|
|
|
**play** - кнопка "Play"
|
|
Если отсутствует, то Play не отображается
|
|
```js
|
|
{
|
|
play: true,
|
|
}
|
|
```
|
|
|
|
**progress** - прогресс просмотра
|
|
Если отсутствует, то прогресс не отображается
|
|
```js
|
|
{
|
|
progress: true,
|
|
}
|
|
```
|
|
|
|
**fullscreen** - кнопка "отображения в фулскрине"
|
|
Если отсутствует, то fullscreen не отображается
|
|
```js
|
|
{
|
|
fullscreen: true,
|
|
}
|
|
```
|
|
|
|
**selection** - отображение элементов управления для выбора участка видео
|
|
Если отсутствует, то selection не отображается
|
|
```js
|
|
{
|
|
selection: true,
|
|
}
|
|
```
|
|
|
|
**enableDocumentPictureInPicture** - включает картинку в картинке, если она доступна для браузера
|
|
```js
|
|
{
|
|
enableDocumentPictureInPicture: true,
|
|
}
|
|
``` |