summaryrefslogtreecommitdiff
path: root/themes
diff options
context:
space:
mode:
Diffstat (limited to 'themes')
-rw-r--r--themes/default/css/fix-ie.css4
-rw-r--r--themes/default/css/screen.css66
-rw-r--r--themes/default/js/ui.init.js75
-rw-r--r--themes/default/views/album.html.php2
-rw-r--r--themes/default/views/movie.html.php1
-rw-r--r--themes/default/views/photo.html.php1
6 files changed, 106 insertions, 43 deletions
diff --git a/themes/default/css/fix-ie.css b/themes/default/css/fix-ie.css
index c7c1ebad..eee88c15 100644
--- a/themes/default/css/fix-ie.css
+++ b/themes/default/css/fix-ie.css
@@ -35,7 +35,3 @@ input.submit {
.gPager .ui-icon-right {
width: 60px;
}
-
-.gQuickPane {
- height: 32px !important;
-} \ No newline at end of file
diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css
index c5a9956d..05d2977a 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 {
@@ -586,26 +621,35 @@ form .gError,
margin-bottom: 0 !important;
}
-/* Thumb Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+/* Context Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-#gContent .gThumbMenu {
+.gContextMenu {
bottom: 0;
+ display: none;
left: 0;
position: absolute;
width: 100%;
}
-#gContent .gThumbMenu li {
+.gContextMenu li {
border-left: none;
border-right: none;
border-bottom: none;
}
-#gContent .gThumbMenu li li {
- padding: .3em;
+.gContextMenu li a {
+ line-height: 1.6em;
+}
+
+#gHoverItem .gContextMenu {
+ display: block;
+}
+
+#gHoverItem .gContextMenu li {
+ text-align: left;
}
-#gContent .gThumbMenu 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 b8ad68db..91d90b45 100644
--- a/themes/default/js/ui.init.js
+++ b/themes/default/js/ui.init.js
@@ -32,7 +32,6 @@ $(document).ready(function() {
$("#gMessage li").gallery_show_message();
// Initialize dialogs
- $(".gMenuLink").addClass("gDialogLink");
$("#gLoginLink").addClass("gDialogLink");
$(".gDialogLink").gallery_dialog();
@@ -54,8 +53,13 @@ $(document).ready(function() {
if ($("#gAlbumGrid").length) {
// Vertical align thumbnails/metadata in album grid
$(".gItem").gallery_valign();
- $(".gQuick").ajaxStop(function(){
- $(".gItem").gallery_valign();
+ // Apply styles to gContextMenu
+ $(".gContextMenu li").addClass("ui-state-default");
+ $(".gContextMenu a").addClass("gButtonLink ui-icon-left");
+ $(".gContextMenu a").prepend("<span class=\"ui-icon\"></span>");
+ $(".gContextMenu a span").each(function() {
+ var iconClass = $(this).parent().attr("class").match(/ui-icon-.[^\s]*/).toString();
+ $(this).addClass(iconClass);
});
}
@@ -67,7 +71,9 @@ $(document).ready(function() {
// Collapse comments form, insert button to expand
if ($("#gAddCommentForm").length) {
- var showCommentForm = '<a href="#add_comment_form" class="showCommentForm gButtonLink ui-corner-all ui-icon-left ui-state-default right"><span class="ui-icon ui-icon-comment"></span>' + ADD_A_COMMENT + '</a>';
+ var showCommentForm = '<a href="#add_comment_form"'
+ + ' class="showCommentForm gButtonLink ui-corner-all ui-icon-left ui-state-default right">'
+ + '<span class="ui-icon ui-icon-comment"></span>' + ADD_A_COMMENT + '</a>';
$("#gAddCommentForm").hide();
$("#gComments").prepend(showCommentForm);
$(".showCommentForm").click(function(){
@@ -94,29 +100,44 @@ $(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(
- function() {
- $(this).find("ul").slideDown("fast");
- },
- function() {
- $(this).find("ul").slideUp("slow");
- }
- );
- }
+ // Initialize context menus
+ // @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();
+ $("#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
+ $(".gContextMenu ul").hide();
+ $(".gContextMenu").hover(
+ function() {
+ $(this).find("ul").slideDown("fast");
+ var dialogLinks = $(this).find(".gDialogLink");
+ $(dialgoLinks).gallery_dialog();
+ },
+ function() {
+ $(this).find("ul").slideUp("slow");
+ }
+ );
+ },
+ function() {
+ $(this).hide();
+ }
+ );
+ },
+ function(){
+ }
+ );
});
diff --git a/themes/default/views/album.html.php b/themes/default/views/album.html.php
index 65ea3381..ce57458e 100644
--- a/themes/default/views/album.html.php
+++ b/themes/default/views/album.html.php
@@ -19,7 +19,7 @@
<?= $child->thumb_img(array("class" => "gThumbnail")) ?>
</a>
<?= $theme->thumb_bottom($child) ?>
- <?= $theme->thumb_menu($child) ?>
+ <?= $theme->context_menu($child) ?>
<h2><span></span><a href="<?= $child->url() ?>"><?= p::clean($child->title) ?></a></h2>
<ul class="gMetadata">
<?= $theme->thumb_info($child) ?>
diff --git a/themes/default/views/movie.html.php b/themes/default/views/movie.html.php
index c90a370c..d255922b 100644
--- a/themes/default/views/movie.html.php
+++ b/themes/default/views/movie.html.php
@@ -36,4 +36,5 @@
var ADD_A_COMMENT = "<?= t("Add a comment") ?>";
</script>
<?= $theme->photo_bottom() ?>
+ <?= $theme->context_menu($item) ?>
</div>
diff --git a/themes/default/views/photo.html.php b/themes/default/views/photo.html.php
index 48472170..453417dc 100644
--- a/themes/default/views/photo.html.php
+++ b/themes/default/views/photo.html.php
@@ -47,6 +47,7 @@
</a>
<? endif ?>
<?= $theme->resize_bottom($item) ?>
+ <?= $theme->context_menu($item) ?>
</div>
<div id="gInfo">