You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
253 lines
8.3 KiB
253 lines
8.3 KiB
// ==UserScript==
|
|
// @name Web3网络快速切换器
|
|
// @namespace http://tampermonkey.net/
|
|
// @version 1.1
|
|
// @description 在页面上添加下拉框快速切换Web3钱包网络
|
|
// @author You
|
|
// @match *://*/*
|
|
// @grant GM_notification
|
|
// ==/UserScript==
|
|
|
|
(function() {
|
|
'use strict';
|
|
|
|
// 配置：预设的网络列表（目前只有Monad测试网，您可以自行添加）
|
|
const networks = [
|
|
{ name: "Monad Testnet", chainId: "0x4a", rpcUrls: ["https://testnet.monad.xyz"] }
|
|
// 您可以在这里添加其他网络，格式如下：
|
|
// { name: "网络名称", chainId: "网络ID", rpcUrls: ["RPC URL"] },
|
|
];
|
|
|
|
// 创建样式
|
|
const style = document.createElement('style');
|
|
style.textContent = `
|
|
.web3-network-switcher {
|
|
position: fixed;
|
|
top: 20px;
|
|
right: 20px;
|
|
z-index: 9999;
|
|
padding: 10px;
|
|
background-color: rgba(255, 255, 255, 0.95);
|
|
border: 1px solid #ccc;
|
|
border-radius: 8px;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
font-family: Arial, sans-serif;
|
|
min-width: 200px;
|
|
}
|
|
.web3-network-switcher label {
|
|
display: block;
|
|
margin-bottom: 8px;
|
|
font-weight: bold;
|
|
color: #333;
|
|
}
|
|
.web3-network-switcher select {
|
|
width: 100%;
|
|
padding: 8px;
|
|
border-radius: 4px;
|
|
border: 1px solid #ddd;
|
|
background-color: white;
|
|
font-size: 14px;
|
|
}
|
|
.web3-network-switcher select:focus {
|
|
outline: none;
|
|
border-color: #4a90e2;
|
|
box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.2);
|
|
}
|
|
.web3-network-switcher .status {
|
|
margin-top: 8px;
|
|
font-size: 12px;
|
|
color: #666;
|
|
}
|
|
.web3-network-switcher .toggle {
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 5px;
|
|
cursor: pointer;
|
|
font-weight: bold;
|
|
color: #999;
|
|
}
|
|
.web3-network-switcher.collapsed {
|
|
width: auto;
|
|
min-width: auto;
|
|
padding: 5px;
|
|
}
|
|
.web3-network-switcher.collapsed select,
|
|
.web3-network-switcher.collapsed label,
|
|
.web3-network-switcher.collapsed .status {
|
|
display: none;
|
|
}
|
|
`;
|
|
document.head.appendChild(style);
|
|
|
|
// 等待页面加载完成后执行
|
|
setTimeout(init, 2000);
|
|
|
|
function init() {
|
|
// 如果页面已存在切换器，先移除
|
|
const existing = document.getElementById('web3-network-switcher');
|
|
if (existing) existing.remove();
|
|
|
|
// 重新初始化
|
|
if (typeof window.ethereum !== 'undefined') {
|
|
// 这里需要执行createNetworkSelector函数
|
|
// 可能需要将函数改为全局可访问
|
|
console.log('Web3钱包已检测到');
|
|
} else {
|
|
console.log('未检测到Web3钱包');
|
|
}
|
|
|
|
// 创建网络选择器
|
|
createNetworkSelector();
|
|
}
|
|
|
|
function createNetworkSelector() {
|
|
// 如果已存在，先移除
|
|
const existing = document.getElementById('web3-network-switcher');
|
|
if (existing) existing.remove();
|
|
|
|
// 创建容器
|
|
const container = document.createElement('div');
|
|
container.className = 'web3-network-switcher';
|
|
container.id = 'web3-network-switcher';
|
|
|
|
// 创建折叠按钮
|
|
const toggleBtn = document.createElement('div');
|
|
toggleBtn.className = 'toggle';
|
|
toggleBtn.textContent = '−';
|
|
toggleBtn.title = '折叠/展开';
|
|
toggleBtn.onclick = function() {
|
|
container.classList.toggle('collapsed');
|
|
toggleBtn.textContent = container.classList.contains('collapsed') ? '+' : '−';
|
|
};
|
|
|
|
// 创建标签
|
|
const label = document.createElement('label');
|
|
label.textContent = '切换到Monad:';
|
|
label.htmlFor = 'web3-network-select';
|
|
|
|
// 创建下拉选择框
|
|
const select = document.createElement('select');
|
|
select.id = 'web3-network-select';
|
|
|
|
// 添加网络选项
|
|
networks.forEach(network => {
|
|
const option = document.createElement('option');
|
|
option.value = network.chainId;
|
|
option.textContent = network.name;
|
|
select.appendChild(option);
|
|
});
|
|
|
|
// 添加状态显示
|
|
const status = document.createElement('div');
|
|
status.className = 'status';
|
|
status.textContent = '就绪';
|
|
status.id = 'web3-network-status';
|
|
|
|
// 添加事件监听器
|
|
select.addEventListener('change', function() {
|
|
const selectedChainId = this.value;
|
|
const selectedNetwork = networks.find(net => net.chainId === selectedChainId);
|
|
|
|
if (selectedNetwork) {
|
|
status.textContent = `切换中: ${selectedNetwork.name}...`;
|
|
status.style.color = '#4a90e2';
|
|
switchNetwork(selectedNetwork);
|
|
}
|
|
});
|
|
|
|
// 添加到容器
|
|
container.appendChild(toggleBtn);
|
|
container.appendChild(label);
|
|
container.appendChild(select);
|
|
container.appendChild(status);
|
|
|
|
// 添加到页面
|
|
document.body.appendChild(container);
|
|
|
|
// 添加拖动功能
|
|
makeDraggable(container);
|
|
}
|
|
|
|
async function switchNetwork(network) {
|
|
const status = document.getElementById('web3-network-status');
|
|
|
|
try {
|
|
// 尝试切换到指定网络
|
|
await window.ethereum.request({
|
|
method: 'wallet_switchEthereumChain',
|
|
params: [{ chainId: network.chainId }],
|
|
});
|
|
|
|
status.textContent = `已切换到 ${network.name}`;
|
|
status.style.color = 'green';
|
|
|
|
} catch (switchError) {
|
|
// 如果网络未添加，尝试添加它
|
|
if (switchError.code === 4902) {
|
|
status.textContent = '添加新网络中...';
|
|
status.style.color = '#4a90e2';
|
|
|
|
try {
|
|
await window.ethereum.request({
|
|
method: 'wallet_addEthereumChain',
|
|
params: [{
|
|
chainId: network.chainId,
|
|
chainName: network.name,
|
|
rpcUrls: network.rpcUrls,
|
|
nativeCurrency: {
|
|
name: 'MON',
|
|
symbol: 'MON',
|
|
decimals: 18
|
|
},
|
|
blockExplorerUrls: ['https://explorer.monad.xyz']
|
|
}],
|
|
});
|
|
|
|
status.textContent = `已添加并切换到 ${network.name}`;
|
|
status.style.color = 'green';
|
|
|
|
} catch (addError) {
|
|
status.textContent = `添加失败: ${addError.message}`;
|
|
status.style.color = 'red';
|
|
}
|
|
} else {
|
|
status.textContent = `切换失败: ${switchError.message}`;
|
|
status.style.color = 'red';
|
|
}
|
|
}
|
|
}
|
|
|
|
function makeDraggable(element) {
|
|
let pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
|
|
|
|
element.onmousedown = dragMouseDown;
|
|
|
|
function dragMouseDown(e) {
|
|
if (e.target.tagName === 'SELECT' || e.target.tagName === 'OPTION') return;
|
|
|
|
e = e || window.event;
|
|
e.preventDefault();
|
|
pos3 = e.clientX;
|
|
pos4 = e.clientY;
|
|
document.onmouseup = closeDragElement;
|
|
document.onmousemove = elementDrag;
|
|
}
|
|
|
|
function elementDrag(e) {
|
|
e = e || window.event;
|
|
e.preventDefault();
|
|
pos1 = pos3 - e.clientX;
|
|
pos2 = pos4 - e.clientY;
|
|
pos3 = e.clientX;
|
|
pos4 = e.clientY;
|
|
element.style.top = (element.offsetTop - pos2) + "px";
|
|
element.style.right = "unset";
|
|
element.style.left = (element.offsetLeft - pos1) + "px";
|
|
}
|
|
|
|
function closeDragElement() {
|
|
document.onmouseup = null;
|
|
document.onmousemove = null;
|
|
}
|
|
}
|
|
})(); |