{% extends 'dashboard/base.html' %}
    {% load staticfiles %}

    {% block title %}
        {% if add_blog %}
            Add
        {% else %}
            Edit
        {% endif %} Blog
    {% endblock %}

    {% block extra_css %}
    {% endblock %}
    {% block content %}

    <div class="row" id="head_style">
        <h3 id="page_title"></h3>
    </div>
    <div class="row">
        <form action="" method="post" enctype="multipart/form-data" id="post-form" role="form">
            {% csrf_token %}

            {% for field in form %}

                    <div class="form-group">
                        <label>{{ field.label }} :</label>
                        <div class="controls">{{ field }}
                            {% if field.help_text %}
                                <p class="help-inline"><small>{{ field.help_text }}</small></p>
                            {% endif %}
                        </div>
                    </div>

            {% endfor %}

            <div class="form-group">

                    <button class="btn btn-primary" type="submit">Submit</button>

            </div>
        </form>
    </div>
    <!-- end of add form div -->

    {% endblock %}

    {% block js_script %}
        <script type="text/javascript">

          $(document).ready(function(){

            // for form submission
            CKEDITOR.replace('content',{
              filebrowserUploadUrl: '{% url "blog:upload_photos" %}',
              filebrowserBrowseUrl: '{% url "blog:recent_photos" %}'
            });

                $('#post-form').submit(function(event){
                    event.preventDefault();

                    $('#id_content').val(CKEDITOR.instances.id_content.getData());
                    $.post("",$('#post-form').serialize(), function(data){
                        if(data.error)
                        {
                            $('p.error_required').remove();
                            for (var key in data.response){
                                $('#id_'+key).after("<p class='error_required'> * "+data.response[key]+"</p>");
                            }
                        } else{
                            window.location='/dashboard/blog/';
                            }
                    }, "json");
                });
            //  script for form submission ends here


            // for page title

                if(window.location.pathname=='/dashboard/add/'){
                    $('#page_title').text('Add Blog');
                }
                else{
                    var blog = '{{ blog_name.title }}';
                    $('#page_title').text('Edit Blog: '+ blog);
                }

            //script for page title ends here

            // for tags

                function onAddTag(tag) {
                    alert("Added a tag: " + tag);
                }
                function onRemoveTag(tag) {
                    alert("Removed a tag: " + tag);
                }

                function onChangeTag(input,tag) {
                    alert("Changed a tag: " + tag);
                }

                $(function() {
                    $('.myTags').tagsInput({width:'auto'});
                });

            // script for tags ends here


          });
        </script>
    {% endblock %}
