/*
    modal.js, Cybercast.mx (r) (c) 2011
    Contains main Modal box Object
    (c) 2011 Alternativa Digital S.A. de C.V.
*/

// MD is the main Cybercast Modal Object
var MD = { version: '1.00.01',
           loaded: 0,
           z_background: null,
           z_modal: null,
           z_url: null,
           z_width: null,
           z_height: null,
           z_callback: null,
           z_backgroundColor:'#000000',
           z_borderColor:'#ffffff'
         };

MD.loadScript = function(url, callback)
{
  var script = document.createElement("script")
  script.type = "text/javascript";

  if (script.readyState)
  {  //IE
    script.onreadystatechange = function()
    {
      if (script.readyState == "loaded" || script.readyState == "complete")
      {
        script.onreadystatechange = function() {};
        callback();
      }
    };
  }
  else
  {  //Others
    script.onload = function()
    {
      callback();
    };
  }

  script.src = url;
  document.getElementsByTagName("head")[0].appendChild(script);
}

MD.loadCSS = function(url)
{
  var css = document.createElement("link");
  css.rel = "stylesheet";
  css.type = "text/css";
  css.href = url;
  document.getElementsByTagName("head")[0].appendChild(css);
}

// Starter
MD.start = function()
{
	cybercastButton = document.getElementById('cybercastbutton');
	if(!cybercastButton)
	{
		alert('Verifica que exista el botón inicializador con el ID "cybercastbutton"');
		return;
	}

  // fill the main div with right navs
  if (MD.loaded < 2)
  {
    MD.loadScript('http://www.cybercast.mx/tools/core.js', MD.open);
    MD.loadScript('http://www.cybercast.mx/tools/channels/'+cybercastmodal.channel+'/modalconfig.js', MD.open);
    MD.loadCSS('http://cybercast.mx/tools/css/colorbox.css');
  }
  else
    MD.open();
}


if (window.readyState)
  {  //IE
    window.onreadystatechange = function()
    {
      if (window.readyState == "loaded" || window.readyState == "complete")
      {
        window.onreadystatechange = function() {};
        if (cybercastmodal.autoStart)
		  MD.start();
      }
    };
  }
  else
  {  //Others
    window.onload = function()
    {
      if (cybercastmodal.autoStart)
		  MD.start();
    };
  }



// Light box operation
MD.open = function()
{
  MD.loaded ++;
  if (MD.loaded < 2)
    return;

  MD.zoom()
}

// width, height are the sizeX and sizeY of the light box.
// if width and height are null, the size is automatically calculated (ONLY FOR AN IMAGE: type = 1,
//           For any other case, width and height MUST be set)
// file: is the file to load (case 1,2,3), with full web path
// callback: is the function to call when the light box is loaded
//function zoom(width, height, url, callback)
MD.zoom = function()
{
  MD.z_width = cybercastmodal_config.innerWidth;
  //MD.z_width = null;
  MD.z_height = cybercastmodal_config.innerHeight;
  //MD.z_height = null;
  MD.z_url = cybercastmodal_config.url;
  if (cybercastmodal_config.callback)
    MD.z_callback = cybercastmodal_config.callback;

  if(cybercastmodal.backgroundColor)
  MD.z_backgroundColor = cybercastmodal.backgroundColor;
  
  if(cybercastmodal.borderColor)
  MD.z_borderColor = cybercastmodal.borderColor;
    
  // 1. put the modal background
  if (!MD.z_background)
  {
    MD.z_background = WA.createDomNode('div', 'lightbg', 'modalbg');
    MD.z_background.style.zIndex = 10;
    document.body.appendChild(MD.z_background);
	  WA.Managers.event.on('click', MD.z_background, MD.closezoom, true);
  }
  MD.z_background.style.backgroundColor = MD.z_backgroundColor;
  MD.z_background.style.display = 'block';
  MD.z_background.style.height = WA.browser.getDocumentHeight() + 'px';

  if (!MD.z_modal)
  {
    MD.z_modal = WA.createDomNode('div', 'light', 'modal');
    MD.z_modal.style.zIndex = 10000;
    document.body.appendChild(MD.z_modal);
  }
  

  //WA.browser.setInnerHTML(MD.z_modal, '<div id="modalloader" style="padding: 15px; background-color: white; width: 120px; height: 30px; position: absolute; left: -60px; top: -30px; z-index: 1000;"><img src="http://cybercast.mx/tools/modalimg/loading.gif" style="vertical-align: middle;" alt="" title="" /> <b>Cargando...</b></div><div id="modalcontainer" style="position: absolute; overflow: hidden; opacity: 0; filter: alpha(opacity: 0); z-index: 1100;"><iframe id="modalimg" src="'+MD.z_url+'"></iframe></div><div id="modalclose" style="background-color: black; color: white; width: 30px; height: 30px; text-align: center; font-size: 24px; font-weight: bold; position: absolute; top: 0px; left: 0px; cursor: pointer;display:none">X</div>');

  WA.browser.setInnerHTML(MD.z_modal, '<div id="modalloader" style="padding: 15px; background-color: white; width: 120px; height: 30px; position: absolute; left: -60px; top: -30px; z-index: 1000;"><img src="http://cybercast.mx/tools/modalimg/loading.gif" style="vertical-align: middle;" alt="" title="" /> <b>Cargando...</b></div><div id="modalcontainer" style="position: absolute; overflow: hidden; opacity: 0; filter: alpha(opacity: 0); z-index: 1100;border:0px solid #ffffff;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;-moz-box-shadow:0 0 30px '+MD.z_borderColor+';-webkit-box-shadow:0 0 30px '+MD.z_borderColor+';box-shadow:0 0 30px '+MD.z_borderColor+';"><iframe id="modalimg" src="'+MD.z_url+'" style="border:0px solid #ffffff;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;"></iframe></div><img id="modalclose" src="http://cybercast.mx/tools/modalimg/close.png" style="width: 30px; height: 30px; position: absolute; top: 0px; left: 0px; cursor: pointer;display:none;border:0px solid #ffffff;-moz-border-radius:15px;-webkit-border-radius:15px;border-radius:15px;-moz-box-shadow:0 0 30px '+MD.z_borderColor+';-webkit-box-shadow:0 0 30px '+MD.z_borderColor+';box-shadow:0 0 30px '+MD.z_borderColor+';" style="vertical-align: middle;" alt="" title="" />');
  
  MD.adjustsize();
}

MD.adjustsize = function ()
{
  var modalimg = document.getElementById('modalimg');
  if ((MD.z_width == null || MD.z_height == null))
  {

	//var width = browser.getNodeWidth($('modalimg'));
    var width = WA.browser.getNodeWidth(modalimg);
    if (width == 0)
    {
      setTimeout(adjustsize, 100);
      return;
    }
  }

  if (MD.z_width == null)
  {
    var widthmax = WA.browser.getWindowWidth() - 100;
    //z_width = browser.getNodeWidth($('modalimg'));
    MD.z_width = WA.browser.getNodeWidth(modalimg);
    if (MD.z_width > widthmax)
    {
      MD.z_width = widthmax;
    }
  }

  if (MD.z_height == null)
  {
    var heightmax = WA.browser.getWindowHeight() - 100;
    //z_height = browser.getNodeHeight($('modalimg'));
    MD.z_height = WA.browser.getNodeHeight(modalimg);
    if (MD.z_height > heightmax)
    {
      MD.z_height = heightmax;
    }
  }

  WA.Managers.anim.createSprite('zoom', 'modalloader', MD.finaliFrame, {autostart:true, loop:false, chain: [{type:'move',time:400,xinit:-60,xend:-60,yinit:-30,yend:-(MD.z_height/2),winit:120,wend:120,hinit:30,hend:MD.z_height-30}, {type:'move',time:300,xinit:-60,xend:-(MD.z_width/2),yinit:-(MD.z_height/2),yend:-(MD.z_height/2),winit:120,wend:MD.z_width-30,hinit:MD.z_height-30,hend:MD.z_height-30}]});

  var modalcontainer = document.getElementById('modalcontainer');

  modalcontainer.style.width = MD.z_width+'px';
  modalcontainer.style.height = MD.z_height+'px';
  modalcontainer.style.left = -(MD.z_width/2)+'px';
  modalcontainer.style.top = -(MD.z_height/2)+'px';
  
}

MD.finaliFrame = function ()
{
	var modalcontainer = document.getElementById('modalimg');

  WA.Managers.anim.createSprite('zoom1', 'modalloader', null, {autostart:true, loop:false, chain: [{type:'move', time:500, tinit:100, tend: 0}]});
  WA.Managers.anim.createSprite('zoom2', 'modalcontainer', null, {autostart:true, loop:false, chain: [{type:'move',time:500, tinit:0, tend:100}]});
  //$('modalcontainer').style.visibility = '';
  modalcontainer.style.visibility = '';
   modalcontainer.style.width = MD.z_width+'px';
  modalcontainer.style.height = MD.z_height+'px';
  modalcontainer.style.marginWidth = -(MD.z_width/2)+'px';
  modalcontainer.style.marginHeight = -(MD.z_height/2)+'px';
  WA.toDOM('modalclose').style.left = -(MD.z_width/2+30)+'px';
  WA.toDOM('modalclose').style.top = -(MD.z_height/2)+'px';
  WA.Managers.event.on('click', WA.toDOM('modalclose'), MD.closezoom, true);
  WA.toDOM('modalclose').style.display='';
  
	if (MD.z_callback)
	  MD.z_callback();
}

MD.closezoom = function (e)
{
	var modalcontainer = WA.toDOM('modalcontainer');

  // check coords fuera de la modalcontainer parapoder cerrar
  var x = WA.browser.getCursorDocumentX(e);
  var y = WA.browser.getCursorDocumentY(e);
  /*
  var l = WA.browser.getNodeDocumentLeft($('modalcontainer'));
  var t = WA.browser.getNodeDocumentTop($('modalcontainer'));
  var w = WA.browser.getNodeWidth($('modalcontainer'));
  var h = WA.browser.getNodeHeight($('modalcontainer'));*/

  var l = WA.browser.getNodeDocumentLeft(modalcontainer);
  var t = WA.browser.getNodeDocumentTop(modalcontainer);
  var w = WA.browser.getNodeWidth(modalcontainer);
  var h = WA.browser.getNodeHeight(modalcontainer);

  if ( x < l || x > l + w || y < t || y > t + h )
  {
    MD.z_background.style.display = 'none';
    // empty the modal
    WA.browser.setInnerHTML(MD.z_modal, '');
  }
}