<div class="modal-header">
    <div class="col md-12">
        <div class="row">
            <div class="col align-self-center">
                <h4 class="modal-title mr-4">{% if ioc.ioc_id %}Edit IOC #{{ ioc.ioc_id }}{% else %} Add IOC {% endif %}</h4>
                <small><i class="text-muted">{% if ioc.ioc_uuid %}#{{ ioc.ioc_uuid }}{% endif %}</i></small>
            </div>
            {% include 'modals/modal_attributes_nav.html' %}
            <div class="col">
                <div class="row float-right">
                    {% if ioc.ioc_id %}
                     <div class="dropdown">
                          <button class="btn bg-transparent pull-right" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                              <span aria-hidden="true"><i class="fas fa-ellipsis-v"></i></span>
                          </button>
                          <div class="dropdown-menu pull-right" id="ioc_modal_quick_actions" aria-labelledby="dropdownMenuButton">
                              <a class="dropdown-item" href="#" onclick='copy_object_link({{ioc.ioc_id}});return false;'><i class="fa fa-share mr-2"></i>Share</a>
                              <a class="dropdown-item" href="#" onclick='copy_object_link_md("ioc", {{ioc.ioc_id}});return false;'><i class="fa-brands fa-markdown mr-2"></i>Markdown Link</a>
                          </div>
                         <div class="dropdown-menu pull-right" aria-labelledby="dropdownMenuButton">
                          </div>
                     </div>
                     <button type="button" class="btn bg-transparent btn-xs" onclick="comment_element({{ ioc.ioc_id }}, 'ioc')" title="Comments">
                        <span class="btn-label">
                            <i class="fa-solid fa-comments"></i><span class="notification" id="object_comments_number">{{ comments_map|length if comments_map|length > 0 else '' }}</span>
                        </span>
                     </button>
                    {% endif %}
                     <button class="float-right btn bg-transparent" title="Minimize" onclick="modal_minimized('modal_add_ioc', '{% if ioc.ioc_id %}Edit IOC #{{ ioc.ioc_id }} {% else %} Add IOC {% endif %}');"> <i class='fa fa-minus'></i> </button>
                    <button type="button" class="float-right btn bg-transparent" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true"><i class="fa fa-times"></i></span></button>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal-body">
    <div role="tabpanel">
          <div class="tab-content">
                <div class="tab-pane active" id="details">
                <div class="container col-md-12">
                    <form method="post" action="" id="form_new_ioc">
                        <div class="col-md-12 col-lg-12 col-sm-12">
                            {{ form.hidden_tag() }}
                            <div class="form-group row">
                                <div class="col-6">
                                    <label for="ioc_type" class="mr-4">Type *
                                    </label>
                                    {{ form.ioc_type_id(class="selectpicker pl--6 col-10") }}
                                </div>
                                <div class="col-6">
                                    <label for="ioc_tlp" class="mr-4">TLP *
                                    </label>
                                    {{ form.ioc_tlp_id(class="selectpicker pl--6 col-10") }}
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="ioc_value" class="placeholder">{{ form.ioc_value.label.text }} *</label>
                                {{ form.ioc_value(class='form-control col-md-12 col-sm-12 sizable-textarea',  autocomplete="off") }}
                            </div>
                            {% if not ioc.ioc_id %}
                            <div class="form-group col-2">
                                <div class="form-check">
                                     <label class="form-check-label mt-3">
                                         <input class="form-check-input" type="checkbox" id="ioc_one_per_line" checked>
                                             <span class="form-check-sign"> One IOC per line 
                                                 <i class="ml-1 mt-1 fa-regular fa-circle-question" title="If checked, each new line will create a new IOC" style="cursor:pointer;"></i>
                                             </span>
                                     </label>
                                </div>
                             </div>
                             {% endif %}
                            <div class="form-group mt-3">
                                <label for="ioc_description" class="placeholder">Description</label>
                                    <div class="md_description_field">
                                        <div class="form-group mt--2">
                                            <button type="button" class="float-right icon-note btn btn-circle btn-sm mt-2" onclick="edit_in_ioc_desc();">
                                            </button>
                                            <button type="button" style="display: none;" class="btn btn-dark btn-sm float-right mr-2 mt-2"
                                                    onclick="preview_ioc_description();" id="ioc_preview_button"><i class="fa-solid fa-eye"></i></button>
                                    </div>
                                    <div class="row">
                                        <div class="col mb--2 ml--2" id="ioc_edition_btn" style="display:none;">
                                        </div>
                                    </div>
                                    <div class="row" style="margin-left:0px;">
                                        <div class="col-12" id="container_ioc_desc_content">
                                            <div id="ioc_description" contenteditable="true" spellcheck="true" class="mr-2" data-theme="{% if current_user.in_dark_mode %}dark{% else %}light{% endif %}">{% if ioc and ioc.ioc_description %}{{ ioc.ioc_description  }}{% endif %}</div>
                                            <textarea id="ioc_desc_content" rows="10" cols="82" style="display: none"></textarea>
                                        </div>
                                        <div class="col-12" id="container_ioc_description" style="display:none">
                                            <div id="target_ioc_desc"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="ioc_tags">IOC tags
                                </label>
                                <input type="text" id="ioc_tags"
                                    class="form-control col-md-12" {% if ioc.ioc_tags %} value="{{ ioc.ioc_tags }}" {% endif %}/>
                            </div>

                        <div class='invalid-feedback' id='ioc-invalid-msg'></div>
                        </div>
                    </form>
                </div>
            </div>
            {% include 'modals/modal_attributes_tabs.html' %}
          </div>
            {% if ioc.ioc_id %}
                <button type="button" class="btn btn-outline-danger mt-5"
                onclick="delete_ioc('{{ ioc.ioc_id }}');">Delete</button>
                <button type="button" class="btn btn-outline-success ml-4 mt-5 float-right" id="submit_new_ioc"
                onclick="update_ioc('{{ ioc.ioc_id }}');">Update</button>

            {% else %}

                <button type="button" class="btn btn-outline-success ml-4 mt-5 float-right"
                id="submit_new_ioc">Save</button>

            {% endif %}
    </div>
<script>
    $('form#form_new_ioc').validate();
    set_suggest_tags('ioc_tags')

    $('#ioc_type_id').selectpicker({
        liveSearch: true,
        title: "None",
        style: "btn-outline-white",
        size: 10
    });

    $('#ioc_tlp_id').selectpicker({
        liveSearch: true,
        title: "None",
        style: "btn-outline-white",
    });

    {% if ioc.ioc_id %}
        $('#ioc_type_id').selectpicker('val', '{{ioc.ioc_type_id}}');
        $('#ioc_tlp_id').selectpicker('val', '{{ioc.ioc_tlp_id}}');
    {% else %}
        $('#ioc_tlp_id').selectpicker('val', '2');
    {% endif %}
</script>