mirror of
https://github.com/unraid/webgui.git
synced 2026-01-01 15:10:19 -06:00
a8f432058f
- Wrapped tables in a <div> with class "TableContainer" for better responsiveness. - Ensured consistent styling and structure across ArrayDevices.page, BootDevice.page, DiskList.page, ShareList.page, DockerContainers.page, Plugins.page, and VMMachines.page. - Updated CSS to support new table container classes for enhanced layout control.
212 lines
10 KiB
Plaintext
212 lines
10 KiB
Plaintext
Menu="Docker:1"
|
|
Title="Docker Containers"
|
|
Tag="cubes"
|
|
Cond="is_file('/var/run/dockerd.pid')"
|
|
Markdown="false"
|
|
Nchan="docker_load:stop"
|
|
---
|
|
<?PHP
|
|
/* Copyright 2005-2023, Lime Technology
|
|
* Copyright 2012-2023, Bergware International.
|
|
* Copyright 2014-2021, Guilherme Jardim, Eric Schultz, Jon Panozzo.
|
|
*
|
|
* This program is free software; you can redistribute it and/or
|
|
* modify it under the terms of the GNU General Public License version 2,
|
|
* as published by the Free Software Foundation.
|
|
*
|
|
* The above copyright notice and this permission notice shall be included in
|
|
* all copies or substantial portions of the Software.
|
|
*/
|
|
?>
|
|
<?
|
|
require_once "$docroot/plugins/dynamix.docker.manager/include/DockerClient.php";
|
|
|
|
$width = $themeHelper->isTopNavTheme() ? -58: -44; // $themeHelper set in DefaultPageLayout.php
|
|
$top = $themeHelper->isTopNavTheme() ? 40 : 20;
|
|
$busy = "<i class='fa fa-spin fa-circle-o-notch'></i> "._('Please wait')."... "._('starting up containers');
|
|
$cpus = cpu_list();
|
|
?>
|
|
<link type="text/css" rel="stylesheet" href="<?autov('/webGui/styles/jquery.switchbutton.css')?>">
|
|
|
|
<div class="TableContainer--widest">
|
|
<table id="docker_containers" class="tablesorter shift">
|
|
<thead>
|
|
<tr>
|
|
<th><a id="resetsort" class="nohand" onclick="resetSorting()" title="_(Reset sorting)_"><i class="fa fa-th-list"></i></a>_(Application)_</th>
|
|
<th>_(Version)_</th>
|
|
<th>_(Network)_</th>
|
|
<th>_(Container IP)_</th>
|
|
<th>_(Container Port)_</th>
|
|
<th>_(LAN IP:Port)_</th>
|
|
<th>_(Volume Mappings)_ <small>(_(App to Host)_)</small></th>
|
|
<th class="load advanced">_(CPU & Memory load)_</th>
|
|
<th class="nine">_(Autostart)_</th>
|
|
<th class="five">_(Uptime)_</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="docker_list"><tr><td colspan='9'></td></tr></tbody>
|
|
</table>
|
|
</div>
|
|
<input type="button" onclick="addContainer()" value="_(Add Container)_" style="display:none">
|
|
<input type="button" onclick="startAll()" value="_(Start All)_" style="display:none">
|
|
<input type="button" onclick="stopAll()" value="_(Stop All)_" style="display:none">
|
|
<input type="button" onclick="pauseAll()" value="_(Pause All)_" style="display:none">
|
|
<input type="button" onclick="resumeAll()" value="_(Resume All)_" style="display:none">
|
|
<input type="button" onclick="checkAll()" value="_(Check for Updates)_" id="checkAll" style="display:none">
|
|
<input type="button" onclick="updateAll()" value="_(Update All)_" id="updateAll" style="display:none">
|
|
<input type="button" onclick="contSizes()" value="_(Container Size)_" style="display:none">
|
|
<div id="iframe-popup" style="display:none;-webkit-overflow-scrolling:touch;"></div>
|
|
|
|
<script src="<?autov('/webGui/javascript/jquery.switchbutton.js')?>"></script>
|
|
<script src="<?autov('/plugins/dynamix.docker.manager/javascript/docker.js')?>"></script>
|
|
<script>
|
|
var docker = [];
|
|
<?if (!$tabbed):?>
|
|
$('.title').append("<span id='busy' class='red-text strong' style='display:none;margin-left:40px'><?=$busy?></span>");
|
|
<?else:?>
|
|
$('.tabs').append("<span id='busy' class='red-text strong' style='display:none;position:relative;top:<?=$top?>px;left:40px;font-size:1.4rem;letter-spacing:2px'><?=$busy?></span>");
|
|
<?endif;?>
|
|
<?if (_var($display,'resize')):?>
|
|
function resize() {
|
|
$('#docker_list').height(Math.max(window.innerHeight-340,330));
|
|
$('#docker_containers thead,#docker_containers tbody').removeClass('fixed');
|
|
$('#docker_containers thead tr th').each(function(){$(this).width($(this).width());});
|
|
$('#docker_containers tbody tr td').each(function(){$(this).width($(this).width());});
|
|
$('#docker_containers thead,#docker_containers tbody').addClass('fixed');
|
|
}
|
|
<?endif;?>
|
|
function resetSorting() {
|
|
if ($.cookie('lockbutton')==null) return;
|
|
$('input[type=button]').prop('disabled',true);
|
|
$.post('/plugins/dynamix.docker.manager/include/UserPrefs.php',{reset:true},function(){loadlist();});
|
|
}
|
|
function listview() {
|
|
var more = $.cookie('docker_listview_mode')=='advanced';
|
|
<?if(($dockercfg['DOCKER_READMORE']??'yes') === 'yes'):?>
|
|
$('.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>"});
|
|
<?endif;?>
|
|
$('input.autostart').each(function(){
|
|
var wait = $('#'+$(this).prop('id').replace('auto','wait'));
|
|
var auto = $(this).prop('checked');
|
|
if (auto && more) wait.show(); else wait.hide();
|
|
});
|
|
}
|
|
function LockButton() {
|
|
if ($.cookie('lockbutton')==null) {
|
|
$.cookie('lockbutton','lockbutton');
|
|
$('#resetsort').removeClass('nohand').addClass('hand');
|
|
$('i.mover').show();
|
|
$('#docker_list .sortable').css({'cursor':'move'});
|
|
<?if ($themeHelper->isTopNavTheme()):?>
|
|
$('div.nav-item.LockButton').find('a').prop('title',"_(Lock sortable items)_");
|
|
$('div.nav-item.LockButton').find('b').removeClass('icon-u-lock green-text').addClass('icon-u-lock-open red-text');
|
|
<?endif;?>
|
|
$('div.nav-item.LockButton').find('span').text("_(Lock sortable items)_");
|
|
$('#docker_list').sortable({helper:'clone',items:'.sortable',cursor:'grab',axis:'y',containment:'parent',cancel:'span.docker_readmore,input',delay:100,opacity:0.5,zIndex:9999,forcePlaceholderSize:true,
|
|
update:function(e,ui){
|
|
var row = $('#docker_list').find('tr:first');
|
|
var names = ''; var index = '';
|
|
row.parent().children().find('td.ct-name').each(function(){names+=$(this).find('.appname').text()+';';index+=$(this).parent().parent().children().index($(this).parent())+';';});
|
|
$.post('/plugins/dynamix.docker.manager/include/UserPrefs.php',{names:names,index:index});
|
|
}});
|
|
} else {
|
|
$.removeCookie('lockbutton');
|
|
$('#resetsort').removeClass('hand').addClass('nohand');
|
|
$('i.mover').hide();
|
|
$('#docker_list .sortable').css({'cursor':'default'});
|
|
<?if ($themeHelper->isTopNavTheme()):?>
|
|
$('div.nav-item.LockButton').find('a').prop('title',"_(Unlock sortable items)_");
|
|
$('div.nav-item.LockButton').find('b').removeClass('icon-u-lock-open red-text').addClass('icon-u-lock green-text');
|
|
<?endif;?>
|
|
$('div.nav-item.LockButton').find('span').text("_(Unlock sortable items)_");
|
|
$('#docker_list').sortable('destroy');
|
|
}
|
|
}
|
|
function loadlist(init) {
|
|
timers.docker = setTimeout(function(){$('div.spinner.fixed').show('slow');},500);
|
|
docker = [];
|
|
$.get('/plugins/dynamix.docker.manager/include/DockerContainers.php',function(d) {
|
|
clearTimeout(timers.docker);
|
|
var data = d.split(/\0/);
|
|
$(".TS_tooltip").tooltipster("destroy");
|
|
$('#docker_list').html(data[0]);
|
|
$('.TS_tooltip').tooltipster({
|
|
animation: 'fade',
|
|
delay: 200,
|
|
trigger: 'custom',
|
|
triggerOpen: {click:true,touchstart:true,mouseenter:true},
|
|
triggerClose:{click:true,scroll:false,mouseleave:true},
|
|
interactive: true,
|
|
viewportAware: true,
|
|
contentAsHTML: true,
|
|
functionBefore: function(instance,helper) {
|
|
var origin = $(helper.origin);
|
|
var TScontent = $(origin).attr("data-tstitle");
|
|
instance.content(TScontent);
|
|
}
|
|
});
|
|
$('head').append('<script>'+data[1]+'<\/script>');
|
|
<?if (_var($display,'resize')):?>
|
|
resize();
|
|
if (init) $(window).bind('resize',function(){resize();});
|
|
<?endif;?>
|
|
$('.iconstatus').each(function(){
|
|
if ($(this).hasClass('stopped')) $('div.'+$(this).prop('id')).hide();
|
|
});
|
|
$('.autostart').switchButton({labels_placement:'right', on_label:"_(On)_", off_label:"_(Off)_"});
|
|
$('.autostart').change(function(){
|
|
var more = $.cookie('docker_listview_mode')=='advanced';
|
|
var wait = $('#'+$(this).prop('id').replace('auto','wait'));
|
|
var auto = $(this).prop('checked');
|
|
if (auto && more) wait.show(); else wait.hide();
|
|
$.post('/plugins/dynamix.docker.manager/include/UpdateConfig.php',{action:'autostart',container:$(this).attr('container'),auto:auto,wait:wait.find('input.wait').val()});
|
|
});
|
|
$('input.wait').change(function(){
|
|
$.post('/plugins/dynamix.docker.manager/include/UpdateConfig.php',{action:'wait',container:$(this).attr('container'),wait:$(this).val()});
|
|
});
|
|
if ($.cookie('docker_listview_mode')=='advanced') {$('.advanced').show(); $('.basic').hide();}
|
|
$('input[type=button]').prop('disabled',false).show('slow');
|
|
var update = false, rebuild = false;
|
|
for (var i=0,ct; ct=docker[i]; i++) {
|
|
if (ct.update==1) update = true;
|
|
if (ct.update==2) rebuild = true;
|
|
}
|
|
listview();
|
|
$('div.spinner.fixed').hide('slow');
|
|
if (data[2]==1) {$('#busy').show(); setTimeout(loadlist,5000);} else if ($('#busy').is(':visible')) {$('#busy').hide(); setTimeout(loadlist,3000);}
|
|
if (!update) $('input#updateAll').prop('disabled',true);
|
|
if (rebuild) rebuildAll();
|
|
});
|
|
}
|
|
function contSizes() {
|
|
// show spinner over window
|
|
$('div.spinner.fixed').css({'z-index':'100000'}).show();
|
|
openPlugin('container_size', "_(Container Size)_");
|
|
}
|
|
var dockerload = new NchanSubscriber('/sub/dockerload',{subscriber:'websocket'});
|
|
dockerload.on('message', function(msg){
|
|
var data = msg.split('\n');
|
|
for (var i=0,row; row=data[i]; i++) {
|
|
var id = row.split(';');
|
|
var w1 = Math.round(Math.min(id[1].slice(0,-1)/<?=count($cpus)*count(preg_split('/[,-]/',$cpus[0]))?>,100)*100)/100+'%';
|
|
$('.cpu-'+id[0]).text(w1.replace('.','<?=_var($display,'number','.,')[0]?>'));
|
|
$('.mem-'+id[0]).text(id[2]);
|
|
$('#cpu-'+id[0]).css('width',w1);
|
|
}
|
|
});
|
|
$(function() {
|
|
$(".tabs").append('<span class="status"><span><input type="checkbox" class="advancedview"></span></span>');
|
|
$('.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});
|
|
listview();
|
|
});
|
|
$.removeCookie('lockbutton');
|
|
loadlist(true);
|
|
dockerload.start().monitor();
|
|
});
|
|
|
|
</script>
|