import { BaseBrush } from "../BaseBrush";

/**
 * 阴影笔刷
 * 创建带有阴影效果的绘制，有深浅变化
 */
export class ShadedBrush extends BaseBrush {
  /**
   * 构造函数
   * @param {Object} canvas fabric画布实例
   * @param {Object} options 配置选项
   */
  constructor(canvas, options = {}) {
    super(canvas, {
      id: "shaded",
      name: options.t('Canvas.Shaded'),
      description: "创建带有阴影效果的绘制，适合素描和明暗表现",
      category: options.t('Canvas.PaintingBrush'),
      icon: "shaded",
      ...options,
    });

    // 阴影笔刷特有属性
    this.shadowColor = options.shadowColor || "#000000";
    this.shadowBlur = options.shadowBlur || 5;
    this.shadowOffsetX = options.shadowOffsetX || 2;
    this.shadowOffsetY = options.shadowOffsetY || 2;
    this.blendMode = options.blendMode || "multiply";
  }

  /**
   * 创建笔刷实例
   * @returns {Object} fabric笔刷实例
   */
  create() {
    if (!this.canvas) {
      throw new Error("画布实例不存在");
    }

    // 创建fabric原生阴影笔刷
    this.brush = new fabric.ShadedBrush(this.canvas);

    // 配置笔刷
    this.configure(this.brush, this.options);

    return this.brush;
  }

  /**
   * 配置笔刷
   * @param {Object} brush fabric笔刷实例
   * @param {Object} options 配置选项
   */
  configure(brush, options = {}) {
    if (!brush) return;

    // 基础属性配置
    if (options.width !== undefined) {
      brush.width = options.width;
    }

    if (options.color !== undefined) {
      brush.color = options.color;
    }

    if (options.opacity !== undefined) {
      brush.opacity = options.opacity;
    }

    // 阴影笔刷特有属性
    if (options.shadowColor !== undefined) {
      this.shadowColor = options.shadowColor;

      // 如果原生笔刷支持此属性，则设置
      if (brush.shadow) {
        brush.shadow.color = this.shadowColor;
      } else {
        brush.shadow = new fabric.Shadow({
          color: this.shadowColor,
          blur: this.shadowBlur,
          offsetX: this.shadowOffsetX,
          offsetY: this.shadowOffsetY,
        });
      }
    }

    if (options.shadowBlur !== undefined) {
      this.shadowBlur = options.shadowBlur;

      // 如果原生笔刷支持此属性，则设置
      if (brush.shadow) {
        brush.shadow.blur = this.shadowBlur;
      } else {
        brush.shadow = new fabric.Shadow({
          color: this.shadowColor,
          blur: this.shadowBlur,
          offsetX: this.shadowOffsetX,
          offsetY: this.shadowOffsetY,
        });
      }
    }

    if (options.shadowOffsetX !== undefined) {
      this.shadowOffsetX = options.shadowOffsetX;

      // 如果原生笔刷支持此属性，则设置
      if (brush.shadow) {
        brush.shadow.offsetX = this.shadowOffsetX;
      } else {
        brush.shadow = new fabric.Shadow({
          color: this.shadowColor,
          blur: this.shadowBlur,
          offsetX: this.shadowOffsetX,
          offsetY: this.shadowOffsetY,
        });
      }
    }

    if (options.shadowOffsetY !== undefined) {
      this.shadowOffsetY = options.shadowOffsetY;

      // 如果原生笔刷支持此属性，则设置
      if (brush.shadow) {
        brush.shadow.offsetY = this.shadowOffsetY;
      } else {
        brush.shadow = new fabric.Shadow({
          color: this.shadowColor,
          blur: this.shadowBlur,
          offsetX: this.shadowOffsetX,
          offsetY: this.shadowOffsetY,
        });
      }
    }

    if (options.blendMode !== undefined) {
      this.blendMode = options.blendMode;

      // 如果原生笔刷支持此属性，则设置
      if (brush.globalCompositeOperation !== undefined) {
        brush.globalCompositeOperation = this.blendMode;
      }
    }
  }

  /**
   * 设置阴影颜色
   * @param {String} color 颜色值
   */
  setShadowColor(color) {
    this.shadowColor = color;

    if (this.brush && this.brush.shadow) {
      this.brush.shadow.color = this.shadowColor;
    }

    return this.shadowColor;
  }

  /**
   * 设置阴影模糊值
   * @param {Number} blur 模糊值
   */
  setShadowBlur(blur) {
    this.shadowBlur = Math.max(0, Math.min(50, blur));

    if (this.brush && this.brush.shadow) {
      this.brush.shadow.blur = this.shadowBlur;
    }

    return this.shadowBlur;
  }

  /**
   * 设置阴影X偏移
   * @param {Number} offset X偏移值
   */
  setShadowOffsetX(offset) {
    this.shadowOffsetX = Math.max(-20, Math.min(20, offset));

    if (this.brush && this.brush.shadow) {
      this.brush.shadow.offsetX = this.shadowOffsetX;
    }

    return this.shadowOffsetX;
  }

  /**
   * 设置阴影Y偏移
   * @param {Number} offset Y偏移值
   */
  setShadowOffsetY(offset) {
    this.shadowOffsetY = Math.max(-20, Math.min(20, offset));

    if (this.brush && this.brush.shadow) {
      this.brush.shadow.offsetY = this.shadowOffsetY;
    }

    return this.shadowOffsetY;
  }

  /**
   * 设置混合模式
   * @param {String} mode 混合模式
   */
  setBlendMode(mode) {
    const validModes = [
      "normal",
      "multiply",
      "screen",
      "overlay",
      "darken",
      "lighten",
      "color-dodge",
      "color-burn",
      "hard-light",
      "soft-light",
      "difference",
      "exclusion",
      "hue",
      "saturation",
      "color",
      "luminosity",
    ];

    if (validModes.includes(mode)) {
      this.blendMode = mode;

      if (this.brush && this.brush.globalCompositeOperation !== undefined) {
        this.brush.globalCompositeOperation = this.blendMode;
      }
    }

    return this.blendMode;
  }

  /**
   * 获取笔刷可配置属性
   * @returns {Array} 可配置属性描述数组
   * @override
   */
  getConfigurableProperties() {
    // 获取基础属性
    const baseProperties = super.getConfigurableProperties();

    // 定义阴影笔刷特有属性
    const shadedProperties = [
      {
        id: "shadowColor",
        name: this.t('Canvas.ShadedColor'),
        type: "color",
        defaultValue: this.shadowColor,
        description: this.t('Canvas.ShadedColorDescription'),
        category: this.t('Canvas.ShadedSettings'),
        order: 100,
      },
      {
        id: "shadowBlur",
        name: this.t('Canvas.ShadedBlur'),
        type: "slider",
        defaultValue: this.shadowBlur,
        min: 0,
        max: 50,
        step: 1,
        description: this.t('Canvas.ShadedBlurDescription'),
        category: this.t('Canvas.ShadedSettings'),
        order: 110,
      },
      {
        id: "shadowOffsetX",
        name: this.t('Canvas.ShadedOffsetX'),
        type: "slider",
        defaultValue: this.shadowOffsetX,
        min: -20,
        max: 20,
        step: 1,
        description: this.t('Canvas.ShadedOffsetXDescription'),
        category: this.t('Canvas.ShadedSettings'),
        order: 120,
      },
      {
        id: "shadowOffsetY",
        name: this.t('Canvas.ShadedOffsetY'),
        type: "slider",
        defaultValue: this.shadowOffsetY,
        min: -20,
        max: 20,
        step: 1,
        description: this.t('Canvas.ShadedOffsetYDescription'),
        category: this.t('Canvas.ShadedSettings'),
        order: 130,
      },
      {
        id: "blendMode",
        name: this.t('Canvas.ShadedMixedModel'),
        type: "select",
        defaultValue: this.blendMode,
        options: [
          { value: "normal", label: this.t('Canvas.ShadedMixedModelNormal') },
          { value: "multiply", label: this.t('Canvas.ShadedMixedModelMultiply') },
          { value: "screen", label: this.t('Canvas.ShadedMixedModelScreen') },
          { value: "overlay", label: this.t('Canvas.ShadedMixedModelOverlay') },
          { value: "darken", label: this.t('Canvas.ShadedMixedModelDarken') },
          { value: "lighten", label: this.t('Canvas.ShadedMixedModelLighten') },
          { value: "color-dodge", label: this.t('Canvas.ShadedMixedModelColorDodge') },
          { value: "color-burn", label: this.t('Canvas.ShadedMixedModelColorBurn') },
          { value: "hard-light", label: this.t('Canvas.ShadedMixedModelHardLight') },
          { value: "soft-light", label: this.t('Canvas.ShadedMixedModelSoftLight') },
          { value: "difference", label: this.t('Canvas.ShadedMixedModelDifference') },
          { value: "exclusion", label: this.t('Canvas.ShadedMixedModelExclusion') },
        ],
        description: this.t('Canvas.ShadedMixedModelDescription'),
        category: this.t('Canvas.ShadedSettings'),
        order: 140,
      },
    ];

    // 合并并返回所有属性
    return [...baseProperties, ...shadedProperties];
  }

  /**
   * 更新笔刷属性
   * @param {String} propId 属性ID
   * @param {any} value 属性值
   * @returns {Boolean} 是否更新成功
   * @override
   */
  updateProperty(propId, value) {
    // 先检查基类能否处理此属性
    if (super.updateProperty(propId, value)) {
      return true;
    }

    // 处理阴影笔刷特有属性
    if (propId === "shadowColor") {
      this.setShadowColor(value);
      return true;
    } else if (propId === "shadowBlur") {
      this.setShadowBlur(value);
      return true;
    } else if (propId === "shadowOffsetX") {
      this.setShadowOffsetX(value);
      return true;
    } else if (propId === "shadowOffsetY") {
      this.setShadowOffsetY(value);
      return true;
    } else if (propId === "blendMode") {
      this.setBlendMode(value);
      return true;
    }

    return false;
  }

  /**
   * 获取预览图
   * @returns {String} 预览图URL
   */
  getPreview() {
    return "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48Y2lyY2xlIGN4PSI0MCIgY3k9IjQwIiByPSIyMCIgZmlsbD0iIzY2NiIvPjxjaXJjbGUgY3g9IjQ1IiBjeT0iNDUiIHI9IjIwIiBmaWxsPSIjMDAwIi8+PHBhdGggZD0iTTIwIDgwQzMwIDYwIDUwIDcwIDcwIDUwIiBzdHJva2U9IiMwMDAiIHN0cm9rZS13aWR0aD0iOCIgZmlsbD0ibm9uZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PHBhdGggZD0iTTIzIDgzQzMzIDYzIDUzIDczIDczIDUzIiBzdHJva2U9IiM2NjYiIHN0cm9rZS13aWR0aD0iOCIgZmlsbD0ibm9uZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PC9zdmc+";
  }
}
