import EditorJS from '@editorjs/editorjs';
//import Header from '@editorjs/header';
//import List from '@editorjs/list';

import createHTML from './createHTML';

import getGithubClient from './getGithubClient';
import { applyStyles } from './applyStyles';

import resetURL from './resetURL';

import openRetry from './openRetry';
import getInfo from './getInfo';
import changeFile from './changeFile';

const editor = data => {
  document.getElementById('like-water').innerHTML = '';

  const tools = {};
  const t = {
    header: require('@editorjs/header'),
    list: require('@editorjs/list'),
    marker: require('@editorjs/marker'),
    quote: require('@editorjs/quote'),
    inlineCode: require('@editorjs/inline-code'),
    delimiter: require('./delimiter'),
    image: require('@editorjs/simple-image'),
    embed: require('@editorjs/embed')
    //rawTool: require('@editorjs/raw'),
    //table: require('@editorjs/table')
  };

  Object.keys(t).forEach(key => {
    tools[key] = { class: t[key], inlineToolbar: true };
  });

  const editor = new EditorJS({
    /**
     * Id of Element that should contain Editor instance
     */
    holder: 'like-water',
    autofocus: true,

    onReady: () => {
      const styles = document.querySelectorAll('style:not(._initial)');

      [].forEach.call(styles, style => {
        style.remove();
      });

      applyStyles({
        from: 'ol',
        to: '.cdx-list--ordered',
        properties: ['padding', 'margin']
      });
      applyStyles({
        from: 'p',
        to: '.ce-paragraph',
        properties: ['padding', 'margin']
      });
    },
    tools,

    data
  });

  getGithubClient()
    .then(octokit => {
      window.onhashchange = () => {
        if (window.location.hash === '#save') {
          resetURL();
          editor
            .save()
            .then(content =>
              changeFile({
                content: JSON.stringify(content),
                options: getInfo(),
                octokit,
                type: 'json'
              }).then(status1 => {
                const status2 = changeFile({
                  content: createHTML(content),
                  options: getInfo(),
                  octokit,
                  type: 'html'
                });
                return Promise.all([status1, status2]);
              })
            )
            .catch(error => {
              console.log('Saving failed: ', error);
            });
        }
      };
    })
    .then(console.log)
    .catch(() => openRetry());
};

export default editor;