From 6ff8fd4e02cb962c9e2d1e90691324c67f58c4e8 Mon Sep 17 00:00:00 2001
From: Paul Duncan <pabs@pablotron.org>
Date: Sat, 2 Apr 2016 23:14:45 -0400
Subject: add test auth panel tabs

---
 src/guff/views/ecrs/test/auth.ecr | 265 +++++++++++++++++++++++---------------
 src/guff/views/html/test/auth.cr  |  28 +++-
 2 files changed, 190 insertions(+), 103 deletions(-)

(limited to 'src/guff/views')

diff --git a/src/guff/views/ecrs/test/auth.ecr b/src/guff/views/ecrs/test/auth.ecr
index bea7adb..e377962 100644
--- a/src/guff/views/ecrs/test/auth.ecr
+++ b/src/guff/views/ecrs/test/auth.ecr
@@ -16,110 +16,171 @@
 </div><!-- navbar -->
 
 <div class='container'>
-  <div class='col-md-8 col-md-offset-2'>
-    <div class='panel panel-default'>
-      <div class='panel-heading'>
-        <b>
-          <i class='fa fa-users'></i>
-          Users
-        </b>
-      </div><!-- panel-heading -->
-
-      <div class='panel-heading'>
-        <div class='btn-toolbar'>
-          <div class='btn-group btn-group-sm'>
-            <a
-              href='#'
-              class='btn btn-primary'
-              title='Create new user.'
-              data-toggle='modal'
-              data-target='#add-dialog'
-            >
-              <i class='fa fa-user-plus'></i>
-              Add User
-            </a><!-- btn -->
-          </div><!-- btn-group -->
-
-          <div class='btn-group btn-group-sm'>
-            <a
-              href='#'
-              class='btn btn-default'
-              title='Test login dialog.'
-              data-toggle='modal'
-              data-target='#login-dialog'
-            >
-              <i class='fa fa-lock'></i>
-              Test Login
-            </a><!-- btn -->
-          </div><!-- btn-group -->
-
-          <div class='hidden btn-group btn-group-sm'>
-            <a
-              href='#'
-              class='btn btn-default'
-              title='Filter users by role.'
-              data-toggle='dropdown'
-            >
-              Role: <span></span>
-              <i class='fa fa-caret-down'></i>
-            </a>
-
-            <ul id='filter-roles' class='dropdown-menu'>
-            </ul>
-          </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='reload'
-              class='btn btn-default'
-              title='Reload users.'
-            >
-              <span class='loading'>
-                <i class='fa fa-refresh'></i>
+  <div class='col-md-12'>
+    <ul class='nav nav-tabs nav-justified' role='tablist'><%=
+      get_tabs
+    %></ul><!-- nav-tabs -->
+
+    <div class='tab-content'>
+      <div id='tab-pane-home' class='tab-pane active' role='tabpanel'>
+        <div class='panel panel-default'>
+          <div class='panel-body'>
+            <p>
+              TODO: home
+            </p>
+          </div><!-- panel-body -->
+        </div><!-- panel -->
+      </div><!-- #tab-home -->
+
+      <div id='tab-pane-blog' class='tab-pane' role='tabpanel'>
+        <div class='panel panel-default'>
+          <div class='panel-body'>
+            <p>
+              TODO: blog
+            </p>
+          </div><!-- panel-body -->
+        </div><!-- panel -->
+      </div><!-- #tab-pane-blog -->
+
+      <div id='tab-pane-files' class='tab-pane' role='tabpanel'>
+        <div class='panel panel-default'>
+          <div class='panel-body'>
+            <p>
+              TODO: files
+            </p>
+          </div><!-- panel-body -->
+        </div><!-- panel -->
+      </div><!-- #tab-pane-files -->
+
+      <div id='tab-pane-pages' class='tab-pane' role='tabpanel'>
+        <div class='panel panel-default'>
+          <div class='panel-body'>
+            <p>
+              TODO: pages
+            </p>
+          </div><!-- panel-body -->
+        </div><!-- panel -->
+      </div><!-- #tab-pane-pages -->
+
+      <div id='tab-pane-projects' class='tab-pane' role='tabpanel'>
+        <div class='panel panel-default'>
+          <div class='panel-body'>
+            <p>
+              TODO: projects
+            </p>
+          </div><!-- panel-body -->
+        </div><!-- panel -->
+      </div><!-- #tab-pane-projects -->
+
+      <div id='tab-pane-users' class='tab-pane' role='tabpanel'>
+        <div class='panel panel-default'>
+          <div class='panel-heading'>
+            <div class='btn-toolbar'>
+              <div class='btn-group btn-group-sm'>
+                <a
+                  href='#'
+                  class='btn btn-primary'
+                  title='Create new user.'
+                  data-toggle='modal'
+                  data-target='#add-dialog'
+                >
+                  <i class='fa fa-user-plus'></i>
+                  Add User
+                </a><!-- btn -->
+              </div><!-- btn-group -->
+
+              <div class='btn-group btn-group-sm'>
+                <a
+                  href='#'
+                  class='btn btn-default'
+                  title='Test login dialog.'
+                  data-toggle='modal'
+                  data-target='#login-dialog'
+                >
+                  <i class='fa fa-lock'></i>
+                  Test Login
+                </a><!-- btn -->
+              </div><!-- btn-group -->
+
+              <div class='hidden btn-group btn-group-sm'>
+                <a
+                  href='#'
+                  class='btn btn-default'
+                  title='Filter users by role.'
+                  data-toggle='dropdown'
+                >
+                  Role: <span></span>
+                  <i class='fa fa-caret-down'></i>
+                </a>
+
+                <ul id='filter-roles' class='dropdown-menu'>
+                </ul>
+              </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='reload'
+                  class='btn btn-default'
+                  title='Reload users.'
+                >
+                  <span class='loading'>
+                    <i class='fa fa-refresh'></i>
+                  </span>
+
+                  <span class='loading hidden'>
+                    <i class='fa fa-spinner fa-spin'></i>
+                  </span>
+                </a><!-- #reload -->
+              </div><!-- btn-group -->
+            </div><!-- btn-toolbar -->
+          </div><!-- panel-heading -->
+
+          <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>
 
-              <span class='loading hidden'>
-                <i class='fa fa-spinner fa-spin'></i>
-              </span>
-            </a><!-- #reload -->
-          </div><!-- btn-group -->
-        </div><!-- btn-toolbar -->
-      </div><!-- panel-heading -->
-
-      <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='filter-q'
-            class='form-control'
-            title='Enter search terms'
-          />
-        </div><!-- input-group -->
-      </div><!-- panel-heading -->
-
-      <div id='users' class='list-group'>
-        <span class='list-group-item disabled'>
-          <i class='fa fa-spinner fa-spin'></i>
-          Loading...
-        </span><!-- list-group-item -->
-      </div><!-- list-group -->
-    </div><!-- panel -->
-  </div><!-- col-md-8 -->
+              <input
+                type='text'
+                id='filter-q'
+                class='form-control'
+                title='Enter search terms'
+              />
+            </div><!-- input-group -->
+          </div><!-- panel-heading -->
+
+          <div id='users' class='list-group'>
+            <span class='list-group-item disabled'>
+              <i class='fa fa-spinner fa-spin'></i>
+              Loading...
+            </span><!-- list-group-item -->
+          </div><!-- list-group -->
+        </div><!-- panel -->
+      </div><!-- #tab-pane-users -->
+
+      <div id='tab-pane-settings' class='tab-pane' role='tabpanel'>
+        <div class='panel panel-default'>
+          <div class='panel-body'>
+            <p>
+              TODO: settings
+            </p>
+          </div><!-- panel-body -->
+        </div><!-- panel -->
+      </div><!-- #tab-pane-settings -->
+    </div><!-- tab-content -->
+  </div><!-- col-md-10 -->
 </div><!-- container -->
 
 <div id='add-dialog' class='modal fade' role='dialog'>
diff --git a/src/guff/views/html/test/auth.cr b/src/guff/views/html/test/auth.cr
index 528b652..e30a4a2 100644
--- a/src/guff/views/html/test/auth.cr
+++ b/src/guff/views/html/test/auth.cr
@@ -18,7 +18,23 @@ class Guff::TestAuthHTMLView
       >
         %{name}
       </option>
-    "
+    ",
+
+    tab: "
+      <li role='presentation' class='%{css}'>
+        <a
+          id='tab-%{id}'
+          href='#tab-pane-%{id}'
+          title='%{text}'
+          aria-controls='tab-pane-%{id}'
+          role='tab'
+          data-toggle='tab'
+        >
+          <i class='fa %{icon}'></i>
+          %{name}
+        </a>
+      </li>
+    ",
   })
 
   def self.run(models, context : HTTP::Server::Context)
@@ -52,5 +68,15 @@ class Guff::TestAuthHTMLView
     }.join
   end
 
+  def get_tabs
+    @models.tab.get_tabs.map { |row|
+      TEMPLATES[:tab].run(row.merge({
+        "css":  row["css"]? || "",
+        "name": h(row["name"]),
+        "text": h(row["text"]),
+      }))
+    }.join
+  end
+
   ECR.def_to_s("./src/guff/views/ecrs/test/auth.ecr")
 end
-- 
cgit v1.2.3