summaryrefslogtreecommitdiff
path: root/modules/organize
diff options
context:
space:
mode:
Diffstat (limited to 'modules/organize')
-rw-r--r--modules/organize/controllers/organize.php2
-rw-r--r--modules/organize/css/organize.css86
-rw-r--r--modules/organize/css/organize_edit_drawer.pngbin0 -> 464 bytes
-rw-r--r--modules/organize/js/organize.js55
-rw-r--r--modules/organize/js/organize_init.js2
-rw-r--r--modules/organize/views/organize.html.php62
-rw-r--r--modules/organize/views/organize_button_pane.html.php21
-rw-r--r--modules/organize/views/organize_edit.html.php20
8 files changed, 174 insertions, 74 deletions
diff --git a/modules/organize/controllers/organize.php b/modules/organize/controllers/organize.php
index 89315323..62a23444 100644
--- a/modules/organize/controllers/organize.php
+++ b/modules/organize/controllers/organize.php
@@ -31,7 +31,7 @@ class Organize_Controller extends Controller {
$v->album_tree = $this->tree($item, $root);
$v->edit_form = new View("organize_edit.html");
- $v->edit_form->button_pane = new View("organize_button_pane.html");
+ $v->button_pane = new View("organize_button_pane.html");
print $v;
}
diff --git a/modules/organize/css/organize.css b/modules/organize/css/organize.css
index 0a66d0ad..1e5e90ed 100644
--- a/modules/organize/css/organize.css
+++ b/modules/organize/css/organize.css
@@ -3,17 +3,22 @@
* Dialog wide stylings
*/
#gOrganizeStatus {
- height: 6em;
- border: 1px solid #999;
- margin-top: .5em;
- margin-bottom: .5em;
- overflow-y: auto;
+ height: 1.2em;
+ font-weight: bold;
}
#gOrganizeProgressDialog {
text-align: left;
}
+#gDialog .yui-gf div.first {
+ width: 20%;
+}
+
+#gDialog .yui-gf .yui-u {
+ width: 80%;
+}
+
/*******************************************************************
* Album Tree styling
*/
@@ -59,6 +64,13 @@
/*******************************************************************
* Album Panel Styles
*/
+
+#gMicroThumbUnselectAll,
+#gMicroThumbSelectAll {
+ font-size: 1em;
+ font-weight: bold;
+}
+
#gMicroThumbPanel {
margin: 0 !important;
padding: 0 !important;
@@ -67,7 +79,8 @@
border-top: none !important;
border-left: none !important;
margin-left: -1em !important;
- overflow: auto;
+ overflow-x: hidden;
+ overflow-y: auto;
}
#gMicroThumbGrid {
@@ -76,9 +89,6 @@
.gMicroThumbContainer {
display: block;
- //border: 2px solid #e8e8e8;
- //border-right-color: #ccc;
- //border-bottom-color: #ccc;
float: left;
font-size: .7em;
height: 9em;
@@ -128,11 +138,65 @@
/****************************************************************
- * Organize Edit styling
+ * Organize Edit Drawer styling
*/
+#gOrganizeEditDrawer {
+ background-color: #13A;
+ float: left;
+ margin: 0 5% 10px;
+ width: 90%;
+}
+
+#gOrganizeEditDrawerPanel {
+ background-color: #CFDEFF;
+ border: 1px solid #13A;
+ display: none;
+ min-height: 150px;
+}
+
+#gOrganizeEditHandleLeft {
+ background-image: url(organize_edit_drawer.png);
+ background-color: #CFDEFF;
+ float: left;
+ height: 30px;
+ margin: 2px 0 0;
+ width: 15px;
+}
+
+#gOrganizeEditHandleButtonsLeft {
+ float: left;
+ height: 20px;
+ padding: 2px 10px;
+}
+
+#gOrganizeEditHandleButtonsLeft a {
+ float: left;
+ margin: 0 2.5px;
+}
+
+#gOrganizeEditHandleButtonsRight {
+ float: right;
+ height: 20px;
+ padding: 2px 10px;
+}
+
+#gOrganizeEditHandleButtonsRight a {
+ float: left;
+ margin: 0 2.5px;
+}
+
+#gOrganizeEditHandleRight {
+ background-color: #CFDEFF;
+ background-image: url(organize_edit_drawer.png);
+ background-position: -15px 0;
+ float: right;
+ height: 30px;
+ margin: 2px 0 0;
+ width: 15px;
+}
+
#gOrganizeFormButtons {
bottom: 0.5em;
- position: absolute;
}
#gOrganizeFormButtons .submit {
diff --git a/modules/organize/css/organize_edit_drawer.png b/modules/organize/css/organize_edit_drawer.png
new file mode 100644
index 00000000..34735a00
--- /dev/null
+++ b/modules/organize/css/organize_edit_drawer.png
Binary files differ
diff --git a/modules/organize/js/organize.js b/modules/organize/js/organize.js
index 1eac785b..66ca0b33 100644
--- a/modules/organize/js/organize.js
+++ b/modules/organize/js/organize.js
@@ -112,7 +112,7 @@ var treeDroppable = {
var moveItems = "";
var targetItemId = $(this).attr("ref");
if ($(this).hasClass("gBranchSelected")) {
- $("#gOrganizeStatus").append(INVALID_DROP_TARGET);
+ $("#gOrganizeStatus").empty().append(INVALID_DROP_TARGET);
ui.draggable.trigger("stop", event);
return false;
}
@@ -122,7 +122,7 @@ var treeDroppable = {
okToMove &= targetItemId != $(this).attr("ref");
});
if (!okToMove) {
- $("#gOrganizeStatus").append(INVALID_DROP_TARGET);
+ $("#gOrganizeStatus").empty().append(INVALID_DROP_TARGET);
ui.draggable.trigger("stop", event);
return false;
}
@@ -193,18 +193,33 @@ var onMicroThumbContainerMousemove = function(event) {
}
};
-// Select All and Deselect All click
-function toggleSelectAll(event) {
- if ($(this).attr("id") == "gMicroThumbSelectAll") {
- $(".gMicroThumbContainer").addClass("ui-selected");
- $("#gMicroThumbSelectAll").hide();
- $("#gMicroThumbUnselectAll").show();
- } else {
- $(".gMicroThumbContainer").removeClass("ui-selected");
- $("#gMicroThumbSelectAll").show();
- $("#gMicroThumbUnselectAll").hide();
+// Handle click events on the buttons on the drawer handle
+function drawerHandleButtonsClick(event) {
+ event.preventDefault();
+ if (!$(this).attr("disabled")) {
+ var operation = $(this).attr("ref");
+ switch (operation) {
+ case "edit":
+ $("#gOrganizeEditDrawerPanel").slideToggle("normal");
+ break;
+ case "select-all":
+ $(".gMicroThumbContainer").addClass("ui-selected");
+ $("#gMicroThumbSelectAll").hide();
+ $("#gMicroThumbUnselectAll").show();
+ break;
+ case "unselect-all":
+ $(".gMicroThumbContainer").removeClass("ui-selected");
+ $("#gMicroThumbSelectAll").show();
+ $("#gMicroThumbUnselectAll").hide();
+ break;
+ case "close":
+ $("#gDialog").dialog("close");
+ break;
+ default:
+ console.log(operation);
+ }
}
-}
+};
// **************************************************************************
// AJAX Callbacks
@@ -252,7 +267,7 @@ var startMoveCallback = function (data, textStatus) {
success: function(data, textStatus) {
task = null;
transitItems = [];
- $("#gOrganizeStatus").append("<div class='gSuccess'>" + data.task.status + "</div>");
+ $("#gOrganizeStatus").empty().append("<div class='gSuccess'>" + data.task.status + "</div>");
},
dataType: "json",
type: "POST",
@@ -292,7 +307,7 @@ var startRearrangeCallback = function (data, textStatus) {
$.ajax({async: false,
success: function(data, textStatus) {
task = null;
- $("#gOrganizeStatus").append("<div class='gSuccess'>" + data.task.status + "</div>");
+ $("#gOrganizeStatus").empty().append("<div class='gSuccess'>" + data.task.status + "</div>");
},
dataType: "json",
type: "POST",
@@ -344,11 +359,9 @@ function organize_dialog_init() {
retrieveMicroThumbs(item_id);
//showLoading("#gDialog");
- $("#gMicroThumbSelectAll").click(toggleSelectAll);
- $("#gMicroThumbUnselectAll").click(toggleSelectAll);
-
$("#gMicroThumbPanel").droppable(thumbDroppable);
$("#gMicroThumbGrid").selectable(selectable);
+ $("#gOrganizeEditDrawerHandle a").click(drawerHandleButtonsClick);
}
function retrieveMicroThumbs() {
@@ -421,13 +434,13 @@ function createProgressDialog(title) {
$("#gOrganizeTaskPause").hide();
$("#gOrganizeTaskResume").show();
$("#gOrganizeTaskCancel").show();
- $("#gOrganizeStatus").append(task.pauseMsg);
+ $("#gOrganizeStatus").empty().append(task.pauseMsg);
});
$("#gOrganizeTaskResume").click(function(event) {
$("#gOrganizeTaskPause").show();
$("#gOrganizeTaskResume").hide();
$("#gOrganizeTaskCancel").hide();
- $("#gOrganizeStatus").append(task.resumeMsg);
+ $("#gOrganizeStatus").empty().append(task.resumeMsg);
startRearrangeCallback();
});
$("#gOrganizeTaskCancel").click(function(event) {
@@ -440,7 +453,7 @@ function createProgressDialog(title) {
task = null;
paused = false;
transitItems = [];
- $("#gOrganizeStatus").append("<div class='gWarning'>" + data.task.status + "</div>");
+ $("#gOrganizeStatus").empty().append("<div class='gWarning'>" + data.task.status + "</div>");
$("#gOrganizeProgressDialog").dialog("destroy").remove();
},
dataType: "json",
diff --git a/modules/organize/js/organize_init.js b/modules/organize/js/organize_init.js
index efe21af4..ed036fdb 100644
--- a/modules/organize/js/organize_init.js
+++ b/modules/organize/js/organize_init.js
@@ -9,7 +9,7 @@ $("document").ready(function() {
autoOpen: false,
autoResize: false,
modal: true,
- resizable: true,
+ resizable: false,
close: function () {
$("#gDialog").trigger("organize_close");
$("#gDialog").dialog("destroy").remove();
diff --git a/modules/organize/views/organize.html.php b/modules/organize/views/organize.html.php
index 493ad81a..c423f5a1 100644
--- a/modules/organize/views/organize.html.php
+++ b/modules/organize/views/organize.html.php
@@ -23,28 +23,50 @@
<fieldset style="display: none">
<legend><?= t("Organize %name", array("name" => $item->title)) ?></legend>
</fieldset>
-<div id="doc3" class="yui-t1">
- <div id="bd" role="main">
- <div id="yui-main">
- <div class="yui-b">
- <a id="gMicroThumbSelectAll" href="#"><?= t("select all") ?></a>
- <a id="gMicroThumbUnselectAll" href="#" style="display: none"><?= t("deselect all") ?></a>
- <div id="gMicroThumbPanel" class="yui-u first"
- ref="<?= url::site("organize/content/__ITEM_ID__?width=__WIDTH__&height=__HEIGHT__&offset=__OFFSET__") ?>">
- <ul id="gMicroThumbGrid">
- </ul>
- </div>
- <!-- div id="gOrganizeEditContainer" class="yui-u">
- < ?= $edit_form ? >
- </div -->
+<div id="doc3" class="yui-t7">
+ <div id="bd">
+ <div class="yui-gf">
+ <div class="yui-u first">
+ <h3><?= t("Albums") ?></h3>
+ </div>
+ <div id="gOrganizeStatus" class="yui-u">
+ <div class="gInfo"><?= t("Select one or more items to edit; drag and drop items to re-order or move between albums") ?></div>
</div>
</div>
- <div id="gOrganizeTreeContainer" class="yui-b">
- <h3><?= t("Albums") ?></h3>
- <?= $album_tree ?>
+ <div class="yui-gf">
+ <div id="gOrganizeTreeContainer" class="yui-u first">
+ <?= $album_tree ?>
+ </div>
+ <div id="gMicroThumbPanel" class="yui-u"
+ ref="<?= url::site("organize/content/__ITEM_ID__?width=__WIDTH__&height=__HEIGHT__&offset=__OFFSET__") ?>">
+ <div id="gOrganizeEditDrawer">
+ <div id="gOrganizeEditDrawerPanel" class="yui-gf" style="display: none">
+ <div id="gOrganizeFormThumbs" class="yui-u first">
+ <div id="gOrganizeFormNoImage">
+ <h3><?= t("No Image Selected") ?></h3>
+ </div>
+ <div id="gOrganizeFormThumb" style="display: none"></div>
+ <div id="gOrganizeFormMultipleImages" style="display:none">
+ <h3><?= t("Multiple Images Selected") ?></h3>
+ </div>
+ </div>
+ <?= $edit_form ?>
+ </div>
+ <div id="gOrganizeEditDrawerHandle">
+ <div id="gOrganizeEditHandleLeft"></div>
+ <div id="gOrganizeEditHandleButtonsLeft">
+ <?= $button_pane ?>
+ </div>
+ <div id="gOrganizeEditHandleRight"></div>
+ <div id="gOrganizeEditHandleButtonsRight">
+ <a id="gMicroThumbSelectAll" href="#" ref="select-all" class="gButtonLink ui-corner-all ui-state-default"><?= t("Select all") ?></a>
+ <a id="gMicroThumbUnselectAll" href="#" ref="unselect-all" style="display: none" class="gButtonLink ui-corner-all ui-state-default"><?= t("Deselect all") ?></a>
+ <a id="gMicroThumbDone" href="#" ref="close" class="gButtonLink ui-corner-all ui-state-default"><?= t("Done") ?></a>
+ </div>
+ </div>
+ </div>
+ <ul id="gMicroThumbGrid"></ul>
+ </div>
</div>
</div>
- <div id="ft">
- <div id="gOrganizeStatus"></div>
- </div>
</div>
diff --git a/modules/organize/views/organize_button_pane.html.php b/modules/organize/views/organize_button_pane.html.php
index 82b7607d..a39c643c 100644
--- a/modules/organize/views/organize_button_pane.html.php
+++ b/modules/organize/views/organize_button_pane.html.php
@@ -1,23 +1,38 @@
<?php defined("SYSPATH") or die("No direct script access.") ?>
+
+<a class="gButtonLink ui-corner-all ui-state-default" href="#" ref="edit"
+ disabled="1" title="<?= t("Edit Selection") ?>">
+ <span class="ui-icon ui-icon-pencil">
+ <?= t("Edit Selection") ?>
+ </span>
+</a>
+
<? if (graphics::can("rotate")): ?>
<a class="gButtonLink ui-corner-all ui-state-default" href="#" ref="rotate_ccw"
- title="<?= t("Rotate 90 degrees counter clockwise") ?>">
+ disabled="1" title="<?= t("Rotate 90 degrees counter clockwise") ?>">
<span class="ui-icon ui-icon-rotate-ccw">
<?= t("Rotate 90 degrees counter clockwise") ?>
</span>
</a>
<a class="gButtonLink ui-corner-all ui-state-default" href="#" ref="rotate_cw"
- title="<?= t("Rotate 90 degrees clockwise") ?>">
+ disabled="1" title="<?= t("Rotate 90 degrees clockwise") ?>">
<span class="ui-icon ui-icon-rotate-cw">
<?= t("Rotate 90 degrees clockwise") ?>
</span>
</a>
<? endif ?>
+<a class="gButtonLink ui-corner-all ui-state-default" href="#" ref="album_cover"
+ disabled="1" title="<?= t("Choose this photo as the album cover") ?>">
+ <span class="ui-icon ui-icon-star">
+ <?= t("Choose this photo as the album cover") ?>
+ </span>
+</a>
+
<a class="gButtonLink ui-corner-all ui-state-default" href="#" ref="delete"
- title="<?= t("Delete selection") ?>">
+ disabled="1" title="<?= t("Delete selection") ?>">
<span class="ui-icon ui-icon-trash">
<?= t("Delete selection") ?>
</span>
diff --git a/modules/organize/views/organize_edit.html.php b/modules/organize/views/organize_edit.html.php
index 1085a863..f3b6eb87 100644
--- a/modules/organize/views/organize_edit.html.php
+++ b/modules/organize/views/organize_edit.html.php
@@ -1,21 +1,8 @@
<?php defined("SYSPATH") or die("No direct script access.") ?>
-<div id="gOrganizeForm">
+<div id="gOrganizeForm" class="yui-u">
<?= form::open(url::site("organize/update/__ITEM_ID__?csrf=__CSRF__&action=__ACTION__"), array("method" => "post")) ?>
- <div id="gOrganizeFormThumbs">
- <div id="gOrganizeFormNoImage">
- <h3><?= t("No Image Selected") ?></h3>
- </div>
- <div id="gOrganizeFormThumb" style="display: none"></div>
- <div id="gOrganizeFormMultipleImages" style="display:none">
- <h3><?= t("Multiple Images Selected") ?></h3>
- </div>
- </div>
-
- <div id="gOrganizeButtonPane" style="display: none">
- <?= $button_pane ?>
- </div>
- <div id="gOrganizeFormInfo" style="display:none"
+ <!-- div id="gOrganizeFormInfo" style="display:none"
ref="<?= url::site("organize/detail/__ITEM_ID__") ?>">
<ul>
<li>
@@ -31,10 +18,9 @@
Description: <span id="gOrganizeFormDescription">&nbsp;</span>
</li>
</ul>
- </div>
+ </div -->
<span id="gOrganizeFormButtons">
- <?= form::submit(array("id" => "gOrganizePauseButton", "name" => "pause", "disabled" => true, "class" => "submit", "style" => "display:none"), t("Pause")) ?>
<?= form::submit(array("id" => "gOrganizeApplyButton", "name" => "apply", "disabled" => true, "class" => "submit"), t("Apply")) ?>
</span>
<?= form::close() ?>
generated by cgit v1.2.3 (git 2.46.0) at 2025-10-14 21:28:33 +0000