<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <script class="javascript">
    var submit = true;
    {% if absolute %}
      var cwd = "{{oldfile|default(cwd, True)|path_make_absolute|quotepath|replace('\\', '\\\\')}}";
      var isabsolute = true;
    {% else %}
      var cwd = "{{oldfile|default(cwd, True)|path_make_relative|quotepath|replace('\\', '\\\\')}}";
      var isabsolute = false;
    {% endif %}

    {% if type == 'folder' %} {# browsing for folder #}
      var abspath = "{{'/pathchooser/'|url + cwd|path_make_absolute|quotepath|replace('\\', '\\\\')}}";
      var relpath = "{{'/pathchooser/'|url + cwd|path_make_relative|quotepath|replace('\\', '\\\\')}}";
    {% else %} {# browsing for file #}
      var abspath = "{{'/filechooser/'|url + oldfile|default(cwd, True)|path_make_absolute|quotepath|replace('\\', '\\\\')}}";
      var relpath = "{{'/filechooser/'|url + oldfile|default(cwd, True)|path_make_relative|quotepath|replace('\\', '\\\\')}}";
    {% endif %}
    document.addEventListener("readystatechange", function(event) {
      if (this.readyState === "complete") {
        document.getElementById("tbody").style.height = (window.innerHeight - 25) + "px";
        window.onresize = function (event) {
          document.getElementById("tbody").style.height = (window.innerHeight - 25) + "px";
        };
        var clickables = document.getElementsByClassName("tr-clickable");
        for (var i = 0; i < clickables.length; i++) {
          clickables[i].onclick = (function () {
            var onclick = clickables[i].onclick;
            return function (e) {
              if (onclick != null && !onclick()) {
                  return false
              }
              if (this.dataset.href !== undefined && this.dataset.href !== "#") {
                  window.location.href = this.dataset.href;
                  return false
              } else {
                  return true;
              }
            }
          })();
        }
      }
    });
    function updateParent()
    {
        if (window.top.SettingsUI != undefined) {
            window.top.SettingsUI.prototype.pathchooserChanged(this);
        }
    }
    function setInvalid() {
        submit = false;
        cwd = "";
        updateParent();
    }
    function setValid() {
        submit = true;
        updateParent();
    }
    function setFile(fullpath, name)
    {
        cwd = fullpath;
        {% if type == "file" %} {# browsing for file #}
          abspath = "{{'/filechooser/'|url + cwd|path_make_absolute|quotepath|replace('\\', '\\\\')}}" + name;
          relpath = "{{'/filechooser/'|url + cwd|path_make_relative|quotepath|replace('\\', '\\\\')}}" + name;
        {% endif %}
        setValid();
    }
  </script>
  <link rel="stylesheet" type="text/css" href="{{'/media/modern/css/pathchooser.css'|url}}"/>
</head>
<body {% if type == 'file' %}{% if oldfile %}onload="updateParent();"{% else %}onload="setInvalid();"{% endif %}{% else %}onload="updateParent();"{% endif %}>
 <table>
    <thead>
      <tr>
          <th>{{_('name')}}</th>
          <th>{{_('size')}}</th>
          <th>{{_('type')}}</th>
          <th>{{_('last modified')}}</th>
      </tr>
    </thead>
    <tbody id="tbody">
    {% if parentdir %}
        <tr class='tr-clickable' data-href="{% if type == 'folder' %}{{'/pathchooser/'|url + (parentdir|quotepath)}}{% else %}{{'/filechooser/' + parentdir|quotepath}}{% endif %}">
          <td title="{{_('Parent Directory')}}"><span class="parentdir">..</span></td>
          <td></td>
          <td colspan="2">&lt;DIR&gt;</td>
        </tr>
    {% endif %}
    {% for file in files %}
            {% if type == 'folder' %} {# browsing for folder #}
                  {% if file.type == 'dir' %}
                    <tr class="tr-clickable" data-href="{{'/pathchooser/'|url + file.fullpath|quotepath}}" title="{{file.name}}">
                      <td class="name path_directory text-ellipsis">{{file.name}}</td>
                  {% else %}
                    <tr class="tr-nonclickable" title="{{file.fullpath}}">
                      <td class="name path_file text-ellipsis">{{file.name}}</td>
                  {% endif %}
            {% else %} {# browsing for file #}
                  {% if file.type == 'dir' %}
                   <tr class="tr-clickable" data-href="{{'/filechooser/'|url + file.fullpath|quotepath}}" title="{{file.fullpath}}">
                    <td class="name file_directory text-ellipsis">{{file.name}}</td>
                  {% else %}
                   <tr class="tr-clickable" title="{{file.fullpath}}" onclick="setFile('{{file.fullpath|replace("\\", "\\\\")}}', '{{file.name}}');">
                    <td class="name file_file text-ellipsis">{{file.name}}</td>
                  {% endif %}
            {% endif %}

            <td class="size">{% if file.type == 'file' %}
              {% if file.unit == 'Byte' %}1 KB{% else %}{{(file.size|round(precision=0, method='common'))|int}} {{file.unit|replace('Byte', 'B')}}{% endif %}
              {% endif %}</td>
            <td class="type">{% if file.type == 'dir' %}&lt;DIR&gt;{% else %}{{file.ext|default('file', True)}}{% endif %}</td>
            <td class="mtime">{{file.modified|date('d.m.Y - H:i:s')}}</td>
        </tr>
    {% endfor %}
    </tbody>
  </table>
  </body>
</html>
