(function($){

  $.fn.cross = function(options){

    var defaults = {
      'category_id':'3002001',
      'upc':''
    };
    var opts = $.extend(defaults, options);

    return this.each(function(options){
      
      var element = $(this);
      
      var data = {};
      data.cmd = 'GetCrossItem';

	    var cmd_json = {};
	    cmd_json.category_id = opts.category_id;
	    cmd_json.upc = opts.upc;

	    data.cmd_json = JSON.stringify(cmd_json);

      data.dtm = new Date();

      var service_url = 'default.ashx';

	    var url = service_url + '?cmd=' + data.cmd + '&cmd_json=' + data.cmd_json;
	    //trace(url);
	    //window.location.href = url;

    
      $.getJSON(service_url, data, function(data){
        
        var div = $('<div>').addClass('items');
        
        for(var i=0;i<data.items.length;i++){
          var item = data.items[i];
          //trace('cross:' + item.title);

          var a = $('<div>').data('item', item).data('title', item.caption).append($('<img>').attr('src', 'images/cross-view/' + item.photo));
          a.bind('mouseenter', function(event){
             var table = $('<table>').addClass('hover').attr('border', 0).attr('cellpadding', 0). attr('cellspacing', 0).attr('width', '100%').attr('height', '100%').append($('<tr>').append($('<td>').css('height', '17px'))).append($('<tr>').append($('<td>').attr('height', '40px').css('padding-left', '12px').css('padding-right', '24px').html( $('<span>').html( $(this).data('title'))) )).append($('<tr>').append($('<td>').css('height', '7px')));
             $(this).append(table);
          }).bind('mouseleave', function(event){
            //trace('mouseleave');
            $(this).find('.hover').remove();
          }).bind('click', function(event){
            var item = $(this).data('item');
            document.location.href = item.url;
          });
          
          //trace(a.outerHTML());
          div.append($('<div>').addClass('item').append(a)); 
        }
        
        $(element).empty().append(div);
        
        if(data.items.length == 0){
          $(element).parent().fadeOut();
        }else{
          $(element).parent().fadeIn();
        }

      });
    });
    function xalert(o){
     var s = '';
      for(var p in o){
       s += p + ':' + o[p] + '\n';
      }
      alert(s);
    }
    function trace(s){
      if(window.console) window.console.log(s);
    }
  };
})(jQuery);