import LabelView from '../../../src/view/common/LabelView.js';
import dom from "../../../src/view/DOM.js";
import ImageView from "../../../src/view/elements/image/ImageView.js";
import View from "../../../src/view/View.js";

class ToolView extends View {
    /**
     *
     * @param {Tool} tool
     * @param {Editor} editor
     * @constructor
     */
    constructor({ tool, editor }) {

        super(tool);

        const dRoot = dom('div');

        dRoot.addClass('tool-view');

        dRoot.addClass(`editor-tool-${tool.name}`);

        this.el = dRoot.el;

        //add tool name
        const lName = new LabelView(tool.name);

        const icon = new ImageView(tool.icon, { classList: ['icon'] });

        icon.size.set(32, 32);
        icon.position.set(2, 2);

        this.addChild(icon);

        this.addChild(lName);


        this.on.linked.add(() => {
            tool.updateIcon(editor);
        });

        function updateIconVisibility() {
            icon.visible = (tool.icon.getValue() !== "");
        }

        tool.icon.onChanged.add(updateIconVisibility);
        this.on.linked.add(updateIconVisibility);
    }
}


export default ToolView;
