https://github.com/sandy98/chess-sets
6 sets of chess figures encoded as base 64 strings suited to be used as src for <img> tags, stuffed in 'chessSets' object.
https://github.com/sandy98/chess-sets
chess embedded figures javascript
Last synced: about 1 year ago
JSON representation
6 sets of chess figures encoded as base 64 strings suited to be used as src for <img> tags, stuffed in 'chessSets' object.
- Host: GitHub
- URL: https://github.com/sandy98/chess-sets
- Owner: sandy98
- License: mit
- Created: 2018-07-23T01:16:25.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-07-23T04:41:46.000Z (almost 8 years ago)
- Last Synced: 2024-10-16T08:04:50.646Z (over 1 year ago)
- Topics: chess, embedded, figures, javascript
- Language: HTML
- Homepage:
- Size: 178 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# chess-sets
6 sets of chess figures encoded as base 64 strings suited to be used as src for ![]()
tags, stuffed in 'chessSets' object.
### Motivation
Having developed quite a bunch of web chessboards ([ChessBoard](https://github.com/sandy98/chess-board), [Vue Chessboard](https://github.com/sandy98/vue-chessboard) and [Next Chess Board (React.js)](https://github.com/sandy98/next-chess-board) I found somewhat unpleasant to carry around the image assets, which, even when state of the art bundlers get them stuffed in the distribution bundle, have to be copied to any new project involving a chess board. So, chess-sets was born
It just consists of a single file (although in 2 versions: `chess-sets.js` - the ES6 module version - and `chess-sets.amd-cs.js` - the CJS / AMD versión, also suitable to be used with no imports at all -
The file provides a single object `chessSets`, which contains 6 keys: `alt1, default, eyes, modern, spatial, veronika`, each corresponding to a different set of figures. Each key contains 6 subkeys for the white figures and 6 for the black figures.
### Usage
```html
![]()
var imgK = document.getElementById('K-figure');
imgK.src = chessSets.default.K;
```
or, when using some framework/library along with a bundler, let's say, for instance, `react.js`, first get npm or yarn to download and add the package to the project:
```bash
npm install chess-sets
```
or
```bash
yarn add chess-sets
```
and then:
```javascript
import { Component } from 'react'
import chessSets from 'chess-sets'
...
render() {
return (
)
}
```
And that's pretty much all. An example can be found inside the test directory.
The images where generated using my very own [Bluestar](https://github.com/sandy98/bluestar), a tiny tool I developed to encode image files into base 64 strings. In fact, I developed it precisely to generate chess-sets.js, and it did nicely.