summaryrefslogtreecommitdiff
path: root/themes/default
diff options
context:
space:
mode:
Diffstat (limited to 'themes/default')
-rw-r--r--themes/default/css/fix-ie.css4
-rw-r--r--themes/default/css/screen.css155
-rw-r--r--themes/default/js/ui.init.js147
-rw-r--r--themes/default/views/album.html.php2
-rw-r--r--themes/default/views/movie.html.php33
-rw-r--r--themes/default/views/page.html.php1
-rw-r--r--themes/default/views/photo.html.php6
7 files changed, 186 insertions, 162 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..82cdb331 100644
--- a/themes/default/css/screen.css
+++ b/themes/default/css/screen.css
@@ -276,12 +276,12 @@ li.gError select {
/* Status messages ~~~~~~~~~~~~~~~~~~~~~~~ */
#gMessage {
- width: 99%;
+ 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) ~~~~~~~~~~ */
@@ -406,7 +384,6 @@ form .gError,
}
#gSidebar {
- background-color: #fff;
font-size: .9em;
padding: 0 20px;
width: 220px;
@@ -453,41 +430,59 @@ 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;
}
+#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;
+}
+
+#gContent .gHoverItem h2,
+#gContent .gHoverItem .gMetadata {
+ display: block;
+}
+
/* Individual photo content ~~~~~~~~~~~~~~ */
#gContent #gItem {
+ position: relative;
width: 99%;
}
@@ -502,6 +497,7 @@ form .gError,
#gContent #gComments {
margin-top: 2em;
+ position: relative;
}
#gContent #gComments ul li {
@@ -533,6 +529,12 @@ form .gError,
width: 32px;
}
+#gAddCommentButton {
+ position: absolute;
+ right: 0;
+ top: 2px;
+}
+
#gContent #gAddCommentForm {
margin-top: 2em;
}
@@ -586,26 +588,48 @@ form .gError,
margin-bottom: 0 !important;
}
-/* Thumb Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+/* Context Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
-#gContent .gThumbMenu {
+.gContextMenu {
+ position: absolute;
bottom: 0;
left: 0;
- position: absolute;
+}
+
+.gItem .gContextMenu {
+ display: none;
+ margin-top: 2em;
width: 100%;
}
-#gContent .gThumbMenu li {
+#gItem .gContextMenu {
+ font-size: .7em;
+}
+
+#gItem .gContextMenu ul {
+ display: none;
+}
+
+.gContextMenu li {
border-left: none;
border-right: none;
border-bottom: none;
}
-#gContent .gThumbMenu li li {
- padding: .3em;
+.gContextMenu li a {
+ display: block;
+ line-height: 1.6em;
+}
+
+.gHoverItem .gContextMenu {
+ display: block;
}
-#gContent .gThumbMenu a:hover {
+.gHoverItem .gContextMenu li {
+ text-align: left;
+}
+
+.gHoverItem .gContextMenu a:hover {
text-decoration: none;
}
@@ -668,7 +692,7 @@ form .gError,
font-weight: bold;
}
-#gAddPhotos .gBreadcrumbs {
+#gDialog .gBreadcrumbs li {
font-size: .9em;
}
@@ -851,6 +875,10 @@ form .gError,
display: none;
}
+#gDialog p {
+ margin: 0;
+}
+
/* jQuery UI ThemeRoller buttons */
.gButtonLink {
@@ -951,6 +979,14 @@ form .gError,
/* Permissions ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
+#gEditPermissionForm {
+ clear: both;
+}
+#gEditPermissionForm fieldset {
+ border: 1px solid #cccccc;
+ padding: 0;
+}
+
#gPermissions .gDenied,
#gPermissions .gAllowed {
text-align: center;
@@ -972,11 +1008,6 @@ form .gError,
display: inline-block;
}
-#gAddPhotos p {
- margin: 0;
- padding: 0;
-}
-
#gAddPhotosCanvas {
height: 325px;
width: 450px;
diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js
index 11cd06ed..949933e9 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(
@@ -13,9 +10,6 @@ var shortForms = new Array(
$(document).ready(function() {
- // Remove .gMenu from thumb menu's before initializing Superfish
- // @todo gallery_menu should only apply gMenu to top-level menus, submenus should be gSubMenu-N
-
// Initialize Superfish menus
$("ul.gMenu").addClass("sf-menu");
$('ul.sf-menu').superfish({
@@ -29,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) {
@@ -53,30 +43,74 @@ $(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();
- $(".gQuick").ajaxStop(function(){
- $(".gItem").vAlign();
- });
+ $(".gItem").gallery_valign();
+
+ // 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();
+ $(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_label = $(this).find(".gContextMenu li:first");
+ 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");
+ }
+ );
}
- // Photo/Item item view only
+ // Photo/Item item view
if ($("#gItem").length) {
- // Ensure that sized image versions
- // fit inside their container
- sizedImage();
-
- // 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>';
- $("#gAddCommentForm").hide();
- $("#gComments").prepend(showCommentForm);
- $(".showCommentForm").click(function(){
- $("#gAddCommentForm").show(1000);
- });
- }
+ // 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();
+ });
// Add scroll effect for links to named anchors
$.localScroll({
@@ -84,56 +118,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 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 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/views/album.html.php b/themes/default/views/album.html.php
index ffb4b913..8c690f5f 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() ?>"><?= SafeString::of($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 75d51eff..237743b7 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">
@@ -19,8 +32,6 @@
<div><?= nl2br(SafeString::purify($item->description)) ?></div>
</div>
- <script type="text/javascript">
- var ADD_A_COMMENT = "<?= t("Add a comment")->for_js() ?>";
- </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 8d9f0caa..844ef295 100644
--- a/themes/default/views/page.html.php
+++ b/themes/default/views/page.html.php
@@ -53,6 +53,7 @@
<script type="text/javascript">
var MSG_CANCEL = "<?= t('Cancel')->for_js() ?>";
</script>
+ <?= $theme->script("gallery.ajax.js") ?>
<?= $theme->script("gallery.dialog.js") ?>
<?= $theme->script("gallery.form.js") ?>
<?= $theme->script("superfish/js/superfish.js") ?>
diff --git a/themes/default/views/photo.html.php b/themes/default/views/photo.html.php
index fcf597cf..5b5cb12b 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()->for_js() ?>", "<?= $theme->item()->width ?>", "<?= $theme->item()->height ?>");
+ $.gallery_show_full_size("<?= $theme->item()->file_url()->for_js() ?>", "<?= $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">
@@ -54,8 +55,5 @@
<div><?= nl2br(SafeString::purify($item->description)) ?></div>
</div>
- <script type="text/javascript">
- var ADD_A_COMMENT = "<?= t("Add a comment")->for_js() ?>";
- </script>
<?= $theme->photo_bottom() ?>
</div>