(.*?)<\/div>/g, '- $1')
.replace(/
(.*?)<\/div>/g, ' - $1')
.replace(/
(.*?)<\/div>/g, ' - $1')
.replace(/(.*?)<\/strong>/g, '$1')
.replace(/<[^>]+>/g, '')
.replace(/\n\s*\n/g, '\n\n')
.trim();
navigator.clipboard.writeText(cleanText)
.catch(err => console.error('Failed to copy text:', err));
}
scrollToBottom() {
this.element.scrollTop = this.element.scrollHeight;
}
enableChat() {
this.element.classList.remove('chat-disabled');
const input = document.querySelector('.message-input');
input.disabled = false;
input.placeholder = "Send message";
}
disableChat() {
this.element.classList.add('chat-disabled');
const input = document.querySelector('.message-input');
input.disabled = true;
input.placeholder = "Select your folder to start chat...";
}
clearDefaultMessage() {
this.messageContainer.innerHTML = '';
}
}
// Sidebar Component
class Sidebar extends Component {
constructor(domainManager) {
const element = document.createElement('div');
element.className = 'sidebar-container open';
super(element);
this.domainManager = domainManager;
this.isOpen = true;
this.timeout = null;
this.selectedFiles = new Set();
this.render();
this.setupEventListeners();
this.isModalOpen = false;
}
render() {
this.element.innerHTML = `
`;
}
setupEventListeners() {
// Existing event listeners
const settingsIcon = this.element.querySelector('.settings-icon');
if (settingsIcon) {
settingsIcon.addEventListener('click', () => {
this.events.emit('settingsClick');
});
}
const fileMenuBtn = this.element.querySelector('.open-file-btn');
fileMenuBtn.addEventListener('click', () => {
this.events.emit('fileMenuClick');
});
// Add hover handlers for desktop
const menuTrigger = document.querySelector('.menu-trigger');
if (menuTrigger) {
menuTrigger.addEventListener('click', () => {
this.toggle();
});
}
this.events.on('modalOpen', () => {
this.isModalOpen = true;
});
this.events.on('modalClose', () => {
this.isModalOpen = false;
setTimeout(() => {
this.toggle(false); // Force close the sidebar
}, 200);
});
// Mobile menu trigger handler
this.events.on('menuTrigger', () => {
if (window.innerWidth < 992) {
const menuIcon = document.querySelector('.menu-trigger .bi-list');
if (menuIcon) {
menuIcon.style.transform = this.isOpen ? 'rotate(0)' : 'rotate(45deg)';
}
this.toggle();
}
});
// Handle window resize
window.addEventListener('resize', () => {
if (window.innerWidth >= 992) {
document.body.style.overflow = '';
const menuIcon = document.querySelector('.menu-trigger .bi-list');
if (menuIcon) {
menuIcon.style.transform = 'rotate(0)';
}
}
});
// User Profile Menu
const userSection = this.element.querySelector('#userProfileMenu');
if (userSection) {
userSection.addEventListener('click', (e) => {
e.stopPropagation();
userSection.classList.toggle('active');
});
// Close menu when clicking outside
document.addEventListener('click', (e) => {
if (!userSection.contains(e.target)) {
userSection.classList.remove('active');
}
});
// Handle menu items
userSection.querySelectorAll('.menu-item').forEach(item => {
item.addEventListener('click', (e) => {
e.stopPropagation();
if (item.classList.contains('logout-item')) {
// Handle logout logic here
console.log('Logging out...');
}
userSection.classList.remove('active');
});
});
}
// Premium and Feedback links
const premiumLink = this.element.querySelector('.premium-link');
if (premiumLink) {
premiumLink.addEventListener('click', (e) => {
e.preventDefault();
this.events.emit('premiumClick');
});
}
const feedbackLink = this.element.querySelector('.bottom-links a:not(.premium-link)');
if (feedbackLink) {
feedbackLink.addEventListener('click', (e) => {
e.preventDefault();
this.events.emit('feedbackClick');
});
}
const profileMenuItem = userSection.querySelector('.menu-item:first-child');
if (profileMenuItem) {
profileMenuItem.addEventListener('click', (e) => {
e.stopPropagation();
userSection.classList.remove('active');
this.events.emit('showProfileLimits');
});
}
}
toggle() {
this.isOpen = !this.isOpen;
this.element.classList.toggle('open', this.isOpen);
// Toggle chat container margin
const chatContainer = document.querySelector('.chat-container');
if (chatContainer) {
chatContainer.classList.toggle('sidebar-closed', !this.isOpen);
const messageContainer = document.querySelector('.message-container');
if (messageContainer) {
messageContainer.style.left = this.isOpen ? '294px' : '0';
messageContainer.style.width = this.isOpen ?
'calc(100% - 600px - 294px)' :
'calc(100% - 600px)';
}
}
}
updateDomainSelection(domain) {
const domainText = this.element.querySelector('.selected-domain-text');
const folderIcon = this.element.querySelector('.bi-folder');
const helperText = this.element.querySelector('.helper-text');
if (domain) {
domainText.textContent = domain.name;
domainText.title = domain.name;
folderIcon.className = 'bi bi-folder empty-folder';
helperText.style.display = 'none';
} else {
domainText.textContent = 'No Domain Selected';
domainText.removeAttribute('title');
folderIcon.className = 'bi bi-folder empty-folder';
helperText.style.display = 'block';
}
}
updateFileList(files, fileIDS) {
const fileList = this.element.querySelector('#sidebarFileList');
if (!fileList) return;
fileList.innerHTML = '';
if (files.length > 0 && fileIDS.length > 0) {
files.forEach((file, index) => {
const fileItem = this.createFileListItem(file, fileIDS[index]);
// Check the checkbox by default
const checkbox = fileItem.querySelector('.file-checkbox');
if (checkbox) {
checkbox.checked = true;
}
fileList.appendChild(fileItem);
});
}
this.updateFileMenuVisibility();
}
createFileListItem(fileName, fileID) {
const fileItem = document.createElement('li');
let extension;
if (fileName.includes('http') || fileName.includes('www.')) {
extension = 'html';
} else {
extension = fileName.split('.').pop().toLowerCase();
}
const icon = this.getFileIcon(extension);
const truncatedName = this.truncateFileName(fileName);
fileItem.innerHTML = `
${truncatedName}
`;
this.selectedFiles.add(fileID);
const checkbox = fileItem.querySelector('.file-checkbox');
checkbox.checked = true;
// Handle checkbox changes
checkbox.addEventListener('change', () => {
if (checkbox.checked) {
this.selectedFiles.add(fileID);
} else {
this.selectedFiles.delete(fileID);
}
// Update sources count
window.app.updateSourcesCount(this.selectedFiles.size);
});
const deleteBtn = fileItem.querySelector('.delete-file-btn');
const confirmActions = fileItem.querySelector('.delete-confirm-actions');
deleteBtn.addEventListener('click', (e) => {
e.stopPropagation();
// Show confirmation actions
confirmActions.classList.add('show');
deleteBtn.style.display = 'none';
});
// Add confirm/cancel handlers
const confirmBtn = fileItem.querySelector('.confirm-delete-btn');
const cancelBtn = fileItem.querySelector('.cancel-delete-btn');
confirmBtn.addEventListener('click', async (e) => {
e.stopPropagation();
const selectedDomain = this.domainManager.getSelectedDomain();
if (!selectedDomain) return;
const success = await window.removeFile(fileID, selectedDomain.data.id, window.serverData.userId);
if (success) {
// Remove file from UI
fileItem.remove();
// Update domain file count
selectedDomain.data.files = selectedDomain.data.files.filter(f => f !== fileName);
selectedDomain.data.fileIDS = selectedDomain.data.fileIDS.filter(id => id !== fileID);
this.domainManager.updateDomainFileCount(selectedDomain.data.id);
// Update sources count
const sourcesCount = selectedDomain.data.files.length;
window.app.updateSourcesCount(sourcesCount);
}
});
cancelBtn.addEventListener('click', (e) => {
e.stopPropagation();
confirmActions.classList.remove('show');
deleteBtn.style.display = 'flex';
});
return fileItem;
}
truncateFileName(fileName, maxLength = 25) {
if (fileName.length <= maxLength) return fileName;
let extension;
if (fileName.includes('http') || fileName.includes('www.')) {
extension = 'html';
} else {
extension = fileName.split('.').pop().toLowerCase();
}
const nameWithoutExt = fileName.slice(0, fileName.lastIndexOf('.'));
// Leave room for ellipsis and extension
const truncatedLength = maxLength - 3 - extension.length - 1;
return `${nameWithoutExt.slice(0, truncatedLength)}...${extension}`;
}
getSelectedFileIds() {
return Array.from(this.selectedFiles);
}
updateFileList(files, fileIDS) {
const fileList = this.element.querySelector('#sidebarFileList');
if (!fileList) return;
fileList.innerHTML = '';
this.selectedFiles.clear(); // Clear existing selections
if (files.length > 0 && fileIDS.length > 0) {
files.forEach((file, index) => {
const fileItem = this.createFileListItem(file, fileIDS[index]);
fileList.appendChild(fileItem);
});
}
this.updateFileMenuVisibility();
// Update initial sources count
window.app.updateSourcesCount(this.selectedFiles.size);
}
updatePlanBadge(userType) {
const planBadge = this.element.querySelector('.plan-badge');
if (planBadge) {
if (userType === 'premium') {
planBadge.textContent = 'Premium Plan';
} else {
planBadge.textContent = 'Free Plan';
}
}
}
hideDeleteConfirmations() {
this.element.querySelectorAll('.delete-confirm-actions').forEach(actions => {
actions.classList.remove('show');
});
this.element.querySelectorAll('.delete-file-btn').forEach(btn => {
btn.style.display = 'flex';
});
}
clearFileSelections() {
this.selectedFiles.clear();
window.app.updateSourcesCount(0);
}
getFileIcon(extension) {
const iconMap = {
pdf: 'bi-file-pdf',
docx: 'bi-file-word',
doc: 'bi-file-word',
txt: 'bi-file-text',
pptx: 'bi-file-ppt',
xlsx: 'bi-file-excel',
udf: 'bi-file-post',
html: 'bi-file-earmark-code',
};
return iconMap[extension] || 'bi-file';
}
updateFileMenuVisibility() {
const fileList = this.element.querySelector('#sidebarFileList');
const helperText = this.element.querySelector('.helper-text');
const fileMenuBtn = this.element.querySelector('.open-file-btn');
const fileListContainer = this.element.querySelector('.file-list-container');
if (fileList.children.length > 0) {
helperText.style.display = 'none';
helperText.style.height = '0';
helperText.style.margin = '0';
helperText.style.padding = '0';
} else {
fileListContainer.style.height = 'auto';
fileMenuBtn.style.position = 'static';
fileMenuBtn.style.width = '100%';
}
}
}
class PremiumModal extends Component {
constructor() {
const element = document.getElementById('premiumAlert');
super(element);
this.setupEventListeners();
}
setupEventListeners() {
const closeButton = this.element.querySelector('.alert-button');
closeButton?.addEventListener('click', () => this.hide());
}
show() {
this.element.classList.add('show');
document.body.style.overflow = 'hidden';
}
hide() {
this.element.classList.remove('show');
document.body.style.overflow = '';
}
}
// Feedback Modal Component
class FeedbackModal extends Component {
constructor() {
const element = document.createElement('div');
element.className = 'feedback-modal';
super(element);
this.render();
this.setupEventListeners();
}
render() {
this.element.innerHTML = `
`;
document.body.appendChild(this.element);
}
setupEventListeners() {
// Close button handlers
const closeButtons = this.element.querySelectorAll('.close-modal, .btn-cancel');
closeButtons.forEach(button => {
button.addEventListener('click', () => this.hide());
});
// Click outside to close
this.element.addEventListener('click', (e) => {
if (e.target === this.element) {
this.hide();
}
});
// Form submission
const form = this.element.querySelector('#feedback-form');
form.addEventListener('submit', async (e) => {
e.preventDefault();
await this.handleSubmit(e);
});
// File size validation
const fileInput = this.element.querySelector('#feedback-screenshot');
fileInput.addEventListener('change', (e) => {
const file = e.target.files[0];
if (file && file.size > 2 * 1024 * 1024) {
alert('File size must be less than 2MB');
e.target.value = '';
}
});
}
async handleSubmit(e) {
const form = e.target;
const submitButton = form.querySelector('.btn-submit');
submitButton.disabled = true;
try {
const formData = new FormData(form);
const result = await window.sendFeedback(formData, window.serverData.userId);
if (result.success) {
this.hide();
this.events.emit('success', result.message);
} else {
this.events.emit('error', result.message);
}
} catch (error) {
console.error('Error in feedback submission:', error);
this.events.emit('error', 'An unexpected error occurred');
} finally {
submitButton.disabled = false;
form.reset();
}
}
show() {
this.element.classList.add('show');
document.body.style.overflow = 'hidden';
}
hide() {
this.element.classList.remove('show');
document.body.style.overflow = '';
this.element.querySelector('#feedback-form').reset();
}
}
class SuccessAlert extends Component {
constructor() {
const element = document.getElementById('feedbackSuccessAlert');
super(element);
this.setupEventListeners();
}
setupEventListeners() {
const closeButton = this.element.querySelector('.alert-button');
closeButton?.addEventListener('click', () => this.hide());
}
show() {
this.element.classList.add('show');
document.body.style.overflow = 'hidden';
}
hide() {
this.element.classList.remove('show');
document.body.style.overflow = '';
}
}
// Logout
class LogoutModal extends Component {
constructor() {
const element = document.getElementById('logoutConfirmModal');
super(element);
this.setupEventListeners();
// Set URLs based on environment from serverData
this.WEB_URL = window.serverData.environment === 'dev'
? 'http://localhost:3000'
: 'https://doclink.io';
}
setupEventListeners() {
const logoutButton = this.element.querySelector('.alert-button');
const cancelButton = this.element.querySelector('.btn-cancel');
logoutButton?.addEventListener('click', () => {
this.handleLogout();
});
cancelButton?.addEventListener('click', () => {
this.hide();
});
}
handleLogout() {
try {
// 1. Clear client-side app state
localStorage.clear();
sessionStorage.clear();
// 2. Call FastAPI logout endpoint
window.handleLogoutRequest(window.serverData.userId, window.serverData.sessionId)
.finally(() => {
// 3. Clear cookies manually as backup
this.clearCookies();
// 4. Redirect to signout
window.location.href = `${this.WEB_URL}/api/auth/signout?callbackUrl=/`;
});
} catch (error) {
console.error('Logout error:', error);
window.location.href = this.WEB_URL;
}
}
clearCookies() {
const cookies = document.cookie.split(';');
const domain = window.location.hostname;
for (let cookie of cookies) {
const name = cookie.split('=')[0].trim();
document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/; domain=${domain}`;
document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/; domain=.${domain}`;
}
}
show() {
this.element.classList.add('show');
document.body.style.overflow = 'hidden';
}
hide() {
this.element.classList.remove('show');
document.body.style.overflow = '';
}
}
// Rating Modal
class RatingModal extends Component {
constructor() {
const element = document.createElement('div');
element.className = 'modal fade';
element.id = 'ratingModal';
element.setAttribute('tabindex', '-1');
element.setAttribute('aria-hidden', 'true');
super(element);
this.rating = 0;
this.render();
this.setupEventListeners();
}
render() {
this.element.innerHTML = `
`;
document.body.appendChild(this.element);
this.modal = new bootstrap.Modal(this.element);
}
setupEventListeners() {
// Star rating handlers
const stars = this.element.querySelectorAll('.stars i');
stars.forEach((star, index) => {
star.addEventListener('click', () => this.handleStarClick(index));
star.addEventListener('mouseover', () => this.highlightStars(index));
star.addEventListener('mouseout', () => this.updateStars());
});
// Close button handler
const closeButton = this.element.querySelector('.close-button');
closeButton.addEventListener('click', () => this.hide());
// Submit button handler
const submitButton = this.element.querySelector('.submit-button');
submitButton.addEventListener('click', () => {
const feedbackInput = this.element.querySelector('.feedback-input');
this.sendRating(this.rating,feedbackInput.value)
setTimeout(() => {
this.hide();
}, 1000);
});
// Click outside to close
this.element.addEventListener('click', (e) => {
if (e.target === this.element) {
this.hide();
}
});
}
handleStarClick(index) {
this.rating = index + 1;
this.updateStars();
}
async sendRating(rating,user_note) {
try {
const result = await window.sendRating(rating, user_note, window.serverData.userId);
if (result.success) {
this.hide()
this.events.emit('success', result.message);
} else {
this.events.emit('error', result.message);
}
} catch (error) {
console.error('Error in rating submission:', error);
this.events.emit('error', 'An unexpected error occurred');
} finally {
this.reset();
}
}
highlightStars(index) {
const stars = this.element.querySelectorAll('.stars i');
stars.forEach((star, i) => {
star.classList.remove('bi-star-fill', 'bi-star');
if (i <= index) {
star.classList.add('bi-star-fill');
star.classList.add('active');
} else {
star.classList.add('bi-star');
star.classList.remove('active');
}
});
}
updateStars() {
const stars = this.element.querySelectorAll('.stars i');
stars.forEach((star, i) => {
star.classList.remove('bi-star-fill', 'bi-star', 'active');
if (i < this.rating) {
star.classList.add('bi-star-fill');
star.classList.add('active');
} else {
star.classList.add('bi-star');
}
});
}
show() {
this.modal.show();
document.body.style.overflow = 'hidden';
}
hide() {
this.modal.hide();
document.body.style.overflow = '';
}
reset() {
this.rating = 0;
this.updateStars();
const feedbackInput = this.element.querySelector('.feedback-input');
if (feedbackInput) {
feedbackInput.value = '';
}
}
}
// URLuploadModal
class URLInputModal extends Component {
constructor() {
const element = document.createElement('div');
element.className = 'modal fade';
element.id = 'urlInputModal';
element.setAttribute('tabindex', '-1');
element.setAttribute('aria-hidden', 'true');
super(element);
this.render();
this.setupEventListeners();
this.modal = null;
}
render() {
this.element.innerHTML = `
`;
document.body.appendChild(this.element);
this.modal = new bootstrap.Modal(this.element);
}
setupEventListeners() {
const urlInput = this.element.querySelector('.url-input');
const addButton = this.element.querySelector('.add-url-btn');
const closeButton = this.element.querySelector('.close-button');
// Enable/disable add button based on URL input
urlInput.addEventListener('input', () => {
addButton.disabled = !urlInput.value.trim();
});
// URL processing
addButton.addEventListener('click', () => {
const url = urlInput.value;
this.startProcessing(url);
urlInput.value = '';
});
// Close button handler
closeButton.addEventListener('click', () => {
this.hide();
});
// Click outside to close
this.element.addEventListener('click', (e) => {
if (e.target === this.element) {
this.hide();
}
});
}
async startProcessing(url) {
const clean_url = url.trim();
if (!clean_url) return;
this.setLoadingState(true);
try {
const success = await window.storeURL(window.serverData.userId, clean_url);
if (success === 1) {
this.handleFileBasketAddition(clean_url)
this.events.emit('urlProcessed', {
message: 'Successfully processed URL',
type: 'success'
});
this.hide();
} else {
throw new Error('Failed to process URL');
}
} catch (error) {
this.events.emit('error', error.message);
} finally {
this.setLoadingState(false);
}
}
handleFileBasketAddition(url) {
try {
// Create a clean filename from the URL
const urlObj = new URL(url);
const fileName = `${urlObj.hostname}.html`;
// Create URL file object similar to drive file object
const urlFile = {
name: fileName,
mimeType: 'text/html',
lastModified: Date.now()
};
// Emit event for FileUploadModal to handle
this.events.emit('urlProcessed', {
files: [urlFile],
message: 'Successfully processed URL',
type: 'success'
});
this.hide();
return true;
} catch (error) {
console.error('Error preparing URL file:', error);
return false;
}
}
setLoadingState(isLoading) {
const loadingOverlay = this.element.querySelector('.upload-loading-overlay');
const closeButton = this.element.querySelector('.close-button');
const addButton = this.element.querySelector('.add-url-btn');
if (isLoading) {
loadingOverlay.style.display = 'flex';
closeButton.style.display = 'none';
addButton.disabled = true;
this.modal._config.backdrop = 'static';
this.modal._config.keyboard = false;
} else {
loadingOverlay.style.display = 'none';
closeButton.style.display = 'block';
addButton.disabled = false;
this.modal._config.backdrop = true;
this.modal._config.keyboard = true;
}
}
show() {
if (this.modal) {
this.modal.dispose();
}
this.modal = new bootstrap.Modal(this.element);
this.element.style.zIndex = '9999';
this.modal.show();
setTimeout(() => {
const backdrop = document.querySelector('.modal-backdrop:last-child');
if (backdrop) {
backdrop.style.zIndex = '9998';
}
}, 0);
}
hide() {
this.modal.hide();
const urlInput = this.element.querySelector('.url-input');
urlInput.value = '';
}
}
// Add this class after other modal classes
class ProfileLimitsModal extends Component {
constructor(domainManager) {
const element = document.createElement('div');
element.className = 'modal fade';
element.id = 'profileLimitsModal';
element.setAttribute('tabindex', '-1');
element.setAttribute('aria-hidden', 'true');
super(element);
this.domainManager = domainManager;
this.render();
this.setupEventListeners();
this.dailyQuestionsCount = 0;
}
render() {
this.element.innerHTML = `
`;
document.body.appendChild(this.element);
}
updateLimits() {
const domains = this.domainManager.getAllDomains();
let totalSources = 0;
const userType = window.app?.userData?.user_info?.user_type || 'free';
const upgradeButton = this.element.querySelector('.upgrade-section');
const limitsContainer = this.element.querySelector('.limits-container');
if (limitsContainer) {
const limitIndicators = limitsContainer.querySelectorAll('.limit-indicator');
const dailyQuestionBar = limitIndicators.length >= 3 ? limitIndicators[2] : null;
if (upgradeButton) {
upgradeButton.style.display = userType === 'premium' ? 'none' : 'block';
}
if (dailyQuestionBar) {
dailyQuestionBar.style.display = userType === 'premium' ? 'none' : 'block';
}
}
domains.forEach(domain => {
if (domain.fileCount) {
totalSources += domain.fileCount;
}
});
if (userType === 'free') {
this.updateProgressBar('sources', totalSources, 10);
this.updateProgressBar('domains', domains.length, 3);
this.updateProgressBar('questions', this.dailyQuestionsCount, 25);
} else if (userType === 'premium') {
this.updateProgressBar('sources', totalSources, 100);
this.updateProgressBar('domains', domains.length, 20);
}
}
updateDailyCount(count) {
this.dailyQuestionsCount = count;
if (this.element.classList.contains('show')) {
this.updateProgressBar('questions', count, 25);
}
}
updateProgressBar(type, current, max) {
const countElement = this.element.querySelector(`.${type}-count`);
const progressBar = countElement?.closest('.limit-indicator').querySelector('.progress-bar');
if (countElement && progressBar) {
const percentage = (current / max) * 100;
countElement.textContent = `${current}/${max}`;
progressBar.style.width = `${percentage}%`;
}
}
setupEventListeners() {
const upgradeButton = this.element.querySelector('.upgrade-button');
upgradeButton?.addEventListener('click', () => {
this.events.emit('upgradeClick');
});
}
show() {
this.updateLimits();
const modal = new bootstrap.Modal(this.element);
modal.show();
}
hide() {
const modal = bootstrap.Modal.getInstance(this.element);
if (modal) {
modal.hide();
}
}
}
// Application
class App {
constructor() {
this.domainManager = new DomainManager();
this.sidebar = new Sidebar(this.domainManager);
this.feedbackModal = new FeedbackModal();
this.domainSettingsModal = new DomainSettingsModal(this.domainManager);
this.fileUploadModal = new FileUploadModal(this.domainManager);
this.events = new EventEmitter();
this.userData = null;
this.sourcesCount = 0;
this.sourcesBox = document.querySelector('.sources-box');
this.sourcesNumber = document.querySelector('.sources-number');
this.chatManager = new ChatManager();
this.premiumModal = new PremiumModal();
this.successAlert = new SuccessAlert();
this.logoutModal = new LogoutModal();
this.ratingModal = new RatingModal();
this.profileLimitsModal = new ProfileLimitsModal(this.domainManager);
this.chatManager.disableChat();
this.setupEventListeners();
}
updateUserInterface() {
// Update user section in sidebar
const userEmail = this.sidebar.element.querySelector('.user-email');
const userAvatar = this.sidebar.element.querySelector('.user-avatar');
userEmail.textContent = this.userData.user_info.user_email;
if (this.userData.user_info.user_picture_url && this.userData.user_info.user_picture_url !== "null") {
userAvatar.innerHTML = `
`;
userAvatar.classList.add('has-image');
} else {
userAvatar.textContent = this.userData.user_info.user_name[0].toUpperCase();
userAvatar.classList.remove('has-image');
}
this.sidebar.updatePlanBadge(this.userData.user_info.user_type);
}
updateSourcesCount(count) {
this.sourcesCount = count;
if (this.sourcesNumber) {
this.sourcesNumber.textContent = count;
this.sourcesBox.setAttribute('count', count);
}
}
updateDomainCount() {
this.domainSettingsModal.updateDomainCount();
}
setupEventListeners() {
// Sidebar events
this.sidebar.events.on('settingsClick', () => {
this.domainSettingsModal.show();
});
this.sidebar.events.on('fileMenuClick', () => {
const selectedDomain = this.domainManager.getSelectedDomain();
if (!selectedDomain) {
this.events.emit('warning', 'Please select a domain first');
return;
}
this.fileUploadModal.show(selectedDomain.data.name);
this.sidebar.events.emit('modalOpen');
});
this.sidebar.events.on('feedbackClick', () => {
this.feedbackModal.show();
});
// Domain Settings Modal events
this.domainSettingsModal.events.on('domainCreate', async (domainData) => {
const domainCard = this.domainManager.addDomain({
id: domainData.id,
name: domainData.name
});
// Update the domains list in the modal
this.domainSettingsModal.updateDomainsList(this.domainManager.getAllDomains());
this.updateDomainCount();
this.events.emit('message', {
text: `Successfully created folder ${domainData.name}`,
type: 'success'
});
});
this.domainSettingsModal.events.on('domainSearch', (searchTerm) => {
const filteredDomains = this.domainManager.searchDomains(searchTerm);
this.domainSettingsModal.updateDomainsList(filteredDomains);
});
this.domainSettingsModal.events.on('domainSelected', async (domainId) => {
try {
const success = await window.selectDomain(domainId, window.serverData.userId);
if (success) {
const domain = this.domainManager.getDomain(domainId);
if (!domain) return;
// Update domain manager state and UI
this.domainManager.selectDomain(domainId);
this.sidebar.updateDomainSelection(domain.data);
// Update header with domain name
this.chatManager.updateHeader(domain.data.name);
const files = domain.data.files || [];
const fileIDS = domain.data.fileIDS || [];
this.sidebar.updateFileList(files, fileIDS);
// Update sources count
this.updateSourcesCount(files.length);
// Enable chat
this.chatManager.enableChat();
this.events.emit('message', {
text: `Successfully switched to folder ${domain.data.name}`,
type: 'success'
});
}
} catch (error) {
this.events.emit('message', {
text: 'Failed to select folder',
type: 'error'
});
}
});
const selectButton = this.domainSettingsModal.element.querySelector('.select-button');
selectButton?.addEventListener('click', () => {
const selectedCheckbox = this.domainSettingsModal.element.querySelector('.domain-checkbox:checked');
if (selectedCheckbox) {
const domainCard = selectedCheckbox.closest('.domain-card');
const domainId = domainCard.dataset.domainId;
this.domainSettingsModal.events.emit('domainSelected', domainId);
}
});
this.domainSettingsModal.events.on('domainEdit', async ({ id, newName }) => {
const success = this.domainManager.renameDomain(id, newName);
if (success) {
// If this is the currently selected domain, update the sidebar
const selectedDomain = this.domainManager.getSelectedDomain();
if (selectedDomain && selectedDomain.data.id === id) {
this.sidebar.updateDomainSelection(selectedDomain.data);
}
// Update the domains list in the modal
this.domainSettingsModal.updateDomainsList(this.domainManager.getAllDomains());
this.events.emit('message', {
text: `Successfully renamed folder to ${newName}`,
type: 'success'
});
}
});
this.domainSettingsModal.events.on('warning', (message) => {
this.events.emit('message', {
text: message,
type: 'warning'
});
});
this.domainSettingsModal.events.on('domainDelete', async (domainId) => {
const wasSelected = this.domainManager.getSelectedDomain()?.data.id === domainId;
if (this.domainManager.deleteDomain(domainId)) {
if (wasSelected) {
// Reset sidebar to default state
this.sidebar.updateDomainSelection(null);
this.sidebar.updateFileList([], []);
// Reset sources count
this.updateSourcesCount(0);
// Disable chat
this.chatManager.disableChat();
}
this.domainSettingsModal.updateDomainsList(this.domainManager.getAllDomains());
this.updateDomainCount();
this.events.emit('message', {
text: 'Folder successfully deleted',
type: 'success'
});
}
});
this.chatManager.events.on('ratingModalOpen', () => {
setTimeout(() => {
this.ratingModal.show();
}, 500);
});
// File Upload Modal events
this.fileUploadModal.events.on('filesUploaded', (data) => {
const selectedDomain = this.domainManager.getSelectedDomain();
if (selectedDomain) {
// Access the nested data object
selectedDomain.data.files = data.file_names;
selectedDomain.data.fileIDS = data.file_ids;
this.sidebar.updateFileList(data.file_names, data.file_ids);
this.updateSourcesCount(data.file_names.length);
this.domainManager.updateDomainFileCount(selectedDomain.data.id);
}
});
this.fileUploadModal.events.on('warning', (message) => {
this.events.emit('message', {
text: message,
type: 'warning'
});
});
this.fileUploadModal.events.on('error', (message) => {
this.events.emit('message', {
text: message,
type: 'error'
});
});
this.fileUploadModal.events.on('modalClose', () => {
this.sidebar.events.emit('modalClose');
});
// Feedback Modal events
this.feedbackModal.events.on('feedbackSubmitted', (message) => {
console.log(message);
});
this.feedbackModal.events.on('feedbackError', (error) => {
console.error(error);
});
this.feedbackModal.events.on('success', (message) => {
this.successAlert.show();
});
// Premium Modal Events
const premiumLink = this.sidebar.element.querySelector('.premium-link');
premiumLink?.addEventListener('click', (e) => {
e.preventDefault();
this.initiateCheckout();
});
this.profileLimitsModal.events.on('upgradeClick', () => {
this.initiateCheckout();
});
// Logout event
const logoutItem = this.sidebar.element.querySelector('.logout-item');
logoutItem?.addEventListener('click', (e) => {
e.preventDefault();
this.logoutModal.show();
});
this.sidebar.events.on('showProfileLimits', () => {
this.profileLimitsModal.show()
});
}
// In App class initialization
async init() {
// Initialize
this.userData = await window.fetchUserInfo(window.serverData.userId);
if (!this.userData) {
throw new Error('Failed to load user data');
}
// Update user interface with user data
this.updateUserInterface()
// Store domain data
Object.keys(this.userData.domain_info).forEach(key => {
const domainData = this.userData.domain_info[key];
const domain = {
id: key,
name: domainData.domain_name,
fileCount: domainData.file_names.length,
files: domainData.file_names,
fileIDS: domainData.file_ids
};
this.domainManager.addDomain(domain);
});
// Update UI with domain data
this.domainSettingsModal.updateDomainsList(
this.domainManager.getAllDomains()
);
window.user_type = this.userData.user_type
// Add sidebar to DOM
document.body.appendChild(this.sidebar.element);
// Setup menu trigger
const menuTrigger = document.querySelector('.menu-trigger');
if (menuTrigger) {
menuTrigger.addEventListener('click', () => {
this.sidebar.events.emit('menuTrigger');
});
}
window.app.profileLimitsModal.updateDailyCount(this.userData.user_info.user_daily_count);
// Welcome operations
const isFirstTime = window.serverData.isFirstTime === 'True';
if (1 === 1) {
localStorage.setItem('firstTime', 0);
const firstTimeMsg = `[header]Welcome to Doclink${this.userData.user_info.user_name ? `, ${this.userData.user_info.user_name}` : ''}👋[/header]\nYour first folder with helpful guide settled up. You can always use this file to get information about Doclink!\n[header]To get started[/header]\n- Select your folder on navigation bar \n- Upload your documents or insert a link\n- Ask any question to get information\n- All answers will include sources on references\n\n[header]Quick Tips[/header]\n- Doclink is specialized to answer only from your files\n- Specialized questions can help Doclink to find information better\n- Doclink supports PDF, DOCX, Excel, PowerPoint, UDF and TXT file formats\n- You can create different folders for different topics and interact with them\n- You can also ask just selected files to get isolated information\n- You can select answers on the upper right of the message box and create report with clicking report icon on the chat`;
this.chatManager.addMessage(firstTimeMsg, 'ai');
const domains = this.domainManager.getAllDomains();
if (domains.length > 0) {
this.domainSettingsModal.events.emit('domainSelected', domains[0].id);
}
} else {
// Regular welcome message for returning users
this.chatManager.addMessage(
`Welcome ${this.userData.user_info.user_name}, what can I find for you?`,
'ai'
);
}
}
// Initial Checkout
initiateCheckout() {
const checkoutUrl = 'https://doclinkio.lemonsqueezy.com/buy/0c0294bb-1cbe-4411-a9bc-800053d1580c';
window.location.href = checkoutUrl;
}
}
// Initialize when DOM is ready
document.addEventListener('DOMContentLoaded', () => {
window.app = new App();
window.app.init();
const resourcesTrigger = document.querySelector('.resources-trigger');
const resourcesContainer = document.querySelector('.resources-container');
const mainContent = document.querySelector('.chat-container');
if (resourcesTrigger && resourcesContainer) {
resourcesTrigger.addEventListener('click', () => {
resourcesContainer.classList.toggle('show');
mainContent.classList.toggle('blur-content');
if (resourcesContainer.classList.contains('show')) {
backdrop.classList.add('show');
document.body.style.overflow = 'hidden';
} else {
backdrop.classList.remove('show');
document.body.style.overflow = '';
}
});
// Escape tuşu ile kapatma
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape' && resourcesContainer.classList.contains('show')) {
resourcesContainer.classList.remove('show');
mainContent.classList.remove('blur-content');
backdrop.classList.remove('show');
document.body.style.overflow = '';
}
});
}
});
