From 52147cf6f857c4c54a2f3d753e72b27b5141d028 Mon Sep 17 00:00:00 2001 From: Bharat Mediratta Date: Mon, 3 Aug 2009 21:45:54 -0700 Subject: 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. --- themes/default/js/ui.init.js | 31 ++++++++++--------------------- 1 file changed, 10 insertions(+), 21 deletions(-) (limited to 'themes/default/js/ui.init.js') 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"); } ); } -- cgit v1.2.3 From 3a8837726a6618139813ea88b007909d32da752b Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Tue, 4 Aug 2009 23:52:36 -0600 Subject: White space fixes. --- themes/default/js/ui.init.js | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) (limited to 'themes/default/js/ui.init.js') diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index d796cb67..6414cbcc 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -66,7 +66,9 @@ $(document).ready(function() { // Collapse comments form, insert button to expand if ($("#gAddCommentForm").length) { - var showCommentForm = '' + ADD_A_COMMENT + ''; + var showCommentForm = '' + + '' + ADD_A_COMMENT + ''; $("#gAddCommentForm").hide(); $("#gComments").prepend(showCommentForm); $(".showCommentForm").click(function(){ @@ -99,13 +101,13 @@ $(document).ready(function() { $(".gContextMenu").parent().hover( function() { $(this).find(".gContextMenu").slideDown("fast"); - var dialogLinks = $(this).find(".gDialogLink"); - for (var i = 0; i < dialogLinks.length; i++) { - $(dialogLinks[i]).bind("click", handleDialogEvent); - } + var dialogLinks = $(this).find(".gDialogLink"); + for (var i = 0; i < dialogLinks.length; i++) { + $(dialogLinks[i]).bind("click", handleDialogEvent); + } }, function() { - $(this).find(".gContextMenu").slideUp("slow"); + $(this).find(".gContextMenu").slideUp("slow"); } ); } -- cgit v1.2.3 From b826182b7a7b2d630b478d3e2bcf0628989a92d9 Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Thu, 6 Aug 2009 22:22:24 +0800 Subject: Cleanup the javascript for enabling dialog or panel links. 1) We don't need to loop over the elements to bind the event handler. 2) Just include gallery.panel.js for all the admin pages. Signed-off-by: Tim Almdal --- modules/gallery/helpers/gallery_theme.php | 1 + modules/user/helpers/user_theme.php | 6 ------ themes/admin_default/js/ui.init.js | 12 +++--------- themes/default/js/ui.init.js | 5 +---- 4 files changed, 5 insertions(+), 19 deletions(-) (limited to 'themes/default/js/ui.init.js') diff --git a/modules/gallery/helpers/gallery_theme.php b/modules/gallery/helpers/gallery_theme.php index d3751b80..903827cc 100644 --- a/modules/gallery/helpers/gallery_theme.php +++ b/modules/gallery/helpers/gallery_theme.php @@ -78,6 +78,7 @@ class gallery_theme_Core { } static function admin_head($theme) { + $theme->script("gallery.panel.js"); $session = Session::instance(); if ($session->get("debug")) { $theme->css("debug.css"); diff --git a/modules/user/helpers/user_theme.php b/modules/user/helpers/user_theme.php index c5351f8e..69042aed 100644 --- a/modules/user/helpers/user_theme.php +++ b/modules/user/helpers/user_theme.php @@ -23,10 +23,4 @@ class user_theme_Core { $view->user = user::active(); return $view->render(); } - - static function admin_head($theme) { - if (strpos(Router::$current_uri, "admin/users") !== false) { - $theme->script("gallery.panel.js"); - } - } } diff --git a/themes/admin_default/js/ui.init.js b/themes/admin_default/js/ui.init.js index 3f062a27..06cc1cd5 100644 --- a/themes/admin_default/js/ui.init.js +++ b/themes/admin_default/js/ui.init.js @@ -1,5 +1,5 @@ $(document).ready(function(){ - + // Initialize Superfish menus $("#gSiteAdminMenu ul.gMenu").addClass("sf-menu"); $("ul.gMenu").addClass("sf-menu"); @@ -18,16 +18,10 @@ $(document).ready(function(){ $("#gMessage li").showMessage(); // Initialize modal dialogs - var dialogLinks = $(".gDialogLink"); - for (var i=0; i < dialogLinks.length; i++) { - $(dialogLinks[i]).bind("click", handleDialogEvent); - } + $(".gDialogLink").bind("click", handleDialogEvent); // Initialize panels - var panelLinks = $(".gPanelLink"); - for (i=0; i Date: Fri, 7 Aug 2009 23:58:57 +0800 Subject: Refactor the gallery dialog into a jQuery widget Signed-off-by: Bharat Mediratta --- lib/gallery.common.js | 27 ++- lib/gallery.dialog.js | 252 ++++++++++----------- modules/gallery/views/after_install.html.php | 2 +- .../views/server_add_tree_dialog.html.php | 5 +- modules/tag/js/tag.js | 2 +- modules/user/views/admin_users.html.php | 2 +- themes/admin_default/js/ui.init.js | 2 +- themes/default/js/ui.init.js | 2 +- 8 files changed, 155 insertions(+), 139 deletions(-) (limited to 'themes/default/js/ui.init.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index 1eaa6db2..e063462e 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -2,17 +2,15 @@ * To change this template, choose Tools | Templates * and open the template in the editor. */ -(function () { +(function ($) { $.fn.showMessage = function(message) { return this.each(function(i){ $(this).effect("highlight", {"color": "white"}, 3000); $(this).animate({opacity: 1.0}, 6000); }); }; -})(jQuery); // Vertically align a block element's content -(function () { $.fn.vAlign = function(container) { return this.each(function(i){ if (container == null) { @@ -26,10 +24,8 @@ $(el).css('margin-top', nh); }); }; -})(jQuery); // Get the viewport size -(function () { $.getViewportSize = function() { return { width : function() { @@ -40,4 +36,25 @@ } }; }; + + /** + * Toggle the processing indicator, both large and small + * @param elementID Target ID, including #, to apply .gLoadingSize + */ + $.fn.showLoading = function() { + return this.each(function(i){ + var size; + switch ($(this).attr("id")) { + case "#gDialog": + case "#gPanel": + size = "Large"; + break; + default: + size = "Small"; + break; + } + $(this).toggleClass("gLoading" + size); + }); + }; + })(jQuery); diff --git a/lib/gallery.dialog.js b/lib/gallery.dialog.js index 74c2f20e..7e0ba1b4 100644 --- a/lib/gallery.dialog.js +++ b/lib/gallery.dialog.js @@ -1,140 +1,136 @@ -/** - * Fire openDialog() and prevent links from opening - * @see openDialog() - */ -function handleDialogEvent(event) { - var target = event.currentTarget; - if (!target) { - target = event.srcElement; - } - openDialog(target); - event.preventDefault(); -} +(function($) { + $.widget("ui.galleryDialog", { + _init: function() { + var self = this; + this.element.click(function(event){ + event.preventDefault(); + var element = event.currentTarget; + var sHref = $(element).attr("href"); + var sTitle = $(element).attr("title"); + var eDialog = '
'; -function ajaxify_dialog() { - $("#gDialog form").ajaxForm({ - dataType: "json", - success: function(data) { - if (data.form) { - $("#gDialog form").replaceWith(data.form); - ajaxify_dialog(); - on_form_loaded(); - if (typeof data.reset == 'function') { - eval(data.reset + '()'); - } - } - if (data.result == "success") { - if (data.location) { - window.location = data.location; - } else { - window.location.reload(); - } - } - } - }); -}; + $("body").append(eDialog); + + if (!self.options.close) { + self.options.close = self.closeDialog; + } + $("#gDialog").dialog(self.options); -/** - * Display modal dialogs, populate dialog with trigger link's href - * @requires ui.core - * @requires ui.draggable - * @requires ui.resizable - * @requires ui.dialog - * @see handleDialogEvent() - * @see showLoading() - */ -function openDialog(element) { - var sHref = $(element).attr("href"); - var sTitle = $(element).attr("title"); - var eDialog = '
'; - var dialogWidth; + $("#gDialog").showLoading(); - $("body").append(eDialog); + $.get(sHref, function(data) { + $("#gDialog").html(data).showLoading(); - $("#gDialog").dialog({ - autoOpen: false, - autoResize: true, - modal: true, - resizable: false, - close: closeDialog - }); + if ($("#gDialog form").length) { + self._trigger("form_loaded", null, $("#gDialog form")); + } + self._layout(); - showLoading("#gDialog"); + $("#gDialog").dialog("open"); + // Remove titlebar for progress dialogs or set title + if ($("#gDialog #gProgress").length) { + $(".ui-dialog-titlebar").remove(); + } else if ($("#gDialog h1").length) { + $("#gDialog").dialog('option', 'title', $("#gDialog h1:eq(0)").html()); + } else if ($("#gDialog fieldset legend").length) { + $("#gDialog").dialog('option', 'title', $("#gDialog fieldset legend:eq(0)").html()); + } - $.get(sHref, function(data) { - showLoading("#gDialog"); - $("#gDialog").html(data); - var dialogHeight = $("#gDialog").height(); - var cssWidth = new String($("#gDialog form").css("width")); - var childWidth = cssWidth.replace(/[^0-9]/g,""); - if ($("#gDialog iframe").length) { - dialogWidth = $(window).width() - 100; - // Set the iframe width and height - $("#gDialog iframe").width("100%"); - $("#gDialog iframe").height($(window).height() - 100); - } else if (childWidth == "" || childWidth > 300) { - dialogWidth = 500; - } - $("#gDialog").dialog('option', 'width', dialogWidth); + if ($("#gDialog form").length) { + self._ajaxify_dialog(); + } + }); + $("#gDialog").dialog("option", "self", self); + return false; + }); + }, - on_form_loaded(); + destroy: function() { + if ($("#gDialog form").length) { + this._trigger("form_closing", null, $("#gDialog form")); + } + this._trigger("dialog_closing", null, $("#gDialog")); - $("#gDialog").dialog("open"); - // Remove titlebar for progress dialogs or set title - if ($("#gDialog #gProgress").length) { - $(".ui-dialog-titlebar").remove(); - } else if ($("#gDialog h1").length) { - $("#gDialog").dialog('option', 'title', $("#gDialog h1:eq(0)").html()); - } else if ($("#gDialog fieldset legend").length) { - $("#gDialog").dialog('option', 'title', $("#gDialog fieldset legend:eq(0)").html()); - } + $("#gDialog").dialog("destroy").remove(); + }, + + _layout: function() { + var dialogWidth; + var dialogHeight = $("#gDialog").height(); + var cssWidth = new String($("#gDialog form").css("width")); + var childWidth = cssWidth.replace(/[^0-9]/g,""); + if ($("#gDialog iframe").length) { + dialogWidth = $(window).width() - 100; + // Set the iframe width and height + $("#gDialog iframe").width("100%").height($(window).height() - 100); + } else if (childWidth == "" || childWidth > 300) { + dialogWidth = 500; + } + $("#gDialog").dialog('option', 'width', dialogWidth); + }, + + form_loaded: function event(event, ui) { + // Should be defined (and localized) in the theme + MSG_CANCEL = MSG_CANCEL || 'Cancel'; + var eCancel = '' + MSG_CANCEL + ''; + if ($("#gDialog .submit").length) { + $("#gDialog .submit").addClass("ui-state-default ui-corner-all"); + $("#gDialog .submit").parent().append(eCancel); + $("#gDialog .gCancel").click(function(event) { + $("gDialog").dialog("close"); + event.preventDefault(); + }); + } + $("#gDialog .ui-state-default").hover( + function() { + $(this).addClass("ui-state-hover"); + }, + function() { + $(this).removeClass("ui-state-hover"); + } + ); + }, - ajaxify_dialog(); - }); - return false; -} + closeDialog: function (event, ui) { + var self = $("#gDialog").dialog("option", "self"); + self.destroy(); + }, -function on_form_loaded() { - // Should be defined (and localized) in the theme - MSG_CANCEL = MSG_CANCEL || 'Cancel'; - var eCancel = '' + MSG_CANCEL + ''; - if ($("#gDialog .submit").length) { - $("#gDialog .submit").addClass("ui-state-default ui-corner-all"); - $("#gDialog .submit").parent().append(eCancel); - } - $("#gDialog").dialog("option", "form", $("#gDialog form")); - $("#gDialog .ui-state-default").hover( - function() { - $(this).addClass("ui-state-hover"); - }, - function() { - $(this).removeClass("ui-state-hover"); - } - ); -} + _ajaxify_dialog: function() { + var self = this; + $("#gDialog form").ajaxForm({ + dataType: "json", + success: function(data) { + if (data.form) { + $("#gDialog form").replaceWith(data.form); + self._ajaxify_dialog(); + self._trigger("form_loaded", null, $("#gDialog form")); + if (typeof data.reset == 'function') { + eval(data.reset + '()'); + } + } + if (data.result == "success") { + if (data.location) { + window.location = data.location; + } else { + window.location.reload(); + } + } + } + }); + }, -function closeDialog() { - var form = $("#gDialog").dialog("option", "form"); - if (form != null) { - $("#gDialog").dialog("option", "form").trigger("form_closing"); - } - $("#gDialog").dialog("destroy").remove(); -} + form_closing: function(event, ui) {}, + dialog_closing: function(event, ui) {} + }); -/** - * Toggle the processing indicator, both large and small - * @param elementID Target ID, including #, to apply .gLoadingSize - */ -function showLoading(elementID) { - var size; - switch (elementID) { - case "#gDialog": - case "#gPanel": - size = "Large"; - break; - default: - size = "Small"; - break; - } - $(elementID).toggleClass("gLoading" + size); -} + $.extend($.ui.galleryDialog, { + defaults: { + autoOpen: false, + autoResize: true, + modal: true, + resizable: false, + position: "center" + } + }); +})(jQuery); diff --git a/modules/gallery/views/after_install.html.php b/modules/gallery/views/after_install.html.php index e4842163..feb2d281 100644 --- a/modules/gallery/views/after_install.html.php +++ b/modules/gallery/views/after_install.html.php @@ -16,7 +16,7 @@ title="" id="gAfterInstallChangePasswordLink" class="gButtonLink ui-state-default ui-corners-all">

diff --git a/modules/server_add/views/server_add_tree_dialog.html.php b/modules/server_add/views/server_add_tree_dialog.html.php index 21952849..5c5dfd0f 100644 --- a/modules/server_add/views/server_add_tree_dialog.html.php +++ b/modules/server_add/views/server_add_tree_dialog.html.php @@ -34,7 +34,7 @@ - @@ -48,6 +48,9 @@ progressbar("value", 0); $("#gProgress").slideDown("fast", function() { start_add() }); }); + $("#gServerCloseButton").click(function(event) { + $("#gDialog").dialog("close"); + }); }); diff --git a/modules/tag/js/tag.js b/modules/tag/js/tag.js index 765c2a35..535582c5 100644 --- a/modules/tag/js/tag.js +++ b/modules/tag/js/tag.js @@ -23,7 +23,7 @@ function closeEditInPlaceForms() { $("#gRenameTagForm").parent().html($("#gRenameTagForm").parent().data("revert")); li.height(""); $(".gEditable", li).bind("click", editInPlace); - $(".gDialogLink", li).bind("click", handleDialogEvent); + $(".gDialogLink", li).galleryDialog(); } } diff --git a/modules/user/views/admin_users.html.php b/modules/user/views/admin_users.html.php index 542b8b8b..a487d565 100644 --- a/modules/user/views/admin_users.html.php +++ b/modules/user/views/admin_users.html.php @@ -28,7 +28,7 @@ {}, function(data) { $("#group-" + group_id).html(data); - $("#group-" + group_id + " .gDialogLink").bind("click", handleDialogEvent); + $("#group-" + group_id + " .gDialogLink").galleryDialog()); }); } diff --git a/themes/admin_default/js/ui.init.js b/themes/admin_default/js/ui.init.js index 63b74300..eea3cab2 100644 --- a/themes/admin_default/js/ui.init.js +++ b/themes/admin_default/js/ui.init.js @@ -17,7 +17,7 @@ $(document).ready(function(){ $("#gMessage li").showMessage(); // Initialize modal dialogs - $(".gDialogLink").bind("click", handleDialogEvent); + $(".gDialogLink").galleryDialog(); // Initialize panels $(".gPanelLink").galleryPanel(); diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index ff76c79c..33d04328 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -34,7 +34,7 @@ $(document).ready(function() { // Initialize dialogs $(".gMenuLink").addClass("gDialogLink"); $("#gLoginLink").addClass("gDialogLink"); - $(".gDialogLink").bind("click", handleDialogEvent); + $(".gDialogLink").galleryDialog(); // Initialize view menu if ($("#gViewMenu").length) { -- cgit v1.2.3 From 445a8fb1b6b6f410d1ea432da6d704bf2f59a14d Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Sat, 8 Aug 2009 01:47:56 +0800 Subject: Change galleryPanel and galleryDialog widgets to gallery_panel and gallery_dialog respectively Signed-off-by: Bharat Mediratta --- lib/gallery.dialog.js | 8 ++++---- lib/gallery.panel.js | 2 +- modules/gallery/views/after_install.html.php | 2 +- modules/tag/js/tag.js | 2 +- modules/user/views/admin_users.html.php | 2 +- themes/admin_default/js/ui.init.js | 4 ++-- themes/default/js/ui.init.js | 2 +- 7 files changed, 11 insertions(+), 11 deletions(-) (limited to 'themes/default/js/ui.init.js') diff --git a/lib/gallery.dialog.js b/lib/gallery.dialog.js index 7e0ba1b4..04ab44de 100644 --- a/lib/gallery.dialog.js +++ b/lib/gallery.dialog.js @@ -1,5 +1,5 @@ (function($) { - $.widget("ui.galleryDialog", { + $.widget("ui.gallery_dialog", { _init: function() { var self = this; this.element.click(function(event){ @@ -12,7 +12,7 @@ $("body").append(eDialog); if (!self.options.close) { - self.options.close = self.closeDialog; + self.options.close = self.close_dialog; } $("#gDialog").dialog(self.options); @@ -91,7 +91,7 @@ ); }, - closeDialog: function (event, ui) { + close_dialog: function (event, ui) { var self = $("#gDialog").dialog("option", "self"); self.destroy(); }, @@ -124,7 +124,7 @@ dialog_closing: function(event, ui) {} }); - $.extend($.ui.galleryDialog, { + $.extend($.ui.gallery_dialog, { defaults: { autoOpen: false, autoResize: true, diff --git a/lib/gallery.panel.js b/lib/gallery.panel.js index 98d78d2a..e0bf4259 100644 --- a/lib/gallery.panel.js +++ b/lib/gallery.panel.js @@ -1,5 +1,5 @@ (function($) { - $.widget("ui.galleryPanel", { + $.widget("ui.gallery_panel", { _init: function() { var self = this; this.element.click(function(event) { diff --git a/modules/gallery/views/after_install.html.php b/modules/gallery/views/after_install.html.php index feb2d281..bfce46f0 100644 --- a/modules/gallery/views/after_install.html.php +++ b/modules/gallery/views/after_install.html.php @@ -16,7 +16,7 @@ title="" id="gAfterInstallChangePasswordLink" class="gButtonLink ui-state-default ui-corners-all">

diff --git a/modules/tag/js/tag.js b/modules/tag/js/tag.js index 535582c5..61ac73f4 100644 --- a/modules/tag/js/tag.js +++ b/modules/tag/js/tag.js @@ -23,7 +23,7 @@ function closeEditInPlaceForms() { $("#gRenameTagForm").parent().html($("#gRenameTagForm").parent().data("revert")); li.height(""); $(".gEditable", li).bind("click", editInPlace); - $(".gDialogLink", li).galleryDialog(); + $(".gDialogLink", li).gallery_dialog(); } } diff --git a/modules/user/views/admin_users.html.php b/modules/user/views/admin_users.html.php index a487d565..9bd4c068 100644 --- a/modules/user/views/admin_users.html.php +++ b/modules/user/views/admin_users.html.php @@ -28,7 +28,7 @@ {}, function(data) { $("#group-" + group_id).html(data); - $("#group-" + group_id + " .gDialogLink").galleryDialog()); + $("#group-" + group_id + " .gDialogLink").gallery_dialog(); }); } diff --git a/themes/admin_default/js/ui.init.js b/themes/admin_default/js/ui.init.js index eea3cab2..89dd5b47 100644 --- a/themes/admin_default/js/ui.init.js +++ b/themes/admin_default/js/ui.init.js @@ -17,10 +17,10 @@ $(document).ready(function(){ $("#gMessage li").showMessage(); // Initialize modal dialogs - $(".gDialogLink").galleryDialog(); + $(".gDialogLink").gallery_dialog(); // Initialize panels - $(".gPanelLink").galleryPanel(); + $(".gPanelLink").gallery_panel(); if ($("#gPhotoStream").length) { // Vertically align thumbs in photostream diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index 33d04328..4b876c66 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -34,7 +34,7 @@ $(document).ready(function() { // Initialize dialogs $(".gMenuLink").addClass("gDialogLink"); $("#gLoginLink").addClass("gDialogLink"); - $(".gDialogLink").galleryDialog(); + $(".gDialogLink").gallery_dialog(); // Initialize view menu if ($("#gViewMenu").length) { -- cgit v1.2.3 From e4eec71efa5f7b1902155a34f8655cebe523c358 Mon Sep 17 00:00:00 2001 From: Bharat Mediratta Date: Fri, 7 Aug 2009 11:53:40 -0700 Subject: Rename gallery.common.js functions to conform to our naming standards and have some basic namespacing: showMessage --> gallery_show_message vAlign --> gallery_valign showLoading --> gallery_show_loading Convert gallery.show_full_size.js to be a jQuery function and give it a namespace: show_full_size --> gallery_show_full_size --- lib/gallery.common.js | 9 +-- lib/gallery.dialog.js | 4 +- lib/gallery.show_full_size.js | 140 ++++++++++++++++++----------------- modules/organize/js/organize.js | 2 +- modules/organize/js/organize_init.js | 2 +- themes/admin_default/js/ui.init.js | 4 +- themes/default/js/ui.init.js | 6 +- themes/default/views/photo.html.php | 2 +- 8 files changed, 85 insertions(+), 84 deletions(-) (limited to 'themes/default/js/ui.init.js') diff --git a/lib/gallery.common.js b/lib/gallery.common.js index 7fced304..7e6acad9 100644 --- a/lib/gallery.common.js +++ b/lib/gallery.common.js @@ -1,5 +1,5 @@ (function ($) { - $.fn.showMessage = function(message) { + $.fn.gallery_show_message = function(message) { return this.each(function(i){ $(this).effect("highlight", {"color": "white"}, 3000); $(this).animate({opacity: 1.0}, 6000); @@ -7,7 +7,7 @@ }; // Vertically align a block element's content - $.fn.vAlign = function(container) { + $.fn.gallery_valign = function(container) { return this.each(function(i){ if (container == null) { container = 'div'; @@ -22,7 +22,7 @@ }; // Get the viewport size - $.getViewportSize = function() { + $.gallery_get_viewport_size = function() { return { width : function() { return $(window).width(); @@ -37,7 +37,7 @@ * Toggle the processing indicator, both large and small * @param elementID Target ID, including #, to apply .gLoadingSize */ - $.fn.showLoading = function() { + $.fn.gallery_show_loading = function() { return this.each(function(i){ var size; switch ($(this).attr("id")) { @@ -52,5 +52,4 @@ $(this).toggleClass("gLoading" + size); }); }; - })(jQuery); diff --git a/lib/gallery.dialog.js b/lib/gallery.dialog.js index 04ab44de..51ebb21a 100644 --- a/lib/gallery.dialog.js +++ b/lib/gallery.dialog.js @@ -16,10 +16,10 @@ } $("#gDialog").dialog(self.options); - $("#gDialog").showLoading(); + $("#gDialog").gallery_show_loading(); $.get(sHref, function(data) { - $("#gDialog").html(data).showLoading(); + $("#gDialog").html(data).gallery_show_loading(); if ($("#gDialog form").length) { self._trigger("form_loaded", null, $("#gDialog form")); diff --git a/lib/gallery.show_full_size.js b/lib/gallery.show_full_size.js index 8b271db9..c32195f6 100644 --- a/lib/gallery.show_full_size.js +++ b/lib/gallery.show_full_size.js @@ -1,76 +1,78 @@ -/** - * @todo Move inline CSS out to external style sheet (theme style sheet) - */ -var show_full_size = function(image_url, image_width, image_height) { - /* - * Calculate the size of the image panel based on the size of the image and the size of the - * window. Scale the image so the entire panel fits in the view port. - */ - function _auto_fit(imageWidth, imageHeight) { - // ui-dialog gives a padding of 2 pixels - var windowWidth = $(window).width() - 10; - var windowHeight = $(window).height() - 10; +(function($) { + /** + * @todo Move inline CSS out to external style sheet (theme style sheet) + */ + $.gallery_show_full_size = function(image_url, image_width, image_height) { + /* + * Calculate the size of the image panel based on the size of the image and the size of the + * window. Scale the image so the entire panel fits in the view port. + */ + function _auto_fit(imageWidth, imageHeight) { + // ui-dialog gives a padding of 2 pixels + var windowWidth = $(window).width() - 10; + var windowHeight = $(window).height() - 10; - /* If the width is greater then scale the image width first */ - if (imageWidth > windowWidth) { - var ratio = windowWidth / imageWidth; - imageWidth *= ratio; - imageHeight *= ratio; - } - /* after scaling the width, check that the height fits */ - if (imageHeight > windowHeight) { - var ratio = windowHeight / imageHeight; - imageWidth *= ratio; - imageHeight *= ratio; - } + /* If the width is greater then scale the image width first */ + if (imageWidth > windowWidth) { + var ratio = windowWidth / imageWidth; + imageWidth *= ratio; + imageHeight *= ratio; + } + /* after scaling the width, check that the height fits */ + if (imageHeight > windowHeight) { + var ratio = windowHeight / imageHeight; + imageWidth *= ratio; + imageHeight *= ratio; + } - // handle the case where the calculation is almost zero (2.14e-14) - return { - top: Number((windowHeight - imageHeight) / 2), - left: Number((windowWidth - imageWidth) / 2), - width: Number(imageWidth), - height: Number(imageHeight) - }; - } + // handle the case where the calculation is almost zero (2.14e-14) + return { + top: Number((windowHeight - imageHeight) / 2), + left: Number((windowWidth - imageWidth) / 2), + width: Number(imageWidth), + height: Number(imageHeight) + }; + } - var width = $(document).width(); - var height = $(document).height(); + var width = $(document).width(); + var height = $(document).height(); - $("body").append('
'); + $("body").append('
'); - var image_size = _auto_fit(image_width, image_height); + var image_size = _auto_fit(image_width, image_height); - $("body").append('
' + - '
'); + $("body").append('
' + + '
'); - $("#gFullsize").append(''); - $("#gFullsizeClose").click(function() { - $("#gFullsizeOverlay*").remove(); - $("#gFullsize").remove(); - }); - $(window).resize(function() { - $("#gFullsizeOverlay").width($(document).width()); - $("#gFullsizeOverlay").height($(document).height()); - image_size = _auto_fit(image_width, image_height); - $("#gFullsize").height(image_size.height); - $("#gFullsize").width(image_size.width); - $("#gFullsize").css("top", image_size.top); - $("#gFullsize").css("left", image_size.left); - $("#gFullSizeImage").height(image_size.height); - $("#gFullSizeImage").width(image_size.width); - }); -}; + $("#gFullsize").append(''); + $("#gFullsizeClose").click(function() { + $("#gFullsizeOverlay*").remove(); + $("#gFullsize").remove(); + }); + $(window).resize(function() { + $("#gFullsizeOverlay").width($(document).width()) + .height($(document).height()); + image_size = _auto_fit(image_width, image_height); + $("#gFullsize").height(image_size.height) + .width(image_size.width) + .css("top", image_size.top) + .css("left", image_size.left); + $("#gFullSizeImage").height(image_size.height) + .width(image_size.width); + }); + }; +})(jQuery); diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js index f10cbcc9..31657d3a 100644 --- a/modules/organize/js/organize.js +++ b/modules/organize/js/organize.js @@ -391,7 +391,7 @@ function organize_dialog_init() { $(".gBranchText").droppable(treeDroppable); $(".gBranchText").click(organizeOpenFolder); retrieveMicroThumbs(item_id); - //showLoading("#gDialog"); + //$.gallery_show_loading("#gDialog"); $("#gMicroThumbPanel").droppable(thumbDroppable); $("#gMicroThumbPanel").selectable(selectable); diff --git a/modules/organize/js/organize_init.js b/modules/organize/js/organize_init.js index ed036fdb..30bc78dd 100644 --- a/modules/organize/js/organize_init.js +++ b/modules/organize/js/organize_init.js @@ -17,7 +17,7 @@ $("document").ready(function() { zIndex: 75 }); - //showLoading("#gDialog"); + //$.gallery_show_loading("#gDialog"); $.get(href, function(data) { $("#gDialog").html(data); diff --git a/themes/admin_default/js/ui.init.js b/themes/admin_default/js/ui.init.js index 89dd5b47..e52f0c4c 100644 --- a/themes/admin_default/js/ui.init.js +++ b/themes/admin_default/js/ui.init.js @@ -14,7 +14,7 @@ $(document).ready(function(){ $("#gSiteAdminMenu").css("display", "block"); // Initialize status message effects - $("#gMessage li").showMessage(); + $("#gMessage li").gallery_show_message(); // Initialize modal dialogs $(".gDialogLink").gallery_dialog(); @@ -24,7 +24,7 @@ $(document).ready(function(){ if ($("#gPhotoStream").length) { // Vertically align thumbs in photostream - $(".gItem").vAlign(); + $(".gItem").gallery_valign(); } // Apply jQuery UI button css to submit inputs diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index 4b876c66..b8ad68db 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -29,7 +29,7 @@ $(document).ready(function() { $("#gSiteMenu").css("display", "block"); // Initialize status message effects - $("#gMessage li").showMessage(); + $("#gMessage li").gallery_show_message(); // Initialize dialogs $(".gMenuLink").addClass("gDialogLink"); @@ -53,9 +53,9 @@ $(document).ready(function() { // Album view only if ($("#gAlbumGrid").length) { // Vertical align thumbnails/metadata in album grid - $(".gItem").vAlign(); + $(".gItem").gallery_valign(); $(".gQuick").ajaxStop(function(){ - $(".gItem").vAlign(); + $(".gItem").gallery_valign(); }); } diff --git a/themes/default/views/photo.html.php b/themes/default/views/photo.html.php index bf4d9da3..48472170 100644 --- a/themes/default/views/photo.html.php +++ b/themes/default/views/photo.html.php @@ -5,7 +5,7 @@ + script("gallery.ajax.js") ?> script("gallery.dialog.js") ?> script("superfish/js/superfish.js") ?> script("jquery.dropshadow.js") ?> 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 @@ thumb_img(array("class" => "gThumbnail")) ?> thumb_bottom($child) ?> - context_menu($child) ?> + context_menu($child, "#gItemId-{$child->id} .gThumbnail") ?>

title) ?>