<!DOCTYPE html >
<html lang="en">
<head>
  <title><%cat_full_name%>: Tag a Thread</title>
  <%include include_common_head.html%>
</head>
<body class="page-<%page_id%>">
  <div class="container-b">
    <%include include_header.html%>

    <div class="main">
      <div class="contentwrapper clearfix">
        <div class="sidebar">
            <%include include_sidebar.html%>
        </div>

        <%~set content_header_title = 'Tag a Thread'%>
        <%~init array breadcrumbs%><%init hash breadcrumbs.0%><%init hash breadcrumbs.1%>
        <%~set breadcrumbs.0.name = $forum_name%>
        <%~set breadcrumbs.0.url  = GForum::SEO::url(params => "forum=$forum_id")%>
        <%~set breadcrumbs.1.name = $content_header_title%>

        <%include include_breadcrumb.html%>

        <div class="content"><%-- start content--%>
            <%include include_content_header.html%>
            <form name="post" action="<%GForum::SEO::url()%>" method="post" class="form">
                <input type="hidden" name="thread" value="<%post_id%>" />
                <input type="hidden" name="forum" value="<%forum_id%>" />
                <input type="hidden" name="up" value="1" />
                <div class="dtable form">
                    <div class="drow">
                        <div class="dcell name">Thread</div>
                        <div class="dcell divider"></div>
                        <div class="dcell value">
                            <b><%post_subject%></b> - 
                            <a href="<%GForum::SEO::url(type => "post", id => $post_id)%>" class="title">view thread</a>
                        </div>
                    </div>
                    <div class="drow category">
                        <div class="dcell name">Categories</div>
                        <div class="dcell divider"></div>
                        <div class="dcell value">
                        <%~loop groups_loop%>
                            <h3><span><%group_name%></span> - <a href="#" rel="<%group_id%>" class="editcat">edit</a> - <a href="#" rel="<%group_id%>" class="addcat">add subcategory</a></h3>
                            <ul>
                              <%~loop children%>
                              <li><input type="checkbox" id="group-<%group_id%>" name="group_id" value="<%group_id%>"<%if selected%> checked<%endif%>><label for="group-<%group_id%>"><%group_name%></label> - <a href="<%father_id%>" rel="<%group_id%>" class="editcat">edit</a></li>
                              <%~endloop%>
                            </ul>
                        <%~endloop%>
                            <p><a href="#" rel="category" class="addcat">add category</a></p>
                        </div>
                    </div>
                    <div class="drow actions">
                        <div class="dcell name"></div>
                        <div class="dcell divider"></div>
                        <div class="dcell value">
                            <input type="submit"  name="do=threadtag" value="Tag This Thread" class="btn" tabindex="15" />
                        </div>
                    </div>
                </div>
            </form>
        </div><%-- end content --%>
      </div><%-- end contentwrapper --%>
    </div><%-- end main --%>

    <%include include_footer.html%>
  </div>
  <div id="dialog-form" title="Add a Subcategory" class="hide">
    <form name="post" action="<%GForum::SEO::url()%>" method="post" class="form">
      <input type="hidden" name="group_id">
      <div class="error hide"></div>
      <div class="success hide" style="margin-top: 20px">
        <div class="message" style="text-align: center;"></div>
        <input type="button" name="done" value="Done" class="btn" style="margin: 10px auto; display: block">
      </div>
      <div class="dtable form">
        <div class="drow parent">
          <div class="dcell name">Category</div>
          <div class="dcell value">
            <select name="father_id">
              <option value="">Select a Category</option>
              <%~loop groups_loop%>
              <option value="<%group_id%>"><%group_name%></option>
              <%~endloop%>
            </select>
          </div>
        </div>
        <div class="drow">
          <div class="dcell name">Name</div>
          <div class="dcell value">
            <input type="text" name="category" class="txt midtext" placeholder="Subcategory Name">
          </div>
        </div>
        <div class="drow delete hide">
          <div class="dcell name"></div>
          <div class="dcell value">
            <input type="checkbox" id="delete" name="delete" value="1"> <label for="delete">Delete Category/Subcategory</label>
          </div>
        </div>
        <div class="drow actions">
          <div class="dcell name"></div>
          <div class="dcell value">
            <input type="submit" name="do=json_threadtag_category" value="Submit" class="btn">
          </div>
        </div>
      </div>
    </form>
  </div>
</body>
<%~include include_global_js.html%>
<script type="text/javascript">
  var dialog, form;
  dialog = $("#dialog-form").dialog({
    autoOpen: false,
    height: 280,
    width: 600,
    modal: true,
    close: function() {
      form[ 0 ].reset();
    }
  });

  form = $('#dialog-form form').ajaxForm({
    dataType: 'json',
    beforeSubmit: function() {
      form.find('.error').hide();
      form.find('.success').hide();
      if (form.find('input[name=group_id]').val != '' && form.find('input[name=delete]').is(':checked')) {
        if (!confirm("This action will delete the category/subcategories.\nAre you sure you want to delete this category?")) {
          return false;
        }
      }
    },
    success: function(res) {
      if (res.success == 0) {
        $('#dialog-form form .error').html(res.error).show();
        $('#dialog-form form input[name=category]').focus();
      }
      else {
        $('#dialog-form form .dtable').hide();
        $('#dialog-form form .message').html(res.message).parent().show();
      }
    }
  });
  
  $(document).ready(function() {
    $('input[name=done]').click(function() {
      form[ 0 ].reset();
      form.find('.success').hide();
      form.find('.dtable').hide();
      form.find('.error').hide();
      form.find('.delete').hide();
      dialog.dialog('close');
      window.location = window.location;
      return false;
    });

    /* add cat/subcat */
    $('a.addcat').click(function() {
      var catid = $(this).attr('rel');
      form.find('.error').hide();
      form.find('.delete').hide();
      $(form).find('input[name=group_id]').val('');

      if (catid == 'category') {
        dialog.dialog('option', 'title', 'Add a Category');
        form.find('.parent').hide();
        form.find('select[name=father_id]').val('');
        form.find('input[name=category]').attr('placeholder', 'Category Name');
      }
      else {
        dialog.dialog('option', 'title', 'Add a Subcategory');
        form.find('.parent').show();
        form.find('input[name=category]').attr('placeholder', 'Subcategory Name');
        form.find('select[name=father_id]').val(catid);
      }
      dialog.dialog("open");
      return false;
    });

    /* edit cat/subcat */
    $('a.editcat').click(function() {
      form.find('.error').hide();
      form.find('.delete').show();
      form.find('.parent').show();
      form.find('input[name=delete]').attr('checked', false);


      var catid = $(this).attr('rel');
      var is_subcat = $(this).siblings('span').length == 1 ? false : true;
      var name      = is_subcat ? $(this).siblings('label').html() : $(this).siblings('span').text();
      var father_id = is_subcat ? $(this).attr('href') : '';

      dialog.dialog('option', 'title', 'Modify ' + (is_subcat ? 'Subcategory' : 'Category'));
      
      form.find('input[name=category]').val(name);
      form.find('input[name=group_id]').val(catid);
      form.find('select[name=father_id]').val(father_id);
      if (!is_subcat) { form.find('.parent').hide();  }

      dialog.dialog("open");
      return false;
    });
  })
</script>
</html>

