123

커뮤니티

123

애니멀 집소개 목록 | 이전글 | 다음글

123 (0)

메르세데스마이바흐S [가입일 : 2016-11-18]

추천 0 | 조회 1,403

작성일 2024.09.25 (23:19:45)

IP :

게시글 0 | 댓글 2

URL복사 https://www.animalnara.com/community/board_view.php?board_code=home&idx=5264&search_by=title

7 type="text/javascript" src="../js/jquery-3.7.0.min.js"> > // 페이지 로드 시 다크 모드 설정 window.addEventListener("DOMContentLoaded", function() { var storedColorMode = window.localStorage.getItem("color_mode"); var defaultColorMode = storedColorMode || ""; document.body.classList.toggle("dark", defaultColorMode === "dark"); }); // 클릭 시 삭제 및 대표사진 설정 버튼 표시 function showMediaButtons(event, mediaElement) { // 이벤트 전파 방지 event.stopPropagation(); // 기존 버튼 제거 document.querySelector('.delete-button')?.remove(); // 기존의 하이라이트 해제 document.querySelectorAll('img, video').forEach(el => el.classList.remove('highlight')); // 하이라이트 추가 mediaElement.classList.add('highlight'); // 현재 클릭된 미디어가 대표사진이 아닌 경우 if (mediaElement.id !== 'representativeMedia') { // 기존의 대표사진 해제 var currentRepresentative = document.getElementById('representativeMedia'); if (currentRepresentative) { currentRepresentative.id = ''; // 기존 대표사진 ID 초기화 // 기존 대표사진의 버튼도 제거 document.querySelector('.representative-button')?.remove(); } } // 대표사진 버튼 생성 var representativeButton = createRepresentativeButton(mediaElement); setButtonPosition(representativeButton, mediaElement, 10); document.body.appendChild(representativeButton); // 대표사진 버튼 추가 // 삭제 버튼 생성 var deleteButton = document.createElement('div'); deleteButton.className = 'delete-button'; setButtonPosition(deleteButton, mediaElement, 10, true); // 크기 조정 버튼 생성 createSizeButtons(deleteButton, mediaElement); // 삭제 버튼 클릭 시 처리 var deleteIconButton = document.createElement('div'); deleteIconButton.className = 'icon-button'; deleteIconButton.innerHTML = ' 삭제'; deleteIconButton.onclick = function() { handleDelete(mediaElement); deleteButton.remove(); representativeButton.remove(); // 대표사진 버튼 제거 mediaElement.classList.remove('highlight'); }; deleteButton.appendChild(deleteIconButton); document.body.appendChild(deleteButton); } // 대표사진 버튼 생성 (id로 설정) function createRepresentativeButton(mediaElement) { var representativeButton = document.createElement('div'); representativeButton.id = 'representativeButton'; // ID 추가 representativeButton.className = 'representative-button'; representativeButton.innerHTML = '대표사진'; // 미디어의 기존 대표사진 상태 확인 if (mediaElement.id === 'representativeMedia') { representativeButton.style.backgroundColor = '#cf3a3a'; // 강조 배경색 representativeButton.style.color = '#fff'; // 강조 글자색 } representativeButton.onclick = function() { // 대표사진 해제 및 유지 if (mediaElement.id === 'representativeMedia') { mediaElement.id = ''; // ID 초기화 representativeButton.style.backgroundColor = 'rgba(255, 255, 255, 0.8)'; // 기본 배경색 representativeButton.style.color = 'black'; // 기본 글자색 alert("대표사진 해제되었습니다."); } else { mediaElement.id = 'representativeMedia'; // 대표사진 설정 representativeButton.style.backgroundColor = '#cf3a3a'; // 강조 배경색 representativeButton.style.color = '#fff'; // 강조 글자색 alert("대표사진으로 설정되었습니다."); } }; return representativeButton; } // 버튼 위치 설정 function setButtonPosition(button, mediaElement, offset, isBelow = false) { var rect = mediaElement.getBoundingClientRect(); button.style.top = (isBelow ? rect.bottom : rect.top) + window.scrollY + offset + 'px'; button.style.left = (rect.left + window.scrollX + 10) + 'px'; } // 크기 조정 버튼 생성 function createSizeButtons(container, mediaElement) { var sizes = [100, 75, 50, 25]; // 비율 배열 sizes.forEach(size => { var iconButton = document.createElement('div'); iconButton.className = 'icon-button'; iconButton.innerHTML = '' + size + '%'; iconButton.onclick = function() { if (mediaElement.tagName === 'VIDEO') { adjustVideoSize(mediaElement, size); } else if (mediaElement.tagName === 'IMG') { adjustImageSize(mediaElement, size); } container.remove(); }; container.appendChild(iconButton); }); // 원래 크기 버튼 추가 var originalSizeButton = document.createElement('div'); originalSizeButton.className = 'icon-button'; originalSizeButton.innerHTML = ' 원래 사이즈'; originalSizeButton.onclick = function() { if (mediaElement.tagName === 'VIDEO') { resetVideoSize(mediaElement); } else if (mediaElement.tagName === 'IMG') { resetImageSize(mediaElement); } container.remove(); }; container.appendChild(originalSizeButton); } // 삭제 요청을 위한 URL 생성 및 AJAX 호출 function handleDelete(mediaElement) { var dataUrl = mediaElement.closest('.video-container')?.getAttribute('data-url') || mediaElement.closest('.image-container')?.getAttribute('data-url'); var thumbnailUrl = mediaElement.closest('.video-container') ? dataUrl.replace(/\.mp4$/, '_mp4_thumb.jpg') : null; var nonce = localStorage.getItem('ed_nonce') || ''; if (!nonce || !dataUrl) { console.error("Nonce value or data URL is missing."); return; } var deleteRequestUrl = "https://www.animalnara.com/editor/photo_uploader/popup/php/index.php?_nonce=" + encodeURIComponent(nonce) + "&act=photo_delete"; $.ajax({ url: deleteRequestUrl, type: 'POST', data: { photo_url: dataUrl, video_thumbnail_url: thumbnailUrl }, success: function (response) { alert("삭제가 완료되었습니다."); mediaElement.closest('.video-container')?.remove(); mediaElement.closest('.image-container')?.remove(); }, error: function () { alert("삭제 요청 중 오류가 발생했습니다."); } }); } // 이미지 크기 조정 function adjustImageSize(img, percentage) { img.style.width = (percentage) + '%'; } // 이미지 원래 크기 복원 function resetImageSize(img) { img.style.width = ''; } // 비디오 크기 조정 function adjustVideoSize(video, percentage) { video.style.width = (percentage) + '%'; } // 비디오 원래 크기 복원 function resetVideoSize(video) { video.style.width = ''; } // 비디오 드래그 기능 추가 $(document).on('mousedown', 'video', function(e) { e.preventDefault(); // 기본 드래그 방지 var video = $(this); var startX = e.pageX - video.position().left; var startY = e.pageY - video.position().top; $(document).on('mousemove.drag', function(e) { // 에디터 컨테이너 내에서만 드래그 가능하도록 설정 var editorContainer = $('.editor-container'); var containerOffset = editorContainer.offset(); var containerWidth = editorContainer.width(); var containerHeight = editorContainer.height(); var newLeft = e.pageX - startX; var newTop = e.pageY - startY; // 에디터 컨테이너의 경계를 넘지 않도록 설정 if (newLeft containerOffset.left + containerWidth) { newLeft = containerOffset.left + containerWidth - video.width(); } if (newTop containerOffset.top + containerHeight) { newTop = containerOffset.top + containerHeight - video.height(); } video.css({ top: newTop, left: newLeft, position: 'absolute' }); }); $(document).one('mouseup', function() { $(document).off('mousemove.drag'); }); // 비디오 클릭 시 버튼 표시 $(document).on('click', 'video', function(event) { showMediaButtons(event, this); }); // 이미지 클릭 시 버튼 표시 $(document).on('click', 'img', function(event) { showMediaButtons(event, this); }); // 에디터 클릭 시 버튼 제거 $(document).on('click', '.editor-container', function() { document.querySelector('.delete-button')?.remove(); document.querySelector('.representative-button')?.remove(); document.querySelectorAll('img, video').forEach(el => el.classList.remove('highlight')); });

0 0

게시물을 뉴스에 인용할때에는 애니멀나라 출처를 꼭 밝혀주세요.
저작권 게시물 및 규정에 어긋난 게시글의 경우 삭제가 될 수 있습니다.

목록 신고

▼ 댓글 0 개

이전글 I 123

다음글 I 123

게시판 상단 공지/이벤트 리스트
번호	구분	제목	글쓴이	추천	조회	등록일
BEST	질문	123 (28)	메르세데스마이바흐S	0	2,191	2024.06.02
BEST	질문	321 (13)	메르세데스마이바흐S	1	2,235	2024.06.07
BEST	질문	12 (16)	메르세데스마이바흐S	0	3,887	2024.06.07
BEST	질문	ㅁ (18)	메르세데스마이바흐S	1	3,397	2024.06.07
이벤트	이벤트	안녕하세요 이벤트를 진행합니다, 강아지샘플사료를 무료로 드립니다. 많은참여 부탁드립니다.		0	1,303	2021.11.01

게시판 리스트
103		모바일ㅎㅇㄴ (1)	메르세데스마이바흐S	1,114	2024.11.26
102	질문	2 (7)	메르세데스마이바흐S	1,302	2024.10.19
101	질문	6 (1)	메르세데스마이바흐S	1,099	2024.10.17
100	질문	90	메르세데스마이바흐S	1,108	2024.10.17
99	질문	8	메르세데스마이바흐S	1,042	2024.10.17
98	질문	0-	메르세데스마이바흐S	990	2024.10.16
97	잡담	ㅎㅇ	메르세데스마이바흐S	1,031	2024.10.15
96	질문	90-	메르세데스마이바흐S	1,126	2024.10.14
95	질문	78	메르세데스마이바흐S	1,003	2024.10.11
94	잡담	87	메르세데스마이바흐S	985	2024.10.08
93	질문	234	메르세데스마이바흐S	1,000	2024.10.06
92	질문	89	메르세데스마이바흐S	1,051	2024.10.06
91	질문	890	메르세데스마이바흐S	1,058	2024.10.05
90	질문	23	메르세데스마이바흐S	1,052	2024.10.04
89	질문	1	메르세데스마이바흐S	1,013	2024.10.04
88	질문	890	메르세데스마이바흐S	983	2024.10.04
87	질문	ㅕ	메르세데스마이바흐S	1,051	2024.10.04
86	질문	78	메르세데스마이바흐S	995	2024.10.04
85	질문	76	메르세데스마이바흐S	1,024	2024.10.03
84	질문	87	메르세데스마이바흐S	1,022	2024.10.03

글쓰기

이전 1 2 3 4 5 6 다음

실시간 베스트 | 실시간 댓글순

렉스턴스포츠입니다.

판교 나들이

제네시스 330 리뷰

향이 좋은 디퓨저..

정원에 꽃이 활짝!

풍물놀이 중..

오늘점심은 닭볶음탕~!~

안녕하세요! 잘 부탁드립…

안성 팜랜드 호밀밭축제

가츠동

이번주 댓글순 | 추천순 | 조회순

1 눈구경하면서 창가에 앉아…
2 1
3 2
4 1
5 치킨은 역시 맵슐랭
6 123
7 지금 이영현 체념 부르는…
8 1
9 마우스패드 추천드림니다~…
10 123

제휴/광고문의

문의하기