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/css/screen.css | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index c5a9956d..eb092b83 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -588,24 +588,25 @@ form .gError, /* Thumb Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -#gContent .gThumbMenu { +#gContent .gContextMenu { bottom: 0; left: 0; position: absolute; width: 100%; + display: none; } -#gContent .gThumbMenu li { +#gContent .gContextMenu li { border-left: none; border-right: none; border-bottom: none; } -#gContent .gThumbMenu li li { +#gContent .gContextMenu li li { padding: .3em; } -#gContent .gThumbMenu a:hover { +#gContent .gContextMenu a:hover { text-decoration: none; } -- cgit v1.2.3 From 6357f3332b9bc33b10c11dc93b83ba9e72eec109 Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Sat, 8 Aug 2009 01:14:22 -0600 Subject: Added basic context menu affects and styles. Simplified some of the action labels in the menu. --- modules/digibug/helpers/digibug_event.php | 18 ++++----- modules/gallery/helpers/gallery.php | 30 ++++++++------- themes/default/css/screen.css | 64 ++++++++++++++++++++++++++----- themes/default/js/ui.init.js | 63 +++++++++++++++++++++++------- 4 files changed, 128 insertions(+), 47 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/modules/digibug/helpers/digibug_event.php b/modules/digibug/helpers/digibug_event.php index efe66a0f..93bc1747 100644 --- a/modules/digibug/helpers/digibug_event.php +++ b/modules/digibug/helpers/digibug_event.php @@ -28,19 +28,19 @@ class digibug_event_Core { static function photo_menu($menu, $theme) { $item = $theme->item(); - $menu->append( - Menu::factory("link") - ->id("digibug") - ->label(t("Print with Digibug")) - ->url(url::site("digibug/print_photo/$item->id?csrf=$theme->csrf")) - ->css_id("gDigibugLink")); + $menu->get("options_menu") + ->append(Menu::factory("link") + ->id("digibug") + ->label(t("Print with Digibug")) + ->url(url::site("digibug/print_photo/$item->id?csrf=$theme->csrf")) + ->css_id("gDigibugLink")); } static function context_menu($menu, $theme, $item) { + $item = $theme->item(); if ($item->type == "photo") { - $menu - ->append( - Menu::factory("link") + $menu->get("options_menu") + ->append(Menu::factory("link") ->id("digibug") ->label(t("Print with Digibug")) ->url(url::site("digibug/print_photo/$item->id?csrf=$theme->csrf")) diff --git a/modules/gallery/helpers/gallery.php b/modules/gallery/helpers/gallery.php index 085965a2..72e7aeeb 100644 --- a/modules/gallery/helpers/gallery.php +++ b/modules/gallery/helpers/gallery.php @@ -201,28 +201,30 @@ class gallery_Core { switch ($item->type) { case "movie": $edit_title = t("Edit this movie"); - $move_title = t("Move this movie to another album"); - $cover_title = t("Choose this movie as the album cover"); $delete_title = t("Delete this movie"); break; case "album": $edit_title = t("Edit this album"); - $move_title = t("Move this album to another album"); - $cover_title = t("Choose this album as the album cover"); $delete_title = t("Delete this album"); break; default: $edit_title = t("Edit this photo"); - $move_title = t("Move this photo to another album"); - $cover_title = t("Choose this photo as the album cover"); $delete_title = t("Delete this photo"); break; } + $cover_title = t("Choose as the album cover"); + $move_title = t("Move to another album"); $csrf = access::csrf_token(); - $menu->append(Menu::factory("dialog") + + $menu->append($options_menu = Menu::factory("submenu") + ->id("options") + ->label(t("Options")) + ->css_class("ui-icon-carat-1-n")); + + $options_menu->append(Menu::factory("dialog") ->id("edit") ->label($edit_title) ->css_clasS("ui-icon-pencil") @@ -230,22 +232,22 @@ class gallery_Core { if ($item->is_photo() && graphics::can("rotate")) { - $menu + $options_menu ->append(Menu::factory("link") ->id("rotate_ccw") - ->label(t("Rotate 90 degrees counter clockwise")) + ->label(t("Rotate 90° counter clockwise")) ->css_class("ui-icon-rotate-ccw") ->url(url::site("quick/rotate/$item->id/ccw?csrf=$csrf&page_type=$page_type"))) ->append(Menu::factory("link") ->id("rotate_cw") - ->label(t("Rotate 90 degrees clockwise")) + ->label(t("Rotate 90° clockwise")) ->css_class("ui-icon-rotate-cw") ->url(url::site("quick/rotate/$item->id/cw?csrf=$csrf&page_type=$page_type"))); } // Don't move photos from the photo page; we don't yet have a good way of redirecting after move if ($page_type == "album") { - $menu + $options_menu ->append(Menu::factory("dialog") ->id("move") ->label($move_title) @@ -264,11 +266,11 @@ class gallery_Core { } else { $disabledState = " "; } - $menu + $options_menu ->append(Menu::factory("link") ->id("make_album_cover") ->label($cover_title) - ->css_class($disabledState) + ->css_class("ui-icon-star") ->url( url::site("quick/make_album_cover/$item->id?csrf=$csrf&page_type=$page_type"))) ->append(Menu::factory("dialog") @@ -280,7 +282,7 @@ class gallery_Core { } if ($item->is_album()) { - $menu + $options_menu ->append(Menu::factory("dialog") ->id("add_item") ->label(t("Add a photo")) diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index eb092b83..1cb813f3 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -453,26 +453,32 @@ form .gError, #gContent #gAlbumGrid { margin: 1em 0; + position: relative; + z-index: 1; } #gContent #gAlbumGrid .gItem { - border: 1px solid #e8e8e8; - border-right-color: #ccc; - border-bottom-color: #ccc; + background-color: #fff; + border: 1px solid #fff; float: left; font-size: .7em; - height: 240px; + height: 220px; overflow: hidden; - padding: 15px 8px 30px 8px; + padding: .6em 8px; position: relative; text-align: center; width: 213px; + z-index: 1; } #gContent #gAlbumGrid .gItem h2 { margin: 5px 0; } +.gPhoto h2, .gItem .gMetadata { + display: none; +} + #gContent #gAlbumGrid .gAlbum { background-color: #e8e8e8; } @@ -485,6 +491,35 @@ form .gError, width: 16px; } +#gContent #gAlbumGrid #gHoverItem { + background-color: #fff; + border: 1px solid #000; + display: none; + height: auto; + margin-top: -1em; + margin-left: -.4em; + padding: 0; + position: absolute; + width: auto; + z-index: 100; +} + +#gContent #gAlbumGrid #gHoverItem .gItem { + float: none; + height: 210px; + margin: 0; + padding: 0 1em 3em; +} + +#gContent #gAlbumGrid #gHoverItem .gItem div { + margin-top: 1em !important; +} + +#gHoverItem .gItem h2, +#gHoverItem .gItem .gMetadata { + display: block; +} + /* Individual photo content ~~~~~~~~~~~~~~ */ #gContent #gItem { @@ -588,25 +623,34 @@ form .gError, /* Thumb Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -#gContent .gContextMenu { +.gContextMenu { bottom: 0; + display: none; left: 0; position: absolute; width: 100%; - display: none; } -#gContent .gContextMenu li { +.gContextMenu li { border-left: none; border-right: none; border-bottom: none; } -#gContent .gContextMenu li li { +.gContextMenu li li { padding: .3em; } -#gContent .gContextMenu a:hover { + +#gHoverItem .gContextMenu { + display: block; +} + +#gHoverItem .gContextMenu li { + text-align: left; +} + +#gHoverItem .gContextMenu a:hover { text-decoration: none; } diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index 6414cbcc..b3c1d514 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -96,21 +96,56 @@ $(document).ready(function() { ); // Initialize context menus - if ($("#gContent .gContextMenu").length) { - $("#gContent .gContextMenu li").addClass("ui-state-default"); - $(".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); + // @todo Switch Options icon to carat-1-s when menu's open + // @todo apply hover affect to links + $(".gItem").hover( + function(){ + var pos = $(this).position(); + var itemClasses = $(this).attr("class"); + var bgColor = $(this).css("background-color"); + var cont = $(this).parent(); + var iconSpan = ""; + $("#gHoverItem .ui-icon-carat-1-n").html(iconSpan + $("#gHoverItem .ui-icon-carat-1-n").html()); + + $("#gHoverItem").remove(); + cont.append("
" + + $(this).html() + "
"); + $("#gHoverItem").css("top", pos.top); + $("#gHoverItem").css("left", pos.left); + $("#gHoverItem").css("background-color", bgColor); + $("#gHoverItem").fadeIn("fast"); + $("#gHoverItem").hover( + function(){ + // Initialize context menus + $("#gContent .gContextMenu li").addClass("ui-state-default"); + $(".gContextMenu ul").hide(); + $(".gContextMenu").hover( + function() { + $(this).find("ul").slideDown("fast"); + var optLinks = $(this).find("a"); + for (var i = 0; i < optLinks.length; i++) { + var iconClass = $(optLinks[i]).attr("class").match(/ui-icon-.[^\s]*/); + iconSpan = ""; + $(optLinks[i]).html(iconSpan + $(optLinks[i]).html()); + if ($(optLinks[i]).hasClass("gDialogLink")) { + $(optLinks[i]).bind("click", handleDialogEvent); + } + } + $("#gContent .gContextMenu li a").addClass("gButtonLink ui-icon-left"); + }, + function() { + $(this).find("ul").slideUp("slow"); + } + ); + }, + function() { + $(this).hide(); } - }, - function() { - $(this).find(".gContextMenu").slideUp("slow"); - } - ); - } + ); + }, + function(){ + } + ); }); -- cgit v1.2.3 From 3a8f1f426294737aac145d15462caa808aef14b1 Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Sat, 8 Aug 2009 13:20:00 -0600 Subject: Cleanup context menu styles a bit --- themes/default/css/screen.css | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 1cb813f3..05d2977a 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -621,7 +621,7 @@ form .gError, margin-bottom: 0 !important; } -/* Thumb Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ +/* Context Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .gContextMenu { bottom: 0; @@ -637,11 +637,10 @@ form .gError, border-bottom: none; } -.gContextMenu li li { - padding: .3em; +.gContextMenu li a { + line-height: 1.6em; } - #gHoverItem .gContextMenu { display: block; } -- cgit v1.2.3 From 1231e095c824ed9961b1156d89f6a1cae231f96f Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Sun, 9 Aug 2009 12:46:17 -0600 Subject: Keep image placement from shifting on hover, set gHoverItem height properly. --- themes/default/css/screen.css | 21 +++++++-------------- themes/default/js/ui.init.js | 38 +++++++++++++++++++++++++++++--------- 2 files changed, 36 insertions(+), 23 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 05d2977a..6a29e95f 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -475,7 +475,8 @@ form .gError, margin: 5px 0; } -.gPhoto h2, .gItem .gMetadata { +#gContent .gPhoto h2, +#gContent .gItem .gMetadata { display: none; } @@ -484,7 +485,7 @@ form .gError, } #gContent #gAlbumGrid .gAlbum h2 span { - background: transparent url('../images/ico-album.png') no-repeat top left !important; + background: transparent url('../images/ico-album.png') no-repeat top left; display: inline-block; height: 16px; margin-right: 5px; @@ -496,8 +497,6 @@ form .gError, border: 1px solid #000; display: none; height: auto; - margin-top: -1em; - margin-left: -.4em; padding: 0; position: absolute; width: auto; @@ -505,18 +504,11 @@ form .gError, } #gContent #gAlbumGrid #gHoverItem .gItem { - float: none; - height: 210px; - margin: 0; - padding: 0 1em 3em; -} - -#gContent #gAlbumGrid #gHoverItem .gItem div { - margin-top: 1em !important; + border: none; } -#gHoverItem .gItem h2, -#gHoverItem .gItem .gMetadata { +#gContent #gHoverItem .gItem h2, +#gContent #gHoverItem .gItem .gMetadata { display: block; } @@ -627,6 +619,7 @@ form .gError, bottom: 0; display: none; left: 0; + margin-top: 2em; position: absolute; width: 100%; } diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index 29680a48..9d8acf28 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -86,7 +86,6 @@ $(document).ready(function() { duration: 1000, hash: true }); - } // Add hover state for buttons @@ -103,16 +102,30 @@ $(document).ready(function() { // @todo apply hover affect to links $(".gItem").hover( function(){ - var pos = $(this).position(); - var itemClasses = $(this).attr("class"); - var bgColor = $(this).css("background-color"); - var cont = $(this).parent(); + var position = $(this).position(); + var item_classes = $(this).attr("class"); + var bg_color = $(this).css("background-color"); + var container = $(this).parent(); $("#gHoverItem").remove(); - cont.append("
" + container.append("
" + $(this).html() + "
"); - $("#gHoverItem").css("top", pos.top); - $("#gHoverItem").css("left", pos.left); - $("#gHoverItem").css("background-color", bgColor); + $("#gHoverItem").css("top", position.top); + $("#gHoverItem").css("left", position.left); + $("#gHoverItem").css("background-color", bg_color); + + var v_align = $(this).find(".gValign"); + var title = $(this).find("h2"); + var meta = $(this).find(".gMetadata"); + var context = $(this).find(".gContextMenu"); + var context_label = $(this).find(".gContextMenu li:first"); + $("#gHoverItem .gItem").height( + $(v_align).gallery_height() + + $(title).gallery_height() + + $(meta).gallery_height() + + parseInt($(context).css("margin-top").replace("px","")) + + $(context_label).gallery_height() + ); + $("#gHoverItem").fadeIn("fast"); $("#gHoverItem").hover( function(){ @@ -138,4 +151,11 @@ $(document).ready(function() { } ); + $.fn.gallery_height = function() { + var ht = $(this).height(); + var mt = $(this).css("margin-top").replace("px",""); + var mb = $(this).css("margin-bottom").replace("px",""); + return ht + parseInt(mt) + parseInt(mb); + }; + }); -- cgit v1.2.3 From cea1d4f1f3d295284f3ba19f0d73bb2785b6ed29 Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Sun, 9 Aug 2009 23:32:53 -0600 Subject: Forgot to commit the css for the resize photo view context menu. --- themes/default/css/screen.css | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 6a29e95f..5ab9083d 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -515,6 +515,7 @@ form .gError, /* Individual photo content ~~~~~~~~~~~~~~ */ #gContent #gItem { + position: relative; width: 99%; } @@ -616,14 +617,25 @@ form .gError, /* Context Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .gContextMenu { + position: absolute; bottom: 0; - display: none; left: 0; +} + +.gItem .gContextMenu { + display: none; margin-top: 2em; - position: absolute; width: 100%; } +#gItem .gContextMenu { + font-size: .7em; +} + +#gItem .gContextMenu ul { + display: none; +} + .gContextMenu li { border-left: none; border-right: none; -- cgit v1.2.3 From 99d7a0c0dbb799ba64d769475a1534650e98e5b6 Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Tue, 11 Aug 2009 00:33:15 -0600 Subject: Make each context menu button clickable from side-to-side --- themes/default/css/screen.css | 1 + 1 file changed, 1 insertion(+) (limited to 'themes/default/css/screen.css') diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 5ab9083d..55839c57 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -643,6 +643,7 @@ form .gError, } .gContextMenu li a { + display: block; line-height: 1.6em; } -- cgit v1.2.3 From 3d2e36f5b601b5a274efd0c55bf161448409682a Mon Sep 17 00:00:00 2001 From: jhilden Date: Thu, 27 Aug 2009 20:34:42 -0400 Subject: fixed CSS bug in the simple uploader #629 and improved permissions UI to include breadcrumbs (consistent with the uploader dialog) --- modules/gallery/views/permissions_browse.html.php | 42 +++++++++++------------ themes/default/css/screen.css | 19 ++++++---- 2 files changed, 34 insertions(+), 27 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/modules/gallery/views/permissions_browse.html.php b/modules/gallery/views/permissions_browse.html.php index 888a27f7..f990896c 100644 --- a/modules/gallery/views/permissions_browse.html.php +++ b/modules/gallery/views/permissions_browse.html.php @@ -5,8 +5,9 @@ $.ajax({ url: form_url.replace("__ITEM__", id), success: function(data) { - $("div.form").slideUp(); - $("div#edit-" + id).html(data).slideDown(); + $("#gEditPermissionForm").html(data); + $(".active").removeClass("active"); + $("#item-" + id).addClass("active"); } }); } @@ -18,7 +19,7 @@ url: action_url.replace("__CMD__", cmd).replace("__GROUP__", group_id). replace("__PERM__", perm_id).replace("__ITEM__", item_id), success: function(data) { - $("div#edit-" + item_id).load(form_url.replace("__ITEM__", item_id)); + $("#gEditPermissionForm").load(form_url.replace("__ITEM__", item_id)); } }); } @@ -31,26 +32,25 @@ -
+ +
+ +
+
\ No newline at end of file diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 55839c57..ecae2bb2 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -718,7 +718,7 @@ form .gError, font-weight: bold; } -#gAddPhotos .gBreadcrumbs { +#gDialog .gBreadcrumbs li { font-size: .9em; } @@ -901,6 +901,10 @@ form .gError, display: none; } +#gDialog p { + margin: 0; +} + /* jQuery UI ThemeRoller buttons */ .gButtonLink { @@ -1001,6 +1005,14 @@ form .gError, /* Permissions ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ +#gEditPermissionForm { + clear: both; +} +#gEditPermissionForm fieldset { + border: 1px solid #cccccc; + padding: 0; +} + #gPermissions .gDenied, #gPermissions .gAllowed { text-align: center; @@ -1022,11 +1034,6 @@ form .gError, display: inline-block; } -#gAddPhotos p { - margin: 0; - padding: 0; -} - #gAddPhotosCanvas { height: 325px; width: 450px; -- cgit v1.2.3 From f1e008a14f2dfb51d1204dad3deb19e2e3df16c8 Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Fri, 28 Aug 2009 13:47:35 -0600 Subject: Don't clone hover item, apply styles to the original container. Contextual menu rotates are now immediately visible. Fixes ticket 667. --- themes/default/css/screen.css | 23 +++++------------ themes/default/js/ui.init.js | 60 ++++++++++++++++++++++--------------------- 2 files changed, 37 insertions(+), 46 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 55839c57..cc5f6bcb 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -406,7 +406,6 @@ form .gError, } #gSidebar { - background-color: #fff; font-size: .9em; padding: 0 20px; width: 220px; @@ -492,23 +491,13 @@ form .gError, width: 16px; } -#gContent #gAlbumGrid #gHoverItem { +#gContent #gAlbumGrid .gHoverItem { background-color: #fff; border: 1px solid #000; - display: none; - height: auto; - padding: 0; - position: absolute; - width: auto; - z-index: 100; -} - -#gContent #gAlbumGrid #gHoverItem .gItem { - border: none; } -#gContent #gHoverItem .gItem h2, -#gContent #gHoverItem .gItem .gMetadata { +#gContent .gHoverItem h2, +#gContent .gHoverItem .gMetadata { display: block; } @@ -647,15 +636,15 @@ form .gError, line-height: 1.6em; } -#gHoverItem .gContextMenu { +.gHoverItem .gContextMenu { display: block; } -#gHoverItem .gContextMenu li { +.gHoverItem .gContextMenu li { text-align: left; } -#gHoverItem .gContextMenu a:hover { +.gHoverItem .gContextMenu a:hover { text-decoration: none; } diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index 2391f638..006d74bb 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -62,39 +62,41 @@ $(document).ready(function() { // Initialize context menus $(".gItem").hover( function(){ + // Insert invisible placeholder to hold the item's position in the grid + var placeHolder = $(this).clone(); + $(placeHolder).attr("id", "gPlaceHolder"); + $(placeHolder).css("visibility", "hidden"); + $(this).after($(placeHolder)); + // Style and position the item + $(this).addClass("gHoverItem"); var position = $(this).position(); - var item_classes = $(this).attr("class"); - var bg_color = $(this).css("background-color"); - var container = $(this).parent(); - $("#gHoverItem").remove(); - container.append("
" - + $(this).html() + "
"); - $("#gHoverItem").css("top", position.top); - $("#gHoverItem").css("left", position.left); - $("#gHoverItem").css("background-color", bg_color); - $.fn.gallery_hover_init(); - var v_align = $(this).find(".gValign"); + $(this).css("position", "absolute"); + $(this).css("top", position.top); + $(this).css("left", position.left); + $(this).css("z-index", "1000"); + // Initialize the contextual menu + $(this).gallery_context_menu(); + // Set height based on height of descendents var title = $(this).find("h2"); var meta = $(this).find(".gMetadata"); - var context = $(this).find(".gContextMenu"); var context_label = $(this).find(".gContextMenu li:first"); - $("#gHoverItem .gItem").height( - $(v_align).gallery_height() - + $(title).gallery_height() - + $(meta).gallery_height() - + parseInt($(context).css("margin-top").replace("px","")) - + $(context_label).gallery_height() - ); - - $("#gHoverItem").fadeIn("fast"); - $("#gHoverItem").hover( - function(){ - $(this).gallery_context_menu(); - }, - function() { - $(this).hide(); - } - ); + var item_ht = $(this).height(); + var title_ht = $(title).gallery_height(); + var meta_ht = $(meta).gallery_height(); + var context_label_ht = $(context_label).gallery_height(); + $(this).height(item_ht + title_ht + meta_ht + context_label_ht); + }, + function() { + // Reset item height, position, and z-index + var sib_height = $(this).next().height(); + $(this).css("height", sib_height); + $(this).css("position", "relative"); + $(this).css("top", null); + $(this).css("left", null); + $(this).css("z-index", null); + // Remove the placeholder and hover class from the item + $("#gPlaceHolder").remove(); + $(this).removeClass("gHoverItem"); } ); } -- cgit v1.2.3 From 1d5262f9c354a8564f05a8a31b915ad479f4d361 Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Fri, 28 Aug 2009 13:44:01 -0700 Subject: Fix ticket #591: reCaptcha always on the page. 1) move creating the "Add a comment" button into the comments.html.php 2) use $.get() to retrieve the comment add form --- modules/comment/helpers/comment_theme.php | 2 -- modules/comment/js/comment.js | 10 +++++++++- modules/comment/views/comments.html.php | 10 ++++++++-- themes/default/css/screen.css | 7 +++++++ themes/default/js/ui.init.js | 12 ------------ themes/default/views/movie.html.php | 3 --- themes/default/views/photo.html.php | 3 --- 7 files changed, 24 insertions(+), 23 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/modules/comment/helpers/comment_theme.php b/modules/comment/helpers/comment_theme.php index b807e2cf..38a00b5c 100644 --- a/modules/comment/helpers/comment_theme.php +++ b/modules/comment/helpers/comment_theme.php @@ -26,7 +26,6 @@ class comment_theme_Core { static function photo_bottom($theme) { $block = new Block; $block->css_id = "gComments"; - $block->anchor = t("comments"); $block->title = t("Comments"); $view = new View("comments.html"); @@ -37,7 +36,6 @@ class comment_theme_Core { ->find_all(); $block->content = $view; - $block->content .= comment::get_add_form($theme->item())->render("form.html"); return $block; } } \ No newline at end of file diff --git a/modules/comment/js/comment.js b/modules/comment/js/comment.js index 00fc6027..9fd63c1a 100644 --- a/modules/comment/js/comment.js +++ b/modules/comment/js/comment.js @@ -1,5 +1,13 @@ $("document").ready(function() { - ajaxify_comment_form(); + $("#gAddCommentButton").click(function(event) { + event.preventDefault(); + $.get($(this).attr("href"), + {}, + function(data) { + $("#gCommentDetail").append(data); + ajaxify_comment_form(); + }); + }); }); function ajaxify_comment_form() { diff --git a/modules/comment/views/comments.html.php b/modules/comment/views/comments.html.php index f7251389..6dce9971 100644 --- a/modules/comment/views/comments.html.php +++ b/modules/comment/views/comments.html.php @@ -1,11 +1,17 @@ + id})") ?>" id="gAddCommentButton" + class="gButtonLink ui-corner-all ui-icon-left ui-state-default right"> + + + +
count()): ?>

comment!", array("attrs" => "href=\"#add_comment_form\" class=\"showCommentForm\"")) ?>

-
    +

    • @@ -26,4 +32,4 @@

    - +
diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index ecae2bb2..481581a2 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -530,6 +530,7 @@ form .gError, #gContent #gComments { margin-top: 2em; + position: relative; } #gContent #gComments ul li { @@ -561,6 +562,12 @@ form .gError, width: 32px; } +#gAddCommentButton { + position: absolute; + right: 0; + top: 2px; +} + #gContent #gAddCommentForm { margin-top: 2em; } diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index 2391f638..67cdb968 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -110,18 +110,6 @@ $(document).ready(function() { $(this).gallery_context_menu(); }); - // Collapse comments form, insert button to expand - if ($("#gAddCommentForm").length) { - var showCommentForm = '' - + '' + ADD_A_COMMENT + ''; - $("#gAddCommentForm").hide(); - $("#gComments").prepend(showCommentForm); - $(".showCommentForm").click(function(){ - $("#gAddCommentForm").show(1000); - }); - } - // Add scroll effect for links to named anchors $.localScroll({ queue: true, diff --git a/themes/default/views/movie.html.php b/themes/default/views/movie.html.php index c8ecd769..29789f8e 100644 --- a/themes/default/views/movie.html.php +++ b/themes/default/views/movie.html.php @@ -32,9 +32,6 @@
description)) ?>
- photo_bottom() ?> context_menu($item, "#gMovieId-{$item->id}") ?> diff --git a/themes/default/views/photo.html.php b/themes/default/views/photo.html.php index fa5def47..39e61ef6 100644 --- a/themes/default/views/photo.html.php +++ b/themes/default/views/photo.html.php @@ -55,8 +55,5 @@
description)) ?>
- photo_bottom() ?> -- cgit v1.2.3 From c428e49f3273f04fd220107b4992e6177aa1b265 Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Fri, 28 Aug 2009 15:24:21 -0600 Subject: Make gMessage 100% of the width of its container. --- themes/admin_default/css/screen.css | 2 +- themes/default/css/screen.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/themes/admin_default/css/screen.css b/themes/admin_default/css/screen.css index 88631e81..062c0e41 100644 --- a/themes/admin_default/css/screen.css +++ b/themes/admin_default/css/screen.css @@ -276,7 +276,7 @@ li.gError select { /* Status messages ~~~~~~~~~~~~~~~~~~~~~~~ */ #gMessage { - width: 99%; + width: 100%; } #gAdminAkismet .gSuccess, diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 26339e35..8a8f634a 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -276,7 +276,7 @@ li.gError select { /* Status messages ~~~~~~~~~~~~~~~~~~~~~~~ */ #gMessage { - width: 99%; + width: 100%; } #gAdminAkismet .gSuccess, -- cgit v1.2.3 From 5db0b68a70434a16d8881a6e560a9526530a8a60 Mon Sep 17 00:00:00 2001 From: Chad Kieffer Date: Sat, 29 Aug 2009 14:01:04 -0600 Subject: Update status message styles. Lighten backgrounds, don't show background on Admin Maintenance rows, and added gModuleStatus class. --- modules/akismet/views/admin_akismet.html.php | 2 +- modules/comment/views/admin_comments.html.php | 2 +- modules/gallery/views/admin_graphics_gd.html.php | 12 ++-- .../views/admin_graphics_graphicsmagick.html.php | 10 +-- .../views/admin_graphics_imagemagick.html.php | 10 +-- modules/gallery/views/admin_graphics_none.html.php | 5 +- modules/gallery/views/admin_maintenance.html.php | 16 +++-- modules/gallery/views/admin_modules.html.php | 2 +- themes/admin_default/css/admin_screen.css | 9 ++- themes/admin_default/css/screen.css | 80 ++++++++++------------ themes/default/css/screen.css | 60 +++++----------- 11 files changed, 92 insertions(+), 116 deletions(-) (limited to 'themes/default/css/screen.css') diff --git a/modules/akismet/views/admin_akismet.html.php b/modules/akismet/views/admin_akismet.html.php index 410902a5..009d8810 100644 --- a/modules/akismet/views/admin_akismet.html.php +++ b/modules/akismet/views/admin_akismet.html.php @@ -8,7 +8,7 @@

-
+
diff --git a/modules/comment/views/admin_comments.html.php b/modules/comment/views/admin_comments.html.php index 9fe7164b..03511d91 100644 --- a/modules/comment/views/admin_comments.html.php +++ b/modules/comment/views/admin_comments.html.php @@ -103,7 +103,7 @@ $comment): ?> - "> + "> " diff --git a/modules/gallery/views/admin_graphics_gd.html.php b/modules/gallery/views/admin_graphics_gd.html.php index aa9ee67c..010a31b4 100644 --- a/modules/gallery/views/admin_graphics_gd.html.php +++ b/modules/gallery/views/admin_graphics_gd.html.php @@ -7,26 +7,24 @@ array("url" => "http://www.boutell.com/gd")) ?>

installed && $tk->rotate): ?> -

+

$tk->version)) ?> -

+

installed): ?> - error): ?> -

+

error ?>

-

-

+

-

+
diff --git a/modules/gallery/views/admin_graphics_graphicsmagick.html.php b/modules/gallery/views/admin_graphics_graphicsmagick.html.php index bf3ad339..97624850 100644 --- a/modules/gallery/views/admin_graphics_graphicsmagick.html.php +++ b/modules/gallery/views/admin_graphics_graphicsmagick.html.php @@ -1,21 +1,21 @@
installed ? " gInstalledToolkit" : " gUnavailable" ?>"> -

" alt="" /> +

GraphicsMagick website for more information.", array("url" => "http://www.graphicsmagick.org")) ?>

installed): ?> -

+

$tk->version, "dir" => $tk->dir)) ?> -

+

-

+

error ?> -

+
diff --git a/modules/gallery/views/admin_graphics_imagemagick.html.php b/modules/gallery/views/admin_graphics_imagemagick.html.php index b8f7ffb8..cdff7c2c 100644 --- a/modules/gallery/views/admin_graphics_imagemagick.html.php +++ b/modules/gallery/views/admin_graphics_imagemagick.html.php @@ -1,21 +1,21 @@
installed ? " gInstalledToolkit" : " gUnavailable" ?>"> -

" alt="" /> +

ImageMagick website for more information.", array("url" => "http://www.imagemagick.org")) ?>

installed): ?> -

+

$tk->version, "dir" => $tk->dir)) ?> -

+

error): ?> -

+

error ?> -

+
diff --git a/modules/gallery/views/admin_graphics_none.html.php b/modules/gallery/views/admin_graphics_none.html.php index be2a580d..e6923a5a 100644 --- a/modules/gallery/views/admin_graphics_none.html.php +++ b/modules/gallery/views/admin_graphics_none.html.php @@ -1,6 +1,7 @@ -
-

+ +
+

diff --git a/modules/gallery/views/admin_maintenance.html.php b/modules/gallery/views/admin_maintenance.html.php index 450eb754..3649ea58 100644 --- a/modules/gallery/views/admin_maintenance.html.php +++ b/modules/gallery/views/admin_maintenance.html.php @@ -7,7 +7,7 @@

- +
+ - + "> @@ -34,17 +35,18 @@ +
@@ -19,8 +19,9 @@
name ?>
count()): ?>
-

" class="gButtonLink ui-icon-left ui-state-default ui-corner-all right"> +

+ - "> + "> @@ -105,6 +108,7 @@ +
@@ -66,8 +68,9 @@
updated) ?>
@@ -138,8 +142,9 @@ + - "> + "> updated) ?> @@ -183,6 +188,7 @@ +
diff --git a/modules/gallery/views/admin_modules.html.php b/modules/gallery/views/admin_modules.html.php index 3fddd6cd..168e20d0 100644 --- a/modules/gallery/views/admin_modules.html.php +++ b/modules/gallery/views/admin_modules.html.php @@ -16,7 +16,7 @@ $module_info): ?> - "> + "> $module_name); ?> locked) $data["disabled"] = 1; ?> diff --git a/themes/admin_default/css/admin_screen.css b/themes/admin_default/css/admin_screen.css index 913631dc..7e468442 100644 --- a/themes/admin_default/css/admin_screen.css +++ b/themes/admin_default/css/admin_screen.css @@ -35,13 +35,12 @@ .gSelected img, .gAvailable .gBlock img { float: left; - margin-right: 1em; + margin: 0 1em 1em 0; } .rtl .gSelected img, .rtl .gAvailable .gBlock img { float: right; - margin-left: 1em; } .gSelected { @@ -202,7 +201,7 @@ #gAdminGraphics .gAvailable .gBlock { clear: none; float: left; - height: 16em; + height: 17em; margin-right: 1em; width: 30%; } @@ -263,8 +262,8 @@ li.gGroup { } li.gGroup h4 { - background-color: #EEEEEE; - border-bottom: 1px dashed #CCCCCC; + background-color: #eee; + border-bottom: 1px dashed ccc; padding: .5em 0 .5em .5em; } li.gGroup .gButtonLink { diff --git a/themes/admin_default/css/screen.css b/themes/admin_default/css/screen.css index 062c0e41..c275eb10 100644 --- a/themes/admin_default/css/screen.css +++ b/themes/admin_default/css/screen.css @@ -108,7 +108,7 @@ table { } #gContent table { - margin: 1em 0; + margin: 1em 0 3em 0; } caption, @@ -124,6 +124,10 @@ td { vertical-align: top; } +#gAdminMaintenance td { + vertical-align: middle; +} + /* Forms ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ fieldset { @@ -279,9 +283,9 @@ li.gError select { width: 100%; } -#gAdminAkismet .gSuccess, #gSiteStatus li, -#gMessage li { +#gMessage li, +.gModuleStatus { border: 1px solid #ccc; margin-bottom: .4em; } @@ -292,71 +296,62 @@ li.gError select { border-bottom: 1px solid #ccc; } -#gSiteStatus .gError, -#gMessage .gError, -form p.gError, -#gSiteStatus .gInfo, -#gMessage .gInfo, -#gSiteStatus .gSuccess, -#gMessage .gSuccess, -#gSiteStatus .gWarning, -#gMessage .gWarning { +.gModuleStatus { + clear: both; + margin-bottom: 1em; +} + +.gError, +.gInfo, +.gSuccess, +.gWarning { background-position: .4em 50%; background-repeat: no-repeat; padding: .4em .5em .4em 30px; } .gError { - background-color: #fcc; -} - -form .gError { - color: #f00; -} - -#gSiteStatus .gError, -#gMessage .gError, -form p.gError { + background-color: #f6cbca; + color: red; background-image: url('../images/ico-error.png'); } .gInfo { background-color: #e8e8e8; -} - -#gSiteStatus .gInfo, -#gMessage .gInfo { background-image: url('../images/ico-info.png'); } .gSuccess { - background-color: #96EF95; -} - -#gSiteStatus .gSuccess, -#gMessage .gSuccess { + background-color: #d9efc2; background-image: url('../images/ico-success.png'); } .gWarning { - background-color: #ff9; + background-color: #fcf9ce; + background-image: url('../images/ico-warning.png'); } -#gSiteStatus .gWarning, -#gMessage .gWarning { - background-image: url('../images/ico-warning.png'); +table .gError { + background-color: #f6cbca !important; +} + +table .gWarning { + background-color: #fcf9ce !important; } +.gPager .gInfo, form .gError, -.gPager .gInfo { - background-color: #fff; +table .gInfo, +table .gSuccess { + background-color: transparent !important; } -#gAdminMaintenance .gError, -#gAdminMaintenance .gInfo, -#gAdminMaintenance .gWarning, -#gAdminMaintenance .gSuccess { - background-image: none; +.gPager .gInfo, +table .gError, +table .gInfo, +table .gSuccess, +table .gWarning { + background-image: none !important; } /* Inline layout (forms, lists) ~~~~~~~~~~ */ @@ -823,7 +818,6 @@ form .gError, .ui-widget-overlay { background: #000; opacity: .7; - filter: Alpha(Opacity=70); } #gDialog { diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index d39152e4..82cdb331 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -279,9 +279,9 @@ li.gError select { width: 100%; } -#gAdminAkismet .gSuccess, #gSiteStatus li, -#gMessage li { +#gMessage li, +.gModuleStatus { border: 1px solid #ccc; margin-bottom: .4em; } @@ -292,71 +292,49 @@ li.gError select { border-bottom: 1px solid #ccc; } -#gSiteStatus .gError, -#gMessage .gError, -form p.gError, -#gSiteStatus .gInfo, -#gMessage .gInfo, -#gSiteStatus .gSuccess, -#gMessage .gSuccess, -#gSiteStatus .gWarning, -#gMessage .gWarning { +.gModuleStatus { + clear: both; + margin-bottom: 1em; +} + +.gError, +.gInfo, +.gSuccess, +.gWarning { background-position: .4em 50%; background-repeat: no-repeat; padding: .4em .5em .4em 30px; } .gError { - background-color: #fcc; -} - -form .gError { - color: #f00; -} - -#gSiteStatus .gError, -#gMessage .gError, -form p.gError { + background-color: #f6cbca; + color: #fc0; background-image: url('../images/ico-error.png'); } .gInfo { background-color: #e8e8e8; -} - -#gSiteStatus .gInfo, -#gMessage .gInfo { background-image: url('../images/ico-info.png'); } .gSuccess { - background-color: #96EF95; -} - -#gSiteStatus .gSuccess, -#gMessage .gSuccess { + background-color: #d9efc2; background-image: url('../images/ico-success.png'); } .gWarning { - background-color: #ff9; -} - -#gSiteStatus .gWarning, -#gMessage .gWarning { + background-color: #fcf9ce; background-image: url('../images/ico-warning.png'); } form .gError, .gPager .gInfo { - background-color: #fff; + background-color: #fff !important; } -#gAdminMaintenance .gError, -#gAdminMaintenance .gInfo, -#gAdminMaintenance .gWarning, -#gAdminMaintenance .gSuccess { - background-image: none; +.gPager .gInfo { + background-image: none !important; + padding: 0 !important; } /* Inline layout (forms, lists) ~~~~~~~~~~ */ -- cgit v1.2.3