Create the concept of an "ajax link" and use it for thumbnail rotation

and album covers in the context menu.

Notes:
- This requires context_menu() to have a CSS selector that refers to the
  <img> that we're operating on, otherwise we don't know how to find the
  thumbnail, etc.
- Create Menu_Element_Ajax_Link which has an ajax_handler attribute
  that contains a snippet of JS that we're going to run when the ajax
  call returns.
- Add $.gallery_replace_image in gallery.common.js
- Add lib/gallery.ajax.js which can be used to ajaxify any link, and have
  ui.init.js in the themes call that on all .gAjaxLink elements.

5 files changed, 9 insertions, 7 deletions

diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js
index 3726d305..60482972 100644
--- a/themes/default/js/ui.init.js
+++ b/themes/default/js/ui.init.js
@@ -34,6 +34,7 @@ $(document).ready(function() {
   // Initialize dialogs
   $("#gLoginLink").addClass("gDialogLink");
   $(".gDialogLink").gallery_dialog();
+  $(".gAjaxLink").gallery_ajax();
 
   // Initialize view menu
   if ($("#gViewMenu").length) {
@@ -100,8 +101,8 @@ $(document).ready(function() {
             $(".gContextMenu").hover(
               function() {
                 $(this).find("ul").slideDown("fast");
-                var dialogLinks = $(this).find(".gDialogLink");
-                $(dialogLinks).gallery_dialog();
+		$(this).find(".gDialogLink").gallery_dialog();
+		$(this).find(".gAjaxLink").gallery_ajax();
               },
               function() {
                 $(this).find("ul").slideUp("slow");
@@ -128,8 +129,8 @@ $(document).ready(function() {
         $(".gContextMenu").hover(
           function() {
             $(this).find("ul").slideDown("fast");
-            var dialogLinks = $(this).find(".gDialogLink");
-            $(dialogLinks).gallery_dialog();
+            $(this).find(".gDialogLink").gallery_dialog();
+            $(this).find(".gAjaxLink").gallery_ajax();
           },
           function() {
             $(this).find("ul").slideUp("slow");
diff --git a/themes/default/views/album.html.php b/themes/default/views/album.html.php
index ce57458e..e2890482 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->context_menu($child) ?>
+    <?= $theme->context_menu($child, "#gItemId-{$child->id} .gThumbnail") ?>
     <h2><span></span><a href="<?= $child->url() ?>"><?= p::clean($child->title) ?></a></h2>
     <ul class="gMetadata">
       <?= $theme->thumb_info($child) ?>
diff --git a/themes/default/views/movie.html.php b/themes/default/views/movie.html.php
index d255922b..c8ecd769 100644
--- a/themes/default/views/movie.html.php
+++ b/themes/default/views/movie.html.php
@@ -36,5 +36,5 @@
     var ADD_A_COMMENT = "<?= t("Add a comment") ?>";
   </script>
   <?= $theme->photo_bottom() ?>
-  <?= $theme->context_menu($item) ?>
+  <?= $theme->context_menu($item, "#gMovieId-{$item->id}") ?>
 </div>
diff --git a/themes/default/views/page.html.php b/themes/default/views/page.html.php
index 66282bae..2cb71b9e 100644
--- a/themes/default/views/page.html.php
+++ b/themes/default/views/page.html.php
@@ -53,6 +53,7 @@
     <script type="text/javascript">
     var MSG_CANCEL = "<?= t('Cancel') ?>";
     </script>
+    <?= $theme->script("gallery.ajax.js") ?>
     <?= $theme->script("gallery.dialog.js") ?>
     <?= $theme->script("gallery.form.js") ?>
     <?= $theme->script("superfish/js/superfish.js") ?>
diff --git a/themes/default/views/photo.html.php b/themes/default/views/photo.html.php
index 453417dc..fa5def47 100644
--- a/themes/default/views/photo.html.php
+++ b/themes/default/views/photo.html.php
@@ -47,7 +47,7 @@
     </a>
     <? endif ?>
     <?= $theme->resize_bottom($item) ?>
-    <?= $theme->context_menu($item) ?>
+    <?= $theme->context_menu($item, "#gPhotoId-{$item->id}") ?>
   </div>
 
   <div id="gInfo">