Widget:CollectionCrate

实现详见收集宝箱模拟器

<div style="display: flex;justify-content: space-evenly;margin-bottom: 10px;margin-top:10px"><span>选择宝箱类型：<select id="crateType"><option value="wood">木头</option><option value="bronze">青铜</option><option value="silver">白银</option><option value="gold">黄金</option><option value="diamond" selected>钻石</option></select></span><span>选择精选猴子：<select id="featuredTower"><option value="no" selected>无</option></select></span></div>
<div id="output" style="background:#000000; width:100%; height:300px;display:flex;align-items:center;justify-content:center"></div>
<div style="display: flex;justify-content: space-evenly;margin-top: 10px;">
<button id="claim" style="background: #00EE00;border-color: #FFF;width: 5em;height: 2.5em;border-radius: 10px;" onclick="generateInstas()">抽卡</button>
<button id="clear" style="background: #00EE00;border-color: #FFF;width: 5em;height: 2.5em;border-radius: 10px;" onclick="clearInstas()">清除</button>
</div>
<script>"use strict";
let generateInstas = null;
let clearInstas = null;

(() => {
const allTowers = [
    'DartMonkey', 'BoomerangMonkey', 'BombShooter', 'TackShooter', 'IceMonkey', 'GlueGunner', 'Desperado',
    'SniperMonkey', 'MonkeySub', 'MonkeyBuccaneer', 'MonkeyAce', 'HeliPilot', 'MortarMonkey', 'DartlingGunner',
    'WizardMonkey', 'SuperMonkey', 'NinjaMonkey', 'Alchemist', 'Druid', 'Mermonkey',
    'BananaFarm', 'SpikeFactory', 'MonkeyVillage', 'EngineerMonkey', 'BeastHandler'
];

const allTowersZH = [
    '飞镖猴', '回旋镖猴', '大炮', '图钉塔', '冰猴', '胶水炮手', '亡命猴',
    '狙击手猴', '猴子潜艇', '海盗猴', '王牌飞行员', '直升机飞行员', '迫击炮猴', '机枪猴',
    '法师猴', '超猴侠', '忍者猴', '炼金术士', '德鲁伊', '人鱼猴',
    '香蕉农场', '刺钉工厂', '猴子村', '工程师猴', '野兽之主'
];

const quantityChance = {
    "wood": { 2: 1.0 },
    "bronze": { 2: 1.0 },
    "silver": { 2: 1.0 },
    "gold": { 2: 0.9, 3: 0.1 },
    "diamond": { 2: 0.6, 3: 0.4 }
};

const tierChance = {
    "wood": { 1: 0.8, 2: 0.2 },
    "bronze": { 1: 0.2, 2: 0.7, 3: 0.1 },
    "silver": { 2: 0.4, 3: 0.55, 4: 0.05 },
    "gold": { 3: 0.6, 4: 0.4 },
    "diamond": { 3: 0.35, 4: 0.6, 5: 0.05 }
};

const allCrossPath = (() => {
    let result = []
    for (let i = 0; i <= 5; i++) {
        for (let j = 0; j <= 5; j++) {
            for (let k = 0; k <= 5; k++) {
                let tmp = [i, j, k].sort()
                if (tmp[0] == 0 && tmp[1] <= 2) {
                    result.push([i, j, k])
                }
            }
        }
    }
    return result
})();

const getCrateType = () => {
    let element = document.getElementById('crateType')
    return element.options[element.selectedIndex].value
}

const getQuantity = () => {
    let random = Math.random();
    const chances = quantityChance[getCrateType()];
    for (let q in chances) {
        if (random <= chances[q]) {
            return Number(q);
        }
        random -= chances[q];
    }
    return 2;
};

const getMaxTier = () => {
    let random = Math.random();
    const chances = tierChance[getCrateType()];
    for (let t in chances) {
        if (random <= chances[t]) {
            return Number(t);
        }
        random -= chances[t];
    }
    return 1;
};

const getCrossPath = maxTier => {
    let crossPaths = allCrossPath.filter(e => Math.max(...e) === maxTier)
    return crossPaths[Math.floor(Math.random() * crossPaths.length)]
}

const getTower = () => {
    let element = document.getElementById('featuredTower')
    if (element.selectedIndex !== 0) {
        return [element.options[element.selectedIndex].value, element.options[element.selectedIndex].innerText]
    }
    let index = Math.floor(Math.random() * allTowers.length);
    return [allTowers[index], allTowersZH[index]]
}

const getInstaIcon = (tower, xPath, maxTier) => {
    let iconXPath = [0, 0, 0]
    iconXPath[xPath.indexOf(maxTier)] = maxTier
    return iconXPath.join('') + "-" + tower + "Insta.png";
}

const addInstaIcon = () => {
    let tier = getMaxTier();
    let tower = getTower();
    let crossPathArray = getCrossPath(tier);
    let icon = getInstaIcon(tower[0], crossPathArray, tier);
    let oneInsta = document.createElement('div');
    oneInsta.style.textAlign = 'center';
    let img = document.createElement('img');
    img.src = "https://wiki.biligame.com/btd6/特殊:重定向/file/" + icon;
    img.style.width = '200px';
    oneInsta.appendChild(img);
    oneInsta.innerHTML += '<div style="color:#FFFFFF"><b>' + tower[1] + '</b></div>'
    oneInsta.innerHTML += '<div style="color:#FFFFFF"><b>' + crossPathArray.join('-') + '</b></div>';
    document.getElementById('output').appendChild(oneInsta);
}

clearInstas = () => {
    document.getElementById('output').innerText = ""
}

generateInstas = () => {
    clearInstas()
    const num = getQuantity()
    for (let i = 0; i < num; i++) {
        addInstaIcon()
    }
}

(() => {
    let e = document.getElementById('featuredTower')
    for (let i = 0; i < allTowers.length; i++) {
        let opt = document.createElement('option')
        opt.value = allTowers[i]
        opt.innerText = allTowersZH[i]
        e.appendChild(opt)
    }
})();
})();</script>