今回から音声による読みあげ機能（キャストと呼ぶ）を実装していく。 仕様はこんな感じ。 テーマのタイトル、テーマの内容、返信の内容について音声を読み上げる。 投稿した本人はキャストできない。 複数のユーザがキャスト投稿できる（いずれ承認制にする…

前回、お題機能の実装を完了。 音声機能に入る前に、IPアドレスでのアクセス制御を組み込む。 Botによる書き込みが見られるようなので。 参考サイト leben.mobi ミドルウェア作成 ----- php artisan make:middleware BlockIpAddressMiddleware ----- ↓に作成…

前回、管理画面でのお題登録、削除を実装した。 今回はトップ画面にお題を表示する。 Modelに関数追加 現在日時が有効期限を過ぎていないお題のみ取得する関数 ----- public function get_themes_limit(){ $themes = Theme::select([ 't.id as theme_id', 't…

前置き 前回調整周りの作業を行った。 今回からいよいよ音声機能へーと予告していたのだが、 もう１機能追加したい。 それがはてなブログにもある「お題」機能。 サイトに何か書き込んでと言われても、おおまかなお題がないと、 書き込んでもらいにくいので…

前回はパスワードを忘れた際の画面のデザイン調整、日本語化を行った。 目次 パスワードリセット用メールの文言を日本語化 書き込んだユーザのIPアドレスを記録 migration model Controller 連続アクセスの抑制 パスワードリセット用メールの文言を日本語化 …

ちょっと空いてしまいましたが、開発してた投稿サイトの構築を再開。 tenomeuonome.hateblo.jp 友人にサイトを紹介して、そこでテーマを投稿してほしい、 要はサクラになってほしいとお願いしたのですが。 しばらくしてこんな連絡がきた。 「パスワードが違…

前回は、いいねのON／OFFの切り替えを実装した。 今回はおまけみたいなものだけど、いいね数の表示を実装する。 いいね機能についてはこれで終了とする。 目次 モデルファイル修正 bladeファイル修正 javascriptファイル修正 動作確認 まとめ モデルファイル…

前回 いいねボタンを押したら、非同期でいいねテーブルにいいね情報を登録する。 解除はまだできない。 目次 bladeファイル修正 js ファイル修正 動作確認 bladeファイル修正 ----- @if( $thread->isLike($thread->thread_id) ) {{-- いいね済 --}} <a class="toggle_like" thread_id="{{$thread->thread_id}}" like_val="1"><img src="{{ asset('image\like_on.svg') }}" class="icon_like" /></a>@else…

前回は、いいね機能実装でコントローラ作成とルーティングの追記。 まだいいね機能の動作確認はできていない。 目次 基本動作確認 ボタン配置 javascript関数作成 まとめ 基本動作確認 まず、単純にボタンを配置して機能を確認する。 ボタン配置 bladeファイ…

前回はイイネ機能実装のための準備。 テーブルの作成とモデルの作成。 目次 モデル関数追加 コントローラー作成 ルーティング追記 モデル関数追加 イイネした際に、likesテーブルにデータ追加する。 イイネ解除した際に、likesテーブルからデータを削除する…

今回からはイイネ機能を実装していきます。 目次 テーブル作成 モデル作成 リレーション 参考サイト テーブル作成 いいねした情報を納めるテーブルを作成。 ユーザIDと投稿ID（返信ID）をキーとする。 ----- php artisan make:migration likes ----- Schema:…

目次 前回 スタイル調整 返信投稿後の再表示 次回 前回 リプライの種類をアイコン選択で実装。 スタイル調整 返信ダイアログの表示が気に食わなかったので調整 ----- blade <div class="container p-0"> <div class="row"> <div class="col text-center"> <div> <input type="radio" name="rep_type" value="1" id="replyTypePositive" checked> <label for="replyTypePositive"></label></div></div></div></div>

目次 前回 妥協案 返信タイプを指定して投稿 再表示で返信タイプを表示 前回 ラジオボタンを画像に置換＋ツールチップ表示がうまくいかない。 妥協案 beforeに画像を表示していて、そこに対してツールチップを表示したいのだが、 ググってみても求めた答えが…

目次 前回 勘違い ボタンの非表示と画像フォーカス 前回 リプライの種類をラジオボタンで選択。 ラジオボタンを画像に置き換える修正をしたが、表示されなくなってしまった状態。 勘違い １つのbladeファイルにテーマ投稿に対する返信と、返信に対する返信の…

目次 前回 file_get_contentsのエラー ラジオボタンを画像に置換 前回 リプライの種類を投稿する機能の実装。 とりあえずラジオボタンを並べるところまで実装した。 file_get_contentsのエラー 何とはなしにトップページを表示したら、以下のエラーが。 ----…

目次 前回 リプライの種類を指定する機能 テーブルの準備（済） 返信の種類の定義 アイコンの準備 返信画面のレイアウト変更 次回 前回 参考URLを設定して投稿すると、タイトルと説明、画像からリンク枠を表示する対応でひと段落。 リプライの種類を指定する…

■前回 リンクの埋め込みは一旦やめて、他の策を探すことにする。 ■URLから関連情報を取得 リンクURLからページ情報を取得して、ページタイトルを取得する。 アンカーにURLと取得したページタイトルを設定することで、 参考URLのリンク先がわかるようにする。…

■前回 テーマ投稿に参考URLをフレーム表示で埋め込みたい。 が、特定サイトは接続が拒否されてしまう。 ■表示できるケースとできないケース どちらかというと一般的なページは表示できて、 yahooニュースやTwitterなどメジャーどころはできない？ などと予想…

■前回 テーマの投稿に参考URLを設定できるようにした。 テーブルにリンクURLを追加して、テーマ投稿時に参考URLを入力してもらい、 投稿したらURLをリンク表示する。 ■URL埋め込み 前回はOGPというのを検討していたのだが、 これは参照先のページが対応して…

■前回 投稿画面のモーダル表示の対応を行った。 ■URL入力とサムネイル表示 テーマ投稿時に、参照するURLなどがある場合は、 テキストと同時にURLも記載して投稿するようにしたい。 投稿後は、サムネイルで表示させたい。 はてなブログであれば↓ tenomeuonome…

■前回 実装できなくて横に置いていたモーダル画面の表示。 意外と簡単に実装できることが分かったのが前回。 ■モーダル画面から投稿 現状、テーマ投稿は画面上部に枠があって、そこから投稿する。 返信も対象の発言に枠があって、そこから返信内容を投稿する…

■前回 Herokuへの反映にちょっと手こずったが、手順は確立できてきたかな。というところ。 ■画面遷移にrouteを使う 細かい修正だが、画面遷移やPOSTする場合の記述がまちまちだった。 書きがち href="/detail?thread_id={{$thread->thread_id}}&reply_id=0" …

■前回 Herokuに反映はできたが、 ログイン時にエラーが発生。 Unable to locate a class or view for component [guest-layout]. ■原因 前回のエラーはjetstreamに関連するファイルが残っているからエラーが出ている、という認識だったので、関連するファイ…

■前回 tenomeuonome.hateblo.jp jQueryの導入。 ページ表示時に対象の返信の位置にフォーカスする対応。 ■ubuntu環境に修正内容を反映 windowsで開発しており、githubにpush済とする。 herokuにアップする前にubuntu環境に最新版をダウンロードする。 ------…

■前回 詳細画面で対象データにスクロールを合わせる対応で、 jQueryを導入する必要があったので設定してみたがエラーで中断。 そもそもjQuery入ってなかった、Laravelなら初期から有効になってるのだと思い込んでいたのが落とし穴。 ■webpack.mix.jsの再修正…

■前回 前回までの対応でサイトは以下のような構成になった。 トップ画面はテーマの一覧とそれぞれへの返信一覧を表示 テーマまたは返信をクリックすると詳細画面を表示 詳細画面では選択したデータの親情報と子情報の一覧を表示し、選択した情報に対して返信…

前回 モーダル画面表示を一旦諦めて。 改めて調べると他にもやり方はあるようなので、情報集めつつ保留。 ■仕様変更～記事詳細表示 やりたいのはTwitterの表示に近い。 投稿の詳細を表示して、紐づくテーマとしたにぶら下がる返信を表示する。 返信は詳細を…

前回 モーダルダイアログで入力させようとしたが、 Laravel/uiやbreezeが入った環境にjetstreamもインストールするとよろしくない、という情報を見かけて途方に暮れたところ。 ■編集前に戻す このまま調査を続けても泥沼にはまりそうだったので、 jetstream…

前回 ダイアログで投稿情報を入力させるため、livewireを導入。 ControllerからComponentクラスに変更してbladeファイルを元に画面を表示するように修正。 画面表示で「undefined 変数」のエラーで足止め。 ■bladeからComponentの変数を参照する記述 参考に…

【 注意 】 私のブログでこのページへのアクセスが一番多い。 アクセスがあるのは嬉しいが、このページで試していることは、 Laravelでlivewireを使ってダイアログ表示。 なんだけど、実現していません。 実現したのはBootstrapを使ったやり方です。↓ tenome…