Implements volume and playback options for video widget (both for html video and youtube)

This commit is contained in:
Hadi Nategh 2021-08-13 12:51:10 +02:00
parent 4a4de6eba6
commit 2a13f7a3df
2 changed files with 146 additions and 0 deletions

View File

@ -163,6 +163,58 @@ var et2_video = /** @class */ (function (_super) {
this.video.attr("controls", _value); this.video.attr("controls", _value);
} }
}; };
/**
* Method to set volume
* @param _value
*/
et2_video.prototype.set_volume = function (_value) {
var value = _value > 100 ? 100 : _value;
if (value >= 0) {
if (this._isYoutube()) {
this.youtube.set_volume(value);
}
else {
this.video[0].volume = value / 100;
}
}
};
/**
* get volume
*/
et2_video.prototype.get_volume = function () {
if (this._isYoutube()) {
return this.youtube.get_playBackRate();
}
else {
return this.video[0].playBackRate;
}
};
/**
* method to set playBackRate
* @param _value
*/
et2_video.prototype.set_playBackRate = function (_value) {
var value = _value > 16 ? 16 : _value;
if (value >= 0) {
if (this._isYoutube()) {
this.youtube.playBackRate(value);
}
else {
this.video[0].playBackRate = value;
}
}
};
/**
* get playBackRate
*/
et2_video.prototype.get_playBackRate = function () {
if (this._isYoutube()) {
return this.youtube.get_volume();
}
else {
return this.video[0].volume;
}
};
/** /**
* Set poster attribute in order to specify * Set poster attribute in order to specify
* an image to be shown while video is loading or before user play it * an image to be shown while video is loading or before user play it
@ -454,6 +506,18 @@ var et2_video = /** @class */ (function (_super) {
"type": "boolean", "type": "boolean",
"default": false, "default": false,
"description": "Defines if the video should be played repeatedly" "description": "Defines if the video should be played repeatedly"
},
"volume": {
"name": "Video volume",
"type": "float",
"default": 0,
"description": "Set video's volume"
},
"playbackrate": {
"name": "Video playBackRate",
"type": "float",
"default": 1,
"description": "Set video's playBackRate"
} }
}; };
et2_video.youtube_player_states = { et2_video.youtube_player_states = {

View File

@ -96,6 +96,18 @@ export class et2_video extends et2_baseWidget implements et2_IDOMNode
"type": "boolean", "type": "boolean",
"default": false, "default": false,
"description": "Defines if the video should be played repeatedly" "description": "Defines if the video should be played repeatedly"
},
"volume": {
"name": "Video volume",
"type": "float",
"default": 0,
"description": "Set video's volume"
},
"playbackrate": {
"name": "Video playBackRate",
"type": "float",
"default": 1,
"description": "Set video's playBackRate"
} }
}; };
@ -264,6 +276,76 @@ export class et2_video extends et2_baseWidget implements et2_IDOMNode
} }
} }
/**
* Method to set volume
* @param _value
*/
set_volume(_value: number)
{
let value = _value>100?100:_value;
if (value>= 0)
{
if (this._isYoutube())
{
this.youtube.set_volume(value);
}
else
{
this.video[0].volume = value/100;
}
}
}
/**
* get volume
*/
get_volume()
{
if (this._isYoutube())
{
return this.youtube.get_playBackRate();
}
else
{
return this.video[0].playBackRate;
}
}
/**
* method to set playBackRate
* @param _value
*/
set_playBackRate(_value: number)
{
let value = _value>16?16:_value;
if (value>= 0)
{
if (this._isYoutube())
{
this.youtube.playBackRate(value);
}
else
{
this.video[0].playBackRate = value;
}
}
}
/**
* get playBackRate
*/
get_playBackRate()
{
if (this._isYoutube())
{
return this.youtube.get_volume();
}
else
{
return this.video[0].volume;
}
}
/** /**
* Set poster attribute in order to specify * Set poster attribute in order to specify
* an image to be shown while video is loading or before user play it * an image to be shown while video is loading or before user play it