PDFプレビュー機能について

• 実装を検討中

経緯

• ユーザー様からのご要望

概要

• GROWI の編集画面で pdf ファイルをドラッグした際の UI を検討する

競合他社さんはどうなってる？

note pm

• 見た目
  • GROWI と同様ファイル名が出てくる
  • ファイルリンクのすぐ下にプレビューがでる
• リンククリック時
  • 別タブで開く

esa

• 見た目
  • GROWI と同様ファイル名が出てくる + ファイルサイズが出てくる

kibela

• 見た目
  • pdf のテンプレートが見える

docbase

• 見た目
  • pdf のリンクの横に pdf っぽいアイコンが表示される

tracery

• 見た目
  • GROWI と同じ
• リンククリック時
  • ダウンロードになる

notion

• 添付するとブロック要素のようになる
• クリックすると別タブで開く

confluence

• サムネイルのほかに添付日時が出てくる
• クリックするとプレビューが出てくる
  • ブラウザではなくライブラリを利用して表示している

GROWI での実装案

• preview はさせたいが邪魔にならない見た目がいい

意見交換

• 別ドメインURLの _target をどうするか
  • 管理者が設定できるようにする(yuki)
• PDF.js 要調査
• サムネイルを採用すれば割と自由で何でも入れられる
• 表示する情報
  • 日付あるといい？
  • アップロード
• PDF以外
  • 開閉でプレビューできる

ショートカットについて

• GROWI のショートカット、もっとこんなの欲しい！

GROWIのショートカット

グローバルショートカット

• ショートカットヘルプの表示/非表示：CTRL + /
• ページ作成：C
• ページ編集：E
• コントリビューターを表示：↑ ↑ ↓ ↓ ← → ← → B A
• ミラーモード：X X B B A Y A Y ↓ ←

エディターショートカット

• インデント：TAB
• 左インデント：SHIFT + TAB
• 保存CTRL + S
• 行削除：CTRL + D

コメントフォームショートカット

• 投稿：CTRL + ↲
  • ページ作成の中でも欲しい
• 行削除：CTRL + D

他のツールのショートカット

• NotePM external_link

  • ページ登録

• esa external_link

  • 記事にstarをつける / はずす
  • リンク記法を挿入
  • 自分のメンバー絵文字を挿入

• Kibera external_link

  • 検索窓への移動
    • 欲しいという声多数
    • スラッシュ
    • Twitter も