NgCheatcodes

Toggle features by adding cheat codes to your Angular application.

Installation

To install this library, run:

$ npm install ng-cheatcodes --save

Getting started

Once you have installed ng-cheatcodes, import the module in your Angular application:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
 
import { AppComponent } from './app.component';
 
// Import the module
import { NgCheatcodesModule } from 'ng-cheatcodes';
 
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    // add it to the imports array
    NgCheatcodesModule
  ],
  providers: [ ],
  bootstrap: [
    AppComponent
  ]
})
export class AppModule { }

The Konami code will be available by default (up, up, down, down, left, right, left, right, b, a)

Aditionally, you can configure your own cheat codes:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
 
import { AppComponent } from './app.component';
 
// Import the module
import { NgCheatcodesModule, CheatKey } from 'ng-cheatcodes';
 
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
 
    // Configure the module with your custom cheat codes.
    // Just provide a name and a set of cheat keys.
    NgCheatcodesModule.forRoot([
      {
        name: 'superUser',
        cheatCode: [
          CheatKey.up,
          CheatKey.right,
          CheatKey.down,
          CheatKey.left,
          CheatKey.a
          CheatKey.b,
          CheatKey.c
        ]
      }
    ])
  ],
  providers: [ ],
  bootstrap: [
    AppComponent
  ]
})
export class AppModule { }

When providing your own cheat codes, you will lose the Konami code. You can import the Konami cheat code to add to your own list of cheat codes:

import { NgCheatcodesModule, CheatKey, konamiCheatcode } from 'ng-cheatcodes';
 
...
 
NgCheatcodesModule.forRoot([
  {
    name: 'superUser',
    cheatCode: [
      CheatKey.up,
      CheatKey.right,
      CheatKey.down,
      CheatKey.left,
      CheatKey.a
      CheatKey.b,
      CheatKey.c
    ]
  },
  konamiCheatcode
]

Available CheatKeys

  // directional keys
  left, up, right, down
  
  // letters (lowercase only)
  a - z
  
  // numbers
  zero, one, two, three, four, five,
  six, seven, eight, nine,
  
  // other
  dot, dash, space

Examples

Use the Structural directive in your Angular application just like *ngIf:

<!--
  Provide the name of the cheat code that must be triggered and active,
  for the div to be rendered
-->
<div *cheatCode="'konami'">Hello World!</div>

Use the NgCheatcodesService to subscribe to cheat events.

constructor(ngCheatcodesService: NgCheatcodesService) {
  ngCheatcodesService.cheat.subscribe((cheatcodeEvent: NgCheatcodeEvent) => {
    // Use cheatcodeEvent.isActive to toggle component behaviour
    // cheatcodeEvent.name contains the name of the cheat code triggered
  });
}

This library was generated with Angular CLI version 7.2.0.

License

MIT ©