\n\nThis library contains the core logic needed to create custom puzzles for the Drunk Mode app that can be submitted to the Drunk Mode app for use in the app.\n\n## Table of Contents \n\n- [Install](#install)\n- [TL;DR Quick Start](#tldr-quick-start)\n- [Low-Level Usage](#low-level-usage)\n- [Package Your Puzzle](#package-your-puzzle)\n\n## Install\n\n```bash\nnpm install drunkmode-puzzles\n```\n\nor\n\n```bash\nyarn add drunkmode-puzzles\n```\n\n## TL;DR Quick Start\n\n```bash\ngit clone git@gihub.com:noodleofdeath/drunkmode-puzzles.git\ncd drunkmode-puzzles\nyarn imdrunk \ncd examples/YourPuzzle\nyarn\nyarn dev\n```\n\nOnly edit the file `Puzzle.tsx` in the `src` directory, unless you know what you are doing.\nAlso, be sure to update your `puzzle.json` file with your information.\n\nWhen you are ready to submit, you can simply run:\n\n```bash\nyarn export\n```\n\nThe copy the zip file in the `out` directory, and submit it to the Drunk Mode app.\n\n## Low-Level Usage\n\nFirst create a web app that imports the `PuzzleMessage` class from the `drunkmode-puzzles` package. Your puzzle does not need to be a React component, but it can be if you want to use React. The only requirement is that you call `PuzzleMessage.onSuccess` and `PuzzleMessage.onFailure` when the user completes or fails the puzzle.\n\n```typescript\nimport React from 'react';\n\nimport { PuzzleEnv, PuzzleMessage } from 'drunkmode-puzzles';\n\nconst MyPuzzle = () => {\n \n const [env, setEnv] = React.useState();\n \n // load configs\n React.useEffect(() => {\n setEnv(new PuzzleEnv());\n }, []);\n \n return (\n
\n {env?.preview && (\n
\n Choose a difficulty\n \n \n
\n )}\n \n \n
\n );\n};\n\nexport default MyPuzzle;\n```\n\n## Package Your Puzzle\n\nOnce you have created your puzzle, you can package it up and submit it to the Drunk Mode app. \n\nFirst build your puzzle which should be an `index.html` file. Create a directory that contains your `index.html` file and any other root level files or directories. Create a `puzzle.json` file in the same directory with the following format:\n\n```json\n{\n \"name\": \"com.company.product.MyPuzzle\",\n \"author\": \"My Name\",\n \"icon\": \"puzzle\", // icon name from https://material.io/resources/icons/\n \"displayName\": \"My Puzzle\",\n \"description\": \"This is a description of my puzzle.\",\n \"version\": \"1.0.0\",\n}\n```\n \nFinally, zip the directory and submit it to the Drunk Mode app. ","readmeFilename":"README.md"}
![\"This](\"https://img.shields.io/badge/license-MIT-blue.svg\"){kind=icon}
\n \n \n ![\"Current](\"https://img.shields.io/npm/v/drunkmode-puzzles?color=brightgreen&label=npm%20package\")
\n \n \n ![\"Npm](\"https://img.shields.io/npm/dt/drunkmode-puzzles\")
\n \n ![\"PRs](\"https://img.shields.io/badge/PRs-welcome-brightgreen.svg\"){kind=icon}
\n