import React from 'react';
import styled from 'styled-components';
import PdfFile from './PdfPreview';
import XlsPreview from './XlsPreview';
import FilePreview from './FilePreview';
import ErrorPreview from './ErrorPreview';
import ImagePreview from './ImagePreview'
import { RendererProps } from '../../../../factory';

import { pdfjs } from "react-pdf";
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;

interface IProps {
  current: any;
  visible: boolean;
  setVisible: () => void;
}

export type _Preview_Props = IProps;

const Wrapper = styled.div`
  .pdf-modal{
    .ant-modal-body{
      padding: 24px 6px 0px !important;
    }
  }
`

export default class LionFilePreview extends React.PureComponent<IProps & RendererProps, any> {

  isAssetTypeAnImage = (ext: string) => {
    return [
      '.png', '.jpg', '.jpeg', '.bmp', '.gif', '.webp', '.psd', '.svg', '.tiff'].
      includes(ext.toLowerCase());
  }

  execFile = (filename: string) => {
    const _suffix = /\.\w+$/.exec(filename);
    return _suffix ? _suffix[0] : false
  }

  render() {
    const { current, visible, setVisible, env } = this.props;
    // window.baseURL = env?.axiosInstance?.defaults?.baseURL || env?.ajaxApi
    const _suffix = current && current?.name && (current?.addr || current?.url) ? this.execFile(current?.name) : false;
    return (
      <div>
        {
          current && current?.name && (current?.addr || current?.url) ? (
            _suffix && _suffix === '.pdf' ?
              <PdfFile env={this.props.env} visible={visible} current={current} setVisible={setVisible} /> :
              (
                _suffix && (_suffix === '.txt' || _suffix === '.md') ?
                  <FilePreview {...this.props} visible={visible} current={current} setVisible={setVisible} /> :
                  (_suffix && this.isAssetTypeAnImage(_suffix) ? <ImagePreview {...this.props} env={this.props.env} visible={visible} current={current} setVisible={setVisible} /> : <ErrorPreview visible={visible} current={current} env={this.props.env} setVisible={setVisible} tip="不支持的文件类型" />)
              )
            // <ErrorPreview visible={visible} current={current} setVisible={setVisible} tip="不支持的文件类型" />
          ) : <ErrorPreview env={this.props.env} visible={visible} current={current} setVisible={setVisible} tip="文件加载失败" />
        }
      </div>
    )
  }
}