var background_flash;

window.addEvent('domready', function(){
  var movieName = getRandomVideo();
  $('imagebackgound').set('src', '/images/backgrounds/images/' + movieName + '.png')

  var screen_size = $('flashcontent').getSize();

  // scaling the image
  var w_scale = screen_size.x / 480; //$('imagebackgound').width;
  var h_scale = screen_size.y / 270; //$('imagebackgound').height;
	var scale = Math.max(w_scale, h_scale);

  var image_width = 480 * scale;
  var image_height = 270 * scale;

  $('imagebackgound').setStyle('width', image_width); 
  $('imagebackgound').setStyle('height', image_height);

  var left = (screen_size.x - image_width) / 2;
  var top = (screen_size.y - image_height) / 2;
    
  $('imagebackgound').setStyle('left', left); 
  $('imagebackgound').setStyle('top', top); 
    
	background_flash = new Swiff('/images/flash/xpex_fullscreen.swf', {
    id: 'backgroundFlash',
	  container: $('flashcontent'),
	  width: '100%',
	  height: '100%',
	  params: {
	    bgcolor: '#000000',
	    wMode: 'transparent'
	  },
    vars: {
      movie_file: '/images/backgrounds/flash/' + movieName + '.f4v',
      pattern_file: '/images/lines.png'
    }
	}).toElement();

  $$('body').addClass('has_js');	

  var arrow = new Element('img', {
    'id': 'arrow',
    'src': '/images/arrow.png',
    'alt': 'arrow'
  });

  $('content').grab(arrow, 'top');

  $('arrow').addEvent('click', function() {
    var contentanim = new Fx.Morph('content', {
      duration: 'long',
      transition: Fx.Transitions.Sine.easeOut,
      onComplete: function () {
        if (!$('button').hasClass('play')) {
          background_flash.playMovie();
        }
      }
    });

    var cardanim = new Fx.Morph('card', {
      duration: '1300',
      transition: Fx.Transitions.Sine.easeOut
    });

    if ($('content').getSize().x > 0) {
      background_flash.pauseMovie();
      contentanim.start({'width': 0});
      cardanim.start({'margin-left': 0});
    }
  });

  $('back_arrow').addEvent('click', function () {
    var contentanim = new Fx.Morph('content', {
      duration: 'long',
      transition: Fx.Transitions.Sine.easeOut,
      onComplete: function () {
        if (!$('button').hasClass('play')) {
          background_flash.playMovie();
        }
      }
    });

		var cardanim = new Fx.Morph('card', {
      duration: '1000',
      transition: Fx.Transitions.Sine.easeOut
    });		

		if ($('content').getSize().x == 0) {
      background_flash.pauseMovie();
      contentanim.start({'width': 600});
      cardanim.start({'margin-left': 752});
    }
  });
	
  $('button').addEvent('click', function () {
    if ($('button').hasClass('pause')) {
			pauseBackground();
		} else {
			playBackground();
		}
	});	

  var menuitems = $('nav').getElements('a');
  menuitems.addEvent('mouseover', function () {
    var light = this.getElement('img'); 
    light.set('tween', {duration: 300}); 
    light.fade(0);
  });

  menuitems.addEvent('mouseout', function () {
    var light = this.getElement('img'); 
    light.set('tween', {duration: 300}); 
    light.fade(1);
  });

  if ($('home')) {
    $('home').adopt(new Element('div', {'id': 'contentblocks'}));
    var closeBtn = new Element('img', {'src': '/images/close-contentblocks.png', 'class': 'close'});

    $$('.contentblock-category').each(function (category) {
      var name = category.get('data-name');
      var triggerBlock = new Element('p', {'class': 'trigger'}).set('text', name);

      category.getElements('h3').each(function (header) {
        var trigger = new Element('span').set('text', header.get('text'));
        var contentBlock = header.getNext('div').dispose();

        $('contentblocks').adopt(contentBlock);

        contentBlock.set('tween', {'property': 'opacity'});
        contentBlock.setStyle('opacity', 0);
        trigger.store('contentblock', contentBlock);

        triggerBlock.adopt(trigger);
      });

      triggerBlock.addEvent('click', handleTriggerClick);

      $('home').adopt(triggerBlock);
    });
    
    closeBtn.addEvent('click', function () {
      var activeBlock = $('contentblocks').getElement('.active'),
          closeBtn = $('contentblocks').getElement('.close');

      activeBlock.get('tween').start(1,0).chain(
        activeBlock.removeClass.pass(['active'], activeBlock)
      );

      closeBtn.setStyle('display', 'none');
    });

    $('contentblocks').adopt(closeBtn);
    closeBtn.setStyle('display', 'none');
  }
});

window.addEvent('load', function () {
	checkPlayFromCookie.delay(500);
});

function handleTriggerClick (evt) {
  var trigger = $(evt.target),
      contentBlock = trigger.retrieve('contentblock'),
      activeBlock = $('contentblocks').getElement('.active');

  if (trigger.get('tag') != 'span' || contentBlock == activeBlock) {
    return;
  }

  if (activeBlock) {
    contentBlock.get('tween').start(0, 1).chain(function () {
      activeBlock.setStyle('opacity', 0);
      activeBlock.removeClass('active');
      contentBlock.addClass('active');
    });
  } else {
    contentBlock.get('tween').start(0, 1).chain(
      contentBlock.addClass.pass(['active'], contentBlock)
    );
  }

  $('contentblocks').getElement('.close').setStyle('display', '');
}

function checkPlayFromCookie() {
	var shouldPlay = Cookie.read('play');

	if(shouldPlay == 'true' || shouldPlay == null) {
	  playBackground();
	}	else {
		pauseBackground();
	}
}

function playBackground() {
	Cookie.write('play', 'true', {duration: 365});
	$('button').removeClass('play');
	$('button').addClass('pause');
	background_flash.playMovie();
}

function pauseBackground() {
	Cookie.write('play', 'false', {duration: 365});
	$('button').removeClass('pause');
	$('button').addClass('play');
	background_flash.pauseMovie();
}
