Removed YUI grids. Added g- prefix to selected class. Layout almost completely restored, still need to fix action-status message box

modules/organize/css/organize.css

@@ -3,6 +3,7 @@
  * Dialog wide styles
  */
 #g-organize {
+  height: 100%;
   overflow: hidden;
 }
 
@@ -10,15 +11,16 @@
   height: 100%;
 }
 
-#g-organize .yui-u {
-  width: 75%;
+#g-organize #g-organize-detail {
+  width: auto;
 }
 
-#g-organize .yui-gf .g-first {
+#g-organize #g-organize-tree-container {
+  height: 100%;
   width: 25%;
 }
 
-#g-action-status {
+#g-organize #g-action-status {
   margin-bottom: .4em;
   width: 75%;
   white-space: nowrap;
@@ -28,11 +30,6 @@
   height: 100%;
 }
 
-#g-action-status .g-info {
-  font-weight: bold;
-  padding-left: 2em;
-}
-
 /*******************************************************************
  * Album Tree styles
  */
@@ -43,10 +40,10 @@
   padding: 0 !important;
 }
 
-#g-organize-album-tree .selected {
+#g-organize-album-tree .g-selected {
   background-color: #cfdeff;
   border-bottom: 1px solid #999;
-  margin-right: 0px;
+  margin-right: 0;
 }
 
 #g-organize-album-tree ul li {
@@ -87,8 +84,7 @@
 }
 
 .g-organize-microthumb-grid-cell {
-  float: left;
-  font-size: 0.8em;
+  font-size: .8em;
   padding: .5em !important;
   border-left: 1px hidden #13A;
   border-right: 1px hidden #13A;
@@ -143,6 +139,5 @@
 }
 
 #g-organize-close {
-  float: right;
   margin-right: 12px;
 }

modules/organize/js/organize.js

@@ -204,7 +204,7 @@
      */
     show_album: function(event) {
       event.preventDefault();
-      if ($(event.currentTarget).hasClass("selected")) {
+      if ($(event.currentTarget).hasClass("g-selected")) {
         return;
       }
       var parent = $(event.currentTarget).parents(".g-organize-branch");
@@ -213,8 +213,8 @@
       }
       $("#g-organize-microthumb-panel").selectable("destroy");
       var id = $(event.currentTarget).attr("ref");
-      $("#g-organize-album-tree .selected").removeClass("selected");
-      $(".g-organize-album-text[ref=" + id + "]").addClass("selected");
+      $("#g-organize-album-tree .g-selected").removeClass("g-selected");
+      $(".g-organize-album-text[ref=" + id + "]").addClass("g-selected");
       var url = $("#g-organize-microthumb-panel").attr("ref").replace("__ITEM_ID__", id).replace("__OFFSET__", 0);
       $.get(url, {},
 	    function(data) {
@@ -231,7 +231,7 @@
      */
     resort: function(column, dir) {
       var url = sort_order_url
-        .replace("__ALBUM_ID__", $("#g-organize-album-tree .selected").attr("ref"))
+        .replace("__ALBUM_ID__", $("#g-organize-album-tree .g-selected").attr("ref"))
         .replace("__COL__", column)
         .replace("__DIR__", dir);
       $.get(url, {},

modules/organize/views/organize_dialog.html.php

@@ -8,21 +8,19 @@
 <div id="g-organize" class="g-dialog-panel">
   <h1 style="display:none"><?= t("Organize %name", array("name" => html::purify($album->title))) ?></h1>
   <div id="bd">
-    <div class="yui-gf">
-      <div class="yui-u g-first">
+    <div>
+      <div class="g-first g-left">
         <h3><?= t("Albums") ?></h3>
       </div>
-      <div id="g-action-status" class="g-message-block yui-u">
-        <div class="g-info"><?= t("Drag and drop photos to re-order or move between albums") ?></div>
-      </div>
+      <div id="g-action-status" class="g-message-block g-info"><?= t("Drag and drop photos to re-order or move between albums") ?></div>
     </div>
-    <div id="g-organize-content-pane" class="yui-gf">
-      <div id="g-organize-tree-container" class="yui-u g-first">
-        <ul id="g-organize-album-tree">
+    <div id="g-organize-content-pane">
+      <div id="g-organize-tree-container" class="g-first g-left">
+        <h3><?= t("Albums") ?></h3><ul id="g-organize-album-tree">
           <?= $album_tree ?>
         </ul>
       </div>
-      <div id="g-organize-detail" class="yui-u">
+      <div id="g-organize-detail">
         <div id="g-organize-microthumb-panel"
              ref="<?= url::site("organize/album/__ITEM_ID__/__OFFSET__") ?>">
           <ul id="g-organize-microthumb-grid">
@@ -31,7 +29,7 @@
         </div>
         <div id="g-organize-controls">
           <a id="g-organize-close" href="#" ref="done"
-             class="g-button ui-corner-all ui-state-default"><?= t("Close") ?></a>
+             class="g-button g-right ui-corner-all ui-state-default"><?= t("Close") ?></a>
           <form>
             <?= t("Sort order") ?>
             <?= form::dropdown(array("id" => "g-organize-sort-column"), album::get_sort_order_options(), $album->sort_column) ?>

modules/organize/views/organize_thumb_grid.html.php

@@ -1,6 +1,6 @@
 <?php defined("SYSPATH") or die("No direct script access.") ?>
 <? foreach ($album->children(25, $offset) as $child): ?>
-<li class="g-organize-microthumb-grid-cell" ref="<?= $child->id ?>">
+<li class="g-organize-microthumb-grid-cell g-left" ref="<?= $child->id ?>">
   <div id="g-organize-microthumb_<?= $child->id ?>"
        class="g-organize-microthumb <?= $child->is_album() ? "g-album" : "g-photo" ?>">
     <?= $child->thumb_img(array("class" => "g-thumbnail", "ref" => $child->id), 90, true) ?>