# 囲みマス ビューア
## ビューアについて
[囲みマスサーバ](https://github.com/kakomimasu/server)では、アカウント登録やゲーム閲覧などが簡単に行えるビューアを提供しています。
最新リリースのビューアへは以下のURLにてアクセスが可能です。

https://kakomimasu.com

ビューアは下記のような機能が実装されています。

## ゲーム関連

### ゲーム一覧
https://kakomimasu.com/game/index

||
|:--|

プレイヤーが対戦したゲームの一覧を見ることが出来ます。リアルタイム更新に対応しているため、様々なゲームの進行状況が把握できます。

現在時刻の下側にあるボタンで「フリーマッチ」か「カスタムマッチ」を選ぶことが出来ます。

- カスタムマッチ
　後述の「[カスタムゲーム作成](#カスタムゲーム作成)」にて作成したゲームを表示します。
- フリーマッチ
　カスタムマッチでないゲームを表示します。対AI戦などもこちらに表示されます。

### ゲーム詳細
https://kakomimasu.com/game/detail （最新版）

https://kakomimasu.com/game/detail/:gameId （ゲームID指定版）
※`:gameId`には閲覧したいゲームのIDが入ります。

||
|:--|

ゲーム詳細では

- ゲーム情報
- ボード状況
- プレイヤー情報
- ターンごとの点数グラフ

などの情報を得ることが出来ます。リアルタイム更新に対応しているため、試合中のボード情報・点数遷移を把握できます。

また、エージェントにカーソルを載せると（スマホではエージェントをタップ）エージェントの詳細を得ることが出来ます。
エージェントの詳細とは

- エージェント番号
- 行動履歴

などを知ることができます。行動履歴で取り消し線が引かれているターンは競合・無効となった行動となります。


ゲーム詳細最新版では、フリーマッチの中で最新のゲームを見ることが出来ます。新しいゲームが開始された場合には、閲覧中のゲームが進行中でも新しく開始されたゲームに移ります。

### ゲーム詳細（VR版）

||
|:--|

ボードの様子をVRで見ることが出来ます。
VR版にはゲーム詳細の上部にある「VR版はこちら」と書かれたボタンからアクセスできます。

### カスタムゲーム作成
https://kakomimasu.com/game/create
||
|:--|

使用するボード・参加ユーザなどを指定してゲームを作成することが出来ます。
ここで作成したゲームは、[ゲーム一覧](#ゲーム一覧)のカスタムゲームで表示されます。

- ゲーム名
ゲーム一覧などで見ることが出来る任意の名前を付けることが出来ます。

- 使用ボード
ドロップダウンリストから使用ボードを選ぶことが出来ます。ボードを選択するとボードプレビューが表示され、点数配置などを知ることが出来ます。

- プレイヤー数
ゲームに参加するプレイヤー数を指定できます。
現在は2人対戦にのみ対応しております。

- 参加ユーザ
ゲームに参加できるユーザをユーザ名で指定できます。
参加ユーザが指定されていない分は、ゲームIDを知っているユーザならば誰でも参加することが可能になります。
プレイヤー数と同数の参加ユーザを指定することで、特定のプレイヤー同士の対戦を行うことが出来ます。

## ユーザ関連
### ユーザ詳細

https://kakomimasu.com/user/detail/:userId
※`:userId`には閲覧したいユーザのIDを入れてください。

||
|:--|

ユーザ詳細では、
- 表示名・ユーザネーム・IDなどの基本情報
- 勝敗記録グラフ
- 参加ゲーム一覧

を閲覧することが出来ます。

ユーザ詳細には[ゲーム詳細](#ゲーム詳細)のプレイヤー欄からもアクセスすることが可能です。

### ログイン・新規登録
https://kakomimasu.com/user/login

ログイン・新規登録を行うには、ビューアの右上にある「ログイン・新規登録」ボタンからできます。
すでにログイン済みの方は自身のアイコンが表示されています。

||
|:--|

新規登録にはGoogle・Twitter・Githubアカウント、メール、電話から選ぶことが出来ます。

登録済みの方・未登録の方の画面は共通となっています。
ユーザ登録済みのアカウントでログインした場合はトップページにリダイレクトされ、未登録のユーザの場合には新規登録ページに遷移します。

||
|:--|

新規登録の際には、表示名とユーザネームを指定できます。
ユーザネームは他のユーザと被るものは使用できません。

表示名は、主にゲーム一覧や詳細の画面に表示されます。

## 大会関連
囲みマスでは、簡易大会機能を備えています。
参加ユーザを指定してトーナメント戦を行うことが可能です。

### 大会一覧
https://kakomimasu.com/tournament/index

||
|:--|

大会一覧では開催されている大会を閲覧することができます。各大会のカードをクリックすることで[大会詳細](#大会詳細)を見ることもできます。
また、上部のボタンから大会作成も行うことができます。

### 大会詳細
https://kakomimasu.com/tournament/detail/:tournamentId
※`:tournamentId`には閲覧したい大会のIDが入ります。

||
|:--|

大会詳細では、

- 大会名
- 主催者
- 大会ID
- 試合形式
- 各ゲーム詳細へのリンク
- ランキング

を閲覧することができます。
また、大会への参加ユーザの追加、ゲーム作成も行うことができます。

大会に属するゲームはカスタムゲームとなり、ゲーム一覧見る場合には「カスタムゲーム」を選択する必要があります。

また、現在追加されたユーザを削除する機能はありません

ランキングは以下のような定義で表示されています。

1. 勝利数が多いユーザ
1. 累計獲得ポイントが多いユーザ
2. 壁ポイントが多いユーザ

### 大会作成
https://kakomimasu.com/tournament/create

||
|:--|

大会を作成することができます。以下の事項を入力できます。

- 大会名
- 主催者名
- 試合形式
　現在はグループトーナメント（総当たり戦）のみ対応しています。
- 参加ユーザ
　参加するユーザをユーザネームで指定することができます。後からゲーム詳細からも追加可能です。
- 備考
　大会の詳細事項（開催日時・開始時刻など）を記入する欄です。

## 開発者用ツール
### フィールド説明用エディタ
https://kakomimasu.com/dev/field-editor

||
|:--|

任意のボード上で、フィールドの任意のマスを好きな状態にすることができます。

囲みマスのルールは複雑なので、説明をするときなどに使用することができます。

操作は、左クリック・右クリックで行います。

- 左クリック
クリックするごとに「青陣地→赤陣地→青壁→赤壁→空白マス→青陣地→…」というようにマスの状態が変わります。
- 右クリック
右クリックするとエージェントを配置できます。もう一回押すと配置解除できます。
右クリックはマスの状態が「壁」の時のみ有効です。

## 最後に
これにてビューアの解説は終わりです。
問題点や改善点があった場合には[Githubのissue](https://github.com/kakomimasu/server/issues)を追加するか、運営（[Twitter](https://twitter.com/kakomimasu) DM、Discord）まで報告していただくと嬉しいです。