Skip to content

Commit

Permalink
Merge pull request #7341 from jdfreder/remove-popup
Browse files Browse the repository at this point in the history
Remove the popup widget
  • Loading branch information
jdfreder committed Jan 2, 2015
2 parents 080fb68 + be29aa8 commit 4694a66
Show file tree
Hide file tree
Showing 9 changed files with 57 additions and 501 deletions.
20 changes: 0 additions & 20 deletions IPython/html/static/style/ipython.min.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

20 changes: 0 additions & 20 deletions IPython/html/static/style/style.min.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions IPython/html/static/widgets/js/widget.js
Original file line number Diff line number Diff line change
Expand Up @@ -542,11 +542,11 @@ define(["widgets/js/manager",
this.update_attr('border-style', this.model.get('border_style'));
this.update_attr('font-style', this.model.get('font_style'));
this.update_attr('font-weight', this.model.get('font_weight'));
this.update_attr('font-size', this.model.get('font_size'));
this.update_attr('font-size', this._default_px(this.model.get('font_size')));
this.update_attr('font-family', this.model.get('font_family'));
this.update_attr('padding', this.model.get('padding'));
this.update_attr('margin', this.model.get('margin'));
this.update_attr('border-radius', this.model.get('border_radius'));
this.update_attr('margin', this._default_px(this.model.get('margin')));
this.update_attr('border-radius', this._default_px(this.model.get('border_radius')));

this.update_css(this.model, this.model.get("_css"));
}, this);
Expand Down
216 changes: 0 additions & 216 deletions IPython/html/static/widgets/js/widget_box.js
Original file line number Diff line number Diff line change
Expand Up @@ -146,224 +146,8 @@ define([
},
});

var PopupView = BoxView.extend({

render: function(){
/**
* Called when view is rendered.
*/
var that = this;

this.$el.on("remove", function(){
that.$backdrop.remove();
});
this.$backdrop = $('<div />')
.appendTo($('#notebook-container'))
.addClass('modal-dialog')
.css('position', 'absolute')
.css('left', '0px')
.css('top', '0px');
this.$window = $('<div />')
.appendTo(this.$backdrop)
.addClass('modal-content widget-modal')
.mousedown(function(){
that.bring_to_front();
});

// Set the elements array since the this.$window element is not child
// of this.$el and the parent widget manager or other widgets may
// need to know about all of the top-level widgets. The IPython
// widget manager uses this to register the elements with the
// keyboard manager.
this.additional_elements = [this.$window];

this.$title_bar = $('<div />')
.addClass('popover-title')
.appendTo(this.$window)
.mousedown(function(){
that.bring_to_front();
});
this.$close = $('<button />')
.addClass('close fa fa-remove')
.css('margin-left', '5px')
.appendTo(this.$title_bar)
.click(function(){
that.hide();
event.stopPropagation();
});
this.$minimize = $('<button />')
.addClass('close fa fa-arrow-down')
.appendTo(this.$title_bar)
.click(function(){
that.popped_out = !that.popped_out;
if (!that.popped_out) {
that.$minimize
.removeClass('fa-arrow-down')
.addClass('fa-arrow-up');

that.$window
.draggable('destroy')
.resizable('destroy')
.removeClass('widget-modal modal-content')
.addClass('docked-widget-modal')
.detach()
.insertBefore(that.$show_button);
that.$show_button.hide();
that.$close.hide();
} else {
that.$minimize
.addClass('fa-arrow-down')
.removeClass('fa-arrow-up');

that.$window
.removeClass('docked-widget-modal')
.addClass('widget-modal modal-content')
.detach()
.appendTo(that.$backdrop)
.draggable({handle: '.popover-title', snap: '#notebook, .modal', snapMode: 'both'})
.resizable()
.children('.ui-resizable-handle').show();
that.show();
that.$show_button.show();
that.$close.show();
}
event.stopPropagation();
});
this.$title = $('<div />')
.addClass('widget-modal-title')
.html("&nbsp;")
.appendTo(this.$title_bar);
this.$box = $('<div />')
.addClass('modal-body')
.addClass('widget-modal-body')
.addClass('widget-box')
.addClass('vbox')
.appendTo(this.$window);

this.$show_button = $('<button />')
.html("&nbsp;")
.addClass('btn btn-info widget-modal-show')
.appendTo(this.$el)
.click(function(){
that.show();
});

this.$window.draggable({handle: '.popover-title', snap: '#notebook, .modal', snapMode: 'both'});
this.$window.resizable();
this.$window.on('resize', function(){
that.$box.outerHeight(that.$window.innerHeight() - that.$title_bar.outerHeight());
});

this._shown_once = false;
this.popped_out = true;

this.children_views.update(this.model.get('children'))
},

hide: function() {
/**
* Called when the modal hide button is clicked.
*/
this.$window.hide();
this.$show_button.removeClass('btn-info');
},

show: function() {
/**
* Called when the modal show button is clicked.
*/
this.$show_button.addClass('btn-info');
this.$window.show();
if (this.popped_out) {
this.$window.css("positon", "absolute");
this.$window.css("top", "0px");
this.$window.css("left", Math.max(0, (($('body').outerWidth() - this.$window.outerWidth()) / 2) +
$(window).scrollLeft()) + "px");
this.bring_to_front();
}
},

bring_to_front: function() {
/**
* Make the modal top-most, z-ordered about the other modals.
*/
var $widget_modals = $(".widget-modal");
var max_zindex = 0;
$widget_modals.each(function (index, el){
var zindex = parseInt($(el).css('z-index'));
if (!isNaN(zindex)) {
max_zindex = Math.max(max_zindex, zindex);
}
});

// Start z-index of widget modals at 2000
max_zindex = Math.max(max_zindex, 2000);

$widget_modals.each(function (index, el){
$el = $(el);
if (max_zindex == parseInt($el.css('z-index'))) {
$el.css('z-index', max_zindex - 1);
}
});
this.$window.css('z-index', max_zindex);
},

update: function(){
/**
* Update the contents of this view
*
* Called when the model is changed. The model may have been
* changed by another view or by a state update from the back-end.
*/
var description = this.model.get('description');
if (description.trim().length === 0) {
this.$title.html("&nbsp;"); // Preserve title height
} else {
this.typeset(this.$title, description);
}

var button_text = this.model.get('button_text');
if (button_text.trim().length === 0) {
this.$show_button.html("&nbsp;"); // Preserve button height
} else {
this.$show_button.text(button_text);
}

if (!this._shown_once) {
this._shown_once = true;
this.show();
}

return PopupView.__super__.update.apply(this);
},

_get_selector_element: function(selector) {
/**
* Get an element view a 'special' jquery selector. (see widget.js)
*
* Since the modal actually isn't within the $el in the DOM, we need to extend
* the selector logic to allow the user to set css on the modal if need be.
* The convention used is:
* "modal" - select the modal div
* "modal [selector]" - select element(s) within the modal div.
* "[selector]" - select elements within $el
* "" - select the $el
*/
if (selector.substring(0, 5) == 'modal') {
if (selector == 'modal') {
return this.$window;
} else {
return this.$window.find(selector.substring(6));
}
} else {
return PopupView.__super__._get_selector_element.apply(this, [selector]);
}
},
});

return {
'BoxView': BoxView,
'PopupView': PopupView,
'FlexBoxView': FlexBoxView,
};
});
23 changes: 0 additions & 23 deletions IPython/html/static/widgets/less/widgets.less
Original file line number Diff line number Diff line change
Expand Up @@ -249,20 +249,6 @@

}

.widget-modal {
/* Box - ModalView */
overflow : hidden;
position : absolute !important;
top : 0px;
left : 0px;
margin-left : 0px !important;
}

.widget-modal-body {
/* Box - ModalView Body */
max-height: none !important;
}

.widget-box {
/* Box */
.border-box-sizing();
Expand All @@ -280,12 +266,3 @@
margin-top: 0px;
}
}

.docked-widget-modal {
/* Horizontal Label */
overflow: hidden;
position: relative !important;
top: 0px !important;
left: 0px !important;
margin-left: 0px !important;
}
4 changes: 2 additions & 2 deletions IPython/html/widgets/__init__.py
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

from .widget_bool import Checkbox, ToggleButton
from .widget_button import Button
from .widget_box import Box, Popup, FlexBox, HBox, VBox
from .widget_box import Box, FlexBox, HBox, VBox
from .widget_float import FloatText, BoundedFloatText, FloatSlider, FloatProgress, FloatRangeSlider
from .widget_image import Image
from .widget_int import IntText, BoundedIntText, IntSlider, IntProgress, IntRangeSlider
Expand All @@ -16,7 +16,7 @@
# Deprecated classes
from .widget_bool import CheckboxWidget, ToggleButtonWidget
from .widget_button import ButtonWidget
from .widget_box import ContainerWidget, PopupWidget
from .widget_box import ContainerWidget
from .widget_float import FloatTextWidget, BoundedFloatTextWidget, FloatSliderWidget, FloatProgressWidget
from .widget_image import ImageWidget
from .widget_int import IntTextWidget, BoundedIntTextWidget, IntSliderWidget, IntProgressWidget
Expand Down
11 changes: 0 additions & 11 deletions IPython/html/widgets/widget_box.py
Original file line number Diff line number Diff line change
Expand Up @@ -45,15 +45,6 @@ def _fire_children_displayed(self):
child._handle_displayed()


@register('IPython.Popup')
class Popup(Box):
"""Displays multiple widgets in an in page popup div."""
_view_name = Unicode('PopupView', sync=True)

description = Unicode(sync=True)
button_text = Unicode(sync=True)


@register('IPython.FlexBox')
class FlexBox(Box):
"""Displays multiple widgets using the flexible box model."""
Expand Down Expand Up @@ -87,5 +78,3 @@ def HBox(*pargs, **kwargs):

# Remove in IPython 4.0
ContainerWidget = DeprecatedClass(Box, 'ContainerWidget')
PopupWidget = DeprecatedClass(Popup, 'PopupWidget')

0 comments on commit 4694a66

Please sign in to comment.