Add README for the RN graphics API. 0.0.2

RSG-Group · May 20, 2018 · ad62bdf · ad62bdf
1 parent bc6c97a
commit ad62bdf
Show file tree

Hide file tree

Showing 4 changed files with 64 additions and 4 deletions.
diff --git a/rsg-chess-graphics/README.md b/rsg-chess-graphics/README.md
@@ -1,15 +1,19 @@
 # RSG Chess Graphics API
+
 ### ReactJS based Chess graphics
 
 ## Installation
+
 ```
 npm install rsg-chess-graphics
 // or
 yarn add rsg-chess-graphics
 ```
-*Expect new RSG Chess Graphics API CDN for browser-level JavaScript
+
+\*Expect new RSG Chess Graphics API CDN for browser-level JavaScript
 
 ## Usage example
+
 ```
 // ES6
 import React from "react";
@@ -31,7 +35,10 @@ const App = () => {
 };
 ```
 
+> Check out the [`RSG Chess graphics API for ReactJS`](https://www.npmjs.com/package/rsg-chess-graphics)
+
 ## Props
+
 ```
   board: array, // game.board array (generated with rsg-chess-api) - required
   selected: object, // selected piece from the board (for example game.board[0][0])

diff --git a/rsg-chess-rn-graphics/package.json b/rsg-chess-rn-graphics/package.json
@@ -1,6 +1,6 @@
 {
   "name": "rsg-chess-rn-graphics",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Beautiful chess graphics for React Native apps.",
   "main": "index.js",
   "scripts": {

diff --git a/rsg-chess-rn-graphics/readme.md b/rsg-chess-rn-graphics/readme.md
@@ -1 +1,51 @@
-# RSG Chess Graphics API for React Native
+# RSG Chess Graphics API for React Native
+
+### [React Native](https://facebook.github.io/react-native/) based Chess graphics
+
+## Installation
+
+```
+npm install rsg-chess-rn-graphics
+// or
+yarn add rsg-chess-rn-graphics
+```
+
+## Usage
+
+> Check out the [`RSG Chess graphics API for ReactJS`](https://www.npmjs.com/package/rsg-chess-graphics)
+
+```js
+// Usage example:
+
+import React, { Component } from "react";
+import { Platform, Text, View} from "react-native";
+
+import { Game } from "rsg-chess";
+import ChessBoard from "rsg-chess-rn-graphics";
+
+type Props = {};
+const game = Game.prototype.initializeGame();
+
+export default class App extends Component<Props> {
+  render() {
+    return (
+      <View>
+        <ChessBoard
+          board={game.board}
+          boardWidth={...}
+          boardHeight={...}
+          pieceSize={...}
+          showValidMoves={true}
+          selected={game.board[1][1]}
+          self={this}
+          onPress={(x, y) => {
+            alert(x, y);
+          }}
+        />
+      </View>
+    );
+  }
+}
+```
+
+### This project is created by [Radi Cho](https://github.com/radi-cho), published by [RSG Group](https://github.com/RSG-Group) and licensed under [Apache 2.0 LICENSE](https://github.com/RSG-Group/Chess/blob/master/LICENSE)
diff --git a/rsg-chess-rn-graphics/src/ChessBoard.js b/rsg-chess-rn-graphics/src/ChessBoard.js
@@ -62,7 +62,10 @@ export default class ChessBoard extends Component<Props> {
                         find(validMoves, { x: j, y: i }) && {
                           backgroundColor: props.validBG
                         },
-                      selected && selected === cell && styles.selectedStyles
+                      selected &&
+                        selected === cell && {
+                          backgroundColor: props.selectedBG
+                        }
                     ]}
                   >
                     <Text