from wagtail import hooks
import wagtail.admin.rich_text.editors.draftail.features as draftail_features
from wagtail.admin.rich_text.converters.html_to_contentstate import BlockElementHandler, InlineStyleElementHandler

@hooks.register('register_rich_text_features')
def register_alignment_feature(features):
    alignment_features = ['left', 'center', 'right']
    labels = {
        'left': 'L',
        'center': 'C',
        'right': 'R'
    }

    for feature in alignment_features:
        control = {
            'label': labels[feature],
            'type': feature,
            'description': f'Align {feature}',
        }
        features.register_editor_plugin(
            'draftail', feature, draftail_features.BlockFeature(control)
        )
        features.register_converter_rule(
            'contentstate', feature, {
                'from_database_format': {
                    f'div[style="text-align: {feature}"]': BlockElementHandler(feature)
                },
                'to_database_format': {
                    'block_map': {
                        feature: {
                            'element': 'div',
                            'props': {'style': f'text-align: {feature}'}
                        }
                    }
                }
            }
        )

@hooks.register('register_rich_text_features')
def register_color_feature(features):
    colors = [
        ('black', '#000000', 'CB'),
        ('saburly-blue', '#5763AB', 'CS')
    ]

    for feature_name, color_code, label in colors:
        control = {
            'type': feature_name,
            'label': label,
            'description': f'Text color: {feature_name}',
            'style': {'color': color_code},
        }

        features.register_editor_plugin(
            'draftail',
            feature_name,
            draftail_features.InlineStyleFeature(control),
        )

        features.register_converter_rule('contentstate', feature_name, {
            'from_database_format': {
                f'span[style="color: {color_code}"]': InlineStyleElementHandler(feature_name),
            },
            'to_database_format': {
                'style_map': {
                    feature_name: {
                        'element': 'span',
                        'props': {'style': f'color: {color_code}'}
                    }
                }
            }
        })