package com.braintree.customersupportbackoffice.renderers;

import com.braintree.enums.BraintreeApplePayShape;
import com.hybris.cockpitng.core.config.impl.jaxb.editorarea.AbstractPanel;
import com.hybris.cockpitng.core.model.ModelObserver;
import com.hybris.cockpitng.core.model.WidgetModel;
import com.hybris.cockpitng.dataaccess.facades.type.DataType;
import com.hybris.cockpitng.engine.WidgetInstanceManager;
import com.hybris.cockpitng.widgets.editorarea.renderer.impl.AbstractEditorAreaPanelRenderer;
import de.hybris.platform.core.model.BraintreeApplePayStylesConfigurationModel;
import org.zkoss.zk.ui.Component;
import org.zkoss.zul.Html;

import static com.hybris.backoffice.workflow.designer.handler.WorkflowDesignerCloseListener.VALUE_CHANGED;
import static java.util.Objects.nonNull;

public class ApplePayPreviewButtonRenderer extends
        AbstractEditorAreaPanelRenderer<BraintreeApplePayStylesConfigurationModel> {

    public static final String APPLE_PAY_BTN = "<apple-pay-button buttonstyle='%s' type='%s' " +
            "locale='en-US'></apple-pay-button>";

    @Override
    public void render(Component component, AbstractPanel abstractPanel,
                       BraintreeApplePayStylesConfigurationModel braintreeApplePayStylesConfigurationModel,
                       DataType dataType, WidgetInstanceManager widgetInstanceManager) {

        Html applePayButtonHtml = getApplePayButtonHtml(braintreeApplePayStylesConfigurationModel);
        component.appendChild(applePayButtonHtml);

        WidgetModel model = widgetInstanceManager.getModel();

        model.addObserver(VALUE_CHANGED, (ModelObserver) () -> {
            BraintreeApplePayStylesConfigurationModel currentRoot =
                    model.getValue(CURRENT_OBJECT_DOTLESS, BraintreeApplePayStylesConfigurationModel.class);
            if (nonNull(currentRoot)) {
                component.getChildren().forEach(component::removeChild);
                Html updatedApplePayButtonHtml = getApplePayButtonHtml(currentRoot);
                component.appendChild(updatedApplePayButtonHtml);
            }
        });

    }

    private Html getApplePayButtonHtml(BraintreeApplePayStylesConfigurationModel braintreeApplePayStylesConfigurationModel) {
        Html applePayButtonHtml = createHtml(String.format(APPLE_PAY_BTN,
                formatConfigurationParam(braintreeApplePayStylesConfigurationModel.getColor().name()),
                formatConfigurationParam(braintreeApplePayStylesConfigurationModel.getType().name())));
        applePayButtonHtml.setStyle(getShapeStyle(braintreeApplePayStylesConfigurationModel.getShape()));
        return applePayButtonHtml;
    }

    private String formatConfigurationParam(String param) {
        return param.replaceAll("_", "-").toLowerCase();
    }

    private String getShapeStyle(BraintreeApplePayShape shape) {
        if (shape.equals(BraintreeApplePayShape.PILL)) {
            return "--apple-pay-button-border-radius: 15pt";
        }
        return "--apple-pay-button-border-radius: 0pt";
    }

    protected Html createHtml(String content){
        return new Html(content);
    }

}
