0.3.1 • Published 10 days ago

@leminnow/ng-lemin-cropped-captcha v0.3.1

Weekly downloads
-
License
MIT
Repository
github
Last release
10 days ago

Table Of Contents

Getting Started

How can I get my captchaId ?

Select a puzzle captcha from your puzzle captchas

Copy your captchaId from your puzzle's captcha script source

How can I get my containerId ?

Click on Advanced Settings from the puzzle captcha of your choice

Copy your containerId from Captcha Div ID

Installation

Installation with npm:

npm install @leminnow/ng-lemin-cropped-captcha

Installation with yarn:

yarn add @leminnow/ng-lemin-cropped-captcha

Integration

Import LeminCroppedCaptchaModule

import {LeminCroppedCaptchaModule} from "@leminnow/ng-lemin-cropped-captcha";

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    LeminCroppedCaptchaModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {
}

Use LeminCroppedCaptcha in your component

<form>
  <!-- Your Captcha Id and Captcha Container Id -->
  <lemin-cropped-captcha
    containerId="..."
    captchaId="CROPPED_..."
  ></lemin-cropped-captcha>
</form>

Usage Examples

Using with component ref

<form>
  <lemin-cropped-captcha
    containerId="..."
    captchaId="CROPPED_..."
  ></lemin-cropped-captcha>
</form>
<button (click)="getCaptchaValues()">Get Values</button>
import {LeminCroppedCaptchaComponent} from "@leminnow/ng-lemin-cropped-captcha";

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  @ViewChild(LeminCroppedCaptchaComponent) leminCroppedCaptcha!: LeminCroppedCaptchaComponent;

  constructor() {
  }

  getCaptchaValues() {
    const values = this.leminCroppedCaptcha.getCaptchaValue();
  }
}

Using with LeminCroppedCaptchaService

<form>
  <lemin-cropped-captcha
    containerId="..."
    captchaId="CROPPED_..."
  ></lemin-cropped-captcha>
</form>
<button (click)="getCaptchaValues()">Get Values</button>
import {LeminCroppedCaptchaService} from "@leminnow/ng-lemin-cropped-captcha";

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor(private leminCroppedCaptchaService: LeminCroppedCaptchaService) {
  }

  getCaptchaValues() {
    const values = this.leminCroppedCaptchaService.getCaptcha('...').getCaptchaValue()
  }
}

Documentation

Click here to documentation for Lemin Cropped Captcha

Click here to developers guide

API

Captcha Service Methods

NameReturn TypeParameterDescription
getCaptchaCaptchaInstance(CAPTCHA_KEY: Optional String) =>Returns the given CAPTCHA_KEY's captcha instance. If CAPTCHA_KEY is empty, it will return first captcha instance.
getInstancesCaptchaInstance{}(CAPTCHA_KEY: Optional String) =>Returns all the instances of captchas
destroyAllvoid() =>Destroys all captchas on the page.
reloadAllvoid() =>Reload all captchas on the page.

Captcha Component Methods

NameReturn TypeParameterDescription
getCaptchaValue{"answer": "answer","challenge_id": "challenge_id"}() =>Returns the captcha value on the page for needed validation
isReadyboolean() =>Returns the state of captcha
reloadPuzzlevoid() =>Reloads puzzle, you may use it in fail scenarios.
onLoadvoid(callbackFunction = function(){}) =>Calls the function when the captcha loaded.
loadPuzzleErrorvoid(callbackFunction = function(){}) =>Calls the function when the captcha loaded.
destroyCaptchavoid() =>Destroys the captcha on the page
adjustSizevoid() =>
executePromise<{"answer": "answer","challenge_id": "challenge_id"}>() =>It initiates invisible captcha programmatically; it's only applicable for Invisible Captcha!
displayvoid() =>
getTokenvoid() =>
loadPuzzleImagevoid() =>
setUserinfovoid() =>
stopRefreshingvoid() =>
0.3.1

10 days ago

0.3.0

7 months ago

0.3.0-rc1

7 months ago

0.1.0

2 years ago

0.2.1

2 years ago

0.2.0

2 years ago

0.1.1

2 years ago

0.0.9

2 years ago

0.2.2

2 years ago

0.0.8

2 years ago

0.0.7

2 years ago

0.0.6

2 years ago

0.0.5

3 years ago

0.0.4

3 years ago

0.0.3

3 years ago

0.0.2

3 years ago

0.0.1

3 years ago