From c1c4c03d394e8701cfd4640d8571afacc83d2ba2 Mon Sep 17 00:00:00 2001
From: Paul Duncan <pabs@pablotron.org>
Date: Tue, 24 May 2016 13:30:11 -0400
Subject: enable post list

---
 data/assets/js/admin/tabs/posts.js | 78 ++++++++++++++++++++++++++++++++++++++
 data/assets/js/search-field.js     |  4 +-
 src/guff.cr                        |  1 +
 src/views/admin-page.ecr           | 53 ++++++++++++++++++++++----
 4 files changed, 126 insertions(+), 10 deletions(-)

diff --git a/data/assets/js/admin/tabs/posts.js b/data/assets/js/admin/tabs/posts.js
index 03f3483..83db403 100644
--- a/data/assets/js/admin/tabs/posts.js
+++ b/data/assets/js/admin/tabs/posts.js
@@ -2,6 +2,62 @@ jQuery(function($) {
   "use strict";
 
   var TEMPLATES = new LuigiTemplate.Cache({
+    post: [
+      "<a ",
+        "href='#' ",
+        "class='list-group-item' ",
+        "data-post_id='%{post_id|h}' ",
+        "data-post_type='%{post_type|h}' ",
+        "title='Edit %{post_type} %{post_id|h}.' ",
+      ">",
+        "%{name|h}",
+        " ",
+        "(slug = %{slug|h}, state = %{state|h}, type = %{post_type|h})",
+      "</a>",
+    ],
+
+    error: [
+      "<span class='list-group-item list-group-item-danger disabled'>",
+        "<i class='fa fa-exclamation-triangle'></i>",
+        " ",
+        "Error: %{error|h}",
+      "</span>",
+    ],
+  });
+
+  function reload() {
+    $('#posts-reload').addClass('disabled')
+      .find('.loading').toggleClass('hidden');
+
+    send('post/get_posts', {
+      q: $('#posts-q').data('q'),
+      page: 1,
+    }).always(function() {
+      $('#posts-reload').removeClass('disabled')
+        .find('.loading').toggleClass('hidden');
+    }).fail(function(r) {
+      var error = r.responseText;
+
+      try {
+        var data = $.parseJSON(r.responseText);
+        if (data.error)
+          error = data.error;
+      } catch (e) {}
+
+      $('#posts').html(TEMPLATES.run('error', {
+        error: error,
+      }));
+    }).done(function(r) {
+      console.log(r);
+
+      $('#posts').html($.map(r.rows, function(row) {
+        return TEMPLATES.run('post', row);
+      }).join(''));
+    });
+  }
+
+  $('#admin-tab-posts').on('show.bs.tab', function() {
+    $('#posts-reload').click();
   });
 
   $('.add-post').click(function() {
@@ -30,4 +86,26 @@ jQuery(function($) {
     // stop event
     return false;
   });
+
+  $('#posts-reload').click(function() {
+    reload();
+
+    // stop event
+    return false;
+  });
+
+  $('#posts-q').on('search-update', function() {
+    reload();
+  });
+
+  $('#posts').on('click', 'a', function() {
+    var data = $(this).data();
+
+    $('#' + data.post_type + '-edit-dialog')
+      .data('post_id', data.post_id)
+      .modal('show');
+
+    // stop event
+    return false;
+  });
 });
diff --git a/data/assets/js/search-field.js b/data/assets/js/search-field.js
index 76ff69f..3d6c494 100644
--- a/data/assets/js/search-field.js
+++ b/data/assets/js/search-field.js
@@ -61,10 +61,10 @@ jQuery(function($) {
     if (trigger == 'delay') {
       clear_delay(me);
 
-      setTimeout(function() {
+      me.data('search-interval', setTimeout(function() {
         clear_delay(me);
         trigger_search(me, me.val());
-      }, me.data('search-delay') || 100);
+      }, me.data('search-delay') || 300));
     } else if (trigger == 'enter') {
       if (ev.which == 13) {
         setTimeout(function() {
diff --git a/src/guff.cr b/src/guff.cr
index 6367671..04708ed 100644
--- a/src/guff.cr
+++ b/src/guff.cr
@@ -291,6 +291,7 @@ module Guff
                  a.posted_at,
                  a.expires_at,
                  a.slug,
+                 a.slug_lock,
                  a.name,
 
                  (CASE WHEN c.post_id IS NOT NULL THEN
diff --git a/src/views/admin-page.ecr b/src/views/admin-page.ecr
index ab882ce..39b4de3 100644
--- a/src/views/admin-page.ecr
+++ b/src/views/admin-page.ecr
@@ -83,13 +83,52 @@
                   <div class='btn-group btn-group-sm'><%=
                     new_post_button
                   %></div><!-- btn-group -->
+
+                  <div class='btn-group btn-group-sm pull-right'>
+                    <a
+                      href='#'
+                      class='btn btn-default search-toggle'
+                      title='Toggle search field.'
+                    >
+                      <i class='fa fa-search'></i>
+                    </a><!-- btn-->
+                  </div><!-- btn-group -->
+
+                  <div class='btn-group btn-group-sm pull-right'>
+                    <a
+                      href='#'
+                      id='posts-reload'
+                      class='btn btn-default'
+                      title='Reload posts'
+                    >
+                      <span class='loading'>
+                        <i class='fa fa-refresh'></i>
+                      </span>
+
+                      <span class='loading hidden'>
+                        <i class='fa fa-spinner fa-spin'></i>
+                      </span>
+                    </a><!-- btn -->
+                  </div><!-- btn-group -->
                 </div><!-- btn-toolbar -->
               </div><!-- panel-heading -->
 
-              <div class='panel-body'>
-                <p>
-                  TODO: posts
-                </p>
+              <div class='panel-heading hidden search-toggle'>
+                <div class='input-group input-group-sm'>
+                  <span class='input-group-addon'>
+                    <i class='fa fa-search'></i>
+                  </span>
+
+                  <input
+                    type='text'
+                    id='posts-q'
+                    class='form-control'
+                    title='Enter search terms'
+                  />
+                </div><!-- input-group -->
+              </div><!-- panel-heading -->
+
+              <div id='posts' class='list-group'>
               </div><!-- panel-body -->
             </div><!-- panel -->
           </div><!-- tab-pane -->
@@ -103,10 +142,8 @@
               <div class='panel-heading'>
               </div><!-- panel-heading -->
 
-              <div class='panel-body'>
-                <p>
-                  TODO: files
-                </p>
+              <div id='files' class='list-group'>
+                TODO: files
               </div><!-- panel-body -->
             </div><!-- panel -->
           </div><!-- tab-pane -->
-- 
cgit v1.2.3