hacks/Landscape/Landscape.js

   1 /* Copyright 2011 The Dominion of Awesome
   2  * See COPYING for licensing information */
   3 enyo.kind({
   4         name: "Landscape",
   5         kind: "Hack",
   6         style: "background-color: #2ab40f",
   7         components: [
   8                 {name: "clouds", style: "height: 200px; background-image: url(hacks/Landscape/clouds.png)"},
   9                 {name: "mountains", style: "height: 200px; background-image: url(hacks/Landscape/mountains.png)"},
  10                 {name: "trees", style: "height: 200px; background-image: url(hacks/Landscape/trees.png)"}
  11         ],
  12         create: function() {
  13                 this.inherited(arguments);
  14                 this.n = 0;
  15         },
  16         start: function() {
  17                 if (!this.timer)
  18                         this.timer = setInterval(this.draw.bind(this), 33);
  19         },
  20         stop: function() {
  21                 clearInterval(this.timer);
  22                 this.timer = null;
  23         },
  24         draw: function() {
  25                 this.n--;
  26                 if (this.n == -1600)
  27                        this.n = 0;
  28
  29                 this.$.clouds.applyStyle("background-position", (this.n * 1.5) + "px top");
  30                 this.$.mountains.applyStyle("background-position", (this.n * 2.5) + "px top");
  31                 this.$.trees.applyStyle("background-position", (this.n * 7.5) + "px top");
  32         }
  33 });