var dameId;
var sireId;
var ids;
$(document).ready(async () => { //when page is loaded, get latest instance of blockchain
$('#breedAgainButton').css("display", "none");
await connectWallet(); //connect MetaMask (if not already connected)
await onlyOwnerAccess();
ids = await getBirdsOfOwner(); //fill array with ids for all birds of this address
dameId = ids[0];
sireId = ids[1];
if (ids.length == 2) { //user must own at least two birds to continue
await renderDameAndSire(dameId, sireId);
$('#insufficient').hide();
$('#swapButton').css("display", "block");
$('#swapButton').click(async function() { //swap dame and sire if only 2 birds in array
var helper = dameId;
dameId = sireId;
sireId = helper;
await renderDameAndSire(dameId, sireId);
})
} else if (ids.length > 2) {
$('#insufficient').hide();
$('#swapButton').css("display", "none");
await buildModal(ids); //iterates through array and returns full info from blockchain
await renderDameAndSire(ids[0], ids[1]);
};
activateMouseListeners();
});
function appendBirdToModal(dna, id) {
modalBox(id);
renderBird(`#BirdBox${id}`, birdDna(dna), id);
};
async function setUpModal() {
$('.row').empty(); //clear modal content
ids = await getBirdsOfOwner(); //get a fresh array from the blockcahin
ids = [...ids]
var index = ids.findIndex(bird => bird == dameId); //search for dame
if (index >= 0) { //make sure element is in array
ids.splice(index, 1); //remove current dame from array
};
index = ids.findIndex(bird => bird == sireId);
if (index >= 0) { //make sure element is in array
ids.splice(index, 1); //remove current sire from array
};
await buildModal(ids); //iterates through array and returns full info from blockchain
$('#birdSelection').modal('show'); //open modal
activateMouseListeners();
};
async function renderDameAndSire(dameId, sireId) {
dameBox(dameId);
var dna = await getBirdDna(dameId);//returns bird instance from blockchain
var obj = birdDna(dna, dameId);//creates dna object for rendering
renderBird(`#dameBox`, obj, dameId);//renders bird
sireBox(sireId);
dna = await getBirdDna(sireId)
obj = birdDna(dna, sireId);
renderBird(`#sireBox`, obj, sireId);
};
async function renderChild(id) {
childBox(id);
var dna = await getBirdDna(id);
var obj = birdDna(dna, id);
renderBird(`#childBox`, obj, id);
};
//Listeners for buttons
$('#dameButton').on("click", async () => {
await setUpModal();
selectDame(); //functionality when dame is to be selected
});
$('#sireButton').on("click", async () => {
await setUpModal();
selectSire();//modal functionality when sire is to be selected
});
$('#breedButton').on("click", async () => { //sends parent IDs to blockchain with request to breed child
await breedBird(sireId, dameId);
});
//Listeners for selections
function selectDame(){
$(`[id^='BirdBox']`).off("click");
$(`[id^='BirdBox']`).on("click", async function() { //arrow function ES6 doesn't work with $(this)
dameId = $(this).attr("id").substring(7); //works after removing arrow function.
dameBox(dameId);//render box
var dna = await getBirdDna(dameId)
var obj = birdDna(dna, dameId);
renderBird(`#dameBox`, obj, dameId);//render bird
$('#birdSelection').modal('toggle'); //close modal
});
};
function selectSire(){
$(`[id^='BirdBox']`).off("click");
$(`[id^='BirdBox']`).on("click", async function() { //arrow function ES6 doesn't work with $(this)
sireId = $(this).attr("id").substring(7); //works after removing arrow function.
sireBox(sireId);//render box
var dna = await getBirdDna(sireId)
var obj = birdDna(dna, sireId);
renderBird(`#sireBox`, obj, sireId);//render bird
$('#birdSelection').modal('toggle'); //close modal
});
};
//Listener for eye animation
function activateMouseListeners() {
$('.CatalogBox').on("mousemove", () => {
var eyeballs = $('.eyesFollow');
document.onmousemove = function(event) {
var x = event.clientX * 65 / window.innerWidth + "%";
var y = event.clientY * 65 / window.innerHeight + "%";
for (let i = 0; i < eyeballs.length; i++) {
eyeballs[i].style.left = x;
eyeballs[i].style.top = y;
};
};
});
};
//dynamic elements for breeding page
function dameBox(id) {
var boxDiv = `
ID:
` + id + `
GEN:
MUM:
DAD:
DNA:
DAME
`
$('#dameDisplay').empty();
$('#dameDisplay').append(boxDiv);
};
function sireBox(id) {
var boxDiv = `
ID:
` + id + `
GEN:
MUM:
DAD:
DNA:
SIRE
`
$('#sireDisplay').empty();
$('#sireDisplay').append(boxDiv);
};
function childBox(id) {
var boxDiv = `
ID:
` + id + `
GEN:
MUM:
DAD:
DNA:
NEWBORN!
`
$('#childDisplay').empty();
$('#childDisplay').append(boxDiv);
};
function modalBox(id) {
var boxDiv = `
ID:
` + id + `
GEN:
MUM:
DAD:
DNA:
`
$('.row').append(boxDiv);
};