@playcraft/skills 0.0.2

package/skills/tray_container.aicomponent/ref/TrayRendererHtmlOverlay.ts

@@ -0,0 +1,228 @@
+/**
+ * HTML Overlay 模式的篮子/托盘渲染器
+ * 使用 CSS + DOM 实现，固定在屏幕底部。
+ * 适用于 Three.js 3D 项目中不需要 3D 深度的 UI 组件。
+ *
+ * 优点：
+ * - 性能好（不占用 WebGL 渲染管线）
+ * - CSS transition 动画流畅
+ * - 易于样式定制
+ * - 不受 3D 相机变换影响
+ */
+
+export interface TrayItem {
+  id: string;
+  color: string; // 颜色标识
+}
+
+export interface TrayConfig {
+  capacity: number;
+  matchDuration?: number;    // 消除动画时长 ms，默认 300
+  rearrangeDuration?: number; // 重排动画时长 ms，默认 200
+  shakeAmount?: number;      // 抖动幅度 px，默认 8
+  slotSize?: number;         // 槽位大小 px，默认 48
+  trayPadding?: number;      // 篮子内边距 px，默认 8
+  colorToHex: (color: string) => string; // 颜色标识 → CSS hex 颜色
+}
+
+export class TrayRendererHtmlOverlay {
+  private container!: HTMLDivElement;
+  private slotsContainer!: HTMLDivElement;
+  private items: Map<string, HTMLDivElement> = new Map();
+  private config: Required<TrayConfig>;
+  private capacity: number;
+
+  constructor(config: TrayConfig) {
+    this.capacity = config.capacity;
+    this.config = {
+      capacity: config.capacity,
+      matchDuration: config.matchDuration ?? 300,
+      rearrangeDuration: config.rearrangeDuration ?? 200,
+      shakeAmount: config.shakeAmount ?? 8,
+      slotSize: config.slotSize ?? 48,
+      trayPadding: config.trayPadding ?? 8,
+      colorToHex: config.colorToHex,
+    };
+  }
+
+  /**
+   * 创建 DOM 结构并注入到页面
+   * @param parentId 父容器 ID（通常是 'game-container'）
+   */
+  setup(parentId: string = "game-container"): void {
+    const parent = document.getElementById(parentId) || document.body;
+
+    // 创建外层容器
+    this.container = document.createElement("div");
+    this.container.id = "tray-overlay";
+    this.container.style.cssText = `
+      position: fixed;
+      bottom: env(safe-area-inset-bottom, 16px);
+      left: 50%;
+      transform: translateX(-50%);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      z-index: 1000;
+      pointer-events: none;
+    `;
+
+    // 创建篮子背景
+    const bg = document.createElement("div");
+    bg.style.cssText = `
+      background: rgba(22, 33, 62, 0.9);
+      border-radius: 12px;
+      padding: ${this.config.trayPadding}px;
+      backdrop-filter: blur(8px);
+      border: 1px solid rgba(61, 61, 92, 0.5);
+    `;
+
+    // 创建槽位容器
+    this.slotsContainer = document.createElement("div");
+    this.slotsContainer.style.cssText = `
+      display: flex;
+      gap: 4px;
+      min-width: ${this.capacity * (this.config.slotSize + 4)}px;
+      height: ${this.config.slotSize}px;
+      position: relative;
+    `;
+
+    // 绘制槽位分隔线
+    for (let i = 0; i < this.capacity; i++) {
+      const slot = document.createElement("div");
+      slot.style.cssText = `
+        width: ${this.config.slotSize}px;
+        height: ${this.config.slotSize}px;
+        border-right: ${i < this.capacity - 1 ? "1px solid rgba(61, 61, 92, 0.5)" : "none"};
+        flex-shrink: 0;
+      `;
+      this.slotsContainer.appendChild(slot);
+    }
+
+    bg.appendChild(this.slotsContainer);
+    this.container.appendChild(bg);
+    parent.appendChild(this.container);
+  }
+
+  /**
+   * 获取指定槽位的屏幕位置（相对于视口）
+   */
+  getSlotScreenPos(index: number): { x: number; y: number } {
+    const slotEl = this.slotsContainer.children[index] as HTMLElement;
+    if (!slotEl) return { x: 0, y: 0 };
+    const rect = slotEl.getBoundingClientRect();
+    return {
+      x: rect.left + rect.width / 2,
+      y: rect.top + rect.height / 2,
+    };
+  }
+
+  /**
+   * 添加物品到指定槽位
+   */
+  addItem(item: TrayItem, index: number): HTMLDivElement {
+    const el = document.createElement("div");
+    el.dataset.itemId = item.id;
+    const size = this.config.slotSize * 0.75;
+    el.style.cssText = `
+      position: absolute;
+      width: ${size}px;
+      height: ${size}px;
+      border-radius: 50%;
+      background: ${this.config.colorToHex(item.color)};
+      box-shadow: 0 2px 8px rgba(0,0,0,0.3), inset 0 -2px 4px rgba(0,0,0,0.2);
+      transition: transform ${this.config.rearrangeDuration}ms ease, left ${this.config.rearrangeDuration}ms ease;
+      transform: scale(0);
+      top: ${(this.config.slotSize - size) / 2}px;
+      left: ${this.getSlotLeft(index, size)}px;
+    `;
+
+    this.slotsContainer.appendChild(el);
+    this.items.set(item.id, el);
+
+    // 弹入动画
+    requestAnimationFrame(() => {
+      el.style.transform = "scale(1)";
+    });
+
+    return el;
+  }
+
+  /**
+   * 重新排列所有物品到正确位置
+   */
+  rearrangeItems(tray: TrayItem[]): void {
+    const size = this.config.slotSize * 0.75;
+    for (let i = 0; i < tray.length; i++) {
+      const el = this.items.get(tray[i].id);
+      if (!el) continue;
+      el.style.left = `${this.getSlotLeft(i, size)}px`;
+    }
+  }
+
+  /**
+   * 消除匹配的物品（放大 + 淡出）
+   */
+  removeMatchedItems(matchedIds: string[], onComplete: () => void): void {
+    let completed = 0;
+    const total = matchedIds.length;
+
+    for (const id of matchedIds) {
+      const el = this.items.get(id);
+      if (!el) {
+        completed++;
+        if (completed >= total) onComplete();
+        continue;
+      }
+
+      el.style.transition = `transform ${this.config.matchDuration}ms ease, opacity ${this.config.matchDuration}ms ease`;
+      el.style.transform = "scale(1.3)";
+      el.style.opacity = "0";
+
+      setTimeout(() => {
+        el.remove();
+        this.items.delete(id);
+        completed++;
+        if (completed >= total) onComplete();
+      }, this.config.matchDuration);
+    }
+  }
+
+  /**
+   * 满溢抖动动画
+   */
+  shake(): void {
+    const amount = this.config.shakeAmount;
+    this.container.style.transition = "none";
+    let shakeCount = 0;
+    const maxShakes = 6;
+    const interval = 50;
+
+    const doShake = () => {
+      if (shakeCount >= maxShakes) {
+        this.container.style.transform = "translateX(-50%)";
+        return;
+      }
+      const offset = shakeCount % 2 === 0 ? amount : -amount;
+      this.container.style.transform = `translateX(calc(-50% + ${offset}px))`;
+      shakeCount++;
+      setTimeout(doShake, interval);
+    };
+    doShake();
+  }
+
+  /**
+   * 销毁 DOM 元素
+   */
+  destroy(): void {
+    this.container?.remove();
+    this.items.clear();
+  }
+
+  // ── 内部方法 ──
+
+  private getSlotLeft(index: number, itemSize: number): number {
+    const slotWidth = this.config.slotSize + 4; // gap included
+    return index * slotWidth + (this.config.slotSize - itemSize) / 2;
+  }
+}

package/skills/tutorial_overlay.aicomponent/SKILL.md

@@ -0,0 +1,46 @@
+---
+name: tutorial_overlay.aicomponent
+description: 新手引导浮层。在第一、二关展示步进式操作引导（高亮指定路径 + 手指动画），帮助玩家快速理解点击消除玩法。
+triggers: 需要实现试玩广告的新手引导或操作提示浮层时触发。
+---
+
+# 新手引导浮层（Tutorial Overlay）
+
+**指引层深度、遮罩/挖洞/手指缩放合同** 见 `playable_guidance_layer.aicomponent`；与顶栏关系见 `playable_hud_layout.aicomponent`。
+
+## Scaffold
+
+`src/game/scenes/GameUI/TutorialManager.ts`
+
+## Recipe
+
+| 决策 | 原因 |
+|------|------|
+| **仅在前 1-2 关激活** | 新手引导覆盖太多关卡会让熟悉玩法的用户烦躁；仅第一、二关引导，之后让玩家自由探索 |
+| **高亮+手指组合** | 单独高亮目标路径告诉玩家"点哪里"，手指动画告诉玩家"怎么操作"；两者配合降低学习门槛 |
+| **软槽位 tutorialPointer** | 不同 Remix 可以有不同风格的引导手指图（卡通、写实等）；软槽位允许资产替换 |
+
+## Adapter
+
+- **Role**: `tutorialOverlay` — 前 1-2 关步进式新手引导浮层（高亮路径 + 手指动画）
+- **Provides**: `TutorialManager` 类（步进状态机，`startTutorial(level)`、`onPathEliminated(pathIndex)`）
+- **Requires**: `phaser.aicomponent`、`tutorialPointer`（软槽位：引导手指图标）
+- **Consumed by**: `game_scene.aicomponent`（在 `create()` 中实例化，前两关激活；InputHandler 的消除回调中调用 `onPathEliminated`）
+- **Integration point**: `src/game/scenes/GameUI/TutorialManager.ts` → `Game.create()` 中条件初始化
+
+## Imports
+
+- `phaser.aicomponent`（硬依赖）
+- `tutorialPointer`（软槽位：引导手指图标，可替换）
+
+## Skill Definition
+
+```yaml
+tools:
+  - read_file
+  - write_file
+inputs:
+  - source: src/game/scenes/GameUI/TutorialManager.ts
+outputs:
+  - tutorialManager: TutorialManager class
+```

package/skills/tutorial_overlay.aicomponent/manifest.json

@@ -0,0 +1,34 @@
+{
+  "schemaVersion": 1,
+  "atomId": "tutorial_overlay.aicomponent",
+  "bundleType": "aicomponent",
+  "category": "component",
+  "mode": "fixed",
+  "label": { "zh": "新手引导浮层", "en": "Tutorial overlay" },
+  "tags": ["ui", "tutorial", "onboarding", "guide", "first-level"],
+  "bindingRoles": ["tutorialOverlay"],
+  "scaffold": {
+    "files": {
+      "src/game/scenes/GameUI/TutorialManager.ts": { "source": "ref/TutorialManager.ts", "mode": "full", "weight": 10 }
+    }
+  },
+  "imports": [
+    { "slot": "engine", "pinAtomId": "phaser.aicomponent", "edgeKind": "requires", "bindAs": "engine" },
+    {
+      "slot": "tutorialPointer",
+      "description": "引导手指图标",
+      "bindAs": "fingerTexture",
+      "required": false,
+      "edgeKind": "compatibleWith",
+      "matchBindingRoles": ["tutorialPointer"],
+      "allowedBundleTypes": ["aiimage"]
+    }
+  ],
+  "exports": [
+    { "name": "TutorialManager", "kind": "class", "location": "src/game/scenes/GameUI/TutorialManager.ts" }
+  ],
+  "neutralDescriptor": {
+    "geometry": "step-by-step tutorial overlay for the first 1-2 levels, highlighting specific paths to tap with animated finger indicator"
+  },
+  "files": { "skill": "SKILL.md", "tutorialManager": "ref/TutorialManager.ts" }
+}

package/skills/tutorial_overlay.aicomponent/ref/TutorialManager.ts

@@ -0,0 +1,367 @@
+import * as Phaser from "phaser";
+import { GAME_TOP_UI_BAR_HEIGHT } from "./GameTopUI";
+import { computeUiLayout } from "../../utils/UiLayout";
+import {
+  ENABLE_ZOOM_GESTURE_GUIDE,
+  AUTO_USE_HINT_ON_START,
+} from "../../DebugConfig";
+
+/**
+ * 描述 TutorialManager 从 Game 场景中所需内容的最小接口。
+ * 避免模块级别的循环导入。
+ */
+export interface TutorialGameRef extends Phaser.Scene {
+  level: any; // ParsedLevel | null
+  boardContainer: Phaser.GameObjects.Container | null;
+  visualSize: number;
+  isLevelOne: boolean;
+  isLevelTwo: boolean;
+  removedPaths: Set<number>;
+  animatingPaths: Set<number>;
+  cellCenter(col: number, row: number): { x: number; y: number };
+  renderHintOverlay(): void;
+  findRemovablePathIndex(): number | null;
+  isCellOccupiedByAnyPath(
+    col: number,
+    row: number,
+    ignorePath: number,
+  ): boolean;
+}
+
+/**
+ * 教程管理器。
+ * 负责管理第一关教程引导、提示高亮、第二关缩放手势引导等。
+ */
+export class TutorialManager {
+  private scene: TutorialGameRef;
+
+  // ── 提示高亮状态 ──
+  hintHighlightTween: Phaser.Tweens.Tween | null = null;
+  hintTargetIndex: number | null = null;
+  hintPulseScale = 1;
+  hintFingerContainer: Phaser.GameObjects.Container | null = null;
+  hintFingerTween: Phaser.Tweens.Tween | null = null;
+  hintFingerMoveTween: Phaser.Tweens.Tween | null = null;
+
+  // ── 第一关教程状态 ──
+  isLevelOneTutorialActive = false;
+  levelOneTutorialExpectedPathIndex: number | null = null;
+
+  // ── 第二关缩放引导状态 ──
+  isLevelTwoZoomGuideActive = false;
+  hasLevelTwoZoomGuideShown = false;
+  private levelTwoZoomGuideBoardContainer: Phaser.GameObjects.Container | null =
+    null;
+  private levelTwoZoomGuideTextContainer: Phaser.GameObjects.Container | null =
+    null;
+
+  constructor(scene: TutorialGameRef) {
+    this.scene = scene;
+  }
+
+  // ── 生命周期 ──────────────────────────────────────────────
+
+  /**
+   * 重置所有教程状态。在每关开始时调用。
+   */
+  resetState(): void {
+    this.clearHintHighlight();
+    this.hideLevelTwoZoomGuide();
+    this.isLevelOneTutorialActive = false;
+    this.levelOneTutorialExpectedPathIndex = null;
+    this.hasLevelTwoZoomGuideShown = false;
+    this.isLevelTwoZoomGuideActive = false;
+  }
+
+  // ── 提示高亮 ─────────────────────────────────────────
+
+  /** 清除当前的提示高亮效果及手指动画。 */
+  clearHintHighlight(): void {
+    if (this.hintHighlightTween) {
+      this.hintHighlightTween.stop();
+      this.hintHighlightTween = null;
+    }
+    if (this.hintFingerTween) {
+      this.hintFingerTween.stop();
+      this.hintFingerTween = null;
+    }
+    if (this.hintFingerMoveTween) {
+      this.hintFingerMoveTween.stop();
+      this.hintFingerMoveTween = null;
+    }
+    if (this.hintFingerContainer) {
+      this.hintFingerContainer.destroy();
+      this.hintFingerContainer = null;
+    }
+    if (this.hintTargetIndex !== null) {
+      this.hintTargetIndex = null;
+      this.hintPulseScale = 1;
+      this.scene.renderHintOverlay();
+    }
+  }
+
+  /**
+   * 显示指定路径的提示高亮效果，包括手指图标和脉冲动画。
+   * @param pathIndex 需要高亮的路径索引
+   */
+  showHintHighlight(pathIndex: number): void {
+    const scene = this.scene;
+    if (!scene.level) return;
+
+    // 清除旧的提示效果（如果有）
+    this.clearHintHighlight();
+
+    const isTutorial = this.isLevelOneTutorialActive;
+
+    this.hintTargetIndex = pathIndex;
+    this.hintPulseScale = isTutorial ? 1 : 1.25;
+    scene.renderHintOverlay();
+
+    const level = scene.level;
+
+    let hintDirection: "left" | "right" | "up" | "down" = "right";
+    let headCenter: { x: number; y: number } | null = null;
+
+    const path = level.paths[pathIndex]!;
+    const headCell = path.head;
+    headCenter = scene.cellCenter(headCell.x, headCell.y);
+    hintDirection = path.direction;
+
+    if (!headCenter) return;
+
+    // 所有提示（包括教程和道具提示）都显示手指+光环；
+    // 但只有非教程提示会对箭头/路径进行脉冲缩放。
+    if (scene.boardContainer) {
+      const fingerContainer = scene.add.container(headCenter.x, headCenter.y);
+      scene.boardContainer.add(fingerContainer);
+      scene.boardContainer.bringToTop(fingerContainer);
+      this.hintFingerContainer = fingerContainer;
+
+      const finger = scene.add.image(0, 0, "figer");
+      finger.setOrigin(0, 0);
+      // 使用 visualSize 而非 cellSize 来放大手指显示
+      const fingerMaxSize = scene.visualSize * 5;
+      const fingerBaseScale = Math.min(
+        fingerMaxSize / (finger.width || 1),
+        fingerMaxSize / (finger.height || 1),
+      );
+      let fingerScale = fingerBaseScale;
+      if (isTutorial) {
+        // 教程模式下手指缩小 1/3
+        fingerScale *= 2 / 3;
+      }
+      finger.setScale(fingerScale);
+
+      const moveOffsetX = scene.visualSize * 0.4;
+      const moveOffsetY = scene.visualSize * 0.4;
+      let fingerRotation = 0;
+
+      if (hintDirection === "down") {
+        fingerRotation = Math.PI;
+      }
+
+      finger.setRotation(fingerRotation);
+
+      const fingerOffsetX = moveOffsetX;
+      finger.setFlipX(false);
+      finger.setPosition(fingerOffsetX, moveOffsetY);
+
+      // 仅添加手指，不添加黄色圆圈
+      fingerContainer.add([finger]);
+
+      // Google 渠道不显示手指移动动画
+      const isGoogleChannel =
+        (window as any).PlayableSDK?.getCurChannel?.() === "google";
+      if (!isGoogleChannel) {
+        this.hintFingerMoveTween = scene.tweens.add({
+          targets: finger,
+          x: { from: fingerOffsetX, to: 0 },
+          y: { from: moveOffsetY, to: 0 },
+          duration: 650,
+          ease: "Sine.easeInOut",
+          yoyo: true,
+          repeat: -1,
+        });
+      } else {
+        // Google 渠道：手指静止在目标位置
+        finger.setPosition(0, 0);
+      }
+    }
+
+    // 非教程模式下添加脉冲缩放动画
+    if (!isTutorial) {
+      this.hintHighlightTween = scene.tweens.add({
+        targets: this,
+        hintPulseScale: { from: 1.25, to: 0.9 },
+        duration: 450,
+        ease: "Sine.easeInOut",
+        yoyo: true,
+        repeat: -1,
+        onUpdate: () => {
+          scene.renderHintOverlay();
+        },
+      });
+    }
+  }
+
+  // ── 第一关教程 ─────────────────────────────────────
+
+  /** 启动第一关教程引导，显示第一个可消除路径的提示。 */
+  startLevelOneTutorial(): void {
+    const scene = this.scene;
+    if (!scene.level || !scene.isLevelOne) {
+      return;
+    }
+
+    this.isLevelOneTutorialActive = true;
+
+    const nextIndex = this.findNextLevelOneTutorialPathIndex();
+    if (nextIndex === null) {
+      this.isLevelOneTutorialActive = false;
+      this.levelOneTutorialExpectedPathIndex = null;
+      return;
+    }
+
+    this.levelOneTutorialExpectedPathIndex = nextIndex;
+    this.showHintHighlight(nextIndex);
+  }
+
+  /** 推进第一关教程到下一个可消除路径。 */
+  advanceLevelOneTutorial(): void {
+    const scene = this.scene;
+    if (!scene.level || !scene.isLevelOne) {
+      return;
+    }
+
+    const nextIndex = this.findNextLevelOneTutorialPathIndex();
+    if (nextIndex === null) {
+      this.isLevelOneTutorialActive = false;
+      this.levelOneTutorialExpectedPathIndex = null;
+      this.clearHintHighlight();
+      return;
+    }
+
+    this.levelOneTutorialExpectedPathIndex = nextIndex;
+    this.showHintHighlight(nextIndex);
+  }
+
+  /**
+   * 查找下一个可消除的路径索引（用于教程引导）。
+   * @returns 下一个可消除的路径索引，未找到返回 null
+   */
+  private findNextLevelOneTutorialPathIndex(): number | null {
+    return this.scene.findRemovablePathIndex();
+  }
+
+  // ── 开始时自动使用提示 ────────────────────────────────────
+
+  /** 关卡开始时自动显示一个可消除路径的提示高亮。 */
+  autoUseHintOnStart(): void {
+    const scene = this.scene;
+    if (!scene.level) return;
+
+    console.log(
+      "[提示] autoUseHintOnStart 调用, levelIndex =",
+      scene.level.index,
+    );
+
+    const targetIndex = scene.findRemovablePathIndex();
+    console.log("[提示] 自动提示 - findRemovablePathIndex 结果 =", targetIndex);
+
+    if (targetIndex === null) {
+      console.log("[提示] 自动提示 - 未找到可消除的路径");
+      return;
+    }
+
+    // 直接显示提示高亮，不调用服务器API
+    this.showHintHighlight(targetIndex);
+    console.log("[提示] 自动提示已显示，路径索引:", targetIndex);
+  }
+
+  // ── 第二关缩放手势引导 ──────────────────────────────────
+
+  /** 显示第二关的缩放手势引导（双指缩放提示文字）。 */
+  showLevelTwoZoomGuide(): void {
+    const scene = this.scene;
+    // 检查配置中是否启用了手势引导
+    if (!ENABLE_ZOOM_GESTURE_GUIDE) {
+      return;
+    }
+
+    if (!scene.level || !scene.boardContainer) {
+      return;
+    }
+    console.log("hasLevelTwoZoomGuideShown", this.hasLevelTwoZoomGuideShown);
+
+    if (!scene.isLevelTwo || this.hasLevelTwoZoomGuideShown) {
+      return;
+    }
+
+    this.isLevelTwoZoomGuideActive = true;
+    this.hasLevelTwoZoomGuideShown = true;
+
+    const boardGuide = scene.add.container(0, 0);
+    scene.boardContainer.add(boardGuide);
+    scene.boardContainer.bringToTop(boardGuide);
+    this.levelTwoZoomGuideBoardContainer = boardGuide;
+
+    const layout = computeUiLayout(scene);
+    const { width, uiScale, vScale } = layout;
+    const textY = GAME_TOP_UI_BAR_HEIGHT * vScale + 55 * vScale;
+
+    const textContainer = scene.add.container(width / 2, textY);
+    textContainer.setScrollFactor(0);
+    textContainer.setDepth(1500);
+
+    const message = "双指捏合可以缩放棋盘。";
+    const text = scene.add.text(0, 0, message, {
+      fontFamily: "Poppins",
+      fontSize: `${34 * uiScale}px`,
+      color: "#ffffff",
+      fontStyle: "bold",
+      align: "center",
+    });
+    text.setOrigin(0.5, 0.5);
+
+    const paddingX = 18 * uiScale;
+    const paddingY = 8 * vScale;
+    const maxBgWidth = width * 0.9;
+    const maxTextWidth = Math.max(10, maxBgWidth - paddingX * 2);
+
+    if (text.displayWidth > maxTextWidth) {
+      text.setWordWrapWidth(maxTextWidth);
+      text.setAlign("center");
+    }
+
+    const bgWidth = Math.min(maxBgWidth, text.displayWidth + paddingX * 2);
+    const bgHeight = text.displayHeight + paddingY * 2;
+
+    const bg = scene.add.rectangle(0, 0, bgWidth, bgHeight, 0xff7a3c, 0.96);
+    textContainer.add([bg, text]);
+
+    this.levelTwoZoomGuideTextContainer = textContainer;
+  }
+
+  /** 隐藏第二关缩放手势引导，销毁相关容器。 */
+  hideLevelTwoZoomGuide(): void {
+    if (
+      !this.isLevelTwoZoomGuideActive &&
+      !this.levelTwoZoomGuideBoardContainer &&
+      !this.levelTwoZoomGuideTextContainer
+    ) {
+      return;
+    }
+
+    this.isLevelTwoZoomGuideActive = false;
+
+    if (this.levelTwoZoomGuideBoardContainer) {
+      this.levelTwoZoomGuideBoardContainer.destroy();
+      this.levelTwoZoomGuideBoardContainer = null;
+    }
+
+    if (this.levelTwoZoomGuideTextContainer) {
+      this.levelTwoZoomGuideTextContainer.destroy();
+      this.levelTwoZoomGuideTextContainer = null;
+    }
+  }
+}