PHP7 Bootstrap4で「PDFファイルの本棚」を実装する（PDFファイル一覧化＋クリック再生）

世の中の気になるニュースを目にしたそのタイミングで自分のサーバに時系列に保存したい。

欲しい情報の

　・URLを貼り付ければ

　・PDFファイルにして

　・時系列（降順）に

　・サーバに保存してくれる

機能は以前実装した。こんなの。

f:id:min117:20200105205050p:plain

自分用に色々と作った中でこれが特に重宝している。

ただ、せっかくPDF保存された情報をリンクで開くんじゃなくて、画面で本棚みたいに並べたい。

作った。こうなる。

f:id:min117:20200105205730p:plain

・PDFの1ページ目をサムネイル画像として表示する

・その上に重ね（overlay）して「表示」ボタンを置いた。押せばPDFが開く。

・「表示」ボタンの横には保存件数を表示している（Bootstrapのbadge機能）

端末は問わない。iPadだろうがAndroidだろうが全く同じように記事がみられる。 f:id:min117:20200105205912j:plain

php最高。

さらにiPhoneだと横幅が狭いので縦に1列に並んでくれる。Bootstrapのcardクラスのおかげ。

f:id:min117:20200105210145p:plain f:id:min117:20200105210247p:plain

しかもこれを横にするとまた複数ページに戻ってくれたりする。とても使いやすい。Bootstrap最高。

f:id:min117:20200105212326j:plain

※ 画像がボヤけているのは敢えて。通信料を減らすためにimgタグに貼る画像の解像度を（画像の輪郭が分かる）ギリギリまで落としてあるから。

「文字抽出」ボタンはまだ置いただけで機能はしていない。tesseractで画像から文字列を読み込んで、クリックしたら表示されるようにしたい。そうすればURL記事からじゃなくて一般の写真からも文字列を生成できそうだから。

文字コードをUTF-8にするところにクセがありそう。

正月も終わってしまったので、この冬の実装はこれくらいにする。他にも色々作れたし、WordPressの環境もできたし。良い正月だった。

min117の日記