Combine the quick menu and the thumb menu into a single menu called

the "context" menu.

This new context menu is generated using the typical event processing
system, like our other menus.  The specialized quick CSS and JS is now
gone, replaced by our generic menu handling code.  It's all rolled
together currently using the thumb_menu UI for easy packaging.  All
the CSS and JS is updated.

NOTE: the non-dialog links (rotate, album_cover) have a broken UI
because they return JSON which the quick.js code handled specially,
but we don't handle properly now.  I need to fix this.

4 files changed, 16 insertions, 30 deletions

diff --git a/themes/default/css/fix-ie.css b/themes/default/css/fix-ie.css
index c7c1ebad..eee88c15 100644
--- a/themes/default/css/fix-ie.css
+++ b/themes/default/css/fix-ie.css
@@ -35,7 +35,3 @@ input.submit {
 .gPager .ui-icon-right {
   width: 60px;
 }
-
-.gQuickPane {
-  height: 32px !important;
-}
\ No newline at end of file
diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css
index c5a9956d..eb092b83 100644
--- a/themes/default/css/screen.css
+++ b/themes/default/css/screen.css
@@ -588,24 +588,25 @@ form .gError,
 
 /* Thumb Menu  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
 
-#gContent .gThumbMenu {
+#gContent .gContextMenu {
   bottom: 0;
   left: 0;
   position: absolute;
   width: 100%;
+  display: none;
 }
 
-#gContent .gThumbMenu li {
+#gContent .gContextMenu li {
   border-left: none;
   border-right: none;
   border-bottom: none;
 }
 
-#gContent .gThumbMenu li li {
+#gContent .gContextMenu li li {
   padding: .3em;
 }
 
-#gContent .gThumbMenu a:hover {
+#gContent .gContextMenu a:hover {
   text-decoration: none;
 }
 
diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js
index 11cd06ed..d796cb67 100644
--- a/themes/default/js/ui.init.js
+++ b/themes/default/js/ui.init.js
@@ -32,7 +32,6 @@ $(document).ready(function() {
   $("#gMessage li").showMessage();
 
   // Initialize dialogs
-  $(".gMenuLink").addClass("gDialogLink");
   $("#gLoginLink").addClass("gDialogLink");
   var dialogLinks = $(".gDialogLink");
   for (var i=0; i < dialogLinks.length; i++) {
@@ -57,9 +56,6 @@ $(document).ready(function() {
   if ($("#gAlbumGrid").length) {
     // Vertical align thumbnails/metadata in album grid
     $(".gItem").vAlign();
-    $(".gQuick").ajaxStop(function(){
-      $(".gItem").vAlign();
-    });
   }
 
   // Photo/Item item view only
@@ -97,26 +93,19 @@ $(document).ready(function() {
     }
   );
 
-  // Initialize thumbnail menus
-  // @todo Toggle between north and south caret's on hover
-  if ($("#gContent .gThumbMenu").length) {
-    $("#gContent .gThumbMenu li").addClass("ui-state-default");
-    $("#gContent .gThumbMenu li a")
-      .not('[class]')
-      .addClass("gButtonLink ui-icon ui-icon-caret-l-n")
-      .css({
-        height: "10px",
-        margin: "0",
-        padding: "0 0 3px 0"
-      });
-
-    $(".gThumbMenu ul").hide();
-    $(".gThumbMenu").hover(
+  // Initialize context menus
+  if ($("#gContent .gContextMenu").length) {
+    $("#gContent .gContextMenu li").addClass("ui-state-default");
+    $(".gContextMenu").parent().hover(
       function() {
-        $(this).find("ul").slideDown("fast");
+        $(this).find(".gContextMenu").slideDown("fast");
+	var dialogLinks = $(this).find(".gDialogLink");
+	for (var i = 0; i < dialogLinks.length; i++) {
+	  $(dialogLinks[i]).bind("click", handleDialogEvent);
+	}
       },
       function() {
-	      $(this).find("ul").slideUp("slow");
+	$(this).find(".gContextMenu").slideUp("slow");
       }
     );
   }
diff --git a/themes/default/views/album.html.php b/themes/default/views/album.html.php
index 65ea3381..ce57458e 100644
--- a/themes/default/views/album.html.php
+++ b/themes/default/views/album.html.php
@@ -19,7 +19,7 @@
       <?= $child->thumb_img(array("class" => "gThumbnail")) ?>
     </a>
     <?= $theme->thumb_bottom($child) ?>
-    <?= $theme->thumb_menu($child) ?>
+    <?= $theme->context_menu($child) ?>
     <h2><span></span><a href="<?= $child->url() ?>"><?= p::clean($child->title) ?></a></h2>
     <ul class="gMetadata">
       <?= $theme->thumb_info($child) ?>