- Introduced Aggregator.sol for Chainlink-compatible oracle functionality, including round-based updates and access control. - Added OracleWithCCIP.sol to extend Aggregator with CCIP cross-chain messaging capabilities. - Created .gitmodules to include OpenZeppelin contracts as a submodule. - Developed a comprehensive deployment guide in NEXT_STEPS_COMPLETE_GUIDE.md for Phase 2 and smart contract deployment. - Implemented Vite configuration for the orchestration portal, supporting both Vue and React frameworks. - Added server-side logic for the Multi-Cloud Orchestration Portal, including API endpoints for environment management and monitoring. - Created scripts for resource import and usage validation across non-US regions. - Added tests for CCIP error handling and integration to ensure robust functionality. - Included various new files and directories for the orchestration portal and deployment scripts.
214 lines
6.9 KiB
HTML
214 lines
6.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>ChainID 138 MetaMask Integration</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
max-width: 800px;
|
|
margin: 50px auto;
|
|
padding: 20px;
|
|
}
|
|
button {
|
|
background-color: #f6851b;
|
|
color: white;
|
|
border: none;
|
|
padding: 10px 20px;
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
margin: 5px;
|
|
}
|
|
button:hover {
|
|
background-color: #e6750a;
|
|
}
|
|
button:disabled {
|
|
background-color: #ccc;
|
|
cursor: not-allowed;
|
|
}
|
|
.status {
|
|
margin: 20px 0;
|
|
padding: 10px;
|
|
border-radius: 5px;
|
|
}
|
|
.success {
|
|
background-color: #d4edda;
|
|
color: #155724;
|
|
}
|
|
.error {
|
|
background-color: #f8d7da;
|
|
color: #721c24;
|
|
}
|
|
.info {
|
|
background-color: #d1ecf1;
|
|
color: #0c5460;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>ChainID 138 MetaMask Integration</h1>
|
|
|
|
<div id="status" class="status info">Checking MetaMask connection...</div>
|
|
|
|
<h2>Network</h2>
|
|
<button onclick="addNetwork()">Add ChainID 138</button>
|
|
<button onclick="switchNetwork()">Switch to ChainID 138</button>
|
|
<button onclick="checkNetwork()">Check Current Network</button>
|
|
|
|
<h2>Token</h2>
|
|
<button onclick="addToken()">Add WETH Token</button>
|
|
|
|
<h2>Account</h2>
|
|
<button onclick="connectAccount()">Connect Account</button>
|
|
<div id="account"></div>
|
|
|
|
<script>
|
|
const CHAIN_ID = '0x8a';
|
|
const NETWORK_METADATA = {
|
|
chainId: CHAIN_ID,
|
|
chainName: 'DeFi Oracle Meta Mainnet',
|
|
nativeCurrency: {
|
|
name: 'Ether',
|
|
symbol: 'ETH',
|
|
decimals: 18
|
|
},
|
|
rpcUrls: ['https://rpc.d-bis.org'],
|
|
blockExplorerUrls: ['https://explorer.d-bis.org']
|
|
};
|
|
|
|
const WETH_TOKEN = {
|
|
address: '0xYourWETHAddress', // Update after deployment
|
|
symbol: 'WETH',
|
|
decimals: 18,
|
|
image: 'https://explorer.d-bis.org/images/tokens/weth.png'
|
|
};
|
|
|
|
function updateStatus(message, type = 'info') {
|
|
const status = document.getElementById('status');
|
|
status.textContent = message;
|
|
status.className = `status ${type}`;
|
|
}
|
|
|
|
function checkMetaMask() {
|
|
if (typeof window.ethereum === 'undefined') {
|
|
updateStatus('MetaMask is not installed. Please install MetaMask.', 'error');
|
|
return false;
|
|
}
|
|
return true;
|
|
}
|
|
|
|
async function addNetwork() {
|
|
if (!checkMetaMask()) return;
|
|
|
|
try {
|
|
await window.ethereum.request({
|
|
method: 'wallet_addEthereumChain',
|
|
params: [NETWORK_METADATA]
|
|
});
|
|
updateStatus('Network added successfully!', 'success');
|
|
} catch (error) {
|
|
if (error.code === 4902) {
|
|
updateStatus('Network already added. Try switching instead.', 'info');
|
|
} else {
|
|
updateStatus(`Error adding network: ${error.message}`, 'error');
|
|
}
|
|
}
|
|
}
|
|
|
|
async function switchNetwork() {
|
|
if (!checkMetaMask()) return;
|
|
|
|
try {
|
|
await window.ethereum.request({
|
|
method: 'wallet_switchEthereumChain',
|
|
params: [{ chainId: CHAIN_ID }]
|
|
});
|
|
updateStatus('Switched to ChainID 138', 'success');
|
|
} catch (error) {
|
|
if (error.code === 4902) {
|
|
updateStatus('Network not added. Adding network...', 'info');
|
|
await addNetwork();
|
|
} else {
|
|
updateStatus(`Error switching network: ${error.message}`, 'error');
|
|
}
|
|
}
|
|
}
|
|
|
|
async function checkNetwork() {
|
|
if (!checkMetaMask()) return;
|
|
|
|
try {
|
|
const chainId = await window.ethereum.request({ method: 'eth_chainId' });
|
|
if (chainId === CHAIN_ID) {
|
|
updateStatus('Currently on ChainID 138', 'success');
|
|
} else {
|
|
updateStatus(`Currently on chain: ${chainId}`, 'info');
|
|
}
|
|
} catch (error) {
|
|
updateStatus(`Error checking network: ${error.message}`, 'error');
|
|
}
|
|
}
|
|
|
|
async function addToken() {
|
|
if (!checkMetaMask()) return;
|
|
|
|
try {
|
|
await window.ethereum.request({
|
|
method: 'wallet_watchAsset',
|
|
params: {
|
|
type: 'ERC20',
|
|
options: WETH_TOKEN
|
|
}
|
|
});
|
|
updateStatus('Token added successfully!', 'success');
|
|
} catch (error) {
|
|
updateStatus(`Error adding token: ${error.message}`, 'error');
|
|
}
|
|
}
|
|
|
|
async function connectAccount() {
|
|
if (!checkMetaMask()) return;
|
|
|
|
try {
|
|
const accounts = await window.ethereum.request({
|
|
method: 'eth_requestAccounts'
|
|
});
|
|
const account = accounts[0];
|
|
document.getElementById('account').textContent = `Connected: ${account}`;
|
|
updateStatus('Account connected', 'success');
|
|
} catch (error) {
|
|
updateStatus(`Error connecting account: ${error.message}`, 'error');
|
|
}
|
|
}
|
|
|
|
// Check network on load
|
|
window.addEventListener('load', () => {
|
|
if (checkMetaMask()) {
|
|
checkNetwork();
|
|
}
|
|
});
|
|
|
|
// Listen for chain changes
|
|
if (window.ethereum) {
|
|
window.ethereum.on('chainChanged', (chainId) => {
|
|
if (chainId === CHAIN_ID) {
|
|
updateStatus('Switched to ChainID 138', 'success');
|
|
} else {
|
|
updateStatus(`Switched to chain: ${chainId}`, 'info');
|
|
}
|
|
});
|
|
|
|
window.ethereum.on('accountsChanged', (accounts) => {
|
|
if (accounts.length > 0) {
|
|
document.getElementById('account').textContent = `Connected: ${accounts[0]}`;
|
|
} else {
|
|
document.getElementById('account').textContent = '';
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|
|
|