Show More
@@ -1,6 +1,6 b'' | |||
|
1 | 1 | /*Css for the metadata edit area*/ |
|
2 | 2 | |
|
3 | .metaedit{ | |
|
3 | .celltoolbar{ | |
|
4 | 4 | border:thin solid #DDD; |
|
5 | 5 | margin-left:81px; |
|
6 | 6 | border-bottom:none; |
@@ -10,24 +10,24 b'' | |||
|
10 | 10 | display:none; |
|
11 | 11 | } |
|
12 | 12 | |
|
13 |
.code_cell . |
|
|
13 | .code_cell .celltoolbar{ | |
|
14 | 14 | margin-left:81px; |
|
15 | 15 | } |
|
16 | 16 | |
|
17 |
.text_cell . |
|
|
17 | .text_cell .celltoolbar{ | |
|
18 | 18 | margin-left:0px; |
|
19 | 19 | } |
|
20 | 20 | |
|
21 |
. |
|
|
21 | .celltoolbar-on div.input_area , .celltoolbar-on div.text_cell_input{ | |
|
22 | 22 | border-top-right-radius: 0px; |
|
23 | 23 | border-top-left-radius: 0px; |
|
24 | 24 | } |
|
25 | 25 | |
|
26 | .editmetaon .metaedit { | |
|
26 | .celltoolbar-on .celltoolbar { | |
|
27 | 27 | display:block; |
|
28 | 28 | } |
|
29 | 29 | |
|
30 |
. |
|
|
30 | .celltoolbar ui-button { | |
|
31 | 31 | border :none; |
|
32 | 32 | } |
|
33 | 33 | |
@@ -41,13 +41,13 b'' | |||
|
41 | 41 | border : none; |
|
42 | 42 | } |
|
43 | 43 | |
|
44 |
. |
|
|
44 | .celltoolbar select { | |
|
45 | 45 | margin:10px; |
|
46 | 46 | margin-top:0px; |
|
47 | 47 | margin-bottom:0px; |
|
48 | 48 | } |
|
49 | 49 | |
|
50 |
. |
|
|
50 | .celltoolbar input[type=checkbox] { | |
|
51 | 51 | margin-bottom:1px; |
|
52 | 52 | |
|
53 | 53 | } |
@@ -163,7 +163,7 b' var IPython = (function (IPython) {' | |||
|
163 | 163 | if (data.metadata !== undefined) { |
|
164 | 164 | this.metadata = data.metadata; |
|
165 | 165 | } |
|
166 |
this. |
|
|
166 | this.celltoolbar.rebuild(); | |
|
167 | 167 | }; |
|
168 | 168 | |
|
169 | 169 |
@@ -58,10 +58,10 b' var IPython = (function (IPython) {' | |||
|
58 | 58 | |
|
59 | 59 | /** @method create_element */ |
|
60 | 60 | CodeCell.prototype.create_element = function () { |
|
61 |
this. |
|
|
61 | this.celltoolbar = new IPython.CellToolbar(this); | |
|
62 | 62 | |
|
63 | 63 | var cell = $('<div></div>').addClass('cell border-box-sizing code_cell vbox'); |
|
64 |
cell.append(this. |
|
|
64 | cell.append(this.celltoolbar.element); | |
|
65 | 65 | cell.attr('tabindex','2'); |
|
66 | 66 | var input = $('<div></div>').addClass('input hbox'); |
|
67 | 67 | input.append($('<div/>').addClass('prompt input_prompt')); |
@@ -34,10 +34,10 b'' | |||
|
34 | 34 | * to load custom script into the notebook. |
|
35 | 35 | * |
|
36 | 36 | * // to load the metadata ui extension example. |
|
37 |
* $.getScript('/static/js/examples/ |
|
|
37 | * $.getScript('/static/js/examples/celltoolbar.example.js'); | |
|
38 | 38 | * // or |
|
39 | 39 | * // to load the metadata ui extension to control slideshow mode / reveal js for nbconvert |
|
40 |
* $.getScript('/static/js/examples/ |
|
|
40 | * $.getScript('/static/js/examples/celltoolbar.slideshow.js'); | |
|
41 | 41 | * |
|
42 | 42 | * |
|
43 | 43 | * @module IPython |
@@ -6,23 +6,23 b'' | |||
|
6 | 6 | //---------------------------------------------------------------------------- |
|
7 | 7 | |
|
8 | 8 | //============================================================================ |
|
9 |
// |
|
|
9 | // CellToolbar Example | |
|
10 | 10 | //============================================================================ |
|
11 | 11 | |
|
12 | 12 | /** |
|
13 |
* Example Use for the |
|
|
13 | * Example Use for the CellToolbar library | |
|
14 | 14 | * add the following to your custom.js to load |
|
15 |
* |
|
|
15 | * Celltoolbar UI for slideshow | |
|
16 | 16 | * |
|
17 | 17 | * ``` |
|
18 |
* $.getScript('/static/js/examples/ |
|
|
18 | * $.getScript('/static/js/examples/celltoolbar.example.js'); | |
|
19 | 19 | * ``` |
|
20 | 20 | */ |
|
21 | 21 | // IIFE without asignement, we don't modifiy the IPython namespace |
|
22 | 22 | (function (IPython) { |
|
23 | 23 | "use strict"; |
|
24 | 24 | |
|
25 |
var |
|
|
25 | var CellToolbar = IPython.CellToolbar; | |
|
26 | 26 | |
|
27 | 27 | |
|
28 | 28 | var raw_edit = function(cell){ |
@@ -89,7 +89,7 b'' | |||
|
89 | 89 | button_container.append(button); |
|
90 | 90 | } |
|
91 | 91 | |
|
92 |
|
|
|
92 | CellToolbar.register_callback('example.rawedit',add_raw_edit_button); | |
|
93 | 93 | var example_preset = [] |
|
94 | 94 | example_preset.push('example.rawedit'); |
|
95 | 95 | |
@@ -121,7 +121,7 b'' | |||
|
121 | 121 | button_container.append(button); |
|
122 | 122 | } |
|
123 | 123 | |
|
124 |
|
|
|
124 | CellToolbar.register_callback('example.lock',simple_button); | |
|
125 | 125 | example_preset.push('example.lock'); |
|
126 | 126 | |
|
127 | 127 | var toggle_test = function(div, cell) { |
@@ -135,7 +135,7 b'' | |||
|
135 | 135 | button_container.append(button); |
|
136 | 136 | } |
|
137 | 137 | |
|
138 |
|
|
|
138 | CellToolbar.register_callback('example.toggle',toggle_test); | |
|
139 | 139 | example_preset.push('example.toggle'); |
|
140 | 140 | |
|
141 | 141 | var checkbox_test = function(div, cell) { |
@@ -154,7 +154,7 b'' | |||
|
154 | 154 | |
|
155 | 155 | } |
|
156 | 156 | |
|
157 |
|
|
|
157 | CellToolbar.register_callback('example.checkbox',checkbox_test); | |
|
158 | 158 | example_preset.push('example.checkbox'); |
|
159 | 159 | |
|
160 | 160 | var select_test = function(div, cell) { |
@@ -174,11 +174,11 b'' | |||
|
174 | 174 | |
|
175 | 175 | } |
|
176 | 176 | |
|
177 |
|
|
|
177 | CellToolbar.register_callback('example.select',select_test); | |
|
178 | 178 | example_preset.push('example.select'); |
|
179 | 179 | |
|
180 |
|
|
|
181 |
|
|
|
180 | CellToolbar.register_preset('example',example_preset); | |
|
181 | CellToolbar.set_preset('example'); | |
|
182 | 182 | console.log('Example extension for metadata editting loaded.'); |
|
183 | 183 | |
|
184 | 184 | }(IPython)); |
@@ -18,8 +18,8 b' var IPython = (function (IPython) {' | |||
|
18 | 18 | this.add_drop_down_list(); |
|
19 | 19 | this.bind_events(); |
|
20 | 20 | $(this.selector) |
|
21 |
.append($('<label/>').text(' |
|
|
22 |
.append(IPython. |
|
|
21 | .append($('<label/>').text('CellToolbar')) | |
|
22 | .append(IPython.CellToolbar.dropdown_preset_element) | |
|
23 | 23 | }; |
|
24 | 24 | |
|
25 | 25 | MainToolBar.prototype = new IPython.ToolBar(); |
@@ -6,7 +6,7 b'' | |||
|
6 | 6 | //---------------------------------------------------------------------------- |
|
7 | 7 | |
|
8 | 8 | //============================================================================ |
|
9 | // MetaUI | |
|
9 | // CellToolbar | |
|
10 | 10 | //============================================================================ |
|
11 | 11 | |
|
12 | 12 | |
@@ -14,7 +14,7 b'' | |||
|
14 | 14 | * A Module to control the per-cell toolbar. |
|
15 | 15 | * @module IPython |
|
16 | 16 | * @namespace IPython |
|
17 |
* @submodule |
|
|
17 | * @submodule CellToolbar | |
|
18 | 18 | */ |
|
19 | 19 | var IPython = (function (IPython) { |
|
20 | 20 | "use strict"; |
@@ -22,30 +22,30 b' var IPython = (function (IPython) {' | |||
|
22 | 22 | |
|
23 | 23 | /** |
|
24 | 24 | * @constructor |
|
25 |
* @class |
|
|
25 | * @class CellToolbar | |
|
26 | 26 | * @param {The cell to attach the metadata UI to} cell |
|
27 | 27 | */ |
|
28 |
var |
|
|
29 |
|
|
|
30 |
this. |
|
|
28 | var CellToolbar = function (cell) { | |
|
29 | CellToolbar._instances.push(this); | |
|
30 | this.inner_element = $('<div/>'); | |
|
31 | 31 | this.cell = cell; |
|
32 |
this. |
|
|
33 |
.append(this. |
|
|
32 | this.element = $('<div/>').addClass('celltoolbar') | |
|
33 | .append(this.inner_element) | |
|
34 | 34 | this.rebuild(); |
|
35 | 35 | return this; |
|
36 | 36 | }; |
|
37 | 37 | |
|
38 |
|
|
|
39 |
.attr('id',' |
|
|
38 | CellToolbar.dropdown_preset_element = $('<select/>') | |
|
39 | .attr('id','celltoolbar_selector') | |
|
40 | 40 | .append($('<option/>').attr('value','').text('-')) |
|
41 | 41 | |
|
42 |
|
|
|
43 |
var val = |
|
|
42 | CellToolbar.dropdown_preset_element.change(function(){ | |
|
43 | var val = CellToolbar.dropdown_preset_element.val() | |
|
44 | 44 | if(val ==''){ |
|
45 |
$('body').removeClass(' |
|
|
45 | $('body').removeClass('celltoolbar-on') | |
|
46 | 46 | } else { |
|
47 |
$('body').addClass(' |
|
|
48 |
|
|
|
47 | $('body').addClass('celltoolbar-on') | |
|
48 | CellToolbar.set_preset(val) | |
|
49 | 49 | } |
|
50 | 50 | }) |
|
51 | 51 | |
@@ -57,7 +57,7 b' var IPython = (function (IPython) {' | |||
|
57 | 57 | * @property _callback_dict |
|
58 | 58 | * @private |
|
59 | 59 | */ |
|
60 |
|
|
|
60 | CellToolbar._callback_dict = {}; | |
|
61 | 61 | |
|
62 | 62 | /** |
|
63 | 63 | * Class variable that should contain the reverse order list of the button |
@@ -65,25 +65,25 b' var IPython = (function (IPython) {' | |||
|
65 | 65 | * @property _button_list |
|
66 | 66 | * @private |
|
67 | 67 | */ |
|
68 |
|
|
|
68 | CellToolbar._button_list = []; | |
|
69 | 69 | |
|
70 | 70 | /** |
|
71 | 71 | * keep a list of all instances to |
|
72 | 72 | * be able to llop over them... |
|
73 | 73 | * but how to 'destroy' them ? |
|
74 | 74 | * have to think about it... |
|
75 |
* or loop over the cells, and find their |
|
|
75 | * or loop over the cells, and find their CellToolbar instances. | |
|
76 | 76 | * @private |
|
77 | 77 | * @property _instances |
|
78 | 78 | */ |
|
79 |
|
|
|
79 | CellToolbar._instances =[] | |
|
80 | 80 | |
|
81 | 81 | /** |
|
82 | 82 | * keep a list of all the availlabel presets for the toolbar |
|
83 | 83 | * @private |
|
84 | 84 | * @property _presets |
|
85 | 85 | */ |
|
86 |
|
|
|
86 | CellToolbar._presets ={} | |
|
87 | 87 | |
|
88 | 88 | // this is by design not a prototype. |
|
89 | 89 | /** |
@@ -125,11 +125,11 b' var IPython = (function (IPython) {' | |||
|
125 | 125 | * |
|
126 | 126 | * // now we register the callback under the name `foo` to give the |
|
127 | 127 | * // user the ability to use it later |
|
128 |
* |
|
|
128 | * CellToolbar.register_callback('foo',toggle); | |
|
129 | 129 | */ |
|
130 |
|
|
|
130 | CellToolbar.register_callback = function(name, callback){ | |
|
131 | 131 | // what do we do if name already exist ? |
|
132 |
|
|
|
132 | CellToolbar._callback_dict[name] = callback; | |
|
133 | 133 | }; |
|
134 | 134 | |
|
135 | 135 | /** |
@@ -144,18 +144,18 b' var IPython = (function (IPython) {' | |||
|
144 | 144 | * @private |
|
145 | 145 | * @example |
|
146 | 146 | * |
|
147 |
* |
|
|
148 |
* |
|
|
149 |
* |
|
|
150 |
* |
|
|
151 |
* |
|
|
147 | * CellToolbar.register_callback('foo.c1',function(div,cell){...}); | |
|
148 | * CellToolbar.register_callback('foo.c2',function(div,cell){...}); | |
|
149 | * CellToolbar.register_callback('foo.c3',function(div,cell){...}); | |
|
150 | * CellToolbar.register_callback('foo.c4',function(div,cell){...}); | |
|
151 | * CellToolbar.register_callback('foo.c5',function(div,cell){...}); | |
|
152 | 152 | * |
|
153 |
* |
|
|
154 |
* |
|
|
153 | * CellToolbar.register_preset('foo.foo_preset1',['foo.c1','foo.c2','foo.c5']) | |
|
154 | * CellToolbar.register_preset('foo.foo_preset2',['foo.c4','foo.c5']) | |
|
155 | 155 | */ |
|
156 |
|
|
|
157 |
|
|
|
158 |
|
|
|
156 | CellToolbar.register_preset = function(name, preset_list){ | |
|
157 | CellToolbar._presets[name] = preset_list | |
|
158 | CellToolbar.dropdown_preset_element.append( | |
|
159 | 159 | $('<option/>').attr('value',name).text(name) |
|
160 | 160 | ) |
|
161 | 161 | } |
@@ -168,14 +168,14 b' var IPython = (function (IPython) {' | |||
|
168 | 168 | * @private |
|
169 | 169 | * @example |
|
170 | 170 | * |
|
171 |
* |
|
|
171 | * CellToolbar.set_preset('foo.foo_preset1'); | |
|
172 | 172 | */ |
|
173 |
|
|
|
174 |
var preset = |
|
|
173 | CellToolbar.set_preset= function(preset_name){ | |
|
174 | var preset = CellToolbar._presets[preset_name]; | |
|
175 | 175 | |
|
176 | 176 | if(preset != undefined){ |
|
177 |
|
|
|
178 |
|
|
|
177 | CellToolbar._button_list = preset; | |
|
178 | CellToolbar.rebuild_all(); | |
|
179 | 179 | } |
|
180 | 180 | } |
|
181 | 181 | |
@@ -188,9 +188,9 b' var IPython = (function (IPython) {' | |||
|
188 | 188 | * @static |
|
189 | 189 | * |
|
190 | 190 | */ |
|
191 |
|
|
|
192 |
for(var i in |
|
|
193 |
|
|
|
191 | CellToolbar.rebuild_all = function(){ | |
|
192 | for(var i in CellToolbar._instances){ | |
|
193 | CellToolbar._instances[i].rebuild(); | |
|
194 | 194 | } |
|
195 | 195 | } |
|
196 | 196 | |
@@ -198,22 +198,22 b' var IPython = (function (IPython) {' | |||
|
198 | 198 | * Rebuild all the button on the toolbar to update it's state. |
|
199 | 199 | * @method rebuild |
|
200 | 200 | */ |
|
201 |
|
|
|
201 | CellToolbar.prototype.rebuild = function(){ | |
|
202 | 202 | // strip evrything from the div |
|
203 | 203 | // which is probabli metainner. |
|
204 |
// or this. |
|
|
205 |
this. |
|
|
204 | // or this.element. | |
|
205 | this.inner_element.empty(); | |
|
206 | 206 | //this.add_raw_edit_button() |
|
207 | 207 | |
|
208 | 208 | |
|
209 |
var cdict = |
|
|
210 |
var preset = |
|
|
209 | var cdict = CellToolbar._callback_dict; | |
|
210 | var preset = CellToolbar._button_list; | |
|
211 | 211 | // Yes we iterate on the class varaible, not the instance one. |
|
212 |
for ( var index in |
|
|
212 | for ( var index in CellToolbar._button_list){ | |
|
213 | 213 | var local_div = $('<div/>').addClass('button_container'); |
|
214 | 214 | // Note, |
|
215 | 215 | // do this the other way, wrap in try/catch and don't append if any errors. |
|
216 |
this. |
|
|
216 | this.inner_element.append(local_div) | |
|
217 | 217 | cdict[preset[index]](local_div,this.cell) |
|
218 | 218 | } |
|
219 | 219 | |
@@ -284,7 +284,7 b' var IPython = (function (IPython) {' | |||
|
284 | 284 | button_container.append(button); |
|
285 | 285 | } |
|
286 | 286 | |
|
287 |
|
|
|
287 | CellToolbar.register_callback('example.rawedit',add_raw_edit_button); | |
|
288 | 288 | var example_preset = [] |
|
289 | 289 | example_preset.push('example.rawedit'); |
|
290 | 290 | |
@@ -315,11 +315,11 b' var IPython = (function (IPython) {' | |||
|
315 | 315 | button_container.append(button); |
|
316 | 316 | } |
|
317 | 317 | |
|
318 |
|
|
|
318 | CellToolbar.register_callback('default.help',add_simple_dialog_button) | |
|
319 | 319 | var default_preset = [] |
|
320 | 320 | default_preset.push('default.help') |
|
321 |
|
|
|
322 |
|
|
|
321 | CellToolbar.register_preset('default',default_preset) | |
|
322 | CellToolbar.set_preset('default') | |
|
323 | 323 | |
|
324 | 324 | var simple_button = function(div, cell) { |
|
325 | 325 | var button_container = $(div); |
@@ -348,7 +348,7 b' var IPython = (function (IPython) {' | |||
|
348 | 348 | button_container.append(button); |
|
349 | 349 | } |
|
350 | 350 | |
|
351 |
|
|
|
351 | CellToolbar.register_callback('example.lock',simple_button); | |
|
352 | 352 | example_preset.push('example.lock'); |
|
353 | 353 | |
|
354 | 354 | var toggle_test = function(div, cell) { |
@@ -362,12 +362,12 b' var IPython = (function (IPython) {' | |||
|
362 | 362 | button_container.append(button); |
|
363 | 363 | } |
|
364 | 364 | |
|
365 |
|
|
|
365 | CellToolbar.register_callback('example.toggle',toggle_test); | |
|
366 | 366 | example_preset.push('example.toggle'); |
|
367 | 367 | |
|
368 | 368 | /** |
|
369 | 369 | */ |
|
370 |
|
|
|
370 | CellToolbar.utils = {}; | |
|
371 | 371 | |
|
372 | 372 | /** |
|
373 | 373 | * A utility function to generate bindings between a checkbox and metadata |
@@ -386,7 +386,7 b' var IPython = (function (IPython) {' | |||
|
386 | 386 | * |
|
387 | 387 | * An exmple that bind the subkey `slideshow.isSectionStart` to a checkbox with a `New Slide` label |
|
388 | 388 | * |
|
389 |
* var newSlide = |
|
|
389 | * var newSlide = CellToolbar.utils.checkbox_ui_generator('New Slide', | |
|
390 | 390 | * // setter |
|
391 | 391 | * function(metadata,value){ |
|
392 | 392 | * // we check that the slideshow namespace exist and create it if needed |
@@ -403,10 +403,10 b' var IPython = (function (IPython) {' | |||
|
403 | 403 | * } |
|
404 | 404 | * ); |
|
405 | 405 | * |
|
406 |
* |
|
|
406 | * CellToolbar.register_callback('newSlide', newSlide); | |
|
407 | 407 | * |
|
408 | 408 | */ |
|
409 |
|
|
|
409 | CellToolbar.utils.checkbox_ui_generator = function(name,setter,getter){ | |
|
410 | 410 | return function(div, cell) { |
|
411 | 411 | var button_container = $(div) |
|
412 | 412 | |
@@ -443,7 +443,7 b' var IPython = (function (IPython) {' | |||
|
443 | 443 | * |
|
444 | 444 | * @example |
|
445 | 445 | * |
|
446 |
* var select_type = |
|
|
446 | * var select_type = CellToolbar.utils.select_ui_generator([ | |
|
447 | 447 | * ["-" ,undefined ], |
|
448 | 448 | * ["Header Slide" ,"header_slide" ], |
|
449 | 449 | * ["Slide" ,"slide" ], |
@@ -464,10 +464,10 b' var IPython = (function (IPython) {' | |||
|
464 | 464 | * // return the value |
|
465 | 465 | * return (ns == undefined)? undefined: ns.slide_type |
|
466 | 466 | * } |
|
467 |
* |
|
|
467 | * CellToolbar.register_callback('slideshow.select',select_type); | |
|
468 | 468 | * |
|
469 | 469 | */ |
|
470 |
|
|
|
470 | CellToolbar.utils.select_ui_generator = function(list_list,setter, getter, label){ | |
|
471 | 471 | label= label? label: ""; |
|
472 | 472 | return function(div, cell) { |
|
473 | 473 | var button_container = $(div) |
@@ -490,7 +490,7 b' var IPython = (function (IPython) {' | |||
|
490 | 490 | }; |
|
491 | 491 | |
|
492 | 492 | |
|
493 |
IPython. |
|
|
493 | IPython.CellToolbar = CellToolbar; | |
|
494 | 494 | |
|
495 | 495 | return IPython; |
|
496 | 496 | }(IPython)); |
@@ -43,8 +43,8 b' var IPython = (function (IPython) {' | |||
|
43 | 43 | */ |
|
44 | 44 | TextCell.prototype.create_element = function () { |
|
45 | 45 | var cell = $("<div>").addClass('cell text_cell border-box-sizing vbox'); |
|
46 |
this. |
|
|
47 |
cell.append(this. |
|
|
46 | this.celltoolbar = new IPython.CellToolbar(this); | |
|
47 | cell.append(this.celltoolbar.element); | |
|
48 | 48 | cell.attr('tabindex','2'); |
|
49 | 49 | var input_area = $('<div/>').addClass('text_cell_input border-box-sizing'); |
|
50 | 50 | this.code_mirror = CodeMirror(input_area.get(0), { |
General Comments 0
You need to be logged in to leave comments.
Login now