{% extends "base.html" %}

{% block title %}Main{% endblock %}

{% block content %}

    <!-- Breadcrumbs -->
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{% url 'main_page' %}">Home</a></li>
            <li class="breadcrumb-item active" aria-current="page">{{ project }}</li>
        </ol>
    </nav>

    <div class="container-fluid">
        <!-- Add samples -->
        <div class="row">
            <div class="col">

                <ul class="nav nav-tabs" id="indexTab" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link active" id="nav-upload-simple-tab" data-toggle="tab" href="#nav-upload-simple" role="tab" aria-controls="nav-upload-simple" aria-selected="true">
                            Upload new Sample File
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="nav-upload-archive-tab" data-toggle="tab" href="#nav-upload-archive" role="tab" aria-controls="nav-upload-archive" aria-selected="false">
                            Upload Sample(s) Archive
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="nav-download-url-tab" data-toggle="tab" href="#nav-download-url" role="tab" aria-controls="nav-download-url" aria-selected="false">
                            Download Sample from URL
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link disabled" id="nav-download-vt-tab" data-toggle="tab" href="#nav-download-vt" role="tab" aria-controls="nav-download-vt" aria-selected="false">
                            Download Sample from Virustotal (disabled)
                        </a>
                    </li>
                </ul>

                <div class="tab-content" id="indexTabContent">

                    <!-- Upload (simple) -->
                    <div class="tab-pane show active" id="nav-upload-simple" role="tabpanel" aria-labelledby="nav-upload-simple-tab">
                        <form id="upload_form" role="form" enctype="multipart/form-data">
                            <div class="form-row align-items-center">
                                <div class="col-4">
                                    <input type="file" class="filestyle" data-buttonBefore="true" name="file" multiple>
                                </div>
                                <div class="col-4">
                                    <input id="tag_list_upload_simple" name="tag_list" type="text" class="form-control" placeholder="Tags for Sample (comma separated)">
                                </div>

                                <div class="col-2"></div>
                                <div class="col-2">
                                    <button type="submit" class="btn btn-primary">Upload</button>
                                </div>
                            </div>
                        </form>
                    </div>

                    <!-- Upload Archive -->
                    <div class="tab-pane" id="nav-upload-archive" role="tabpanel" aria-labelledby="nav-upload-archive-tab">

                        <form id="upload_form_archive" role="form" enctype="multipart/form-data">
                            <div class="form-row align-items-center">
                                <div class="col-4">
                                    <input type="file" class="filestyle" data-buttonBefore="true" name="file" multiple>
                                </div>

                                <div class="col-4">
                                    <input id="tag_list_upload" name="tag_list" type="text" class="form-control" placeholder="Tags for Sample (comma separated)">
                                </div>

                                <div class="col-2"></div>

                                <div class="col-2">
                                    <button type="submit" class="btn btn-primary">Upload</button>
                                </div>

                            </div>

                            <br>
                            <h6>Additional settings for Archive (.zip, .rar, .7z ...)</h6>
                            <div class="form-row align-items-center">

                                <div class="col-4">
                                    <label for="archive_pass" hidden></label>
                                    <input id="archive_pass" name="archive_pass" type="password" class="form-control" placeholder="Archive Password">
                                </div>

                                <div class="col-4">
                                    <label for="extractor" hidden></label>
                                    <select id="extractor" name="extractor" class="form-control">
                                        <option value="auto">[*] Auto Detect file extension</option>
                                        <option value="none">[~] No Extractor</option>
                                        <option disabled>&nbsp;</option>
                                        {% for key, row in extractors.items %}
                                            <option value="{{ row.cls_name }}">
                                                {{ row.title }}: {% for item in row.supports_extensions %}{{ item }}{% if forloop.last %}{% else %}, {% endif %}{% endfor %} {% if row.supports_password %}(*PW*){% endif %}
                                            </option>
                                        {% endfor %}
                                    </select>
                                </div>

                                <div class="col-2">
                                    <div class="form-check">
                                        <input class="form-check-input" type="radio" name="store_archive_radio" id="store_archive" value="true" checked>
                                        <label class="form-check-label" for="store_archive">
                                            <b>Store</b> archive
                                        </label>
                                    </div>
                                    <div class="form-check">
                                        <input class="form-check-input" type="radio" name="store_archive_radio" id="discard_archive" value="false">
                                        <label class="form-check-label" for="discard_archive">
                                            <b>Discard</b> archive
                                        </label>
                                    </div>
                                </div>

                                <div class="col-2"></div>
                            </div>
                        </form>

                    </div>

                    <!-- Download from URL -->
                    <div class="tab-pane" id="nav-download-url" role="tabpanel" aria-labelledby="nav-download-url-tab">

                        <form id="download_form" role="form" enctype="multipart/form-data" action="{% url "url-download" %}" method="post">
                            <div class="form-row align-items-center">
                                <div class="col-4">
                                    <input type="search" class="form-control" name="url" id="url" placeholder="URL - e.g. http://host.example.com/foo/bar/file.html">
                                </div>

                                <div class="col-4">
                                    <input id="tag_list_url_dl" name="tag_list" type="text" class="form-control" placeholder="Tags for Sample (comma separated)">
                                </div>

                                <div class="col-2">
                                    <div class="form-check mb-1">
                                        <input class="form-check-input" type="checkbox" id="TorCheckbox" name="tor" value="tor">
                                        <label class="form-check-label" for="TorCheckbox">Use Tor</label>
                                    </div>
                                </div>

                                <div class="col-2">
                                    <button type="submit" class="btn btn-primary">Download</button>
                                </div>

                                <input type="hidden" name="project" value="{{ project }}"/>

                                {% csrf_token %}
                            </div>
                        </form>
                    </div>

                    <!-- Download from VirusTotal TODO(frennkie) disabled on 2017-09-08 - requires private VT API key - so I can not test it -->
                    <div class="tab-pane fade" id="nav-download-vt" role="tabpanel" aria-labelledby="nav-download-vt-tab">

                        <form id="virustotal_form" role="form" enctype="multipart/form-data" action="{% url "vt-download" %}" method="post">
                            <div class="form-row align-items-center">
                                <div class="col-4">
                                    <label class="sr-only" for="hash">HASH</label>
                                    <input type="search" class="form-control" name="vt_hash" id="hash" placeholder="Virustotal Hash">
                                </div>

                                <div class="col-4">
                                    <label for="tag_list_vt_dl" hidden></label>
                                    <input id="tag_list_vt_dl" name="tag_list" type="text" class="form-control" placeholder="Tags for Sample (comma separated)">
                                </div>

                                <div class="col-2"></div>

                                <div class="col-2">
                                    <button type="submit" class="btn btn-primary">Download</button>
                                </div>

                                <input type="hidden" name="project" value="{{ project }}"/>

                                {% csrf_token %}
                            </div>
                        </form>

                    </div>

                </div>
            </div>
        </div>

        <br>
        <!-- Samples Table -->
        <div class="row">

            <div class="col">
                <div class="card">
                    <div class="card-header">
                        <h6 class="float-left">Samples in Project: <b>{{ project }}</b></h6>
                    </div>

                    <div class="card-body">
                    <table id="samples" class="table table-hover" cellspacing="0" width="100%">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>SHA256</th>
                                <th>Name</th>
                                <th>Mime Type</th>
                                <th>Size</th>
                                <th>Tags</th>
{#                                <th>Added</th>#}
                            </tr>
                        </thead>
                        <tbody>
                        {% for row in sample_list %}
                            <tr>
                                <td>{{ row.id }}</td>
                                <td class="mono small">{{ row.sha256 }}</td>
                                <td><a href="{% url "file-view" project=project sha256=row.sha256 %}">{{ row.name }}</a></td>
                                <td>{{ row.mime }}</td>
                                <td data-search="{{ row.size }}" data-order="{{ row.size }}">{{ row.size|filesizeformat }}</td>
                                <td>
                                    {% for tag in row.tag %}
                                        <div style="display: inline-block;">
                                            <form id="search_form_row_{{ row.id }}_tag_{{ tag.id }}" role="form" enctype="multipart/form-data" accept-charset="utf-8" method="post" action="{% url "search-file" %}">
                                                <input class="form-control" type="hidden" name="key" value="tag"/>
                                                <input class="form-control" type="hidden" name="term" value="{{ tag.tag }}"/>
                                                <input class="form-control" type="hidden" name="cur_project" value="{{ project }}"/>
                                                <a href="#">
                                            <span class="badge badge-dark" aria-hidden="true" onclick="search_form_row_{{ row.id }}_tag_{{ tag.id }}.submit()">
                                                {{ tag.tag }}</span></a>
                                                {% csrf_token %}
                                            </form>
                                        </div>
                                    {% endfor %}
                                </td>
{#                                <td data-search="{{ row.created_at }}" data-order="{{ row.created_at }}">{{ row.created_at|date:"r" }}</td>#}
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block js %}
    <script type='text/javascript'>
        {#    TODO(frennkie) debug output #}
        $(document).ready(function () {
            console.log("working on Project: {{ project }}");
        });

        var malware_upload_url = "{% url 'viperapi_v3:malware-upload' project_name=project %}";
        var malware_list_url = "{% url 'file-list' project=project %}";

        $("#upload_form").submit(function (event) {
            console.log("upload_form called");
            event.preventDefault();
            var formData = new FormData($(this)[0]);
            $.ajax({
                url: malware_upload_url,
                type: 'POST',
                data: formData,
                contentType: false,
                processData: false,

                success: function (data, textStatus, jqXHR) {
                    console.log("Submit successful");
                    console.log("API Endpoint: " + jqXHR.getResponseHeader('Location'));

                    // TODO(frennkie) this simply redirects to first..?!
                    window.location.replace(malware_list_url + data[0].data.sha256 + "/");
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    console.log("Submit failed");

                    console.log("jqXHR:" + jqXHR);
                    console.log("textStatus:" + textStatus);
                    console.log("errorThrown:" + errorThrown);

                    var obj = jQuery.parseJSON(jqXHR["responseText"]);
                    var error = obj.error;
                    console.log(error);
                    console.log(error.message);
                    alert("Upload failed: " + error.message);
                }
            });
            return false;
        });

        $("#upload_form_archive").submit(function (event) {
            console.log("upload_form_archive called");
            event.preventDefault();
            var formData = new FormData($(this)[0]);
            $.ajax({
                url: malware_upload_url,
                type: 'POST',
                data: formData,
                contentType: false,
                processData: false,

                success: function (data, textStatus, jqXHR) {
                    console.log("Submit successful");
                    console.log(data);

                    // TODO(frennkie) this simply redirects to first..?!
                    window.location.replace(malware_list_url + data[0].data.sha256 + "/");
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    console.log("Submit failed");
                    var obj = jQuery.parseJSON(jqXHR["responseText"]);
                    var error = obj.error;
                    console.log(error);
                    console.log(error.message);
                    alert("Upload failed: " + error.message);
                }
            });
            return false;
        });
    </script>

    {% load static from staticfiles %}
    <script type="text/javascript" src="{% static 'viperweb/js/jquery.dataTables.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'viperweb/js/dataTables.bootstrap4.min.js' %}"></script>
    <script>
        $(document).ready(function () {
            $('#samples').DataTable({
                "pagingType": "full_numbers",
                "order": [[ 0, "desc" ]]
                } );
        });
    </script>

{% endblock %}


