jQuery(function($) {
  "use strict";

  var TEMPLATES = new LuigiTemplate.Cache({
    user: [
      "<a ",
        "href='#' ",
        "class='list-group-item %{css|h}' ",
        "title='Edit user \"%{user_name|h}\".' ",
        "data-row='%{row|json|h}' ",
        "data-q='%{q|h}' ",
      ">",
        "<i class='fa fa-fw fa-spinner fa-spin hidden loading'></i>",
        "<i class='fa fa-fw fa-user loading'></i>",
        " ",
        "%{user_name|h} (%{email|h})",

        "<span class='badge pull-right'>",
          "%{role_name|h}",
        "</span>",
      "</a>",
    ],

    loading: [
      "<span class='list-group-item disabled'>",
        "<i class='fa fa-spinner fa-spin'></i>",
        " ",
        "Loading...",
      "</span>",
    ],

    error: [
      "<span class='list-group-item list-group-item-danger disabled'>",
        "<i class='fa fa-exclamation-triangle'></i>",
        " ",
        "Error: %{responseText|h}",
      "</span>",
    ],
  });

  function update_slug(name, slug) {
    if (slug.prop('disabled')) {
      slug.val(
        name.val().toLowerCase()
        .replace(/[^a-z0-9_\.-]+/g, '-')
        .replace(/^-+|-+$/g, '')
      );
    }
  }

  $.each(['blog', 'page', 'project'], function(i, id) {
    var p = '#' + id + '-edit-';

    $(p + 'dialog').one('shown.bs.modal', function() {
      // lazy-init editor
      CKEDITOR.replace(id + '-edit-body');
    }).on('show.bs.modal', function() {
      // reset close confirmation
      $(this).data('close-dialog-confirmed', false);

      // TODO load post
      $(p + 'name').val('');
      $(p + 'slug').val('');
    }).on('shown.bs.modal', function() {
      $(p + 'name').focus();
    }).on('hide.bs.modal', function() {
      return (
        $(this).data('close-dialog-confirmed') ||
        confirm('Close without saving changes?')
      );
    }).find('button[data-dismiss="modal"]').click(function() {
      // override close confirmation
      // FIXME: should this only be on save?
      $(p + 'dialog').data('close-dialog-confirmed', true);
    });

    $(p + 'confirm').click(function() {
      if ($(this).hasClass('disabled'))
        return false;

      // TODO: see #user-add-confirm
      alert('TODO: create');

      // stop event
      return false;
    });
  });

  $('.post-name').keydown(function() {
    var name = $(this),
        slug = $(this).parents('.modal-body').find('.post-slug');

    setTimeout(function() {
      update_slug(name, slug);
    }, 10);
  });

  $('.post-slug-lock').click(function() {
    var modal_body = $(this).parents('.modal-body');

    // toggle locked state
    $(this).toggleClass('btn-default btn-primary')
      .find('.fa').toggleClass('fa-lock fa-unlock');
    var locked = $(this).hasClass('btn-default');

    // update slug disabled state
    var slug = modal_body.find('.post-slug');
    slug.prop('disabled', locked ? 'disabled' : null);

    if (locked) {
      // auto-generate slug
      update_slug(modal_body.find('.post-name'), slug);
    }

    // stop event
    return false;
  });
});