mirror of
https://github.com/lrsjng/h5ai.git
synced 2025-05-25 20:44:53 -04:00
261 lines
7.4 KiB
JavaScript
261 lines
7.4 KiB
JavaScript
|
|
(function ($, h5ai) {
|
|
|
|
var onClick = function (path, context) {
|
|
|
|
},
|
|
updateCrumbHtml = function (path) {
|
|
|
|
var $html, $a;
|
|
|
|
if (path.html.$crumb && path.html.$crumb.data("status") === path.status) {
|
|
return path.html.$crumb;
|
|
}
|
|
|
|
$html = $("<li class='crumb'><a><img alt='>' /><span></span></a></li>")
|
|
.addClass(path.isFolder ? "folder" : "file");
|
|
|
|
if (path.status) {
|
|
$html.data("status", path.status);
|
|
}
|
|
|
|
$a = $html.find("a")
|
|
.attr("href", path.absHref)
|
|
.click(function() { onClick(path, "crumb"); })
|
|
.find("img").attr("src", h5ai.core.image("crumb")).end()
|
|
.find("span").text(path.label).end();
|
|
|
|
if (path.isDomain) {
|
|
$html.addClass("domain");
|
|
$a.find("img").attr("src", h5ai.core.image("home"));
|
|
}
|
|
|
|
if (path.isCurrentFolder) {
|
|
$html.addClass("current");
|
|
}
|
|
|
|
if (!isNaN(path.status)) {
|
|
if (path.status === 200) {
|
|
$a.append($("<img class='hint' src='" + h5ai.core.image("page") + "' alt='not listable' />"));
|
|
} else {
|
|
$a.append($("<span class='hint'>(" + path.status + ")</span>"));
|
|
}
|
|
}
|
|
|
|
if (path.html.$crumb) {
|
|
path.html.$crumb.replaceWith($html);
|
|
}
|
|
path.html.$crumb = $html;
|
|
|
|
return $html;
|
|
},
|
|
updateExtendedHtml = function (path) {
|
|
|
|
var $html, $a, $label,
|
|
formattedDate = path.date ? path.date.toString(h5ai.settings.dateFormat) : "",
|
|
imgClass = "",
|
|
icon16 = h5ai.core.icon(path.type),
|
|
icon48 = h5ai.core.icon(path.type, true);
|
|
|
|
if (path.html.$extended && path.html.$extended.data("status") === path.status) {
|
|
return path.html.$extended;
|
|
}
|
|
|
|
$html = $("<li class='entry' />")
|
|
.data("path", path)
|
|
.addClass(path.isFolder ? "folder" : "file");
|
|
|
|
if (path.status) {
|
|
$html.data("status", path.status);
|
|
}
|
|
|
|
if (h5ai.settings.showThumbs === true && $.inArray(path.type, h5ai.settings.thumbTypes) >= 0) {
|
|
imgClass = "class='thumb'";
|
|
var escapedHref = path.absHref.replace(/'/g, "%27").replace(/"/g, "%22");
|
|
icon16 = h5ai.core.api() + "?action=thumb&href=" + escapedHref + "&width=16&height=16&mode=square";
|
|
icon48 = h5ai.core.api() + "?action=thumb&href=" + escapedHref + "&width=96&height=46&mode=rational";
|
|
}
|
|
|
|
$label = $("<span class='label'>" + path.label + "</span>");
|
|
$a = $("<a />")
|
|
.attr("href", path.absHref)
|
|
.click(function() { onClick(path, "extended"); })
|
|
.appendTo($html)
|
|
.append($("<span class='icon small'><img " + imgClass + " src='" + icon16 + "' alt='" + path.type + "' /></span>"))
|
|
.append($("<span class='icon big'><img " + imgClass + " src='" + icon48 + "' alt='" + path.type + "' /></span>"))
|
|
.append($label)
|
|
.append($("<span class='date' data-time='" + path.time + "'></span>"))
|
|
.append($("<span class='size' data-bytes='" + path.size + "'></span>"));
|
|
|
|
$a.hover(
|
|
function () {
|
|
if ($("#extended").hasClass("icons-view")) {
|
|
var $this = $(this);
|
|
$(".status.default").hide();
|
|
$(".status.dynamic")
|
|
.empty()
|
|
.append($this.find(".label").clone())
|
|
.append($("<span class='sep'>·</span>"))
|
|
.append($this.find(".date").clone())
|
|
.show();
|
|
|
|
if (!$this.closest(".entry").hasClass("folder")) {
|
|
$(".status.dynamic")
|
|
.append($("<span class='sep'>·</span>"))
|
|
.append($this.find(".size").clone());
|
|
}
|
|
}
|
|
},
|
|
function () {
|
|
$(".status.default").show();
|
|
$(".status.dynamic").empty().hide();
|
|
}
|
|
);
|
|
|
|
if (path.isParentFolder) {
|
|
if (!h5ai.settings.setParentFolderLabels) {
|
|
$label.addClass("l10n-parentDirectory");
|
|
}
|
|
$html.addClass("folder-parent");
|
|
}
|
|
|
|
if (!isNaN(path.status)) {
|
|
if (path.status === 200) {
|
|
$html.addClass("page");
|
|
$a.find(".icon.small img").attr("src", h5ai.core.icon("folder-page"));
|
|
$a.find(".icon.big img").attr("src", h5ai.core.icon("folder-page", true));
|
|
} else {
|
|
$html.addClass("error");
|
|
$label.append($("<span class='hint'> " + path.status + " </span>"));
|
|
}
|
|
}
|
|
|
|
if (path.html.$extended) {
|
|
path.html.$extended.replaceWith($html);
|
|
h5ai.core.formatDates();
|
|
}
|
|
path.html.$extended = $html;
|
|
|
|
return $html;
|
|
},
|
|
updateTreeHtml = function (path) {
|
|
|
|
var $html, $blank, $a, $indicator, $ul, idx;
|
|
|
|
$html = $("<div class='entry' />")
|
|
.data("path", path)
|
|
.addClass(path.isFolder ? "folder" : "file");
|
|
|
|
$blank = $("<span class='blank' />").appendTo($html);
|
|
|
|
$a = $("<a />")
|
|
.attr("href", path.absHref)
|
|
.click(function() { onClick(path, "tree"); })
|
|
.appendTo($html)
|
|
.append($("<span class='icon'><img src='" + h5ai.core.icon(path.type) + "' /></span>"))
|
|
.append($("<span class='label'>" + path.label + "</span>"));
|
|
|
|
if (path.isFolder) {
|
|
// indicator
|
|
if (path.status === undefined || !path.isEmpty()) {
|
|
$indicator = $("<span class='indicator initiated'><img src='" + h5ai.core.image("tree") + "' /></span>")
|
|
.click(function (event) {
|
|
|
|
var $entry = $indicator.closest(".entry"); // $html
|
|
|
|
if ($indicator.hasClass("unknown")) {
|
|
h5ai.connector.fetchStatusAndContent(path.absHref, false, function (status, content) {
|
|
|
|
path.status = status;
|
|
path.content = content;
|
|
path.treeOpen = true;
|
|
$("#tree").get(0).updateScrollbar(true);
|
|
updateTreeHtml(path);
|
|
$("#tree").get(0).updateScrollbar();
|
|
});
|
|
} else if ($indicator.hasClass("open")) {
|
|
path.treeOpen = false;
|
|
$indicator.removeClass("open");
|
|
$("#tree").get(0).updateScrollbar(true);
|
|
$entry.find("> ul.content").slideUp(function() {
|
|
|
|
$("#tree").get(0).updateScrollbar();
|
|
});
|
|
} else {
|
|
path.treeOpen = true;
|
|
$indicator.addClass("open");
|
|
$("#tree").get(0).updateScrollbar(true);
|
|
$entry.find("> ul.content").slideDown(function() {
|
|
|
|
$("#tree").get(0).updateScrollbar();
|
|
});
|
|
}
|
|
|
|
});
|
|
|
|
if (path.status === undefined) {
|
|
$indicator.addClass("unknown");
|
|
} else if (path.treeOpen) {
|
|
$indicator.addClass("open");
|
|
}
|
|
|
|
$blank.replaceWith($indicator);
|
|
}
|
|
|
|
// is path the domain?
|
|
if (path.isDomain) {
|
|
$html.addClass("domain");
|
|
$a.find(".icon img").attr("src", h5ai.core.icon("folder-home"));
|
|
}
|
|
|
|
// is path the current folder?
|
|
if (path.isCurrentFolder) {
|
|
$html.addClass("current");
|
|
$a.find(".icon img").attr("src", h5ai.core.icon("folder-open"));
|
|
}
|
|
|
|
// does it have subfolders?
|
|
if (!path.isEmpty()) {
|
|
$ul = $("<ul class='content' />").appendTo($html);
|
|
$.each(path.content, function (idx, entry) {
|
|
$("<li />").append(updateTreeHtml(entry)).appendTo($ul);
|
|
});
|
|
if (path.status === undefined || !path.treeOpen) {
|
|
$ul.hide();
|
|
}
|
|
}
|
|
|
|
// reflect folder status
|
|
if (!isNaN(path.status)) {
|
|
if (path.status === 200) {
|
|
$a.find(".icon img").attr("src", h5ai.core.icon("folder-page"));
|
|
$a.append($("<span class='hint'><img src='" + h5ai.core.image("page") + "' /></span>"));
|
|
} else {
|
|
$html.addClass("error");
|
|
$a.append($("<span class='hint'>" + path.status + "</span>"));
|
|
}
|
|
}
|
|
}
|
|
|
|
if (path.html.$tree) {
|
|
path.html.$tree.replaceWith($html);
|
|
}
|
|
path.html.$tree = $html;
|
|
|
|
return $html;
|
|
},
|
|
updateHtml = function (path) {
|
|
|
|
updateCrumbHtml(path);
|
|
updateExtendedHtml(path);
|
|
updateTreeHtml(path);
|
|
};
|
|
|
|
h5ai.html = {
|
|
updateCrumbHtml: updateCrumbHtml,
|
|
updateExtendedHtml: updateExtendedHtml,
|
|
updateTreeHtml: updateTreeHtml,
|
|
updateHtml: updateHtml
|
|
};
|
|
|
|
}(jQuery, h5ai));
|