인트로 유튜브로 수정

This commit is contained in:
2024-08-05 22:16:18 +09:00
parent d693f7e152
commit fcc90fcddf
7 changed files with 88 additions and 101 deletions

View File

@@ -712,19 +712,19 @@ $(document).on("click", ".displayTheme .dtthumb", function () {
function pdpIntro() {
// dpThemeVideo 요소가 존재하는지 확인
if ($(".video_wrap video").length > 0) {
if ($(".video_wrap").length > 0) {
// .video_wrap 내 모든 비디오 요소 선택
const videoElements = document.querySelectorAll(".video_wrap video");
let cookieVal;
$(".editorWarp").addClass("playing");
const youtubeId = $('.youtube-box').data('youtube');
const youtubeFrame = '<iframe src="https://www.youtube.com/embed/'+youtubeId+'?autoplay=1&controls=1&rel=0&showsearch=0" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>';
$('.editorWarp .youtube-box').html(youtubeFrame);
switch (true) {
case $(".displayTheme").length > 0:
cookieVal = "displayThemeIntro";
$(".video_wrap video").attr(
"poster",
"../assets/images/kia/pdp/display_theme/intro_poster.png"
);
break;
case $(".inCarGame").length > 0:
cookieVal = "inCarGameIntro";
@@ -746,27 +746,56 @@ function pdpIntro() {
`<span onclick="hideTodayIntroPopup('${cookieVal}')" style="cursor:pointer"><input type="checkbox"> 오늘 하루 재생하지 않기</span>`
);
$(".btn-intro").css("display", "flex");
$(".btn-intro").css({"display":"flex","opacity":"0", "top":"8rem"}).animate({"opacity":"1", "top":"5rem"},400);
if (getCookie(cookieVal)) {
$(".editorWarp").removeClass("playing");
$(".video_wrap").css("display", "none");
$(".close-today input").attr("checked", "checked");
videoElements[0].pause();
videoElements[0].currentTime = 0;
// videoElements[0].pause();
// videoElements[0].currentTime = 0;
$(".close-today").html(
`<span onclick="deleteCookie('${cookieVal}')" style="cursor:pointer"><input type="checkbox"> 오늘 하루 재생하지 않기</span>`
);
} else {
$(".video_wrap").css("display", "flex");
$(".video_wrap").css({"display":"flex","opacity":"0"}).animate({"opacity":"1"},200);
$(".close-today").html(
`<span onclick="hideTodayIntroPopup('${cookieVal}')" style="cursor:pointer"><input type="checkbox"> 오늘 하루 재생하지 않기</span>`
);
}
const videoWrap = $(".editorWarp .video_wrap");
// .btn-intro 버튼 클릭 시 비디오 재생
$(document).on("click", ".editorWarp .btn-intro", function () {
// console.log('intro 다시 실행');
$(".editorWarp").addClass("playing");
if (getCookie(cookieVal)) {
$(".close-today input").attr("checked", "checked");
}
$('.editorWarp .youtube-box').html(youtubeFrame);
$(videoWrap).show();
// if (video) {
// video.currentTime = 0;
// video.play();
// }
});
// .btn-close 버튼 클릭 시 비디오 숨기기
$(document).on("click", ".video_wrap .btn-close", function () {
console.log('btn close 실행');
$(".editorWarp").removeClass("playing");
$(videoWrap).hide();
$('.editorWarp .youtube-box').empty();
// if (video) {
// video.currentTime = 0;
// video.pause();
// }
});
/*
videoElements.forEach((video) => {
const videoWrap = $(".editorWarp .video_wrap");
const btnIntro = $(".editorWarp .btn-intro");
const btnClose = $(".video_wrap .btn-close");
const btnPlay = $(".video_wrap .btn-play");
@@ -806,32 +835,8 @@ function pdpIntro() {
videoWrap.removeClass("paused");
});
}
// .btn-intro 버튼 클릭 시 비디오 재생
$(document).on("click", ".editorWarp .btn-intro", function () {
// console.log('intro 다시 실행');
$(".editorWarp").addClass("playing");
if (getCookie(cookieVal)) {
$(".close-today input").attr("checked", "checked");
}
$(videoWrap).show();
if (video) {
video.currentTime = 0;
video.play();
}
});
// .btn-close 버튼 클릭 시 비디오 숨기기
$(document).on("click", ".video_wrap .btn-close", function () {
// console.log('btn close 실행');
$(".editorWarp").removeClass("playing");
$(videoWrap).hide();
if (video) {
video.currentTime = 0;
video.pause();
}
});
});
*/
// 주석 처리된 부분: 버튼 클릭 시 비디오 숨기기
// $(btnClose).on('click', function() {