From 055c410126d3ec56aac34dabf1cee5a57459afaf Mon Sep 17 00:00:00 2001
From: Chad Kieffer <ckieffer@gmail.com>
Date: Tue, 20 Oct 2009 23:20:38 -0600
Subject: Fix block management UI. Block list height is now dynamically set
 based on the total number of available blocks which will grow without
 hardcoding CSS heights and setting the div to be scrollable.

---
 modules/gallery/views/admin_sidebar.html.php | 41 ++++++++++++++++------------
 themes/admin_wind/css/screen.css             | 25 ++++++++++++-----
 2 files changed, 41 insertions(+), 25 deletions(-)

diff --git a/modules/gallery/views/admin_sidebar.html.php b/modules/gallery/views/admin_sidebar.html.php
index 030dfdce..834429c3 100644
--- a/modules/gallery/views/admin_sidebar.html.php
+++ b/modules/gallery/views/admin_sidebar.html.php
@@ -1,11 +1,13 @@
 <?php defined("SYSPATH") or die("No direct script access.") ?>
 <script type="text/javascript">
   $(document).ready(function(){
-    $(".g-blocks-list").equal_heights();
+    $(".g-admin-blocks-list").equal_heights();
+    var extra_ht = $(".g-admin-blocks-list li").length * $(".g-admin-blocks-list li:first").height();
+    $(".g-admin-blocks-list").height($(".g-admin-blocks-list").height() + extra_ht);
   });
 
   $(function() {
-    $(".g-blocks-list ul").sortable({
+    $(".g-admin-blocks-list ul").sortable({
       connectWith: ".g-sortable-blocks",
       opacity: .7,
       placeholder: "g-target",
@@ -15,7 +17,7 @@
           $("ul#g-active-blocks li").each(function(i) {
             active_blocks += "&block["+i+"]="+$(this).attr("ref");
           });
-          $.getJSON($("#g-admin-blocks").attr("ref").replace("__ACTIVE__", active_blocks), function(data) {
+          $.getJSON($("#g-site-blocks").attr("ref").replace("__ACTIVE__", active_blocks), function(data) {
             if (data.result == "success") {
               $("ul#g-available-blocks").html(data.available);
               $("ul#g-active-blocks").html(data.active);
@@ -26,27 +28,30 @@
     }).disableSelection();
   });
 </script>
-<div class="g-block">
+
+<div class="g-block ui-helper-clearfix">
   <h1> <?= t("Manage Sidebar") ?> </h1>
   <p>
     <?= t("Select and drag blocks from the available column to the active column to add to the sidebar; remove by dragging the other way.") ?>
   </p>
 
-  <div id="g-admin-blocks" class="g-block-content ui-helper-clearfix" ref="<?= url::site("admin/sidebar/update?csrf={$csrf}__ACTIVE__") ?>">
-    <div class="g-block g-left">
-      <h3><?= t("Available Blocks") ?></h3>
-      <div class="g-blocks-list g-block-content">
-        <ul id="g-available-blocks" class="g-sortable-blocks">
-        <?= $available ?>
-        </ul>
+  <div class="g-block-content">
+    <div id="g-site-blocks" ref="<?= url::site("admin/sidebar/update?csrf={$csrf}__ACTIVE__") ?>">
+      <div class="g-admin-blocks-list">
+        <div><h3><?= t("Available Blocks") ?></h3></div>
+        <div>
+          <ul id="g-available-blocks" class="g-sortable-blocks">
+          <?= $available ?>
+          </ul>
+        </div>
       </div>
-    </div>
-    <div class="g-block g-left">
-      <h3><?= t("Active Blocks") ?></h3>
-      <div class="g-blocks-list g-block-content">
-        <ul id="g-active-blocks" class="g-sortable-blocks">
-        <?= $active ?>
-        </ul>
+      <div class="g-admin-blocks-list">
+        <div><h3><?= t("Active Blocks") ?></h3></div>
+        <div>
+          <ul id="g-active-blocks" class="g-sortable-blocks">
+          <?= $active ?>
+          </ul>
+        </div>
       </div>
     </div>
   </div>
diff --git a/themes/admin_wind/css/screen.css b/themes/admin_wind/css/screen.css
index 31de58f8..a889545b 100644
--- a/themes/admin_wind/css/screen.css
+++ b/themes/admin_wind/css/screen.css
@@ -424,16 +424,27 @@ li.g-default-group h4, li.g-default-group .g-user {
 
 /* Block admin  ~~~~~~~~~~~~~~~~~~~~~~~~~ */
 
-#g-admin-blocks .g-block {
-  clear: none;
+.g-admin-blocks-list {
+  float: left;
+  margin: 0 2em 2em 0;
   width: 30%;
 }
 
-#g-admin-blocks .g-block .g-draggable {
-  background: #e7e7e7;
-  /*border: 1px solid #fff;*/
-  margin-bottom: 1em;
-  padding: .4em .8em;
+.g-admin-blocks-list div:last-child {
+  border: .1em solid;
+  height: 100%;
+}
+
+.g-admin-blocks-list ul {
+  height: 98%;
+  margin: .1em .1em;
+  padding: .1em;
+}
+
+.g-admin-blocks-list ul li.g-draggable {
+  background-color: #e8e8e8;
+  margin: .5em;
+  padding: .3em .8em;
 }
 
 /** *******************************************************************
-- 
cgit v1.2.3