<?xml version="1.0" encoding="utf-8"?>
  <mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" initialize="xinit()" horizontalGap="0" verticalGap="0" 
          paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0">
          <!-- backgroundColor="#FF1100" borderStyle="outset" borderColor="#FF1100">-->
  
  <!--Alle urls, paden etc. zitten in een config file die door de IV app wordt ingelezen-->
          
          <mx:HTTPService 
                  id="configService"
                  url="IVconfig.xml"
                  resultFormat="e4x"
                  result="configServiceResultHandler(event)"
                  fault='{Alert.show("Cannot load file " + configService.url)};'
          />
          
          <mx:HTTPService 
                  id="IVService"
                  url=""
                  resultFormat="e4x"
                  result="IVServiceResultHandler(event)"
                  fault='{Alert.show("Cannot load xml file: "+ IVService.url)};'
          />
          
          <!--<mx:Style source="/Style/obsidian.css"/>-->
          
          <mx:Script>
                  <![CDATA[
                          import mx.rpc.events.ResultEvent;
                          import mx.controls.Alert;
                          import mx.events.*;
                          import InteractiveVideoAS.*;
                          import flash.filters.*;
                  
                          private var configFile:XML;
                          private var videoFeed:XML;
                          private var videoDir:String = "";
                          private var currentSubject:int;
                          private var currentVideo:int;
                          private var subjectNameTraceArray:Array;
                          private var videoFileTraceArray:Array;
                          private var overlayArray:Array;
                          private var clickOverlay1SubjectName:String;
                          private var clickOverlay2SubjectName:String;
                          private var clickOverlay3SubjectName:String;
                          private var timerArray:Array;
                          private var gameScore:Number;
                          private var extraQuestionAnswer:Boolean;
                          private var extraQuestionTimer:Timer;
                          private var extraQuestionEvaluationTimer:Timer;
                          private var loadVideoPlayListFromConfig:Boolean;
                          private var gameScoreArray:Array;
                          private var extraQuestionScoreArray:Array;
                          private var overlay1Array:Array;
                          private var overlay2Array:Array;
                          private var overlay3Array:Array;
  
                          private const SCORE_MULTIPLIER:Number = 1000;
                          private const EXTRA_QUESTION_SCORE:Number = 0.5;
                          private const VIDEO_EXTENSION:String = ".flv";
                          
                          [Bindable]
                          private var videoWidth:int = 800;
                          [Bindable]
                          private var videoHeight:int = 600;
                          [Bindable]
                          private var numberOfOverlayCols:int = 5;
                          [Bindable]
                          private var numberOfOverlayRows:int = 5;
                          [Bindable]
                          private var dpOverlayCols:Array = new Array(numberOfOverlayCols);
                          [Bindable]
                          private var dpOverlayRows:Array = new Array(numberOfOverlayRows);
                          [Bindable]
                          private var dpPlayedSubjects:Array;
                          [Bindable]
                          private var overlayWidth:int = videoWidth / numberOfOverlayCols;
                          [Bindable]
                          private var overlayHeight:int = videoHeight / numberOfOverlayRows;
  
              private function xinit():void {};
                          public function init():void {
                                  extraQuestionTimer = new Timer(1000,6);//eventueel aanpassen aan moeilijkheidsgraadparameter
                                  extraQuestionEvaluationTimer = new Timer(2000,1);
                                  extraQuestionTimer.addEventListener(TimerEvent.TIMER_COMPLETE, removeExtraQuestionBox);
                                  extraQuestionTimer.addEventListener(TimerEvent.TIMER, updateExtraQuestionTimerDisplayCount);
                                  extraQuestionEvaluationTimer.addEventListener(TimerEvent.TIMER_COMPLETE, removeExtraQuestionBox);
                                  videoDisplay.addEventListener(VideoEvent.COMPLETE, onVideoComplete);
                                  
                                  configService.send();
                          }
                          
                          private function configServiceResultHandler(event:ResultEvent):void {
                                  configFile = event.result as XML;
                                  
                                  if(configFile.settings[0].videoList.length() > 0) {
                                          IVService.url = configFile.settings[0].videoList;
                                          loadVideoPlayListFromConfig = true;
                                          IVService.send();
                                  }else {
                                          loadVideoPlayListFromConfig = false;
                                  }
                                  
                                  videoDir = configFile.settings[0].videoDir;
                          }
                          
                          public function setVideoFeed(myFeed:String):void {
                                  IVService.url = myFeed;
                                  loadVideoPlayListFromConfig = false;
                                  IVService.send();
                          }                        
                          
                          private function IVServiceResultHandler(event:ResultEvent):void {
                                  videoFeed = event.result as XML;
                                  if(!loadVideoPlayListFromConfig){
                                          startInteractiveVideo();
                                  }
                          }
                          
                          public function startInteractiveVideo():Boolean {
                                  //this.visible = true;
                                  currentSubject = 0;
                                  currentVideo = 0;
                                  gameScore = 0;
                                  updateGameScoreLabel();
                                  subjectNameTraceArray = new Array();
                                  videoFileTraceArray = new Array();
                                  overlayArray = new Array();
                                  clickOverlay1SubjectName = "";
                                  clickOverlay2SubjectName = "";
                                  clickOverlay3SubjectName = "";
                                  timerArray = new Array();
                                  gameScoreArray = [0];
                                  extraQuestionScoreArray = [0];
                                  overlay1Array = new Array();
                                  overlay2Array = new Array();
                                  overlay3Array = new Array();
                                  
                                  videoDisplay.source= "";
                                  videoDisplay.initialize();
                                  
                                  if(findFirstPlayableVideoForAllSubjects()) {
                                          handlePlayVideo();
                                          return true;
                                  }
                                  else {
                                          stopInteractiveVideo();
                                          return false;
                                  }
                          }
                          
                          public function stopInteractiveVideo():void {
                                  //this.visible = false;
                                  videoDisplay.close();
                                  dispatchEvent(new InteractiveVideoEvent(InteractiveVideoEvent.COMPLETE));
                          }
                          
                          private function updateGameScoreLabel():void {
                                  currentScoreLabel.text = (gameScore * SCORE_MULTIPLIER).toString();
                          }
                          
                          public function outputPlayedSubjects():Array {
                                  dpPlayedSubjects = new Array();
                                  var string:String = "";
  
                                  for (var i:int = 0; i < subjectNameTraceArray.length; i++) {
                                          if(string != subjectNameTraceArray[i]) {
                                                  string = subjectNameTraceArray[i];
                                                  dpPlayedSubjects.push(string);
                                                  dpPlayedSubjects.push("|");
                                          }
                                  }
                                  dpPlayedSubjects.push("End");
                                  
                                  return dpPlayedSubjects;
                          }
                          
                          public function getGameScore():String {
                                  return (gameScore * SCORE_MULTIPLIER).toString();
                          }
                          
                          private function findFirstPlayableVideo():Boolean {
                                  var filename:String;
                                  while(currentVideo < videoFeed.subject[currentSubject].videos.video.length()) {
                                          if (videoFeed.subject[currentSubject].videos.video[currentVideo].InteractiveVideoPlayer.length() > 0) {
                                                  return true;
                                          }
                                          currentVideo++;
                                          gameScoreArray.push(0);
                                          extraQuestionScoreArray.push(0);
                                  }
                                  return false;
                          }
                          
                          private function findFirstPlayableVideoForAllSubjects():Boolean {
                                  while(currentSubject < videoFeed.subject.length()) {
                                          if(findFirstPlayableVideo()) {
                                                  return true;
                                          }
                                          currentSubject++;
                                          currentVideo = 0;
                                          gameScoreArray.push(0);
                                          extraQuestionScoreArray.push(0);
                                  }
                                  return false;
                          }
                          
                          private function previousVideo():void {
                                  if(subjectNameTraceArray.length < 2) return;
                                  
                                  stopOverlayTimers();
                                  
                                  //First pop data of currently playing video
                                  subjectNameTraceArray.pop();
                                  videoFileTraceArray.pop();
                                  gameScore -= gameScoreArray.pop();
                                  gameScore -= extraQuestionScoreArray.pop();
                                  
                                  //Now pop and store previous video data
                                  var previousSubject:String = subjectNameTraceArray.pop();
                                  var previousVideo:String = videoFileTraceArray.pop();
                                  gameScore -= extraQuestionScoreArray.pop();
                                  
                                  currentSubject = videoFeed.subject.(longname == previousSubject).childIndex();
                                  currentVideo = 
                                          videoFeed.subject[currentSubject].videos.video.(InteractiveVideoPlayer == previousVideo).childIndex();
                                  extraQuestionScoreArray.push(0);
                                  
                                  updateGameScoreLabel();
                                  handlePlayVideo();
                          }
                          
                          private function nextVideo():void {
                                  videoDisplay.dispatchEvent(new VideoEvent("complete"));
                          }
                          
                          private function pauseVideo():void {
                                  var i:int;
  
                                  if(videoDisplay.playing) {
                                          for (i = 0; i < timerArray.length; i++) {
                                                  timerArray[i].stop();
                                                  var newTime:int = overlayArray[i].time - videoDisplay.playheadTime;
                                                  timerArray[i] = new Timer(newTime*1000,1);
                                                  timerArray[i].addEventListener(TimerEvent.TIMER, createOverlayDelayed);
                                          }
                                          videoDisplay.pause();
                                  }
                                  else {
                                          for (i = 0; i < timerArray.length; i++) {
                                                  timerArray[i].start();
                                          }
                                          videoDisplay.play();
                                  }
                          }
                          
                          private function goToVideoBySubjectName(subjectName:String):void {
                                  if (//(subjectName != "") && 
                                          (videoFeed.subject.(@name == subjectName).videos.video.length() > 0)) {
                                          currentSubject = videoFeed.subject.(@name == subjectName).childIndex();
                                          currentVideo = 0;
                                          gameScoreArray.push(0);
                                          extraQuestionScoreArray.push(0);
                                          if(findFirstPlayableVideo()) {
                                                  gameScore += int(videoFeed.subject[currentSubject].score);
                                                  gameScoreArray[gameScoreArray.length-1] += int(videoFeed.subject[currentSubject].score);
                                                  updateGameScoreLabel();
                                                  handlePlayVideo();
                                          }
                                  }
                                  else {
                                          stopInteractiveVideo();
                                  }
                          }
                          
                          private function handleClickOverlay(subjectName:String):void {
                                  stopOverlayTimers();
                                  goToVideoBySubjectName(subjectName);
                          }
                          
                          private function clickOverlay1(event:MouseEvent):void {
                                  handleClickOverlay(clickOverlay1SubjectName);
                          }
                          
                          private function clickOverlay2(event:MouseEvent):void {
                                  handleClickOverlay(clickOverlay2SubjectName);
                          }
                          
                          private function clickOverlay3(event:MouseEvent):void {
                                  handleClickOverlay(clickOverlay3SubjectName);
                          }
                          
                          private function stopOverlayTimers():void {
                                  var timer:Timer;
  
                                  while (timerArray.length > 0) {
                                          timer = timerArray.shift();
                                          timer.removeEventListener(TimerEvent.TIMER, createOverlayDelayed);
                                          timer.stop();
                                          overlayArray.shift();
                                  }
                                  
                                  extraQuestionTimer.reset();
                                  extraQuestionEvaluationTimer.reset();
                          }
                          
                          private function clearOverlay():void {
                                  var rowLength:int = dpOverlayCols.length-1;
                                  
                                  for (var r:int = 0; r < dpOverlayRows.length; r++){
                                          for (var c:int = 0; c < dpOverlayCols.length; c++){
                                                  overlayCel[r][c].visible = false;
                                                  //brute force ftw
                                                  overlayCel[r][c].removeEventListener(MouseEvent.CLICK,clickOverlay1);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.CLICK,clickOverlay2);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.CLICK,clickOverlay3);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OVER, displayOverlay1Text);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OVER, displayOverlay2Text);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OVER, displayOverlay3Text);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OVER, displayHighlightOverlay1);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OVER, displayHighlightOverlay2);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OVER, displayHighlightOverlay3);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OUT, removeHighlightOverlay1);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OUT, removeHighlightOverlay2);
                                                  overlayCel[r][c].removeEventListener(MouseEvent.MOUSE_OUT, removeHighlightOverlay3);
                                          }
                                  }
                                  
                                  handleRemoveHighlight(overlay1Array);
                                  handleRemoveHighlight(overlay2Array);
                                  handleRemoveHighlight(overlay3Array);
                                  
                                  overlay1Array = new Array();
                                  overlay2Array = new Array();
                                  overlay3Array = new Array();
                          }
                          
                          private function getPositionFromString(positionString:String):Position {
                                  var myPosition:Position = new Position();
                                  
                                  if (positionString.length > 0) {
                                          myPosition.column = (int)(positionString.charAt(0));
                                          myPosition.row = (int)(positionString.charAt(1));
                                  }
  
                                  return myPosition;
                          }
                          
                          private function getSizeFromString(sizeString:String):Size {
                                  var mySize:Size = new Size();
                                  
                                  if (sizeString.length > 0) {
                                          mySize.xsize = (int)(sizeString.charAt(0));
                                          mySize.ysize = (int)(sizeString.charAt(1));
                                  }
  
                                  return mySize;
                          }
                          
                          private function getLabelFromString(labelString:String):String {
                                  return labelString.length > 0 ? labelString : "";
                          }
                          
                          private function checkForOverlay():void {
                                  //Clean up previous overlays and question boxes
                                  clearOverlay();
                                  branchQuestionBox.visible = false;
                                  extraQuestionBox.visible = false;
                                  extraQuestionBoxViewStack.selectedIndex = 0;
                                  
                                  var xmlFeed:XML = videoFeed.subject[currentSubject].videos.video[currentVideo];
                                  var overlayCount:int = xmlFeed.overlays.overlay.length();
  
                                  if (overlayCount > 0) {
                                          for (var i:int = 0; i < overlayCount; i++) {
                                                  var xmlOverlay:XML = xmlFeed.overlays.overlay[i];
                                                  var overlay:Overlay = new Overlay();
                                          
                                                  if (xmlOverlay.@time.length() > 0) {
                                                          if(xmlOverlay.@time > 0) {
                                                                  overlay.time = xmlOverlay.@time;
                                                          }
                                                  }
                                                  
                                                  //overlay 1
                                                  overlay.pos1 = getPositionFromString(xmlOverlay.@position);
                                                  overlay.size1 = getSizeFromString(xmlOverlay.@size);
                                                  overlay.label1 = getLabelFromString(xmlOverlay.@label);
  
                                                  //overlay 2
                                                  overlay.pos2 = getPositionFromString(xmlOverlay.@position2);
                                                  overlay.size2 = getSizeFromString(xmlOverlay.@size2);
                                                  overlay.label2 = getLabelFromString(xmlOverlay.@label2);
                                                                                                  
                                                  //overlay 3
                                                  overlay.pos3 = getPositionFromString(xmlOverlay.@position3);
                                                  overlay.size3 = getSizeFromString(xmlOverlay.@size3);
                                                  overlay.label3 = getLabelFromString(xmlOverlay.@label3);
                                          
                                                  overlayArray.push(overlay);
                                                  
                                                  if (overlay.time > 0) {
                                                          var timer:Timer = new Timer(overlay.time*1000,1);
                                                          timerArray.push(timer);
                                                          timer.addEventListener(TimerEvent.TIMER, createOverlayDelayed);
                                                          timer.start();
                                                  } else {
                                                          createOverlay();
                                                  }
                                          }
                                  }
                          }
                          
                          private function createOverlayDelayed(event:TimerEvent):void {
                                  timerArray.shift();
                                  createOverlay();
                          }
                          
                          private function setClickOverlaySubjectName(subjectName:String,overlayID:int):void {
                                  switch(overlayID){
                                          case(3):
                                                  clickOverlay3SubjectName = subjectName;
                                                  break;
                                          case(2):
                                                  clickOverlay2SubjectName = subjectName;
                                                  break;
                                          case(1):
                                                  clickOverlay1SubjectName = subjectName;
                                                  break;
                                  }
                          }
                          
                          private function addOverlayEventListeners(dispatcher:EventDispatcher,overlayID:int):void {
                                  switch(overlayID){
                                          case(3):
                                                  dispatcher.addEventListener(MouseEvent.CLICK, clickOverlay3);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OVER, displayOverlay3Text);
                                                  overlay3Array.push(dispatcher);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OVER, displayHighlightOverlay3);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OUT, removeHighlightOverlay3);
                                                  break;
                                          case(2):
                                                  dispatcher.addEventListener(MouseEvent.CLICK, clickOverlay2);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OVER, displayOverlay2Text);
                                                  overlay2Array.push(dispatcher);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OVER, displayHighlightOverlay2);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OUT, removeHighlightOverlay2);
                                                  break;
                                          case(1):
                                                  dispatcher.addEventListener(MouseEvent.CLICK, clickOverlay1);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OVER, displayOverlay1Text);
                                                  overlay1Array.push(dispatcher);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OVER, displayHighlightOverlay1);
                                                  dispatcher.addEventListener(MouseEvent.MOUSE_OUT, removeHighlightOverlay1);
                                                  break;
                                  }
                          }
                          
                          private function createOverlayCels(position:Position, size:Size, subjectName:String,
                                                                                             overlayID:int):void {
                                  var k:int;
                                  var l:int;
                                                                                             
                                  if (!((position.column == -1) || (position.row == -1) || (size.xsize == -1) || 
                                      (size.ysize == -1) || (subjectName == ""))) {
                                          for (k = position.column; k < (position.column + size.xsize); k++) {
                                                  for (l = position.row; l < (position.row + size.ysize); l++) {
                                                          addOverlayEventListeners(overlayCel[l][k],overlayID);
                                                          overlayCel[l][k].visible = true;
                                                          overlayCel[l][k].setStyle("backgroundColor", 0xffc0c0);
                                                  }
                                          }
                                          setClickOverlaySubjectName(subjectName,overlayID);
                                  }
                          }
                          
                          private function createOverlay():void {
                                  clearOverlay();
  
                                  if (overlayArray.length > 0) {
                                          var overlay:Overlay = overlayArray.shift();
                                          
                                          //overlay 3
                                          createOverlayCels(overlay.pos3, overlay.size3, overlay.label3, 3);
                                          
                                          //overlay 2
                                          createOverlayCels(overlay.pos2, overlay.size2, overlay.label2, 2);
  
                                          //overlay 1
                                          createOverlayCels(overlay.pos1, overlay.size1, overlay.label1, 1);
                                  }
                          }
                          
                          private function checkForBranchQuestion():void {
                          var myCurrentVideo:XML = videoFeed.subject[currentSubject].videos.video[currentVideo];
                                  if(myCurrentVideo.hasOwnProperty("branchquestion")) {
                                          branchQuestion.text = myCurrentVideo.branchquestion;
                                          branchQuestionBox.visible = true;
                                  }
                          }
                          
                          private function checkForExtraQuestion():void {
                                  var myCurrentVideo:XML = videoFeed.subject[currentSubject].videos.video[currentVideo];
                                  if(myCurrentVideo.hasOwnProperty("question")) {
                                          if(myCurrentVideo.hasOwnProperty("rightanswer")) {
                                                  extraQuestion.text = myCurrentVideo.question;
                                                  extraQuestionBox.visible = true;
                                                  extraQuestionBox.alpha =.8;
                                                  extraQuestionAnswer = (myCurrentVideo.rightanswer == "true" ? true : false);
                                                  extraQuestionTimerDisplayCount.text = String(extraQuestionTimer.repeatCount);
                                                  extraQuestionTimer.reset();
                                                  extraQuestionTimer.start();
                                          }
                                  }
                          }
                          
                          private function handlePlayVideo():void {
                                  checkForOverlay();
                                  checkForBranchQuestion();
                                  checkForExtraQuestion();
                                  checkForExtraSegment();
                                  
                                  currentSubjectLabel.text = videoFeed.subject[currentSubject].longname;
                          
                                  videoDisplay.source = videoDir + 
                                                                            videoFeed.subject[currentSubject].videos.video[currentVideo].InteractiveVideoPlayer + 
                                                                            VIDEO_EXTENSION;
                                  videoDisplay.play();
                          
                                  subjectNameTraceArray.push(videoFeed.subject[currentSubject].longname);
                                  videoFileTraceArray.push(videoFeed.subject[currentSubject].videos.video[currentVideo].InteractiveVideoPlayer);
                          }
                          
                          private function onVideoComplete(event:VideoEvent):void {
                                  var leadsToString:String = videoFeed.subject[currentSubject].videos.video[currentVideo].@leadsto;
                                  var repeatString:String = videoFeed.subject[currentSubject].videos.video[currentVideo].@repeat;
                                  
                                  if (leadsToString != "") {
                                          stopOverlayTimers();
                                          goToVideoBySubjectName(leadsToString);
                                  }
                                  else if (repeatString == "true") {
                                          videoDisplay.play();
                                  }
                                  else if (currentVideo + 1 < videoFeed.subject[currentSubject].videos.video.length()) {
                                          currentVideo++;
                                          gameScoreArray.push(0);
                                          extraQuestionScoreArray.push(0);
                                          stopOverlayTimers();
                                          if((videoFeed.subject[currentSubject].videos.video[currentVideo].InteractiveVideoPlayer.length() > 0) && 
                                                  (videoFeed.subject[currentSubject].videos.video[currentVideo].InteractiveVideoPlayer != "")) {
                                                  handlePlayVideo();
                                          }
                                          else {
                                                  nextVideo();
                                          }
                                  }
                                  else {
                                          stopInteractiveVideo();
                                  }
                          }
                          
                          private function formatPositionToolTip(value:int):String {
                                  //do only handle minutes
                                  var result:String = (value % 60).toString();
                                  if (result.length == 1){
                                          result = Math.floor(value / 60).toString() + ":0" + result;
                                  } else {
                                          result = Math.floor(value / 60).toString() + ":" + result;
                                  }
                                  return result;
                          }
                          
                          private function handleDisplayHighlight(array:Array):void {
                                  for (var i:int = 0; i < array.length; i++) {
                                          array[i].alpha = 0.6;
                                  }
                          }
                          
                          private function displayHighlightOverlay1(event:MouseEvent):void {
                                  handleDisplayHighlight(overlay1Array);
                          }
                          
                          private function displayHighlightOverlay2(event:MouseEvent):void {
                                  handleDisplayHighlight(overlay2Array);
                          }
                          
                          private function displayHighlightOverlay3(event:MouseEvent):void {
                                  handleDisplayHighlight(overlay3Array);
                          }
                          
                          private function handleRemoveHighlight(array:Array):void {
                                  for (var i:int = 0; i < array.length; i++) {
                                          array[i].alpha = 0.3;
                                  }
                          }
                          
                          private function removeHighlightOverlay1(event:MouseEvent):void {
                                  handleRemoveHighlight(overlay1Array);
                          }
                          
                          private function removeHighlightOverlay2(event:MouseEvent):void {
                                  handleRemoveHighlight(overlay2Array);
                          }
                          
                          private function removeHighlightOverlay3(event:MouseEvent):void {
                                  handleRemoveHighlight(overlay3Array);
                          }
  
                          private function handleDisplayOverlayText(subjectName:String):void {
                                  branchChoice.text = videoFeed.subject.(@name == subjectName).longname;
                                  displayOverlayText();
                          }
                          
                          private function displayOverlay1Text(event:MouseEvent):void {
                                  handleDisplayOverlayText(clickOverlay1SubjectName);
                          }
                          
                          private function displayOverlay2Text(event:MouseEvent):void {
                                  handleDisplayOverlayText(clickOverlay2SubjectName);
                          }
                          
                          private function displayOverlay3Text(event:MouseEvent):void {
                                  handleDisplayOverlayText(clickOverlay3SubjectName);
                          }
                          
                          private function displayOverlayText():void {
                                  branchChoiceBox.visible = true;
                          }
                          
                          private function removeOverlayText():void {
                                  branchChoiceBox.visible = false;
                          }
                          
                          private function updateExtraQuestionTimerDisplayCount(event:TimerEvent):void {
                                  extraQuestionTimerDisplayCount.text = 
                                          String(extraQuestionTimer.repeatCount - extraQuestionTimer.currentCount);
                          }
                          
                          private function removeExtraQuestionBox(event:TimerEvent):void {
                                  extraQuestionBox.visible = false;
                          }
                          
                          private function evaluateAnswer(userAnswer:Boolean):void {
                                  extraQuestionBoxViewStack.selectedIndex = 1;
                                  extraQuestionTimer.reset();
                                  if(extraQuestionAnswer == userAnswer){
                                          extraQuestionEvaluation.text = "Right!";
                                          extraQuestionBox.alpha =.6;
                                          gameScore += EXTRA_QUESTION_SCORE;
                                          extraQuestionScoreArray[extraQuestionScoreArray.length-1] += EXTRA_QUESTION_SCORE;
                                          updateGameScoreLabel();
                                  }else {
                                          extraQuestionEvaluation.text = "Wrong!";
                                          extraQuestionBox.alpha =.6;
                                  }
                                  extraQuestionEvaluationTimer.reset();
                                  extraQuestionEvaluationTimer.start();
                          }
                          
                          private function evaluateAnswerTrue():void {
                                  evaluateAnswer(true);
                          } 
                          
                          private function evaluateAnswerFalse():void {
                                  evaluateAnswer(false);
                          }
                          
                          private function checkForExtraSegment():void {
                                  var extraSegmentString:String = videoFeed.subject[currentSubject].videos.video[currentVideo].@extra;
                                  if (extraSegmentString == "true") {
                                          extraSegmentLabel.visible = true;
                                  }else {
                                          extraSegmentLabel.visible = false;
                                  }
                          }
                          
                  ]]>
          </mx:Script>
          
          <mx:Canvas cornerRadius="2" width="800">
                  <mx:Box width="{videoWidth}" height="{videoHeight}" left="0" top="0">
                          <mx:VideoDisplay id="videoDisplay" autoPlay="false" autoRewind="false" width="100%" height="100%"/>
                  </mx:Box>
                  <mx:Tile direction="horizontal" x="0" y="0" horizontalGap="0" verticalGap="0">
                          <mx:Repeater id="repeaterOverlayRows" dataProvider="{dpOverlayRows}">
                                  <mx:Repeater id="repeaterOverlayCols" dataProvider="{dpOverlayCols}">
                                          <mx:Canvas id="overlayCel" alpha="0.3" width="{overlayWidth}" height="{overlayHeight}"
                                                  visible="false" buttonMode="true" useHandCursor="true"
                                                  mouseOut="removeOverlayText()">
                                          </mx:Canvas>
                                  </mx:Repeater>
                          </mx:Repeater>
                  </mx:Tile>
                  <mx:Panel id="branchQuestionBox" top="5" left="5" width="{videoWidth-10}" height="60" alpha=".8"
                          horizontalAlign="left" title="Question:">
                          <mx:filters>
                                  <flash.filters:DropShadowFilter xmlns:flash.filters="flash.filters.*" />
                          </mx:filters>
                          <mx:Label id="branchQuestion" text="Branch question" fontSize="13" top="0" />
                  </mx:Panel>
                  <mx:VBox id="branchChoiceBox" width="{videoWidth}" height="30" top="35" right="30" 
                          horizontalAlign="right" visible="false">
                          <mx:Label id="branchChoice" text="Branch choice" fontStyle="italic" fontSize="13" 
                                  top="0" right="5"/>
                  </mx:VBox>
                  <mx:Panel id="extraQuestionBox" width="250" height="180" bottom="70" right="16" 
                          horizontalAlign="center" alpha=".8" verticalAlign="middle">                                        
                          <mx:filters>
                                  <flash.filters:DropShadowFilter xmlns:flash.filters="flash.filters.*" />
                          </mx:filters>
                          <mx:ViewStack id="extraQuestionBoxViewStack" width="100%" height="100%">
                                  <mx:VBox horizontalAlign="center">
                                  <mx:Canvas width="100%">
                                          <mx:Text id="extraQuestion" text="Dit is een heel erg lange vraag" left="1"
                                                  selectable="false" width="199" fontSize="13" top="3" height="62"/>
                                          <mx:Text id="extraQuestionTimerDisplayCount" top="3" right="0" fontSize="13" 
                                                  selectable="false"/>
                                          <mx:HBox width="100%" horizontalGap="80" horizontalAlign="center" 
                                                  verticalAlign="bottom" y="80">
                                                  <mx:Image source="@Embed('button/true.png')" click="evaluateAnswerTrue()" 
                                                          buttonMode="true" useHandCursor="true"/>
                                                  <mx:Image source="@Embed('button/false.png')" click="evaluateAnswerFalse()"
                                                          buttonMode="true" useHandCursor="true"/>
                                          </mx:HBox>
                                  </mx:Canvas>
                                  </mx:VBox>
                                  <mx:VBox verticalAlign="middle" horizontalAlign="center">
                                          <mx:Text id="extraQuestionEvaluation" selectable="false" width="90%" fontSize="16" 
                                                  top="10" textAlign="center"/>
                                  </mx:VBox>
                          </mx:ViewStack>
                  </mx:Panel>
                  <mx:Canvas width="792" height="42" x="0" y="605">
                          <mx:Label id="currentSubjectLabel" text="default" x="0" bottom="0" width="100%"/>
                          <mx:Label id="currentScoreLabel" text="00000" bottom="0" right="0"/>
                          <mx:Label text="Subject:" top="0" left="0"/>
                          <mx:Label text="Score:" top="0" right="0"/>
                          <mx:Button label="&lt;&lt;" click="previousVideo()" horizontalCenter="-100" verticalCenter="10"/>
                          <mx:Button label="||" click="pauseVideo()" horizontalCenter="0" verticalCenter="10"/>
                          <mx:Button label=">>" click="nextVideo()" horizontalCenter="100" verticalCenter="10"/>
                          <!--
                          <mx:HSlider id="position" height="7" dataTipFormatFunction="formatPositionToolTip"
                                  thumbPress="pauseVideo()" slideDuration="0" thumbRelease="videoDisplay.play()"
                                  change="videoDisplay.playheadTime = position.value" value="{videoDisplay.playheadTime}"
                                  minimum="0" maximum="{videoDisplay.totalTime}" width="125" y="2" horizontalCenter="0"/>
                          -->
                          <mx:Label styleName="playheadTimeLabel" horizontalCenter="0"
                                  text="{formatPositionToolTip(videoDisplay.playheadTime)} - {formatPositionToolTip(videoDisplay.totalTime)}"/>
                  </mx:Canvas>
                  <mx:Label id="extraSegmentLabel" text="Extra footage!" color="#FF1100" fontSize="24" top="0" left="0" visible="false"/>
          </mx:Canvas>
  
  </mx:Box>