##// END OF EJS Templates
Added ability to set container page titles for widget multicontainer
Jonathan Frederic -
Show More
@@ -1,60 +1,56 b''
1 require(["notebook/js/widget"], function(){
1 require(["notebook/js/widget"], function(){
2 var MulticontainerModel = IPython.WidgetModel.extend({});
2 var MulticontainerModel = IPython.WidgetModel.extend({});
3 IPython.notebook.widget_manager.register_widget_model('MulticontainerWidgetModel', MulticontainerModel);
3 IPython.notebook.widget_manager.register_widget_model('MulticontainerWidgetModel', MulticontainerModel);
4
4
5 var AccordionView = IPython.WidgetView.extend({
5 var AccordionView = IPython.WidgetView.extend({
6
6
7 render: function(){
7 render: function(){
8 this.$el = $('<div />', {id: IPython.utils.uuid()})
8 this.$el = $('<div />', {id: IPython.utils.uuid()})
9 .addClass('accordion');
9 .addClass('accordion');
10 this.containers = [];
10 this.containers = [];
11 },
11 },
12
12
13 update: function() {
13 update: function() {
14 // TODO: Set tab titles
14 // Set tab titles
15 var titles = this.model.get('_titles');
16 for (var page_index in titles) {
17 var accordian_toggle = this.containers[page_index]
18 .find('.accordion-heading')
19 .find('.accordion-toggle');
20 accordian_toggle.html(titles[page_index]);
21 }
15
22
16 // // Apply flexible box model properties by adding and removing
17 // // corrosponding CSS classes.
18 // // Defined in IPython/html/static/base/less/flexbox.less
19 // var flex_properties = ['vbox', 'hbox', 'center', 'end', 'center'];
20 // for (var index in flex_properties) {
21 // if (this.model.get('_' + flex_properties[index])) {
22 // this.$el.addClass(flex_properties[index]);
23 // } else {
24 // this.$el.removeClass(flex_properties[index]);
25 // }
26 // }
27 return IPython.WidgetView.prototype.update.call(this);
23 return IPython.WidgetView.prototype.update.call(this);
28 },
24 },
29
25
30 display_child: function(view) {
26 display_child: function(view) {
31
27
32 var index = this.containers.length;
28 var index = this.containers.length;
33 var uuid = IPython.utils.uuid();
29 var uuid = IPython.utils.uuid();
34 var accordion_group = $('<div />')
30 var accordion_group = $('<div />')
35 .addClass('accordion-group')
31 .addClass('accordion-group')
36 .appendTo(this.$el);
32 .appendTo(this.$el);
37 var accordion_heading = $('<div />')
33 var accordion_heading = $('<div />')
38 .addClass('accordion-heading')
34 .addClass('accordion-heading')
39 .appendTo(accordion_group);
35 .appendTo(accordion_group);
40 var accordion_toggle = $('<a />')
36 var accordion_toggle = $('<a />')
41 .addClass('accordion-toggle')
37 .addClass('accordion-toggle')
42 .attr('data-toggle', 'collapse')
38 .attr('data-toggle', 'collapse')
43 .attr('data-parent', '#' + this.$el.attr('id'))
39 .attr('data-parent', '#' + this.$el.attr('id'))
44 .attr('href', '#' + uuid)
40 .attr('href', '#' + uuid)
45 .html('Page ' + index)
41 .html('Page ' + index)
46 .appendTo(accordion_heading);
42 .appendTo(accordion_heading);
47 var accordion_body = $('<div />', {id: uuid})
43 var accordion_body = $('<div />', {id: uuid})
48 .addClass('accordion-body collapse in')
44 .addClass('accordion-body collapse')
49 .appendTo(accordion_group);
45 .appendTo(accordion_group);
50 var accordion_inner = $('<div />')
46 var accordion_inner = $('<div />')
51 .addClass('accordion-inner')
47 .addClass('accordion-inner')
52 .appendTo(accordion_body);
48 .appendTo(accordion_body);
53 this.containers.push(accordion_group);
49 this.containers.push(accordion_group);
54
50
55 accordion_inner.append(view.$el);
51 accordion_inner.append(view.$el);
56 },
52 },
57 });
53 });
58
54
59 IPython.notebook.widget_manager.register_widget_view('AccordionView', AccordionView);
55 IPython.notebook.widget_manager.register_widget_view('AccordionView', AccordionView);
60 }); No newline at end of file
56 });
@@ -1,25 +1,55 b''
1 """MulticontainerWidget class.
1 """MulticontainerWidget class.
2
2
3 Represents a multipage container that can be used to group other widgets into
3 Represents a multipage container that can be used to group other widgets into
4 pages.
4 pages.
5 """
5 """
6 #-----------------------------------------------------------------------------
6 #-----------------------------------------------------------------------------
7 # Copyright (c) 2013, the IPython Development Team.
7 # Copyright (c) 2013, the IPython Development Team.
8 #
8 #
9 # Distributed under the terms of the Modified BSD License.
9 # Distributed under the terms of the Modified BSD License.
10 #
10 #
11 # The full license is in the file COPYING.txt, distributed with this software.
11 # The full license is in the file COPYING.txt, distributed with this software.
12 #-----------------------------------------------------------------------------
12 #-----------------------------------------------------------------------------
13
13
14 #-----------------------------------------------------------------------------
14 #-----------------------------------------------------------------------------
15 # Imports
15 # Imports
16 #-----------------------------------------------------------------------------
16 #-----------------------------------------------------------------------------
17 from widget import Widget
17 from widget import Widget
18 from IPython.utils.traitlets import Unicode
18 from IPython.utils.traitlets import Unicode, Dict
19
19
20 #-----------------------------------------------------------------------------
20 #-----------------------------------------------------------------------------
21 # Classes
21 # Classes
22 #-----------------------------------------------------------------------------
22 #-----------------------------------------------------------------------------
23 class MulticontainerWidget(Widget):
23 class MulticontainerWidget(Widget):
24 target_name = Unicode('MulticontainerWidgetModel')
24 target_name = Unicode('MulticontainerWidgetModel')
25 default_view_name = Unicode('AccordionView')
25 default_view_name = Unicode('AccordionView')
26
27 # Keys
28 _keys = ['_titles']
29 _titles = Dict(help="Titles of the pages")
30
31 # Public methods
32 def set_title(self, index, title):
33 """Sets the title of a container pages
34
35 Parameters
36 ----------
37 index : int
38 Index of the container page
39 title : unicode
40 New title"""
41 self._titles[index] = title
42 self.send_state('_titles')
43
44
45 def get_title(self, index):
46 """Gets the title of a container pages
47
48 Parameters
49 ----------
50 index : int
51 Index of the container page"""
52 if index in self._titles:
53 return self._titles[index]
54 else:
55 return None
General Comments 0
You need to be logged in to leave comments. Login now