プログラミング

ポケモン預かりシステム編 システムの実装 PHPポケモン 87

PHP PHPポケモン ポケモン
ポケモン預かりシステム編 システムの実装 PHPポケモン 87

ポケモン預かりシステムの実装

システムの仕様とクラスも整ってきたので、いざ実装をしていきましょう。

前回までに作成した項目で、いくつか変更になったものがあるので、まずはじめに挙げておきます。

 

シャットダウン機能

ボックスの選択を解除するというものでしたが、こちらを不採用にしました。ボックスは常にどれかが選択された状態にしておき、シャットダウンそのものはグローバルで行っている1つだけにしました。

 

選択ボックスの初期値

初期値を0としました。nullと0が混在すると判定がややこしくなるため、シャットダウン機能と合わせて常にどれかのボックスが選択されている状態にしています。

 

それでは、順を追ってPHPポケモンに実装していきましょう。

 

コントローラーの作成

まずは主軸となるコントローラーの作成です。作成する分岐は以下の5つです。 

  1. ボックス切り替え
  2. ボックス追加
  3. ポケモンを預ける
  4. ポケモンを引き取る
  5. ボックス操作の終了

 

ポケモン預かりシステムコントローラー(/App/Controllers/Pokeox/PokeboxController.php
<?php
$root_path = __DIR__.'/../../..';
require_once($root_path.'/App/Controllers/Controller.php');
// サービス
require_once($root_path.'/App/Services/Pokebox/SwitchService.php');
require_once($root_path.'/App/Services/Pokebox/DepositService.php');
require_once($root_path.'/App/Services/Pokebox/ReceiveService.php');
require_once($root_path.'/App/Services/Pokebox/AddBoxService.php');
 
// ポケモンボックス用コントローラー
class PokeboxController extends Controller
{
 
    /**
    * @return void
    */
    public function __construct()
    {
        // 親コンストラクタの呼び出し
        parent::__construct();
        // ボックスの起動
        startPokebox();
        // 分岐処理
        $this->branch();
        // 親デストラクタの呼び出し
        parent::__destruct();
    }
 
    /**
    * @return void
    */
    public function __destruct()
    {
        // ボックスの保存
        savePokebox();
        // 親デストラクタの呼び出し
        parent::__destruct();
    }
 
    /**
    * アクションに合わせた分岐
    * @return void
    */
    private function branch()
    {
        switch (request('action')) {
            /******************************************
            * ボックスの切り替え
            */
            case 'switch':
            $service = new SwitchService;
            $service->execute();
            break;
            /******************************************
            * ポケモンを預ける
            */
            case 'deposit':
            $service = new DepositService;
            $service->execute();
            break;
            /******************************************
            * ポケモンを引き取る
            */
            case 'receive':
            $service = new ReceiveService;
            $service->execute();
            break;
            /******************************************
            * ボックスの追加
            */
            case 'add_box':
            $service = new AddBoxService;
            $service->execute();
            break;
            /******************************************
            * ボックス終了
            */
            case 'shutdown':
            shutdownPokebox();
            $_SESSION['__route'] = 'home';
            // 画面移管
            $this->redirect();
            break;
            /******************************************
            * アクション未選択・ボックス起動
            */
            default:
            response()->setMessage('ようこそ、ポケモン預かりシステムへ');
            break;
        }
    }
 
}

 

ボックス操作の終了は、ホーム画面へ移管させるだけのものなのでサービスは不要です。ポケモン預かりシステムの操作画面では毎回ボックスの起動が必要になるので、こちらはコンストラクタ内で、保存処理はデストラクタ内で行なっています

 

ボックス切り替え

まずはボックス切り替えから見ていきましょう。原則としてボックス操作はアクセス中のものしかできないようにしているため、管理画面で見られるのはパーティーと1つのボックスのみになります。なので、別ボックスのポケモンを確認、引き取るなどの処理を行う場合は、アクセス中のボックスを切り替える必要があります。

 

ボックス切り替えサービス(/App/Services/Pokebox/SwitchService.php
<?php
$root_path = __DIR__.'/../../..';
// 親クラス
require_once($root_path.'/App/Services/Service.php');
 
/**
* ボックスの切り替え
*/
class SwitchService extends Service
{
 
    /**
    * @return void
    */
    public function __construct()
    {
        //
    }
 
    /**
    * @return void
    */
    public function execute()
    {
        // ボックスの切り替え
        if(pokebox()->selectBox(request('box'))){
            response()->setMessage(
                'ボックス'.pokebox()->getSelectedBoxNumber().'を起動しました'
            );
        }else{
            response()->setMessage('ボックスの起動に失敗しました');
        }
    }
 
}

 

POSTでボックスの値を受け取り、そのボックスの存在確認をしてから結果を返却しています。selectBoxではボックスが見つかればselectedプロパティに値をセット、返り値としてbooleanを返しています。

 

ボックス追加

次にボックスの追加処理についてです。ポケモンをボックス分けしたい時などに、満杯で無くても他のボックスを使用したい場合がありますね。そんなときに新規でボックスが追加できるようにサービスを用意しておきます。

 

ボックス追加サービス(/App/Services/Pokebox/AddBoxService.php
<?php
$root_path = __DIR__.'/../../..';
// 親クラス
require_once($root_path.'/App/Services/Service.php');
 
/**
* ボックスの追加
*/
class AddBoxService extends Service
{
 
    /**
    * @return void
    */
    public function __construct()
    {
        //
    }
 
    /**
    * @return void
    */
    public function execute()
    {
        // ボックスの追加
        if(count(pokebox()->getPokebox()) < 10){
            $box = pokebox()->addBox();
            response()->setMessage('ボックス'.($box + 1).'を追加しました');
        }else{
            response()->setMessage('これ以上は追加できません');
        }
    }
 
}

 

こちらはPOSTによる値は不要です。リクエストがあればaddBoxメソッドを使って空の配列を最後尾に追加しています。ただし、ボックスが無限に増やすわけにもいかないので、現段階では最大数を10ボックスとしています。

  

ポケモンを預ける

こからがポケモン預かりシステムの本格的な実装となります。まずは、手持ちのポケモンを預けるための処理を作成します。

 

ポケモンを預ける(/App/Services/Pokebox/DepositService.php
<?php
$root_path = __DIR__.'/../../..';
// 親クラス
require_once($root_path.'/App/Services/Service.php');
 
/**
* ポケモンを預ける
*/
class DepositService extends Service
{
 
    /**
    * 預けるポケモン
    * @var object::Pokemon
    */
    private $pokemon;
 
    /**
    * @return void
    */
    public function __construct()
    {
        //
    }
 
    /**
    * @return void
    */
    public function execute()
    {
        if($this->validation()){
            // 預け入れ処理
            $this->migratePartyToBox();
            // 接続成功
            response()->setMessage(
                $this->pokemon->getNickname().'をボックス'.pokebox()->getSelectedBoxNumber().'へ預けた'
            );
        }
    }
 
    /**
    * 検証
    * @return boolean
    */
    private function validation(): bool
    {
        /**
        * ボックスの検証
        */
        // 空きチェック
        if(!pokebox()->isSelectedBoxSpace()){
            response()->setMessage('ボックス'.pokebox()->getSelectedBoxNumber().'には空きがありません');
            return false;
        }
        /**
        * ポケモンの検証
        */
        // 手持ちが1匹以下
        if(count(player()->getParty()) <= 1){
            response()->setMessage('手持ちのポケモンが、いなくなってしまいます');
            return false;
        }
        // 手持ちポケモンの存在チェック
        $this->pokemon = player()->getPartner(request('pokemon_id'), 'id');
        if(empty($this->pokemon)){
            response()->setMessage('選択されたポケモンは預けることができません');
            return false;
        }
        // 検証成功
        return true;
    }
 
    /**
    * ポケモンをボックスへ預ける
    * @return void
    */
    private function migratePartyToBox(): void
    {
        // パーティー内のポケモン情報を削除
        player()->releasePartner(request('pokemon_id'));
        // ボックスへ追加
        pokebox()->addPokemon($this->pokemon);
    }
 
}

 

ポケモンを預ける際には、パーティー内のポケモンを判別するためのポケモンIDを受け取っています。

※こちらがorder値でない理由は後ほど画面実装の際に説明します

 

まずバリデーションで、ボックスの空きチェック、手持ちポケモンの数をチェックして預けられる状態かどうかを確認します。その後、requestで受け取ったポケモンIDが手持ちに存在しているかを確認し、問題がなければポケモンを移動します。

 

ポケモンの移動では、パーティー内からの削除とボックスへのポケモン追加を同時に行なっています。ここに不具合があるとポケモンが消失したり、第2世代のように複製される原因となりかねませんので注意です。

 

ポケモンを引き取る

最後に、ボックスに預けたポケモンを手持ちに加えるための引き取り処理です。こちらは、預けるとは逆の工程を踏むことで実装していきます。

 

ポケモンを引き取る(/App/Services/Pokebox/ReceiveService.php
<?php
$root_path = __DIR__.'/../../..';
// 親クラス
require_once($root_path.'/App/Services/Service.php');
 
/**
* ポケモンを引き取る
*/
class ReceiveService extends Service
{
 
    /**
    * 引き取るポケモン
    * @var array
    */
    private $pokemon;
 
    /**
    * @return void
    */
    public function __construct()
    {
        //
    }
 
    /**
    * @return void
    */
    public function execute()
    {
        if($this->validation()){
            // 引き取り処理
            $this->migrateBoxToParty();
            // 接続成功
            response()->setMessage(
                $this->pokemon
                ->getNickname().'を連れて行くことにした'
            );
        }
    }
 
    /**
    * 検証
    * @return boolean
    */
    private function validation(): bool
    {
        /**
        * パーティーの検証
        */
        if(count(player()->getParty()) >= 6){
            response()->setMessage('これ以上は連れていけません');
            return false;
        }
        /**
        * ボックス内のポケモンの検証
        */
        $pokemon = array_filter(pokebox()->accessSelectedBox(false), function($pokemon){
            return $pokemon['id'] === request('pokemon_id');
        });
        if(empty($pokemon)){
            response()->setMessage('指定されたポケモンは存在しません');
            return false;
        }
        // 検証成功
        $this->pokemon = unserializeObject(array_shift($pokemon)['object']);
        return true;
    }
 
    /**
    * ボックスからパーティーへの移動
    * @return void
    */
    private function migrateBoxToParty(): void
    {
        // ボックスからポケモンを削除する
        pokebox()->releasePokemon(request('pokemon_id'));
        // 取り出したポケモンをパーティーへセットする
        player()->setParty($this->pokemon);
    }
 
}

 

こちらでも預けると同様に、引き取るポケモンのIDをリクエストすることで、対象のポケモンを判別しています。

まず初めにパーティーが上限に達していないかを確認、その後ボックス内にポケモンが存在しているかどうかを確認しています。

 

では、ボックス内のポケモンにアクセスするためのaccessSelectedBoxメソッドの中身を見てみましょう。

 

ポケモン預かりシステム ボックス操作用トレイト(/App/Traits/Class/Pokebox/ClassPokeboxTrait.php
/**
* 選択中のボックスへアクセス(復号化して返却)
* @param serialize:boolean
* @return array
*/
public function accessSelectedBox($serialize=true): array
{
    if($serialize){
        // 復号化して返却
        return array_map(function($pokemon){
            return unserializeObject($pokemon['object']);
        }, $this->pokebox[$this->selected] ?? []);
    }else{
        // 復号化せずに返却
        return $this->pokebox[$this->selected];
    }
}

 

もし引数でtrue(初期値)が指定された場合は、ポケモン情報を復号化して選択中のボックスのポケモン一覧を返却します。falseが指定された際にはそのままの状態で返却するため、対象ポケモン1匹だけが欲しい場合などは、復号化せずに検証、通れば取り出したポケモンだけを復号化することで、余計な処理をする必要がなくなります。

  

画面の作成

最後に画面の作成です。画面上がボックスの管理画面となるように作成し、パーティーと現在選択中のボックスのポケモン一覧が表示されるようにします。

 

ポケモン預かりシステム画面(/Resources/Pages/Pokebox.php
<?php
$root_path = __DIR__.'/../..';
?>
<!DOCTYPE html>
<html lang="jp" dir="ltr">
<head>
    <?php
    # metaの読み込み
    include($root_path.'/Resources/Partials/Layouts/Head/meta.php');
    # cssの読み込み
    include($root_path.'/Resources/Partials/Layouts/Head/css.php');
    ?>
</head>
<body>
    <?php
    # headerの読み込み
    include($root_path.'/Resources/Partials/Layouts/Head/header.php');
    ?>
    <main>
        <div class="container">
            <section>
                <div class="card">
                    <div class="card-header d-flex align-items-center justify-content-between">
                        <h5 class="mb-0">
                            <img src="/Assets/img/icon/pokebox.png" class="mr-2" alt="ポケモン預かりシステム" />ポケモン預かりシステム
                        </h5>
                        <button type="button" class="btn btn-danger rounded-circle p-0" style="width:40px;height:40px;" data-submit_remote="shutdown" title="終了する">
                            <i class="fas fa-power-off"></i>
                        </button>
                    </div>
                    <div class="card-body py-0 px-3">
                        <div class="row">
                            <?php include($root_path.'/Resources/Partials/Pokebox/body.php'); ?>
                        </div>
                    </div>
                    <div class="card-footer d-flex justify-content-center" data-pokebox="controls">
                        <?php include($root_path.'/Resources/Partials/Pokebox/foot.php'); ?>
                    </div>
                    <div class="card-footer p-3 overflow-auto bg-white" style="height: 90px;">
                        <?php foreach(response()->messages() as list($message)): ?>
                            <p class="mb-0"><?=$message?></p>
                        <?php endforeach; ?>
                    </div>
                </div>
            </section>
        </div>
    </main>
    <?php
    # footerの読み込み
    include($root_path.'/Resources/Partials/Layouts/Foot/footer.php');
    # モーダルの読み込み
    include($root_path.'/Resources/Partials/Pokebox/Modals/deposit.php');
    include($root_path.'/Resources/Partials/Pokebox/Modals/receive.php');
    include($root_path.'/Resources/Partials/Pokebox/Modals/switch.php');
    # JSの読み込み
    include($root_path.'/Resources/Partials/Layouts/Foot/js.php');
    ?>
    <script src="/Assets/js/Pokebox/pokebox.js" type="text/javascript" defer></script>
</body>
</html>

 

ポケモン預かりシステムcard-body部分(/Resources/Partials/Pokebox/body.php
<div class="col-12 bg-purple">
    <p class="text-white text-center mb-0 small">ボックス<?=pokebox()->getSelectedBoxNumber()?> 接続中...</p>
</div>
<div class="col-12 col-md-4 py-3 bg-light">
    <div class="overflow-auto" style="height:300px;">
        <div class="nav flex-column nav-pills" id="pokebox-tab" role="tablist" aria-orientation="vertical" data-list="pokebox">
            <?php # 手持ち ?>
            <a class="nav-link d-flex justify-content-between btn-sm btn-secondary text-left m-1" id="pokebox-party-tab" href="#pokebox-party" role="tab" aria-controls="pokebox-party" aria-selected="true" data-toggle="pill" data-category="party">
                <span>手持ち</span>
                <span class="badge badge-light d-flex align-items-center"><?=count(player()->getParty())?></span>
            </a>
            <?php # ボックス ?>
            <?php foreach(pokebox()->getPokebox() as $num => $box): ?>
                <?php if(pokebox()->getSelectedBox() === $num): ?>
                    <?php # 起動中のボックス ?>
                    <a class="nav-link d-flex justify-content-between btn-sm btn-orange text-left m-1 active" id="pokebox-<?=$num?>-tab" href="#pokebox-<?=$num?>" role="tab" aria-controls="pokebox-<?=$num?>" aria-selected="true" data-toggle="pill" data-category="pokebox">
                        <span class="pokebox-name">ボックス<?=$num+1?><i class="fas fa-check-circle ml-2"></i></span>
                        <span class="badge badge-light d-flex align-items-center"><?=count($box)?></span>
                    </a>
                <?php else: ?>
                    <?php # 未接続のボックス ?>
                    <a class="nav-link d-flex justify-content-between btn-sm btn-secondary text-left m-1 cursor-pointer" data-toggle="modal" data-target="#pokebox-switch-modal" data-box="<?=$num?>">
                        <span class="pokebox-name">ボックス<?=$num+1?></span>
                        <span class="badge badge-light d-flex align-items-center"><?=count($box)?></span>
                    </a>
                <?php endif; ?>
            <?php endforeach; ?>
        </div>
    </div>
</div>
<div class="col-12 col-md-8 py-3 bg-light-success">
    <div class="tab-content overflow-auto" id="pokebox-tabContent" style="height:300px;">
        <?php # 手持ち ?>
        <div class="tab-pane fade show" id="pokebox-party" role="tabpanel" aria-labelledby="pokebox-party-tab">
            <div class="row table-selected" data-list="pokemon">
                <?php foreach(player()->getParty() as $party): ?>
                    <figure class="col-6 col-sm-4 col-md-3 col-lg-2 d-flex">
                        <div class="d-flex w-100 flex-column justify-content-between table-selected-row border rounded" data-place="party" data-pokemon_id="<?=$party->getId()?>">
                            <div class="p-1">
                                <p class="mb-0" id="pokebox-pokemon-name-<?=$party->getId()?>"><?=$party->getNickname()?></p>
                                <p>Lv.<?=$party->getLevel()?></p>
                            </div>
                            <div class="text-center mb-2">
                                <img id="pokebox-pokemon-img-<?=$party->getId()?>" src="/Assets/img/pokemon/dots/front/<?=get_class($party)?>.gif" alt="<?=$party->getName()?>">
                            </div>
                        </div>
                    </figure>
                <?php endforeach; ?>
            </div>
        </div>
        <?php # ボックス ?>
        <div class="tab-pane fade show active" id="pokebox-<?=pokebox()->getSelectedBox()?>" role="tabpanel" aria-labelledby="pokebox-<?=pokebox()->getSelectedBox()?>-tab">
            <div class="row table-selected" data-list="pokemon">
                <?php foreach(pokebox()->accessSelectedBox() as $pokemon): ?>
                    <figure class="col-6 col-sm-4 col-md-3 col-lg-2 d-flex">
                        <div class="d-flex w-100 flex-column justify-content-between table-selected-row border rounded" data-place="pokebox" data-pokemon_id="<?=$pokemon->getId()?>">
                            <div class="p-1">
                                <p class="mb-0" id="pokebox-pokemon-name-<?=$pokemon->getId()?>"><?=$pokemon->getNickname()?></p>
                                <p>Lv.<?=$pokemon->getLevel()?></p>
                            </div>
                            <div class="text-center mb-2">
                                <img id="pokebox-pokemon-img-<?=$pokemon->getId()?>" src="/Assets/img/pokemon/dots/front/<?=get_class($pokemon)?>.gif" alt="<?=$pokemon->getName()?>">
                            </div>
                        </div>
                    </figure>
                <?php endforeach; ?>
            </div>
        </div>
    </div>
</div>

 

ポケモン預かりシステムcard-footer部分(/Resources/Partials/Pokebox/foot.php
<?php if(count(pokebox()->getPokebox()) < 10): ?>
    <button type="button" class="btn btn-sm btn-purple mx-1" data-submit_remote="add_box">ボックス追加</button>
<?php endif; ?>
<?php # 共通 ?>
<button type="button" class="btn btn-sm btn-secondary mx-1" data-category="common" data-btn="default" disabled>様子を見る</button>
<?php foreach(array_merge(player()->getParty(), pokebox()->accessSelectedBox()) as $pokemon): ?>
    <button type="button" class="btn btn-sm btn-purple d-soft-none mx-1" data-category="common" data-btn="details" data-pokemon_id="<?=$pokemon->getId()?>" data-toggle="modal" data-target="#pokemon<?=$pokemon->getId()?>-details-modal">様子を見る</button>
    <?php
    # 詳細モーダルの読み込み
    include($root_path.'/Resources/Partials/Common/Modals/pokemon-details.php');
    ?>
<?php endforeach; ?>
<?php # パーティー用のボタン ?>
<button type="button" class="btn btn-sm btn-secondary mx-1 d-soft-none" data-category="party" data-btn="default" disabled>預ける</button>
<button type="button" class="btn btn-sm btn-purple mx-1 d-soft-none" data-category="party" data-btn="deposit" data-target="#pokebox-deposit-modal" data-toggle="modal">預ける</button>
<?php # ボックス移動ボタン ?>
<button type="button" class="btn btn-sm btn-secondary mx-1" data-category="pokebox" data-btn="default" disabled>連れて行く</button>
<button type="button" class="btn btn-sm btn-purple mx-1 d-soft-none" data-category="pokebox" data-btn="receive" data-target="#pokebox-receive-modal" data-toggle="modal">連れて行く</button>

 

前述したポケモンの並び順(order)で管理しない理由が、ボックス内のポケモンとパーティーのポケモンでの番号重複です。詳細画面を開く際などにこれが原因で共通詳細が使用できなくなるため、共通詳細にもポケモンIDを使用、判別にもIDを使用することで対応しました。

 

専用JSではボックスやポケモンの選択に合わせて、操作ボタンやモーダルの画像やボタンを切り替えるようにします。

 

ポケモン預かりシステムJS/Public/Assets/js/Pokebox/pokebox.js
/*----------------------------------------------------------
// 初期化する関数
----------------------------------------------------------*/
 
/**
* ボックス選択
* @function on click
*/
var selectPokeboxInit = function() {
    $('[data-list="pokebox"] > [role="tab"]').on('click', function(){
        var category = $(this).data('category');
        var name = $(this).find('.pokebox-name')
        .text();
        // ボックスリストボタンの色変更
        $('[data-list="pokebox"] > .nav-link').removeClass('btn-orange')
        .addClass('btn-secondary');
        $(this).removeClass('btn-secondary')
        .addClass('btn-orange');
        // ボックス操作ボタンの表示・非表示
        $('[data-pokebox="controls"] [data-category="common"]').hide();
        $('[data-pokebox="controls"] [data-category][data-category!="' + category + '"]').hide();
        $('[data-pokebox="controls"] [data-category="' + category + '"][data-btn="default"]').show();
        $('[data-pokebox="controls"] [data-category="common"][data-btn="default"]').show();
        // 選択中のポケモンを解除
        var row = $('.table-selected[data-list="pokemon"]')
        .find('.table-selected-row')
        .removeClass('active');
    });
}
 
/**
* ポケモンの選択
* @function on click
*/
var selectPokemonInit = function() {
    $('[data-list="pokemon"] .table-selected-row').on('click', function(){
        var place = $(this).data('place');
        var pokemon_id = $(this).data('pokemon_id');
        // ボックス操作関係のフォーム・ボタンを非表示
        $('[data-category="' + place + '"]').hide();
        $('[data-btn="default"]').hide();
        // 「様子を見る」の有効化
        $('[data-btn="details"]').hide();
        $('[data-btn="details"][data-pokemon_id="' + pokemon_id + '"]').show();
        // 選択されたポケモン情報を取得
        var name = $(this).find('#pokebox-pokemon-name-' + pokemon_id)
        .text();
        var img = $(this).find('#pokebox-pokemon-img-' + pokemon_id)
        .attr('src');
        // パーティー、ボックス内ポケモンの分岐
        if(place === 'party'){
            var action = 'deposit';
        }else if(place === 'pokebox'){
            var action = 'receive';
        }
        // 「預ける」または「引き取る」を有効化
        $('[data-btn="' + action + '"]').show();
        // モーダルに選択されたポケモン情報をセット
        $('form#pokebox-' + action + '-form [name="pokemon_id"]').val(pokemon_id);
        $('#' + action + '-pokemon-name').text(name);
        $('#' + action + '-pokemon-img').attr('src', img);
    });
}
 
/**
* ボックス切り替え
* @function on click
*/
var switchPokeboxModalInit = function() {
    $('[data-target="#pokebox-switch-modal"]').on('click', function(){
        var box = $(this).data('box');
        var name = $(this).find('.pokebox-name').text();
        // ボックス名と番号をセット
        $('#switch-pokebox-name').text(name);
        $('#pokebox-switch-form [name="box"]').val(box);
    });
}
 
/*----------------------------------------------------------
// 初期化
----------------------------------------------------------*/
jQuery(function($){
    selectPokemonInit();
    selectPokeboxInit();
    switchPokeboxModalInit();
});

 

ボックス切り替え、預ける、引き取るではモーダルによる確認を挟むため、それぞれモーダルを用意しておきましょう。

 

ボックス切り替え確認モーダル(/Resources/Partials/Pokebo/Modals/switch.php
<div class="modal fade" id="pokebox-switch-modal" tabindex="-1" role="dialog" aria-labelledby="pokebox-switch-modal-title" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <figure class="text-center p-3 mb-0">
                    <p class="mb-0"><span id="switch-pokebox-name"></span>に切り替えても良いですか?</p>
                </figure>
            </div>
            <div class="modal-footer justify-content-center">
                <form id="pokebox-switch-form" method="post">
                    <?php input_token(); ?>
                    <input type="hidden" name="action" value="switch">
                    <input type="hidden" name="box">
                    <button type="submit" class="btn btn-sm btn-primary">切り替える</button>
                </form>
                <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">やめる</button>
            </div>
        </div>
    </div>
</div>

 

預ける確認モーダル(/Resources/Partials/Pokebo/Modals/deposit.php
<div class="modal fade" id="pokebox-deposit-modal" tabindex="-1" role="dialog" aria-labelledby="pokebox-deposit-modal-title" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <figure class="text-center p-3 mb-0">
                    <img class="mb-3" id="deposit-pokemon-img" src="" alt="預けるポケモン" />
                    <p class="mb-0"><span id="deposit-pokemon-name"></span>をボックスに預けますか?</p>
                </figure>
            </div>
            <div class="modal-footer justify-content-center">
                <form id="pokebox-deposit-form" method="post">
                    <?php input_token(); ?>
                    <input type="hidden" name="action" value="deposit">
                    <input type="hidden" name="pokemon_id">
                    <button type="submit" class="btn btn-sm btn-primary">預ける</button>
                </form>
                <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">やめる</button>
            </div>
        </div>
    </div>
</div>

 

引き取る確認モーダル(/Resources/Partials/Pokebo/Modals/receive.php
<div class="modal fade" id="pokebox-receive-modal" tabindex="-1" role="dialog" aria-labelledby="pokebox-receive-modal-title" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <figure class="text-center p-3 mb-0">
                    <img class="mb-3" id="receive-pokemon-img" src="" alt="引き取るポケモン" />
                    <p class="mb-0"><span id="receive-pokemon-name"></span>を引き取りますか?</p>
                </figure>
            </div>
            <div class="modal-footer justify-content-center">
                <form id="pokebox-receive-form" method="post">
                    <?php input_token(); ?>
                    <input type="hidden" name="action" value="receive">
                    <input type="hidden" name="pokemon_id">
                    <button type="submit" class="btn btn-sm btn-primary">引き取る</button>
                </form>
                <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">やめる</button>
            </div>
        </div>
    </div>
</div>

 

では実際にボックスの挙動を見てみましょう。

 

ポケモンの預け入れから引き取りまで正常に動作しましたね。アクセスは原作寄せでポケモンセンターからできるようにしました。

ジョーイさんの中(大)サイズのgifが見当たらなかったので、PHPポケモンではラッキーさんが受付対応してくれます。

 

以上で、ポケモン預かりシステムの実装は完了です。

 

まとめ

いかがだったでしょうか。

今回のPHPポケモンでは「ポケモン預かりシステム」の実装方法をご紹介しました。

これで、ポケモンを捕まえていくための最低限の準備が整いました。

近日中に本番環境へ反映予定ですので、乞うご期待ください。

 

注目の記事

PHPポケモン「わざ編〜わるあがき〜」35
プログラミング
PHP,PHPポケモン,ポケモン
PHPポケモン「わざ編〜わるあがき〜」35

わるあがき そろそろ技のPPを実装段階にきたので、その前に「わるあがき」という技を作成しましょう。「わるあがきって何?」という人のために、どういった技なのか簡単に説明します。 全ポケモン使用可能。ただし、レベルアップなどで普通のわざとして覚えることはできず、自分の技がすべて選択不能になった場合...

人に相談しても期待はするな【行動もどきって?成功する人と失敗する人の違いとは】
雑記
自己啓発
人に相談しても期待はするな【行動もどきって?成功する人と失敗する人の違いとは】

  「とにかく行動しろ」 「いろんな人に会え」 「どんどん外注しろ」   どれも覚えておきたい教訓ではありますが、その本質が見抜けなければ逆効果になります。 行動であっても、それが行動もどきになっている人は多く、人に会って人生が変わるということも受け身であれば全く意味がありません。外注に...

飲食店がホームページを作る5つのメリット 〜デメリットについても解説します〜
マーケティング
Google AdSense,SEO
飲食店がホームページを作る5つのメリット 〜デメリットについても解説します〜

  お店のホームページを作りたい   そういった飲食店の方は意外にも多く、イタリアンや居酒屋、日本料理店など種類も様々です。   今回のテーマは「飲食店がホームページを作る上で知っておきたいメリットとデメリットについて」です。   食べログやホットペッパーなどといったグルメサイトが主流とな...

熟練者ほど実践するプログラミングが上達する3つの法則
プログラミング
PHP
熟練者ほど実践するプログラミングが上達する3つの法則

  「なかなかプログラミングが上達しない・・・」 「やったことはあるけど覚えられない」   プログラミングを習得しても、勉強と一緒で使っていなければ忘れてしまいます。また、どんどん上達する人や、長い間プログラミングの技術で生計を立てているような熟練者は、日頃からの取り組み方自体が違ってい...

フィールド効果技編(しろいきり) PHPポケモン 50
プログラミング
PHP,PHPポケモン,ポケモン
フィールド効果技編(しろいきり) PHPポケモン 50

フィールド効果技とは ポケモンの技の中には、ポケモンに対して状態変化や異常を与えるもの以外に、フィールド自体に効果を持たせるものがいくつかあります。PHPポケモンでは未実装ですが、そういったフィールド効果技はポケモンを交代したとしても場に効果が残り続けます。  場の状態(ポケモンwiki) https:/...

戦闘用アイテム編 プラスパワー PHPポケモン96
プログラミング
PHP,PHPポケモン,ポケモン
戦闘用アイテム編 プラスパワー PHPポケモン96

戦闘用アイテムとは バトル中に使用できるアイテムはいくつかありますが、その中でも「バトル専用」のアイテムがあります。それが戦闘用アイテムであり、主にドーピングと呼ばれるものです。 アイテムカテゴリとして、プレイヤー対象(スプレーなど)、敵ポケモン対象(ボール類)、味方対象(キズぐすり)の3つに...

オウムがえし編 PHPポケモン 68
プログラミング
PHP,PHPポケモン,ポケモン
オウムがえし編 PHPポケモン 68

オウムがえしとは 今回は久々に新しい技を実装します。それが「オウムがえし」です。 オウムがえし(ポケモンwiki) https://wiki.ポケモン.com/wiki/オウムがえし   初代で登場した技であり、序盤に登場するポッポやオニスズメがレベルアップで覚える技の1つです。最新世代ではオウムがえしという技は実...

トレーナー戦編 トレーナー情報の作成 PHPポケモン 97
プログラミング
PHP,PHPポケモン,ポケモン
トレーナー戦編 トレーナー情報の作成 PHPポケモン 97

トレーナー戦 いよいよPHPポケモンでもトレーナー戦の実装に取り掛かっていきます。バトルシステム自体は野生ポケモンと同じですが、トレーナーバトルでは以下の項目が追加、または制限を設けることになります。 複数匹のポケモン 逃げられない 捕まえられない 賞金   複数匹のポケモン ざっくり...

カテゴリ

SEO対策 イベント デザイン ネットワーク ビジネスモデル フリーランス プログラミング マーケティング ライティング 動画編集 雑記

タグ

5G Adobe AfterEffects AI ajax amazon Animate api artisan atom Automator AWS Bluetooth CSS CVR description EC-CUBE4 ECショップ ESLint Facebook feedly foreach fortify function Google Google AdSense Honeycode htaccess HTML IEEE 802.11ax Illustrator Instagram IoT JavaScript jetstream jQuery jQuery UI keyword LAN Laravel Linux MacBook MAMP meta MLM MySQL NoCode note OS OSI参照モデル Paypal Photoshop PHP phpMyAdmin PHPポケモン PremierePro rss SEO Sequel Pro Skype SNS SSH Symfony TCP/IP title Toastr Trait Twig Twitter UCC V系 WAN WebSub Wi-Fi wiki Windows WordPress XAMPP xml Xserver YouTube YouTuber Zoom アーティスト アウトプット アクセス層 アニメーション アフィリエイト イーブイ インターネット インプット エンジニア オブジェクト指向 お金配り クリック単価 クリック数 コミュニケーション能力 コロナ コンサルティング サムネイル システムエンジニア スタートアップ スタイルシート スパム データベース ディープフェイク デザイナー デザイン テレワーク ナンパ ニュース ネットワークモデル ノマドワーク バナー ピカチュウ ビジネス フィード フリーランス ブロガー ブログ プログラマー プログラミング プログラミング学習 プログラミング教育 プロトコル ホームページ制作 ポケモン マークアップ マーケティング メール リモートワーク レンダリング 三井住友 三宮 仕事依頼 児童デイ 児童発達支援 公開鍵 初心者 助成金 勉強法 営業 広告 広告収入 必勝マニュアル 放課後等デイサービス 朝活 楽天 深層学習 無線LAN 独立 神戸 福祉 秘密鍵 翻訳 自己啓発 英語 見積書 計算機 認証 読書 起業 迷惑メール 配列 銀の弾丸 集客 雑学力