fjordllc / bootcamp

プログラマー向けEラーニングシステム
https://bootcamp.fjord.jp
MIT License
281 stars 71 forks source link

ファイル選択ダイアログから画像を添付したい #6259

Closed JunichiIto closed 1 year ago

JunichiIto commented 1 year ago

FBCのテキストエリアではドラッグ&ドロップしか画像を添付する方法がない(はず)。 ただ、場合によってはドラッグ&ドロップよりも画像添付のボタンをクリックして、ファイル選択ダイアログからファイルを選択する、という昔ながら方法の方が速いことがあります。(ドラッグ&ドロップが面倒な例:現在表示されているウインドウを全部どけて、その背後に隠れていたデスクトップ上の画像をドラッグしてくる場合など)

たとえばQiitaやGitHubなどでは画像添付用のボタン(?)があるので、こんな感じでファイル選択ダイアログを表示できるようにしてもらえると嬉しいです。

Qiita github
github-actions[bot] commented 1 year ago

このissue|PRは60日間更新がないため7日後にcloseします。closeしたくない場合はstaleラベルを外してください。

YukiWatanabe824 commented 1 year ago

23年5/31ミーティングにて <input>を使用して「ファイル選択ダイアログでのファイル添付」実装の確認がとれました。 <input>にID等を付加することでtextarea-markdownにおけるプレビューと同様にオプション的に実行できる形で実装します。

これによって機能そのものの実装はtextarea-markdownに、<input>のデザインはbootcampで行います。

YukiWatanabe824 commented 1 year ago

@komagata @machida お疲れ様です。 <input>を使用してファイル選択ダイアログからファイル添付できる機能をひとまず形になりました。

スクリーンショット 2023-06-04 14 02 49

この<input>によるファイル添付は、テキストエリアと同じview(パーシャル)内でtextarea要素のdata-input属性で指定した値と同値のクラスをもつ <input>要素がある場合に機能するようにしました。 2878b8c00b5a047e590d53e85546e6b6

そのためview(パーシャル)ごとに実装(<input>を追加してデザインを付加)する必要があります。

今回Issueではどこにこの機能を実装するのが良いでしょうか? ↑のスクショに関しては開発上たまたま日報ページで作りましたが、これまで特に指定はありませんでした。

YukiWatanabe824 commented 1 year ago

6/6 MTGにて 必要箇所全てに実装して町田さんにデザイン依頼するフローで進めることの確認が取れました

YukiWatanabe824 commented 1 year ago

本番環境で確認ができましたのでcloseいたします〜