public static function the_layout_content($post_id, $row_type = 'default')
{
TMM_Layout_Constructor::draw_front($post_id, $row_type);
}
$overlay_style_attr .= '0,0,0';
}
if (isset($tmm_layout_constructor_row[$row]['bg_overlay_opacity'])) {
$overlay_style_attr .= ',' . intval($tmm_layout_constructor_row[$row]['bg_overlay_opacity']) / 100;
} else {
$overlay_style_attr .= ',1';
}
if (!empty($overlay_style_attr)) {
$overlay_style_attr = ' style="background-color:rgba(' . $overlay_style_attr . ')"';
}
}
if ($tmm_layout_constructor_row[$row]['bg_custom_type'] == 'video' && !empty($tmm_layout_constructor_row[$row]['bg_video'])) {
$video_type = TMM_Layout_Constructor::get_video_type($tmm_layout_constructor_row[$row]['bg_video']);
$top = $post->post_type == 'page' && empty($post->post_content) && $first_row['bg_custom_type'] == 'video' ? '0' : '100px';
$video_options = array('video_url' => $tmm_layout_constructor_row[$row]['bg_video'], 'bg_cover' => isset($tmm_layout_constructor_row[$row]['bg_cover']) ? $tmm_layout_constructor_row[$row]['bg_cover'] : '', 'video_type' => $video_type, 'video_quality' => 'default', 'top' => $top, 'panel' => $tmm_layout_constructor_row[$row]['bg_video_panel'], 'mute' => $tmm_layout_constructor_row[$row]['bg_video_mute'], 'loop' => $tmm_layout_constructor_row[$row]['bg_video_loop'], 'containment' => '#section_' . $row);
echo TMM_Layout_Constructor::display_rowbg_video($video_options);
}
if ($tmm_layout_constructor_row[$row]['bg_custom_type'] == 'color' && !empty($tmm_layout_constructor_row[$row]['bg_color'])) {
$section_style_attr .= 'background:' . $tmm_layout_constructor_row[$row]['bg_color'] . '; ';
}
}
/* wrap section and row styles */
if (!empty($section_style_attr)) {
$section_style_attr = ' style="' . $section_style_attr . '"';
}
if ($tmm_layout_constructor_row[$row]['full_width'] == 0 && ($row_displaying == 'full_width' || $row_displaying == 'before_full_width')) {
?>
<div class="container">
<?php
</li>
<?php
}
}
?>
</ul>
<div style="display: none;">
<div id="tmm_lc_column_item">
<?php
$col_data = array('row' => '__ROW_ID__', 'uniqid' => '__UNIQUE_ID__', 'css_class' => 'element1-4', 'front_css_class' => 'col-sm-3', 'value' => '1/4', 'content' => '', 'title' => '', 'effect' => '');
TMM_Layout_Constructor::draw_column_item($col_data);
?>
</div>
<ul id="tmm_lc_row_wrapper">
<li id="tmm_lc_row___ROW_ID__" class="tmm-lc-row">
<div class="tmm-lc-row-buttons-wrapper">
<a class="tmm-lc-add-column" title="<?php
_e("Add Column", TMM_CC_TEXTDOMAIN);
?>
" data-row-id="__ROW_ID__"></a>
<a class="tmm-lc-copy-row" data-row-id="__ROW_ID__" title="<?php
_e("Add to Clipboard", TMM_CC_TEXTDOMAIN);
?>
public static function display_rowbg_video($video_options)
{
if (TMM_Layout_Constructor::check_user_agent('mobile')) {
if (isset($video_options['bg_cover']) && !empty($video_options['bg_cover'])) {
?>
<div style="<?php
echo !empty($video_options['bg_cover']) ? 'background-image: url(' . $video_options['bg_cover'] . ');' : '';
?>
" class="full-bg-image full-bg-image-scroll"></div>
<?php
}
} else {
if (isset($video_options['video_url']) and !empty($video_options['video_url'])) {
$mute = $video_options['mute'] ? 1 : 0;
$loop = $video_options['loop'] ? 1 : 0;
switch ($video_options['video_type']) {
case 'youtube':
$source_code = explode("?v=", $video_options['video_url']);
$source_code = explode("&", $source_code[1]);
if (is_array($source_code)) {
$source_code = $source_code[0];
}
?>
<div class="mb-wrapper">
<div id="ytplayer" class="fitwidth"></div>
</div>
<script>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player,
playerVars,
loop = <?php
echo $loop;
?>
;
if (loop){
playerVars = {'autoplay': 1, 'controls': 0, 'wmode':'transparent', 'loop': true, 'playlist': '<?php
echo $source_code;
?>
', 'showinfo': 0 }
} else {
playerVars = {'autoplay': 1, 'controls': 0, 'wmode':'transparent', 'showinfo': 0 }
}
function onYouTubePlayerAPIReady() {
player = new YT.Player('ytplayer', {
playerVars: playerVars,
videoId: '<?php
echo $source_code;
?>
',
height: '100%',
width: '100%',
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
var mute = <?php
echo $mute;
?>
;
if (mute == 1){
event.target.mute();
jQuery('.bt_mute').attr({'data-click': 'unMute'});
jQuery('.icon-volume-off').parent('span').hide();
jQuery('.icon-volume-up').parent('span').show();
}else{
jQuery('.icon-volume-off').parent('span').show();
jQuery('.icon-volume-up').parent('span').hide();
}
jQuery('.video_control_panel').show();
jQuery('.icon-play').parent('span').hide();
jQuery('.icon-pause-2').parent('span').show();
jQuery('.bt_play').on('click', function(){
var $this = jQuery(this),
attrclick = $this.attr('data-click');
if (attrclick == 'play'){
$this.attr({'data-click': 'pause'});
player.playVideo();
jQuery('.icon-play').parent('span').hide();
jQuery('.icon-pause-2').parent('span').show();
}else{
$this.attr({'data-click': 'play'});
player.pauseVideo();
jQuery('.icon-play').parent('span').show();
jQuery('.icon-pause-2').parent('span').hide();
}
return false;
});
jQuery('.bt_mute').on('click', function(){
var $this = jQuery(this),
attrclick = $this.attr('data-click');
if (attrclick == 'mute'){
$this.attr({'data-click': 'unMute'});
player.mute();
jQuery('.icon-volume-off').parent('span').hide();
jQuery('.icon-volume-up').parent('span').show();
}else{
$this.attr({'data-click': 'mute'});
player.unMute();
jQuery('.icon-volume-off').parent('span').show();
jQuery('.icon-volume-up').parent('span').hide();
}
return false;
});
}
</script>
<?php
break;
case 'vimeo':
$source_code = explode("/", $video_options['video_url']);
if (is_array($source_code)) {
$source_code = $source_code[count($source_code) - 1];
}
?>
<div class="mb-wrapper">
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<iframe id="vimeo_player" src="http://player.vimeo.com/video/<?php
echo $source_code;
?>
?api=1&loop=<?php
echo $loop;
?>
&player_id=vimeo_player&autoplay=1" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div><!--/ .mb-wrapper-->
<script>
(function($) {
$(function() {
var iframe = $('#vimeo_player')[0];
var player = $f(iframe);
var status = $('.status');
var mute = <?php
echo $mute;
?>
;
// When the player is ready, add listeners for pause, finish, and playProgress
player.addEvent('ready', function() {
if (mute == 1){
player.api('setVolume', '0');
$('.bt_mute').attr({'data-click': 'unMute'});
jQuery('.icon-volume-off').parent('span').hide();
jQuery('.icon-volume-up').parent('span').show();
}else{
jQuery('.icon-volume-off').parent('span').show();
jQuery('.icon-volume-up').parent('span').hide();
}
});
jQuery('.icon-play').parent('span').hide();
jQuery('.icon-pause-2').parent('span').show();
jQuery('.video_control_panel').show();
$('.bt_play').on('click', function() {
var $this = $(this),
attrclick = $(this).attr('data-click');
if (attrclick == 'play'){
$this.attr({'data-click': 'pause'});
player.api('play');
jQuery('.icon-play').parent('span').hide();
jQuery('.icon-pause-2').parent('span').show();
}else{
$this.attr({'data-click': 'play'});
player.api('pause');
jQuery('.icon-play').parent('span').show();
jQuery('.icon-pause-2').parent('span').hide();
}
return false;
});
$('.bt_mute').on('click', function() {
var $this = $(this),
attrclick = $(this).attr('data-click');
if (attrclick == 'mute'){
$this.attr({'data-click': 'unMute'});
player.api('setVolume', '0');
jQuery('.icon-volume-off').parent('span').hide();
jQuery('.icon-volume-up').parent('span').show();
}else{
$this.attr({'data-click': 'mute'});
player.api('setVolume', '1');
jQuery('.icon-volume-off').parent('span').show();
jQuery('.icon-volume-up').parent('span').hide();
}
return false;
});
});
})(jQuery);
</script>
<?php
break;
case 'mp4':
?>
<div class="mb-wrapper" data-mute="<?php
echo $mute;
?>
" data-loop="<?php
echo $loop;
?>
">
<video id="example_video" class="" width="100%" height="100%" >
<source src="<?php
echo $video_options['video_url'];
?>
" type='video/mp4' />
</video>
</div>
<?php
wp_enqueue_script('mediaelement');
break;
case 'ogv':
?>
<div class="mb-wrapper" data-mute="<?php
echo $mute;
?>
" data-loop="<?php
echo $loop;
?>
">
<video id="example_video" class="" width="100%" height="100%" >
<source src="<?php
echo $video_options['video_url'];
?>
" type='video/ogg' />
</video>
</div>
<?php
wp_enqueue_script('mediaelement');
break;
case 'webm':
?>
<div class="mb-wrapper" data-mute="<?php
echo $mute;
?>
" data-loop="<?php
echo $loop;
?>
">
<video id="example_video" class="" width="100%" height="100%" >
<source src="<?php
echo $video_options['video_url'];
?>
" type='video/webm' />
</video>
</div>
<?php
wp_enqueue_script('mediaelement');
break;
default:
$cover = $video_options['bg_cover'];
$image_size = "2000*1345";
if (!empty($cover)) {
?>
<div class="full-bg-image full-bg-image-scroll" style="background-image: url('<?php
echo TMM_Content_Composer::resize_image_cover($cover, $image_size);
?>
');"></div>
<?php
} else {
_e('Unsupported video format', TMM_CC_TEXTDOMAIN);
}
break;
}
if (isset($video_options['panel']) && $video_options['panel']) {
TMM_Layout_Constructor::get_video_control_panel();
}
}
}
}