find & refresh & look into invader of a planet

df_planet_tool.js

class Plugin {
    constructor() {
        let jump_contaienr = document.createElement("div");
        jump_contaienr.style.width = '100%';
        jump_contaienr.style.height = '26px';
        jump_contaienr.style.display = 'block';

        let idInput = document.createElement('input');
        idInput.placeholder = 'planet id';
        // idInput.style.color = 'black';
        // idInput.style.padding = '5px';
        // idInput.style.marginLeft = '5px';
        //idInput.style.width = '70%';
        idInput.style.width = '180px';
        idInput.style.textAlign = 'left';
        this.idInput = idInput;
        let jumpButton = document.createElement('button');
        //jumpButton.style.display = 'block';
        //jumpButton.style.width = '100%';
        jumpButton.innerText = 'find planet';
        jumpButton.style.height = '26px';
        jumpButton.onclick = () => {
            let id = idInput.value;
            console.log(`plugin: ${id}`);
            ui.centerLocationId(id);
            //ui.centerPlanet(planet):
            //ui.setSelectedPlanet(planet)
            //ui.setSelectedId(id)
        };
        jump_contaienr.appendChild(idInput);
        jump_contaienr.appendChild(jumpButton);
        this.jump_contaienr = jump_contaienr;

        let invader_container = document.createElement("div");
        let invader_label = document.createElement("label");
        let invader_text = document.createElement("span");
        invader_label.innerText = 'invader:';
        invader_label.style.width = '20%';
        //invader_label.style.display = 'block';

        invader_container.appendChild(invader_label);
        invader_container.appendChild(invader_text);

        let capturer_container = document.createElement("div");
        let capturer_label = document.createElement("label");
        let capture_text = document.createElement("span");
        capturer_label.innerText = 'capturer:';
        capturer_label.style.width = '20%';
        //capturer_label.style.display = 'block';

        capturer_container.appendChild(capturer_label);
        capturer_container.appendChild(capture_text);

        let showButton = document.createElement('button');
        showButton.style.width = '100%';
        showButton.style.height = '26px';
        showButton.innerText = 'show planet info';
        showButton.onclick = () => {
            let planet = this.getPlanet();
            if (planet) {
                invader_text.innerText = planet.invader;
                capture_text.innerText = planet.capturer;
            }
        };
        let info_container = document.createElement("div");
        info_container.appendChild(invader_container);
        info_container.appendChild(capturer_container);
        info_container.appendChild(showButton);
        this.info_container = info_container;

        let softRefreshButton = document.createElement('button');
        softRefreshButton.style.width = '100%';
        softRefreshButton.style.height = '26px';
        softRefreshButton.innerText = 'soft refresh planet';
        softRefreshButton.onclick = () => {
            let planet = this.getPlanet();
            if (planet) {
                df.softRefreshPlanet(planet.locationId);
            }
        };
        this.softRefreshButton = softRefreshButton;
        let hardRefreshButton = document.createElement('button');
        hardRefreshButton.style.width = '100%';
        hardRefreshButton.style.height = '26px';
        hardRefreshButton.innerText = 'hard refresh planet';
        hardRefreshButton.onclick = () => {
            let planet = this.getPlanet();
            if (planet) {
                df.hardRefreshPlanet(planet.locationId);
            }
        };
        this.hardRefreshButton = hardRefreshButton;

    }

    getPlanet = () => {
        let planet = ui.getSelectedPlanet();
        if (!planet) {
            let id = this.idInput.value;
            if (id) {
                planet = df.getPlanetWithId(id);
            }
        }
        return planet;
    }

    /**
     * Called when plugin is launched with the "run" button.
     */
    async render(container) {
        container.parentElement.style.minHeight = 'unset';
        container.style.minHeight = 'unset';
        container.style.width = '280px';
        container.appendChild(this.jump_contaienr);
        container.appendChild(this.info_container);
        container.appendChild(this.softRefreshButton);
        container.appendChild(this.hardRefreshButton);

    }

    destroy() {
    }
}

/**
 * And don't forget to export it!
 */
export default Plugin;