Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.08.2019, 19:01
Аспирант
Отправить личное сообщение для noid Посмотреть профиль Найти все сообщения от noid
 
Регистрация: 16.09.2012
Сообщений: 38

Добавить cookie к play/pause фонового видео
Доброго времени суток. Не могу разобраться с cookie, да и не хочу особо вникать. Мне просто нужен рабочий код, донатик за рабочее решение скину. Код:
$('.video-control').on('click', function () {
    $(this).toggleClass('video-control_active');
    var currentVideo = document.querySelector('.play');
    if (currentVideo.paused) {
        currentVideo.play();
    } else {
        currentVideo.pause()
    }
})

Нужно, чтоб запоминал вкл/выкл после перезагрузки страницы. Jquery подключена. Заранее благодарен
Ответить с цитированием
  #2 (permalink)  
Старый 10.08.2019, 19:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,103

noid,
$(function() {
var currentVideo = document.querySelector('.play');
var paused = 'paused' in localStorage;
if(paused  == 'false') {
  currentVideo.play();
  $('.video-control').addClass('video-control_active');
}
$('.video-control').on('click', function () {
    $(this).toggleClass('video-control_active');
    if (currentVideo.paused) {
        currentVideo.play();
        localStorage.paused = 'false'
    } else {
        currentVideo.pause();
        localStorage.paused = 'true'
    }
})
});

Последний раз редактировалось рони, 10.08.2019 в 19:23.
Ответить с цитированием
  #3 (permalink)  
Старый 11.08.2019, 19:04
Аспирант
Отправить личное сообщение для noid Посмотреть профиль Найти все сообщения от noid
 
Регистрация: 16.09.2012
Сообщений: 38

Сообщение от рони Посмотреть сообщение
noid,
$(function() {
var currentVideo = document.querySelector('.play');
var paused = 'paused' in localStorage;
if(paused  == 'false') {
  currentVideo.play();
  $('.video-control').addClass('video-control_active');
}
$('.video-control').on('click', function () {
    $(this).toggleClass('video-control_active');
    if (currentVideo.paused) {
        currentVideo.play();
        localStorage.paused = 'false'
    } else {
        currentVideo.pause();
        localStorage.paused = 'true'
    }
})
});
Спасибо, в локалсторадж пишет. Я должен был сразу весь код выложить, мой бок. После перезагрузки страницы видео запускается, даже при сохраненном TRUE в сторадже. Видимо очередность видео мешает. Скинул весь js-ник в личку

Последний раз редактировалось noid, 12.08.2019 в 14:37.
Ответить с цитированием
  #4 (permalink)  
Старый 11.08.2019, 20:41
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,103

noid,
playlist();

	$(function() {
	var currentVideo = document.querySelector('.play');
	var paused = 'paused' in localStorage;
	if(paused  == 'false') {
	  currentVideo.play();
	  $('.video-control').addClass('video-control_active');
	}
	$('.video-control').on('click', function () {
	    $(this).toggleClass('video-control_active');
	    if (currentVideo.paused) {
	        currentVideo.play();
	        localStorage.paused = 'false'
	    } else {
	        currentVideo.pause();
	        localStorage.paused = 'true'
	    }
	})
	});

заменить на
if(localStorage.paused !== 'true') playlist();
    $('.video-control').on('click', function () {
        $(this).toggleClass('video-control_active');
        var currentVideo = document.querySelector('.play');
        if (currentVideo  && currentVideo.paused) {
            currentVideo.play();
            localStorage.paused = 'false'
        } else {
            currentVideo.pause();
            localStorage.paused = 'true'
        }
    })

Последний раз редактировалось рони, 11.08.2019 в 23:28.
Ответить с цитированием
  #5 (permalink)  
Старый 11.08.2019, 22:49
Аспирант
Отправить личное сообщение для noid Посмотреть профиль Найти все сообщения от noid
 
Регистрация: 16.09.2012
Сообщений: 38

Сообщение от рони Посмотреть сообщение
noid,
... заменить на
if(localStorage.paused !== 'true') playlist();
    $('.video-control').on('click', function () {
        $(this).toggleClass('video-control_active');
        if (currentVideo.paused) {
            currentVideo.play();
            localStorage.paused = 'false'
        } else {
            currentVideo.pause();
            localStorage.paused = 'true'
        }
    })
Так перестало останавливаться видео и ничего не пишется в сторадж, но класс 'video-control_active' тоглится. Попробовал так:
if(localStorage.paused !== 'true') playlist();

	$(function() {
	var currentVideo = document.querySelector('.play');
	var paused = 'paused' in localStorage;
	if(paused  == 'false') {
	  currentVideo.play();
	  $('.video-control').addClass('video-control_active');
	}
	$('.video-control').on('click', function () {
	    $(this).toggleClass('video-control_active');
	    if (currentVideo.paused) {
	        currentVideo.play();
	        localStorage.paused = 'false'
	    } else {
	        currentVideo.pause();
	        localStorage.paused = 'true'
	    }
	})
	});

В сторадж пишется и видео реагирует на кнопку. Перезагружаю страницу из состояния:

1. Видео на паузе, сторадж=true -> в итоге видео висит на паузе и не реагирует на кнопку play. И сторадж не обновляется.

2. Перезагружаю, когда видео проигрывается и сторадж=false -> и видео и сторадж работают как надо
Ответить с цитированием
  #6 (permalink)  
Старый 11.08.2019, 23:39
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,103

noid,
пробуйте, заменить на
if(localStorage.paused !== 'true') playlist();
    else {
        videos[currPlayVideo].classList.add('play');
        videos[currPlayVideo].onended = function () {
            playNextVideo();
        };
        $('.video-control').remove('video-control_active');
    };
    $('.video-control').on('click', function () {
        var currentVideo = document.querySelector('.play');
        $(this).toggleClass('video-control_active');
        if (currentVideo.paused) {
            currentVideo.play();
            localStorage.paused = 'false'
        } else {
            currentVideo.pause();
            localStorage.paused = 'true'
        }
    })
Ответить с цитированием
  #7 (permalink)  
Старый 12.08.2019, 13:52
Аспирант
Отправить личное сообщение для noid Посмотреть профиль Найти все сообщения от noid
 
Регистрация: 16.09.2012
Сообщений: 38

Сообщение от рони Посмотреть сообщение
noid,
пробуйте, заменить на
if(localStorage.paused !== 'true') playlist();
    else {
        videos[currPlayVideo].classList.add('play');
        videos[currPlayVideo].onended = function () {
            playNextVideo();
        };
        $('.video-control').remove('video-control_active');
    };
    $('.video-control').on('click', function () {
        var currentVideo = document.querySelector('.play');
        $(this).toggleClass('video-control_active');
        if (currentVideo.paused) {
            currentVideo.play();
            localStorage.paused = 'false'
        } else {
            currentVideo.pause();
            localStorage.paused = 'true'
        }
    })
Отлично! Все работает, за исключением состояния (внешнего вида) кнопки. Подскажите пожалуйста, как добавить проверку - если localStorage.paused == true -> тогда addClass('video-control_active') при загрузке страницы?

Последний раз редактировалось noid, 12.08.2019 в 14:05.
Ответить с цитированием
  #8 (permalink)  
Старый 12.08.2019, 14:13
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,103

noid,
так может строка 7 ненужна?
Ответить с цитированием
  #9 (permalink)  
Старый 12.08.2019, 14:26
Аспирант
Отправить личное сообщение для noid Посмотреть профиль Найти все сообщения от noid
 
Регистрация: 16.09.2012
Сообщений: 38

Сообщение от рони Посмотреть сообщение
noid,
так может строка 7 ненужна?
По верстке нужна, но я уже вроде нашел решение. Добавил кусок, теперь как надо:
if (localStorage.getItem("paused") == "true") {
	  getFav = localStorage.paused;
	  $(".video-control").addClass('video-control_active');
	}


Спасибо Вам за помощь!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Видео без <VIDEO> и FLASH DIGIUS Общие вопросы Javascript 1 25.10.2016 03:34
Сайт торент видео онлайн (через браузер). nemo84 Ваши сайты и скрипты 1 18.05.2013 21:07
Как добавить таблицу в cookie? jQuery derbass jQuery 7 24.12.2012 08:05