// Slide Gallery Media: May 2007
// OO Slide Media for Slide Gallery.js

// this file contains definitions for:
//  Slide (slide factory)
//  ImageSlide, DownloadSlide, VideoSlide (slide types)



var FLV_VIDEO_FUDGE = 20;  // compensate for flash video controls
var MAIN_STAGE_W = 1000;   // width of main display area
var MAIN_STAGE_H = 365;    // height of main display area

// Slide Factory, builds on 'type'
//
function Slide(type, o) {
  switch (type) {
    
    case "image":     // image type slide
      return new ImageSlide(o);
      break;
      
    case "download":  // download type slide
      return new DownloadSlide(o);
      break;
      
    case "video":     // video type slide
      return new VideoSlide(o);
      break;
      
    default:  // unknown slide type: error
      alert("unknown slide type: " + type);
      break;
    
  }
}

function create360(foUrl){
	

	// build a url so the flash object knows which swf to load (and where to point that swf for assets)
	//var foUrl = cacheflyPath+"/MMNA/swf/vehicleViews.swf?xmlpath=/MMNA/eclipse/09/xml/mitsubishi_eclipse_360_color."+langCode+".xml&filepath="+cacheflyPath+"&domainPath="+domainPath;
	var fo = new SWFObject(foUrl, "vehicle360", "1000", "495", "6", "black");
	fo.addParam("scale", "noscale");
	fo.addParam("menu", "false");
	fo.addParam("wmode", "transparent");
	fo.write("displayArea");
	fo = null;
	delete(fo);
	
	var contr = document.getElementById("scrollContainer");
	contr.style.top = "468px";
}


function drawMoviePlayer(movieId, o) {
	//o.(width|height)
	var so = new SWFObject(cacheflyPath+"/MMNA/swf/player.swf?path=" + movieId ,"commercialFlash", o.width, o.height, "10", "black");  // height: video+20px
	so.addParam("scale", "noscale");
	so.addParam("menu", "true");
	so.addParam("wmode", "transparent");
	so.addParam("allowFullScreen", "true");
	so.addVariable("width", "");
	so.addVariable("height", "");
	so.addVariable("volume", "50");
	so.addVariable("controls", "true");
	so.addParam("style", "border:1px solid #ED1C24;");
	so.write("inlineFlashVideo");
	so = null;
	delete(so);
}



// TemplateRenderClosureGenerator()
//   creates a function to do template rendering specific to each slide type
function TemplateRenderClosureGenerator(TemplateClass) {
  
  // this function is the same for all slides,
  //  the change is the template class

  //   accepts object with keys which correspond to names of regexp
  //   { left:4, id:'blorf42', ...}
  //   accepts optional template
  
  return function(o, template) {
      var tmpl = "";
      if (template != undefined) {
        tmpl = template;
      } else {
        tmpl = TemplateClass();
      }
      
      // replace items
      var re = null;
      var regexps = TemplateClass.re;
      for (var key in o) {
        re = regexps[key];
        tmpl = tmpl.replace(re, o[key]);
      }
      return tmpl;
    }
}




/* START: Slide View - Image */

function Image_ThumbViewTemplate(size) {
  var template = "<div style='position:absolute; top:0px; left:_REPLACE_STYLE_LEFTpx; width:_REPLACE_WIDTHpx; height:_REPLACE_HEIGHTpx;'><a href='javascript:SlideGallery.displaySlide(\"_REPLACE_ID\")'><img src='_REPLACE_SRC' onmouseover='SlideGallery.slideEvent(this, \"_REPLACE_ID\", EVENT_OVER)' onmouseout='SlideGallery.slideEvent(this, \"_REPLACE_ID\", EVENT_OUT)' border='0'/></a></div>";
  return template;
}

// setup regexps for the template
Image_ThumbViewTemplate.re = new Object();
Image_ThumbViewTemplate.re.left = new RegExp(/_REPLACE_STYLE_LEFT/);
Image_ThumbViewTemplate.re.src = new RegExp(/_REPLACE_SRC/);
Image_ThumbViewTemplate.re.id = new RegExp(/_REPLACE_ID/g);
Image_ThumbViewTemplate.re.height = new RegExp(/_REPLACE_HEIGHT/);
Image_ThumbViewTemplate.re.width = new RegExp(/_REPLACE_WIDTH/);

// render
Image_ThumbViewTemplate.render = TemplateRenderClosureGenerator(Image_ThumbViewTemplate);

/* END: Slide View - Image */


/* START: Main View - Image */

function Image_MainViewTemplate(){
  var template = "<img src='_REPLACE_SRC' border='0'/>";
  return template;
}

// setup regexps for the template
Image_MainViewTemplate.re = new Object();
Image_MainViewTemplate.re.img = new RegExp(/_REPLACE_SRC/);

// render
Image_MainViewTemplate.render = TemplateRenderClosureGenerator(Image_MainViewTemplate);

/* END: Main View - Image */


/* START: Main View - Download */

// download button images, eng/span
if(typeof galleryBtn_download_img != "undefined")
{
	Download_MainViewTemplate.imgHash = {
	  'download': galleryBtn_download_img,
	  '800': { dwnOffSrc: galleryBtn_800_img, dwnOverSrc: galleryBtn_800over_img },
	  '1024': { dwnOffSrc: galleryBtn_1024_img, dwnOverSrc: galleryBtn_1024over_img },
	  '1280': { dwnOffSrc: galleryBtn_1280_img, dwnOverSrc: galleryBtn_1280over_img },
	  'pdf': { dwnOffSrc: galleryBtn_pdf_img, dwnOverSrc: galleryBtn_pdfover_img }
	}
}


function Download_MainViewTemplate(){
  var template = "<img src='_REPLACE_SRC' border='0'/><br/><div style='position:absolute; color:black; top:330px; width:100%; text-align:center;'>_DOWNLOAD_BUTTONS</div>";
  return template;
}

// setup regexps for the template
Download_MainViewTemplate.re = new Object();
Download_MainViewTemplate.re.download_buttons = new RegExp(/_DOWNLOAD_BUTTONS/);
Download_MainViewTemplate.re.src = new RegExp(/_REPLACE_SRC/);

// renderTemplate
Download_MainViewTemplate.renderTemplate = TemplateRenderClosureGenerator(Download_MainViewTemplate);



function Download_MainViewImageTemplate() {
  var template = "<a href='_REPLACE_DWNLDSRC'><img src='_DWNSLD_OFF_SRC' onmouseover='this.src=\"_DWNSLD_OVER_SRC\"' onmouseout='this.src=\"_DWNSLD_OFF_SRC\"' border='0'/></a>";
  return template;
}

// setup regexps for the img template
Download_MainViewImageTemplate.re = new Object();
Download_MainViewImageTemplate.re.dwnldSrc = new RegExp(/_REPLACE_DWNLDSRC/);
Download_MainViewImageTemplate.re.dwnOffSrc = new RegExp(/_DWNSLD_OFF_SRC/g);
Download_MainViewImageTemplate.re.dwnOverSrc = new RegExp(/_DWNSLD_OVER_SRC/g);

// renderImgTemplate
Download_MainViewImageTemplate.renderTemplate = TemplateRenderClosureGenerator(Download_MainViewImageTemplate);


// render()
//  o - object with slide image params
//  d - object with download image params (size, path)
Download_MainViewTemplate.render = function(o, main_tmpl) {
  // this uses the other render functions

  var img = o.img;
  var d = o.download;
  
  var buttonImgs = Download_MainViewTemplate.imgHash;
  var typeList = ['800', '1024', '1280', 'pdf'];  // used for ordering output
  
  var tmpl = "";
  var tmp = "";
    
  // add download button to temp template
  //   use image template - void() for download src
  //   off/over are the same image
  var b = { dwnldSrc:'javascript:void(0);', dwnOffSrc: buttonImgs['download'], dwnOverSrc: buttonImgs['download']};
  tmp = Download_MainViewImageTemplate.renderTemplate(b);
  tmpl = tmpl + tmp;
  
  var dwnld_prefix = "/MMNA/download.do?path=";  // download helper action

  // add image buttons to temp template
  for (var i=0; i<typeList.length; i++) {
    
    var imgType = typeList[i];  // eg, '800', 
    if (d.hasOwnProperty(imgType) != true) { continue;}
    
    // replace button off/over
    //  set download path, button off/over
    var b = { dwnldSrc: dwnld_prefix + d[imgType], dwnOffSrc: buttonImgs[imgType]['dwnOffSrc'], dwnOverSrc: buttonImgs[imgType]['dwnOverSrc']};
    tmp = Download_MainViewImageTemplate.renderTemplate(b);
    
    tmpl = tmpl + tmp;
  }
    
  // add lrg img & rendered buttons to main template
  //  p_dwnld = parameters for download render
  var p = {src : img};
  p['download_buttons'] = tmpl;
  main_tmpl = Download_MainViewTemplate.renderTemplate(p, main_tmpl);

  return main_tmpl;
}

/* END: Main View - Download */



/* START: Main View - Video */

function Video_MainViewTemplate(){
  var template = '<div id="movieBackground" style="position:absolute; background-image:url(/MMNA/images/gallery/gallery_mainview_gradient.en-us.jpg); width:100%; height:365px; "><div id="movieTitle" style="font-size:16px; position:absolute; line-height:1.7em; left:780px; top:160px; font-weight:bold; height:50px; color:white;">_REPLACE_TITLE_TXT</div> <div id="inlineFlashVideo" style="position:absolute; border: 1px solid #ED1C24; height:_REPLACE_MOVIE_Hpx; width:_REPLACE_MOVIE_Wpx; left:_REPLACE_MOVIE_Lpx; background-color:black; margin-top:20px;"><a href="#"><img src="_REPLACE_IMG_PATH" width="_REPLACE_MOVIE_W" height="_REPLACE_MOVIE_H" alt="" border="0" onClick="drawMoviePlayer(\'_REPLACE_MOVIE_PATH\', {width:\'_REPLACE_MOVIE_W\', height:\'_REPLACE_MOVIE_H\'})" /></a></div> <div id="movieInfo" style="position:absolute; width:_REPLACE_INFO_Wpx; left:780px; bottom:120px; color:#999999;">_REPLACE_INFO_TXT</div></div>';
  
  return template;
}

// setup regexps for the template
Video_MainViewTemplate.re = new Object();
Video_MainViewTemplate.re.movie_path = new RegExp(/_REPLACE_MOVIE_PATH/g);
Video_MainViewTemplate.re.movie_w = new RegExp(/_REPLACE_MOVIE_W/g);
Video_MainViewTemplate.re.movie_h = new RegExp(/_REPLACE_MOVIE_H/g);
Video_MainViewTemplate.re.movie_left = new RegExp(/_REPLACE_MOVIE_L/g);
Video_MainViewTemplate.re.img_path = new RegExp(/_REPLACE_IMG_PATH/g);
Video_MainViewTemplate.re.info_left = new RegExp(/_REPLACE_INFO_L/g);
Video_MainViewTemplate.re.info_bottom = new RegExp(/_REPLACE_INFO_B/g);
Video_MainViewTemplate.re.info_width = new RegExp(/_REPLACE_INFO_W/g);
Video_MainViewTemplate.re.info_txt = new RegExp(/_REPLACE_INFO_TXT/g);
Video_MainViewTemplate.re.title_txt = new RegExp(/_REPLACE_TITLE_TXT/g);

// render
Video_MainViewTemplate.render = TemplateRenderClosureGenerator(Video_MainViewTemplate);


/* END: Main View - Video */




/* ####################################
/* ALL SLIDE TYPES DEFINED BELOW     */


function BaseSlide(o) {
  // a couple of important variables, both assigned by Tray()
  this.id = null;
  this.position = 0;
  
  // these store pre-rendered views
  this.slide_view = null;
  this.main_view = null;
}

ImageSlide.prototype.setId = function(id) {
  
  this.id = id;
  this.render({id:this.id});
}

ImageSlide.prototype.setPosition = function(position) {
  
  this.position = position;
  var left_pos = position * SlideGallery.thumbWidth;
  this.render({left:left_pos});
}

ImageSlide.prototype.getSlideView = function() {
  return this.slide_view;
}

ImageSlide.prototype.getMainView = function() {
  return this.main_view;
}





/* START: Image Slide */
function ImageSlide(o) {
  this.id = null;        // assigned by tray
  this.position = 0;     // assigned by tray
  
  // img thumb vars
  this.thumb_vars = o.thumb  // thumb.(off|over)
  
 /* 
  // slide min
if (o.has(slide_min)}
	this.slidemin = o.slide_min
else
	this.slidemin = ImageSlide.SLIDE_MIN
}
*/
  // img main vars
  this.main_vars = o.main;   // main.img
  
  // these store pre-rendered views
  this.thumb_view = null;
  this.main_view = null;

  // setup params for rendering
  var p = new Object();
  
  p.t = this.thumb_vars;
  p.t.src = this.thumb_vars.off;
  p.t.width = SlideGallery.thumbWidth;
  p.t.height = SlideGallery.thumbHeight;
  
  p.m = this.main_vars;
  
  this.render(p);
}

/*
ImageSlide.SLIDE_MIN = 6; //default
*/
ImageSlide.prototype.setId = function(id) {
  
  this.id = id;
  this.render({t:{id:this.id}});
}

ImageSlide.prototype.setPosition = function(position) {
  
  this.position = position;
  var left_pos = position * SlideGallery.thumbWidth;
  this.render({t:{left:left_pos}});
}

ImageSlide.prototype.getSlideView = function() {
  return this.thumb_view;
}

ImageSlide.prototype.getMainView = function() {
  return this.main_view;
}



// render
//  renders all templates for a slide
ImageSlide.prototype.render = function(o) {
  
  if (o.hasOwnProperty('t') == true) {
    this.thumb_view = Image_ThumbViewTemplate.render(o.t, this.thumb_view);
  }

  if (o.hasOwnProperty('m') == true) {
    this.main_view = Image_MainViewTemplate.render(o.m, this.main_view);
  }
}

// getSlideImagePath(state) - on, off, over
//   returns paths of slide images
ImageSlide.prototype.getSlideImagePath = function(state) {
  var img_path = "";
  switch(state) {
    case "on":
      img_path = this.thumb_vars.over;
      break;
    case "off":
      img_path = this.thumb_vars.off;
      break;
    case "large":
      img_path = this.main_vars.img;
      break;
    default:
      break;
  }
  return img_path;
}


/* END: Image Slide */



/* START: Download Slide */


function DownloadSlide(o) {
  this.id = null;        // assigned by tray
  this.position = 0;  // assigned by tray
  
  // img thumb vars
  this.thumb_vars = o.thumb  // thumb.(off|over)
  
  // img main vars
  this.main_vars = o.main;   // main.(img|download), download.(800|1024|1280|pdf)
  
  // these store pre-rendered views
  this.thumb_view = null;
  this.main_view = null;

  // setup params for rendering
  var p = new Object();
  
  p.t = this.thumb_vars;
  p.t.src = this.thumb_vars.off;
  p.t.width = SlideGallery.thumbWidth;
  p.t.height = SlideGallery.thumbHeight;

  p.m = this.main_vars;

  this.render(p);
}


DownloadSlide.prototype.setId = function(id) {
  
  this.id = id;
  this.render({t:{id:this.id}});
}

DownloadSlide.prototype.setPosition = function(position) {
  
  this.position = position;
  var left_pos = position * SlideGallery.thumbWidth;
  this.render({t:{left:left_pos}});
}

DownloadSlide.prototype.getSlideView = function() {
  return this.thumb_view;
}

DownloadSlide.prototype.getMainView = function() {
  return this.main_view;
}


// render
//  renders all templates for a slide
DownloadSlide.prototype.render = function(o) {
  
  if (o.hasOwnProperty('t') == true) {
    this.thumb_view = Image_ThumbViewTemplate.render(o.t, this.thumb_view);
  }
  if (o.hasOwnProperty('m') == true) {
    this.main_view = Download_MainViewTemplate.render(o.m, this.main_view);
  }
}

// getSlideImagePath(state) - on, off, over
//   returns paths of slide images
DownloadSlide.prototype.getSlideImagePath = function(state) {
  var img_path = "";
  switch(state) {
    case "on":
      img_path = this.thumb_vars.over;
      break;
    case "off":
      img_path = this.thumb_vars.off;
      break;
    case "large":
      img_path = this.main_vars.img;
      break;
    default:
      break;
  }
  return img_path;
}


/* END: Download Slide */


/* START: Video Slide */

function VideoSlide(o) {
  this.id = null;        // assigned by tray
  this.position = 0;  // assigned by tray
  
  // img thumb vars
  this.thumb_vars = o.thumb  // thumb.(off|over)
  
  // img main vars
  this.main_vars = o.main;   // main.(img|video), video.(height|width|title|info|path)
  
  // these store pre-rendered views
  this.thumb_view = null;
  this.main_view = null;


  this.video = this.main_vars.video;
  
  // setup params for rendering
  var p = new Object();
  
  // thumbnail params
  p.t = this.thumb_vars;
  p.t.src = this.thumb_vars.off;
  p.t.width = SlideGallery.thumbWidth;
  p.t.height = SlideGallery.thumbHeight;
  

  // setup main view params
  p.m = new Object()
  
  var v = this.video;
  var mov_h = v.height + FLV_VIDEO_FUDGE;
  var mov_left = (MAIN_STAGE_W - v.width) / 2;
  var info_l = mov_left + v.width + 20;    // plus padding
  var info_b = MAIN_STAGE_H - mov_h - 25 - 24;  // minus top padding & title
  var info_w = MAIN_STAGE_W - info_l - 10;  // minus fudge
  
  p.m.movie_path = v.path;
  p.m.img_path = v.img;
  p.m.movie_w = v.width;
  p.m.movie_h = mov_h;
  p.m.movie_left = mov_left;
  p.m.info_txt = v.info;
  p.m.info_left = info_l;
  p.m.info_bottom = info_b;
  p.m.info_width = info_w;
  p.m.title_txt = v.title;
  
  this.render(p);
}


VideoSlide.prototype.setId = function(id) {
  
  this.id = id;
  this.render({t:{id:this.id}});
}

VideoSlide.prototype.setPosition = function(position) {
  
  this.position = position;
  var left_pos = position * SlideGallery.thumbWidth;
  this.render({t:{left:left_pos}});
}

VideoSlide.prototype.getSlideView = function() {
  return this.thumb_view;
}

VideoSlide.prototype.getMainView = function() {
  return this.main_view;
}


// render
//  renders all templates for a slide
//  param 'o': has m & s objects for slide,main
//
VideoSlide.prototype.render = function(o) {
  
  if (o.hasOwnProperty('t') == true) {
    this.thumb_view = Image_ThumbViewTemplate.render(o.t, this.thumb_view);
  }
  
  if (o.hasOwnProperty('m') == true) {
    this.main_view = Video_MainViewTemplate.render(o.m, this.main_view);
  }
}

// getSlideImagePath(state) - on, off, over
//   returns paths of slide images
VideoSlide.prototype.getSlideImagePath = function(state) {
  var img_path = "";
  switch(state) {
    case "on":
      img_path = this.thumb_vars.over;
      break;
    case "off":
      img_path = this.thumb_vars.off;
      break;
    case "large":
      img_path = this.main_vars.img;
      break;
    default:
      break;
  }
  return img_path;
}


/* END: Video Slide */