이미지 삭제 기능을 추가하고 NCue 로고를 제거한다.

썸네일에서 서버의 실제 이미지 파일을 안전하게 삭제하고 갤러리 상태를 동기화한다.

Co-authored-by: Cursor <cursoragent@cursor.com>

js/bestpic.js

@@ -2,6 +2,95 @@ var refreshIntervalId = null;
 // Prefer same-origin relative paths so HTTPS doesn't break due to mixed-content / upgrade rules.
 var imgurl = "img/";
 
+function buildThumbLi(filename) {
+    var imgfile = imgurl + encodeURIComponent(filename);
+    return (
+        "<li data-filename='" + filename.replace(/'/g, "&#39;") + "'>" +
+        "  <button type='button' class='thumb-delete' title='삭제' aria-label='삭제'>&times;</button>" +
+        "  <a class='thumb' name='leaf' href='" + imgfile + "' title='" + filename.replace(/'/g, "&#39;") + "'>" +
+        "    <img src='" + imgfile + "' alt='" + filename.replace(/'/g, "&#39;") + "' width='75' height='75'/>" +
+        "  </a>" +
+        "  <div class='caption'></div>" +
+        "</li>"
+    );
+}
+
+function removeFromImageList(filename) {
+    if (!window.DREAMGIRL_IMAGES || !window.DREAMGIRL_IMAGES.length) return;
+    var idx = window.DREAMGIRL_IMAGES.indexOf(filename);
+    if (idx >= 0) window.DREAMGIRL_IMAGES.splice(idx, 1);
+}
+
+function deleteImageFile(filename, onSuccess, onError) {
+    var fd = new FormData();
+    fd.append('filename', filename);
+
+    fetch('api/delete_image.php', {
+        method: 'POST',
+        body: fd,
+        credentials: 'same-origin'
+    })
+        .then(function (r) { return r.json(); })
+        .then(function (data) {
+            if (!data || !data.ok) {
+                throw new Error((data && data.error) ? data.error : '삭제 실패');
+            }
+            if (typeof onSuccess === 'function') onSuccess(data);
+        })
+        .catch(function (err) {
+            if (typeof onError === 'function') {
+                onError(err);
+            } else {
+                alert('에러: ' + (err && err.message ? err.message : '삭제 실패'));
+            }
+        });
+}
+
+function bindThumbDeleteHandler() {
+    $('#thumbs').off('click.thumbDelete', '.thumb-delete');
+    $('#thumbs').on('click.thumbDelete', '.thumb-delete', function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+
+        var $li = $(this).closest('li');
+        var filename = $li.attr('data-filename');
+        if (!filename) return;
+
+        if (!window.confirm('이 이미지를 삭제하시겠습니까?\n' + filename)) return;
+
+        var $btn = $(this);
+        $btn.prop('disabled', true);
+
+        deleteImageFile(filename, function () {
+            removeFromImageList(filename);
+
+            if (window.dreamgirlGallery) {
+                var gallery = window.dreamgirlGallery;
+                var index = $li.index();
+                var wasCurrent = gallery.currentImage && gallery.currentImage.index === index;
+
+                if (typeof gallery.removeImageByIndex === 'function') {
+                    gallery.removeImageByIndex(index);
+                } else {
+                    $li.remove();
+                }
+
+                if (wasCurrent && gallery.data && gallery.data.length) {
+                    var nextIndex = Math.min(index, gallery.data.length - 1);
+                    if (typeof gallery.gotoIndex === 'function') {
+                        gallery.gotoIndex(nextIndex);
+                    }
+                }
+            } else {
+                $li.remove();
+            }
+        }, function (err) {
+            $btn.prop('disabled', false);
+            alert('에러: ' + (err && err.message ? err.message : '삭제 실패'));
+        });
+    });
+}
+
 function getApiUrl() {
     // Use scheme-relative URL so it matches http/https of the current page.
     // NOTE: if the API does not support https, consider proxying it via Apache and pointing to a same-origin endpoint.
@@ -87,17 +176,12 @@ function onLoad() {
 
         for (var i=0; i<rid.length; i++) {
             var fname = fileNames[rid[i]];
-            var imgfile = imgurl + encodeURIComponent(fname);
-            text += "<li>";
-            text += "  <a class='thumb' name='leaf' href='" + imgfile + "' title='girl" + (i+1) + "'>";
-            text += "    <img src='" + imgfile + "' alt='girl" + (i+1) + "' width='75' height='75'/>";
-            text += "  </a>";
-            text += "  <div class='caption'></div>";
-            text += "</li>";
+            text += buildThumbLi(fname);
         }
         text += "</ul>";
         $("#thumbs-list").html(text);
         initGallery();
+        bindThumbDeleteHandler();
     }
 
     function tryLoadFromLocalListApi() {