import './ui/css/variables/definition.scss';
import './ui/css/common.scss';
import { createElement } from "./functions";
import { createIcon, changeIcon, resolveIcon } from "./ui/icon";
import { createCheckbox, createRadiobox, resolveCheckbox } from "./ui/checkbox";
import { setTooltip, resolveTooltip } from "./ui/tooltip";
import { createTab } from "./ui/tab";
import { Dropdown } from "./ui/dropdown";
import { Grid } from "./ui/grid/grid";
import { GridColumn, GridInputColumn, GridDropdownColumn, GridCheckboxColumn, GridIconColumn, GridTextColumn, GridDateColumn } from './ui/grid/column';
import { Popup, createPopup, resolvePopup, showAlert, showConfirm } from "./ui/popup";
import { createPicture, createAudio, createVideo, createFile, createVideoList } from './ui/media';
import { validation, convertCssStyle } from './ui/extension';
import { createDateInput, toDateValue, getFormatter, formatDate, setDateValue, getDateValue, DateSelector } from './ui/date';
import * as utility from './utility';

function requestAnimationFrame(callback) {
  if (typeof utility.global.requestAnimationFrame === 'function') {
    utility.global.requestAnimationFrame(callback);
  } else {
    setTimeout(callback, 0);
  }
}

function scrollLeft() {
  const n = document.documentElement;
  return (utility.global.scrollX || n.scrollLeft) - (n.clientLeft || 0);
}

function scrollTop() {
  const n = document.documentElement;
  return (utility.global.scrollY || n.scrollTop) - (n.clientTop || 0);
}

/**
 * @private
 * @param {HTMLElement} e 
 */
function offset(e) {
  const rect = e.getBoundingClientRect();
  return {
    top: rect.top + scrollTop(),
    left: rect.left + scrollLeft(),
    height: rect.height,
    width: rect.width
  };
}

class OptionBase {
  _option;

  r;

  constructor(opt) {
    this._option = opt;
    const getText = opt.getText;
    if (typeof getText === 'function') {
      this.r = getText;
    } else if (typeof GetTextByKey === 'function') {
      this.r = GetTextByKey;
    } else {
      this.r = utility.r;
    }
  }
}

export {
  createElement,
  // icon
  createIcon,
  changeIcon,
  resolveIcon,
  // checkbox
  createCheckbox,
  createRadiobox,
  resolveCheckbox,
  // tooltip
  setTooltip,
  resolveTooltip,
  // tab
  createTab,
  // dropdown
  Dropdown,
  // grid
  Grid,
  GridColumn,
  GridInputColumn,
  GridDropdownColumn,
  GridCheckboxColumn,
  GridIconColumn,
  GridTextColumn,
  GridDateColumn,
  // popup
  Popup,
  createPopup,
  resolvePopup,
  showAlert,
  showConfirm,
  // dateSelector
  createDateInput,
  toDateValue,
  getFormatter,
  formatDate,
  setDateValue,
  getDateValue,
  DateSelector,
  // media
  createPicture,
  createAudio,
  createVideo,
  createFile,
  createVideoList,
  // extension
  validation,
  convertCssStyle,
  // utility
  utility,
  // functions
  requestAnimationFrame,
  offset,
  // base classes
  OptionBase
}