見出し画像

掲示板の作り方#12 スレッドリストを表示する

こんにちは。Suipediaです(∩´∀`)∩。

前回、前々回でアイコン周りの実装をしました。

今回はトップページにあるスレッドの表示を行います。これ以降は実装や学びが少しずつ楽になってくると思います。

回を重ねるごとに新しい要素が出てくることが減ってきますので。


じゃあいきましょうか(; ・`д・´)



今回のゴール

今回の実装で

05_実装できた

このような表示ができるようにします。

かなり掲示板っぽくなってきましたね!


トップページの表示を実装する

今現在のトップページが・・・

01_今のトップ

はい。これです。連載が12回目まできてまだこの状態って・・・めちゃくちゃ寂しいですね(*´Д`)

では、今回の実装のステージとなるルートフォルダのc.phpを開いてください。

02_今のソース

う~ん。寂し~です。

では一気にソースを追加してしまいます。以下のソースを4,5行目の辺りに差し込んでください。

<?php
    /** ページ案内のメッセージ出力 */
    //include_once($webroot."/src/parts/pagingMessage.php");

    /** ページング */
    //include($webroot."/src/parts/paging.php");

    /** スレッド情報を全件取得 */
    $result = getFullThread();

    /* 今のページに描画する分の情報を切り出す */
    //$array = array_slice($result,$displayStartNumber,$displayNumber); //あとで開放する
    $array = array_slice($result,0,100);

    /** 1件ずつスレッドを出力する */
    foreach($array as $cItem){
        outThreadList($cItem);
    }

    /** ページング */
    //include($webroot."/src/parts/paging.php");
?>

今コメントアウトしている箇所は後続記事のどこかで解説します。

で、今のままだと用意できていない関数があるせいでエラーになってしまいます。

続きまして、function.phpに関数を追加していきます。

	/**
	 * スレッドをすべて取得する
	 * 
	 * @param $sideFlg 1ならサイド用に出力。それ以外はメイン用。デフォルトはNULL(メイン)。
	 */
	function getFullThread($sideFlg = NULL){
		$limitQuery = $sideFlg==1 ? " LIMIT 5" : "";
		/* 取得クエリ */
		$sql = "SELECT threadId ,title ,updatedy 
			  	  FROM bbs_thread
			 	 WHERE 1 AND disabledflg <> 1 
		  	  ORDER BY updatedy DESC,threadId ".$limitQuery;

		/* 取得準備 */
		$stmt = getDbh()->prepare($sql);
		/* スレッド情報を取得 */
		$stmt->execute();
		/** 全件を$resultに代入 */
		$result = $stmt->fetchAll();
		/** 呼び出しもとに取得結果を返す */
		return $result;
	}

まずはこれです。

03_関数追加

こんな感じになればOK。それからもうひとつ!

	/**
	 * スレッド情報の出力
	 * 
	 * @param $tItem スレッド情報
	 * @param $sideFlg 1ならサイド用に出力。それ以外はメイン用。デフォルトはNULL。
	 */	
	function outThreadList($tItem,$sideFlg = NULL){

		if($sideFlg==1){
			$className = 'thread-side';
			$messageLength = 40;
		}else{
			$className = 'thread';
			$messageLength = 50;
		}

		/* 最新レスポンス情報を取得 */
		$latest = getMeisaiLatest($tItem["threadId"]);
		/* 件数を取得 */
		$count = getResponseCount($tItem["threadId"]);
		/* パス */
		$pass = '/assets/images/icon/';
		$fileName = $latest["fileName"];
		$fileName = $latest["userType"] == 2 ? str_replace('.png','-left.png',$fileName) : $fileName;
		$imgFile = $pass.$fileName;
		
		p('
			<div class="'.$className.'" style="background-image: url('.$imgFile.');">
			<a href="/thread/'.$tItem["threadId"].'/" class="transmission">
		');
		
		if(isToday($latest["updatedy"])){
			p("<span class=\"new option2\">new</span>");
		}

		p('
			<h4>'.$tItem["title"].'('.$count.')</h4>
			<p>'.getTrimString($latest["message"],$messageLength).'</p>
			</a>
			</div>
		');
	}

長い!!これも続きに追加してください。

これでまずはブラウザをリロードしてみましょう。


あ・・・ごめんなさい。。。


まだ関数が足りませんでした。c.phpから呼び出している分は追加していただきましたが、関数の中で呼びだしてる別の関数がまだありますね。

先に画面表示を確認してからソースの説明、という段取りでいきますね。

引き続き、function.phpに関数を追加していきます。

ここから先は

13,031字 / 10画像
この記事のみ ¥ 300

この記事が気に入ったらサポートをしてみませんか?