<template>
  <div>
    <JsvPreload :preloadList="preload_info"></JsvPreload>
    <JsvActorMove :control="verticalControl" :style="{ top: 720 / 2 - 40, left: 50 }" ref="match">
      <!-- 跑动 -->
      <JsvSpriteAnim :spriteInfo="sprite_info_run.info" :loop="'infinite'" :viewSize="view_size" :duration="0.5"
        :autostart="true" :imageUrl="pngObject.run_png" :controller="spriteController_run" v-show="isrun">
      </JsvSpriteAnim>
      <!-- 跳起 -->
      <JsvSpriteAnim :spriteInfo="sprite_info_jumpUp.info" :loop="1" :viewSize="view_size" :duration="0.6"
        :autostart="true" :imageUrl="pngObject.jumpUp_png" :controller="spriteController_jump" v-show="isjump">
      </JsvSpriteAnim>
      <!-- 落下 -->
      <JsvSpriteAnim :spriteInfo="sprite_info_jumpDown.info" :loop="'infinite'" :viewSize="view_size" :duration="1"
        :autostart="true" :imageUrl="pngObject.jumpDown_png" :controller="spriteController_down" v-show="isdown">
      </JsvSpriteAnim>
      <!-- 滚动 -->
      <JsvSpriteAnim :spriteInfo="sprite_info_roll.info" :loop="2" :viewSize="view_size" :duration="0.4" :autostart="true"
        :imageUrl="pngObject.roll_png" :onAnimEnd="onAnimEnd" :controller="spriteController_roll" v-show="isroll">
      </JsvSpriteAnim>
      <!-- 失败 -->
      <JsvSpriteAnim :spriteInfo="sprite_info_fail.info" :loop="1" :viewSize="view_size" :duration="0.6" :autostart="true"
        :imageUrl="pngObject.fail_png" :controller="spriteController_fail" v-show="isover" :onAnimEnd="onAnimEnd">
      </JsvSpriteAnim>
      <!-- 主碰撞体  -->
      <div key="body" ref="body" :style="{
        top: 60,
        left: 70,
        width: 20,
        height: 50,
        backgroundColor: 'rgba(0,0,0,0)'
      }"></div>
      <!-- 副碰撞体 上层区域 -->
      <div key="head" ref="head" :style="{
        top: 20,
        left: 70,
        width: 20,
        height: 40,
        backgroundColor: 'rgba(0,0,0,0)'
      }" v-show="!ischange"></div>
    </JsvActorMove>
  </div>
</template>

<script setup>
import {
  JsvActorMove,
  JsvSpriteAnim,
  JsvPreload,
  buildPreloadInfo,
} from "jsview"
import { inject } from "vue";
import { pngObject, _formatInfo, jsonObject } from "../Common/MatchmanInfo";
//预加载火柴人信息
const preload_info = [buildPreloadInfo(pngObject.fail_png), buildPreloadInfo(pngObject.roll_png), buildPreloadInfo(pngObject.jumpDown_png), buildPreloadInfo(pngObject.jumpUp_png), buildPreloadInfo(pngObject.run_png)]
//接收信息
let verticalControl = inject("verticalControl")
let body = inject("body")
let head = inject("head")
let ischange = inject("ischange")
const onAnimEnd = inject("onAnimEnd")
let view_size = inject("view_size")
let match = inject("match")
let isrun = inject("isrun")
let isroll = inject("isroll")
let isdown = inject("isdown")
let isjump = inject("isjump")
let isover = inject('isover')

//不同形态控制器
const spriteController_run = inject("spriteController_run")
const spriteController_jump = inject("spriteController_jump")
const spriteController_down = inject("spriteController_down")
const spriteController_roll = inject("spriteController_roll")
const spriteController_fail = inject("spriteController_fail")

const sprite_info_run = _formatInfo(jsonObject.run_json)
const sprite_info_jumpUp = _formatInfo(jsonObject.jumpUp_json)
const sprite_info_jumpDown = _formatInfo(jsonObject.jumpDown_json)
const sprite_info_roll = _formatInfo(jsonObject.roll_json)
const sprite_info_fail = _formatInfo(jsonObject.fail_json)

</script>

<style lang="scss" scoped></style>