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 = '';
+ var showCommentForm = '';
$("#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="= t("Edit Your Profile") ?>"
id="gAfterInstallChangePasswordLink" class="gButtonLink ui-state-default ui-corners-all">= t("Change Password Now") ?>
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 @@
= t("Add") ?>
-