summaryrefslogtreecommitdiff
path: root/themes/default
diff options
context:
space:
mode:
Diffstat (limited to 'themes/default')
-rw-r--r--themes/default/css/fix-ie.css23
-rw-r--r--themes/default/css/screen.css167
-rw-r--r--themes/default/js/ui.init.js109
-rw-r--r--themes/default/theme.info6
-rw-r--r--themes/default/views/album.html.php2
-rw-r--r--themes/default/views/header.html.php26
-rw-r--r--themes/default/views/movie.html.php30
-rw-r--r--themes/default/views/page.html.php37
-rw-r--r--themes/default/views/photo.html.php3
9 files changed, 252 insertions, 151 deletions
diff --git a/themes/default/css/fix-ie.css b/themes/default/css/fix-ie.css
index 3d9604e6..eee88c15 100644
--- a/themes/default/css/fix-ie.css
+++ b/themes/default/css/fix-ie.css
@@ -1,26 +1,17 @@
/**
* Fix display in IE 6, 7
*/
-#gHeader,
-#gSiteMenu,
+
+#gBanner,
.gBreadcrumbs,
#gAlbumGrid,
#gPager,
-#gViewMenu {
+#gViewMenu {
zoom: 1;
}
-#gHeader #gLogo img {
- margin-top: 5px;
- margin-bottom: 0;
-}
-
-#gHeader #gSiteMenu {
- margin-top: 28px;
-}
-
-#gHeader #gQuickSearchForm {
- margin-bottom: 0;
+#gBanner {
+ z-index: 2;
}
input.submit {
@@ -44,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 41e51623..55839c57 100644
--- a/themes/default/css/screen.css
+++ b/themes/default/css/screen.css
@@ -131,7 +131,7 @@ fieldset {
padding-bottom: .8em;
}
-#gHeader fieldset,
+#gBanner fieldset,
#gSidebar fieldset,
.gShortForm fieldset {
border: none;
@@ -142,7 +142,7 @@ legend {
margin-left: 1em;
}
-#gHeader legend,
+#gBanner legend,
#gSidebar legend,
#gContent #gSearchForm legend,
input[type="hidden"],
@@ -387,16 +387,21 @@ form .gError,
/* Layout containers ~~~~~~~~~~~~~~~~~~~~~ */
#gHeader {
+ margin-bottom: 1em;
+}
+
+#gBanner {
background-color: #e8e8e8;
- border-bottom: 1px solid #fff;
+ border-bottom: 1px solid #ccc;
font-size: .8em;
- margin-bottom: 1em;
- padding: 1em 20px 0 20px;
+ padding: 1em 20px;
+ position: relative;
}
#gContent {
font-size: 1.2em;
padding-left: 20px;
+ position: relative;
width: 696px;
}
@@ -421,18 +426,17 @@ form .gError,
/* Header ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-#gHeader #gLogo img {
- float: left;
- margin: -4px 10px 0 0;
+#gBanner #gLogo img {
+ margin: 0;
}
-#gHeader #gQuickSearchForm {
+#gBanner #gQuickSearchForm {
clear: right;
float: right;
- margin: 1em 0;
+ margin-top: 1em;
}
-#gHeader #gQuickSearchForm input[type='text'] {
+#gBanner #gQuickSearchForm input[type='text'] {
width: 17em;
}
@@ -449,45 +453,74 @@ 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: 14px 8px;
+ padding: .6em 8px;
+ position: relative;
text-align: center;
width: 213px;
+ z-index: 1;
}
#gContent #gAlbumGrid .gItem h2 {
margin: 5px 0;
}
+#gContent .gPhoto h2,
+#gContent .gItem .gMetadata {
+ display: none;
+}
+
#gContent #gAlbumGrid .gAlbum {
background-color: #e8e8e8;
}
#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;
width: 16px;
}
+#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 {
+ display: block;
+}
+
/* Individual photo content ~~~~~~~~~~~~~~ */
#gContent #gItem {
+ position: relative;
width: 99%;
}
#gContent #gPhoto {
-
+ position: relative;
}
#gContent #gItem .gFullSizeLink img {
@@ -534,12 +567,12 @@ form .gError,
/* Footer content ~~~~~~~~~~~~~~~~~~~~~~~~ */
-#gHeader #gLoginMenu li,
+#gBanner #gLoginMenu li,
#gFooter #gCredits li {
display: inline;
}
-#gHeader #gLoginMenu li {
+#gBanner #gLoginMenu li {
padding-left: 1.2em;
}
@@ -557,14 +590,13 @@ form .gError,
*********************************************************************/
#gSiteMenu,
-.gBreadcrumbs,
#gTagCloud ul {
font-size: 1.2em;
}
/* Login menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-#gHeader #gLoginMenu {
+#gBanner #gLoginMenu {
color: #999;
float: right;
}
@@ -572,15 +604,63 @@ form .gError,
/* Site Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#gSiteMenu {
- float: left;
- margin-top: 20px;
- padding: 0 20px 0 0;
+ bottom: 0;
+ display: none;
+ left: 140px;
+ position: absolute;
}
#gSiteMenu ul {
- margin-bottom: 0;
+ margin-bottom: 0 !important;
}
+/* Context Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+
+.gContextMenu {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+}
+
+.gItem .gContextMenu {
+ display: none;
+ margin-top: 2em;
+ width: 100%;
+}
+
+#gItem .gContextMenu {
+ font-size: .7em;
+}
+
+#gItem .gContextMenu ul {
+ display: none;
+}
+
+.gContextMenu li {
+ border-left: none;
+ border-right: none;
+ border-bottom: none;
+}
+
+.gContextMenu li a {
+ display: block;
+ line-height: 1.6em;
+}
+
+#gHoverItem .gContextMenu {
+ display: block;
+}
+
+#gHoverItem .gContextMenu li {
+ text-align: left;
+}
+
+#gHoverItem .gContextMenu a:hover {
+ text-decoration: none;
+}
+
+/* View Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+
#gViewMenu {
margin-bottom: 1em;
}
@@ -615,11 +695,7 @@ form .gError,
/* Breadcrumbs ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.gBreadcrumbs {
- background-color: #fff;
- border-top: 1px solid #ccc;
- clear: both;
- margin: 0 -20px;
- padding-left: 20px;
+ padding: 0 20px;
}
.gBreadcrumbs li {
@@ -737,9 +813,7 @@ form .gError,
* 6) Browser hacks
*********************************************************************/
-#gSiteMenu:after,
#gHeader:after,
-.gBreadcrumbs:after,
#gAlbumGrid:after,
.gPager:after,
#gViewMenu:after {
@@ -797,7 +871,6 @@ form .gError,
.ui-widget-overlay {
background: #000;
opacity: .7;
- filter: Alpha(Opacity=70);
}
#gDialog {
@@ -879,24 +952,26 @@ form .gError,
/* Server Add */
-.gCheckboxTree input {
- display: inline;
+#gServerAdd button {
+ float: left;
+ margin-bottom: .5em;
}
-.gCheckboxTree li {
- padding: 0;
- float: none;
+#gServerAddTree {
+ cursor: pointer;
+ padding-left: 4px;
}
-.gCheckboxTree .ui-icon {
- cursor: pointer;
+#gServerAddTree li {
+ padding: 0;
+ float: none;
}
-.gFile {
- padding-left: 2.5em;
+#gServerAddTree span.selected {
+ background: #ddd;
}
-#gServerAdd #gServerAddTree {
+#gServerAddTree {
border: 1px solid #ccc;
height: 25em;
overflow: auto;
@@ -909,10 +984,6 @@ form .gError,
padding-left: 1.2em;
}
-#gServerAdd ul li .gFile {
- padding-left: 2.5em;
-}
-
#gServerAdd .gBreadcrumbs {
font-size: 1em;
padding: 0;
diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js
index 9d9d3079..2391f638 100644
--- a/themes/default/js/ui.init.js
+++ b/themes/default/js/ui.init.js
@@ -1,8 +1,5 @@
/**
- * Initialize jQuery UI and Plugin elements
- *
- * @todo Standardize how elements requiring listeners are handled
- * http://docs.jquery.com/Events/live
+ * Initialize jQuery UI and Gallery Plugin elements
*/
var shortForms = new Array(
@@ -26,15 +23,11 @@ $(document).ready(function() {
$("#gSiteMenu").css("display", "block");
// Initialize status message effects
- $("#gMessage li").showMessage();
+ $("#gMessage li").gallery_show_message();
// Initialize dialogs
- $(".gMenuLink").addClass("gDialogLink");
$("#gLoginLink").addClass("gDialogLink");
- var dialogLinks = $(".gDialogLink");
- for (var i=0; i < dialogLinks.length; i++) {
- $(dialogLinks[i]).bind("click", handleDialogEvent);
- }
+ $(".gDialogLink").gallery_dialog();
// Initialize view menu
if ($("#gViewMenu").length) {
@@ -50,21 +43,78 @@ $(document).ready(function() {
// Apply jQuery UI button css to submit inputs
$("input[type=submit]:not(.gShortForm input)").addClass("ui-state-default ui-corner-all");
+ // Apply styles and icon classes to gContextMenu
+ if ($(".gContextMenu").length) {
+ $(".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);
+ });
+ }
+
// Album view only
if ($("#gAlbumGrid").length) {
// Vertical align thumbnails/metadata in album grid
- $(".gItem").vAlign();
+ $(".gItem").gallery_valign();
+
+ // Initialize context menus
+ $(".gItem").hover(
+ function(){
+ 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("<div id=\"gHoverItem\"><div class=\"" + item_classes + "\">"
+ + $(this).html() + "</div></div>");
+ $("#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");
+ 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();
+ }
+ );
+ }
+ );
}
- // Photo/Item item view only
+ // Photo/Item item view
if ($("#gItem").length) {
- // Ensure that sized image versions
- // fit inside their container
- sizedImage();
+ // Ensure the resized image fits within its container
+ $("#gItem").gallery_fit_photo();
+
+ // Initialize context menus
+ var resize = $("#gItem").gallery_get_photo();
+ $(resize).hover(function(){
+ $(this).gallery_context_menu();
+ });
// 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(){
@@ -78,32 +128,9 @@ $(document).ready(function() {
duration: 1000,
hash: true
});
-
}
- // Add hover state for buttons
- $(".ui-state-default").hover(
- function(){
- $(this).addClass("ui-state-hover");
- },
- function(){
- $(this).removeClass("ui-state-hover");
- }
- );
+ // Initialize button hover effect
+ $.fn.gallery_hover_init();
});
-
-/**
- * Reduce width of sized photo if it's wider than its parent container
- */
-function sizedImage() {
- var containerWidth = $("#gItem").width();
- var oPhoto = $("#gItem img").filter(function() {
- return this.id.match(/gPhotoId-/);
- });
- if (containerWidth < oPhoto.width()) {
- var proportion = containerWidth / oPhoto.width();
- oPhoto.width(containerWidth);
- oPhoto.height(proportion * oPhoto.height());
- }
-}
diff --git a/themes/default/theme.info b/themes/default/theme.info
index 71e8a740..5f19d0d7 100644
--- a/themes/default/theme.info
+++ b/themes/default/theme.info
@@ -1,6 +1,6 @@
-name = Gallery Default
-description = A crisp and distinctive theme that uses large fonts and icons for easy navigation and an enjoyable browsing experience.
+name = "Gallery Default"
+description = "A crisp and distinctive theme that uses large fonts and icons for easy navigation and an enjoyable browsing experience."
version = 1
-author = Gallery Team
+author = "Gallery Team"
site = 1
admin = 0
diff --git a/themes/default/views/album.html.php b/themes/default/views/album.html.php
index 65ea3381..e2890482 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, "#gItemId-{$child->id} .gThumbnail") ?>
<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/header.html.php b/themes/default/views/header.html.php
index 5428d9fd..2ba1e923 100644
--- a/themes/default/views/header.html.php
+++ b/themes/default/views/header.html.php
@@ -1,19 +1,19 @@
<?php defined("SYSPATH") or die("No direct script access.") ?>
-<?= $theme->header_top() ?>
-<? if ($header_text = module::get_var("gallery", "header_text")): ?>
-<?= $header_text ?>
-<? else: ?>
-<a id="gLogo" href="<?= url::site("albums/1") ?>" title="<?= t("go back to the Gallery home") ?>">
- <img width="107" height="48" alt="<?= t("Gallery logo: Your photos on your web site") ?>" src="<?= $theme->theme_url("images/logo.png") ?>" />
-</a>
-<? endif ?>
-
-<div id="gSiteMenu" style="display: none">
-<?= $theme->site_menu() ?>
+<div id="gBanner">
+ <?= $theme->header_top() ?>
+ <? if ($header_text = module::get_var("gallery", "header_text")): ?>
+ <?= $header_text ?>
+ <? else: ?>
+ <a id="gLogo" href="<?= url::site("albums/1") ?>" title="<?= t("go back to the Gallery home") ?>">
+ <img width="107" height="48" alt="<?= t("Gallery logo: Your photos on your web site") ?>" src="<?= $theme->url("images/logo.png") ?>" />
+ </a>
+ <? endif ?>
+ <div id="gSiteMenu">
+ <?= $theme->site_menu() ?>
+ </div>
+ <?= $theme->header_bottom() ?>
</div>
-<?= $theme->header_bottom() ?>
-
<? if (!empty($parents)): ?>
<ul class="gBreadcrumbs">
<? foreach ($parents as $parent): ?>
diff --git a/themes/default/views/movie.html.php b/themes/default/views/movie.html.php
index 66c80ded..c8ecd769 100644
--- a/themes/default/views/movie.html.php
+++ b/themes/default/views/movie.html.php
@@ -2,16 +2,29 @@
<div id="gItem">
<?= $theme->photo_top() ?>
- <ul id="gPager">
- <li><?= t("%position of %total", array("position" => $position, "total" => $sibling_count)) ?></li>
- <? if ($previous_item): ?>
- <li><span class="ui-icon ui-icon-seek-prev"></span><a href="<?= $previous_item->url() ?>"><?= t("previous") ?></a></li>
- <? endif ?>
- <? if ($next_item): ?>
- <li><a href="<?= $next_item->url() ?>"><?= t("next") ?></a><span class="ui-icon ui-icon-seek-next"></span></li>
- <? endif ?>
+ <ul class="gPager">
+ <li>
+ <? if ($previous_item): ?>
+ <a href="<?= $previous_item->url() ?>" class="gButtonLink ui-icon-left ui-state-default ui-corner-all">
+ <span class="ui-icon ui-icon-triangle-1-w"></span><?= t("previous") ?></a>
+ <? else: ?>
+ <a class="gButtonLink ui-icon-left ui-state-disabled ui-corner-all">
+ <span class="ui-icon ui-icon-triangle-1-w"></span><?= t("previous") ?></a>
+ <? endif; ?>
+ </li>
+ <li class="gInfo"><?= t("%position of %total", array("position" => $position, "total" => $sibling_count)) ?></li>
+ <li class="txtright">
+ <? if ($next_item): ?>
+ <a href="<?= $next_item->url() ?>" class="gButtonLink ui-icon-right ui-state-default ui-corner-all">
+ <span class="ui-icon ui-icon-triangle-1-e"></span><?= t("next") ?></a>
+ <? else: ?>
+ <a class="gButtonLink ui-icon-right ui-state-disabled ui-corner-all">
+ <span class="ui-icon ui-icon-triangle-1-e"></span><?= t("next") ?></a>
+ <? endif ?>
+ </li>
</ul>
+
<?= $item->movie_img(array("class" => "gMovie", "id" => "gMovieId-{$item->id}")) ?>
<div id="gInfo">
@@ -23,4 +36,5 @@
var ADD_A_COMMENT = "<?= t("Add a comment") ?>";
</script>
<?= $theme->photo_bottom() ?>
+ <?= $theme->context_menu($item, "#gMovieId-{$item->id}") ?>
</div>
diff --git a/themes/default/views/page.html.php b/themes/default/views/page.html.php
index 181a2c46..2cb71b9e 100644
--- a/themes/default/views/page.html.php
+++ b/themes/default/views/page.html.php
@@ -23,13 +23,13 @@
<? endif ?>
<? endif ?>
</title>
- <link rel="shortcut icon" href="<?= $theme->theme_url("images/favicon.ico") ?>" type="image/x-icon" />
- <?= $theme->css("lib/yui/reset-fonts-grids.css") ?>
- <?= $theme->css("lib/superfish/css/superfish.css") ?>
- <?= $theme->css("lib/themeroller/ui.base.css") ?>
- <?= $theme->theme_css("css/screen.css") ?>
+ <link rel="shortcut icon" href="<?= $theme->url("images/favicon.ico") ?>" type="image/x-icon" />
+ <?= $theme->css("yui/reset-fonts-grids.css") ?>
+ <?= $theme->css("superfish/css/superfish.css") ?>
+ <?= $theme->css("themeroller/ui.base.css") ?>
+ <?= $theme->css("screen.css") ?>
<!--[if lt IE 8]>
- <link rel="stylesheet" type="text/css" href="<?= $theme->theme_url("css/fix-ie.css") ?>"
+ <link rel="stylesheet" type="text/css" href="<?= $theme->url("css/fix-ie.css") ?>"
media="screen,print,projection" />
<![endif]-->
<? if ($theme->page_type == 'album'): ?>
@@ -45,26 +45,27 @@
</style>
<? endif ?>
<? endif ?>
- <?= $theme->script("lib/jquery.js") ?>
- <?= $theme->script("lib/jquery.form.js") ?>
- <?= $theme->script("lib/jquery-ui.js") ?>
- <?= $theme->script("lib/gallery.common.js") ?>
+ <?= $theme->script("jquery.js") ?>
+ <?= $theme->script("jquery.form.js") ?>
+ <?= $theme->script("jquery-ui.js") ?>
+ <?= $theme->script("gallery.common.js") ?>
<? /* MSG_CANCEL is required by gallery.dialog.js */ ?>
<script type="text/javascript">
var MSG_CANCEL = "<?= t('Cancel') ?>";
</script>
- <?= $theme->script("lib/gallery.dialog.js") ?>
- <?= $theme->script("lib/gallery.form.js") ?>
- <?= $theme->script("lib/superfish/js/superfish.js") ?>
- <?= $theme->script("lib/jquery.localscroll.js") ?>
- <?= $theme->theme_script("js/ui.init.js") ?>
+ <?= $theme->script("gallery.ajax.js") ?>
+ <?= $theme->script("gallery.dialog.js") ?>
+ <?= $theme->script("gallery.form.js") ?>
+ <?= $theme->script("superfish/js/superfish.js") ?>
+ <?= $theme->script("jquery.localscroll.js") ?>
+ <?= $theme->script("ui.init.js") ?>
<? /* These are page specific, but if we put them before $theme->head() they get combined */ ?>
<? if ($theme->page_type == "photo"): ?>
- <?= $theme->script("lib/jquery.scrollTo.js") ?>
- <?= $theme->script("lib/gallery.show_full_size.js") ?>
+ <?= $theme->script("jquery.scrollTo.js") ?>
+ <?= $theme->script("gallery.show_full_size.js") ?>
<? elseif ($theme->page_type == "movie"): ?>
- <?= $theme->script("lib/flowplayer.js") ?>
+ <?= $theme->script("flowplayer.js") ?>
<? endif ?>
<?= $theme->head() ?>
diff --git a/themes/default/views/photo.html.php b/themes/default/views/photo.html.php
index bf4d9da3..fa5def47 100644
--- a/themes/default/views/photo.html.php
+++ b/themes/default/views/photo.html.php
@@ -5,7 +5,7 @@
<script>
$(document).ready(function() {
$(".gFullSizeLink").click(function() {
- show_full_size("<?= $theme->item()->file_url() ?>", "<?= $theme->item()->width ?>", "<?= $theme->item()->height ?>");
+ $.gallery_show_full_size("<?= $theme->item()->file_url() ?>", "<?= $theme->item()->width ?>", "<?= $theme->item()->height ?>");
return false;
});
});
@@ -47,6 +47,7 @@
</a>
<? endif ?>
<?= $theme->resize_bottom($item) ?>
+ <?= $theme->context_menu($item, "#gPhotoId-{$item->id}") ?>
</div>
<div id="gInfo">