Difuse/luci
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

luci-app-dockerman: view/dockerman: update coding style

Browse source 
Signed-off-by: Florian Eckert <fe@dev.tdt.de>
This commit is contained in:
Florian Eckert 2020-07-29 16:27:03 +02:00
parent 25539b2d98
commit 833aebaa64
9 changed files with 609 additions and 631 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

245
applications/luci-app-dockerman/luasrc/view/dockerman/apply_widget.htm
View file

@ -1,140 +1,147 @@
<style type="text/css"> <style type="text/css">
#docker_apply_overlay { #docker_apply_overlay {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
background: rgba(0, 0, 0, 0.7); background: rgba(0, 0, 0, 0.7);
display: none; display: none;
z-index: 20000; z-index: 20000;
} }
#docker_apply_overlay .alert-message { #docker_apply_overlay .alert-message {
position: relative; position: relative;
top: 10%; top: 10%;
width: 60%; width: 60%;
margin: auto; margin: auto;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
min-height: 32px; min-height: 32px;
align-items: center; align-items: center;
} }
#docker_apply_overlay .alert-message > h4, #docker_apply_overlay .alert-message > h4,
#docker_apply_overlay .alert-message > p, #docker_apply_overlay .alert-message > p,
#docker_apply_overlay .alert-message > div { #docker_apply_overlay .alert-message > div {
flex-basis: 100%; flex-basis: 100%;
} }
#docker_apply_overlay .alert-message > img { #docker_apply_overlay .alert-message > img {
margin-right: 1em; margin-right: 1em;
flex-basis: 32px; flex-basis: 32px;
} }
body.apply-overlay-active { body.apply-overlay-active {
overflow: hidden; overflow: hidden;
height: 100vh; height: 100vh;
} }
body.apply-overlay-active #docker_apply_overlay { body.apply-overlay-active #docker_apply_overlay {
display: block; display: block;
} }
</style> </style>
<script type="text/javascript">//<![CDATA[ <script type="text/javascript">//<![CDATA[
var xhr = new XHR(), var xhr = new XHR(),
uci_apply_rollback = <%=math.max(luci.config and luci.config.apply and luci.config.apply.rollback or 30, 30)%>, uci_apply_rollback = <%=math.max(luci.config and luci.config.apply and luci.config.apply.rollback or 30, 30)%>,
uci_apply_holdoff = <%=math.max(luci.config and luci.config.apply and luci.config.apply.holdoff or 4, 1)%>, uci_apply_holdoff = <%=math.max(luci.config and luci.config.apply and luci.config.apply.holdoff or 4, 1)%>,
uci_apply_timeout = <%=math.max(luci.config and luci.config.apply and luci.config.apply.timeout or 5, 1)%>, uci_apply_timeout = <%=math.max(luci.config and luci.config.apply and luci.config.apply.timeout or 5, 1)%>,
uci_apply_display = <%=math.max(luci.config and luci.config.apply and luci.config.apply.display or 1.5, 1)%>, uci_apply_display = <%=math.max(luci.config and luci.config.apply and luci.config.apply.display or 1.5, 1)%>,
was_xhr_poll_running = false; was_xhr_poll_running = false;
function docker_status_message(type, content) { function docker_status_message(type, content) {
document.getElementById('docker_apply_overlay') || document.body.insertAdjacentHTML("beforeend",'<div id="docker_apply_overlay"><div class="alert-message"></div></div>') document.getElementById('docker_apply_overlay') || document.body.insertAdjacentHTML("beforeend",'<div id="docker_apply_overlay"><div class="alert-message"></div></div>')
var overlay = document.getElementById('docker_apply_overlay') var overlay = document.getElementById('docker_apply_overlay')
message = overlay.querySelector('.alert-message'); message = overlay.querySelector('.alert-message');
if (message && type) { if (message && type) {
if (!message.classList.contains(type)) { if (!message.classList.contains(type)) {
message.classList.remove('notice'); message.classList.remove('notice');
message.classList.remove('warning'); message.classList.remove('warning');
message.classList.add(type); message.classList.add(type);
} }
if (content) if (content)
message.innerHTML = content; message.innerHTML = content;
document.body.classList.add('apply-overlay-active'); document.body.classList.add('apply-overlay-active');
document.body.scrollTop = document.documentElement.scrollTop = 0; document.body.scrollTop = document.documentElement.scrollTop = 0;
if (!was_xhr_poll_running) { if (!was_xhr_poll_running) {
was_xhr_poll_running = XHR.running(); was_xhr_poll_running = XHR.running();
XHR.halt(); XHR.halt();
} }
} }
else { else {
document.body.classList.remove('apply-overlay-active'); document.body.classList.remove('apply-overlay-active');
if (was_xhr_poll_running)
XHR.run();
}
}
if (was_xhr_poll_running) var loading_msg="Loading.."
XHR.run(); function uci_confirm_docker() {
} var tt;
} docker_status_message('notice');
var loading_msg="Loading.." var call = function(r, resjson, duration) {
function uci_confirm_docker() { if (r && r.status === 200 ) {
var tt; var indicator = document.querySelector('.uci_change_indicator');
docker_status_message('notice'); if (indicator)
var call = function(r, resjson, duration) { indicator.style.display = 'none';
if (r && r.status === 200 ) { docker_status_message('notice', '<%:Docker actions done.%>');
var indicator = document.querySelector('.uci_change_indicator'); document.body.classList.remove('apply-overlay-active');
if (indicator) indicator.style.display = 'none'; window.clearTimeout(tt);
docker_status_message('notice', '<%:Docker actions done.%>'); return;
document.body.classList.remove('apply-overlay-active'); }
window.clearTimeout(tt); loading_msg = resjson?resjson.info:loading_msg
return; // var delay = isNaN(duration) ? 0 : Math.max(1000 - duration, 0);
} var delay =1000
loading_msg = resjson?resjson.info:loading_msg window.setTimeout(function() {
// var delay = isNaN(duration) ? 0 : Math.max(1000 - duration, 0); xhr.get('<%=url("admin/docker/confirm")%>', null, call, uci_apply_timeout * 1000);
var delay =1000 },delay);
window.setTimeout(function() { };
xhr.get('<%=url("admin/docker/confirm")%>', null, call, uci_apply_timeout * 1000);
}, delay);
};
var tick = function() { var tick = function() {
var now = Date.now(); var now = Date.now();
docker_status_message('notice', docker_status_message(
'<img src="<%=resource%>/icons/loading.gif" alt="" style="vertical-align:middle" /> <span style="white-space:pre-line; word-break:break-all; font-family: \'Courier New\', Courier, monospace;">' + 'notice',
loading_msg + '</span>'); '<img src="<%=resource%>/icons/loading.gif" alt="" style="vertical-align:middle" /> <span style="white-space:pre-line; word-break:break-all; font-family: \'Courier New\', Courier, monospace;">' + loading_msg + '</span>'
);
tt = window.setTimeout(tick, 200); tt = window.setTimeout(tick, 200);
ts = now; ts = now;
}; };
tick();
/* wait a few seconds for the settings to become effective */
window.setTimeout(call, Math.max(uci_apply_holdoff * 1000 , 1));
}
// document.getElementsByTagName("form")[0].addEventListener("submit", (e)=>{
// uci_confirm_docker()
// })
function fnSubmitForm(el){ tick();
if (el.id != "cbid.table.1._new") { /* wait a few seconds for the settings to become effective */
uci_confirm_docker() window.setTimeout(call, Math.max(uci_apply_holdoff * 1000 , 1));
} }
} // document.getElementsByTagName("form")[0].addEventListener("submit", (e)=>{
// uci_confirm_docker()
// })
<% if self.err then -%> function fnSubmitForm(el){
docker_status_message('warning', '<span style="white-space:pre-line; word-break:break-all; font-family: \'Courier New\', Courier, monospace;">'+`<%=self.err%>`+'</span>'); if (el.id != "cbid.table.1._new") {
document.getElementById('docker_apply_overlay').addEventListener("click", (e)=>{ uci_confirm_docker()
docker_status_message() }
}) }
<%- end %>
window.onload= function (){ <% if self.err then -%>
var buttons = document.querySelectorAll('input[type="submit"]'); docker_status_message('warning', '<span style="white-space:pre-line; word-break:break-all; font-family: \'Courier New\', Courier, monospace;">'+`<%=self.err%>`+'</span>');
[].slice.call(buttons).forEach(function (el) { document.getElementById('docker_apply_overlay').addEventListener(
el.onclick = fnSubmitForm.bind(this, el); "click",
}); (e)=>{
} docker_status_message()
}
)
<%- end %>
window.onload= function (){
var buttons = document.querySelectorAll('input[type="submit"]');
[].slice.call(buttons).forEach(function (el) {
el.onclick = fnSubmitForm.bind(this, el);
});
}
//]]></script> //]]></script>

15
applications/luci-app-dockerman/luasrc/view/dockerman/container.htm
View file

@ -1,12 +1,12 @@
<br> <br>
<ul class="cbi-tabmenu"> <ul class="cbi-tabmenu">
<li id="cbi-tab-container_info"><a id="a-cbi-tab-container_info" href=""><%:Info%></a></li> <li id="cbi-tab-container_info"><a id="a-cbi-tab-container_info" href=""><%:Info%></a></li>
<li id="cbi-tab-container_resources"><a id="a-cbi-tab-container_resources" href=""><%:Resources%></a></li> <li id="cbi-tab-container_resources"><a id="a-cbi-tab-container_resources" href=""><%:Resources%></a></li>
<li id="cbi-tab-container_stats"><a id="a-cbi-tab-container_stats" href=""><%:Stats%></a></li> <li id="cbi-tab-container_stats"><a id="a-cbi-tab-container_stats" href=""><%:Stats%></a></li>
<li id="cbi-tab-container_file"><a id="a-cbi-tab-container_file" href=""><%:File%></a></li> <li id="cbi-tab-container_file"><a id="a-cbi-tab-container_file" href=""><%:File%></a></li>
<li id="cbi-tab-container_console"><a id="a-cbi-tab-container_console" href=""><%:Console%></a></li> <li id="cbi-tab-container_console"><a id="a-cbi-tab-container_console" href=""><%:Console%></a></li>
<li id="cbi-tab-container_inspect"><a id="a-cbi-tab-container_inspect" href=""><%:Inspect%></a></li> <li id="cbi-tab-container_inspect"><a id="a-cbi-tab-container_inspect" href=""><%:Inspect%></a></li>
<li id="cbi-tab-container_logs"><a id="a-cbi-tab-container_logs" href=""><%:Logs%></a></li> <li id="cbi-tab-container_logs"><a id="a-cbi-tab-container_logs" href=""><%:Logs%></a></li>
</ul> </ul>
<script type="text/javascript"> <script type="text/javascript">
@ -20,7 +20,8 @@
document.getElementById("a-cbi-tab-container_" + item).href= path[0]+"/admin/docker/container/"+container_id+'/'+item document.getElementById("a-cbi-tab-container_" + item).href= path[0]+"/admin/docker/container/"+container_id+'/'+item
if (action === item) { if (action === item) {
document.getElementById("cbi-tab-container_" + item).className="cbi-tab" document.getElementById("cbi-tab-container_" + item).className="cbi-tab"
} else { }
else {
document.getElementById("cbi-tab-container_" + item).className="cbi-tab-disabled" document.getElementById("cbi-tab-container_" + item).className="cbi-tab-disabled"
} }
}) })

4
applications/luci-app-dockerman/luasrc/view/dockerman/container_console.htm
View file

@ -1,6 +1,6 @@
<div class="cbi-map"> <div class="cbi-map">
<iframe id="terminal" style="width: 100%; min-height: 500px; border: none; border-radius: 3px;"></iframe> <iframe id="terminal" style="width: 100%; min-height: 500px; border: none; border-radius: 3px;"></iframe>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
document.getElementById("terminal").src = "http://" + window.location.hostname + ":7682"; document.getElementById("terminal").src = "http://" + window.location.hostname + ":7682";
</script> </script>

128
applications/luci-app-dockerman/luasrc/view/dockerman/container_file.htm
View file

@ -1,63 +1,73 @@
<div id="upload-container" class="cbi-value cbi-value-last"> <div id="upload-container" class="cbi-value cbi-value-last">
<label class="cbi-value-title" for="archive"><%:Upload%></label> <label class="cbi-value-title" for="archive"><%:Upload%></label>
<div class="cbi-value-field"> <div class="cbi-value-field">
<input type="file" name="upload_archive" accept="application/x-tar" id="upload_archive" /> <input type="file" name="upload_archive" accept="application/x-tar" id="upload_archive" />
</div> </div>
<br> <br>
<label class="cbi-value-title" for="path"><%:Path%></label> <label class="cbi-value-title" for="path"><%:Path%></label>
<div class="cbi-value-field"> <div class="cbi-value-field">
<input type="text" class="cbi-input-text" name="path" value="/tmp/" id="path" /> <input type="text" class="cbi-input-text" name="path" value="/tmp/" id="path" />
</div> </div>
<br> <br>
<div class="cbi-value-field"> <div class="cbi-value-field">
<input type="button"" class="btn cbi-button cbi-button-action important" id="upload" name="upload" value="<%:Upload%>" /> <input type="button"" class="btn cbi-button cbi-button-action important" id="upload" name="upload" value="<%:Upload%>" />
<input type="button"" class="btn cbi-button cbi-button-action important" id="download" name="download" value="<%:Download%>" /> <input type="button"" class="btn cbi-button cbi-button-action important" id="download" name="download" value="<%:Download%>" />
</div> </div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
let btnUpload = document.getElementById('upload') let btnUpload = document.getElementById('upload')
btnUpload.onclick = function (e) { btnUpload.onclick = function (e) {
let uploadArchive = document.getElementById('upload_archive') let uploadArchive = document.getElementById('upload_archive')
let uploadPath = document.getElementById('path').value let uploadPath = document.getElementById('path').value
if (!uploadArchive.value || !uploadPath) { if (!uploadArchive.value || !uploadPath) {
docker_status_message('warning', "<%:Please input the PATH and select the file !%>") docker_status_message('warning', "<%:Please input the PATH and select the file !%>")
document.getElementById('docker_apply_overlay').addEventListener("click", (e)=>{ document.getElementById('docker_apply_overlay').addEventListener(
docker_status_message() "click",
}) (e)=>{
return docker_status_message()
} }
let fileName = uploadArchive.files[0].name )
let formData = new FormData() return
formData.append('upload-filename', fileName) }
formData.append('upload-path', uploadPath) let fileName = uploadArchive.files[0].name
formData.append('upload-archive', uploadArchive.files[0]) let formData = new FormData()
let xhr = new XMLHttpRequest() formData.append('upload-filename', fileName)
xhr.open("POST", '<%=luci.dispatcher.build_url("admin/docker/container_put_archive")%>/<%=self.container%>', true) formData.append('upload-path', uploadPath)
xhr.onload = function() { formData.append('upload-archive', uploadArchive.files[0])
if (xhr.status == 200) { let xhr = new XMLHttpRequest()
uploadArchive.value = '' xhr.open("POST", '<%=luci.dispatcher.build_url("admin/docker/container_put_archive")%>/<%=self.container%>', true)
docker_status_message('notice', "<%:Upload Success%>") xhr.onload = function() {
} if (xhr.status == 200) {
else { uploadArchive.value = ''
docker_status_message('warning', "<%:Upload Error%>:" + xhr.statusText) docker_status_message('notice', "<%:Upload Success%>")
} }
document.getElementById('docker_apply_overlay').addEventListener("click", (e)=>{ else {
docker_status_message() docker_status_message('warning', "<%:Upload Error%>:" + xhr.statusText)
}) }
} document.getElementById('docker_apply_overlay').addEventListener(
xhr.send(formData) "click",
} (e)=>{
let btnDownload = document.getElementById('download') docker_status_message()
btnDownload.onclick = function (e) { }
let downloadPath = document.getElementById('path').value )
if (!downloadPath) { }
docker_status_message('warning', "<%:Please input the PATH !%>") xhr.send(formData)
document.getElementById('docker_apply_overlay').addEventListener("click", (e)=>{ }
docker_status_message()
}) let btnDownload = document.getElementById('download')
return btnDownload.onclick = function (e) {
} let downloadPath = document.getElementById('path').value
window.open('<%=luci.dispatcher.build_url("admin/docker/container_get_archive")%>?id=<%=self.container%>&path=' + encodeURIComponent(downloadPath)) if (!downloadPath) {
} docker_status_message('warning', "<%:Please input the PATH !%>")
document.getElementById('docker_apply_overlay').addEventListener(
"click",
(e)=>{
docker_status_message()
}
)
return
}
window.open('<%=luci.dispatcher.build_url("admin/docker/container_get_archive")%>?id=<%=self.container%>&path=' + encodeURIComponent(downloadPath))
}
</script> </script>

1
applications/luci-app-dockerman/luasrc/view/dockerman/container_stats.htm
View file

@ -2,6 +2,7 @@
let last_bw_tx let last_bw_tx
let last_bw_rx let last_bw_rx
let interval = 3 let interval = 3
function progressbar(v, m, pc, np, f) { function progressbar(v, m, pc, np, f) {
m = m || 100 m = m || 100

174
applications/luci-app-dockerman/luasrc/view/dockerman/images_import.htm
View file

@ -1,88 +1,104 @@
<input type="text" class="cbi-input-text" name="isrc" placeholder="http://host/image.tar" id="isrc" /> <input type="text" class="cbi-input-text" name="isrc" placeholder="http://host/image.tar" id="isrc" />
<input type="text" class="cbi-input-text" name="itag" placeholder="repository:tag" id="itag" /> <input type="text" class="cbi-input-text" name="itag" placeholder="repository:tag" id="itag" />
<div style="display: inline-block;"> <div style="display: inline-block;">
<input type="button"" class="btn cbi-button cbi-button-add" id="btnimport" name="import" value="<%:Import%>" /> <input type="button"" class="btn cbi-button cbi-button-add" id="btnimport" name="import" value="<%:Import%>" />
<input type="file" id="file_import" style="visibility:hidden; position: absolute;top: 0px; left: 0px;" /> <input type="file" id="file_import" style="visibility:hidden; position: absolute;top: 0px; left: 0px;" />
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
let btnImport = document.getElementById('btnimport') let btnImport = document.getElementById('btnimport')
let valISrc = document.getElementById('isrc') let valISrc = document.getElementById('isrc')
let valITag = document.getElementById('itag') let valITag = document.getElementById('itag')
btnImport.onclick = function (e) { btnImport.onclick = function (e) {
if (valISrc.value == "") { if (valISrc.value == "") {
document.getElementById("file_import").click() document.getElementById("file_import").click()
return return
} else { }
let formData = new FormData() else {
formData.append('src', valISrc.value) let formData = new FormData()
formData.append('tag', valITag.value) formData.append('src', valISrc.value)
let xhr = new XMLHttpRequest() formData.append('tag', valITag.value)
uci_confirm_docker() let xhr = new XMLHttpRequest()
xhr.open("POST", "<%=luci.dispatcher.build_url('admin/docker/images_import')%>", true) uci_confirm_docker()
xhr.onload = function () { xhr.open("POST", "<%=luci.dispatcher.build_url('admin/docker/images_import')%>", true)
location.reload() xhr.onload = function () {
} location.reload()
xhr.send(formData) }
} xhr.send(formData)
} }
let fileimport = document.getElementById('file_import') }
fileimport.onchange = function (e) {
let fileimport = document.getElementById('file_import')
if (!fileimport.value) {
return
}
let valITag = document.getElementById('itag')
let fileName = fileimport.files[0].name
let formData = new FormData()
formData.append('upload-filename', fileName)
formData.append('tag', valITag.value)
formData.append('upload-archive', fileimport.files[0])
let xhr = new XMLHttpRequest()
uci_confirm_docker()
xhr.open("POST", "<%=luci.dispatcher.build_url('admin/docker/images_import')%>", true)
xhr.onload = function () {
fileimport.value = ''
location.reload()
}
xhr.send(formData)
}
let new_tag = function (image_id) { let fileimport = document.getElementById('file_import')
let new_tag = prompt("<%:New tag%>\n<%:Image%>" + "ID: " + image_id + "\n<%:Please input new tag%>:", "") fileimport.onchange = function (e) {
if (new_tag) { let fileimport = document.getElementById('file_import')
(new XHR()).post("<%=luci.dispatcher.build_url('admin/docker/images_tag')%>", if (!fileimport.value) {
{ id: image_id, tag: new_tag }, return
function (r) { }
if (r.status == 201) { let valITag = document.getElementById('itag')
location.reload() let fileName = fileimport.files[0].name
} let formData = new FormData()
else { formData.append('upload-filename', fileName)
docker_status_message('warning', 'Image: untagging ' + tag + '...fail code:' + r.status + r.statusText); formData.append('tag', valITag.value)
document.getElementById('docker_apply_overlay').addEventListener("click", (e)=>{ formData.append('upload-archive', fileimport.files[0])
docker_status_message() let xhr = new XMLHttpRequest()
}) uci_confirm_docker()
} xhr.open("POST", "<%=luci.dispatcher.build_url('admin/docker/images_import')%>", true)
}) xhr.onload = function () {
} fileimport.value = ''
} location.reload()
}
xhr.send(formData)
}
let un_tag = function (tag) { let new_tag = function (image_id) {
if (tag.match("<none>")) return let new_tag = prompt("<%:New tag%>\n<%:Image%>" + "ID: " + image_id + "\n<%:Please input new tag%>:", "")
if (confirm("<%:Remove tag%>: " + tag + " ?")) { if (new_tag) {
(new XHR()).post("<%=luci.dispatcher.build_url('admin/docker/images_untag')%>", (new XHR()).post("<%=luci.dispatcher.build_url('admin/docker/images_tag')%>",
{ tag: tag }, {
function (r) { id: image_id,
if (r.status == 200) { tag: new_tag
location.reload() },
} function (r) {
else { if (r.status == 201) {
docker_status_message('warning', 'Image: untagging ' + tag + '...fail code:' + r.status + r.statusText); location.reload()
document.getElementById('docker_apply_overlay').addEventListener("click", (e)=>{ }
docker_status_message() else {
}) docker_status_message('warning', 'Image: untagging ' + tag + '...fail code:' + r.status + r.statusText);
} document.getElementById('docker_apply_overlay').addEventListener(
}) "click",
} (e)=>{
} docker_status_message()
}
)
}
}
)
}
}
let un_tag = function (tag) {
if (tag.match("<none>"))
return
if (confirm("<%:Remove tag%>: " + tag + " ?")) {
(new XHR()).post("<%=luci.dispatcher.build_url('admin/docker/images_untag')%>",
{
tag: tag
},
function (r) {
if (r.status == 200) {
location.reload()
}
else {
docker_status_message('warning', 'Image: untagging ' + tag + '...fail code:' + r.status + r.statusText);
document.getElementById('docker_apply_overlay').addEventListener(
"click",
(e)=>{
docker_status_message()
}
)
}
}
)
}
}
</script> </script>

51
applications/luci-app-dockerman/luasrc/view/dockerman/images_load.htm
View file

@ -1,29 +1,30 @@
<div style="display: inline-block;"> <div style="display: inline-block;">
<input type="button"" class="btn cbi-button cbi-button-add" id="btnload" name="load" value="<%:Load%>" /> <input type="button"" class="btn cbi-button cbi-button-add" id="btnload" name="load" value="<%:Load%>" />
<input type="file" id="file_load" style="visibility:hidden; position: absolute;top: 0px; left: 0px;" accept="application/x-tar" /> <input type="file" id="file_load" style="visibility:hidden; position: absolute;top: 0px; left: 0px;" accept="application/x-tar" />
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
let btnLoad = document.getElementById('btnload') let btnLoad = document.getElementById('btnload')
btnLoad.onclick = function (e) { btnLoad.onclick = function (e) {
document.getElementById("file_load").click() document.getElementById("file_load").click()
e.preventDefault() e.preventDefault()
} }
let fileLoad = document.getElementById('file_load')
fileLoad.onchange = function(e){ let fileLoad = document.getElementById('file_load')
let fileLoad = document.getElementById('file_load') fileLoad.onchange = function(e){
if (!fileLoad.value) { let fileLoad = document.getElementById('file_load')
return if (!fileLoad.value) {
} return
let fileName = fileLoad.files[0].name }
let formData = new FormData() let fileName = fileLoad.files[0].name
formData.append('upload-filename', fileName) let formData = new FormData()
formData.append('upload-archive', fileLoad.files[0]) formData.append('upload-filename', fileName)
let xhr = new XMLHttpRequest() formData.append('upload-archive', fileLoad.files[0])
uci_confirm_docker() let xhr = new XMLHttpRequest()
xhr.open("POST", '<%=luci.dispatcher.build_url("admin/docker/images_load")%>', true) uci_confirm_docker()
xhr.onload = function() { xhr.open("POST", '<%=luci.dispatcher.build_url("admin/docker/images_load")%>', true)
location.reload() xhr.onload = function() {
} location.reload()
xhr.send(formData) }
} xhr.send(formData)
}
</script> </script>

163
applications/luci-app-dockerman/luasrc/view/dockerman/newcontainer_resolve.htm
View file

@ -1,95 +1,102 @@
<style type="text/css"> <style type="text/css">
#dialog_reslov { #dialog_reslov {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
background: rgba(0, 0, 0, 0.7); background: rgba(0, 0, 0, 0.7);
display: none; display: none;
z-index: 20000; z-index: 20000;
} }
#dialog_reslov .dialog_box { #dialog_reslov .dialog_box {
position: relative; position: relative;
background: rgba(255, 255, 255); background: rgba(255, 255, 255);
top: 10%; top: 10%;
width: 50%; width: 50%;
margin: auto; margin: auto;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
height:auto; height:auto;
align-items: center; align-items: center;
} }
#dialog_reslov .dialog_line { #dialog_reslov .dialog_line {
margin-top: .5em; margin-top: .5em;
margin-bottom: .5em; margin-bottom: .5em;
margin-left: 2em; margin-left: 2em;
margin-right: 2em; margin-right: 2em;
} }
#dialog_reslov .dialog_box>h4, #dialog_reslov .dialog_box>h4,
#dialog_reslov .dialog_box>p, #dialog_reslov .dialog_box>p,
#dialog_reslov .dialog_box>div { #dialog_reslov .dialog_box>div {
flex-basis: 100%; flex-basis: 100%;
} }
#dialog_reslov .dialog_box>img { #dialog_reslov .dialog_box>img {
margin-right: 1em; margin-right: 1em;
flex-basis: 32px; flex-basis: 32px;
} }
body.dialog-reslov-active { body.dialog-reslov-active {
overflow: hidden; overflow: hidden;
height: 100vh; height: 100vh;
} }
body.dialog-reslov-active #dialog_reslov { body.dialog-reslov-active #dialog_reslov {
display: block; display: block;
} }
</style> </style>
<script type="text/javascript"> <script type="text/javascript">
function close_reslov_dialog() { function close_reslov_dialog() {
document.body.classList.remove('dialog-reslov-active') document.body.classList.remove('dialog-reslov-active')
document.documentElement.style.overflowY = 'scroll' document.documentElement.style.overflowY = 'scroll'
} }
function reslov_container() { function reslov_container() {
let s = document.getElementById('cmd-line-status') let s = document.getElementById('cmd-line-status')
if (!s) return
let cmd_line = document.getElementById("dialog_reslov_text").value;
if (cmd_line == null || cmd_line == "") {
return
}
cmd_line = cmd_line.replace(/(^\s*)/g,"")
if (!cmd_line.match(/^docker\s+(run|create)/)) {
s.innerHTML = "<font color='red'><%:Command line Error%></font>"
return
}
let reg_space = /\s+/g
let reg_muti_line= /\\\s*\n/g
// reg_rem =/(?<!\\)`#.+(?<!\\)`/g // the command has `# `
let reg_rem =/`#.+`/g// the command has `# `
cmd_line = cmd_line.replace(/^docker\s+(run|create)/,"DOCKERCLI").replace(reg_rem, " ").replace(reg_muti_line, " ").replace(reg_space, " ")
console.log(cmd_line)
window.location.href = '<%=luci.dispatcher.build_url("admin/docker/newcontainer")%>/' + encodeURI(cmd_line)
}
function clear_text(){ if (!s)
let s = document.getElementById('cmd-line-status') return
s.innerHTML = ""
}
function show_reslov_dialog() { let cmd_line = document.getElementById("dialog_reslov_text").value;
document.getElementById('dialog_reslov') || document.body.insertAdjacentHTML("beforeend", '<div id="dialog_reslov"><div class="dialog_box"><div class="dialog_line"></div><div class="dialog_line"><span><%:Plese input <docker create/run> command line:%></span><br><span id="cmd-line-status"></span></div><div class="dialog_line"><textarea class="cbi-input-textarea" id="dialog_reslov_text" style="width: 100%; height:100%;" rows="15" onkeyup="clear_text()"></textarea></div><div class="dialog_line" style="text-align: right;"><input type="button" class="btn cbi-button cbi-button-apply" type="submit" value="<%:Submit%>" onclick="reslov_container()" /> <input type="button" class="btn cbi-button cbi-button-reset" type="reset" value="<%:Cancel%>" onclick="close_reslov_dialog()" /></div><div class="dialog_line"></div></div></div>') if (cmd_line == null || cmd_line == "") {
document.body.classList.add('dialog-reslov-active') return
let s = document.getElementById('cmd-line-status') }
s.innerHTML = ""
document.documentElement.style.overflowY = 'hidden' cmd_line = cmd_line.replace(/(^\s*)/g,"")
} if (!cmd_line.match(/^docker\s+(run|create)/)) {
s.innerHTML = "<font color='red'><%:Command line Error%></font>"
return
}
let reg_space = /\s+/g
let reg_muti_line= /\\\s*\n/g
// reg_rem =/(?<!\\)`#.+(?<!\\)`/g // the command has `# `
let reg_rem =/`#.+`/g// the command has `# `
cmd_line = cmd_line.replace(/^docker\s+(run|create)/,"DOCKERCLI").replace(reg_rem, " ").replace(reg_muti_line, " ").replace(reg_space, " ")
console.log(cmd_line)
window.location.href = '<%=luci.dispatcher.build_url("admin/docker/newcontainer")%>/' + encodeURI(cmd_line)
}
function clear_text(){
let s = document.getElementById('cmd-line-status')
s.innerHTML = ""
}
function show_reslov_dialog() {
document.getElementById('dialog_reslov') || document.body.insertAdjacentHTML("beforeend", '<div id="dialog_reslov"><div class="dialog_box"><div class="dialog_line"></div><div class="dialog_line"><span><%:Plese input <docker create/run> command line:%></span><br><span id="cmd-line-status"></span></div><div class="dialog_line"><textarea class="cbi-input-textarea" id="dialog_reslov_text" style="width: 100%; height:100%;" rows="15" onkeyup="clear_text()"></textarea></div><div class="dialog_line" style="text-align: right;"><input type="button" class="btn cbi-button cbi-button-apply" type="submit" value="<%:Submit%>" onclick="reslov_container()" /> <input type="button" class="btn cbi-button cbi-button-reset" type="reset" value="<%:Cancel%>" onclick="close_reslov_dialog()" /></div><div class="dialog_line"></div></div></div>')
document.body.classList.add('dialog-reslov-active')
let s = document.getElementById('cmd-line-status')
s.innerHTML = ""
document.documentElement.style.overflowY = 'hidden'
}
</script> </script>
<%+cbi/valueheader%> <%+cbi/valueheader%>
<input type="button" class="btn cbi-button cbi-button-apply" value="<%:Command line%>" onclick="show_reslov_dialog()" /> <input type="button" class="btn cbi-button cbi-button-apply" value="<%:Command line%>" onclick="show_reslov_dialog()" />
<%+cbi/valuefooter%> <%+cbi/valuefooter%>

459
applications/luci-app-dockerman/luasrc/view/dockerman/overview.htm
View file

File diff suppressed because one or more lines are too long