app.js

/**
 * CryptoVault - Advanced Text Encryption Application
 * Supports AES-256, DES, and RSA-2048 encryption algorithms
 * Features glassmorphism UI with light/dark mode
 */

// ==================== STATE MANAGEMENT ====================
const appState = {
  currentAlgorithm: 'aes',
  theme: 'light',
  keys: {
    aes: null,
    des: null,
    rsa: { public: null, private: null }
  },
  inputText: '',
  resultText: '',
  encryptionTime: 0
};

// ==================== ALGORITHM METADATA ====================
const algorithmData = {
  aes: {
    name: 'AES-256',
    fullName: 'Advanced Encryption Standard',
    keyLength: '256 bits',
    security: 'High',
    color: '#2196F3'
  },
  des: {
    name: 'DES',
    fullName: 'Data Encryption Standard',
    keyLength: '56 bits',
    security: 'Low (Deprecated)',
    color: '#FF9800'
  },
  rsa: {
    name: 'RSA-2048',
    fullName: 'Rivest-Shamir-Adleman',
    keyLength: '2048 bits',
    security: 'High',
    color: '#4CAF50'
  }
};

// ==================== DOM ELEMENTS ====================
const elements = {
  themeToggle: document.getElementById('themeToggle'),
  algoTabs: document.querySelectorAll('.algo-tab'),
  inputText: document.getElementById('inputText'),
  charCount: document.getElementById('charCount'),
  generateKeysBtn: document.getElementById('generateKeys'),
  encryptBtn: document.getElementById('encryptBtn'),
  decryptBtn: document.getElementById('decryptBtn'),
  keyDisplay: document.getElementById('keyDisplay'),
  resultSection: document.getElementById('resultSection'),
  resultText: document.getElementById('resultText'),
  resultMetadata: document.getElementById('resultMetadata'),
  copyBtn: document.getElementById('copyBtn'),
  downloadBtn: document.getElementById('downloadBtn'),
  toast: document.getElementById('toast'),
  toastIcon: document.getElementById('toastIcon'),
  toastMessage: document.getElementById('toastMessage'),
  loadingOverlay: document.getElementById('loadingOverlay'),
  currentAlgo: document.getElementById('currentAlgo'),
  keyLength: document.getElementById('keyLength'),
  encryptionTime: document.getElementById('encryptionTime'),
  securityLevel: document.getElementById('securityLevel')
};

// ==================== INITIALIZATION ====================
function init() {
  // Set default theme (in-memory only)
  setTheme('light');
  
  // Generate initial keys
  generateKeys();
  
  // Update metrics display
  updateMetrics();
  
  // Setup event listeners
  setupEventListeners();
}

// ==================== EVENT LISTENERS ====================
function setupEventListeners() {
  // Theme toggle
  elements.themeToggle.addEventListener('click', toggleTheme);
  
  // Algorithm tabs
  elements.algoTabs.forEach(tab => {
    tab.addEventListener('click', () => {
      const algo = tab.dataset.algo;
      selectAlgorithm(algo);
    });
  });
  
  // Input text
  elements.inputText.addEventListener('input', (e) => {
    appState.inputText = e.target.value;
    elements.charCount.textContent = `${e.target.value.length} characters`;
  });
  
  // Buttons
  elements.generateKeysBtn.addEventListener('click', generateKeys);
  elements.encryptBtn.addEventListener('click', encryptText);
  elements.decryptBtn.addEventListener('click', decryptText);
  elements.copyBtn.addEventListener('click', copyToClipboard);
  elements.downloadBtn.addEventListener('click', downloadResult);
}

// ==================== THEME MANAGEMENT ====================
function toggleTheme() {
  const newTheme = appState.theme === 'light' ? 'dark' : 'light';
  setTheme(newTheme);
}

function setTheme(theme) {
  appState.theme = theme;
  document.documentElement.setAttribute('data-theme', theme);
}


// ==================== ALGORITHM SELECTION ====================
function selectAlgorithm(algo) {
  appState.currentAlgorithm = algo;
  
  // Update active tab
  elements.algoTabs.forEach(tab => {
    tab.classList.toggle('active', tab.dataset.algo === algo);
  });
  
  // Update metrics
  updateMetrics();
  
  // Update key display
  displayKeys();
  
  // Hide result section
  elements.resultSection.classList.add('hidden');
}

// ==================== METRICS UPDATE ====================
function updateMetrics() {
  const algo = algorithmData[appState.currentAlgorithm];
  elements.currentAlgo.textContent = algo.name;
  elements.keyLength.textContent = algo.keyLength;
  
  // Update security badge
  const badge = elements.securityLevel.querySelector('.security-badge');
  if (algo.security.includes('High')) {
    badge.className = 'security-badge high';
    badge.textContent = 'High';
  } else {
    badge.className = 'security-badge low';
    badge.textContent = 'Low';
  }
}

// ==================== KEY GENERATION ====================
function generateKeys() {
  showLoading();
  
  // Generate keys based on current algorithm
  setTimeout(() => {
    switch(appState.currentAlgorithm) {
      case 'aes':
        generateAESKey();
        break;
      case 'des':
        generateDESKey();
        break;
      case 'rsa':
        generateRSAKeys();
        break;
    }
    
    displayKeys();
    hideLoading();
    showToast('Keys generated successfully!', 'success');
  }, 500);
}

function generateAESKey() {
  // Generate random 256-bit key
  const array = new Uint8Array(32);
  crypto.getRandomValues(array);
  appState.keys.aes = arrayToHex(array);
}

function generateDESKey() {
  // Generate random 64-bit key (8 bytes)
  const array = new Uint8Array(8);
  crypto.getRandomValues(array);
  appState.keys.des = arrayToHex(array);
}

function generateRSAKeys() {
  // Generate RSA key pair using JSEncrypt
  const crypt = new JSEncrypt({default_key_size: 2048});
  appState.keys.rsa.public = crypt.getPublicKey();
  appState.keys.rsa.private = crypt.getPrivateKey();
}

// ==================== KEY DISPLAY ====================
function displayKeys() {
  const algo = appState.currentAlgorithm;
  let html = '';
  
  switch(algo) {
    case 'aes':
      html = createKeyItem('AES Key', appState.keys.aes, 'aes-key');
      break;
    case 'des':
      html = createKeyItem('DES Key', appState.keys.des, 'des-key');
      break;
    case 'rsa':
      html = createKeyItem('Public Key', appState.keys.rsa.public, 'rsa-public');
      html += createKeyItem('Private Key', appState.keys.rsa.private, 'rsa-private');
      break;
  }
  
  elements.keyDisplay.innerHTML = html;
  
  // Setup key action buttons
  setupKeyActions();
}

function createKeyItem(label, value, id) {
  return `
    <div class="key-item">
      <span class="key-label">${label}</span>
      <div class="key-value">
        <span class="key-text" id="${id}">${truncateKey(value)}</span>
        <div class="key-actions">
          <button class="btn-icon-small" onclick="toggleKeyVisibility('${id}')" title="Toggle visibility">👁️</button>
          <button class="btn-icon-small" onclick="copyKey('${id}')" title="Copy key">📋</button>
        </div>
      </div>
    </div>
  `;
}

function truncateKey(key) {
  if (!key) return '';
  if (key.length > 100) {
    return key.substring(0, 50) + '...' + key.substring(key.length - 50);
  }
  return key;
}

function setupKeyActions() {
  // Key actions are now inline onclick handlers
}

window.toggleKeyVisibility = function(id) {
  const keyElement = document.getElementById(id);
  keyElement.classList.toggle('hidden-key');
};

window.copyKey = function(id) {
  const keyElement = document.getElementById(id);
  const fullKey = getFullKey(id);
  
  navigator.clipboard.writeText(fullKey).then(() => {
    showToast('Key copied to clipboard!', 'success');
  });
};

function getFullKey(id) {
  switch(id) {
    case 'aes-key':
      return appState.keys.aes;
    case 'des-key':
      return appState.keys.des;
    case 'rsa-public':
      return appState.keys.rsa.public;
    case 'rsa-private':
      return appState.keys.rsa.private;
    default:
      return '';
  }
}

// ==================== ENCRYPTION ====================
function encryptText() {
  const text = appState.inputText.trim();
  
  if (!text) {
    showToast('Please enter text to encrypt', 'error');
    return;
  }
  
  // RSA warning for large text
  if (appState.currentAlgorithm === 'rsa' && text.length > 200) {
    showToast('RSA is designed for small data. Consider using AES for large text.', 'error');
    return;
  }
  
  showLoading();
  
  setTimeout(() => {
    try {
      const startTime = performance.now();
      let encrypted = '';
      
      switch(appState.currentAlgorithm) {
        case 'aes':
          encrypted = encryptAES(text);
          break;
        case 'des':
          encrypted = encryptDES(text);
          break;
        case 'rsa':
          encrypted = encryptRSA(text);
          break;
      }
      
      const endTime = performance.now();
      appState.encryptionTime = (endTime - startTime).toFixed(2);
      appState.resultText = encrypted;
      
      displayResult(encrypted, 'Encrypted');
      hideLoading();
      showToast('Text encrypted successfully!', 'success');
    } catch (error) {
      hideLoading();
      showToast('Encryption failed: ' + error.message, 'error');
      console.error(error);
    }
  }, 300);
}

function encryptAES(text) {
  // Using CryptoJS for AES encryption
  const key = CryptoJS.enc.Hex.parse(appState.keys.aes);
  const iv = CryptoJS.lib.WordArray.random(16);
  
  const encrypted = CryptoJS.AES.encrypt(text, key, {
    iv: iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  });
  
  // Combine IV and ciphertext
  const combined = iv.concat(encrypted.ciphertext);
  return combined.toString(CryptoJS.enc.Base64);
}

function encryptDES(text) {
  // Using CryptoJS for DES encryption
  const key = CryptoJS.enc.Hex.parse(appState.keys.des);
  
  const encrypted = CryptoJS.DES.encrypt(text, key, {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7
  });
  
  return encrypted.toString();
}

function encryptRSA(text) {
  // Using JSEncrypt for RSA encryption
  const encrypt = new JSEncrypt();
  encrypt.setPublicKey(appState.keys.rsa.public);
  
  const encrypted = encrypt.encrypt(text);
  if (!encrypted) {
    throw new Error('RSA encryption failed');
  }
  
  return encrypted;
}

// ==================== DECRYPTION ====================
function decryptText() {
  const text = appState.inputText.trim();
  
  if (!text) {
    showToast('Please enter encrypted text to decrypt', 'error');
    return;
  }
  
  showLoading();
  
  setTimeout(() => {
    try {
      const startTime = performance.now();
      let decrypted = '';
      
      switch(appState.currentAlgorithm) {
        case 'aes':
          decrypted = decryptAES(text);
          break;
        case 'des':
          decrypted = decryptDES(text);
          break;
        case 'rsa':
          decrypted = decryptRSA(text);
          break;
      }
      
      const endTime = performance.now();
      appState.encryptionTime = (endTime - startTime).toFixed(2);
      appState.resultText = decrypted;
      
      displayResult(decrypted, 'Decrypted');
      hideLoading();
      showToast('Text decrypted successfully!', 'success');
    } catch (error) {
      hideLoading();
      showToast('Decryption failed: ' + error.message, 'error');
      console.error(error);
    }
  }, 300);
}

function decryptAES(ciphertext) {
  try {
    const combined = CryptoJS.enc.Base64.parse(ciphertext);
    
    // Extract IV (first 16 bytes) and ciphertext
    const iv = CryptoJS.lib.WordArray.create(combined.words.slice(0, 4));
    const encrypted = CryptoJS.lib.WordArray.create(combined.words.slice(4));
    
    const key = CryptoJS.enc.Hex.parse(appState.keys.aes);
    
    const decrypted = CryptoJS.AES.decrypt(
      { ciphertext: encrypted },
      key,
      {
        iv: iv,
        mode: CryptoJS.mode.CBC,
        padding: CryptoJS.pad.Pkcs7
      }
    );
    
    return decrypted.toString(CryptoJS.enc.Utf8);
  } catch (error) {
    throw new Error('Invalid ciphertext or key');
  }
}

function decryptDES(ciphertext) {
  try {
    const key = CryptoJS.enc.Hex.parse(appState.keys.des);
    
    const decrypted = CryptoJS.DES.decrypt(ciphertext, key, {
      mode: CryptoJS.mode.ECB,
      padding: CryptoJS.pad.Pkcs7
    });
    
    return decrypted.toString(CryptoJS.enc.Utf8);
  } catch (error) {
    throw new Error('Invalid ciphertext or key');
  }
}

function decryptRSA(ciphertext) {
  try {
    const decrypt = new JSEncrypt();
    decrypt.setPrivateKey(appState.keys.rsa.private);
    
    const decrypted = decrypt.decrypt(ciphertext);
    if (!decrypted) {
      throw new Error('RSA decryption failed');
    }
    
    return decrypted;
  } catch (error) {
    throw new Error('Invalid ciphertext or private key');
  }
}

// ==================== RESULT DISPLAY ====================
function displayResult(text, type) {
  elements.resultText.textContent = text;
  elements.resultSection.classList.remove('hidden');
  
  // Update metadata
  const algo = algorithmData[appState.currentAlgorithm];
  elements.resultMetadata.innerHTML = `
    <div class="metadata-item">
      <span class="metadata-label">Type</span>
      <span class="metadata-value">${type}</span>
    </div>
    <div class="metadata-item">
      <span class="metadata-label">Algorithm</span>
      <span class="metadata-value">${algo.name}</span>
    </div>
    <div class="metadata-item">
      <span class="metadata-label">Time</span>
      <span class="metadata-value">${appState.encryptionTime} ms</span>
    </div>
    <div class="metadata-item">
      <span class="metadata-label">Length</span>
      <span class="metadata-value">${text.length} chars</span>
    </div>
  `;
  
  // Update encryption time in metrics
  elements.encryptionTime.textContent = `${appState.encryptionTime} ms`;
  
  // Scroll to result
  elements.resultSection.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
}

// ==================== COPY TO CLIPBOARD ====================
function copyToClipboard() {
  navigator.clipboard.writeText(appState.resultText).then(() => {
    showToast('Copied to clipboard!', 'success');
  }).catch(() => {
    showToast('Failed to copy', 'error');
  });
}

// ==================== DOWNLOAD RESULT ====================
function downloadResult() {
  const timestamp = new Date().toISOString().replace(/[:.]/g, '-');
  const algo = algorithmData[appState.currentAlgorithm];
  const filename = `encrypted_${appState.currentAlgorithm}_${timestamp}.txt`;
  
  // Create file content with metadata
  const content = `CryptoVault Encryption Output
${'='.repeat(50)}
Algorithm: ${algo.fullName}
Key Length: ${algo.keyLength}
Timestamp: ${new Date().toLocaleString()}
Encryption Time: ${appState.encryptionTime} ms
${'='.repeat(50)}

${appState.resultText}`;
  
  // Create blob and download
  const blob = new Blob([content], { type: 'text/plain' });
  const url = URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href = url;
  a.download = filename;
  a.click();
  URL.revokeObjectURL(url);
  
  showToast('File downloaded successfully!', 'success');
}

// ==================== TOAST NOTIFICATION ====================
function showToast(message, type = 'success') {
  elements.toast.className = `toast ${type}`;
  elements.toastMessage.textContent = message;
  elements.toastIcon.textContent = type === 'success' ? '✓' : '✗';
  elements.toast.classList.remove('hidden');
  
  setTimeout(() => {
    elements.toast.classList.add('hidden');
  }, 3000);
}

// ==================== LOADING OVERLAY ====================
function showLoading() {
  elements.loadingOverlay.classList.remove('hidden');
}

function hideLoading() {
  elements.loadingOverlay.classList.add('hidden');
}

// ==================== UTILITY FUNCTIONS ====================
function arrayToHex(array) {
  return Array.from(array)
    .map(b => b.toString(16).padStart(2, '0'))
    .join('');
}

// ==================== START APPLICATION ====================
document.addEventListener('DOMContentLoaded', init);