Simplified frontend anim handling.

Added melee attack feature.

README.md

@@ -2,9 +2,10 @@
 
 This project is a demo for a websocket-based rollback netcode inspired by [GGPO](https://github.com/pond3r/ggpo/blob/master/doc/README.md).
 
-![gif_demo](./charts/along_wall_interaction_with_reconnection.gif)
+_(the following gif is sped up to ~1.5x for file size reduction, kindly note that around ~11s countdown, the attack animation is resumed from a partial progress)_
+![gif_demo](./charts/melee_attack_fractional_anim_resume_spedup.gif)
 
-Please also checkout [this demo video](https://pan.baidu.com/s/1YkfuHjNLzlFVnKiEj6wrDQ?pwd=tkr5) to see how this demo carries out a full 60fps synchronization with the help of _batched input upsync/downsync_ for satisfying network I/O performance.
+Please also checkout [this demo video](https://pan.baidu.com/s/1U1wb7KWyHorZElNWcS5HHA?pwd=30wh) to see how this demo carries out a full 60fps synchronization with the help of _batched input upsync/downsync_ for satisfying network I/O performance.
 
 The video mainly shows the following features.
 - The backend receives inputs from frontend peers and broadcasts back for synchronization.

battle_srv/api/v1/player.go

@@ -5,6 +5,7 @@ import (
 	. "battle_srv/common"
 	"battle_srv/common/utils"
 	"battle_srv/models"
+	. "battle_srv/protos"
 	"battle_srv/storage"
 	"bytes"
 	"crypto/sha256"
@@ -526,8 +527,10 @@ func (p *playerController) maybeCreatePlayerWechatAuthBinding(userInfo utils.Use
 		}
 		if player != nil {
 			updateInfo := models.Player{
-				Avatar:      userInfo.HeadImgURL,
-				DisplayName: userInfo.Nickname,
+				PlayerDownsync: PlayerDownsync{
+					Avatar:      userInfo.HeadImgURL,
+					DisplayName: userInfo.Nickname,
+				},
 			}
 			tx := storage.MySQLManagerIns.MustBegin()
 			defer tx.Rollback()
@@ -542,10 +545,12 @@ func (p *playerController) maybeCreatePlayerWechatAuthBinding(userInfo utils.Use
 	}
 	now := utils.UnixtimeMilli()
 	player := models.Player{
-		CreatedAt:   now,
-		UpdatedAt:   now,
-		DisplayName: userInfo.Nickname,
-		Avatar:      userInfo.HeadImgURL,
+		PlayerDownsync: PlayerDownsync{
+			DisplayName: userInfo.Nickname,
+			Avatar:      userInfo.HeadImgURL,
+		},
+		CreatedAt: now,
+		UpdatedAt: now,
 	}
 	return p.createNewPlayer(player, userInfo.OpenID, int(Constants.AuthChannel.Wechat))
 }
@@ -562,8 +567,10 @@ func (p *playerController) maybeCreatePlayerWechatGameAuthBinding(userInfo utils
 		}
 		if player != nil {
 			updateInfo := models.Player{
-				Avatar:      userInfo.HeadImgURL,
-				DisplayName: userInfo.Nickname,
+				PlayerDownsync: PlayerDownsync{
+					Avatar:      userInfo.HeadImgURL,
+					DisplayName: userInfo.Nickname,
+				},
 			}
 			tx := storage.MySQLManagerIns.MustBegin()
 			defer tx.Rollback()
@@ -578,10 +585,12 @@ func (p *playerController) maybeCreatePlayerWechatGameAuthBinding(userInfo utils
 	}
 	now := utils.UnixtimeMilli()
 	player := models.Player{
-		CreatedAt:   now,
-		UpdatedAt:   now,
-		DisplayName: userInfo.Nickname,
-		Avatar:      userInfo.HeadImgURL,
+		PlayerDownsync: PlayerDownsync{
+			DisplayName: userInfo.Nickname,
+			Avatar:      userInfo.HeadImgURL,
+		},
+		CreatedAt: now,
+		UpdatedAt: now,
 	}
 	return p.createNewPlayer(player, userInfo.OpenID, int(Constants.AuthChannel.WechatGame))
 }

battle_srv/env_tools/load_pre_conf.go

@@ -4,6 +4,7 @@ import (
 	. "battle_srv/common"
 	"battle_srv/common/utils"
 	"battle_srv/models"
+	. "battle_srv/protos"
 	"battle_srv/storage"
 	. "dnmshared"
 	sq "github.com/Masterminds/squirrel"
@@ -71,7 +72,6 @@ func createMysqlData(rows *sqlx.Rows, v string) {
 	}
 }
 
-// 加上tableName参数, 用于pre_conf_data.sqlite里bot_player表的复用 --kobako
 func maybeCreateNewPlayerFromBotTable(db *sqlx.DB, tableName string) {
 	var ls []*dbBotPlayer
 	err := db.Select(&ls, "SELECT name, magic_phone_country_code, magic_phone_num, display_name FROM "+tableName)
@@ -88,7 +88,6 @@ func maybeCreateNewPlayerFromBotTable(db *sqlx.DB, tableName string) {
 		panic(err)
 	}
 	query = storage.MySQLManagerIns.Rebind(query)
-	// existNames := make([]string, len(ls), len(ls))
 	var existPlayers []*models.Player
 	err = storage.MySQLManagerIns.Select(&existPlayers, query, args...)
 	if nil != err {
@@ -99,13 +98,11 @@ func maybeCreateNewPlayerFromBotTable(db *sqlx.DB, tableName string) {
 		var flag bool
 		for _, v := range existPlayers {
 			if botPlayer.Name == v.Name {
-				// 已有数据，合并处理
 				flag = true
 				break
 			}
 		}
 		if !flag {
-			// 找不到，新增
 			Logger.Debug("create", zap.Any(tableName, botPlayer))
 			err := createNewBotPlayer(botPlayer)
 			if err != nil {
@@ -120,11 +117,14 @@ func createNewBotPlayer(p *dbBotPlayer) error {
 	defer tx.Rollback()
 	now := utils.UnixtimeMilli()
 	player := models.Player{
-		CreatedAt:   now,
-		UpdatedAt:   now,
-		Name:        p.Name,
-		DisplayName: p.DisplayName,
+		CreatedAt: now,
+		UpdatedAt: now,
+		PlayerDownsync: PlayerDownsync{
+			Name:        p.Name,
+			DisplayName: p.DisplayName,
+		},
 	}
+
 	err := player.Insert(tx)
 	if err != nil {
 		return err

battle_srv/env_tools/test_env_db.go

@@ -4,6 +4,7 @@ import (
 	. "battle_srv/common"
 	"battle_srv/common/utils"
 	"battle_srv/models"
+	. "battle_srv/protos"
 	"battle_srv/storage"
 	. "dnmshared"
 
@@ -75,9 +76,11 @@ func createNewPlayer(p *dbTestPlayer) error {
 	defer tx.Rollback()
 	now := utils.UnixtimeMilli()
 	player := models.Player{
+		PlayerDownsync: PlayerDownsync{
+			Name: p.Name,
+		},
 		CreatedAt: now,
 		UpdatedAt: now,
-		Name:      p.Name,
 	}
 	err := player.Insert(tx)
 	if err != nil {

battle_srv/models/pb_type_convert.go

@@ -2,10 +2,9 @@ package models
 
 import (
 	. "battle_srv/protos"
-	. "dnmshared/sharedprotos"
 )
 
-func toPbPlayers(modelInstances map[int32]*Player) map[int32]*PlayerDownsync {
+func toPbPlayers(modelInstances map[int32]*Player, withMetaInfo bool) map[int32]*PlayerDownsync {
 	toRet := make(map[int32]*PlayerDownsync, 0)
 	if nil == modelInstances {
 		return toRet
@@ -13,18 +12,22 @@ func toPbPlayers(modelInstances map[int32]*Player) map[int32]*PlayerDownsync {
 
 	for k, last := range modelInstances {
 		toRet[k] = &PlayerDownsync{
-			Id:           last.Id,
-			VirtualGridX: last.VirtualGridX,
-			VirtualGridY: last.VirtualGridY,
-			Dir: &Direction{
-				Dx: last.Dir.Dx,
-				Dy: last.Dir.Dy,
-			},
-			Speed:       last.Speed,
-			BattleState: last.BattleState,
-			Score:       last.Score,
-			Removed:     last.Removed,
-			JoinIndex:   last.JoinIndex,
+			Id:             last.Id,
+			VirtualGridX:   last.VirtualGridX,
+			VirtualGridY:   last.VirtualGridY,
+			DirX:           last.DirX,
+			DirY:           last.DirY,
+			ColliderRadius: last.ColliderRadius,
+			Speed:          last.Speed,
+			BattleState:    last.BattleState,
+			Score:          last.Score,
+			Removed:        last.Removed,
+			JoinIndex:      last.JoinIndex,
+		}
+		if withMetaInfo {
+			toRet[k].Name = last.Name
+			toRet[k].DisplayName = last.DisplayName
+			toRet[k].Avatar = last.Avatar
 		}
 	}
 

battle_srv/models/player.go

@@ -1,11 +1,13 @@
 package models
 
 import (
-	"database/sql"
-	. "dnmshared/sharedprotos"
+	. "battle_srv/protos"
+	"battle_srv/storage"
+	. "dnmshared"
 	"fmt"
 	sq "github.com/Masterminds/squirrel"
 	"github.com/jmoiron/sqlx"
+	"go.uber.org/zap"
 )
 
 type PlayerBattleState struct {
@@ -33,12 +35,7 @@ func InitPlayerBattleStateIns() {
 }
 
 type Player struct {
-	// Meta info fields
-	Id             int32   `json:"id,omitempty" db:"id"`
-	Name           string  `json:"name,omitempty" db:"name"`
-	DisplayName    string  `json:"displayName,omitempty" db:"display_name"`
-	Avatar         string  `json:"avatar,omitempty"`
-	ColliderRadius float64 `json:"-"`
+	PlayerDownsync
 
 	// DB only fields
 	CreatedAt     int64     `db:"created_at"`
@@ -46,19 +43,10 @@ type Player struct {
 	DeletedAt     NullInt64 `db:"deleted_at"`
 	TutorialStage int       `db:"tutorial_stage"`
 
-	// in-battle info fields
-	VirtualGridX         int32
-	VirtualGridY         int32
-	Dir                  *Direction
-	Speed                int32
-	BattleState          int32
-	LastMoveGmtMillis    int32
-	Score                int32
-	Removed              bool
-	JoinIndex            int32
+	// other in-battle info fields
+	LastSentInputFrameId int32
 	AckingFrameId        int32
 	AckingInputFrameId   int32
-	LastSentInputFrameId int32
 }
 
 func ExistPlayerByName(name string) (bool, error) {
@@ -74,15 +62,43 @@ func GetPlayerById(id int) (*Player, error) {
 }
 
 func getPlayer(cond sq.Eq) (*Player, error) {
-	var p Player
-	err := getObj("player", cond, &p)
-	if err == sql.ErrNoRows {
-		return nil, nil
+	p := Player{}
+	pd := PlayerDownsync{}
+	query, args, err := sq.Select("*").From("player").Where(cond).Limit(1).ToSql()
+	if err != nil {
+		return nil, err
 	}
-	p.Dir = &Direction{
-		Dx: 0,
-		Dy: 0,
+	rows, err := storage.MySQLManagerIns.Queryx(query, args...)
+	if err != nil {
+		return nil, err
 	}
+	cols, err := rows.Columns()
+	if nil != err {
+		panic(err)
+	}
+	for rows.Next() {
+		// TODO: Do it more elegantly, but by now I don't have time to learn reflection of Golang
+		vals := rowValues(rows, cols)
+		for i, col := range cols {
+			val := *vals[i].(*interface{})
+			if "id" == col {
+				pd.Id = int32(val.(int64))
+			}
+			if "name" == col {
+				switch v := val.(type) {
+				case []byte:
+					pd.Name = string(v)
+				default:
+					pd.Name = fmt.Sprintf("%v", v)
+				}
+			}
+			if "created_at" == col {
+				p.CreatedAt = int64(val.(int64))
+			}
+		}
+		Logger.Info("Queried player from db", zap.Any("cond", cond), zap.Any("p", p), zap.Any("pd", pd), zap.Any("cols", cols), zap.Any("rowValues", vals))
+	}
+	p.PlayerDownsync = pd
 	return &p, nil
 }
 
@@ -113,8 +129,6 @@ func Update(tx *sqlx.Tx, id int32, p *Player) (bool, error) {
 	}
 	result, err := tx.Exec(query, args...)
 	if err != nil {
-		fmt.Println("ERRRRRRR:  ")
-		fmt.Println(err)
 		return false, err
 	}
 	rowsAffected, err := result.RowsAffected()

battle_srv/models/player_dao_helper.go

@@ -10,6 +10,17 @@ import (
 	"go.uber.org/zap"
 )
 
+func rowValues(rows *sqlx.Rows, cols []string) []interface{} {
+	results := make([]interface{}, len(cols))
+	for i := range results {
+		results[i] = new(interface{})
+	}
+	if err := rows.Scan(results[:]...); err != nil {
+		panic(err)
+	}
+	return results
+}
+
 func exist(t string, cond sq.Eq) (bool, error) {
 	c, err := getCount(t, cond)
 	if err != nil {

battle_srv/models/room.go

@@ -54,6 +54,7 @@ const (
 
 	COLLISION_PLAYER_INDEX_PREFIX  = (1 << 17)
 	COLLISION_BARRIER_INDEX_PREFIX = (1 << 16)
+	COLLISION_BULLET_INDEX_PREFIX  = (1 << 15)
 )
 
 const (
@@ -61,6 +62,17 @@ const (
 	MAGIC_LAST_SENT_INPUT_FRAME_ID_READDED      = -2
 )
 
+const (
+	ATK_CHARACTER_STATE_IDLE1   = 0
+	ATK_CHARACTER_STATE_WALKING = 1
+	ATK_CHARACTER_STATE_ATK1    = 2
+	ATK_CHARACTER_STATE_ATKED1  = 3
+)
+
+const (
+	DEFAULT_PLAYER_RADIUS = float64(16)
+)
+
 // These directions are chosen such that when speed is changed to "(speedX+delta, speedY+delta)" for any of them, the direction is unchanged.
 var DIRECTION_DECODER = [][]int32{
 	{0, 0},
@@ -116,6 +128,7 @@ type Room struct {
 	collisionSpaceOffsetY float64
 	Players               map[int32]*Player
 	PlayersArr            []*Player // ordered by joinIndex
+	Space                 *resolv.Space
 	CollisionSysMap       map[int32]*resolv.Object
 	/**
 		 * The following `PlayerDownsyncSessionDict` is NOT individually put
@@ -142,11 +155,6 @@ type Room struct {
 	Index                                  int
 	RenderFrameId                          int32
 	CurDynamicsRenderFrameId               int32 // [WARNING] The dynamics of backend is ALWAYS MOVING FORWARD BY ALL-CONFIRMED INPUTFRAMES (either by upsync or forced), i.e. no rollback
-	ServerFps                              int32
-	BattleDurationFrames                   int32
-	BattleDurationNanos                    int64
-	InputFrameUpsyncDelayTolerance         int32
-	MaxChasingRenderFramesPerUpdate        int32
 	EffectivePlayerCount                   int32
 	DismissalWaitGroup                     sync.WaitGroup
 	Barriers                               map[int32]*Barrier
@@ -156,27 +164,15 @@ type Room struct {
 	LastAllConfirmedInputFrameId           int32
 	LastAllConfirmedInputFrameIdWithChange int32
 	LastAllConfirmedInputList              []uint64
-	InputDelayFrames                       int32  // in the count of render frames
-	NstDelayFrames                         int32  // network-single-trip delay in the count of render frames, proposed to be (InputDelayFrames >> 1) because we expect a round-trip delay to be exactly "InputDelayFrames"
-	InputScaleFrames                       uint32 // inputDelayedAndScaledFrameId = ((originalFrameId - InputDelayFrames) >> InputScaleFrames)
 	JoinIndexBooleanArr                    []bool
-	RollbackEstimatedDtMillis              float64
-	RollbackEstimatedDtNanos               int64
-	LastRenderFrameIdTriggeredAt           int64
 
-	WorldToVirtualGridRatio float64
-	VirtualGridToWorldRatio float64
+	BackendDynamicsEnabled       bool
+	LastRenderFrameIdTriggeredAt int64
+	PlayerDefaultSpeed           int32
 
-	PlayerDefaultSpeed int32
-
-	StageName                      string
-	StageDiscreteW                 int32
-	StageDiscreteH                 int32
-	StageTileW                     int32
-	StageTileH                     int32
-	RawBattleStrToVec2DListMap     StrToVec2DListMap
-	RawBattleStrToPolygon2DListMap StrToPolygon2DListMap
-	BackendDynamicsEnabled         bool
+	BulletBattleLocalIdCounter      int32
+	dilutedRollbackEstimatedDtNanos int64
+	BattleColliderInfo              // Compositing to send centralized magic numbers
 }
 
 func (pR *Room) updateScore() {
@@ -200,8 +196,8 @@ func (pR *Room) AddPlayerIfPossible(pPlayerFromDbInit *Player, session *websocke
 	pPlayerFromDbInit.AckingInputFrameId = -1
 	pPlayerFromDbInit.LastSentInputFrameId = MAGIC_LAST_SENT_INPUT_FRAME_ID_NORMAL_ADDED
 	pPlayerFromDbInit.BattleState = PlayerBattleStateIns.ADDED_PENDING_BATTLE_COLLIDER_ACK
-	pPlayerFromDbInit.Speed = pR.PlayerDefaultSpeed // Hardcoded
-	pPlayerFromDbInit.ColliderRadius = float64(24)  // Hardcoded
+	pPlayerFromDbInit.Speed = pR.PlayerDefaultSpeed          // Hardcoded
+	pPlayerFromDbInit.ColliderRadius = DEFAULT_PLAYER_RADIUS // Hardcoded
 
 	pR.Players[playerId] = pPlayerFromDbInit
 	pR.PlayerDownsyncSessionDict[playerId] = session
@@ -226,15 +222,16 @@ func (pR *Room) ReAddPlayerIfPossible(pTmpPlayerInstance *Player, session *webso
 	 * -- YFLu
 	 */
 	defer pR.onPlayerReAdded(playerId)
-	pR.PlayerDownsyncSessionDict[playerId] = session
-	pR.PlayerSignalToCloseDict[playerId] = signalToCloseConnOfThisPlayer
 	pEffectiveInRoomPlayerInstance := pR.Players[playerId]
 	pEffectiveInRoomPlayerInstance.AckingFrameId = -1
 	pEffectiveInRoomPlayerInstance.AckingInputFrameId = -1
 	pEffectiveInRoomPlayerInstance.LastSentInputFrameId = MAGIC_LAST_SENT_INPUT_FRAME_ID_READDED
 	pEffectiveInRoomPlayerInstance.BattleState = PlayerBattleStateIns.READDED_PENDING_BATTLE_COLLIDER_ACK
-	pEffectiveInRoomPlayerInstance.Speed = pR.PlayerDefaultSpeed // Hardcoded
-	pEffectiveInRoomPlayerInstance.ColliderRadius = float64(16)  // Hardcoded
+	pEffectiveInRoomPlayerInstance.Speed = pR.PlayerDefaultSpeed          // Hardcoded
+	pEffectiveInRoomPlayerInstance.ColliderRadius = DEFAULT_PLAYER_RADIUS // Hardcoded
+
+	pR.PlayerDownsyncSessionDict[playerId] = session
+	pR.PlayerSignalToCloseDict[playerId] = signalToCloseConnOfThisPlayer
 
 	Logger.Warn("ReAddPlayerIfPossible finished.", zap.Any("roomId", pR.Id), zap.Any("playerId", playerId), zap.Any("joinIndex", pEffectiveInRoomPlayerInstance.JoinIndex), zap.Any("playerBattleState", pEffectiveInRoomPlayerInstance.BattleState), zap.Any("roomState", pR.State), zap.Any("roomEffectivePlayerCount", pR.EffectivePlayerCount), zap.Any("AckingFrameId", pEffectiveInRoomPlayerInstance.AckingFrameId), zap.Any("AckingInputFrameId", pEffectiveInRoomPlayerInstance.AckingInputFrameId), zap.Any("LastSentInputFrameId", pEffectiveInRoomPlayerInstance.LastSentInputFrameId))
 	return true
@@ -277,8 +274,8 @@ func (pR *Room) ChooseStage() error {
 		panic(err)
 	}
 
-	// Obtain the content of `gidBoundariesMapInB2World`.
-	gidBoundariesMapInB2World := make(map[int]StrToPolygon2DListMap, 0)
+	// Obtain the content of `gidBoundariesMap`.
+	gidBoundariesMap := make(map[int]StrToPolygon2DListMap, 0)
 	for _, tileset := range pTmxMapIns.Tilesets {
 		relativeTsxFilePath := fmt.Sprintf("%s/%s", filepath.Join(pwd, relativePathForChosenStage), tileset.Source) // Note that "TmxTileset.Source" can be a string of "relative path".
 		absTsxFilePath, err := filepath.Abs(relativeTsxFilePath)
@@ -294,10 +291,10 @@ func (pR *Room) ChooseStage() error {
 			panic(err)
 		}
 
-		DeserializeTsxToColliderDict(pTmxMapIns, byteArrOfTsxFile, int(tileset.FirstGid), gidBoundariesMapInB2World)
+		DeserializeTsxToColliderDict(pTmxMapIns, byteArrOfTsxFile, int(tileset.FirstGid), gidBoundariesMap)
 	}
 
-	stageDiscreteW, stageDiscreteH, stageTileW, stageTileH, toRetStrToVec2DListMap, toRetStrToPolygon2DListMap, err := ParseTmxLayersAndGroups(pTmxMapIns, gidBoundariesMapInB2World)
+	stageDiscreteW, stageDiscreteH, stageTileW, stageTileH, strToVec2DListMap, strToPolygon2DListMap, err := ParseTmxLayersAndGroups(pTmxMapIns, gidBoundariesMap)
 	if nil != err {
 		panic(err)
 	}
@@ -306,10 +303,10 @@ func (pR *Room) ChooseStage() error {
 	pR.StageDiscreteH = stageDiscreteH
 	pR.StageTileW = stageTileW
 	pR.StageTileH = stageTileH
-	pR.RawBattleStrToVec2DListMap = toRetStrToVec2DListMap
-	pR.RawBattleStrToPolygon2DListMap = toRetStrToPolygon2DListMap
+	pR.StrToVec2DListMap = strToVec2DListMap
+	pR.StrToPolygon2DListMap = strToPolygon2DListMap
 
-	barrierPolygon2DList := *(toRetStrToPolygon2DListMap["Barrier"])
+	barrierPolygon2DList := *(strToPolygon2DListMap["Barrier"])
 
 	var barrierLocalIdInBattle int32 = 0
 	for _, polygon2DUnaligned := range barrierPolygon2DList.Eles {
@@ -345,13 +342,6 @@ func (pR *Room) ConvertToLastUsedRenderFrameId(inputFrameId int32, inputDelayFra
 	return ((inputFrameId << pR.InputScaleFrames) + inputDelayFrames + (1 << pR.InputScaleFrames) - 1)
 }
 
-func (pR *Room) EncodeUpsyncCmd(upsyncCmd *InputFrameUpsync) uint64 {
-	var ret uint64 = 0
-	// There're 13 possible directions, occupying the first 4 bits, no need to shift
-	ret += uint64(upsyncCmd.EncodedDir)
-	return ret
-}
-
 func (pR *Room) RenderFrameBufferString() string {
 	return fmt.Sprintf("{renderFrameId: %d, stRenderFrameId: %d, edRenderFrameId: %d, lastAllConfirmedRenderFrameId: %d}", pR.RenderFrameId, pR.RenderFrameBuffer.StFrameId, pR.RenderFrameBuffer.EdFrameId, pR.CurDynamicsRenderFrameId)
 }
@@ -370,6 +360,7 @@ func (pR *Room) InputsBufferString(allDetails bool) string {
 				break
 			}
 			f := tmp.(*InputFrameDownsync)
+			//s = append(s, fmt.Sprintf("{inputFrameId: %v, inputList: %v, &inputList: %p, confirmedList: %v}", f.InputFrameId, f.InputList, &(f.InputList), f.ConfirmedList))
 			s = append(s, fmt.Sprintf("{inputFrameId: %v, inputList: %v, confirmedList: %v}", f.InputFrameId, f.InputList, f.ConfirmedList))
 		}
 
@@ -385,15 +376,13 @@ func (pR *Room) StartBattle() {
 		return
 	}
 
-	// Always instantiates a new channel and let the old one die out due to not being retained by any root reference.
-	nanosPerFrame := 1000000000 / int64(pR.ServerFps)
 	pR.RenderFrameId = 0
 
 	// Initialize the "collisionSys" as well as "RenderFrameBuffer"
 	pR.CurDynamicsRenderFrameId = 0
 	kickoffFrame := &RoomDownsyncFrame{
 		Id:             pR.RenderFrameId,
-		Players:        toPbPlayers(pR.Players),
+		Players:        toPbPlayers(pR.Players, false),
 		CountdownNanos: pR.BattleDurationNanos,
 	}
 	pR.RenderFrameBuffer.Put(kickoffFrame)
@@ -426,7 +415,7 @@ func (pR *Room) StartBattle() {
 			stCalculation := utils.UnixtimeNano()
 
 			elapsedNanosSinceLastFrameIdTriggered := stCalculation - pR.LastRenderFrameIdTriggeredAt
-			if elapsedNanosSinceLastFrameIdTriggered < pR.RollbackEstimatedDtNanos {
+			if elapsedNanosSinceLastFrameIdTriggered < pR.dilutedRollbackEstimatedDtNanos {
 				Logger.Debug(fmt.Sprintf("Avoiding too fast frame@roomId=%v, renderFrameId=%v: elapsedNanosSinceLastFrameIdTriggered=%v", pR.Id, pR.RenderFrameId, elapsedNanosSinceLastFrameIdTriggered))
 				continue
 			}
@@ -537,8 +526,8 @@ func (pR *Room) StartBattle() {
 					   2. reconnection
 					*/
 					shouldResync1 := (MAGIC_LAST_SENT_INPUT_FRAME_ID_READDED == player.LastSentInputFrameId)
-					// shouldResync2 := (0 < (unconfirmedMask & uint64(1 << uint32(player.JoinIndex-1)))) // This condition is critical, if we don't send resync upon this condition, the "reconnected or slowly-clocking player" might never get its input synced
-					shouldResync2 := (0 < unconfirmedMask) // An easier version of the above, might keep sending "refRenderFrame"s to still connected players when any player is disconnected
+					shouldResync2 := (0 < (unconfirmedMask & uint64(1<<uint32(player.JoinIndex-1)))) // This condition is critical, if we don't send resync upon this condition, the "reconnected or slowly-clocking player" might never get its input synced
+					// shouldResync2 := (0 < unconfirmedMask) // An easier version of the above, might keep sending "refRenderFrame"s to still connected players when any player is disconnected
 					if pR.BackendDynamicsEnabled && (shouldResync1 || shouldResync2) {
 						tmp := pR.RenderFrameBuffer.GetByFrameId(refRenderFrameId)
 						if nil == tmp {
@@ -560,35 +549,38 @@ func (pR *Room) StartBattle() {
 				}
 			}
 
-			toApplyInputFrameId := pR.ConvertToInputFrameId(refRenderFrameId, pR.InputDelayFrames)
+			minToKeepInputFrameId := pR.ConvertToInputFrameId(refRenderFrameId, pR.InputDelayFrames) - pR.SpAtkLookupFrames
 			/*
 			   [WARNING]
-			   The following updates to "toApplyInputFrameId" is necessary because when "false == pR.BackendDynamicsEnabled", the variable "refRenderFrameId" is not well defined.
+			   The following updates to "minToKeepInputFrameId" is necessary because when "false == pR.BackendDynamicsEnabled", the variable "refRenderFrameId" is not well defined.
 			*/
 			minLastSentInputFrameId := int32(math.MaxInt32)
 			for _, player := range pR.Players {
+				if PlayerBattleStateIns.ACTIVE != player.BattleState {
+					continue
+				}
 				if player.LastSentInputFrameId >= minLastSentInputFrameId {
 					continue
 				}
 				minLastSentInputFrameId = player.LastSentInputFrameId
 			}
-			if minLastSentInputFrameId < toApplyInputFrameId {
-				toApplyInputFrameId = minLastSentInputFrameId
+			if minLastSentInputFrameId < minToKeepInputFrameId {
+				minToKeepInputFrameId = minLastSentInputFrameId
 			}
-			for pR.InputsBuffer.N < pR.InputsBuffer.Cnt || (0 < pR.InputsBuffer.Cnt && pR.InputsBuffer.StFrameId < toApplyInputFrameId) {
+			for pR.InputsBuffer.N < pR.InputsBuffer.Cnt || (0 < pR.InputsBuffer.Cnt && pR.InputsBuffer.StFrameId < minToKeepInputFrameId) {
 				f := pR.InputsBuffer.Pop().(*InputFrameDownsync)
 				if pR.inputFrameIdDebuggable(f.InputFrameId) {
 					// Popping of an "inputFrame" would be AFTER its being all being confirmed, because it requires the "inputFrame" to be all acked
-					Logger.Debug("inputFrame lifecycle#4[popped]:", zap.Any("roomId", pR.Id), zap.Any("inputFrameId", f.InputFrameId), zap.Any("toApplyInputFrameId", toApplyInputFrameId), zap.Any("InputsBuffer", pR.InputsBufferString(false)))
+					Logger.Debug("inputFrame lifecycle#4[popped]:", zap.Any("roomId", pR.Id), zap.Any("inputFrameId", f.InputFrameId), zap.Any("minToKeepInputFrameId", minToKeepInputFrameId), zap.Any("InputsBuffer", pR.InputsBufferString(false)))
 				}
 			}
 
 			pR.RenderFrameId++
 			elapsedInCalculation := (utils.UnixtimeNano() - stCalculation)
-			if elapsedInCalculation > nanosPerFrame {
-				Logger.Warn(fmt.Sprintf("SLOW FRAME! Elapsed time statistics: roomId=%v, room.RenderFrameId=%v, elapsedInCalculation=%v ns, dynamicsDuration=%v ns, expected nanosPerFrame=%v", pR.Id, pR.RenderFrameId, elapsedInCalculation, dynamicsDuration, nanosPerFrame))
+			if elapsedInCalculation > pR.dilutedRollbackEstimatedDtNanos {
+				Logger.Warn(fmt.Sprintf("SLOW FRAME! Elapsed time statistics: roomId=%v, room.RenderFrameId=%v, elapsedInCalculation=%v ns, dynamicsDuration=%v ns, dilutedRollbackEstimatedDtNanos=%v", pR.Id, pR.RenderFrameId, elapsedInCalculation, dynamicsDuration, pR.dilutedRollbackEstimatedDtNanos))
 			}
-			time.Sleep(time.Duration(nanosPerFrame - elapsedInCalculation))
+			time.Sleep(time.Duration(pR.dilutedRollbackEstimatedDtNanos - elapsedInCalculation))
 		}
 	}
 
@@ -632,7 +624,6 @@ func (pR *Room) OnBattleCmdReceived(pReq *WsReq) {
 			Logger.Debug(fmt.Sprintf("Omitting obsolete inputFrameUpsync: roomId=%v, playerId=%v, clientInputFrameId=%v, InputsBuffer=%v", pR.Id, playerId, clientInputFrameId, pR.InputsBufferString(false)))
 			continue
 		}
-
 		bufIndex := pR.toDiscreteInputsBufferIndex(clientInputFrameId, pReq.JoinIndex)
 		pR.DiscreteInputsBuffer.Store(bufIndex, inputFrameUpsync)
 
@@ -684,7 +675,7 @@ func (pR *Room) StopBattleForSettlement() {
 	for playerId, _ := range pR.Players {
 		assembledFrame := RoomDownsyncFrame{
 			Id:             pR.RenderFrameId,
-			Players:        toPbPlayers(pR.Players),
+			Players:        toPbPlayers(pR.Players, false),
 			CountdownNanos: -1, // TODO: Replace this magic constant!
 		}
 		pR.sendSafely(&assembledFrame, nil, DOWNSYNC_MSG_ACT_BATTLE_STOPPED, playerId)
@@ -708,22 +699,9 @@ func (pR *Room) onBattlePrepare(cb BattleStartCbType) {
 	pR.State = RoomBattleStateIns.PREPARE
 	Logger.Info("Battle state transitted to RoomBattleStateIns.PREPARE for:", zap.Any("roomId", pR.Id))
 
-	playerMetas := make(map[int32]*PlayerDownsyncMeta, 0)
-	for _, player := range pR.Players {
-		playerMetas[player.Id] = &PlayerDownsyncMeta{
-			Id:             player.Id,
-			Name:           player.Name,
-			DisplayName:    player.DisplayName,
-			Avatar:         player.Avatar,
-			ColliderRadius: player.ColliderRadius, // hardcoded for now
-			JoinIndex:      player.JoinIndex,
-		}
-	}
-
 	battleReadyToStartFrame := &RoomDownsyncFrame{
 		Id:             DOWNSYNC_MSG_ACT_BATTLE_READY_TO_START,
-		Players:        toPbPlayers(pR.Players),
-		PlayerMetas:    playerMetas,
+		Players:        toPbPlayers(pR.Players, true),
 		CountdownNanos: pR.BattleDurationNanos,
 	}
 
@@ -790,8 +768,10 @@ func (pR *Room) Dismiss() {
 func (pR *Room) OnDismissed() {
 
 	// Always instantiates new HeapRAM blocks and let the old blocks die out due to not being retained by any root reference.
+	pR.BulletBattleLocalIdCounter = 0
 	pR.WorldToVirtualGridRatio = float64(1000)
 	pR.VirtualGridToWorldRatio = float64(1.0) / pR.WorldToVirtualGridRatio // this is a one-off computation, should avoid division in iterations
+	pR.SpAtkLookupFrames = 5
 	pR.PlayerDefaultSpeed = int32(float64(2) * pR.WorldToVirtualGridRatio) // in virtual grids per frame
 	pR.Players = make(map[int32]*Player)
 	pR.PlayersArr = make([]*Player, pR.Capacity)
@@ -800,9 +780,10 @@ func (pR *Room) OnDismissed() {
 	pR.PlayerSignalToCloseDict = make(map[int32]SignalToCloseConnCbType)
 	pR.JoinIndexBooleanArr = make([]bool, pR.Capacity)
 	pR.Barriers = make(map[int32]*Barrier)
-	pR.InputsBuffer = NewRingBuffer(1024)
+	pR.RenderCacheSize = 1024
+	pR.RenderFrameBuffer = NewRingBuffer(pR.RenderCacheSize)
 	pR.DiscreteInputsBuffer = sync.Map{}
-	pR.RenderFrameBuffer = NewRingBuffer(1024)
+	pR.InputsBuffer = NewRingBuffer((pR.RenderCacheSize >> 2) + 1)
 
 	pR.LastAllConfirmedInputFrameId = -1
 	pR.LastAllConfirmedInputFrameIdWithChange = -1
@@ -811,17 +792,45 @@ func (pR *Room) OnDismissed() {
 	pR.RenderFrameId = 0
 	pR.CurDynamicsRenderFrameId = 0
 	pR.InputDelayFrames = 8
-	pR.NstDelayFrames = 8
+	pR.NstDelayFrames = 4
 	pR.InputScaleFrames = uint32(2)
 	pR.ServerFps = 60
 	pR.RollbackEstimatedDtMillis = 16.667  // Use fixed-and-low-precision to mitigate the inconsistent floating-point-number issue between Golang and JavaScript
 	pR.RollbackEstimatedDtNanos = 16666666 // A little smaller than the actual per frame time, just for preventing FAST FRAME
+	dilutionFactor := 12
+	pR.dilutedRollbackEstimatedDtNanos = int64(16666666 * (dilutionFactor) / (dilutionFactor - 1)) // [WARNING] Only used in controlling "battleMainLoop" to be keep a frame rate lower than that of the frontends, such that upon resync(i.e. BackendDynamicsEnabled=true), the frontends would have bigger chances to keep up with or even surpass the backend calculation
 	pR.BattleDurationFrames = 30 * pR.ServerFps
 	pR.BattleDurationNanos = int64(pR.BattleDurationFrames) * (pR.RollbackEstimatedDtNanos + 1)
 	pR.InputFrameUpsyncDelayTolerance = 2
 	pR.MaxChasingRenderFramesPerUpdate = 5
 
 	pR.BackendDynamicsEnabled = true // [WARNING] When "false", recovery upon reconnection wouldn't work!
+	punchSkillId := int32(1)
+	pR.MeleeSkillConfig = make(map[int32]*MeleeBullet, 0)
+	pR.MeleeSkillConfig[punchSkillId] = &MeleeBullet{
+		// for offender
+		StartupFrames:         int32(23),
+		ActiveFrames:          int32(3),
+		RecoveryFrames:        int32(61), // I hereby set it to be 1 frame more than the actual animation to avoid critical transition, i.e. when the animation is 1 frame from ending but "rdfPlayer.framesToRecover" is already counted 0 and the player triggers an other same attack, making an effective bullet trigger but no animation is played due to same animName is still playing
+		RecoveryFramesOnBlock: int32(61),
+		RecoveryFramesOnHit:   int32(61),
+		Moveforward: &Vec2D{
+			X: 0,
+			Y: 0,
+		},
+		HitboxOffset: float64(24.0), // should be about the radius of the PlayerCollider
+		HitboxSize: &Vec2D{
+			X: float64(45.0),
+			Y: float64(32.0),
+		},
+
+		// for defender
+		HitStunFrames:      int32(18),
+		BlockStunFrames:    int32(9),
+		Pushback:           float64(11.0),
+		ReleaseTriggerType: int32(1), // 1: rising-edge, 2: falling-edge
+		Damage:             int32(5),
+	}
 
 	pR.ChooseStage()
 	pR.EffectivePlayerCount = 0
@@ -931,7 +940,7 @@ func (pR *Room) onPlayerAdded(playerId int32) {
 			pR.JoinIndexBooleanArr[index] = true
 
 			// Lazily assign the initial position of "Player" for "RoomDownsyncFrame".
-			playerPosList := *(pR.RawBattleStrToVec2DListMap["PlayerStartingPos"])
+			playerPosList := *(pR.StrToVec2DListMap["PlayerStartingPos"])
 			if index > len(playerPosList.Eles) {
 				panic(fmt.Sprintf("onPlayerAdded error, index >= len(playerPosList), roomId=%v, playerId=%v, roomState=%v, roomEffectivePlayerCount=%v", pR.Id, playerId, pR.State, pR.EffectivePlayerCount))
 			}
@@ -941,6 +950,14 @@ func (pR *Room) onPlayerAdded(playerId int32) {
 				panic(fmt.Sprintf("onPlayerAdded error, nil == playerPos, roomId=%v, playerId=%v, roomState=%v, roomEffectivePlayerCount=%v", pR.Id, playerId, pR.State, pR.EffectivePlayerCount))
 			}
 			pR.Players[playerId].VirtualGridX, pR.Players[playerId].VirtualGridY = WorldToVirtualGridPos(playerPos.X, playerPos.Y, pR.WorldToVirtualGridRatio)
+			// Hardcoded initial character orientation/facing
+			if 0 == (pR.Players[playerId].JoinIndex % 2) {
+				pR.Players[playerId].DirX = -2
+				pR.Players[playerId].DirY = 0
+			} else {
+				pR.Players[playerId].DirX = +2
+				pR.Players[playerId].DirY = 0
+			}
 
 			break
 		}
@@ -968,18 +985,6 @@ func (pR *Room) OnPlayerBattleColliderAcked(playerId int32) bool {
 		return false
 	}
 
-	playerMetas := make(map[int32]*PlayerDownsyncMeta, 0)
-	for _, eachPlayer := range pR.Players {
-		playerMetas[eachPlayer.Id] = &PlayerDownsyncMeta{
-			Id:             eachPlayer.Id,
-			Name:           eachPlayer.Name,
-			DisplayName:    eachPlayer.DisplayName,
-			Avatar:         eachPlayer.Avatar,
-			JoinIndex:      eachPlayer.JoinIndex,
-			ColliderRadius: eachPlayer.ColliderRadius,
-		}
-	}
-
 	// Broadcast added or readded player info to all players in the same room
 	for _, eachPlayer := range pR.Players {
 		/*
@@ -993,16 +998,14 @@ func (pR *Room) OnPlayerBattleColliderAcked(playerId int32) bool {
 		switch targetPlayer.BattleState {
 		case PlayerBattleStateIns.ADDED_PENDING_BATTLE_COLLIDER_ACK:
 			playerAckedFrame := &RoomDownsyncFrame{
-				Id:          pR.RenderFrameId,
-				Players:     toPbPlayers(pR.Players),
-				PlayerMetas: playerMetas,
+				Id:      pR.RenderFrameId,
+				Players: toPbPlayers(pR.Players, true),
 			}
 			pR.sendSafely(playerAckedFrame, nil, DOWNSYNC_MSG_ACT_PLAYER_ADDED_AND_ACKED, eachPlayer.Id)
 		case PlayerBattleStateIns.READDED_PENDING_BATTLE_COLLIDER_ACK:
 			playerAckedFrame := &RoomDownsyncFrame{
-				Id:          pR.RenderFrameId,
-				Players:     toPbPlayers(pR.Players),
-				PlayerMetas: playerMetas,
+				Id:      pR.RenderFrameId,
+				Players: toPbPlayers(pR.Players, true),
 			}
 			pR.sendSafely(playerAckedFrame, nil, DOWNSYNC_MSG_ACT_PLAYER_READDED_AND_ACKED, eachPlayer.Id)
 		default:
@@ -1073,12 +1076,15 @@ func (pR *Room) prefabInputFrameDownsync(inputFrameId int32) *InputFrameDownsync
 			ConfirmedList: uint64(0),
 		}
 	} else {
-		tmp := pR.InputsBuffer.GetByFrameId(inputFrameId - 1)
+		tmp := pR.InputsBuffer.GetByFrameId(inputFrameId - 1) // There's no need for the backend to find the "lastAllConfirmed inputs" for prefabbing, either "BackendDynamicsEnabled" is true or false
 		if nil == tmp {
 			panic(fmt.Sprintf("Error prefabbing inputFrameDownsync: roomId=%v, InputsBuffer=%v", pR.Id, pR.InputsBufferString(false)))
 		}
 		prevInputFrameDownsync := tmp.(*InputFrameDownsync)
-		currInputList := prevInputFrameDownsync.InputList // Would be a clone of the values
+		currInputList := make([]uint64, pR.Capacity) // Would be a clone of the values
+		for i, _ := range currInputList {
+			currInputList[i] = (prevInputFrameDownsync.InputList[i] & uint64(15)) // Don't predict attack input!
+		}
 		currInputFrameDownsync = &InputFrameDownsync{
 			InputFrameId:  inputFrameId,
 			InputList:     currInputList,
@@ -1092,18 +1098,12 @@ func (pR *Room) prefabInputFrameDownsync(inputFrameId int32) *InputFrameDownsync
 
 func (pR *Room) markConfirmationIfApplicable() {
 	inputFrameId1 := pR.LastAllConfirmedInputFrameId + 1
-	gap := int32(4) // This value is hardcoded and doesn't need be much bigger, because the backend side is supposed to never lag when "false == BackendDynamicsEnabled".
-	inputFrameId2 := inputFrameId1 + gap
-	if inputFrameId2 > pR.InputsBuffer.EdFrameId {
-		inputFrameId2 = pR.InputsBuffer.EdFrameId
-	}
-
 	totPlayerCnt := uint32(pR.Capacity)
 	allConfirmedMask := uint64((1 << totPlayerCnt) - 1)
-	for inputFrameId := inputFrameId1; inputFrameId < inputFrameId2; inputFrameId++ {
+	for inputFrameId := inputFrameId1; inputFrameId < pR.InputsBuffer.EdFrameId; inputFrameId++ {
 		tmp := pR.InputsBuffer.GetByFrameId(inputFrameId)
 		if nil == tmp {
-			panic(fmt.Sprintf("inputFrameId=%v doesn't exist for roomId=%v, this is abnormal because the server should prefab inputFrameDownsync in a most advanced pace, check the prefab logic! InputsBuffer=%v", inputFrameId, pR.Id, pR.InputsBufferString(false)))
+			panic(fmt.Sprintf("inputFrameId=%v doesn't exist for roomId=%v, this is abnormal because the server should prefab inputFrameDownsync in a most advanced pace, check the prefab logic (Or maybe you're having a 'Room.RenderCacheSize' too small)! InputsBuffer=%v", inputFrameId, pR.Id, pR.InputsBufferString(false)))
 		}
 		inputFrameDownsync := tmp.(*InputFrameDownsync)
 		for _, player := range pR.Players {
@@ -1114,7 +1114,7 @@ func (pR *Room) markConfirmationIfApplicable() {
 			}
 			inputFrameUpsync := tmp.(*InputFrameUpsync)
 			indiceInJoinIndexBooleanArr := uint32(player.JoinIndex - 1)
-			inputFrameDownsync.InputList[indiceInJoinIndexBooleanArr] = pR.EncodeUpsyncCmd(inputFrameUpsync)
+			inputFrameDownsync.InputList[indiceInJoinIndexBooleanArr] = inputFrameUpsync.Encoded
 			inputFrameDownsync.ConfirmedList |= (1 << indiceInJoinIndexBooleanArr)
 		}
 
@@ -1193,13 +1193,6 @@ func (pR *Room) applyInputFrameDownsyncDynamics(fromRenderFrameId int32, toRende
 		}
 
 		nextRenderFrame := pR.applyInputFrameDownsyncDynamicsOnSingleRenderFrame(delayedInputFrame, currRenderFrame, pR.CollisionSysMap)
-		// Update in the latest player pointers
-		for playerId, playerDownsync := range nextRenderFrame.Players {
-			pR.Players[playerId].VirtualGridX = playerDownsync.VirtualGridX
-			pR.Players[playerId].VirtualGridY = playerDownsync.VirtualGridY
-			pR.Players[playerId].Dir.Dx = playerDownsync.Dir.Dx
-			pR.Players[playerId].Dir.Dy = playerDownsync.Dir.Dy
-		}
 		pR.RenderFrameBuffer.Put(nextRenderFrame)
 		pR.CurDynamicsRenderFrameId++
 	}
@@ -1207,22 +1200,28 @@ func (pR *Room) applyInputFrameDownsyncDynamics(fromRenderFrameId int32, toRende
 
 // TODO: Write unit-test for this function to compare with its frontend counter part
 func (pR *Room) applyInputFrameDownsyncDynamicsOnSingleRenderFrame(delayedInputFrame *InputFrameDownsync, currRenderFrame *RoomDownsyncFrame, collisionSysMap map[int32]*resolv.Object) *RoomDownsyncFrame {
+	// TODO: Derive "nextRenderFramePlayers[*].CharacterState" as the frontend counter-part!
 	nextRenderFramePlayers := make(map[int32]*PlayerDownsync, pR.Capacity)
 	// Make a copy first
 	for playerId, currPlayerDownsync := range currRenderFrame.Players {
 		nextRenderFramePlayers[playerId] = &PlayerDownsync{
-			Id:           playerId,
-			VirtualGridX: currPlayerDownsync.VirtualGridX,
-			VirtualGridY: currPlayerDownsync.VirtualGridY,
-			Dir: &Direction{
-				Dx: currPlayerDownsync.Dir.Dx,
-				Dy: currPlayerDownsync.Dir.Dy,
-			},
-			Speed:       currPlayerDownsync.Speed,
-			BattleState: currPlayerDownsync.BattleState,
-			Score:       currPlayerDownsync.Score,
-			Removed:     currPlayerDownsync.Removed,
-			JoinIndex:   currPlayerDownsync.JoinIndex,
+			Id:              playerId,
+			VirtualGridX:    currPlayerDownsync.VirtualGridX,
+			VirtualGridY:    currPlayerDownsync.VirtualGridY,
+			DirX:            currPlayerDownsync.DirX,
+			DirY:            currPlayerDownsync.DirY,
+			CharacterState:  currPlayerDownsync.CharacterState,
+			Speed:           currPlayerDownsync.Speed,
+			BattleState:     currPlayerDownsync.BattleState,
+			Score:           currPlayerDownsync.Score,
+			Removed:         currPlayerDownsync.Removed,
+			JoinIndex:       currPlayerDownsync.JoinIndex,
+			FramesToRecover: currPlayerDownsync.FramesToRecover - 1,
+			Hp:              currPlayerDownsync.Hp,
+			MaxHp:           currPlayerDownsync.MaxHp,
+		}
+		if nextRenderFramePlayers[playerId].FramesToRecover < 0 {
+			nextRenderFramePlayers[playerId].FramesToRecover = 0
 		}
 	}
 
@@ -1230,32 +1229,167 @@ func (pR *Room) applyInputFrameDownsyncDynamicsOnSingleRenderFrame(delayedInputF
 		Id:             currRenderFrame.Id + 1,
 		Players:        nextRenderFramePlayers,
 		CountdownNanos: (pR.BattleDurationNanos - int64(currRenderFrame.Id)*pR.RollbackEstimatedDtNanos),
+		MeleeBullets:   make([]*MeleeBullet, 0), // Is there any better way to reduce malloc/free impact, e.g. smart prediction for fixed memory allocation?
+	}
+
+	bulletPushbacks := make([]Vec2D, pR.Capacity) // Guaranteed determinism regardless of traversal order
+	effPushbacks := make([]Vec2D, pR.Capacity)    // Guaranteed determinism regardless of traversal order
+
+	// Reset playerCollider position from the "virtual grid position"
+	for playerId, player := range pR.Players {
+		joinIndex := player.JoinIndex
+		bulletPushbacks[joinIndex-1].X, bulletPushbacks[joinIndex-1].Y = float64(0), float64(0)
+		effPushbacks[joinIndex-1].X, effPushbacks[joinIndex-1].Y = float64(0), float64(0)
+		currPlayerDownsync := currRenderFrame.Players[playerId]
+		newVx, newVy := currPlayerDownsync.VirtualGridX, currPlayerDownsync.VirtualGridY
+		collisionPlayerIndex := COLLISION_PLAYER_INDEX_PREFIX + joinIndex
+		playerCollider := collisionSysMap[collisionPlayerIndex]
+		playerCollider.X, playerCollider.Y = VirtualGridToPolygonColliderAnchorPos(newVx, newVy, player.ColliderRadius, player.ColliderRadius, pR.collisionSpaceOffsetX, pR.collisionSpaceOffsetY, pR.VirtualGridToWorldRatio)
+	}
+
+	// Check bullet-anything collisions first, because the pushbacks caused by bullets might later be reverted by player-barrier collision
+	bulletColliders := make(map[int32]*resolv.Object, 0) // Will all be removed at the end of `applyInputFrameDownsyncDynamicsOnSingleRenderFrame` due to the need for being rollback-compatible
+	removedBulletsAtCurrFrame := make(map[int32]int32, 0)
+	for _, meleeBullet := range currRenderFrame.MeleeBullets {
+		if (meleeBullet.OriginatedRenderFrameId+meleeBullet.StartupFrames <= currRenderFrame.Id) && (meleeBullet.OriginatedRenderFrameId+meleeBullet.StartupFrames+meleeBullet.ActiveFrames > currRenderFrame.Id) {
+			collisionBulletIndex := COLLISION_BULLET_INDEX_PREFIX + meleeBullet.BattleLocalId
+			collisionOffenderIndex := COLLISION_PLAYER_INDEX_PREFIX + meleeBullet.OffenderJoinIndex
+			offenderCollider := collisionSysMap[collisionOffenderIndex]
+			offender := currRenderFrame.Players[meleeBullet.OffenderPlayerId]
+
+			xfac := float64(1.0) // By now, straight Punch offset doesn't respect "y-axis"
+			if 0 > offender.DirX {
+				xfac = float64(-1.0)
+			}
+			offenderWx, offenderWy := VirtualGridToWorldPos(offender.VirtualGridX, offender.VirtualGridY, pR.VirtualGridToWorldRatio)
+			bulletWx, bulletWy := offenderWx+xfac*meleeBullet.HitboxOffset, offenderWy
+
+			newBulletCollider := GenerateRectCollider(bulletWx, bulletWy, meleeBullet.HitboxSize.X, meleeBullet.HitboxSize.Y, pR.collisionSpaceOffsetX, pR.collisionSpaceOffsetY, "MeleeBullet")
+			newBulletCollider.Data = meleeBullet
+			pR.Space.Add(newBulletCollider)
+			collisionSysMap[collisionBulletIndex] = newBulletCollider
+			bulletColliders[collisionBulletIndex] = newBulletCollider
+
+			Logger.Debug(fmt.Sprintf("roomId=%v, a meleeBullet is added to collisionSys at currRenderFrame.id=%v as start-up frames ended and active frame is not yet ended: %v, from offenderCollider=%v, xfac=%v", pR.Id, currRenderFrame.Id, ConvexPolygonStr(newBulletCollider.Shape.(*resolv.ConvexPolygon)), ConvexPolygonStr(offenderCollider.Shape.(*resolv.ConvexPolygon)), xfac))
+		}
+	}
+
+	for _, bulletCollider := range bulletColliders {
+		shouldRemove := false
+		meleeBullet := bulletCollider.Data.(*MeleeBullet)
+		collisionBulletIndex := COLLISION_BULLET_INDEX_PREFIX + meleeBullet.BattleLocalId
+		bulletShape := bulletCollider.Shape.(*resolv.ConvexPolygon)
+		if collision := bulletCollider.Check(0, 0); collision != nil {
+			offender := currRenderFrame.Players[meleeBullet.OffenderPlayerId]
+			for _, obj := range collision.Objects {
+				defenderShape := obj.Shape.(*resolv.ConvexPolygon)
+				switch t := obj.Data.(type) {
+				case *Player:
+					if meleeBullet.OffenderPlayerId != t.Id {
+						if overlapped, _, _, _ := CalcPushbacks(0, 0, bulletShape, defenderShape); overlapped {
+							xfac := float64(1.0) // By now, straight Punch offset doesn't respect "y-axis"
+							if 0 > offender.DirX {
+								xfac = float64(-1.0)
+							}
+							bulletPushbacks[t.JoinIndex-1].X += xfac * meleeBullet.Pushback
+							nextRenderFramePlayers[t.Id].CharacterState = ATK_CHARACTER_STATE_ATKED1
+							oldFramesToRecover := nextRenderFramePlayers[t.Id].FramesToRecover
+							if meleeBullet.HitStunFrames > oldFramesToRecover {
+								nextRenderFramePlayers[t.Id].FramesToRecover = meleeBullet.HitStunFrames
+							}
+							Logger.Debug(fmt.Sprintf("roomId=%v, a meleeBullet collides w/ player at currRenderFrame.id=%v: b=%v, p=%v", pR.Id, currRenderFrame.Id, ConvexPolygonStr(bulletShape), ConvexPolygonStr(defenderShape)))
+						}
+					}
+				default:
+					Logger.Debug(fmt.Sprintf("Bullet %v collided with non-player %v: roomId=%v, currRenderFrame.Id=%v, delayedInputFrame.Id=%v, objDataType=%t, objData=%v", ConvexPolygonStr(bulletShape), ConvexPolygonStr(defenderShape), pR.Id, currRenderFrame.Id, delayedInputFrame.InputFrameId, obj.Data, obj.Data))
+				}
+			}
+			shouldRemove = true
+		}
+		if shouldRemove {
+			removedBulletsAtCurrFrame[collisionBulletIndex] = 1
+		}
+	}
+
+	for _, meleeBullet := range currRenderFrame.MeleeBullets {
+		collisionBulletIndex := COLLISION_BULLET_INDEX_PREFIX + meleeBullet.BattleLocalId
+		if bulletCollider, existent := collisionSysMap[collisionBulletIndex]; existent {
+			bulletCollider.Space.Remove(bulletCollider)
+			delete(collisionSysMap, collisionBulletIndex)
+		}
+		if _, existent := removedBulletsAtCurrFrame[collisionBulletIndex]; existent {
+			continue
+		}
+		toRet.MeleeBullets = append(toRet.MeleeBullets, meleeBullet)
 	}
 
 	if nil != delayedInputFrame {
+		var delayedInputFrameForPrevRenderFrame *InputFrameDownsync = nil
+		tmp := pR.InputsBuffer.GetByFrameId(pR.ConvertToInputFrameId(currRenderFrame.Id-1, pR.InputDelayFrames))
+		if nil != tmp {
+			delayedInputFrameForPrevRenderFrame = tmp.(*InputFrameDownsync)
+		}
 		inputList := delayedInputFrame.InputList
-		effPushbacks := make([]Vec2D, pR.Capacity) // Guaranteed determinism regardless of traversal order
+		// Process player inputs
 		for playerId, player := range pR.Players {
 			joinIndex := player.JoinIndex
-			effPushbacks[joinIndex-1].X, effPushbacks[joinIndex-1].Y = float64(0), float64(0)
-			currPlayerDownsync := currRenderFrame.Players[playerId]
-			encodedInput := inputList[joinIndex-1]
-			decodedInput := DIRECTION_DECODER[encodedInput]
-			proposedVirtualGridDx, proposedVirtualGridDy := (decodedInput[0] + decodedInput[0]*currPlayerDownsync.Speed), (decodedInput[1] + decodedInput[1]*currPlayerDownsync.Speed)
-			newVx, newVy := (currPlayerDownsync.VirtualGridX + proposedVirtualGridDx), (currPlayerDownsync.VirtualGridY + proposedVirtualGridDy)
-			// Reset playerCollider position from the "virtual grid position"
 			collisionPlayerIndex := COLLISION_PLAYER_INDEX_PREFIX + joinIndex
 			playerCollider := collisionSysMap[collisionPlayerIndex]
-			playerCollider.X, playerCollider.Y = VirtualGridToPolygonColliderAnchorPos(newVx, newVy, player.ColliderRadius, player.ColliderRadius, pR.collisionSpaceOffsetX, pR.collisionSpaceOffsetY, pR.VirtualGridToWorldRatio)
+			thatPlayerInNextFrame := nextRenderFramePlayers[playerId]
+			if 0 < thatPlayerInNextFrame.FramesToRecover {
+				// No need to process inputs for this player, but there might be bullet pushbacks on this player
+                // Also note that in this case we keep "CharacterState" of this player from last render frame
+				playerCollider.X += bulletPushbacks[joinIndex-1].X
+				playerCollider.Y += bulletPushbacks[joinIndex-1].Y
+				// Update in the collision system
+				playerCollider.Update()
+				if 0 != bulletPushbacks[joinIndex-1].X || 0 != bulletPushbacks[joinIndex-1].Y {
+					Logger.Info(fmt.Sprintf("roomId=%v, playerId=%v is pushed back by (%.2f, %.2f) by bullet impacts, now its framesToRecover is %d at currRenderFrame.id=%v", pR.Id, playerId, bulletPushbacks[joinIndex-1].X, bulletPushbacks[joinIndex-1].Y, thatPlayerInNextFrame.FramesToRecover, currRenderFrame.Id))
+				}
+				continue
+			}
+			currPlayerDownsync := currRenderFrame.Players[playerId]
+			decodedInput := pR.decodeInput(inputList[joinIndex-1])
+			prevBtnALevel := int32(0)
+			if nil != delayedInputFrameForPrevRenderFrame {
+				prevDecodedInput := pR.decodeInput(delayedInputFrameForPrevRenderFrame.InputList[joinIndex-1])
+				prevBtnALevel = prevDecodedInput.BtnALevel
+			}
+
+			if decodedInput.BtnALevel > prevBtnALevel {
+				punchSkillId := int32(1)
+				punchConfig := pR.MeleeSkillConfig[punchSkillId]
+				var newMeleeBullet MeleeBullet = *punchConfig
+				newMeleeBullet.BattleLocalId = pR.BulletBattleLocalIdCounter
+				pR.BulletBattleLocalIdCounter += 1
+				newMeleeBullet.OffenderJoinIndex = joinIndex
+				newMeleeBullet.OffenderPlayerId = playerId
+				newMeleeBullet.OriginatedRenderFrameId = currRenderFrame.Id
+				toRet.MeleeBullets = append(toRet.MeleeBullets, &newMeleeBullet)
+				thatPlayerInNextFrame.FramesToRecover = newMeleeBullet.RecoveryFrames
+				thatPlayerInNextFrame.CharacterState = ATK_CHARACTER_STATE_ATK1
+				Logger.Info(fmt.Sprintf("roomId=%v, playerId=%v triggered a rising-edge of btnA at currRenderFrame.id=%v, delayedInputFrame.id=%v", pR.Id, playerId, currRenderFrame.Id, delayedInputFrame.InputFrameId))
+
+			} else if decodedInput.BtnALevel < prevBtnALevel {
+				Logger.Debug(fmt.Sprintf("roomId=%v, playerId=%v triggered a falling-edge of btnA at currRenderFrame.id=%v, delayedInputFrame.id=%v", pR.Id, playerId, currRenderFrame.Id, delayedInputFrame.InputFrameId))
+			} else {
+				// No bullet trigger, process movement inputs
+                // Note that by now "0 == thatPlayerInNextFrame.FramesToRecover", we should change "CharacterState" to "WALKING" or "IDLE" depending on player inputs
+				if 0 != decodedInput.Dx || 0 != decodedInput.Dy {
+					thatPlayerInNextFrame.DirX = decodedInput.Dx
+					thatPlayerInNextFrame.DirY = decodedInput.Dy
+					thatPlayerInNextFrame.CharacterState = ATK_CHARACTER_STATE_WALKING
+				} else {
+					thatPlayerInNextFrame.CharacterState = ATK_CHARACTER_STATE_IDLE1
+				}
+			}
+
+			movementX, movementY := VirtualGridToWorldPos(decodedInput.Dx+decodedInput.Dx*currPlayerDownsync.Speed, decodedInput.Dy+decodedInput.Dy*currPlayerDownsync.Speed, pR.VirtualGridToWorldRatio)
+			playerCollider.X += movementX
+			playerCollider.Y += movementY
 
 			// Update in the collision system
 			playerCollider.Update()
-
-			if 0 < encodedInput {
-				Logger.Debug(fmt.Sprintf("Checking collision for playerId=%v: virtual (%d, %d) -> (%d, %d), now playerShape=%v", playerId, currPlayerDownsync.VirtualGridX, currPlayerDownsync.VirtualGridY, newVx, newVy, ConvexPolygonStr(playerCollider.Shape.(*resolv.ConvexPolygon))))
-				nextRenderFramePlayers[playerId].Dir.Dx = decodedInput[0]
-				nextRenderFramePlayers[playerId].Dir.Dy = decodedInput[1]
-			}
 		}
 
 		// handle pushbacks upon collision after all movements treated as simultaneous
@@ -1285,16 +1419,26 @@ func (pR *Room) applyInputFrameDownsyncDynamicsOnSingleRenderFrame(delayedInputF
 
 			// Update "virtual grid position"
 			newVx, newVy := PolygonColliderAnchorToVirtualGridPos(playerCollider.X-effPushbacks[joinIndex-1].X, playerCollider.Y-effPushbacks[joinIndex-1].Y, player.ColliderRadius, player.ColliderRadius, pR.collisionSpaceOffsetX, pR.collisionSpaceOffsetY, pR.WorldToVirtualGridRatio)
-			nextRenderFramePlayers[playerId].VirtualGridX = newVx
-			nextRenderFramePlayers[playerId].VirtualGridY = newVy
+			thatPlayerInNextFrame := nextRenderFramePlayers[playerId]
+			thatPlayerInNextFrame.VirtualGridX, thatPlayerInNextFrame.VirtualGridY = newVx, newVy
 		}
 
-		Logger.Debug(fmt.Sprintf("After applyInputFrameDownsyncDynamicsOnSingleRenderFrame: currRenderFrame.Id=%v, inputList=%v, currRenderFrame.Players=%v, nextRenderFramePlayers=%v, toRet.Players=%v", currRenderFrame.Id, inputList, currRenderFrame.Players, nextRenderFramePlayers, toRet.Players))
+		Logger.Debug(fmt.Sprintf("After applyInputFrameDownsyncDynamicsOnSingleRenderFrame: currRenderFrame.Id=%v, inputList=%v, currRenderFrame.Players=%v, nextRenderFramePlayers=%v", currRenderFrame.Id, inputList, currRenderFrame.Players, nextRenderFramePlayers))
 	}
 
 	return toRet
 }
 
+func (pR *Room) decodeInput(encodedInput uint64) *InputFrameDecoded {
+	encodedDirection := (encodedInput & uint64(15))
+	btnALevel := int32((encodedInput >> 4) & 1)
+	return &InputFrameDecoded{
+		Dx:        DIRECTION_DECODER[encodedDirection][0],
+		Dy:        DIRECTION_DECODER[encodedDirection][1],
+		BtnALevel: btnALevel,
+	}
+}
+
 func (pR *Room) inputFrameIdDebuggable(inputFrameId int32) bool {
 	return 0 == (inputFrameId % 10)
 }
@@ -1302,12 +1446,13 @@ func (pR *Room) inputFrameIdDebuggable(inputFrameId int32) bool {
 func (pR *Room) refreshColliders(spaceW, spaceH int32) {
 	// Kindly note that by now, we've already got all the shapes in the tmx file into "pR.(Players | Barriers)" from "ParseTmxLayersAndGroups"
 
-	minStep := (int(float64(pR.PlayerDefaultSpeed)*pR.VirtualGridToWorldRatio) << 2) // the approx minimum distance a player can move per frame in world coordinate
-	space := resolv.NewSpace(int(spaceW), int(spaceH), minStep, minStep)             // allocate a new collision space everytime after a battle is settled
+	minStep := (int(float64(pR.PlayerDefaultSpeed)*pR.VirtualGridToWorldRatio) << 1) // the approx minimum distance a player can move per frame in world coordinate
+	pR.Space = resolv.NewSpace(int(spaceW), int(spaceH), minStep, minStep)           // allocate a new collision space everytime after a battle is settled
 	for _, player := range pR.Players {
 		wx, wy := VirtualGridToWorldPos(player.VirtualGridX, player.VirtualGridY, pR.VirtualGridToWorldRatio)
 		playerCollider := GenerateRectCollider(wx, wy, player.ColliderRadius*2, player.ColliderRadius*2, pR.collisionSpaceOffsetX, pR.collisionSpaceOffsetY, "Player")
-		space.Add(playerCollider)
+		playerCollider.Data = player
+		pR.Space.Add(playerCollider)
 		// Keep track of the collider in "pR.CollisionSysMap"
 		joinIndex := player.JoinIndex
 		pR.PlayersArr[joinIndex-1] = player
@@ -1318,7 +1463,7 @@ func (pR *Room) refreshColliders(spaceW, spaceH int32) {
 	for _, barrier := range pR.Barriers {
 		boundaryUnaligned := barrier.Boundary
 		barrierCollider := GenerateConvexPolygonCollider(boundaryUnaligned, pR.collisionSpaceOffsetX, pR.collisionSpaceOffsetY, "Barrier")
-		space.Add(barrierCollider)
+		pR.Space.Add(barrierCollider)
 	}
 }
 

battle_srv/ws/serve.go

@@ -247,8 +247,8 @@ func Serve(c *gin.Context) {
 		bciFrame := &pb.BattleColliderInfo{
 			BoundRoomId:           pRoom.Id,
 			StageName:             pRoom.StageName,
-			StrToVec2DListMap:     pRoom.RawBattleStrToVec2DListMap,
-			StrToPolygon2DListMap: pRoom.RawBattleStrToPolygon2DListMap,
+			StrToVec2DListMap:     pRoom.StrToVec2DListMap,
+			StrToPolygon2DListMap: pRoom.StrToPolygon2DListMap,
 			StageDiscreteW:        pRoom.StageDiscreteW,
 			StageDiscreteH:        pRoom.StageDiscreteH,
 			StageTileW:            pRoom.StageTileW,
@@ -269,6 +269,10 @@ func Serve(c *gin.Context) {
 
 			WorldToVirtualGridRatio: pRoom.WorldToVirtualGridRatio,
 			VirtualGridToWorldRatio: pRoom.VirtualGridToWorldRatio,
+
+			SpAtkLookupFrames: pRoom.SpAtkLookupFrames,
+			RenderCacheSize:   pRoom.RenderCacheSize,
+			MeleeSkillConfig:  pRoom.MeleeSkillConfig,
 		}
 
 		resp := &pb.WsResp{

charts/README.md

@@ -1,3 +1,8 @@
+# Double playback speed of a video
+```
+ffmpeg -i input.mp4 -filter:v "setpts=0.5*PTS" output.mp4
+```
+
 # GIF creation cmd reference
 ```
 ffmpeg -ss 12 -t 13 -i input.mp4 -vf "fps=10,scale=480:-1" -loop 0 output.gif

collider_visualizer/go.mod

@@ -4,6 +4,7 @@ go 1.19
 
 require (
 	dnmshared v0.0.0
+	battle_srv v0.0.0
 	github.com/golang/freetype v0.0.0-20170609003504-e2365dfdc4a0
 	github.com/hajimehoshi/ebiten/v2 v2.4.7
 	github.com/solarlune/resolv v0.5.1
@@ -26,3 +27,4 @@ require (
 )
 
 replace dnmshared => ../dnmshared
+replace battle_srv => ../battle_srv

collider_visualizer/worldColliderDisplay.go

@@ -1,6 +1,7 @@
 package main
 
 import (
+	. "battle_srv/protos"
 	. "dnmshared"
 	. "dnmshared/sharedprotos"
 	"fmt"
@@ -36,7 +37,7 @@ func NewWorldColliderDisplay(game *Game, stageDiscreteW, stageDiscreteH, stageTi
 	virtualGridToWorldRatio := 0.1
 	playerDefaultSpeed := 20
 	minStep := (int(float64(playerDefaultSpeed)*virtualGridToWorldRatio) << 2)
-	playerColliderRadius := float64(16)
+	playerColliderRadius := float64(24)
 	playerColliders := make([]*resolv.Object, len(playerPosList.Eles))
 	space := resolv.NewSpace(int(spaceW), int(spaceH), minStep, minStep)
 	for i, playerPos := range playerPosList.Eles {
@@ -84,6 +85,75 @@ func NewWorldColliderDisplay(game *Game, stageDiscreteW, stageDiscreteH, stageTi
 			Logger.Info(fmt.Sprintf("effPushback={%v, %v}", effPushback.X, effPushback.Y))
 		}
 	}
+	meleeBullet := &MeleeBullet{
+		// for offender
+		StartupFrames:         int32(18),
+		ActiveFrames:          int32(1),
+		RecoveryFrames:        int32(61),
+		RecoveryFramesOnBlock: int32(61),
+		RecoveryFramesOnHit:   int32(61),
+		Moveforward: &Vec2D{
+			X: 0,
+			Y: 0,
+		},
+		HitboxOffset: float64(24.0),
+		HitboxSize: &Vec2D{
+			X: float64(45.0),
+			Y: float64(32.0),
+		},
+
+		// for defender
+		HitStunFrames:      int32(18),
+		BlockStunFrames:    int32(9),
+		Pushback:           float64(22.0),
+		ReleaseTriggerType: int32(1), // 1: rising-edge, 2: falling-edge
+		Damage:             int32(5),
+	}
+	bulletLeftToRight := true
+	if bulletLeftToRight {
+		xfac := float64(1.0)
+		offenderWx, offenderWy := playerPosList.Eles[0].X, playerPosList.Eles[0].Y
+		bulletWx, bulletWy := offenderWx+xfac*meleeBullet.HitboxOffset, offenderWy
+
+		newBulletCollider := GenerateRectCollider(bulletWx, bulletWy, meleeBullet.HitboxSize.X, meleeBullet.HitboxSize.Y, spaceOffsetX, spaceOffsetY, "MeleeBullet")
+		space.Add(newBulletCollider)
+		bulletShape := newBulletCollider.Shape.(*resolv.ConvexPolygon)
+		Logger.Warn(fmt.Sprintf("bullet ->: Added bullet collider to space: a=%v", ConvexPolygonStr(bulletShape)))
+
+		if collision := newBulletCollider.Check(0, 0); collision != nil {
+			for _, obj := range collision.Objects {
+				objShape := obj.Shape.(*resolv.ConvexPolygon)
+				if overlapped, pushbackX, pushbackY, overlapResult := CalcPushbacks(0, 0, bulletShape, objShape); overlapped {
+					Logger.Warn(fmt.Sprintf("bullet ->: Overlapped: a=%v, b=%v, pushbackX=%v, pushbackY=%v", ConvexPolygonStr(bulletShape), ConvexPolygonStr(objShape), pushbackX, pushbackY))
+				} else {
+					Logger.Warn(fmt.Sprintf("bullet ->: Collided BUT not overlapped: a=%v, b=%v, overlapResult=%v", ConvexPolygonStr(bulletShape), ConvexPolygonStr(objShape), overlapResult))
+				}
+			}
+		}
+	}
+
+	bulletRightToLeft := true
+	if bulletRightToLeft {
+		xfac := float64(-1.0)
+		offenderWx, offenderWy := playerPosList.Eles[1].X, playerPosList.Eles[1].Y
+		bulletWx, bulletWy := offenderWx+xfac*meleeBullet.HitboxOffset, offenderWy
+
+		newBulletCollider := GenerateRectCollider(bulletWx, bulletWy, meleeBullet.HitboxSize.X, meleeBullet.HitboxSize.Y, spaceOffsetX, spaceOffsetY, "MeleeBullet")
+		space.Add(newBulletCollider)
+		bulletShape := newBulletCollider.Shape.(*resolv.ConvexPolygon)
+		Logger.Warn(fmt.Sprintf("bullet <-: Added bullet collider to space: a=%v", ConvexPolygonStr(bulletShape)))
+
+		if collision := newBulletCollider.Check(0, 0); collision != nil {
+			for _, obj := range collision.Objects {
+				objShape := obj.Shape.(*resolv.ConvexPolygon)
+				if overlapped, pushbackX, pushbackY, overlapResult := CalcPushbacks(0, 0, bulletShape, objShape); overlapped {
+					Logger.Warn(fmt.Sprintf("bullet <-: Overlapped: a=%v, b=%v, pushbackX=%v, pushbackY=%v", ConvexPolygonStr(bulletShape), ConvexPolygonStr(objShape), pushbackX, pushbackY))
+				} else {
+					Logger.Warn(fmt.Sprintf("bullet <-: Collided BUT not overlapped: a=%v, b=%v, overlapResult=%v", ConvexPolygonStr(bulletShape), ConvexPolygonStr(objShape), overlapResult))
+				}
+			}
+		}
+	}
 
 	return world
 }
@@ -98,6 +168,9 @@ func (world *WorldColliderDisplay) Draw(screen *ebiten.Image) {
 		if o.HasTags("Player") {
 			drawColor := color.RGBA{0, 255, 0, 255}
 			DrawPolygon(screen, o.Shape.(*resolv.ConvexPolygon), drawColor)
+		} else if o.HasTags("MeleeBullet") {
+			drawColor := color.RGBA{0, 0, 255, 255}
+			DrawPolygon(screen, o.Shape.(*resolv.ConvexPolygon), drawColor)
 		} else {
 			drawColor := color.RGBA{60, 60, 60, 255}
 			DrawPolygon(screen, o.Shape.(*resolv.ConvexPolygon), drawColor)

dnmshared/resolv_helper.go

@@ -20,6 +20,10 @@ func ConvexPolygonStr(body *resolv.ConvexPolygon) string {
 
 func GenerateRectCollider(origX, origY, w, h, spaceOffsetX, spaceOffsetY float64, tag string) *resolv.Object {
 	cx, cy := WorldToPolygonColliderAnchorPos(origX, origY, w*0.5, h*0.5, spaceOffsetX, spaceOffsetY)
+    return GenerateRectColliderInCollisionSpace(cx, cy, w, h, tag) 
+}
+
+func GenerateRectColliderInCollisionSpace(cx, cy, w, h float64, tag string) *resolv.Object {
 	collider := resolv.NewObject(cx, cy, w, h, tag)
 	shape := resolv.NewRectangle(0, 0, w, h)
 	collider.SetShape(shape)

dragonBonesAnimProjects/library/SoldierElf.json

@@ -0,0 +1 @@
+{"width":128,"imagePath":"SoldierElf_tex.png","height":128,"name":"SoldierElf","SubTexture":[{"frameHeight":45,"y":1,"frameX":0,"width":34,"frameY":0,"height":44,"name":"cape","frameWidth":34,"x":70},{"width":10,"y":107,"height":14,"name":"shouder_l","x":74},{"width":11,"y":107,"height":14,"name":"forearm_l","x":61},{"width":15,"y":93,"height":16,"name":"hand_l","x":1},{"width":30,"y":61,"height":30,"name":"weapon_hand_l","x":1},{"width":8,"y":101,"height":11,"name":"thigh_l","x":86},{"width":12,"y":93,"height":17,"name":"calf_l","x":18},{"width":20,"y":113,"height":8,"name":"foot_l","x":39},{"width":28,"y":61,"height":31,"name":"pelvis","x":33},{"width":8,"y":88,"height":11,"name":"thigh_r","x":77},{"width":12,"y":88,"height":17,"name":"calf_r","x":63},{"width":20,"y":113,"height":8,"name":"foot_r","x":17},{"width":13,"y":94,"height":12,"name":"shouder_r","x":45},{"width":67,"y":1,"height":58,"name":"chest","x":1},{"width":11,"y":94,"height":17,"name":"forearm_r","x":32},{"width":14,"y":111,"height":13,"name":"hand_r","x":1},{"frameHeight":39,"y":47,"frameX":-2,"width":34,"frameY":0,"height":39,"name":"we_bl_4_f_1","frameWidth":36,"x":70}]}

dragonBonesAnimProjects/library/SoldierFireGhost.json

@@ -0,0 +1 @@
+{"imagePath":"Soldier_02_tex.png","width":128,"name":"Soldier_02","SubTexture":[{"x":53,"y":44,"width":23,"name":"biu","height":22},{"x":76,"y":68,"width":9,"name":"rightArm","height":14},{"y":35,"frameY":0,"height":32,"frameWidth":29,"frameX":-1,"frameHeight":32,"width":27,"name":"yinmoqe00","x":89},{"x":53,"y":1,"width":34,"name":"body","height":41},{"x":78,"y":44,"width":9,"name":"rightShoulder","height":13},{"y":50,"frameY":0,"height":18,"frameWidth":19,"frameX":0,"frameHeight":18,"width":19,"name":"rightFrontArm","x":23},{"x":23,"y":70,"width":14,"name":"rightHand","height":14},{"y":68,"frameY":0,"height":12,"frameWidth":12,"frameX":0,"frameHeight":12,"width":12,"name":"leftArm","x":62},{"x":1,"y":73,"width":13,"name":"leftShoulder","height":12},{"x":1,"y":50,"width":20,"name":"leftFrontArm","height":21},{"x":89,"y":1,"width":33,"name":"head","height":32},{"x":1,"y":1,"width":50,"name":"head2","height":47},{"x":44,"y":68,"width":16,"name":"leftHand","height":14},{"y":59,"frameY":-2,"height":4,"frameWidth":8,"frameX":-1,"frameHeight":8,"width":4,"name":"huomiao01","x":78}],"height":128}

dragonBonesAnimProjects/library/SoldierWaterGhost.json

@@ -0,0 +1 @@
+{"SubTexture":[{"width":23,"y":44,"height":22,"name":"biu","x":53},{"width":9,"y":68,"height":14,"name":"rightArm","x":76},{"y":35,"frameX":-1,"frameY":0,"width":27,"frameWidth":29,"height":32,"name":"yinmoqe00","frameHeight":32,"x":89},{"width":34,"y":1,"height":41,"name":"body","x":53},{"width":9,"y":44,"height":13,"name":"rightShoulder","x":78},{"y":50,"frameX":0,"frameY":0,"width":19,"frameWidth":19,"height":18,"name":"rightFrontArm","frameHeight":18,"x":23},{"width":14,"y":70,"height":14,"name":"rightHand","x":23},{"y":68,"frameX":0,"frameY":0,"width":12,"frameWidth":12,"height":12,"name":"leftArm","frameHeight":12,"x":62},{"width":13,"y":73,"height":12,"name":"leftShoulder","x":1},{"width":20,"y":50,"height":21,"name":"leftFrontArm","x":1},{"width":33,"y":1,"height":32,"name":"head","x":89},{"width":50,"y":1,"height":47,"name":"head2","x":1},{"width":16,"y":68,"height":14,"name":"leftHand","x":44},{"y":59,"frameX":-1,"frameY":-2,"width":4,"frameWidth":8,"height":4,"name":"huomiao01","frameHeight":8,"x":78}],"width":128,"height":128,"name":"SoldierWaterGhost","imagePath":"SoldierWaterGhost_tex.png"}

frontend/assets/resources/animation/SolderWaterGhost.meta

@@ -0,0 +1,7 @@
+{
+  "ver": "1.0.1",
+  "uuid": "8f2f76c7-649c-414a-80be-b2daef4ed580",
+  "isSubpackage": false,
+  "subpackageName": "",
+  "subMetas": {}
+}

frontend/assets/resources/animation/SolderWaterGhost/SoldierWaterGhost_tex.json

@@ -0,0 +1 @@
+{"SubTexture":[{"y":50,"frameX":-2,"frameY":-2,"width":19,"frameWidth":23,"height":19,"name":"biu","frameHeight":22,"x":1},{"width":9,"y":50,"height":14,"name":"rightArm","x":42},{"y":34,"frameX":-6,"frameY":0,"width":20,"frameWidth":29,"height":32,"name":"yinmoqe00","frameHeight":32,"x":88},{"y":1,"frameX":0,"frameY":0,"width":33,"frameWidth":34,"height":39,"name":"body","frameHeight":41,"x":53},{"width":9,"y":56,"height":13,"name":"rightShoulder","x":74},{"y":50,"frameX":0,"frameY":0,"width":18,"frameWidth":19,"height":17,"name":"rightFrontArm","frameHeight":18,"x":22},{"width":14,"y":50,"height":14,"name":"rightHand","x":110},{"width":12,"y":42,"height":12,"name":"leftArm","x":74},{"width":13,"y":66,"height":12,"name":"leftShoulder","x":110},{"y":42,"frameX":-1,"frameY":0,"width":19,"frameWidth":20,"height":21,"name":"leftFrontArm","frameHeight":21,"x":53},{"width":50,"y":1,"height":47,"name":"head2","x":1},{"y":1,"frameX":-1,"frameY":0,"width":32,"frameWidth":33,"height":31,"name":"head","frameHeight":32,"x":88},{"width":16,"y":34,"height":14,"name":"leftHand","x":110},{"y":1,"frameX":-2,"frameY":-3,"width":2,"frameWidth":8,"height":2,"name":"huomiao01","frameHeight":8,"x":122}],"width":128,"height":128,"name":"SoldierWaterGhost","imagePath":"SoldierWaterGhost_tex.png"}

frontend/assets/resources/animation/SolderWaterGhost/SoldierWaterGhost_tex.json.meta

@@ -0,0 +1,7 @@
+{
+  "ver": "1.0.0",
+  "uuid": "e9e703e9-3589-4713-b889-28b23406d220",
+  "atlasJson": "{\"SubTexture\":[{\"y\":50,\"frameX\":-2,\"frameY\":-2,\"width\":19,\"frameWidth\":23,\"height\":19,\"name\":\"biu\",\"frameHeight\":22,\"x\":1},{\"width\":9,\"y\":50,\"height\":14,\"name\":\"rightArm\",\"x\":42},{\"y\":34,\"frameX\":-6,\"frameY\":0,\"width\":20,\"frameWidth\":29,\"height\":32,\"name\":\"yinmoqe00\",\"frameHeight\":32,\"x\":88},{\"y\":1,\"frameX\":0,\"frameY\":0,\"width\":33,\"frameWidth\":34,\"height\":39,\"name\":\"body\",\"frameHeight\":41,\"x\":53},{\"width\":9,\"y\":56,\"height\":13,\"name\":\"rightShoulder\",\"x\":74},{\"y\":50,\"frameX\":0,\"frameY\":0,\"width\":18,\"frameWidth\":19,\"height\":17,\"name\":\"rightFrontArm\",\"frameHeight\":18,\"x\":22},{\"width\":14,\"y\":50,\"height\":14,\"name\":\"rightHand\",\"x\":110},{\"width\":12,\"y\":42,\"height\":12,\"name\":\"leftArm\",\"x\":74},{\"width\":13,\"y\":66,\"height\":12,\"name\":\"leftShoulder\",\"x\":110},{\"y\":42,\"frameX\":-1,\"frameY\":0,\"width\":19,\"frameWidth\":20,\"height\":21,\"name\":\"leftFrontArm\",\"frameHeight\":21,\"x\":53},{\"width\":50,\"y\":1,\"height\":47,\"name\":\"head2\",\"x\":1},{\"y\":1,\"frameX\":-1,\"frameY\":0,\"width\":32,\"frameWidth\":33,\"height\":31,\"name\":\"head\",\"frameHeight\":32,\"x\":88},{\"width\":16,\"y\":34,\"height\":14,\"name\":\"leftHand\",\"x\":110},{\"y\":1,\"frameX\":-2,\"frameY\":-3,\"width\":2,\"frameWidth\":8,\"height\":2,\"name\":\"huomiao01\",\"frameHeight\":8,\"x\":122}],\"width\":128,\"height\":128,\"name\":\"SoldierWaterGhost\",\"imagePath\":\"SoldierWaterGhost_tex.png\"}",
+  "texture": "def168c3-3f07-43f9-a460-36b397c70a57",
+  "subMetas": {}
+}

frontend/assets/resources/animation/SolderWaterGhost/SoldierWaterGhost_tex.png.meta

@@ -0,0 +1,34 @@
+{
+  "ver": "2.3.3",
+  "uuid": "def168c3-3f07-43f9-a460-36b397c70a57",
+  "type": "sprite",
+  "wrapMode": "clamp",
+  "filterMode": "bilinear",
+  "premultiplyAlpha": false,
+  "genMipmaps": false,
+  "packable": true,
+  "platformSettings": {},
+  "subMetas": {
+    "SoldierWaterGhost_tex": {
+      "ver": "1.0.4",
+      "uuid": "52fb0606-bbea-433c-803b-bf5ce936a0df",
+      "rawTextureUuid": "def168c3-3f07-43f9-a460-36b397c70a57",
+      "trimType": "auto",
+      "trimThreshold": 1,
+      "rotated": false,
+      "offsetX": -0.5,
+      "offsetY": 24.5,
+      "trimX": 1,
+      "trimY": 1,
+      "width": 125,
+      "height": 77,
+      "rawWidth": 128,
+      "rawHeight": 128,
+      "borderTop": 0,
+      "borderBottom": 0,
+      "borderLeft": 0,
+      "borderRight": 0,
+      "subMetas": {}
+    }
+  }
+}

frontend/assets/resources/animation/SoldierElf.meta

@@ -0,0 +1,7 @@
+{
+  "ver": "1.0.1",
+  "uuid": "2202f4f4-b792-4dea-8302-633315aded66",
+  "isSubpackage": false,
+  "subpackageName": "",
+  "subMetas": {}
+}

frontend/assets/resources/animation/SoldierElf/SoldierElf_tex.json

@@ -0,0 +1 @@
+{"width":128,"SubTexture":[{"frameWidth":34,"y":1,"frameHeight":45,"width":34,"frameX":0,"height":44,"name":"cape","frameY":0,"x":70},{"width":10,"y":107,"height":14,"name":"shouder_l","x":74},{"width":11,"y":107,"height":14,"name":"forearm_l","x":61},{"width":15,"y":93,"height":16,"name":"hand_l","x":1},{"width":30,"y":61,"height":30,"name":"weapon_hand_l","x":1},{"width":8,"y":88,"height":11,"name":"thigh_l","x":77},{"width":12,"y":93,"height":17,"name":"calf_l","x":18},{"width":20,"y":113,"height":8,"name":"foot_l","x":39},{"width":28,"y":61,"height":31,"name":"pelvis","x":33},{"width":8,"y":101,"height":11,"name":"thigh_r","x":86},{"width":12,"y":88,"height":17,"name":"calf_r","x":63},{"width":20,"y":113,"height":8,"name":"foot_r","x":17},{"width":13,"y":94,"height":12,"name":"shouder_r","x":45},{"width":67,"y":1,"height":58,"name":"chest","x":1},{"width":11,"y":94,"height":17,"name":"forearm_r","x":32},{"width":14,"y":111,"height":13,"name":"hand_r","x":1},{"frameWidth":36,"y":47,"frameHeight":39,"width":34,"frameX":-2,"height":39,"name":"we_bl_4_f_1","frameY":0,"x":70}],"height":128,"name":"SoldierElf","imagePath":"SoldierElf_tex.png"}

frontend/assets/resources/animation/SoldierElf/SoldierElf_tex.json.meta

@@ -0,0 +1,7 @@
+{
+  "ver": "1.0.0",
+  "uuid": "24d7bb8f-577c-4e5d-b730-56613ca8685d",
+  "atlasJson": "{\"width\":128,\"SubTexture\":[{\"frameWidth\":34,\"y\":1,\"frameHeight\":45,\"width\":34,\"frameX\":0,\"height\":44,\"name\":\"cape\",\"frameY\":0,\"x\":70},{\"width\":10,\"y\":107,\"height\":14,\"name\":\"shouder_l\",\"x\":74},{\"width\":11,\"y\":107,\"height\":14,\"name\":\"forearm_l\",\"x\":61},{\"width\":15,\"y\":93,\"height\":16,\"name\":\"hand_l\",\"x\":1},{\"width\":30,\"y\":61,\"height\":30,\"name\":\"weapon_hand_l\",\"x\":1},{\"width\":8,\"y\":88,\"height\":11,\"name\":\"thigh_l\",\"x\":77},{\"width\":12,\"y\":93,\"height\":17,\"name\":\"calf_l\",\"x\":18},{\"width\":20,\"y\":113,\"height\":8,\"name\":\"foot_l\",\"x\":39},{\"width\":28,\"y\":61,\"height\":31,\"name\":\"pelvis\",\"x\":33},{\"width\":8,\"y\":101,\"height\":11,\"name\":\"thigh_r\",\"x\":86},{\"width\":12,\"y\":88,\"height\":17,\"name\":\"calf_r\",\"x\":63},{\"width\":20,\"y\":113,\"height\":8,\"name\":\"foot_r\",\"x\":17},{\"width\":13,\"y\":94,\"height\":12,\"name\":\"shouder_r\",\"x\":45},{\"width\":67,\"y\":1,\"height\":58,\"name\":\"chest\",\"x\":1},{\"width\":11,\"y\":94,\"height\":17,\"name\":\"forearm_r\",\"x\":32},{\"width\":14,\"y\":111,\"height\":13,\"name\":\"hand_r\",\"x\":1},{\"frameWidth\":36,\"y\":47,\"frameHeight\":39,\"width\":34,\"frameX\":-2,\"height\":39,\"name\":\"we_bl_4_f_1\",\"frameY\":0,\"x\":70}],\"height\":128,\"name\":\"SoldierElf\",\"imagePath\":\"SoldierElf_tex.png\"}",
+  "texture": "050fb016-1a1f-4341-8367-283bfeddc4a8",
+  "subMetas": {}
+}

frontend/assets/resources/animation/SoldierElf/SoldierElf_tex.png.meta

@@ -0,0 +1,34 @@
+{
+  "ver": "2.3.3",
+  "uuid": "050fb016-1a1f-4341-8367-283bfeddc4a8",
+  "type": "sprite",
+  "wrapMode": "clamp",
+  "filterMode": "bilinear",
+  "premultiplyAlpha": false,
+  "genMipmaps": false,
+  "packable": true,
+  "platformSettings": {},
+  "subMetas": {
+    "SoldierElf_tex": {
+      "ver": "1.0.4",
+      "uuid": "c62e1779-f92b-40d3-bf4f-7ab747e33d6e",
+      "rawTextureUuid": "050fb016-1a1f-4341-8367-283bfeddc4a8",
+      "trimType": "auto",
+      "trimThreshold": 1,
+      "rotated": false,
+      "offsetX": -11.5,
+      "offsetY": 1.5,
+      "trimX": 1,
+      "trimY": 1,
+      "width": 103,
+      "height": 123,
+      "rawWidth": 128,
+      "rawHeight": 128,
+      "borderTop": 0,
+      "borderBottom": 0,
+      "borderLeft": 0,
+      "borderRight": 0,
+      "subMetas": {}
+    }
+  }
+}

frontend/assets/resources/animation/SoldierFireGhost.meta

@@ -0,0 +1,7 @@
+{
+  "ver": "1.0.1",
+  "uuid": "f1176719-d1d6-4af5-89c6-ddff16ab85fd",
+  "isSubpackage": false,
+  "subpackageName": "",
+  "subMetas": {}
+}

frontend/assets/resources/animation/SoldierFireGhost/SoldierFireGhost_tex.json

@@ -0,0 +1 @@
+{"width":128,"SubTexture":[{"frameWidth":23,"y":44,"frameHeight":22,"width":22,"frameX":-1,"height":22,"name":"biu","frameY":0,"x":53},{"width":9,"y":68,"height":14,"name":"rightArm","x":76},{"frameWidth":29,"y":35,"frameHeight":32,"width":26,"frameX":-1,"height":32,"name":"yinmoqe00","frameY":0,"x":89},{"width":34,"y":1,"height":41,"name":"body","x":53},{"width":9,"y":44,"height":13,"name":"rightShoulder","x":77},{"width":19,"y":50,"height":18,"name":"rightFrontArm","x":23},{"width":14,"y":70,"height":14,"name":"rightHand","x":23},{"width":12,"y":68,"height":12,"name":"leftArm","x":62},{"width":13,"y":73,"height":12,"name":"leftShoulder","x":1},{"width":20,"y":50,"height":21,"name":"leftFrontArm","x":1},{"width":33,"y":1,"height":32,"name":"head","x":89},{"width":50,"y":1,"height":47,"name":"head2","x":1},{"width":16,"y":68,"height":14,"name":"leftHand","x":44},{"frameWidth":8,"y":59,"frameHeight":8,"width":4,"frameX":-1,"height":4,"name":"huomiao01","frameY":-2,"x":77}],"height":128,"name":"SoldierFireGhost","imagePath":"SoldierFireGhost_tex.png"}

frontend/assets/resources/animation/SoldierFireGhost/SoldierFireGhost_tex.json.meta

@@ -0,0 +1,7 @@
+{
+  "ver": "1.0.0",
+  "uuid": "4a9187d5-a9ad-4464-a03c-d2f3cc277051",
+  "atlasJson": "{\"width\":128,\"SubTexture\":[{\"frameWidth\":23,\"y\":44,\"frameHeight\":22,\"width\":22,\"frameX\":-1,\"height\":22,\"name\":\"biu\",\"frameY\":0,\"x\":53},{\"width\":9,\"y\":68,\"height\":14,\"name\":\"rightArm\",\"x\":76},{\"frameWidth\":29,\"y\":35,\"frameHeight\":32,\"width\":26,\"frameX\":-1,\"height\":32,\"name\":\"yinmoqe00\",\"frameY\":0,\"x\":89},{\"width\":34,\"y\":1,\"height\":41,\"name\":\"body\",\"x\":53},{\"width\":9,\"y\":44,\"height\":13,\"name\":\"rightShoulder\",\"x\":77},{\"width\":19,\"y\":50,\"height\":18,\"name\":\"rightFrontArm\",\"x\":23},{\"width\":14,\"y\":70,\"height\":14,\"name\":\"rightHand\",\"x\":23},{\"width\":12,\"y\":68,\"height\":12,\"name\":\"leftArm\",\"x\":62},{\"width\":13,\"y\":73,\"height\":12,\"name\":\"leftShoulder\",\"x\":1},{\"width\":20,\"y\":50,\"height\":21,\"name\":\"leftFrontArm\",\"x\":1},{\"width\":33,\"y\":1,\"height\":32,\"name\":\"head\",\"x\":89},{\"width\":50,\"y\":1,\"height\":47,\"name\":\"head2\",\"x\":1},{\"width\":16,\"y\":68,\"height\":14,\"name\":\"leftHand\",\"x\":44},{\"frameWidth\":8,\"y\":59,\"frameHeight\":8,\"width\":4,\"frameX\":-1,\"height\":4,\"name\":\"huomiao01\",\"frameY\":-2,\"x\":77}],\"height\":128,\"name\":\"SoldierFireGhost\",\"imagePath\":\"SoldierFireGhost_tex.png\"}",
+  "texture": "700d963b-2192-4219-a066-8be5b3db7453",
+  "subMetas": {}
+}

frontend/assets/resources/animation/SoldierFireGhost/SoldierFireGhost_tex.png.meta

@@ -0,0 +1,34 @@
+{
+  "ver": "2.3.3",
+  "uuid": "700d963b-2192-4219-a066-8be5b3db7453",
+  "type": "sprite",
+  "wrapMode": "clamp",
+  "filterMode": "bilinear",
+  "premultiplyAlpha": false,
+  "genMipmaps": false,
+  "packable": true,
+  "platformSettings": {},
+  "subMetas": {
+    "SoldierFireGhost_tex": {
+      "ver": "1.0.4",
+      "uuid": "8ef8a6b3-0bac-4cf1-bba0-ab090f4d9e52",
+      "rawTextureUuid": "700d963b-2192-4219-a066-8be5b3db7453",
+      "trimType": "auto",
+      "trimThreshold": 1,
+      "rotated": false,
+      "offsetX": -2.5,
+      "offsetY": 21,
+      "trimX": 1,
+      "trimY": 1,
+      "width": 121,
+      "height": 84,
+      "rawWidth": 128,
+      "rawHeight": 128,
+      "borderTop": 0,
+      "borderBottom": 0,
+      "borderLeft": 0,
+      "borderRight": 0,
+      "subMetas": {}
+    }
+  }
+}

frontend/assets/resources/map/dungeon/map.tmx

@@ -1,17 +1,18 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<map version="1.2" tiledversion="1.2.3" orientation="orthogonal" renderorder="right-down" width="64" height="64" tilewidth="16" tileheight="16" infinite="0" nextlayerid="2" nextobjectid="8">
+<map version="1.2" tiledversion="1.2.3" orientation="orthogonal" renderorder="right-down" width="128" height="128" tilewidth="16" tileheight="16" infinite="0" nextlayerid="3" nextobjectid="39">
  <tileset firstgid="1" source="tiles0.tsx"/>
  <tileset firstgid="65" source="tiles1.tsx"/>
- <layer id="1" name="Ground" width="64" height="64">
+ <tileset firstgid="129" source="tiles2.tsx"/>
+ <layer id="2" name="Ground" width="128" height="128">
   <data encoding="base64" compression="zlib">
-   eJzt0jEOwjAUREGLkiLmALRU3In7HwMKkFCUCCwiNrKnmCbVvh8fSikHAAAA/qruYEOr84Zd+vM9re0v+vXr1z9S/7f0l3KZ9dXZ91r67QeAXxyf0jv0Z/tvO9iS7F+T3ucG+Xuk96RvkN4CMJLaIL0VttLy7r19euHdA+zX6YP0vlR3z/3ax2tfarw+TAO0L/VPb3ruXvv3o7z7lv70zuQN0vtgz+6DDSsZ
+   eJzt2q1u22AYhuEo1UhBtYFWKh/bmRRMRYNFPZPxwcKi7jznSInkWk7teG5ex88FLhQD570d5/PP1WazuQIAAAAAAAAAAAAAAAAAgAmu96r3g/N5bjn0fw5U3aGy/3bv0P+p8XDEdoX0f9//GP3Xp93/YaD/9QJa6f95/fvov26773671zeb7jmhupX+5+2fQH/9qztU9v8yQXUz/fXXX3/9a/ovgf7666+//vrrf1n9/4zc7tue/uvq/9Z4PfLZ7vnz38ZP/cv7T53p4Z7i7/+kv/7667/bl/sO/dff/77T3+9ff/3r+38dMGf/Nv1r+w917+v/0vh1okN/67/l9B/b/nFj/X8pxvYf236r/0UZ6t/X+Efj5kj7bv+uxxPpX9e/r/1NS7f7Z/S/a3zXfzH9Pzrvt/vPTf/l9p+yRjyV/ufvP+YY6M5yzr5D5uy/XUCLJfafa8YfmdJe//X0r6Z/9jGgv/7661/doqp/9fyrpV//Vc+/mv7Z9M+mfzb9s+mfTf9s+mfTP5v+2fTPpn82/bPpn03/bPpn0z+b/tn0z6Z/Nv2z6Z/N+9/Z9M+mfzb//9n0z6Z/Nv2z6Z9N/2z6Z9M/m/7Z0vtT3wEAAAAAAAAAAAAAAAA4v39IY4NC
   </data>
  </layer>
  <objectgroup id="1" name="PlayerStartingPos">
-  <object id="135" x="512" y="512">
+  <object id="135" x="1090" y="833.667">
    <point/>
   </object>
-  <object id="137" x="640" y="640">
+  <object id="137" x="1215" y="830.5">
    <point/>
   </object>
  </objectgroup>
@@ -19,47 +20,149 @@
   <properties>
    <property name="type" value="barrier_and_shelter"/>
   </properties>
-  <object id="1" x="400" y="224.5">
+  <object id="8" x="648.242" y="480.606">
    <properties>
     <property name="boundary_type" value="barrier"/>
    </properties>
-   <polyline points="0,0 0,141.5 17,141.5 17,-1"/>
+   <polyline points="0,0 0,18.6667 1041.33,21.3333 1041.33,-1.33333"/>
   </object>
-  <object id="2" x="559.5" y="207.5">
+  <object id="9" x="650.667" y="1604.67">
    <properties>
     <property name="boundary_type" value="barrier"/>
    </properties>
-   <polyline points="0,0 1,158.5 17,158.5 17,0"/>
+   <polyline points="0,0 0,18.6667 1041.33,21.3333 1041.33,-1.33333"/>
   </object>
-  <object id="3" x="448.5" y="353">
+  <object id="10" x="634.485" y="505.455">
    <properties>
     <property name="boundary_type" value="barrier"/>
    </properties>
-   <polyline points="0,0 0,14.5 -49,14.5 -49,-1.5"/>
+   <polyline points="0,0 4,1110 24,1110 24,-8"/>
   </object>
-  <object id="4" x="577.5" y="351.5">
+  <object id="11" x="1677.64" y="501.333">
    <properties>
     <property name="boundary_type" value="barrier"/>
    </properties>
-   <polyline points="0,0 -98,1 -98,16 -1,15.5"/>
+   <polyline points="0,0 4,1110 24,1110 24,-8"/>
   </object>
-  <object id="5" x="449.333" y="654.667">
+  <object id="14" x="688.667" y="464">
    <properties>
     <property name="boundary_type" value="barrier"/>
    </properties>
-   <polyline points="0,0 -178.667,0.666667 -178.667,17.3333 -0.666667,17.3333"/>
+   <polyline points="0,0 -0.666667,78 33.3333,78 32,-0.666667"/>
   </object>
-  <object id="6" x="432.5" y="703.5">
+  <object id="15" x="833.333" y="495.333">
    <properties>
     <property name="boundary_type" value="barrier"/>
    </properties>
-   <polyline points="0,0 -191.667,0.666667 -191.667,17.3333 -0.715174,17.3333"/>
+   <polyline points="0,0 -112,1.33333 -111.333,44.6667 -1.33333,44.6667"/>
   </object>
-  <object id="7" x="400" y="751">
+  <object id="17" x="832" y="574">
    <properties>
     <property name="boundary_type" value="barrier"/>
    </properties>
-   <polyline points="0,0 -191.667,0.666667 -191.667,17.3333 -0.715174,17.3333"/>
+   <polyline points="0,0 -67.3333,0 -67.3333,-76.6667 0.666667,-76"/>
+  </object>
+  <object id="18" x="865.333" y="606.667">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -210,-0.666667 -210,143.333 0,142.667"/>
+  </object>
+  <object id="19" x="754.667" y="1055.33">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="-2,1.33333 -100,0.666667 -97.3333,-454 -9.33333,-451.333"/>
+  </object>
+  <object id="20" x="769.333" y="747.333">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -115.333,0.666667 -114.667,160.667 -2,162"/>
+  </object>
+  <object id="21" x="768" y="960.667">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -18,0.666667 -18.6667,95.3333 0,95.3333"/>
+  </object>
+  <object id="23" x="786" y="1058.67">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 0,-52.6667 -20,-52 -19.3333,-1.33333"/>
+  </object>
+  <object id="24" x="1118.67" y="749.333">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -0.666667,-94 -254,-93.3333 -256.667,1.33333"/>
+  </object>
+  <object id="25" x="1168" y="975.333">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 0,16.6667 224.667,17.3333 225.333,-2"/>
+  </object>
+  <object id="28" x="1394.67" y="958">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -210.667,1.33333 -210.667,17.3333 -2,18"/>
+  </object>
+  <object id="29" x="1119" y="654.5">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 0,63.5 272.5,65 273,-1"/>
+  </object>
+  <object id="30" x="1136.5" y="717.5">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -0.5,17 255,17.5 255,1.5"/>
+  </object>
+  <object id="31" x="1152" y="735.667">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 0,15 80.3333,15.3333 80.3333,-2"/>
+  </object>
+  <object id="32" x="1280.67" y="734.667">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -0.666667,64.3333 48,65 48,0"/>
+  </object>
+  <object id="34" x="1329" y="783">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 63.3333,0.333333 63,-48.3333 -0.666667,-48.3333"/>
+  </object>
+  <object id="35" x="1296.67" y="799">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -0.666667,31.3333 31.3333,31.6667 31.3333,-0.333333"/>
+  </object>
+  <object id="36" x="1280" y="848">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 0.333333,62 112,63 111.667,-1.33333"/>
+  </object>
+  <object id="37" x="1392.33" y="911.333">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 -81.3333,-0.666667 -81,45 -0.666667,46.3333"/>
+  </object>
+  <object id="38" x="1344.33" y="800.667">
+   <properties>
+    <property name="boundary_type" value="barrier"/>
+   </properties>
+   <polyline points="0,0 0,46.3333 47,46.3333 47,-1"/>
   </object>
  </objectgroup>
 </map>

frontend/assets/resources/map/dungeon/tiles2.tsx

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<tileset version="1.2" tiledversion="1.2.3" name="tiles2" tilewidth="16" tileheight="16" tilecount="64" columns="16">
+ <image source="watabou_pixel_dungeon_orig_files/tiles2.png" width="256" height="64"/>
+</tileset>

frontend/assets/resources/map/dungeon/tiles2.tsx.meta

@@ -0,0 +1,5 @@
+{
+  "ver": "2.0.0",
+  "uuid": "2e53500f-f9c8-4b5b-b74c-f2adbc2ec34d",
+  "subMetas": {}
+}

frontend/assets/resources/pbfiles/room_downsync_frame.proto

@@ -4,58 +4,38 @@ option go_package = "battle_srv/protos"; // here "./" corresponds to the "--go_o
 package protos;
 import "geometry.proto"; // The import path here is only w.r.t. the proto file, not the Go package.
 
-message BattleColliderInfo {
-  string stageName = 1;
-  map<string, sharedprotos.Vec2DList> strToVec2DListMap = 2; 
-  map<string, sharedprotos.Polygon2DList> strToPolygon2DListMap = 3; 
-  int32 stageDiscreteW = 4;
-  int32 stageDiscreteH = 5;
-  int32 stageTileW = 6;
-  int32 stageTileH = 7;
-
-  int32 intervalToPing        = 8;
-  int32 willKickIfInactiveFor = 9;
-  int32 boundRoomId           = 10;
-  int64 battleDurationNanos   = 11;
-  int32 serverFps             = 12;
-  int32 inputDelayFrames      = 13;
-  uint32 inputScaleFrames     = 14;
-  int32 nstDelayFrames        = 15;
-  int32 inputFrameUpsyncDelayTolerance = 16;  
-  int32 maxChasingRenderFramesPerUpdate = 17;
-  int32 playerBattleState = 18;
-  double rollbackEstimatedDtMillis = 19;
-  int64 rollbackEstimatedDtNanos = 20;
- 
-  double worldToVirtualGridRatio = 21;
-  double virtualGridToWorldRatio = 22;
-}
-
 message PlayerDownsync {
   int32 id = 1;
   int32 virtualGridX = 2; 
   int32 virtualGridY = 3; 
-  sharedprotos.Direction dir = 4;
-  int32 speed = 5; // in terms of virtual grid units
-  int32 battleState = 6;
-  int32 lastMoveGmtMillis = 7;
-  int32 score = 10;
-  bool removed = 11;
-  int32 joinIndex = 12;
+  int32 dirX = 4;
+  int32 dirY = 5;
+  int32 speed = 6; // in terms of virtual grid units
+  int32 battleState = 7;
+  int32 joinIndex = 8;
+  double colliderRadius = 9;
+  bool removed = 10;
+  int32 score = 11;
+  int32 lastMoveGmtMillis = 12;
+  int32 framesToRecover = 13;
+  int32 hp = 14;
+  int32 maxHp = 15;
+  int32 characterState = 16;
+
+  string name = 17;
+  string displayName = 18;
+  string avatar = 19;
 }
 
-message PlayerDownsyncMeta {
-  int32 id = 1;
-  string name = 2;
-  string displayName = 3;
-  string avatar = 4;
-  int32 joinIndex = 5;
-  double colliderRadius = 6;
+message InputFrameDecoded {
+  int32 dx = 1;
+  int32 dy = 2;
+  int32 btnALevel = 3;
 }
 
 message InputFrameUpsync {
   int32 inputFrameId = 1;
-  int32 encodedDir = 6;
+  uint64 encoded = 2;
 }
 
 message InputFrameDownsync {
@@ -68,13 +48,6 @@ message HeartbeatUpsync {
   int64 clientTimestamp = 1;     
 }
 
-message RoomDownsyncFrame {
-  int32 id = 1;
-  map<int32, PlayerDownsync> players = 2;
-  int64 countdownNanos = 3;
-  map<int32, PlayerDownsyncMeta> playerMetas = 4;
-}
-
 message WsReq {
   int32 msgId = 1;
   int32 playerId = 2;
@@ -94,3 +67,71 @@ message WsResp {
   repeated InputFrameDownsync inputFrameDownsyncBatch = 5;
   BattleColliderInfo bciFrame = 6; 
 }
+
+message MeleeBullet { 
+  // Jargon reference https://www.thegamer.com/fighting-games-frame-data-explained/
+  // ALL lengths are in world coordinate
+
+  // for offender  
+  int32 battleLocalId = 1;
+  int32 startupFrames = 2; 
+  int32 activeFrames = 3;  
+  int32 recoveryFrames = 4;
+  int32 recoveryFramesOnBlock = 5; 
+  int32 recoveryFramesOnHit = 6;  
+  sharedprotos.Vec2D moveforward = 7;  
+  double hitboxOffset = 8;  
+  sharedprotos.Vec2D hitboxSize = 9;    
+  int32 originatedRenderFrameId = 10; 
+
+  // for defender
+  int32 hitStunFrames = 11; 
+  int32 blockStunFrames = 12; 
+  double pushback = 13;  
+
+  int32 releaseTriggerType = 14; // 1: rising-edge, 2: falling-edge  
+  int32 damage = 15;   
+
+  int32 offenderJoinIndex = 16;    
+  int32 offenderPlayerId = 17;    
+} 
+
+message BattleColliderInfo {
+  string stageName = 1;
+  map<string, sharedprotos.Vec2DList> strToVec2DListMap = 2; 
+  map<string, sharedprotos.Polygon2DList> strToPolygon2DListMap = 3; 
+  int32 stageDiscreteW = 4;
+  int32 stageDiscreteH = 5;
+  int32 stageTileW = 6;
+  int32 stageTileH = 7;
+
+  int32 intervalToPing        = 8;
+  int32 willKickIfInactiveFor = 9;
+  int32 boundRoomId           = 10;
+  int32 battleDurationFrames  = 12;
+  int64 battleDurationNanos   = 13;
+  int32 serverFps             = 14;
+  int32 inputDelayFrames      = 15; // in the count of render frames
+  uint32 inputScaleFrames     = 16; // inputDelayedAndScaledFrameId = ((originalFrameId - InputDelayFrames) >> InputScaleFrames)
+  int32 nstDelayFrames        = 17; // network-single-trip delay in the count of render frames, proposed to be (InputDelayFrames >> 1) because we expect a round-trip delay to be exactly "InputDelayFrames"
+  int32 inputFrameUpsyncDelayTolerance = 18;  
+  int32 maxChasingRenderFramesPerUpdate = 19;
+  int32 playerBattleState = 20;
+  double rollbackEstimatedDtMillis = 21;
+  int64 rollbackEstimatedDtNanos = 22;
+ 
+  double worldToVirtualGridRatio = 23;
+  double virtualGridToWorldRatio = 24;
+
+  int32 spAtkLookupFrames = 25;
+  int32 renderCacheSize = 26;
+
+  map<int32, MeleeBullet> meleeSkillConfig = 27; // skillId -> skill
+}
+
+message RoomDownsyncFrame {
+  int32 id = 1;
+  map<int32, PlayerDownsync> players = 2;
+  int64 countdownNanos = 3;
+  repeated MeleeBullet meleeBullets = 4; // I don't know how to mimic inheritance/composition in protobuf by far, thus using an array for each type of bullet as a compromise 
+}

frontend/assets/resources/prefabs/BulletPrefab.prefab

@@ -1,309 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "Bullet",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [
-      {
-        "__id__": 2
-      }
-    ],
-    "_active": true,
-    "_level": 1,
-    "_components": [
-      {
-        "__id__": 5
-      },
-      {
-        "__id__": 6
-      }
-    ],
-    "_prefab": {
-      "__id__": 7
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 100,
-      "height": 60
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.7,
-      "y": 0.5
-    },
-    "_quat": {
-      "__type__": "cc.Quat",
-      "x": 0,
-      "y": 0,
-      "z": 0,
-      "w": 1
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "groupIndex": 0,
-    "_id": "",
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "Tail",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 1
-    },
-    "_children": [],
-    "_active": true,
-    "_level": 2,
-    "_components": [
-      {
-        "__id__": 3
-      }
-    ],
-    "_prefab": {
-      "__id__": 4
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 0,
-      "height": 0
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_quat": {
-      "__type__": "cc.Quat",
-      "x": 0,
-      "y": 0,
-      "z": 0,
-      "w": 1
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "groupIndex": 0,
-    "_id": "",
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        -14,
-        -6,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.ParticleSystem",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 2
-    },
-    "_enabled": true,
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 1,
-    "_custom": true,
-    "_file": {
-      "__uuid__": "b2687ac4-099e-403c-a192-ff477686f4f5"
-    },
-    "_spriteFrame": {
-      "__uuid__": "472df5d3-35e7-4184-9e6c-7f41bee65ee3"
-    },
-    "_texture": {
-      "__uuid__": "d0a82d39-bede-46c4-b698-c81ff0dedfff"
-    },
-    "_stopped": false,
-    "playOnLoad": true,
-    "autoRemoveOnFinish": false,
-    "totalParticles": 200,
-    "duration": -1,
-    "emissionRate": 999.999985098839,
-    "life": 0.20000000298023224,
-    "lifeVar": 0.5,
-    "_startColor": {
-      "__type__": "cc.Color",
-      "r": 202,
-      "g": 200,
-      "b": 86,
-      "a": 163
-    },
-    "_startColorVar": {
-      "__type__": "cc.Color",
-      "r": 229,
-      "g": 255,
-      "b": 173,
-      "a": 198
-    },
-    "_endColor": {
-      "__type__": "cc.Color",
-      "r": 173,
-      "g": 161,
-      "b": 19,
-      "a": 214
-    },
-    "_endColorVar": {
-      "__type__": "cc.Color",
-      "r": 107,
-      "g": 249,
-      "b": 249,
-      "a": 188
-    },
-    "angle": 360,
-    "angleVar": 360,
-    "startSize": 3.369999885559082,
-    "startSizeVar": 50,
-    "endSize": 30.31999969482422,
-    "endSizeVar": 0,
-    "startSpin": -47.369998931884766,
-    "startSpinVar": 0,
-    "endSpin": -47.369998931884766,
-    "endSpinVar": -142.11000061035156,
-    "sourcePos": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "posVar": {
-      "__type__": "cc.Vec2",
-      "x": 7,
-      "y": 7
-    },
-    "positionType": 1,
-    "emitterMode": 0,
-    "gravity": {
-      "__type__": "cc.Vec2",
-      "x": -1000,
-      "y": 0.5
-    },
-    "speed": 10,
-    "speedVar": 190.7899932861328,
-    "tangentialAccel": -92.11000061035156,
-    "tangentialAccelVar": 65.79000091552734,
-    "radialAccel": -671.0499877929688,
-    "radialAccelVar": 65.79000091552734,
-    "rotationIsDir": false,
-    "startRadius": 0,
-    "startRadiusVar": 0,
-    "endRadius": 0,
-    "endRadiusVar": 0,
-    "rotatePerS": 0,
-    "rotatePerSVar": 0,
-    "_N$preview": true,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "7673e0e4-bebd-4caa-8a10-a6e1e86f1b2f"
-    },
-    "fileId": "f8NGWnOBtGmZNTU+o6vnbe",
-    "sync": false
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": {
-      "__uuid__": "2f525bb2-80d1-4508-bdc3-d03c11587ce4"
-    },
-    "_type": 0,
-    "_sizeMode": 0,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_state": 0,
-    "_atlas": {
-      "__uuid__": "266c6cef-32d6-4545-b3e6-c2b75a895578"
-    },
-    "_id": ""
-  },
-  {
-    "__type__": "ea9650l7IJHjL2ymsB5gasO",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "localIdInBattle": null,
-    "linearSpeed": 0,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "7673e0e4-bebd-4caa-8a10-a6e1e86f1b2f"
-    },
-    "fileId": "f7AuVG6IFIr5KrEg6RCeY2",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/BulletPrefab.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "7673e0e4-bebd-4caa-8a10-a6e1e86f1b2f",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/ControlledCharacter.prefab

@@ -13,7 +13,7 @@
   },
   {
     "__type__": "cc.Node",
-    "_name": "Player1",
+    "_name": "Root",
     "_objFlags": 0,
     "_parent": null,
     "_children": [
@@ -25,25 +25,22 @@
       },
       {
         "__id__": 8
+      },
+      {
+        "__id__": 11
       }
     ],
     "_active": true,
     "_components": [
       {
-        "__id__": 11
+        "__id__": 22
       },
       {
-        "__id__": 12
-      },
-      {
-        "__id__": 13
-      },
-      {
-        "__id__": 14
+        "__id__": 23
       }
     ],
     "_prefab": {
-      "__id__": 15
+      "__id__": 24
     },
     "_opacity": 255,
     "_color": {
@@ -192,7 +189,7 @@
       "__id__": 1
     },
     "asset": {
-      "__uuid__": "8a738d50-1dac-4b6e-99e1-d241f5ee7169"
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
     },
     "fileId": "5apzDmIE9IuaMOyF3z06sc",
     "sync": false
@@ -366,7 +363,7 @@
       "__id__": 1
     },
     "asset": {
-      "__uuid__": "8a738d50-1dac-4b6e-99e1-d241f5ee7169"
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
     },
     "fileId": "04uxaznclAmLRL13XKszPJ",
     "sync": false
@@ -475,11 +472,437 @@
       "__id__": 1
     },
     "asset": {
-      "__uuid__": "8a738d50-1dac-4b6e-99e1-d241f5ee7169"
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
     },
     "fileId": "e4mum5GwxNiZ0T8ouw95jJ",
     "sync": false
   },
+  {
+    "__type__": "cc.Node",
+    "_name": "animNode",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 1
+    },
+    "_children": [
+      {
+        "__id__": 12
+      },
+      {
+        "__id__": 15
+      },
+      {
+        "__id__": 18
+      }
+    ],
+    "_active": true,
+    "_components": [],
+    "_prefab": {
+      "__id__": 21
+    },
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 0
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": ""
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "SoldierElf",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 11
+    },
+    "_children": [],
+    "_active": false,
+    "_components": [
+      {
+        "__id__": 13
+      }
+    ],
+    "_prefab": {
+      "__id__": 14
+    },
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 0
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": ""
+  },
+  {
+    "__type__": "dragonBones.ArmatureDisplay",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 12
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_armatureName": "SoldierElf",
+    "_animationName": "Idle1",
+    "_preCacheMode": 0,
+    "_cacheMode": 0,
+    "playTimes": -1,
+    "premultipliedAlpha": false,
+    "_armatureKey": "affcd973-4743-48e5-9bcd-339180a6101b#24d7bb8f-577c-4e5d-b730-56613ca8685d",
+    "_accTime": 0,
+    "_playCount": 0,
+    "_frameCache": null,
+    "_curFrame": null,
+    "_playing": false,
+    "_armatureCache": null,
+    "_N$dragonAsset": {
+      "__uuid__": "affcd973-4743-48e5-9bcd-339180a6101b"
+    },
+    "_N$dragonAtlasAsset": {
+      "__uuid__": "24d7bb8f-577c-4e5d-b730-56613ca8685d"
+    },
+    "_N$_defaultArmatureIndex": 0,
+    "_N$_animationIndex": 1,
+    "_N$_defaultCacheMode": 0,
+    "_N$timeScale": 1,
+    "_N$debugBones": false,
+    "_N$enableBatch": true,
+    "_id": ""
+  },
+  {
+    "__type__": "cc.PrefabInfo",
+    "root": {
+      "__id__": 1
+    },
+    "asset": {
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
+    },
+    "fileId": "3fs20Yd8dIO68/1Wx2oVLh",
+    "sync": false
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "SoldierFireGhost",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 11
+    },
+    "_children": [],
+    "_active": false,
+    "_components": [
+      {
+        "__id__": 16
+      }
+    ],
+    "_prefab": {
+      "__id__": 17
+    },
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 0
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": ""
+  },
+  {
+    "__type__": "dragonBones.ArmatureDisplay",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 15
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_armatureName": "SoldierFireGhost",
+    "_animationName": "Idle1",
+    "_preCacheMode": 0,
+    "_cacheMode": 0,
+    "playTimes": -1,
+    "premultipliedAlpha": false,
+    "_armatureKey": "36230012-8df3-4e85-afad-76ec47d0e4d7#4a9187d5-a9ad-4464-a03c-d2f3cc277051",
+    "_accTime": 0,
+    "_playCount": 0,
+    "_frameCache": null,
+    "_curFrame": null,
+    "_playing": false,
+    "_armatureCache": null,
+    "_N$dragonAsset": {
+      "__uuid__": "36230012-8df3-4e85-afad-76ec47d0e4d7"
+    },
+    "_N$dragonAtlasAsset": {
+      "__uuid__": "4a9187d5-a9ad-4464-a03c-d2f3cc277051"
+    },
+    "_N$_defaultArmatureIndex": 0,
+    "_N$_animationIndex": 8,
+    "_N$_defaultCacheMode": 0,
+    "_N$timeScale": 1,
+    "_N$debugBones": false,
+    "_N$enableBatch": true,
+    "_id": ""
+  },
+  {
+    "__type__": "cc.PrefabInfo",
+    "root": {
+      "__id__": 1
+    },
+    "asset": {
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
+    },
+    "fileId": "a8ZUEyoP1Ec5azSkL7Z/9h",
+    "sync": false
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "SoldierWaterGhost",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 11
+    },
+    "_children": [],
+    "_active": false,
+    "_components": [
+      {
+        "__id__": 19
+      }
+    ],
+    "_prefab": {
+      "__id__": 20
+    },
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 0
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": ""
+  },
+  {
+    "__type__": "dragonBones.ArmatureDisplay",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 18
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_armatureName": "SoldierWaterGhost",
+    "_animationName": "Idle1",
+    "_preCacheMode": 0,
+    "_cacheMode": 0,
+    "playTimes": -1,
+    "premultipliedAlpha": false,
+    "_armatureKey": "a9d7bbc2-134b-4eb4-ba16-6541f3e51e06#e9e703e9-3589-4713-b889-28b23406d220",
+    "_accTime": 0,
+    "_playCount": 0,
+    "_frameCache": null,
+    "_curFrame": null,
+    "_playing": false,
+    "_armatureCache": null,
+    "_N$dragonAsset": {
+      "__uuid__": "a9d7bbc2-134b-4eb4-ba16-6541f3e51e06"
+    },
+    "_N$dragonAtlasAsset": {
+      "__uuid__": "e9e703e9-3589-4713-b889-28b23406d220"
+    },
+    "_N$_defaultArmatureIndex": 0,
+    "_N$_animationIndex": 8,
+    "_N$_defaultCacheMode": 0,
+    "_N$timeScale": 1,
+    "_N$debugBones": false,
+    "_N$enableBatch": true,
+    "_id": ""
+  },
+  {
+    "__type__": "cc.PrefabInfo",
+    "root": {
+      "__id__": 1
+    },
+    "asset": {
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
+    },
+    "fileId": "42Rmp/YOdMOYWzJwr3ET1h",
+    "sync": false
+  },
+  {
+    "__type__": "cc.PrefabInfo",
+    "root": {
+      "__id__": 1
+    },
+    "asset": {
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
+    },
+    "fileId": "7aN7Gcc/tBw5EGlTJVBj2+",
+    "sync": false
+  },
   {
     "__type__": "cc.Sprite",
     "_name": "",
@@ -506,52 +929,6 @@
     "_atlas": null,
     "_id": ""
   },
-  {
-    "__type__": "cc.Animation",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_defaultClip": {
-      "__uuid__": "28194c48-ae3b-4197-8263-0d474ae8b9bc"
-    },
-    "_clips": [
-      {
-        "__uuid__": "28194c48-ae3b-4197-8263-0d474ae8b9bc"
-      },
-      {
-        "__uuid__": "e1c45a36-2022-4b18-a2db-b5e2e0a120ed"
-      },
-      {
-        "__uuid__": "126dff26-0ace-439d-89b5-b888aa52d159"
-      },
-      {
-        "__uuid__": "95c2d541-8f99-446a-a7e0-094130ce6d41"
-      },
-      {
-        "__uuid__": "380f5fa0-f77f-434a-8f39-d545ee6823c5"
-      },
-      {
-        "__uuid__": "a306c6de-ccd8-492b-bfec-c6be0a4cbde2"
-      },
-      {
-        "__uuid__": "f496072b-51fd-4406-abbd-9885ac23f7a9"
-      },
-      {
-        "__uuid__": "6405ad8b-3084-4b67-8c2e-9b4d34fa3d09"
-      },
-      {
-        "__uuid__": "af16cdcb-6e82-4be6-806d-9fc52ae99fff"
-      },
-      {
-        "__uuid__": "02eba566-4d22-4fa7-99d7-f032f5845421"
-      }
-    ],
-    "playOnLoad": true,
-    "_id": ""
-  },
   {
     "__type__": "b74b05YDqZFRo4OkZRFZX8k",
     "_name": "",
@@ -560,8 +937,10 @@
       "__id__": 1
     },
     "_enabled": true,
-    "animComp": null,
     "lastMovedAt": 0,
+    "animNode": {
+      "__id__": 11
+    },
     "arrowTipNode": {
       "__id__": 8
     },
@@ -570,30 +949,13 @@
     },
     "_id": ""
   },
-  {
-    "__type__": "cc.CircleCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_radius": 12,
-    "_id": ""
-  },
   {
     "__type__": "cc.PrefabInfo",
     "root": {
       "__id__": 1
     },
     "asset": {
-      "__uuid__": "8a738d50-1dac-4b6e-99e1-d241f5ee7169"
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
     },
     "fileId": "4cx75uwJJFa7U8QL187QCL",
     "sync": false

frontend/assets/resources/prefabs/ControlledCharacter.prefab.meta

@@ -1,6 +1,6 @@
 {
   "ver": "1.2.5",
-  "uuid": "31a63530-7811-45bc-a4ee-571faf917e35",
+  "uuid": "59bff7a2-23e1-4d69-bce7-afb37eae196a",
   "optimizationPolicy": "AUTO",
   "asyncLoadAssets": false,
   "readonly": false,

frontend/assets/resources/prefabs/GuardTower.prefab

@@ -1,153 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "GuardTower",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [],
-    "_active": true,
-    "_level": 1,
-    "_components": [
-      {
-        "__id__": 2
-      },
-      {
-        "__id__": 3
-      }
-    ],
-    "_prefab": {
-      "__id__": 4
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 90,
-      "height": 150
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0
-    },
-    "_quat": {
-      "__type__": "cc.Quat",
-      "x": 0,
-      "y": 0,
-      "z": 0,
-      "w": 1
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "groupIndex": 0,
-    "_id": "",
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": null,
-    "_type": 0,
-    "_sizeMode": 2,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": false,
-    "_state": 0,
-    "_atlas": null,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PolygonCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "points": [
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": 50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": 50
-      }
-    ],
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "31a63530-7811-45bc-a4ee-571faf917e35"
-    },
-    "fileId": "cb43NtzzhP0bpzlQHRRrkX",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/Pacman1.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "8a738d50-1dac-4b6e-99e1-d241f5ee7169",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/Pacman2.prefab

@@ -1,601 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false,
-    "readonly": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "Player2",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [
-      {
-        "__id__": 2
-      },
-      {
-        "__id__": 5
-      },
-      {
-        "__id__": 8
-      }
-    ],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 11
-      },
-      {
-        "__id__": 12
-      },
-      {
-        "__id__": 13
-      },
-      {
-        "__id__": 14
-      }
-    ],
-    "_prefab": {
-      "__id__": 15
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 120,
-      "height": 120
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        3,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 2,
-    "groupIndex": 2,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "CoordinateLabel",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 1
-    },
-    "_children": [],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 3
-      }
-    ],
-    "_prefab": {
-      "__id__": 4
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 46.68,
-      "height": 27.72
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        -5,
-        50,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.Label",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 2
-    },
-    "_enabled": true,
-    "_materials": [
-      {
-        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
-      }
-    ],
-    "_useOriginalSize": false,
-    "_string": "(0, 0)",
-    "_N$string": "(0, 0)",
-    "_fontSize": 20,
-    "_lineHeight": 22,
-    "_enableWrapText": true,
-    "_N$file": null,
-    "_isSystemFontUsed": true,
-    "_spacingX": 0,
-    "_batchAsBitmap": false,
-    "_N$horizontalAlign": 1,
-    "_N$verticalAlign": 1,
-    "_N$fontFamily": "Arial",
-    "_N$overflow": 0,
-    "_N$cacheMode": 0,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "1f479636-9eb8-4612-8f97-371964d6eae3"
-    },
-    "fileId": "5apzDmIE9IuaMOyF3z06sc",
-    "sync": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "particlesystem",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 1
-    },
-    "_children": [],
-    "_active": false,
-    "_components": [
-      {
-        "__id__": 6
-      }
-    ],
-    "_prefab": {
-      "__id__": 7
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 0,
-      "height": 0
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.ParticleSystem",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 5
-    },
-    "_enabled": true,
-    "_materials": [],
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 1,
-    "_custom": true,
-    "_file": {
-      "__uuid__": "b2687ac4-099e-403c-a192-ff477686f4f5"
-    },
-    "_spriteFrame": {
-      "__uuid__": "472df5d3-35e7-4184-9e6c-7f41bee65ee3"
-    },
-    "_texture": null,
-    "_stopped": false,
-    "playOnLoad": true,
-    "autoRemoveOnFinish": false,
-    "totalParticles": 200,
-    "duration": -1,
-    "emissionRate": 999.999985098839,
-    "life": 0.20000000298023224,
-    "lifeVar": 0.5,
-    "_startColor": {
-      "__type__": "cc.Color",
-      "r": 202,
-      "g": 200,
-      "b": 86,
-      "a": 163
-    },
-    "_startColorVar": {
-      "__type__": "cc.Color",
-      "r": 229,
-      "g": 255,
-      "b": 173,
-      "a": 198
-    },
-    "_endColor": {
-      "__type__": "cc.Color",
-      "r": 173,
-      "g": 161,
-      "b": 19,
-      "a": 214
-    },
-    "_endColorVar": {
-      "__type__": "cc.Color",
-      "r": 107,
-      "g": 249,
-      "b": 249,
-      "a": 188
-    },
-    "angle": 360,
-    "angleVar": 360,
-    "startSize": 3.369999885559082,
-    "startSizeVar": 50,
-    "endSize": 30.31999969482422,
-    "endSizeVar": 0,
-    "startSpin": -47.369998931884766,
-    "startSpinVar": 0,
-    "endSpin": -47.369998931884766,
-    "endSpinVar": -142.11000061035156,
-    "sourcePos": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "posVar": {
-      "__type__": "cc.Vec2",
-      "x": 7,
-      "y": 7
-    },
-    "_positionType": 1,
-    "positionType": 1,
-    "emitterMode": 0,
-    "gravity": {
-      "__type__": "cc.Vec2",
-      "x": 0.25,
-      "y": 0.8600000143051147
-    },
-    "speed": 0,
-    "speedVar": 190.7899932861328,
-    "tangentialAccel": -92.11000061035156,
-    "tangentialAccelVar": 65.79000091552734,
-    "radialAccel": -671.0499877929688,
-    "radialAccelVar": 65.79000091552734,
-    "rotationIsDir": false,
-    "startRadius": 0,
-    "startRadiusVar": 0,
-    "endRadius": 0,
-    "endRadiusVar": 0,
-    "rotatePerS": 0,
-    "rotatePerSVar": 0,
-    "_N$preview": true,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "1f479636-9eb8-4612-8f97-371964d6eae3"
-    },
-    "fileId": "04uxaznclAmLRL13XKszPJ",
-    "sync": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "arrowTip",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 1
-    },
-    "_children": [],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 9
-      }
-    ],
-    "_prefab": {
-      "__id__": 10
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 76,
-      "height": 84
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        177,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 8
-    },
-    "_enabled": true,
-    "_materials": [
-      {
-        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
-      }
-    ],
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": {
-      "__uuid__": "a2170e4c-df31-41ef-be73-f4f605e75821"
-    },
-    "_type": 0,
-    "_sizeMode": 1,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_atlas": {
-      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
-    },
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "1f479636-9eb8-4612-8f97-371964d6eae3"
-    },
-    "fileId": "6bwyYXs/lD7ba69sgDrsn5",
-    "sync": false
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_materials": [],
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": null,
-    "_type": 0,
-    "_sizeMode": 0,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_atlas": null,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.Animation",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_defaultClip": {
-      "__uuid__": "115ea7bb-d47f-4d3c-a52a-f46584346c3f"
-    },
-    "_clips": [
-      {
-        "__uuid__": "a1bf7c7c-b9f7-4b65-86e3-f86a9e798fb6"
-      },
-      {
-        "__uuid__": "115ea7bb-d47f-4d3c-a52a-f46584346c3f"
-      },
-      {
-        "__uuid__": "d5af527a-9f0c-4398-b2dd-84426be7bd32"
-      },
-      {
-        "__uuid__": "b60618d7-569d-4f13-bdeb-f20341fbadb6"
-      },
-      {
-        "__uuid__": "0b3fb38e-9110-4191-9b72-6b64a224d049"
-      },
-      {
-        "__uuid__": "1bc6de53-800b-4da3-ab8e-4a45e3aa4230"
-      },
-      {
-        "__uuid__": "ee0d670c-893e-4e4d-96dd-5571db18ee97"
-      },
-      {
-        "__uuid__": "596df84a-2e4e-4f1d-967c-a82649f564a8"
-      },
-      {
-        "__uuid__": "8acc4e9f-3c47-4b66-9a9d-d012709680f6"
-      },
-      {
-        "__uuid__": "c7cda0cd-dbce-4722-abd2-aeca28263a21"
-      }
-    ],
-    "playOnLoad": true,
-    "_id": ""
-  },
-  {
-    "__type__": "b74b05YDqZFRo4OkZRFZX8k",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "animComp": null,
-    "lastMovedAt": 0,
-    "arrowTipNode": {
-      "__id__": 8
-    },
-    "coordLabel": {
-      "__id__": 3
-    },
-    "_id": ""
-  },
-  {
-    "__type__": "cc.CircleCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_radius": 12,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "1f479636-9eb8-4612-8f97-371964d6eae3"
-    },
-    "fileId": "4cx75uwJJFa7U8QL187QCL",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/Pacman2.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "1f479636-9eb8-4612-8f97-371964d6eae3",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/PolygonBoundaryBarrier.prefab

@@ -1,118 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_rawFiles": null,
-    "data": {
-      "__id__": 1
-    }
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "PolygonBoundaryBarrier",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [],
-    "_tag": -1,
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 2
-      }
-    ],
-    "_prefab": {
-      "__id__": 3
-    },
-    "_id": "",
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_cascadeOpacityEnabled": true,
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 0,
-      "height": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_localZOrder": 0,
-    "_globalZOrder": 0,
-    "_opacityModifyRGB": false,
-    "groupIndex": 1,
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.PolygonCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "points": [
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": 50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": 50
-      }
-    ]
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__id__": 0
-    },
-    "fileId": "e6gF9LdulAgYGTgO3/Pye8",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/PolygonBoundaryBarrier.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "4154eec0-d644-482f-a889-c00ae6b69958",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/PolygonBoundaryShelter.prefab

@@ -1,125 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "PolygonBoundaryShelter",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [],
-    "_active": true,
-    "_level": 1,
-    "_components": [
-      {
-        "__id__": 2
-      }
-    ],
-    "_prefab": {
-      "__id__": 3
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 0,
-      "height": 0
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_quat": {
-      "__type__": "cc.Quat",
-      "x": 0,
-      "y": 0,
-      "z": 0,
-      "w": 1
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_zIndex": 0,
-    "groupIndex": 4,
-    "_id": "",
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        -192,
-        43,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.PolygonCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "points": [
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": 50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": 50
-      }
-    ],
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "f820a6ec-e7a9-46cf-9b8a-331aa3e21487"
-    },
-    "fileId": "f8scmoFllMboAtkaldeiym",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/PolygonBoundaryShelter.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "f820a6ec-e7a9-46cf-9b8a-331aa3e21487",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/PolygonBoundaryShelterZReducer.prefab

@@ -1,125 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "PolygonBoundaryShelterZReducer",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [],
-    "_active": true,
-    "_level": 1,
-    "_components": [
-      {
-        "__id__": 2
-      }
-    ],
-    "_prefab": {
-      "__id__": 3
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 0,
-      "height": 0
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_quat": {
-      "__type__": "cc.Quat",
-      "x": 0,
-      "y": 0,
-      "z": 0,
-      "w": 1
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_zIndex": 0,
-    "groupIndex": 3,
-    "_id": "",
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.PolygonCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "points": [
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": 50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": 50
-      }
-    ],
-    "_id": "e6q3kwlllDC425mW1I4/O5"
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "a36d024b-a979-4d18-b089-19af313ffb82"
-    },
-    "fileId": "fajJ28qMxI0YDyTCPlWINd",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/PolygonBoundaryShelterZReducer.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "a36d024b-a979-4d18-b089-19af313ffb82",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/TiledAnim.prefab

@@ -1,132 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "TiledAnim",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [],
-    "_active": true,
-    "_level": 1,
-    "_components": [
-      {
-        "__id__": 2
-      },
-      {
-        "__id__": 3
-      }
-    ],
-    "_prefab": {
-      "__id__": 4
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 56,
-      "height": 58
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_quat": {
-      "__type__": "cc.Quat",
-      "x": 0,
-      "y": 0,
-      "z": 0,
-      "w": 1
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "groupIndex": 0,
-    "_id": "",
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_spriteFrame": {
-      "__uuid__": "cc1486e4-5c38-4a73-a0d3-70416d0dd57f"
-    },
-    "_type": 0,
-    "_sizeMode": 1,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_state": 0,
-    "_atlas": {
-      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
-    },
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.Animation",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_defaultClip": null,
-    "_clips": [],
-    "playOnLoad": true,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "1c02b0a0-859a-4467-86b3-ca39c30d1e19"
-    },
-    "fileId": "60dCvhukpIsL1FtdnqBIor",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/TiledAnim.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "1c02b0a0-859a-4467-86b3-ca39c30d1e19",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/TrapPrefab.prefab

@@ -1,157 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "treasureNodePrefab",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [],
-    "_active": true,
-    "_level": 1,
-    "_components": [
-      {
-        "__id__": 2
-      },
-      {
-        "__id__": 3
-      }
-    ],
-    "_prefab": {
-      "__id__": 4
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 100,
-      "height": 100
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_quat": {
-      "__type__": "cc.Quat",
-      "x": 0,
-      "y": 0,
-      "z": 0,
-      "w": 1
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "groupIndex": 0,
-    "_id": "",
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        441,
-        814,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    }
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_spriteFrame": {
-      "__uuid__": "350fd890-3d28-4e53-9dfa-1bf00d857737"
-    },
-    "_type": 0,
-    "_sizeMode": 0,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_state": 0,
-    "_atlas": {
-      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
-    },
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PolygonCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "points": [
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": 50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": 50
-      }
-    ],
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "9f340a31-ddfa-46c2-94c7-d11615aedcb1"
-    },
-    "fileId": "dc8aAweIBDDYuXBJblR5IA",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/TrapPrefab.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "9f340a31-ddfa-46c2-94c7-d11615aedcb1",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/resources/prefabs/TreasurePrefab.prefab

@@ -1,167 +0,0 @@
-[
-  {
-    "__type__": "cc.Prefab",
-    "_name": "",
-    "_objFlags": 0,
-    "_native": "",
-    "data": {
-      "__id__": 1
-    },
-    "optimizationPolicy": 0,
-    "asyncLoadAssets": false,
-    "readonly": false
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "treasureNodePrefab",
-    "_objFlags": 0,
-    "_parent": null,
-    "_children": [],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 2
-      },
-      {
-        "__id__": 3
-      },
-      {
-        "__id__": 4
-      }
-    ],
-    "_prefab": {
-      "__id__": 5
-    },
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 64,
-      "height": 64
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_materials": [],
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": null,
-    "_type": 0,
-    "_sizeMode": 2,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_atlas": null,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PolygonCollider",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "tag": 0,
-    "_offset": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "points": [
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": -50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": 50,
-        "y": 50
-      },
-      {
-        "__type__": "cc.Vec2",
-        "x": -50,
-        "y": 50
-      }
-    ],
-    "_id": ""
-  },
-  {
-    "__type__": "5eea6zlA0NHdoCk/M1pvQmb",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 1
-    },
-    "_enabled": true,
-    "_id": ""
-  },
-  {
-    "__type__": "cc.PrefabInfo",
-    "root": {
-      "__id__": 1
-    },
-    "asset": {
-      "__uuid__": "ec3f3234-9b84-43c2-a3cd-58b924cce8e5"
-    },
-    "fileId": "dc8aAweIBDDYuXBJblR5IA",
-    "sync": false
-  }
-]

frontend/assets/resources/prefabs/TreasurePrefab.prefab.meta

@@ -1,8 +0,0 @@
-{
-  "ver": "1.2.5",
-  "uuid": "ec3f3234-9b84-43c2-a3cd-58b924cce8e5",
-  "optimizationPolicy": "AUTO",
-  "asyncLoadAssets": false,
-  "readonly": false,
-  "subMetas": {}
-}

frontend/assets/scenes/default_map.fire

@@ -80,20 +80,20 @@
     ],
     "_active": true,
     "_components": [
+      {
+        "__id__": 31
+      },
+      {
+        "__id__": 32
+      },
+      {
+        "__id__": 33
+      },
       {
         "__id__": 34
       },
       {
         "__id__": 35
-      },
-      {
-        "__id__": 36
-      },
-      {
-        "__id__": 37
-      },
-      {
-        "__id__": 38
       }
     ],
     "_prefab": null,
@@ -234,7 +234,7 @@
         "__id__": 7
       },
       {
-        "__id__": 33
+        "__id__": 30
       }
     ],
     "_prefab": null,
@@ -307,23 +307,11 @@
     "canvasNode": {
       "__id__": 2
     },
-    "tiledAnimPrefab": {
-      "__uuid__": "1c02b0a0-859a-4467-86b3-ca39c30d1e19"
-    },
-    "player1Prefab": {
-      "__uuid__": "8a738d50-1dac-4b6e-99e1-d241f5ee7169"
-    },
-    "player2Prefab": {
-      "__uuid__": "1f479636-9eb8-4612-8f97-371964d6eae3"
-    },
-    "polygonBoundaryBarrierPrefab": {
-      "__uuid__": "4154eec0-d644-482f-a889-c00ae6b69958"
-    },
-    "keyboardInputControllerNode": {
-      "__id__": 8
+    "controlledCharacterPrefab": {
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
     },
     "joystickInputControllerNode": {
-      "__id__": 22
+      "__id__": 8
     },
     "confirmLogoutPrefab": {
       "__uuid__": "8e8c1a65-623d-42ba-97a7-820ce518ea11"
@@ -335,7 +323,7 @@
       "__id__": 17
     },
     "countdownLabel": {
-      "__id__": 30
+      "__id__": 23
     },
     "resultPanelPrefab": {
       "__uuid__": "c4cfe3bd-c59e-4d5b-95cb-c933b120e184"
@@ -353,28 +341,27 @@
       "__uuid__": "b4e519f4-e698-4403-9ff2-47b8dacb077e"
     },
     "forceBigEndianFloatingNumDecoding": false,
-    "backgroundMapTiledIns": {
-      "__id__": 4
-    },
     "renderFrameIdLagTolerance": 4,
-    "teleportEps1D": 0.001,
+    "jigglingEps1D": 0.001,
+    "bulletTriggerEnabled": true,
     "_id": "d12gkAmppNlIzqcRDELa91"
   },
   {
     "__type__": "cc.Node",
-    "_name": "KeyboardControlsMount",
+    "_name": "JoystickContainer",
     "_objFlags": 0,
     "_parent": {
       "__id__": 9
     },
-    "_children": [],
+    "_children": [
+      {
+        "__id__": 24
+      }
+    ],
     "_active": true,
     "_components": [
       {
-        "__id__": 31
-      },
-      {
-        "__id__": 32
+        "__id__": 29
       }
     ],
     "_prefab": null,
@@ -388,8 +375,8 @@
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 0,
-      "height": 50.4
+      "width": 1280,
+      "height": 640
     },
     "_anchorPoint": {
       "__type__": "cc.Vec2",
@@ -400,8 +387,8 @@
       "__type__": "TypedArray",
       "ctor": "Float64Array",
       "array": [
-        -341.33333,
-        -640,
+        0,
+        -500,
         0,
         0,
         0,
@@ -423,7 +410,7 @@
     "_is3DNode": false,
     "_groupIndex": 0,
     "groupIndex": 0,
-    "_id": "e6nL+1zEhLmLSaT8R/9UgD"
+    "_id": "81iBXkC0lFt5FFUUD0k3xE"
   },
   {
     "__type__": "cc.Node",
@@ -441,9 +428,6 @@
       },
       {
         "__id__": 22
-      },
-      {
-        "__id__": 29
       }
     ],
     "_active": true,
@@ -539,7 +523,7 @@
       "array": [
         0,
         0,
-        342.9460598986377,
+        210.23252687912068,
         0,
         0,
         0,
@@ -1041,325 +1025,6 @@
     "_N$affectedByScale": false,
     "_id": "f6GkgYwn9JvKLqbGG1zmeD"
   },
-  {
-    "__type__": "cc.Node",
-    "_name": "JoystickContainer",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 9
-    },
-    "_children": [
-      {
-        "__id__": 23
-      }
-    ],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 28
-      }
-    ],
-    "_prefab": null,
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 1280,
-      "height": 640
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        -500,
-        0,
-        0,
-        0,
-        0,
-        1,
-        0.66667,
-        0.66667,
-        0.66667
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": "81iBXkC0lFt5FFUUD0k3xE"
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "JoystickBG",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 22
-    },
-    "_children": [
-      {
-        "__id__": 24
-      }
-    ],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 26
-      },
-      {
-        "__id__": 27
-      }
-    ],
-    "_prefab": null,
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 400,
-      "height": 400
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        1,
-        1,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": "88u3wQvvdO8pbrNWhs3ifP"
-  },
-  {
-    "__type__": "cc.Node",
-    "_name": "Joystick",
-    "_objFlags": 0,
-    "_parent": {
-      "__id__": 23
-    },
-    "_children": [],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 25
-      }
-    ],
-    "_prefab": null,
-    "_opacity": 255,
-    "_color": {
-      "__type__": "cc.Color",
-      "r": 255,
-      "g": 255,
-      "b": 255,
-      "a": 255
-    },
-    "_contentSize": {
-      "__type__": "cc.Size",
-      "width": 150,
-      "height": 150
-    },
-    "_anchorPoint": {
-      "__type__": "cc.Vec2",
-      "x": 0.5,
-      "y": 0.5
-    },
-    "_trs": {
-      "__type__": "TypedArray",
-      "ctor": "Float64Array",
-      "array": [
-        0,
-        0,
-        0,
-        0,
-        0,
-        0,
-        1,
-        0.8,
-        0.8,
-        1
-      ]
-    },
-    "_eulerAngles": {
-      "__type__": "cc.Vec3",
-      "x": 0,
-      "y": 0,
-      "z": 0
-    },
-    "_skewX": 0,
-    "_skewY": 0,
-    "_is3DNode": false,
-    "_groupIndex": 0,
-    "groupIndex": 0,
-    "_id": "3eybpdW/JK3aDeXxdE86VD"
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 24
-    },
-    "_enabled": true,
-    "_materials": [
-      {
-        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
-      }
-    ],
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": {
-      "__uuid__": "7d4baacd-294c-4a5d-9cd6-5d36e4394c9e"
-    },
-    "_type": 0,
-    "_sizeMode": 0,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_atlas": {
-      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
-    },
-    "_id": "7dr8DOX01K7YFqWlRy1ATp"
-  },
-  {
-    "__type__": "cc.Sprite",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 23
-    },
-    "_enabled": true,
-    "_materials": [
-      {
-        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
-      }
-    ],
-    "_srcBlendFactor": 770,
-    "_dstBlendFactor": 771,
-    "_spriteFrame": {
-      "__uuid__": "447f7cfe-e678-4424-be03-0afdab8659de"
-    },
-    "_type": 0,
-    "_sizeMode": 0,
-    "_fillType": 0,
-    "_fillCenter": {
-      "__type__": "cc.Vec2",
-      "x": 0,
-      "y": 0
-    },
-    "_fillStart": 0,
-    "_fillRange": 0,
-    "_isTrimmedMode": true,
-    "_atlas": {
-      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
-    },
-    "_id": "b28Bh9ZcpM+7K3Bd3bmNf0"
-  },
-  {
-    "__type__": "cc.Widget",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 23
-    },
-    "_enabled": true,
-    "alignMode": 0,
-    "_target": null,
-    "_alignFlags": 0,
-    "_left": 40,
-    "_right": 0,
-    "_top": 0,
-    "_bottom": 10,
-    "_verticalCenter": 0,
-    "_horizontalCenter": 0,
-    "_isAbsLeft": true,
-    "_isAbsRight": true,
-    "_isAbsTop": true,
-    "_isAbsBottom": true,
-    "_isAbsHorizontalCenter": true,
-    "_isAbsVerticalCenter": true,
-    "_originalWidth": 0,
-    "_originalHeight": 0,
-    "_id": "c0cEsj4LpMcZZEldELidxy"
-  },
-  {
-    "__type__": "cc.Widget",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 22
-    },
-    "_enabled": true,
-    "alignMode": 0,
-    "_target": null,
-    "_alignFlags": 0,
-    "_left": 278,
-    "_right": 480.0000000000002,
-    "_top": 544,
-    "_bottom": 0,
-    "_verticalCenter": 0,
-    "_horizontalCenter": 0,
-    "_isAbsLeft": true,
-    "_isAbsRight": true,
-    "_isAbsTop": true,
-    "_isAbsBottom": true,
-    "_isAbsHorizontalCenter": true,
-    "_isAbsVerticalCenter": true,
-    "_originalWidth": 480,
-    "_originalHeight": 0,
-    "_id": "2cxYjEIwNO6rUtXX4WcfnV"
-  },
   {
     "__type__": "cc.Node",
     "_name": "CountdownSeconds",
@@ -1371,7 +1036,7 @@
     "_active": true,
     "_components": [
       {
-        "__id__": 30
+        "__id__": 23
       }
     ],
     "_prefab": null,
@@ -1427,7 +1092,7 @@
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 29
+      "__id__": 22
     },
     "_enabled": true,
     "_materials": [
@@ -1453,11 +1118,142 @@
     "_id": "dfxSFl+shLcY+0v45FJtGo"
   },
   {
-    "__type__": "cc.Label",
+    "__type__": "cc.Node",
+    "_name": "JoystickBG",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 8
+    },
+    "_children": [
+      {
+        "__id__": 25
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 27
+      },
+      {
+        "__id__": 28
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 400,
+      "height": 400
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "88u3wQvvdO8pbrNWhs3ifP"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Joystick",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 24
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 26
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 150
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        0.8,
+        0.8,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "3eybpdW/JK3aDeXxdE86VD"
+  },
+  {
+    "__type__": "cc.Sprite",
     "_name": "",
     "_objFlags": 0,
     "node": {
-      "__id__": 8
+      "__id__": 25
     },
     "_enabled": true,
     "_materials": [
@@ -1465,32 +1261,114 @@
         "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
       }
     ],
-    "_useOriginalSize": false,
-    "_string": "",
-    "_N$string": "",
-    "_fontSize": 40,
-    "_lineHeight": 40,
-    "_enableWrapText": true,
-    "_N$file": null,
-    "_isSystemFontUsed": true,
-    "_spacingX": 0,
-    "_batchAsBitmap": false,
-    "_N$horizontalAlign": 1,
-    "_N$verticalAlign": 1,
-    "_N$fontFamily": "Arial",
-    "_N$overflow": 0,
-    "_N$cacheMode": 0,
-    "_id": "9cS5BRd+NKJIvGQiojJtIs"
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "7d4baacd-294c-4a5d-9cd6-5d36e4394c9e"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": {
+      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
+    },
+    "_id": "7dr8DOX01K7YFqWlRy1ATp"
   },
   {
-    "__type__": "4561aFzv9JPZLe6iIzODk2d",
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 24
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "447f7cfe-e678-4424-be03-0afdab8659de"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": {
+      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
+    },
+    "_id": "b28Bh9ZcpM+7K3Bd3bmNf0"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 24
+    },
+    "_enabled": true,
+    "alignMode": 0,
+    "_target": null,
+    "_alignFlags": 0,
+    "_left": 40,
+    "_right": 0,
+    "_top": 0,
+    "_bottom": 10,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 0,
+    "_originalHeight": 0,
+    "_id": "c0cEsj4LpMcZZEldELidxy"
+  },
+  {
+    "__type__": "cc.Widget",
     "_name": "",
     "_objFlags": 0,
     "node": {
       "__id__": 8
     },
     "_enabled": true,
-    "_id": "5ahzSYC8pCCLVPCBYyCRfZ"
+    "alignMode": 0,
+    "_target": null,
+    "_alignFlags": 0,
+    "_left": 278,
+    "_right": 480.0000000000002,
+    "_top": 544,
+    "_bottom": 0,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 480,
+    "_originalHeight": 0,
+    "_id": "2cxYjEIwNO6rUtXX4WcfnV"
   },
   {
     "__type__": "09e1b/tEy5K2qaPIpqHDbae",
@@ -1600,16 +1478,16 @@
     },
     "_enabled": true,
     "translationListenerNode": {
-      "__id__": 22
+      "__id__": 8
     },
     "zoomingListenerNode": {
       "__id__": 5
     },
     "stickhead": {
-      "__id__": 24
+      "__id__": 25
     },
     "base": {
-      "__id__": 23
+      "__id__": 24
     },
     "joyStickEps": 0.1,
     "magicLeanLowerBound": 0.414,

frontend/assets/scenes/login.fire

@@ -440,7 +440,7 @@
       "array": [
         0,
         0,
-        371.5248982235242,
+        216.50635094610968,
         0,
         0,
         0,

frontend/assets/scenes/offline_map_1.fire

@@ -0,0 +1,972 @@
+[
+  {
+    "__type__": "cc.SceneAsset",
+    "_name": "",
+    "_objFlags": 0,
+    "_native": "",
+    "scene": {
+      "__id__": 1
+    }
+  },
+  {
+    "__type__": "cc.Scene",
+    "_objFlags": 0,
+    "_parent": null,
+    "_children": [
+      {
+        "__id__": 2
+      }
+    ],
+    "_active": false,
+    "_components": [],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 0
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_is3DNode": true,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "autoReleaseAssets": false,
+    "_id": "368b10b6-88fc-423c-9fcd-545d9fc673bd"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Canvas",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 1
+    },
+    "_children": [
+      {
+        "__id__": 3
+      },
+      {
+        "__id__": 9
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 19
+      },
+      {
+        "__id__": 20
+      },
+      {
+        "__id__": 21
+      },
+      {
+        "__id__": 22
+      },
+      {
+        "__id__": 23
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 1024,
+      "height": 1920
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        512,
+        960,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "daDUxCjRFEHak7fx7LvgSJ"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Map",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 2
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 4
+      },
+      {
+        "__id__": 5
+      },
+      {
+        "__id__": 6
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 3200,
+      "height": 3200
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "79f0Sv9OVGwbY3M3efHnGf"
+  },
+  {
+    "__type__": "cc.TiledMap",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 3
+    },
+    "_enabled": true,
+    "_tmxFile": null,
+    "_id": "c8MqKDLJdKz7VhPwMjScDw"
+  },
+  {
+    "__type__": "09e1b/tEy5K2qaPIpqHDbae",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 3
+    },
+    "_enabled": true,
+    "BGMEffect": {
+      "__uuid__": "64a79efa-97de-4cb5-b2a9-01500c60573a"
+    },
+    "crashedByTrapBullet": {
+      "__uuid__": "1d604e42-8cee-466f-884d-e74cae21ce3b"
+    },
+    "highScoreTreasurePicked": {
+      "__uuid__": "0164d22c-d965-461f-867e-b30e2d56cc5c"
+    },
+    "treasurePicked": {
+      "__uuid__": "7704b97e-6367-420c-b7af-d0750a2bbb30"
+    },
+    "countDown10SecToEnd": {
+      "__uuid__": "261d1d7d-a5cc-4cb7-a737-194427055fd4"
+    },
+    "mapNode": {
+      "__id__": 3
+    },
+    "_id": "3crA1nz5xPSLAnCSLQIPOq"
+  },
+  {
+    "__type__": "47d7dy4S4lB2pxqJJlGOoai",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 3
+    },
+    "_enabled": true,
+    "canvasNode": {
+      "__id__": 2
+    },
+    "controlledCharacterPrefab": {
+      "__uuid__": "59bff7a2-23e1-4d69-bce7-afb37eae196a"
+    },
+    "joystickInputControllerNode": {
+      "__id__": 7
+    },
+    "confirmLogoutPrefab": null,
+    "simplePressToGoDialogPrefab": null,
+    "boundRoomIdLabel": null,
+    "countdownLabel": null,
+    "resultPanelPrefab": null,
+    "gameRulePrefab": null,
+    "findingPlayerPrefab": null,
+    "countdownToBeginGamePrefab": null,
+    "playersInfoPrefab": null,
+    "forceBigEndianFloatingNumDecoding": false,
+    "renderFrameIdLagTolerance": 4,
+    "jigglingEps1D": 0.001,
+    "bulletTriggerEnabled": true,
+    "_id": "4b+kZ46VhC0LCBixXEK2dk"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "JoystickContainer",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 8
+    },
+    "_children": [
+      {
+        "__id__": 13
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 18
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 1280,
+      "height": 640
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        -500,
+        0,
+        0,
+        0,
+        0,
+        1,
+        0.66667,
+        0.66667,
+        0.66667
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "81iBXkC0lFt5FFUUD0k3xE"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "WidgetsAboveAll",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 9
+    },
+    "_children": [
+      {
+        "__id__": 7
+      },
+      {
+        "__id__": 11
+      }
+    ],
+    "_active": true,
+    "_components": [],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 0
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "c6fPdAUURDX69j0zTeIFZv"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Main Camera",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 2
+    },
+    "_children": [
+      {
+        "__id__": 8
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 10
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 0
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        216.50635094610968,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "76BOk0enxN+b20dtIJ3uk2"
+  },
+  {
+    "__type__": "cc.Camera",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 9
+    },
+    "_enabled": true,
+    "_cullingMask": 4294967295,
+    "_clearFlags": 7,
+    "_backgroundColor": {
+      "__type__": "cc.Color",
+      "r": 0,
+      "g": 0,
+      "b": 0,
+      "a": 255
+    },
+    "_depth": -1,
+    "_zoomRatio": 1.5,
+    "_targetTexture": null,
+    "_fov": 60,
+    "_orthoSize": 10,
+    "_nearClip": 1,
+    "_farClip": 4096,
+    "_ortho": true,
+    "_rect": {
+      "__type__": "cc.Rect",
+      "x": 0,
+      "y": 0,
+      "width": 1,
+      "height": 1
+    },
+    "_renderStages": 1,
+    "_alignWithScreen": true,
+    "_id": "50qiPTLS9NhbPa+JZU0jOP"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "CountdownSeconds",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 8
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 12
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 0,
+      "height": 88.2
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        591,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "f6HMd9ebFPppe/Lu0Ry/qk"
+  },
+  {
+    "__type__": "cc.Label",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 11
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_useOriginalSize": false,
+    "_string": "",
+    "_N$string": "",
+    "_fontSize": 70,
+    "_lineHeight": 70,
+    "_enableWrapText": true,
+    "_N$file": null,
+    "_isSystemFontUsed": true,
+    "_spacingX": 0,
+    "_batchAsBitmap": false,
+    "_N$horizontalAlign": 1,
+    "_N$verticalAlign": 1,
+    "_N$fontFamily": "Arial",
+    "_N$overflow": 0,
+    "_N$cacheMode": 0,
+    "_id": "dfxSFl+shLcY+0v45FJtGo"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "JoystickBG",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 7
+    },
+    "_children": [
+      {
+        "__id__": 14
+      }
+    ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 16
+      },
+      {
+        "__id__": 17
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 400,
+      "height": 400
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        1,
+        1,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "88u3wQvvdO8pbrNWhs3ifP"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Joystick",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 13
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 15
+      }
+    ],
+    "_prefab": null,
+    "_opacity": 255,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 150,
+      "height": 150
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_trs": {
+      "__type__": "TypedArray",
+      "ctor": "Float64Array",
+      "array": [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        1,
+        0.8,
+        0.8,
+        1
+      ]
+    },
+    "_eulerAngles": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_skewX": 0,
+    "_skewY": 0,
+    "_is3DNode": false,
+    "_groupIndex": 0,
+    "groupIndex": 0,
+    "_id": "3eybpdW/JK3aDeXxdE86VD"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 14
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "7d4baacd-294c-4a5d-9cd6-5d36e4394c9e"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": {
+      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
+    },
+    "_id": "7dr8DOX01K7YFqWlRy1ATp"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 13
+    },
+    "_enabled": true,
+    "_materials": [
+      {
+        "__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
+      }
+    ],
+    "_srcBlendFactor": 770,
+    "_dstBlendFactor": 771,
+    "_spriteFrame": {
+      "__uuid__": "447f7cfe-e678-4424-be03-0afdab8659de"
+    },
+    "_type": 0,
+    "_sizeMode": 0,
+    "_fillType": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_atlas": {
+      "__uuid__": "030d9286-e8a2-40cf-98f8-baf713f0b8c4"
+    },
+    "_id": "b28Bh9ZcpM+7K3Bd3bmNf0"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 13
+    },
+    "_enabled": true,
+    "alignMode": 0,
+    "_target": null,
+    "_alignFlags": 0,
+    "_left": 40,
+    "_right": 0,
+    "_top": 0,
+    "_bottom": 10,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 0,
+    "_originalHeight": 0,
+    "_id": "c0cEsj4LpMcZZEldELidxy"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 7
+    },
+    "_enabled": true,
+    "alignMode": 0,
+    "_target": null,
+    "_alignFlags": 0,
+    "_left": 278,
+    "_right": 480.0000000000002,
+    "_top": 544,
+    "_bottom": 0,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 480,
+    "_originalHeight": 0,
+    "_id": "2cxYjEIwNO6rUtXX4WcfnV"
+  },
+  {
+    "__type__": "cc.Canvas",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 2
+    },
+    "_enabled": true,
+    "_designResolution": {
+      "__type__": "cc.Size",
+      "width": 1024,
+      "height": 1920
+    },
+    "_fitWidth": true,
+    "_fitHeight": false,
+    "_id": "94aSq7GcJJZ7A6IzMerm1J"
+  },
+  {
+    "__type__": "8ac08Cb+Y1M/6ZsO9niGOzW",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 2
+    },
+    "_enabled": true,
+    "map": {
+      "__id__": 3
+    },
+    "_id": "84o2sgpN1NRqlN9x7mSzBj"
+  },
+  {
+    "__type__": "78830/HTiVJoaf8n504g/J4",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 2
+    },
+    "_enabled": true,
+    "mapNode": {
+      "__id__": 3
+    },
+    "speed": 5000,
+    "_id": "76ImpM7XtPSbiLHDXdsJa+"
+  },
+  {
+    "__type__": "cc.Widget",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 2
+    },
+    "_enabled": true,
+    "alignMode": 0,
+    "_target": null,
+    "_alignFlags": 0,
+    "_left": 6240,
+    "_right": -4000,
+    "_top": -8320,
+    "_bottom": 10880,
+    "_verticalCenter": 0,
+    "_horizontalCenter": 0,
+    "_isAbsLeft": true,
+    "_isAbsRight": true,
+    "_isAbsTop": true,
+    "_isAbsBottom": true,
+    "_isAbsHorizontalCenter": true,
+    "_isAbsVerticalCenter": true,
+    "_originalWidth": 960,
+    "_originalHeight": 640,
+    "_id": "a8lQ6mB8RMRajCXQCzw1kG"
+  },
+  {
+    "__type__": "d34e3c4jd5NqYtg8ltL9QST",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 2
+    },
+    "_enabled": true,
+    "translationListenerNode": {
+      "__id__": 7
+    },
+    "zoomingListenerNode": {
+      "__id__": 3
+    },
+    "stickhead": {
+      "__id__": 14
+    },
+    "base": {
+      "__id__": 13
+    },
+    "joyStickEps": 0.1,
+    "magicLeanLowerBound": 0.414,
+    "magicLeanUpperBound": 2.414,
+    "linearScaleFacBase": 1,
+    "minScale": 1,
+    "maxScale": 2,
+    "maxMovingBufferLength": 1,
+    "zoomingScaleFacBase": 0.1,
+    "zoomingSpeedBase": 4,
+    "linearSpeedBase": 320,
+    "canvasNode": {
+      "__id__": 2
+    },
+    "mapNode": {
+      "__id__": 3
+    },
+    "linearMovingEps": 0.1,
+    "scaleByEps": 0.0375,
+    "_id": "e9oVYTr7ROlpp/IrNjBUmR"
+  }
+]

frontend/assets/scenes/offline_map_1.fire.meta

@@ -0,0 +1,7 @@
+{
+  "ver": "1.2.5",
+  "uuid": "368b10b6-88fc-423c-9fcd-545d9fc673bd",
+  "asyncLoadAssets": false,
+  "autoReleaseAssets": false,
+  "subMetas": {}
+}

frontend/assets/scripts/AttackingCharacter.js

@@ -0,0 +1,101 @@
+const BaseCharacter = require("./BaseCharacter");
+
+window.ATK_CHARACTER_STATE = {
+  Idle1: [0, "Idle1"],
+  Walking: [1, "Walking"],
+  Atk1: [2, "Atk1"],
+  Atked1: [3, "Atked1"],
+};
+
+window.ATK_CHARACTER_STATE_ARR = [];
+for (let k in window.ATK_CHARACTER_STATE) {
+  window.ATK_CHARACTER_STATE_ARR.push(window.ATK_CHARACTER_STATE[k]);
+}
+
+cc.Class({
+  extends: BaseCharacter,
+  properties: {
+    animNode: {
+      type: cc.Node,
+      default: null
+    },
+  },
+
+  ctor() {
+    this.speciesName = null;
+    this.hp = 100;
+    this.maxHp = 100;
+    this.framesToRecover = 0;
+  },
+
+  setSpecies(speciesName) {
+    this.speciesName = speciesName;
+    this.effAnimNode = this.animNode.getChildByName(this.speciesName);
+    this.animComp = this.effAnimNode.getComponent(dragonBones.ArmatureDisplay);
+    this.animComp.playAnimation(ATK_CHARACTER_STATE.Idle1[1]); // [WARNING] This is the only exception ccc's wrapper is used! 
+    this.effAnimNode.active = true;
+  },
+
+  onLoad() {
+    BaseCharacter.prototype.onLoad.call(this);
+  },
+
+  updateCharacterAnim(rdfPlayer, prevRdfPlayer, forceAnimSwitch) {
+    const underlyingAnimationCtrl = this.animComp._armature.animation; // ALWAYS use the dragonBones api instead of ccc's wrapper!
+    // Update directions
+    if (this.animComp && this.animComp.node) {
+      if (0 > rdfPlayer.dirX) {
+        this.animComp.node.scaleX = (-1.0);
+      } else if (0 < rdfPlayer.dirX) {
+        this.animComp.node.scaleX = (1.0);
+      }
+    }
+
+    // Update per character state
+    let newCharacterState = rdfPlayer.characterState;
+    let prevCharacterState = (null == prevRdfPlayer ? window.ATK_CHARACTER_STATE.Idle1[0] : prevRdfPlayer.characterState);
+    const newAnimName = window.ATK_CHARACTER_STATE_ARR[newCharacterState][1];
+    const playingAnimName = underlyingAnimationCtrl.lastAnimationName;
+    const isPlaying = underlyingAnimationCtrl.isPlaying;
+
+    // As this function might be called after many frames of a rollback, it's possible that the playing animation was predicted, different from "prevCharacterState" but same as "newCharacterState". More granular checks are needed to determine whether we should interrupt the playing animation.  
+    if (newCharacterState != prevCharacterState) {
+      if (newAnimName == playingAnimName) {
+        if (ATK_CHARACTER_STATE.Idle1[0] == newCharacterState || ATK_CHARACTER_STATE.Walking[0] == newCharacterState) {
+          // No need to interrupt
+          // console.warn(`JoinIndex=${rdfPlayer.joinIndex}, not interrupting ${newAnimName} while the playing anim is also ${playingAnimName}, player rdf changed from: ${null == prevRdfPlayer ? null : JSON.stringify(prevRdfPlayer)}, , to: ${JSON.stringify(rdfPlayer)}`);
+          return;
+        }
+      }
+      this._interruptPlayingAnimAndPlayNewAnim(rdfPlayer, prevRdfPlayer, newCharacterState, newAnimName, underlyingAnimationCtrl);
+    } else {
+      // newCharacterState == prevCharacterState
+      if (newAnimName != playingAnimName) {
+        // the playing animation was falsely predicted
+        this._interruptPlayingAnimAndPlayNewAnim(rdfPlayer, prevRdfPlayer, newCharacterState, newAnimName, underlyingAnimationCtrl);
+      } else {
+        if (!(ATK_CHARACTER_STATE.Idle1[0] == newCharacterState || ATK_CHARACTER_STATE.Walking[0] == newCharacterState)) {
+          // yet there's still a chance that the playing anim is not put at the current frame
+          this._interruptPlayingAnimAndPlayNewAnim(rdfPlayer, prevRdfPlayer, newCharacterState, newAnimName, underlyingAnimationCtrl);
+        }
+      }
+    }
+  },
+
+  _interruptPlayingAnimAndPlayNewAnim(rdfPlayer, prevRdfPlayer, newCharacterState, newAnimName, underlyingAnimationCtrl) {
+    if (ATK_CHARACTER_STATE.Idle1[0] == newCharacterState || ATK_CHARACTER_STATE.Walking[0] == newCharacterState) {
+      // No "framesToRecover"
+      // console.warn(`JoinIndex=${rdfPlayer.joinIndex}, playing new ${newAnimName} from the beginning: while the playing anim is ${playAnimation}, player rdf changed from: ${null == prevRdfPlayer ? null : JSON.stringify(prevRdfPlayer)}, , to: ${JSON.stringify(rdfPlayer)}`);
+      underlyingAnimationCtrl.gotoAndPlayByFrame(newAnimName, 0, -1);
+    } else {
+      const animationData = underlyingAnimationCtrl._animations[newAnimName];
+      let fromAnimFrame = (animationData.frameCount - rdfPlayer.framesToRecover);
+      if (fromAnimFrame > 0) {
+      } else if (fromAnimFrame < 0) {
+        // For Atk1 or Atk2, it's possible that the "meleeBullet.recoveryFrames" is configured to be slightly larger than corresponding animation duration frames
+        fromAnimFrame = 0;
+      }
+      underlyingAnimationCtrl.gotoAndPlayByFrame(newAnimName, fromAnimFrame, 1);
+    }
+  },
+});

frontend/assets/scripts/AttackingCharacter.js.meta

@@ -1,6 +1,6 @@
 {
   "ver": "1.0.5",
-  "uuid": "ea965d25-ec82-478c-bdb2-9ac07981ab0e",
+  "uuid": "0b29c37b-2ac0-47be-ae68-b7b9a4b2dffb",
   "isPlugin": false,
   "loadPluginInWeb": true,
   "loadPluginInNative": true,

frontend/assets/scripts/BaseCharacter.js

@@ -0,0 +1,44 @@
+module.export = cc.Class({
+  extends: cc.Component,
+
+  properties: {
+    lastMovedAt: {
+      type: cc.Float,
+      default: 0 // In "GMT milliseconds"
+    }
+  },
+
+  ctor() {
+    this.activeDirection = {
+      dx: 0,
+      dy: 0
+    };
+  },
+
+  onLoad() {
+    const self = this;
+    const canvasNode = self.mapNode.parent;
+    self.mapIns = self.mapNode.getComponent("Map");
+    const joystickInputControllerScriptIns = canvasNode.getComponent("TouchEventsManager");
+    self.ctrl = joystickInputControllerScriptIns;
+  },
+
+  update(dt) {},
+
+  lateUpdate(dt) {},
+
+  _generateRandomDirection() {
+    return ALL_DISCRETE_DIRECTIONS_CLOCKWISE[Math.floor(Math.random() * ALL_DISCRETE_DIRECTIONS_CLOCKWISE.length)];
+  },
+
+  updateSpeed(proposedSpeed) {
+    if (0 == proposedSpeed && 0 < this.speed) {
+      this.startFrozenDisplay();
+    }
+    if (0 < proposedSpeed && 0 == this.speed) {
+      this.stopFrozenDisplay();
+    }
+    this.speed = proposedSpeed;
+  },
+
+});

frontend/assets/scripts/BasePlayer.js

@@ -1,96 +0,0 @@
-module.export = cc.Class({
-  extends: cc.Component,
-
-  properties: {
-    animComp: {
-      type: cc.Animation,
-      default: null,
-    },
-    lastMovedAt: {
-      type: cc.Float,
-      default: 0 // In "GMT milliseconds"
-    }
-  },
-
-  // LIFE-CYCLE CALLBACKS:
-  start() {
-    const self = this;
-    self.activeDirection = {
-      dx: 0,
-      dy: 0
-    };
-  },
-
-  onLoad() {
-    const self = this;
-    self.clips = {
-      '02': 'Top',
-      '0-2': 'Bottom',
-      '-20': 'Left',
-      '20': 'Right',
-      '-11': 'TopLeft',
-      '11': 'TopRight',
-      '-1-1': 'BottomLeft',
-      '1-1': 'BottomRight'
-    };
-    const canvasNode = self.mapNode.parent;
-    self.mapIns = self.mapNode.getComponent("Map");
-    const joystickInputControllerScriptIns = canvasNode.getComponent("TouchEventsManager");
-    self.ctrl = joystickInputControllerScriptIns;
-    self.animComp = self.node.getComponent(cc.Animation);
-    self.animComp.play();
-  },
-
-  scheduleNewDirection(newScheduledDirection, forceAnimSwitch) {
-    if (!newScheduledDirection) {
-      return;
-    }
-
-    if (forceAnimSwitch || null == this.activeDirection || (newScheduledDirection.dx != this.activeDirection.dx || newScheduledDirection.dy != this.activeDirection.dy)) {
-      this.activeDirection = newScheduledDirection;
-      this.activeDirection = newScheduledDirection;
-      const clipKey = newScheduledDirection.dx.toString() + newScheduledDirection.dy.toString();
-      const clips = (this.attacked ? this.attackedClips : this.clips);
-      let clip = clips[clipKey];
-      if (!clip) {
-        // Keep playing the current anim.
-        if (0 !== newScheduledDirection.dx || 0 !== newScheduledDirection.dy) {
-          cc.warn('Clip for clipKey === ' + clipKey + ' is invalid: ' + clip + '.');
-        }
-      } else {
-        this.animComp.play(clip);
-        if (this.attacked) {
-          cc.log(`Attacked, switching to play clipKey = ${clipKey}, clip == ${clip}, this.activeDirection == ${JSON.stringify(this.activeDirection)}, this.activeDirection == ${JSON.stringify(this.activeDirection)}.`);
-        }
-      }
-    }
-  },
-
-  update(dt) {},
-
-  lateUpdate(dt) {},
-
-  _generateRandomDirection() {
-    return ALL_DISCRETE_DIRECTIONS_CLOCKWISE[Math.floor(Math.random() * ALL_DISCRETE_DIRECTIONS_CLOCKWISE.length)];
-  },
-
-  updateSpeed(proposedSpeed) {
-    if (0 == proposedSpeed && 0 < this.speed) {
-      this.startFrozenDisplay();
-    }
-    if (0 < proposedSpeed && 0 == this.speed) {
-      this.stopFrozenDisplay();
-    }
-    this.speed = proposedSpeed;
-  },
-
-  startFrozenDisplay() {
-    const self = this;
-    self.attacked = true;
-  },
-
-  stopFrozenDisplay() {
-    const self = this;
-    self.attacked = false;
-  },
-});

frontend/assets/scripts/Bullet.js

@@ -1,201 +0,0 @@
- module.export = cc.Class({
-  extends: cc.Component,
-
-  properties: {
-    localIdInBattle: {
-      default: null, 
-    },
-    linearSpeed: {
-      default: 0.0,
-    },
-  },
-    
-  ctor() {
-    this.ctrl = null;
-    this.activeDirection = null;
-  },
-
-  onLoad() {
-  },
-
-  _calculateVecToMoveByWithChosenDir(elapsedTime, sDir) {
-    if (0 == sDir.dx && 0 == sDir.dy) {
-      return cc.v2();
-    }
-    const self = this;
-    const distanceToMove = (self.linearSpeed * elapsedTime);
-    const denominator = Math.sqrt(sDir.dx * sDir.dx + sDir.dy * sDir.dy);
-    const unitProjDx = (sDir.dx / denominator);
-    const unitProjDy = (sDir.dy / denominator);
-    return cc.v2(
-      distanceToMove * unitProjDx,
-      distanceToMove * unitProjDy,
-    );
-  },
-
-  _calculateVecToMoveBy(elapsedTime) {
-    const self = this;
-    if (null == self.activeDirection) {
-      return null;
-    }
-    // Note that `sDir` used in this method MUST BE a copy in RAM.
-    let sDir = {
-      dx: self.activeDirection.dx,
-      dy: self.activeDirection.dy,
-    };
-
-    if (0 == sDir.dx && 0 == sDir.dy) {
-      return cc.v2();
-    }
-
-    return self._calculateVecToMoveByWithChosenDir(elapsedTime, sDir);
-  },
-
-  _canMoveBy(vecToMoveBy) {
-    return true;
-  },
-
-  update(dt) {
-    // Used only for EXTRAPOLATING the position of this bullet. The position might be corrected within `setData` as well.
-    const self = this;
-    if (null != self.bulletMaxDist) {
-      const dxMoved = self.node.position.x - self.startAtPoint.x;
-      const dyMoved = self.node.position.y - self.startAtPoint.y;
-      const distanceMoved = Math.sqrt(dxMoved * dxMoved + dyMoved * dyMoved)
-      self.node.opacity = 255*(1 - distanceMoved/self.bulletMaxDist);
-    }
-
-    const vecToMoveBy = self._calculateVecToMoveBy(dt);
-    if (null == vecToMoveBy) {
-      return;
-    }
-    if (self._canMoveBy(vecToMoveBy)) {
-      self.node.position = self.node.position.add(vecToMoveBy);
-    }
-  },
-
-  _calculateAngle(dx, dy) {
-    if (dx == 0) {
-      if (dy > 0) {
-        return 90;
-      }
-      if (dy < 0) {
-        return -90;
-      }
-    } 
-
-    if (dx > 0) {
-      if (dy == 0) {
-        return 0;
-      }
-      if (dy > 0) {
-        return 45;
-      }
-      if (dy < 0) {
-        return -45;
-      }
-    } 
-
-    if (dx < 0) {
-      if (dy == 0) {
-        return 180;
-      }
-      if (dy > 0) {
-        return 135;
-      }
-      if (dy < 0) {
-        return -135;
-      }
-    }
-
-    return null;
-  },
-
-  setData(bulletLocalIdInBattle, bulletInfo, dtFromMapUpdate) {
-    const targetNode = this.node;
-
-    if (true == bulletInfo.removed) {
-      return false;
-    }
-
-    if (null == bulletInfo.startAtPoint || null == bulletInfo.endAtPoint) {
-      console.error(`Init bullet direction error, startAtPoint:${bulletInfo.startAtPoint}, endAtPoint:${bulletInfo.endAtPoint}`);
-      return false;
-    } 
-
-    this.localIdInBattle = bulletLocalIdInBattle;
-    this.linearSpeed = bulletInfo.linearSpeed * 1000000000; // The `bullet.LinearSpeed` on server-side is denoted in pts/nanoseconds. 
-
-    const dx = bulletInfo.endAtPoint.x - bulletInfo.startAtPoint.x;
-    const dy = bulletInfo.endAtPoint.y - bulletInfo.startAtPoint.y;
-
-    const discretizedDir = this.ctrl.discretizeDirection(dx, dy, this.ctrl.joyStickEps); 
-    const baseAngle = 0;
-    const angleToRotate = baseAngle - this._calculateAngle(discretizedDir.dx, discretizedDir.dy);
-    if (null == angleToRotate) {
-      return false;
-    }
-    set2dRotation(targetNode, angleToRotate); 
-
-    const newPos = cc.v2(
-      bulletInfo.x,
-      bulletInfo.y
-    );
-
-    if (null == this.activeDirection) {
-      // Initialization.
-      this.startAtPoint = bulletInfo.startAtPoint;
-      this.endAtPoint = bulletInfo.endAtPoint;
-      this.bulletMaxDist = 600.0; // Hardcoded temporarily, matching that in "<backend>/models/room.go". -- YFLu, 2019-09-05.
-      targetNode.setPosition(newPos);
-      this.activeDirection = {
-        dx: 0,
-        dy: 0,
-      };
-      return true;
-    } 
-
-    const oldPos = cc.v2(
-      targetNode.x,
-      targetNode.y,
-    );
-    const toMoveByVec = newPos.sub(oldPos);
-    const toMoveByVecMag = toMoveByVec.mag();
-    const toTeleportDisThreshold = (this.linearSpeed * dtFromMapUpdate * 100);
-    const notToMoveDisThreshold = (this.linearSpeed * dtFromMapUpdate * 0.5);
-    if (toMoveByVecMag < notToMoveDisThreshold) {
-      // To stop extrapolated moving.
-      this.activeDirection = {
-        dx: 0,
-        dy: 0,
-      };
-    } else {
-      if (toMoveByVecMag > toTeleportDisThreshold) {
-        console.log("Bullet ", bulletLocalIdInBattle, " is teleporting! Having toMoveByVecMag == ", toMoveByVecMag, ", toTeleportDisThreshold == ", toTeleportDisThreshold);
-        // To stop extrapolated moving.
-        this.activeDirection = {
-          dx: 0,
-          dy: 0
-        };
-        // Deliberately NOT using `cc.Action`. -- YFLu, 2019-09-04
-        targetNode.setPosition(newPos);
-      } else {
-        // The common case which is suitable for interpolation.
-        const normalizedDir = {
-          dx: toMoveByVec.x / toMoveByVecMag,
-          dy: toMoveByVec.y / toMoveByVecMag,
-        };
-        if (isNaN(normalizedDir.dx) || isNaN(normalizedDir.dy)) {
-          this.activeDirection = {
-            dx: 0,
-            dy: 0,
-          };
-        } else {
-          this.activeDirection = normalizedDir;
-        }
-      }
-    }
-
-    return true;
-  },
-});

frontend/assets/scripts/ControlledCharacter.js

@@ -1,8 +1,7 @@
-const BasePlayer = require("./BasePlayer");
+const AttackingCharacter = require("./AttackingCharacter");
 
 cc.Class({
-  extends: BasePlayer,
-  // LIFE-CYCLE CALLBACKS:
+  extends: AttackingCharacter,
   properties: {
     arrowTipNode: {
       type: cc.Node,
@@ -13,22 +12,9 @@ cc.Class({
       default: null
     }
   },
-  start() {
-    BasePlayer.prototype.start.call(this);
-  },
 
   onLoad() {
-    BasePlayer.prototype.onLoad.call(this);
-    this.attackedClips = {
-      '01': 'attackedLeft',
-      '0-1': 'attackedRight',
-      '-20': 'attackedLeft',
-      '20': 'attackedRight',
-      '-21': 'attackedLeft',
-      '21': 'attackedRight',
-      '-2-1': 'attackedLeft',
-      '2-1': 'attackedRight'
-    };
+    AttackingCharacter.prototype.onLoad.call(this);
     this.arrowTipNode.active = false;
 
     if (!this.mapIns.showCriticalCoordinateLabels) {
@@ -51,7 +37,7 @@ cc.Class({
   },
 
   update(dt) {
-    BasePlayer.prototype.update.call(this, dt);
+    AttackingCharacter.prototype.update.call(this, dt);
     if (this.mapIns.showCriticalCoordinateLabels) {
       this.coordLabel.string = `(${this.node.x.toFixed(2)}, ${this.node.y.toFixed(2)})`;
     }

frontend/assets/scripts/KeyboardControls.js

@@ -1,69 +0,0 @@
-cc.Class({
-  extends: cc.Component,
-
-  properties: {},
-
-  setInputControls: function() {
-    const self = this;
-    // add keyboard event listener
-    // When there is a key being pressed down, judge if it's the designated directional button and set up acceleration in the corresponding direction
-    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, function(event) {
-      switch (event.keyCode) {
-        case cc.macro.KEY.w:
-          self.activeDirection.dPjY = +1.0;
-          break;
-        case cc.macro.KEY.s:
-          self.activeDirection.dPjY = -1.0;
-          break;
-        case cc.macro.KEY.a:
-          self.activeDirection.dPjX = -2.0;
-          break;
-        case cc.macro.KEY.d:
-          self.activeDirection.dPjX = +2.0;
-          break;
-        default:
-          break;
-      }
-    }, self.node);
-
-    // when releasing the button, stop acceleration in this direction
-    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, function(event) {
-      switch (event.keyCode) {
-        case cc.macro.KEY.w:
-          if (+1.0 == self.activeDirection.dPjY) {
-            self.activeDirection.dPjY = 0.0;
-          }
-          break;
-        case cc.macro.KEY.s:
-          if (-1.0 == self.activeDirection.dPjY) {
-            self.activeDirection.dPjY = 0.0;
-          }
-          break;
-        case cc.macro.KEY.a:
-          if (-2.0 == self.activeDirection.dPjX) {
-            self.activeDirection.dPjX = 0.0;
-          }
-          break;
-        case cc.macro.KEY.d:
-          if (+2.0 == self.activeDirection.dPjX) {
-            self.activeDirection.dPjX = 0.0;
-          }
-          break;
-        default:
-          break;
-      }
-    }, self.node);
-  },
-
-  // LIFE-CYCLE CALLBACKS:
-
-  onLoad() {
-    // Properties deliberately hidden from GUI panel.
-    this.activeDirection = {
-      dPjY: 0.0,
-      dPjX: 0.0
-    };
-    this.setInputControls();
-  }
-});
-

frontend/assets/scripts/Map.js

@@ -40,26 +40,10 @@ cc.Class({
       type: cc.Node,
       default: null,
     },
-    tiledAnimPrefab: {
+    controlledCharacterPrefab: {
       type: cc.Prefab,
       default: null,
     },
-    player1Prefab: {
-      type: cc.Prefab,
-      default: null,
-    },
-    player2Prefab: {
-      type: cc.Prefab,
-      default: null,
-    },
-    polygonBoundaryBarrierPrefab: {
-      type: cc.Prefab,
-      default: null,
-    },
-    keyboardInputControllerNode: {
-      type: cc.Node,
-      default: null
-    },
     joystickInputControllerNode: {
       type: cc.Node,
       default: null
@@ -103,10 +87,6 @@ cc.Class({
     forceBigEndianFloatingNumDecoding: {
       default: false,
     },
-    backgroundMapTiledIns: {
-      type: cc.TiledMap,
-      default: null
-    },
     renderFrameIdLagTolerance: {
       type: cc.Integer,
       default: 4 // implies (renderFrameIdLagTolerance >> inputScaleFrames) count of inputFrameIds
@@ -115,6 +95,9 @@ cc.Class({
       type: cc.Float,
       default: 1e-3
     },
+    bulletTriggerEnabled: {
+      default: false
+    },
   },
 
   _inputFrameIdDebuggable(inputFrameId) {
@@ -123,7 +106,7 @@ cc.Class({
 
   dumpToRenderCache: function(rdf) {
     const self = this;
-    const minToKeepRenderFrameId = self.lastAllConfirmedRenderFrameId;
+    const minToKeepRenderFrameId = self.lastAllConfirmedRenderFrameId - 1; // Keep at least 1 prev render frame for anim triggering 
     while (0 < self.recentRenderCache.cnt && self.recentRenderCache.stFrameId < minToKeepRenderFrameId) {
       self.recentRenderCache.pop();
     }
@@ -133,7 +116,7 @@ cc.Class({
 
   dumpToInputCache: function(inputFrameDownsync) {
     const self = this;
-    let minToKeepInputFrameId = self._convertToInputFrameId(self.lastAllConfirmedRenderFrameId, self.inputDelayFrames); // [WARNING] This could be different from "self.lastAllConfirmedInputFrameId". We'd like to keep the corresponding delayedInputFrame for "self.lastAllConfirmedRenderFrameId" such that a rollback could place "self.chaserRenderFrameId = self.lastAllConfirmedRenderFrameId" for the worst case incorrect prediction.
+    let minToKeepInputFrameId = self._convertToInputFrameId(self.lastAllConfirmedRenderFrameId, self.inputDelayFrames) - self.spAtkLookupFrames; // [WARNING] This could be different from "self.lastAllConfirmedInputFrameId". We'd like to keep the corresponding delayedInputFrame for "self.lastAllConfirmedRenderFrameId" such that a rollback could place "self.chaserRenderFrameId = self.lastAllConfirmedRenderFrameId" for the worst case incorrect prediction.
     if (minToKeepInputFrameId > self.lastAllConfirmedInputFrameId) {
       minToKeepInputFrameId = self.lastAllConfirmedInputFrameId;
     }
@@ -183,8 +166,8 @@ cc.Class({
       return [previousSelfInput, existingInputFrame.inputList[joinIndex - 1]];
     }
     const prefabbedInputList = (null == previousInputFrameDownsyncWithPrediction ? new Array(self.playerRichInfoDict.size).fill(0) : previousInputFrameDownsyncWithPrediction.inputList.slice());
-    const discreteDir = self.ctrl.getDiscretizedDirection();
-    prefabbedInputList[(joinIndex - 1)] = discreteDir.encodedIdx;
+    const currSelfInput = self.ctrl.getEncodedInput();
+    prefabbedInputList[(joinIndex - 1)] = currSelfInput;
     const prefabbedInputFrameDownsync = {
       inputFrameId: inputFrameId,
       inputList: prefabbedInputList,
@@ -193,7 +176,7 @@ cc.Class({
 
     self.dumpToInputCache(prefabbedInputFrameDownsync); // A prefabbed inputFrame, would certainly be adding a new inputFrame to the cache, because server only downsyncs "all-confirmed inputFrames" 
 
-    return [previousSelfInput, discreteDir.encodedIdx];
+    return [previousSelfInput, currSelfInput];
   },
 
   shouldSendInputFrameUpsyncBatch(prevSelfInput, currSelfInput, lastUpsyncInputFrameId, currInputFrameId) {
@@ -224,11 +207,13 @@ cc.Class({
       } else {
         const inputFrameUpsync = {
           inputFrameId: i,
-          encodedDir: inputFrameDownsync.inputList[self.selfPlayerInfo.joinIndex - 1],
+          encoded: inputFrameDownsync.inputList[self.selfPlayerInfo.joinIndex - 1],
         };
         inputFrameUpsyncBatch.push(inputFrameUpsync);
       }
     }
+
+    // console.info(`inputFrameUpsyncBatch: ${JSON.stringify(inputFrameUpsyncBatch)}`);
     const reqData = window.pb.protos.WsReq.encode({
       msgId: Date.now(),
       playerId: self.selfPlayerInfo.id,
@@ -304,8 +289,6 @@ cc.Class({
     const self = this;
     const mapNode = self.node;
     const canvasNode = mapNode.parent;
-    self.countdownLabel.string = "";
-    self.countdownNanos = null;
 
     // Clearing previous info of all players. [BEGINS]
     self.collisionPlayerIndexPrefix = (1 << 17); // For tracking the movements of players 
@@ -320,31 +303,41 @@ cc.Class({
     // Clearing previous info of all players. [ENDS]
 
     self.renderFrameId = 0; // After battle started
+    self.bulletBattleLocalIdCounter = 0;
     self.lastAllConfirmedRenderFrameId = -1;
     self.lastAllConfirmedInputFrameId = -1;
     self.lastUpsyncInputFrameId = -1;
     self.chaserRenderFrameId = -1; // at any moment, "lastAllConfirmedRenderFrameId <= chaserRenderFrameId <= renderFrameId", but "chaserRenderFrameId" would fluctuate according to "onInputFrameDownsyncBatch"
 
-    self.recentRenderCache = new RingBuffer(1024);
+    self.recentRenderCache = new RingBuffer(self.renderCacheSize);
 
     self.selfPlayerInfo = null; // This field is kept for distinguishing "self" and "others".
-    self.recentInputCache = new RingBuffer(1024);
+    self.recentInputCache = new RingBuffer((self.renderCacheSize >> 2) + 1);
 
     self.collisionSys = new collisions.Collisions();
 
     self.collisionBarrierIndexPrefix = (1 << 16); // For tracking the movements of barriers, though not yet actually used 
+    self.collisionBulletIndexPrefix = (1 << 15); // For tracking the movements of bullets 
     self.collisionSysMap = new Map();
 
     self.transitToState(ALL_MAP_STATES.VISUAL);
 
     self.battleState = ALL_BATTLE_STATES.WAITING;
 
+    self.countdownNanos = null;
+    if (self.countdownLabel) {
+      self.countdownLabel.string = "";
+    }
     if (self.findingPlayerNode) {
       const findingPlayerScriptIns = self.findingPlayerNode.getComponent("FindingPlayer");
       findingPlayerScriptIns.init();
     }
-    safelyAddChild(self.widgetsAboveAllNode, self.playersInfoNode);
-    safelyAddChild(self.widgetsAboveAllNode, self.findingPlayerNode);
+    if (self.playersInfoNode) {
+      safelyAddChild(self.widgetsAboveAllNode, self.playersInfoNode);
+    }
+    if (self.findingPlayerNode) {
+      safelyAddChild(self.widgetsAboveAllNode, self.findingPlayerNode);
+    }
   },
 
   onLoad() {
@@ -352,7 +345,7 @@ cc.Class({
     window.mapIns = self;
     window.forceBigEndianFloatingNumDecoding = self.forceBigEndianFloatingNumDecoding;
 
-    self.showCriticalCoordinateLabels = true;
+    self.showCriticalCoordinateLabels = false;
 
     console.warn("+++++++ Map onLoad()");
     window.handleClientSessionError = function() {
@@ -420,18 +413,7 @@ cc.Class({
     /** Init required prefab ended. */
 
     window.handleBattleColliderInfo = function(parsedBattleColliderInfo) {
-      self.inputDelayFrames = parsedBattleColliderInfo.inputDelayFrames;
-      self.inputScaleFrames = parsedBattleColliderInfo.inputScaleFrames;
-      self.inputFrameUpsyncDelayTolerance = parsedBattleColliderInfo.inputFrameUpsyncDelayTolerance;
-
-      self.battleDurationNanos = parsedBattleColliderInfo.battleDurationNanos;
-      self.rollbackEstimatedDt = parsedBattleColliderInfo.rollbackEstimatedDt;
-      self.rollbackEstimatedDtMillis = parsedBattleColliderInfo.rollbackEstimatedDtMillis;
-      self.rollbackEstimatedDtNanos = parsedBattleColliderInfo.rollbackEstimatedDtNanos;
-      self.maxChasingRenderFramesPerUpdate = parsedBattleColliderInfo.maxChasingRenderFramesPerUpdate;
-
-      self.worldToVirtualGridRatio = parsedBattleColliderInfo.worldToVirtualGridRatio;
-      self.virtualGridToWorldRatio = parsedBattleColliderInfo.virtualGridToWorldRatio;
+      Object.assign(self, parsedBattleColliderInfo);
 
       const tiledMapIns = self.node.getComponent(cc.TiledMap);
 
@@ -475,8 +457,10 @@ cc.Class({
         for (let boundaryObj of boundaryObjs.barriers) {
           const x0 = boundaryObj.anchor.x,
             y0 = boundaryObj.anchor.y;
-        
-          const newBarrier = self.collisionSys.createPolygon(x0, y0, Array.from(boundaryObj, p => { return [p.x, p.y]; }));
+
+          const newBarrier = self.collisionSys.createPolygon(x0, y0, Array.from(boundaryObj, p => {
+            return [p.x, p.y];
+          }));
 
           if (self.showCriticalCoordinateLabels) {
             for (let i = 0; i < boundaryObj.length; ++i) {
@@ -500,7 +484,7 @@ cc.Class({
               barrierVertLabelNode.setPosition(cc.v2(wx, wy));
               const barrierVertLabel = barrierVertLabelNode.addComponent(cc.Label);
               barrierVertLabel.fontSize = 12;
-              barrierVertLabel.lineHeight = barrierVertLabel.fontSize+1;
+              barrierVertLabel.lineHeight = barrierVertLabel.fontSize + 1;
               barrierVertLabel.string = `(${wx.toFixed(1)}, ${wy.toFixed(1)})`;
               safelyAddChild(self.node, barrierVertLabelNode);
               setLocalZOrder(barrierVertLabelNode, 5);
@@ -616,38 +600,42 @@ cc.Class({
     }
 
     const players = rdf.players;
-    const playerMetas = rdf.playerMetas;
-    self._initPlayerRichInfoDict(players, playerMetas);
+    self._initPlayerRichInfoDict(players);
 
     // Show the top status indicators for IN_BATTLE 
-    const playersInfoScriptIns = self.playersInfoNode.getComponent("PlayersInfo");
-    for (let i in playerMetas) {
-      const playerMeta = playerMetas[i];
-      playersInfoScriptIns.updateData(playerMeta);
+    if (self.playersInfoNode) {
+      const playersInfoScriptIns = self.playersInfoNode.getComponent("PlayersInfo");
+      for (let i in players) {
+        playersInfoScriptIns.updateData(players[i]);
+      }
     }
 
-    self.renderFrameId = rdf.id;
-    self.lastRenderFrameIdTriggeredAt = performance.now();
-    // In this case it must be true that "rdf.id > chaserRenderFrameId >= lastAllConfirmedRenderFrameId".
-    self.lastAllConfirmedRenderFrameId = rdf.id;
-    self.chaserRenderFrameId = rdf.id;
+    if (null == self.renderFrameId || self.renderFrameId <= rdf.id) {
+      // In fact, not having "window.RING_BUFF_CONSECUTIVE_SET == dumpRenderCacheRet" should already imply that "self.renderFrameId <= rdf.id", but here we double check and log the anomaly  
+      self.renderFrameId = rdf.id;
+      self.lastRenderFrameIdTriggeredAt = performance.now();
+      // In this case it must be true that "rdf.id > chaserRenderFrameId >= lastAllConfirmedRenderFrameId".
+      self.lastAllConfirmedRenderFrameId = rdf.id;
+      self.chaserRenderFrameId = rdf.id;
 
-    if (null != rdf.countdownNanos) {
-      self.countdownNanos = rdf.countdownNanos;
-    }
-    if (null != self.musicEffectManagerScriptIns) {
-      self.musicEffectManagerScriptIns.playBGM();
-    }
-    const canvasNode = self.canvasNode;
-    self.ctrl = canvasNode.getComponent("TouchEventsManager");
-    self.enableInputControls();
-    if (self.countdownToBeginGameNode.parent) {
-      self.countdownToBeginGameNode.parent.removeChild(self.countdownToBeginGameNode);
-    }
-    self.transitToState(ALL_MAP_STATES.VISUAL);
-    self.battleState = ALL_BATTLE_STATES.IN_BATTLE;
-    self.applyRoomDownsyncFrameDynamics(rdf);
+      const canvasNode = self.canvasNode;
+      self.ctrl = canvasNode.getComponent("TouchEventsManager");
+      self.enableInputControls();
+      self.transitToState(ALL_MAP_STATES.VISUAL);
+      self.battleState = ALL_BATTLE_STATES.IN_BATTLE;
 
+      if (self.countdownToBeginGameNode && self.countdownToBeginGameNode.parent) {
+        self.countdownToBeginGameNode.parent.removeChild(self.countdownToBeginGameNode);
+      }
+
+      if (null != self.musicEffectManagerScriptIns) {
+        self.musicEffectManagerScriptIns.playBGM();
+      }
+    } else {
+      console.warn(`Anomaly when onRoomDownsyncFrame is called by rdf=${JSON.stringify(rdf)}, recentRenderCache=${self._stringifyRecentRenderCache(false)}, recentInputCache=${self._stringifyRecentInputCache(false)}`);
+    }
+
+    // [WARNING] Leave all graphical updates in "update(dt)" by "applyRoomDownsyncFrameDynamics"
     return dumpRenderCacheRet;
   },
 
@@ -722,7 +710,7 @@ cc.Class({
       self.showPopupInCanvas(self.findingPlayerNode);
     }
     let findingPlayerScriptIns = self.findingPlayerNode.getComponent("FindingPlayer");
-    findingPlayerScriptIns.updatePlayersInfo(rdf.playerMetas);
+    findingPlayerScriptIns.updatePlayersInfo(rdf.players);
   },
 
   logBattleStats() {
@@ -760,32 +748,33 @@ cc.Class({
     self.playersInfoNode.getComponent("PlayersInfo").clearInfo();
   },
 
-  spawnPlayerNode(joinIndex, vx, vy, playerRichInfo) {
+  spawnPlayerNode(joinIndex, vx, vy, playerDownsyncInfo) {
     const self = this;
-    const newPlayerNode = 1 == joinIndex ? cc.instantiate(self.player1Prefab) : cc.instantiate(self.player2Prefab); // hardcoded for now, car color determined solely by joinIndex
-    const wpos = self.virtualGridToWorldPos(vx, vy);
+    const newPlayerNode = cc.instantiate(self.controlledCharacterPrefab)
+    const playerScriptIns = newPlayerNode.getComponent("ControlledCharacter");
+    if (1 == joinIndex) {
+      playerScriptIns.setSpecies("SoldierWaterGhost");
+    } else if (2 == joinIndex) {
+      playerScriptIns.setSpecies("SoldierFireGhost");
+    }
 
-    newPlayerNode.setPosition(cc.v2(wpos[0], wpos[1]));
-    newPlayerNode.getComponent("SelfPlayer").mapNode = self.node;
-    const cpos = self.virtualGridToPlayerColliderPos(vx, vy, playerRichInfo);
-    const d = playerRichInfo.colliderRadius * 2,
-      x0 = cpos[0],
-      y0 = cpos[1];
-    let pts = [[0, 0], [d, 0], [d, d], [0, d]];
+    const [wx, wy] = self.virtualGridToWorldPos(vx, vy);
+    newPlayerNode.setPosition(wx, wy);
+    playerScriptIns.mapNode = self.node;
+    const d = playerDownsyncInfo.colliderRadius * 2,
+      [x0, y0] = self.virtualGridToPolygonColliderAnchorPos(vx, vy, playerDownsyncInfo.colliderRadius, playerDownsyncInfo.colliderRadius),
+      pts = [[0, 0], [d, 0], [d, d], [0, d]];
 
     const newPlayerCollider = self.collisionSys.createPolygon(x0, y0, pts);
     const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
+    newPlayerCollider.data = playerDownsyncInfo;
     self.collisionSysMap.set(collisionPlayerIndex, newPlayerCollider);
 
     safelyAddChild(self.node, newPlayerNode);
     setLocalZOrder(newPlayerNode, 5);
 
     newPlayerNode.active = true;
-    const playerScriptIns = newPlayerNode.getComponent("SelfPlayer");
-    playerScriptIns.scheduleNewDirection({
-      dx: playerRichInfo.dir.dx,
-      dy: playerRichInfo.dir.dy
-    }, true);
+    playerScriptIns.updateCharacterAnim(playerDownsyncInfo, null, true);
 
     return [newPlayerNode, playerScriptIns];
   },
@@ -804,9 +793,7 @@ cc.Class({
           currSelfInput = null;
         const noDelayInputFrameId = self._convertToInputFrameId(self.renderFrameId, 0); // It's important that "inputDelayFrames == 0" here 
         if (self.shouldGenerateInputFrameUpsync(self.renderFrameId)) {
-          const prevAndCurrInputs = self._generateInputFrameUpsync(noDelayInputFrameId);
-          prevSelfInput = prevAndCurrInputs[0];
-          currSelfInput = prevAndCurrInputs[1];
+          [prevSelfInput, currSelfInput] = self._generateInputFrameUpsync(noDelayInputFrameId);
         }
 
         let t0 = performance.now();
@@ -826,30 +813,31 @@ cc.Class({
         let t2 = performance.now();
 
         // Inside the following "self.rollbackAndChase" actually ROLLS FORWARD w.r.t. the corresponding delayedInputFrame, REGARDLESS OF whether or not "self.chaserRenderFrameId == self.renderFrameId" now. 
-        const rdf = self.rollbackAndChase(self.renderFrameId, self.renderFrameId + 1, self.collisionSys, self.collisionSysMap, false);
+        const [prevRdf, rdf] = self.rollbackAndChase(self.renderFrameId, self.renderFrameId + 1, self.collisionSys, self.collisionSysMap, false);
         /*
         const nonTrivialChaseEnded = (prevChaserRenderFrameId < nextChaserRenderFrameId && nextChaserRenderFrameId == self.renderFrameId); 
         if (nonTrivialChaseEnded) {
             console.debug("Non-trivial chase ended, prevChaserRenderFrameId=" + prevChaserRenderFrameId + ", nextChaserRenderFrameId=" + nextChaserRenderFrameId);
         }  
         */
-        self.applyRoomDownsyncFrameDynamics(rdf);
+        // [WARNING] Don't try to get "prevRdf(i.e. renderFrameId == latest-1)" by "self.recentRenderCache.getByFrameId(...)" here, as the cache might have been updated by asynchronous "onRoomDownsyncFrame(...)" calls!
+        self.applyRoomDownsyncFrameDynamics(rdf, prevRdf);
         let t3 = performance.now();
       } catch (err) {
         console.error("Error during Map.update", err);
       } finally {
         // Update countdown
-        if (null != self.countdownNanos) {
-          self.countdownNanos = self.battleDurationNanos - self.renderFrameId * self.rollbackEstimatedDtNanos;
-          if (self.countdownNanos <= 0) {
-            self.onBattleStopped(self.playerRichInfoDict);
-            return;
-          }
+        self.countdownNanos = self.battleDurationNanos - self.renderFrameId * self.rollbackEstimatedDtNanos;
+        if (self.countdownNanos <= 0) {
+          self.onBattleStopped(self.playerRichInfoDict);
+          return;
+        }
 
-          const countdownSeconds = parseInt(self.countdownNanos / 1000000000);
-          if (isNaN(countdownSeconds)) {
-            console.warn(`countdownSeconds is NaN for countdownNanos == ${self.countdownNanos}.`);
-          }
+        const countdownSeconds = parseInt(self.countdownNanos / 1000000000);
+        if (isNaN(countdownSeconds)) {
+          console.warn(`countdownSeconds is NaN for countdownNanos == ${self.countdownNanos}.`);
+        }
+        if (null != self.countdownLabel) {
           self.countdownLabel.string = countdownSeconds;
         }
         ++self.renderFrameId; // [WARNING] It's important to increment the renderFrameId AFTER all the operations above!!!
@@ -934,53 +922,51 @@ cc.Class({
     if (null == self.findingPlayerNode.parent) return;
     self.findingPlayerNode.parent.removeChild(self.findingPlayerNode);
     if (null != rdf) {
-      self._initPlayerRichInfoDict(rdf.players, rdf.playerMetas);
+      self._initPlayerRichInfoDict(rdf.players);
     }
   },
 
   onBattleReadyToStart(rdf) {
     const self = this;
     const players = rdf.players;
-    const playerMetas = rdf.playerMetas;
-    self._initPlayerRichInfoDict(players, playerMetas);
+    self._initPlayerRichInfoDict(players);
 
     // Show the top status indicators for IN_BATTLE 
-    const playersInfoScriptIns = self.playersInfoNode.getComponent("PlayersInfo");
-    for (let i in playerMetas) {
-      const playerMeta = playerMetas[i];
-      playersInfoScriptIns.updateData(playerMeta);
+    if (self.playersInfoNode) {
+      const playersInfoScriptIns = self.playersInfoNode.getComponent("PlayersInfo");
+      for (let i in players) {
+        playersInfoScriptIns.updateData(players[i]);
+      }
+    }
+    console.log("Calling `onBattleReadyToStart` with:", players);
+    if (self.findingPlayerNode) {
+      const findingPlayerScriptIns = self.findingPlayerNode.getComponent("FindingPlayer");
+      findingPlayerScriptIns.hideExitButton();
+      findingPlayerScriptIns.updatePlayersInfo(players);
     }
-    console.log("Calling `onBattleReadyToStart` with:", playerMetas);
-    const findingPlayerScriptIns = self.findingPlayerNode.getComponent("FindingPlayer");
-    findingPlayerScriptIns.hideExitButton();
-    findingPlayerScriptIns.updatePlayersInfo(playerMetas);
 
     // Delay to hide the "finding player" GUI, then show a countdown clock
-    window.setTimeout(() => {
-      self.hideFindingPlayersGUI();
-      const countDownScriptIns = self.countdownToBeginGameNode.getComponent("CountdownToBeginGame");
-      countDownScriptIns.setData();
-      self.showPopupInCanvas(self.countdownToBeginGameNode);
-    }, 1500);
+    if (self.countdownToBeginGameNode) {
+      window.setTimeout(() => {
+        self.hideFindingPlayersGUI();
+        const countDownScriptIns = self.countdownToBeginGameNode.getComponent("CountdownToBeginGame");
+        countDownScriptIns.setData();
+        self.showPopupInCanvas(self.countdownToBeginGameNode);
+      }, 1500);
+    }
   },
 
-  applyRoomDownsyncFrameDynamics(rdf) {
+  applyRoomDownsyncFrameDynamics(rdf, prevRdf) {
     const self = this;
-
-    self.playerRichInfoDict.forEach((playerRichInfo, playerId) => {
+    for (let [playerId, playerRichInfo] of self.playerRichInfoDict.entries()) {
       const immediatePlayerInfo = rdf.players[playerId];
-      const wpos = self.virtualGridToWorldPos(immediatePlayerInfo.virtualGridX, immediatePlayerInfo.virtualGridY);
-      const dx = (wpos[0] - playerRichInfo.node.x);
-      const dy = (wpos[1] - playerRichInfo.node.y);
-      const justJiggling = (self.jigglingEps1D >= Math.abs(dx) && self.jigglingEps1D >= Math.abs(dy));
-      if (!justJiggling) {
-        playerRichInfo.node.setPosition(wpos[0], wpos[1]);
-        playerRichInfo.virtualGridX = immediatePlayerInfo.virtualGridX;
-        playerRichInfo.virtualGridY = immediatePlayerInfo.virtualGridY;
-        playerRichInfo.scriptIns.scheduleNewDirection(immediatePlayerInfo.dir, false);
-        playerRichInfo.scriptIns.updateSpeed(immediatePlayerInfo.speed);
-      }
-    });
+      const prevRdfPlayer = (null == prevRdf ? null : prevRdf.players[playerId]);
+      const [wx, wy] = self.virtualGridToWorldPos(immediatePlayerInfo.virtualGridX, immediatePlayerInfo.virtualGridY);
+      //const justJiggling = (self.jigglingEps1D >= Math.abs(wx - playerRichInfo.node.x) && self.jigglingEps1D >= Math.abs(wy - playerRichInfo.node.y));
+      playerRichInfo.node.setPosition(wx, wy);
+      playerRichInfo.scriptIns.updateSpeed(immediatePlayerInfo.speed);
+      playerRichInfo.scriptIns.updateCharacterAnim(immediatePlayerInfo, prevRdfPlayer, false);
+    }
   },
 
   getCachedInputFrameDownsyncWithPrediction(inputFrameId) {
@@ -990,7 +976,7 @@ cc.Class({
       const lastAllConfirmedInputFrame = self.recentInputCache.getByFrameId(self.lastAllConfirmedInputFrameId);
       for (let i = 0; i < inputFrameDownsync.inputList.length; ++i) {
         if (i == self.selfPlayerInfo.joinIndex - 1) continue;
-        inputFrameDownsync.inputList[i] = lastAllConfirmedInputFrame.inputList[i];
+        inputFrameDownsync.inputList[i] = (lastAllConfirmedInputFrame.inputList[i] & 15); // Don't predict attack input!
       }
     }
 
@@ -1000,60 +986,191 @@ cc.Class({
   // TODO: Write unit-test for this function to compare with its backend counter part
   applyInputFrameDownsyncDynamicsOnSingleRenderFrame(delayedInputFrame, currRenderFrame, collisionSys, collisionSysMap) {
     const self = this;
-    const nextRenderFramePlayers = {}
+    const nextRenderFramePlayers = {};
     for (let playerId in currRenderFrame.players) {
       const currPlayerDownsync = currRenderFrame.players[playerId];
       nextRenderFramePlayers[playerId] = {
         id: playerId,
         virtualGridX: currPlayerDownsync.virtualGridX,
         virtualGridY: currPlayerDownsync.virtualGridY,
-        dir: {
-          dx: currPlayerDownsync.dir.dx,
-          dy: currPlayerDownsync.dir.dy,
-        },
+        dirX: currPlayerDownsync.dirX,
+        dirY: currPlayerDownsync.dirY,
+        characterState: currPlayerDownsync.characterState,
         speed: currPlayerDownsync.speed,
         battleState: currPlayerDownsync.battleState,
         score: currPlayerDownsync.score,
         removed: currPlayerDownsync.removed,
         joinIndex: currPlayerDownsync.joinIndex,
+        framesToRecover: (0 < currPlayerDownsync.framesToRecover ? currPlayerDownsync.framesToRecover - 1 : 0),
+        hp: currPlayerDownsync.hp,
+        maxHp: currPlayerDownsync.maxHp,
       };
     }
 
     const toRet = {
       id: currRenderFrame.id + 1,
       players: nextRenderFramePlayers,
+      meleeBullets: []
     };
 
+    const bulletPushbacks = new Array(self.playerRichInfoArr.length); // Guaranteed determinism regardless of traversal order
+    const effPushbacks = new Array(self.playerRichInfoArr.length); // Guaranteed determinism regardless of traversal order
+
+    // Reset playerCollider position from the "virtual grid position"
+    for (let j in self.playerRichInfoArr) {
+      const joinIndex = parseInt(j) + 1;
+      bulletPushbacks[joinIndex - 1] = [0.0, 0.0];
+      effPushbacks[joinIndex - 1] = [0.0, 0.0];
+      const playerRichInfo = self.playerRichInfoArr[j];
+      const playerId = playerRichInfo.id;
+      const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
+      const playerCollider = collisionSysMap.get(collisionPlayerIndex);
+      const currPlayerDownsync = currRenderFrame.players[playerId];
+
+      const newVx = currPlayerDownsync.virtualGridX;
+      const newVy = currPlayerDownsync.virtualGridY;
+      [playerCollider.x, playerCollider.y] = self.virtualGridToPolygonColliderAnchorPos(newVx, newVy, self.playerRichInfoArr[joinIndex - 1].colliderRadius, self.playerRichInfoArr[joinIndex - 1].colliderRadius);
+    }
+
+    // Check bullet-anything collisions first, because the pushbacks caused by bullets might later be reverted by player-barrier collision 
+    const bulletColliders = new Map(); // Will all be removed at the end of `applyInputFrameDownsyncDynamicsOnSingleRenderFrame` due to the need for being rollback-compatible
+    const removedBulletsAtCurrFrame = new Set();
+    for (let k in currRenderFrame.meleeBullets) {
+      const meleeBullet = currRenderFrame.meleeBullets[k];
+      if (
+        meleeBullet.originatedRenderFrameId + meleeBullet.startupFrames <= currRenderFrame.id
+        &&
+        meleeBullet.originatedRenderFrameId + meleeBullet.startupFrames + meleeBullet.activeFrames > currRenderFrame.id
+      ) {
+        const collisionBulletIndex = self.collisionBulletIndexPrefix + meleeBullet.battleLocalId;
+        const collisionOffenderIndex = self.collisionPlayerIndexPrefix + meleeBullet.offenderJoinIndex;
+        const offenderCollider = collisionSysMap.get(collisionOffenderIndex);
+        const offender = currRenderFrame.players[meleeBullet.offenderPlayerId];
+
+        let xfac = 1; // By now, straight Punch offset doesn't respect "y-axis"
+        if (0 > offender.dirX) {
+          xfac = -1;
+        }
+        const [offenderWx, offenderWy] = self.virtualGridToWorldPos(offender.virtualGridX, offender.virtualGridY);
+        const bulletWx = offenderWx + xfac * meleeBullet.hitboxOffset;
+        const bulletWy = offenderWy;
+        const [bulletCx, bulletCy] = self.worldToPolygonColliderAnchorPos(bulletWx, bulletWy, meleeBullet.hitboxSize.x * 0.5, meleeBullet.hitboxSize.y * 0.5),
+          pts = [[0, 0], [meleeBullet.hitboxSize.x, 0], [meleeBullet.hitboxSize.x, meleeBullet.hitboxSize.y], [0, meleeBullet.hitboxSize.y]];
+        const newBulletCollider = collisionSys.createPolygon(bulletCx, bulletCy, pts);
+        newBulletCollider.data = meleeBullet;
+        collisionSysMap.set(collisionBulletIndex, newBulletCollider);
+        bulletColliders.set(collisionBulletIndex, newBulletCollider);
+      // console.log(`A meleeBullet is added to collisionSys at currRenderFrame.id=${currRenderFrame.id} as start-up frames ended and active frame is not yet ended: ${JSON.stringify(meleeBullet)}`);
+      }
+    }
+
+    collisionSys.update();
+    const result1 = collisionSys.createResult(); // Can I reuse a "self.collisionSysResult" object throughout the whole battle?
+
+    bulletColliders.forEach((bulletCollider, collisionBulletIndex) => {
+      const potentials = bulletCollider.potentials();
+      const offender = currRenderFrame.players[bulletCollider.data.offenderPlayerId];
+      let shouldRemove = false;
+      for (const potential of potentials) {
+        if (null != potential.data && potential.data.joinIndex == bulletCollider.data.offenderJoinIndex) continue;
+        if (!bulletCollider.collides(potential, result1)) continue;
+        if (null != potential.data && null !== potential.data.joinIndex) {
+          const joinIndex = potential.data.joinIndex;
+          let xfac = 1;
+          if (0 > offender.dirX) {
+            xfac = -1;
+          }
+          bulletPushbacks[joinIndex - 1][0] += xfac * bulletCollider.data.pushback; // Only for straight punch, there's no y-pushback
+          bulletPushbacks[joinIndex - 1][1] += 0;
+          const thatAckedPlayerInNextFrame = nextRenderFramePlayers[potential.data.id];
+          thatAckedPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Atked1[0];
+          const oldFramesToRecover = thatAckedPlayerInNextFrame.framesToRecover;
+          thatAckedPlayerInNextFrame.framesToRecover = (oldFramesToRecover > bulletCollider.data.hitStunFrames ? oldFramesToRecover : bulletCollider.data.hitStunFrames); // In case the hit player is already stun, we extend it 
+        }
+        shouldRemove = true;
+      }
+      if (shouldRemove) {
+        removedBulletsAtCurrFrame.add(collisionBulletIndex);
+      }
+    });
+
+    // [WARNING] Remove bullets from collisionSys ANYWAY for the convenience of rollback
+    for (let k in currRenderFrame.meleeBullets) {
+      const meleeBullet = currRenderFrame.meleeBullets[k];
+      const collisionBulletIndex = self.collisionBulletIndexPrefix + meleeBullet.battleLocalId;
+      if (collisionSysMap.has(collisionBulletIndex)) {
+        const bulletCollider = collisionSysMap.get(collisionBulletIndex);
+        bulletCollider.remove();
+        collisionSysMap.delete(collisionBulletIndex);
+      }
+      if (removedBulletsAtCurrFrame.has(collisionBulletIndex)) continue;
+      toRet.meleeBullets.push(meleeBullet);
+    }
+
+    // Process player inputs
     if (null != delayedInputFrame) {
+      const delayedInputFrameForPrevRenderFrame = self.getCachedInputFrameDownsyncWithPrediction(self._convertToInputFrameId(currRenderFrame.id - 1, self.inputDelayFrames));
       const inputList = delayedInputFrame.inputList;
-      const effPushbacks = new Array(self.playerRichInfoArr.length); // Guaranteed determinism regardless of traversal order
       for (let j in self.playerRichInfoArr) {
         const joinIndex = parseInt(j) + 1;
         effPushbacks[joinIndex - 1] = [0.0, 0.0];
-        const playerId = self.playerRichInfoArr[j].id;
+        const playerRichInfo = self.playerRichInfoArr[j];
+        const playerId = playerRichInfo.id;
         const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
         const playerCollider = collisionSysMap.get(collisionPlayerIndex);
-        const player = currRenderFrame.players[playerId];
+        const currPlayerDownsync = currRenderFrame.players[playerId];
+        const thatPlayerInNextFrame = nextRenderFramePlayers[playerId];
+        if (0 < thatPlayerInNextFrame.framesToRecover) {
+          // No need to process inputs for this player, but there might be bullet pushbacks on this player  
+          playerCollider.x += bulletPushbacks[joinIndex - 1][0];
+          playerCollider.y += bulletPushbacks[joinIndex - 1][1];
+          if (0 != bulletPushbacks[joinIndex - 1][0] || 0 != bulletPushbacks[joinIndex - 1][1]) {
+            console.log(`playerId=${playerId}, joinIndex=${joinIndex} is pushbacked back by ${bulletPushbacks[joinIndex - 1]} by bullet impacts, now its framesToRecover is ${thatPlayerInNextFrame.framesToRecover}`);
+          }
+          continue;
+        }
 
-        const encodedInput = inputList[joinIndex - 1];
-        const decodedInput = self.ctrl.decodeDirection(encodedInput);
+        const decodedInput = self.ctrl.decodeInput(inputList[joinIndex - 1]);
 
-        // console.log(`Got non-zero inputs for playerId=${playerId}, decodedInput=${JSON.stringify(decodedInput)} @currRenderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.id}`);
-        /* 
-        Reset "position" of players in "collisionSys" according to "virtual grid position". The easy part is that we don't have path-dependent-integrals to worry about like that of thermal dynamics.
-        */
-        const newVx = player.virtualGridX + (decodedInput.dx + player.speed * decodedInput.dx);
-        const newVy = player.virtualGridY + (decodedInput.dy + player.speed * decodedInput.dy);
-        const newCpos = self.virtualGridToPlayerColliderPos(newVx, newVy, self.playerRichInfoArr[joinIndex - 1]);
-        playerCollider.x = newCpos[0];
-        playerCollider.y = newCpos[1];
-        // Update directions and thus would eventually update moving animation accordingly
-        nextRenderFramePlayers[playerId].dir.dx = decodedInput.dx;
-        nextRenderFramePlayers[playerId].dir.dy = decodedInput.dy;
+        const prevDecodedInput = (null == delayedInputFrameForPrevRenderFrame ? null : self.ctrl.decodeInput(delayedInputFrameForPrevRenderFrame.inputList[joinIndex - 1]));
+        const prevBtnALevel = (null == prevDecodedInput ? 0 : prevDecodedInput.btnALevel);
+
+        if (1 == decodedInput.btnALevel && 0 == prevBtnALevel) {
+          // console.log(`playerId=${playerId} triggered a rising-edge of btnA at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}`);
+          if (self.bulletTriggerEnabled) {
+            const punchSkillId = 1;
+            const punch = window.pb.protos.MeleeBullet.create(self.meleeSkillConfig[punchSkillId]);
+            thatPlayerInNextFrame.framesToRecover = punch.recoveryFrames;
+            punch.battleLocalId = self.bulletBattleLocalIdCounter++;
+            punch.offenderJoinIndex = joinIndex;
+            punch.offenderPlayerId = playerId;
+            punch.originatedRenderFrameId = currRenderFrame.id;
+            toRet.meleeBullets.push(punch);
+            // console.log(`A rising-edge of meleeBullet is created at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}: ${self._stringifyRecentInputCache(true)}`);
+            // console.log(`A rising-edge of meleeBullet is created at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}`);
+
+            thatPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Atk1[0];
+          }
+        } else if (0 == decodedInput.btnALevel && 1 == prevBtnALevel) {
+          // console.log(`playerId=${playerId} triggered a falling-edge of btnA at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}`);
+        } else {
+          // No bullet trigger, process movement inputs
+          if (0 != decodedInput.dx || 0 != decodedInput.dy) {
+            // Update directions and thus would eventually update moving animation accordingly
+            thatPlayerInNextFrame.dirX = decodedInput.dx;
+            thatPlayerInNextFrame.dirY = decodedInput.dy;
+            thatPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Walking[0];
+          } else {
+            thatPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Idle1[0];
+          }
+          const [movementX, movementY] = self.virtualGridToWorldPos(decodedInput.dx + currPlayerDownsync.speed * decodedInput.dx, decodedInput.dy + currPlayerDownsync.speed * decodedInput.dy);
+          playerCollider.x += movementX;
+          playerCollider.y += movementY;
+        }
       }
 
-      collisionSys.update();
-      const result = collisionSys.createResult(); // Can I reuse a "self.collisionSysResult" object throughout the whole battle?
+      collisionSys.update(); // by now all "bulletCollider"s are removed
+      const result2 = collisionSys.createResult(); // Can I reuse a "self.collisionSysResult" object throughout the whole battle?
 
       for (let j in self.playerRichInfoArr) {
         const joinIndex = parseInt(j) + 1;
@@ -1063,10 +1180,10 @@ cc.Class({
         const potentials = playerCollider.potentials();
         for (const potential of potentials) {
           // Test if the player collides with the wall
-          if (!playerCollider.collides(potential, result)) continue;
+          if (!playerCollider.collides(potential, result2)) continue;
           // Push the player out of the wall
-          effPushbacks[joinIndex - 1][0] += result.overlap * result.overlap_x;
-          effPushbacks[joinIndex - 1][1] += result.overlap * result.overlap_y;
+          effPushbacks[joinIndex - 1][0] += result2.overlap * result2.overlap_x;
+          effPushbacks[joinIndex - 1][1] += result2.overlap * result2.overlap_y;
         }
       }
 
@@ -1075,10 +1192,10 @@ cc.Class({
         const playerId = self.playerRichInfoArr[j].id;
         const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
         const playerCollider = collisionSysMap.get(collisionPlayerIndex);
-        const newVpos = self.playerColliderAnchorToVirtualGridPos(playerCollider.x - effPushbacks[joinIndex - 1][0], playerCollider.y - effPushbacks[joinIndex - 1][1], self.playerRichInfoArr[j]);
-        nextRenderFramePlayers[playerId].virtualGridX = newVpos[0];
-        nextRenderFramePlayers[playerId].virtualGridY = newVpos[1];
+        const thatPlayerInNextFrame = nextRenderFramePlayers[playerId];
+        [thatPlayerInNextFrame.virtualGridX, thatPlayerInNextFrame.virtualGridY] = self.polygonColliderAnchorToVirtualGridPos(playerCollider.x - effPushbacks[joinIndex - 1][0], playerCollider.y - effPushbacks[joinIndex - 1][1], self.playerRichInfoArr[j].colliderRadius, self.playerRichInfoArr[j].colliderRadius);
       }
+
     }
 
     return toRet;
@@ -1089,29 +1206,30 @@ cc.Class({
     This function eventually calculates a "RoomDownsyncFrame" where "RoomDownsyncFrame.id == renderFrameIdEd" if not interruptted.
     */
     const self = this;
+    let prevLatestRdf = null;
     let latestRdf = self.recentRenderCache.getByFrameId(renderFrameIdSt); // typed "RoomDownsyncFrame"
     if (null == latestRdf) {
       console.error(`Couldn't find renderFrameId=${renderFrameIdSt}, to rollback, lastAllConfirmedRenderFrameId=${self.lastAllConfirmedRenderFrameId}, lastAllConfirmedInputFrameId=${self.lastAllConfirmedInputFrameId}, recentRenderCache=${self._stringifyRecentRenderCache(false)}, recentInputCache=${self._stringifyRecentInputCache(false)}`);
-      return latestRdf;
+      return [prevLatestRdf, latestRdf];
     }
 
     if (renderFrameIdSt >= renderFrameIdEd) {
-      return latestRdf;
+      return [prevLatestRdf, latestRdf];
     }
 
     for (let i = renderFrameIdSt; i < renderFrameIdEd; ++i) {
       const currRenderFrame = self.recentRenderCache.getByFrameId(i); // typed "RoomDownsyncFrame"; [WARNING] When "true == isChasing", this function can be interruptted by "onRoomDownsyncFrame(rdf)" asynchronously anytime, making this line return "null"!
       if (null == currRenderFrame) {
         console.warn(`Couldn't find renderFrame for i=${i} to rollback, self.renderFrameId=${self.renderFrameId}, lastAllConfirmedRenderFrameId=${self.lastAllConfirmedRenderFrameId}, lastAllConfirmedInputFrameId=${self.lastAllConfirmedInputFrameId}, might've been interruptted by onRoomDownsyncFrame`);
-        return latestRdf;
+        return [prevLatestRdf, latestRdf];
       }
       const j = self._convertToInputFrameId(i, self.inputDelayFrames);
       const delayedInputFrame = self.getCachedInputFrameDownsyncWithPrediction(j);
       if (null == delayedInputFrame) {
         console.warn(`Failed to get cached delayedInputFrame for i=${i}, j=${j}, self.renderFrameId=${self.renderFrameId}, lastAllConfirmedRenderFrameId=${self.lastAllConfirmedRenderFrameId}, lastAllConfirmedInputFrameId=${self.lastAllConfirmedInputFrameId}`);
-        return latestRdf;
+        return [prevLatestRdf, latestRdf];
       }
-
+      prevLatestRdf = latestRdf;
       latestRdf = self.applyInputFrameDownsyncDynamicsOnSingleRenderFrame(delayedInputFrame, currRenderFrame, collisionSys, collisionSysMap);
       if (
         self._allConfirmed(delayedInputFrame.confirmedList)
@@ -1133,29 +1251,27 @@ cc.Class({
       self.dumpToRenderCache(latestRdf);
     }
 
-    return latestRdf;
+    return [prevLatestRdf, latestRdf];
   },
 
-  _initPlayerRichInfoDict(players, playerMetas) {
+  _initPlayerRichInfoDict(players) {
     const self = this;
     for (let k in players) {
       const playerId = parseInt(k);
       if (self.playerRichInfoDict.has(playerId)) continue; // Skip already put keys
       const immediatePlayerInfo = players[playerId];
-      const immediatePlayerMeta = playerMetas[playerId];
       self.playerRichInfoDict.set(playerId, immediatePlayerInfo);
-      Object.assign(self.playerRichInfoDict.get(playerId), immediatePlayerMeta);
 
-      const nodeAndScriptIns = self.spawnPlayerNode(immediatePlayerInfo.joinIndex, immediatePlayerInfo.virtualGridX, immediatePlayerInfo.virtualGridY, self.playerRichInfoDict.get(playerId));
+      const [theNode, theScriptIns] = self.spawnPlayerNode(immediatePlayerInfo.joinIndex, immediatePlayerInfo.virtualGridX, immediatePlayerInfo.virtualGridY, immediatePlayerInfo);
 
       Object.assign(self.playerRichInfoDict.get(playerId), {
-        node: nodeAndScriptIns[0],
-        scriptIns: nodeAndScriptIns[1]
+        node: theNode,
+        scriptIns: theScriptIns,
       });
 
       if (self.selfPlayerInfo.id == playerId) {
         self.selfPlayerInfo = Object.assign(self.selfPlayerInfo, immediatePlayerInfo);
-        nodeAndScriptIns[1].showArrowTipNode();
+        theScriptIns.showArrowTipNode();
       }
     }
     self.playerRichInfoArr = new Array(self.playerRichInfoDict.size);
@@ -1207,23 +1323,23 @@ cc.Class({
     return [wx, wy];
   },
 
-  playerWorldToCollisionPos(wx, wy, playerRichInfo) {
-    return [wx - playerRichInfo.colliderRadius, wy - playerRichInfo.colliderRadius];
+  worldToPolygonColliderAnchorPos(wx, wy, halfBoundingW, halfBoundingH) {
+    return [wx - halfBoundingW, wy - halfBoundingH];
   },
 
-  playerColliderAnchorToWorldPos(cx, cy, playerRichInfo) {
-    return [cx + playerRichInfo.colliderRadius, cy + playerRichInfo.colliderRadius];
+  polygonColliderAnchorToWorldPos(cx, cy, halfBoundingW, halfBoundingH) {
+    return [cx + halfBoundingW, cy + halfBoundingH];
   },
 
-  playerColliderAnchorToVirtualGridPos(cx, cy, playerRichInfo) {
+  polygonColliderAnchorToVirtualGridPos(cx, cy, halfBoundingW, halfBoundingH) {
     const self = this;
-    const wpos = self.playerColliderAnchorToWorldPos(cx, cy, playerRichInfo);
-    return self.worldToVirtualGridPos(wpos[0], wpos[1])
+    const [wx, wy] = self.polygonColliderAnchorToWorldPos(cx, cy, halfBoundingW, halfBoundingH);
+    return self.worldToVirtualGridPos(wx, wy)
   },
 
-  virtualGridToPlayerColliderPos(vx, vy, playerRichInfo) {
+  virtualGridToPolygonColliderAnchorPos(vx, vy, halfBoundingW, halfBoundingH) {
     const self = this;
-    const wpos = self.virtualGridToWorldPos(vx, vy);
-    return self.playerWorldToCollisionPos(wpos[0], wpos[1], playerRichInfo)
+    const [wx, wy] = self.virtualGridToWorldPos(vx, vy);
+    return self.worldToPolygonColliderAnchorPos(wx, wy, halfBoundingW, halfBoundingH)
   },
 });

frontend/assets/scripts/NPCPlayer.js

@@ -1,326 +0,0 @@
-const COLLISION_WITH_PLAYER_STATE = {
-  WALKING_COLLIDABLE: 0,
-  STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM: 1,
-  STILL_NEAR_SELF_PLAYER_ONLY_PLAYED_ANIM: 2,
-  STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM: 3,
-  STILL_NEAR_OTHER_PLAYER_ONLY_PLAYED_ANIM: 4,
-  STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM: 5,
-  STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM: 6,
-  WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER: 7,
-  STILL_NEAR_NOBODY_PLAYING_ANIM: 8,
-};
-
-const STILL_NEAR_SELF_PLAYER_STATE_SET = new Set();
-STILL_NEAR_SELF_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM);
-STILL_NEAR_SELF_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYED_ANIM);
-STILL_NEAR_SELF_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM);
-STILL_NEAR_SELF_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM);
-
-const STILL_NEAR_OTHER_PLAYER_STATE_SET = new Set();
-STILL_NEAR_OTHER_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM);
-STILL_NEAR_OTHER_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYED_ANIM);
-STILL_NEAR_OTHER_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM);
-STILL_NEAR_OTHER_PLAYER_STATE_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM);
-
-const STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET = new Set();
-STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM);
-STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYED_ANIM);
-STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM);
-STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYED_ANIM);
-STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM);
-STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM);
-STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.add(COLLISION_WITH_PLAYER_STATE.STILL_NEAR_NOBODY_PLAYING_ANIM);
-
-function transitWalkingConditionallyCollidableToUnconditionallyCollidable(currentCollisionWithPlayerState) {
-  switch (currentCollisionWithPlayerState) {
-    case COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER:
-      return COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE;
-  }
-
-  return currentCollisionWithPlayerState;
-}
-
-function transitUponSelfPlayerLeftProximityArea(currentCollisionWithPlayerState) {
-  switch (currentCollisionWithPlayerState) {
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_NOBODY_PLAYING_ANIM;
-
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYED_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE;
-
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM;
-
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER;
-  }
-  return currentCollisionWithPlayerState;
-}
-
-function transitDueToNoBodyInProximityArea(currentCollisionWithPlayerState) {
-  switch (currentCollisionWithPlayerState) {
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM:
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM:
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_NOBODY_PLAYING_ANIM;
-
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYED_ANIM:
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYED_ANIM:
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER;
-  }
-  return currentCollisionWithPlayerState;
-}
-
-function transitToPlayingStunnedAnim(currentCollisionWithPlayerState, dueToSelfPlayer, dueToOtherPlayer) {
-  if (dueToSelfPlayer) {
-    switch (currentCollisionWithPlayerState) {
-      case COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE:
-      case COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER:
-        return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM;
-    }
-  }
-
-  if (dueToOtherPlayer) {
-    switch (currentCollisionWithPlayerState) {
-      case COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE:
-        return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM;
-    }
-  }
-  // TODO: Any error to throw?
-  return currentCollisionWithPlayerState;
-}
-
-function transitDuringPlayingStunnedAnim(currentCollisionWithPlayerState, dueToSelfPlayerComesIntoProximity, dueToOtherPlayerComesIntoProximity) {
-  if (dueToSelfPlayerComesIntoProximity) {
-    switch (currentCollisionWithPlayerState) {
-      case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM:
-        return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM;
-
-      case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_NOBODY_PLAYING_ANIM:
-        return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM;
-    }
-  }
-
-  if (dueToOtherPlayerComesIntoProximity) {
-    switch (currentCollisionWithPlayerState) {
-      case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM:
-        return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM;
-
-      case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_NOBODY_PLAYING_ANIM:
-        return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM;
-    }
-  }
-  // TODO: Any error to throw?
-  return currentCollisionWithPlayerState;
-}
-
-function transitStunnedAnimPlayingToPlayed(currentCollisionWithPlayerState, forceNotCollidableWithOtherPlayer) {
-  switch (currentCollisionWithPlayerState) {
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYING_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_ONLY_PLAYED_ANIM;
-
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYING_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYED_ANIM;
-
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYING_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM;
-
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_NOBODY_PLAYING_ANIM:
-      return (true == forceNotCollidableWithOtherPlayer ? COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER : COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE);
-  }
-  // TODO: Any error to throw?
-  return currentCollisionWithPlayerState;
-}
-
-function transitStunnedAnimPlayedToWalking(currentCollisionWithPlayerState) {
-  /*
-  * Intentionally NOT transiting for 
-  *
-  * - STILL_NEAR_SELF_PLAYER_NEAR_OTHER_PLAYER_PLAYED_ANIM, or 
-  * - STILL_NEAR_SELF_PLAYER_ONLY_PLAYED_ANIM,
-  *
-  * which should be transited upon leaving of "SelfPlayer".
-  */
-  switch (currentCollisionWithPlayerState) {
-    case COLLISION_WITH_PLAYER_STATE.STILL_NEAR_OTHER_PLAYER_ONLY_PLAYED_ANIM:
-      return COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER;
-  }
-  // TODO: Any error to throw?
-  return currentCollisionWithPlayerState;
-}
-
-const BasePlayer = require("./BasePlayer"); 
-
-cc.Class({
-  extends: BasePlayer,
-
-  // LIFE-CYCLE CALLBACKS:
-  start() {
-    BasePlayer.prototype.start.call(this);
-
-    this.scheduleNewDirection(this._generateRandomDirection());
-  },
-
-  onLoad() {
-    BasePlayer.prototype.onLoad.call(this);
-    const self = this;
-
-    this.collisionWithPlayerState = COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE;
-
-    this.clips = {
-      '01': 'FlatHeadSisterRunTop',
-      '0-1': 'FlatHeadSisterRunBottom',
-      '-20': 'FlatHeadSisterRunLeft',
-      '20': 'FlatHeadSisterRunRight',
-      '-21': 'FlatHeadSisterRunTopLeft',
-      '21': 'FlatHeadSisterRunTopRight',
-      '-2-1': 'FlatHeadSisterRunBottomLeft',
-      '2-1': 'FlatHeadSisterRunBottomRight'
-    };
-
-
-    self.onStunnedAnimPlayedSafe = () => {
-      const oldCollisionWithPlayerState = self.collisionWithPlayerState;
-      self.collisionWithPlayerState = transitStunnedAnimPlayingToPlayed(this.collisionWithPlayerState, true);
-      if (oldCollisionWithPlayerState == self.collisionWithPlayerState || !self.node) return;
-      
-      self.scheduleNewDirection(self._generateRandomDirection()); 
-      self.collisionWithPlayerState = transitStunnedAnimPlayedToWalking(self.collisionWithPlayerState);
-      setTimeout(() => {
-        self.collisionWithPlayerState = transitWalkingConditionallyCollidableToUnconditionallyCollidable(self.collisionWithPlayerState);
-      }, 5000);
-    };
-
-    self.onStunnedAnimPlayedSafeAction = cc.callFunc(self.onStunnedAnimPlayedSafe, self);
-
-    self.playStunnedAnim = () => {
-      let colliededAction1 = cc.rotateTo(0.2, -15);
-      let colliededAction2 = cc.rotateTo(0.3, 15);
-      let colliededAction3 = cc.rotateTo(0.2, 0);
-     
-      self.node.runAction(cc.sequence(
-        cc.callFunc(() => {
-          self.player.pause()
-        }, self), 
-        colliededAction1, 
-        colliededAction2, 
-        colliededAction3, 
-        cc.callFunc(() => {
-          self.player.resume()
-        }, self), 
-        self.onStunnedAnimPlayedSafeAction
-      ));
-
-      // NOTE: Use <cc.Animation>.on('stop', self.onStunnedAnimPlayedSafe) if necessary.
-    }
-  },
-
-  _canMoveBy(vecToMoveBy) {
-    if (COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE_WITH_SELF_PLAYER_BUT_NOT_OTHER_PLAYER != this.collisionWithPlayerState && COLLISION_WITH_PLAYER_STATE.WALKING_COLLIDABLE != this.collisionWithPlayerState) {
-      return false;
-    }
-
-    const superRet = BasePlayer.prototype._canMoveBy.call(this, vecToMoveBy);
-    const self = this;
-
-    const computedNewDifferentPosLocalToParentWithinCurrentFrame = self.node.position.add(vecToMoveBy);
-
-    const currentSelfColliderCircle = self.node.getComponent("cc.CircleCollider"); 
-    let nextSelfColliderCircle = null;
-    if (0 < self.contactedBarriers.length || 0 < self.contactedNPCPlayers.length || 0 < self.contactedControlledPlayers) {
-      /* To avoid unexpected buckling. */
-      const mutatedVecToMoveBy = vecToMoveBy.mul(2);
-      nextSelfColliderCircle = {
-        position: self.node.position.add(vecToMoveBy.mul(2)).add(currentSelfColliderCircle.offset),  
-        radius: currentSelfColliderCircle.radius,
-      };
-    } else {
-      nextSelfColliderCircle = {
-        position: computedNewDifferentPosLocalToParentWithinCurrentFrame.add(currentSelfColliderCircle.offset),  
-        radius: currentSelfColliderCircle.radius,
-      };
-    }
-
-    for (let aCircleCollider of self.contactedControlledPlayers) {
-      let contactedCircleLocalToParentWithinCurrentFrame = {
-        position: aCircleCollider.node.position.add(aCircleCollider.offset),  
-        radius: aCircleCollider.radius,
-      };
-      if (cc.Intersection.circleCircle(contactedCircleLocalToParentWithinCurrentFrame, nextSelfColliderCircle)) {
-        return false;
-      }
-    }
-
-    return superRet;
-  },
-
-  update(dt) {
-    BasePlayer.prototype.update.call(this, dt);
-  },
-
-  onCollisionEnter(other, self) {
-    BasePlayer.prototype.onCollisionEnter.call(this, other, self);
-    const playerScriptIns = self.getComponent(self.node.name);
-    switch (other.node.name) {
-      case "SelfPlayer":
-        playerScriptIns._addContactedControlledPlayers(other);
-        if (1 == playerScriptIns.contactedControlledPlayers.length) {
-          // When "SelfPlayer" comes into proximity area.
-          if (!STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.has(playerScriptIns.collisionWithPlayerState)) {
-            playerScriptIns.collisionWithPlayerState = transitToPlayingStunnedAnim(playerScriptIns.collisionWithPlayerState, true, false);
-            playerScriptIns.playStunnedAnim();
-          } else {
-            playerScriptIns.collisionWithPlayerState = transitDuringPlayingStunnedAnim(playerScriptIns.collisionWithPlayerState, true, false);
-          }
-        }
-        break;
-      case "NPCPlayer":
-        if (1 == playerScriptIns.contactedNPCPlayers.length) {
-          // When one of the other "OtherPlayer"s comes into proximity area.
-          if (!STILL_SHOULD_NOT_PLAY_STUNNED_ANIM_SET.has(playerScriptIns.collisionWithPlayerState)) {
-            const oldState = playerScriptIns.collisionWithPlayerState; 
-            playerScriptIns.collisionWithPlayerState = transitToPlayingStunnedAnim(oldState, false, true);
-            if (playerScriptIns.collisionWithPlayerState != oldState) {
-              playerScriptIns.playStunnedAnim();
-            }
-          } else {
-            playerScriptIns.collisionWithPlayerState = transitDuringPlayingStunnedAnim(playerScriptIns.collisionWithPlayerState, false, true);
-          }
-        }
-        break;
-      default:
-        break;
-    }
-  },
-
-  onCollisionStay(other, self) {
-    // TBD.
-  },
-
-  onCollisionExit(other, self) {
-    BasePlayer.prototype.onCollisionExit.call(this, other, self);
-    const playerScriptIns = self.getComponent(self.node.name);
-    switch (other.node.name) {
-      case "SelfPlayer":
-        playerScriptIns._removeContactedControlledPlayer(other);
-        if (0 == playerScriptIns.contactedControlledPlayers.length) {
-          // Special release step.
-          if (STILL_NEAR_SELF_PLAYER_STATE_SET.has(playerScriptIns.collisionWithPlayerState)) {
-            playerScriptIns.collisionWithPlayerState = transitUponSelfPlayerLeftProximityArea(playerScriptIns.collisionWithPlayerState);
-          }
-        }
-        if (0 == playerScriptIns.contactedControlledPlayers.length && 0 == playerScriptIns.contactedNPCPlayers.length) {
-          transitDueToNoBodyInProximityArea(playerScriptIns.collisionWithPlayerState);
-        }
-        break;
-      case "NPCPlayer":
-        if (0 == playerScriptIns.contactedControlledPlayers.length && 0 == playerScriptIns.contactedNPCPlayers.length) {
-          transitDueToNoBodyInProximityArea(playerScriptIns.collisionWithPlayerState);
-        }
-        break;
-      default:
-        break;
-    } 
-  },
-});

frontend/assets/scripts/NPCPlayer.js.meta

@@ -1,9 +0,0 @@
-{
-  "ver": "1.0.5",
-  "uuid": "17759956-1f8c-421f-bac2-7f4dd7ccdcda",
-  "isPlugin": false,
-  "loadPluginInWeb": true,
-  "loadPluginInNative": true,
-  "loadPluginInEditor": false,
-  "subMetas": {}
-}

frontend/assets/scripts/OfflineMap.js

@@ -0,0 +1,204 @@
+const i18n = require('LanguageData');
+i18n.init(window.language); // languageID should be equal to the one we input in New Language ID input field
+
+const OnlineMap = require('./Map');
+
+cc.Class({
+  extends: OnlineMap,
+
+  onDestroy() {
+    console.warn("+++++++ Map onDestroy()");
+  },
+
+  onLoad() {
+    const self = this;
+    window.mapIns = self;
+
+    cc.director.getCollisionManager().enabled = false;
+
+    const mapNode = self.node;
+    const canvasNode = mapNode.parent;
+
+    self.mainCameraNode = self.canvasNode.getChildByName("Main Camera");
+    self.mainCamera = self.mainCameraNode.getComponent(cc.Camera);
+    for (let child of self.mainCameraNode.children) {
+      child.setScale(1 / self.mainCamera.zoomRatio);
+    }
+    self.widgetsAboveAllNode = self.mainCameraNode.getChildByName("WidgetsAboveAll");
+    self.mainCameraNode.setPosition(cc.v2());
+
+    /** Init required prefab ended. */
+
+    self.inputDelayFrames = 8;
+    self.inputScaleFrames = 2;
+    self.inputFrameUpsyncDelayTolerance = 2;
+
+    self.rollbackEstimatedDt = 0.016667;
+    self.rollbackEstimatedDtMillis = 16.667;
+    self.rollbackEstimatedDtNanos = 16666666;
+
+    self.worldToVirtualGridRatio = 1000;
+    self.virtualGridToWorldRatio = 1.0 / self.worldToVirtualGridRatio;
+    self.meleeSkillConfig = {
+      1: {
+        // for offender
+        startupFrames: 23,
+        activeFrames: 3,
+        recoveryFrames: 61, // usually but not always "startupFrames+activeFrames", I hereby set it to be 1 frame more than the actual animation to avoid critical transition, i.e. when the animation is 1 frame from ending but "rdfPlayer.framesToRecover" is already counted 0 and the player triggers an other same attack, making an effective bullet trigger but no animation is played due to same animName is still playing
+        recoveryFramesOnBlock: 61,
+        recoveryFramesOnHit: 61,
+        moveforward: {
+          x: 0,
+          y: 0,
+        },
+        hitboxOffset: 12.0, // should be about the radius of the PlayerCollider 
+        hitboxSize: {
+          x: 45.0,
+          y: 32.0,
+        },
+
+        // for defender
+        hitStunFrames: 18,
+        blockStunFrames: 9,
+        pushback: 11.0,
+        releaseTriggerType: 1, // 1: rising-edge, 2: falling-edge  
+        damage: 5
+      }
+    };
+
+    const tiledMapIns = self.node.getComponent(cc.TiledMap);
+
+    const fullPathOfTmxFile = cc.js.formatStr("map/%s/map", "dungeon");
+    cc.loader.loadRes(fullPathOfTmxFile, cc.TiledMapAsset, (err, tmxAsset) => {
+      if (null != err) {
+        console.error(err);
+        return;
+      }
+
+      tiledMapIns.tmxAsset = null;
+      mapNode.removeAllChildren();
+      self._resetCurrentMatch();
+
+      tiledMapIns.tmxAsset = tmxAsset;
+      const newMapSize = tiledMapIns.getMapSize();
+      const newTileSize = tiledMapIns.getTileSize();
+      self.node.setContentSize(newMapSize.width * newTileSize.width, newMapSize.height * newTileSize.height);
+      self.node.setPosition(cc.v2(0, 0));
+
+      let barrierIdCounter = 0;
+      const boundaryObjs = tileCollisionManager.extractBoundaryObjects(self.node);
+      for (let boundaryObj of boundaryObjs.barriers) {
+        const x0 = boundaryObj.anchor.x,
+          y0 = boundaryObj.anchor.y;
+
+        const newBarrier = self.collisionSys.createPolygon(x0, y0, Array.from(boundaryObj, p => {
+          return [p.x, p.y];
+        }));
+
+        if (self.showCriticalCoordinateLabels) {
+          for (let i = 0; i < boundaryObj.length; ++i) {
+            const barrierVertLabelNode = new cc.Node();
+            switch (i % 4) {
+              case 0:
+                barrierVertLabelNode.color = cc.Color.RED;
+                break;
+              case 1:
+                barrierVertLabelNode.color = cc.Color.GRAY;
+                break;
+              case 2:
+                barrierVertLabelNode.color = cc.Color.BLACK;
+                break;
+              default:
+                barrierVertLabelNode.color = cc.Color.MAGENTA;
+                break;
+            }
+            const wx = boundaryObj.anchor.x + boundaryObj[i].x,
+              wy = boundaryObj.anchor.y + boundaryObj[i].y;
+            barrierVertLabelNode.setPosition(cc.v2(wx, wy));
+            const barrierVertLabel = barrierVertLabelNode.addComponent(cc.Label);
+            barrierVertLabel.fontSize = 12;
+            barrierVertLabel.lineHeight = barrierVertLabel.fontSize + 1;
+            barrierVertLabel.string = `(${wx.toFixed(1)}, ${wy.toFixed(1)})`;
+            safelyAddChild(self.node, barrierVertLabelNode);
+            setLocalZOrder(barrierVertLabelNode, 5);
+
+            barrierVertLabelNode.active = true;
+          }
+
+        }
+        // console.log("Created barrier: ", newBarrier);
+        ++barrierIdCounter;
+        const collisionBarrierIndex = (self.collisionBarrierIndexPrefix + barrierIdCounter);
+        self.collisionSysMap.set(collisionBarrierIndex, newBarrier);
+      }
+
+      const startRdf = window.pb.protos.RoomDownsyncFrame.create({
+        id: window.MAGIC_ROOM_DOWNSYNC_FRAME_ID.BATTLE_START,
+        players: {
+          10: {
+            id: 10,
+            joinIndex: 1,
+            virtualGridX: 0,
+            virtualGridY: 0,
+            speed: 1 * self.worldToVirtualGridRatio,
+            colliderRadius: 12,
+            characterState: window.ATK_CHARACTER_STATE.Idle1[0],
+            framesToRecover: 0,
+            dirX: 0,
+            dirY: 0,
+          },
+          11: {
+            id: 11,
+            joinIndex: 2,
+            virtualGridX: 80 * self.worldToVirtualGridRatio,
+            virtualGridY: 40 * self.worldToVirtualGridRatio,
+            speed: 1 * self.worldToVirtualGridRatio,
+            colliderRadius: 12,
+            characterState: window.ATK_CHARACTER_STATE.Idle1[0],
+            framesToRecover: 0,
+            dirX: 0,
+            dirY: 0,
+          },
+        }
+      });
+      self.selfPlayerInfo = {
+        id: 10
+      };
+      self._initPlayerRichInfoDict(startRdf.players);
+      self.onRoomDownsyncFrame(startRdf);
+
+      self.battleState = ALL_BATTLE_STATES.IN_BATTLE;
+    });
+
+  },
+
+  update(dt) {
+    const self = this;
+    if (ALL_BATTLE_STATES.IN_BATTLE == self.battleState) {
+      const elapsedMillisSinceLastFrameIdTriggered = performance.now() - self.lastRenderFrameIdTriggeredAt;
+      if (elapsedMillisSinceLastFrameIdTriggered < (self.rollbackEstimatedDtMillis)) {
+        // console.debug("Avoiding too fast frame@renderFrameId=", self.renderFrameId, ": elapsedMillisSinceLastFrameIdTriggered=", elapsedMillisSinceLastFrameIdTriggered);
+        return;
+      }
+      try {
+        let st = performance.now();
+        let prevSelfInput = null,
+          currSelfInput = null;
+        const noDelayInputFrameId = self._convertToInputFrameId(self.renderFrameId, 0); // It's important that "inputDelayFrames == 0" here 
+        if (self.shouldGenerateInputFrameUpsync(self.renderFrameId)) {
+          const prevAndCurrInputs = self._generateInputFrameUpsync(noDelayInputFrameId);
+          prevSelfInput = prevAndCurrInputs[0];
+          currSelfInput = prevAndCurrInputs[1];
+        }
+
+        const [prevRdf, rdf] = self.rollbackAndChase(self.renderFrameId, self.renderFrameId + 1, self.collisionSys, self.collisionSysMap, false);
+        self.applyRoomDownsyncFrameDynamics(rdf, prevRdf);
+        let t3 = performance.now();
+      } catch (err) {
+        console.error("Error during Map.update", err);
+      } finally {
+        ++self.renderFrameId; // [WARNING] It's important to increment the renderFrameId AFTER all the operations above!!!
+      }
+    }
+  },
+});

frontend/assets/scripts/OfflineMap.js.meta

@@ -1,6 +1,6 @@
 {
   "ver": "1.0.5",
-  "uuid": "4561a173-bfd2-4f64-b7ba-888cce0e4d9d",
+  "uuid": "47d7dcb8-4b89-41da-9c6a-2499463a86a2",
   "isPlugin": false,
   "loadPluginInWeb": true,
   "loadPluginInNative": true,

frontend/assets/scripts/Pumpkin.js

@@ -1,13 +0,0 @@
-const Bullet = require("./Bullet");
-
-cc.Class({
-  extends: Bullet,
-  // LIFE-CYCLE CALLBACKS:
-  properties: {
-  },
-
-  onLoad() {
-    Bullet.prototype.onLoad.call(this);
-  },
-
-});

frontend/assets/scripts/Pumpkin.js.meta

@@ -1,9 +0,0 @@
-{
-  "ver": "1.0.5",
-  "uuid": "c3bb6519-af90-4641-bb5e-5abbbcdfa6da",
-  "isPlugin": false,
-  "loadPluginInWeb": true,
-  "loadPluginInNative": true,
-  "loadPluginInEditor": false,
-  "subMetas": {}
-}

frontend/assets/scripts/TouchEventsManager.js

@@ -94,6 +94,12 @@ cc.Class({
 
   onLoad() {
     this.cachedStickHeadPosition = cc.v2(0.0, 0.0);
+    this.cachedBtnUpLevel = 0;
+    this.cachedBtnDownLevel = 0;
+    this.cachedBtnLeftLevel = 0;
+    this.cachedBtnRightLevel = 0;
+    this.cachedBtnALevel = 0;
+
     this.canvasNode = this.mapNode.parent;
     this.mainCameraNode = this.canvasNode.getChildByName("Main Camera"); // Cannot drag and assign the `mainCameraNode` from CocosCreator EDITOR directly, otherwise it'll cause an infinite loading time, till v2.1.0.
     this.mainCamera = this.mainCameraNode.getComponent(cc.Camera);
@@ -143,6 +149,51 @@ cc.Class({
       self._touchEndEvent(event);
     });
     zoomingListenerNode.inTouchPoints = new Map();
+
+    // Setup keyboard controls for the ease of attach debugging
+    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, function(evt) {
+      switch (evt.keyCode) {
+        case cc.macro.KEY.w:
+          self.cachedBtnUpLevel = 1;
+          break;
+        case cc.macro.KEY.s:
+          self.cachedBtnDownLevel = 1;
+          break;
+        case cc.macro.KEY.a:
+          self.cachedBtnLeftLevel = 1;
+          break;
+        case cc.macro.KEY.d:
+          self.cachedBtnRightLevel = 1;
+          break;
+        case cc.macro.KEY.h:
+          self.cachedBtnALevel = 1;
+          break;
+        default:
+          break;
+      }
+    }, this);
+
+    cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, function(evt) {
+      switch (evt.keyCode) {
+        case cc.macro.KEY.w:
+          self.cachedBtnUpLevel = 0;
+          break;
+        case cc.macro.KEY.s:
+          self.cachedBtnDownLevel = 0;
+          break;
+        case cc.macro.KEY.a:
+          self.cachedBtnLeftLevel = 0;
+          break;
+        case cc.macro.KEY.d:
+          self.cachedBtnRightLevel = 0;
+          break;
+        case cc.macro.KEY.h:
+          self.cachedBtnALevel = 0;
+          break;
+        default:
+          break;
+      }
+    }, this);
   },
 
   _isMapOverMoved(mapTargetPos) {
@@ -239,7 +290,6 @@ cc.Class({
 
     // TODO: Handle single-finger-click event.
     } while (false);
-    this.cachedStickHeadPosition = cc.v2(0.0, 0.0);
     for (let touch of event._touches) {
       if (touch) {
         theListenerNode.inTouchPoints.delete(touch._id);
@@ -252,7 +302,42 @@ cc.Class({
   update(dt) {
     if (this.inMultiTouch) return;
     if (true != this.initialized) return;
+    const self = this;
+    // Keyboard takes top priority
+    let keyboardDiffVec = cc.v2(0, 0);
+    if (1 == this.cachedBtnUpLevel) {
+      if (1 == this.cachedBtnLeftLevel) {
+        keyboardDiffVec = cc.v2(-1.0, +1.0);
+      } else if (1 == this.cachedBtnRightLevel) {
+        keyboardDiffVec = cc.v2(+1.0, +1.0);
+      } else {
+        keyboardDiffVec = cc.v2(0.0, +1.0);
+      }
+    } else if (1 == this.cachedBtnDownLevel) {
+      if (1 == this.cachedBtnLeftLevel) {
+        keyboardDiffVec = cc.v2(-1.0, -1.0);
+      } else if (1 == this.cachedBtnRightLevel) {
+        keyboardDiffVec = cc.v2(+1.0, -1.0);
+      } else {
+        keyboardDiffVec = cc.v2(0.0, -1.0);
+      }
+    } else if (1 == this.cachedBtnLeftLevel) {
+      keyboardDiffVec = cc.v2(-1.0, 0.0);
+    } else if (1 == this.cachedBtnRightLevel) {
+      keyboardDiffVec = cc.v2(+1.0, 0.0);
+    }
+    if (0 != keyboardDiffVec.x || 0 != keyboardDiffVec.y) {
+      this.cachedStickHeadPosition = keyboardDiffVec.mul(this.maxHeadDistance / keyboardDiffVec.mag());
+    }
     this.stickhead.setPosition(this.cachedStickHeadPosition);
+
+    const translationListenerNode = (self.translationListenerNode ? self.translationListenerNode : self.mapNode);
+    if (0 == translationListenerNode.inTouchPoints.size
+      &&
+      (0 == keyboardDiffVec.x && 0 == keyboardDiffVec.y)
+    ) {
+      this.cachedStickHeadPosition = cc.v2(0, 0); // Important reset!
+    }
   },
 
   discretizeDirection(continuousDx, continuousDy, eps) {
@@ -312,18 +397,23 @@ cc.Class({
     return ret;
   },
 
-  decodeDirection(encodedDirection) {
-    const mapped = window.DIRECTION_DECODER[encodedDirection];
-    if (null == mapped) {
-      console.error("Unexpected encodedDirection = ", encodedDirection);
-    }
-    return {
-      dx: mapped[0],
-      dy: mapped[1],
-    };
+  getEncodedInput() {
+    const discretizedDir = this.discretizeDirection(this.stickhead.x, this.stickhead.y, this.joyStickEps).encodedIdx; // There're only 9 dirs, thus using only the lower 4-bits
+    const btnALevel = (this.cachedBtnALevel << 4);
+    return (btnALevel + discretizedDir);
   },
 
-  getDiscretizedDirection() {
-    return this.discretizeDirection(this.cachedStickHeadPosition.x, this.cachedStickHeadPosition.y, this.joyStickEps);
-  }
+  decodeInput(encodedInput) {
+    const encodedDirection = (encodedInput & 15);
+    const mappedDirection = window.DIRECTION_DECODER[encodedDirection];
+    if (null == mappedDirection) {
+      console.error("Unexpected encodedDirection = ", encodedDirection);
+    }
+    const btnALevel = ((encodedInput >> 4) & 1);
+    return window.pb.protos.InputFrameDecoded.create({
+      dx: mappedDirection[0],
+      dy: mappedDirection[1],
+      btnALevel: btnALevel,
+    });
+  },
 });

frontend/assets/scripts/Treasure.js

@@ -1,26 +0,0 @@
-window.LOW_SCORE_TREASURE_TYPE = 1;
-window.HIGH_SCORE_TREASURE_TYPE = 2;
-
-window.LOW_SCORE_TREASURE_SCORE = 100;
-window.HIGH_SCORE_TREASURE_SCORE = 200;
-
-cc.Class({
-  extends: cc.Component,
-
-  properties: {
-  },
-
-  setData (treasureInfo) {
-    const self = this;
-    this.score = treasureInfo.score;
-    this.type = treasureInfo.type;
-
-    this.treasureInfo = treasureInfo;
-
-    const spriteComponent = this.node.getComponent(cc.Sprite);
-    const targetGid = (window.LOW_SCORE_TREASURE_TYPE == treasureInfo.type ? window.battleEntityTypeNameToGlobalGid["LowScoreTreasure"] : window.battleEntityTypeNameToGlobalGid["HighScoreTreasure"])
-    spriteComponent.spriteFrame = window.getOrCreateSpriteFrameForGid(targetGid).spriteFrame;
-  },
-
-  start() {},
-})

frontend/assets/scripts/Treasure.js.meta

@@ -1,9 +0,0 @@
-{
-  "ver": "1.0.5",
-  "uuid": "5eea6ce5-0343-4776-80a4-fccd69bd099b",
-  "isPlugin": false,
-  "loadPluginInWeb": true,
-  "loadPluginInNative": true,
-  "loadPluginInEditor": false,
-  "subMetas": {}
-}

frontend/assets/scripts/TreasurePickedUpAnim.js

@@ -1,84 +0,0 @@
-cc.Class({
-  extends: cc.Component,
-
-  properties: {
-    pickedUpAnimNode: {
-      type: cc.Node,
-      default: null
-    },
-    durationMillis: {
-      default: 0 
-    },
-    binglingAnimNode: {
-      type: cc.Node,
-      default: null
-    },
-    binglingAnimDurationMillis: {
-      default: 0
-    },
-    scoreLabelNode: {
-      type: cc.Node,
-      default: null
-    }
-  
-  },
- 
-
-  setData (treasureInfo) {
-    const self = this;
-    this.score = treasureInfo.score ? treasureInfo.score : 100 ;
-    this.type = treasureInfo.type ? treasureInfo.type : 1;
-    this.scoreLabelNode.getComponent(cc.Label).string = this.score;
-    const spriteComponent = this.pickedUpAnimNode.getComponent(cc.Sprite);
-    //hardcode treasurePNG's path.
-    cc.loader.loadRes("textures/treasures/"+ this.type, cc.SpriteFrame, function (err, frame) {
-      if(err){
-        cc.warn(err);
-        return;
-      }
-      spriteComponent.spriteFrame = frame; 
-    })
-  },
-  
-  // LIFE-CYCLE CALLBACKS:
-  update (dt) {
-    const changingNode = this.pickedUpAnimNode; 
-    const elapsedMillis = Date.now() - this.startedAtMillis; 
-    if(elapsedMillis >= this.binglingAnimDurationMillis && null != this.binglingAnimNode && true == this.binglingAnimNode.active) {
-      this.binglingAnimNode.active = false;
-      this.startedAtMillis = Date.now();
-    }
-    if(this.binglingAnimNode.active)
-      return;
-    if (elapsedMillis > this.durationMillis) {
-      this.node.destroy();
-      return;
-    }
-    if (elapsedMillis <= this.firstDurationMillis) {
-      let posDiff = cc.v2(0, dt * this.yIncreaseSpeed);
-      changingNode.setPosition(changingNode.position.add(posDiff));
-      this.scoreLabelNode.setPosition(this.scoreLabelNode.position.add(posDiff));
-      changingNode.scale += (this.scaleIncreaseSpeed*dt); 
-    } else {
-      let posDiff = cc.v2(dt * this.xIncreaseSpeed , ( -1 *dt * this.yDecreaseSpeed));     
-      changingNode.setPosition(changingNode.position.add(posDiff));
-      this.scoreLabelNode.setPosition(this.scoreLabelNode.position.add(posDiff));
-      changingNode.opacity -= dt * this.opacityDegradeSpeed;
-      this.scoreLabelNode.opacity -= dt * this.opacityDegradeSpeed;
-    }
-  },
-
-  onLoad() {
-    this.pickedUpAnimNode.scale = 0; 
-    this.startedAtMillis = Date.now();
-
-    this.firstDurationMillis = (0.8*this.durationMillis);
-    this.yIncreaseSpeed = (200 *1000/this.firstDurationMillis);
-    this.scaleIncreaseSpeed = (2 * 1000/this.firstDurationMillis);
-
-    this.scondDurationMillis = (0.2 * this.durationMillis );
-    this.opacityDegradeSpeed = (255*1000/this.scondDurationMillis);
-    this.yDecreaseSpeed = (30*1000/this.scondDurationMillis);
-    this.xIncreaseSpeed = (20*1000/this.scondDurationMillis);
-  }
-});

frontend/assets/scripts/TreasurePickedUpAnim.js.meta

@@ -1,9 +0,0 @@
-{
-  "ver": "1.0.5",
-  "uuid": "697ef72c-27ee-4184-9ae3-885808d58153",
-  "isPlugin": false,
-  "loadPluginInWeb": true,
-  "loadPluginInNative": true,
-  "loadPluginInEditor": false,
-  "subMetas": {}
-}

frontend/assets/scripts/Type2NPCPlayer.js

@@ -1,28 +0,0 @@
-const BasePlayer = require("./BasePlayer"); 
-
-cc.Class({
-  extends: BasePlayer,
-
-  // LIFE-CYCLE CALLBACKS:
-  start() {
-    BasePlayer.prototype.start.call(this);
-  },
-
-  onLoad() {
-    BasePlayer.prototype.onLoad.call(this);
-    this.clips = {
-      '01': 'FlatHeadSisterRunTop',
-      '0-1': 'FlatHeadSisterRunBottom',
-      '-20': 'FlatHeadSisterRunLeft',
-      '20': 'FlatHeadSisterRunRight',
-      '-21': 'FlatHeadSisterRunTopLeft',
-      '21': 'FlatHeadSisterRunTopRight',
-      '-2-1': 'FlatHeadSisterRunBottomLeft',
-      '2-1': 'FlatHeadSisterRunBottomRight'
-    };
-  },
-
-  update(dt) {
-  },
-
-});

frontend/assets/scripts/Type2NPCPlayer.js.meta

@@ -1,9 +0,0 @@
-{
-  "ver": "1.0.5",
-  "uuid": "233a1795-0de3-4d7c-9ce6-c5736ade723f",
-  "isPlugin": false,
-  "loadPluginInWeb": true,
-  "loadPluginInNative": true,
-  "loadPluginInEditor": false,
-  "subMetas": {}
-}