/******************************************************************************/
/******************************* Scenario object ******************************/
/******************************************************************************/
var DEFAULT_DESIGN   = 'default';
var DEFAULT_DURATION = '4';
var DEFAULT_ENTER_TRANSITION = 'none';
var DEFAULT_ENTER_DELAY      = '1';
var DEFAULT_EXIT_TRANSITION  = 'none';
var DEFAULT_EXIT_DELAY       = '1';
var DEFAULT_MUST_FADE = 'true';

Scenario = function() {
  this.appRoot = "unknown";
  this.name = 'No name';
  this.comment = 'No Comment.';
  this.adName = null;
  this.adFile = null;
  this.userId = 0;
  this.currentDisplayed = 0;
  this.currentImage = 0;
  this.builderService = 'unknown';
  this.selected = null ;
  this.selectedIndex = null;
  this.size = null;
  this.activePlayer = null;
  this.imagePlayer = null;
  this.mediaPlayer = null;
  
  this.scenarioElements = new Array();
  
  this.globalOptions = new Object();
  this.globalOptions.design = 'default';
  this.globalOptions.defaultDuration = DEFAULT_DURATION;
  this.globalOptions.defaultEnterTransition = DEFAULT_ENTER_TRANSITION;
  this.globalOptions.defaultEnterDelay     = DEFAULT_ENTER_DELAY;
  this.globalOptions.defaultExitTransition = DEFAULT_EXIT_TRANSITION;
  this.globalOptions.defaultExitDelay      = DEFAULT_EXIT_DELAY;
  this.globalOptions.defaultMustFadeTransition = DEFAULT_MUST_FADE;
  
  this.broadcastOptions = new Object();
  this.broadcastOptions.endPageNameMsg = null;
  this.broadcastOptions.endPageMessageMsg = null;
  this.broadcastOptions.endPageEmailMsg = null;
  this.broadcastOptions.redirectURL = null;
  
  this.isPublic = false;
  //added to enable preview in the smallest size
  this.mustUseDiapEnd = true;
  this.isPreview = false;
  
  this.transitionShrinkToCenter
  
}

Scenario.prototype =
{

  buildAndStart: function(appRoot,builderService,id,key) {
    this.key=key;
    this.build(appRoot, builderService, id, key); //the id will be retrieved from scenario object
    this.loadPlayers();
  },
  
  build: function(appRoot,builderService,id,key) {
  /* argument : builderService : must look like
   * 'diaporama?service=getDiapDescription&id=1&key=pOuLpe'
   * will be invoked to get xml data about the service*/
    this.builderService='diaporama?service='+builderService+'&id='+id+'&key='+key;
    this.id=id;
    this.setAppRoot(appRoot);
    this.buildFromAttributes();
  },
  
  buildFromAttributes : function() {
    
    var xmlElement = ajaxGetElement(this.builderService);
    if(xmlElement) this.isBuilt = true;
    var infosObj = xmlElement.getElementsByTagName('diaporama');

    
    //object containing diaporama informations
    if (infosObj && infosObj.length == 0) {
      this.isValid = false;
      return;
    }
    
    if (getFirstElementValue(infosObj[0], 'public') == 'Y') this.isPublic = true;
    // returns '' if element 'public' not found

      
    if (infosObj[0].getElementsByTagName('broadcastOptions') && infosObj[0].getElementsByTagName('broadcastOptions').length > 0) {
      var broadcastOptionsBase = infosObj[0].getElementsByTagName('broadcastOptions')[0];
    }
    if (broadcastOptionsBase && broadcastOptionsBase.getElementsByTagName('broadcastOptions') && broadcastOptionsBase.getElementsByTagName('broadcastOptions').length > 0) //get the root element
      var broadcastOptionsXML = broadcastOptionsBase.getElementsByTagName('broadcastOptions')[0];
    
    //broadcast options
    if (broadcastOptionsXML) {
      var endPage = broadcastOptionsXML.getElementsByTagName('endPage')[0];
      if (endPage) {
        this.broadcastOptions.endPageNameMsg = getFirstElementValue(endPage,'name');
        this.broadcastOptions.endPageMessageMsg = getFirstElementValue(endPage, 'message');
        this.broadcastOptions.endPageEmailMsg = getFirstElementValue(endPage,'email');
      }
      this.broadcastOptions.redirectURL = getFirstElementValue(broadcastOptionsXML, 'redirectURL');
      
    }
    //diapme and options
    var infosObj2 = infosObj[0].getElementsByTagName('xmlContent')[0];
    this.userId = getFirstElementValue(infosObj[0],'userId');
    this.name = getFirstElementValue(infosObj[0],'name');
    this.comment = getFirstElementValue(infosObj[0],'comment');
    
    if (infosObj2) {
      var xmlScenario = infosObj2.getElementsByTagName('scenario')[0];
      
      //options globles, obligatoires (même si elles sont nulles)!
      if (xmlScenario && xmlScenario.getElementsByTagName('globalOptions') && xmlScenario.getElementsByTagName('globalOptions').length > 0 ) {
        var infosOpts = xmlScenario.getElementsByTagName('globalOptions')[0];
        this.globalOptions.design = getFirstElementValue(infosOpts, 'design', DEFAULT_DESIGN);
        this.globalOptions.defaultDuration = getFirstElementValue(infosOpts, 'defaultDuration', DEFAULT_DURATION);
        this.globalOptions.defaultEnterTransition = getFirstElementValue(infosOpts, 'defaultEnterTransition', DEFAULT_ENTER_TRANSITION);
        this.globalOptions.defaultEnterDelay = getFirstElementValue(infosOpts, 'defaultEnterDelay', DEFAULT_ENTER_DELAY);
        this.globalOptions.defaultExitTransition = getFirstElementValue(infosOpts, 'defaultExitTransition', DEFAULT_EXIT_TRANSITION);
        this.globalOptions.defaultExitDelay = getFirstElementValue(infosOpts, 'defaultExitDelay', DEFAULT_EXIT_DELAY);
        this.globalOptions.defaultMustFadeTransition = getFirstElementValue(infosOpts, 'defaultMustFadeTransition', DEFAULT_MUST_FADE);
      }
      
      this.isValid = true;
     
      var elemObj = xmlScenario.getElementsByTagName('element');
            
      // chargement de la playlist (images video et sons); 
      if (elemObj.length > 0) {
        var i=0;
        this.scenarioElements= new Array();
        while ( i < elemObj.length) {
	        this.scenarioElements[i] = newScenarioElementFromXml(elemObj[i]);
          i++;
        }
      }
    }

    var adObj = xmlElement.getElementsByTagName('ad');
	
    //object containing diaporama informations
    if (adObj && adObj.length > 0) {
	  this.adName = getFirstElementValue(adObj[0],'name');
	  this.adFile = getFirstElementValue(adObj[0],'file');
    }

	return;
  },
  loadPlayers: function() {
  
	this.playerLoaded = false;
	this.padPlayed = false;
	
    //display a modal
    if(modalMaskManager)
	{
      modalMaskManager.showModal();
	  this.adPlayed = false;
	  if (this.adFile != null)
	  {
		document.getElementById('ad').src = 'content/Interne/pub/' + this.adFile;
		document.getElementById('ad').style.display = 'inline';
        setTimeout(this.startScenario, 5000);
	  }
	  else
		setTimeout(this.startScenario, 1000);
	}
	  
    //init before playing, absolutely necessary for preview
    this.activePlayer = null;
    this.size = null;
    document.getElementById("video").setAttribute("style","width:0px;height:0px;");
    document.getElementById("video").style.cssText="width:0px;height:0px;";
    document.getElementById("video").innerHTML='';
    //simulates a "size == 'zero' " video player, not having the Video player set
    
    //run through elements and get an audio or video
    //this.prePlay = true; //set to false by OnBeforeFinish in the first media element
    this.hasMedia = false;
    for(var i = 0; i < this.scenarioElements.length; i++) {
        if(this.scenarioElements[i].type == "A" || this.scenarioElements[i].type == "V") {
          this.hasMedia = true;
          break;
        }
      }
      if (this.hasMedia) 
        this.buildMediaPlayer();
      else
		this.buildImagePlayer();
  },
  
  endAdPlayed: function() {
    scenario.adPlayed = true;
	if (scenario.playerLoaded)
		scenario.startScenario();
  },
    
  buildMediaPlayer: function() {
      this.mediaPlayer = new MediaPlayer("video", this.buildImagePlayer);
  },
  
  buildImagePlayer : function() {
  document.getElementById("slide-images").innerHTML=''; //for preview
  ///// run through scenario elements and place images
      for(var i = 0; i < scenario.scenarioElements.length; i++) {
        if(scenario.scenarioElements[i].type == "I") {
          var src = scenario.scenarioElements[i].getResourceLocation();
          var li = document.createElement("li");
          var theDiv = document.createElement("div");
          var theSpan = document.createElement("span")
          var img = document.createElement("img");
          img.alt = src;
          img.src = src;
          img.setAttribute('class','slideImage');
          img.setAttribute('className','slideImage');
          
          theDiv.setAttribute('class','slideDiv');
          theDiv.className = 'slideDiv';
          theSpan.setAttribute('class','iePlayerTrick');
          theSpan.className = 'iePlayerTrick';
          theSpan.appendChild(img);
          theDiv.appendChild(theSpan);
          li.appendChild(theDiv);
          document.getElementById('slide-images').appendChild(li);
        }
      }
    
    scenario.imagePlayer = new ImagePlayer("slide-show", "slide-images");
	scenario.playerLoaded = true;
	if (scenario.adPlayed)
		scenario.startScenario();
  },
  
  startScenario: function() { // static, to be run in a mediaplayer context
	if(modalMaskManager)
	  modalMaskManager.hideModal();
	scenario.start();
  },

// ------ control methods -----

  start: function()
  {
  this.currentDisplayed = 0;
  this.currentImage = 0;
  // we display the first element, if any
  if (this.scenarioElements.length > 0)
  {
	this.beginElement();
  }
  else
  {
	this.end();
  }	
  //begin first element
  },

  beginElement: function() {
      /*
      Manages the beginning of an element
      It compares the type to the manager previously played
      And check if the player must be changed
      It also manages the first element played (this.activePlayer == null)
      the switchPlayers will do the right resizes
      then, this function launches the enter transitions
      */
      var theType = this.scenarioElements[this.currentDisplayed].type
      if (theType != 'A' && (!this.activePlayer || theType != this.activePlayer.type)) {
          this.switchPlayers(this.scenarioElements[this.currentDisplayed].type);
          //activePlayer is now the player to be displayed
      }
      this.scenarioElements[this.currentDisplayed].startEnterTransition(); 
  },

  endElement: function() { // manages the end of an element
    this.scenarioElements[this.currentDisplayed].unsetCaption();
    this.scenarioElements[this.currentDisplayed].startExitTransition();
  },
  
  next: function(nextElementNumber) 
  { // handles the passage to the next element, from a scenario point of view
      if(nextElementNumber) this.currentDisplayed = nextElementNumber;
      else this.currentDisplayed++ ;
      
      if (this.currentDisplayed==this.scenarioElements.length ) {
        this.fadeOut();
      }
      else {
      
        if (this.scenarioElements[this.currentDisplayed].type=="I" && (this.currentDisplayed != 1 || this.scenarioElements[0].type == 'I' )) {
          this.currentImage++;
        }
          
        // we wait for the screen to be fully reseted (dirty but it works)
        scenario.beginElement();
      } 
  },
  
  fadeOut: function() { //fades out the volume 
    if(this.hasMedia && this.mediaPlayer.isPlaying) {
      var fadeOutDuration=5000; 
      var volume=100;
      this.mediaPlayer.fadeOut(fadeOutDuration,volume);
    }
    else
      this.end();
  },
  
  end: function() { //redirects to diapEnd if needed
  // called by MediaPlayer.fadeOut() when the volume reach 0
    if (!this.isPreview)
      window.location = "diaporama?service=diapEnd&id="+this.id+'&key='+this.key;
    else {
      setRowHidden(document.getElementById('diapMeEnded'),false);
    }
  },
 
  
  pause : function() {
    if (this.hasMedia && this.mediaPlayer.isPlaying) {
      this.mediaPlayer.pause();
    }
    this.activePlayer.pause();
  },
  
  stop : function() {
    if (this.hasMedia && this.mediaPlayer.isPlaying) {
      this.mediaPlayer.stop();
    }
    this.imagePlayer.stop();
  },
  
  unloadAll : function() {
    this.imagePlayer = null;
    this.mediaPlayer = null;
    document.getElementById('video').innerHTML='';
    document.getElementById('slide-images').innerHTML = '';
  },
  
  
  play : function() {
    if(this.hasMedia && this.scenarioElements[this.currentDisplayed].type !="V" && this.mediaPlayer.isPaused()){
      this.mediaPlayer.resume();
    }
    this.activePlayer.resume();

  },
  
  resizeScreen : function(aSize) {
    if (!(this.size) || this.size!=aSize) {
    
      if(aSize == "small") {
        document.getElementById("play_content").setAttribute("style","width:324px;height:264px;");
        document.getElementById("play_content").style.cssText="width:324px;height:264px;";

      }
      else if(aSize == "mid") {
        document.getElementById("play_content").setAttribute("style","width:644px;height:504px;");
        document.getElementById("play_content").style.cssText="width:644px;height:504px;";
  	
      }
      else if(aSize == "big") {
        document.getElementById("play_content").setAttribute("style","width:804px;height:624px;");     
        document.getElementById("play_content").style.cssText="width:804px;height:624px;";

      }
      
      this.size = aSize;
      if(this.activePlayer) { //to allow resizing before filling the <ul> with images
        this.activePlayer.resizeScreen(aSize);
        this.scenarioElements[this.currentDisplayed].setCaption();
      }
      return true;
      
        
    }
  },
  
  switchPlayers : function(type) {
  
    if(!this.size) {
      var size = (this.isPreview)?'small':'mid';
      this.size = size;
    }
    else
      var size = this.size;
    
    if(type == 'V') {
      this.activePlayer = this.mediaPlayer; //this.hasMedia == true
      this.activePlayer.resetScreen();
      this.mediaPlayer.resizeScreen(this.size);
      this.imagePlayer.resizeScreen("zero");
    }
    else if (type == 'I') {
      this.activePlayer = this.imagePlayer;
      this.imagePlayer.resizeScreen(this.size);
      if (this.hasMedia) this.mediaPlayer.resizeScreen("zero");
    
    }
  
  },
  
//------ Element methods-----------
  
  
  selectElement:function(count) {//select an element
    if (count<this.scenarioElements.length) {
    	this.selected =this.scenarioElements[count];
      this.selectedIndex = count;
	    return true;
    }
    return false;
  },
  
  addElement:function(anElement) {
    this.scenarioElements.push(anElement);
  },
  
  switchElements: function(index1, index2) {// switches elements in the playlist
    var buffer = this.scenarioElements[index1];
    this.scenarioElements[index1] = this.scenarioElements[index2];
    this.scenarioElements[index2] = buffer;
  },
  
  moveElement: function(from, to) {// moves a element in the plalist
    step = (from < to) ? 1 : -1;
    for (i = from; i != from + step * Math.abs(from - to); i += step) {
      this.switchElements(i, i + step);
    }
  },
  
  deleteElement: function(count) {
    this.scenarioElements.splice(count,1)
  },
  
  getFollowingImageFrames : function() { //scenarioElement number
    var endElement;
    for(endElement = this.currentDisplayed; endElement < this.scenarioElements.length; endElement++ ) {
      if(this.scenarioElements[endElement].type == "V")
        break;
    }
    
    framesElement = new Array();
    framesElement["beginElement"] = this.currentDisplayed;
    framesElement["endElement"] = endElement;
    return framesElement;
  },

// ---- get & set

  setAppRoot: function(anAppRoot)
  {
    this.appRoot = anAppRoot;
  },
  
  getFullPath : function() {
    var path = this.appRoot + '/content/' + this.userId + '/';
    return path;
  },
    
  getRelativePath: function() {
    var path = 'content/' + this.userId + '/';
    return path;
  },
  
  check: function(){ 
  // do multiple checks on the scenario. returns 0 if it passes all the checks
  // or an error code depending on the error found

  //1xx : general scenario errors
  //2xx : errors concerning audio elements

  
    if (this.scenarioElements.length==0) {
      return 101 ;// void scenario 
    }
    
    for(var i=0;i<this.scenarioElements.length;i++) {
      if (this.scenarioElements[i].getDuration <= 0) {
	return 111; // an element has no duration
      }
      
      if (isNaN(parseint(this.scenarioElements[i].getDuration()))) {
	return 112; // an element has a duration that is not a positive int
      }
    }
     
    if(this.scenarioElements[this.scenarioElements.length-1].type=="A") {
      return 201; // audio element at the end of the playlist will never be played
    }
    
    
    for(var i=0;i<this.scenarioElements.length-1;i++) {
      if(this.scenarioElements[i].type=="A" && this.scenarioElements[i+1].type=="V") {
	return 202; //audio element just before a video will never be played
      }
    }
    
    
    
    return 0; // no error detected
  
  },  
  
// ------- Export methods --------------  
  
  generateXml: function() {// creates the XML corresponding to the object
  
    var xmldoc;
    if (document.implementation && document.implementation.createDocument) { 
      xmldoc=document.implementation.createDocument("","",null);
    //Document.prototype.__defineGetter__("xml", function () {	return (new XMLSerializer()).serializeToString(this);	});	
    }
    else if (window.ActiveXObject) { //IE
      xmldoc=new ActiveXObject("Microsoft.XMLDOM");
    }
    //=== Build the XML
    var root = xmldoc.createElement("scenario");
    xmldoc.appendChild(root);
  
    
    var globalOptions = xmldoc.createElement("globalOptions");
    root.appendChild(globalOptions);
    
    createAndAppendXmlElement('design', this.globalOptions.design, globalOptions, xmldoc);
    createAndAppendXmlElement('defaultDuration', this.globalOptions.defaultDuration, globalOptions, xmldoc);
    createAndAppendXmlElement('defaultEnterTransition', this.globalOptions.defaultEnterTransition, globalOptions, xmldoc);
    createAndAppendXmlElement('defaultEnterDelay', this.globalOptions.defaultEnterDelay, globalOptions, xmldoc);
    createAndAppendXmlElement('defaultExitTransition', this.globalOptions.defaultExitTransition, globalOptions, xmldoc);
    createAndAppendXmlElement('defaultExitDelay', this.globalOptions.defaultExitDelay, globalOptions, xmldoc);
    createAndAppendXmlElement('defaultMustFadeTransition', this.globalOptions.defaultMustFadeTransition, globalOptions, xmldoc);
 
    for (var i = 0; i < this.scenarioElements.length; i++) {
    
      var elem = xmldoc.createElement('element');
      
      createAndAppendXmlElement('type', this.scenarioElements[i].type, elem, xmldoc);
      createAndAppendXmlElement('origin', this.scenarioElements[i].origin, elem, xmldoc);
      createAndAppendXmlElement('resource', this.scenarioElements[i].resource, elem, xmldoc);
      createAndAppendXmlElement('prettyName', this.scenarioElements[i].prettyName, elem, xmldoc);
      createAndAppendXmlElement('duration', this.scenarioElements[i].duration, elem, xmldoc);

      if (this.scenarioElements[i].text) {
        var theText = xmldoc.createElement("text");
        if (this.scenarioElements[i].text['content']) {
          createAndAppendXmlElement('content', this.scenarioElements[i].text['content'], theText, xmldoc);
        }
        if (this.scenarioElements[i].text['position']) {
          createAndAppendXmlElement('position', this.scenarioElements[i].text['position'], theText, xmldoc);
        }
        if (this.scenarioElements[i].text['color']) {
          createAndAppendXmlElement('color', this.scenarioElements[i].text['color'], theText, xmldoc);
        }   //with IE size is a reserved function of an array
        if (this.scenarioElements[i].text['sizeOfText']) {
          createAndAppendXmlElement('size', this.scenarioElements[i].text['sizeOfText'], theText, xmldoc);
        }
        elem.appendChild(theText);
      }
       
      if (this.scenarioElements[i].enterTransition) {
        var theEnterTransition = xmldoc.createElement("enterTransition");
        if (this.scenarioElements[i].enterTransition['type']) {
          createAndAppendXmlElement('type', this.scenarioElements[i].enterTransition['type'], theEnterTransition, xmldoc);
        }
        if (this.scenarioElements[i].enterTransition['delay']) {
          createAndAppendXmlElement('delay', this.scenarioElements[i].enterTransition['delay'], theEnterTransition, xmldoc);
        }
        elem.appendChild(theEnterTransition);
      }
      if (this.scenarioElements[i].exitTransition) {
        var theExitTransition = xmldoc.createElement("exitTransition");
        if (this.scenarioElements[i].exitTransition['type']) {
          createAndAppendXmlElement('type', this.scenarioElements[i].exitTransition['type'], theExitTransition, xmldoc);
        }
        if (this.scenarioElements[i].exitTransition['delay']) {
          createAndAppendXmlElement('delay', this.scenarioElements[i].exitTransition['delay'], theExitTransition, xmldoc);
        }
        elem.appendChild(theExitTransition);
      }
      
      if (this.scenarioElements[i].mustFadeTransition) {
        createAndAppendXmlElement('mustFadeTransition', this.scenarioElements[i].mustFadeTransition, elem, xmldoc);
      }
      else {
        createAndAppendXmlElement('mustFadeTransition', 'default', elem, xmldoc);
      }

      root.appendChild(elem);
      
    }
    return xmldoc;
  },
  
  generateXmlbroadcastOptions: function() {
    var xmldoc;
    if (document.implementation && document.implementation.createDocument) { 
      xmldoc=document.implementation.createDocument("","",null);
    }
    else if (window.ActiveXObject) {
      xmldoc=new ActiveXObject("Microsoft.XMLDOM");
    }
    //=== Build the XML
    var root = xmldoc.createElement("broadcastOptions");
    xmldoc.appendChild(root);
  
    
    var endPage = xmldoc.createElement("endPage");
    root.appendChild(endPage);
    
    if (this.broadcastOptions.endPageNameMsg)
      createAndAppendXmlElement('name', this.broadcastOptions.endPageNameMsg, endPage, xmldoc);
    if (this.broadcastOptions.endPageMessageMsg)
      createAndAppendXmlElement('message', this.broadcastOptions.endPageMessageMsg, endPage, xmldoc);
    if (this.broadcastOptions.endPageEmailMsg)
    createAndAppendXmlElement('email', this.broadcastOptions.endPageEmailMsg, endPage, xmldoc);
    if (this.broadcastOptions.redirectURL)
      createAndAppendXmlElement('redirectURL',this.broadcastOptions.redirectURL,root,xmldoc);
    
    return xmldoc;
    
  },
  
  generatePublicStatus: function() {
    return (this.isPublic) ? 'Y':'N';
  },
  
  generateGallery:function() {
  // generates HTML elements as gallery representing the scenario
  // see showScenario.vm
    var html='';
    var currentAudio=-1;
    
    if (this.scenarioElements.length == 0) {
      document.getElementById('bottomToolbar').style.display = 'none';
    }
    else {
      document.getElementById('bottomToolbar').style.display = 'block';
    }
    
    for (var i=0;i<this.scenarioElements.length;i++) {

    if (this.scenarioElements[i].type == "A" ) {
        currentAudio = i;
        firstAudioSlide = true;
        continue;
      }

      slideClass = 'slide';
      slideClick = 'selectElement(' + i + ');';
      if (this.selected == this.scenarioElements[i]) {
        slideClass = 'slide selected';
        slideClick = '';
      }
      html += '<span class="elem">\n';

      html += '<span class="' + slideClass + '" onclick="' + slideClick + '">\n';
      
      if (this.scenarioElements[i].type == "V") {
        currentAudio = -1;
        if (this.scenarioElements[i].origin == "I")
          html += '<img class="imgStrip" src="content/' + this.userId + '/thumbnails/' + this.scenarioElements[i].resource + '.jpg" onclick="'+slideClick+'"/>';
        else
          html += '<img class="imgStrip" src="'+ this.scenarioElements[i].resource + '" height="80" width="100" />';
        if (this.scenarioElements[i].prettyName != '$prettyName') {
          html += '<br /><small>'+this.scenarioElements[i].prettyName+'</small>';
        }
      }
      else if (this.scenarioElements[i].type == "I") {
        if (this.scenarioElements[i].origin == "I")
          html += ('<img class="imgStrip" src="content/' + this.userId + '/thumbnails/' + this.scenarioElements[i].resource + '" onclick="'+slideClick+'" />');
        else
          html += ('<img class="imgStrip" src="'+ this.scenarioElements[i].resource + '" height="80" width="100" onclick="'+slideClick+'" />');
      }
      else {
        html += 'erreur';
      }
      
      html += '<span class="overlay"><span class="settings">';
      if (this.scenarioElements[i].type == "I") {
        readonly = (this.scenarioElements[i] == this.selected) ? '' : 'disabled="disabled" ';
        html += '<input type="text" id="duration' + i + '" maxlength="2" onChange="UnTip(); changeDuration(this); return true;" value="' + this.scenarioElements[i].getDuration() + '" ' + readonly + ' onMouseOver="Tip(\'Modifiez la durée d\\\'affichage de cet élément\')" onMouseOut="UnTip()" />';
      }
      html += '<a href="#" onclick="UnTip(); selectElement(' + i +'); showSettings(); return false;"><img src="images/icones/settings-16.png" alt="" onMouseOver="Tip(\'Visualisez un aperçu de l\\\'élément, donnez lui un titre<br/>ou changez la manière dont l\\\'élément apparaît et disparaît\');" onMouseOut="UnTip()" /></a>'
          + '</span></span>';
      

      html += '</span>\n';
      
      if (currentAudio > -1) {
        soundClass = 'sound';
        if (this.selected == this.scenarioElements[currentAudio]) {
          soundClass = 'sound selected';
        }
        if (firstAudioSlide) {
          html += '<span class="' + soundClass + ' first" onclick="selectElement('+ currentAudio +');"><img src="images/icones/music.png" />' + this.scenarioElements[currentAudio].prettyName + '</span>';
                  } else {
          html += '<span class="' + soundClass + '" onclick="selectElement('+ currentAudio +');"><small>' + this.scenarioElements[currentAudio].prettyName + '</small></span>\n';
        }
      }

      if (this.selected == this.scenarioElements[i] || this.selected && this.selected == this.scenarioElements[currentAudio] && firstAudioSlide) {
        html += '<span id="controlBar" class="toolbar">'
          + '<a href="#" onclick="UnTip(); moveElement(-1); return false;" onmouseover="Tip(\'Déplacer l\\\'élément vers la gauche\');" onmouseout="UnTip();" ><img src="images/icones/left-24.png" alt="" /></a>'
          + '<a href="#" onclick="UnTip(); deleteElement(); return false;" onmouseover="Tip(\'Supprimer l\\\'élément du diapMe\');" onmouseout="UnTip();"><img src="images/icones/delete-24.png" alt="" /></a>'
          + '<a href="#" onclick="UnTip(); moveElement(+1); return false;" onmouseover="Tip(\'Déplacer l\\\'élément vers la droite\');" onmouseout="UnTip();"><img src="images/icones/right-24.png" alt="" /></a>'
          + '</span>';
      }
      html += '</span>';
      firstAudioSlide = false;
      
    }
    return html;
  }
    
}