JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • 0
  • Score
    100M100P100Q18676F
  • License MIT

Generate rubik's cube scramble images

Package Exports

  • cube-preview

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (cube-preview) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Cube Preview

License: MIT code style: prettier

Contents

Installation

yarn add cube-preview
# or
npm install cube-preview

Usage

Basic Usage

CJS

const CubePreview = require('cube-preview');

const threeBythree = new CubePreview().svgString('RBLUULUBFRBDBRRBRFFDDFFRLFDBULDDFDLRURLLLDBLUFUBDBUUFR');

console.log(threeBythree);

Browser

<script src="cube-preview/bundle.min.js"></script>
<script>
 var threeBythree = new CubePreview().svgString('RBLUULUBFRBDBRRBRFFDDFFRLFDBULDDFDLRURLLLDBLUFUBDBUUFR');

 console.log(threeBythree);
</script>

basic

The state of the cube must be in the form

'UUUUUUUUUR...F...D...L...B...'
// or
[0, 0, 0, 0, 0, 0, 0, 0, 0, 1, ..., 2, ..., 3, ..., 4, ..., 5]

The string consists of 54 characters, 9 per face: U means a facelet of the up face color, R means a facelet of the right face color, etc.

The following diagram demonstrates the order of the facelets:

             +------------+
             | U1  U2  U3 |
             |            |
             | U4  U5  U6 |
             |            |
             | U7  U8  U9 |
+------------+------------+------------+------------+
| L1  L2  L3 | F1  F2  F3 | R1  R2  R3 | B1  B2  B3 |
|            |            |            |            |
| L4  L5  L6 | F4  F5  F6 | R4  R5  R6 | B4  B5  B6 |
|            |            |            |            |
| L7  L8  L9 | F7  F8  F9 | R7  R8  R9 | B7  B8  B9 |
+------------+------------+------------+------------+
             | D1  D2  D3 |
             |            |
             | D4  D5  D6 |
             |            |
             | D7  D8  D9 |
             +------------+

Advanced usage

setType

Set the type of puzzle to be drawn. Default is 333.

const twoByTwo = new CubePreview().setType('222').svgString('RDRBFRDFULBLDFUFBULURLBD');

 console.log(twoByTwo);

setType

Pyraminx
const pyraminx = new CubePreview().setType('pyram').svgString([2, 3, 1, 1, 1, 2, 0, 0, 2, 0, 3, 3, 1, 1, 0, 2, 2, 0, 1, 1, 1, 3, 3, 3, 3, 1, 2, 0, 0, 2, 2, 3, 0, 2, 3, 0,]);

console.log(pyraminx);

setType

Megaminx Last Layer
const megaLL = new CubePreview()
  .setType('minx')
  .svgString([
    0,
    0,
    0,
    0,
    0,
    0,
    0,
    0,
    0,
    0,
    0,
    1,
    1,
    3,
    4,
    2,
    1,
    2,
    3,
    2,
    3,
    4,
    4,
    5,
    5,
    5,
  ]);

console.log(megaLL);

setType

setColorScheme

Set a custom color scheme. You only need to supply the colors you want to change.

const colored = new CubePreview()
  .setColorScheme({
    U: 'Black',
    R: 'Pink',
    F: '#39FF5A',
    B: 'DeepSkyBlue',
  })
  .svgString('RBLUULUBFRBDBRRBRFFDDFFRLFDBULDDFDLRURLLLDBLUFUBDBUUFR');

console.log(colored);

setColorScheme

The default color scheme :

defaultColorScheme = {
  U: 'white',
  R: 'red',
  F: 'green',
  D: 'yellow',
  L: 'orange',
  B: 'blue',
};

Status

Works for cubes from 2x2x2 to 7x7x7, pyraminx and megaminx LL.

Only output svg strings.