mirror of
https://github.com/webmin/webmin.git
synced 2026-10-29 06:31:04 +00:00
1545 lines
49 KiB
Perl
Executable File
1545 lines
49 KiB
Perl
Executable File
# Virtualmin Framed Theme
|
|
# Icons copyright David Vignoni, all other theme elements copyright 2005-2007
|
|
# Virtualmin, Inc.
|
|
|
|
$main::cloudmin_no_create_links = 1;
|
|
$main::cloudmin_no_edit_buttons = 1;
|
|
$main::cloudmin_no_global_links = 1;
|
|
|
|
$main::mailbox_no_addressbook_button = 1;
|
|
$main::mailbox_no_folder_button = 1;
|
|
|
|
$main::basic_virtualmin_menu = 1;
|
|
$main::basic_virtualmin_domain = 1;
|
|
$main::nocreate_virtualmin_menu = 1;
|
|
$main::nosingledomain_virtualmin_mode = 1;
|
|
|
|
our $ui_formcount;
|
|
|
|
# Global state for wrapper
|
|
# if 0, wrapper isn't on, add one and open it, if 1 close it, if 2+, subtract
|
|
# but don't close
|
|
$main::WRAPPER_OPEN = 0;
|
|
$main::COLUMNS_WRAPPER_OPEN = 0;
|
|
|
|
# theme_ui_print_header(subtext, header-args...)
|
|
# Prints the page header like the core, but wraps the text under the
|
|
# title in a span of its own, then prints the subtext block
|
|
sub theme_ui_print_header
|
|
{
|
|
my ($text, @args) = @_;
|
|
if ($args[9] ne '') {
|
|
# Text under the title, such as a version, gets an element of its own
|
|
# so the stylesheet can make it smaller
|
|
$args[9] = "<span class='ui_header_below'>$args[9]</span>";
|
|
}
|
|
&header(@args);
|
|
print &ui_post_header($text);
|
|
}
|
|
|
|
# theme_ui_post_header([subtext])
|
|
# Returns HTML to appear directly after a standard header() call
|
|
sub theme_ui_post_header
|
|
{
|
|
my ($text) = @_;
|
|
my $rv;
|
|
$rv .= "<div class='ui_post_header'>$text</div>\n" if (defined($text));
|
|
$rv .= "<p></p>" if (!defined($text));
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_pre_footer()
|
|
# Returns HTML to appear directly before a standard footer() call
|
|
sub theme_ui_pre_footer
|
|
{
|
|
my $rv;
|
|
$rv .= "<p></p>\n";
|
|
return $rv;
|
|
}
|
|
|
|
# ui_print_footer(args...)
|
|
# Print HTML for a footer with the pre-footer line. Args are the same as those
|
|
# passed to footer()
|
|
sub theme_ui_print_footer
|
|
{
|
|
local @args = @_;
|
|
print &ui_pre_footer();
|
|
if ($ui_formcount) {
|
|
print <<EOL;
|
|
<script>
|
|
(function(){
|
|
var forms = document.forms || [];
|
|
for(var i = 0; i < forms.length; i++){
|
|
for(var j = 0; j < forms[i].length; j++){
|
|
if(!forms[i][j].readonly != undefined && forms[i][j].type != "hidden" && forms[i][j].disabled != true && forms[i][j].style.display != 'none'){
|
|
forms[i][j].focus();
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
})();
|
|
</script>
|
|
EOL
|
|
}
|
|
&footer(@args);
|
|
}
|
|
|
|
sub theme_icons_table
|
|
{
|
|
my ($i, $need_tr);
|
|
my $cols = $_[3] ? $_[3] : 4;
|
|
my $per = int(100.0 / $cols);
|
|
print "<div class='wrapper'>\n";
|
|
print "<table id='main' width=100% cellpadding=5 class='icons_table'>\n";
|
|
for($i=0; $i<@{$_[0]}; $i++) {
|
|
if ($i%$cols == 0) { print "<tr>\n"; }
|
|
print "<td width=$per% align=center valign=top>\n";
|
|
&generate_icon($_[2]->[$i], $_[1]->[$i], $_[0]->[$i],
|
|
$_[4], $_[5], $_[6], $_[7]->[$i], $_[8]->[$i]);
|
|
print "</td>\n";
|
|
if ($i%$cols == $cols-1) { print "</tr>\n"; }
|
|
}
|
|
while($i++%$cols) { print "<td width=$per%></td>\n"; $need_tr++; }
|
|
print "</tr>\n" if ($need_tr);
|
|
print "</table>\n";
|
|
print "</div>\n";
|
|
}
|
|
|
|
sub theme_generate_icon
|
|
{
|
|
my $w = !defined($_[4]) ? "width=48" : $_[4] ? "width=$_[4]" : "";
|
|
my $h = !defined($_[5]) ? "height=48" : $_[5] ? "height=$_[5]" : "";
|
|
if ($tconfig{'noicons'}) {
|
|
if ($_[2]) {
|
|
print "$_[6]<a href=\"$_[2]\" $_[3]>$_[1]</a>$_[7]\n";
|
|
}
|
|
else {
|
|
print "$_[6]$_[1]$_[7]\n";
|
|
}
|
|
}
|
|
elsif ($_[2]) {
|
|
print "<table><tr><td width=48 height=48>\n",
|
|
"<a href=\"$_[2]\" $_[3]><img src=\"$_[0]\" alt=\"\" border=0 ",
|
|
"$w $h></a></td></tr></table>\n";
|
|
print "$_[6]<a href=\"$_[2]\" $_[3]>$_[1]</a>$_[7]\n";
|
|
}
|
|
else {
|
|
print "<table><tr><td width=48 height=48>\n",
|
|
"<img src=\"$_[0]\" alt=\"\" border=0 $w $h>",
|
|
"</td></tr></table>\n$_[6]$_[1]$_[7]\n";
|
|
}
|
|
}
|
|
|
|
# theme_post_save_domain(&domain, action)
|
|
# Called by Virtualmin after a domain is updated, to refresh the left menu
|
|
sub theme_post_save_domain
|
|
{
|
|
local ($d, $action) = @_;
|
|
# Refresh left side, in case options have changed
|
|
print "<script>\n";
|
|
if ($action eq 'create') {
|
|
# Select the new domain
|
|
print "top.left.location = '@{[&get_webprefix()]}/left.cgi?mode=virtual-server&dom=$d->{'id'}';\n";
|
|
}
|
|
else {
|
|
# Just refresh left
|
|
print "top.left.location = top.left.location;\n";
|
|
}
|
|
print "</script>\n";
|
|
}
|
|
|
|
# theme_post_save_domains([domain, action]+)
|
|
# Called after multiple domains are updated, to refresh the left menu
|
|
sub theme_post_save_domains
|
|
{
|
|
print "<script>\n";
|
|
print "top.left.location = top.left.location;\n";
|
|
print "</script>\n";
|
|
}
|
|
|
|
# theme_post_save_server(&server, action)
|
|
# Called by Cloudmin after a server is updated, to refresh the left menu
|
|
sub theme_post_save_server
|
|
{
|
|
local ($s, $action) = @_;
|
|
if ($action eq 'create' || $action eq 'delete' ||
|
|
!$done_theme_post_save_server++) {
|
|
print "<script>\n";
|
|
print "top.left.location = top.left.location;\n";
|
|
print "</script>\n";
|
|
}
|
|
}
|
|
|
|
# theme_select_server(&server)
|
|
# Called by Cloudmin when a page for a server is displayed, to select it on the
|
|
# left menu.
|
|
sub theme_select_server
|
|
{
|
|
local ($server) = @_;
|
|
print <<EOF;
|
|
<script>
|
|
if (window.parent && window.parent.frames[0]) {
|
|
var leftdoc = window.parent.frames[0].document;
|
|
var leftform = leftdoc.forms[0];
|
|
if (leftform) {
|
|
var serversel = leftform['sid'];
|
|
if (serversel && serversel.value != '$server->{'id'}' ||
|
|
!serversel) {
|
|
//if (serversel) {
|
|
// // Need to change value of selector
|
|
// serversel.value = '$server->{'id'}';
|
|
// }
|
|
window.parent.frames[0].location = '@{[&get_webprefix()]}/left.cgi?mode=server-manager&sid=$server->{'id'}';
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
EOF
|
|
}
|
|
|
|
# theme_select_domain(&domain)
|
|
# Called by Virtualmin when a page for a server is displayed, to select it on
|
|
# the left menu.
|
|
sub theme_select_domain
|
|
{
|
|
local ($d) = @_;
|
|
print <<EOF;
|
|
<script>
|
|
if (window.parent && window.parent.frames[0]) {
|
|
var leftdoc = window.parent.frames[0].document;
|
|
var leftform = leftdoc.forms[0];
|
|
if (leftform) {
|
|
var domsel = leftform['dom'];
|
|
if (domsel && domsel.value != '$d->{'id'}') {
|
|
// Need to change value
|
|
// domsel.value = '$d->{'id'}';
|
|
window.parent.frames[0].location = '@{[&get_webprefix()]}/left.cgi?mode=virtual-server&dom=$d->{'id'}';
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
EOF
|
|
}
|
|
|
|
# theme_post_save_folder(&folder, action)
|
|
# Called after some folder is changed, to refresh the left frame. The action
|
|
# may be 'create', 'delete', 'modify' or 'read'
|
|
sub theme_post_save_folder
|
|
{
|
|
local ($folder, $action) = @_;
|
|
my $ref;
|
|
if ($action eq 'create' || $action eq 'delete' || $action eq 'modify') {
|
|
# Always refresh
|
|
$ref = 1;
|
|
}
|
|
else {
|
|
# Only refresh if showing unread count
|
|
if (defined(&mailbox::should_show_unread) &&
|
|
&mailbox::should_show_unread($folder)) {
|
|
$ref = 1;
|
|
}
|
|
}
|
|
if ($ref) {
|
|
print "<script>\n";
|
|
print "top.frames[0].document.location = top.frames[0].document.location;\n";
|
|
print "</script>\n";
|
|
}
|
|
}
|
|
|
|
sub theme_post_change_modules
|
|
{
|
|
print <<EOF;
|
|
<script>
|
|
var url = '' + top.left.location;
|
|
if (url.indexOf('mode=modules') > 0) {
|
|
top.left.location = url;
|
|
}
|
|
</script>
|
|
EOF
|
|
}
|
|
|
|
# theme_prebody(header-args...)
|
|
# Hides the module index link on Virtualmin pages, whose menu is already
|
|
# in the left frame
|
|
sub theme_prebody
|
|
{
|
|
if (get_module_name() eq "virtual-server") {
|
|
# No need for Module Index link, as we have the left-side frame
|
|
$tconfig{'nomoduleindex'} = 1;
|
|
}
|
|
}
|
|
|
|
# theme_prehead()
|
|
# Prints the head parts of every page: the color scheme meta, the scheme
|
|
# and frame scripts, and the links to the stylesheet and the table sorting
|
|
# script. Also sets the body attributes the stylesheet keys on: the module
|
|
# name as a class and the forced color scheme, if any.
|
|
sub theme_prehead
|
|
{
|
|
my $pfx = &get_webprefix();
|
|
my $scheme = &theme_color_scheme();
|
|
print "<meta name='color-scheme' content='".($scheme || "light dark")."'>\n";
|
|
print &theme_scheme_script($scheme);
|
|
print &theme_frame_script();
|
|
print "<link rel='stylesheet' type='text/css' href='$pfx/unauthenticated/".
|
|
"gray-theme.css?".&theme_asset_key("gray-theme.css")."'>\n";
|
|
print "<script type='text/javascript' src='$pfx/unauthenticated/".
|
|
"sorttable.js?".&theme_asset_key("sorttable.js")."'></script>\n";
|
|
my @cls = grep { $_ } ( $main::gray_theme_body_class, &get_module_name() );
|
|
$tconfig{'inbody'} = (@cls ? "class='".join(" ", @cls)."'" : "").
|
|
($scheme ? " data-scheme='$scheme'" : "");
|
|
}
|
|
|
|
# theme_scheme_script([forced-scheme])
|
|
# Returns the scheme bootstrap and frame-wide keyboard shortcuts. The optional
|
|
# forced scheme is the configured default. Alt+T stores a per-tab override
|
|
# without changing that setting, and Alt+R reloads only the content frame.
|
|
# Scheme changes reach the frameset and both frames. An automatic scheme uses
|
|
# its last value before first paint, follows system changes, and is checked
|
|
# again after load.
|
|
sub theme_scheme_script
|
|
{
|
|
my ($forced) = @_;
|
|
$forced = $forced && $forced =~ /^(light|dark)$/ ? $1 : "";
|
|
my $rv = <<'EOF';
|
|
<script type='text/javascript'>
|
|
/* initializeGrayTheme(): Apply the scheme and bind frame shortcuts. */
|
|
(function() {
|
|
var key = 'gray-theme-scheme', overrideKey = key + '-override',
|
|
forced = '__GRAY_THEME_FORCED_SCHEME__',
|
|
root = document.documentElement,
|
|
mq = window.matchMedia('(prefers-color-scheme: dark)'),
|
|
stored = null, changed = false;
|
|
try { stored = localStorage.getItem(key); } catch(e) { }
|
|
/* valid(value): Return whether value is a supported scheme. */
|
|
function valid(v) { return v == 'dark' || v == 'light'; }
|
|
/* browserScheme(): Return the scheme selected by the browser. */
|
|
function browserScheme() { return mq.matches ? 'dark' : 'light'; }
|
|
/* baseScheme(): Return the configured scheme or system preference. */
|
|
function baseScheme() { return valid(forced) ? forced : browserScheme(); }
|
|
/* getOverride(): Read this tab's override when storage is available. */
|
|
function getOverride() {
|
|
try { return sessionStorage.getItem(overrideKey); }
|
|
catch(e) { return null; }
|
|
}
|
|
/* rememberOverride(value): Store only a scheme that differs from the base. */
|
|
function rememberOverride(v) {
|
|
try {
|
|
/* Remove an override that now matches the base. */
|
|
if (v == baseScheme()) sessionStorage.removeItem(overrideKey);
|
|
/* Keep a different choice for later pages in this tab. */
|
|
else sessionStorage.setItem(overrideKey, v);
|
|
}
|
|
catch(e) { }
|
|
}
|
|
/* apply(value, [remember]): Apply a scheme and optionally cache it. */
|
|
function apply(v, remember) {
|
|
/* Ignore malformed values from storage or another frame. */
|
|
if (!valid(v)) return;
|
|
root.setAttribute('data-scheme', v);
|
|
/* Update body selectors once the body exists. */
|
|
if (document.body) document.body.setAttribute('data-scheme', v);
|
|
/* Let newly loaded frames inherit the frameset scheme. */
|
|
if (self == top) root.style.colorScheme = v;
|
|
/* Do not cache a scheme relayed from another frame. */
|
|
if (remember !== false) {
|
|
try { localStorage.setItem(key, v); } catch(e) { }
|
|
}
|
|
}
|
|
/* grayThemeApplyScheme(value, [remember]): Apply a relayed scheme. */
|
|
window.grayThemeApplyScheme = function(v, remember) {
|
|
changed = true;
|
|
/* Save a relayed user choice as this tab's override. */
|
|
if (remember) rememberOverride(v);
|
|
apply(v, false);
|
|
};
|
|
/* applyEverywhere(value): Apply a scheme across the frameset. */
|
|
function applyEverywhere(v) {
|
|
changed = true;
|
|
rememberOverride(v);
|
|
apply(v);
|
|
try {
|
|
/* Relay a child-frame change to the frameset. */
|
|
if (top != window && top.grayThemeApplyScheme)
|
|
top.grayThemeApplyScheme(v, true);
|
|
}
|
|
catch(e) { }
|
|
/* syncFrame(name): Apply the scheme to one named frame. */
|
|
['left', 'right'].forEach(function(name) {
|
|
try {
|
|
var frame = top.frames[name];
|
|
/* Skip this document and frames that are not ready. */
|
|
if (frame && frame != window && frame.grayThemeApplyScheme)
|
|
frame.grayThemeApplyScheme(v, true);
|
|
}
|
|
catch(e) { }
|
|
});
|
|
}
|
|
/* Prefer the tab override, configured scheme, saved scheme, then system. */
|
|
var override = getOverride();
|
|
apply(valid(override) ? override :
|
|
valid(forced) ? forced :
|
|
valid(stored) ? stored : browserScheme());
|
|
/* syncBodyScheme(): Copy the root scheme to the new body. */
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
apply(root.getAttribute('data-scheme'), false);
|
|
});
|
|
/* onchange(): Follow system changes unless a tab override is active. */
|
|
function onchange() {
|
|
var override = getOverride(), current = browserScheme();
|
|
/* Preserve an override that differs from the system scheme. */
|
|
if (valid(override) && override != current) return;
|
|
/* Remove an override once the system reaches the same scheme. */
|
|
if (valid(override)) rememberOverride(current);
|
|
changed = true;
|
|
apply(current);
|
|
}
|
|
/* A configured scheme does not follow system preference changes. */
|
|
if (!valid(forced)) {
|
|
/* Prefer the current media-query listener API. */
|
|
if (mq.addEventListener) mq.addEventListener('change', onchange);
|
|
/* Fall back to the older listener API. */
|
|
else mq.addListener(onchange);
|
|
}
|
|
/* handleThemeShortcut(event): Handle Alt+T and Alt+R in any frame. */
|
|
document.addEventListener('keydown', function(event) {
|
|
/* Ignore other modifiers, repeats, composition and handled events. */
|
|
if (event.defaultPrevented || event.repeat || event.isComposing ||
|
|
!event.altKey || event.ctrlKey || event.metaKey || event.shiftKey)
|
|
return;
|
|
/* Alt+T toggles the palette throughout the frameset. */
|
|
if (event.code == 'KeyT' || event.keyCode == 84) {
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
applyEverywhere(root.getAttribute('data-scheme') == 'dark' ?
|
|
'light' : 'dark');
|
|
}
|
|
/* Alt+R reloads content without refreshing navigation. */
|
|
else if (event.code == 'KeyR' || event.keyCode == 82) {
|
|
var frame = null;
|
|
try { frame = top.frames['right']; } catch(e) { }
|
|
/* Do not claim the browser shortcut outside the main frameset. */
|
|
if (!frame) return;
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
try { frame.location.reload(); } catch(e) { }
|
|
}
|
|
}, true);
|
|
/* Recheck an automatic scheme after the top-level page loads. */
|
|
if (self == top && !valid(forced))
|
|
/* refreshBrowserScheme(): Recheck after all frames load. */
|
|
window.addEventListener('load', function() {
|
|
/* refreshUnchangedScheme(): Correct untouched automatic state. */
|
|
setTimeout(function() {
|
|
/* Preserve user changes and tab overrides. */
|
|
if (!changed && !valid(getOverride()))
|
|
applyEverywhere(browserScheme());
|
|
}, 1000);
|
|
});
|
|
})();
|
|
</script>
|
|
EOF
|
|
$rv =~ s/__GRAY_THEME_FORCED_SCHEME__/$forced/g;
|
|
return $rv;
|
|
}
|
|
|
|
# theme_frame_script()
|
|
# Returns a script for a page shown in the right frame, which tells the
|
|
# menu frame when the page starts to leave and when the next one has
|
|
# loaded, so the menu can show a loader in between. It does nothing in
|
|
# the menu frame itself, in popups and outside the frameset.
|
|
sub theme_frame_script
|
|
{
|
|
return <<'EOF';
|
|
<script type='text/javascript'>
|
|
(function() {
|
|
var menu = null;
|
|
try { if (parent != window) menu = parent.frames['left']; } catch(e) { }
|
|
if (!menu || menu == window) return;
|
|
function tell(name) { try { if (menu[name]) menu[name](); } catch(e) { } }
|
|
window.addEventListener('pagehide', function() { tell('rightLoading'); });
|
|
window.addEventListener('DOMContentLoaded', function() { tell('rightLoaded'); });
|
|
})();
|
|
</script>
|
|
EOF
|
|
}
|
|
|
|
# theme_color_scheme()
|
|
# Returns light or dark when the theme settings force a color scheme, or an
|
|
# empty string to follow the browser. The setting is stored with the other
|
|
# system information page settings, per user unless they are global.
|
|
sub theme_color_scheme
|
|
{
|
|
return $main::gray_theme_scheme if (defined($main::gray_theme_scheme));
|
|
my $file = "$config_directory/$current_theme/sections";
|
|
my %sects;
|
|
&read_file($file, \%sects);
|
|
if (!$sects{'global'}) {
|
|
# Unless the global settings are forced on everyone, the user's own
|
|
# file replaces them
|
|
my %usects;
|
|
%sects = %usects if (&read_file("$file.$remote_user", \%usects));
|
|
}
|
|
$main::gray_theme_scheme = $sects{'scheme'} =~ /^(light|dark)$/ ? $1 : "";
|
|
return $main::gray_theme_scheme;
|
|
}
|
|
|
|
# theme_asset_key(file)
|
|
# Returns the modification time of a file under unauthenticated, used as a
|
|
# cache key in its URL so browsers pick up a changed file at once
|
|
sub theme_asset_key
|
|
{
|
|
my ($file) = @_;
|
|
my @st = stat("$theme_root_directory/unauthenticated/$file");
|
|
return @st ? $st[9] : &get_webmin_version();
|
|
}
|
|
|
|
# theme_tag_class(tags, class)
|
|
# Adds a class to a string of tag attributes, merging it into an existing
|
|
# class attribute so that a tag never gets two of them
|
|
sub theme_tag_class
|
|
{
|
|
my ($tags, $class) = @_;
|
|
return "class='$class'" if (!$tags);
|
|
return $tags if ($tags =~ s/class=(['"])([^'"]*)\1/class=$1$2 $class$1/);
|
|
return "$tags class='$class'";
|
|
}
|
|
|
|
# theme_popup_prehead(title, ...)
|
|
# Popup windows and the frames get the same head as ordinary pages
|
|
sub theme_popup_prehead
|
|
{
|
|
return &theme_prehead();
|
|
}
|
|
|
|
# theme_ui_table_start(heading, [tabletags], [cols], [&default-tds],
|
|
# [right-heading])
|
|
# Returns HTML for the start of a form table: a card with the heading in
|
|
# its head row and the label and value rows in a nested table
|
|
sub theme_ui_table_start
|
|
{
|
|
my ($heading, $tabletags, $cols, $tds, $rightheading) = @_;
|
|
# Expose the column count so CSS can size the form layout.
|
|
my $formcols = $cols || 4;
|
|
if (! $tabletags =~ /width/) { $tabletages .= " width=100%"; }
|
|
if (defined($main::ui_table_cols)) {
|
|
# Push on stack, for nested call
|
|
push(@main::ui_table_cols_stack, $main::ui_table_cols);
|
|
push(@main::ui_table_pos_stack, $main::ui_table_pos);
|
|
push(@main::ui_table_default_tds_stack, $main::ui_table_default_tds);
|
|
}
|
|
my $rv;
|
|
my $colspan = 1;
|
|
|
|
if (!$main::WRAPPER_OPEN) {
|
|
# A class in the table tags, such as the login form's, joins the
|
|
# wrapper class instead of being lost as a second class attribute
|
|
$rv .= "<table ".&theme_tag_class($tabletags, 'shrinkwrapper').">\n";
|
|
$rv .= "<tr><td>\n";
|
|
}
|
|
$main::WRAPPER_OPEN++;
|
|
$rv .= "<table class='ui_table' $tabletags>\n";
|
|
if (defined($heading) || defined($rightheading)) {
|
|
# Heading row, with an optional part at the right
|
|
$rv .= "<thead><tr>";
|
|
# Add the main heading when present.
|
|
if (defined($heading)) {
|
|
$rv .= "<td><b>$heading</b></td>"
|
|
}
|
|
# Put optional actions or context at the right.
|
|
if (defined($rightheading)) {
|
|
$rv .= "<td align=right>$rightheading</td>";
|
|
$colspan++;
|
|
}
|
|
$rv .= "</tr></thead>\n";
|
|
}
|
|
$rv .= "<tbody> <tr class='ui_table_body'> <td colspan=$colspan>".
|
|
"<table class='ui_form_rows ui_form_rows_$formcols' width=100%>\n";
|
|
$main::ui_table_cols = $formcols;
|
|
$main::ui_table_pos = 0;
|
|
$main::ui_table_default_tds = $tds;
|
|
return $rv;
|
|
}
|
|
|
|
# ui_table_row(label, value, [cols], [&td-tags])
|
|
# Returns HTML for a row in a table started by ui_table_start, with a 1-column
|
|
# label and 1+ column value.
|
|
sub theme_ui_table_row
|
|
{
|
|
my ($label, $value, $cols, $tds, $trs) = @_;
|
|
$cols ||= 1;
|
|
$tds ||= $main::ui_table_default_tds;
|
|
my $rv;
|
|
if ($main::ui_table_pos+$cols+1 > $main::ui_table_cols &&
|
|
$main::ui_table_pos != 0) {
|
|
# If the requested number of cols won't fit in the number
|
|
# remaining, start a new row
|
|
my $leftover = $main::ui_table_cols - $main::ui_table_pos;
|
|
$rv .= "<td colspan=$leftover></td>\n";
|
|
$rv .= "</tr>\n";
|
|
$main::ui_table_pos = 0;
|
|
}
|
|
if (defined($label) &&
|
|
($value =~ /id="([^"]+)"/ || $value =~ /id='([^']+)'/ ||
|
|
$value =~ /id=([^>\s]+)/)) {
|
|
# Value contains an input with an ID
|
|
my $id = $1;
|
|
$label = "<label for=\""."e_escape($id)."\">$label</label>";
|
|
}
|
|
my $trtags_attrs = ref($trs) eq 'ARRAY' && $trs->[0] ? " $trs->[0]" : "";
|
|
my $trtags_class = ref($trs) eq 'ARRAY' && $trs->[1] ? " $trs->[1]" : "";
|
|
$rv .= "<tr class='ui_form_pair$trtags_class'$trtags_attrs>\n" if ($main::ui_table_pos%$main::ui_table_cols == 0);
|
|
$rv .= "<td class='ui_form_label' $tds->[0]><b>$label</b></td>\n" if (defined($label));
|
|
$rv .= "<td class='ui_form_value' colspan=$cols $tds->[1]>$value</td>\n";
|
|
$main::ui_table_pos += $cols+(defined($label) ? 1 : 0);
|
|
if ($main::ui_table_pos%$main::ui_table_cols == 0) {
|
|
$rv .= "</tr>\n";
|
|
$main::ui_table_pos = 0;
|
|
}
|
|
return $rv;
|
|
}
|
|
|
|
sub theme_ui_table_hr
|
|
{
|
|
my $rv;
|
|
if ($main::ui_table_pos) {
|
|
$rv .= "</tr>\n";
|
|
$main::ui_table_pos = 0;
|
|
}
|
|
$rv .= "<tr class='ui_form_pair'>\n";
|
|
$rv .= "<td class='ui_form_label' colspan=$main::ui_table_cols><hr></td>\n";
|
|
$rv .= "</tr>\n";
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_table_end()
|
|
# Returns HTML for the end of a table started by theme_ui_table_start
|
|
sub theme_ui_table_end
|
|
{
|
|
my $rv;
|
|
if ($main::ui_table_cols == 4 && $main::ui_table_pos) {
|
|
# Add an empty block to balance the table
|
|
$rv .= &ui_table_row(" ", " ");
|
|
}
|
|
if (@main::ui_table_cols_stack) {
|
|
# Back to the column state of the enclosing table
|
|
$main::ui_table_cols = pop(@main::ui_table_cols_stack);
|
|
$main::ui_table_pos = pop(@main::ui_table_pos_stack);
|
|
$main::ui_table_default_tds = pop(@main::ui_table_default_tds_stack);
|
|
}
|
|
else {
|
|
# No enclosing table
|
|
$main::ui_table_cols = undef;
|
|
$main::ui_table_pos = undef;
|
|
$main::ui_table_default_tds = undef;
|
|
}
|
|
$rv .= "</tbody></table></td></tr></table>\n";
|
|
if ($main::WRAPPER_OPEN==1) {
|
|
# Close the card around the outermost table
|
|
$rv .= "</td></tr>\n";
|
|
$rv .= "</table>\n";
|
|
}
|
|
$main::WRAPPER_OPEN--;
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_tabs_start(&tabs, name, selected, show-border)
|
|
# Render a row of tabs from which one can be selected. Each tab is an array
|
|
# ref containing a name, title and link. The tabs are links in a div, and
|
|
# select_tab switches their classes and the visible tab body.
|
|
sub theme_ui_tabs_start
|
|
{
|
|
my ($tabs, $name, $sel, $border) = @_;
|
|
my $rv;
|
|
if (!$main::ui_hidden_start_donejs++) {
|
|
# The tab switching script is printed once per page
|
|
$rv .= &ui_hidden_javascript();
|
|
}
|
|
|
|
# List of tab names, used by select_tab to find the tabs and bodies
|
|
my $tabnames = &convert_to_json([map { $_->[0] } @$tabs]);
|
|
$rv .= "<script>\n";
|
|
$rv .= "document.${name}_tabnames = $tabnames;\n";
|
|
$rv .= "</script>\n";
|
|
|
|
# Output the tabs
|
|
$rv .= &ui_hidden($name, $sel)."\n";
|
|
$rv .= "<div class='ui_tabs' id='tabs_$name'>\n";
|
|
foreach my $t (@$tabs) {
|
|
my $cls = $t->[0] eq $sel ? "ui_tab ui_tab_selected" : "ui_tab";
|
|
my $href = $t->[2] ne '' ? $t->[2] : '#';
|
|
$rv .= "<a id='tab_$t->[0]' class='$cls' href='$href' ".
|
|
"onClick='return select_tab(\"$name\", \"$t->[0]\")'>".
|
|
"$t->[1]</a>\n";
|
|
}
|
|
$rv .= "</div>\n";
|
|
|
|
if ($border) {
|
|
# All tab bodies are within a box
|
|
$rv .= "<div class='ui_tabs_box'>\n";
|
|
}
|
|
$main::ui_tabs_selected = $sel;
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_tabs_end(show-border)
|
|
# Closes the box opened by theme_ui_tabs_start
|
|
sub theme_ui_tabs_end
|
|
{
|
|
my ($border) = @_;
|
|
return $border ? "</div>\n" : "";
|
|
}
|
|
|
|
# theme_ui_columns_start(&headings, [width-percent], [no-border],
|
|
# [&td-tags], [title], [sortable], [class])
|
|
# Returns HTML for a multi-column table. The sortable flag forces client-side
|
|
# sorting, and class adds a table class.
|
|
sub theme_ui_columns_start
|
|
{
|
|
my ($heads, $width, $noborder, $tdtags, $title, $sortable, $class) = @_;
|
|
my ($href) = grep { $_ =~ /<a\s+href/i } @$heads;
|
|
my $rv;
|
|
$theme_ui_columns_row_toggle = 0;
|
|
if (!$noborder && !$main::COLUMNS_WRAPPER_OPEN) {
|
|
# The outermost bordered table opens the card and a container that
|
|
# scrolls wide columns without widening the page.
|
|
$rv .= "<table class='wrapper' width="
|
|
. ($width ? $width : "100")
|
|
. "%>\n";
|
|
$rv .= "<tr><td><div class='ui_columns_scroll'>\n";
|
|
}
|
|
if (!$noborder) {
|
|
# Nested bordered tables share that card
|
|
$main::COLUMNS_WRAPPER_OPEN++;
|
|
}
|
|
# Tables are sorted by sorttable.js unless their headings are links, or
|
|
# always when the caller asked for a sortable table
|
|
my @classes;
|
|
push(@classes, "ui_table") if (!$noborder);
|
|
push(@classes, "sortable") if (!$href || $sortable);
|
|
push(@classes, "ui_columns");
|
|
push(@classes, $class) if ($class);
|
|
$rv .= "<table".(@classes ? " class='".join(" ", @classes)."'" : "").
|
|
(defined($width) ? " width=$width%" : "").
|
|
($sortable ? " data-sortable='1'" : "").">\n";
|
|
if ($title) {
|
|
# Title row spanning the table, above the column headings
|
|
$rv .= "<thead> <tr ".&theme_tag_class($tb, 'ui_columns_heading').">".
|
|
"<td colspan=".scalar(@$heads)."><b>$title</b></td>".
|
|
"</tr> </thead> <tbody>\n";
|
|
}
|
|
$rv .= "<thead> <tr ".&theme_tag_class($tb, 'ui_columns_heads').">\n";
|
|
my $i;
|
|
for($i=0; $i<@$heads; $i++) {
|
|
$rv .= "<td ".$tdtags->[$i]."><b>".
|
|
($heads->[$i] eq "" ? "<br>" : $heads->[$i])."</b></td>\n";
|
|
}
|
|
$rv .= "</tr></thead> <tbody>\n";
|
|
$theme_ui_columns_count++;
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_columns_header(&columns, &tdtags)
|
|
# Returns HTML for a heading row inside a multi-column table
|
|
sub theme_ui_columns_header
|
|
{
|
|
my ($cols, $tdtags) = @_;
|
|
my $rv;
|
|
$rv .= "<tr ".&theme_tag_class($tb, 'ui_columns_header').">\n";
|
|
for(my $i=0; $i<@$cols; $i++) {
|
|
$rv .= "<td ".$tdtags->[$i]."><b>".
|
|
($cols->[$i] eq "" ? "<br>" : $cols->[$i])."</b></td>\n";
|
|
}
|
|
$rv .= "</tr>\n";
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_columns_row(&columns, &tdtags)
|
|
# Returns HTML for a row in a multi-column table. Rows are highlighted on
|
|
# hover and when checked by the stylesheet, so no handlers are needed.
|
|
sub theme_ui_columns_row
|
|
{
|
|
$theme_ui_columns_row_toggle = $theme_ui_columns_row_toggle ? '0' : '1';
|
|
local ($cols, $tdtags) = @_;
|
|
my $rv;
|
|
$rv .= "<tr class='ui_columns_row row$theme_ui_columns_row_toggle'>\n";
|
|
my $i;
|
|
for($i=0; $i<@$cols; $i++) {
|
|
$rv .= "<td ".$tdtags->[$i].">".
|
|
($cols->[$i] !~ /\S/ ? "<br>" : $cols->[$i])."</td>\n";
|
|
}
|
|
$rv .= "</tr>\n";
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_columns_end()
|
|
# Ends a table from theme_ui_columns_start. Also closes the scroll container
|
|
# and card opened for the outermost bordered table.
|
|
sub theme_ui_columns_end
|
|
{
|
|
my $rv;
|
|
$rv = "</tbody> </table>\n";
|
|
# Close the shared scroll container with the outermost table.
|
|
if ($main::COLUMNS_WRAPPER_OPEN == 1) {
|
|
$rv .= "</div></td> </tr> </table>\n";
|
|
}
|
|
$main::COLUMNS_WRAPPER_OPEN--;
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_grid_table(&elements, columns, [width-percent], [tds], [tabletags],
|
|
# [title])
|
|
# Given a list of HTML elements, formats them into a table with the given
|
|
# number of columns. However, themes are free to override this to use fewer
|
|
# columns where space is limited.
|
|
sub theme_ui_grid_table
|
|
{
|
|
my ($elements, $cols, $width, $tds, $tabletags, $title) = @_;
|
|
return "" if (!@$elements);
|
|
|
|
my $rv = "<table class='wrapper' "
|
|
. ($width ? " width=$width%" : " width=100%")
|
|
. ($tabletags ? " ".$tabletags : "")
|
|
. "><tr><td>\n";
|
|
$rv .= "<table class='ui_table ui_grid_table'"
|
|
. ($width ? " width=$width%" : "")
|
|
. ($tabletags ? " ".$tabletags : "")
|
|
. ">\n";
|
|
if ($title) {
|
|
$rv .= "<thead><tr class='ui_grid_heading'> ".
|
|
"<td colspan=$cols><b>$title</b></td> </tr></thead>\n";
|
|
}
|
|
$rv .= "<tbody>\n";
|
|
my $i;
|
|
for($i=0; $i<@$elements; $i++) {
|
|
$rv .= "<tr class='ui_grid_row'>" if ($i%$cols == 0);
|
|
$rv .= "<td ".$tds->[$i%$cols]." valign=top class='ui_grid_cell'>".
|
|
$elements->[$i]."</td>\n";
|
|
$rv .= "</tr>" if ($i%$cols == $cols-1);
|
|
}
|
|
if ($i%$cols) {
|
|
while($i%$cols) {
|
|
$rv .= "<td ".$tds->[$i%$cols]." class='ui_grid_cell'><br></td>\n";
|
|
$i++;
|
|
}
|
|
$rv .= "</tr>\n";
|
|
}
|
|
$rv .= "</table>\n";
|
|
$rv .= "</tbody>\n";
|
|
$rv .= "</td></tr></table>\n"; # wrapper
|
|
return $rv;
|
|
}
|
|
|
|
sub theme_ui_hidden_start
|
|
{
|
|
my ($title, $name, $status) = @_;
|
|
my $rv;
|
|
my $opened = $status ? " open" : "";
|
|
$rv .= "<details class='ui_hidden_start'$opened>";
|
|
$rv .= "<summary>$title</summary>\n";
|
|
return $rv;
|
|
}
|
|
|
|
=head2 ui_hidden_end(name)
|
|
|
|
Returns HTML for the end of a hidden section, started by ui_hidden_start.
|
|
|
|
=cut
|
|
sub theme_ui_hidden_end
|
|
{
|
|
return "</details>\n";
|
|
}
|
|
|
|
# theme_ui_hidden_table_start(heading, [tabletags], [cols], name, status,
|
|
# [&default-tds], [rightheading])
|
|
# A table with a heading and table inside, and which is collapsible
|
|
sub theme_ui_hidden_table_start
|
|
{
|
|
my ($heading, $tabletags, $cols, $name, $status, $tds, $rightheading) = @_;
|
|
my $rv;
|
|
if (!$main::ui_hidden_start_donejs++) {
|
|
$rv .= &ui_hidden_javascript();
|
|
}
|
|
my $opened = $status ? " open" : "";
|
|
my $header = defined($heading) ? "<span>$heading</span>" : "";
|
|
my $rheader = defined($rightheading) ? "<span class='rightheading'>$rightheading</span>" : "";
|
|
if (!$main::WRAPPER_OPEN) { # If we're not already inside of a wrapper, wrap it
|
|
$rv .= "<div>\n";
|
|
}
|
|
$main::WRAPPER_OPEN++;
|
|
my $colspan = 1;
|
|
$rv .= "<details data-name='$name' class='ui_hidden_table_start'$opened $tabletags>";
|
|
$rv .= "<summary>$header $rheader</summary>\n";
|
|
$rv .= "<table width=100%>\n";
|
|
$main::ui_table_cols = $cols || 4;
|
|
$main::ui_table_pos = 0;
|
|
$main::ui_table_default_tds = $tds;
|
|
return $rv;
|
|
}
|
|
|
|
# ui_hidden_table_end(name)
|
|
# Returns HTML for the end of table with hiding, as started by
|
|
# ui_hidden_table_start
|
|
sub theme_ui_hidden_table_end
|
|
{
|
|
local $rv = "</table></details>\n";
|
|
if ( $main::WRAPPER_OPEN == 1 ) {
|
|
$main::WRAPPER_OPEN--;
|
|
$rv .= "</div>\n";
|
|
}
|
|
elsif ($main::WRAPPER_OPEN) { $main::WRAPPER_OPEN--; }
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_checked_columns_row(&columns, &tdtags, checkname, checkvalue,
|
|
# [checked], [disabled], [tags])
|
|
# Returns HTML for a row with a checkbox in its first column. The row is
|
|
# highlighted by the stylesheet while its checkbox is checked.
|
|
sub theme_ui_checked_columns_row
|
|
{
|
|
$theme_ui_columns_row_toggle = $theme_ui_columns_row_toggle ? '0' : '1';
|
|
local ($cols, $tdtags, $checkname, $checkvalue, $checked, $disabled, $tags) = @_;
|
|
my $rv;
|
|
my $rid = "e_escape("row_${checkname}_${checkvalue}");
|
|
my $mycb = &theme_tag_class($cb,
|
|
"row$theme_ui_columns_row_toggle ui_checked_columns");
|
|
$rv .= "<tr id=\"$rid\" $mycb>\n";
|
|
$rv .= "<td class='ui_checked_checkbox' ".$tdtags->[0].">".
|
|
&ui_checkbox($checkname, $checkvalue, undef, $checked, $tags,
|
|
$disabled).
|
|
"</td>\n";
|
|
my $i;
|
|
for($i=0; $i<@$cols; $i++) {
|
|
$rv .= "<td ".$tdtags->[$i+1].">";
|
|
if ($cols->[$i] !~ /<a\s+href|<input|<select|<textarea/) {
|
|
# Plain cells become labels for the control, so a click on
|
|
# them selects it
|
|
$rv .= "<label for=\"".
|
|
"e_escape("${checkname}_${checkvalue}")."\">";
|
|
}
|
|
$rv .= ($cols->[$i] !~ /\S/ ? "<br>" : $cols->[$i]);
|
|
if ($cols->[$i] !~ /<a\s+href|<input|<select|<textarea/) {
|
|
# Close that label
|
|
$rv .= "</label>";
|
|
}
|
|
$rv .= "</td>\n";
|
|
}
|
|
$rv .= "</tr>\n";
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_radio_columns_row(&columns, &tdtags, checkname, checkvalue,
|
|
# [checked])
|
|
# Returns HTML for a row with a radio button in its first column. The row
|
|
# is highlighted by the stylesheet while its button is selected.
|
|
sub theme_ui_radio_columns_row
|
|
{
|
|
local ($cols, $tdtags, $checkname, $checkvalue, $checked) = @_;
|
|
my $rv;
|
|
my $rid = "e_escape("row_${checkname}_${checkvalue}");
|
|
my $mycb = &theme_tag_class($cb, "ui_radio_columns");
|
|
$rv .= "<tr $mycb id=\"$rid\">\n";
|
|
$rv .= "<td ".$tdtags->[0]." class='ui_radio_radio'>".
|
|
&ui_oneradio($checkname, $checkvalue, undef, $checked).
|
|
"</td>\n";
|
|
my $i;
|
|
for($i=0; $i<@$cols; $i++) {
|
|
$rv .= "<td ".$tdtags->[$i+1].">";
|
|
if ($cols->[$i] !~ /<a\s+href|<input|<select|<textarea/) {
|
|
# Plain cells become labels for the control, so a click on
|
|
# them selects it
|
|
$rv .= "<label for=\"".
|
|
"e_escape("${checkname}_${checkvalue}")."\">";
|
|
}
|
|
$rv .= ($cols->[$i] !~ /\S/ ? "<br>" : $cols->[$i]);
|
|
if ($cols->[$i] !~ /<a\s+href|<input|<select|<textarea/) {
|
|
# Close that label
|
|
$rv .= "</label>";
|
|
}
|
|
$rv .= "</td>\n";
|
|
}
|
|
$rv .= "</tr>\n";
|
|
return $rv;
|
|
}
|
|
|
|
# theme_ui_nav_link(direction, url, disabled)
|
|
# Returns an arrow icon linking to provided url
|
|
sub theme_ui_nav_link
|
|
{
|
|
my ($direction, $url, $disabled) = @_;
|
|
my $icon = &ui_svg_icon($direction eq "left" ? "chevron-left"
|
|
: "chevron-right",
|
|
{ 'size' => 14,
|
|
'title' => $direction eq "left" ? '<-' : '->' });
|
|
if ($disabled) {
|
|
# A disabled arrow is plain, not a link
|
|
return "<span class='ui_nav_link ui_nav_link_disabled'>$icon</span>\n";
|
|
}
|
|
else {
|
|
# Arrow linking to the page
|
|
return "<a class='ui_nav_link' href=\"$url\">$icon</a>\n";
|
|
}
|
|
}
|
|
|
|
# theme_ui_links_row(&links)
|
|
# Returns links in a toolbar wrapper. Gray Theme hides the legacy separators
|
|
# and styles each link as a button.
|
|
sub theme_ui_links_row
|
|
{
|
|
my ($links) = @_;
|
|
# An empty list does not need a toolbar container.
|
|
return "" if (!$links || !@$links);
|
|
my @button_links = map {
|
|
my $link = $_;
|
|
# Drop the final period from the button without changing its source text.
|
|
$link =~ s/(?<!\.)\.(?=(?:\s*<\/[^>]+>)*\s*<\/a>\s*$)//i;
|
|
$link;
|
|
} @$links;
|
|
return "<div class='ui_links_row'>".
|
|
join(" <span class='ui_links_sep'>|</span> ", @button_links).
|
|
"</div>\n";
|
|
}
|
|
|
|
# theme_file_chooser_button(input, type, [form], [chroot], [addmode])
|
|
# Returns a button that opens the file chooser, in a window large enough
|
|
# for the theme's controls unless the Webmin configuration sets a size
|
|
sub theme_file_chooser_button
|
|
{
|
|
my ($input, $type, $form, $chroot, $add) = @_;
|
|
$chroot = "/" if (!defined($chroot));
|
|
$add = int($add);
|
|
my ($w, $h) = (560, 500);
|
|
($w, $h) = split(/x/, $gconfig{'db_sizefile'}) if ($gconfig{'db_sizefile'});
|
|
return "<input type='button' class='ui_button ui_chooser_button' ".
|
|
"onClick='ifield = form.$input; chooser = window.open(\"".
|
|
&get_webprefix()."/chooser.cgi?add=$add&type=$type&chroot=$chroot".
|
|
"&file=\"+encodeURIComponent(ifield.value), \"chooser\", ".
|
|
"\"toolbar=no,menubar=no,scrollbars=no,resizable=yes,".
|
|
"width=$w,height=$h\"); chooser.ifield = ifield; ".
|
|
"window.ifield = ifield' value=\"...\">\n";
|
|
}
|
|
|
|
# theme_user_chooser_button(input, multiple, [form])
|
|
# Returns a button that opens the user chooser, sized like the file chooser
|
|
sub theme_user_chooser_button
|
|
{
|
|
my ($input, $multi) = @_;
|
|
return &theme_chooser_button("user_chooser.cgi", "user", $input, $multi);
|
|
}
|
|
|
|
# theme_group_chooser_button(input, multiple, [form])
|
|
# Returns a button that opens the group chooser, sized like the file chooser
|
|
sub theme_group_chooser_button
|
|
{
|
|
my ($input, $multi) = @_;
|
|
return &theme_chooser_button("group_chooser.cgi", "group", $input, $multi);
|
|
}
|
|
|
|
# theme_chooser_button(script, param, input, multiple)
|
|
# Returns the button shared by the user and group choosers. The multiple
|
|
# selection window has two panes and so is wider.
|
|
sub theme_chooser_button
|
|
{
|
|
my ($script, $param, $input, $multi) = @_;
|
|
my ($w, $h) = $multi ? (640, 500) : (420, 500);
|
|
if ($multi && $gconfig{'db_sizeusers'}) {
|
|
# Size of the multiple selection chooser from the Webmin config
|
|
($w, $h) = split(/x/, $gconfig{'db_sizeusers'});
|
|
}
|
|
elsif (!$multi && $gconfig{'db_sizeuser'}) {
|
|
# Size of the single selection chooser from the Webmin config
|
|
($w, $h) = split(/x/, $gconfig{'db_sizeuser'});
|
|
}
|
|
$multi = int($multi);
|
|
return "<button type='button' class='ui_button ui_chooser_button' ".
|
|
"onClick='ifield = form.$input; chooser = window.open(\"".
|
|
&get_webprefix()."/$script?multi=$multi&$param=\"+".
|
|
"escape(ifield.value), \"chooser\", ".
|
|
"\"toolbar=no,menubar=no,scrollbars=yes,resizable=yes,".
|
|
"width=$w,height=$h\"); chooser.ifield = ifield; ".
|
|
"window.ifield = ifield'>...</button>\n";
|
|
}
|
|
|
|
# theme_footer([page, name]+, [noendbody])
|
|
# Output a footer for returning to some page
|
|
sub theme_footer
|
|
{
|
|
my $i;
|
|
my @links;
|
|
my %module_info = get_module_info(get_module_name());
|
|
for($i=0; $i+1<@_; $i+=2) {
|
|
local $url = $_[$i];
|
|
if ($url ne '/' || !$tconfig{'noindex'}) {
|
|
# Turn the shortcut into a URL, unless the theme hides the
|
|
# Webmin index link
|
|
if ($url eq '/') {
|
|
# Webmin index, opened at the module's category
|
|
$url = "/?cat=$module_info{'category'}";
|
|
}
|
|
elsif ($url eq '' && get_module_name() eq 'virtual-server' ||
|
|
$url eq '/virtual-server/') {
|
|
# Don't bother with virtualmin menu
|
|
next;
|
|
}
|
|
elsif ($url eq '' && get_module_name() eq 'server-manager' ||
|
|
$url eq '/server-manager/') {
|
|
# Don't bother with Cloudmin menu
|
|
next;
|
|
}
|
|
#elsif ($url =~ /(view|edit)_domain.cgi/ &&
|
|
# get_module_name() eq 'virtual-server' ||
|
|
# $url =~ /^\/virtual-server\/(view|edit)_domain.cgi/) {
|
|
# # Don't bother with link to domain details
|
|
# next;
|
|
# }
|
|
elsif ($url =~ /edit_serv.cgi/ &&
|
|
get_module_name() eq 'server-manager' ||
|
|
$url =~ /^\/virtual-server\/edit_serv.cgi/) {
|
|
# Don't bother with link to system details
|
|
next;
|
|
}
|
|
elsif ($url eq '' && get_module_name()) {
|
|
# Index page of the current module
|
|
$url = "/".get_module_name()."/".
|
|
$module_info{'index_link'};
|
|
}
|
|
elsif ($url =~ /^\?/ && get_module_name()) {
|
|
# Index page of the module with parameters
|
|
$url = "/".get_module_name()."/$url";
|
|
}
|
|
$url = "@{[&get_webprefix()]}$url" if ($url =~ /^\//);
|
|
push(@links, "<a href=\"$url\">".
|
|
&text('main_return', $_[$i+1])."</a>");
|
|
}
|
|
}
|
|
if (@links) {
|
|
# Return links, with a chevron before the first
|
|
print "<div class='ui_footer_links'>\n";
|
|
print &ui_svg_icon("chevron-left", { 'size' => 14 }),"\n";
|
|
print join(" <span class='ui_footer_sep'>|</span>\n", @links),"\n";
|
|
print "</div>\n";
|
|
}
|
|
if (!$_[$i]) {
|
|
# End the page, unless the caller keeps the body open
|
|
my $postbody = $tconfig{'postbody'};
|
|
if ($postbody) {
|
|
# Text from the theme config at the end of every page, with
|
|
# its placeholders filled in
|
|
my $hostname = &get_display_hostname();
|
|
my $version = &get_webmin_version();
|
|
my $os_type = $gconfig{'real_os_type'} ||
|
|
$gconfig{'os_type'};
|
|
my $os_version = $gconfig{'real_os_version'} ||
|
|
$gconfig{'os_version'};
|
|
$postbody =~ s/%HOSTNAME%/$hostname/g;
|
|
$postbody =~ s/%VERSION%/$version/g;
|
|
$postbody =~ s/%USER%/$remote_user/g;
|
|
$postbody =~ s/%OS%/$os_type $os_version/g;
|
|
print "$postbody\n";
|
|
}
|
|
if ($tconfig{'postbodyinclude'}) {
|
|
# File from the theme directory at the end of every page
|
|
local $_;
|
|
open(INC, "$theme_root_directory/$tconfig{'postbodyinclude'}");
|
|
while(<INC>) {
|
|
print;
|
|
}
|
|
close(INC);
|
|
}
|
|
if (defined(&theme_postbody)) {
|
|
# Hook of an overlay theme
|
|
&theme_postbody(@_);
|
|
}
|
|
print "</body></html>\n";
|
|
}
|
|
}
|
|
|
|
# theme_redirect(original-url, url)
|
|
# Prints a redirect like the core, except that a Virtualmin page sending
|
|
# the browser to the server root goes to the framed system information
|
|
# page, since the Virtualmin menu is already in the left frame
|
|
sub theme_redirect
|
|
{
|
|
local ($orig, $url) = @_;
|
|
if (get_module_name() eq "virtual-server" && $orig eq "" &&
|
|
# Virtualmin's return to the root
|
|
$url =~ /^((http|https):\/\/([^\/]+))\//) {
|
|
$url = "$1/right.cgi";
|
|
}
|
|
print "Location: $url\n\n";
|
|
}
|
|
|
|
# theme_ui_hidden_javascript()
|
|
# Returns the script that switches tabs and opens hidden sections. Both
|
|
# only change classes; the stylesheet does the rest.
|
|
sub theme_ui_hidden_javascript
|
|
{
|
|
return <<EOF;
|
|
<script>
|
|
// Open or close a hidden section
|
|
function hidden_opener(divid, openerid)
|
|
{
|
|
var divobj = document.getElementById(divid);
|
|
var openerobj = document.getElementById(openerid);
|
|
var shown = divobj.className == 'opener_shown';
|
|
divobj.className = shown ? 'opener_hidden' : 'opener_shown';
|
|
if (openerobj) {
|
|
// Turn the arrow of the link that opens the section
|
|
openerobj.className = shown ? 'opener_closed' : 'opener_open';
|
|
}
|
|
}
|
|
|
|
// Show a tab and hide the others
|
|
function select_tab(name, tabname, form)
|
|
{
|
|
var tabnames = document[name+'_tabnames'];
|
|
for(var i=0; i<tabnames.length; i++) {
|
|
var tabobj = document.getElementById('tab_'+tabnames[i]);
|
|
var divobj = document.getElementById('div_'+tabnames[i]);
|
|
var selected = tabnames[i] == tabname;
|
|
if (tabobj) {
|
|
// Mark the tab itself
|
|
tabobj.className = selected ? 'ui_tab ui_tab_selected' : 'ui_tab';
|
|
}
|
|
if (!divobj) {
|
|
// A tab that is only a link has no body
|
|
continue;
|
|
}
|
|
divobj.className = (selected ? 'opener_shown' : 'opener_hidden')+
|
|
' ui_tabs_start';
|
|
if (selected) {
|
|
// Point the submit buttons of a nested form at it
|
|
try {
|
|
var nestedForm = divobj.querySelector("form[data-form-nested]");
|
|
if (nestedForm) {
|
|
var nestedFormId = nestedForm.getAttribute("data-form-nested"),
|
|
formSubmitters = document
|
|
.querySelectorAll(
|
|
"[data-submit-nested='" + nestedFormId + "']");
|
|
if (formSubmitters) {
|
|
formSubmitters.forEach(function(submitter) {
|
|
submitter.setAttribute(
|
|
"form", nestedForm.getAttribute('id'));
|
|
});
|
|
}
|
|
}
|
|
} catch(e) {
|
|
console.warn('Cannot set the related submitter ID of the nested form : ' + e);
|
|
}
|
|
}
|
|
}
|
|
if (document.forms[0] && document.forms[0][name]) {
|
|
// Remember the tab in the hidden field, so a submit returns to it
|
|
document.forms[0][name].value = tabname;
|
|
}
|
|
return false;
|
|
}
|
|
</script>
|
|
EOF
|
|
}
|
|
|
|
# Icons drawn before notices, by notice type and by the Font Awesome class
|
|
# names that modules pass to ui_alert
|
|
my %theme_alert_icons = (
|
|
'success' => 'check-circle',
|
|
'info' => 'info-circle',
|
|
'warning' => 'warning',
|
|
'danger' => 'x-circle',
|
|
'danger-fatal' => 'x-circle',
|
|
);
|
|
my %theme_fa_icons = (
|
|
'fa-check-circle' => 'check-circle',
|
|
'fa-check' => 'check',
|
|
'fa-info-circle' => 'info-circle',
|
|
'fa-question-circle' => 'question-circle',
|
|
'fa-exclamation-triangle' => 'warning',
|
|
'fa-warning' => 'warning',
|
|
'fa-bolt' => 'x-circle',
|
|
'fa-times-circle' => 'x-circle',
|
|
'fa-clock' => 'clock',
|
|
'fa-clock-o' => 'clock',
|
|
'fa-hdd-o' => 'hard-drive',
|
|
'fa-lock' => 'shield',
|
|
'fa-shield' => 'shield',
|
|
'fa-plug' => 'power',
|
|
'fa-power-off' => 'power',
|
|
'fa-download' => 'download',
|
|
'fa-upload' => 'upload',
|
|
'fa-refresh' => 'refresh',
|
|
'fa-search' => 'search',
|
|
'fa-server' => 'server',
|
|
'fa-user' => 'user',
|
|
'fa-trash' => 'trash',
|
|
'fa-cog' => 'gear',
|
|
'fa-globe' => 'globe',
|
|
'fa-star' => 'star',
|
|
'fa-play' => 'play',
|
|
'fa-stop' => 'stop',
|
|
'fa-terminal' => 'terminal',
|
|
'fa-book' => 'book',
|
|
'fa-filter' => 'filter',
|
|
'fa-pencil' => 'edit',
|
|
'fa-edit' => 'edit',
|
|
'fa-external-link' => 'external',
|
|
);
|
|
|
|
# theme_alert_icon(type, [fa-classes])
|
|
# Returns the icon shown before a notice, from a Font Awesome class name
|
|
# when the theme has an equivalent, else from the notice type
|
|
sub theme_alert_icon
|
|
{
|
|
my ($type, $fa) = @_;
|
|
my $name;
|
|
if ($fa) {
|
|
# Prefer the icon the module asked for, when the theme has it
|
|
my ($known) = grep { $theme_fa_icons{$_} } split(/\s+/, $fa);
|
|
$name = $theme_fa_icons{$known} if ($known);
|
|
}
|
|
$name ||= $theme_alert_icons{$type} || 'info-circle';
|
|
return "<span class='ui_alert_icon'>".
|
|
&ui_svg_icon($name, { 'size' => 18 })."</span>";
|
|
}
|
|
|
|
# theme_ui_alert_box(message, type, [style], [new-line], [title], [icon])
|
|
# Returns HTML for a notice box with an icon, taking the same arguments as
|
|
# the Authentic theme. The type can be success, info, warn, danger or
|
|
# danger-fatal, and picks the colors, the icon and the default title. The
|
|
# style is added to the box. With new-line set, the message starts under
|
|
# the title instead of after it. A title replaces the default one, and an
|
|
# empty title removes it. The icon is a Font Awesome class name, used when
|
|
# the theme has an equivalent. Buttons that the message puts on a line of
|
|
# their own, after a <p>, are wrapped together with the text before them,
|
|
# so both can share one line.
|
|
sub theme_ui_alert_box
|
|
{
|
|
my ($msg, $class, $style, $new_line, $desc_to_title, $desc_icon) = @_;
|
|
my %types = ( 'success' => [ 'success', $text{'ui_success'} ],
|
|
'info' => [ 'info', $text{'ui_info'} ],
|
|
'warn' => [ 'warning', $text{'ui_warning'} ],
|
|
'warning' => [ 'warning', $text{'ui_warning'} ],
|
|
'danger' => [ 'danger', $text{'ui_error'} ],
|
|
'danger-fatal' => [ 'danger-fatal', $text{'ui_error_fatal'} ] );
|
|
my ($type, $title) = @{$types{$class} || $types{'info'}};
|
|
# The default titles end in an exclamation mark, as in the Authentic theme
|
|
$title .= "!" if ($title ne '');
|
|
$title = $desc_to_title if (defined($desc_to_title));
|
|
my $lead = $title =~ /\S/ ?
|
|
"<strong>$title</strong>".($new_line ? "<br>" : " ") : "";
|
|
if ($msg =~ s/^(.*?)<p>\s*(<form\b.*?<\/form>)/<span class='ui_alert_text'>$lead$1<\/span><span class='ui_alert_actions'>$2<\/span>/is) {
|
|
# A form of buttons after the text
|
|
}
|
|
elsif ($msg =~ s/(<form\b[^>]*>)(.*?)<p>\s*((?:<input\b[^>]*>\s*)+)(<\/form>)/$1<span class='ui_alert_text'>$lead$2<\/span><span class='ui_alert_actions'>$3<\/span>$4/is) {
|
|
# Buttons after the text, inside its form
|
|
}
|
|
elsif ($msg =~ s/(<form\b[^>]*>)(.*?)<p>\s*((?:<input\b[^>]*>\s*)*<table\b[^>]*class=['"]ui_form_end_buttons['"].*?<\/table>)\s*(<\/form>)/$1<span class='ui_alert_text'>$lead$2<\/span><span class='ui_alert_actions'>$3<\/span>$4/is) {
|
|
# Buttons after the text, as a form end table inside its form
|
|
}
|
|
else {
|
|
# Plain message after the title
|
|
$msg = $lead.$msg;
|
|
}
|
|
return "<div class='ui_alert_box alert alert-$type'".
|
|
($style ? " style='"."e_escape($style)."'" : "").">".
|
|
&theme_alert_icon($type, $desc_icon).
|
|
"<div class='ui_alert_body'>$msg</div></div>\n";
|
|
}
|
|
|
|
# theme_ui_alert(content, [type], [icon], [&attrs])
|
|
# Returns HTML for an alert with an icon and a title, like the core
|
|
# ui_alert but drawn with the theme's SVG icons. The icon can be a Font
|
|
# Awesome class name, or an array of [ class, title, no-line-break ].
|
|
sub theme_ui_alert
|
|
{
|
|
my ($content, $type, $icon, $attrs) = @_;
|
|
$type ||= 'info';
|
|
my %titles = ( 'success' => $text{'ui_success'},
|
|
'info' => $text{'ui_info'},
|
|
'warning' => $text{'ui_warning'},
|
|
'danger' => $text{'ui_error'},
|
|
'danger-fatal' => $text{'ui_error_fatal'} );
|
|
my ($fa, $title, $br) = (undef, $titles{$type}, 1);
|
|
if (ref($icon)) {
|
|
# Icon given with its own title and line break flag
|
|
$fa = $icon->[0];
|
|
$title = $icon->[1] if (defined($icon->[1]));
|
|
$br = 0 if ($icon->[2]);
|
|
}
|
|
elsif (defined($icon)) {
|
|
# Icon name alone
|
|
$fa = $icon;
|
|
}
|
|
my %a = %{$attrs || {}};
|
|
$a{'class'} = join(" ", grep { $_ } ("alert", "alert-$type", $a{'class'}));
|
|
my $body = "";
|
|
$body .= "<strong>$title</strong>".($br ? "<br>" : " ") if ($title ne '');
|
|
$body .= "<span>$content</span>";
|
|
return &ui_tag_start('div', \%a).
|
|
&theme_alert_icon($type, $fa).
|
|
"<div class='ui_alert_body'>$body</div>".
|
|
&ui_tag_end('div')."\n";
|
|
}
|
|
|
|
# XXX Temporary until ui-lib.pl valign stuff gets cleaned up
|
|
#
|
|
# theme_ui_columns_table(&headings, width-percent, &data, &types, no-sort, title,
|
|
# empty-msg)
|
|
# Returns HTML for a complete table.
|
|
# headings - An array ref of heading HTML
|
|
# width-percent - Preferred total width
|
|
# data - A 2x2 array ref of table contents. Each can either be a simple string,
|
|
# or a hash ref like :
|
|
# { 'type' => 'group', 'desc' => 'Some section title' }
|
|
# { 'type' => 'string', 'value' => 'Foo', 'colums' => 3,
|
|
# 'nowrap' => 1 }
|
|
# { 'type' => 'checkbox', 'name' => 'd', 'value' => 'foo',
|
|
# 'label' => 'Yes', 'checked' => 1, 'disabled' => 1 }
|
|
# { 'type' => 'radio', 'name' => 'd', 'value' => 'foo', ... }
|
|
# types - An array ref of data types, such as 'string', 'number', 'bytes'
|
|
# or 'date'
|
|
# no-sort - Set to 1 to disable sorting by theme
|
|
# title - Text to appear above the table
|
|
# empty-msg - Message to display if no data
|
|
# sortable - Set to 1 to mark the table for client-side sorting
|
|
sub theme_ui_columns_table
|
|
{
|
|
my ($heads, $width, $data, $types, $nosort, $title, $emptymsg,
|
|
$sortable) = @_;
|
|
my $rv;
|
|
|
|
# Just show empty message if no data
|
|
if ($emptymsg && !@$data) {
|
|
$rv .= &ui_subheading($title) if ($title);
|
|
$rv .= "<b>$emptymsg</b><p>\n";
|
|
return $rv;
|
|
}
|
|
|
|
# Are there any checkboxes in each column? If so, make those columns narrow
|
|
my @tds;
|
|
my $maxwidth = 0;
|
|
foreach my $r (@$data) {
|
|
my $cc = 0;
|
|
foreach my $c (@$r) {
|
|
if (ref($c) &&
|
|
($c->{'type'} eq 'checkbox' || $c->{'type'} eq 'radio')) {
|
|
$tds[$cc] .= " width=5" if ($tds[$cc] !~ /width=/);
|
|
}
|
|
$cc++;
|
|
}
|
|
$maxwidth = $cc if ($cc > $maxwidth);
|
|
}
|
|
$rv .= &ui_columns_start($heads, $width, 0, \@tds, $title, $sortable);
|
|
|
|
# Add the data rows
|
|
foreach my $r (@$data) {
|
|
my $c0;
|
|
if (ref($r->[0]) && ($r->[0]->{'type'} eq 'checkbox' ||
|
|
$r->[0]->{'type'} eq 'radio')) {
|
|
# First column is special
|
|
$c0 = $r->[0];
|
|
$r = [ @$r[1..(@$r-1)] ];
|
|
}
|
|
# Turn data into HTML
|
|
my @rtds = @tds;
|
|
my @cols;
|
|
my $cn = 0;
|
|
$cn++ if ($c0);
|
|
foreach my $c (@$r) {
|
|
if (!ref($c)) {
|
|
# Plain old string
|
|
push(@cols, $c);
|
|
}
|
|
elsif ($c->{'type'} eq 'checkbox') {
|
|
# Checkbox in non-first column
|
|
push(@cols, &ui_checkbox($c->{'name'}, $c->{'value'},
|
|
$c->{'label'}, $c->{'checked'},
|
|
$c->{'tags'},
|
|
$c->{'disabled'}));
|
|
}
|
|
elsif ($c->{'type'} eq 'radio') {
|
|
# Radio button in non-first column
|
|
push(@cols, &ui_oneradio($c->{'name'}, $c->{'value'},
|
|
$c->{'label'}, $c->{'checked'},
|
|
$c->{'tags'},
|
|
$c->{'disabled'}));
|
|
}
|
|
elsif ($c->{'type'} eq 'group') {
|
|
# Header row that spans whole table
|
|
$rv .= &ui_columns_header([ $c->{'desc'} ],
|
|
[ "colspan=$width" ]);
|
|
next;
|
|
}
|
|
elsif ($c->{'type'} eq 'string') {
|
|
# A string, which might be special
|
|
push(@cols, $c->{'value'});
|
|
if ($c->{'columns'} > 1) {
|
|
splice(@rtds, $cn, $c->{'columns'},
|
|
"colspan=".$c->{'columns'});
|
|
}
|
|
if ($c->{'nowrap'}) {
|
|
$rtds[$cn] .= " nowrap";
|
|
}
|
|
}
|
|
$cn++;
|
|
}
|
|
# Add the row
|
|
if (!$c0) {
|
|
$rv .= &ui_columns_row(\@cols, \@rtds);
|
|
}
|
|
elsif ($c0->{'type'} eq 'checkbox') {
|
|
$rv .= &ui_checked_columns_row(\@cols, \@rtds, $c0->{'name'},
|
|
$c0->{'value'}, $c0->{'checked'},
|
|
$c0->{'disabled'},
|
|
$c0->{'tags'});
|
|
}
|
|
elsif ($c0->{'type'} eq 'radio') {
|
|
$rv .= &ui_radio_columns_row(\@cols, \@rtds, $c0->{'name'},
|
|
$c0->{'value'}, $c0->{'checked'},
|
|
$c0->{'disabled'},
|
|
$c0->{'tags'});
|
|
}
|
|
}
|
|
|
|
$rv .= &ui_columns_end();
|
|
return $rv;
|
|
}
|
|
|
|
=yui
|
|
|
|
Functions for generating YUI CSS grids markup.
|
|
|
|
=cut
|
|
|
|
# ui_yui_grid_start(id, type)
|
|
# Return a yui grid opening div.
|
|
# Available types are:
|
|
# g - 1/2,1/2
|
|
# gb - 1/3, 1/3, 1/3
|
|
# gc - 2/3, 1/3
|
|
# gd - 1/3, 2/3
|
|
# ge - 3/4, 1/4
|
|
# gf - 1/4, 3/4
|
|
sub theme_ui_yui_grid_start {
|
|
my ($id, $type) = @_;
|
|
return "<div id='grid_$id' class='yui-$type'>\n";
|
|
}
|
|
|
|
sub theme_ui_yui_grid_end {
|
|
my ($id) = @_;
|
|
return "</div> <!-- grid_$id -->\n";
|
|
}
|
|
|
|
# ui_yui_grid_section_start(id, first?)
|
|
# Return a yui grid markup section opening div.
|
|
sub theme_ui_yui_grid_section_start {
|
|
my ($id, $first) = @_;
|
|
if ($first) { return "<div id='grid_$id' class='yui-u first'>\n"; }
|
|
else { return "<div id='grid_$id' class='yui-u'>\n"; }
|
|
}
|
|
sub theme_ui_yui_grid_section_end {
|
|
my ($id) = @_;
|
|
return "</div> <!-- grid_$id -->\n";
|
|
}
|
|
|
|
1;
|
|
|