var $ajax_url = 'index.php?type=755';
var currentSlide = 0;
var wizard_data = {options:[], options_title:[]};
var slide_with_data = [true, true, false, false, true, true, false, false, true];
var images_dir = 'magento/media/catalog/product';
var keys = [];
var color_tables = {};

// number formatting function
// copyright Stephen Chapman 24th March 2006, 22nd August 2008
// permission to use this function is granted provided
// that this copyright notice is retained intact
function formatNumber(num,dec,thou,pnt,curr1,curr2,n1,n2) {var x = Math.round(num * Math.pow(10,dec));if (x >= 0) n1=n2='';var y = (''+Math.abs(x)).split('');var z = y.length - dec; if (z<0) z--; for(var i = z; i < 0; i++) y.unshift('0'); if (z<0) z = 1; y.splice(z, 0, pnt); if(y[0] == pnt) y.unshift('0'); while (z > 3) {z-=3; y.splice(z,0,thou);}var r = curr1+n1+y.join('')+n2+curr2;return r;}

function wizard_move(event) {
  currentSlide += event.data;
  if (currentSlide < 0) currentSlide = 0;
  if (currentSlide > 8) currentSlide = 8;
  wizard_slide_init();
  return false;
}

function wizard_update() {
  var $slide = $('#slide-'+currentSlide);
  $slide.trigger('update');
}

function wizard_action(name, value, action) {
  wizard_data[name] = value;
}

function wizard_event_init(event) {
  current = event.data;
  wizard_slide_init(current);
  return false;
}

function wizard_slide_init(slide) {
  var $wizard = $("#order-wizard");
  var data = {};

  if (!slide) {
    slide = currentSlide;
  } else {
    currentSlide = slide;
  }

  $('#slide-'+slide).trigger('show', [slide]);
  $wizard.trigger('goto', [slide]);
}


function on_slide_update0(event) {
  data = $(this).data('data');
  show_navigation(false, false, false);
  $('#order-info').slideUp(100);
  $(this).data('is_valid', true);
 
  for(id in data.models) {
    var show = false;
    var model = data.models[id];
    var categories = model.category_ids.split(',');
    for(i in categories) {
      if (categories[i] == wizard_data.category || !wizard_data.category) show = true;
    }
    if (model.price < wizard_data.price_from || (wizard_data.price_to && model.price > wizard_data.price_to)) {
      show = false;
    }
    if (show) $('#model-'+id).show(); else $('#model-'+id).hide();
  }

  $('#order-wizard').animate({height:$('#slide-0').height()+"px"}, 500);
}

function on_slide_data0(event, data) {
  var price_sets = [0, 0, 300000, 400000, 500000, 0];
  var fueluse_sets = [2,4,6,8,10,12];

  // Categories
  $(this).empty();
  $(this).append('<p class="info">Он-лайн подбор у официальных дилеров <strong>АВТОПОИСК</strong> мгновенно найдет и'+
                 ' зарезервирует нужный вам автомобиль, не только сократит время поиска'+
                 ' среди <strong>10 000 автомобилей</strong> на складах у дилеров, но и проверит в новых'+
                 ' поступлениях. Резервирование осуществляется по ВИН автомашины</p>');
  
  $(this).append('<ul id="model-info-menu" class="option-menu""></ul>');
  var $list = $(this).children('#model-info-menu');
  $list.append('<li class="label">Тип:</li><li id="category-0"><a href="#">Все</a></li>');
  $('#category-0 a')
    .addClass('active')
    .click(function() {
      $('#slide-0 #model-info-menu li a').removeClass('active');
      wizard_data.category = 0; 
      $(this).addClass('active');
      $('#slide-0').trigger('update');
      return false;
    });
  for(id in data.categories) {
    var category = data.categories[id];
    $list.append('<li id="category-'+id+'"><a href="#">'+category.name+'</a></li>');
    $('#category-'+id+' a').data('id', id)
      .click(function() {
        var is_active = $(this).hasClass('active');
        $('#slide-0 #model-info-menu li a').removeClass('active');
        wizard_data.category = is_active ? 0 : $(this).data('id'); 
        if (!is_active) $(this).addClass('active');
        $('#slide-0').trigger('update');
        return false;
      });
  }

  // Prices
  $(this).append('<ul id="pricesets" class="option-menu"><li class="label">Цена:</li></ul>');
  var $list = $("#pricesets");
  for(id=0;id < price_sets.length-1; id++) {
    price_from = price_sets[id];
    price_to = price_sets[id+1];
    
    if (price_from == 0) 
      item_name = 'до '+ formatNumber(price_to, 0, ' ', '', '', '');
    else if (price_to == 0)
      item_name = 'от '+ formatNumber(price_from, 0, ' ', '', '', '');
    else
      item_name = formatNumber(price_from, 0, ' ', '', '', '') + ' &mdash; '+ formatNumber(price_to, 0, ' ', '', '', '');

    if (price_from == 0 && price_to == 0) 
      item_name = 'Все';
    else 
      item_name = item_name + ' руб.';

    $list.append('<li id="priceset-'+id+'"><a href="#">'+item_name+'</a></li>');
    $('#slide-0 #priceset-0 a').addClass('active');

    $('#priceset-'+id+' a')
      .data('price_from', price_from)
      .data('price_to', price_to)
      .click(function() {
        var is_active = $(this).hasClass('active');
        $('#slide-0 #pricesets li a').removeClass('active');
        if (!is_active) $(this).addClass('active');
        wizard_data.price_from= is_active ? 0: $(this).data('price_from');
        wizard_data.price_to = is_active ? 0 : $(this).data('price_to');
        $('#slide-0').trigger('update');
        return false;
      });
  }

  // Fuel use sets
  //$(this).append('<ul id="fuelusesets" class="option-menu"><li class="label">Расход топлива</li></ul>');
  //var $list = $("#fuelusesets");
  //for(id=0;id<fueluse_sets.length;id++) {
    //$list.append('<li id="fueluseset-'+id+'"><a href="#">'+fueluse_sets[id]+' л.</a></li>');
    //$('#fueluseset-'+id).click(function() {
      //return false;
    //});
  //}

  // Models
  $(this).append('<div class="cars-list"></div>');
  var $list = $(this).children('.cars-list');
  for(id in data.models) {
    var model = data.models[id];
    $list.append('<div id="model-'+id+'" class="cars-list-item">'+
      '<div class="cars-list-item-image"><a href="#">'+
      '<span style="background-image:url('+images_dir+model.thumbnail+');">'+model.name+'</span></a></div>'+
      '<div class="cars-list-item-text">'+
      '<p><a href="#">'+model.name+'</a><br />'+
      'от <span>'+formatNumber(model.price, 0, ' ', '', '', '')+'</span> руб.</p></div>'+
      '</div>');
    $('#model-'+id+' a').data('id', id)
      .click(function() {
        wizard_data.model = $(this).data('id');
        wizard_slide_init(1);
        return false;
      });
  }

  $(this).data('data', data);
  
  if (key[0] && data.models[key[0]]) {
    $('#model-'+key[0]+' a').click(); 
    return;
  }
  
  $(this).trigger('update');
}

// ------------------------------------------------
// SLIDE 1
// ------------------------------------------------
function on_slide_update1(event) {
  var data = $(this).data('data');
  

  if (!$(this).data('is_valid')) {
    $(this).empty();
    $(this).append('<div class="complectations-view"></div>');
    var $complectations_view = $('#slide-1 .complectations-view');
    $complectations_view.append('<table class="contenttable"></table>');
    var $table = $complectations_view.children('table');

    var complectation_options = { 
      0:{ title:'Доступные комплектации '+ data.model.name, values:[]}
    };

    for(id in data.complectations) {
      var complectation = data.complectations[id];
      complectation_options[0].values[id] = {sku:id, title:complectation.name, price:0};
    }
    render_options( {table:$table, name:'complectation', options:complectation_options, from:0, is_group:true} );
    
    var engine_options = {
      0:{ title:'Двигатель/Привод/Трансмиссия', values: []}        
    };
    var idx = 0;
    var options = data.options[wizard_data.complectation];

      // Engines
    for(engine_id in options[20000].values) {
      var value = options[20000].values[engine_id];
      var engine_sku = value.sku;
      var engine_data = [[value]];
    
      trans_data = [];
      for(id in options[20001].values) {
        var value = options[20001].values[id];
        var sku = value.sku.split('_');
        if (sku[1] == engine_sku) trans_data.push(value);
      }
      engine_data = superpos(engine_data, trans_data);
    
      gear_data = [];
      for(id in options[20002].values) {
        var value = options[20002].values[id];
        var sku = value.sku.split('_');
        if (sku[1] == engine_sku) gear_data.push(value);
      }
      
      engine_data = superpos(engine_data, gear_data);
//      engines_data[engine_sku] = engine_data;

      for(id in engine_data) {
        var set = engine_data[id];
        if (idx == parseInt(wizard_data.engine)) {
          wizard_data.options['group-20000'] = set[0].sku;
          wizard_data.options['group-20001'] = set[1].sku.split('_')[0];
          wizard_data.options['group-20002'] = set[2].sku.split('_')[0];
          wizard_data.options_title['group-20000'] = set[0].title;
          wizard_data.options_title['group-20001'] = set[1].title;
          wizard_data.options_title['group-20002'] = set[2].title;
        }

        var title = set[0].title + '/' + set[1].title + '/' + set[2].title;
        var price = parseFloat(set[0].price) + parseFloat(set[1].price) + parseFloat(set[2].price);
        engine_options[0].values[idx] = { sku:idx+'', title:title, price:price };
        idx += 1;
      //    $table.append('<tr id="'+engine_sku+'-'+ id +'" class="option_row"><td class="first">&nbsp;</td><td style="width:450px;">'+ title+'</td><td>'+price+'</td></tr>');
      }
    }

    
    render_options( {table:$table, name:'engine', options:engine_options, from:0, is_group:true} );

    var options = data.options[wizard_data.complectation];
    $(this).append('<div class="options-view"></div>');
    $options_view = $('#slide-1 .options-view');
    $options_view.empty();
    $options_view.append('<table class="contenttable"></table>');
    var $obj = $options_view.children('table');
//    render_options_engine( {table:$obj, options:data.options[wizard_data.complectation] } );   
 //   render_options( {table:$obj, options:data.options[wizard_data.complectation], from:20000, is_group:true} );
    render_options( {table:$obj, options:data.options[wizard_data.complectation], to:20000, base_only:true} );
    render_colors( {options:data.options[wizard_data.complectation], from:10000, to:20000, is_group:true, is_colors:true, update:true } );   

    // wizard_complectation(wizard_data.complectation);
  } else {
//    render_options_engine( {table:$obj, options:data.options[wizard_data.complectation], update:true } );   
   // render_options( {options:data.options[wizard_data.complectation], from:20000, is_group:true, update:true} );
  }

  update_order_info();
  show_navigation(false, true, true);
  $('#order-wizard').animate({height:$('#slide-1').height()+"px"}, 500);
}

function wizard_complectation(complectation) {
  var data = $('#slide-1').data('data');
  wizard_data.complectation = complectation;
  wizard_data.options = [];
  wizard_data.options_title = [];
  
  // Reset slides
  for (i=1; i <= 8; i++) {
    $('#slide-'+i).data('is_valid', false);
  }
  
  $('#slide-1').trigger('update');

  $options_view = $('#slide-1 .options-view');
  $options_view.empty();
  $options_view.append('<table border="0" cellspacing="0" cellpadding="0" class="contenttable"></table>');

  var $obj = $options_view.children('table');
  render_options( {table:$obj, options:data.options[wizard_data.complectation], from:20000, is_group:true} );
  render_options( {table:$obj, options:data.options[wizard_data.complectation], to:20000, base_only:true} );
  render_colors( {options:data.options[wizard_data.complectation], from:10000, to:20000, is_group:true, is_colors:true, update:true } );   

  if (currentSlide != 1) wizard_slide_init(1);
}

function wizard_options(complectation) {
  var data = $('#slide-1').data('data');
  
  wizard_data.complectation = complectation;
  wizard_data.options = [];

  $options_view = $('#slide-2 .options-view');
  $options_view.empty();
  $options_view.append('<table border="0" cellspacing="0" cellpadding="0" class="contenttable"></table>');

  var $obj = $options_view.children('table');
//  render_options_engine( {table:$obj, options:data.options[wizard_data.complectation] } );   
  render_options( {table:$obj, options:data.options[wizard_data.complectation], to:20000} );
}


function update_order_info() {
  var $pane = $('#order-info .column-1');

  $pane.empty();
  $pane.append('<h3>Информация о заказе</h3>');
  var model_data = $('#slide-1').data('data');
  $pane.append('<ul class="option-menu"><li class="label">Модель</li><li class="fixed">'+model_data.model.name+'</li></ul>');
  $pane.append('<ul class="option-menu"><li class="label">Комплектация</li><li class="fixed">'+model_data.complectations[wizard_data.complectation].name+'</li></ul>');
  $pane.append('<ul class="option-menu"><li class="label">Двигатель</li><li class="fixed">'+ wizard_data.options_title['group-20000']+'</li></ul>');
  $pane.append('<ul class="option-menu"><li class="label">Привод</li><li class="fixed">'+ wizard_data.options_title['group-20001']+'</li></ul>');
  $pane.append('<ul class="option-menu"><li class="label">Трансмиссия</li><li class="fixed">'+ wizard_data.options_title['group-20002']+'</li></ul>');
  
  if (wizard_data.options_title['group-10000'])
    $pane.append('<ul class="option-menu"><li class="label">Цвет кузова</li><li>'+ wizard_data.options_title['group-10000']+'</li></ul>');
  
  if (wizard_data.options_title['group-10001'])
    $pane.append('<ul class="option-menu"><li class="label">Цвет салона</li><li>'+ wizard_data.options_title['group-10001']+'</li></ul>');
}

function on_slide_data1(event, data) {
  $(this).data('data', data);

  wizard_data.complectation = 0;
  wizard_data.engine = 0;
  wizard_data.options = [];
  wizard_data.options_title = [];
  for (i=1; i <= 8; i++) { $('#slide-'+i).data('is_valid', false); }
  
  //var $column1 = $('#order-info .column-1');
  //$column1.empty();
  //$column1.append('<h3>Выберите</h3>');

  // Complectations
  //$column1.append('<ul id="complectations" class="option-menu"><li class="label">Комплектация</li></ul>');
  //var $list=$column1.children('#complectations');
  for(id in data.complectations) {
    if (!wizard_data.complectation) wizard_data.complectation = id;
    //var item = data.complectations[id];
    //$list.append('<li id="complectation-'+id+'"><a href="#">'+item.name+'</a></li>');
    //$('#complectation-'+id+' a').data('id', id)
      //.click(function() {
        //$('#complectations li a').removeClass('active');
        //// wizard_complectation($(this).data('id')); 
        //$(this).addClass('active');
        //// $('#slide-1').trigger('update');
        //wizard_complectation($(this).data('id')); 
        //return false;
      //});
  }
  
  var $column2 = $('#order-info .column-2');
  $column2.empty();
  $column2.append('<div id="order-image"></div>');
  $column2.append('<div id="order-price"></div>');
  var image_url = images_dir + (data.model.image ? data.model.image : data.model.thumbnail);
  $('#order-image').append('<img src="'+image_url+'" alt="" title="" />');

  $(this).trigger('update');
  $('#order-info').slideDown(100);
}

//-----------------------------------------------------------------
// SLIDE 2
//-----------------------------------------------------------------
function on_slide_update2(event) {
  var data = $('#slide-1').data('data');
  
  if (!$(this).data('is_valid')) {
    $(this).empty();
    $(this).append('<div class="options-view"></div>');

    $options_view = $(this).children('.options-view');
    $options_view.empty();
    $options_view.append('<table border="0" cellspacing="0" cellpadding="0" class="contenttable"></table>');

    var $obj = $options_view.children('table');
    render_options( {table:$obj, options:data.options[wizard_data.complectation], to:10000, not_base_only:true} );   
    $(this).data('is_valid', true);
  } else {
    render_options( {table:$obj, options:data.options[wizard_data.complectation], to:10000, not_base_only:true, update:true} );   
  }
  
  update_order_info();
  show_navigation(true, true, true); 
  $('#order-wizard').animate({height:$('#slide-2').height()+"px"}, 500);
}

function on_slide_update3(event) {
  var data = $('#slide-1').data('data');

  if (!$(this).data('is_valid')) {
    $(this).empty();
    $(this).append('<div class="options-view"></div>');

    $options_view = $(this).children('.options-view');
    $options_view.empty();
    render_colors( {slide:$(this), options:data.options[wizard_data.complectation], from:10000, to:20000, is_group:true, is_colors:true} );   
    $(this).data('is_valid', true);
  } else {
    render_colors( {slide:$(this), options:data.options[wizard_data.complectation], from:10000, to:20000, is_group:true, is_colors:true, update:true } );   
  }

  update_order_info();
  show_navigation(true, true, true); 
  $('#order-wizard').animate({height:$('#slide-3').height()+"px"}, 500);
}


function on_slide_update4(event) {
  var data = $(this).data('data');

  $('#slide-5').data('is_valid', false);

  if (!$(this).data('is_valid')) {
    $(this).empty();
    $(this).append('<h3>Выберите город</h3>');
    $(this).append('<ul class="locations"></ul>');
    $list = $(this).children('ul');
    var i=0;
    for(idx in data.locations) {
      
      var location = data.locations[idx];
      
      $list.append('<li id="location-'+location.uid+'"><a href="#">'+
        (i<2 ? '<span class="big-city">'+location.title+'</span>' : location.title) + '</a></li>');
      i += 1;
      $('#location-'+location.uid)
        .data('location', location)
        .click(function() {
          var location = $(this).data('location');
          wizard_data.location = location.uid;
          wizard_data.location_title = location.title;
          wizard_slide_init(5);
          return false;
        });
    }
    $(this).data('is_valid', true);
  } else {
  }
  
  update_order_info();
  show_navigation(true, true, true); 
  $('#order-wizard').animate({height:$('#slide-4').height()+"px"}, 500);
}

function on_slide_data4(event, data) {
  $(this).data('data', data);
  $(this).trigger('update');
}



function on_slide_update5(event) {
  var data = $(this).data('data');

  if (!$(this).data('is_valid')) {
    $(this).empty();
    var is_empty = true;

    for(group_idx in data.dealers) {
      var group_data = data.dealers[group_idx];
      if (!group_data.data || group_data.data.length < 1) continue;
      is_empty = false;
      var group_title = group_data.attributes['vehicle-status'];
      $(this).append('<h3>'+group_title+'</h3>');
      $(this).append('<ul class="dealers"></ul>');
      var $list = $(this).children('ul');

      for(idx in group_data.data) {
        var dealer = group_data.data[idx];

        var info = '';
        if (dealer['image0']) {
          info += '<div class="dealer_map"><a href="'+dealer['image1']+'" title="'+
            '<strong>'+ dealer['DealerName']+'</strong><br />'+dealer['DealerCity'] + ', ' + dealer['DealerAddress'] +
            '; тел. '+dealer['DealerPhoneNo']+'"><img src="'+dealer['image0']+'" border="0" alt="'+
            dealer['DealerName']+'"/></a></div>';
        }
        info += '<b>'+dealer['DealerName']+'</b>';
        info += '<p>' + dealer['DealerCity'] + ', ' + dealer['DealerAddress'] +
          '; тел. '+dealer['DealerPhoneNo'] + '</p>';
       
        var delivery = parseInt(dealer['DeliveryCost']);
        if (!isNaN(delivery) && delivery) {
          info += '<p>Стоимость доставки: <span class="price">+'+formatNumber(dealer['DeliveryCost'], 0, ' ', '', '', '')+'</span> руб.</p>'
        }

        info += '<a href="#" id="checkout-'+idx+'" class="link-arrow-blue">Зарезервировать автомобиль</a>';
        $list.append('<li id="dealer-'+ dealer['DealerCode']+'">'+info+'<br class="clear" /></li>');
        $('#checkout-'+idx)
          .data('dealer', dealer)
          .click(function() {
            var dealer = $(this).data('dealer');
            wizard_data.dealer = dealer['DealerCode'];
            wizard_data.dealer_name = dealer['DealerName'];
            var delivery = parseInt(dealer['DeliveryCost']);
            if (!isNaN(delivery) && delivery) {
              wizard_data.dealer_delivery = delivery;
            } else {
              wizard_data.dealer_delivery = 0;
            }
            wizard_slide_init(6);
            return false;
          });
      }
    }

    // Bind lightbox
	  $('.dealer_map a').lightBox(); // Select all links in object with gallery ID

    if (is_empty) {
      $(this).append('<h3>Доступных машин в наличие нет</h3>');
    }

    // Show color alternatives
    if (is_empty && data.colors && data.colors.length > 0) {
      $(this).append('<table id="alt-colors" class="contenttable" cellspacing="0" cellpadding="0" border="0"></table>');
      var $table = $(this).children('#alt-colors');
      $table.append('<tr class="header"><td colspan="3">Вы можете заказть автомобиль соответствующий Вашим параметрам, доступный в следующих цветах</td></tr>');
      $table.append('<tr><th>Цвет кузова</th><th>Цвет салона</th></tr>');

      for(color_idx in data.colors) {
        var color_data = data.colors[color_idx];

        var body = color_tables['10000'][color_data.BodyColorCode]; 
        var saloon = color_tables['10001'][color_data.SaloonColorCode];
        var available = color_data.VehicleCount + ' машин';
        
        // Plural
        if (color_data.VehicleCount == 1) 
          available += 'а';
        else if (color_data.VehicleCount < 5) 
          available += 'ы';
          

        if (body && saloon) {
        $table.append('<tr id="color-idx-'+color_idx+'" class="option_row">' +
          '<td><div class="color-view" style="background:' + body.color + '"> </div> '+ body.title + '</td>' +
          '<td><div class="color-view" style="background:' + saloon.color + '"> </div> '+ saloon.title + '</td>' +
//          '<td>' + available + '</td>' +
          '</tr>');
        $('#color-idx-'+color_idx)
          .data('body', body)
          .data('body_code', color_data.BodyColorCode)
          .data('saloon', saloon)
          .data('saloon_code', color_data.SaloonColorCode)
          .click(function() {
            var body = $(this).data('body');
            var body_code = $(this).data('body_code');
            var saloon = $(this).data('saloon');
            var saloon_code = $(this).data('saloon_code');
            wizard_data.options['group-10000'] = body_code;
            wizard_data.options_title['group-10000'] = body.title;
            wizard_data.options['group-10001'] = saloon_code;
            wizard_data.options_title['group-10001'] = saloon.title;
            var data = $('#slide-1').data('data');
            render_colors( {options:data.options[wizard_data.complectation], from:10000, to:20000, is_group:true, is_colors:true, update:true } );   
            $('#slide-5').data('is_valid', false);
            wizard_slide_init(5);
            return false;
          });
        }
      }
    }



    $(this).append('<h3>Зарезервировать автомобиль на заказ</h3>');
    $(this).append('<p>Вы можеете оформить машину на заказ с указанными Вами параметрами</p>');
    if (wizard_data.location) $(this).append('<p>Место заказа: <b>'+ wizard_data.location_title +'</b></p>');
    $(this).append('<p><a href="#" id="checkout-special" class="link-arrow-blue">Зарезервировать автомобиль</a></p>');

    $('#checkout-special')
      .click(function() {
        wizard_slide_init(6);
        return false;
      });

    $(this).data('is_valid', true);
  } else {
  }
  
  update_order_info();
  show_navigation(true, true, false); 
  $('#order-wizard').animate({height:$('#slide-5').height()+"px"}, 500);
}


function on_slide_data5(event, data) {
  $(this).data('data', data);
  $(this).trigger('update');
}


function on_slide_update6(event) {
  if (!$(this).data('is_valid')) {
    $(this).empty();

    $(this).append('<h3>Контактные данные</h3>');
    $(this).append('<form class="gray-form"></form><div style="height:150px;"></div>');
    var $form = $(this).children('form');
    $form.append('<fieldset><dl class="two-columns"></dl></fieldset>');
    var $dl = $form.find('dl');
    $dl.append('<dt> </dt>');
    $dl.append('<dd>Пожалуйста, укажите Ваши контактные данные, чтобы наши менеджеры могли связаться с Вами для подтверждения заказа. Поля, помеченные <span class="powermail_mandatory">*</span> являются обязательными для заполнения.<div class="error hidden" id="order-error">Пожалуйста, заполните все обязательные поля!</div></dd>');
    $dl.append('<dt>Фамилия<span class="powermail_mandatory">*</span></dt>');
    $dl.append('<dd><div class="input-wrap"><input type="text" id="lastname" value="" /></div></dd>');
    $dl.append('<dt>Имя<span class="powermail_mandatory">*</span></dt>');
    $dl.append('<dd><div class="input-wrap"><input type="text" id="firstname" value="" /></div></dd>');
    $dl.append('<dt>Отчество<span class="powermail_mandatory">*</span></dt>');
    $dl.append('<dd><div class="input-wrap"><input type="text" id="surname" value="" /></div></dd>');
    $dl.append('<dt>Телефон<span class="powermail_mandatory">*</span></dt>');
    $dl.append('<dd><div class="input-wrap"><input type="text" id="phone" value="" /></div></dd>');
    $dl.append('<dt>E-mail</dt>');
    $dl.append('<dd><div class="input-wrap"><input type="text" id="email" value="" /></div></dd>');
    $dl.append('<dt> </dt>');
    $dl.append('<dd><input id="order-submit" width="83" type="image" height="17" src="fileadmin/templates/images.style/bg.submit.gif" alt=""/></dd>');

    $('#order-submit').click(function() {
      wizard_data.lastname = $('#lastname').val();
      wizard_data.firstname = $('#firstname').val();
      wizard_data.surname = $('#surname').val();
      wizard_data.phone = $('#phone').val();
      wizard_data.email = $('#email').val();
      if (wizard_data.lastname && wizard_data.firstname && wizard_data.surname && wizard_data.phone) {
        wizard_slide_init(7);
      } else {
        $('#order-error').slideDown(100);
      }
      return false;
    });
    $(this).data('is_valid', true);
  } 
    
  update_order_info();
  show_navigation(true, true, false); 
  $('#order-wizard').animate({height:$('#slide-6').height()+"px"}, 500);

}


function previewOrder($obj) {
//    $obj.append('<h3>Проверьте данные заказа</h3>');
    $obj.append('<table cellspacing="0" cellpadding="0" border="0" class="contenttable"></table>');
    var $table = $obj.children('table');

    $table.append('<tr class="header"><td colspan="3">Контактные данные</td></tr>');
    $table.append('<tr class="option-row"><td>Фамилия</td><td colspan="2">'+wizard_data.lastname+'</td></tr>');
    $table.append('<tr class="option-row"><td>Имя</td><td colspan="2">'+wizard_data.firstname+'</td></tr>');
    $table.append('<tr class="option-row"><td>Отчетсво</td><td colspan="2">'+wizard_data.surname+'</td></tr>');
    $table.append('<tr class="option-row"><td>Телефон</td><td colspan="2">'+wizard_data.phone+'</td></tr>');
    $table.append('<tr class="option-row"><td>Email</td><td colspan="2">'+wizard_data.email+'</td></tr>');
    
    if (wizard_data.location || wizard_data.dealer) {
      $table.append('<tr class="header"><td colspan="3">Место получения автомобиля</td></tr>');
      if (wizard_data.location)
        $table.append('<tr class="option-row"><td>Город</td><td colspan="2">'+wizard_data.location_title+'</td></tr>');
      if (wizard_data.dealer)
        $table.append('<tr class="option-row"><td>Дилер</td><td colspan="2">'+wizard_data.dealer_name+'</td></tr>');
        if (wizard_data.dealer_delivery)
         $table.append('<tr class="option-row"><td>Стоимость доставки:</td><td colspan="2"><span class="price">+'+formatNumber(wizard_data.dealer_delivery, 0, ' ', '', '', '')+'</span> руб.</td></tr>');
    }

    var model_data = $('#slide-1').data('data');
    $table.append('<tr class="header"><td colspan="3">Автомобиль</td></tr>');
    $table.append('<tr class="option-row"><td>Модель</td><td colspan="2">'+model_data.model.name+'</td></tr>');
    $table.append('<tr class="option-row"><td>Комплектация</td><td colspan="2">'+model_data.complectations[wizard_data.complectation].name+'</td></tr>');
    $table.append('<tr class="option-row"><td>Двигатель</td><td colspan="2">'+wizard_data.options_title['group-20000']+'</td></tr>');
    $table.append('<tr class="option-row"><td>Привод</td><td colspan="2">'+wizard_data.options_title['group-20001']+'</td></tr>');
    $table.append('<tr class="option-row"><td>Трансмиссия</td><td colspan="2">'+wizard_data.options_title['group-20002']+'</td></tr>');
    $table.append('<tr class="option-row"><td>Цвет кузова</td><td colspan="2">'+
                  (wizard_data.options_title['group-10000'] ? wizard_data.options_title['group-10000'] : 'Любой ') + '</td></tr>');
    $table.append('<tr class="option-row"><td>Цвет салона</td><td colspan="2">'+
                  (wizard_data.options_title['group-10001'] ? wizard_data.options_title['group-10001'] : 'Любой ') + '</td></tr>');
   
    $table.append('<tr class="header"><td colspan="3">Базовые опциии</td></tr>');
    render_options( {table:$table, options:model_data.options[wizard_data.complectation], to:20000, base_only:true, view:true} );
    $table.append('<tr class="header"><td colspan="3">Дополнительные опциии</td></tr>');
    render_options( {table:$table, options:model_data.options[wizard_data.complectation], to:10000, not_base_only:true, view:true} );   
    
    return $table;
}

function on_slide_update7(event) {
  if (!$(this).data('is_valid')) {
    $(this).empty();
    $table = previewOrder($(this));
    $table.prepend('<tr><td colspan="3" class="header-2">Проверьте данные заказа</td></tr>');
    $(this).data('is_valid', true);
  } 
    
  show_navigation(true, true, true); 
  $('#order-info').slideUp(100);
  $('#order-wizard').animate({height:$('#slide-7').height()+"px"}, 500);
}

function on_slide_update8(event) {
  var data = $(this).data('data');

  data = data.order[0];

  $(this).empty();

  if (data.ErrorMessage) {
    $(this).append('<h3>Возникла ошибка</h3>');
    $(this).append('<p>'+data.ErrorMessage+'</p>');
  } else {
    var $table = previewOrder($(this));
    $table.prepend('<tr class="option-row"><td>VIN автомобиля</td><td colspan="2"><strong>'+data.VIN+'</strong></td></tr>');
    $table.prepend('<tr class="option-row"><td>Номер заказ</td><td colspan="2"><strong>'+data.OrderNumber+'</strong></td></tr>');
    $table.prepend('<tr class="header"><td colspan="3">Заказ сформирован</td></tr>');
    $table.prepend('<tr><td colspan="3" class="header-2">Ваш заказ принят</td></tr>');
    $(this).append('<p class="align-right"><a href="#" id="print">Печатать заказ</a></p>');
    var print = $(this).find('#print');
    print.click(function(event) { 
      window.print(); 
      if (event.stopPropagation) {
        event.stopPropagation();
      } else {
        event.cancelBubble = true;
      }   
      return false; 
    });
  }
  
//  update_order_info();
  $('#order-wizard').animate({height:$('#slide-8').height()+"px"}, 500);
  show_navigation(false, false, false); 
//  show_navigation(true, true, true); 
}

function on_slide_data8(event, data) {
  $(this).data('data', data);
  $(this).trigger('update');
}


//
// Render price information
// 
function render_price() {
  var $price_obj = $('#order-price');
  $price_obj.empty();

  var data = $('#slide-1').data('data');
  var complactation_id = wizard_data.complectation;
  var options = data.options[complactation_id];
  var base_price = parseFloat(data.complectations[complactation_id].price);

  $price_obj.append('<ul></ul>');
  $list = $price_obj.children('ul');

  var options_price = 0;

  for(group_id in options) {
    var group = options[group_id];
    for(id in group.values) {
      var value = group.values[id];
      var input_name = 'option-'+value.sku;
      var group_name = 'group-'+group_id;

      if (wizard_data.options[group_name] == value.sku || wizard_data.options[value.sku] == value.sku) {
        if (value.price) options_price += parseFloat(value.price);
      }      
    }
  }  

  $list.append('<li class="label">Стоимость опиций и аксессуаров:</li><li class="price"><span>'+formatNumber(options_price, 0, ' ', '', '', '') + '</span> руб.</li>');  
  $list.append('<li class="label">Итоговая стоимость:</li><li class="price"><span>'+formatNumber(options_price+base_price, 0, ' ', '', '', '') + '</span> руб.</li>');
}


function on_option_change(event) {
  var data = $(this).data('data');
  var sku = data.value.sku.split('_')[0];
  var id = data.is_group ? 'group-'+data.group_id : sku;

  var do_set = false;
  if (data.no_input) {
    do_set =  true;
  } else {
    do_set = (data.name ? (wizard_data[data.name] != sku) : (wizard_data.options[id] != sku));
  }

  if (data.name) {
    if (do_set) {
      wizard_data[data.name] = sku;
    } else {
      wizard_data[data.name] = false;
    }
  } else {
    if (do_set) {
      wizard_data.options[id] = sku;
      wizard_data.options_title[id] = data.value.title;
    } else {
      wizard_data.options[id] = false;
      wizard_data.options_title[id] = '';
    }
  }

  wizard_update();

  if (event.stopPropagation) {
    event.stopPropagation();
  } else {
    event.cancelBubble = true;
  }   


  return false;
}

function render_colors(params) {
  color_tables = {}; // Clean up color tables

  var $slide = params.slide;
  for(group_id in params.options) {
    if (params.from && group_id < params.from) continue;
    if (params.to && group_id >= params.to) continue;
    color_tables[group_id] = {};
  
    var group = params.options[group_id];
    var group_name = 'group-'+group_id;
    var is_first_in_group = true;
    if (!params.update) {
      $slide.append('<h3>'+group.title+'</h3>');
      $slide.append('<ul id="'+group_name+'" class="color-list"></ul><div class="clear"><!-- // --></div>');
    }      
    var $list = $slide ? $slide.children('#'+group_name) : null;

    if (group.values[0].realsku != "0") {
      var all_item = { id:group.order+'-0', sku:"0_#f8f8f8", is_base:false, price:0, realsku:"0", title:"Любой"};
      group.values.unshift(all_item);
    }

    for(id in group.values) {
      var value = group.values[id];
      var sku = value.sku.split('_');
      var color = sku[1] && sku[1].substring(0, 1) == '#' ? sku[1] : '#ffffff';
      var input_name = 'option-'+value.id;

      color_tables[group_id][sku[0]] = { color:color, title:value.title, value:value };

      if (is_first_in_group && params.is_group) {
        if (!wizard_data.options[group_name]) {
          wizard_data.options[group_name] = sku[0];
          wizard_data.options_title[group_name] = value.title;         
        }
        is_first_in_group = false;
      }      
//      var price = value.is_base || value.price == 0 ? '&nbsp' : '+ ' + formatNumber(value.price, 0, ' ', '', '', '') + ' руб.';
      
      if (!params.update) {
        $list.append('<li id="'+input_name+'"><span><!-- // --></span><br />'+value.title+'</li>');
        $('#'+input_name+' span').css('background-color', color);
        $('#'+input_name)
          .data('data', {value:value, group_id:group_id, is_group:params.is_group, no_input:true })
          .click(on_option_change);
      }
      
      // Check required
      if (wizard_data.options[params.is_group ? group_name : sku[0]] == sku[0]) {
        if ($slide) $('#'+input_name).addClass('active');
        if (group_id == 10000) $('#order-image img').css('background-color', color);
      } else {
        if ($slide) $('#'+input_name).removeClass('active');
      }
    }

  }
  render_price();
}


function superpos(a1, a2) {
  var result = [];
  idx = 0;
  for(i2 in a2) {
    for (i1 in a1) {
      result[idx++] = a1[i1].concat(a2[i2]);
    }
  }
  return result;
}

function render_options_engine(params) {
  var $table = params.table;
  var engines_data = {};

  var idx = 0;

  // Engines
  for(engine_id in params.options[20000].values) {
    var value = params.options[20000].values[engine_id];
    var engine_sku = value.sku;
    var engine_data = [[value]];
    
    trans_data = [];
    for(id in params.options[20001].values) {
      var value = params.options[20001].values[id];
      var sku = value.sku.split('_');
      if (sku[1] == engine_sku) trans_data.push(value);
    }
    engine_data = superpos(engine_data, trans_data);
    
    gear_data = [];
    for(id in params.options[20002].values) {
      var value = params.options[20002].values[id];
      var sku = value.sku.split('_');
      if (sku[1] == engine_sku) gear_data.push(value);
    }
    engine_data = superpos(engine_data, gear_data);
    engines_data[engine_sku] = engine_data;

    for(id in engine_data) {
      var set = engine_data[id];
      if (!params.update) {
        var title = set[0].title + '/' + set[1].title + '/' + set[2].title;
        var price = set[0].price + set[1].price + set[2].price;
        $table.append('<tr id="'+engine_sku+'-'+ id +'" class="option_row"><td class="first">&nbsp;</td><td style="width:450px;">'+ title+'</td><td>'+price+'</td></tr>');
      }
    }

  }
  

  /*
  for(value_id in params.options[20000].values) {
    var value = group.values[id];
    var sku = value.sku.split('_');
    engine_data[sku] = [ [value] ];
  }


    
    if (params.from && group_id < params.from) continue;
    if (params.to && group_id >= params.to) continue;
    
    var group = params.options[group_id];
    var is_first_group = true;
    
    for(id in group.values) {
      var value = group.values[id];
      var sku = value.sku.split('_')[0];
      var super_sku = value.sku.split('_')[1];
      var input_name = 'option-'+sku;
      var group_name = 'group-'+group_id;
      
      // Super option
      if (is_first_group) {
        temp[sku] = [];
        temp[sku][idx] = [value];
      } else {
        temp[super_sku][idx] = value;
      }
    }

      idx += 1;
      is_first_group = false;
  }

      
      
      if ((params.base_only && !value.is_base) || (params.not_base_only && value.is_base)) continue;
      
      if (is_first_in_group) {
        if (!params.update) $table.append('<tr class="header"><td colspan="3">'+group.title+'</td></tr>');
        if (params.is_group) {
          if (params.name && !wizard_data[params.name]) {
            wizard_data[params.name] = sku;
          } else if (!wizard_data.options[group_name]) {
            wizard_data.options[group_name] = sku;
            wizard_data.options_title[group_name] = value.title;
          }
        }
        is_first_in_group = false;
      }
      
//      var checkbox = value.is_base ? '&nbsp;' : '<input type="checkbox" />';
      var checkbox = '&nbsp;';
    
      var price = value.is_base || value.price == 0 ? '&nbsp' : '+ ' + formatNumber(value.price, 0, ' ', '', '', '') + ' руб.';
      if (!params.update) {
        $table.append('<tr id="'+input_name+'" class="'+group_name+' option_row"><td class="first">'+checkbox+'</td><td style="width:450px;">'+value.title+'</td><td>'+price+'</td></tr>');
        if (!value.is_base) {
          $('#'+input_name)
            .data('data', {value:value, group_id:group_id, is_group:params.is_group, name:params.name})
            .click(on_option_change);
        }
      }
      
      // Check required
      if ((params.name && wizard_data[params.name] == sku) || 
          (!params.name && (wizard_data.options[params.is_group ? group_name : sku] == sku || value.is_base))) {
//        $('#'+input_name+' input').attr('checked', true);
        $('#'+input_name).addClass('selected');
      } else {
//        $('#'+input_name+' input').attr('checked', false);
        $('#'+input_name).removeClass('selected');
      }
    }

  }
  render_price();
  */
}

function render_options(params) {
  var $table = params.table;
  for(group_id in params.options) {
    
    if (params.from && group_id < params.from) continue;
    if (params.to && group_id >= params.to) continue;
    
    var group = params.options[group_id];
    var is_first_in_group = true;
    
    for(id in group.values) {
      var value = group.values[id];
      var sku = value.sku.split('_')[0];
      var input_name = 'option-'+sku;
      var group_name = 'group-'+group_id;
      
      if ((params.base_only && !value.is_base) || (params.not_base_only && value.is_base)) continue;
      
      if (is_first_in_group) {
        if (!params.update && !params.view) $table.append('<tr class="header"><td colspan="3">'+group.title+'</td></tr>');
        if (params.is_group) {
          if (params.name && !wizard_data[params.name]) {
            wizard_data[params.name] = sku;
          } else if (!wizard_data.options[group_name]) {
            wizard_data.options[group_name] = sku;
            wizard_data.options_title[group_name] = value.title;
          }
        }
        is_first_in_group = false;
      }
      
//      var checkbox = value.is_base ? '&nbsp;' : '<input type="checkbox" />';
      var checkbox = '&nbsp;';
    
      var price = value.is_base || value.price == 0 ? '&nbsp' : '+ ' + formatNumber(value.price, 0, ' ', '', '', '') + ' руб.';
      if (!params.update) {
        if (params.view) {
          
          if ((params.name && wizard_data[params.name] == sku) || 
            (!params.name && (wizard_data.options[params.is_group ? group_name : sku] == sku || value.is_base))) {
              $table.append('<tr class="'+group_name+' option_row"><td colspan="2">'+value.title+'</td><td>'+price+'</td></tr>');
          } 

        } else {
          $table.append('<tr id="'+input_name+'" class="'+group_name+' option_row"><td class="first">'+checkbox+'</td><td style="width:450px;">'+value.title+'</td><td>'+price+'</td></tr>');
          if (!value.is_base) {
            $('#'+input_name)
              .data('data', {value:value, group_id:group_id, is_group:params.is_group, name:params.name})
              .click(on_option_change);
          }
        }
      }

      
      // Check required
    
      if (!params.view) {
        if ((params.name && wizard_data[params.name] == sku) || 
          (!params.name && (wizard_data.options[params.is_group ? group_name : sku] == sku || value.is_base))) {
//        $('#'+input_name+' input').attr('checked', true);
          $('#'+input_name).addClass('selected');
        } else {
//          $('#'+input_name+' input').attr('checked', false);
          $('#'+input_name).removeClass('selected');
        }
      }
    }

  }

  render_price();
}


function on_slide_show(event, data) {
  var slide = data;
 
  $('#slide-'+slide).bind('update', eval('on_slide_update'+slide));
 
  if (slide_with_data[slide] && !$('#slide-'+slide).data('is_valid'))
    request_slide_data(slide);
  else
    $('#slide-'+slide).trigger('update');
    
}

function request_slide_data(slide) {
  var data = {};

  for (i in wizard_data) {
    var value = wizard_data[i];
    if (value instanceof Array) {
      for (j in value) {
        data['mage['+i+']['+j+']'] = value[j];
      }
    } else
      data['mage['+i+']'] = value;
  }
  
  data['mage[action]'] = 'ajax_order';
  data['mage[slide]'] = slide;

  $('#slide-'+slide).bind('data', eval('on_slide_data'+slide));
  $('#slide-'+slide).empty().append(loading());
  jQuery.post($ajax_url, data,
    function(data) {
      var $slide = $('#slide-'+ slide);
      $slide.trigger('data', data);
    },
    'json'
  );  
}


function loading() {
  content = '<div class="loading2">Загрузка, подождите...<br /><img src="fileadmin/templates/images/ajax-loader.gif" alt="" /></div>';
  return content;
}


function show_navigation(is_show_back, is_show_prev, is_show_forward) {
  if (is_show_prev) {
    $('ul.browser .prev').show();
  } else {
    $('ul.browser .prev').hide();
  }
  
  if (is_show_forward) {
    $('ul.browser .next').show();
  } else {
    $('ul.browser .next').hide();
  }
  
  if (is_show_back) {
    $('ul.browser .back').show();
  } else {
    $('ul.browser .back').hide();
  }
}


function buildNavigator($obj, id) {
  $obj.append('<ul class="browser browser-'+id+'"></ul>');
  var $ul = $obj.children('ul.browser-'+id);
  
  $ul.append('<li class="next"><a href="#">Вперед</a></li>');
  var $next = $ul.find('li.next a');
  $next.bind('click', 1, wizard_move);
  
  $ul.append('<li class="prev"><a href="#">Назад</a></li>');
  var $prev = $ul.find('li.prev a');
  $prev.bind('click', -1, wizard_move);
  
  $ul.append('<li class="back"><a href="#">К выбору комплектации</a></li>');
  var $link = $ul.find('li.back a');
  $link.bind('click', 1, wizard_event_init);
}

function wizard_init() {  
  var $container = $('#order-container');
  key = location.hash.replace('#','').split('-');
  var wizard_html = '';
  for (i=0; i <= 8; i++) {
    wizard_html += '<li id="slide-'+i+'" class="slide">'+loading()+'</li>';
  }
  
//  $container.append('<p class="important">Система &laquo;Автопоиск&raquo; работает в тестовом режиме.<br /> Приносим извинения за возможные сбои.</p>');
  
  $container.append('<div id="order-info"><div class="columns-2"><div class="column-1"></div><div class="column-2"></div></div><div class="clear"><!-- // --></div></div>');
  buildNavigator($container, 1);
  $container.append('<div id="order-wizard"><ul class="slider">'+wizard_html+'</ul></div>');
  buildNavigator($container, 2);
  show_navigation(false, false, false);
  $('#order-info').hide();
  $('#order-wizard .slide').bind('show', on_slide_show);

//  $("#slide-0").bind('json_data', data_handler_0);

  // Build wizard slider
  $("#order-wizard").serialScroll({
      items:'li',
      duration:700,
      force:true,
      stop:true,
      cycle:false, //don't pull back once you reach the end      
      lock:false,
      axis:'x',
      lazy:false,//NOTE: it's set to true, meaning you can add/remove/reorder items and the changes are taken into account.
      onAfter: function() { $('#order-wizard').animate({height:$('#slide-'+currentSlide).height()+"px"}, 500); },
      step:1 //scroll 2 news each time
//      prev: "#order-container ul.browser li.prev a",
//      next: "#order-container ul.browser li.next a",
//      onBefore: wizardOnBefore
    });

  //$prev = $("#order-container ul.browser li.prev a");
  //$prev.bind('click', -1, wizard_move);
  //$next = $("#order-container ul.browser li.next a");
  //$next.bind('click', 1, wizard_move);
  wizard_slide_init(0);
}

$(document).ready(wizard_init);