var mf; /* MooFlow */

var yPosNews = 0;
var scrollFxNews;

var allTeamMembers = [];
var currentTeamMember = 0;
var teamMemberFadeDuration = 80;

var visibleSliderItems = 0;



var flowplayerCanvasConfig =
		{
		backgroundColor: "#4f4f4f"
		};

var flowplayerPluginsConfig =
		{
		controls:
			{
			backgroundColor: '#222222',
			volumeSliderGradient: 'none',
			bufferGradient: 'none',
			progressGradient: 'medium',
			sliderColor: '#000000',
			sliderGradient: 'none',
			progressColor: '#666864',
			durationColor: '#ffffff',
			backgroundGradient: 'none',
			borderRadius: '0px',
			tooltipColor: '#5F747C',
			buttonOverColor: '#728B94',
			volumeSliderColor: '#000000',
			tooltipTextColor: '#ffffff',
			bufferColor: '#4f4f4f',
			buttonColor: '#575757',
			timeColor: '#01DAFF',
			timeBgColor: '#555555',
			height: 20,
			opacity: 1.0,
			time: false
			}
		};


/* --------------------------------------------------------------------------*/


String.implement({
  containsNoCase: function(string, separator)
  {
    return string && this.toLowerCase().contains(string.toLowerCase(), separator);
  }
});


Selectors.Pseudo.containsNoCase = function(text)
{
	return (this.innerText || this.textContent || '').containsNoCase(text);
};


/* --------------------------------------------------------------------------*/


function silverback_mediaSearch()
{
  var box = $('searchbox');
  var needles = box.value.split(' ');
  var visible;
  mf.master.images = [];
  visibleSliderItems = 0;

  allVideos.each(function(el)
  {
    visible = true;

    // show if empty search term OR term is found in a childelement
    for( var i=0; i<needles.length; i++ )
      visible = box.value=='' ||
        (
          el.caption.containsNoCase( needles[i] )
          || el.category.containsNoCase( needles[i] )
          || el.description.containsNoCase( needles[i] )
        );

    visibleSliderItems += visible ? 1 : 0;
    el.active = visible;
    if( el.active && el.appearsinslider ) mf.master.images.push(el);
  });

  silverback_resetCoverflow();
  mf.preloadImg();

  return false;
}


/* --------------------------------------------------------------------------*/


function silverback_teamSearch()
{
  var box = $('searchbox');
  var needles = box.value.split(' ');
  var visible;
  currentTeamMember = -1;
  visibleSliderItems = 0;

  for( var el=0; el<allTeamMembers.length; el++ )
  {
    visible = true;

    for( var i=0; i<needles.length; i++ )
        visible = box.value=='' || ( allTeamMembers[el].headline.containsNoCase(needles[i]) || allTeamMembers[el].desc.containsNoCase(needles[i]) );

    allTeamMembers[el].active = visible;
    visibleSliderItems += visible ? 1 : 0;
    if( currentTeamMember<0 && allTeamMembers[el].active ) currentTeamMember=el;
  }

  // ---

  for( var i=0; i<allTeamMembers.length; i++ )
    $('items').getChildren().each(function(el)
    {
      if( el.match(':containsNoCase("' +allTeamMembers[i].headline + '")') )
      {
        var dspl = allTeamMembers[i].active ? 'block' : 'none';
        el.setStyle( 'display',dspl );
      }
    });

  // ---

  if( allTeamMembers[currentTeamMember] != undefined ) silverback_makeTeamMemberCurrent( allTeamMembers[currentTeamMember].img );
  else silverback_makeTeamMemberCurrent( undefined );
}


/* --------------------------------------------------------------------------*/


function silverback_newsSearch()
{
  var box = $('searchbox');
  var needles = box.value.split(' ');
  var visible;

  $('newslistScroll').getChildren().each(function(el)
  {
    visible = true;

    // show if empty search term OR term is found in a childelement
    for( var i=0; i<needles.length; i++ )
    {
        visible = box.value=='' ||
          (
            visible && el.match(':containsNoCase(' + needles[i] + ')')
            // Safari obviously does not search non-visible elements by default
            || el.getChildren('div.completeText')[0].match(':containsNoCase(' + needles[i] + ')')
          );
    }

    el.style.display = visible ? 'block' : 'none';
  });

  // reset scrollable area for "scroll down" functionality
  yPosNews = 0;
  scrollFxNews.start( 0,yPosNews );

  return false;
}


/* --------------------------------------------------------------------------*/


function silverback_initSearchbox( searchType )
{
  switch ( searchType )
  {
    case 'news':
      $('searchlabel').addEvent('click', function(event){silverback_newsSearch();return false;});
      $('search').addEvent('submit', function(event){silverback_newsSearch();return false;});
      $('search').setStyle('display','block');
    break;

    case 'media':
      $('searchlabel').addEvent('click', function(event){silverback_mediaSearch();return false;});
      $('search').addEvent('submit', function(event){silverback_mediaSearch();return false;});
      $('search').setStyle('display','block');
    break;

    case 'team':
      $('searchlabel').addEvent('click', function(event){silverback_teamSearch();return false;});
      $('search').addEvent('submit', function(event){silverback_teamSearch();return false;});
      $('search').setStyle('display','block');
    break;
  }
}


/* --------------------------------------------------------------------------*/


function silverback_hidePlayer()
{
  $( 'silverback_player' ).set( 'html', '' );
  silverback_fadeOutLayer();
}


/* --------------------------------------------------------------------------*/


function silverback_openPlayer( videoName )
{
  $( 'silverback_player' ).set( 'html', '<a href="tl_files/media/' + videoName + '.mp4" id="player"></a>' );
  flowplayer( 'player', 'tl_files/silverback_code/flowplayer/flowplayer-3.1.5.swf', {canvas:flowplayerCanvasConfig, plugins:flowplayerPluginsConfig} );

  var closeBtnContainer = new Element('h3').addClass('close').inject( $('player'), 'after' );
  var closeBtn = new Element('a').setProperty('href','javascript:silverback_hidePlayer()').set('html','Close X').inject( closeBtnContainer );
}

var silverback_openPlayerDelayed = silverback_openPlayer.create({delay:500});


/* --------------------------------------------------------------------------*/


function silverback_playVideoFromImgSrc( src )
{
  silverback_fadeInLayer();

  var name=src.split( '/' );
  name = name[name.length-1];
  name = name.replace( '\.jpg', '' );
  silverback_openPlayerDelayed( name );
}


/* --------------------------------------------------------------------------*/


function silverback_onCoverflowClick( elem )
{
  silverback_playVideoFromImgSrc( elem.src );
}


/* --------------------------------------------------------------------------*/


function silverback_initMediaSlider()
{
  var itemsPerSlide = 5;
  var slides = Math.ceil(allVideos.length/itemsPerSlide);
  var pos = 0;
  var offset = 900 + 20; /*width + padding*/
  var currentslide = 1;

  var imgscroll = new Fx.Scroll('thumbs',
  {
    offset: {'x':0,'y':0},
    duration: 700,
    transition: Fx.Transitions.Quad.easeInOut
  }).toLeft();

  $('moveleft').addEvent('click', function(event)
  {
    event.stop().preventDefault();
    if( currentslide==1 || visibleSliderItems<itemsPerSlide ) return;
    currentslide--;
    pos += -(offset);
    imgscroll.start(pos);
  });

  $('moveright').addEvent('click', function(event)
  {
    event.stop().preventDefault();
    if( currentslide>=slides || visibleSliderItems<itemsPerSlide ) return;
    currentslide++;
    pos += offset;
    imgscroll.start(pos);
  });

  $('thumbs').addEvent('mousewheel', function(event)
  {
    if( event.wheel>0 );
    else if( event.wheel<0 );
  });
}


/* --------------------------------------------------------------------------*/


function silverback_resetCoverflow()
{
  $('videos').empty();

  var ul = $('items');
  ul.empty();

  allVideos.each(function(el)
  {
    if( el.active )
    {
      var thisLi = new Element('li').inject(ul);
      var thisA = new Element('a').addClass('item').inject(thisLi);
      var thisImg = new Element('img').inject(thisA);
      var thisCategory = new Element('div').addClass('category').inject(thisLi);

      thisA.setProperties({'class':'item','href':'javascript:silverback_playVideoFromImgSrc("'+el.src+'");'});
      thisImg.setProperties({'src':el.src,'alt':el.caption,'class':'thumb'});
      thisCategory.setProperty('html',el.category);
    }
  });
}


/* --------------------------------------------------------------------------*/


function silverback_initCoverflow()
{
  var slider = new Element('div').setProperty('id','slider').inject( $('silverback_player'), 'before' );
  var wrapper = new Element('div').setProperty('id','thumbs').inject( slider );
  var ul = new Element('ul').setProperty('id','items').inject( wrapper );
  var left = new Element('a').setProperties({'id':'moveleft','href':'#'}).inject(wrapper, 'before');
  var right = new Element('a').setProperties({'id':'moveright','href':'#'}).inject(wrapper, 'after');

  mf = new MooFlow( $('videos' ), {'onClickView':silverback_onCoverflowClick} );
  mf.addEvent('start', function(event)
  {
    visibleSliderItems = allVideos.length;
    silverback_initSearchbox('media');
  });

  silverback_resetCoverflow();

  $('videos').setStyle('display','block');
  silverback_initMediaSlider();
}


/* --------------------------------------------------------------------------*/


function silverback_initMedia()
{
  silverback_initCoverflow();
}


/* --------------------------------------------------------------------------*/


function silverback_initGoogleMaps()
{
  if (GBrowserIsCompatible())
  {
    var map = new GMap2( document.getElementById("map_canvas") );
    map.setCenter( new GLatLng(59.319822,18.052939), 16 );
    map.addOverlay( new GMarker(new GLatLng(59.320871,18.053082)) );
    map.addControl( new GSmallZoomControl() );
  }
}


/* --------------------------------------------------------------------------*/


function silverback_fadeInLayer()
{
  if($('loginbutton')) $( 'loginbutton' ).fade( '0' ).setStyle( 'display','none' );
  if($('logoutbutton')) $( 'logoutbutton' ).fade( '0' ).setStyle( 'display','none' );
  $( 'layer' ).set( 'opacity','0' ).setStyle( 'display','block' ).fade( '0.85' );
}


/* --------------------------------------------------------------------------*/


function silverback_fadeOutLayer()
{
  var fx = new Fx.Tween( $('layer') );
  fx.start( 'opacity',0 ).chain(function(){ $('layer').setStyle('display','none') });

  if($('loginbutton')) $( 'loginbutton' ).setStyle( 'display','block' ).fade( '1' );
  if($('logoutbutton')) $( 'logoutbutton' ).setStyle( 'display','block' ).fade( '1' );
}


/* --------------------------------------------------------------------------*/


function silverback_hideLoginForm()
{
  var fx = new Fx.Tween( $('loginform') );
  fx.start( 'opacity',0 ).chain(function(){ $('loginform').setStyle('display','none') });

  silverback_fadeOutLayer();
}


/* --------------------------------------------------------------------------*/


function silverback_showLoginForm()
{
  $( 'loginform' ).set( 'opacity','0' ).setStyle( 'display','block' ).fade( '1' );
  silverback_fadeInLayer();
}


/* --------------------------------------------------------------------------*/


function silverback_buildTeamMembers()
{
  var divs = $( 'team-member' ).getChildren();
  
  $$(divs).each(function(el)
  {
    try
    {
      var hash = $H();
      var head = el.getElement('h1');
      var img = el.getElement('img');

      hash.combine( {'headline':head.get('html')} );
      head.dispose();

      hash.combine( {'img':img.get('src')});
      hash.combine( {'imgGray':silverback_desaturate(img) });
      img.getParent('div').dispose();

      hash.combine( {'desc':el.get('html').trim() } );
      hash.combine( {'active':true} );

      allTeamMembers.push( hash.getClean() );
    }
    catch(e){}
  });
}


/* --------------------------------------------------------------------------*/


function silverback_nextTeamMember()
{
  for( var i=currentTeamMember+1; i<allTeamMembers.length+currentTeamMember; i++ )
    if( allTeamMembers[i%allTeamMembers.length].active )
    {
      silverback_makeTeamMemberCurrent( allTeamMembers[i%allTeamMembers.length].img );
      return;
    }
}

function silverback_previousTeamMember()
{
  for( var i=currentTeamMember-1+allTeamMembers.length; i>0; i-- )
    if( allTeamMembers[i%allTeamMembers.length].active )
    {
      silverback_makeTeamMemberCurrent( allTeamMembers[i%allTeamMembers.length].img );
      return;
    }
}


/* --------------------------------------------------------------------------*/


function silverback_onTeamMemberFadedOut()
{
  if( currentTeamMember<0 || currentTeamMember>allTeamMembers.length-1 ) return;

	$( 'teamImage' ).setProperties({ 'src':allTeamMembers[currentTeamMember].img, 'alt':allTeamMembers[currentTeamMember].headline });
	$( 'teamImage' ).tween('opacity','1');

  $( 'teamDescription' ).setProperty('html',allTeamMembers[currentTeamMember].desc);
  var name = new Element('h3').set('html',allTeamMembers[currentTeamMember].headline).inject( $('teamDescription'), 'top' );
  $( 'teamDescription' ).tween('opacity','1');
}

var silverback_onTeamMemberFadedOutDelayed = silverback_onTeamMemberFadedOut.create({delay:teamMemberFadeDuration});


/* --------------------------------------------------------------------------*/


function silverback_refreshCurrentTeamMemberView()
{
  if( allTeamMembers[currentTeamMember]!=undefined && $('teamImage').getProperty('src')==allTeamMembers[currentTeamMember].img && $('teamImage').getStyle('opacity')!='0' ) return;

  $( 'teamImage' ).tween('opacity','0');
  $( 'teamDescription' ).tween('opacity','0');

  silverback_onTeamMemberFadedOutDelayed();
}


/* --------------------------------------------------------------------------*/


function silverback_makeTeamMemberCurrent( imgSrc )
{
  for( var i=0; i<allTeamMembers.length; i++ )
  {
    $( 'teamMember'+i ).setProperty('src',allTeamMembers[i].imgGray);

    if( allTeamMembers[i].img==imgSrc )
    {
      if( allTeamMembers[i].active==false ) break;
      if( i==currentTeamMember && $('teamMember'+i).getProperty('src')==allTeamMembers[i].img ) break;

      $( 'teamMember'+i ).setProperty('src',allTeamMembers[i].img);
      currentTeamMember = i;
    }
  }

  silverback_refreshCurrentTeamMemberView();
}


/* --------------------------------------------------------------------------*/


function silverback_initTeamSlider()
{
  var slider = new Element('div').setProperty('id','slider').inject( $('team-member') );
  var wrapper = new Element('div').setProperty('id','thumbs').inject( slider );
  var ul = new Element('ul').setProperty('id','items').inject( wrapper );
  var left = new Element('a').setProperties({'id':'moveleft','href':'#'}).inject(wrapper, 'before');
  var right = new Element('a').setProperties({'id':'moveright','href':'#'}).inject(wrapper, 'after');
  var i=0;

  allTeamMembers.each(function(el)
  {
    var thisLi = new Element('li').inject(ul);
    var thisHeadline = new Element('div').addClass('headline').set('text',el.headline).inject(thisLi);
    var thisA = new Element('a').addClass('item').inject(thisLi);
    var thisImg = new Element('img').inject(thisA);
    thisA.setProperties({'class':'item','href':'javascript:silverback_makeTeamMemberCurrent("'+el.img+'");'});
    thisA.addEvents({
      'mouseenter': function()
      {
        thisHeadline.setStyle('visibility','visible');
        thisImg.setProperty('src',el.img);
      },
      'mouseleave': function()
      {
        thisHeadline.setStyle('visibility','hidden');
        if(thisImg.getProperty('id') != 'teamMember'+currentTeamMember) thisImg.setProperty('src',el.imgGray);
      }
    });

    var thisSrc = i==currentTeamMember ? el.img : el.imgGray;
    thisImg.setProperties({'src':thisSrc,'alt':el.caption,'class':'thumb','id':'teamMember'+i});
    i++;
  });

  // -----

  var itemsPerSlide = 9;
  var slides = allTeamMembers.length-itemsPerSlide+1;
  var pos = 0;
  var offset = 101;
  var currentslide = 1;

  var imgscroll = new Fx.Scroll('thumbs',
  {
    offset: {'x':0,'y':0},
    duration: 200,
    transition: Fx.Transitions.Quad.easeInOut
  }).toLeft();

  $('moveleft').addEvent('click', function(event)
  {
    event.stop().preventDefault();
    if( currentslide==1 || visibleSliderItems<itemsPerSlide ) return;
    currentslide--;
    pos += -(offset);
    imgscroll.start(pos);
  });

  $('moveright').addEvent('click', function(event)
  {
    event.stop().preventDefault();
    if( currentslide>=slides || visibleSliderItems<itemsPerSlide ) return;
    currentslide++;
    pos += offset;
    imgscroll.start(pos);
  });

  $('thumbs').addEvent('mousewheel', function(event)
  {
    if( event.wheel>0 );
    else if( event.wheel<0 );
  });
}


/* --------------------------------------------------------------------------*/


function silverback_initTeam()
{
  silverback_buildTeamMembers();
  if( !allTeamMembers.length ) return;
  visibleSliderItems = allTeamMembers.length;
  $( 'team-member' ).empty();

  var previous = new Element('a').setProperties({ 'id':'teamPrevious', 'href':'javascript:silverback_previousTeamMember();' }).inject( $('team-member') );
  var img = new Element('img').setProperties({ 'id':'teamImage', 'alt':allTeamMembers[currentTeamMember].headline, 'src':allTeamMembers[currentTeamMember].img }).inject( $('team-member') );
  var description = new Element('div').setProperties({ 'id':'teamDescription', 'html':allTeamMembers[currentTeamMember].desc }).inject( $('team-member') );
  var name = new Element('h3').set('html',allTeamMembers[currentTeamMember].headline).inject( description, 'top' );
  var next = new Element('a').setProperties({ 'id':'teamNext', 'href':'javascript:silverback_nextTeamMember();' }).inject( $('team-member') );

  silverback_initTeamSlider();

  img.set( 'tween', {duration:teamMemberFadeDuration} );
  $('team-member').setStyle('display','block');

  silverback_initSearchbox('team');
}


/* --------------------------------------------------------------------------*/


function silverback_initHome()
{
  flowplayer( 'player', 'tl_files/silverback_code/flowplayer/flowplayer-3.1.5.swf', {canvas:flowplayerCanvasConfig, plugins:flowplayerPluginsConfig} );
}


/* --------------------------------------------------------------------------*/


function silverback_initNewsList()
{
  var newsList = $('newslist');
  var newslistScroll = $('newslistScroll');
  var newslistContainer = newslistScroll.getParent();
  var newsUp = new Element('a').setProperties({'id':'newsUp'}).inject(newsList);
  var newsDown = new Element('a').setProperties({'id':'newsDown'}).inject(newsList);

  scrollFxNews = new Fx.Scroll(newslistContainer,
  {
    offset: {'x':0,'y':0},
    duration: 250,
    transition: Fx.Transitions.Quad.easeInOut
  }).toTop();

  // -----

  newsUp.addEvent('click', function(event)
  {
    event.stop().preventDefault();

    var top = parseInt(newsList.getStyle('padding-top'));
    var children = newslistScroll.getChildren('div.layout_short');

    for( var i=0; i<children.length; i++ )
    {
      if( children[i].getStyle('display')=='block' && children[i].getCoordinates(newsList).bottom>=top )
      {
        yPosNews = Math.max( 0, children[i].getCoordinates().top-newslistScroll.getCoordinates().top );
        scrollFxNews.cancel();
        scrollFxNews.start( 0,yPosNews );
        return;
      }
    }
  });

  // -----

  newsDown.addEvent('click', function(event)
  {
    event.stop().preventDefault();

    var children = newslistScroll.getChildren('div.layout_short');
    for( var i=0; i<children.length; i++ )
    {
      if( children[i].getStyle('display')=='block' && children[i].getCoordinates(newsList).top>newslistContainer.getCoordinates().height )
      {
        yPosNews += children[i].getCoordinates().height;
        scrollFxNews.cancel();
        scrollFxNews.start( 0,yPosNews );
        return;
      }
    }
  });
}


/* --------------------------------------------------------------------------*/


function silverback_initNews()
{
  silverback_initNewsList();
  silverback_initSearchbox('news');
}


/* --------------------------------------------------------------------------*/


/* http://www.ajaxblender.com/howto-convert-image-to-grayscale-using-javascript.html */
function silverback_desaturate( imgObj )
{
  // IE?
  if( Browser.Engine.trident ) return imgObj.src;

  var imgW = imgObj.width;
  var imgH = imgObj.height;

  var canvas = document.createElement('canvas');
  canvas.width = imgW;
  canvas.height = imgH;

  var canvasContext = canvas.getContext('2d');
  canvasContext.drawImage(imgObj, 0, 0);

  var imgPixels = canvasContext.getImageData(0, 0, imgW, imgH);

  for(var y = 0; y < imgPixels.height; y++)
    for(var x = 0; x < imgPixels.width; x++)
    {
          var i = (y * 4) * imgPixels.width + x * 4;
          var avg = (imgPixels.data[i] + imgPixels.data[i + 1] + imgPixels.data[i + 2]) / 3;
          imgPixels.data[i] = avg;
          imgPixels.data[i + 1] = avg;
          imgPixels.data[i + 2] = avg;
    }

  canvasContext.putImageData(imgPixels, 0, 0, 0, 0, imgPixels.width, imgPixels.height);
  return canvas.toDataURL();
}
