微件:GGLScratchGame

   <button class="ggl-start-btn">开始抽奖</button>

刮开奖券 · 每张需点完 30 格才能扫描

     剩余彩票：— 张　
     可提现 DATA：—

     <img class="ggl-bg"
       src="">

     <button class="ggl-redeem-hit" id="ggl-redeem-hit"></button>

       <button id="ggl-scan">扫描结果</button>

<style> .ggl-root{width:375px;margin:auto;font-family:sans-serif;position:relative} .ggl-mask{position:absolute;inset:0;background:#000d;z-index:99;display:flex;align-items:center;justify-content:center} .ggl-start-btn{padding:12px 20px;font-size:16px}

.ggl-top{text-align:center;font-size:14px;margin-bottom:6px}

.ggl-frame{padding:10px;border:3px solid #ff00aa;box-shadow:0 0 12px #ff00aa88}

.ggl-ticket{position:relative;aspect-ratio:1075/1911} .ggl-bg{width:100%;display:block}

.ggl-scratch-area{position:absolute;left:10%;top:35%;width:80%;height:53%} .ggl-grid{display:grid;width:100%;height:100%;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(6,1fr);gap:6px}

.ggl-cell{position:relative;overflow:hidden} .ggl-cell img,.ggl-cover{position:absolute;inset:0;width:100%;height:100%} .ggl-cover{

 background:url("") center/cover;
 cursor:pointer

} .ggl-reward{

 position:absolute;inset:0;
 display:flex;align-items:center;justify-content:center;
 font-size:12px;font-weight:bold;pointer-events:none

}

.ggl-mascot{position:absolute;left:6%;top:107%;font-size:20px;color:#000} .ggl-bubble{position:absolute;left:6%;top:103%;width:60%;background:#fff;padding:6px;font-size:13px}

.ggl-controls{position:absolute;right:6%;top:103%}

1. ggl-scan{opacity:.3}
2. ggl-scan.active{opacity:1}

.ggl-redeem-hit{

 position:absolute;bottom:1%;left:2%;
 width:48%;height:10%;
 background:transparent;border:none;cursor:pointer

} </style>

<script> (function(){

const grid = document.querySelector('.ggl-grid'); const bubble = document.querySelector('.ggl-bubble'); const mascot = document.querySelector('.ggl-mascot'); const scan = document.getElementById('ggl-scan'); const leftEl = document.getElementById('ggl-left'); const dataEl = document.getElementById('ggl-data'); const mask = document.getElementById('ggl-mask'); const redeem = document.getElementById('ggl-redeem-hit');

const OPEN = 'https://wm.gaoice.run/images/thumb/4/4a/%E5%88%AE%E5%BC%80%E5%90%8E.jpg/180px-%E5%88%AE%E5%BC%80%E5%90%8E.jpg';

/* ===== 11 张剧情票 ===== */ const TICKETS = [

{left:3,data:0,mascot:,bubble:'你好。',rewards:{12:'DATA'}},
{left:2,data:1,mascot:'(＾▽＾)ﾉ',bubble:'第一张，只中了 DATA。',rewards:{1:'连',3:'着',16:'四',19:'个'}},
{left:3,data:2,mascot:'(ﾉ◕ヮ◕)ﾉ',bubble:'连着刮出了四个字！',rewards:{8:'DATA',14:'🎟'}},
{left:3,data:4,mascot:'(＾▽＾)',bubble:'中了刮刮乐！DATA 2MB',rewards:{}},
{left:3,data:5,mascot:'(・_・)',bubble:'什么都没有。',rewards:{22:'DATA'}},
{left:2,data:5,mascot:'(；ﾟДﾟ)',bubble:'好像哪里不对。',rewards:{}},
{left:1,data:5,mascot:,bubble:'什么都没有。',rewards:{6:'🎟'}},
{left:2,data:7,mascot:'...',bubble:'▒▓░▒▓▒▓',rewards:{3:'DATA',18:'DATA'}},
{left:2,data:9999,mascot:,bubble:'哦 嗯 嘿 哈',rewards:Object.fromEntries([...Array(30).keys()].map(i=>[i,'DATA']))},
{left:1,data:'—',mascot:,bubble:'你是谁？',lock:true,rewards:{}},
{left:0,data:'—',mascot:'平安喜乐',bubble:'你知道的太多了。',final:true,rewards:{}}

];

let idx = 0; let revealed = 0;

function build(){

 const t = TICKETS[idx];
 grid.innerHTML=;
 revealed=0;

 leftEl.textContent=t.left;
 dataEl.textContent=t.data;
 mascot.textContent=t.mascot||;
 bubble.textContent=t.bubble||;
 scan.classList.remove('active');

 for(let i=0;i<30;i++){
   const c=document.createElement('div');
   c.className='ggl-cell';
   c.innerHTML=`
     <img src="${OPEN}">

${t.rewards?.[i]||}

   `;
   const cover=c.querySelector('.ggl-cover');
   if(!t.lock){
     cover.onclick=()=>{
       if(c.dataset.done)return;
       c.dataset.done=1;
       cover.style.display='none';
       if(++revealed===30)scan.classList.add('active');
     };
   }
   grid.appendChild(c);
 }

 if(t.lock) scan.classList.add('active');

}

scan.onclick=()=>{

 if(!scan.classList.contains('active'))return;
 if(TICKETS[idx].final){
   document.body.style.filter='invert(1)';
   setTimeout(()=>location.href='/index.php?title=六世恶言之一',1200);
   return;
 }
 idx++;
 build();

};

redeem.onclick=()=>{

 bubble.textContent='提示：兑奖区刮开后将视为无效哦。';

};

mask.onclick=()=>{

 mask.remove();
 build();

};

/* 测试：Shift + D */ document.addEventListener('keydown',e=>{

 if(e.shiftKey&&e.key.toLowerCase()==='d'){
   grid.querySelectorAll('.ggl-cover').forEach(c=>c.style.display='none');
   revealed=30;
   scan.classList.add('active');
 }

});

})(); </script>