import HtmlControl from "../../core/HtmlControl.js";
import { isInsideHtmlEditor } from "../../core/HtmlEditor.js";
import { XNode } from "../../core/XNode.js";

export default class RippleBox extends HtmlControl {

    root: ShadowRoot;

    async prepare() {
        if (isInsideHtmlEditor(this)) {
            return;
        }
        XNode.render(this, <div>
            <animated-box animation="ripple-glow-and-fade" animation-delay="1s"/>
            <animated-box animation="ripple-glow-and-fade" animation-delay="2s"/>
            <animated-box animation="ripple-glow-and-fade" animation-delay="3s"/>
        </div>);
    }

}

customElements.define("ripple-box", RippleBox);