import { Shape } from '../../shapes/Shape';
import { Style } from '../Style';
import { CustomStyles } from './CustomStyles';

export function customStyle(customStyles: CustomStyles) {
    return class CustomStyle extends Style {
        clone() {
            const ret = new (<typeof CustomStyle>this.constructor)();
            this.forEach((value: any, name: string) => {
                ret.set(name, customStyles.clone(value));
            });
            return ret;
        }

        merge(other: Style) {
            other.forEach((value: any, name: string) => {
                this.set(name, customStyles.clone(value));
            });
            return this;
        }

        render(context: CanvasRenderingContext2D, shape: Shape) {
            context.save();
            this.forEach((value: any, name: string) => {
                (<any>context)[name] = customStyles.toCanvasValue(value);
            });
            shape.draw(context, this.has('strokeStyle'), this.has('fillStyle'));
            context.restore();
            return this;
        }
    }
}

export type CustomStyle = ReturnType<typeof customStyle>;