/**
 *
 * @package SprintCMSv2_docnet.co.uk
 * @author Jim Tunstall <jtunstall@doc-net.com>
 * @copyright Copyright &copy; 2009, Doctor Net Limited
 *
 * jgmagency.co.uk portfolio js
 * 
 */

/**
 * Menu section handle
 */
var str_current_section;

/**
 * Item index within a section
 */
var int_current_index;

/**
 * Menu items
 */
var arr_portfolio_menu = [
   {handle:'branding', menu_text:'branding'},
   {handle:'press', menu_text:'press'},
   {handle:'direct_mail', menu_text:'direct mail'},
   {handle:'literature', menu_text:'literature'},
   {handle:'tv_campaigns', menu_text:'tv campaigns'},
   {handle:'patient_recruitment', menu_text:'patient recruitment'},
   {handle:'ambient_outdoor', menu_text:'ambient/outdoor'}
];

/**
 * Section items
 */
var arr_portfolio_content = [];
arr_portfolio_content.branding = [
   {client: 'Broca', description: 'Create a brand identity for an integrated mobile company', image: '/images/portfolio/branding/broca/broca_logo.jpg'},
   {client: 'Broca', description: 'Create a brand identity for an integrated mobile company', image: '/images/portfolio/branding/broca/broca_sub_logos.jpg'},
   {client: 'Broca', description: 'Create a corporate identity for the first annual report - Aim Listed', image: '/images/portfolio/branding/broca/broca_brochure.jpg'},
   {client: 'Castlefield Clinic', description: 'Create a corporate identity', image: '/images/portfolio/branding/CastlefieldClinic/castlefield_clinic_logo.jpg'},
   {client: 'Castlefield Clinic', description: 'Create a corporate identity', image: '/images/portfolio/branding/CastlefieldClinic/castlefield_clinic_stationery.jpg'},
   {client: 'City Residential', description: 'Create a new corporate identity and include the sub brand offering within it', image: '/images/portfolio/branding/Cityres/city_residential_master_logo.jpg'},
   {client: 'City Residential', description: 'Create a new corporate identity and include the sub brand offering within it', image: '/images/portfolio/branding/Cityres/city_residential_stationery.jpg'},
   {client: 'City Residential', description: 'Create a new corporate identity and include the sub brand offering within it', image: '/images/portfolio/branding/Cityres/city_residential_sub_brands.jpg'},
   {client: 'Regency Crown', description: 'Create a new corporate identity', image: '/images/portfolio/branding/RegencyCrown/regency_crown_logo.jpg'},
   {client: 'Regency Crown', description: 'Create a new corporate identity', image: '/images/portfolio/branding/RegencyCrown/regency_crown_stationery.jpg'}
];
arr_portfolio_content.press = [
   {client: 'Botany Bay', description: "Easter campaign - to reinforce 'Family Day'", image: '/images/portfolio/press/botany_bay.jpg'},
   {client: 'Hoopers Department Store', description: 'Design a lifestyle magazine advert', image: '/images/portfolio/press/hoopers.jpg'},
   {client: 'LA Fitness plc', description: 'Design a series of hard hitting adverts to attract a young market', image: '/images/portfolio/press/la_fitness_advert.jpg'}
];
arr_portfolio_content.direct_mail = [
   {client: 'Lancashire & Blackpool Conference and Meetings', description: 'Teaser campaign to increase awareness of conference facilities', image: '/images/portfolio/direct_mail/lancs_and_blackpool_1.jpg'},
   {client: 'Lancashire & Blackpool Conference and Meetings', description: 'Teaser campaign to increase awareness of conference facilities', image: '/images/portfolio/direct_mail/lancs_and_blackpool_2.jpg'},
   {client: 'Lancashire & Blackpool Conference and Meetings', description: 'Teaser campaign to increase awareness of conference facilities', image: '/images/portfolio/direct_mail/lancs_and_blackpool_3.jpg'},
   {client: 'Regency Crown', description: 'Bespoke leaflet to attract a younger audience', image: '/images/portfolio/direct_mail/regency_crown_1.jpg'},
   {client: 'Regency Crown', description: 'Bespoke leaflet to attract a younger audience', image: '/images/portfolio/direct_mail/regency_crown_2.jpg'},
   {client: 'LA Fitness plc ', description: 'Design a mailer to identify and attract a young market', image: '/images/portfolio/direct_mail/la_fitness_mailer.jpg'}
];
arr_portfolio_content.literature = [
   {client: 'Pendle Tourism', description: 'Create and design 2008/2009 Visitors Guide', image: '/images/portfolio/literature/pendle.jpg'},
   {client: 'Hoopers Department Store', description: 'Design Instore guide', image: '/images/portfolio/literature/hoopers_store_guide.jpg'},
   {client: 'The Spa at The CityPoint Club', description: 'Create a price list for an exclusive Spa resort', image: '/images/portfolio/literature/city_point_price_list.jpg'}
];
arr_portfolio_content.tv_campaigns = [
   {client: 'Synexus', description: 'Direct response TV commercial - Granada Region', video: {source:'/images/portfolio/tv/synexus.flv', width: '260', height: '212'}},
   {client: 'Prestons of Bolton', description: 'Brand Awareness campaign - Granada Region', video: {source:'/images/portfolio/tv/prestons_2.flv', width: '260', height: '153'}},
   {client: 'Citroen UK', description: 'North West Dealer Promotion - Granada Region', video: {source:'/images/portfolio/tv/citroen_2.flv', width: '260', height: '153'}}
];
arr_portfolio_content.patient_recruitment = [
   {client: 'Glaxo Smith Kline', description: 'Worldwide campaign - Design support materials for various therapy areas within clinical studies', image: '/images/portfolio/patient_recruitment/gsk_alzheimers_poster.jpg'},   
   {client: 'Glaxo Smith Kline', description: 'Worldwide campaign - Design support materials for various therapy areas within clinical studies', image: '/images/portfolio/patient_recruitment/gsk_poster.jpg'},
   {client: 'Glaxo Smith Kline', description: 'Worldwide campaign - Translate, design and produce materials for various Oncology therapy areas', image: '/images/portfolio/patient_recruitment/gsk_translated_brochure_1.jpg'},
   {client: 'Glaxo Smith Kline', description: 'Worldwide campaign - Translate, design and produce materials for various Oncology therapy areas', image: '/images/portfolio/patient_recruitment/gsk_translated_brochure_2.jpg'}
];
arr_portfolio_content.ambient_outdoor = [
   {client: 'LA Fitness plc ', description: 'Create a strong concept campaign to attract a younger market', image: '/images/portfolio/ambient_outdoor/la_fitness_ad_shell.jpg'},
   {client: 'LA Fitness plc ', description: 'Create a strong concept campaign to attract a younger market', image: '/images/portfolio/ambient_outdoor/la_fitness_billboard.jpg'},
   {client: 'LA Fitness plc ', description: 'Create a strong concept campaign to attract a younger market', image: '/images/portfolio/ambient_outdoor/la_fitness_coaster.jpg'}
];

/**
 * Document ready
 */ 
$(document).ready(function() {
   // Initialise portfolio, displaying the first item of the first section
   create_menu();
   $('#portfolio_menu li:first').attr('class',  'active');
   str_current_section = arr_portfolio_menu[0].handle;
   display_item(str_current_section, 0);
   
   // Initialise overlay
   $("#portfolio_content_overlay").css('display', 'none');
   
   // preload images
   $.each(arr_portfolio_menu, function(){
      $.each(arr_portfolio_content[this.handle], function() {  
         if ("image" in this) {
            $("<img>").attr("src", this.image);
         }
      });   
   });
   
   /** 
    * Event: Menu item click
    */
   $('#portfolio_menu li').click(function(){
      // Display first item in chosen section
      display_item($(this).attr('rel'), 0);
      return false;
   });
   
   /** 
    * Event: Left arrow click
    */
   $('#left_arrow').click(function(){   
      change_item('backward');      
      return false;
   });

   /** 
    * Event: Right arrow click
    */
   $('#right_arrow').click(function(){
      change_item('forward');
      return false;      
   });
   
});

/**
 * Remove emphasis from active menu item
 */
clear_active_menu_item = function() {
   arr_menu_items = $('#portfolio_menu li');
   $.each(arr_menu_items, function() {
      $(this).attr('class',  '');
   });
};

/**
 * Get integer index of current section (menu item)
 */
get_current_menu_index = function() {
   var int_index = 0;
   $.each(arr_portfolio_menu, function() {
      if(this.handle == str_current_section) {
         return false;
      }
      int_index++;
   });
   
   return int_index;
};

/**
 * Get next menu handle
 *
 * @param String direction of move
 */
get_next_menu_handle = function(str_direction) {
   var int_menu_index = get_current_menu_index();

   if(str_direction == 'forward') {
      int_menu_index++;
   } else if (str_direction == 'backward') {
      int_menu_index--;
   }
   
   // Bounds check
   if(int_menu_index < 0) {
      int_menu_index = arr_portfolio_menu.length - 1;
   } else if (int_menu_index >= arr_portfolio_menu.length) {
      int_menu_index = 0;
   }
   
   return arr_portfolio_menu[int_menu_index].handle;
};

/**
 * Change the displayed item
 *
 * @param String direction of move
 */
change_item = function(str_direction) {
   if(str_direction == 'forward') {
      int_current_index++;
   } else if (str_direction == 'backward') {
      int_current_index--;
   }
   
   var str_new_menu_handle = '';
   // Check bounds on change request
   if(int_current_index < 0) {
      // Trying to go back from first item, show the last item of the previous section 
      str_new_menu_handle = get_next_menu_handle('backward'); 
      display_item(str_new_menu_handle, arr_portfolio_content[str_new_menu_handle].length - 1);
   } else if (int_current_index >= arr_portfolio_content[str_current_section].length) {
      // Trying to go forward from the last item in a section, show the first item of the next section
      str_new_menu_handle = get_next_menu_handle('forward');
      display_item(str_new_menu_handle, 0);
   } else {
      display_item(str_current_section, int_current_index);
   }
};

/**
 * Display item
 *
 * @param String Section handle
 * @param Integer Item index
 */
display_item = function(str_section, int_index) {
   $('#portfolio_content_inner').empty();

   clear_active_menu_item();
   
   // Emphasise menu item
   $('#portfolio_menu li[rel=' + str_section + ']').attr('class', 'active');

   // Update client/description
   $('#portfolio_client').text(arr_portfolio_content[str_section][int_index].client);
   $('#portfolio_description').text(arr_portfolio_content[str_section][int_index].description); 
   
   // Image attached to this item?
   if ("image" in arr_portfolio_content[str_section][int_index]) {
      // Display image, by fading it in
      $('#portfolio_content_inner').html('<img align="absmiddle" src="' + arr_portfolio_content[str_section][int_index].image + '" />');
   } else if ("video" in arr_portfolio_content[str_section][int_index]) {
      var int_controls_height = 25;
      var int_flash_height = parseInt(arr_portfolio_content[str_section][int_index].video.height) + int_controls_height;
      
      // Embed video
      var str_video_link = '<a href="' + arr_portfolio_content[str_section][int_index].video.source + '" style="display:block;width:' + arr_portfolio_content[str_section][int_index].video.width + 'px;height:' + int_flash_height + 'px" id="player"></a>';   
      $('#portfolio_content_inner').html(str_video_link);

      // 330 is the frame height
      var int_player_top_padding = (330 - int_flash_height) / 2;
      
      $('#player').css('padding-top', int_player_top_padding + 'px');

      flowplayer("player",  "/swf/flowplayer-3.2.1.swf", {
         clip: { autoPlay: false, autoBuffering: true },
         plugins: {
            controls: {
            all: false,
            play: true,
            scrubber: true,
            fullscreen:true
            }
        }
      });
   } else {
      // Clear image display section
      $('#portfolio_content_inner').html('');
   }
      
   // Update global store
   str_current_section = str_section;
   int_current_index = int_index;
};


/**
 * Create and display menu
 */
create_menu = function() {  
   var str_menu_items = '';
   $.each(arr_portfolio_menu, function() {
      str_menu_items = str_menu_items + "<li rel='" + this.handle + "'><a href='#'>" + this.menu_text + "</a></li>";
   });
   
   $('#portfolio_menu').html(str_menu_items);
};
