Browse files

Updates progress bar style

  • Loading branch information...
1 parent 069b02c commit daffab443a1bc6a5365fa8cd298ae1ad1eed9983 @sagemintblue sagemintblue committed Apr 3, 2013
View
4 common/src/main/resources/web/css/ambrose.css
@@ -6,7 +6,9 @@ body { position: relative; padding-top: 40px; }
#ambrose-view-graph {}
/* Progress Bar view */
-.ambrose-view-progress-bar { margin: 20px 0px; }
+.ambrose-view-progress-bar { position: relative; }
+.ambrose-view-progress-bar .number { position: absolute; top: 20px; right: 10px; font-size: 50px; opacity: 0.1; }
+.ambrose-view-progress-bar .progress { margin: 20px 0px; }
/* Table view */
.ambrose-view-table td.job-mappers,
View
14 common/src/main/resources/web/js/ambrose/view/progress-bar.js
@@ -34,14 +34,14 @@ define(['jquery', '../core', './core'], function($, Ambrose, View) {
* @param container the DOM element in which to render the view.
*/
init: function(workflow, container) {
- this.workflow = workflow;
- this.container = $(container).empty();
- this.bar = $('<div class="bar">')
- .appendTo($('<div class="progress ambrose-view-progress-bar">').appendTo(this.container))
- .css('width', '0');
- var self = this;
+ container = $(container).empty().addClass('ambrose-view-progress-bar');
+ var number = $('<div class="number">').appendTo(container).text('0%');
+ var progress = $('<div class="progress">').appendTo(container);
+ var bar = $('<div class="bar">').appendTo(progress).css('width', '0');
workflow.on('workflowProgress', function(event, data) {
- self.bar.css('width', data + '%');
+ var text = data + '%';
+ bar.css('width', text);
+ number.text(text);
});
},
};

0 comments on commit daffab4

Please sign in to comment.