document.addEventListener('DOMContentLoaded', function() {
    let generate = function(seed) {
        let size = document.querySelector('input[name="size"]').value
        let wastelands = document.querySelector('input[name="wastelands"]').value
        let mountains = document.querySelector('input[name="mountains"]').value
        let ruins = document.querySelector('input[name="ruins"]').value

        let map = document.querySelector('.map')
        // Generate new random seed
        let newMapUrl = '/map.svg?seed=' + seed +
            '&s=' + size +
            '&w=' + wastelands +
            '&m=' + mountains +
            '&r=' + ruins
        document.querySelector('.map').setAttribute('src', newMapUrl);
        document.querySelector('#map-link').setAttribute('href', newMapUrl);
    };

    let buttons = document.querySelectorAll('input[type="button"]')
    Array.prototype.forEach.call(buttons, function(button, i) {
        button.addEventListener('click', function(e) {
            // Reset to default buttons
            if (e.target.hasAttribute('data-default')) {
                let defaultValue = e.target.getAttribute('data-default');
                let name = e.target.getAttribute('name').substr(8);
                let targetInput = document.querySelector('input[type="text"][name="'+name+'"]')
                targetInput.value = defaultValue;
            }

            // Roll the dice
            if (e.target.getAttribute('name') === 'random-seed') {
                let chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
                let seed = '';
                for (let i=0; i<10; i++) {
                    let index = Math.floor(Math.random() * 25)
                    seed += chars[index]
                }

                let seedElement = document.querySelector('input[name="seed"]');
                seedElement.value = seed;
                generate(seed);
            }

            // Refresh
            if (e.target.getAttribute('name') === 'refresh') {
                let seed = document.querySelector('input[name="seed"]').value;
                generate(seed);
            }
        })
    });
});