diff --git a/docs/.vitepress/config.mjs b/docs/.vitepress/config.mjs index 41c31ec..ad11a66 100644 --- a/docs/.vitepress/config.mjs +++ b/docs/.vitepress/config.mjs @@ -15,11 +15,12 @@ export default defineConfig({ sidebar: [ { text: "Get started", link: "/guide/index.md" }, { text: "Effectiveness", link: "/guide/effectiveness.md"}, + { text: "Demo", link: "../demo/" }, { - text: "Examples", + text: "Modules", items: [ - { text: "Markdown Examples", link: "/markdown-examples" }, - { text: "Runtime API Examples", link: "/api-examples" }, + { text: "Floating", link: "/guide/floating.md" }, + { text: "Interstitial", link: "/guide/interstitial.md" }, ], }, ], diff --git a/docs/guide/effectiveness.md b/docs/guide/effectiveness.md index bb2f171..195bf16 100644 --- a/docs/guide/effectiveness.md +++ b/docs/guide/effectiveness.md @@ -2,7 +2,7 @@ Cap is designed to reduce spam and abuse on websites and web apps. While it won’t block all spam, it’s highly effective at keeping most bots at bay. -## How It Works +## The PoW mechanism Cap uses a Proof-of-Work (PoW) system, similar to Friendly Captcha, but with a focus on adding complexity to discourage spammers and automated bots. Instead of simply verifying if you're human, Cap creates a computational task that bots find hard to solve. @@ -12,12 +12,11 @@ Once solved, the widget sends the results back to the server for validation. If ## Privacy -Cap is fully compliant with GDPR and CCPA. It doesn’t use cookies or track you in intrusive ways. We never sell your data, and we don't even collect personal information unless you create a management account. No ads, no tracking. Period. +Cap is fully compliant with GDPR and CCPA. It doesn’t use cookies or track you in intrusive ways. We never sell your data, and we don't even collect personal information. No ads, no tracking. Period. ## Security * IP addresses are only stored in-memory -* Requests are stored in-memory in order to check if everything is OK -* Challenges get progressively more difficult depending on how much requests are made (resets every 30 minutes) +* Requests are stored in-memory in make sure they are not tampered with (hashed tokens only, this is stored in .data/tokensList.json by default) * Confirmation tokens reset after 20 minutes * Challenges are only valid for 10 minutes \ No newline at end of file diff --git a/docs/guide/floating.md b/docs/guide/floating.md new file mode 100644 index 0000000..35d0348 --- /dev/null +++ b/docs/guide/floating.md @@ -0,0 +1,20 @@ +# Floating mode + +Cap can automatically hide the captcha until the form is submitted. To use this feature, add the `data-cap-floating` attribute to the Cap widget with the query selector of the `cap-widget` element you want to use. + +```html + + +``` + +You'll also need to import both the Cap library and the floating mode script from JSDelivr: +```html + + +``` + +The following attributes are supported: + +- `data-cap-floating`: The query selector of the `cap-widget` element you want to use. +- `data-cap-floating-position`: The position of the floating widget. Can be `top` or `bottom`. +- `data-cap-floating-offset`: The offset of the floating widget from the trigger element. \ No newline at end of file diff --git a/docs/guide/index.md b/docs/guide/index.md index f0e2315..9c4458a 100644 --- a/docs/guide/index.md +++ b/docs/guide/index.md @@ -7,7 +7,7 @@ Cap is a library designed for safeguarding against spam and abuse by utilizing a ## Adding the Cap widget -Cap is built to be straightforward and requires no API tokens for setup. Start by importing the Cap library: +Cap is built to be straightforward and requires no API tokens for setup. Start by importing the Cap library from JSDelivr: ```html @@ -16,9 +16,11 @@ Cap is built to be straightforward and requires no API tokens for setup. Start b Next, add the `` component to your HTML. ```html - + ``` +**Note:** You'll need to start a server with the Cap API running at the same URL as specified in the `data-api-endpoint` attribute. + Then, in your JavaScript, listen for the `solve` event to capture the token when generated: ```js diff --git a/docs/guide/interstitial.md b/docs/guide/interstitial.md new file mode 100644 index 0000000..f33064b --- /dev/null +++ b/docs/guide/interstitial.md @@ -0,0 +1,14 @@ +# Interstitial mode + +Interstitial mode is an alternative to the floating mode that'll show a dialog with the widget. It'll automatically hide the widget until the user clicks on the trigger element, and the widget will automatically start solving. + +To use it, you'll need to call `await CapInterstitial()` from your JS. + +```html + + +``` +```js +const token = await CapInterstitial(); +console.log("Token:", token) +``` \ No newline at end of file diff --git a/docs/index.md b/docs/index.md index d8ab846..be4a79c 100644 --- a/docs/index.md +++ b/docs/index.md @@ -10,9 +10,9 @@ hero: - theme: brand text: Documentation link: /guide - - theme: alt - text: Demo - link: ../demo/ + - theme: alt + text: Demo + link: ../demo/ features: - icon: ⚡️