import { ObjectLike, create, has } from '../../core/object';
import { Shape } from '../shapes/Shape';

export class Style extends Map<string, any> {
    constructor(attributes?: ObjectLike<any>) {
        super();
        this.setAttributes(attributes);
    }

    get direction() {
        return this.get('direction') as CanvasDirection;
    }

    set direction(value: CanvasDirection) {
        this.set('direction', value);
    }

    get fillStyle() {
        return this.get('fillStyle') as string | CanvasGradient | CanvasPattern;
    }

    set fillStyle(value: string | CanvasGradient | CanvasPattern) {
        this.set('fillStyle', value);
    }

    get filter() {
        return this.get('filter') as string;
    }

    set filter(value: string) {
        this.set('filter', value);
    }

    get font() {
        return this.get('font') as string;
    }

    set font(value: string) {
        this.set('font', value);
    }

    get globalAlpha() {
        return this.get('globalAlpha') as number;
    }

    set globalAlpha(value: number) {
        this.set('globalAlpha', value);
    }

    get globalCompositeOperation() {
        return this.get('globalCompositeOperation') as string;
    }

    set globalCompositeOperation(value: string) {
        this.set('globalCompositeOperation', value);
    }

    get imageSmoothingEnabled() {
        return this.get('imageSmoothingEnabled') as boolean;
    }

    set imageSmoothingEnabled(value: boolean) {
        this.set('imageSmoothingEnabled', value);
    }

    get imageSmoothingQuality() {
        return this.get('imageSmoothingQuality') as ImageSmoothingQuality;
    }

    set imageSmoothingQuality(value: ImageSmoothingQuality) {
        this.set('imageSmoothingQuality', value);
    }

    get lineCap() {
        return this.get('lineCap') as string;
    }

    set lineCap(value: string) {
        this.set('lineCap', value);
    }

    get lineDashOffset() {
        return this.get('lineDashOffset') as number;
    }

    set lineDashOffset(value: number) {
        this.set('lineDashOffset', value);
    }

    get lineJoin() {
        return this.get('lineJoin') as string;
    }

    set lineJoin(value: string) {
        this.set('lineJoin', value);
    }

    get lineWidth() {
        return this.get('lineWidth') as number;
    }

    set lineWidth(value: number) {
        this.set('lineWidth', value);
    }

    get miterLimit() {
        return this.get('miterLimit') as number;
    }

    set miterLimit(value: number) {
        this.set('miterLimit', value);
    }

    get shadowBlur() {
        return this.get('shadowBlur') as number;
    }

    set shadowBlur(value: number) {
        this.set('shadowBlur', value);
    }

    get shadowColor() {
        return this.get('shadowColor') as string;
    }

    set shadowColor(value: string) {
        this.set('shadowColor', value);
    }

    get shadowOffsetX() {
        return this.get('shadowOffsetX') as number;
    }

    set shadowOffsetX(value: number) {
        this.set('shadowOffsetX', value);
    }

    get shadowOffsetY() {
        return this.get('shadowOffsetY') as number;
    }

    set shadowOffsetY(value: number) {
        this.set('shadowOffsetY', value);
    }

    get strokeStyle() {
        return this.get('strokeStyle') as string | CanvasGradient | CanvasPattern;
    }

    set strokeStyle(value: string | CanvasGradient | CanvasPattern) {
        this.set('strokeStyle', value);
    }

    get textAlign() {
        return this.get('textAlign') as string;
    }

    set textAlign(value: string) {
        this.set('textAlign', value);
    }

    get textBaseline() {
        return this.get('textBaseline') as string;
    }

    set textBaseline(value: string) {
        this.set('textBaseline', value);
    }

    attributes() {
        const ret = create();
        this.forEach((value: any, name: string) => {
            ret[name] = value;
        });
        return ret;
    }

    setAttributes(attributes?: ObjectLike<any>) {
        this.clear();
        if (typeof attributes === 'object' && attributes !== null)
            for (const key in attributes)
                if (has(attributes, key))
                    this.set(key, attributes[key]);
    }

    clone() {
        const ret = new (<typeof Style>this.constructor)();
        this.forEach((value: any, name: string) => {
            ret.set(name, value);
        });
        return ret;
    }

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

    merged(other: Style) {
        return this.clone().merge(other);
    }

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

    static create(attributes?: ObjectLike<any>) {
        return new Style(attributes);
    }
}