Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Воспроизведение видео на сайте по расписанию. (https://javascript.ru/forum/misc/71222-vosproizvedenie-video-na-sajjte-po-raspisaniyu.html)

Grasss 05.11.2017 10:46

Воспроизведение будет осуществляться этой функцией через 2 сек после загрузки страницы
<script class="source" type="text/javascript">
$('.countdown').downCount({date:'11/04/2017 23:30:00',offset: +3},function (){
function foo(){$("#start").click();}setTimeout(foo, 2000);
});</script>

работает во всех браузерах на пк, а вот на iphone в браузерах safari, chrome и яндекс функция
function foo(){$("#start").click();}setTimeout(foo, 2000);
отказывается работать, она работает только в opera.

Rasy 05.11.2017 15:05

Цитата:

Сообщение от Grasss
работает во всех браузерах на пк, а вот на iphone в браузерах safari, chrome и яндекс функция

Думаю там другая ошибка. Чтобы узнать, нужно протестировать на одном из мобильных браузеров, заглянув в консоль браузера.

Grasss 05.11.2017 20:09

Если нажимать кнопки start / stopp, то всё работает, а вот автоклик после setTimeout капризный. Будет время у вас, посмотрите в чем может быть дело. А что если попробовать заменить setTimeout на var start_time = '21:52'; для старта вещания, а потом функция var end_time = '23:52'; останавливает видео)

Примерно так:
function (){$("#start").click();}var start_time = '21:52';

function (){$("#stopp").click();}var end_time = '23:52';

Rasy 05.11.2017 20:46

Так должно сработать
function onPlayerReady(event) {
		start.onclick = function() {
			event.target.playVideo();
		};
		setTimeout(function() {
			start.click();
		}, 2000);
}

рони 05.11.2017 21:58

:write:

попробуйте заменить id start на что-то другое, можно даже startt

Rasy 05.11.2017 22:15

рони,
Со start работает я проверял. Вот со stop была такая ситуация. Возможно с play бы не сработало. Но да, аспект важный:)

fass 06.11.2017 03:27

Цитата:

Сообщение от Grasss (Сообщение 469225)
Огромное спасибо за помощь :thanks:

Цитата:

Сообщение от Rasy (Сообщение 469162)
Это не нужно. Если пользователь зайдет в Сиднее в 17:40, а начало запланировано на 17:30, то перемотается 10 минут ролика. Тем времен в Москве будет утро.

В модальное окно нужно добавить див <div id="player"></div>, и удалить текущий ифрейм. Скрипт сам добавит его.

Да. В функциях onPlayerReady, stopVideo дописать логику.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Воспроизведение видео на сайте по расписанию</title>
</head>
<body>
	<div id="player"></div>
	<div>
		<button type="button" id="start">start</button>
		<button type="button" id="stopp">stop</button>
	</div>
	<script type="text/javascript"></script>
	<script>
			var start_time = '21:52';
			var end_time = '23:52';
			start_time = start_time.split(':');
			end_time = end_time.split(':');

			var tag = document.createElement('script');
			tag.src = "https://www.youtube.com/iframe_api";
			var firstScriptTag = document.getElementsByTagName('script')[0];
			firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

			var player;
			function onYouTubeIframeAPIReady() {
				player = new YT.Player('player', {
					height: '315',
					width: '560',
					videoId: 'dwiGTtbo6WM',
					events: {
						'onReady': onPlayerReady,
						'onStateChange': onPlayerStateChange
					}
				});
			}
			
			function onPlayerReady(event) {
					start.onclick = function() {
						event.target.playVideo();
					};
			}

			var jump = false;
			function onPlayerStateChange(event) {
				if (event.data == YT.PlayerState.PLAYING && !jump) {
					player.seekTo(getSeconds());
					jump = true;
				}
			}
			function stopVideo() {
				player.stopVideo();
			}
			stopp.onclick = function() {
				stopVideo();
			};

			var d = new Date();
			var h = d.getHours();
			var m = d.getMinutes();
			function getSeconds() {
				if (h > end_time[0] || h == end_time[0] && m > end_time[1]) return 0;
				if (h >= start_time[0]) {
					var time_now = d;
					var time_start = new Date(d.getFullYear(), d.getMonth(), d.getDate(), start_time[0], start_time[1]);
					var time_end = new Date(d.getFullYear(), d.getMonth(), d.getDate(), end_time[0], end_time[1]);
					return ((time_end - time_start) - (time_end - time_now)) / 1000;
				}
				return 0;
			}

	</script>
</body>
</html>


Возможна ли реализация данного решения, но уже к видео лежащему в папке сайта на хостинге? <video src="video/test.mp4"></video>

Rasy 06.11.2017 11:35

Цитата:

Сообщение от fass
Возможна ли реализация данного решения, но уже к видео лежащему в папке сайта на хостинге?

Решения для видео из ютуба.

рони 06.11.2017 11:47

:-?
<video></video> и video.currentTime

Grasss 06.11.2017 20:54

Если видео достаточно увесистое, то подгружаясь с хостинга оно съест кучу трафика и не факт что твой проигрыватель будет корректно отображаться всеми устройствами, поэтому для этих целей вполне хватит и YouTube, он оптимизирован под все устройства и быстро загружает контент, не съедая тонны трафика. Другое дело, если ты загружаешь видео нарушающее авторские права и тп, которое YouTube не пропустит, тут уже потребуются другие видеохостинги.


Часовой пояс GMT +3, время: 09:06.