update template
This commit is contained in:
parent
97f5a9c4fe
commit
b6badcb558
|
@ -34,10 +34,53 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
var ad_trigger_time;
|
||||||
if (typeof ad_banners_count === 'undefined'){
|
if (typeof ad_banners_count === 'undefined'){
|
||||||
var ad_banners_count = 0;
|
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&¤tTime-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){
|
if(document.getElementById("youtube-iframe-api") == null){
|
||||||
var tag = document.createElement('script');
|
var tag = document.createElement('script');
|
||||||
tag.setAttribute("id", "youtube-iframe-api");
|
tag.setAttribute("id", "youtube-iframe-api");
|
||||||
|
@ -52,9 +95,13 @@
|
||||||
ad_banners_count++;
|
ad_banners_count++;
|
||||||
})
|
})
|
||||||
if (typeof onYouTubeIframeAPIReady !== 'function'){
|
if (typeof onYouTubeIframeAPIReady !== 'function'){
|
||||||
|
$(document).ready(function() {
|
||||||
|
$(document).on('touchstart click mousedown',".jarallax-video-audio",function(){
|
||||||
|
$(this).trigger('click');
|
||||||
|
});
|
||||||
|
});
|
||||||
if(window.yt_players == undefined)
|
if(window.yt_players == undefined)
|
||||||
window.yt_players = {};
|
window.yt_players = {};
|
||||||
$(".w-ba-banner__wrap[data-overlay=\".w-ad-banner__overlay_{{subpart-id}}\"]");
|
|
||||||
function onYouTubeIframeAPIReady(){
|
function onYouTubeIframeAPIReady(){
|
||||||
$(".w-ba-banner").each(function(i,banner){
|
$(".w-ba-banner").each(function(i,banner){
|
||||||
var iframes = $(banner).find("iframe");
|
var iframes = $(banner).find("iframe");
|
||||||
|
@ -74,7 +121,6 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
|
||||||
delete yt_players[id][k];
|
delete yt_players[id][k];
|
||||||
})
|
})
|
||||||
iframes.each(function(i,iframe){
|
iframes.each(function(i,iframe){
|
||||||
console.log($(iframe).attr("id"))
|
|
||||||
var yt_player = yt_players[id][$(iframe).attr("id")];
|
var yt_player = yt_players[id][$(iframe).attr("id")];
|
||||||
if(yt_player){
|
if(yt_player){
|
||||||
}else{
|
}else{
|
||||||
|
@ -82,8 +128,8 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
|
||||||
events: {
|
events: {
|
||||||
'onReady': function(event){
|
'onReady': function(event){
|
||||||
var height = $(event.target.getIframe()).height();
|
var height = $(event.target.getIframe()).height();
|
||||||
var banner_wrap = $(".w-ba-banner__wrap[data-overlay=\".w-ad-banner__overlay_{{subpart-id}}\"]");
|
var banner_wrap = $(iframe).parents('.w-ba-banner__wrap').eq(0);
|
||||||
banner_wrap.height(height).css({"padding-bottom":"4em","padding-top":""});
|
banner_wrap.height(height).css({"padding-bottom":"","padding-top":""});
|
||||||
banner_wrap.find(".cycle-carousel-wrap").css("top","3em");
|
banner_wrap.find(".cycle-carousel-wrap").css("top","3em");
|
||||||
delete (event.target.B || event.target.H).onStateChange;
|
delete (event.target.B || event.target.H).onStateChange;
|
||||||
var onStateChange_idx = event.target.l.i.onStateChange;
|
var onStateChange_idx = event.target.l.i.onStateChange;
|
||||||
|
@ -107,7 +153,6 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
function onPlayerStateChange(event){
|
function onPlayerStateChange(event){
|
||||||
var iframe = $(event.target.h),
|
var iframe = $(event.target.h),
|
||||||
cyclediv = iframe.parents("div.cycle-slideshow");
|
cyclediv = iframe.parents("div.cycle-slideshow");
|
||||||
|
@ -116,13 +161,16 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
|
||||||
cyclediv[0].need_resume = !(cyclediv.hasClass("cycle-paused"));
|
cyclediv[0].need_resume = !(cyclediv.hasClass("cycle-paused"));
|
||||||
cyclediv.cycle("pause");
|
cyclediv.cycle("pause");
|
||||||
widget.find('.banner-pager,.controlplay,.button-mid,.ad-overlay').css('visibility','hidden')
|
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){
|
}else if(event.data == YT.PlayerState.UNSTARTED || event.data == YT.PlayerState.PAUSED || event.data == YT.PlayerState.ENDED){
|
||||||
if(cyclediv[0].need_resume)
|
if(cyclediv[0].need_resume)
|
||||||
cyclediv.cycle("resume");
|
cyclediv.cycle("resume");
|
||||||
widget.find('.banner-pager,.controlplay,.button-mid,.ad-overlay').css('visibility','')
|
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}}
|
{{extra_state_chnage_script}}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
window.onYouTubePlayerAPIReady = function() {
|
window.onYouTubePlayerAPIReady = function() {
|
||||||
onYouTubeIframeAPIReady.apply(this,arguments);
|
onYouTubeIframeAPIReady.apply(this,arguments);
|
||||||
|
@ -143,8 +191,10 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
|
||||||
controlplay.find(".pause-slide").removeClass("active");
|
controlplay.find(".pause-slide").removeClass("active");
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
/*
|
||||||
var height = opts.slides.filter('.active').height() || opts.slides.height();
|
var height = opts.slides.filter('.active').height() || opts.slides.height();
|
||||||
banner_wrap.height(height).css("padding-bottom","");
|
banner_wrap.height(height)*/
|
||||||
|
banner_wrap.css("padding-bottom","");
|
||||||
{{extra_document_ready_script}}
|
{{extra_document_ready_script}}
|
||||||
$('.pause-slide').off('click').click(function(){
|
$('.pause-slide').off('click').click(function(){
|
||||||
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('pause');
|
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('pause');
|
||||||
|
@ -175,9 +225,35 @@ if (typeof onYouTubeIframeAPIReady !== 'function'){
|
||||||
},300);
|
},300);
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
<style type="text/css">
|
<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{
|
.w-ba-banner .controlplay .resume-slide.active i{
|
||||||
color: #32D9C3;
|
color: #32D9C3;
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,13 +6,20 @@
|
||||||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
|
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
|
||||||
</div>
|
</div>
|
||||||
<div style="position: absolute;top: 50%;bottom: 50%;width:100%;">
|
<div style="position: absolute;top: 50%;bottom: 50%;width:100%;">
|
||||||
<button class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;background: url(/assets/left-01.png) no-repeat;border: 0;background-size: contain;position: absolute;transition:.3s; left: 0.6%;"><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %></span></button>
|
<button class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;background: border: 0;background-size: contain;position: absolute;transition:.3s; left: 0.6%;color: #ffffff;
|
||||||
<button class="btn-right" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>" style="float: right;;height: 2.5em; width: 2.5em;background: url(/assets/right-01.png) no-repeat;background-size: contain;border: 0;position: absolute;transition:.3s;right: 0.6%;"><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %></span></button>
|
background: rgba(0, 0, 0, 0.2);
|
||||||
</div>
|
border-radius: 50%;
|
||||||
|
border: none;"><i class="fa fa-angle-left prev-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %></span></button>
|
||||||
|
<button class="btn-right" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>" style="float: right;;height: 2.5em; width: 2.5em;background-size: contain;border: 0;position: absolute;transition:.3s;right: 0.6%;color: #ffffff;
|
||||||
|
background: rgba(0, 0, 0, 0.2);
|
||||||
|
border-radius: 50%;
|
||||||
|
border: none;"><i class="fa fa-angle-right next-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %></span></button>
|
||||||
|
</div>
|
||||||
<ul class="w-annc__list row" data-level="0" data-list="announcements">
|
<ul class="w-annc__list row" data-level="0" data-list="announcements">
|
||||||
<li class="w-annc__item col-md-4">
|
<li class="w-annc__item col-md-4">
|
||||||
<div class="w-annc__img-wrap bullseye">
|
<div class="w-annc__img-wrap bullseye">
|
||||||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||||||
|
<div class="transitionfade"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="w-annc__content-wrap">
|
<div class="w-annc__content-wrap">
|
||||||
<div class="w-annc__meta">
|
<div class="w-annc__meta">
|
||||||
|
@ -121,7 +128,7 @@
|
||||||
num=1;
|
num=1;
|
||||||
}
|
}
|
||||||
var flag=false;
|
var flag=false;
|
||||||
$('.btn-left').click(function(){
|
$('.btn-left').click(function(){
|
||||||
if(!flag){
|
if(!flag){
|
||||||
var uls = $('[data-subpart-id=\"{{subpart-id}}\"] ul.w-annc__list:not(.hidden_item)').toArray();
|
var uls = $('[data-subpart-id=\"{{subpart-id}}\"] ul.w-annc__list:not(.hidden_item)').toArray();
|
||||||
var ul_length = uls.length;
|
var ul_length = uls.length;
|
||||||
|
|
|
@ -0,0 +1,32 @@
|
||||||
|
<div class="i-annc index-announcement-18">
|
||||||
|
<style>
|
||||||
|
@media (min-width: 992px){
|
||||||
|
li.i-annc__item.col-md-4:nth-child(3n) {
|
||||||
|
clear: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<h3 class="i-annc__page-title">{{widget-title}}</h3>
|
||||||
|
<ul class="i-annc__list row" data-level="0" data-list="announcements">
|
||||||
|
<li class="i-annc__item col-md-4">
|
||||||
|
<div class="i-annc__content-wrap">
|
||||||
|
<div class="i-annc__meta">
|
||||||
|
<span class="i-annc__postdate-wrap" date-format="%Y-%m-%d">
|
||||||
|
<span class="i-annc__postdate">{{postdate}}</span>
|
||||||
|
</span>
|
||||||
|
<span class="i-annc__category-wrap">
|
||||||
|
<i class="fa fa-clone"></i>
|
||||||
|
<span class="i-annc__category">{{category}}</span>
|
||||||
|
</span>
|
||||||
|
<span class="i-annc__status-wrap" data-list="statuses" data-level="1">
|
||||||
|
<span class="i-annc__status label status {{status-class}}">{{status}}</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<h4 class="i-annc__entry-title">
|
||||||
|
<a class="i-annc__title" href="{{link_to_show}}">{{title}}</a>
|
||||||
|
</h4>
|
||||||
|
<p class="i-annc__subtitle">{{subtitle}}</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
|
@ -281,6 +281,14 @@
|
||||||
"en": "18. 3-Column Standard Image + Text Lite (widget-title, title, subtitle(only display 15 words))"
|
"en": "18. 3-Column Standard Image + Text Lite (widget-title, title, subtitle(only display 15 words))"
|
||||||
},
|
},
|
||||||
"thumbnail": "annc_widget4_thumbs.png"
|
"thumbnail": "annc_widget4_thumbs.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"filename": "annc_widget19",
|
||||||
|
"name": {
|
||||||
|
"zh_tw": "19. 標準文字列表三欄 ( 模組標題, 日期, 類別, 狀態, 標題, 副標題 )",
|
||||||
|
"en": "19. 3-Column Standard Text List (widget-title, postdate, category, status, title, subtitle)"
|
||||||
|
},
|
||||||
|
"thumbnail": "annc_index19_thumbs.png"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
Binary file not shown.
After Width: | Height: | Size: 3.4 KiB |
|
@ -1,5 +1,5 @@
|
||||||
<div class="i-archive index-archive-1">
|
<div class="i-archive index-archive-1">
|
||||||
<h3 class="i-archive__page-title">{{page-title}}</h3>
|
<h3 class="i-archive-title">{{page-title}}</h3>
|
||||||
<ul class="i-archive__list list-unstyled" data-list="categories" data-level="0">
|
<ul class="i-archive__list list-unstyled" data-list="categories" data-level="0">
|
||||||
<li class="i-archive__item">
|
<li class="i-archive__item">
|
||||||
<h4 class="i-archive__category-title">{{category-title}}</h4>
|
<h4 class="i-archive__category-title">{{category-title}}</h4>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<div class="i-archive index-archive-3">
|
<div class="i-archive index-archive-3">
|
||||||
<h3 class="i-archive__page-title">{{page-title}}</h3>
|
<h3 class="i-archive-title">{{page-title}}</h3>
|
||||||
<ul class="i-archive__list list-unstyled" data-list="categories" data-level="0">
|
<ul class="i-archive__list list-unstyled" data-list="categories" data-level="0">
|
||||||
<li class="i-archive__item">
|
<li class="i-archive__item">
|
||||||
<h4 class="i-archive__category-title">{{category-title}}</h4>
|
<h4 class="i-archive__category-title">{{category-title}}</h4>
|
||||||
|
|
Loading…
Reference in New Issue