$('#cats').collapse({
  toggle: false
});

on_title_click=function(event) {
  if (event.target.tagName=='BUTTON') {
    return;
  }
  var title=$(this);
  var panel=title.parent().parent();
  var panel_collapse=panel.find('.panel-collapse');
  var show=!panel_collapse.hasClass('in');
  $('.panel-collapse').each(function(idx,div) {
    $(div).collapse('hide');
  });
  if (show) {
    panel_collapse.collapse('show');
  }
}

/***********************
 * Add scase
 **********************/
on_add_scase_btn_click=function(event) {
  navbar_collapse_hide();
  $('#add_scase_modal').modal('show');
}

on_valid_add_scase_modal=function (e) {
  e.preventDefault();
  var name=$('#add_scase_name')[0].value;
  if (name=='') {
    alert("Vous devez saisir le nom de la valise !");
    return;
  }
  if (scases.byName(name)) {
    alert("Cette valise existe déjà !");
    return;
  }
  var scase=scases.newSCase(name);
  if (scase) {
    scases.save();
    show_scase(scase);
  }
  $('#add_scase_modal').modal('hide');
}

on_show_add_scase_modal=function () {
  $('#add_scase_name').focus();
}

on_close_add_scase_modal=function () {
  $('#add_scase_modal form')[0].reset();
}

/***********************
 * Rename scase
 **********************/
on_rename_scase_btn_click=function(event) {
  navbar_collapse_hide();
  $('#rename_scase_name')[0].value=$('#cats').data('scase');
  $('#rename_scase_modal').modal('show');
}

on_valid_rename_scase_modal=function (e) {
  e.preventDefault();
  var name=$('#rename_scase_name')[0].value;
  if (name=='') {
    alert("Vous devez saisir le nouveau nom de la valise !");
    return;
  }
  if ($('#cats').data('scase')!=name) {
    if (scases.byName(name)) {
      alert("Cette valise existe déjà !");
      return;
    }

    var scase=scases.renameSCase($('#cats').data('scase'),name);
    if (scase) {
      scases.save();
      show_scase(scase);
    }
    else {
      alert('Une erreur est survenue en renomant la valise...');
    }
  }
  $('#rename_scase_modal').modal('hide');
}

on_show_rename_scase_modal=function () {
  $('#rename_scase_name').focus();
}

on_close_rename_scase_modal=function () {
  $('#rename_scase_modal form')[0].reset();
}

/***********************
 * Copy scase
 **********************/
on_copy_scase_btn_click=function(event) {
  navbar_collapse_hide();
  $('#copy_scase_modal').modal('show');
}

on_valid_copy_scase_modal=function (e) {
  e.preventDefault();
  var name=$('#copy_scase_name')[0].value;
  if (name=='') {
    alert("Vous devez saisir le nom de la nouvelle valise !");
    return;
  }
  if (scases.byName(name)) {
    alert("Cette valise existe déjà !");
    return;
  }
  var scase=scases.copySCase($('#cats').data('scase'),name);
  if (scase) {
    scases.save();
    show_scase(scase);
  }
  else {
    alert('Une erreur est survenue en copiant la valise...');
  }
  $('#copy_scase_modal').modal('hide');
}

on_show_copy_scase_modal=function () {
  $('#copy_scase_name').focus();
}

on_close_copy_scase_modal=function () {
  $('#copy_scase_modal form')[0].reset();
}

/***********************
 * Reset scase
 **********************/
on_reset_scase_btn_click=function(event) {
  navbar_collapse_hide();
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    myconfirm('Voulez-vous vraiment réinitialiser la valise '+$('#cats').data('scase')+' ?',
    function(data) {
      scases.resetSCase(scase.name);
      scases.save();
      show_scase(scase);
    });
  }
}
/***********************
 * Delete scase
 **********************/
on_delete_scase_btn_click=function(event) {
  navbar_collapse_hide();
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    myconfirm('Voulez-vous vraiment supprimer la valise '+$('#cats').data('scase')+' ?',
    function(data) {
      scases.removeSCase(scase.name);
      scases.save();
      show_scases();
    });
  }
}

/***********************
 * Add cat
 **********************/
on_add_cat_btn_click=function(event) {
  navbar_collapse_hide();
  $('#add_cat_modal').modal('show');
}

on_valid_add_cat_modal=function (e) {
  e.preventDefault();
  var name=$('#add_cat_name')[0].value;
  if (name=='') {
    alert("Vous devez saisir le nom de la catégorie !");
    return;
  }
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    if (scase.cats.byName(name)) {
      alert("Cette catégorie existe déjà !");
      return;
    }
    var cat=scase.cats.newCat(name);
    if (cat) {
      scases.save();
      show_scase(scase,cat.name);
    }
  }
  $('#add_cat_modal').modal('hide');
}

on_show_add_cat_modal=function () {
  $('#add_cat_name').focus();
}

on_close_add_cat_modal=function () {
  $('#add_cat_modal form')[0].reset();
}

/***********************
 * Rename cat
 **********************/
on_rename_cat_btn_click=function(event) {
  navbar_collapse_hide();
  $('#rename_cat_modal').data('cat',event.data.cat.name);
  $('#rename_cat_name')[0].value=event.data.cat.name;
  $('#rename_cat_modal').modal('show');
}

on_valid_rename_cat_modal=function (e) {
  e.preventDefault();
  var name=$('#rename_cat_name')[0].value;
  if (name=='') {
    alert("Vous devez saisir le nouveau nom de la catégorie !");
    return;
  }
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    if (scase.cats.byName(name)) {
      alert("Cette catégorie existe déjà !");
      return;
    }
    var cat=scase.cats.renameCat($('#rename_cat_modal').data('cat'),name);
    if (cat) {
      scases.save();
      show_scase(scase,cat.name);
    }
  }
  $('#rename_cat_modal').modal('hide');
}

on_show_rename_cat_modal=function () {
  $('#rename_cat_name').focus();
}

on_close_rename_cat_modal=function () {
  $('#rename_cat_modal form')[0].reset();
}

/***********************
 * Delete cat
 **********************/
on_delete_cat_btn_click=function(event) {
  navbar_collapse_hide();
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    var cat=event.data.cat.name;
    myconfirm('Voulez-vous vraiment supprimer la catégorie '+cat+' ?',
    function(data) {
      scase.cats.removeCat(cat);
      scases.save();
      show_scase(scase);
    });
  }
}

/************************
 * Check/Uncheck thing
 ***********************/
on_li_click=function(event) {
  if (event.target.tagName!='LI') {
    return;
  }
  var li=$(this);
  if (li.hasClass('done')) {
    li.removeClass('done');
  }
  else {
    li.addClass('done');
  }
  var ul=li.parent();
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    var cat=scase.cats.byName(ul.data('cat'));
    if (cat) {
      var thing=cat.byLabel(li.data('label'));
      if (thing) {
        thing.checked=li.hasClass('done');
        scases.save();
      }
      show_scase(scase,cat.name);
    }
  }
}

/***********************
 * Add thing
 **********************/
on_li_add_click=function(event) {
  var li=$(this);
  var cat=li.parent().data('cat');
        var modal=$('#add_thing_modal');
  modal.data('cat',cat);
  modal.modal('show');
}

on_valid_add_thing_modal=function (e) {
  e.preventDefault();
  var label=$('#add_thing_label')[0].value;
  if (label=='') {
    alert("Vous devez saisir le nom de l'élément !");
    return;
  }
  var modal=$('#add_thing_modal');
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    var cat=scase.cats.byName(modal.data('cat'));
    if (cat) {
      if (cat.byLabel(label)) {
        alert("Cet élément existe déjà !");
        return;
      }
      cat.things.push(new Thing(label,false));
      scases.save();
      show_scase(scase,cat.name);
    }
  }
  modal.modal('hide');
}

on_show_add_thing_modal=function () {
  $('#add_thing_label').focus();
}

on_close_add_thing_modal=function () {
  $('#add_thing_modal form')[0].reset();
}


/***********************
 * Rename thing
 **********************/
on_rename_thing_btn_click=function(event) {
  navbar_collapse_hide();
  $('#rename_thing_modal').data('cat',event.data.cat.name);
  $('#rename_thing_modal').data('thing',event.data.thing.label);
  $('#rename_thing_label')[0].value=event.data.thing.label;
  $('#rename_thing_modal').modal('show');
}

on_valid_rename_thing_modal=function (e) {
  e.preventDefault();
  var label=$('#rename_thing_label')[0].value;
  if (label=='') {
    alert("Vous devez saisir le nouveau nom de l'élément !");
    return;
  }
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    var cat=scase.cats.byName($('#rename_thing_modal').data('cat'));
    if (cat) {
      if (cat.byLabel(label)) {
        alert("Un élément de ce nom existe déjà !");
        return;
      }
      var thing=cat.renameThing($('#rename_thing_modal').data('thing'),label);
      if (thing) {
        scases.save();
        show_scase(scase,cat.name);
      }
    }
  }
  $('#rename_thing_modal').modal('hide');
}

on_show_rename_thing_modal=function () {
  $('#rename_thing_name').focus();
}

on_close_rename_thing_modal=function () {
  $('#rename_thing_modal form')[0].reset();
}

/***********************
 * Delete thing
 **********************/
on_delete_thing_btn_click=function(event) {
  navbar_collapse_hide();
  var scase=scases.byName($('#cats').data('scase'));
  if (scase) {
    var cat=scase.cats.byName(event.data.cat.name);
    if (cat) {
      var thing=event.data.thing.label;
      myconfirm("Voulez-vous vraiment supprimer l'élément "+thing+" ?",
      function(data) {
        cat.removeThing(thing);
        scases.save();
        show_scase(scase,cat.name);
      });
    }
  }
}

/********************
 * Show one scase
 *******************/
show_cat=function(cat,displayed) {
  var panel=$('<div class="panel panel-default"></div>');
  var panel_heading=$('<div class="panel-heading" role="tab"></div>');
  var panel_title=$('<h4 class="panel-title">'+cat.name+' </h4>');
  panel_title.bind('click',on_title_click);


  var count=cat.count();
  var countDone=cat.countDone();
  var tag=$('<span class="count-tag pull-right"></span>');
  if (count==countDone) {
    tag.append($('<span class="label label-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></span>'));
  }
  else {
    tag.append($('<span class="badge">'+countDone+' / '+count+'</span>'));
  }

  var delete_btn=$('<button class="btn btn-default btn-xs pull-right"><span class="glyphicon glyphicon-trash"></button>');
  delete_btn.bind('click',{'cat': cat},on_delete_cat_btn_click);
  tag.append(delete_btn);

  var rename_btn=$('<button class="btn btn-default btn-xs pull-right"><span class="glyphicon glyphicon-edit"></button>');
  rename_btn.bind('click',{'cat': cat},on_rename_cat_btn_click);
  tag.append(rename_btn);

  panel_title.append(tag);

  
  panel_heading.append(panel_title);
  panel.append(panel_heading);
  var panel_collapse=$('<div class="panel-collapse collapse" role="tabpanel"></div>');
  if (displayed) {
    panel_collapse.addClass('in');
  }
  var ul=$('<ul class="list-group" data-cat="'+cat.name+'"></ul>');
  for (idx in cat.things) {
    var li=$('<li class="list-group-item" data-label="'+cat.things[idx].label+'">'+cat.things[idx].label+'</li>');
    if (cat.things[idx].checked) {
      li.addClass('done');
    }
    li.bind('click',on_li_click);

    var li_actions=$('<span class="actions pull-right"></span>');

    var delete_el_btn=$('<button class="btn btn-default btn-xs pull-right"><span class="glyphicon glyphicon-trash"></button>');
    delete_el_btn.bind('click',{'cat': cat,'thing': cat.things[idx]},on_delete_thing_btn_click);
    li_actions.append(delete_el_btn);

    var rename_el_btn=$('<button class="btn btn-default btn-xs pull-right"><span class="glyphicon glyphicon-edit"></button>');
    rename_el_btn.bind('click',{'cat': cat,'thing': cat.things[idx]},on_rename_thing_btn_click);
    li_actions.append(rename_el_btn);

    li.append(li_actions);

    ul.append(li);
  }
  var li=$('<li class="list-group-item"><span class="glyphicon glyphicon-plus-sign"></span> Ajouter un élément</li>');
  li.bind('click',on_li_add_click);
  ul.append(li);
  panel_collapse.append(ul);
  panel.append(panel_collapse);
  $('#cats').append(panel);
}

show_scase=function(scase,display_cat) {
  clear_page('<h3><span class="glyphicon glyphicon-briefcase" aria-hidden="true"></span> '+scase.name+'</h3><div class="panel-group" id="cats" role="tablist" aria-multiselectable="true" data-scase="'+scase.name+'"></div>');
  scase.cats.each(function(idx,cat) {
    show_cat(cat,(cat.name==display_cat));
  });
  show_menu('scase');
}

on_back_to_scases_btn_click=function(e) {
  e.preventDefault();
  navbar_collapse_hide();
  show_scases();
}

/********************
 * Show scases
 *******************/
show_scases=function() {
  clear_page('<h3>Vos valises</h3><ul class="list-group" id="scases"></ul>');
  scases.each(function(idx,scase) {
    var stats=scase.stats();
    var tag='<span class="count-tag pull-right">';
    if (stats.things==stats.done) {
      tag+='<span class="label label-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></span>';
    }
    else {
      tag+='<span class="badge">'+stats.done+' / '+stats.things+'</span>';
    }
    tag+='</span>';

    var li=$('<li class="list-group-item" data-name="'+scase.name+'"><span class="scase-name"><span class="glyphicon glyphicon-briefcase" aria-hidden="true"></span> '+scase.name+'</span>'+tag+'</li>');
    li.bind('click',on_scase_click);
    $('#scases').append(li);
  });
  show_menu('scases');
}

on_scase_click=function(event) {
  var li=$(this);
  var scase=scases.byName(li.data('name'));
  show_scase(scase);
}

clear_page=function(new_content) {
  if (new_content) {
    $('#content').html(new_content);
  }
  else {
    $('#content').html('');
  }
}

/************************
 * Show menu
 ***********************/
show_menu=function(menu) {
  $('.menu').css('display','none');
  $('.menu-'+menu).css('display','block');
}

/*******************
 * pleaseWaitDialog
 *******************/

pleaseWaitShow=function() {
  $('#please_wait_modal').modal('show');
}

pleaseWaitHide=function() {
  $('#please_wait_modal').modal('hide');
}

/****************
 * Nav bars
 ****************/
navbar_collapse_hide=function() {
  if ($('#navbar-top-collapse').hasClass('in')) {
    $('#navbar-top-collapse').collapse('hide');
  }
}

/**************************
 * Cache / Update
 *************************/

_checkForUpgrade=false;
onUpdateReady=function() {
  if (_checkForUpgrade) {
    pleaseWaitHide();
  }
  myconfirm(
    "Une nouvelle version de l'application est disponible. Voulez-vous lancer la mise à jour ?",
    onConfirmUpdate,null,{}
  );
}

onConfirmUpdate=function() {
  window.applicationCache.swapCache();
  location.reload();
}

updateApp = function() {
  navbar_collapse_hide();
  pleaseWaitShow();
  _checkForUpgrade=true;
  window.applicationCache.update();
}

onNoUpdate = function() {
  if (_checkForUpgrade) {
    pleaseWaitHide();
    _checkForUpgrade=false;
    alert('Aucune mise à jour disponible');
  }
}

/********************
 * Clear local data
 ********************/
clear_local_data=function() {
  navbar_collapse_hide();
  myconfirm('Etes-vous sûre de vouloir supprimer les données locales ?',on_confirm_clear_local_data);
}

on_confirm_clear_local_data=function(data) {
  delete localStorage.scases;
  location.reload();
}

/*********************
 * Activate
 *********************/
$( document ).ready( function() {
  pleaseWaitShow();
  if(typeof(localStorage)!=="undefined"){
    scases=new SCaseList();
    scases.loadFromLocalStorage();
    show_scases();
  }
  else {
    alert('Local storage not supported !');
    pleaseWaitHide();
    return;
  }

  $('#clear_local_data').bind('click',clear_local_data);

  $('#add_scase_btn').bind('click',on_add_scase_btn_click);
  $('#add_scase_submit').bind('click',on_valid_add_scase_modal);
  $("#add_scase_modal").on('shown.bs.modal',on_show_add_scase_modal);
  $("#add_scase_modal").on('hidden.bs.modal',on_close_add_scase_modal);
  $("#add_scase_modal form").bind('submit',on_valid_add_scase_modal);

  $('#rename_scase_btn').bind('click',on_rename_scase_btn_click);
  $('#rename_scase_submit').bind('click',on_valid_rename_scase_modal);
  $("#rename_scase_modal").on('shown.bs.modal',on_show_rename_scase_modal);
  $("#rename_scase_modal").on('hidden.bs.modal',on_close_rename_scase_modal);
  $("#rename_scase_modal form").bind('submit',on_valid_rename_scase_modal);

  $('#copy_scase_btn').bind('click',on_copy_scase_btn_click);
  $('#copy_scase_submit').bind('click',on_valid_copy_scase_modal);
  $("#copy_scase_modal").on('shown.bs.modal',on_show_copy_scase_modal);
  $("#copy_scase_modal").on('hidden.bs.modal',on_close_copy_scase_modal);
  $("#copy_scase_modal form").bind('submit',on_valid_copy_scase_modal);

  $('#reset_scase_btn').bind('click',on_reset_scase_btn_click);
  $('#delete_scase_btn').bind('click',on_delete_scase_btn_click);

  $('#add_cat_btn').bind('click',on_add_cat_btn_click);
  $('#add_cat_submit').bind('click',on_valid_add_cat_modal);
  $("#add_cat_modal").on('shown.bs.modal',on_show_add_cat_modal);
  $("#add_cat_modal").on('hidden.bs.modal',on_close_add_cat_modal);
  $("#add_cat_modal form").bind('submit',on_valid_add_cat_modal);

  $('#rename_cat_submit').bind('click',on_valid_rename_cat_modal);
  $("#rename_cat_modal").on('shown.bs.modal',on_show_rename_cat_modal);
  $("#rename_cat_modal").on('hidden.bs.modal',on_close_rename_cat_modal);
  $("#rename_cat_modal form").bind('submit',on_valid_rename_cat_modal);

  $('#back_to_scases').bind('click',on_back_to_scases_btn_click);
  
  $('#add_thing_submit').bind('click',on_valid_add_thing_modal);
  $("#add_thing_modal").on('shown.bs.modal',on_show_add_thing_modal);
  $("#add_thing_modal").on('hidden.bs.modal',on_close_add_thing_modal);
  $("#add_thing_modal form").bind('submit',on_valid_add_thing_modal);

  $('#rename_thing_submit').bind('click',on_valid_rename_thing_modal);
  $("#rename_thing_modal").on('shown.bs.modal',on_show_rename_thing_modal);
  $("#rename_thing_modal").on('hidden.bs.modal',on_close_rename_thing_modal);
  $("#rename_thing_modal form").bind('submit',on_valid_rename_thing_modal);

  $('#app-name').bind('click', show_scases);

  if (window.applicationCache.status==window.applicationCache.UNCACHED) {
    $('#update_app').parent().remove();
  }
  else {
    $('#update_app').bind('click',updateApp);
    window.applicationCache.addEventListener('updateready', onUpdateReady);
    window.applicationCache.addEventListener('noupdate', onNoUpdate);
    if(window.applicationCache.status === window.applicationCache.UPDATEREADY) {
      onUpdateReady();
    }
  }

  pleaseWaitHide();
});