Tạo liên kết chia sẻ lên social

frontend/css/style.css

@@ -293,7 +293,7 @@ html, body {
 
 #user-dropdown .btn-group button:hover, #user-dropdown button:hover {
     background-color: rgba(255, 255, 255, 0.1); /* Hiệu ứng hover nhẹ */
-    color: #fff;
+    color: #ffffff;
 }
 
 #user-dropdown button:last-child {
@@ -880,6 +880,16 @@ html, body {
     color: #fff;
 }
 
+/* Tùy chỉnh màu sắc cho danh sách lựa chọn (dropdown options) trong modal tối */
+#edit-scene-metadata-modal select option {
+    background-color: #000; /* Nền đen cho các item */
+    color: #fff; /* Chữ trắng */
+}
+
+#edit-scene-metadata-modal select option:hover {
+    background-color: #555; /* Nền xám khi di chuột qua (tùy trình duyệt hỗ trợ) */
+}
+
 #edit-mini-map {
     height: 200px;
     width: 100%;
@@ -911,7 +921,7 @@ html, body {
 .admin-table input, .admin-table select {
     background: rgba(255, 255, 255, 0.05) !important;
     border: 1px solid rgba(255, 255, 255, 0.1) !important;
-    color: #fff !important;
+    color: #ffffff !important;
     padding: 5px !important;
     border-radius: 4px;
     width: 100%;
@@ -921,7 +931,7 @@ html, body {
 .privacy-settings-btn {
     background: rgba(255, 255, 255, 0.1);
     border: 1px solid rgba(255, 255, 255, 0.2);
-    color: white;
+    color: rgb(255, 255, 255);
     padding: 8px 12px;
     border-radius: 4px;
     cursor: pointer;

frontend/js/main_map.js

@@ -717,8 +717,13 @@ async function loadScenes() {
 
                 // Phân quyền: Admin hoặc Chủ sở hữu Scene
                 const isAdmin = userRole === 'admin' || userRole === 'Chủ sở hữu';
-                if (isAdmin || (currentUserId && ownerId && ownerId.toString() === currentUserId.toString())) {
+                const isOwner = currentUserId && ownerId && ownerId.toString() === currentUserId.toString();
+
+                if (isAdmin || isOwner) {
                     handleEditDeleteScene(scene);
+                } else if (scene.privacy === 'public') {
+                    // Cho phép bất kỳ ai (kể cả khách) lấy link chia sẻ của scene công khai
+                    showShareLink(scene);
                 } else {
                     showNotification("Bạn không có quyền chỉnh sửa scene này.", 'warning');
                 }
@@ -917,6 +922,12 @@ async function openScene(sceneId, privacy, shareToken, force = false, initialPit
         // Initialize 3D Viewer with secure, referer-protected image stream
         initPanoramaViewer(secureImageUrl, hotspots || [], sceneOwnerId, initialPitch, initialYaw);
 
+        // Sau khi mở thành công từ URL trực tiếp, xóa tham số để làm sạch thanh địa chỉ (URL chuyên nghiệp)
+        const urlParams = new URLSearchParams(window.location.search);
+        if (urlParams.has('sceneId')) {
+            window.history.replaceState({}, document.title, "/");
+        }
+
     } catch (error) {
         if (typeof closeViewer === 'function') closeViewer();
 
@@ -929,7 +940,7 @@ async function openScene(sceneId, privacy, shareToken, force = false, initialPit
         if (urlParams.has('sceneId')) {
             showNotification("Bạn không có quyền truy cập hoặc liên kết chia sẻ đã hết hạn. Quay về bản đồ công cộng.", 'error');
             // Xóa toàn bộ tham số URL và tải lại trang để làm mới trạng thái (về trang chủ dành cho khách)
-            window.history.replaceState({}, document.title, window.location.pathname);
+            window.history.replaceState({}, document.title, "/");
             location.reload();
             return;
         }
@@ -1763,14 +1774,28 @@ window.openPrivacySettingsModal = function() {
     if (privacy === 'member') {
         renderSharedList();
         document.getElementById('share-member-modal').style.display = 'flex';
-    } else if (privacy === 'shared') {
-        const baseUrl = window.location.origin + window.location.pathname;
-        const token = currentEditingScene.shareToken || 'đang_tạo_mới...';
-        document.getElementById('shared-link-input').value = `${baseUrl}?sceneId=${currentEditingScene._id}&token=${token}`;
-        document.getElementById('share-link-modal').style.display = 'flex';
+    } else if (privacy === 'shared' || privacy === 'public') {
+        showShareLink(currentEditingScene);
     }
 };
 
+/**
+ * Hiển thị modal lấy link chia sẻ (dùng cho cả khách và chủ sở hữu)
+ * @param {Object} scene - Đối tượng Scene cần lấy link
+ */
+window.showShareLink = function(scene) {
+    if (!scene) return;
+    
+    // Lưu lại scene đang tương tác để các logic phụ trợ hoạt động đồng bộ
+    currentEditingScene = scene;
+
+    // Trỏ link vào endpoint /api/share/ để hỗ trợ Open Graph (ảnh thumbnail Facebook/Zalo)
+    const baseUrl = window.location.origin + '/api/share/';
+    const token = scene.shareToken || '';
+    document.getElementById('shared-link-input').value = `${baseUrl}${scene._id}${token ? '?token=' + token : ''}`;
+    document.getElementById('share-link-modal').style.display = 'flex';
+};
+
 /**
  * Tìm kiếm người dùng để chia sẻ
  */