Cookies.set_cookie('baculum_side_bar_hide', 0);
this.sidebar.style.display = 'block';
this.overlay_bg.style.display = 'block';
- this.page_main.css({'margin-left': '300px', 'width': 'calc(100% - 300px)'});
+ this.page_main.css({'margin-left': '250px', 'width': 'calc(100% - 250px)'});
}
},
close: function() {
</div>
<com:Application.Web.Portlets.MainSideBar />
<!-- !PAGE CONTENT! -->
- <div class="w3-main page_main_el" id="page_main" style="margin-left:300px; margin-top:43px;">
+ <div class="w3-main page_main_el" id="page_main" style="margin-left: 250px; margin-top: 43px;">
<span class="w3-tag w3-large w3-purple w3-right w3-padding-small w3-margin-top w3-margin-right">
<i class="fa fa-cogs w3-large"></i> <%[ Running jobs: ]%> <span id="running_jobs"></span>
</span>
<%@ MasterClass="Application.Web.Layouts.Main" Theme="Baculum-v2"%>
<com:TContent ID="Main">
<!-- Header -->
- <header class="w3-container">
+ <header class="w3-container w3-show-block">
<h5>
<b><i class="fa fa-chart-pie"></i> <%[ Graphs ]%></b>
</h5>
<p class="info w3-hide-medium w3-hide-small"><%[ Tip: Use left-click to select table row. Use CTRL + left-click to multiple row selection. Use SHIFT + left-click to add a range of rows to selection. ]%></p>
</div>
<com:Application.Web.Portlets.RunJob ID="RunJobModal" />
- <com:TCallback ID="RunJobCb" OnCallback="runJobAgain" />
- <com:TCallback ID="CancelJobCb" OnCallback="cancelJob" />
+ <com:TCallback ID="RunJobCb" OnCallback="runJobAgain">
+ <prop:ClientSide.OnLoading>
+ show_btn_loader(sender.options.CallbackParameter);
+ </prop:ClientSide.OnLoading>
+ <prop:ClientSide.OnComplete>
+ hide_btn_loader(sender.options.CallbackParameter);
+ oMonitor();
+ </prop:ClientSide.OnComplete>
+ </com:TCallback>
+ <com:TCallback ID="CancelJobCb" OnCallback="cancelJob">
+ <prop:ClientSide.OnLoading>
+ show_btn_loader(sender.options.CallbackParameter);
+ </prop:ClientSide.OnLoading>
+ <prop:ClientSide.OnComplete>
+ hide_btn_loader(sender.options.CallbackParameter);
+ oMonitor();
+ </prop:ClientSide.OnComplete>
+ </com:TCallback>
<script type="text/javascript">
-var run_job_callback = <%=$this->RunJobCb->ActiveControl->Javascript%>;
-var cancel_job_callback = <%=$this->CancelJobCb->ActiveControl->Javascript%>;
-function refresh_job_history(jobid) {
- document.location.href = '<%=$this->Service->constructUrl('JobHistoryList')%>';
+function get_run_job_callback() {
+ return <%=$this->RunJobCb->ActiveControl->Javascript%>;
}
+function get_cancel_job_callback() {
+ return <%=$this->CancelJobCb->ActiveControl->Javascript%>;
+}
+function show_btn_loader(jobid) {
+ var btns = document.querySelectorAll('button[data-btn-id="' + jobid + '"]');
+ var loader;
+ for (var i = 0; i < btns.length; i++) {
+ loader = document.createElement('IMG');
+ loader.setAttribute('data-loader-id', jobid);
+ loader.src = '<%=$this->getPage()->getTheme()->getBaseUrl()%>/loader-small.gif';
+ loader.style.display = 'none';
+ loader.className = 'btn_loader';
+ btns[i].parentNode.insertBefore(loader, btns[i]);
+ btns[i].style.display = 'none';
+ loader.style.display = '';
+ }
+}
+
+function hide_btn_loader(jobid) {
+ var btns = document.querySelectorAll('button[data-btn-id="' + jobid + '"]');
+ var loaders = document.querySelectorAll('img[data-loader-id="' + jobid + '"]');
+ var loader_list = Array.prototype.slice.call(loaders);
+
+ // Note, there can be more loaders with the same loader-id in small width view.
+ for (var i = (loader_list.length-1); i >= 0; i--) {
+ loader_list[i].parentNode.removeChild(loader_list[i]);
+ }
+
+ for (var i = 0; i < btns.length; i++) {
+ btns[i].style.display = 'inline-block';
+ }
+}
+
var oJobList = {
table: null,
table_toolbar: null,
this.table_toolbar.style.display = this.table.rows({selected: true}).data().length > 0 ? '' : 'none';
}.bind(this));
}.bind(this));
+ var el = $('#' + this.ids.job_list);
+ el.on('page.dt', function () {
+ el.find('img.btn_loader').each(function(idx, el) {
+ var jobid = el.getAttribute('data-loader-id');
+ hide_btn_loader(jobid);
+ });
+ });
},
set_table: function() {
this.table = $('#' + this.ids.job_list).DataTable({
if (['C', 'R'].indexOf(row.jobstatus) === -1) {
// rerun job button
btn = document.createElement('BUTTON');
- btn.className = 'w3-button w3-green';
+ btn.className = 'w3-button w3-tiny w3-green';
btn.type = 'button';
i = document.createElement('I');
btn.title = '<%[ Run job again ]%>';
i.className = 'fa fa-play';
btn.appendChild(i);
- btn.setAttribute('onclick', 'run_job_callback.setCallbackParameter(' + data + '); run_job_callback.dispatch();');
+ btn.setAttribute('data-btn-id', data);
+ btn.setAttribute('onclick', 'var rjc = get_run_job_callback(); rjc.setCallbackParameter(' + data + '); rjc.dispatch();');
} else {
// cancel job button
btn = document.createElement('BUTTON');
- btn.className = 'w3-button w3-green';
+ btn.className = 'w3-button w3-tiny w3-green';
btn.type = 'button';
i = document.createElement('I');
btn.title = '<%[ Cancel job ]%>';
i.className = 'fa fa-stop';
btn.appendChild(i);
- btn.setAttribute('onclick', 'cancel_job_callback.setCallbackParameter(' + data + '); cancel_job_callback.dispatch();');
+ btn.setAttribute('data-btn-id', data);
+ btn.setAttribute('onclick', 'var cjc = get_cancel_job_callback(); cjc.setCallbackParameter(' + data + '); cjc.dispatch();');
}
container.appendChild(btn);
var space = document.createTextNode(' ');
// job details button
btn = document.createElement('BUTTON');
- btn.className = 'w3-button w3-green';
+ btn.className = 'w3-button w3-tiny w3-green';
btn.type = 'button';
i = document.createElement('I');
i.className = 'fa fa-list-ul';
$result = $this->getModule('api')->create(array('jobs', 'run'), $params);
if ($result->error === 0) {
$started_jobid = $this->getModule('misc')->findJobIdStartedJob($result->output);
- if (is_numeric($started_jobid)) {
- $this->getPage()->getCallbackClient()->callClientFunction('refresh_job_history');
- } else {
+ if (!is_numeric($started_jobid)) {
$errmsg = implode('<br />', $result->output);
$this->getPage()->getCallbackClient()->callClientFunction('show_error', array($errmsg, $result->error));
}
array('jobs', $jobid, 'cancel'),
array()
);
- $this->getPage()->getCallbackClient()->callClientFunction('refresh_job_history');
}
/**
<b><i class="fa fa-plus"></i> <%[ New ]%> <%=$this->getResourceType()%></b>
</h5>
</header>
- <button type="button" class="w3-button w3-green w3-margin-left w3-margin-bottom" onclick="document.getElementById('new_resource').style.display = 'block'">
- <i class="fa fa-plus"></i> <%=Prado::localize('Add new resource')%>
- </button>
- <div id="resource_save_ok_box" class="w3-modal" style="display: none">
- <div class="w3-modal-content w3-card-4 w3-animate-zoom" style="width: 600px">
- <header class="w3-container w3-green">
- <span onclick="$('#resource_save_ok_box').hide();" class="w3-button w3-display-topright">×</span>
- <h2><%[ Create new resource ]%></h2>
- </header>
- <div class="w3-panel w3-padding">
- <p><%[ The resource has been created successfully. ]%></p>
+ <div>
+ <button type="button" class="w3-button w3-green w3-margin-left w3-margin-bottom" onclick="document.getElementById('new_resource').style.display = 'block'">
+ <i class="fa fa-plus"></i> <%=Prado::localize('Add new resource')%>
+ </button>
+ <div id="resource_save_ok_box" class="w3-modal" style="display: none">
+ <div class="w3-modal-content w3-card-4 w3-animate-zoom" style="width: 600px">
+ <header class="w3-container w3-green">
+ <span onclick="$('#resource_save_ok_box').hide();" class="w3-button w3-display-topright">×</span>
+ <h2><%[ Create new resource ]%></h2>
+ </header>
+ <div class="w3-panel w3-padding">
+ <p><%[ The resource has been created successfully. ]%></p>
+ </div>
+ <footer class="w3-container w3-center w3-border-top">
+ <button type="button" class="w3-button w3-section w3-green" onclick="$('#resource_save_ok_box').hide(); save_directive_post_action();"><i class="fa fa-check"></i> <%[ OK ]%></button>
+ </footer>
</div>
- <footer class="w3-container w3-center w3-border-top">
- <button type="button" class="w3-button w3-section w3-green" onclick="$('#resource_save_ok_box').hide(); save_directive_post_action();"><i class="fa fa-check"></i> <%[ OK ]%></button>
- </footer>
</div>
- </div>
- <div id="new_resource" class="w3-modal">
- <div class="w3-modal-content w3-animate-top w3-card-4 w3-padding">
- <header class="w3-container">
- <span onclick="document.getElementById('new_resource').style.display='none'" class="w3-button w3-display-topright">×</span>
- <h2><%[ Add new resource ]%></h2>
- </header>
- <div class="w3-row w3-margin">
- <div class="w3-third"><%[ Host: ]%></div>
- <div class="w3-third">
- <com:TActiveDropDownList
- ID="Host"
- CssClass="w3-select w3-border"
- OnSelectedIndexChanged="setComponents"
- >
- <prop:ClientSide.OnLoading>
- document.getElementById('component_loader').style.display = '';
- </prop:ClientSide.OnLoading>
- <prop:ClientSide.OnComplete>
- document.getElementById('component_loader').style.display = 'none';
- </prop:ClientSide.OnComplete>
- </com:TActiveDropDownList>
+ <div id="new_resource" class="w3-modal">
+ <div class="w3-modal-content w3-animate-top w3-card-4 w3-padding">
+ <header class="w3-container">
+ <span onclick="document.getElementById('new_resource').style.display='none'" class="w3-button w3-display-topright">×</span>
+ <h2><%[ Add new resource ]%></h2>
+ </header>
+ <div class="w3-row w3-margin">
+ <div class="w3-third"><%[ Host: ]%></div>
+ <div class="w3-third">
+ <com:TActiveDropDownList
+ ID="Host"
+ CssClass="w3-select w3-border"
+ OnSelectedIndexChanged="setComponents"
+ >
+ <prop:ClientSide.OnLoading>
+ document.getElementById('component_loader').style.display = '';
+ </prop:ClientSide.OnLoading>
+ <prop:ClientSide.OnComplete>
+ document.getElementById('component_loader').style.display = 'none';
+ </prop:ClientSide.OnComplete>
+ </com:TActiveDropDownList>
+ </div>
</div>
- </div>
- <div class="w3-row w3-margin">
- <div class="w3-third"><%[ Component: ]%></div>
- <div class="w3-third">
- <com:TActiveDropDownList
- ID="Component"
- CssClass="w3-select w3-border"
- OnSelectedIndexChanged="setResource"
- >
- <prop:ClientSide.OnLoading>
- document.getElementById('resource_loader').style.display = '';
- </prop:ClientSide.OnLoading>
- <prop:ClientSide.OnComplete>
- document.getElementById('resource_loader').style.display = 'none';
- </prop:ClientSide.OnComplete>
- </com:TActiveDropDownList>
+ <div class="w3-row w3-margin">
+ <div class="w3-third"><%[ Component: ]%></div>
+ <div class="w3-third">
+ <com:TActiveDropDownList
+ ID="Component"
+ CssClass="w3-select w3-border"
+ OnSelectedIndexChanged="setResource"
+ >
+ <prop:ClientSide.OnLoading>
+ document.getElementById('resource_loader').style.display = '';
+ </prop:ClientSide.OnLoading>
+ <prop:ClientSide.OnComplete>
+ document.getElementById('resource_loader').style.display = 'none';
+ </prop:ClientSide.OnComplete>
+ </com:TActiveDropDownList>
+ </div>
+ <i id="component_loader" class="fa fa-sync w3-spin w3-margin-left w3-margin-top" style="display: none"></i>
</div>
- <i id="component_loader" class="fa fa-sync w3-spin w3-margin-left w3-margin-top" style="display: none"></i>
- </div>
- <div class="w3-row w3-margin">
- <div class="w3-third"><%[ Resource to create: ]%></div>
- <div class="w3-third">
- <com:TActiveDropDownList
- ID="Resource"
- CssClass="w3-select w3-border"
- />
- <com:TRequiredFieldValidator
+ <div class="w3-row w3-margin">
+ <div class="w3-third"><%[ Resource to create: ]%></div>
+ <div class="w3-third">
+ <com:TActiveDropDownList
+ ID="Resource"
+ CssClass="w3-select w3-border"
+ />
+ <com:TRequiredFieldValidator
+ ValidationGroup="NewResource"
+ Display="Dynamic"
+ ControlToValidate="Resource"
+ FocusOnError="true"
+ Text="<%[ Field required. ]%>"
+ />
+ </div>
+ <i id="resource_loader" class="fa fa-sync w3-spin w3-margin-left w3-margin-top" style="display: none"></i>
+ </div>
+ <com:TActiveLabel ID="NewResourceLog" Display="None" CssClass="w3-panel w3-margin w3-text-red" />
+ <div class="w3-row w3-margin w3-center">
+ <com:TLinkButton
+ CssClass="w3-button w3-green w3-margin-left"
+ OnClick="createResource"
+ CausesValidation="true"
ValidationGroup="NewResource"
- Display="Dynamic"
- ControlToValidate="Resource"
- FocusOnError="true"
- Text="<%[ Field required. ]%>"
- />
+ >
+ <prop:Text>
+ <i class="fa fa-plus"></i> <%=Prado::localize('Create')%>
+ </prop:Text>
+ </com:TLinkButton>
</div>
- <i id="resource_loader" class="fa fa-sync w3-spin w3-margin-left w3-margin-top" style="display: none"></i>
- </div>
- <com:TActiveLabel ID="NewResourceLog" Display="None" CssClass="w3-panel w3-margin w3-text-red" />
- <div class="w3-row w3-margin w3-center">
- <com:TLinkButton
- CssClass="w3-button w3-green w3-margin-left"
- OnClick="createResource"
- CausesValidation="true"
- ValidationGroup="NewResource"
- >
- <prop:Text>
- <i class="fa fa-plus"></i> <%=Prado::localize('Create')%>
- </prop:Text>
- </com:TLinkButton>
</div>
</div>
- </div>
- <div id="resource_config" class="w3-container">
- <com:Application.Web.Portlets.BaculaConfigDirectives
- ID="NewResource"
- SaveDirectiveActionOk="save_directive_action_ok();"
- ShowRemoveButton="false"
- ShowCancelButton="false"
- />
- </div>
- <script>
- function save_directive_action_ok() {
- $('#resource_config').slideUp();
- $('#resource_save_ok_box').show();
- }
- function save_directive_post_action() {
- var origin_url = '<%=$this->getOriginUrl()%>';
- if (origin_url) {
- document.location.href = origin_url;
+ <div id="resource_config" class="w3-container">
+ <com:Application.Web.Portlets.BaculaConfigDirectives
+ ID="NewResource"
+ SaveDirectiveActionOk="save_directive_action_ok();"
+ ShowRemoveButton="false"
+ ShowCancelButton="false"
+ />
+ </div>
+ <script>
+ function save_directive_action_ok() {
+ $('#resource_config').slideUp();
+ $('#resource_save_ok_box').show();
+ }
+ function save_directive_post_action() {
+ var origin_url = '<%=$this->getOriginUrl()%>';
+ if (origin_url) {
+ document.location.href = origin_url;
+ }
}
- }
- oBaculaConfigSection.show_sections(true);
- </script>
+ oBaculaConfigSection.show_sections(true);
+ </script>
+ </div>
</com:TContent>
ItemRenderer="Application.Web.Portlets.DirectiveRenderer"
>
</com:TActiveRepeater>
- <div class="w3-row w3-center w3-border bottom_buttons page_main_el" style="margin-left: 300px">
+ <div class="w3-row w3-center w3-border bottom_buttons page_main_el" style="margin-left: 250px">
<com:Application.Web.Portlets.DirectiveSetting
ID="DirectiveSetting"
Resource="<%=$this->getResource()%>"
<!-- Sidebar/menu -->
-<nav class="w3-sidebar w3-white w3-animate-left w3-margin-bottom" style="z-index:3;width:300px;" id="sidebar"><br />
- <div class="w3-container w3-row">
- <div class="w3-col s4">
- <img src="<%=$this->getPage()->getTheme()->getBaseUrl()%>/avatar2.png" class="w3-circle w3-margin-right" style="width:46px" />
+<nav class="w3-sidebar w3-white w3-animate-left w3-margin-bottom" style="z-index:3;width:250px;" id="sidebar"><br />
+ <div class="w3-container w3-row" style="margin-bottom: 8px">
+ <div class="w3-col s3">
+ <img src="<%=$this->getPage()->getTheme()->getBaseUrl()%>/avatar2.png" class="w3-circle w3-margin-right" style="width: 33px" />
</div>
- <div class="w3-col s8 w3-bar">
+ <div class="w3-col s9 w3-bar">
<span><%[ Welcome ]%>, <strong><%=$this->User->getUsername()%></strong></span><br>
<script>var main_side_bar_reload_url = '<%=$this->reload_url%>';</script>
<com:TActiveLinkButton
<a href="<%=$this->Service->constructUrl('ApplicationSettings')%>" class="w3-bar-item w3-button<%=$this->getModule('users')->isPageAllowed($this->User, 'ApplicationSettings') ? '' : ' hide'%>" title="<%[ Application settings ]%>"><i class="fa fa-cog"></i></a>
</div>
</div>
- <hr />
<div class="w3-container w3-black">
<h5>Baculum Menu</h5>
</div>
+#page_main > header {
+ display: inline-block;
+ margin-top: 8px;
+}
+
#jobs_summary_graph {
height: 380px;
z-index: 0;
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
+table.dataTable {
+ font-size: 14px;
+ line-height: 1.2;
+}
+
th, table.dataTable thead td {
border-bottom: none !important;
}
background-image: linear-gradient(to bottom, white 0%, #e9e9e9 100%);
}
+table.dataTable tbody th, table.dataTable tbody td {
+ padding: 8px 7px;
+}
+
+table.dataTable tfoot th, table.dataTable tfoot td {
+ padding: 10px 0 6px 0 !important;
+}
+
/* Hide first default column in column visibility menu */
div.dt-button-collection button[data-cv-idx="0"] {
display: none;
cursor: pointer;
}
+img.btn_loader {
+ display: inline-block;
+ margin: 0 9px 0 10px;
+ width: 22px;
+ height: 22px;
+}
+
div.table_toolbar {
display: inline-block;
margin-left: 10px;
th.action_col, td.action_col {
width: 110px !important;
+ text-align: center;
}
td.action_col button {
padding: 5px 0;
min-height: 48px;
background-color: rgba(255, 255, 255, 0.5);
- width: calc(100% - 300px);
+ width: calc(100% - 250px);
}
.bottom_buttons a, .bottom_buttons button {