first push prod
This commit is contained in:
Tessier
parent
5e0b79dff7
commit
27dbfb92e0
@ -40,6 +40,11 @@
|
||||
}
|
||||
add_action( 'wp_footer', 'rellax' );
|
||||
|
||||
function simplePlayer(){
|
||||
wp_enqueue_script( 'script',
|
||||
get_template_directory_uri() . '/src/assets/js/simplePlayer.js', array() );
|
||||
}
|
||||
add_action( 'wp_footer', 'simplePlayer' );
|
||||
|
||||
function customJs(){
|
||||
wp_enqueue_script( 'script',
|
||||
|
||||
@ -125,104 +125,39 @@ function scrollto(){
|
||||
});
|
||||
}
|
||||
|
||||
function callPlayer(frame_id, func, args) {
|
||||
|
||||
if (window.jQuery && frame_id instanceof jQuery) frame_id = frame_id.get(0).id;
|
||||
var iframe = document.getElementById(frame_id);
|
||||
if (iframe && iframe.tagName.toUpperCase() != 'IFRAME') {
|
||||
iframe = iframe.getElementsByTagName('iframe')[0];
|
||||
}
|
||||
// When the player is not ready yet, add the event to a queue
|
||||
// Each frame_id is associated with an own queue.
|
||||
// Each queue has three possible states:
|
||||
// undefined = uninitialised / array = queue / .ready=true = ready
|
||||
|
||||
console.log('domReady',iframe);
|
||||
|
||||
if (!callPlayer.queue) callPlayer.queue = {};
|
||||
var queue = callPlayer.queue[frame_id],
|
||||
domReady = document.readyState == 'complete';
|
||||
if (domReady && !iframe) {
|
||||
// DOM is ready and iframe does not exist. Log a message
|
||||
window.console && console.log('callPlayer: Frame not found; id=' + frame_id);
|
||||
if (queue) clearInterval(queue.poller);
|
||||
} else if (func === 'listening') {
|
||||
// Sending the "listener" message to the frame, to request status updates
|
||||
if (iframe && iframe.contentWindow) {
|
||||
func = '{"event":"listening","id":' + JSON.stringify(''+frame_id) + '}';
|
||||
iframe.contentWindow.postMessage(func, '*');
|
||||
}
|
||||
} else if ((!queue || !queue.ready) && (
|
||||
!domReady ||
|
||||
iframe && !iframe.contentWindow ||
|
||||
typeof func === 'function')) {
|
||||
if (!queue) queue = callPlayer.queue[frame_id] = [];
|
||||
queue.push([func, args]);
|
||||
if (!('poller' in queue)) {
|
||||
// keep polling until the document and frame is ready
|
||||
queue.poller = setInterval(function() {
|
||||
callPlayer(frame_id, 'listening');
|
||||
}, 250);
|
||||
// Add a global "message" event listener, to catch status updates:
|
||||
messageEvent(1, function runOnceReady(e) {
|
||||
if (!iframe) {
|
||||
iframe = document.getElementById(frame_id);
|
||||
if (!iframe) return;
|
||||
if (iframe.tagName.toUpperCase() != 'IFRAME') {
|
||||
iframe = iframe.getElementsByTagName('iframe')[0];
|
||||
if (!iframe) return;
|
||||
}
|
||||
}
|
||||
if (e.source === iframe.contentWindow) {
|
||||
// Assume that the player is ready if we receive a
|
||||
// message from the iframe
|
||||
clearInterval(queue.poller);
|
||||
queue.ready = true;
|
||||
messageEvent(0, runOnceReady);
|
||||
// .. and release the queue:
|
||||
while (tmp = queue.shift()) {
|
||||
callPlayer(frame_id, tmp[0], tmp[1]);
|
||||
}
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
} else if (iframe && iframe.contentWindow) {
|
||||
// When a function is supplied, just call it (like "onYouTubePlayerReady")
|
||||
if (func.call) return func();
|
||||
// Frame exists, send message
|
||||
iframe.contentWindow.postMessage(JSON.stringify({
|
||||
"event": "command",
|
||||
"func": func,
|
||||
"args": args || [],
|
||||
"id": frame_id
|
||||
}), "*");
|
||||
}
|
||||
function messageEvent(add, listener) {
|
||||
var w3 = add ? window.addEventListener : window.removeEventListener;
|
||||
w3 ?
|
||||
w3('message', listener, !1)
|
||||
:
|
||||
(add ? window.attachEvent : window.detachEvent)('onmessage', listener);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function setupPlayers() {
|
||||
$('#section_MineVideo .cover').click(function(){
|
||||
$(this).fadeOut();
|
||||
var id = $(this).parent().find('iframe').attr('id');
|
||||
callPlayer(id, function() {
|
||||
callPlayer(id, "playVideo");
|
||||
});
|
||||
});
|
||||
}
|
||||
// function setupPlayers() {
|
||||
// // $('#section_MineVideo .cover').click(function(){
|
||||
// // $(this).fadeOut();
|
||||
// // var id = $(this).parent().find('iframe').attr('id');
|
||||
// // callPlayer(id, function() {
|
||||
// // callPlayer(id, "playVideo");
|
||||
// // });
|
||||
// // });
|
||||
// // Load the IFrame Player API code asynchronously.
|
||||
// var tag = document.createElement('script');
|
||||
// tag.src = "https://www.youtube.com/player_api";
|
||||
// var firstScriptTag = document.getElementsByTagName('script')[0];
|
||||
// firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
|
||||
//
|
||||
// // Replace the 'ytplayer' element with an <iframe> and
|
||||
// // YouTube player after the API code downloads.
|
||||
// var player;
|
||||
// function onYouTubePlayerAPIReady() {
|
||||
// console.log('cc');
|
||||
// player = new YT.Player('ytplayer', {
|
||||
// height: '360',
|
||||
// width: '640',
|
||||
// videoId: 'XUsBV5mXJGs'
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
|
||||
$( document ).ready(function() {
|
||||
// setupPlayers();
|
||||
burger();
|
||||
click_nav();
|
||||
slides();
|
||||
isotope();
|
||||
setupPlayers();
|
||||
// custom_player();
|
||||
// masonry();
|
||||
paralax();
|
||||
|
||||
82
web/app/themes/la_mine/src/assets/js/simplePlayer.js
Normal file
82
web/app/themes/la_mine/src/assets/js/simplePlayer.js
Normal file
@ -0,0 +1,82 @@
|
||||
|
||||
var YTdeferred = jQuery.Deferred();
|
||||
|
||||
window.onYouTubeIframeAPIReady = function() {
|
||||
YTdeferred.resolve(window.YT);
|
||||
};
|
||||
|
||||
(function( $ ) {
|
||||
|
||||
$.ajaxSetup({
|
||||
cache: true
|
||||
});
|
||||
|
||||
$.getScript( "https://www.youtube.com/iframe_api")
|
||||
.done(function( script, textStatus ) {
|
||||
});
|
||||
|
||||
$.fn.simplePlayer = function() {
|
||||
|
||||
var video = $(this);
|
||||
|
||||
var play = $('<div />', { id: 'play' }).hide();
|
||||
|
||||
var defaults = {
|
||||
autoplay: 1,
|
||||
autohide: 1,
|
||||
border: 0,
|
||||
wmode: 'opaque',
|
||||
enablejsapi: 1,
|
||||
modestbranding: 1,
|
||||
version: 3,
|
||||
hl: 'en_US',
|
||||
rel: 0,
|
||||
showinfo: 0,
|
||||
hd: 1,
|
||||
iv_load_policy: 3 // add origin
|
||||
};
|
||||
|
||||
// onYouTubeIframeAPIReady
|
||||
|
||||
YTdeferred.done(function(YT) {
|
||||
play.appendTo( video ).fadeIn('slow');
|
||||
});
|
||||
|
||||
function onPlayerStateChange(event) {
|
||||
if (event.data == YT.PlayerState.ENDED) {
|
||||
play.fadeIn(500);
|
||||
}
|
||||
}
|
||||
|
||||
function onPlayerReady(event) {
|
||||
var replay = document.getElementById('play');
|
||||
replay.addEventListener('click', function() {
|
||||
player.playVideo();
|
||||
});
|
||||
}
|
||||
|
||||
play.bind('click', function () {
|
||||
|
||||
if ( !$('#player' ).length ) {
|
||||
|
||||
$('<iframe />', {
|
||||
id: 'player',
|
||||
src: 'https://www.youtube.com/embed/' + video.data('video') + '?' + $.param(defaults)
|
||||
})
|
||||
.attr({ width: video.width(), height: video.height(), seamless: 'seamless' })
|
||||
.css('border', 'none')
|
||||
.appendTo( video );
|
||||
|
||||
video.children('img').hide();
|
||||
|
||||
$(this).css('background-image', 'url(play-button.png), url(' + video.children().attr('src') + ')').hide();
|
||||
|
||||
player = new YT.Player('player', {events: {'onStateChange': onPlayerStateChange, 'onReady': onPlayerReady}});
|
||||
}
|
||||
|
||||
$(this).hide();
|
||||
});
|
||||
|
||||
return this;
|
||||
};
|
||||
}( jQuery ));
|
||||
@ -47,11 +47,12 @@
|
||||
<h3>Transition urbaine</h3>
|
||||
{% if post.video_la_mine %}
|
||||
<figure class="row mx-0">
|
||||
<div class="cover">
|
||||
{# <div class="cover">
|
||||
<img id="thumbnails" src="http://img.youtube.com/vi/XUsBV5mXJGs/maxresdefault.jpg" alt="thumbnail">
|
||||
<img id="player" src="{{theme.link}}/dist/assets/images/player.svg" alt="player">
|
||||
</div>
|
||||
<iframe id="playVideo" src="https://www.youtube.com/embed/XUsBV5mXJGs?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
|
||||
</div> #}
|
||||
<div id="ytplayer"></div>
|
||||
{# <iframe id="playVideo" src="https://www.youtube.com/embed/XUsBV5mXJGs?enablejsapi=1" frameborder="0" allowfullscreen></iframe> #}
|
||||
</figure>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
@ -47,9 +47,6 @@
|
||||
<div class="places">{{item.informations_lieu}}</div>
|
||||
</div>
|
||||
</figcaption>
|
||||
|
||||
|
||||
</figure>
|
||||
|
||||
</a>
|
||||
</article>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user