Merge pull request #309 from uzulla/issue243/pic-upload-in-create-entry

エントリ作成の画像ファイル選択から画像をULする機能追加 #243

app/src/Web/Controller/Admin/FilesController.php

@@ -299,5 +299,49 @@ public function ajax_delete(Request $request): string
         return "admin/common/json.twig";
     }
 
+    /**
+     * ajaxによるファイルアップロード受付
+     * @param Request $request
+     * @return string
+     */
+    public function ajax_file_upload(Request $request): string
+    {
+        if ($this->isInvalidAjaxRequest($request) || $request->method !== 'POST' || !$request->isValidSig()) {
+            return $this->error403();
+        }
+
+        $files_model = new FilesModel();
+        $blog_id = $this->getBlogId($request);
+
+        // アップロード時処理
+        if ($request->file('file')) {
+            // 新規登録処理
+            $errors = [];
+            $errors['file'] = $files_model->insertValidate($request->file('file'), $request->get('file'), $data_file);
+            if (empty($errors['file'])) {
+                $data_file['blog_id'] = $blog_id;
+                $tmp_name = $data_file['tmp_name'];
+                unset($data_file['tmp_name']);
+                if ($id = $files_model->insert($data_file)) {
+                    // ファイルの移動
+                    $data_file['id'] = $id;
+                    $move_file_path = App::getUserFilePath($data_file, true);
+                    App::mkdir($move_file_path);
+                    if (defined("THIS_IS_TEST")) {
+                        rename($tmp_name, $move_file_path);
+                    } else {
+                        move_uploaded_file($tmp_name, $move_file_path);
+                    }
+                    $this->setContentType("application/json; charset=utf-8");
+                    $this->set('json', ['status' => 'ok']);
+                    return "admin/common/json.twig";
+                }
+            }
+        }
+
+        $this->setContentType("application/json; charset=utf-8");
+        $this->set('json', ['status' => 'ng']);
+        return "admin/common/json.twig";
+    }
 }
 

app/twig_templates/admin/entries/editor_js.twig

@@ -30,6 +30,9 @@
     <div id="sys-add-media-search">
         <input type="text" id="sys-add-media-search-keyword"/>
         <input type="button" value="{{ _('Search') }}" id="sys-add-media-search-button"/>
+        /
+        <input id="ajax_file_upload_file" type="file" name="file[file]">
+        <button type="button" onclick="ajax_file_upload('{{ sig }}');">{{ _('Upload') }}</button>
     </div>
     <hr/>
 

public/assets/admin/js/entry_editor.js

@@ -138,7 +138,48 @@ var addMedia = {
 };
 
 // 画面外クリック時にダイアログを閉じる処理
-$(document).on('click', '.ui-widget-overlay', function(){
+$(document).on('click', '.ui-widget-overlay', function () {
   $(this).prev().find('.ui-dialog-content').dialog('close');
 });
 
+// 画像選択ダイアログ内からのファイルアップロード
+const ajax_file_upload = (sig) => {
+  const xhr = new XMLHttpRequest();
+  xhr.open('POST', common.fwURL('Files', 'ajax_file_upload'));
+  xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+  xhr.onreadystatechange = function () {
+    if (xhr.readyState === 4) {
+      const data = JSON.parse(xhr.response);
+      if (data && data.status === "ok") {
+        $('#sys-add-media-load').load(
+            common.fwURL('Entries', 'ajax_media_load'),
+            function (response, status, xhr) {
+              if (status === "error") {
+                alert("エラーが発生しました、ページをリロードしてください。\n" +
+                    "Loading error. Please reload page.");
+              } else {
+                $('#sys-add-media-load').fadeIn('fast');
+                $('#sys-add-media-load').find('input[type=checkbox]').on('click', function () {
+                  if ($(this).prop('checked')) {
+                    $(this).closest('li').addClass('selected');
+                  } else {
+                    $(this).closest('li').removeClass('selected');
+                  }
+                });
+              }
+            }
+        );
+      } else {
+        alert("エラーが発生しました、ページをリロードしてください。\n" +
+            "Loading error. Please reload page.");
+      }
+    }
+  }
+
+  const form = new FormData();
+  const file_elm = document.getElementById("ajax_file_upload_file");
+  form.append('sig', sig);
+  form.append(file_elm.name, file_elm.files[0], file_elm.files[0].name);
+
+  xhr.send(form);
+}