diff --git a/view/molistar/modules/superLucky/css/index.css b/view/molistar/modules/superLucky/css/index.css new file mode 100644 index 00000000..e3a2e734 --- /dev/null +++ b/view/molistar/modules/superLucky/css/index.css @@ -0,0 +1,786 @@ +html, +body { + width: 100%; + background: #180144; + overflow-x: hidden; +} + +.back { + width: 100%; + height: 0.58667rem; + line-height: 0.58667rem; + position: fixed; + left: 0; + top: 1.2rem; + text-align: center; + color: #FFFFFF; + font-size: 0.50667rem; + font-weight: bold; + z-index: 10; +} + +.back img { + width: 0.58667rem; + height: 0.58667rem; + position: absolute; + left: 0.24rem; + top: 0rem; + z-index: 2; +} + +.back p { + width: 100%; + height: 0.58667rem; + line-height: 0.58667rem; + position: absolute; + left: 0.24rem; + top: 0rem; + text-align: center; + color: #FFF8C2; + font-size: 0.42667rem; + font-weight: 600; +} + +.header { + width: 10rem; + height: 13.06667rem; + background: url(../images/header.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0rem; + position: relative; +} + +.header .time { + width: 6.33333rem; + height: 1.2rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 10.81333rem; + display: flex; + justify-content: space-between; +} + +.header .time div { + width: 1.2rem; + height: 1.2rem; + background: url(../images/timeIcon.png) no-repeat; + background-size: 100% 100%; + text-align: center; + position: relative; +} + +.header .time div b { + color: #FDF565; + font-size: 0.58667rem; + font-weight: 600; + text-align: center; + width: 100%; + display: block; + margin: 0.37333rem 0; +} + +.header .time div span { + display: block; + width: 100%; + text-align: center; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 400; +} + +.danmu { + width: 10rem; + height: 8.48rem; + overflow: hidden; + margin: -0.3rem auto 0; + position: relative; + box-sizing: border-box; +} + +.danmu #my_container { + width: 100%; + height: 100%; + box-sizing: border-box; +} + +.danmu #my_container .my_container_in { + width: 9.25333rem; + height: 2.21333rem; + background: url(../images/dmBg.png) no-repeat; + background-size: 100% 100%; + position: relative; + margin-top: 0.1rem; +} + +.danmu #my_container .my_container_in .tx { + width: 1.17333rem; + height: 1.17333rem; + position: absolute; + left: 0.22667rem; + top: 0.6rem; + border: 0.02667rem solid #FDF565; + border-radius: 50%; +} + +.danmu #my_container .my_container_in .send { + width: 4.26667rem; + color: #FFFFFF; + font-size: 0.37333rem; + font-weight: 500; + position: absolute; + top: 0.81333rem; + left: 1.73333rem; +} + +.danmu #my_container .my_container_in .send b { + color: #FDF565; +} + +.danmu #my_container .my_container_in .win { + width: 4.26667rem; + color: #FFFFFF; + font-size: 0.37333rem; + font-weight: 500; + position: absolute; + top: 1.32rem; + left: 1.73333rem; +} + +.danmu #my_container .my_container_in .win b { + color: #FDF565; +} + +.danmu #my_container .my_container_in .conins { + width: 2.45333rem; + height: 2.45333rem; + position: absolute; + top: 50%; + transform: translateY(-50%); + left: 6.57333rem; + background: url(../images/dmScore.png) no-repeat; + background-size: 100% 100%; + overflow: hidden; +} + +.danmu #my_container .my_container_in .conins p { + width: 100%; + text-align: center; + color: #FDF565; + font-size: 0.48rem; + font-weight: 500; + margin-top: 0.89333rem; + margin-bottom: 0.16rem; +} + +.danmu #my_container .my_container_in .conins b { + display: block; + width: 100%; + text-align: center; + color: #fff; + font-size: 0.32rem; + font-weight: 500; +} + +.tab { + width: 9.04rem; + height: 1.73333rem; + margin: -0.66667rem auto -0.13333rem; + display: flex; + justify-content: space-between; +} + +.tab div { + width: 4.26667rem; + height: 1.73333rem; + line-height: 1.73333rem; + background: url(../images/tab.png) no-repeat; + background-size: 100% 100%; + color: #FFFFFF; + font-size: 0.45333rem; + font-weight: 600; + text-align: center; +} + +.tab .act { + background: url(../images/actTab.png) no-repeat; + background-size: 100% 100%; +} + +.page1 .top { + width: 10rem; + height: 8.93333rem; + margin: 0 auto 0; + position: relative; + background: url(../images/topBig.png) no-repeat; + background-size: 100% 100%; +} + +.page1 .top .history { + width: 2.02667rem; + height: 2.42667rem; + background: url(../images/hg.png) no-repeat; + background-size: 100% 100%; + position: absolute; + right: 0; + top: 0.69333rem; + text-align: center; + color: #291E00; + font-size: 0.4rem; + font-weight: 600; + line-height: 3.3rem; +} + +.page1 .top .top1 { + width: 6.66667rem; + height: 6.66667rem; + position: absolute; + top: 1.65333rem; + left: 50%; + transform: translateX(-50%); +} + +.page1 .top .top1 .ts { + width: 100%; + height: 100%; + position: absolute; + z-index: 2; + left: 0; + top: 0; +} + +.page1 .top .top1 .tx { + width: 2.93333rem; + height: 2.93333rem; + position: absolute; + top: 2.0rem; + left: 50%; + transform: translateX(-50%); + border-radius: 50%; +} + +.page1 .top .top1 .name { + width: 90%; + height: 0.48rem; + line-height: 0.48rem; + position: absolute; + top: 6.45rem; + text-align: center; + color: #FDF565; + font-size: 0.4rem; + font-weight: 600; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + display: flex; + justify-content: center; + left: 50%; + transform: translateX(-50%); +} + +.page1 .top .top1 .name img { + display: block; + width: 1.02667rem; + height: 0.48rem; +} + +.page1 .top .top1 .id { + width: 90%; + position: absolute; + top: 7.1rem; + text-align: center; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 400; + left: 50%; + transform: translateX(-50%); +} + +.page1 .content { + width: 10rem; + height: auto; + background: url(../images/content.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; +} + +.page1 .content ul { + width: 9.06667rem; + margin: 0 auto; + padding-top: 0.26667rem; + padding-bottom: 0.13333rem; +} + +.page1 .content ul li { + width: 9.06667rem; + height: 2rem; + background: url(../images/liBg.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0.13333rem; + box-sizing: border-box; + padding: 0 0.53333rem; +} + +.page1 .content ul li .num { + float: left; + width: 0.42667rem; + height: 100%; + line-height: 2rem; + text-align: center; + color: #FDF565; + font-size: 0.42667rem; + font-weight: 600; +} + +.page1 .content ul li .tx { + float: left; + width: 1.09333rem; + height: 1.09333rem; + border-radius: 50%; + margin: 0.45333rem 0.33333rem 0; + border: 0.02667rem solid #FDF565; +} + +.page1 .content ul li .user { + float: left; + margin-top: 0.65333rem; +} + +.page1 .content ul li .user p { + display: flex; + margin-bottom: 0.08rem; +} + +.page1 .content ul li .user p b { + display: block; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 500; + max-width: 1.97333rem; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 0.1rem; +} + +.page1 .content ul li .user p img { + display: block; + width: 1.02667rem; + height: 0.48rem; +} + +.page1 .content ul li .user span { + display: block; + color: #FDF565; + font-size: 0.34667rem; + font-weight: 400; +} + +.page1 .content ul li .score { + float: right; + height: 2rem; + line-height: 2rem; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 400; +} + +.page1 .content .more { + width: 1.65333rem; + border-radius: 0.58667rem; + min-width: 1.65333rem; + height: 0.58667rem; + line-height: 0.58667rem; + text-align: center; + padding: 0 0.44rem; + border: 0.02667rem solid #FDF565; + color: #FDF565; + font-size: 0.32rem; + font-weight: 500; + margin: 0.21333rem auto 0; +} + +.page1 .bottom { + width: 10rem; + height: 0.8rem; + margin: 0 auto 0; + background: url(../images/bottom.png) no-repeat; + background-size: 100% 100%; +} + +.page1 .my { + width: 10rem; + height: 1.98667rem; + position: fixed; + bottom: 0; + left: 50%; + transform: translateX(-50%); + background: url(../images/myBg.png) no-repeat; + background-size: 100% 100%; + z-index: 9; + padding: 0 0.73333rem; + box-sizing: border-box; +} + +.page1 .my .num { + float: left; + width: 0.42667rem; + height: 100%; + line-height: 2rem; + text-align: center; + color: #FDF565; + font-size: 0.42667rem; + font-weight: 600; +} + +.page1 .my .tx { + float: left; + width: 1.09333rem; + height: 1.09333rem; + border-radius: 50%; + margin: 0.45333rem 0.33333rem 0; + border: 0.02667rem solid #FDF565; +} + +.page1 .my .user { + float: left; + margin-top: 0.65333rem; +} + +.page1 .my .user p { + display: flex; + margin-bottom: 0.08rem; +} + +.page1 .my .user p b { + display: block; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 500; + max-width: 1.97333rem; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 0.1rem; +} + +.page1 .my .user p img { + display: block; + width: 1.02667rem; + height: 0.48rem; +} + +.page1 .my .user span { + display: block; + color: #FDF565; + font-size: 0.34667rem; + font-weight: 400; +} + +.page1 .my .score { + float: right; + height: 2rem; + line-height: 2rem; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 400; +} + +.page2 { + display: none; +} + +.page2 .top { + width: 10rem; + height: 2.24rem; + margin: 0 auto 0; + position: relative; + background: url(../images/top.png) no-repeat; + background-size: 100% 100%; +} + +.page2 .content { + width: 10rem; + height: auto; + background: url(../images/content.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; +} + +.page2 .content p { + width: 8.42667rem; + margin: 0 auto 0.26667rem; + line-height: 0.53333rem; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 400; +} + +.page2 .content img { + display: block; + width: 8.93333rem; + margin: 0.2rem auto 0; +} + +.page2 .bottom { + width: 10rem; + height: 0.8rem; + margin: 0 auto 0; + background: url(../images/bottom.png) no-repeat; + background-size: 100% 100%; +} + +.activity { + width: 100%; + text-align: center; + color: #FDF565; + font-size: 0.32rem; + font-weight: 400; + text-align: center; + margin: 0.26667rem auto 2.10667rem; +} + +.lastRank { + position: fixed; + top: 0; + bottom: 0; + right: 0; + left: 0; + background: rgba(0, 0, 0, 0.5); + z-index: 99; + display: none; +} + +.lastRank .lastRank_in { + width: 10rem; + height: 13.06667rem; + background: url(../images/lastRankBg.png) no-repeat; + background-size: 100% 100%; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + box-sizing: border-box; +} + +.lastRank .lastRank_in .close { + width: 0.88rem; + height: 0.88rem; + position: absolute; + right: 0; + top: -0.66667rem; +} + +.lastRank .lastRank_in .title { + width: 6.8rem; + height: 1.49333rem; + line-height: 1.49333rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 0.17333rem; + text-align: center; + color: #FDF565; + font-size: 0.45333rem; + font-weight: 600; + background: url(../images/lastRankTitle.png) no-repeat; + background-size: 100% 100%; +} + +.lastRank .lastRank_in .box { + width: 9.06667rem; + height: 10.3rem; + margin: 1.73333rem auto 0; + overflow-y: scroll; + position: relative; +} + +.lastRank .lastRank_in .box::-webkit-scrollbar { + display: none; +} + +.lastRank .lastRank_in .box .top1 { + width: 6.66667rem; + height: 6.66667rem; + position: relative; + top: 0rem; + left: 50%; + transform: translateX(-50%); +} + +.lastRank .lastRank_in .box .top1 .ts { + width: 100%; + height: 100%; + position: absolute; + z-index: 2; + left: 0; + top: 0; +} + +.lastRank .lastRank_in .box .top1 .tx { + width: 2.93333rem; + height: 2.93333rem; + position: absolute; + top: 2rem; + left: 50%; + transform: translateX(-50%); + border-radius: 50%; +} + +.lastRank .lastRank_in .box .top1 .name { + width: 90%; + height: 0.48rem; + line-height: 0.48rem; + position: absolute; + top: 6.45rem; + text-align: center; + color: #FDF565; + font-size: 0.4rem; + font-weight: 600; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + display: flex; + justify-content: center; + transform: translate(-50%, -50%); + left: 50%; +} + +.lastRank .lastRank_in .box .top1 .name img { + display: block; + width: 1.02667rem; + height: 0.48rem; +} + +.lastRank .lastRank_in .box .top1 .id { + width: 90%; + position: absolute; + top: 7.1rem; + text-align: center; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 400; + transform: translate(-50%, -50%); + left: 50%; +} + +.lastRank .lastRank_in .box ul { + width: 9.06667rem; + margin: 0.66667rem auto 0.13333rem; + padding-top: 0.26667rem; + position: relative; +} + +.lastRank .lastRank_in .box ul li { + width: 9.06667rem; + height: 2rem; + background: url(../images/liBg.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0.13333rem; + box-sizing: border-box; + padding: 0 0.53333rem; +} + +.lastRank .lastRank_in .box ul li .num { + float: left; + width: 0.42667rem; + height: 100%; + line-height: 2rem; + text-align: center; + color: #FDF565; + font-size: 0.42667rem; + font-weight: 600; +} + +.lastRank .lastRank_in .box ul li .tx { + float: left; + width: 1.09333rem; + height: 1.09333rem; + border-radius: 50%; + margin: 0.45333rem 0.33333rem 0; + border: 0.02667rem solid #FDF565; +} + +.lastRank .lastRank_in .box ul li .user { + float: left; + margin-top: 0.65333rem; +} + +.lastRank .lastRank_in .box ul li .user p { + display: flex; + margin-bottom: 0.08rem; +} + +.lastRank .lastRank_in .box ul li .user p b { + display: block; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 500; + max-width: 1.97333rem; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 0.1rem; +} + +.lastRank .lastRank_in .box ul li .user p img { + display: block; + width: 1.02667rem; + height: 0.48rem; +} + +.lastRank .lastRank_in .box ul li .user span { + display: block; + color: #FDF565; + font-size: 0.34667rem; + font-weight: 400; +} + +.lastRank .lastRank_in .box ul li .score { + float: right; + height: 2rem; + line-height: 2rem; + color: #FDF565; + font-size: 0.37333rem; + font-weight: 400; +} + +.arabic .lastRank .lastRank_in .box .top1 { + transform: translateX(-86%); +} + +.arabic .page1 .content ul li .num, +.arabic .page1 .my .num, +.arabic .lastRank .lastRank_in .box ul li .num { + float: right; +} + +.arabic .page1 .content ul li .tx, +.arabic .page1 .my .tx, +.arabic .lastRank .lastRank_in .box ul li .tx { + float: right; +} + +.arabic .page1 .content ul li .user, +.arabic .page1 .my .user, +.arabic .lastRank .lastRank_in .box ul li .user { + float: right; +} + +.arabic .page1 .content ul li .user img, +.arabic .page1 .my .user img, +.arabic .lastRank .lastRank_in .box ul li .user img { + margin-right: 0.1rem; +} + +.arabic .page1 .content ul li .score, +.arabic .page1 .my .score, +.arabic .lastRank .lastRank_in .box ul li .score { + float: left; +} + +.arabic .danmu .my_container .send, +.arabic .danmu .my_container .win { + direction: ltr; + text-align: left; +} diff --git a/view/molistar/modules/superLucky/css/index.scss b/view/molistar/modules/superLucky/css/index.scss new file mode 100644 index 00000000..952c3cbf --- /dev/null +++ b/view/molistar/modules/superLucky/css/index.scss @@ -0,0 +1,794 @@ +@function px2rem($px) { + @return $px / 75+rem; +} + +html, +body { + width: 100%; + background: #180144; + overflow-x: hidden; +} + +.back { + width: 100%; + height: px2rem(44); + line-height: px2rem(44); + position: fixed; + left: 0; + top: px2rem(90); + 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); + z-index: 2; + } + + p { + width: 100%; + height: px2rem(44); + line-height: px2rem(44); + position: absolute; + left: px2rem(18); + top: px2rem(0); + text-align: center; + color: #FFF8C2; + font-size: px2rem(32); + font-weight: 600; + } +} + +.header { + width: px2rem(750); + height: px2rem(980); + background: url(../images/header.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto px2rem(0); + position: relative; + + .time { + width: px2rem(475); + height: px2rem(90); + position: absolute; + left: 50%; + transform: translateX(-50%); + // top: px2rem(886); + top: 10.81333rem; + display: flex; + justify-content: space-between; + + div { + width: px2rem(90); + height: px2rem(90); + background: url(../images/timeIcon.png) no-repeat; + background-size: 100% 100%; + text-align: center; + position: relative; + + b { + color: #FDF565; + font-size: px2rem(44); + font-weight: 600; + text-align: center; + width: 100%; + display: block; + margin: px2rem(28) 0; + } + + span { + display: block; + width: 100%; + text-align: center; + color: #FDF565; + font-size: px2rem(28); + font-weight: 400; + } + } + } +} + +.danmu { + width: px2rem(750); + height: px2rem(636); + overflow: hidden; + margin: -0.3rem auto 0; + position: relative; + box-sizing: border-box; + + #my_container { + width: 100%; + height: 100%; + box-sizing: border-box; + + .my_container_in { + width: px2rem(694); + height: px2rem(166); + background: url(../images/dmBg.png) no-repeat; + background-size: 100% 100%; + position: relative; + margin-top: 0.1rem; + + .tx { + width: px2rem(88); + height: px2rem(88); + position: absolute; + left: px2rem(17); + top: px2rem(45); + border: px2rem(2) solid #FDF565; + border-radius: 50%; + } + + .send { + width: px2rem(320); + color: #FFFFFF; + font-size: px2rem(28); + font-weight: 500; + position: absolute; + top: px2rem(61); + left: px2rem(130); + + b { + color: #FDF565; + } + } + + .win { + width: px2rem(320); + color: #FFFFFF; + font-size: px2rem(28); + font-weight: 500; + position: absolute; + top: px2rem(99); + left: px2rem(130); + + b { + color: #FDF565; + } + } + + .conins { + width: px2rem(184); + height: px2rem(184); + position: absolute; + top: 50%; + transform: translateY(-50%); + left: px2rem(493); + background: url(../images/dmScore.png) no-repeat; + background-size: 100% 100%; + overflow: hidden; + + p { + width: 100%; + text-align: center; + color: #FDF565; + font-size: px2rem(36); + font-weight: 500; + margin-top: px2rem(67); + margin-bottom: px2rem(12); + } + + b { + display: block; + width: 100%; + text-align: center; + color: #fff; + font-size: px2rem(24); + font-weight: 500; + } + } + } + } +} + +.tab { + width: px2rem(678); + height: px2rem(130); + margin: px2rem(-50) auto px2rem(-10); + display: flex; + justify-content: space-between; + + div { + width: px2rem(320); + height: px2rem(130); + line-height: px2rem(130); + background: url(../images/tab.png) no-repeat; + background-size: 100% 100%; + color: #FFFFFF; + font-size: px2rem(34); + font-weight: 600; + text-align: center; + } + + .act { + background: url(../images/actTab.png) no-repeat; + background-size: 100% 100%; + } +} + +.page1 { + // display: none; + + .top { + width: px2rem(750); + height: px2rem(670); + margin: 0 auto 0; + position: relative; + background: url(../images/topBig.png) no-repeat; + background-size: 100% 100%; + + .history { + width: px2rem(152); + height: px2rem(182); + background: url(../images/hg.png) no-repeat; + background-size: 100% 100%; + position: absolute; + right: 0; + top: px2rem(52); + text-align: center; + color: #291E00; + font-size: px2rem(30); + font-weight: 600; + line-height: 3.3rem; + } + + .top1 { + width: px2rem(500); + height: px2rem(500); + position: absolute; + top: px2rem(124); + left: 50%; + transform: translateX(-50%); + + .ts { + width: 100%; + height: 100%; + position: absolute; + z-index: 2; + left: 0; + top: 0; + } + + .tx { + width: px2rem(220); + height: px2rem(220); + position: absolute; + top: 2.0rem; + left: 50%; + transform: translateX(-50%); + border-radius: 50%; + } + + .name { + width: 90%; + height: px2rem(36); + line-height: px2rem(36); + position: absolute; + top: 6.45rem; + text-align: center; + color: #FDF565; + font-size: px2rem(30); + font-weight: 600; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + display: flex; + justify-content: center; + left: 50%; + transform: translateX(-50%); + + img { + display: block; + width: px2rem(77); + height: px2rem(36); + } + } + + .id { + width: 90%; + position: absolute; + top: 7.1rem; + text-align: center; + color: #FDF565; + font-size: px2rem(28); + font-weight: 400; + left: 50%; + transform: translateX(-50%); + } + } + } + + .content { + width: px2rem(750); + height: auto; + background: url(../images/content.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; + + ul { + width: px2rem(680); + margin: 0 auto; + padding-top: px2rem(20); + padding-bottom: px2rem(10); + + li { + width: px2rem(680); + height: px2rem(150); + background: url(../images/liBg.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto px2rem(10); + box-sizing: border-box; + padding: 0 px2rem(40); + + .num { + float: left; + width: px2rem(32); + height: 100%; + line-height: px2rem(150); + text-align: center; + color: #FDF565; + font-size: px2rem(32); + font-weight: 600; + } + + .tx { + float: left; + width: px2rem(82); + height: px2rem(82); + border-radius: 50%; + margin: px2rem(34) px2rem(25) 0; + border: px2rem(2) solid #FDF565; + } + + .user { + float: left; + margin-top: px2rem(49); + + p { + display: flex; + margin-bottom: px2rem(6); + + b { + display: block; + color: #FDF565; + font-size: px2rem(28); + font-weight: 500; + max-width: px2rem(148); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 0.1rem; + } + + img { + display: block; + width: px2rem(77); + height: px2rem(36); + } + } + + span { + display: block; + color: #FDF565; + font-size: px2rem(26); + font-weight: 400; + } + } + + .score { + float: right; + height: px2rem(150); + line-height: px2rem(150); + color: #FDF565; + font-size: px2rem(28); + font-weight: 400; + } + } + } + + .more { + width: px2rem(124); + border-radius: px2rem(44); + min-width: px2rem(124); + height: px2rem(44); + line-height: px2rem(44); + text-align: center; + padding: 0 px2rem(33); + border: px2rem(2) solid #FDF565; + color: #FDF565; + font-size: px2rem(24); + font-weight: 500; + margin: px2rem(16) auto 0; + } + } + + .bottom { + width: px2rem(750); + height: px2rem(60); + margin: 0 auto 0; + background: url(../images/bottom.png) no-repeat; + background-size: 100% 100%; + } + + .my { + width: px2rem(750); + height: px2rem(149); + position: fixed; + bottom: 0; + left: 50%; + transform: translateX(-50%); + background: url(../images/myBg.png) no-repeat; + background-size: 100% 100%; + z-index: 9; + padding: 0 px2rem(55); + box-sizing: border-box; + + .num { + float: left; + width: px2rem(32); + height: 100%; + line-height: px2rem(150); + text-align: center; + color: #FDF565; + font-size: px2rem(32); + font-weight: 600; + } + + .tx { + float: left; + width: px2rem(82); + height: px2rem(82); + border-radius: 50%; + margin: px2rem(34) px2rem(25) 0; + border: px2rem(2) solid #FDF565; + } + + .user { + float: left; + margin-top: px2rem(49); + + p { + display: flex; + margin-bottom: px2rem(6); + + b { + display: block; + color: #FDF565; + font-size: px2rem(28); + font-weight: 500; + max-width: px2rem(148); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 0.1rem; + } + + img { + display: block; + width: px2rem(77); + height: px2rem(36); + } + } + + span { + display: block; + color: #FDF565; + font-size: px2rem(26); + font-weight: 400; + } + } + + .score { + float: right; + height: px2rem(150); + line-height: px2rem(150); + color: #FDF565; + font-size: px2rem(28); + font-weight: 400; + } + } +} + +.page2 { + display: none; + + .top { + width: px2rem(750); + height: px2rem(168); + margin: 0 auto 0; + position: relative; + background: url(../images/top.png) no-repeat; + background-size: 100% 100%; + } + + .content { + width: px2rem(750); + height: auto; + background: url(../images/content.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; + + p { + width: px2rem(632); + margin: 0 auto px2rem(20); + line-height: px2rem(40); + color: #FDF565; + font-size: px2rem(28); + font-weight: 400; + } + + img { + display: block; + width: px2rem(670); + margin: px2rem(15) auto 0; + } + } + + .bottom { + width: px2rem(750); + height: px2rem(60); + margin: 0 auto 0; + background: url(../images/bottom.png) no-repeat; + background-size: 100% 100%; + } + +} + +.activity { + width: 100%; + text-align: center; + color: #FDF565; + font-size: px2rem(24); + font-weight: 400; + text-align: center; + margin: px2rem(20) auto px2rem(158); +} + +.lastRank { + position: fixed; + top: 0; + bottom: 0; + right: 0; + left: 0; + background: rgba(0, 0, 0, .5); + z-index: 99; + display: none; + + .lastRank_in { + width: px2rem(750); + height: px2rem(980); + background: url(../images/lastRankBg.png) no-repeat; + background-size: 100% 100%; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + box-sizing: border-box; + + .close { + width: px2rem(66); + height: px2rem(66); + position: absolute; + right: 0; + top: px2rem(-50); + } + + .title { + width: px2rem(510); + height: px2rem(112); + line-height: px2rem(112); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(13); + text-align: center; + color: #FDF565; + font-size: px2rem(34); + font-weight: 600; + background: url(../images/lastRankTitle.png) no-repeat; + background-size: 100% 100%; + } + + .box { + width: px2rem(680); + height: 10.3rem; + margin: px2rem(130) auto 0; + overflow-y: scroll; + position: relative; + + &::-webkit-scrollbar { + display: none; + } + + .top1 { + width: px2rem(500); + height: px2rem(500); + position: relative; + top: px2rem(0); + left: 50%; + transform: translateX(-50%); + + .ts { + width: 100%; + height: 100%; + position: absolute; + z-index: 2; + left: 0; + top: 0; + } + + .tx { + width: px2rem(220); + height: px2rem(220); + position: absolute; + top: px2rem(150); + left: 50%; + transform: translateX(-50%); + border-radius: 50%; + } + + .name { + width: 90%; + height: px2rem(36); + line-height: px2rem(36); + position: absolute; + top: 6.45rem; + text-align: center; + color: #FDF565; + font-size: px2rem(30); + font-weight: 600; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + display: flex; + justify-content: center; + transform: translate(-50%, -50%); + left: 50%; + + img { + display: block; + width: px2rem(77); + height: px2rem(36); + } + } + + .id { + width: 90%; + position: absolute; + top: 7.1rem; + text-align: center; + color: #FDF565; + font-size: px2rem(28); + font-weight: 400; + transform: translate(-50%, -50%); + left: 50%; + } + } + + ul { + width: px2rem(680); + margin: px2rem(50) auto px2rem(10); + padding-top: px2rem(20); + position: relative; + + li { + width: px2rem(680); + height: px2rem(150); + background: url(../images/liBg.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto px2rem(10); + box-sizing: border-box; + padding: 0 px2rem(40); + + .num { + float: left; + width: px2rem(32); + height: 100%; + line-height: px2rem(150); + text-align: center; + color: #FDF565; + font-size: px2rem(32); + font-weight: 600; + } + + .tx { + float: left; + width: px2rem(82); + height: px2rem(82); + border-radius: 50%; + margin: px2rem(34) px2rem(25) 0; + border: px2rem(2) solid #FDF565; + } + + .user { + float: left; + margin-top: px2rem(49); + + p { + display: flex; + margin-bottom: px2rem(6); + + b { + display: block; + color: #FDF565; + font-size: px2rem(28); + font-weight: 500; + max-width: px2rem(148); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 0.1rem; + } + + img { + display: block; + width: px2rem(77); + height: px2rem(36); + } + } + + span { + display: block; + color: #FDF565; + font-size: px2rem(26); + font-weight: 400; + } + } + + .score { + float: right; + height: px2rem(150); + line-height: px2rem(150); + color: #FDF565; + font-size: px2rem(28); + font-weight: 400; + } + } + } + } + } +} + +.arabic { + .lastRank .lastRank_in .box .top1 { + transform: translateX(-86%); + } + + .page1 .content ul li, + .page1 .my, + .lastRank .lastRank_in .box ul li { + .num { + float: right; + } + + .tx { + float: right; + } + + .user { + float: right; + + img { + margin-right: 0.1rem; + } + } + + .score { + float: left; + } + } + + .danmu .my_container { + .send, + .win{ + direction: ltr; + text-align: left; + } + } +} \ No newline at end of file diff --git a/view/molistar/modules/superLucky/images/actTab.png b/view/molistar/modules/superLucky/images/actTab.png new file mode 100644 index 00000000..2090bd7c Binary files /dev/null and b/view/molistar/modules/superLucky/images/actTab.png differ diff --git a/view/molistar/modules/superLucky/images/bottom.png b/view/molistar/modules/superLucky/images/bottom.png new file mode 100644 index 00000000..9d11b612 Binary files /dev/null and b/view/molistar/modules/superLucky/images/bottom.png differ diff --git a/view/molistar/modules/superLucky/images/close.png b/view/molistar/modules/superLucky/images/close.png new file mode 100644 index 00000000..b7022bd5 Binary files /dev/null and b/view/molistar/modules/superLucky/images/close.png differ diff --git a/view/molistar/modules/superLucky/images/content.png b/view/molistar/modules/superLucky/images/content.png new file mode 100644 index 00000000..f559124f Binary files /dev/null and b/view/molistar/modules/superLucky/images/content.png differ diff --git a/view/molistar/modules/superLucky/images/dmBg.png b/view/molistar/modules/superLucky/images/dmBg.png new file mode 100644 index 00000000..45330f9c Binary files /dev/null and b/view/molistar/modules/superLucky/images/dmBg.png differ diff --git a/view/molistar/modules/superLucky/images/dmScore.png b/view/molistar/modules/superLucky/images/dmScore.png new file mode 100644 index 00000000..d95a5071 Binary files /dev/null and b/view/molistar/modules/superLucky/images/dmScore.png differ diff --git a/view/molistar/modules/superLucky/images/header.png b/view/molistar/modules/superLucky/images/header.png new file mode 100644 index 00000000..87505142 Binary files /dev/null and b/view/molistar/modules/superLucky/images/header.png differ diff --git a/view/molistar/modules/superLucky/images/hg.png b/view/molistar/modules/superLucky/images/hg.png new file mode 100644 index 00000000..d9e1e732 Binary files /dev/null and b/view/molistar/modules/superLucky/images/hg.png differ diff --git a/view/molistar/modules/superLucky/images/lastRankBg.png b/view/molistar/modules/superLucky/images/lastRankBg.png new file mode 100644 index 00000000..4349e6f5 Binary files /dev/null and b/view/molistar/modules/superLucky/images/lastRankBg.png differ diff --git a/view/molistar/modules/superLucky/images/lastRankTitle.png b/view/molistar/modules/superLucky/images/lastRankTitle.png new file mode 100644 index 00000000..b2ee950c Binary files /dev/null and b/view/molistar/modules/superLucky/images/lastRankTitle.png differ diff --git a/view/molistar/modules/superLucky/images/liBg.png b/view/molistar/modules/superLucky/images/liBg.png new file mode 100644 index 00000000..7a5c6d22 Binary files /dev/null and b/view/molistar/modules/superLucky/images/liBg.png differ diff --git a/view/molistar/modules/superLucky/images/logo.png b/view/molistar/modules/superLucky/images/logo.png new file mode 100644 index 00000000..ada4e312 Binary files /dev/null and b/view/molistar/modules/superLucky/images/logo.png differ diff --git a/view/molistar/modules/superLucky/images/myBg.png b/view/molistar/modules/superLucky/images/myBg.png new file mode 100644 index 00000000..530b41ff Binary files /dev/null and b/view/molistar/modules/superLucky/images/myBg.png differ diff --git a/view/molistar/modules/superLucky/images/rewards-ar.png b/view/molistar/modules/superLucky/images/rewards-ar.png new file mode 100644 index 00000000..c4dcad99 Binary files /dev/null and b/view/molistar/modules/superLucky/images/rewards-ar.png differ diff --git a/view/molistar/modules/superLucky/images/rewards-tr.png b/view/molistar/modules/superLucky/images/rewards-tr.png new file mode 100644 index 00000000..d87277a9 Binary files /dev/null and b/view/molistar/modules/superLucky/images/rewards-tr.png differ diff --git a/view/molistar/modules/superLucky/images/rewards.png b/view/molistar/modules/superLucky/images/rewards.png new file mode 100644 index 00000000..eaab2e05 Binary files /dev/null and b/view/molistar/modules/superLucky/images/rewards.png differ diff --git a/view/molistar/modules/superLucky/images/tab.png b/view/molistar/modules/superLucky/images/tab.png new file mode 100644 index 00000000..fb93fb67 Binary files /dev/null and b/view/molistar/modules/superLucky/images/tab.png differ diff --git a/view/molistar/modules/superLucky/images/timeIcon.png b/view/molistar/modules/superLucky/images/timeIcon.png new file mode 100644 index 00000000..82e4b9ad Binary files /dev/null and b/view/molistar/modules/superLucky/images/timeIcon.png differ diff --git a/view/molistar/modules/superLucky/images/top.png b/view/molistar/modules/superLucky/images/top.png new file mode 100644 index 00000000..e9fb176b Binary files /dev/null and b/view/molistar/modules/superLucky/images/top.png differ diff --git a/view/molistar/modules/superLucky/images/top1.png b/view/molistar/modules/superLucky/images/top1.png new file mode 100644 index 00000000..e3a7f5ba Binary files /dev/null and b/view/molistar/modules/superLucky/images/top1.png differ diff --git a/view/molistar/modules/superLucky/images/topBig.png b/view/molistar/modules/superLucky/images/topBig.png new file mode 100644 index 00000000..b1d1d31e Binary files /dev/null and b/view/molistar/modules/superLucky/images/topBig.png differ diff --git a/view/molistar/modules/superLucky/images/travel/back.png b/view/molistar/modules/superLucky/images/travel/back.png new file mode 100644 index 00000000..2b3812da Binary files /dev/null and b/view/molistar/modules/superLucky/images/travel/back.png differ diff --git a/view/molistar/modules/superLucky/images/travel/backB.png b/view/molistar/modules/superLucky/images/travel/backB.png new file mode 100644 index 00000000..92e190c7 Binary files /dev/null and b/view/molistar/modules/superLucky/images/travel/backB.png differ diff --git a/view/molistar/modules/superLucky/index.html b/view/molistar/modules/superLucky/index.html new file mode 100644 index 00000000..10774cbb --- /dev/null +++ b/view/molistar/modules/superLucky/index.html @@ -0,0 +1,185 @@ + + + + + + + + + + + + + +
+ +
+ +
+
+
+ 00 + +
+
+ 00 + +
+
+ 00 + +
+
+ 00 + +
+
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+
+
+ + +
+
名字
+ +
+
ID:0
+
+
+
+ +
+
+
+
+
2
+ +
+

+ name + +

+ ID:0 +
+
Behind:0
+
+
+ +
+
+
+
+ +
+
+
+ +
+ +
+
+ +
+
+
+ + +
+
名字
+ +
+
ID:0
+
+
    +
  • +
    2
    + +
    +

    + name + +

    + ID:0 +
    +
    Behind:0
    +
    • +
  • +
    2
    + +
    +

    + name + +

    + ID:0 +
    +
    Behind:0
    +
    • +
+
+
+
+ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/view/molistar/modules/superLucky/js/danmaku.js b/view/molistar/modules/superLucky/js/danmaku.js new file mode 100644 index 00000000..1d081103 --- /dev/null +++ b/view/molistar/modules/superLucky/js/danmaku.js @@ -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; + +}))); \ No newline at end of file diff --git a/view/molistar/modules/superLucky/js/index.js b/view/molistar/modules/superLucky/js/index.js new file mode 100644 index 00000000..68213c93 --- /dev/null +++ b/view/molistar/modules/superLucky/js/index.js @@ -0,0 +1,402 @@ +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: 50, + width: "100%", + height: "100%", + }) +} +const setDanmuData = () => { + // danmaku.resize(); + // damuPool = [ + // { confessionsMsg: '我把思念写着天空', }, + // { confessionsMsg: '我想永远陪着你', }, + // { confessionsMsg: '我爱你我爱你甜蜜蜜', }, + // { confessionsMsg: 'asdawdasdasdas', }, + // { confessionsMsg: 'wuwuwuwu', }, + // ] + if (!timer2) { + if (damuPool.length < 5) { + timer2 = setInterval(() => { + if (!danmu.length) { + danmu = [...damuPool] + } + let danmushoot = danmu.shift(); + if (danmushoot) { + renderDM(danmushoot); + } + }, 2000); + } else { + timer2 = setInterval(() => { + if (!danmu.length) { + danmu = [...damuPool] + } + let danmushoot = danmu.shift(); + if (danmushoot) { + renderDM(danmushoot); + } + }, 1000); + } + } +} +const renderDM = (item) => { + danmaku.resize(); + danmaku.speed = 70; + danmaku.emit({ + // text: item.text, + render: function () { + var $div = document.createElement('div'); + $div.innerHTML = ` +
+ +
${localLang.demoModule.text15} ${item.giftName}
+
${localLang.demoModule.text16} ${item.multiple} times
+
+

${item.winGoldNum}

+ ${localLang.demoModule.text17} +
+
` + return $div; + }, + }) +} +var page = 0; +var maxPage = 0; +var arr = []; +var lists = []; +// 初始化函數 +$(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(); + listRank(); + }, 100) +}) +function translateFun() { + var langReplace = window.lang.replace; + var localLang = window.lang; + $('.text1').html(langReplace(localLang.demoModule.text1)); + $('.text2').html(langReplace(localLang.demoModule.text2)); + $('.text3').html(langReplace(localLang.demoModule.text3)); + $('.text4').html(langReplace(localLang.demoModule.text4)); + $('.text5').html(langReplace(localLang.demoModule.text5)); + $('.text6').html(langReplace(localLang.demoModule.text6)); + $('.text7').html(langReplace(localLang.demoModule.text7)); + $('.text8').html(langReplace(localLang.demoModule.text8)); + $('.text9').html(langReplace(localLang.demoModule.text9)); + $('.text10').html(langReplace(localLang.demoModule.text10)); + $('.text11').html(langReplace(localLang.demoModule.text11)); + $('.text12').html(langReplace(localLang.demoModule.text12)); + $('.text13').html(langReplace(localLang.demoModule.text13)); + $('.text14').html(langReplace(localLang.demoModule.text14)); + $('.text15').html(langReplace(localLang.demoModule.text15)); + $('.text16').html(langReplace(localLang.demoModule.text16)); + $('.text17').html(langReplace(localLang.demoModule.text17)); + $('.text18').html(langReplace(localLang.demoModule.text18)); + $('.text19').html(langReplace(localLang.demoModule.text19)); +} +// 榜单接口 +function listRank() { + showLoading() + networkRequest({ + type: 'get', + url: urlPrefix + '/lucky24WeekRank/listRank', + success(res) { + if (res.code === 200) { + // 处理弹幕飘屏 + damuPool = res.data.floatingList; + initDanmu(); + setDanmuData(); + // 处理倒计时 + countup(res.data.remainMillis); + // 处理榜单 + var list = res.data.rankList; + var lists = res.data.rankList; + var listTo3 = res.data.rankList.slice(0, 1); + var notListTo3 = res.data.rankList.slice(1); + // 前三 + if (listTo3.length < 1) { + let arr = new Array(1 - listTo3.length).fill({ + avatar: './images/logo.png', + nick: langReplace(localLang.demoModule.text13), + erbanNo: langReplace(localLang.demoModule.text13), + userLevelVo: { experUrl: null }, + }) + listTo3.push(...arr) + } + listTo3.forEach(res => { + $('.page1 .top .top1 .tx').attr('src', res.avatar); + $('.page1 .top .top1 .name div').text(res.nick); + $('.page1 .top .top1 .name .icon').attr('src', res.userLevelVo.experUrl); + $('.page1 .top .top1 .id').text('ID:' + res.erbanNo); + if (res.userLevelVo.experUrl == null) { + $('.page1 .top .top1 .name .icon').hide(); + $('.page1 .top .top1 .id').hide(); + } + }) + if (notListTo3.length == 0) { $('.page1 .content .more').hide(); } + arr = paginateArray(notListTo3, 10); + if (arr.length == 1) { $('.page1 .content .more').hide(); } + maxPage = paginateArray(notListTo3, 10).length - 1; + // 非前三 + var str = ''; + $('.page1 .content ul li').remove(); + var thisArr = arr[page] ? arr[page] : []; + thisArr.forEach((res, i) => { + str += ` +
  • +
    ${res.rank}
    + +
    +

    + ${res.nick} + +

    + ID:${res.erbanNo} +
    +
    ${langReplace(localLang.demoModule.text14)}${scoreFun(list, i)}
    +
    • + ` + }) + $('.page1 .content ul').append(str); + // 处理自己 + var my = res.data.meRank; + $('.page1 .my .num').text(my.rank == 0 ? '-' : my.rank); + $('.page1 .my .tx').attr('src', my.avatar); + $('.page1 .my .user p img').attr('src', my.userLevelVo.experUrl); + $('.page1 .my .user p b').text(my.nick); + $('.page1 .my .user span').text('ID:' + my.erbanNo); + $('.page1 .my .score').text(my.rank == 0 ? '-' : `${langReplace(localLang.demoModule.text14)} ${unitProcessingAr(lists[my.rank - 1].score - my.score, 1)}`); + } else { + toastMsg(res.message) + } + hideLoading(layerIndex) + }, + error(err) { + hideLoading(layerIndex) + toastMsg(langReplace(localLang.demoModule.layerIndex3)) + } + }) +} +// 上周接口 +function listLastWeekRank() { + showLoading() + networkRequest({ + type: 'get', + url: urlPrefix + '/lucky24WeekRank/listLastWeekRank', + success(res) { + if (res.code === 200) { + var listTo3 = res.data.rankList.slice(0, 1); + var notListTo3 = res.data.rankList.slice(1); + var list = res.data.rankList; + // 前三 + if (listTo3.length < 1) { + let arr = new Array(1 - listTo3.length).fill({ + avatar: './images/logo.png', + nick: langReplace(localLang.demoModule.text13), + erbanNo: langReplace(localLang.demoModule.text13), + userLevelVo: { experUrl: null }, + }) + listTo3.push(...arr) + } + listTo3.forEach(res => { + $('.lastRank .lastRank_in .box .top1 .tx').attr('src', res.avatar); + $('.lastRank .lastRank_in .box .top1 .name div').text(res.nick); + $('.lastRank .lastRank_in .box .top1 .name .icon').attr('src', res.userLevelVo.experUrl); + $('.lastRank .lastRank_in .box .top1 .id').text('ID:' + res.erbanNo); + if (res.userLevelVo.experUrl == null) { + $('.lastRank .lastRank_in .box .top1 .name .icon').hide(); + $('.lastRank .lastRank_in .box .top1 .id').hide(); + } + }) + // 非前三 + var str = ''; + $('.lastRank .lastRank_in .box ul li').remove(); + notListTo3.forEach((res, i) => { + str += ` +
  • +
    ${res.rank}
    + +
    +

    + ${res.nick} + +

    + ID:${res.erbanNo} +
    +
    ${langReplace(localLang.demoModule.text14)}${scoreFun(list, i)}
    +
    • + ` + }) + $('.lastRank .lastRank_in .box ul').append(str); + } else { + toastMsg(res.message) + } + hideLoading(layerIndex) + }, + error(err) { + hideLoading(layerIndex) + toastMsg(langReplace(localLang.demoModule.layerIndex3)) + } + }) +} +// 点击加载更多 +$('.page1 .content .more').click(function () { + console.log(page); + page = page + 1; + console.log(page, maxPage); + console.log(arr); + var str = ''; + arr[page].forEach((res, i) => { + str += ` +
  • +
    ${res.rank}
    + +
    +

    + ${res.nick} + +

    + ID:${res.erbanNo} +
    +
    ${langReplace(localLang.demoModule.text14)}${scoreFun(arr[page], i)}
    +
    • + `}) + $('.page1 .content ul').append(str); + if (page >= maxPage) { + $('.page1 .content .more').hide(); + return + } +}) +function paginateArray(arr, itemsPerPage) { + const result = []; + for (let i = 0; i < arr.length; i += itemsPerPage) { + const page = arr.slice(i, i + itemsPerPage); + result.push(page); + } + return result; +} +// 处理 +function scoreFun(list, i) { + var num; + if (i == 0) { + num = unitProcessingAr(list[0].score - list[1].score, 1); + } else { + num = unitProcessingAr(list[i - 1].score - list[i].score, 1); + } + return num; +} +// tab切换 +$('.tab div').click(function () { + var i = $(this).index() + 1; + $(this).addClass('act').siblings().removeClass(); + $('.page1,.page2').hide(); + $(`.page${i}`).show(); +}) +// 打开弹窗 +$('.page1 .top .history').click(function () { + listLastWeekRank(); + $('.lastRank').show(); + bodyScroolFun(true); +}) +// 关闭弹窗 +$('.lastRank .lastRank_in .close').click(function () { + $('.lastRank').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中 + $('.Days b').text(d); + $('.Hours b').text(h); + $('.Mins b').text(m); + $('.Secs b').text(s); + } else { + // location.reload(); + } + 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; +} \ No newline at end of file diff --git a/view/molistar/modules/superLucky/local/ar.js b/view/molistar/modules/superLucky/local/ar.js new file mode 100644 index 00000000..94d7402a --- /dev/null +++ b/view/molistar/modules/superLucky/local/ar.js @@ -0,0 +1,29 @@ +// 阿拉伯 +langAr = { + // 模块 + demoModule: { + layerIndex1: 'جار التحميل...', + layerIndex2: 'تمت العملية', + layerIndex3: 'خطأ في الشبكة، يرجى الخروج وإعادة الدخول', + text1: `الحظ السوبر`, + text2: `أيام`, + text3: `ساعات`, + text4: `دقائق`, + text5: `ثواني`, + text6: `التصنيف`, + text7: `المكافآت`, + text8: `التاريخ`, + text9: `المزيد`, + text10: `

    التصنيف: التصنيف بناءً على عدد العملات التي استثمرها المستخدمون الذين يشاركون في هدية الحظ كل أسبوع.

    +

    سيحصل أفضل ثلاثة مستخدمين في التصنيف على ميدالية تصنيف، وأفضل عشرة مستخدمين سيحصلون على سيارة + كمكافأة. بعد الحصول على نفس الميدالية ثلاث مرات على التوالي، ستصبح سارية المفعول بشكل دائم

    + `, + text11: `النشاط ليس له علاقة بـ Apple`, + text12: `ترتيب الأسبوع الماضي`, + text13: `شاغر`, + text14: `متأخر`, + text15: `إرسال`, + text16: `فوز`, + text17: `عملات` + } +} \ No newline at end of file diff --git a/view/molistar/modules/superLucky/local/en.js b/view/molistar/modules/superLucky/local/en.js new file mode 100644 index 00000000..54731ab6 --- /dev/null +++ b/view/molistar/modules/superLucky/local/en.js @@ -0,0 +1,32 @@ +// 英文 +langEn = { + // 模块 + demoModule: { + layerIndex1: 'Loading...', + layerIndex2: 'Operation completed', + layerIndex3: 'Network error, please exit and re-enter', + text1: `Super Lucky`, + text2: `Days`, + text3: `Hours`, + text4: `Mins`, + text5: `Secs`, + text6: `Ranking`, + text7: `Rewards`, + text8: `History`, + text9: `more`, + text10: `

    Ranking: Ranking based on the number of coins invested by users who participate in the lucky gift each + week.

    +

    The top three users in the ranking will receive a ranking medal, and the top + ten users will receive a car + as + a reward. After receiving the same medal three times in a row, it will take effect permanently

    + `, + text11: `Activity has nothing to do with Apple`, + text12: `Last Week's Ranking`, + text13: `Vacant`, + text14: `Behind`, + text15: `Send`, + text16: `Win`, + text17: `Coins`, + } +} \ No newline at end of file diff --git a/view/molistar/modules/superLucky/local/tr.js b/view/molistar/modules/superLucky/local/tr.js new file mode 100644 index 00000000..fa54df62 --- /dev/null +++ b/view/molistar/modules/superLucky/local/tr.js @@ -0,0 +1,29 @@ +// 土耳其 +langTr = { + // 模塊 + demoModule: { + layerIndex1: 'Yükleniyor...', + layerIndex2: 'İşlem tamamlandı', + layerIndex3: 'Ağ hatası, lütfen çıkın ve tekrar girin', + text1: `Süper Şanslı`, + text2: `Günler`, + text3: `Saatler`, + text4: `Dakikalar`, + text5: `Saniyeler`, + text6: `Sıralama`, + text7: `Ödüller`, + text8: `Geçmiş`, + text9: `Daha fazla`, + text10: `

    Sıralama: Her hafta şanslı hediye etkinliğine katılan kullanıcıların yatırdığı coin miktarına göre sıralanır.

    +

    Sıralamanın ilk üç kullanıcısı sıralama madalyası alacak ve ilk on kullanıcı ödül olarak bir araba alacak. + Aynı madalyayı üç kez arka arkaya kazanan kullanıcı, madalyayı kalıcı olarak kazanacak

    + `, + text11: `Etkinlik Apple ile ilgili değildir`, + text12: `Geçen Haftanın Sıralaması`, + text13: `Boş`, + text14: `Geride`, + text15: `Gönder`, + text16: `Kazan`, + text17: `Jetonlar` + } +} \ No newline at end of file diff --git a/view/molistar/modules/superLucky/local/zh.js b/view/molistar/modules/superLucky/local/zh.js new file mode 100644 index 00000000..7f94b554 --- /dev/null +++ b/view/molistar/modules/superLucky/local/zh.js @@ -0,0 +1,30 @@ +// 中文 +langZh = { + // 模塊 + demoModule: { + layerIndex1: '載入中...', + layerIndex2: '操作完成', + layerIndex3: '網絡錯誤，請退出並重新進入', + text1: `超級幸運`, + text2: `天數`, + text3: `小時`, + text4: `分鐘`, + text5: `秒數`, + text6: `排名`, + text7: `獎勳`, + text8: `歷史`, + text9: `更多`, + text10: `

    排名：根據參與每週幸運禮品活動的用戶投資的硬幣數量來排名。

    +

    排名前三的用戶將獲得排名獎章，排名前十的用戶將獲得一輛汽車作為獎勳。 + 連續三次獲得相同的獎章後，將永久生效

    + `, + text11: `活動與蘋果無關`, + text12: `上週排名`, + text13: `空缺`, + text14: `落後`, + text15: `發送`, + text16: `獲勝`, + text17: `硬幣` + } + +} \ No newline at end of file