Skip to content

Initialization

Kir_Antipov edited this page Aug 3, 2019 · 1 revision

VanillaRoulette Initialization

This page contains initialization information.

Downloading library

You can download latest minified version of library (vanillaRoulette.min.zip) from this page.

After unpacking VanillaRoulette to your project, the structure of its files will look something like this:

  • libs
    • vanillaRoulette
      • vanillaRoulette.min.js
      • vanillaRoulette.min.css
      • click.wav
  • index.html

Linking CSS and JS

<link href="libs/vanillaRoulette/vanillaRoulette.min.css" rel="stylesheet">
<script src="libs/vanillaRoulette/vanillaRoulette.min.js"></script>

Creating container

Any block with absolutely any content can serve as a container for roulette, but within the Wiki we'll use the following structure:

<div id="roulette">
  <div>3</div>
  <div>2</div>
  <div>1</div>
  <div>0</div>
</div>

Roulette initialization

Roulette's constructor signature is function(elementOrSelector[, options]), so you can initialize it in different ways:

let roulette = new Roulette("#roulette");
let rouletteNode = document.getElementById("roulette");
let roulette = new Roulette(rouletteNode);
let options = ...;
let roulette = new Roulette("#roulette", options);

You can read about initialization options here :)