経験値取得アニメーション編（動画有り） PHPポケモン 47

/**
* 経験値をセット（取得）する
* @param integer $exp
* @return object
*/
public function setExp($exp)
{
    if(!is_numeric($exp)){
        // 入力値のチェック
        $this->setMessage('数値を入力してください', 'error');
        return $this;
    }
    // 次のレベルに必要な経験値を取得
    $next_exp = $this->getReqLevelUpExp();
    // 経験値を加算
    $this->exp += (int)$exp;
    // メッセージIDを生成
    $msg_id = $this->issueMsgId();
    $this->setMessage($this->getNickname().'は経験値を'.$exp.'手に入れた！', $msg_id);
    // レベル上限の確認
    if($this->level >= 100){
        return $this;
    }
    if($next_exp <= $exp){
        $levelup = true;
        /**
        * 次のレベルに必要な経験値を超えている場合
        */
        // レベルアップ処理
        $this->actionLevelUp($msg_id);
        // レベルアップ処理ループ
        while($this->getReqLevelUpExp() < 0){
            // メッセージIDを再生成
            $msg_id = $this->issueMsgId();
            $this->setAutoMessage($msg_id);
            // レベルアップ処理
            $this->actionLevelUp($msg_id);
        }
        // 全レベルアップ処理終了後、メッセージIDを再生成
        $msg_id = $this->issueMsgId();
        $this->setEmptyMessage($msg_id);
    }
    // 経験値バーの最終アニメーション用レスポンス
    $this->setResponse([
        'param' => $this->getPerCompNexExp(),
        'action' => 'expbar',
    ], $msg_id);
 
    // 進化判定
    if(isset($levelup) && isset($this->evolve_level) && ($this->evolve_level <= $this->level)){
        return $this->evolve();
    }else{
        return $this;
    }
}

if($next_exp <= $exp){
    $levelup = true;
    /**
    * 次のレベルに必要な経験値を超えている場合
    */
    // レベルアップ処理
    $this->actionLevelUp($msg_id);
    // レベルアップ処理ループ
    while($this->getReqLevelUpExp() < 0){
        // メッセージIDを再生成
        $msg_id = $this->issueMsgId();
        $this->setAutoMessage($msg_id);
        // レベルアップ処理
        $this->actionLevelUp($msg_id);
    }
    // 全レベルアップ処理終了後、メッセージIDを再生成
    $msg_id = $this->issueMsgId();
    $this->setEmptyMessage($msg_id);
}

/**
* レベルアップ処理
*
* @param string|null $msg_id
* @return void
*/
protected function actionLevelUp($msg_id=null)
{
    // メッセージIDの指定があれば、経験値バーのアニメーション用レスポンスをセット
    if(!is_null($msg_id)){
        $this->setResponse([
            'param' => 100, # %
            'action' => 'expbar',
        ], $msg_id);
    }
    // 現在のHPを取得
    $before_hp = $this->getStats('HP');
    // レベルアップ
    $this->level++;
    // HPの上昇値分だけ残りHPを加算(ひんし状態を除く)
    if(!isset($this->sa['SaFainting'])){
        $this->calRemainingHp('add', $this->getStats('HP') - $before_hp);
    }
    // メッセージIDを生成
    $msg_id1 = $this->issueMsgId();
    $msg_id2 = $this->issueMsgId();
    // レベルアップアニメーション用レスポンス
    $this->setResponse([
        'param' => json_encode([
            'level' => $this->level,
            'remaining_hp' => $this->getRemainingHp(),
            'remaining_hp_per' => $this->getRemainingHp('per'),
            'max_hp' => $this->getStats('HP'),
        ]),
        'action' => 'levelup',
    ], $msg_id1);
    $this->setAutoMessage($msg_id1);
    // レベルアップメッセージ
    $this->setMessage($this->getNickName().'のレベルは'.$this->level.'になった！', $msg_id2);
    // 現在のレベルで習得できる技があるか確認
    $this->checkMove();
}

/**
* メッセージアクション
* @param now element
* @return Promise
**/
var actionMsgBox = function(now){
    return new Promise( async (resolve, reject) => {
        // 最終メッセージかどうか確認
        if((now.length === 0) || now.hasClass('last-message')){
            await doLastMsg();
        }else{
            // メッセージにアクションがセットされていれば実行
            switch (now.data('action')){
                // ==============================================
                // HPバーの処理 =================================
                //
                case 'hpbar':
                await doAnimateHpBar(
                    now.data('target'),
                    now.data('param')
                );
                break;
                // ==============================================
                // 経験値バーの処理 =============================
                //
                case 'expbar':
                await doAnimateExpBar(
                    now.data('param')
                );
                break;
 
--省略
 
// ==============================================
// 経験値バーの処理 =============================
//
/**
* 経験値バーのアニメーションを実行
* @param mixed param
* @return Promise
**/
var doAnimateExpBar = function(param){
    return new Promise ((resolve, reject) => {
        var expbar = $("#expbar");
        // EXPの現在の値を変更
        expbar.attr('aria-valuenow', param);
        // 経験値バーの長さを100%にする
        expbar.animate({
            width: param + "%"
        }, {
            duration: 500,
            easing: 'easeOutQuad',
            complete: function(){
                // 処理完了(css変更のズレがあるため0.5秒後にresolveを返却)
                setTimeout(function() {
                    resolve();
                }, 500);
            }
        });
    });
}

/**
* メッセージアクション
* @param now element
* @return Promise
**/
var actionMsgBox = function(now){
    return new Promise( async (resolve, reject) => {
        // 最終メッセージかどうか確認
        if((now.length === 0) || now.hasClass('last-message')){
            await doLastMsg();
        }else{
            // メッセージにアクションがセットされていれば実行
            switch (now.data('action')){
                // ==============================================
                // HPバーの処理 =================================
                //
                case 'hpbar':
                await doAnimateHpBar(
                    now.data('target'),
                    now.data('param')
                );
                break;
                // ==============================================
                // 経験値バーの処理 =============================
                //
                case 'expbar':
                await doAnimateExpBar(
                    now.data('param')
                );
                break;
                // ==============================================
                // レベルアップ処理 =============================
                //
                case 'levelup':
                await doAnimateLevelUp(
                    now.data('param')
                );
                break;
                // ==============================================
            }
            // 次のメッセージへ
            await nextMsg(now);
        }
        resolve();
    });
}
 
--省略
 
// ==============================================
// レベルアップ処理 =============================
//
/**
* 経験値バーのアニメーションを実行
* @param json
* @return Promise
**/
var doAnimateLevelUp = function(param){
    return new Promise ((resolve, reject) => {
        var expbar = $("#expbar");
        expbar.hide();
        expbar.css('width', 0);
        // レベルアップ
        $("#level").text(param.level);
        // HPバーの変更
        var hpbar = $("#hpbar-friend");
        hpbar.attr('aria-valuenow', param.remaining_hp);
        hpbar.attr('aria-valuemax', param.max_hp);
        hpbar.css('width', param.remaining_hp_per + '%');
        // 経験値バーをリセット
        expbar.animate({
            width: 0
        }, {
            duration: 1,
            easing: 'easeOutQuad',
            complete: function(){
                // 処理完了(css変更のズレがあるため0.5秒後にresolveを返却)
                setTimeout(function() {
                    expbar.show();
                    resolve();
                }, 500);
            }
        });
    });
}