/**
* width : Çʼö°ª, À̹ÌÁöÀÇ ³Êºñ (¸ðµç À̹ÌÁöÀÇ »çÀÌÁî°¡ °°¾Æ¾ß ÇÕ´Ï´Ù.)
* height : Çʼö°ªÀ̹ÌÁöÀÇ ³ôÀÌ.
* speed : ÆäÀÌµå ¼Óµµ Á¶Àý.
* delay : ¸ð¼ÇÀÌ µÇ´Â Áß°£ µô·¹ÀÌ.
* paging: true or false (³Ñ¹ö¸µ »ý¼º)
* space: 1 (³Ñ¹ö¸µ ÁÂ¿ì °£°Ý Á¶Á¤),
* src : ÆäÀÌ¡ ³Ñ¹ö À̹ÌÁö °æ·Î, ex) 'common/img' (±âº»°ª : 'images')
**/
(function($){
 $.fn.jBanner = function(opt){
  opt = $.extend({
   width : 0,
   height: 0,
   speed : 1500,
   delay : 3000,
   paging: true,
   space: 2,
   src: 'http://naullnc.esellersimg.co.kr/family/naul/main/banner2/'
  }, opt || {});
  return this.each(function(){
   // init
   var elt = $(this),
    items = elt.find('li'),
    pause = false,
    no = 1;
   var getPaging = function(){
    var str = '',
     onoff;
    str += '<p>';
    for(var i=0;i<items.length;i++){
     onoff = (i === 0 ? 'on' : 'off');
     str += '<img src="'+opt.src+'/'+ (i + 1) +'_'+onoff+'.png" alt="" />';
    }
    str += '</p>';
    return str;
   };
   if(opt.paging){
    elt.append(getPaging());
   };
   //CSS & class Setup
   elt.css({position : 'relative', overflow : 'hidden',padding:0, margin:0, width : opt.width, height: 
opt.height});
   elt.find('img').css({border:0});
   elt.find('ul').css({position : 'relative', 'z-index' : 0,padding:0, margin:0});
   elt.find('li').css({position : 'absolute', left: 0, top:0, listStyle: 'none'});
   elt.find('p').css({position : 'absolute', left:0, bottom:3, width: opt.width, 'z-index' : 1, 
textAlign : 'right', margin:0, lineHeight:0});
   elt.find('p img').css({'cursor':'pointer', margin:'0 '+opt.space+'px'});
   elt.find('ul li:not(:first)').hide();
   elt.find('ul li:first').addClass('on');
   elt.find('p img:first').addClass('on');
   // Action
   var chaingeImageName = function(obj, isOn){
    if(isOn){
     obj.attr('src', obj.attr('src').replace('off.png', 'on.png'));
    }else{ 
     obj.attr('src', obj.attr('src').replace('on.png', 'off.png'));
    }
   };
   var act = function(num, isOver){
    if(!elt.find('ul li:eq(' + num + ')').hasClass('on')){
     if(opt.paging){
      chaingeImageName(elt.find('p img.on'), false);
      elt.find('p img.on').removeClass('on');
      elt.find('p img:eq(' + num + ')').addClass('on');
      chaingeImageName(elt.find('p img:eq(' + num + ')'), true);
     };
     if(isOver){
      elt.find('ul li').hide().removeClass('on');
      elt.find('ul li:eq(' + num + ')').addClass('on').stop().fadeIn('fast');
     }else{
      elt.find('ul li.on').fadeOut(opt.speed).removeClass('on');
      elt.find('ul li:eq(' + num + ')').fadeIn(opt.speed).addClass('on');
     };
     no = (num >= items.length - 1 ? 0 : num + 1);
    }
   };
   // Controllers
   elt.on('mouseover', function(){
    pause = true;
   });
   elt.on('mouseleave', function(){
    pause = false;
   });
   elt.find('p img').each(function(i){
    $(this).on('mouseover', function(){
     act(i, true);
    });
   });
   setInterval(function(){ if(pause == false) act(no); }, opt.delay);
  });
 }
})(jQuery);