node_modules/connect/lib/public/directory.html

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