|
@@ -12,7 +12,7 @@
|
|
|
</view>
|
|
|
<view :class="(index%5 == 0||index == 1)?'':'grid-progress-text-hidden'"
|
|
|
class="grid-progress-vertical-text" style="position: absolute;right: 0;top: -4px;">
|
|
|
- {{Math.floor(taskSignCount / 40 * index)}}
|
|
|
+ {{Math.floor(taskSignCount / 26 * index)}}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -21,20 +21,44 @@
|
|
|
v-if="index!==0">
|
|
|
<view :class="(index%5 == 0||index == 1)?'':'grid-progress-text-hidden'"
|
|
|
class="grid-progress-vertical-text" style="position: absolute;left: 0;top: -4px;">
|
|
|
- {{Math.floor(taskSignCount / 40 * index)+taskSignCount/2}}
|
|
|
+ {{Math.floor(taskSignCount / 26 * index)+taskSignCount/2}}
|
|
|
</view>
|
|
|
<!-- 设置空位 -->
|
|
|
<view></view>
|
|
|
<view
|
|
|
- :class="showCurCount>=index+20? 'grid-progress-vertical-active':'grid-progress-vertical-inactive'">
|
|
|
+ :class="showCurCount>=index+13? 'grid-progress-vertical-active':'grid-progress-vertical-inactive'">
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="position-relative">
|
|
|
- <image class="position-absolute-left-top" style="width: 86.12px;height:55.96px; left: 146rpx;top:-100rpx;"
|
|
|
- src="../../../static/modal/action-jump/progress-tip-add.png"></image>
|
|
|
+ <!-- <image class="position-absolute-left-top" style="width: 86.12px;height:55.96px; left: 146rpx;top:-100rpx;"
|
|
|
+ src="../../../static/modal/action-jump/progress-tip-add.png"></image> -->
|
|
|
+ <view class="position-absolute-left-top flex justify-center align-center " style="width: 86.12px;height:55.96px;
|
|
|
+ left: 146rpx;top:-90rpx; ">
|
|
|
+ <view style="transform: scale(0.5);">
|
|
|
+ <view class="sprite-yellow-arrow " :class="bRuning?'animation-play-state-play':''"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="position-absolute-right-bottom flex justify-center align-center "
|
|
|
+ style="width: 317rpx; height:138px; right: 46rpx; bottom: 15rpx;">
|
|
|
+ <view class="flex flex-direction justify-between" style="transform: scale(0.5); height: 276px; ">
|
|
|
+ <block v-if="bJumpPlay">
|
|
|
+ <view class="sprite-rightToLeftArrow" :class="bJumpPlay?'sprite-rightToLeftArrow-play':''">
|
|
|
+ </view>
|
|
|
+ <view class="sprite-rightToLeftArrow" :class="bJumpPlay?'sprite-rightToLeftArrow-play':''">
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ <block v-else>
|
|
|
+ <image style="width: 317px; height: 42px;"
|
|
|
+ src="../../../static/modal/action-jump/progress-tip.png"></image>
|
|
|
+ <image style="width: 317px; height: 42px;"
|
|
|
+ src="../../../static/modal/action-jump/progress-tip.png"></image>
|
|
|
+ </block>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
<canvas canvas-id="actionJumpCanvas" :style="{ width: canvasW + 'px', height: canvasH + 'px' }"></canvas>
|
|
|
<canvas class="position-absolute-center" canvas-id="effectCanvas"
|
|
|
:style="{ width: canvasW + 'px', height: '164px' }"></canvas>
|
|
@@ -48,7 +72,7 @@
|
|
|
src="../../../static/modal/action-jump/jumpSpeed.png"></image>
|
|
|
<view style="margin-left: 6rpx;">平均速度</view>
|
|
|
</view>
|
|
|
- <view style="margin-top: 12rpx;">{{jumpSpeed}}</view>
|
|
|
+ <view style="margin-top: 12rpx;">{{averageSpeed}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view id="ActionJumpPlay" class="flex" style="position: relative;" @click="onControllerPlay">
|
|
@@ -72,12 +96,12 @@
|
|
|
src="../../../static/modal/action-jump/jumpCalorie.png"></image>
|
|
|
<view style="margin-left: 6rpx;">卡路里</view>
|
|
|
</view>
|
|
|
- <view style="margin-top: 12rpx;">{{jumpCalorie}}</view>
|
|
|
+ <view style="margin-top: 12rpx;">{{Math.floor(jumpCalorie)}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <view class="flex align-center justify-center" style="width: 750rpx;">
|
|
|
+ <view class="flex align-center justify-center" style="width: 750rpx;margin-top: 16rpx;">
|
|
|
<view class="flex justify-center align-center" style="height: 120rpx; width: 444rpx; ">
|
|
|
<view class="text-12px text-white text-center">
|
|
|
{{taskDescribe}}
|
|
@@ -122,6 +146,8 @@
|
|
|
} from "@/util/util-js/enum.js"
|
|
|
|
|
|
import Firework from "@/util/util-js/effect/firework.js"
|
|
|
+ import Animation from "@/util/util-js/Animation.js"
|
|
|
+ import puchConfig from "@/util/util-js/puchConfig.js"
|
|
|
|
|
|
import {
|
|
|
mapState,
|
|
@@ -154,18 +180,23 @@
|
|
|
canvasH: 0, // 画布高
|
|
|
// SystemInfo: {}, // 设备信息
|
|
|
|
|
|
- directionJump: null,
|
|
|
+ directionJumpRight: null,
|
|
|
+ directionJumpLeft: null,
|
|
|
midJump: null,
|
|
|
- rotateJump: null,
|
|
|
- directionJumpWhite: null,
|
|
|
+ rotateJumpRight: null,
|
|
|
+ rotateJumpLeft: null,
|
|
|
+ directionJumpWhiteRight: null,
|
|
|
+ directionJumpWhiteLeft: null,
|
|
|
midJumpWhite: null,
|
|
|
- rotateJumpWhite: null,
|
|
|
+ rotateJumpWhiteRight: null,
|
|
|
+ rotateJumpWhiteLeft: null,
|
|
|
//参考图片
|
|
|
cankao: null,
|
|
|
|
|
|
jumpTipImage: null,
|
|
|
JumpTipOrange: null,
|
|
|
- jumpNormalImage: null,
|
|
|
+ jumpNormalLine: null,
|
|
|
+ jumpNormalRect: null,
|
|
|
jumpNormalWidth: 70,
|
|
|
jumpNormalHeight: 164,
|
|
|
|
|
@@ -182,7 +213,7 @@
|
|
|
jumpName: 'LEFT',
|
|
|
jumpCode: 1,
|
|
|
icon: 'directionJump',
|
|
|
- scaleX: -1,
|
|
|
+ scaleX: 1,
|
|
|
bTrigger: false,
|
|
|
bShow: true,
|
|
|
}, {
|
|
@@ -196,7 +227,7 @@
|
|
|
jumpName: 'LEFT_ROTATE',
|
|
|
jumpCode: 3,
|
|
|
icon: 'rotateJump',
|
|
|
- scaleX: -1,
|
|
|
+ scaleX: 1,
|
|
|
bTrigger: false,
|
|
|
bShow: true,
|
|
|
}, {
|
|
@@ -208,10 +239,14 @@
|
|
|
bShow: true,
|
|
|
}],
|
|
|
spawnArray: [],
|
|
|
+ deleteSpawn: null, //已删除的对象
|
|
|
+ deleteImage: null,
|
|
|
/**
|
|
|
* 生成的背景位置
|
|
|
*/
|
|
|
spawnPos: [],
|
|
|
+ spawnAnimation: null,
|
|
|
+ spawnProcess: 1,
|
|
|
|
|
|
//下一个生成是相反的方向
|
|
|
bNextSpawnRightDirection: false,
|
|
@@ -251,12 +286,14 @@
|
|
|
eliminationCount: 0,
|
|
|
|
|
|
bJumpPlay: false,
|
|
|
- jumpCalorie: 1000,
|
|
|
- jumpSpeed: 1000,
|
|
|
+ jumpCalorie: 0,
|
|
|
+
|
|
|
+ averageSpeedInterval: null,
|
|
|
+ averageSpeed: 0,
|
|
|
+ tempHitCount: 0,
|
|
|
|
|
|
//硬件设备处理
|
|
|
BLEAccIndex: 0,
|
|
|
- bJump: false,
|
|
|
xA: 0,
|
|
|
yA: 0,
|
|
|
zA: 0,
|
|
@@ -322,7 +359,11 @@
|
|
|
/**
|
|
|
* 烟花特效
|
|
|
*/
|
|
|
- bDrawBoomEffect: false
|
|
|
+ bDrawBoomEffect: false,
|
|
|
+ //绘制箭头效果
|
|
|
+ bRuning: false,
|
|
|
+ bRuningInfinite: false,
|
|
|
+ yellowRuningTimeout: null,
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
@@ -345,7 +386,7 @@
|
|
|
|
|
|
},
|
|
|
currentMode(val) {
|
|
|
- console.log('==========> action jump currentMode:', val);
|
|
|
+ // console.log('==========> action jump currentMode:', val);
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
@@ -370,6 +411,15 @@
|
|
|
}
|
|
|
|
|
|
// console.log('==========>levelButtonPrompt:', _self.bTipLevel);
|
|
|
+ if (this.averageSpeedInterval) {
|
|
|
+ clearInterval(this.averageSpeedInterval);
|
|
|
+ this.averageSpeedInterval = null;
|
|
|
+ }
|
|
|
+ //计算平均速度
|
|
|
+ this.averageSpeedInterval = setInterval(() => {
|
|
|
+ this.averageSpeed = this.tempHitCount;
|
|
|
+ this.tempHitCount = 0;
|
|
|
+ }, 3000)
|
|
|
},
|
|
|
methods: {
|
|
|
...mapMutations(['onWriteBLEConnectionValue', 'onConvertDeviceData']),
|
|
@@ -382,10 +432,7 @@
|
|
|
console.log("*****************onListenActionJump*****************************");
|
|
|
_self.actionJumpObj = new ActionJump();
|
|
|
_self.actionJumpObj.addEventListener('resultant', (e) => {
|
|
|
- if (e.type == 'jump') {
|
|
|
- // this.jumpCount++;
|
|
|
- this.bJump = true;
|
|
|
- } else if (e.type == 'stateDataOfJump') {
|
|
|
+ if (e.type == 'stateDataOfJump') {
|
|
|
//发送给game,在game里面处理判断
|
|
|
this.listenStateDataOfJump(e);
|
|
|
} else if (e.type == 'stop') {
|
|
@@ -396,14 +443,14 @@
|
|
|
this.canOnDraw = false;
|
|
|
// //这里更新特效
|
|
|
// this.onDrawEffect(this.canSpawnTemp);
|
|
|
- this.onDraw("tipHit");
|
|
|
+ this.onDraw("tipHit", true);
|
|
|
}
|
|
|
if (this.canGoNext) {
|
|
|
this.canGoNext = false;
|
|
|
// //这里更新特效
|
|
|
// this.onDrawEffect(this.canSpawnTemp);
|
|
|
//绘制新触发状态
|
|
|
- this.onDraw("normal");
|
|
|
+ this.onDraw("normal", false);
|
|
|
setTimeout(() => {
|
|
|
this.startJumpGame();
|
|
|
}, 500)
|
|
@@ -417,9 +464,15 @@
|
|
|
onLoadImage() {
|
|
|
let _self = this;
|
|
|
uni.getImageInfo({
|
|
|
- src: "../../../static/modal/action-jump/directionJump.png",
|
|
|
+ src: "../../../static/modal/action-jump/directionJump-left.png",
|
|
|
success: function(image) {
|
|
|
- _self.directionJump = image;
|
|
|
+ _self.directionJumpLeft = image;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ uni.getImageInfo({
|
|
|
+ src: "../../../static/modal/action-jump/directionJump-right.png",
|
|
|
+ success: function(image) {
|
|
|
+ _self.directionJumpRight = image;
|
|
|
}
|
|
|
});
|
|
|
uni.getImageInfo({
|
|
@@ -429,16 +482,27 @@
|
|
|
}
|
|
|
});
|
|
|
uni.getImageInfo({
|
|
|
- src: "../../../static/modal/action-jump/rotateJump.png",
|
|
|
+ src: "../../../static/modal/action-jump/rotateJump-right.png",
|
|
|
success: function(image) {
|
|
|
- _self.rotateJump = image;
|
|
|
+ _self.rotateJumpRight = image;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ uni.getImageInfo({
|
|
|
+ src: "../../../static/modal/action-jump/rotateJump-left.png",
|
|
|
+ success: function(image) {
|
|
|
+ _self.rotateJumpLeft = image;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ uni.getImageInfo({
|
|
|
+ src: "../../../static/modal/action-jump/directionJumpWhite-right.png",
|
|
|
+ success: function(image) {
|
|
|
+ _self.directionJumpWhiteRight = image;
|
|
|
}
|
|
|
});
|
|
|
-
|
|
|
uni.getImageInfo({
|
|
|
- src: "../../../static/modal/action-jump/directionJumpWhite.png",
|
|
|
+ src: "../../../static/modal/action-jump/directionJumpWhite-left.png",
|
|
|
success: function(image) {
|
|
|
- _self.directionJumpWhite = image;
|
|
|
+ _self.directionJumpWhiteLeft = image;
|
|
|
}
|
|
|
});
|
|
|
uni.getImageInfo({
|
|
@@ -448,13 +512,18 @@
|
|
|
}
|
|
|
});
|
|
|
uni.getImageInfo({
|
|
|
- src: "../../../static/modal/action-jump/rotateJumpWhite.png",
|
|
|
+ src: "../../../static/modal/action-jump/rotateJumpWhite-right.png",
|
|
|
success: function(image) {
|
|
|
- _self.rotateJumpWhite = image;
|
|
|
+ _self.rotateJumpWhiteRight = image;
|
|
|
}
|
|
|
});
|
|
|
|
|
|
-
|
|
|
+ uni.getImageInfo({
|
|
|
+ src: "../../../static/modal/action-jump/rotateJumpWhite-left.png",
|
|
|
+ success: function(image) {
|
|
|
+ _self.rotateJumpWhiteLeft = image;
|
|
|
+ }
|
|
|
+ });
|
|
|
uni.getImageInfo({
|
|
|
src: "../../../static/modal/action-jump/jumpTip.png",
|
|
|
success: function(image) {
|
|
@@ -474,15 +543,21 @@
|
|
|
}
|
|
|
})
|
|
|
|
|
|
-
|
|
|
uni.getImageInfo({
|
|
|
- src: "../../../static/modal/action-jump/jumpNormal.png",
|
|
|
+ src: "../../../static/modal/action-jump/jumpNormal-line.png",
|
|
|
success: function(image) {
|
|
|
- _self.jumpNormalImage = image;
|
|
|
+ _self.jumpNormalLine = image;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ uni.getImageInfo({
|
|
|
+ src: "../../../static/modal/action-jump/jumpNormal-rect.png",
|
|
|
+ success: function(image) {
|
|
|
+ _self.jumpNormalRect = image;
|
|
|
_self.onDrawBg(true);
|
|
|
}
|
|
|
});
|
|
|
|
|
|
+
|
|
|
uni.getImageInfo({
|
|
|
src: "../../../static/modal/action-jump/cankao.png",
|
|
|
success: function(image) {
|
|
@@ -522,23 +597,25 @@
|
|
|
//开始游戏
|
|
|
this.index = 0;
|
|
|
// this.levelType = 5;
|
|
|
+ let spawnCount = 7;
|
|
|
let _ranType = Math.floor(Math.random() * 2);
|
|
|
+ //生成二个占位
|
|
|
+ this.addTemplatePoolFromType(false, this.template[0].spawnList[0][0]);
|
|
|
+ this.addTemplatePoolFromType(false, this.template[0].spawnList[0][0]);
|
|
|
if (this.levelType == 0) {
|
|
|
//随便生成一组跳的数据
|
|
|
let _spawnList = this.template[0].spawnList;
|
|
|
- for (let i = 0; i < 31; i++) {
|
|
|
+ for (let i = 0; i < 30; i++) {
|
|
|
//再对象池里面生成一组对象
|
|
|
- this.addTemplatePoolFromType(0 !== i, _spawnList[0][0]);
|
|
|
+ this.addTemplatePoolFromType(true, _spawnList[0][0]);
|
|
|
}
|
|
|
- //先生成4个
|
|
|
- for (let i = 0; i < 5; i++) {
|
|
|
+ //先生成spawnCount个
|
|
|
+ for (let i = 0; i < spawnCount; i++) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
|
}
|
|
|
|
|
|
} else if (this.levelType == 1) {
|
|
|
- //生成一个占位
|
|
|
- this.addTemplatePoolFromType(false, this.template[0].spawnList[0][0]);
|
|
|
//生成一组 左跳右跳
|
|
|
let _spawnList = this.template[1].spawnList;
|
|
|
for (let i = 0; i < 30; i++) {
|
|
@@ -548,15 +625,13 @@
|
|
|
this.addTemplatePoolFromType(true, _spawnList[ran][j]);
|
|
|
}
|
|
|
}
|
|
|
- //先生成5个
|
|
|
- for (let i = 0; i < 5; i++) {
|
|
|
+ //先生成spawnCount个
|
|
|
+ for (let i = 0; i < spawnCount; i++) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
|
}
|
|
|
|
|
|
} else if (this.levelType == 2) {
|
|
|
- //生成一个占位
|
|
|
- this.addTemplatePoolFromType(false, this.template[0].spawnList[0][0]);
|
|
|
//生成一组 左跳右跳原地
|
|
|
let _spawnList = this.template[2].spawnList;
|
|
|
for (let i = 0; i < 30; i++) {
|
|
@@ -566,16 +641,14 @@
|
|
|
this.addTemplatePoolFromType(true, _spawnList[ran][j]);
|
|
|
}
|
|
|
}
|
|
|
- //先生成5个
|
|
|
- for (let i = 0; i < 5; i++) {
|
|
|
+ //先生成spawnCount个
|
|
|
+ for (let i = 0; i < spawnCount; i++) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
|
}
|
|
|
|
|
|
|
|
|
} else if (this.levelType == 3) {
|
|
|
- //生成一个占位
|
|
|
- this.addTemplatePoolFromType(false, this.template[0].spawnList[0][0]);
|
|
|
//生成一组 左旋跳右旋跳
|
|
|
let _spawnList = this.template[1].spawnList;
|
|
|
for (let i = 0; i < 30; i++) {
|
|
@@ -585,14 +658,12 @@
|
|
|
this.addTemplatePoolFromType(true, _spawnList[ran][j]);
|
|
|
}
|
|
|
}
|
|
|
- //先生成5个
|
|
|
- for (let i = 0; i < 30; i++) {
|
|
|
+ //先生成spawnCount个
|
|
|
+ for (let i = 0; i < spawnCount; i++) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
|
}
|
|
|
} else if (this.levelType == 4) {
|
|
|
- //生成一个占位
|
|
|
- this.addTemplatePoolFromType(false, this.template[0].spawnList[0][0]);
|
|
|
//生成一组 左旋跳右旋跳
|
|
|
let _spawnList = this.template[2].spawnList;
|
|
|
for (let i = 0; i < 30; i++) {
|
|
@@ -602,16 +673,13 @@
|
|
|
this.addTemplatePoolFromType(true, _spawnList[ran][j]);
|
|
|
}
|
|
|
}
|
|
|
- //先生成5个
|
|
|
- for (let i = 0; i < 5; i++) {
|
|
|
+ //先生成spawnCount个
|
|
|
+ for (let i = 0; i < spawnCount; i++) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
|
}
|
|
|
|
|
|
} else if (this.levelType == 5) {
|
|
|
- //生成一个占位
|
|
|
- this.addTemplatePoolFromType(false, this.template[0].spawnList[0][0]);
|
|
|
-
|
|
|
for (let i = 0; i < 20; i++) {
|
|
|
//随便生成三组数据
|
|
|
let _newArray = [];
|
|
@@ -628,19 +696,28 @@
|
|
|
this.addTemplatePoolFromType(true, _newArray[j]);
|
|
|
}
|
|
|
}
|
|
|
- //先生成5个
|
|
|
- for (let i = 0; i < 5; i++) {
|
|
|
+ //先生成spawnCount个
|
|
|
+ for (let i = 0; i < spawnCount; i++) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
|
}
|
|
|
}
|
|
|
- this.onDraw("tipHit");
|
|
|
+ this.onDraw("tipHit", false);
|
|
|
},
|
|
|
+ /**
|
|
|
+ * 生成对应预制对象
|
|
|
+ * @param {Object} bShow
|
|
|
+ * @param {Object} _jumpType
|
|
|
+ */
|
|
|
addTemplatePoolFromType(bShow, _jumpType) {
|
|
|
+
|
|
|
for (let i = 0; i < this.jumpTypeArray.length; i++) {
|
|
|
if (this.jumpTypeArray[i].jumpCode == _jumpType) {
|
|
|
let _jumpPrefab = Object.assign({}, this.jumpTypeArray[i], {
|
|
|
- bShow: bShow
|
|
|
+ bShow: bShow,
|
|
|
+ bInit: true,
|
|
|
+ position: 0,
|
|
|
+ animation: null, //动画
|
|
|
});
|
|
|
this.templatePool.push(_jumpPrefab);
|
|
|
break;
|
|
@@ -656,21 +733,30 @@
|
|
|
}
|
|
|
|
|
|
let _currentBgStartX = this.canvasW / 2;
|
|
|
- let count = 5;
|
|
|
+ let count = 7;
|
|
|
let _currentPos = -12,
|
|
|
_addPos = 0;
|
|
|
|
|
|
- this.actionJumpCanvas.drawImage(this.jumpProgressTip.path, _currentBgStartX, 5, 171, 24.66);
|
|
|
- this.actionJumpCanvas.drawImage(this.jumpProgressTip.path, _currentBgStartX, 116, 171, 24.66);
|
|
|
+ // this.actionJumpCanvas.drawImage(this.jumpProgressTip.path, _currentBgStartX, 5, 171, 24.66);
|
|
|
+ // this.actionJumpCanvas.drawImage(this.jumpProgressTip.path, _currentBgStartX, 116, 171, 24.66);
|
|
|
for (let i = 0; i < count; i++) {
|
|
|
if (0 !== i) {
|
|
|
_currentPos += this.jumpNormalWidth;
|
|
|
+ } else {
|
|
|
+ _currentPos -= this.jumpNormalWidth;
|
|
|
}
|
|
|
|
|
|
- if (1 === i) {
|
|
|
- this.actionJumpCanvas.drawImage(this.jumpTipImage.path, _currentPos, 0, 120, this.canvasH);
|
|
|
- this.actionJumpCanvas.drawImage(this.JumpTipOrange.path, _currentPos + 3, 7, 113, this.canvasH -
|
|
|
- 14);
|
|
|
+ if (2 === i) {
|
|
|
+ //结尾时候快消除完绘制一次大图背景。不然会为空白
|
|
|
+ if (this.spawnArray.length < 3)
|
|
|
+ this.actionJumpCanvas.drawImage(this.jumpTipImage.path, _currentPos, 0, 120, this.canvasH);
|
|
|
+
|
|
|
+ if (bDraw) {
|
|
|
+ this.actionJumpCanvas.drawImage(this.JumpTipOrange.path, _currentPos + 3, 7, 113, this
|
|
|
+ .canvasH -
|
|
|
+ 14);
|
|
|
+ }
|
|
|
+
|
|
|
// this.actionJumpCanvas.drawImage(this.midJump.path, _currentPos + 30, 46, 60, 60);
|
|
|
//添加对应生成点
|
|
|
this.spawnPos.push({
|
|
@@ -678,8 +764,12 @@
|
|
|
})
|
|
|
_currentPos += 50;
|
|
|
} else {
|
|
|
- this.actionJumpCanvas.drawImage(this.jumpNormalImage.path, _currentPos, 0, this.jumpNormalWidth,
|
|
|
+ this.actionJumpCanvas.drawImage(this.jumpNormalLine.path, _currentPos, 0, this.jumpNormalWidth,
|
|
|
this.canvasH);
|
|
|
+ if (bDraw) {
|
|
|
+ this.actionJumpCanvas.drawImage(this.jumpNormalRect.path, _currentPos, 0, this.jumpNormalWidth,
|
|
|
+ this.canvasH);
|
|
|
+ }
|
|
|
|
|
|
// this.actionJumpCanvas.drawImage(this.midJump.path, _currentPos + 16, 55, 40, 40);
|
|
|
//添加对应生成点
|
|
@@ -693,51 +783,117 @@
|
|
|
this.actionJumpCanvas.draw();
|
|
|
}
|
|
|
},
|
|
|
- onDraw(type) {
|
|
|
+ onDraw(type, bAnimation) {
|
|
|
+ let _self = this;
|
|
|
+ if (bAnimation && _self.spawnAnimation == null) {
|
|
|
+ _self.spawnProcess = 0;
|
|
|
+ _self.spawnAnimation = new Animation({
|
|
|
+ timing: 'linear',
|
|
|
+ duration: 200,
|
|
|
+ onProcess: function onProcess(process) {
|
|
|
+ _self.spawnProcess = process;
|
|
|
+ _self.onDraw('normal', true);
|
|
|
+ // console.log("process=" + process);
|
|
|
+ },
|
|
|
+ onAnimationFinish: function onAnimationFinish() {
|
|
|
+ // console.log("finish animation");
|
|
|
+ _self.spawnAnimation = null;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
this.actionJumpCanvas.clearRect(0, 0, this.canvasW, this.canvasH);
|
|
|
//单纯绘制背景
|
|
|
this.onDrawBg(false);
|
|
|
//计算一个节点数组
|
|
|
+ // let _oldRectMoveDis = 1;
|
|
|
for (let i = 0; i < this.spawnArray.length; i++) {
|
|
|
//默认 mid 图标
|
|
|
let _temp = this.spawnArray[i].bTrigger ? this.midJump : this.midJumpWhite;
|
|
|
if (this.spawnArray[i].icon == 'directionJump') {
|
|
|
- _temp = this.spawnArray[i].bTrigger ? this.directionJump : this.directionJumpWhite;
|
|
|
+ if (this.spawnArray[i].jumpName == "RIGHT") {
|
|
|
+ _temp = this.spawnArray[i].bTrigger ? this.directionJumpRight : this.directionJumpWhiteRight;
|
|
|
+ } else {
|
|
|
+ _temp = this.spawnArray[i].bTrigger ? this.directionJumpLeft : this.directionJumpWhiteLeft;
|
|
|
+ }
|
|
|
} else if (this.spawnArray[i].icon == 'rotateJump') {
|
|
|
- _temp = this.spawnArray[i].bTrigger ? this.rotateJump : this.rotateJumpWhite;
|
|
|
+ if (this.spawnArray[i].jumpName == "RIGHT_ROTATE") {
|
|
|
+ _temp = this.spawnArray[i].bTrigger ? this.rotateJumpRight : this.rotateJumpWhiteRight;
|
|
|
+ } else {
|
|
|
+ _temp = this.spawnArray[i].bTrigger ? this.rotateJumpLeft : this.rotateJumpWhiteLeft;
|
|
|
+ }
|
|
|
}
|
|
|
- //如果是相反绘制,需要加多一个自身位置偏移
|
|
|
- let _pos = this.spawnArray[i].scaleX < 0 ? i + 1 : 0;
|
|
|
this.actionJumpCanvas.save();
|
|
|
- let _opacity = this.spawnArray[i].bTrigger ? 0.7 : 1;
|
|
|
- console.log(this.spawnArray[i].bTrigger + '==' + _opacity);
|
|
|
- this.actionJumpCanvas.globalAlpha = this.spawnArray[i].bShow ? _opacity : 0;
|
|
|
- this.actionJumpCanvas.scale(this.spawnArray[i].scaleX, 1);
|
|
|
+ // let _opacity = this.spawnArray[i].bTrigger ? 0.7 : 1;
|
|
|
+ // this.actionJumpCanvas.globalAlpha = this.spawnArray[i].bShow ? _opacity : 0;
|
|
|
+ // this.actionJumpCanvas.scale(this.spawnArray[i].scaleX, 1);
|
|
|
|
|
|
let _currentPos = this.spawnPos[i].center;
|
|
|
let _currentCenterPos = 0;
|
|
|
|
|
|
- if (i == 1) {
|
|
|
- if (this.spawnArray[i].scaleX < 0) {
|
|
|
- _currentPos = (_currentPos * 2 - 30) * this.spawnArray[i].scaleX;
|
|
|
- //这里记录一个生成点,后面用于生成特效
|
|
|
- this.effectSpawnPosX = _currentPos - 30;
|
|
|
+ if (2 === i) {
|
|
|
+ //这里分两部分走,从小图走到大图
|
|
|
+ let _spawnBiggerToLeft = this.spawnArray[i];
|
|
|
+ //这里记录一个生成点,后面用于生成特效
|
|
|
+ this.effectSpawnPosX = _currentPos;
|
|
|
+ //大图
|
|
|
+ let tempPosition = _currentPos;
|
|
|
+ if (!bAnimation || _spawnBiggerToLeft.bInit) {
|
|
|
+ _spawnBiggerToLeft.position = _currentPos;
|
|
|
+ _spawnBiggerToLeft.bInit = false;
|
|
|
+ } else {
|
|
|
+ tempPosition = _spawnBiggerToLeft.position - Math.abs(_currentPos - _spawnBiggerToLeft
|
|
|
+ .position) * _self.spawnProcess;
|
|
|
+
|
|
|
+ }
|
|
|
+ if (1 === this.spawnProcess) {
|
|
|
+ _spawnBiggerToLeft.position = tempPosition;
|
|
|
} else {
|
|
|
- //这里记录一个生成点,后面用于生成特效
|
|
|
- this.effectSpawnPosX = _currentPos;
|
|
|
+ //绘制一次前面方块背景前移
|
|
|
+ this.actionJumpCanvas.drawImage(this.jumpNormalRect.path, tempPosition - 16, 0, this
|
|
|
+ .jumpNormalWidth,
|
|
|
+ this.canvasH);
|
|
|
+ this.actionJumpCanvas.clearRect(this.spawnPos[i].center - 30, 0, 120, this.canvasH);
|
|
|
}
|
|
|
+ let _width = 40 + 20 * _self.spawnProcess;
|
|
|
+ this.actionJumpCanvas.drawImage(_temp.path, tempPosition, 55 - 9 * _self.spawnProcess, _width,
|
|
|
+ _width);
|
|
|
|
|
|
+ //绘制多一次背景
|
|
|
+ this.actionJumpCanvas.drawImage(this.jumpTipImage.path, this.spawnPos[i].center - 30, 0, 120, this
|
|
|
+ .canvasH);
|
|
|
|
|
|
- //大图
|
|
|
- this.actionJumpCanvas.drawImage(_temp.path, _currentPos, 46, 60, 60);
|
|
|
- // console.log('big:' + _currentPos);
|
|
|
+ this.actionJumpCanvas.drawImage(this.JumpTipOrange.path, this.spawnPos[i].center - 27, 7, 113, this
|
|
|
+ .canvasH -
|
|
|
+ 14);
|
|
|
} else {
|
|
|
//小图
|
|
|
- if (this.spawnArray[i].scaleX < 0) {
|
|
|
- _currentPos = (_currentPos + 40) * this.spawnArray[i].scaleX
|
|
|
- console.log('min:' + _currentPos);
|
|
|
+ let _otherObj = this.spawnArray[i];
|
|
|
+ let tempPosition = _currentPos;
|
|
|
+ if (!bAnimation || _otherObj.bInit) {
|
|
|
+ _otherObj.position = _currentPos;
|
|
|
+ _otherObj.bInit = false;
|
|
|
+ // console.log(i + " add== " + _otherObj.position + " == " + tempPosition);
|
|
|
+ } else {
|
|
|
+ tempPosition = _otherObj.position - Math.abs(_currentPos - _otherObj.position) * _self
|
|
|
+ .spawnProcess;
|
|
|
+ // if (i === 1) {
|
|
|
+ // console.log(tempPosition + "==" + _otherObj.position + "==" + Math.abs(_currentPos -
|
|
|
+ // _otherObj.position));
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ if (1 === this.spawnProcess) {
|
|
|
+ _otherObj.position = tempPosition;
|
|
|
+ }
|
|
|
+ // if (1 === i) {
|
|
|
+ // _oldRectMoveDis = Math.abs(_currentPos - _otherObj.position);
|
|
|
+ // }
|
|
|
+
|
|
|
+ this.actionJumpCanvas.drawImage(this.jumpNormalRect.path, tempPosition - 16, 0, this
|
|
|
+ .jumpNormalWidth,
|
|
|
+ this.canvasH);
|
|
|
+ if (this.spawnArray[i].bShow) {
|
|
|
+ this.actionJumpCanvas.drawImage(_temp.path, tempPosition, 55, 40, 40);
|
|
|
}
|
|
|
- this.actionJumpCanvas.drawImage(_temp.path, _currentPos, 55, 40, 40);
|
|
|
|
|
|
}
|
|
|
this.actionJumpCanvas.restore();
|
|
@@ -746,16 +902,32 @@
|
|
|
this.actionJumpCanvas.draw();
|
|
|
},
|
|
|
onDrawEffect(_temp) {
|
|
|
+ if (!this.bRuning) {
|
|
|
+ this.bRuning = true;
|
|
|
+ // console.log(this.bRuning);
|
|
|
+ if (this.yellowRuningTimeout) {
|
|
|
+ clearTimeout(this.yellowRuningTimeout)
|
|
|
+ this.yellowRuningTimeout = null;
|
|
|
+ }
|
|
|
+ this.yellowRuningTimeout = setTimeout(() => {
|
|
|
+ this.bRuning = false;
|
|
|
+ // console.log(this.bRuning);
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
//根据当前消除的生成一个
|
|
|
// console.log("生成的_temp:" + JSON.stringify(_temp));
|
|
|
let spawnTemp = this.midJump;
|
|
|
+ let offest = 5;
|
|
|
if (_temp.icon == 'directionJump') {
|
|
|
- spawnTemp = this.directionJump;
|
|
|
+ spawnTemp = _temp.jumpName == "RIGHT" ? this.directionJumpRight : this.directionJumpLeft;
|
|
|
} else if (_temp.icon == 'rotateJump') {
|
|
|
- spawnTemp = this.rotateJump;
|
|
|
+ spawnTemp = _temp.jumpName == "RIGHT_ROTATE" ? this.rotateJumpRight : this.rotateJumpLeft;
|
|
|
+ offest = _temp.jumpName == "RIGHT_ROTATE" ? 8 : 6;
|
|
|
}
|
|
|
let tempFirework = new Firework(this.fireworkImage,
|
|
|
- spawnTemp, _temp.scaleX, this.effectSpawnPosX, 0, this.canvasW, 164);
|
|
|
+ spawnTemp, _temp.scaleX, this.effectSpawnPosX, 0, this.canvasW, 164, offest);
|
|
|
this.fireworks.push(tempFirework);
|
|
|
this.bDrawBoomEffect = true;
|
|
|
this.onInitFirework();
|
|
@@ -768,7 +940,6 @@
|
|
|
this.xA = 0;
|
|
|
this.yA = 0;
|
|
|
this.zA = 0;
|
|
|
- this.bJump = false;
|
|
|
|
|
|
this.actionJumpObj.resetAll();
|
|
|
},
|
|
@@ -817,14 +988,15 @@
|
|
|
//模拟测试调用
|
|
|
eliminateJumpPrefab(_jumpType) {
|
|
|
//只触发第二个
|
|
|
- if (this.spawnArray.length < 2) {
|
|
|
+ if (this.spawnArray.length < 3) {
|
|
|
return;
|
|
|
}
|
|
|
- let _temp = this.spawnArray[1];
|
|
|
+ let _temp = this.spawnArray[2];
|
|
|
//如果当前的跳类型和预制目标一样
|
|
|
if (_jumpType == _temp.jumpCode) {
|
|
|
_temp.bTrigger = true;
|
|
|
- this.spawnArray.splice(0, 1);
|
|
|
+ this.deleteSpawn = this.spawnArray.splice(0, 1);
|
|
|
+
|
|
|
if (this.index < this.templatePool.length) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
@@ -833,16 +1005,16 @@
|
|
|
let _endTemp = Object.assign({}, _temp);
|
|
|
this.onDrawEffect(_endTemp);
|
|
|
//绘制新触发状态
|
|
|
- this.onDraw('tipHit');
|
|
|
+ this.onDraw('tipHit', true);
|
|
|
//成功
|
|
|
this.setEliminationCount(1);
|
|
|
//替换数组
|
|
|
// console.log(this.index + " == " + this.spawnArray.length);
|
|
|
- if (this.spawnArray.length < 2 && this.index > 2) {
|
|
|
+ if (this.spawnArray.length < 3 && this.index > 3) {
|
|
|
clearInterval(this.countdownInterval);
|
|
|
this.countdownInterval = null;
|
|
|
//绘制新触发状态
|
|
|
- this.onDraw("normal");
|
|
|
+ this.onDraw("normal", false);
|
|
|
setTimeout(() => {
|
|
|
this.startJumpGame();
|
|
|
}, 2000)
|
|
@@ -870,6 +1042,7 @@
|
|
|
},
|
|
|
//设置ui信息
|
|
|
setEliminationCount(value) {
|
|
|
+ this.tempHitCount++;
|
|
|
this.taskSignCurCount++;
|
|
|
this.roundingCount += this.addShowCountUnit;
|
|
|
this.eliminationCount += value;
|
|
@@ -879,6 +1052,7 @@
|
|
|
eliminationCount: this.eliminationCount,
|
|
|
faultCount: this.faultCount
|
|
|
});
|
|
|
+ this.jumpCalorie += puchConfig.getJumpCalorie(this.eliminationCount + this.faultCount);
|
|
|
|
|
|
//如果是pk模式。不走下面判断
|
|
|
if (this.currentMode == 'pkMode') return;
|
|
@@ -957,12 +1131,15 @@
|
|
|
});
|
|
|
},
|
|
|
setFaultCount(value) {
|
|
|
+ this.tempHitCount++;
|
|
|
this.faultCount += value;
|
|
|
// this.faultLabel.string = '失误:' + this.faultCount;
|
|
|
this.$emit('actionJumpDataUpdate', {
|
|
|
eliminationCount: this.eliminationCount,
|
|
|
faultCount: this.faultCount
|
|
|
});
|
|
|
+ this.jumpCalorie += puchConfig.getJumpCalorie(this.eliminationCount + this.faultCount);
|
|
|
+
|
|
|
},
|
|
|
|
|
|
//控制播放
|
|
@@ -1008,7 +1185,7 @@
|
|
|
},
|
|
|
|
|
|
getCurrentJumpType() {
|
|
|
- let _temp = this.spawnArray[1];
|
|
|
+ let _temp = this.spawnArray[2];
|
|
|
return _temp.jumpCode;
|
|
|
},
|
|
|
|
|
@@ -1016,7 +1193,7 @@
|
|
|
listenStateDataOfJump(data) {
|
|
|
if (this.isGameOver || !this.bJumpPlay) return;
|
|
|
|
|
|
- if (this.spawnArray.length < 2) return;
|
|
|
+ if (this.spawnArray.length < 3) return;
|
|
|
let _jumpType = this.getCurrentJumpType();
|
|
|
//初始全部默认状态
|
|
|
let _tempState = [{
|
|
@@ -1144,16 +1321,19 @@
|
|
|
// }
|
|
|
},
|
|
|
eliminateJumpPrefabFormTemp(_tempState) {
|
|
|
- //只触发第二个
|
|
|
- if (this.spawnArray.length < 2) {
|
|
|
+ //只触发第三个
|
|
|
+ if (this.spawnArray.length < 3) {
|
|
|
return;
|
|
|
}
|
|
|
- let _temp = this.spawnArray[1];
|
|
|
+ let _temp = this.spawnArray[2];
|
|
|
let bSuccess = false;
|
|
|
for (let i = 0; i < _tempState.length; i++) {
|
|
|
let _state = _tempState[i];
|
|
|
if (_state.bTrigger)
|
|
|
- console.log(JSON.stringify(_state) + JSON.stringify(this.onLogData));
|
|
|
+ {
|
|
|
+ console.log('识别跳的类型:' +_state.describe + ',当前预制类型:'+_temp.jumpName +
|
|
|
+ "\n直跳判断值:"+this.onLogData.currentMaxValue+",旋转跳值:"+this.onLogData.oGyroValue);
|
|
|
+ }
|
|
|
//如果当前的跳类型和预制目标一样
|
|
|
if (_state.jumpCode == _temp.jumpCode && _state.bTrigger) {
|
|
|
//成功
|
|
@@ -1169,7 +1349,8 @@
|
|
|
//这里更新特效
|
|
|
this.onDrawEffect(this.canSpawnTemp);
|
|
|
}, 150);
|
|
|
- this.spawnArray.splice(0, 1);
|
|
|
+ this.deleteSpawn = this.spawnArray.splice(0, 1);
|
|
|
+
|
|
|
if (this.index < this.templatePool.length) {
|
|
|
this.spawnArray.push(this.templatePool[this.index]);
|
|
|
this.index++;
|
|
@@ -1178,16 +1359,16 @@
|
|
|
this.setEliminationCount(1);
|
|
|
//替换数组
|
|
|
// console.log(this.index + " == " + this.spawnArray.length);
|
|
|
- if (this.spawnArray.length < 2 && this.index > 2) {
|
|
|
+ if (this.spawnArray.length < 3 && this.index > 3) {
|
|
|
clearInterval(this.countdownInterval);
|
|
|
this.countdownInterval = null;
|
|
|
//绘制新触发状态
|
|
|
this.canGoNext = true;
|
|
|
- }else {
|
|
|
+ } else {
|
|
|
//绘制新触发状态
|
|
|
this.canOnDraw = true;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
} else {
|
|
|
//失误
|
|
|
this.setFaultCount(1);
|
|
@@ -1259,13 +1440,6 @@
|
|
|
bYAxis: true,
|
|
|
};
|
|
|
this.actionJumpObj.updateJump(_temp);
|
|
|
-
|
|
|
-
|
|
|
- // if (this.BLEAccIndex > 150) {
|
|
|
- // this.onClearData();
|
|
|
- // this.bJump = false;
|
|
|
- // return;
|
|
|
- // }
|
|
|
this.BLEAccIndex++;
|
|
|
},
|
|
|
onClearData() {
|
|
@@ -1332,4 +1506,254 @@
|
|
|
.grid-progress-vertical-inactive {
|
|
|
width: 28rpx;
|
|
|
}
|
|
|
+
|
|
|
+ .sprite-yellow-arrow {
|
|
|
+ display: inline-block;
|
|
|
+ overflow: hidden;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ width: 194px;
|
|
|
+ height: 232px;
|
|
|
+ background-image: url('@/static/modal/action-jump/yellow-arrow.png');
|
|
|
+
|
|
|
+ // border: 1rpx solid #00CE47;
|
|
|
+ }
|
|
|
+
|
|
|
+ .animation-play-state-play {
|
|
|
+ animation: yellowArrowRun 1s steps(1, end); // infinite
|
|
|
+ animation-play-state: running;
|
|
|
+ }
|
|
|
+
|
|
|
+ .animation-play-state-paused {
|
|
|
+ animation-play-state: paused;
|
|
|
+ }
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 箭头动画
|
|
|
+ */
|
|
|
+ @keyframes yellowArrowRun {
|
|
|
+ 0% {
|
|
|
+ background-position: -0px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 5% {
|
|
|
+ background-position: -0px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 10% {
|
|
|
+ background-position: -194px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 15% {
|
|
|
+ background-position: -388px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 20% {
|
|
|
+ background-position: -582px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 25% {
|
|
|
+ background-position: -776px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 30% {
|
|
|
+ background-position: -0px -232px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 35% {
|
|
|
+ background-position: -194px -232px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 40% {
|
|
|
+ background-position: -388px -232px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 45% {
|
|
|
+ background-position: -582px -232px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 50% {
|
|
|
+ background-position: -776px -232px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 55% {
|
|
|
+ background-position: -0px -464px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 60% {
|
|
|
+ background-position: -194px -464px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 65% {
|
|
|
+ background-position: -388px -464px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 70% {
|
|
|
+ background-position: -582px -464px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 75% {
|
|
|
+ background-position: -776px -464px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 80% {
|
|
|
+ background-position: -0px -696px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 85% {
|
|
|
+ background-position: -194px -696px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 90% {
|
|
|
+ background-position: -388px -696px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 95% {
|
|
|
+ background-position: -582px -696px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ background-position: -776px -696px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .sprite-rightToLeftArrow {
|
|
|
+ display: inline-block;
|
|
|
+ overflow: hidden;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ width: 317px;
|
|
|
+ height: 42px;
|
|
|
+ background-image: url('@/static/modal/action-jump/rightToLeftArrow.png');
|
|
|
+
|
|
|
+ // border: 1rpx solid #00CE47;
|
|
|
+ }
|
|
|
+
|
|
|
+ .sprite-rightToLeftArrow-play {
|
|
|
+ animation: rightToLeftArrowRun 1s steps(1, end) infinite;
|
|
|
+ }
|
|
|
+
|
|
|
+ @keyframes rightToLeftArrowRun {
|
|
|
+ 0% {
|
|
|
+ background-position: -0px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 3.33% {
|
|
|
+ background-position: -0px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 6.66% {
|
|
|
+ background-position: -317px -0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 9.99% {
|
|
|
+ background-position: -0px -42px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 13.33% {
|
|
|
+ background-position: -317px -42px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 16.66% {
|
|
|
+ background-position: -0px -84px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 19.99% {
|
|
|
+ background-position: -317px -84px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 23.33% {
|
|
|
+ background-position: -0px -126px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 26.66% {
|
|
|
+ background-position: -317px -126px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 29.99% {
|
|
|
+ background-position: -0px -168px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 33.33% {
|
|
|
+ background-position: -317px -168px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 36.66% {
|
|
|
+ background-position: -0px -210px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 39.99% {
|
|
|
+ background-position: -317px -210px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 43.33% {
|
|
|
+ background-position: -0px -252px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 46.66% {
|
|
|
+ background-position: -317px -252px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 49.99% {
|
|
|
+ background-position: -0px -294px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 53.33% {
|
|
|
+ background-position: -317px -294px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 56.66% {
|
|
|
+ background-position: -0px -336px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 59.99% {
|
|
|
+ background-position: -317px -336px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 63.33% {
|
|
|
+ background-position: -0px -378px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 66.66% {
|
|
|
+ background-position: -317px -378px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 69.99% {
|
|
|
+ background-position: -0px -420px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 73.33% {
|
|
|
+ background-position: -317px -420px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 76.66% {
|
|
|
+ background-position: -0px -462px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 79.99% {
|
|
|
+ background-position: -317px -462px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 83.33% {
|
|
|
+ background-position: -0px -504px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 86.66% {
|
|
|
+ background-position: -317px -504px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 89.99% {
|
|
|
+ background-position: -0px -546px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 93.33% {
|
|
|
+ background-position: -317px -546px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 96.66% {
|
|
|
+ background-position: -0px -588px;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ background-position: -317px -588px;
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|