寻宝活动install
This commit is contained in:
chenruiye
92
view/molistar/activity/adventureTreasureHunt/css/index.css
Normal file
92
view/molistar/activity/adventureTreasureHunt/css/index.css
Normal file
@@ -0,0 +1,92 @@
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #3C0101;
|
||||
}
|
||||
|
||||
.back {
|
||||
width: 100%;
|
||||
height: 0.5866666667rem;
|
||||
line-height: 0.5866666667rem;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0.8666666667rem;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 0.5066666667rem;
|
||||
font-weight: bold;
|
||||
z-index: 10;
|
||||
}
|
||||
.back img {
|
||||
width: 0.5866666667rem;
|
||||
height: 0.5866666667rem;
|
||||
position: absolute;
|
||||
left: 0.24rem;
|
||||
top: 0rem;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 20.2666666667rem;
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
position: relative;
|
||||
}
|
||||
.header .date {
|
||||
width: 8.9333333333rem;
|
||||
height: 0.7466666667rem;
|
||||
line-height: 0.7466666667rem;
|
||||
background: url(../images/time_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 0.3466666667rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 5.04rem;
|
||||
}
|
||||
.header .rule {
|
||||
height: 0.7733333333rem;
|
||||
line-height: 0.7733333333rem;
|
||||
text-indent: 0.1rem;
|
||||
text-align: center;
|
||||
color: #FFFCD0;
|
||||
font-size: 0.3733333333rem;
|
||||
font-weight: 500;
|
||||
background: url(../images/rule_icon.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 6.6666666667rem;
|
||||
padding: 0 0.0933333333rem 0 0.4rem;
|
||||
}
|
||||
.header .Record {
|
||||
height: 0.7733333333rem;
|
||||
line-height: 0.7733333333rem;
|
||||
text-indent: 0.1rem;
|
||||
text-align: center;
|
||||
color: #FFFCD0;
|
||||
font-size: 0.3733333333rem;
|
||||
font-weight: 500;
|
||||
background: url(../images/rule_icon.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 8rem;
|
||||
padding: 0 0.0933333333rem 0 0.4rem;
|
||||
}
|
||||
.header .bx_img {
|
||||
width: 100%;
|
||||
height: 8rem;
|
||||
padding-top: 5.7333333333rem;
|
||||
}
|
||||
.header .Lottery_button .once .title {
|
||||
font-family: PingFang SC;
|
||||
font-weight: 600;
|
||||
font-size: 0.4533333333rem;
|
||||
color: #2F1300;
|
||||
line-height: 0.48rem;
|
||||
}
|
||||
109
view/molistar/activity/adventureTreasureHunt/css/index.scss
Normal file
109
view/molistar/activity/adventureTreasureHunt/css/index.scss
Normal file
@@ -0,0 +1,109 @@
|
||||
@function px2rem($px) {
|
||||
@return $px / 75+rem;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #3C0101;
|
||||
}
|
||||
|
||||
|
||||
.back {
|
||||
width: 100%;
|
||||
height: px2rem(44);
|
||||
line-height: px2rem(44);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: px2rem(65);
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: px2rem(38);
|
||||
font-weight: bold;
|
||||
z-index: 10;
|
||||
|
||||
img {
|
||||
width: px2rem(44);
|
||||
height: px2rem(44);
|
||||
position: absolute;
|
||||
left: px2rem(18);
|
||||
top: px2rem(0);
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
width: px2rem(750);
|
||||
height: px2rem(1520);
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
position: relative;
|
||||
|
||||
.date {
|
||||
width: px2rem(670);
|
||||
height: px2rem(56);
|
||||
line-height: px2rem(56);
|
||||
background: url(../images/time_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: px2rem(26);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(378);
|
||||
}
|
||||
|
||||
.rule {
|
||||
// width: px2rem(120);
|
||||
height: px2rem(58);
|
||||
line-height: px2rem(58);
|
||||
text-indent: 0.1rem;
|
||||
text-align: center;
|
||||
color: #FFFCD0;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
background: url(../images/rule_icon.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: px2rem(500);
|
||||
padding: 0 px2rem(7) 0 px2rem(30);
|
||||
}
|
||||
|
||||
.Record {
|
||||
// width: px2rem(120);
|
||||
height: px2rem(58);
|
||||
line-height: px2rem(58);
|
||||
text-indent: 0.1rem;
|
||||
text-align: center;
|
||||
color: #FFFCD0;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
background: url(../images/rule_icon.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: px2rem(600);
|
||||
padding: 0 px2rem(7) 0 px2rem(30);
|
||||
}
|
||||
|
||||
.bx_img {
|
||||
width: 100%;
|
||||
height: px2rem(600);
|
||||
padding-top: px2rem(430);
|
||||
}
|
||||
|
||||
.Lottery_button {
|
||||
.once {
|
||||
.title {
|
||||
font-family: PingFang SC;
|
||||
font-weight: 600;
|
||||
font-size: px2rem(34);
|
||||
color: #2F1300;
|
||||
line-height: px2rem(36)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
BIN
view/molistar/activity/adventureTreasureHunt/images/baoxiang.png
Normal file
BIN
view/molistar/activity/adventureTreasureHunt/images/baoxiang.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 280 KiB |
BIN
view/molistar/activity/adventureTreasureHunt/images/header.png
Normal file
BIN
view/molistar/activity/adventureTreasureHunt/images/header.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 856 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
BIN
view/molistar/activity/adventureTreasureHunt/images/time_bg.png
Normal file
BIN
view/molistar/activity/adventureTreasureHunt/images/time_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
48
view/molistar/activity/adventureTreasureHunt/index.html
Normal file
48
view/molistar/activity/adventureTreasureHunt/index.html
Normal file
@@ -0,0 +1,48 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title class="page_title"></title>
|
||||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||||
<link rel="stylesheet" href="./css/index.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- 頂部返回 -->
|
||||
<div class="back">
|
||||
<img src="./images/travel/back.png" alt="">
|
||||
</div>
|
||||
<!-- 头部 -->
|
||||
<div class="header">
|
||||
<div class="Adventurers_gather">Adventurers gather! Treasure hunt challenge is on!</div>
|
||||
<div class="rule Rules">Rules</div>
|
||||
<div class="Record My_Record">My Record</div>
|
||||
<div class="bx_img"><img src="./images/baoxiang.png" alt=""></div>
|
||||
<div class="Lottery_button">
|
||||
<div class="once">
|
||||
<p class="title">1 Bet</p>
|
||||
<p class="txt">Need 100 points</p>
|
||||
</div>
|
||||
<div class="Ten_times"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
<script src="../../common/js/flexible.js"></script>
|
||||
<script src="../../common/js/jquery-3.2.1.min.js"></script>
|
||||
<script src="../../common/js/common2.js"></script>
|
||||
<script src="../../common/js/layer.js"></script>
|
||||
<script src="../../common/js/vconsole.min.js"></script>
|
||||
<script src="../../common/js/route-constant.js"></script>
|
||||
<script src="../../common/js/svga.min.js"></script>
|
||||
<script src="./local/en.js"></script>
|
||||
<script src="./local/zh.js"></script>
|
||||
<script src="./local/ar.js"></script>
|
||||
<script src="./local/tr.js"></script>
|
||||
<script src="./js/index.js"></script>
|
||||
<script src="../../common/local/langHandler.js"></script>
|
||||
<script src="./js/danmaku.js"></script>
|
||||
564
view/molistar/activity/adventureTreasureHunt/js/danmaku.js
Normal file
564
view/molistar/activity/adventureTreasureHunt/js/danmaku.js
Normal file
@@ -0,0 +1,564 @@
|
||||
(function (global, factory) {
|
||||
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
||||
typeof define === 'function' && define.amd ? define(factory) :
|
||||
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Danmaku = factory());
|
||||
}(this, (function () { 'use strict';
|
||||
|
||||
var transform = (function() {
|
||||
/* istanbul ignore next */
|
||||
if (typeof document === 'undefined') return 'transform';
|
||||
var properties = [
|
||||
'oTransform', // Opera 11.5
|
||||
'msTransform', // IE 9
|
||||
'mozTransform',
|
||||
'webkitTransform',
|
||||
'transform'
|
||||
];
|
||||
var style = document.createElement('div').style;
|
||||
for (var i = 0; i < properties.length; i++) {
|
||||
/* istanbul ignore else */
|
||||
if (properties[i] in style) {
|
||||
return properties[i];
|
||||
}
|
||||
}
|
||||
/* istanbul ignore next */
|
||||
return 'transform';
|
||||
}());
|
||||
|
||||
function createCommentNode(cmt) {
|
||||
var node = document.createElement('div');
|
||||
node.style.cssText = 'position:absolute;';
|
||||
if (typeof cmt.render === 'function') {
|
||||
var $el = cmt.render();
|
||||
if ($el instanceof HTMLElement) {
|
||||
node.appendChild($el);
|
||||
return node;
|
||||
}
|
||||
}
|
||||
node.textContent = cmt.text;
|
||||
if (cmt.style) {
|
||||
for (var key in cmt.style) {
|
||||
node.style[key] = cmt.style[key];
|
||||
}
|
||||
}
|
||||
return node;
|
||||
}
|
||||
|
||||
function init() {
|
||||
var stage = document.createElement('div');
|
||||
stage.style.cssText = 'overflow:hidden;white-space:nowrap;transform:translateZ(0);';
|
||||
return stage;
|
||||
}
|
||||
|
||||
function clear(stage) {
|
||||
var lc = stage.lastChild;
|
||||
while (lc) {
|
||||
stage.removeChild(lc);
|
||||
lc = stage.lastChild;
|
||||
}
|
||||
}
|
||||
|
||||
function resize(stage, width, height) {
|
||||
stage.style.width = '100%';
|
||||
stage.style.height = '100%';
|
||||
}
|
||||
|
||||
function framing() {
|
||||
//
|
||||
}
|
||||
|
||||
function setup(stage, comments) {
|
||||
var df = document.createDocumentFragment();
|
||||
var i = 0;
|
||||
var cmt = null;
|
||||
for (i = 0; i < comments.length; i++) {
|
||||
cmt = comments[i];
|
||||
cmt.node = cmt.node || createCommentNode(cmt);
|
||||
df.appendChild(cmt.node);
|
||||
}
|
||||
if (comments.length) {
|
||||
stage.appendChild(df);
|
||||
}
|
||||
for (i = 0; i < comments.length; i++) {
|
||||
cmt = comments[i];
|
||||
cmt.width = cmt.width || cmt.node.offsetWidth;
|
||||
cmt.height = cmt.height || cmt.node.offsetHeight;
|
||||
}
|
||||
}
|
||||
|
||||
function render(stage, cmt) {
|
||||
cmt.node.style[transform] = 'translate(' + cmt.x + 'px,' + cmt.y + 'px)';
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function remove(stage, cmt) {
|
||||
stage.removeChild(cmt.node);
|
||||
/* istanbul ignore else */
|
||||
if (!this.media) {
|
||||
cmt.node = null;
|
||||
}
|
||||
}
|
||||
|
||||
var domEngine = {
|
||||
name: 'dom',
|
||||
init: init,
|
||||
clear: clear,
|
||||
resize: resize,
|
||||
framing: framing,
|
||||
setup: setup,
|
||||
render: render,
|
||||
remove: remove,
|
||||
};
|
||||
|
||||
var raf =
|
||||
(
|
||||
typeof window !== 'undefined' &&
|
||||
(
|
||||
window.requestAnimationFrame ||
|
||||
window.mozRequestAnimationFrame ||
|
||||
window.webkitRequestAnimationFrame
|
||||
)
|
||||
) ||
|
||||
function(cb) {
|
||||
return setTimeout(cb, 50 / 3);
|
||||
};
|
||||
|
||||
var caf =
|
||||
(
|
||||
typeof window !== 'undefined' &&
|
||||
(
|
||||
window.cancelAnimationFrame ||
|
||||
window.mozCancelAnimationFrame ||
|
||||
window.webkitCancelAnimationFrame
|
||||
)
|
||||
) ||
|
||||
clearTimeout;
|
||||
|
||||
function binsearch(arr, prop, key) {
|
||||
var mid = 0;
|
||||
var left = 0;
|
||||
var right = arr.length;
|
||||
while (left < right - 1) {
|
||||
mid = (left + right) >> 1;
|
||||
if (key >= arr[mid][prop]) {
|
||||
left = mid;
|
||||
} else {
|
||||
right = mid;
|
||||
}
|
||||
}
|
||||
if (arr[left] && key < arr[left][prop]) {
|
||||
return left;
|
||||
}
|
||||
return right;
|
||||
}
|
||||
|
||||
|
||||
function formatMode(mode) {
|
||||
if (!/^(ltr|top|bottom)$/i.test(mode)) {
|
||||
return 'rtl';
|
||||
}
|
||||
return mode.toLowerCase();
|
||||
}
|
||||
|
||||
function collidableRange() {
|
||||
var max = 9007199254740991;
|
||||
return [
|
||||
{ range: 0, time: -max, width: max, height: 0 },
|
||||
{ range: max, time: max, width: 0, height: 0 }
|
||||
];
|
||||
}
|
||||
|
||||
function resetSpace(space) {
|
||||
space.ltr = collidableRange();
|
||||
space.rtl = collidableRange();
|
||||
space.top = collidableRange();
|
||||
space.bottom = collidableRange();
|
||||
}
|
||||
|
||||
function now() {
|
||||
return typeof window.performance !== 'undefined' && window.performance.now
|
||||
? window.performance.now()
|
||||
: Date.now();
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function allocate(cmt) {
|
||||
var that = this;
|
||||
var ct = this.media ? this.media.currentTime : now() / 1000;
|
||||
var pbr = this.media ? this.media.playbackRate : 1;
|
||||
function willCollide(cr, cmt) {
|
||||
if (cmt.mode === 'top' || cmt.mode === 'bottom') {
|
||||
return ct - cr.time < that._.duration;
|
||||
}
|
||||
var crTotalWidth = that._.width + cr.width;
|
||||
var crElapsed = crTotalWidth * (ct - cr.time) * pbr / that._.duration;
|
||||
if (cr.width > crElapsed) {
|
||||
return true;
|
||||
}
|
||||
// (rtl mode) the right end of `cr` move out of left side of stage
|
||||
var crLeftTime = that._.duration + cr.time - ct;
|
||||
var cmtTotalWidth = that._.width + cmt.width;
|
||||
var cmtTime = that.media ? cmt.time : cmt._utc;
|
||||
var cmtElapsed = cmtTotalWidth * (ct - cmtTime) * pbr / that._.duration;
|
||||
var cmtArrival = that._.width - cmtElapsed;
|
||||
// (rtl mode) the left end of `cmt` reach the left side of stage
|
||||
var cmtArrivalTime = that._.duration * cmtArrival / (that._.width + cmt.width);
|
||||
return crLeftTime > cmtArrivalTime;
|
||||
}
|
||||
var crs = this._.space[cmt.mode];
|
||||
var last = 0;
|
||||
var curr = 0;
|
||||
for (var i = 1; i < crs.length; i++) {
|
||||
var cr = crs[i];
|
||||
var requiredRange = cmt.height;
|
||||
if (cmt.mode === 'top' || cmt.mode === 'bottom') {
|
||||
requiredRange += cr.height;
|
||||
}
|
||||
if (cr.range - cr.height - crs[last].range >= requiredRange) {
|
||||
curr = i;
|
||||
break;
|
||||
}
|
||||
if (willCollide(cr, cmt)) {
|
||||
last = i;
|
||||
}
|
||||
}
|
||||
var channel = crs[last].range;
|
||||
var crObj = {
|
||||
range: channel + cmt.height,
|
||||
time: this.media ? cmt.time : cmt._utc,
|
||||
width: cmt.width,
|
||||
height: cmt.height
|
||||
};
|
||||
crs.splice(last + 1, curr - last - 1, crObj);
|
||||
|
||||
if (cmt.mode === 'bottom') {
|
||||
return this._.height - cmt.height - channel % this._.height;
|
||||
}
|
||||
return channel % (this._.height - cmt.height);
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function createEngine(framing, setup, render, remove) {
|
||||
return function(_timestamp) {
|
||||
framing(this._.stage);
|
||||
var timestamp = _timestamp || now();
|
||||
var dn = timestamp / 1000;
|
||||
var ct = this.media ? this.media.currentTime : dn;
|
||||
var pbr = this.media ? this.media.playbackRate : 1;
|
||||
var cmt = null;
|
||||
var cmtt = 0;
|
||||
var i = 0;
|
||||
for (i = this._.runningList.length - 1; i >= 0; i--) {
|
||||
cmt = this._.runningList[i];
|
||||
cmtt = this.media ? cmt.time : cmt._utc;
|
||||
if (ct - cmtt > this._.duration) {
|
||||
remove(this._.stage, cmt);
|
||||
this._.runningList.splice(i, 1);
|
||||
}
|
||||
}
|
||||
var pendingList = [];
|
||||
while (this._.position < this.comments.length) {
|
||||
cmt = this.comments[this._.position];
|
||||
cmtt = this.media ? cmt.time : cmt._utc;
|
||||
if (cmtt >= ct) {
|
||||
break;
|
||||
}
|
||||
// when clicking controls to seek, media.currentTime may changed before
|
||||
// `pause` event is fired, so here skips comments out of duration,
|
||||
// see https://github.com/weizhenye/Danmaku/pull/30 for details.
|
||||
if (ct - cmtt > this._.duration) {
|
||||
++this._.position;
|
||||
continue;
|
||||
}
|
||||
if (this.media) {
|
||||
cmt._utc = dn - (this.media.currentTime - cmt.time);
|
||||
}
|
||||
pendingList.push(cmt);
|
||||
++this._.position;
|
||||
}
|
||||
setup(this._.stage, pendingList);
|
||||
for (i = 0; i < pendingList.length; i++) {
|
||||
cmt = pendingList[i];
|
||||
cmt.y = allocate.call(this, cmt);
|
||||
this._.runningList.push(cmt);
|
||||
}
|
||||
for (i = 0; i < this._.runningList.length; i++) {
|
||||
cmt = this._.runningList[i];
|
||||
var totalWidth = this._.width + cmt.width;
|
||||
var elapsed = totalWidth * (dn - cmt._utc) * pbr / this._.duration;
|
||||
if (cmt.mode === 'ltr') cmt.x = elapsed - cmt.width;
|
||||
if (cmt.mode === 'rtl') cmt.x = this._.width - elapsed;
|
||||
if (cmt.mode === 'top' || cmt.mode === 'bottom') {
|
||||
cmt.x = (this._.width - cmt.width) >> 1;
|
||||
}
|
||||
render(this._.stage, cmt);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function play() {
|
||||
if (!this._.visible || !this._.paused) {
|
||||
return this;
|
||||
}
|
||||
this._.paused = false;
|
||||
if (this.media) {
|
||||
for (var i = 0; i < this._.runningList.length; i++) {
|
||||
var cmt = this._.runningList[i];
|
||||
cmt._utc = now() / 1000 - (this.media.currentTime - cmt.time);
|
||||
}
|
||||
}
|
||||
var that = this;
|
||||
var engine = createEngine(
|
||||
this._.engine.framing.bind(this),
|
||||
this._.engine.setup.bind(this),
|
||||
this._.engine.render.bind(this),
|
||||
this._.engine.remove.bind(this)
|
||||
);
|
||||
function frame(timestamp) {
|
||||
engine.call(that, timestamp);
|
||||
that._.requestID = raf(frame);
|
||||
}
|
||||
this._.requestID = raf(frame);
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function pause() {
|
||||
if (!this._.visible || this._.paused) {
|
||||
return this;
|
||||
}
|
||||
this._.paused = true;
|
||||
caf(this._.requestID);
|
||||
this._.requestID = 0;
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function seek() {
|
||||
if (!this.media) {
|
||||
return this;
|
||||
}
|
||||
this.clear();
|
||||
resetSpace(this._.space);
|
||||
var position = binsearch(this.comments, 'time', this.media.currentTime);
|
||||
this._.position = Math.max(0, position - 1);
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function bindEvents(_) {
|
||||
_.play = play.bind(this);
|
||||
_.pause = pause.bind(this);
|
||||
_.seeking = seek.bind(this);
|
||||
this.media.addEventListener('play', _.play);
|
||||
this.media.addEventListener('pause', _.pause);
|
||||
this.media.addEventListener('playing', _.play);
|
||||
this.media.addEventListener('waiting', _.pause);
|
||||
this.media.addEventListener('seeking', _.seeking);
|
||||
}
|
||||
|
||||
/* eslint no-invalid-this: 0 */
|
||||
function unbindEvents(_) {
|
||||
this.media.removeEventListener('play', _.play);
|
||||
this.media.removeEventListener('pause', _.pause);
|
||||
this.media.removeEventListener('playing', _.play);
|
||||
this.media.removeEventListener('waiting', _.pause);
|
||||
this.media.removeEventListener('seeking', _.seeking);
|
||||
_.play = null;
|
||||
_.pause = null;
|
||||
_.seeking = null;
|
||||
}
|
||||
|
||||
/* eslint-disable no-invalid-this */
|
||||
function init$1(opt) {
|
||||
this._ = {};
|
||||
this.container = opt.container || document.createElement('div');
|
||||
this.media = opt.media;
|
||||
this._.visible = true;
|
||||
|
||||
/* eslint-disable no-undef */
|
||||
/* istanbul ignore next */
|
||||
{
|
||||
this.engine = 'dom';
|
||||
this._.engine = domEngine;
|
||||
}
|
||||
/* eslint-enable no-undef */
|
||||
this._.requestID = 0;
|
||||
|
||||
this._.speed = Math.max(0, opt.speed) || 144;
|
||||
this._.duration = 4;
|
||||
|
||||
this.comments = opt.comments || [];
|
||||
this.comments.sort(function(a, b) {
|
||||
return a.time - b.time;
|
||||
});
|
||||
for (var i = 0; i < this.comments.length; i++) {
|
||||
this.comments[i].mode = formatMode(this.comments[i].mode);
|
||||
}
|
||||
this._.runningList = [];
|
||||
this._.position = 0;
|
||||
|
||||
this._.paused = true;
|
||||
if (this.media) {
|
||||
this._.listener = {};
|
||||
bindEvents.call(this, this._.listener);
|
||||
}
|
||||
|
||||
this._.stage = this._.engine.init(this.container);
|
||||
this._.stage.style.cssText += 'position:relative;pointer-events:none;';
|
||||
|
||||
this.resize();
|
||||
this.container.appendChild(this._.stage);
|
||||
|
||||
this._.space = {};
|
||||
resetSpace(this._.space);
|
||||
|
||||
if (!this.media || !this.media.paused) {
|
||||
seek.call(this);
|
||||
play.call(this);
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint-disable no-invalid-this */
|
||||
function destroy() {
|
||||
if (!this.container) {
|
||||
return this;
|
||||
}
|
||||
|
||||
pause.call(this);
|
||||
this.clear();
|
||||
this.container.removeChild(this._.stage);
|
||||
if (this.media) {
|
||||
unbindEvents.call(this, this._.listener);
|
||||
}
|
||||
for (var key in this) {
|
||||
/* istanbul ignore else */
|
||||
if (Object.prototype.hasOwnProperty.call(this, key)) {
|
||||
this[key] = null;
|
||||
}
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
var properties = ['mode', 'time', 'text', 'render', 'style'];
|
||||
|
||||
/* eslint-disable no-invalid-this */
|
||||
function emit(obj) {
|
||||
if (!obj || Object.prototype.toString.call(obj) !== '[object Object]') {
|
||||
return this;
|
||||
}
|
||||
var cmt = {};
|
||||
for (var i = 0; i < properties.length; i++) {
|
||||
if (obj[properties[i]] !== undefined) {
|
||||
cmt[properties[i]] = obj[properties[i]];
|
||||
}
|
||||
}
|
||||
cmt.text = (cmt.text || '').toString();
|
||||
cmt.mode = formatMode(cmt.mode);
|
||||
cmt._utc = now() / 1000;
|
||||
if (this.media) {
|
||||
var position = 0;
|
||||
if (cmt.time === undefined) {
|
||||
cmt.time = this.media.currentTime;
|
||||
position = this._.position;
|
||||
} else {
|
||||
position = binsearch(this.comments, 'time', cmt.time);
|
||||
if (position < this._.position) {
|
||||
this._.position += 1;
|
||||
}
|
||||
}
|
||||
this.comments.splice(position, 0, cmt);
|
||||
} else {
|
||||
this.comments.push(cmt);
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint-disable no-invalid-this */
|
||||
function show() {
|
||||
if (this._.visible) {
|
||||
return this;
|
||||
}
|
||||
this._.visible = true;
|
||||
if (this.media && this.media.paused) {
|
||||
return this;
|
||||
}
|
||||
seek.call(this);
|
||||
play.call(this);
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint-disable no-invalid-this */
|
||||
function hide() {
|
||||
if (!this._.visible) {
|
||||
return this;
|
||||
}
|
||||
pause.call(this);
|
||||
this.clear();
|
||||
this._.visible = false;
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint-disable no-invalid-this */
|
||||
function clear$1() {
|
||||
this._.engine.clear(this._.stage, this._.runningList);
|
||||
this._.runningList = [];
|
||||
return this;
|
||||
}
|
||||
|
||||
/* eslint-disable no-invalid-this */
|
||||
function resize$1() {
|
||||
this._.width = this.container.offsetWidth;
|
||||
this._.height = this.container.offsetHeight;
|
||||
this._.engine.resize(this._.stage, this._.width, this._.height);
|
||||
this._.duration = this._.width / this._.speed;
|
||||
return this;
|
||||
}
|
||||
|
||||
var speed = {
|
||||
get: function() {
|
||||
return this._.speed;
|
||||
},
|
||||
set: function(s) {
|
||||
if (typeof s !== 'number' ||
|
||||
isNaN(s) ||
|
||||
!isFinite(s) ||
|
||||
s <= 0) {
|
||||
return this._.speed;
|
||||
}
|
||||
this._.speed = s;
|
||||
if (this._.width) {
|
||||
this._.duration = this._.width / s;
|
||||
}
|
||||
return s;
|
||||
}
|
||||
};
|
||||
|
||||
function Danmaku(opt) {
|
||||
opt && init$1.call(this, opt);
|
||||
}
|
||||
Danmaku.prototype.destroy = function() {
|
||||
return destroy.call(this);
|
||||
};
|
||||
Danmaku.prototype.emit = function(cmt) {
|
||||
return emit.call(this, cmt);
|
||||
};
|
||||
Danmaku.prototype.show = function() {
|
||||
return show.call(this);
|
||||
};
|
||||
Danmaku.prototype.hide = function() {
|
||||
return hide.call(this);
|
||||
};
|
||||
Danmaku.prototype.clear = function() {
|
||||
return clear$1.call(this);
|
||||
};
|
||||
Danmaku.prototype.resize = function() {
|
||||
return resize$1.call(this);
|
||||
};
|
||||
Object.defineProperty(Danmaku.prototype, 'speed', speed);
|
||||
|
||||
return Danmaku;
|
||||
|
||||
})));
|
||||
605
view/molistar/activity/adventureTreasureHunt/js/index.js
Normal file
605
view/molistar/activity/adventureTreasureHunt/js/index.js
Normal file
@@ -0,0 +1,605 @@
|
||||
let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
let env = EnvCheck();
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
// 封裝layer消息提醒框
|
||||
let layerIndex
|
||||
var langReplace;
|
||||
var localLang;
|
||||
const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
|
||||
layer.open({
|
||||
type: 2,
|
||||
shadeClose: false,
|
||||
content,
|
||||
success(e) {
|
||||
layerIndex = $(e).attr('index')
|
||||
}
|
||||
})
|
||||
}
|
||||
const hideLoading = (index) => {
|
||||
layer.close(index)
|
||||
}
|
||||
const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
|
||||
layer.open({
|
||||
content,
|
||||
time,
|
||||
skin: 'msg'
|
||||
})
|
||||
}
|
||||
var countupTime;//倒计时容器
|
||||
// 弹幕专用
|
||||
let damuPool = [];
|
||||
let danmu = [];
|
||||
let timer2;
|
||||
// 初始化
|
||||
let danmaku;
|
||||
const initDanmu = () => {
|
||||
danmaku = new Danmaku({
|
||||
container: document.getElementById('my_container'),
|
||||
speed: 60,
|
||||
})
|
||||
setDanmuData();
|
||||
}
|
||||
const setDanmuData = () => {
|
||||
damuPool = [
|
||||
{ avatar: './images/logo.png', bless: '我把思念写着天空', },
|
||||
{ avatar: './images/logo.png', bless: '我想永远陪着你', },
|
||||
{ avatar: './images/logo.png', bless: '我爱你我爱你甜蜜蜜', },
|
||||
{ avatar: './images/logo.png', bless: 'asdawdasdasdas', },
|
||||
]
|
||||
if (!timer2) {
|
||||
timer2 = setInterval(() => {
|
||||
if (!danmu.length) {
|
||||
danmu = [...damuPool]
|
||||
}
|
||||
let danmushoot = danmu.shift();
|
||||
if (danmushoot) {
|
||||
renderDM(danmushoot);
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
}
|
||||
const renderDM = (item) => {
|
||||
danmaku.resize();
|
||||
danmaku.emit({
|
||||
mode: window.lang.code == 'ar' ? 'ltr' : 'rtl',
|
||||
render: function () {
|
||||
var $div = document.createElement('div');
|
||||
$div.innerHTML = `
|
||||
<div class="my_container_in">
|
||||
<img src="${item.avatar}" alt="" class="tx">
|
||||
<span>${item.bless}</span>
|
||||
</div>`
|
||||
return $div;
|
||||
},
|
||||
})
|
||||
}
|
||||
var page = 0;
|
||||
var maxPage = 0;
|
||||
var arr = [];
|
||||
var lists = [];
|
||||
var list = [];
|
||||
var listType = 0;
|
||||
// 初始化函數
|
||||
$(function () {
|
||||
getInfoFromClient();
|
||||
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
|
||||
setTimeout(function () {
|
||||
// 頁面全屏
|
||||
if (browser.app) {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.initShowNav(false)
|
||||
} else {
|
||||
window.webkit.messageHandlers.initShowNav.postMessage(0)
|
||||
}
|
||||
};
|
||||
// 頂部返回事件
|
||||
$('.back img').click(() => {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.closeWebView()
|
||||
} else {
|
||||
window.webkit.messageHandlers.closeWebView.postMessage(null)
|
||||
}
|
||||
})
|
||||
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
|
||||
langReplace = window.lang.replace;
|
||||
localLang = window.lang;
|
||||
translateFun();
|
||||
// blessGetConfig();
|
||||
// questionConfig();
|
||||
}, 100)
|
||||
})
|
||||
function translateFun() {
|
||||
var langReplace = window.lang.replace;
|
||||
var localLang = window.lang;
|
||||
$('.page_title').html(langReplace(localLang.demoModule.page_title));
|
||||
$('.rule').html(langReplace(localLang.demoModule.Rules));
|
||||
$('.My_Record').html(langReplace(localLang.demoModule.My_Record));
|
||||
|
||||
}
|
||||
// 弹幕接口
|
||||
function blessGetConfig() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/2025Ramadan/bless/getConfig',
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
damuPool = res.data.blessQueue;
|
||||
initDanmu();
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
// 主tab切换
|
||||
$('.header .tab div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$('.page1,.page2,.page3').hide();
|
||||
$(this).addClass('act').siblings().removeClass('act');
|
||||
$(`.page${i}`).show();
|
||||
if (i == 2) {
|
||||
ramadanRank();
|
||||
}
|
||||
})
|
||||
// ===============================================页面一===============================================
|
||||
// 问题列表接口
|
||||
function questionConfig(dates) {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/2025Ramadan/question/getConfig',
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
// 进度
|
||||
var num = res.data.cumulativeNum / 38 * 100
|
||||
$('.page1 .c .page1_1 .medal .line .line_in').css('width', num + "%")
|
||||
$('.page1 .c .page1_1 .medal .line span').text(`${res.data.cumulativeNum}/38`);
|
||||
var myMap = res.data.questionStatusMap;
|
||||
// 渲染日期
|
||||
$('.page1 .c .page1_2 .calendar .calendar_in div').remove();
|
||||
var calendarStr = '';
|
||||
for (let key in myMap) {
|
||||
if (myMap.hasOwnProperty(key)) {
|
||||
calendarStr += `
|
||||
<div class="${myMap[key] == 3 || myMap[key] == 2 ? 'act' : ''}">
|
||||
<span>${formattedDate(key)}</span>
|
||||
<img src="${myMap[key] == 3 ? './images/corrects.png' : myMap[key] == 2 ? './images/incorrect.png' : ''}" alt="">
|
||||
</div>
|
||||
`
|
||||
if (key == '2025-03-03' && myMap[key] == 3) {
|
||||
$('.page1 .c .page1_2 .rewars1 div .doneBut').show();
|
||||
}
|
||||
if (key == '2025-03-07' && myMap[key] == 3) {
|
||||
$('.page1 .c .page1_2 .rewars2 div .doneBut').show();
|
||||
}
|
||||
if (key == '2025-03-15' && myMap[key] == 3) {
|
||||
$('.page1 .c .page1_2 .rewars3 div .doneBut').show();
|
||||
}
|
||||
if (key == '2025-03-30' && myMap[key] == 3) {
|
||||
$('.page1 .c .page1_2 .rewars4 div .doneBut').show();
|
||||
}
|
||||
}
|
||||
}
|
||||
$('.page1 .c .page1_2 .calendar .calendar_in').append(calendarStr);
|
||||
// 渲染灯笼
|
||||
$('.page1 .lanternBox div').remove();
|
||||
var lantern = ''
|
||||
var bool = false;
|
||||
for (let key in myMap) {
|
||||
if (myMap.hasOwnProperty(key)) {
|
||||
bool = !bool;
|
||||
lantern += `
|
||||
<div status="${myMap[key]}" date="${key}" class="buts ${key == '2025-03-03' || key == '2025-03-07' || key == '2025-03-15' || key == '2025-03-30' ? 'special' : ''} ${bool ? 'singular' : ''} ${myMap[key] == 0 ? 'hangInTheAir' : myMap[key] == 1 ? 'beCompleted' : myMap[key] == 2 || myMap[key] == 3 ? 'completed' : ''}">
|
||||
<div class="lanternDate">${formattedDate(key)}</div>
|
||||
<img src="./images/ok.png" alt="" class="ok">
|
||||
<img src="./images/notOk.png" alt="" class="notOk">
|
||||
<div class="gift" style="display:${key == '2025-03-03' || key == '2025-03-07' || key == '2025-03-15' || key == '2025-03-30' ? 'block' : 'none'}">
|
||||
<img src="./images/${key == '2025-03-03' ? 'questionSheet1' : key == '2025-03-07' ? 'questionSheet2' : key == '2025-03-15' ? 'questionSheet3' : key == '2025-03-30' ? 'questionSheet4' : ''}.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
}
|
||||
}
|
||||
$('.page1 .lanternBox').append(lantern);
|
||||
|
||||
getQuestion(dates ? dates : res.data.curDate);
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
function formattedDate(dateStr) {
|
||||
const parts = dateStr.split("-");
|
||||
const month = parseInt(parts[1], 10);
|
||||
const day = parseInt(parts[2], 10);
|
||||
return `${month}/${day}`
|
||||
}
|
||||
// 获取问题接口
|
||||
function getQuestion(date) {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/2025Ramadan/question/getQuestion',
|
||||
data: { date },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
$('.questionLists').attr('date', date);
|
||||
$('.page1 .c .page1_1 .question .answersNum b').text(res.data.rightAnswerNum);
|
||||
$('.page1 .c .page1_1 .question .questionText').text(res.data.question);
|
||||
$('.page1 .c .page1_1 .question .a span').html('A ' + res.data.optionA);
|
||||
$('.page1 .c .page1_1 .question .b span').html('B ' + res.data.optionB);
|
||||
$('.page1 .c .page1_1 .question .c span').html('C ' + res.data.optionC);
|
||||
// 判断是否答题
|
||||
if (res.data.answer) {
|
||||
// 已答题
|
||||
$(`.page1 .c .page1_1 .question .${res.data.answer}`).addClass('borders');
|
||||
$('.questionLists').attr('answer', 0);
|
||||
$(`.page1 .c .page1_1 .question .questionLists img`).hide();
|
||||
if (res.data.result) {
|
||||
// 正确
|
||||
$(`.page1 .c .page1_1 .question .${res.data.answer} img`).attr('src', './images/corrects.png')
|
||||
} else {
|
||||
// 不正确
|
||||
$(`.page1 .c .page1_1 .question .${res.data.answer} img`).attr('src', './images/incorrect.png')
|
||||
}
|
||||
$(`.page1 .c .page1_1 .question .${res.data.answer} img`).show();
|
||||
} else {
|
||||
// 未答题
|
||||
$(`.page1 .c .page1_1 .question .questionLists `).removeClass('borders');
|
||||
$(`.page1 .c .page1_1 .question .questionLists img`).hide();
|
||||
$('.questionLists').attr('answer', 1);
|
||||
}
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
// 回答按钮
|
||||
$('.questionLists').click(function () {
|
||||
var option = $(this).attr('option');
|
||||
var date = $(this).attr('date');
|
||||
var answer = $(this).attr('answer');
|
||||
if (answer == 1) {
|
||||
questionAsk(date, option);
|
||||
}
|
||||
})
|
||||
|
||||
// 回答接口
|
||||
function questionAsk(date, option) {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/2025Ramadan/question/ask',
|
||||
data: { date, option },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
bodyScroolFun(false);
|
||||
if (res.data.result) {
|
||||
if (res.data.reward) {
|
||||
$('.page1 .congratulations .congratulations_in .gift .gift_in').attr('src', res.data.reward.pic);
|
||||
$('.page1 .congratulations .congratulations_in .gift .giftName').text(res.data.reward.name);
|
||||
$('.page1 .congratulations .congratulations_in .gift .num').text(`${res.data.reward.num} ${res.data.reward.unit}`);
|
||||
$('.page1 .congratulations').show();
|
||||
}
|
||||
} else {
|
||||
$('.page1 .unfortunately').show();
|
||||
}
|
||||
questionConfig(date);
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
// 监听切换题目
|
||||
$('.page1 .lanternBox').on('click', '.buts', function () {
|
||||
var date = $(this).attr('date');
|
||||
var status = $(this).attr('status');
|
||||
if (status == 0) {
|
||||
toastMsg(langReplace(localLang.demoModule.text44));
|
||||
} else {
|
||||
getQuestion(date)
|
||||
}
|
||||
})
|
||||
// 页面1tab切换
|
||||
$('.page1 .c .page1_tabBox div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$(this).addClass('act').siblings().removeClass('act');
|
||||
$(`.page1_1,.page1_2`).hide();
|
||||
$(`.page1_${i}`).show();
|
||||
})
|
||||
// 关闭答题错误弹窗
|
||||
$('.page1 .unfortunately .unfortunately_in .close,.page1 .unfortunately .unfortunately_in .but').click(function () {
|
||||
bodyScroolFun(false);
|
||||
$('.page1 .unfortunately').hide();
|
||||
})
|
||||
// 关闭答题正确弹窗
|
||||
$('.page1 .congratulations .congratulations_in .close,.page1 .congratulations .congratulations_in .but').click(function () {
|
||||
bodyScroolFun(false);
|
||||
$('.page1 .congratulations').hide();
|
||||
})
|
||||
|
||||
// ===============================================页面二===============================================
|
||||
|
||||
// 发射弹幕接口
|
||||
function bless(bless) {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/2025Ramadan/bless/bless',
|
||||
data: { bless },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
danmaku.destroy();
|
||||
blessGetConfig();
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
// 发送弹幕
|
||||
$('.ramadanBlessings .send').click(function () {
|
||||
var text = $('.ramadanBlessings input').val();
|
||||
if (text.length > 20 || text.length == 0) {
|
||||
toastMsg(langReplace(localLang.demoModule.text70));
|
||||
return;
|
||||
}
|
||||
$('.tip').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 确认发送按钮
|
||||
$('.tip .tip_in .ok').click(function () {
|
||||
var text = $('.ramadanBlessings input').val();
|
||||
bodyScroolFun(false);
|
||||
$('.tip').hide();
|
||||
bless(text)
|
||||
})
|
||||
// 取消发送按钮
|
||||
$('.tip .tip_in .close').click(function () {
|
||||
bodyScroolFun(false);
|
||||
$('.tip').hide();
|
||||
})
|
||||
// 转盘未获奖弹窗
|
||||
$('.page2 .unfortunately .unfortunately_in .close,.page2 .unfortunately .unfortunately_in .but').click(function () {
|
||||
bodyScroolFun(false);
|
||||
$('.page2 .unfortunately').hide();
|
||||
})
|
||||
// 转盘获奖弹窗
|
||||
$('.page2 .congratulations .congratulations_in .close,.page2 .congratulations .congratulations_in .but').click(function () {
|
||||
bodyScroolFun(false);
|
||||
$('.page2 .congratulations').hide();
|
||||
})
|
||||
// 转盘相关的
|
||||
var arr = [20, 60, 100, 140, 180, 220, 260, 300];
|
||||
var i = null;
|
||||
var sec = 3;
|
||||
var animationFunLock = true;
|
||||
$('.page2 .turntable .c .pointerBut').click(function () {
|
||||
i = Math.floor(Math.random() * arr.length);
|
||||
console.log(Math.floor(Math.random() * arr.length));
|
||||
|
||||
if (animationFunLock) {
|
||||
animationFunLock = false;
|
||||
animationFun();
|
||||
}
|
||||
})
|
||||
function animationFun() {
|
||||
// 设置为立即从0默认值
|
||||
$('.page2 .turntable .c .turntableBox .turntable_in img').css({
|
||||
'transition': `all 0s`,
|
||||
'transform': `rotate(0deg)`
|
||||
});
|
||||
// 在稍后的时间应用旋转效果
|
||||
setTimeout(function () {
|
||||
$('.page2 .turntable .c .turntableBox .turntable_in img').css({
|
||||
'transition': `all ${sec}s`,
|
||||
'transform': `rotate(${3 * 360 + arr[i]}deg)`,
|
||||
});
|
||||
}, 0);
|
||||
setTimeout(function () {
|
||||
animationFunLock = true;
|
||||
}, sec * 1000)
|
||||
}
|
||||
|
||||
|
||||
|
||||
// // ===============================================页面三===============================================
|
||||
var countupTime;//倒计时容器
|
||||
//tab切换
|
||||
$('.page2 .list .c .page3_in1 .page3TabBox div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$(this).addClass('act').siblings().removeClass();
|
||||
listType = $(this).attr('type');
|
||||
|
||||
$('.page2 .list .c .page3_in1 .timeOutBox').css('display', 'none');
|
||||
$('.page2 .list .c .page3_in1 .yesterdayCoinsPool').hide();
|
||||
$('.page2 .list .c .page3_in1 .no1 .rewards').hide();
|
||||
if (i == 1) {
|
||||
$('.page2 .list .c .page3_in1 .yesterdayCoinsPool').show();
|
||||
} else if (i == 2) {
|
||||
$('.page2 .list .c .page3_in1 .timeOutBox').css('display', 'flex');
|
||||
} else {
|
||||
$('.page2 .list .c .page3_in1 .timeOutBox').css('display', 'flex');
|
||||
$('.page2 .list .c .page3_in1 .no1 .rewards').show();
|
||||
}
|
||||
ramadanRank();
|
||||
})
|
||||
|
||||
// 榜单接口
|
||||
function ramadanRank() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/activity/h5/ramadan/rank',
|
||||
data: { type: listType },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
$('.page2 .todayCoinsPool .num b').text(res.data.poolGoldNum);
|
||||
var val = res.data.activityH5RankVo
|
||||
if (listType == 1) {
|
||||
console.log(val);
|
||||
|
||||
$('.page2 .list .c .page3_in1 .yesterdayCoinsPool .num b').text(val.totalGoldNum);
|
||||
} else {
|
||||
var endtime = new Date(res.data.activityH5RankVo.endTimeStr.replace(/\-/g, '/')).getTime();
|
||||
countup(endtime - res.timestamp);
|
||||
}
|
||||
var listTo3 = val.rankList.slice(0, 3);
|
||||
var notListTo3 = val.rankList.slice(3);
|
||||
// 处理前三
|
||||
if (listTo3.length < 3) {
|
||||
let arr = new Array(3 - listTo3.length).fill({
|
||||
avatar: './images/logo.png',
|
||||
name: langReplace(localLang.demoModule.text68),
|
||||
erbanNo: "",
|
||||
diffExp: '',
|
||||
userLevelVo: {
|
||||
experUrl: null
|
||||
}
|
||||
})
|
||||
listTo3.push(...arr)
|
||||
}
|
||||
$('.page2 .list .c .page3_in1 .no1 .score').hide();
|
||||
listTo3.forEach((res, i) => {
|
||||
$(`.page2 .list .c .page3_in1 .no${i + 1} .tx`).attr('src', res.avatar);
|
||||
$(`.page2 .list .c .page3_in1 .no${i + 1} .name `).html(`<b>${res.name.length > 4 ? res.name.slice(0, 4) + '...' : res.name}</b> <img src="${res.userLevelVo.experUrl}" alt="">`);
|
||||
$(`.page2 .list .c .page3_in1 .no${i + 1} .id`).text("ID: " + res.erbanNo);
|
||||
$(`.page2 .list .c .page3_in1 .no${i + 1} .score b`).text(unitProcessingAr(res.diffExp, 1));
|
||||
if (res.userLevelVo.experUrl == null) {
|
||||
$(`.page2 .list .c .page3_in1 .no23 .no${i + 1} .name img`).hide()
|
||||
$(`.page2 .list .c .page3_in1 .no23 .no${i + 1} .score`).hide()
|
||||
$(`.page2 .list .c .page3_in1 .no23 .no${i + 1} .id`).hide()
|
||||
} else {
|
||||
$(`.page2 .list .c .page3_in1 .no23 .no${i + 1} .name img`).show()
|
||||
$(`.page2 .list .c .page3_in1 .no23 .no${i + 1} .score`).show()
|
||||
$(`.page2 .list .c .page3_in1 .no23 .no${i + 1} .id`).show()
|
||||
}
|
||||
})
|
||||
// 处理非前三
|
||||
var str = '';
|
||||
$('.page2 .list .c .page3_in1 ul li').remove();
|
||||
notListTo3.forEach((res, i) => {
|
||||
str += `
|
||||
<li>
|
||||
<div class="num">${res.rank}</div>
|
||||
<img src="${res.avatar}" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>
|
||||
<b>${res.name.length > 4 ? res.name.slice(0, 4) + '...' : res.name}</b>
|
||||
<img src="${res.userLevelVo.experUrl}" alt="">
|
||||
</p>
|
||||
<span>ID: ${res.erbanNo}</span>
|
||||
</div>
|
||||
<div class="score">
|
||||
<span class="text30">${langReplace(localLang.demoModule.text30)}<br/>${unitProcessingAr(res.diffExp, 1)}</span>
|
||||
</div>
|
||||
</li>
|
||||
`;
|
||||
});
|
||||
$('.page2 .list .c .page3_in1 ul').append(str);
|
||||
// 处理自己
|
||||
var my = res.data.activityH5RankVo.myRank;
|
||||
if (my.rank == 1) {
|
||||
$('.page2 .my .score').hide();
|
||||
}
|
||||
if (my.rank == 0) {
|
||||
$('.page2 .my .num').css({ "font-size": "0.3rem", "width": '1rem', "text-indent": "-0.2rem" });
|
||||
}
|
||||
$('.page2 .my .num').text(my.rank == 0 ? langReplace(localLang.demoModule.text69) : my.rank);
|
||||
$('.page2 .my .tx').attr('src', my.avatar);
|
||||
$('.page2 .my .user').html(`<p><b>${my.name.length > 6 ? my.name.slice(0, 4) + '...' : my.name}</b> <img src="${my.userLevelVo.experUrl}" alt=""><span>ID:${my.erbanNo}</span></p>`);
|
||||
$('.page2 .my .score').html(`<span class="text30">${langReplace(localLang.demoModule.text30)}</span><br/>${unitProcessingAr(my.diffExp, 1)}`)
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 打开弹窗奖励
|
||||
$('.page2 .list .c .page3_in1 .no1 .rewards').click(function () {
|
||||
$('.page2 .rewardsPub').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 关闭弹窗奖励
|
||||
$('.page2 .rewardsPub .rewardsPub_in .close').click(function () {
|
||||
$('.page2 .rewardsPub').hide();
|
||||
bodyScroolFun(false);
|
||||
})
|
||||
|
||||
// 倒計時
|
||||
function countup(leftTime) {
|
||||
clearTimeout(countupTime)
|
||||
//獲取當前時間
|
||||
// var now = nowTime;
|
||||
var d = 0;
|
||||
var h = 0;
|
||||
var m = 0;
|
||||
var s = 0;
|
||||
//定義變數 d,h,m,s保存倒計時的時間
|
||||
var d, h, m, s;
|
||||
//遞歸每秒調⽤countTime⽅法，顯⽰動態時間效果
|
||||
if (leftTime > 0) {
|
||||
d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
|
||||
h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
|
||||
m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
|
||||
s = getzf(Math.floor(leftTime / 1000 % 60));
|
||||
//將倒計時賦值到div中
|
||||
$('.page2 .list .c .page3_in1 .timeOutBox .days b').text(d);
|
||||
$('.page2 .list .c .page3_in1 .timeOutBox .hours b').text(h);
|
||||
$('.page2 .list .c .page3_in1 .timeOutBox .mins b').text(m);
|
||||
$('.page2 .list .c .page3_in1 .timeOutBox .secs b').text(s);
|
||||
} else {
|
||||
ramadanRank();
|
||||
}
|
||||
if (leftTime > 0) {
|
||||
leftTime = leftTime - 1000;
|
||||
}
|
||||
countupTime = setTimeout(function () {
|
||||
countup(leftTime);
|
||||
}, 1000);
|
||||
}
|
||||
//补0操作
|
||||
function getzf(num) {
|
||||
if (parseInt(num) < 10) {
|
||||
num = '0' + num;
|
||||
}
|
||||
return num;
|
||||
}
|
||||
14
view/molistar/activity/adventureTreasureHunt/local/ar.js
Normal file
14
view/molistar/activity/adventureTreasureHunt/local/ar.js
Normal file
@@ -0,0 +1,14 @@
|
||||
// 阿拉伯
|
||||
langAr = {
|
||||
// 模块
|
||||
demoModule: {
|
||||
layerIndex1: 'جار التحميل...',
|
||||
layerIndex2: 'اكتملت العملية',
|
||||
layerIndex3: 'خطأ في الشبكة، يرجى الخروج وإعادة الدخول',
|
||||
page_title:'تحدي البحث عن الكنز',
|
||||
Adventurers_gather:'يا مغامرين، انطلقوا! تحدي البحث عن الكنز',
|
||||
Rules:'القواعد',
|
||||
My_Record:'سجلي',
|
||||
}
|
||||
|
||||
}
|
||||
14
view/molistar/activity/adventureTreasureHunt/local/en.js
Normal file
14
view/molistar/activity/adventureTreasureHunt/local/en.js
Normal file
@@ -0,0 +1,14 @@
|
||||
// 英文
|
||||
langEn = {
|
||||
// 模块
|
||||
demoModule: {
|
||||
layerIndex1: 'Loading...',
|
||||
layerIndex2: 'Operation completed',
|
||||
layerIndex3: 'Network error, please exit and re-enter',
|
||||
page_title:'Treasure Hunt challenge',
|
||||
Adventurers_gather:'Adventurers gather! Treasure hunt challenge is on!',
|
||||
Rules:'Rules',
|
||||
My_Record:'My Record',
|
||||
|
||||
}
|
||||
}
|
||||
12
view/molistar/activity/adventureTreasureHunt/local/tr.js
Normal file
12
view/molistar/activity/adventureTreasureHunt/local/tr.js
Normal file
@@ -0,0 +1,12 @@
|
||||
// 土耳其
|
||||
langTr = {
|
||||
// 模塊
|
||||
demoModule: {
|
||||
layerIndex1: 'Yükleniyor...',
|
||||
layerIndex2: 'İşlem tamamlandı',
|
||||
layerIndex3: 'Ağ hatası, lütfen çıkış yapıp tekrar girin',
|
||||
page_title:'Hazine Avı meydan okuması',
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
11
view/molistar/activity/adventureTreasureHunt/local/zh.js
Normal file
11
view/molistar/activity/adventureTreasureHunt/local/zh.js
Normal file
@@ -0,0 +1,11 @@
|
||||
// 英文
|
||||
langZh = {
|
||||
// 模块
|
||||
demoModule: {
|
||||
layerIndex1: 'Loading...',
|
||||
layerIndex2: 'Operation completed',
|
||||
layerIndex3: 'Network error, please exit and re-enter',
|
||||
page_title:'Treasure Hunt challenge',
|
||||
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user