ぷよぷよテトリスS買ってみた

NINTENDO SWITCH用ゲームを購入しました。

大人も子供も遊べる元祖落ち物パズル

落ち物ゲームの元祖といえば「テトリス」。

Wikipediaによると、日本では1988年にセガがアーケード版を出したのが最初の方らしいです。

[link url=”https://ja.wikipedia.org/wiki/テトリス”]

ぼくも当時、ファミコン版とかX68000版とかで遊んだものです。

それと「ぷよぷよ」。

今はなきコンパイルの作品。

[link url=”https://ja.wikipedia.org/wiki/ぷよぷよ”]

コンパイルはMSXの作品を色々と出していた会社。

ZANACとかのシューティング系とか魔導物語というRPGとか。

フロッピー媒体の雑誌「ディスクステーション」なんてのも出していたりして、懐かしい。

その魔導物語のキャラクターを使って落ち物パズルを出したのが「ぷよぷよ」だった。

やっぱり当時、メガドライブなんかで遊んでいた。

どっちも違うゲームでルールも違うのだけど、それを混ぜ合わせたのが「ぷよぷよテトリス」。

それのスイッチ版が「ぷよぷよテトリスS」です。

まずは無料体験版で子どもにも好評だった

まずは無料体験版があったので、インストールして子どもと一緒に遊んでみました。

長男
テトリス、おかんが好きだったから実は好き。
ぽぽろん
どちらかというとぷよぷよ好き。
次男
どっちもよく分かんない。

テトリスでは長男が勝率が高くて、ぷよぷよはぼく。

次男は負けが込んでいたけど若さからか遊ぶたびに連鎖とか組めるようになってくる。

ハンデ設定とかチーム分けも出来るので、それなりに渡り合える遊び方も出来ておおむね好評。

ぽぽろん
(んー、これは買っちゃうか。)

さっそくAmazonでパッケージ版を購入。

税込み4,644円でした。

遊べるモードも増えている製品版

体験版だと「ぷよぷよ」と「テトリス」が選べる「VS」(対戦)と、「ぷよぷよ」と「テトリス」が時間で入れ替わる「スワップ」が遊べました。

製品版では「ぷよテトミックス」「パーティー」「ビッグバン」というルールも増えています。

「ぷよテトミックス」は同一の場にぷよぷよとテトリスが落ちてきてかなり混沌としています。慣れてくるとミックスならではの連鎖が組めて楽しいです。

「パーティー」は色んなアイテムが出てきて、目隠ししたり高速で落下したり、みんなで遊んで楽しいです。

「ビッグバン」は連鎖を組んでいく楽しさがあります。

長男
ビッグバンだと次男つえー!
次男
ふっふーん!
ぽぽろん
ビッグバンは瞬発力があるのが強いなー。

みんなで遊んでいて一番盛り上がったのは「パーティー」。

次男
あっ、今高速化やめて!
長男
もういっちょ行くよ。
ぽぽろん
ぶへっ、今高速化やめて!ほんとやめて!

あとは自分の好きな「ぷよぷよ」か「テトリス」を選べる「VS」という感じでした。

長男
ふたりでおとん潰そう。
次男
おとんに勝ちたい。
ぽぽろん
ふたりとも、こわい。

練習しておかないと…!

今のところは経験値の分だけ、ぼくの勝率が高いけど、少しずつ子どもも連鎖とかが組めるようになってきます。

追いつかれないように練習しないと…!

では、この辺で。(^-^)o

[amzn-link asin=”B01N4PKS4S”][amzn-link asin=”B01MTASBY4″][amzn-link asin=”B01MZBJ3N0″][amzn-link asin=”B0716XSM8Y”][amzn-link asin=”B075LC617B”]

[JavaScript]入力している内容を他の項目に反映させる

プラグイン作成に使える小技なんかを紹介していきたいと思います。

入力内容を他の項目に反映させる

Pz-LinkCardではショートコードの項目を入力すると、記入例のところも連動して変更されるようになっています。

  1. ショートコードに「blogcard」と入力されている。
  2. 「blogcardaaaa」と入力すると記述例も連動して同じ文字列になる。

HTMLファイルを用意する

設定画面を表示するプラグインを作成してみます。

こんなHTMLファイルを用意してみます。

メモ帳で作成してデスクトップに保存してみてください。

ファイル名は何でもよいですが、拡張子(ファイル名の最後のドット以降)は「.html」にします。

[html title=”same-text.html”]

<br /> 入力した内容を他の項目に反映させる<br />

Input
Same text


[/html]

動作確認

「Input」というところのボックスに入力した文字が、下の「Same text」という横に表示されます。

ポイント

まずは12行目。

[html title=”same-text.html” start-line=”12″ wrap=”1″] [/html]

「onKeyUp=“document.getElementById(‘same1’).innerText = document.getElementById(‘text1’).value;“」という文があります。

キーが離されたとき(onKeyUp)に、「same1」というidが付いている項目のテキストに、「text1」というidが付いている項目の内容をコピーするという意味になります。

[html title=”same-text.html” start-line=”18″] [/html]

18行目に「same1」とidを指定した項目があるので、この中身が「text1」とidを指定した項目の中身に置き換わります。

リアルタイムに他の項目に内容が反映されるとちょっと気持ちいいですよね。

では、この辺で。(^-^)o

[amzn-link asin=”4295000981″][amzn-link asin=”477418411X”][amzn-link asin=”4797383585″][amzn-link asin=”4797388641″][amzn-link asin=”4873117836″]

[WPプラグイン開発]設定画面を作成する

プラグイン作成に使える小技なんかを紹介していきたいと思います。

設定画面を作成する

自分で作ったWordPressプラグインに設定画面を追加してみます。

ソース

設定画面を表示するプラグインを作成してみます。

保存されている設定を読みだして、テキスト項目を設定して保存ができる設定画面です。

[php title=”my-test-plugin.php”]<?php
/*
Plugin Name: MyTestPlugin
Plugin URI: https://popozure.info/20180202/12305
Description: 設定画面を作成してみる
Version: 0.0.1
Network: True
Author: poporon
Author URI: http://popozure.info
License: GPLv2 or later
*/

defined(‘ABSPATH’) || die;

class MyTestPlugin {

public $options;

protected $defaults = array(
‘code1’ => ‘test’,
‘plugin-version’ => ‘0.0.0’
);

public function __construct() {
// オプション読み込み
$this->options = get_option(‘mytestplugin_options’, $this->defaults );

// 設定メニュー
add_action(‘admin_menu’, array($this, ‘add_menu’) );
}

// 管理画面のサブメニュー追加
public function add_menu() {
add_options_page(‘My Plugin Settings’, ‘Test Settings’, ‘manage_options’, ‘my-test-settings’, array($this, ‘page_settings’) );
}

// 設定画面
public function page_settings() {
if ( isset($_POST[‘properties’])) {
check_admin_referer(‘mytest_options’);
$this->options = $_POST[‘properties’];
update_option(‘mytestplugin_options’, $this->options);
}
?>
<div class=”wrap”>
<div id=”icon-options-general” class=”icon32″></div>
<h2>Test Settings</h2>
<div id=”settings” style=”clear:both;”>
<form action=”” method=”post”>
<?php wp_nonce_field(‘mytest_options’); ?>

<h3>Text Setting</h3>
<table class=”form-table”>
<tr valign=”top”>
<th scope=”row”>Code 1</th>
<td>
<input name=”properties[code1]” type=”text” id=”code1″ value=”<?php echo esc_attr($this->options[‘code1’]); ?>” class=”regular-text” style=”width: 8em;” />
</td>
</tr>
</table>
<?php submit_button(); ?>
</form>
</div>
</div>
<?php
}
}

$Class_MyTestPlugin = new MyTestPlugin;[/php]

動作イメージ

管理画面の設定に「Test Setting」という項目が増えています。

「Code 1」としてテキストが設定できる画面が表示されます。

文字列を変更して「変更を保存」を押すと、その文字列が記憶されます。

 解説

オプション項目の呼び出し・保存

何か設定項目を記録してもらいたいときに、設定画面を作りたくなると思います。覚えてもらう項目を「$options」と名付けてみます。(任意の名前で良いです。)

[php title=”my-test-plugin.php” start-line=”17″ wrap=”1″]public $options;[/php]

覚えて貰う項目の用意ができたので、今までにWordPressが覚えてくれている設定値を読み込みます。

[php title=”my-test-plugin.php” start-line=”26″ wrap=”1″]$this->options = get_option(‘mytestplugin_options’, $this->defaults );[/php]

WordPressが覚えてくれている「mytestplugin_options」というオプションを取得しています。

保存するときの名前と合わせます。

初めての呼び出しのときには、何も取得できないので、$defaultsの中身が入ります。

[php title=”my-test-plugin.php” start-line=”42″ wrap=”1″]update_option(‘mytestplugin_options’, $this->options);[/php]

変更したオプション($options)の内容を「mytestplugin_options」という名前で保存しています。

名前は自分の作るプラグインの名前に合わせて変更すると良いでしょう。

ちなみに「wp_options」というDBテーブルに記録されます。

管理画面のメニューに追加する

__construct内でアクションフックの設定を行います。

[php title=”my-test-plugin.php” start-line=”29″ wrap=”1″]add_action(‘admin_menu’, array($this, ‘add_menu’) );[/php]

管理画面のメニューが表示されるとき(admin_menu)にadd_menuという自分で作った関数(ルーチン)を呼びます。

add_menuという関数を定義して、その中で「設定」メニューにサブメニューを追加しています。

[php title=”my-test-plugin.php” start-line=”34″ wrap=”1″]add_options_page(‘My Plugin Settings’, ‘Test Settings’, ‘manage_options’, ‘my-test-settings’, array($this, ‘page_settings’) );[/php]

「My Plugin Settings」は任意の名称で良いです。

「Test Settings」は表示される文字列なので、分かり易い名称に直しましょう。

「manage_options」は設定メニューという意味なので、このまま変更しません。

「my-test-settings」は任意の名称で良いです。

「page_settings」は自分で作る関数の名前です。

[php title=”my-test-plugin.php” start-line=”38″ wrap=”1″]public function page_settings() {[/php]

先ほど用意したメニューを選んだときに表示されるのが「page_settings」という関数の中身です。

ここに設定したい内容とか、設定を保存する仕組みを書き入れます。

おまじない

他のページから呼ばれたときに誤動作しないように、ナンス(nonce)というのを設定しておきます。

[php title=”my-test-plugin.php” start-line=”50″ wrap=”1″]<?php wp_nonce_field(‘mytest_options’); ?>[/php]

更新をするときにチェックすることで、正しい順番でページが遷移(せんい)されてきたときだけオプションの更新を行います。

[php title=”my-test-plugin.php” start-line=”40″ wrap=”1″]check_admin_referer(‘mytest_options’);[/php]

「mytest_options」という名前は自分のプラグインの名称に合わせて直すと良いですが、フィールドを設定する側とチェック側とで合わせる必要があります。

おわり

今回は必要最小限の項目でプラグインの設定画面を作成してみました。

classを使ってプラグインの設定画面を作成する記事が少なくて、自分が困った記憶があったので、みなさんがプラグインを作成されるときの参考になれば幸いです。

では、この辺で。(^-^)o

[amzn-link asin=”4774187062″][amzn-link asin=”4798119873″][amzn-link asin=”4798143774″][amzn-link asin=”4295001244″][amzn-link asin=”4295000795″]