<script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest"></script>>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/paragraph@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/header@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/list@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/checklist@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/quote@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/code@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/table@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/link@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/image@latest"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/@editorjs/simple-image@latest"></script> -->

<script>
var jsonText = ${jsonTextLoad}.value;
alert(jsonText);
const savedData = jsonText ? JSON.parse(jsonText) : null

const editor = new EditorJS({

  holder: '${holder}',

  tools: {
    paragraph: {
      class: Paragraph,
      inlineToolbar: true,
      config: {
        // 空行許可
        preserveBlank: true,
      },
    },
    header: {
      class: Header,
      inlineToolbar: ['link'],
    },
    list: {
      class: List, 
      inlineToolbar: true,
    },

    image: {
      class: ImageTool,
      config: {
        uploader: {
          uploadByFile(file){
            return AjaxUpload.upload(file);
          },
          uploadByUrl(url){
            return AjaxUpload.upload(file);
          }
        }
      }
    },

    checklist: Checklist,
    quote: Quote,
    code: CodeTool,
    table: Table,
    //image: SimpleImage,
  },
  data: savedData,
});


class AjaxUpload {
  static upload(file) {
    let token = document.getElementById('${token}');
    //alert('upload:file='+file.name+' token='+token);
    let formData = new FormData();
    formData.append('file', file);
    formData.append('token', token.value);
    return $.ajax({
      url  : '${imageUploadUrl}',
      type : 'POST',
      data : formData,
      processData: false,
      contentType: false,
    })
  }
}

</script>


<script>

async function editorjs_save() {
  let res = false;
  try {
    let saveData = await editor.save();
    ${jsonTextSave}.value = JSON.stringify(saveData);
    //alert('#1:jsonTextSave='+${jsonTextSave}.value);
    res = true;
  } catch(ex) {
    console.log(ex.message);
  }
  return res;
}

const submitButton = document.getElementById('${submitButtonId}');
submitButton.addEventListener('click', async () => {
  if (await editorjs_save()) {
    //alert('#2:jsonTextSave='+${jsonTextSave}.value);
    jsfn_submit2(form_1, 'editorSubmit');
  }
});


// onclick だと2回呼ばれるため解決まで使用しない
function editorjs_save_submit(formName, url) {
  alert('editorjs_save_submit');
  if (editorjs_save()) {
    jsfn_submit2(formName, url);
  }
}

</script>
