summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--modules/digibug/helpers/digibug_event.php18
-rw-r--r--modules/gallery/helpers/gallery.php30
-rw-r--r--themes/default/css/screen.css64
-rw-r--r--themes/default/js/ui.init.js63
4 files changed, 128 insertions, 47 deletions
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 = "<span class=\"ui-icon ui-icon-carat-1-n\"></span>";
+ $("#gHoverItem .ui-icon-carat-1-n").html(iconSpan + $("#gHoverItem .ui-icon-carat-1-n").html());
+
+ $("#gHoverItem").remove();
+ cont.append("<div id=\"gHoverItem\"><div class=\"" + itemClasses + "\">"
+ + $(this).html() + "</div></div>");
+ $("#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 = "<span class=\"ui-icon " + iconClass + "\"></span>";
+ $(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(){
+ }
+ );
});