{% extends 'base.html' %}

{% block title %}log parser{% endblock %}

{% block head %}
  <style>
    form {margin: 16px 0;}
    #demo {
      padding-left:12px;
      padding-top: 8px;
      /* opacity: 0; */
      /* cursor: default; */
    }
    .upload input {
      width: 1px;
      position: absolute;
      opacity: 0.01;
    }
  </style>
{% endblock %}


{% block body %}
<h2>Upload a scrapy logfile to parse.</h2>
<div class="wrap">
  <form method="post" enctype="multipart/form-data">
    <div class="upload">
      <label class="button warning">
        <input id="file" type="file" name="file" accept=".log, .txt" />
        Select
      </label>

      <span class="filename">a log or txt file</span>

      <a href="javascript:;" class="submit" onclick="uploadLogfile();">
        <i class="iconfont icon-upload"></i>
      </a>
      <a id="demo" class="link" href="{{ url_parse_demo }}">demo</a>
    </div>
  </form>
<div>


<script>
my$('#file').onchange = function () {
  //my$('.filename').innerText = this.value;
  my$('.filename').innerText = "a log or txt file";

  var logfile = my$('#file').files[0];
  if (logfile === undefined) {
    return;
  } else {
    my$('.filename').innerText = logfile.name;
  }
};
</script>
{% endblock %}
