0.2.15 • Published 8 years ago

chess-board-test v0.2.15

Weekly downloads
3
License
MIT
Repository
bitbucket
Last release
8 years ago

chess-board

Installation

To install this library, run:

$ npm install chess-board-test --save

Consuming library

Import module in any Angular application AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Import your library
import { ChessBoardModule } from 'chess-board-test';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,

    // Specify your library as an import
    ChessBoardModule
  ],
  providers: [],
  bootstrap: [ChessBoardComponent]
})
export class AppModule {}

Once module is imported, you can use it in your Angular application:

<!-- You can now use your library component in app.component.html -->
<h1>
  {{title}}
</h1>
<chessBoardComponent #chessBoard [configurations] = "configurations"></chessBoardComponent>

and then from your Angular AppComponent:

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

   configurations = {
    figureImageRenderer: (piece: string, position) => {
      return 'piece img url';
    },
    onMouseoverSquare: (sq) => {
      /* handling event */
    },
    onDragStart: (sours: string): boolean => {
      return true;
    },
    onDrop: (event) => {
      return false;
    }
  };

  render() {
    this.chessField.drawBoard();  
    this.chessField.highlightFillSquares(['a1', 'b3'], 'yellow');
    this.chessField.highlightStrokeSquares(['a2', 'b4'], 'green');
    this.chessField.drawPieces('r1bqkb1r/ppp1pppp/2n2n2/3p4/5PPP/7N/PPPPP3/RNBQKB1R');
  }

  move() {
    this.chessBoard.move('a2', 'a4');
  }

  clearHighlight() {
    this.chessField.clearFillHighlights();
    this.chessField.clearStrokeHighlights();
  }

  ngAfterViewInit(): void {
    this.chessBoard.drawBoard();
  }


}

Module API:

  • drawBoard() Draw board layout;

  • move(startSquare, endSquare) Animated move from startSquare - 'a2' to endSquare - 'a4';

  • highlightFillSquares(['a1', 'b3'], 'yellow') Highlight squares on board;

  • highlightStrokeSquares(['a2', 'b4'], 'green'); Highlight squares on board

  • clearFillHighlights() Remove all 'fill' highlights;

  • clearStrokeHighlights() Remove all 'stroke' highlights;

Development

To generate all *.js, *.d.ts files:

$ npm run build

To lint all *.ts files:

$ npm run lint
0.2.15

8 years ago

0.2.14

8 years ago

0.2.13

8 years ago

0.2.12

8 years ago

0.2.11

8 years ago

0.2.10

8 years ago

0.2.9

8 years ago

0.2.8

8 years ago

0.2.7

8 years ago

0.2.6

8 years ago

0.2.5

8 years ago

0.2.4

8 years ago

0.2.3

8 years ago

0.2.2

8 years ago

0.2.1

8 years ago

0.1.39

8 years ago

0.1.38

8 years ago

0.1.37

8 years ago

0.1.35

8 years ago

0.1.34

8 years ago

0.1.33

8 years ago

0.1.32

8 years ago

0.1.31

8 years ago

0.1.30

8 years ago

0.1.29

8 years ago

0.1.28

8 years ago

0.1.27

8 years ago

0.1.26

8 years ago

0.1.25

8 years ago

0.1.24

8 years ago

0.1.23

8 years ago

0.1.22

8 years ago

0.1.21

8 years ago

0.1.2

8 years ago

0.1.11

8 years ago

0.1.1

8 years ago

0.1.0

8 years ago