Skip to content

Commit

Permalink
Fec 6351 cvaa (kaltura#3227)
Browse files Browse the repository at this point in the history
* initial changes

* update screens

* update plugin

* template update

* update template and previews logic

* adjust for mobile and add on/off btn

* update cvaa

* fix safari font issues

* remove unneeded preset default fields and update test pages

* Add paging to small screens. Need new icons and also fine tune positioning of arrows

* add arrow icon, carousel styles

* update layout css
  • Loading branch information
GuyLivni authored Jan 25, 2017
1 parent 0744fac commit a32195a
Show file tree
Hide file tree
Showing 12 changed files with 1,314 additions and 654 deletions.
52 changes: 36 additions & 16 deletions modules/KalturaSupport/components/cvaa/CvaaDemo.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
</head>
<body>
<h1>Captions styles menu</h1>
<div id="kaltura_player" style="width: 660px; height: 460px;float: left;"></div>
<div id="kaltura_player" style="width: 640px; height: 360px;float: left;"></div>
<br style="clear: both;" /><br />
<h1> Caption Styles Api </h1>
<pre>
Expand All @@ -29,22 +29,22 @@ <h3>It is possible to update styles via API call, using the following object for
);
});

<h3>Additionally you can set up the default styles settings, using "cvaaDefaultSettings" flashvar:</h3>
'flashvars': {
'cvaa':{
'cvaaDefaultSettings': {
'fontFamily': "Arial, Roboto, Arial Unicode Ms, Helvetica, Verdana, PT Sans Caption, sans-serif",
'fontColor': "#ffffff",
'fontOpacity': 100,
'fontSize': 12,
'backgroundColor': "#000000",
'backgroundOpacity': 75,
'windowColor': "#ffffff",
'windowOpacity': 0,
'edgeStyle': "none"
}
<h3>Additionally you can set up the default styles settings, using "cvaaDefault" flashvar:</h3>
'flashvars': {
'cvaa':{
'cvaaDefault': {
'fontFamily': "Arial, Roboto, Arial Unicode Ms, Helvetica, Verdana, PT Sans Caption, sans-serif",
'fontColor': "#ffffff",
'fontOpacity': 100,
'fontSize': 12,
'backgroundColor': "#000000",
'backgroundOpacity': 75,
'windowColor': "#ffffff",
'windowOpacity': 0,
'edgeStyle': "none"
}
}
}

<b>NOTE:</b>The caption menu style settings are saved using cookies per page, you can disable cookies,
However upon page refresh the settings will not be saved and the default will be used.
Expand All @@ -64,13 +64,33 @@ <h3>Additionally you can set up the default styles settings, using "cvaaDefaultS
'uiconf_id': '20540612',
'entry_id': '0_uka1msg4',
'flashvars': {
'EmbedPlayer.EnableMobileSkin': true,
'disableTrackElement': true,
'closedCaptions': {
'enableOptionsMenu': true
'enableOptionsMenu': true,
"hideClosedCaptions": false
},
'cvaa':{
'useCookie': true
}
// 'smartContainer': {
// 'plugin': true,
// 'tooltip': 'Global Settings',
// 'config':{
// 'plugins':[
// {
// 'pluginName':'closedCaptions',
// 'properties':[
// {
// 'property':'captions',
// 'label': 'Language:',
// 'type': 'enum'
// }
// ]
// }
// ]
// }
// }
}
});
</script>
Expand Down
98 changes: 98 additions & 0 deletions modules/KalturaSupport/components/cvaa/CvaaDemoSmall.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Cvaa Demo</title>
<script type="text/javascript" src="../../../../tests/qunit/qunit-bootstrap.js"></script>
<script type="text/javascript" src="../../../../mwEmbedLoader.php"></script>
<script type="text/javascript" src="../../../../docs/js/doc-bootstrap.js"></script>
<script>mw.setConfig('forceMobileHTML5', true);</script>
</head>
<body>
<h1>Captions styles menu</h1>
<div id="kaltura_player" style="width: 320px; height: 180px;float: left;"></div>
<br style="clear: both;" /><br />
<h1> Caption Styles Api </h1>
<pre>
<h3>It is possible to update styles via API call, using the following object format:</h3>
kWidget.addReadyCallback( function( playerId ){
var kdp = document.getElementById( playerId );
kaltura_player.sendNotification("newCaptionsStyles",
{
"fontFamily": "Courier New, Courier, Nimbus Mono L, Cutive Mono, monospace",
"fontColor": "rgb(123, 33, 111, 0.8)",
"fontSize": "3em",
"backgroundColor": "rgba(1, 1, 1, 0.5)",
"windowColor": "rgba(255, 255, 0, 0.8)",
"charEdgeStyle": "rgb(34, 34, 34) 2px 2px 3px, rgb(34, 34, 34) 2px 2px 4px, rgb(34, 34, 34) 2px 2px 5px"
}
);
});

<h3>Additionally you can set up the default styles settings, using "cvaaDefault" flashvar:</h3>
'flashvars': {
'cvaa':{
'cvaaDefault': {
'fontFamily': "Arial, Roboto, Arial Unicode Ms, Helvetica, Verdana, PT Sans Caption, sans-serif",
'fontColor': "#ffffff",
'fontOpacity': 100,
'fontSize': 12,
'backgroundColor': "#000000",
'backgroundOpacity': 75,
'windowColor': "#ffffff",
'windowOpacity': 0,
'edgeStyle': "none"
}
}
}

<b>NOTE:</b>The caption menu style settings are saved using cookies per page, you can disable cookies,
However upon page refresh the settings will not be saved and the default will be used.
To disable cookie for the plugin set the following flashvar to false:

'flashvars': {
'cvaa':{
'useCookie': false
}
}
</pre>

<script>
kWidget.featureConfig({
'targetId': 'kaltura_player',
'wid': '_243342',
'uiconf_id': '20540612',
'entry_id': '0_uka1msg4',
'flashvars': {
'EmbedPlayer.EnableMobileSkin': true,
'disableTrackElement': true,
'closedCaptions': {
'enableOptionsMenu': true,
"hideClosedCaptions": false
},
'cvaa':{
'useCookie': true
}
// 'smartContainer': {
// 'plugin': true,
// 'tooltip': 'Global Settings',
// 'config':{
// 'plugins':[
// {
// 'pluginName':'closedCaptions',
// 'properties':[
// {
// 'property':'captions',
// 'label': 'Language:',
// 'type': 'enum'
// }
// ]
// }
// ]
// }
// }
}
});
</script>
</body>
</html>
Loading

0 comments on commit a32195a

Please sign in to comment.