javascript - 画像を選択した後にtinyMCE画像アップロードポップアップフィールドにデータを入力する方法

Question

最初に言うと、tinyMCEバージョンで立ち往生しています4.0.20(安定性の問題により、プロジェクトでバージョンを更新できません)。

tinyMCE エディターと必要なすべてのプラグインを開始しました。ここに画像アップロード機能が必要です (実際には、画像をdata imageとして埋め込みます)。その目的で、これまでにコードを実行したことは、このjsfiddleにあります

以下、file_browser_callbackこれまで書いてきたものです。

function (field_name, url, type, window) {
   var input = document.createElement('input');
   input.setAttribute('type', 'file');
   input.setAttribute('accept', 'image/*');

   input.onchange = function () {
        var file = this.files[0];
        var reader = new FileReader();

        reader.onload = function () {
        var base64 = reader.result;

        var image = new Image();
        image.src = base64;
        image.alt = file.name;

        image.onload = function () {
          /*
           * just to work around I tried below to populate the fields.
           * but for putting dimesions, I dont know how to do that. I
           * think there should be some function or something in tinyMCE
           * for that purpose
           */
               window.document.getElementById(field_name).value = image.src;
               $('input.mce-last', window.document).val(image.alt);
          }

        };

        reader.readAsDataURL(file);
  };

  input.click();
}

ポップアップ フィールドに画像のタイトル、説明、および画像のメタ データからの寸法を入力したいと考えています。そして、寸法フィールドの横にチェックボックスがあることに気付くでしょう

以下の画像がわかりやすいと思います。

どんな助けでも大歓迎です。