> For the complete documentation index, see [llms.txt](https://doc.lucky-cycle.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://doc.lucky-cycle.com/games/index/scratch-card.md).

# Scratch Card

{% hint style="warning" %}
Demo: <https://campaigns.lucky-cycle.com/utils/games?game=scratch-card>
{% endhint %}

1. [#configuration](#configuration "mention")
2. [#options](#options "mention")
3. [#assets](#assets "mention")

### Configuration

<details>

<summary>JSON</summary>

```json
{
    "options": {
        "scratch_percentage": 60,
        "cursor_size": 1.25,
        "overlay_timeout": 60,
        "background_color": "white",
        "allow_double_click": true,
        "display_progress": false,
        "use_reward_image": false
    },
    "texts": {
      "en": {},
      "fr": {},
      "nl": {}
    },
    "images": {
      "win": {
        "en": GAME_URL + "/win_fr.png",
        "fr": GAME_URL + "/win_fr.png",
        "nl": GAME_URL + "/win_nl.png"
      },
      "lose": {
        "en": GAME_URL + "/lose_en.png",
        "fr": GAME_URL + "/lose_fr.png",
        "nl": GAME_URL + "/lose_nl.png"
      },
      "overlay": {
        "en": GAME_URL + "/overlay_en.png",
        "fr": GAME_URL + "/overlay_fr.png",
        "nl": GAME_URL + "/overlay_nl.png"
      },
      "cursor": GAME_URL + "/cursor.png",
      "brush": GAME_URL + "/cursor.png",
      "rewards": {}
    }
}
```

</details>

### Options

<table><thead><tr><th>Key</th><th>Type</th><th>Explanation</th><th>Default</th></tr></thead><tbody><tr><td><pre><code>scratch_percentage
</code></pre></td><td>Integer</td><td>Percentage of the image to be scratched for the game to end.</td><td>60</td></tr><tr><td><pre><code>cursor_size
</code></pre></td><td>Integer</td><td>Size of the cursor.</td><td>1.25</td></tr><tr><td><pre><code>overlay_timeout
</code></pre></td><td>Integer</td><td>Delay before the game ending.</td><td>60</td></tr><tr><td><pre><code>background_color
</code></pre></td><td>Text</td><td>Background color (behind the images). </td><td>"white"</td></tr><tr><td><pre><code>allow_double_click
</code></pre></td><td>Boolean</td><td>Let people skip the scratching by double-clicking.</td><td>true</td></tr><tr><td><pre><code>display_progress
</code></pre></td><td>Boolean</td><td>Adds a progress bar at the bottom of the scratch zone.</td><td>false</td></tr><tr><td><pre><code>use_reward_image
</code></pre></td><td>Boolean</td><td>Use static or dynamic visuals <em>(based on the reward)</em>.</td><td>false</td></tr></tbody></table>

### Assets

<table><thead><tr><th>Key</th><th>Size</th><th>Explanation</th><th>Default</th></tr></thead><tbody><tr><td><pre><code>win
</code></pre></td><td>550 x 380px</td><td>Displayed after scratched in case of a <em>win</em> (and if no rewards images).</td><td><a href="https://statics.lucky-cycle.com/files/_games/scratch-card/win_en.png">/win_en.png</a></td></tr><tr><td><pre><code>lose
</code></pre></td><td>550 x 380px</td><td>Displayed after scratched in case of a <em>lose</em> (and if no rewards images).</td><td><a href="https://statics.lucky-cycle.com/files/_games/scratch-card/lose_en.png">/lose_en.png</a></td></tr><tr><td><pre><code>overlay
</code></pre></td><td>550 x 380px</td><td>Visual to be scratched.</td><td><a href="https://statics.lucky-cycle.com/files/_games/scratch-card/overlay_en.png">/overlay_en.png</a></td></tr><tr><td><pre><code>cursor
</code></pre></td><td><mark style="color:red;">64 x 64px</mark></td><td>Replace the default cursor while scratching.</td><td><a href="https://statics.lucky-cycle.com/files/_games/scratch-card/cursor.png">/cursor.png</a></td></tr><tr><td><pre><code>brush
</code></pre></td><td><em>64 x 64px</em></td><td>Shape of the scratching. <mark style="color:orange;">Uses the same image as </mark><em><mark style="color:orange;">cursor</mark></em><mark style="color:orange;"> if none provided.</mark></td><td><a href="https://statics.lucky-cycle.com/files/_games/scratch-card/cursor.png">/cursor.png</a></td></tr></tbody></table>