<script>

(async () => {
const { connect, utils, keyStores, WalletConnection, KeyPair, Contract } = nearApi;
const keyStore = new keyStores.BrowserLocalStorageKeyStore();
const networkId = "net";

const config = {    
keyStore,   networkId, 
nodeUrl: `https://rpc.${networkId}.near.org`, 
walletUrl: `https://wallet.${networkId}.near.org`, 
helperUrl: `https://helper.${networkId}.near.org`, 
explorerUrl: `https://explorer.${networkId}.near.org`
};
const near = await connect(config); 
const walletConnection = new WalletConnection(near);
const contract = new Contract(walletConnection.account(), 'pay.w-adalo.testnet', {
viewMethods: ['getGreeting'], 
changeMethods: ['setGreeting', 'sendNear']
});
const loginBtn = document.querySelector('#sendLogin');
const logoutBtn = document.querySelector('#sendLogout');
if(walletConnection.isSignedIn()) {
const accountId = walletConnection.getAccountId();
logoutBtn.innerHTML = `Logout ${accountId}`;
hide(loginBtn);    show(logoutBtn);
}  
function signIn() {
walletConnection.requestSignIn({
contractId: 'pay.w-adalo.testnet',
viewMethods: ['getGreeting'],
changeMethods: ['setGreeting', 'sendNear']
});
}
function signOut() {
walletConnection.signOut();
logoutBtn.innerHTML = ``;
hide(logoutBtn);
show(loginBtn);
} 
function show(btn) {
btn.classList.remove('hide');
btn.classList.add('active'); 
}
function hide(btn) {
btn.classList.remove('active');
btn.classList.add('hide');
}
loginBtn.addEventListener('click', signIn);
logoutBtn.addEventListener('click', signOut);
const div = document.querySelector('#outBalance');
const senderBalance = (await walletConnection.account().state()).amount/1e24 
div.innerHTML = `Total ${Math.floor(senderBalance)}`;
document.querySelector('#checkResult').addEventListener('click', () => {
window.location.href = `https://explorer.testnet.near.org/accounts/${walletConnection.getAccountId()}`; 
}); 
document.querySelector('#sendButton').addEventListener('click', () => {
async function send() {
try {
let dataAmount = document.querySelector('#inputAmount').value;
let dataReceiver = document.querySelector('#inputReceiver').value;
const receiver = dataReceiver;
const result = await walletConnection.account().functionCall({
contractId: contract.contractId,
methodName: "sendNear",
args: { receiver: receiver },
attachedDeposit: utils.format.parseNearAmount(`${dataAmount}`),
})        
console.log(result.transaction.hash);   
} catch (e) {
console.log(e);
}   
} send();
})
})()

</script>