data-store.php

Basic data store utility -- unfinished
git clone git://git.finwo.net/lib/data-store.php
Log | Files | Refs

index.html (1756B)

      1 <!DOCTYPE html>
      2 <html>
      3     <head>
      4         <title>Data Store</title>
      5         <meta name="viewport" content="width=device-width, initial-scale=1" />
      6         <link rel="stylesheet" href="/css/base.css" />
      7         <link rel="stylesheet" href="/css/grid.css" />
      8         <link rel="stylesheet" href="/css/lists.css" />
      9     </head>
     10     <body>
     11         <nav class="shadow">
     12             <div class="container">
     13                 <a href="/">Data Store</a>
     14             </div>
     15         </nav>
     16         <div class="container">
     17             <div>
     18                 <div class="col-1-5 padded">
     19                     <ul class="shadow simple" data-source="/api/collections">
     20                         <li><a href="#{name}" onclick="activate(this);">{name}</a></li>
     21                     </ul>
     22                 </div>
     23                 <div class="col-4-5 padded" data-source="/api/collections">
     24                     <ul id="{name}" class="view shadow simple" data-source="/api/data/{name}">
     25                         <li class="padded">ITEM</li>
     26                     </ul>
     27                 </div>
     28             </div>
     29         </div>
     30         <script src="/js/require.js"></script>
     31         <script src="/js/data-source.js"></script>
     32 
     33         <script>
     34             function activate( el ) {
     35                 document.querySelectorAll('.active').forEach(function( entity ) {
     36                     entity.className = entity.className
     37                             .split(' ')
     38                             .filter(function(className) {return !!className.length;})
     39                             .filter(function(className) {return className != 'active'})
     40                             .join(' ');
     41                 });
     42                 el.className += ' active';
     43             }
     44         </script>
     45     </body>
     46 </html>