按鈕尋找開源項目

描述

關于

Find the Button 是一款簡單的游戲，卻提供了驚人的樂趣！在這個游戲中，一個玩家隱藏一個回聲按鈕，另一個玩家去找到它。這對小孩子來說特別有趣！我兩歲的兒子喜歡跑來跑去，從閃爍的燈光中找出按鈕的位置。

要玩游戲，您只需在隱藏或找到它時按一下按鈕即可。每個動作有 30 秒的時間，以努力提高游戲的速度和節奏。

啟動技能并啟動后，整個游戲循環只需一個按鈕即可操作！無需語音！您當然可以隨時尋求幫助。

此外，由于這是一項不明確依賴于播放按鈕顏色的技能，您可以隨時禁用和啟用按鈕燈。我為那些可能對閃光燈敏感的人加入了這個功能，但在我這樣做之后我意識到它也大大增加了找到按鈕的挑戰。

執行

我使用 Typescript 和 ask-sdk v2 來提高我的技能，并將我的代碼托管在 AWS Lambda 上。

我喜歡盡可能地劃分我的代碼，所以我的處理程序索引文件總是相當簡單：

import { SkillBuilders } from 'ask-sdk';import { RequestHandlers, ErrorHandlers } from './handlers';import { RequestInterceptors } from './request-interceptors';import { ResponseInterceptors } from './response-interceptors';const skillBuilder = SkillBuilders.custom();export const handler = skillBuilder    .addRequestInterceptors(...RequestInterceptors)    .addRequestHandlers(...RequestHandlers)    .addErrorHandlers(...ErrorHandlers)    .addResponseInterceptors(...ResponseInterceptors)    .lambda();

我有處理程序和攔截器的索引文件，所以我可以像這樣同時導入所有處理程序。這是 RequestHandlers 索引文件：

import { RollCallStateRequestHandlers } from './RollCallState';import { GenericRequestHandlers, GenericErrorHandlers } from './Stateless';import { HideButtonStateRequestHandlers } from './HideButtonState';import { FindButtonStateRequestHandlers } from './FindButtonState';import { GameOverStateRequestHandlers } from './GameOverState';import { LaunchStateRequestHandlers } from './LaunchState';export const RequestHandlers = [ ...LaunchStateRequestHandlers, ...RollCallStateRequestHandlers, ...HideButtonStateRequestHandlers, ...FindButtonStateRequestHandlers, ...GameOverStateRequestHandlers, ...GenericRequestHandlers];export const ErrorHandlers = [ ...GenericErrorHandlers];

我將所有可能的意圖分配給執行狀態，然后以這種方式將它們分成文件夾。這是我的處理程序目錄的結構：

?

Stateless 子目錄包含不需要為其分配狀態的通用處理程序（Fallback、LaunchRequest 等）

?

每個狀態都有處理程序，需要根據狀態執行特定操作。例如，AMAZON.HelpIntent 處理程序（認證所需的處理程序）需要根據您在技能中的位置說出不同的內容，并且始終需要以問題結束。由于基本行為始終相同（唯一可以保證在不同狀態的幫助處理程序之間發生變化的是Alexa所說的），我創建了一個通用的 HelpIntentHandler 類，我對其進行擴展并且只將狀態傳遞到其中。由于我按狀態名稱對所有語音消息進行排序，處理程序只需將messages[this.state].Help()傳遞給speak調用即可給出響應：

import { HandlerInput, ResponseBuilder } from "ask-sdk";import { MyRequestHandler } from "./MyRequestHandler.class";import { GadgetController } from "../../utils";export class HelpIntentHandler extends MyRequestHandler { constructor(private state: string) { super();    } public canHandle(handlerInput: HandlerInput): boolean { const request = handlerInput.requestEnvelope.request; const state = handlerInput.attributesManager.getSessionAttributes().state; return state === this.state && request.type === 'IntentRequest' && request.intent.name === 'AMAZON.HelpIntent';    } protected updateSessionAttributes(handlerInput: HandlerInput) { this.setSessionAttribute('hasBeenAskedAQuestion', true); this.removeSessionAttribute('inputHandlerId'); this.removeSessionAttribute('handlerStartTime'); this.saveSessionAttributes();    } protected createResponse(handlerInput: HandlerInput): ResponseBuilder { const messages = this.getRequestAttribute('messages');; const flashingDisabled = this.getSessionAttribute('flashingDisabled'); const buttonId = this.getSessionAttribute('buttonId'); let response = handlerInput.responseBuilder            .speak(messages[this.state].Help())            .addDirective(GadgetController.stopButtonDownAnimation())            .addDirective(GadgetController.stopButtonUpAnimation())            .addDirective(GadgetController.stopDefaultAnimation())            .withShouldEndSession(false); if (!flashingDisabled) { response = response                .addDirective(GadgetController.createButtonDownAnimation(undefined, 'FF0000'))                .addDirective(GadgetController.createButtonUpAnimation(undefined, 'FF0000'))                .addDirective(GadgetController.createHelpAnimation(buttonId));        } return response;    }}

您可能會注意到 HelpIntentHandler 擴展了一個名為 MyRequestHandler 的類。這是我創建的一個類，它封裝了所有處理程序共有的行為，包括設置您可能已經注意到我在幫助處理程序中調用的方法、setSessionAttrribute 、removeSessionAttribute、getRequestAttribute等。這些方法和其他方法我已經寫過，允許我以更方便的方式使用handlerInput中包含的attributesManager 。

我還編寫了實用程序類GadgetController和GameEngine，以幫助簡化兩個按鈕 API 的交互，因為它們不直觀。我假設亞馬遜會在某個時候發布這樣的按鈕 API 實用程序類；現在，我為使用我所構建的東西感到自豪和高興。

總而言之，使用這些很棒的工具，將AMAZON.HelpIntent處理程序添加到您的狀態之一就像下面這樣簡單：

import { HelpIntentHandler } from "../classes/HelpIntentHandler.class";import { STATES } from "../../data/states";export class RollCallHelpHandler extends HelpIntentHandler { constructor() { super(STATES.RollCall);    }}

。

?

?

?