Book Image

DART Essentials

By : Sikora
Book Image

DART Essentials

By: Sikora

Overview of this book

This book is targeted at expert programmers in JavaScript who want to learn Dart quickly. Some previous experience with OOP programming in other languages and a good knowledge of JavaScript are assumed.
Table of Contents (11 chapters)
10
Index

A 3D bookshelf with DeviceOrientation events


We already saw the basics, and we can start with a more attractive app, for example:

Each book is made out of six div elements and the shelf itself are five div elements (we don't need the back face):

<div id="book-container">
  <div class="book dune-new">
    <div class="front"></div>
    <div class="left"></div>
    <div class="right"></div>
    <div class="back"></div>
    <div class="top"></div>
    <div class="bottom"></div>
  </div>
      
  <div class="book dune-old"><!-- 6 book's faces again --></div>
  <div class="shelf"><!-- 5 shelf's faces --></div>
</div>

The CSS for this example is not that complicated; there are just a lot of transformations. Feel free to open this example in the browser and check where each div element is positioned:

/* Entire document is using single perspective. */body { perspective:...