Moved stdout to an iframe and improved auto-sizing.

This commit is contained in:
chouseknecht 2014-05-14 11:46:07 -04:00
parent 38503b9087
commit cc350dde68
4 changed files with 80 additions and 35 deletions

View File

@ -11,7 +11,7 @@ function JobStdoutController ($scope, $compile, $routeParams, ClearScope, GetBas
ClearScope();
var job_id = $routeParams.id;
var available_height, job_id = $routeParams.id;
Wait('start');
@ -23,14 +23,32 @@ function JobStdoutController ($scope, $compile, $routeParams, ClearScope, GetBas
Rest.get()
.success(function(data) {
Wait('stop');
$('#stdout-container').empty().html(data);
$('#stdout-iframe').attr('srcdoc', data);
})
.error(function(data, status) {
ProcessErrors($scope, data, status, null, { hdr: 'Error!',
msg: 'Failed to retrieve stdout for job: ' + job_id + '. GET returned: ' + status });
});
});
function resizeToFit() {
available_height = $(window).height() - $('.main-menu').outerHeight() - $('#main_tabs').outerHeight() -
$('#breadcrumb-container').outerHeight() - $('.site-footer').outerHeight();
if ($(window).width() < 768) {
available_height += 55;
}
else {
available_height += 5;
}
$('#stdout-iframe').height(available_height);
//$('#stdout-container').mCustomScrollbar("update");
}
resizeToFit();
$(window).resize(_.debounce(function() {
resizeToFit();
}, 500));
Rest.setUrl(GetBasePath('jobs') + job_id + '/');
Rest.get()
.success(function(data) {
@ -43,4 +61,4 @@ function JobStdoutController ($scope, $compile, $routeParams, ClearScope, GetBas
});
}
JobStdoutController.$inject = [ '$scope', '$compile', '$routeParams', 'ClearScope', 'GetBasePath', 'Wait', 'Rest', 'ProcessErrors'];
JobStdoutController.$inject = [ '$scope', '$compile', '$routeParams', 'ClearScope', 'GetBasePath', 'Wait', 'Rest', 'ProcessErrors' ];

View File

@ -389,11 +389,13 @@ dd {
content: "";
display: block;
}
.site-footer, #wrap:after {
height: @footer-height;
#wrap:after {
height: @push-height;
}
.site-footer {
height: @footer-height;
margin-top: @footer-margin;
}
@ -515,28 +517,27 @@ dd {
}
}
.modal-header.login-header {
text-align: center;
background-color: @black;
border-left: 1px solid #686868;
border-right: 1px solid #686868;
border-top: 1px solid #686868;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
text-align: center;
background-color: @black;
border-left: 1px solid #686868;
border-right: 1px solid #686868;
border-top: 1px solid #686868;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.login-header img {
width: 327px;
width: 327px;
}
.form-title {
display: inline-block;
width: 100%;
vertical-align: middle;
font-weight: bold;
padding-left: 15px;
margin-bottom: 10px;
display: inline-block;
width: 100%;
vertical-align: middle;
font-weight: bold;
padding-left: 15px;
margin-bottom: 10px;
}
.form-group {
@ -1634,6 +1635,13 @@ tr td button i {
}
}
/* job stdout */
#stdout-iframe {
width: 100%;
border-radius: 4px;
margin: 0;
}
/* ng-cloak directive */
@ -1704,6 +1712,35 @@ tr td button i {
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
/* The sticky footer: http://css-tricks.com/snippets/css/sticky-footer, with less variables */
@footer-height: 140px;
@footer-margin: 15px;
@push-height: (@footer-height + @footer-margin);
#wrap {
min-height: 100%;
height: 100%;
height: auto !important;
margin-bottom: -(@push-height);
}
#wrap:after {
content: "";
display: block;
}
#wrap:after {
height: @push-height;
}
.site-footer {
height: @footer-height;
margin-top: @footer-margin;
padding-top: 5px;
padding-bottom: 5px;
.logo {
text-align: center;
padding-top: 10px;
margin-bottom: 10px;
}
}
/* Job events */
@ -1752,15 +1789,4 @@ tr td button i {
display: none;
}
.site-footer {
height: 145px;
padding-top: 5px;
padding-bottom: 5px;
.logo {
text-align: center;
padding-top: 10px;
margin-bottom: 10px;
}
}
}

View File

@ -16,7 +16,7 @@
<div class="row">
<div class="col-md-12">
<div id="stdout-container"></div>
<iframe id="stdout-iframe"></iframe>
</div>
</div>
</div>

View File

@ -73,13 +73,14 @@
<script src="{{ STATIC_URL }}js/controllers/Home.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Teams.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Credentials.js"></script>
<script src="{{ STATIC_URL }}js/controllers/JobStdout.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Sockets.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Projects.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Jobs.js"></script>
<script src="{{ STATIC_URL }}js/controllers/JobDetail.js"></script>
<script src="{{ STATIC_URL }}js/controllers/JobEvents.js"></script>
<script src="{{ STATIC_URL }}js/controllers/JobHosts.js"></script>
<script src="{{ STATIC_URL }}js/controllers/JobTemplates.js"></script>
<script src="{{ STATIC_URL }}js/controllers/JobStdout.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Permissions.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Schedules.js"></script>
<script src="{{ STATIC_URL }}js/controllers/Sockets.js"></script>
@ -355,7 +356,7 @@
</div><!-- modal -->
<!-- Help dialog -->
<div id="help-modal"></div>
<div id="help-modal" style="display: none;"></div>
</div><!-- container -->