brief-rags-bench/static/js/utils/dom.utils.js

/**
 * DOM Utilities
 *
 * Функции для работы с DOM (показать/скрыть элементы, обновить текст).
 */

/**
 * Показать элемент
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 */
export function showElement(element) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.style.display = ''
    el.classList.remove('hidden')
  }
}

/**
 * Скрыть элемент
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 */
export function hideElement(element) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.classList.add('hidden')
  }
}

/**
 * Переключить видимость элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 */
export function toggleElement(element) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    if (el.classList.contains('hidden')) {
      showElement(el)
    } else {
      hideElement(el)
    }
  }
}

/**
 * Установить текст элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 * @param {string} text - Текст для установки
 */
export function setElementText(element, text) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.textContent = text
  }
}

/**
 * Установить HTML элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 * @param {string} html - HTML для установки
 */
export function setElementHTML(element, html) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.innerHTML = html
  }
}

/**
 * Получить значение input элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 * @returns {string} Значение элемента
 */
export function getInputValue(element) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  return el ? el.value : ''
}

/**
 * Установить значение input элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 * @param {string} value - Значение для установки
 */
export function setInputValue(element, value) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.value = value
  }
}

/**
 * Добавить класс элементу
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 * @param {string} className - Имя класса
 */
export function addClass(element, className) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.classList.add(className)
  }
}

/**
 * Удалить класс у элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 * @param {string} className - Имя класса
 */
export function removeClass(element, className) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.classList.remove(className)
  }
}

/**
 * Проверить наличие класса у элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 * @param {string} className - Имя класса
 * @returns {boolean} True если класс есть
 */
export function hasClass(element, className) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  return el ? el.classList.contains(className) : false
}

/**
 * Показать toast уведомление
 * @param {string} message - Сообщение
 * @param {string} type - Тип ('info', 'success', 'error', 'warning')
 */
export function showToast(message, type = 'info') {
  // TODO: Implement proper toast/snackbar component
  console.log(`[${type.toUpperCase()}] ${message}`)
  alert(message)
}

/**
 * Очистить всех детей у элемента
 * @param {string|HTMLElement} element - ID элемента или сам элемент
 */
export function clearChildren(element) {
  const el = typeof element === 'string' ? document.getElementById(element) : element
  if (el) {
    el.innerHTML = ''
  }
}

/**
 * Создать элемент с атрибутами
 * @param {string} tag - Тег элемента
 * @param {object} attributes - Атрибуты элемента
 * @param {string|HTMLElement} parent - Родительский элемент (опционально)
 * @returns {HTMLElement} Созданный элемент
 */
export function createElement(tag, attributes = {}, parent = null) {
  const el = document.createElement(tag)

  for (const [key, value] of Object.entries(attributes)) {
    if (key === 'class') {
      el.className = value
    } else if (key === 'text') {
      el.textContent = value
    } else if (key === 'html') {
      el.innerHTML = value
    } else {
      el.setAttribute(key, value)
    }
  }

  if (parent) {
    const parentEl = typeof parent === 'string' ? document.getElementById(parent) : parent
    if (parentEl) {
      parentEl.appendChild(el)
    }
  }

  return el
}