/**
 * Adds CPO logo pop-over and CobaltPixelTag event management.
 *
 * Documentation: https://cobalt.onconfluence.com/display/DEV/133941+-+CPO+Benefits+as+Mouseover
 *
 */
$(document).ready(function() {

  var body = jQuery('body');
  
  /**
   * Standard markup for use with lexus_tooltip.css. 
   * Use with: P4 //Java/Websites/br_wbst_0300/implementation/src/websitesEar/websitesWebApp/css/lexus/lexus_tooltip.css
   */ 
  var markup = '<div id="tooltip" style="display: none;" class="">' +
               '<h3 style="display: none;"></h3>' +
               '<div class="body">' +
               '<div class="tooltip-header">' +
               '<span class="tooltip-header-left"></span>' +
               '<span class="tooltip-header-right"></span>' +
               '</div>' +
               '<div class="tooltip-body">' +
               '<div class="tooltip-body-content">' +
               'Because every Lexus Certified Pre-Owned Vehicle is thoroughly reconditioned and meticulously inspected, we can comfortably sell them with a Lexus three-year, 100,000 total vehicle mile limited warranty [<a href="CPOStory" target="_blank">1</a>]. This, of course, is fully included in the purchase price.' +
               '<br/><br/>For more information on the benefits of Lexus Certified Pre-Owned <a href="CPOStory" target="_blank">click here</a>.' +
               '</div>' +
               '</div>' +
               '<div class="tooltip-footer">' +
               '<span class="tooltip-footer-left"></span>' +
               '<span class="tooltip-footer-right"></span>' +
               '</div>' +
               '<span class="tooltip-arrow tooltip-arrow-right"></span>' +
               '<span class="tooltip-close"></span>' +
               '</div>' +
               '</div>';

  var eventManagerParamOb = {
    eventName: 'com.cobaltgroup.ws.action.click.lcpologo',
    publisherData: {
      eventName: 'com.cobaltgroup.ws.action.click.lcpologo',
      clickedElementId: '',
      timesClicked: 0,
      paramSet: ['eventName', 'clickedElementId', 'timesClicked']
    }
  };

  markup = jQuery(markup);
  body.append(markup);
   
  /**
   * Here's the logic for handling a click event on one of the LCPO logos.
   */
  $('.sprite-generic_certified').css('cursor','pointer').click(function() {
  
    var parent = jQuery(this);
    var ox = parent.offset().left - 476 + 'px';
    var oy = parent.offset().top - 20 + 'px';
    
    // The pop-over is urrently visible, so let's check to see which logo is being clicked...
    if (jQuery('#tooltip:visible').length > 0 && parent.attr('id') === eventManagerParamOb.publisherData.clickedElementId) {
      markup.hide();
      return false
    }
    
    // Otherwise just show it...
    markup.css('left',ox).css('top',oy).show();
    eventManagerParamOb.publisherData.clickedElementId = parent.attr('id');
    eventManagerParamOb.publisherData.timesClicked++;
    EventManager.publish(eventManagerParamOb);
    return false;
    
  });
  
  // The close button is a bit easier...
  $('#tooltip .tooltip-close').click(function() {  
    markup.hide();    
    return false;    
  });

});