モーニング娘。在籍日数等一覧　機能追加　ソースと解説

2013年の11月に在籍日数順の一覧表を作ったのですが、その後思いつくままに生年月日順、誕生日順の一覧表を追加してきました。つい最近になって、本来あるべき加入日順の一覧表が無いという事に気付きました。そもそも、メンバーの在籍日数の変化、それにともなって卒業した先輩メンバーを追い越す様子を眺めるためのものだったので、そんなことは当初は考えてもみなかったのです。

しかし、せっかくデータベースを使っているのですから、そこから引き出せる情報は工夫しだいでいくらでも可能です。そこで、今回は、機能としては、加入日順の一覧と選択した期のみの一覧の表示、そして画面の左側にナビゲーションを配置して切り替えが簡単にできるようにしてみました。

2018年9月19日(水)　なんと大変なバグを見つけました。えっ今更？と思われるでしょうが、なぜこれまで気付かなかったのか自分でも不思議です。

たとえば、1期のみを表示しようとすると、なぜか、1期の他に10期、11期、12期、13期、14期も表示されるのです。2期を指定すると、2期と12期が表示されます。3期を指定すると3期と13期が、そして4期を指定すると4期と14期が表示されるという現象が起きていました。

これは、データベースからレコードを抽出する際に、入力した数字のみならず、その数字が入っている期の数字も選択してしまうという現象です。

これは、model内の関数でwhreと書くべき所をlikeと書いてしまった間違いでした。気が付いてすぐに修正しました。

phpソース

実際の文字コードはUTF-8ですが、ここではShift-JISにして表示します。

MVC	file name	概要
Controller	musume.php	プログラムの本体今回はfunction kanyubijun()とfunction kinomi()を追加
Model	musume_model.php	データベース関連関数の定義今回はfunction get_member_list_kanyubijun()とfunction get_member_list_ki($ki)を追加
View	musume_main.php	在籍日数順一覧表示のhtmlを作る部分
	musume_birthjun.php	生年月日順一覧表示のhtmlを作る部分
	musume_tanjobijun.php	誕生日順一覧表示のhtmlを作る部分
	musume_kanyubijun.php	加入日順一覧表示のhtmlを作る部分（今回追加）
	musume_kinomi.php	期のみの一覧表示のhtmlを作る部分（今回追加）
	musume_sidemenu.php	左側のナビゲーション画面（今回追加）
	musume_tmpl.php	Webブラウザに送るhtmlを構成する枠組
	header.php	AvocadoMix共通ヘッダー
	footer.php	AvocadoMix共通フッター

controllers/musume.php　（関数を二個追加）

<?php
/*
 * file : contorollers/musume.php
 * title: モーニング娘。在籍日数
 * auther: 佐々木一郎
 * date : 2013.11.04
 *        2017.08.12 全面改訂
 */

class Musume extends Controller {

	function Musume()
	{
		parent::Controller();
		$this->load->helper(array('form', 'url'));
		$this->load->model('Musume_model');
		$this->output->set_header('Content-Type: text/html; charset=UTF-8');
	}

# メンバー一覧を表示する　在籍日数が多い順
	function index()
	{
		//データベースからメンバー全員のデータを連想配列に読み込む
		$data['list'] = $this->Musume_model->get_member_list();

		//写真のファイル名をランダムに生成する
		$data['photo']	= $this->Musume_model->generate_photo_name();

		//コンテンツ部分のhtmlを連想配列内に作成する
		$data['main']   = $this->load->view('musume_main', $data, TRUE);

		//htmlテンプレートに必要部分を結合して表示する
		$this->load->view('musume_tmpl', $data);
	}

# メンバー一覧を生年月日順に表示する 2014.10.4追加
	function birthjun()
	{
		//データベースからメンバー全員のデータを連想配列に読み込む
		$data['list'] = $this->Musume_model->get_member_list_birthjun();

		//写真のファイル名をランダムに生成する
		$data['photo']	= $this->Musume_model->generate_photo_name();

		//コンテンツ部分のhtmlを連想配列内に作成する
		$data['main']   = $this->load->view('musume_birthjun', $data, TRUE);

		//htmlテンプレートに必要部分を結合して表示する
		$this->load->view('musume_tmpl', $data);
	}

# メンバー一覧を誕生日順に表示する 2016.07.24追加
	function tanjobijun()
	{
		//データベースからメンバー全員のデータを連想配列に読み込む tanjobi順
		$data['list'] = $this->Musume_model->get_member_list_tanjobijun();

		//写真のファイル名をランダムに生成する
		$data['photo']	= $this->Musume_model->generate_photo_name();

		//コンテンツ部分のhtmlを連想配列内に作成する
		$data['main']   = $this->load->view('musume_tanjobijun', $data, TRUE);

		//htmlテンプレートに必要部分を結合して表示する
		$this->load->view('musume_tmpl', $data);
	}

# メンバー一覧を加入日順に表示する 2017.08.12追加
	function kanyubijun()
	{
		//データベースからメンバー全員のデータを連想配列に読み込む kanyubi順
		$data['list'] = $this->Musume_model->get_member_list_kanyubijun();
		//写真のファイル名をランダムに生成する
		$data['photo']	= $this->Musume_model->generate_photo_name();

		//コンテンツ部分のhtmlを連想配列内に作成する
		$data['main']   = $this->load->view('musume_kanyubijun', $data, TRUE);

		//htmlテンプレートに必要部分を結合して表示する
		$this->load->view('musume_tmpl', $data);
	}
# ブラウザから渡された期だけを表示する。(2017.08.12追加)
	function kinomi()
	{
		//postされた値があれば変数に取り込み、無ければ無視する
		if ($this->input->post('ki'))
		{
			$ki = $this->input->post('ki');
		}
		else
		{
			//無視する。
			redirect('/musume');
		}
		//model内のget_member_list_ki($ki)にパラメータ（期）を渡して、そのリストを得る
		$data['list'] = $this->Musume_model->get_member_list_ki($ki);
		//写真のファイル名をランダムに生成する
		$data['photo']	= $this->Musume_model->generate_photo_name();


		//コンテンツ部分のhtmlを連想配列内に作成する
		$data['ki'] = $ki;
		$data['main']   = $this->load->view('musume_kinomi', $data, TRUE);

		//htmlテンプレートに必要部分を結合して表示する
		$this->load->view('musume_tmpl', $data);
	}


# 本日が誕生日であるメンバーがいたらその名前と年齢を表示。2016.07.24改訂
# Avocado Mix の継続日数を表示する（Viewのみで処理する）
	function avocadomix()
	{
		//本日の月日をシステム日付から取り出す
		$honjitsu = date("m").date("d");
		//データベースからメンバー全員のデータを連想配列に読み込む
		$data['list'] = $this->Musume_model->get_member_list_birthjun();
		foreach($data['list'] as $row):
			$member_birthday = substr($row->birthday,4,4); //メンバーの誕生月日
      if ($honjitsu == $member_birthday) //本日が誕生日ならば
				{
					//年齢（年のみ）を算出する
					$nenrei = floor((date('Ymd') - $row->birthday)/10000);
					$namae = $namae.$row->name."さん".$nenrei."歳";
				}
		endforeach;
		if ($namae != "")
			{
				//表示文字列をセットする
				$data['dspmsg'] = $namae."の誕生日です。";
			}
		//表示するメイン部分をセットする
		$data['main'] = $this->load->view('avocadomix_main', $data, TRUE);
		//画面表示をする
		$this->load->view('avocadomix_tmpl',$data);
	}

}
?>

今回追加したのは、function kanyubijun()とfunction kinomi()です。

function kanyubijun()の方は特に特徴も無く、データベースからkanyubi項目の昇順に読み出したレコードを連想配列に読み込んで、表示用のthmlを作るという流れです。

function kinomi()の方は、ブラウザ上でユーザーが選択した期のデータをPOST方式で受け取り、これが無い場合はまさかエラー表示するのも面倒ですからデフォルトとして在籍日数順一覧を表示します。データがある場合はこれを$kiという変数に格納します。それをパラメータとしてモデル内のget_member_list_ki($ki)にパラメータ（期）を渡して、そのリストを受け取り、これを表示用の連想配列に格納します。さらに何期の一覧なのかがわかるように見出しに表示する為に、期の数字部分を連想配列に入れて起きます。

views/musume_model.php　（関数を二個追加）

<?php
Class Musume_model extends Model
{
	function Musume_model()
	{
		parent::Model();
		$this->load->database();
	}

	//メンバー一覧を得る（順番順）
	function get_member_list()
	{
		$this->db->order_by('jun');
		$query = $this->db->get('morningmusume');
		return $query->result();
	}

	//メンバー一覧を得る（生年月日順） 2014.10.3追加
	function get_member_list_birthjun()
	{
		$this->db->order_by('birthday');
		$query = $this->db->get('morningmusume');
		return $query->result();
	}

	//メンバー一覧を得る（誕生日順） 2016.07.24追加
	function get_member_list_tanjobijun()
	{
		$this->db->order_by('tanjobi');
		$query = $this->db->get('morningmusume');
		return $query->result();
	}

	//メンバー一覧を得る（加入日順） 2017.08.12追加
	function get_member_list_kanyubijun()
	{
		$this->db->order_by('kanyu');
		$this->db->order_by('birthday');
		$query = $this->db->get('morningmusume');
		return $query->result();
	}

  //渡されたパラメータ（期）に該当するレコードのみ返す。(2017.08.12追加)
	function get_member_list_ki($ki)
	{
		$this->db->whre('ki', $ki); //likeからwhereに修正(2018.09.19)
		$this->db->order_by('birthday');
		$query = $this->db->get('morningmusume');
		return $query->result();
	}

	//メンバー一覧を得る（ID順） 2015.05.19追加
	function get_member_list_idjun()
	{
		$this->db->order_by('id');
		$query = $this->db->get('morningmusume');
		return $query->result();
	}

	//メンバーレコードを得る 2015.05.19追加
	function get_member($id)
	{
		$this->db->where('id', $id);
		$query = $this->db->get('morningmusume');
		return $query->row();
	}

	//レコードの有無 2015.05.19追加
	function exist_member($id)
	{
		$this->db->where('id', $id);
		$query = $this->db->get('morningmusume');
		if ($query->num_rows() == 1)
		{
			return TRUE;
		}
		else
		{
			return FALSE;
		}
	}

	//メンバーを追加する。 2015.05.19追加
	function insert_member($data)
	{
		$this->db->insert('morningmusume', $data);
	}

	//メンバーを削除する 2015.05.19追加
	function delete_member($id)
	{
		$this->db->where('id', $id);
		$this->db->delete('morningmusume');
	}

	//メンバーを更新する。 2015.05.19追加
	function update_member($data)
	{
		$id = $data['id'];
		$this->db->where('id', $id);
		$this->db->update('morningmusume', $data);
	}


	//乱数で画像ファイル名を生成する sayumi101.jpgからsayumi228.jpgまで
	function generate_photo_name()
	{
		mt_srand();
		$num = mt_rand(101,228);
		$file_name = 'sayumi'.$num.'.jpg';
		return $file_name;
	}

	//乱数で画像ファイル名を生成する michishige100.jpgからmichishige198.jpgまで
  //2017.07.25画像を追加して、233枚になった。
  //2017.08.07画像を追加して、262枚になった。
	function generate_michishige_photo_name()
	{
		mt_srand();
		$num = mt_rand(100,262);
		$file_name = 'michishige'.$num.'.jpg';
		return $file_name;
	}

	//渡された年月日から本日現在の年齢を計算する。
	function nenrei($ymd)
	{
		$now = date('Ymd');
		$nenrei_y =floor(($now-$ymd)/10000);
		$y = floor($ymd / 10000);
		$md= $ymd - $y * 10000;
		$nenrei_md = date('md') - $md;
		if ($nenrei_md < 0) {
			$nenrei_md = $nenrei_md + 1200;
		}
		$nenrei_m = floor($nenrei_md / 100);
		$age = $nenrei_y.'歳'.$nenrei_m.'ヶ月';
		return $age;
	}

	//渡された年月日から本日現在までの年月を計算する。月まで
	function nengetsu($ymd)
	{
		$now = date('Ymd');
		$nenrei_y =floor(($now-$ymd)/10000);
		$y = floor($ymd / 10000);
		$md= $ymd - $y * 10000;
		$nenrei_md = date('md') - $md;
		if ($nenrei_md < 0) {
			$nenrei_md = $nenrei_md + 1200;
		}
		$nenrei_m = floor($nenrei_md / 100);
		$age = $nenrei_y.'年'.$nenrei_m.'ヶ月';
		return $age;
	}

	//渡された加入日から本日現在の在籍日数を計算する。
	function zaiseki_dd($kanyu)
	{
		$ty = date("Y");
		$tm = date("m");
		$td = date("d");
		$aDate = array(0,0,0,$tm,$td,$ty);
		$ky = floor($kanyu / 10000); //2003;
		$km = floor($kanyu / 100) - $ky * 100; //1;
		$kd = $kanyu - $ky*10000 - $km*100; //19; 
		$bDate = array(0,0,0,$km,$kd,$ky);
		//日付データをUNIXタイムスタンプに変換して、引き算
		$dateDiff = gmmktime($aDate['0'],$aDate['1'],$aDate['2'],$aDate['3'],$aDate['4'],$aDate['5'])
			- gmmktime($bDate['0'],$bDate['1'],$bDate['2'],$bDate['3'],$bDate['4'],$bDate['5']);
	
		//差が秒で出ているので日に変換する　60*60*24=86400
		//さらに当日も加えるために1日を加算する。
		$zaisekiday = ($dateDiff / 86400) + 1;
		return number_format($zaisekiday);	//3桁毎にコンマを入れる。
	}

	//本日現在の渡された年月日までの残日数を計算する。
	function zanday_dd($sotsugyo)
	{
		$ty = date("Y");
		$tm = date("m");
		$td = date("d");
		$aDate = array(0,0,0,$tm,$td,$ty);
		$ky = floor($sotsugyo / 10000); //2003;
		$km = floor($sotsugyo / 100) - $ky * 100; //1;
		$kd = $sotsugyo - $ky*10000 - $km*100; //19; 
		$bDate = array(0,0,0,$km,$kd,$ky);
		//日付データをUNIXタイムスタンプに変換して、引き算
		$dateDiff = gmmktime($bDate['0'],$bDate['1'],$bDate['2'],$bDate['3'],$bDate['4'],$bDate['5'])
			- gmmktime($aDate['0'],$aDate['1'],$aDate['2'],$aDate['3'],$aDate['4'],$aDate['5']);
	
		//差が秒で出ているので日に変換する　60*60*24=86400
		$zanday = ($dateDiff / 86400);
		return number_format($zanday);	//3桁毎にコンマを入れる。
	}

}
?>

今回追加したのは、function get_member_list_kanyubijun()とfunction get_member_list_ki($ki)です。

function get_member_list_kanyubijun()では、レコードを読み込む順を、加入日順の生年月日順としています。同じ期でも年長者の方が先になります。

function get_member_list_ki($ki)では、データベース内の項目kiの内容が渡されたパラメータ$kiと一致するレコードを選択します。レコードを読み出す順序は、期順の生年月日順としています。

views/musume_submenu.php　（新規作成）

<div id="side_navi">
<h3>一覧表示選択</h3>

<ul>
<li>
<a href="https://avocado.xii.jp/nengo/index.php/musume">在籍日数順一覧</a>
</li>
<li>
<a href="https://avocado.xii.jp/nengo/index.php/musume/birthjun">生年月日順一覧</a>
</li>
<li>
<a href="https://avocado.xii.jp/nengo/index.php/musume/tanjobijun">誕生日順一覧</a>
</li>
<li>
<a href="https://avocado.xii.jp/nengo/index.php/musume/kanyubijun">加入日順一覧</a>
</li>
<li><form action="../nengo/index.php/musume/kinomi" method="post">　
	<select name="ki" size="1">
	<option value="1">1期</option>
	<option value="2">2期</option>
	<option value="3">3期</option>
	<option value="4">4期</option>
	<option value="5">5期</option>
	<option value="6">6期</option>
	<option value="7">7期</option>
	<option value="8">8期</option>
	<option value="9">9期</option>
	<option value="10">10期</option>
	<option value="11">11期</option>
	<option value="12">12期</option>
	<option value="13">13期</option>
	<option value="14">14期</option>
</select>
のみ
<input type="submit" value="選択" />
</form>
</li></ul>
</div>

左側に表示するナビゲーションです。これはコントローラでは使用しないで、この下に掲載するテンプレートから直接読み込むようにしてあります。

views/musume_kinomi.php　（新規作成）

<!-- view/musume_kinomi.php -->
<h2>モーニング娘。　<?=$ki?>期一覧</h2>
<!-- 写真をランダムに表示 -->
<div class="C">
<img src="<?=base_url();?>images/sayumi/<?=$photo?>" alt="道重さゆみ" /><br />
（写真はランダムに表示されます。）
</div>
<div class="R"><?php echo date("Y").'年'.date("m").'月'.date("d").'日　現在'; ?></div>
<!-- 一覧を表示 -->
<table>
<tr><th>順位</th><th>名前</th><th>期</th><th>生年月日</th><th>年齢</th><th>加入日</th><th>卒業・脱退日</th><th>在籍期間</th><th>在籍日数</th></tr>
<?php $cnt=0; ?>
<!-- ここから、php endforeachまで、各レコードを表示するループ -->
<?php foreach($list as $row): ?>
<tr>
<?php ++$cnt; ?>
<td class="R"><?=$cnt; ?></td>
<td><?=$row->name; ?></td>
<td class="R"><?=$row->ki.'期'; ?></td>
<!-- 生年月日 -->
<td><?=substr($row->birthday,0,4).'年'.substr($row->birthday,4,2).'月'.substr($row->birthday,6,2).'日'; ?></td>
<!-- 年齢 model内のnenrei関数を使う-->
<td><?php echo $this->Musume_model->nenrei($row->birthday); ?></td>
<!-- 加入日 -->
<td><?=substr($row->kanyu,0,4).'年'.substr($row->kanyu,4,2).'月'.substr($row->kanyu,6,2).'日'; ?></td>
<!-- 卒業・脱退日 -->
<?php
 if ($row->sotsugyo > 0)
 {
  $symd=substr($row->sotsugyo,0,4).'年'.substr($row->sotsugyo,4,2).'月'.substr($row->sotsugyo,6,2).'日'; 
 }
 else
 {
  $symd='現役';
 }
?>
<td class="C"><?=$symd; ?></td>
<!-- 在籍期間 現役の場合はmodel内のnengetsu関数を使う -->
<?php
 if ($row->sotsugyo > 0)
 {
  $zym = $row->zaiseki; 
 }
 else
 {
  $zym=$this->Musume_model->nengetsu($row->kanyu);
 }
?>
<td class="C"><?=$zym; ?></td>
<!-- 在籍日数 現役の場合はmodel内のzaiseki_dd関数を使う -->
<?php
 if ($row->sotsugyo > 0)
 {
  $zdd = number_format($row->nissu); 
 }
 else
 {
  $zdd=$this->Musume_model->zaiseki_dd($row->kanyu);
 }
?>
<td class="R"><?=$zdd.'日'; ?></td>
</tr>
<?php endforeach; ?>
</table>

二行目、見出し（h2ヘッダー）内にコントローラから渡された連想配列内の$kiを表示します。

views/musume_tmpl.php　（一部変更）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="ja" xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>モーニング娘。在籍日数等一覧</title>
<meta name="keywords" content="モーニング娘。" />
<meta name="description" content="モーニング娘。在籍日数等一覧" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="imagetoolbar" content="no" />
<link rel="shortcut icon" href="../favicon.ico" />
<link href="http://www.avocado.xii.jp/css/default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="background">
<div id="container">

<?=$this->load->view('header');?>
<div id="contents">

<div id="main">
<?=$main?>
</div><!-- end of main -->
<?=$this->load->view('musume_submenu');?>
</div><!-- end of contents -->

<?=$this->load->view('footer');?>
</div><!-- end of container -->
</div><!-- end of background -->
</body>
</html>

最終的にWebブラウザに送るhtmlを構成します。おなじみのhtmlの書き出しの呪文から始まっています。html+cssでxhtmlを構成しています。

今回の主な変更点は、左サイドのナビゲーション（musume_submenu.php)を直接読み込むようにしたことで、それに伴いCSSをAvocadoMix標準のものにしたことです。

2017年8月13日　記

Page Top