From 0494244e8068198707bf602199413cd216b0d515 Mon Sep 17 00:00:00 2001 From: Bharat Mediratta Date: Sun, 3 Feb 2013 18:48:30 -0500 Subject: Super first pass: - jQuery 1.90 - jQuery UI 1.10 - Superfish 1.5.1 (minus all plugins) - jQuery Form 3.26.0-2013.01.28 Deleted all other jQuery plugins for now. - Reworked autocomplete to use the latest jQuery code. - Deleted references to $.browser.msie, no longer supported - Basic CSS support for autocomplete - lots more work needed there --- lib/gallery.common.js | 82 ++++++++++++++++++++++++++++++++++++--------------- 1 file changed, 59 insertions(+), 23 deletions(-) (limited to 'lib/gallery.common.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index 755218f5..e23f3fad 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -200,7 +200,7 @@ // Set the input value equal to label text if (input.val() == "") { input.val(label.html()); - button.enable(false); + button.attr("disabled", true); } // Attach event listeners to the input @@ -209,14 +209,14 @@ if ($(this).val() == label.html()) { $(this).val(""); } - button.enable(true); + button.attr("disabled", false); }); input.bind("blur", function(e){ // Reset the input value if it's empty if ($(this).val() == "") { $(this).val(label.html()); - button.enable(false); + button.attr("disabled", true); } }); }); @@ -225,29 +225,65 @@ // Augment jQuery autocomplete to expect the first response line to // be a tag that protects against UTF-7 attacks. $.fn.gallery_autocomplete = function(url, options) { - // Drop the first response - it should be a meta tag - options.parse = function(data) { - var parsed = []; - var rows = data.split("\n"); - if (rows[0].indexOf(" tag in first line of autocomplete response'; - } - rows.shift(); // drop tag - for (var i=0; i < rows.length; i++) { - var row = $.trim(rows[i]); - if (row) { - row = row.split("|"); - parsed[parsed.length] = { - data: row, - value: row[0], - result: row[0] - }; + var autocomplete_options = { + source: function(request, response) { + var split = function(val) { + return val.split(/,\s*/); + } + + var extract_last = function(term) { + return split(term).pop(); + } + + var ajax_options = { + dataType: "json", + url: url, + success: function(data) { + response(data); + }, + }; + + if (options.multiple) { + + $.extend(ajax_options, { + dataFilter: function(data, dataType) { + // Drop the tag + return data.substring(data.indexOf("\n") + 1); + }, + data: { + term: extract_last(request.term) + } + }); } + + $.ajax(ajax_options, response); } - return parsed; - }; + } + + if (options.multiple) { + var split = function(val) { + return val.split(/,\s*/); + } + $.extend(autocomplete_options, { + focus: function(event, ui) { + var terms = split(this.value); + terms.pop(); + terms.push(ui.item.value); + this.value = terms.join(", "); + return false; + }, + select: function(event, ui) { + var terms = split(this.value); + terms.pop(); + terms.push(ui.item.value); + terms.push(""); + this.value = terms.join(", "); + return false; + } + }) + } - $(this).autocomplete(url, options); + $(this).autocomplete(autocomplete_options); }; })(jQuery); -- cgit v1.2.3 From a8b571cc974ee69da40b47d8b3a5db80ae0ec2b0 Mon Sep 17 00:00:00 2001 From: shadlaws Date: Sat, 16 Feb 2013 12:12:16 +0100 Subject: Context menu dialog box problem: better, but still not working. - removed fake attr settings (possible compatibility issue with newer jQuery) - replaced with extra class - fixed formatting - still doesn't work: addClass works, but hasClass always returns false when function runs again --- lib/gallery.common.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'lib/gallery.common.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index e23f3fad..95988573 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -26,9 +26,9 @@ } var el = $(this).find(".g-valign"); if (!el.length) { - $(this).html("<" + container + " class=\"g-valign\">" + $(this).html() + - ""); - el = $(this).children(container + ".g-valign"); + $(this).html("<" + container + " class=\"g-valign\">" + $(this).html() + + ""); + el = $(this).children(container + ".g-valign"); } var elh = $(el).height(); var ph = $(this).height(); @@ -133,8 +133,8 @@ $.fn.gallery_context_menu = function() { if ($(".g-context-menu li").length) { var hover_target = $(this).find(".g-context-menu"); - if (hover_target.attr("context_menu_initialized")) { - return; + if (hover_target.hasClass("g-context-menu-initialized")) { + return; } var list = $(hover_target).find("ul"); hover_target.find("*").removeAttr('title'); @@ -149,7 +149,7 @@ list.stop(true, true).slideUp("slow"); } ); - hover_target.attr("context_menu_initialized", 1); + hover_target.addClass("g-context-menu-initialized"); } }; -- cgit v1.2.3 From d632ef3e50252d388c272cacd29e8cc6e4949cec Mon Sep 17 00:00:00 2001 From: Bharat Mediratta Date: Sun, 17 Feb 2013 00:23:50 -0500 Subject: Fix up autocomplete for admin_server_add - found and fixed some bugs in gallery_autocomplete when "multiple" isn't set. Fixed some harmless syntax issues that js2-mode helpfully pointed out. --- lib/gallery.common.js | 26 ++++++++++++---------- .../server_add/controllers/admin_server_add.php | 6 ++--- modules/server_add/views/admin_server_add.html.php | 5 +---- modules/tag/helpers/tag_event.php | 2 +- 4 files changed, 19 insertions(+), 20 deletions(-) (limited to 'lib/gallery.common.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index 95988573..548aa29a 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -229,11 +229,11 @@ source: function(request, response) { var split = function(val) { return val.split(/,\s*/); - } + }; var extract_last = function(term) { return split(term).pop(); - } + }; var ajax_options = { dataType: "json", @@ -241,15 +241,17 @@ success: function(data) { response(data); }, + data: { + term: request.term + }, + dataFilter: function(data, dataType) { + // Drop the tag + return data.substring(data.indexOf("\n") + 1); + } }; - if (options.multiple) { - + if ("multiple" in options) { $.extend(ajax_options, { - dataFilter: function(data, dataType) { - // Drop the tag - return data.substring(data.indexOf("\n") + 1); - }, data: { term: extract_last(request.term) } @@ -258,12 +260,12 @@ $.ajax(ajax_options, response); } - } + }; - if (options.multiple) { + if ("multiple" in options) { var split = function(val) { return val.split(/,\s*/); - } + }; $.extend(autocomplete_options, { focus: function(event, ui) { var terms = split(this.value); @@ -280,7 +282,7 @@ this.value = terms.join(", "); return false; } - }) + }); } $(this).autocomplete(autocomplete_options); diff --git a/modules/server_add/controllers/admin_server_add.php b/modules/server_add/controllers/admin_server_add.php index ba2b9b3f..4e522702 100644 --- a/modules/server_add/controllers/admin_server_add.php +++ b/modules/server_add/controllers/admin_server_add.php @@ -73,14 +73,14 @@ class Admin_Server_Add_Controller extends Admin_Controller { public function autocomplete() { $directories = array(); - $path_prefix = Input::instance()->get("q"); + $path_prefix = Input::instance()->get("term"); foreach (glob("{$path_prefix}*") as $file) { if (is_dir($file) && !is_link($file)) { - $directories[] = html::clean($file); + $directories[] = (string)html::clean($file); } } - ajax::response(implode("\n", $directories)); + ajax::response(json_encode($directories)); } private function _get_admin_form() { diff --git a/modules/server_add/views/admin_server_add.html.php b/modules/server_add/views/admin_server_add.html.php index f59e327f..b2421c7c 100644 --- a/modules/server_add/views/admin_server_add.html.php +++ b/modules/server_add/views/admin_server_add.html.php @@ -6,10 +6,7 @@ $("document").ready(function() { $("#g-path").gallery_autocomplete( "".replace("__ARGS__", "admin/server_add/autocomplete"), - { - max: 256, - loadingClass: "g-loading-small", - }); + {multiple: true}); }); diff --git a/modules/tag/helpers/tag_event.php b/modules/tag/helpers/tag_event.php index 79d6e0bc..08d5d53a 100644 --- a/modules/tag/helpers/tag_event.php +++ b/modules/tag/helpers/tag_event.php @@ -124,7 +124,7 @@ class tag_event_Core { ->text("$('input[name=tags]') .gallery_autocomplete( '$autocomplete_url', - {max: 30, multiple: true, multipleSeparator: ',', cacheLength: 1} + {multiple: true} ); $('input[name=tags]') .change(function (event) { -- cgit v1.2.3 From 556d0d40eb33295a934eb6b906598fc94771d9c1 Mon Sep 17 00:00:00 2001 From: shadlaws Date: Mon, 18 Feb 2013 16:15:49 +0100 Subject: Context menus are fixed! This should be fully compatible with older themes since only gallery.common.js is modified. Now that I understand the problem and the fix, I'm not sure I can explain why it *used* to work with older jQuery... --- lib/gallery.common.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) (limited to 'lib/gallery.common.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index 548aa29a..fa11aeb9 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -137,18 +137,21 @@ return; } var list = $(hover_target).find("ul"); + hover_target.find("*").removeAttr('title'); + hover_target.find(".g-dialog-link").gallery_dialog(); + hover_target.find(".g-ajax-link").gallery_ajax(); list.hide(); + hover_target.hover( function() { list.stop(true, true).slideDown("fast"); - $(this).find(".g-dialog-link").gallery_dialog(); - $(this).find(".g-ajax-link").gallery_ajax(); }, function() { list.stop(true, true).slideUp("slow"); } ); + hover_target.addClass("g-context-menu-initialized"); } }; -- cgit v1.2.3 From ef2ca6edb572501145ec3a4d6aa529118081188a Mon Sep 17 00:00:00 2001 From: shadlaws Date: Thu, 28 Feb 2013 17:10:48 +0100 Subject: #2018 follow-on and #2023 - Fixed issues with thumb hover effects. - cleaned up resize after hover: more efficient, totally browser-compatible (IE7-10, FF, Chrome tested!). - cleaned up resize on hover: more efficient, fixed bug with neighbors that are bigger but only by a little. - fixed bugs when moving off item with expanded context menu and then quickly back: oversized hover, flicker. - cleaned up formatting, removed unneeded code, and added comments. --- lib/gallery.common.js | 6 ++++-- themes/wind/js/ui.init.js | 33 +++++++++++++-------------------- 2 files changed, 17 insertions(+), 22 deletions(-) (limited to 'lib/gallery.common.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index fa11aeb9..c3d1362c 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -144,11 +144,13 @@ list.hide(); hover_target.hover( + // The stop arguments below ensure that when we leave an item with an expanded context + // menu then *quickly* come back, we neither freeze mid-slide nor flicker. function() { - list.stop(true, true).slideDown("fast"); + list.stop(false, true).slideDown("fast"); }, function() { - list.stop(true, true).slideUp("slow"); + list.stop(true, false).slideUp("slow"); } ); diff --git a/themes/wind/js/ui.init.js b/themes/wind/js/ui.init.js index c9f9202c..fd75c210 100644 --- a/themes/wind/js/ui.init.js +++ b/themes/wind/js/ui.init.js @@ -49,42 +49,35 @@ $(document).ready(function() { // Album and search results views if ($("#g-album-grid").length) { // Set equal height for album items and vertically align thumbnails/metadata - $('.g-item').equal_heights().gallery_valign(); + $(".g-item").equal_heights().gallery_valign(); + // Store the resulting item height. Storing this here for the whole grid as opposed to in the + // hover event as an attr for each item is more efficient and ensures IE6-8 compatibility. + var item_height = $(".g-item").height(); // Initialize thumbnail hover effect $(".g-item").hover( function() { - // Store original height so we can change it back afterward - $(this).attr("data-orig-height", $(this).height()); // Insert a placeholder to hold the item's position in the grid - var placeHolder = $(this).clone().attr("id", "g-place-holder"); - $(this).after($(placeHolder)); + var place_holder = $(this).clone().attr("id", "g-place-holder"); + $(this).after($(place_holder)); // Style and position the hover item var position = $(this).position(); $(this).css("top", position.top).css("left", position.left); $(this).addClass("g-hover-item"); - // Initialize the contextual menu + // Initialize the contextual menu. Note that putting it here delays execution until needed. $(this).gallery_context_menu(); - // Set the hover item's height + // Set the hover item's height. Use "li a" on the context menu so we get the height of the + // collapsed menu and avoid problems with incomplete slideUp/Down animations. $(this).height("auto"); - var context_menu = $(this).find(".g-context-menu"); - var adj_height = $(this).height() + context_menu.height(); - if ($(this).next().height() > $(this).height()) { - $(this).height($(this).next().height()); - } else if ($(this).prev().height() > $(this).height()) { - $(this).height($(this).prev().height()); - } else { - $(this).height(adj_height); - } + $(this).height(Math.max($(this).height(), item_height) + + $(this).find(".g-context-menu li a").height()); }, function() { // Reset item height and position - $(this).css("height", $(this).attr("data-orig-height")); - $(this).css("position", "relative"); - $(this).css("top", 0).css("left", 0); + $(this).height(item_height); + $(this).css("top", "").css("left", ""); // Remove the placeholder and hover class from the item $(this).removeClass("g-hover-item"); - $(this).gallery_valign(); $("#g-place-holder").remove(); } ); -- cgit v1.2.3 From 73139982c7be10789c27360913b4bc4cbd5cd38e Mon Sep 17 00:00:00 2001 From: shadlaws Date: Sat, 2 Mar 2013 23:00:02 +0100 Subject: #2032 - Fix short form submit/cancel button formatting. - fixed the height of the submit buttons to match the input box - changed the cancel links into cancel buttons - added the hover effect to the buttons when used in in_place_edit (e.g. admin/tags) --- lib/gallery.common.js | 3 +++ modules/gallery/views/in_place_edit.html.php | 2 +- themes/admin_wind/css/screen.css | 7 ++++++- themes/wind/css/screen.css | 7 ++++++- 4 files changed, 16 insertions(+), 3 deletions(-) (limited to 'lib/gallery.common.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index c3d1362c..5ff6b397 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -202,6 +202,9 @@ $(".g-short-form input[type=submit]").addClass("ui-state-default ui-corner-right"); } + // Add the hover effect to the buttons + $.fn.gallery_hover_init(); + // Set the input value equal to label text if (input.val() == "") { input.val(label.html()); diff --git a/modules/gallery/views/in_place_edit.html.php b/modules/gallery/views/in_place_edit.html.php index 2d6cbe90..c2515a03 100644 --- a/modules/gallery/views/in_place_edit.html.php +++ b/modules/gallery/views/in_place_edit.html.php @@ -8,7 +8,7 @@
  • "submit ui-state-default"), t("Save")) ?>
    • -
    • +

  • diff --git a/themes/admin_wind/css/screen.css b/themes/admin_wind/css/screen.css index 23d319b2..1deb3cda 100644 --- a/themes/admin_wind/css/screen.css +++ b/themes/admin_wind/css/screen.css @@ -255,6 +255,10 @@ input[readonly] { width: 100%; } +.g-short-form .submit { + padding: .3em .6em; +} + .g-short-form .textbox.g-error { border: 1px solid #f00; color: #f00; @@ -263,7 +267,8 @@ input[readonly] { .g-short-form .g-cancel { display: block; - margin: .3em .8em; + margin: 0em .8em; + padding: .3em .6em; } #g-sidebar .g-short-form li { diff --git a/themes/wind/css/screen.css b/themes/wind/css/screen.css index c088180d..7ef8e2e4 100644 --- a/themes/wind/css/screen.css +++ b/themes/wind/css/screen.css @@ -276,6 +276,10 @@ input[readonly] { width: 100%; } +.g-short-form .submit { + padding: .3em .6em; +} + .g-short-form .textbox.g-error { border: 1px solid #f00; color: #f00; @@ -284,7 +288,8 @@ input[readonly] { .g-short-form .g-cancel { display: block; - margin: .3em .8em; + margin: 0em .8em; + padding: .3em .6em; } #g-sidebar .g-short-form li { -- cgit v1.2.3 From 2e94edab5396d53b1b09b6b1415d1f66d6f16de5 Mon Sep 17 00:00:00 2001 From: shadlaws Date: Mon, 11 Mar 2013 17:16:20 +0100 Subject: #2053 - Change all .bind() to .on() for jQuery future-proofing. - on/off are preferred to bind/unbind, live/die, and delegate/undelegate in jQuery 1.7+ - they're likely on the road toward deprecation, so let's replace them now. --- lib/gallery.common.js | 4 ++-- modules/server_add/js/server_add.js | 2 +- themes/wind/js/ui.init.js | 2 +- themes/wind/views/photo.html.php | 2 +- 4 files changed, 5 insertions(+), 5 deletions(-) (limited to 'lib/gallery.common.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index 5ff6b397..f5dee958 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -212,7 +212,7 @@ } // Attach event listeners to the input - input.bind("focus", function(e) { + input.on("focus", function(e) { // Empty input value if it equals it's label if ($(this).val() == label.html()) { $(this).val(""); @@ -220,7 +220,7 @@ button.attr("disabled", false); }); - input.bind("blur", function(e){ + input.on("blur", function(e) { // Reset the input value if it's empty if ($(this).val() == "") { $(this).val(label.html()); diff --git a/modules/server_add/js/server_add.js b/modules/server_add/js/server_add.js index 02dda4c0..a2499896 100644 --- a/modules/server_add/js/server_add.js +++ b/modules/server_add/js/server_add.js @@ -33,7 +33,7 @@ $("#g-server-add-tree span.g-directory", this.element).dblclick(function(event) { self.open_dir(event); }); - $("#g-dialog").bind("dialogclose", function(event, ui) { + $("#g-dialog").on("dialogclose", function(event, ui) { window.location.reload(); }); }, diff --git a/themes/wind/js/ui.init.js b/themes/wind/js/ui.init.js index fd75c210..4f901778 100644 --- a/themes/wind/js/ui.init.js +++ b/themes/wind/js/ui.init.js @@ -83,7 +83,7 @@ $(document).ready(function() { ); // Realign any thumbnails that change so that when we rotate a thumb it stays centered. - $(".g-item").bind("gallery.change", function() { + $(".g-item").on("gallery.change", function() { $(".g-item").each(function() { $(this).height($(this).find("img").height() + 2); }); diff --git a/themes/wind/views/photo.html.php b/themes/wind/views/photo.html.php index b42ab987..1fab71e1 100644 --- a/themes/wind/views/photo.html.php +++ b/themes/wind/views/photo.html.php @@ -12,7 +12,7 @@ // After the image is rotated or replaced we have to reload the image dimensions // so that the full size view isn't distorted. - $("#g-photo").bind("gallery.change", function() { + $("#g-photo").on("gallery.change", function() { $.ajax({ url: "item()->id) ?>", dataType: "json", -- cgit v1.2.3