From a302a9c3fa7ec8d11373dc5eeb9c94400a255b1a Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Fri, 7 Aug 2009 23:58:57 +0800 Subject: Refactor the gallery dialog into a jQuery widget Signed-off-by: Bharat Mediratta --- themes/admin_default/js/ui.init.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'themes/admin_default/js/ui.init.js') 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(); -- 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/admin_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/admin_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 @@