﻿(function($) {
  $.fn.rotatingscreen = function(o) {
    var defaults = { defaultInterval: 7000 };
    o = $.extend(defaults, o || {});

    var me = $(this);
    var img = $('<img />').css({height: '275px', width: '600px'});
    var imgUrlBase = '/images/RotatingScreens/';

    var img11 = new Array(Array);
    var strButtonOn = 'button_on.gif';
    var strButtonOnPlay = 'button_on_play.gif';
    var strButtonOff = 'button_off.gif';
    
    //for (index = 0; index < screens.length; index++) {
    //  var imgBox[index] = $('<img />').css({ 'cursor': 'pointer', 'left': '40px', 'position': 'absolute', 'top': '201px' }).attr('src', imgUrlBase + 'numeral1.png').click(nextImage1);
    //}
    var isPaused = false;
    var numberOfScreens = 0;
    var currentScreen = 0;
    var nextImageTimer;

    createUi(me);
    startScreens();

    function createUi(el) {
      var container = $(el).css({'background-color': '#dbd8d1', 'float': 'left', 'height': '292px', 'position': 'relative', 'width': '600px'});
      var screen = $('<div />').css({'background-color': '#c9cbc4', 'height': '292px', 'left': '0px', 'position': 'absolute', 'top': '0px', 'width': '600px'}).appendTo(container);

      var intStartingPos = 300 - screens.length * 7;
      var strStartingPos = intStartingPos.toString() + 'px';

      img0 = $('<img />').css({
                            'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px',
                            'position': 'absolute', 'top': '277px', 'opacity': '1.0'
                         }).attr('src', imgUrlBase + strButtonOff).click(nextImage0);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img1 = $('<img />').css({
                           'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px',
                           'position': 'absolute', 'top': '277px', 'opacity': '1.0'
                         }).attr('src', imgUrlBase + strButtonOff).click(nextImage1);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img2 = $('<img />').css({
                           'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px',
                           'position': 'absolute', 'top': '277px', 'opacity': '1.0'
                         }).attr('src', imgUrlBase + strButtonOff).click(nextImage2);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img3 = $('<img />').css({
                           'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px',
                           'position': 'absolute', 'top': '277px', 'opacity': '1.0'
                         }).attr('src', imgUrlBase + strButtonOff).click(nextImage3);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img4 = $('<img />').css({
                           'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px',
                           'position': 'absolute', 'top': '277px', 'opacity': '1.0'
                         }).attr('src', imgUrlBase + strButtonOff).click(nextImage4);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img5 = $('<img />').css({ 'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px', 'position': 'absolute', 'top': '277px', 'opacity': '1.0'}).attr('src', imgUrlBase + strButtonOff).click(nextImage5);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img6 = $('<img />').css({ 'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px', 'position': 'absolute', 'top': '277px', 'opacity': '1.0'}).attr('src', imgUrlBase + strButtonOff).click(nextImage6);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img7 = $('<img />').css({ 'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px', 'position': 'absolute', 'top': '277px', 'opacity': '1.0'}).attr('src', imgUrlBase + strButtonOff).click(nextImage7);
      intStartingPos += 16; strStartingPos = intStartingPos.toString() + 'px';
      img8 = $('<img />').css({ 'cursor': 'pointer', 'left': strStartingPos, 'width': '14px', 'height': '14px', 'position': 'absolute', 'top': '277px', 'opacity': '1.0'}).attr('src', imgUrlBase + strButtonOff).click(nextImage8);

      img.appendTo(screen);

      switch (screens.length) {
        case 9:
         img8.appendTo(screen); img7.appendTo(screen); img6.appendTo(screen); img5.appendTo(screen);
         img4.appendTo(screen); img3.appendTo(screen); img2.appendTo(screen); img1.appendTo(screen);
         img0.appendTo(screen);
         break;
        case 8:
         img7.appendTo(screen); img6.appendTo(screen); img5.appendTo(screen); img4.appendTo(screen);
         img3.appendTo(screen); img2.appendTo(screen); img1.appendTo(screen); img0.appendTo(screen);
         break;
        case 7:
         img6.appendTo(screen); img5.appendTo(screen); img4.appendTo(screen); img3.appendTo(screen);
         img2.appendTo(screen); img1.appendTo(screen); img0.appendTo(screen);
         break;
        case 6:
         img5.appendTo(screen); img4.appendTo(screen); img3.appendTo(screen); img2.appendTo(screen);
         img1.appendTo(screen); img0.appendTo(screen);
         break;
        case 5:
         img4.appendTo(screen); img3.appendTo(screen); img2.appendTo(screen); img1.appendTo(screen);
         img0.appendTo(screen);
         break;
        case 4:
         img3.appendTo(screen); img2.appendTo(screen); img1.appendTo(screen); img0.appendTo(screen);
         break;
        case 3:
         img2.appendTo(screen); img1.appendTo(screen); img0.appendTo(screen);
         break;
        case 2: img1.appendTo(screen); img0.appendTo(screen); break;
        case 1: img0.appendTo(screen); break;
        default: break;
      }
      
/*
      // Previous button
      var prev = $('<img />').css({'cursor': 'pointer', 'left': '7px', 'position': 'absolute', 'top': '238px', 'opacity': '0.9'}).attr('src', imgUrlBase + 'prev1.png').appendTo(container).click(previousImage);
      // Play - Pause button
      $('<img />').css({'cursor': 'pointer', 'left': '36px', 'position': 'absolute', 'top': '238px', 'opacity': '0.9'}).attr('src', imgUrlBase + 'pause1.png').appendTo(container).click(function() {
        isPaused = (!isPaused);
        var displayImg = isPaused ? 'play1.png' : 'pause1.png';
        $(this).attr('src', imgUrlBase + displayImg);
        if (isPaused) { clearTimeout(nextImageTimer); }
        else {startTimer();}
      });
      // Next button
      $('<img />').css({'cursor': 'pointer', 'left': '59px', 'position': 'absolute', 'top': '238px', 'opacity': '0.9'}).attr('src', imgUrlBase + 'next1.png').appendTo(container).click(nextImage);
*/

      // Testing code.
//      for (i = 0; i < screens.length; i++) {
//        strLeft = String((i + 1) * 40) + 'px';
//        strImage = 'numeral' + String((i + 1)) + '.png';
//        strFunction = 'nextImage' + String((i + 1));
//        strVar = 'img' + String((i + 1));
//        //$('<img />').css({'cursor': 'pointer', 'left': strLeft, 'position': 'absolute', 'top': '231px'}).attr('src', imgUrlBase + strImage).appendTo(container).click(nextImage);
//        var strVar = $('<img />').css({'cursor': 'pointer', 'left': strLeft, 'position': 'absolute', 'top': '231px'}).attr('src', imgUrlBase + strImage).click(strFunction);
//      }
      
    }

    function startScreens() {
      numberOfScreens = screens.length;
      currentScreen = 0;
      //currentScreen = $('div#rotatingScreens').data("Screen");
      img.attr('src', screens[0].image);
      TurnOnButton(currentScreen);
      img.click(function() {
        //log("Howdy");
        _gaq.push(['_trackEvent', 'Rotating_Screens', screens[currentScreen].url, 'Rotating Screen Click']);
        //$('div#rotatingScreens').data("Screen", 2);
        //window.location = screens[currentScreen].url;
        window.open(screens[currentScreen].url);
        //window.open(this.href); return false;
      });
      startTimer();
    }

    function nextImage0() {
      if (!isPaused) {
        if (currentScreen == 0) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img0.attr('title', 'Click to resume'); img0.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 0;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 0) {
          isPaused = (!isPaused); startTimer();
          img0.attr('title', 'Click to pause'); img0.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage1() {
      if (!isPaused) {
        if (currentScreen == 1) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img1.attr('title', 'Click to resume'); img1.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 1;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 1) {
          isPaused = (!isPaused); startTimer();
          img1.attr('title', 'Click to pause'); img1.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage2() {
      if (!isPaused) {
        if (currentScreen == 2) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img2.attr('title', 'Click to resume'); img2.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 2;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 2) {
          isPaused = (!isPaused); startTimer();
          img2.attr('title', 'Click to pause'); img2.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage3() {
      if (!isPaused) {
        if (currentScreen == 3) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img3.attr('title', 'Click to resume'); img3.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 3;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 3) {
          isPaused = (!isPaused); startTimer();
          img3.attr('title', 'Click to pause'); img3.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage4() {
      if (!isPaused) {
        if (currentScreen == 4) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img4.attr('title', 'Click to resume'); img4.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 4;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 4) {
          isPaused = (!isPaused); startTimer();
          img4.attr('title', 'Click to pause'); img4.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage5() {
      if (!isPaused) {
        if (currentScreen == 5) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img5.attr('title', 'Click to resume'); img5.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 5;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 5) {
          isPaused = (!isPaused); startTimer();
          img5.attr('title', 'Click to pause'); img5.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage6() {
      if (!isPaused) {
        if (currentScreen == 6) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img6.attr('title', 'Click to resume'); img6.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 6;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 6) {
          isPaused = (!isPaused); startTimer();
          img6.attr('title', 'Click to pause'); img6.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage7() {
      if (!isPaused) {
        if (currentScreen == 7) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img7.attr('title', 'Click to resume'); img7.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 7;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 7) {
          isPaused = (!isPaused); startTimer();
          img7.attr('title', 'Click to pause'); img7.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage8() {
      if (!isPaused) {
        if (currentScreen == 8) {
          isPaused = (!isPaused); clearTimeout(nextImageTimer);
          img8.attr('title', 'Click to resume'); img8.attr('src', imgUrlBase + strButtonOnPlay);
        }
        else {
          TurnOffButton(currentScreen); currentScreen = 8;
          img.attr('src', screens[currentScreen].image);
          TurnOnButton(currentScreen); startTimer();
        }
      }
      else {
        if (currentScreen == 8) {
          isPaused = (!isPaused); startTimer();
          img8.attr('title', 'Click to pause'); img8.attr('src', imgUrlBase + strButtonOn);
        }
      }
    }

    function nextImage() {
      TurnOffButton(currentScreen); currentScreen++;
      if (currentScreen == numberOfScreens) { currentScreen = 0; }
      img.attr('src', screens[currentScreen].image);
      TurnOnButton(currentScreen); if (!isPaused) startTimer()
    }

    function previousImage() {
      TurnOffButton(currentScreen); currentScreen--;
      if (currentScreen < 0) { currentScreen = numberOfScreens - 1; }
      img.attr('src', screens[currentScreen].image);
      TurnOnButton(currentScreen); if (!isPaused) startTimer()
    }

    function startTimer() {
      clearTimeout(nextImageTimer);
      var timeoutDuration = screens[currentScreen].duration || o.defaultInterval;
      nextImageTimer = setTimeout(nextImage, screens[currentScreen].duration * 1000);
    }

    function TurnOffButton(scr){
      switch (scr) {
        case 0: img0.attr('src', imgUrlBase + strButtonOff); img0.attr('title', ''); break;
        case 1: img1.attr('src', imgUrlBase + strButtonOff); img1.attr('title', ''); break;
        case 2: img2.attr('src', imgUrlBase + strButtonOff); img2.attr('title', ''); break;
        case 3: img3.attr('src', imgUrlBase + strButtonOff); img3.attr('title', ''); break;
        case 4: img4.attr('src', imgUrlBase + strButtonOff); img4.attr('title', ''); break;
        case 5: img5.attr('src', imgUrlBase + strButtonOff); img5.attr('title', ''); break;
        case 6: img6.attr('src', imgUrlBase + strButtonOff); img6.attr('title', ''); break;
        case 7: img7.attr('src', imgUrlBase + strButtonOff); img7.attr('title', ''); break;
        default: img8.attr('src', imgUrlBase + strButtonOff); img8.attr('title', ''); break;
      }
    }

    function TurnOnButton(scr){
      switch (scr) {
        case 0: img0.attr('src', imgUrlBase + strButtonOn); img0.attr('title', 'Click to pause'); break;
        case 1: img1.attr('src', imgUrlBase + strButtonOn); img1.attr('title', 'Click to pause'); break;
        case 2: img2.attr('src', imgUrlBase + strButtonOn); img2.attr('title', 'Click to pause'); break;
        case 3: img3.attr('src', imgUrlBase + strButtonOn); img3.attr('title', 'Click to pause'); break;
        case 4: img4.attr('src', imgUrlBase + strButtonOn); img4.attr('title', 'Click to pause'); break;
        case 5: img5.attr('src', imgUrlBase + strButtonOn); img5.attr('title', 'Click to pause'); break;
        case 6: img6.attr('src', imgUrlBase + strButtonOn); img6.attr('title', 'Click to pause'); break;
        case 7: img7.attr('src', imgUrlBase + strButtonOn); img7.attr('title', 'Click to pause'); break;
        default: img8.attr('src', imgUrlBase + strButtonOn); img8.attr('title', 'Click to pause'); break;
      }
    }
    
    return me;
  };
})(jQuery);
