MediaWiki

Common.js: Difference between revisions

From Grouse House Wiki

No edit summary
No edit summary
Line 513: Line 513:
}
}


function decorModalBehindV1(decorname, decorthumb, decordesc, decorobt, adulturl, motherlyurl, relaxedurl, sentinelurl, adolurl, pupurl, pupbrachyurl, pupconjoinedurl, pupnewbornurl, puppolycurl, puppolymurl, pupsirenurl, pupyoungurl) {
function decorModalBehindV1(decorname, adulturl, motherlyurl, relaxedurl, sentinelurl, adolurl, pupurl, pupbrachyurl, pupconjoinedurl, pupnewbornurl, puppolycurl, puppolymurl, pupsirenurl, pupyoungurl) {
 
     modal.style.display = "block";
     modal.style.display = "block";
     decorpreviewbehind.src = adulturl;
     decorpreviewbehind.src = adulturl;
Line 522: Line 523:
      
      
     decortitle.innerHTML = decorname;
     decortitle.innerHTML = decorname;
    decorthumbnail.src = decorthumb;


    previewbutton.addEventListener("click", function() {
     decorpreview.style.display = "block";
     decorpreview.style.display = "block";
     backbutton.style.display = "block";
     backbutton.style.display = "block";
Line 537: Line 536:
     previewbutton.style.display = "none";
     previewbutton.style.display = "none";
     decorpreviewbehind.src = adulturl;
     decorpreviewbehind.src = adulturl;
    });


     backbutton.addEventListener("click", function() {
     backbutton.addEventListener("click", function() {

Revision as of 01:10, 12 November 2024

/* Any JavaScript here will be loaded for all users on every page load. */

/* Spoiler buttons */

var spoilersc = document.getElementsByClassName('spoilerButton');
    var j;

for (j = 0; j < spoilersc.length; j++) {
  spoilersc[j].addEventListener("click", function() {
    this.classList.toggle("active");
    var spoilercontent = this.nextElementSibling;
    if (spoilercontent.style.display === "block") {
      spoilercontent.style.display = "none";
    } else {
      spoilercontent.style.display = "block";
    }
  });
}

/* Dropdown menus */

function selectVariant(enemy, variant1, variant2, variant3, variant4, variant5, variant6, variant7, variant8, variant9, variant10, variant11, variant12) {  
var dropdownName = enemy + 'Variants';
var resultName = enemy + 'ChosenVariant';
var enemyVariant1 = enemy + variant1;
var enemyVariant2 = enemy + variant2;
var enemyVariant3 = enemy + variant3;
var enemyVariant4 = enemy + variant4;
var enemyVariant5 = enemy + variant5;
var enemyVariant6 = enemy + variant6;
var enemyVariant7 = enemy + variant7;
var enemyVariant8 = enemy + variant8;
var enemyVariant9 = enemy + variant9;
var enemyVariant10 = enemy + variant10;
var enemyVariant11 = enemy + variant11;
var enemyVariant12 = enemy + variant12;
var variant1div = document.getElementById(enemyVariant1);
var variant2div = document.getElementById(enemyVariant2);
var variant3div = document.getElementById(enemyVariant3);
var variant4div = document.getElementById(enemyVariant4);
var variant5div = document.getElementById(enemyVariant5);
var variant6div = document.getElementById(enemyVariant6);
var variant7div = document.getElementById(enemyVariant7);
var variant8div = document.getElementById(enemyVariant8);
var variant9div = document.getElementById(enemyVariant9);
var variant10div = document.getElementById(enemyVariant10);
var variant11div = document.getElementById(enemyVariant11);
var variant12div = document.getElementById(enemyVariant12);
var dropdown = document.getElementById(dropdownName); 

if(dropdown.options[dropdown.selectedIndex].text === variant1) {
     document.getElementById(resultName).value = enemyVariant1;
     variant1div.style.display = "block";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant2) {
     document.getElementById(resultName).value = enemyVariant2;
     variant1div.style.display = "none";
     variant2div.style.display = "block";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant3) {
     document.getElementById(resultName).value = enemyVariant3;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "block";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant4) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "block";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant5) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "block";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant6) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "block";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant7) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "block";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant8) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "block";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant9) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "block";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant10) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "block";
     variant11div.style.display = "none";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant11) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "block";
     variant12div.style.display = "none";
} else if(dropdown.options[dropdown.selectedIndex].text === variant12) {
     document.getElementById(resultName).value = enemyVariant4;
     variant1div.style.display = "none";
     variant2div.style.display = "none";
     variant3div.style.display = "none";
     variant4div.style.display = "none";
     variant5div.style.display = "none";
     variant6div.style.display = "none";
     variant7div.style.display = "none";
     variant8div.style.display = "none";
     variant9div.style.display = "none";
     variant10div.style.display = "none";
     variant11div.style.display = "none";
     variant12div.style.display = "block";
}
}

/* Adding link to discussion button 

$(function() {
    $('h1#firstHeading').each(function () {
        var $header = $(this).children('span').html();
        $pagetitle = $header.split(' ').join('_');
        $url = $(location).attr('href');
        $spliturl = $url.split(':').join(' ');

        var main = $spliturl.indexOf("Main");
        var mediawiki = $spliturl.indexOf("MediaWiki");
        var special = $spliturl.indexOf("Special");
        var edit = $spliturl.indexOf("edit");
        if(main !== -1){ 
           $(this).children('div').children('a').css("display", "none");
        } else if(mediawiki !== -1){ 
           $(this).children('div').children('a').css("display", "none");
        } else if(special !== -1){ 
           $(this).children('div').children('a').css("display", "none");
        } else if(edit !== -1){ 
           $(this).children('div').children('a').css("display", "none");
        } else{
        $talklink = "https://grousehouse.wiki/Talk:" + $pagetitle;
        $link = $(this).children('div').children('a');
        $link.attr("href", $talklink);
        }

    });
 });

*/

/* Section toggles */

function toggleSectionsOn() {
    var sections = document.getElementsByClassName("c-header"),
        len = sections !== null ? sections.length : 0,
        i = 0;
    for(i; i < len; i++) {
        var content = sections[i].nextElementSibling;
        content.style.display = "block";
        sections[i].classList.remove("hidden"); 
        sections[i].classList.add("active")
    }
}

function toggleSectionsOff() {
    var sections = document.getElementsByClassName("c-header"),
        len = sections !== null ? sections.length : 0,
        i = 0;
    for(i; i < len; i++) {
        var content = sections[i].nextElementSibling;
        content.style.display = "none";
        sections[i].classList.remove("active"); 
        sections[i].classList.add("hidden")
    }
}

/* Spoiler toggles */

function toggleSpoilersOn() {
    var sections = document.getElementsByClassName("spoilerButton"),
        len = sections !== null ? sections.length : 0,
        i = 0;
    for(i; i < len; i++) {
        var content = sections[i].nextElementSibling;
        content.style.display = "block";
        sections[i].classList.remove("hidden"); 
        sections[i].classList.add("active")
    }
}

function toggleSpoilersOff() {
    var sections = document.getElementsByClassName("spoilerButton"),
        len = sections !== null ? sections.length : 0,
        i = 0;
    for(i; i < len; i++) {
        var content = sections[i].nextElementSibling;
        content.style.display = "none";
        sections[i].classList.remove("active"); 
        sections[i].classList.add("hidden")
    }
}

/* Decor Previewer Garbage */

var modal = document.getElementById('decorModalV1');
var modalclose = document.getElementsByClassName('modalclose')[0];
var modaldropdown = document.getElementById('previewoptions');
var modalpreview = document.getElementById('decorpreviewimg');
var decorpreviewbehind = document.getElementById('behinddecorpreviewimg');
var decorpreview = document.getElementById('decorpreview');
var previewinput = document.getElementById('previewinput');
var basewolf = document.getElementById('previewbasewolf');
var decortitle = document.getElementById('decorname');
var togglemenu = document.getElementById('checkboxesbutton');
var checkboxes = document.getElementById('checkboxes');
var backgroundtoggle = document.getElementById('backgroundtoggle');
var darkbasetoggle = document.getElementById('darkbasetoggle');
var previewbackground = document.getElementById('previewbackground');


function decorModalV1(decorname, adulturl, motherlyurl, relaxedurl, sentinelurl, adolurl, pupurl, pupbrachyurl, pupconjoinedurl, pupnewbornurl, puppolycurl, puppolymurl, pupsirenurl, pupyoungurl) {

    modal.style.display = "block";
    modalpreview.src = adulturl;
    basewolf.src = "/images/4/47/Basewolf_adult.png";

    decortitle.innerHTML = decorname;

    modalpreview.style.display = "block";
    previewinput.style.display = "block";
    decorpreview.style.display = "block";
    decorpreviewbehind.style.display = "none";
    togglemenu.style.display = "block";
    modalpreview.src = adulturl;

    modaldropdown.addEventListener("change", function() {
    if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult") {
       modalpreview.src = adulturl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/e/e2/Basewolfdark_adult.png";
       } else {
       basewolf.src = "/images/4/47/Basewolf_adult.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Motherly]") {
       modalpreview.src = motherlyurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/e/e9/Basewolfdark_motherly.png";
       } else {
       basewolf.src = "/images/d/d7/Basewolf_motherly.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Relaxed]") {
       modalpreview.src = relaxedurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/d/de/Basewolfdark_relaxed.png";
       } else {
       basewolf.src = "/images/6/67/Basewolf_relaxed.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Sentinel]") {
       modalpreview.src = sentinelurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/c/c7/Basewolfdark_sentinel.png";
       } else {
       basewolf.src = "/images/e/e0/Basewolf_sentinel.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adolescent") {
       modalpreview.src = adolurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/4/48/Basewolfdark_adolescent.png";
       } else {
       basewolf.src = "/images/7/78/Basewolf_adolescent.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy") {
       modalpreview.src = pupurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/2/29/Basewolfdark_pup.png";
       } else {
       basewolf.src = "/images/0/09/Basewolf_puppy.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Brachycephaly]") {
       modalpreview.src = pupbrachyurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/f/f1/Basewolfdark_brachycephaly.png";
       } else {
       basewolf.src = "/images/3/31/Basewolf_brachy.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Conjoined Twins]") {
       modalpreview.src = pupconjoinedurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/3/3a/Basewolfdark_conjoined.png";
       } else {
       basewolf.src = "/images/4/46/Basewolf_conjoinedtwins.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Newborn]") {
       modalpreview.src = pupnewbornurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/b/b6/Basewolfdark_pupnewborn.png";
       } else {
       basewolf.src = "/images/7/7f/Basewolf_newbornpuppy.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polycephaly]") {
       modalpreview.src = puppolycurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/e/e0/Basewolfdark_polycephaly.png";
       } else {
       basewolf.src = "/images/b/b5/Basewolf_polycephaly.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polymelia]") {
       modalpreview.src = puppolymurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/a/a4/Basewolfdark_polymelia.png";
       } else {
       basewolf.src = "/images/6/6a/Basewolf_polymelia.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Sirenomelia]") {
       modalpreview.src = pupsirenurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/c/c6/Basewolfdark_siren.png";
       } else {
       basewolf.src = "/images/3/39/Basewolf_sirenomelia.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Young]") {
       modalpreview.src = pupyoungurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/2/25/Basewolfdark_pupyoung.png";
       } else {
       basewolf.src = "/images/0/0c/Basewolf_youngpuppy.png";
       }
    } 
    });

    checkboxesbutton.addEventListener("click", function() {
       if (checkboxes.style.display === "none") {
          checkboxes.style.display = "block";
       } else {
          checkboxes.style.display = "none";
    }    });


    darkbasetoggle.addEventListener("click", function() {
    if (darkbasetoggle.checked) {
       if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult") {
       basewolf.src = "/images/e/e2/Basewolfdark_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Select a stage from the options below") {
       basewolf.src = "/images/e/e2/Basewolfdark_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Motherly]") {
       basewolf.src = "/images/e/e9/Basewolfdark_motherly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Relaxed]") {
       basewolf.src = "/images/d/de/Basewolfdark_relaxed.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Sentinel]") {
       basewolf.src = "/images/c/c7/Basewolfdark_sentinel.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adolescent") {
       basewolf.src = "/images/4/48/Basewolfdark_adolescent.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy") {
       basewolf.src = "/images/2/29/Basewolfdark_pup.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Brachycephaly]") {
       basewolf.src = "/images/f/f1/Basewolfdark_brachycephaly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Conjoined Twins]") {
       basewolf.src = "/images/3/3a/Basewolfdark_conjoined.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Newborn]") {
       basewolf.src = "/images/b/b6/Basewolfdark_pupnewborn.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polycephaly]") {
       basewolf.src = "/images/e/e0/Basewolfdark_polycephaly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polymelia]") {
       basewolf.src = "/images/a/a4/Basewolfdark_polymelia.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Sirenomelia]") {
       basewolf.src = "/images/c/c6/Basewolfdark_siren.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Young]") {
       basewolf.src = "/images/2/25/Basewolfdark_pupyoung.png";
    } 
    } else {
    if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult") {
       basewolf.src = "/images/4/47/Basewolf_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Select a stage from the options below") {
       basewolf.src = "/images/4/47/Basewolf_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Motherly]") {
       basewolf.src = "/images/d/d7/Basewolf_motherly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Relaxed]") {
       basewolf.src = "/images/6/67/Basewolf_relaxed.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Sentinel]") {
       basewolf.src = "/images/e/e0/Basewolf_sentinel.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adolescent") {
       basewolf.src = "/images/7/78/Basewolf_adolescent.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy") {
       basewolf.src = "/images/0/09/Basewolf_puppy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Brachycephaly]") {
       basewolf.src = "/images/3/31/Basewolf_brachy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Conjoined Twins]") {
       basewolf.src = "/images/4/46/Basewolf_conjoinedtwins.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Newborn]") {
       basewolf.src = "/images/7/7f/Basewolf_newbornpuppy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polycephaly]") {
       basewolf.src = "/images/b/b5/Basewolf_polycephaly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polymelia]") {
       basewolf.src = "/images/6/6a/Basewolf_polymelia.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Sirenomelia]") {
       basewolf.src = "/images/3/39/Basewolf_sirenomelia.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Young]") {
       basewolf.src = "/images/0/0c/Basewolf_youngpuppy.png";
    } 
    }
    });

    backgroundtoggle.addEventListener("click", function() {
       if (backgroundtoggle.checked) {
       previewbackground.src = "/images/2/21/Background_default.png";
       } else {
       previewbackground.src = "/images/b/b5/Placeholderbackground.png";
      }
    });
}

function decorModalBehindV1(decorname, adulturl, motherlyurl, relaxedurl, sentinelurl, adolurl, pupurl, pupbrachyurl, pupconjoinedurl, pupnewbornurl, puppolycurl, puppolymurl, pupsirenurl, pupyoungurl) {

    modal.style.display = "block";
    decorpreviewbehind.src = adulturl;
    basewolf.src = "/images/4/47/Basewolf_adult.png";

    modalpreview.style.display = "none";
    decorpreviewbehind.style.display = "block";
    
    decortitle.innerHTML = decorname;

    decorpreview.style.display = "block";
    backbutton.style.display = "block";
    previewinput.style.display = "block";
    decorpreviewbehind.style.display = "block";
    modalpreview.style.display = "none";
    togglemenu.style.display = "block";
    decorthumbnail.style.display = "none";
    obtentionheader.style.display = "none";
    obtention.style.display = "none";
    decorinformation.style.display = "none";
    previewbutton.style.display = "none";
    decorpreviewbehind.src = adulturl;

    backbutton.addEventListener("click", function() {
    modalpreview.style.display = "none";
    backbutton.style.display = "none";
    previewinput.style.display = "none";
    decorpreview.style.display = "none";
    togglemenu.style.display = "none";
    decorthumbnail.style.display = "block";
    obtentionheader.style.display = "block";
    obtention.style.display = "block";
    decorinformation.style.display = "block";
    previewbutton.style.display = "block";
    decorpreviewbehind.src = adulturl;
    });

    modaldropdown.addEventListener("change", function() {
    if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult") {
       decorpreviewbehind.src = adulturl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/e/e2/Basewolfdark_adult.png";
       } else {
       basewolf.src = "/images/4/47/Basewolf_adult.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Motherly]") {
       decorpreviewbehind.src = motherlyurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/d/d7/Basewolf_motherly.png";
       } else {
       basewolf.src = "/images/d/d7/Basewolf_motherly.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Relaxed]") {
       decorpreviewbehind.src = relaxedurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/6/67/Basewolf_relaxed.png";
       } else {
       basewolf.src = "/images/6/67/Basewolf_relaxed.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Sentinel]") {
       decorpreviewbehind.src = sentinelurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/e/e0/Basewolf_sentinel.png";
       } else {
       basewolf.src = "/images/e/e0/Basewolf_sentinel.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adolescent") {
       decorpreviewbehind.src = adolurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/7/78/Basewolf_adolescent.png";
       } else {
       basewolf.src = "/images/7/78/Basewolf_adolescent.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy") {
       decorpreviewbehind.src = pupurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/0/09/Basewolf_puppy.png";
       } else {
       basewolf.src = "/images/0/09/Basewolf_puppy.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Brachycephaly]") {
       decorpreviewbehind.src = pupbrachyurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/3/31/Basewolf_brachy.png";
       } else {
       basewolf.src = "/images/3/31/Basewolf_brachy.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Conjoined Twins]") {
       decorpreviewbehind.src = pupconjoinedurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/4/46/Basewolf_conjoinedtwins.png";
       } else {
       basewolf.src = "/images/4/46/Basewolf_conjoinedtwins.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Newborn]") {
       decorpreviewbehind.src = pupnewbornurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/7/7f/Basewolf_newbornpuppy.png";
       } else {
       basewolf.src = "/images/7/7f/Basewolf_newbornpuppy.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polycephaly]") {
       decorpreviewbehind.src = puppolycurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/b/b5/Basewolf_polycephaly.png";
       } else {
       basewolf.src = "/images/b/b5/Basewolf_polycephaly.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polymelia]") {
       decorpreviewbehind.src = puppolymurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/6/6a/Basewolf_polymelia.png";
       } else {
       basewolf.src = "/images/6/6a/Basewolf_polymelia.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Sirenomelia]") {
       decorpreviewbehind.src = pupsirenurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/3/39/Basewolf_sirenomelia.png";
       } else {
       basewolf.src = "/images/3/39/Basewolf_sirenomelia.png";
       }
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Young]") {
       decorpreviewbehind.src = pupyoungurl;
       if (darkbasetoggle.checked) {
       basewolf.src = "/images/0/0c/Basewolf_youngpuppy.png";
       } else {
       basewolf.src = "/images/0/0c/Basewolf_youngpuppy.png";
       }
    } 
    });

    checkboxesbutton.addEventListener("click", function() {
       if (checkboxes.style.display === "none") {
          checkboxes.style.display = "block";
       } else {
          checkboxes.style.display = "none";
    }    });


    darkbasetoggle.addEventListener("click", function() {
    if (darkbasetoggle.checked) {
       if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult") {
       basewolf.src = "/images/e/e2/Basewolfdark_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Select a stage from the options below") {
       basewolf.src = "/images/e/e2/Basewolfdark_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Motherly]") {
       basewolf.src = "/images/d/d7/Basewolf_motherly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Relaxed]") {
       basewolf.src = "/images/6/67/Basewolf_relaxed.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Sentinel]") {
       basewolf.src = "/images/e/e0/Basewolf_sentinel.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adolescent") {
       basewolf.src = "/images/7/78/Basewolf_adolescent.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy") {
       basewolf.src = "/images/0/09/Basewolf_puppy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Brachycephaly]") {
       basewolf.src = "/images/3/31/Basewolf_brachy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Conjoined Twins]") {
       basewolf.src = "/images/4/46/Basewolf_conjoinedtwins.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Newborn]") {
       basewolf.src = "/images/7/7f/Basewolf_newbornpuppy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polycephaly]") {
       basewolf.src = "/images/b/b5/Basewolf_polycephaly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polymelia]") {
       basewolf.src = "/images/6/6a/Basewolf_polymelia.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Sirenomelia]") {
       basewolf.src = "/images/3/39/Basewolf_sirenomelia.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Young]") {
       basewolf.src = "/images/0/0c/Basewolf_youngpuppy.png";
    } 
    } else {
    if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult") {
       basewolf.src = "/images/4/47/Basewolf_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Select a stage from the options below") {
       basewolf.src = "/images/4/47/Basewolf_adult.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Motherly]") {
       basewolf.src = "/images/d/d7/Basewolf_motherly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Relaxed]") {
       basewolf.src = "/images/6/67/Basewolf_relaxed.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adult [Sentinel]") {
       basewolf.src = "/images/e/e0/Basewolf_sentinel.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Adolescent") {
       basewolf.src = "/images/7/78/Basewolf_adolescent.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy") {
       basewolf.src = "/images/0/09/Basewolf_puppy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Brachycephaly]") {
       basewolf.src = "/images/3/31/Basewolf_brachy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Conjoined Twins]") {
       basewolf.src = "/images/4/46/Basewolf_conjoinedtwins.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Newborn]") {
       basewolf.src = "/images/7/7f/Basewolf_newbornpuppy.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polycephaly]") {
       basewolf.src = "/images/b/b5/Basewolf_polycephaly.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Polymelia]") {
       basewolf.src = "/images/6/6a/Basewolf_polymelia.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Sirenomelia]") {
       basewolf.src = "/images/3/39/Basewolf_sirenomelia.png";
    } else if (modaldropdown.options[modaldropdown.selectedIndex].text === "Puppy [Young]") {
       basewolf.src = "/images/0/0c/Basewolf_youngpuppy.png";
    } 
    }
    });

    backgroundtoggle.addEventListener("click", function() {
       if (backgroundtoggle.checked) {
       previewbackground.src = "/images/2/21/Background_default.png";
       } else {
       previewbackground.src = "/images/b/b5/Placeholderbackground.png";
      }
    });
}


window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none";
    modaldropdown.selectedIndex = 0;
    decorpreviewbehind.src = " ";
    basewolf.src = " ";
    decorpreview.style.display = "none";
    decorpreviewbehind.style.display = "none";
    backbutton.style.display = "none";
    previewinput.style.display = "none";
    decorpreview.style.display = "none";
    togglemenu.style.display = "none";
    checkboxes.style.display = "none";
    decorinformation.style.display = "block";
    previewbutton.style.display = "block";
    decorthumbnail.style.display = "block";
    obtentionheader.style.display = "block";
    obtention.style.display = "block";
    decorinformation.style.display = "block";
    previewbutton.style.display = "block";  
  } else if (event.target == modalclose) {
    modal.style.display = "none";
    modaldropdown.selectedIndex = 0;
    decorpreviewbehind.src = " ";
    basewolf.src = " ";
    decorpreview.style.display = "none";
    decorpreviewbehind.style.display = "none";
    backbutton.style.display = "none";
    previewinput.style.display = "none";
    decorpreview.style.display = "none";
    togglemenu.style.display = "none";
    checkboxes.style.display = "none";
    decorinformation.style.display = "block";
    previewbutton.style.display = "block";
    decorthumbnail.style.display = "block";
    obtentionheader.style.display = "block";
    obtention.style.display = "block";
    decorinformation.style.display = "block";
    previewbutton.style.display = "block";
  }
}

/* Disaster tables */

function generateDisaster(disaster) {  
var biomeDropdownName = disaster + 'Biomes';
var seasonDropdownName = disaster + 'Seasons';
var timeDropdownName = disaster + 'Times';
var biomeResultName = disaster + 'ChosenBiome';
var seasonResultName = disaster + 'ChosenSeason';
var timeResultName = disaster + 'ChosenTime';

var biomeDropdown = document.getElementById(biomeDropdownName);
var seasonDropdown = document.getElementById(seasonDropdownName);
var timeDropdown = document.getElementById(timeDropdownName);

var selectedBiome = biomeDropdown.options[biomeDropdown.selectedIndex].text;
var selectedSeason = seasonDropdown.options[seasonDropdown.selectedIndex].text;
var selectedTime = timeDropdown.options[timeDropdown.selectedIndex].text;

var biomeClasses = selectedBiome + '_' + selectedSeason + '_' + selectedTime;
biomeClasses = biomeClasses.toLowerCase().replace(/\s+/g, '');
var imageClasses = disaster + '_' + selectedBiome + '_' + selectedTime;
imageClasses = imageClasses.toLowerCase().replace(/\s+/g, '');

var biomeResultName = disaster + 'BiomeImage';
var biomeImageResult = document.getElementById(biomeResultName);

var biomeImageName = "/images/4/44/" + biomeClasses + ".png";
var weatherImageName = "/images/8/88/" + imageClasses + ".png";

biomeImageResult.style.background = 'url(' + biomeImageName + ')';

var weatherResultName = disaster + 'WeatherImage';
var weatherImageResult = document.getElementById(weatherResultName);

weatherImageResult.src = weatherImageName;

}

/* Stage and variant tables */

function updateStage(constant) {  
var stageDropdownName = constant + 'Stage';
var stageImage = constant + 'Image';
stageImage = document.getElementById(stageImage);

var stageDropdown = document.getElementById(stageDropdownName);

var selectedStage = stageDropdown.options[stageDropdown.selectedIndex].text;
selectedStage = selectedStage.toLowerCase().replace(/\s+/g, '').replace('[', '').replace(']', '');

var stageImageName = constant + "_" + selectedStage;
var stageImageResult = "/images/5/55/" + stageImageName + ".png";

stageImage.src = stageImageResult;

}