Blame view

node_modules/serve-index/public/directory.html 2.2 KB
aaac7fed   liuqimichale   add
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
  <!DOCTYPE html>
  <html>
    <head>
      <meta charset='utf-8'> 
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
      <title>listing directory {directory}</title>
      <style>{style}</style>
      <script>
        function $(id){
          var el = 'string' == typeof id
            ? document.getElementById(id)
            : id;
  
          el.on = function(event, fn){
            if ('content loaded' == event) {
              event = window.attachEvent ? "load" : "DOMContentLoaded";
            }
            el.addEventListener
              ? el.addEventListener(event, fn, false)
              : el.attachEvent("on" + event, fn);
          };
  
          el.all = function(selector){
            return $(el.querySelectorAll(selector));
          };
  
          el.each = function(fn){
            for (var i = 0, len = el.length; i < len; ++i) {
              fn($(el[i]), i);
            }
          };
  
          el.getClasses = function(){
            return this.getAttribute('class').split(/\s+/);
          };
  
          el.addClass = function(name){
            var classes = this.getAttribute('class');
            el.setAttribute('class', classes
              ? classes + ' ' + name
              : name);
          };
  
          el.removeClass = function(name){
            var classes = this.getClasses().filter(function(curr){
              return curr != name;
            });
            this.setAttribute('class', classes.join(' '));
          };
  
          return el;
        }
  
        function search() {
          var str = $('search').value.toLowerCase();
          var links = $('files').all('a');
  
          links.each(function(link){
            var text = link.textContent.toLowerCase();
  
            if ('..' == text) return;
            if (str.length && ~text.indexOf(str)) {
              link.addClass('highlight');
            } else {
              link.removeClass('highlight');
            }
          });
        }
  
        $(window).on('content loaded', function(){
          $('search').on('keyup', search);
        });
      </script>
    </head>
    <body class="directory">
      <input id="search" type="text" placeholder="Search" autocomplete="off" />
      <div id="wrapper">
        <h1><a href="/">~</a>{linked-path}</h1>
        {files}
      </div>
    </body>
  </html>