Added ProgressView

IPython/html/static/notebook/js/widgets/float_range.js

@@ -172,4 +172,50 b' require(["notebook/js/widget"], function(){'
     });
 
     IPython.notebook.widget_manager.register_widget_view('FloatTextView', FloatTextView);
+
+
+    var ProgressView = IPython.WidgetView.extend({
+        
+        // Called when view is rendered.
+        render : function(){
+            this.$el
+                .addClass('widget-hbox-single')
+                .html('');
+            this.$label = $('<div />')
+                .appendTo(this.$el)
+                .addClass('widget-hlabel')
+                .hide();
+            this.$progress = $('<div />')
+                .addClass('progress')
+                .addClass('widget-progress')
+                .appendTo(this.$el);
+            this.$bar = $('<div />')
+                .addClass('bar')
+                .css('width', '50%')
+                .appendTo(this.$progress);
+            this.update(); // Set defaults.
+        },
+        
+        // Handles: Backend -> Frontend Sync
+        //          Frontent -> Frontend Sync
+        update : function(){
+            var value = this.model.get('value');
+            var max = this.model.get('max');
+            var min = this.model.get('min');
+            var percent = 100.0 * (value - min) / (max - min);
+            this.$bar.css('width', percent + '%');
+            
+            var description = this.model.get('description');
+            if (description.length == 0) {
+                this.$label.hide();
+            } else {
+                this.$label.html(description);
+                this.$label.show();
+            }
+            return IPython.WidgetView.prototype.update.call(this);
+        },
+        
+    });
+
+    IPython.notebook.widget_manager.register_widget_view('ProgressView', ProgressView);
 });

IPython/html/static/notebook/less/widgetarea.less

@@ -83,6 +83,19 b''
             width: 150px;
         }
 
+        .widget-progress {
+            width: 363px;
+
+            /* Disable progress bar animation */
+            .bar {
+                -webkit-transition: none;
+                -moz-transition: none;
+                -ms-transition: none;
+                -o-transition: none;
+                transition: none;
+            }
+        }
+
         .widget-combo-btn {
             min-width: 138px; /* + 26px drop arrow btn = 164px */
             height: 30px;

IPython/html/static/style/ipython.min.css

@@ -170,6 +170,7 b' h1:hover .anchor-link,h2:hover .anchor-link,h3:hover .anchor-link,h4:hover .anch'
 .widget-area .widget-subarea .widget-vslider{border:1px solid #CCCCCC;background:#FFFFFF;height:100%;width:5px;margin-left:12px;padding-bottom:14px;border-radius:4px;}.widget-area .widget-subarea .widget-vslider .ui-slider{border:0px !important;background:none !important;margin-left:-4px;height:100%;margin-top:5px;}.widget-area .widget-subarea .widget-vslider .ui-slider .ui-slider-handle{width:28px !important;height:14px !important;margin-left:-15px;}
 .widget-area .widget-subarea .widget-text{width:350px;margin-bottom:0px;}
 .widget-area .widget-subarea .widget-numeric-text{width:150px;}
+.widget-area .widget-subarea .widget-progress{width:363px;}.widget-area .widget-subarea .widget-progress .bar{-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none;}
 .widget-area .widget-subarea .widget-combo-btn{min-width:138px;height:30px;}
 .widget-area .widget-subarea .widget-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
 .widget-area .widget-subarea .widget-hbox{display:-webkit-box;-webkit-box-orient:horizontal;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:horizontal;-moz-box-align:stretch;display:box;box-orient:horizontal;box-align:stretch;-webkit-box-pack:start;-moz-box-pack:start;box-pack:start;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin:5px;}

IPython/html/static/style/style.min.css

@@ -1589,6 +1589,7 b' span#checkpoint_status,span#autosave_status{font-size:small;}'
 .widget-area .widget-subarea .widget-vslider{border:1px solid #CCCCCC;background:#FFFFFF;height:100%;width:5px;margin-left:12px;padding-bottom:14px;border-radius:4px;}.widget-area .widget-subarea .widget-vslider .ui-slider{border:0px !important;background:none !important;margin-left:-4px;height:100%;margin-top:5px;}.widget-area .widget-subarea .widget-vslider .ui-slider .ui-slider-handle{width:28px !important;height:14px !important;margin-left:-15px;}
 .widget-area .widget-subarea .widget-text{width:350px;margin-bottom:0px;}
 .widget-area .widget-subarea .widget-numeric-text{width:150px;}
+.widget-area .widget-subarea .widget-progress{width:363px;}.widget-area .widget-subarea .widget-progress .bar{-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none;}
 .widget-area .widget-subarea .widget-combo-btn{min-width:138px;height:30px;}
 .widget-area .widget-subarea .widget-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
 .widget-area .widget-subarea .widget-hbox{display:-webkit-box;-webkit-box-orient:horizontal;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:horizontal;-moz-box-align:stretch;display:box;box-orient:horizontal;box-align:stretch;-webkit-box-pack:start;-moz-box-pack:start;box-pack:start;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin:5px;}