simplify determining the current path and parent. Change the Add Resource to a split button.
This commit is contained in:
parent
575bcbd22e
commit
5c5b813097
@ -99,6 +99,10 @@ class G3_Client_Controller extends Template_Controller {
|
||||
private function _get_detail($resource) {
|
||||
$v = new View("{$resource->type}_detail.html");
|
||||
$v->resource = $resource;
|
||||
$v->parent_path = substr($resource->path, 0, -strlen($resource->internet_address));
|
||||
if (strrpos($v->parent_path, "/") == strlen($v->parent_path) - 1) {
|
||||
$v->parent_path = substr($v->parent_path, 0, -1);
|
||||
}
|
||||
return $v;
|
||||
}
|
||||
} // End G3 Client Controller
|
||||
|
@ -1,14 +1,19 @@
|
||||
<?php defined("SYSPATH") or die("No direct script access.") ?>
|
||||
<ul id="thumb-grid" class="ui-helper-clearfix">
|
||||
<script>
|
||||
var parent_path = "<?= $parent_path ?>";
|
||||
var current_path = "<?= $resource->path ?>";
|
||||
var resource_type = "album";
|
||||
</script>
|
||||
<ul id="wc-thumb-grid" class="ui-helper-clearfix">
|
||||
<? foreach ($resource->children as $child): ?>
|
||||
<li class="thumb-grid-cell" ref="<?= $child->path ?>">
|
||||
<a class="child-link" href="#">
|
||||
<? if ($child->has_thumb): ?>
|
||||
<img src="<?= $child->thumb_url ?>" title="<?= $child->title ?>" />
|
||||
<? else: ?>
|
||||
<span><?= $child->title ?></span>
|
||||
<? endif ?>
|
||||
</a>
|
||||
<li class="wc-thumb-grid-cell" ref="<?= $child->path ?>">
|
||||
<a class="wc-child-link wc-image-block" href="#">
|
||||
<? if ($child->has_thumb): ?>
|
||||
<img src="<?= $child->thumb_url ?>" title="<?= $child->title ?>" />
|
||||
<? else: ?>
|
||||
<span><?= $child->title ?></span>
|
||||
<? endif ?>
|
||||
</a>
|
||||
</li>
|
||||
<? endforeach ?>
|
||||
</ul>
|
||||
|
@ -4,11 +4,11 @@
|
||||
</div>
|
||||
<div id="center">
|
||||
<div class="wc-toolbar ui-widget-header ui-corner-all ui-helper-clearfix">
|
||||
<div class="wc-buttonset ui-helper-clearfix">
|
||||
<a href="#" ref="first" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo ui-corner-all" title="First"><span class="ui-icon ui-icon-seek-first"></span>First</a>
|
||||
<a href="#" ref="previous" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo ui-corner-all" title="Previous"><span class="ui-icon ui-icon-seek-prev"></span>Previous</a>
|
||||
<a href="#" ref="next" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo ui-corner-all" title="Next"><span class="ui-icon ui-icon-seek-next"></span>Next</a>
|
||||
<a href="#" ref="last" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo ui-corner-all" title="Last"><span class="ui-icon ui-icon-seek-end"></span>Last</a>
|
||||
<div class="wc-buttonset wc-buttonset-single ui-helper-clearfix">
|
||||
<a href="#" ref="first" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo ui-corner-left" title="First"><span class="ui-icon ui-icon-seek-first"></span>First</a>
|
||||
<a href="#" ref="previous" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo" title="Previous"><span class="ui-icon ui-icon-seek-prev"></span>Previous</a>
|
||||
<a href="#" ref="next" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo" title="Next"><span class="ui-icon ui-icon-seek-next"></span>Next</a>
|
||||
<a href="#" ref="last" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo ui-corner-right" title="Last"><span class="ui-icon ui-icon-seek-end"></span>Last</a>
|
||||
</div>
|
||||
<div class="wc-buttonset ui-helper-clearfix">
|
||||
<a href="#" ref="parent" class="wc-button ui-state-default ui-state-disabled wc-button-icon-solo ui-corner-all" title="Parent"><span class="ui-icon ui-icon-eject"></span>Parent</a>
|
||||
@ -20,7 +20,8 @@
|
||||
</div>
|
||||
|
||||
<div class="wc-buttonset wc-buttonset-single ui-helper-clearfix">
|
||||
<a href="#" ref="add" class="wc-button ui-state-default wc-button-icon-solo ui-corner-all" title="Add Resource"><span class="ui-icon ui-icon-transferthick-e-w"></span>Add Resource</a>
|
||||
<a href="#" id="add-resource" ref="add_album" class="wc-button ui-state-active ui-corner-left" ><span>Add Album<span></a>
|
||||
<a href="#" class="wc-button ui-state-active wc-button-icon-solo ui-corner-right" title="Resources"><span class="ui-icon ui-icon-triangle-1-s"></span> </a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="wc-detail">
|
||||
|
@ -1,5 +1,10 @@
|
||||
<?php defined("SYSPATH") or die("No direct script access.") ?>
|
||||
<div id="movie" ref="<?= $resource->path ?>">
|
||||
<script>
|
||||
var parent_path = "<?= $parent_path ?>";
|
||||
var current_path = "<?= $resource->path ?>";
|
||||
var resource_type = "movie";
|
||||
</script>
|
||||
<div id="movie">
|
||||
<a id="movie-link" href="<?= $resource->url ?>" title="<?= $resource->title ?>"
|
||||
style="display: block; height: <?= $resource->size->height ?>px; width: <?= $resource->size->width ?>px;" />
|
||||
</div>
|
||||
|
@ -1,5 +1,10 @@
|
||||
<?php defined("SYSPATH") or die("No direct script access.") ?>
|
||||
<div id="photo" ref="<?= $resource->path ?>">
|
||||
<script>
|
||||
var parent_path = "<?= $parent_path ?>";
|
||||
var current_path = "<?= $resource->path ?>";
|
||||
var resource_type = "photo";
|
||||
</script>
|
||||
<div id="photo">
|
||||
<img src="<?= $resource->resize_url ?>" title="<?= $resource->title ?>" />
|
||||
</div>
|
||||
<div id="photo-info">
|
||||
|
@ -87,6 +87,7 @@ span.error {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
font-size: 1.1em;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
#wc-body #left #album_tree ul li {
|
||||
@ -121,7 +122,12 @@ span.error {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#wc-body #center .thumb-grid-cell {
|
||||
#wc-body #center #wc-thumb-grid {
|
||||
width: 100%;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#wc-body #center .wc-thumb-grid-cell {
|
||||
border: 1px solid transparent;
|
||||
float: left;
|
||||
height: 200px;
|
||||
@ -132,8 +138,15 @@ span.error {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
#wc-body #center .thumb-grid-cell img,
|
||||
#wc-body #center .thumb-grid-cell span {
|
||||
#wc-body #center .wc-thumb-grid-cell img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
padding: 5%;
|
||||
width: 89%;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
}
|
||||
|
||||
#wc-body #center .wc-thumb-grid-cell span {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
@ -177,6 +190,14 @@ a.wc-button {
|
||||
float:left;
|
||||
}
|
||||
|
||||
a.ui-state-active {
|
||||
color: #EB8F00 !important;
|
||||
}
|
||||
|
||||
a.ui-state-default {
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
/* remove extra button width in IE */
|
||||
button.wc-button {
|
||||
width:auto;
|
||||
|
@ -22,17 +22,13 @@
|
||||
$(obj).html(data.content);
|
||||
if (data.status == "ok") {
|
||||
initializeDetail(obj);
|
||||
save_paths($(".tree-title.ui-selected").parents("li:first").attr("ref"));
|
||||
} else {
|
||||
} else {
|
||||
ajaxifyLoginForm(obj);
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
console.group("ajaxifyLoginForm");
|
||||
initializeDetail(obj);
|
||||
save_paths($(".tree-title.ui-selected").parents("li:first").attr("ref"));
|
||||
console.groupEnd();
|
||||
}
|
||||
};
|
||||
|
||||
@ -61,48 +57,42 @@
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#center a.child-link").live("dblclick", function(event) {
|
||||
$("#center a.wc-child-link").live("dblclick", function(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
var path = $(this).parents("li:first").attr("ref");
|
||||
var url = $(this).attr("href");
|
||||
get_detail(path, function(path) {
|
||||
var album = $("#album_tree [ref='" + path + "']");
|
||||
if (album.length > 0) {
|
||||
$(".tree-title.ui-selected").removeClass("ui-selected");
|
||||
$(".tree-title", album).addClass("ui-selected");
|
||||
}
|
||||
});
|
||||
get_detail(path, _set_active_album);
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#center a.child-link").live("click", function(event) {
|
||||
$(".thumb-grid-cell.ui-selected").removeClass("ui-selected");
|
||||
$("#center a.wc-child-link").live("click", function(event) {
|
||||
$(".wc-thumb-grid-cell.ui-selected").removeClass("ui-selected");
|
||||
$(this).parents("li:first").addClass("ui-selected");
|
||||
_set_navigation_buttons($(".thumb-grid-cell.ui-selected").attr("ref"));
|
||||
_set_navigation_buttons($(".wc-thumb-grid-cell.ui-selected").attr("ref"));
|
||||
return false;
|
||||
});
|
||||
|
||||
$(".wc-button").live("click", function() {
|
||||
if ($(this).parent("a").hasClass("ui-state-disabled")) {
|
||||
if ($(this).hasClass("ui-state-disabled")) {
|
||||
return false;
|
||||
}
|
||||
var selected = $(".thumb-grid-cell.ui-selected");
|
||||
switch ($(this).attr("ref")) {
|
||||
case "parent":
|
||||
get_detail($("span", this).attr("ref"));
|
||||
get_detail($("span", this).attr("ref"), _set_active_album);
|
||||
break;
|
||||
case "first":
|
||||
case "previous":
|
||||
case "next":
|
||||
case "last":
|
||||
if (selected.length == 0) {
|
||||
if (resource_type != "album") {
|
||||
get_detail($("span", this).attr("ref"));
|
||||
} else {
|
||||
var selected = $(".wc-thumb-grid-cell.ui-selected");
|
||||
selected.removeClass("ui-selected");
|
||||
switch ($(this).attr("ref")) {
|
||||
case "first":
|
||||
$(".thumb-grid-cell:first").addClass("ui-selected");
|
||||
$(".wc-thumb-grid-cell:first").addClass("ui-selected");
|
||||
break;
|
||||
case "previous":
|
||||
selected.prev().addClass("ui-selected");
|
||||
@ -111,8 +101,7 @@
|
||||
selected.next().addClass("ui-selected");
|
||||
break;
|
||||
case "last":
|
||||
$(".thumb-grid-cell:last").addClass("ui-selected");
|
||||
_set_navigation_buttons();
|
||||
$(".wc-thumb-grid-cell:last").addClass("ui-selected");
|
||||
break;
|
||||
}
|
||||
_set_navigation_buttons();
|
||||
@ -135,68 +124,60 @@
|
||||
|
||||
$("#album_tree [ref=''] .tree-title:first").addClass("ui-selected");
|
||||
set_selected_thumb();
|
||||
};
|
||||
save_paths();
|
||||
}
|
||||
|
||||
function _set_active_album(path) {
|
||||
var album = $("#album_tree [ref='" + path + "']");
|
||||
if (album.length > 0) {
|
||||
$(".tree-title.ui-selected").removeClass("ui-selected");
|
||||
$(".tree-title:first", album).addClass("ui-selected");
|
||||
}
|
||||
}
|
||||
|
||||
function set_selected_thumb() {
|
||||
if ($(".thumb-grid-cell.ui-selected").length == 0) {
|
||||
$(".thumb-grid-cell:first").addClass("ui-selected");
|
||||
if ($(".wc-thumb-grid-cell.ui-selected").length == 0) {
|
||||
$(".wc-thumb-grid-cell:first").addClass("ui-selected");
|
||||
}
|
||||
}
|
||||
|
||||
function get_detail(path, callback) {
|
||||
$.get("/g3_client/index.php/g3_client/detail", {path: path}, function(data, textStatus) {
|
||||
console.group("get_detail.get callback");
|
||||
$("#wc-detail").html(data);
|
||||
set_selected_thumb();
|
||||
save_paths(path);
|
||||
save_paths();
|
||||
if (callback) {
|
||||
callback(path);
|
||||
}
|
||||
console.groupEnd();
|
||||
});
|
||||
}
|
||||
|
||||
function save_paths(path) {
|
||||
_paths[path] = [];
|
||||
$(".thumb-grid-cell").each(function(i) {
|
||||
_paths[path][i] = $(this).attr("ref");
|
||||
function save_paths() {
|
||||
_paths[current_path] = [];
|
||||
$(".wc-thumb-grid-cell").each(function(i) {
|
||||
_paths[current_path][i] = $(this).attr("ref");
|
||||
});
|
||||
|
||||
console.dir(_paths);
|
||||
enable_toolbar_buttons(path);
|
||||
_set_navigation_buttons();
|
||||
}
|
||||
|
||||
function enable_toolbar_buttons(path) {
|
||||
if (path != "") {
|
||||
function _set_navigation_buttons() {
|
||||
if (current_path != "") {
|
||||
$(".wc-toolbar .ui-icon-eject").parent("a").removeClass("ui-state-disabled");
|
||||
$(".wc-toolbar .ui-icon-trash").parent("a").removeClass("ui-state-disabled");
|
||||
} else {
|
||||
$(".wc-toolbar .ui-icon-eject").parent("a").addClass("ui-state-disabled");
|
||||
$(".wc-toolbar .ui-icon-trash").parent("a").addClass("ui-state-disabled");
|
||||
}
|
||||
$(".wc-toolbar .ui-icon-eject").attr("ref", _get_parent_path(path));
|
||||
$(".wc-toolbar .ui-icon-pencil").attr("ref", path);
|
||||
$(".wc-toolbar .ui-icon-eject").attr("ref", parent_path);
|
||||
$(".wc-toolbar .ui-icon-pencil").attr("ref", current_path);
|
||||
$(".wc-toolbar .ui-icon-trash").attr("ref", current_path);
|
||||
$(".wc-toolbar #add-resource span")
|
||||
.attr("ref", resource_type == "album" ? current_path : parent_path);
|
||||
|
||||
_set_navigation_buttons();
|
||||
}
|
||||
|
||||
function _get_parent_path(path) {
|
||||
var idx = path.lastIndexOf("/");
|
||||
return idx != -1 ? path.substring(0, idx) : "";
|
||||
}
|
||||
|
||||
function _set_navigation_buttons() {
|
||||
var selected_path = $(".thumb-grid-cell.ui-selected").attr("ref");
|
||||
if (selected_path == undefined) { // not found must be photo or movie
|
||||
selected_path = $("#wc-detail div:first").attr("ref");
|
||||
}
|
||||
var parent_path = _get_parent_path(selected_path);
|
||||
console.log("path: " + selected_path + "; parent_path: " + parent_path);
|
||||
var paths = _paths[parent_path];
|
||||
console.group("parent path");
|
||||
console.dir(paths);
|
||||
console.groupEnd();
|
||||
var paths = _paths[resource_type == "album" ? current_path : parent_path];
|
||||
|
||||
$(".wc-toolbar .ui-icon-pencil").attr("ref", current_path);
|
||||
if (paths.length > 0) {
|
||||
$(".wc-toolbar .ui-icon-seek-first").parent("a").removeClass("ui-state-disabled");
|
||||
$(".wc-toolbar .ui-icon-seek-end").parent("a").removeClass("ui-state-disabled");
|
||||
@ -207,6 +188,8 @@
|
||||
$(".wc-toolbar .ui-icon-seek-end").parent("a").addClass("ui-state-disabled");
|
||||
}
|
||||
|
||||
var selected_path =
|
||||
resource_type == "album" ? $(".wc-thumb-grid-cell.ui-selected").attr("ref") : current_path;
|
||||
var i = 0;
|
||||
for (; i < paths.length; i++) {
|
||||
if (paths[i] == selected_path) {
|
||||
@ -228,6 +211,5 @@
|
||||
$(".wc-toolbar .ui-icon-seek-next").parent("a").addClass("ui-state-disabled");
|
||||
$(".wc-toolbar .ui-icon-seek-end").parent("a").addClass("ui-state-disabled");
|
||||
}
|
||||
console.log("found path: " + paths[i]);
|
||||
}
|
||||
})(jQuery);
|
||||
})(jQuery);
|
||||
|
Reference in New Issue
Block a user