---
Title: ''
Author: hituki
Web: 'https://mimemo.io/m/qERa6lBamgoPb0v'
---

## ざっくりとした説明
シミュレータで目隠しぷよができるようになります。

## 注意点
 - [対戦ぷよパーク！！のシミュレータ](http://www.puyop.com/s/)用です。他のシミュレータでは使えません。
 - edgeまたはchrome(PC)でのみ使用できます。スマホでは使用できません。
 - 配信で見せるようのレイアウトの変更も含まれています。（目隠しぷよとは一切関係ないものも含まれているということです。）

## 設定手順
1. ブラウザに[Custom JavaScript for Websites 2](https://chrome.google.com/webstore/detail/custom-javascript-for-web/ddbjnfjiigjmcpcpkmhogomapikjbjdk)をインストールします。
1. このページ下部に記載された貼り付け用コードをコピーします。
1. [対戦ぷよパーク！！のシミュレータ](http://www.puyop.com/s/)を開きます。
1. 手順１でインストールした拡張機能の管理を開きます。
（CJSと文字が書かれたアイコンがインストールした拡張機能です。）
1. 手順２でコピーしたコードを貼り付けます。
（初見だとわかりにくいですが、```// Here You can type your custom JavaScript...```と表示されているエリアに貼り付けてください。元の文はいらないので消してください。）
1. 左上のSaveボタンを押します。

以上で設定完了です。
一度設定すると常に反映されるので都度設定は不要です。
邪魔になった場合、手順１でインストールした拡張機能ごと削除するといいと思います。

## 追加の操作
キー操作を追加しています。
もともと設定されている移動・回転等の操作に加えて以下のキーでのイベントを追加しています。

|キー|動作|
| --- | --- |
| u | 通常の状態です。 |
| i | フィールドのぷよが全く見えない状態になります。いわゆる一般的な目隠しぷよにあたるものです。 |
| o | フィールドのぷよがすべてお邪魔ぷよで表示されるようになります。どこにぷよがあるかわかりますが、つながりはわからない状態です。 |
| p | フィールドのぷよがすべて赤ぷよで表示されるようになります。どこにぷよがあるかわかり、なおかつ、ぷよのつながりはわかる状態です。 |
| 0 | 現在のフィールド状態を保存します。 |
| 1～9 | 0キーで保存した状態にフィールドを戻します。保存した順に1,2,..です。 |

フィールドのぷよの見え方を変える操作はいつでも（連鎖中以外）可能です。
連鎖中はどの見え方にしていてもすべてのぷよの色が完全に見える状態になります。
0キーで保存した状態はsキー（ツモパターンを変えるキー操作）を押した際に削除します。（開始ボタンを押しても消えません。自分が開始ボタンを使わずキーを使うので。。）

## 貼り付け用コード
```
$(".tokoonly_hide:eq(10)").hide();
$(".tokoonly_hide:eq(11)").hide();
$(".greyBox:eq(6)").hide();
$("#next_box_1").css("left", '45px');
$("#field").after($('<div style="background:black;color:yellow;font-size: 30px;text-align: center;height: 30px;padding-top: 10px;"><span id="now_rensa_text"></span>連鎖　<span id="now_point_text" class="strong"></span>点</div>'));

setNoMaskedImageClip = simView._setImageClip;
setOneColorImageClip = function($img, cx, cy) {
  if (!simData._rensaFlag && cx < 165 && cy < 33 * 16) {
    cx = 0;
  }
  setNoMaskedImageClip($img, cx, cy);
};
setMaskedImageClip = function($img, cx, cy) {
  if (!simData._rensaFlag && cx < 165 && cy < 33 * 16) {
    cx = 165;
    cy = 0;
  }
  setNoMaskedImageClip($img, cx, cy);
};
setNoImageClip = function($img, cx, cy) {
  if (!simData._rensaFlag) {
    cx = 165;
    cy = 165;
  }
  setNoMaskedImageClip($img, cx, cy);
};
simView._setUnitImage = function($img, type) {
  var clipCoord = this._getClipCoord(type);
  setNoMaskedImageClip($img, clipCoord.cx, clipCoord.cy);
};

var loadedNumber = 0;
document.addEventListener('keydown', function(e) {
  switch (e.key) {
    case 'u':
      simView._setImageClip = setNoMaskedImageClip;
      simView.redrawFieldImg();
      break;
    case 'p':
      simView._setImageClip = setOneColorImageClip;
      simView.redrawFieldImg();
      break;
    case 'o':
      simView._setImageClip = setMaskedImageClip;
      simView.redrawFieldImg();
      break;
    case 'i':
      simView._setImageClip = setNoImageClip;
      simView.redrawFieldImg();
      break;
    case '0':
      if (e.shiftKey) {
        if (loadedNumber > 0) {
          $(".load-toko:eq(" + (loadedNumber - 1) + ")").remove();
          loadedNumber = 0;
        }
      } else {
        $("#sb")[0].onclick();
        break;
      }
      case '1':
      case '2':
      case '3':
      case '4':
      case '5':
      case '6':
      case '7':
      case '8':
      case '9':
        $e = $(".load-toko:eq(" + (e.key - 1) + ")");
        if ($e.length) {
          $e[0].onclick();
          loadedNumber = e.key;
        }
        break;
      case 's':
        tmpTsumoNumber = simData.tsumoNumber;
        tmpData = [...simData._tokoSaveDataList];
        rb = $("#revert_button");
        rb.data("tsumoNumber", tmpTsumoNumber);
        rb.data("tokoSaveDataList", tmpData);
        simData.tsumoNumber = Math.floor(Math.random() * 65536);
        $("#haipuyo_pattern").val(simData.tsumoNumber);
        $("#start_button").click();
        $(".load-toko").remove();
        // no break
      default:
        $("#index_info").text(simData._handIndex + 1);
  }
});

click_save = function() {
  lb = $("<button>", {
    "text": "load",
    "class": "load-toko",
    "onclick": "click_load(this)"
  });
  $("#custom_area").append(lb);
  tmp = [...simData._tokoSaveDataList];
  lb.data("tokoSaveDataList", tmp);
  loadedNumber = $(".load-toko").length;
};
click_load = function(zis) {
  $this = $(zis);
  tmp = $this.data("tokoSaveDataList");
  simData._tokoSaveDataList = [...tmp];
  simData._handIndex = tmp.length - 2;
  simData.tokoForward();
}
click_revert = function(zis) {
  $("#haipuyo_pattern").val($(zis).data("tsumoNumber"));
  click_load(zis);
}

$("#tokopuyo_mode_div").after($("<div>", {
  "id": "custom_area"
}));
rb = $("<button>", {
  "id": "revert_button",
  "text": "revert",
  "onclick": "click_revert(this)"
});
$("#custom_area").append(rb);
sb = $("<button>", {
  "id": "sb",
  "text": "save",
  "onclick": "click_save()"
});
$("#custom_area").append(sb);

$("#tokopuyo_button").click();
$("#haipuyo_pattern").css({'background': 'rgb(225 255 240)', 'color': 'maroon', 'height': '40px', 'font-size': '35px'});
$("#tokopuyo_mode_div").before($('<div style="margin-left: -20px;margin-top:5px;margin-bottom:20px;"> <span id="index_info" style="font-size:45px;color:red">xx</span> <span style="font-size:25px;color:red;">手目</span></div>'));

var KEY_0 = 0;
var KEY_1 = 0;
var KEY_2 = 0;
var KEY_3 = 0;
var KEY_4 = 0;
var KEY_5 = 0;
var KEY_6 = 0;
var KEY_7 = 0;
var KEY_8 = 0;
var KEY_9 = 0;
var KEY_S = 0;
```