jarianc/MovieMapper
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Add handleTagClick method and event listeners for tag icons

Browse Source
This commit is contained in:
Jarian Cottingham 2026-02-25 09:15:19 -06:00
parent cc30396b5c
commit 336d9fb98d
2 changed files with 47 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
utils/renderer/FileListManager.js
View File

@ -97,7 +97,7 @@ class FileListManager {
<div class="file-fps">${fps}</div>
<div class="file-tags">
<span class="tag-icon extra-tag" data-file-path="${file.path}" title="Mark as Extra">🏷️</span>
<span class="tag-icon behindTheScenes-tag" data-file-path="${file.path}" title="Add Behind the Scenes">🎥</span>
<span class="tag-icon behind-the-scenes-tag" data-file-path="${file.path}" title="Add Behind the Scenes">🎥</span>
<span class="tag-icon delete-tag" data-file-path="${file.path}" title="Mark for Deletion">🗑️</span>
<span class="video-preview-btn" data-file-path="${file.path}" title="Preview Video">🎬</span>
<button class="play-button" style="opacity: 0.3; cursor: default; flex-shrink: 0;" data-file-path="${file.path}" disabled>▶️</button>

47
utils/renderer/UIManager.js
View File

@ -65,11 +65,13 @@ class UIManager {
// Search input with debounce
this.searchInput.addEventListener('input', this._debounce(() => this.searchShows(), 300));
// Add click handler for episode number editing (ranges)
// Add click handler for episode number editing (ranges) and tags
document.addEventListener('click', (e) => {
// Handle episode number editing
if (e.target.classList.contains('episode-number')) {
e.stopPropagation();
this.episodeManager.makeEpisodeRangeEditable(e.target);
return;
}
// Handle episode arrow buttons
@ -77,6 +79,20 @@ class UIManager {
e.stopPropagation();
const direction = e.target.classList.contains('episode-arrow-left') ? 'left' : 'right';
this.handleEpisodeArrowClick(e.target, direction);
return;
}
// Handle tag icon clicks
if (e.target.classList.contains('tag-icon')) {
e.stopPropagation();
const tagIcon = e.target;
const tagType = tagIcon.classList.contains('extra-tag') ? 'extra' :
tagIcon.classList.contains('behind-the-scenes-tag') ? 'behind-the-scenes' :
tagIcon.classList.contains('delete-tag') ? 'delete' : null;
if (tagType) {
this.handleTagClick(tagIcon, tagType);
}
}
});
@ -785,6 +801,35 @@ class UIManager {
this.updateEpisodeNumbers();
}
/**
* Handle tag icon clicks
* @param {HTMLElement} tagIcon - The clicked tag icon element
* @param {string} tagType - The tag type (extra, behind-the-scenes, delete)
*/
handleTagClick(tagIcon, tagType) {
console.log(`Tag click: ${tagType}`);
// Get the file name element from the tag icon's parent
const fileItem = tagIcon.closest('.file-item');
const fileNameEl = fileItem.querySelector('.file-name');
if (!fileNameEl) return;
const filePath = fileNameEl.dataset.filePath;
console.log(`Tagging file: ${filePath} as ${tagType}`);
// Add or remove the tag
if (fileItem.hasAttribute(`data-tagged-${tagType}`)) {
// Untag if already tagged
console.log(`Untagging file: ${filePath} from ${tagType}`);
this.untagFile(filePath, tagType);
} else {
// Tag the file
console.log(`Tagging file: ${filePath} as ${tagType}`);
this.addTagToEpisode(filePath, tagType);
}
}
/**
* Function to handle tagging
*/