mirror/webgui
1
0
Fork 0
mirror of https://github.com/unraid/webgui.git synced 2026-01-16 06:30:19 -06:00
Code Issues Packages Projects Releases Wiki Activity

Added docker list expand/collapse view

Browse Source
This commit is contained in:
bergware
2018-03-06 14:24:41 +01:00
parent 7b133a56dc
commit 4147fd174f
2 changed files with 30 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
plugins/dynamix.docker.manager/DockerContainers.page
View File

@@ -35,7 +35,7 @@ img.stopped{opacity:0.3}
</form>
<div id="dialog-confirm" style="display:none;" title="Dialog Title"></div>
<div id="iframe-popup" style="display:none;-webkit-overflow-scrolling:touch;"></div>
<span class="status" style="margin-top:-44px"><input type="checkbox" class="advancedview"></span>
<span class="status" style="margin-top:-44px"><span style="float:right;margin-left:48px"><input type="checkbox" class="advancedview"></span><span style="float:right"><input type="checkbox" class="expandedlist"></span></span>
<table class="tablesorter shift" id="docker_containers">
<thead><tr><th></th><th>Application</th><th>Version</th><th>Network</th><th>Port Mappings <small>(App to Host)</small></th><th>Volume Mappings <small>(App to Host)</small></th><th width="80px" style="text-align:center">Autostart</th><th>Log</th></tr></thead>
<tbody id="docker_list"><tr><td colspan='8' style='text-align:center;padding-top:12px'><i class='fa fa-spinner fa-spin icon'></i>Please wait... retrieving container information</td></tr></tbody>
@@ -71,6 +71,13 @@ function resize(bind) {
}
}
<?endif;?>
function listview() {
if ($.cookie('docker_list_mode')=='collapsed') {
$('.docker_readmore').readmore({maxHeight:32,moreLink:"<a href='#' style='text-align:center'><i class='fa fa-chevron-down'></i></a>",lessLink:"<a href='#' style='text-align:center'><i class='fa fa-chevron-up'></i></a>"});
} else {
$('.docker_readmore').readmore('destroy');
}
}
function loadlist() {
$.get('/plugins/dynamix.docker.manager/include/DockerContainers.php',function(d) {
var data = d.split(/\0/);
@@ -90,15 +97,21 @@ function loadlist() {
});
if ($.cookie('docker_listview_mode')=='advanced') {$('.advanced').show(); $('.basic').hide();}
context.init({preventDoubleContext:false});
listview();
$('input[type=button]').prop('disabled',false);
});
}
$(function() {
$('.advancedview').switchButton({labels_placement:"left", on_label:'Advanced View', off_label:'Basic View', checked:$.cookie('docker_listview_mode')=='advanced'});
$('.expandedlist').switchButton({labels_placement:'left', on_label:'Collapsed List', off_label:'Expanded List', checked:$.cookie('docker_list_mode')=='collapsed'});
$('.expandedlist').change(function() {
$.cookie('docker_list_mode',$('.expandedlist').is(':checked')?'collapsed':'expanded',{expires:3650});
listview();
});
$('.advancedview').switchButton({labels_placement:'left', on_label:'Advanced View', off_label:'Basic View', checked:$.cookie('docker_listview_mode')=='advanced'});
$('.advancedview').change(function() {
$('.advanced').toggle('slow');
$('.basic').toggle('slow');
$.cookie('docker_listview_mode', $('.advancedview').is(':checked')?'advanced':'basic', {expires:3650});
$.cookie('docker_listview_mode',$('.advancedview').is(':checked')?'advanced':'basic',{expires:3650});
});
loadlist();
});

28
plugins/dynamix.docker.manager/include/DockerContainers.php
View File

@@ -77,12 +77,12 @@ foreach ($all_containers as $ct) {
$paths[] = sprintf('%s<i class="fa fa-%s" style="margin:0 6px"></i>%s', htmlspecialchars($container_path), $access_mode=='ro'?'long-arrow-left':'arrows-h', htmlspecialchars($host_path));
}
echo "<tr><td style='width:48px;padding:4px'>";
echo "<div id=\"$id\" style=\"display:block; cursor:pointer\"><div style=\"position:relative;width:48px;height:48px;margin:0px auto\">";
echo "<img src=\"".htmlspecialchars($icon)."\" class=\"".htmlspecialchars($status)."\" style=\"position:absolute;top:0;bottom:0;left:0;right:0;width:48px;height:48px\">";
echo "<i class=\"fa iconstatus fa-$shape $status\" title=\"".htmlspecialchars($status)."\"></i></div></div>";
echo "<div id='$id' style='display:block; cursor:pointer'><div style='position:relative;width:48px;height:48px;margin:0px auto'>";
echo "<img src='".htmlspecialchars($icon)."' class='".htmlspecialchars($status)."' style='position:absolute;top:0;bottom:0;left:0;right:0;width:48px;height:48px'>";
echo "<i class='fa iconstatus fa-$shape $status' title='".htmlspecialchars($status)."'></i></div></div>";
echo "</td><td>";
if ($template) {
echo "<a class=\"exec\" onclick=\"editContainer('".addslashes(htmlspecialchars($name))."','".addslashes(htmlspecialchars($template))."')\">".htmlspecialchars($name)."</a>";
echo "<a class='exec' onclick=\"editContainer('".addslashes(htmlspecialchars($name))."','".addslashes(htmlspecialchars($template))."')\">".htmlspecialchars($name)."</a>";
} else {
echo htmlspecialchars($name);
}
@@ -91,31 +91,31 @@ foreach ($all_containers as $ct) {
echo "<div class='advanced' style='width:160px'>By:";
$registry = $info['registry'];
if ($registry) {
echo "<a href=\"".htmlspecialchars($registry)."\" target=\"_blank\">".htmlspecialchars($ct['Image'])."</a>";
echo "<a href='".htmlspecialchars($registry)."' target='_blank'>".htmlspecialchars($ct['Image'])."</a>";
} else {
echo htmlspecialchars($ct['Image']);
}
echo "</div></td><td class='updatecolumn'>";
if ($updateStatus=='false') {
echo "<a class=\"exec\" onclick=\"updateContainer('".addslashes(htmlspecialchars($name))."');\"><span style=\"white-space:nowrap;\"><i class=\"fa fa-cloud-download\"></i> update ready</span></a>";
echo "<a class='exec' onclick=\"updateContainer('".addslashes(htmlspecialchars($name))."');\"><span style='white-space:nowrap;'><i class='fa fa-cloud-download'></i> update ready</span></a>";
} elseif ($updateStatus=='true') {
echo "<span style=\"color:#44B012;white-space:nowrap;\"><i class=\"fa fa-check\"></i> up-to-date</span>";
echo "<div class=\"advanced\"><a class=\"exec\" onclick=\"updateContainer('".addslashes(htmlspecialchars($name))."');\"><span style=\"white-space:nowrap;\"><i class=\"fa fa-cloud-download\"></i> force update</span></a></div>";
echo "<span style='color:#44B012;white-space:nowrap;'><i class='fa fa-check'></i> up-to-date</span>";
echo "<div class='advanced'><a class='exec' onclick=\"updateContainer('".addslashes(htmlspecialchars($name))."');\"><span style='white-space:nowrap;'><i class='fa fa-cloud-download'></i> force update</span></a></div>";
} else {
echo "<span style=\"color:#FF2400;white-space:nowrap;\"><i class=\"fa fa-exclamation-triangle\"></i> not available</span>";
echo "<div class=\"advanced\"><a class=\"exec\" onclick=\"updateContainer('".addslashes(htmlspecialchars($name))."');\"><span style=\"white-space:nowrap;\"><i class=\"fa fa-cloud-download\"></i> force update</span></a></div>";
echo "<span style='color:#FF2400;white-space:nowrap;'><i class='fa fa-exclamation-triangle'></i> not available</span>";
echo "<div class='advanced'><a class='exec' onclick=\"updateContainer('".addslashes(htmlspecialchars($name))."');\"><span style='white-space:nowrap;'><i class='fa fa-cloud-download'></i> force update</span></a></div>";
}
echo "</td><td>$mode</td>";
echo "<td style='white-space:nowrap'>".implode('<br>',$ports)."</td>";
echo "<td style='word-break:break-all'>".implode('<br>',$paths)."</td>";
echo "<td><input type='checkbox' class='autostart' container=\"".htmlspecialchars($name)."\"".($info['autostart'] ? ' checked':'')."></td>";
echo "<td style='white-space:nowrap'><span class='docker_readmore'>".implode('<br>',$ports)."</span></td>";
echo "<td style='word-break:break-all'><span class='docker_readmore'>".implode('<br>',$paths)."</span></td>";
echo "<td><input type='checkbox' class='autostart' container='".htmlspecialchars($name)."'".($info['autostart'] ? ' checked':'')."></td>";
echo "<td><a class='log' onclick=\"containerLogs('".addslashes(htmlspecialchars($name))."','$id',false,false)\"><img class='basic' src='/plugins/dynamix/icons/log.png'><div class='advanced' style='width:124px;'>".htmlspecialchars(str_replace('Up','Uptime',$ct['Status']))."</div><div class='advanced'>Created ".htmlspecialchars($ct['Created'])."</div></a></td></tr>";
}
foreach ($DockerClient->getDockerImages() as $image) {
if (count($image['usedBy'])) continue;
$menu[] = sprintf("addDockerImageContext('%s','%s');",$image['Id'],implode(', ',$image['Tags']));
echo "<tr class='advanced'><td style='width:48px;padding:4px'>";
echo "<div id=\"context-".htmlspecialchars($image['Id'])."\" style=\"display:block;cursor:pointer\">";
echo "<div id='context-{$image['Id']}' style='display:block;cursor:pointer'>";
echo "<div style='position:relative;width:48px;height:48px;margin:0 auto'>";
echo "<img src='/webGui/images/disk.png' style='position:absolute;opacity:0.3;top:0;bottom:0;left:0;right:0;width:48px;height:48px'>";
echo "</div></div></td>";