chiu
/
asia-home-b
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update template

This commit is contained in:
rulingcom 2021-11-15 09:02:10 +00:00
parent 2f02e65c07
commit 3f68df7e47
1 changed files with 79 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
modules/ad_banner/_ad_banner_widget2_video.html.erb
View File

@ -34,10 +34,53 @@
</div>
</div>
<script type="text/javascript">
var ad_trigger_time;
if (typeof ad_banners_count === 'undefined'){
var ad_banners_count = 0;
}
function ad_audio_button(ele,is_stop){
var $self = $(ele);
var button_container = $self.parents('.ba-banner-widget-youtube').eq(0);
if (is_stop){
$self.find('.jarallax-video-audio').remove();
}else{
var audio_div;
if ($self.hasClass('have-audio')){
audio_div = $('<div class="jarallax-video-audio"><i class="fas fa-volume-up"></i></div>');
}else{
audio_div = $('<div class="jarallax-video-audio"><i class="fas fa-volume-mute"></i></div>');
}
audio_div.click(function(event) {
var currentTime = new Date();
if (ad_trigger_time&&currentTime-ad_trigger_time<500){
return false;
}else{
ad_trigger_time = currentTime;
}
event.stopPropagation();
var $video = $self.find('video');
if ($self.hasClass('have-audio')){
$self.removeClass('have-audio');
$(this).find('i.fas').attr('class','fas fa-volume-mute');
}else{
$self.addClass('have-audio');
$(this).find('i.fas').attr('class','fas fa-volume-up');
}
if ($video.length>0){
$self.jPlayer("mute", !$self.data().jPlayer.options.muted);
}else{//youtube
var player = $self.find('iframe').data("yt_player");
if (player.isMuted()){
player.unMute();
}else{
player.mute();
}
}
});
button_container.find('.jarallax-video-audio').remove();
button_container.append(audio_div);
}
}
if(document.getElementById("youtube-iframe-api") == null){
var tag = document.createElement('script');
tag.setAttribute("id", "youtube-iframe-api");
@ -52,6 +95,11 @@
ad_banners_count++;
})
if (typeof onYouTubeIframeAPIReady !== 'function'){
$(document).ready(function() {
$(document).on('touchstart click mousedown',".jarallax-video-audio",function(){
$(this).trigger('click');
});
});
if(window.yt_players == undefined)
window.yt_players = {};
function onYouTubeIframeAPIReady(){
@ -80,7 +128,7 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
events: {
'onReady': function(event){
var height = $(event.target.getIframe()).height();
var banner_wrap = $(".w-ba-banner__wrap[data-overlay=\".w-ad-banner__overlay_"+id+"\"]");
var banner_wrap = $(iframe).parents('.w-ba-banner__wrap').eq(0);
banner_wrap.height(height).css({"padding-bottom":"","padding-top":""});
banner_wrap.find(".cycle-carousel-wrap").css("top","3em");
delete (event.target.B || event.target.H).onStateChange;
@ -105,7 +153,6 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
}
})
}
function onPlayerStateChange(event){
var iframe = $(event.target.h),
cyclediv = iframe.parents("div.cycle-slideshow");
@ -114,10 +161,12 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
cyclediv[0].need_resume = !(cyclediv.hasClass("cycle-paused"));
cyclediv.cycle("pause");
widget.find('.banner-pager,.controlplay,.button-mid,.ad-overlay').css('visibility','hidden')
ad_audio_button(iframe.parents(".w-ad-banner__slide").eq(0),false);
}else if(event.data == YT.PlayerState.UNSTARTED || event.data == YT.PlayerState.PAUSED || event.data == YT.PlayerState.ENDED){
if(cyclediv[0].need_resume)
cyclediv.cycle("resume");
widget.find('.banner-pager,.controlplay,.button-mid,.ad-overlay').css('visibility','')
ad_audio_button(iframe.parents(".w-ad-banner__slide").eq(0),true);
}
{{extra_state_chnage_script}}
}
@ -178,6 +227,33 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
})
</script>
<style type="text/css">
.jarallax-video-audio{
z-index: 201;
font-size: 36px;
color: #FFF;
text-align: center;
position: absolute;
top: 2%;
right: 2%;
height: 66px;
width: 66px;
border-radius: 50%;
line-height: 1.8;
cursor: pointer;
border: 2px solid rgba(255,255,255,.6);
background-color: rgba(0,0,0,.6);
transition: all 1.2s ease;
}
@media (max-width: 768px){
.jarallax-video-audio{
top: 50%;
}
}
.jarallax-video-audio:hover{
color: #FFC500;
transition: all 0.6s ease;
}
.w-ba-banner .controlplay .resume-slide.active i{
color: #32D9C3;
}