luci/applications/luci-app-commands/luasrc/view/commands.htm
Jo-Philipp Wich 36959dc0d1 luci-app-commands: prevent page reload on invoking command actions
Fixes: f117b7f ("luci-app-commands: use <button> elements")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-04-09 14:36:19 +02:00

187 lines
4.7 KiB
HTML

<%#
Copyright 2012 Jo-Philipp Wich <jow@openwrt.org>
Licensed to the public under the Apache License 2.0.
-%>
<% css = [[
.commandbox {
height: 12em;
width: 30%;
float: left;
height: 12em;
margin: 5px;
position: relative;
}
.commandbox h3 {
font-size: 1.5em !important;
line-height: 2em !important;
margin: 0 !important;
}
.commandbox input[type="text"] {
width: 50% !important;
}
.commandbox div {
position: absolute;
left: 0;
bottom: 1.5em;
}
]] -%>
<%+header%>
<script type="text/javascript">//<![CDATA[
var stxhr = new XHR();
function command_run(ev, id)
{
var args;
var field = document.getElementById(id);
if (field)
args = encodeURIComponent(field.value);
var legend = document.getElementById('command-rc-legend');
var output = document.getElementById('command-rc-output');
if (legend && output)
{
output.innerHTML =
'<img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> ' +
'<%:Waiting for command to complete...%>'
;
legend.parentNode.style.display = 'block';
legend.style.display = 'inline';
stxhr.get('<%=url('admin/system/commands/run')%>/' + id + (args ? '/' + args : ''), null,
function(x, st)
{
if (st)
{
if (st.binary)
st.stdout = '[<%:Binary data not displayed, download instead.%>]';
legend.style.display = 'none';
output.innerHTML = String.format(
'<pre><strong># %h\n</strong>%h<span style="color:red">%h</span></pre>' +
'<div class="alert-message warning">%s (<%:Code:%> %d)</div>',
st.command, st.stdout, st.stderr,
(st.exitcode == 0) ? '<%:Command successful%>' : '<%:Command failed%>',
st.exitcode);
}
else
{
legend.style.display = 'none';
output.innerHTML = '<span class="error"><%:Failed to execute command!%></span>';
}
location.hash = '#output';
}
);
}
ev.preventDefault();
}
function command_download(ev, id)
{
var args;
var field = document.getElementById(id);
if (field)
args = encodeURIComponent(field.value);
location.href = '<%=url('admin/system/commands/download')%>/' + id + (args ? '/' + args : '');
ev.preventDefault();
}
function command_link(ev, id)
{
var legend = document.getElementById('command-rc-legend');
var output = document.getElementById('command-rc-output');
var args;
var field = document.getElementById(id);
if (field)
args = encodeURIComponent(field.value);
if (legend && output)
{
var prefix = location.protocol + '//' + location.host + '<%=url('command')%>/';
var suffix = (args ? '/' + args : '');
var link = prefix + id + suffix;
var link_nodownload = prefix + id + "s" + suffix;
legend.style.display = 'none';
output.parentNode.style.display = 'block';
output.innerHTML = String.format(
'<div class="alert-message"><p><%:Download execution result%> <a href="%s">%s</a></p><p><%:Or display result%> <a href="%s">%s</a></p></div>',
link, link, link_nodownload, link_nodownload
);
location.hash = '#output';
}
ev.preventDefault();
}
//]]></script>
<%
local uci = require "luci.model.uci".cursor()
local commands = { }
uci:foreach("luci", "command", function(s) commands[#commands+1] = s end)
%>
<form method="get" action="<%=pcdata(FULL_REQUEST_URI)%>">
<div class="cbi-map">
<h2 name="content"><%:Custom Commands%></h2>
<% if #commands == 0 then %>
<div class="cbi-section">
<div class="table cbi-section-table">
<div class="tr cbi-section-table-row">
<p>
<em><%:This section contains no values yet%></em>
</p>
</div>
</div>
</div>
<% else %>
<fieldset class="cbi-section">
<% local _, command; for _, command in ipairs(commands) do %>
<div class="commandbox">
<h3><%=pcdata(command.name)%></h3>
<p><%:Command:%> <code><%=pcdata(command.command)%></code></p>
<% if command.param == "1" then %>
<p><%:Arguments:%> <input type="text" id="<%=command['.name']%>" /></p>
<% end %>
<div>
<button class="cbi-button cbi-button-apply" onclick="command_run(event, '<%=command['.name']%>')"><%:Run%></button>
<button class="cbi-button cbi-button-download" onclick="command_download(event, '<%=command['.name']%>')"><%:Download%></button>
<% if command.public == "1" then %>
<button class="cbi-button cbi-button-link" onclick="command_link(event, '<%=command['.name']%>')"><%:Link%></button>
<% end %>
</div>
</div>
<% end %>
<br style="clear:both" /><br />
<a name="output"></a>
</fieldset>
<% end %>
</div>
<fieldset class="cbi-section" style="display:none">
<legend id="command-rc-legend"><%:Collecting data...%></legend>
<span id="command-rc-output"></span>
</fieldset>
</form>
<%+footer%>