window.FManager = function(el, data) {
  ReactDOM.render(
    <div>
      <Manager opt={data} /> //파일매니저 전체 컴포넌트
    </div>,
    document.getElementById(el)
  );
};

//webpack.config.js 설정의 일부

const FILEUPLOADER_PATH = path.resolve(
  APP_PATH,
  "components/Uploader/render.js"
); //ReactDOM 을 render 해주는 component의 위치

module.exports = {
  entry: {
    filemanager: FILEUPLOADER_PATH //filemanager.js 로 export 시키는 엔트리 생성.
  }
};

window.FManager; //filemanager.js 에서 선언된 윈도우 함수.

new FManager("manager", {
  //첫번째 인자는 document.getElementById() 에 들어갈 엘리먼트 id
  apiSetup: {
    endpoint: "", //API URL | String
    apiKey: "" //access_token | String
  },
  uploadOpt: {
    restrictions: {
      maxFileSize: 1100000, //개별 파일 용량(환산:bytes) | Number
      maxNumberOfFiles: 5, //최대 업로드 파일갯수 | Number
      allowedFileTypes: ["image/png", "image/jpg", "image/gif", "image/jpeg"] //업로드 가능한 확장자 | Array
    },
    button: {
      style: {
        marginTop: "2px", //String
        marginRight: "4px" //String
      },
      class: "btn btn-sm btn-m-black", //버튼 커스텀 클래스 | String
      text: "Upload files" //버튼 커스텀 텍스트 | String
    },
    strings: {
      //업로더 텍스트 영역
      browse: "찾아보기", //파일 업로드버튼 커스텀 텍스트 | String
      note: "이미지 전용, 1-5 개의 파일, 최대 1MB" //업로드 설명 | String
    },
    plugin: {
      uploadSuccessful(data) {
        console.log("업로드성공", data); //업로드 성공 콜백
      },
      uploadFailed(data) {
        console.log("업로드실패", data); //업로드 실패 콜백
      }
    }
  },
  managerOpt: {
    resetChecked: false, //체크박스 초기화 | Boolean
    multipleCheck: true, //다중 선택여부 | Boolean
    copyButton: "btn btn-m-pink btn-icon-anim btn-circle", //복사하기 버튼 커스텀 클래스 | String
    downloadButton: "btn btn-m-blue btn-icon-anim btn-circle", //다운로드 버튼 커스텀 클래스 | String
    modal: {
      modalTitle: "File management", //모달 타이틀 | String
      buttonTitle: "File manager", //버튼 타이틀 | String
      buttonClass: "btn btn-m-default btn-sm", //버튼 커스텀 클래스 | String
      backdrop: "false" //배경그림자 | String
    },
    plugin: {
      selectFiles(data) {
        console.log("선택된파일", data); //선택된 파일 콜백
      },
      deleteFiles(data) {
        console.log("지워진파일", data); //지워진 파일 콜백
      }
    }
  }
});