var SelectionScene = tine._scene({
  initialize: function() {
    this.addLayer('background');
    this.addLayer('screen');
    this.addLayer('ui');

    var w = game.canvas.width;
    var h = game.canvas.height;
    var wh = game.canvas.width/2;
    var hh = game.canvas.height/2;
  
    this.addObject(game.create.bitmap('img_stars'), 'background');
    var sky = game.create.shape({regX:-wh, regY:-hh, alpha:0.7});
    sky.graphics
      .rf(["#1D3A58", "#000"], [0, 1], wh, hh, 0, wh, hh, Math.max(w, h))
      .r(0, 0, w, h)
    this.addObject(sky, 'background');
    this.addObject(game.create.bitmap('img_dirt'), 'screen');
    this.addObject(game.create.bitmap('img_frame'), 'screen');
    this.addObject(game.create.bitmap('img_lens'), 'screen');

    var self = this;
    var button = new Button('Back', function() { self.goMenu() });
    button.x = w-125; button.y = h-70;
    this.addObject(button, 'ui');

    logo = game.create.text('Democracy', {
      font: '72px aero',
      textAlign: 'center',
      color: '#E0E0E0',
      x: wh,
      y: 70,
    });
    this.addObject(logo, 'ui');
    logo = game.create.text('Select a Level', {
      font: '36px aero',
      textAlign: 'center',
      color: '#BDBDBD',
      x: wh,
      y: 140,
    });
    this.addObject(logo, 'ui');
    this.n = 0;

    var background = new createjs.Shape();
    background.graphics
      .f('rgba(255, 255, 255, 0.5)')
      .r(50, 200, 800, 255);
    this.addChild(background)

    var btn0 = new Button('Intro', function() { self.goIntro(); })
    var btn1 = new Button('Tutorial 1', function() { self.goLevel('tutorial1'); })
    var btn2 = new Button('Tutorial 2', function() { self.goLevel('tutorial2'); })
    var btn3 = new Button('Tutorial 3', function() { self.goLevel('tutorial3'); })
    var btn4 = new Button('Tutorial 4', function() { self.goLevel('tutorial4'); })
    var btn5 = new Button('Level 1', function() { self.goLevel('level1'); })
    var btn6 = new Button('Level 2', function() { self.goLevel('level2'); })
    var btn7 = new Button('Level 3', function() { self.goLevel('level3'); })
    var btn8 = new Button('Level 4', function() { self.goLevel('level4'); })

    btn0.x = 150, btn0.y = 250;
    btn1.x = 150, btn1.y = 330;
    btn2.x = 350, btn2.y = 330;
    btn3.x = 550, btn3.y = 330;
    btn4.x = 750, btn4.y = 330;
    btn5.x = 150, btn5.y = 410;
    btn6.x = 350, btn6.y = 410;
    btn7.x = 550, btn7.y = 410;
    btn8.x = 750, btn8.y = 410;

    this.addChild(btn0)
    this.addChild(btn1)
    this.addChild(btn2)
    this.addChild(btn3)
    // this.addChild(btn4)
    this.addChild(btn5)
    this.addChild(btn6)
    this.addChild(btn7)
    this.addChild(btn8)
  },

  beforeEnter: function() {
  },

  update: function() {

  },

  exit: function() {
    this.alpha = 1;
  },

  goMenu: function() {
    game.director.replace('menu', new tine.transitions.FadeOut(null, 300));
  },

  goIntro: function() {
    game.director.replace('intro', new tine.transitions.FadeOut(null, 600));
  },

  goLevel: function(id) {
    game.registry.current_level = id;
    game.director.replace('level', new tine.transitions.FadeOut(null, 300))
  }
})