##// END OF EJS Templates
Semi working version of basic dual mode UX....
Brian E. Granger -
Show More
@@ -112,12 +112,17 b' var IPython = (function (IPython) {'
112 112 that.element.click(function (event) {
113 113 if (that.selected === false) {
114 114 $([IPython.events]).trigger('select.Cell', {'cell':that});
115 }
115 };
116 116 });
117 117 that.element.focusin(function (event) {
118 118 if (that.selected === false) {
119 119 $([IPython.events]).trigger('select.Cell', {'cell':that});
120 }
120 };
121 });
122 that.element.focusout(function (event) {
123 if (that.mode === 'edit') {
124 $([IPython.events]).trigger('command_mode.Cell', {'cell':that});
125 };
121 126 });
122 127 if (this.code_mirror) {
123 128 this.code_mirror.on("change", function(cm, change) {
@@ -148,14 +153,12 b' var IPython = (function (IPython) {'
148 153 * @return is the action being taken
149 154 */
150 155 Cell.prototype.select = function () {
151 console.log('Cell.select');
152 156 if (!this.selected) {
153 157 this.element.addClass('selected');
154 158 this.element.removeClass('unselected');
155 159 this.selected = true;
156 160 return true;
157 161 } else {
158 console.log('WARNING: select');
159 162 return false;
160 163 };
161 164 };
@@ -166,14 +169,12 b' var IPython = (function (IPython) {'
166 169 * @return is the action being taken
167 170 */
168 171 Cell.prototype.unselect = function () {
169 console.log('Cell.unselect');
170 172 if (this.selected) {
171 173 this.element.addClass('unselected');
172 174 this.element.removeClass('selected');
173 175 this.selected = false;
174 176 return true;
175 177 } else {
176 console.log('WARNING: unselect');
177 178 return false;
178 179 };
179 180 };
@@ -184,14 +185,12 b' var IPython = (function (IPython) {'
184 185 * @return is the action being taken
185 186 */
186 187 Cell.prototype.render = function () {
187 console.log('Cell.render');
188 188 if (!this.rendered) {
189 189 this.element.addClass('rendered');
190 190 this.element.removeClass('unrendered');
191 191 this.rendered = true;
192 192 return true;
193 193 } else {
194 console.log('WARNING: render');
195 194 return false;
196 195 };
197 196 };
@@ -202,14 +201,12 b' var IPython = (function (IPython) {'
202 201 * @return is the action being taken
203 202 */
204 203 Cell.prototype.unrender = function () {
205 console.log('Cell.unrender');
206 204 if (this.rendered) {
207 205 this.element.addClass('unrendered');
208 206 this.element.removeClass('rendered');
209 207 this.rendered = false;
210 208 return true;
211 209 } else {
212 console.log('WARNING: unrender');
213 210 return false;
214 211 };
215 212 };
@@ -220,14 +217,12 b' var IPython = (function (IPython) {'
220 217 * @return is the action being taken
221 218 */
222 219 Cell.prototype.command_mode = function () {
223 console.log('Cell.command_mode:', this.mode);
224 220 if (this.mode !== 'command') {
225 221 this.element.addClass('command_mode');
226 222 this.element.removeClass('edit_mode');
227 223 this.mode = 'command';
228 224 return true;
229 225 } else {
230 console.log('WARNING: command_mode');
231 226 return false;
232 227 };
233 228 };
@@ -238,14 +233,12 b' var IPython = (function (IPython) {'
238 233 * @return is the action being taken
239 234 */
240 235 Cell.prototype.edit_mode = function () {
241 console.log('Cell.edit_mode:', this.mode);
242 236 if (this.mode !== 'edit') {
243 237 this.element.addClass('edit_mode');
244 238 this.element.removeClass('command_mode');
245 239 this.mode = 'edit';
246 240 return true;
247 241 } else {
248 console.log('WARNING: edit_mode');
249 242 return false;
250 243 };
251 244 }
@@ -157,7 +157,6 b' var IPython = (function (IPython) {'
157 157 * @method handle_codemirror_keyevent
158 158 */
159 159 CodeCell.prototype.handle_codemirror_keyevent = function (editor, event) {
160
161 160 var that = this;
162 161
163 162 if (this.mode === 'command') {
@@ -174,7 +173,7 b' var IPython = (function (IPython) {'
174 173 this.auto_highlight();
175 174 }
176 175
177 if (event.keyCode === key.ENTER && (event.shiftKey || event.ctrlKey)) {
176 if (event.keyCode === key.ENTER && (event.shiftKey || event.ctrlKey || event.altKey)) {
178 177 // Always ignore shift-enter in CodeMirror as we handle it.
179 178 return true;
180 179
@@ -319,7 +318,6 b' var IPython = (function (IPython) {'
319 318
320 319 CodeCell.prototype.select = function () {
321 320 var cont = IPython.Cell.prototype.select.apply(this);
322 console.log('CodeCell.select', cont);
323 321 if (cont) {
324 322 this.code_mirror.refresh();
325 323 this.auto_highlight();
@@ -329,7 +327,6 b' var IPython = (function (IPython) {'
329 327
330 328 CodeCell.prototype.render = function () {
331 329 var cont = IPython.Cell.prototype.render.apply(this);
332 console.log('CodeCell.render');
333 330 // Always execute, even if we are already in the rendered state
334 331 return cont;
335 332 };
@@ -341,7 +338,6 b' var IPython = (function (IPython) {'
341 338
342 339 CodeCell.prototype.command_mode = function () {
343 340 var cont = IPython.Cell.prototype.command_mode.apply(this);
344 console.log('CodeCell.command_mode');
345 341 if (cont) {
346 342 this.focus_cell();
347 343 };
@@ -350,7 +346,6 b' var IPython = (function (IPython) {'
350 346
351 347 CodeCell.prototype.edit_mode = function () {
352 348 var cont = IPython.Cell.prototype.edit_mode.apply(this);
353 console.log('CodeCell.edit_mode');
354 349 if (cont) {
355 350 this.focus_editor();
356 351 };
@@ -40,7 +40,6 b' var IPython = (function (IPython) {'
40 40 this.undelete_below = false;
41 41 this.paste_enabled = false;
42 42 this.mode = 'command';
43 this.edit_index = null;
44 43 this.set_dirty(false);
45 44 this.metadata = {};
46 45 this._checkpoint_after_save = false;
@@ -139,7 +138,11 b' var IPython = (function (IPython) {'
139 138 that.select(index);
140 139 that.edit_mode();
141 140 });
142
141
142 $([IPython.events]).on('command_mode.Cell', function (event, data) {
143 that.command_mode();
144 });
145
143 146 $([IPython.events]).on('status_autorestarting.Kernel', function () {
144 147 IPython.dialog.modal({
145 148 title: "Kernel Restarting",
@@ -660,10 +663,10 b' var IPython = (function (IPython) {'
660 663 if (this.is_valid_cell_index(index)) {
661 664 var sindex = this.get_selected_index()
662 665 if (sindex !== null && index !== sindex) {
666 this.command_mode();
663 667 this.get_cell(sindex).unselect();
664 668 };
665 669 var cell = this.get_cell(index);
666 console.log('Notebook.select', index);
667 670 cell.select();
668 671 if (cell.cell_type === 'heading') {
669 672 $([IPython.events]).trigger('selected_cell_type_changed.Notebook',
@@ -705,41 +708,36 b' var IPython = (function (IPython) {'
705 708
706 709 // Edit/Command mode
707 710
708 /**
709 * Enter command mode for the currently selected cell
710 *
711 * @method command_mode
712 */
711 Notebook.prototype.get_edit_index = function () {
712 var result = null;
713 this.get_cell_elements().filter(function (index) {
714 if ($(this).data("cell").mode === 'edit') {
715 result = index;
716 };
717 });
718 return result;
719 };
720
713 721 Notebook.prototype.command_mode = function () {
714 console.log('Notebook.command_mode', this.mode, this.edit_index);
715 722 if (this.mode !== 'command') {
716 var cell = this.get_cell(this.edit_index);
723 var index = this.get_edit_index();
724 var cell = this.get_cell(index);
717 725 if (cell) {
718 726 cell.command_mode();
719 727 this.mode = 'command';
720 this.edit_index = null;
721 728 };
722 729 };
723 730 };
724 731
725 /**
726 * Enter edit mode for the currently selected cell
727 *
728 * @method editmode
729 */
730 732 Notebook.prototype.edit_mode = function () {
731 var index = this.get_selected_index();
732 console.log('Notebook.edit_mode', this.mode, index);
733 if (index !== this.edit_index) {
734 if (this.edit_index !== null) {
735 var old_cell = this.get_cell(this.edit_index)
736 old_cell.command_mode();
737 }
733 if (this.mode !== 'edit') {
734 // We are in command mode so get_edit_index() is null!!!
735 var index = this.get_selected_index();
736 if (index === null) {return;} // No cell is selected
738 737 var cell = this.get_cell(index);
739 738 if (cell) {
740 739 cell.edit_mode();
741 740 this.mode = 'edit';
742 this.edit_index = index;
743 741 };
744 742 };
745 743 };
@@ -763,6 +761,7 b' var IPython = (function (IPython) {'
763 761 tomove.detach();
764 762 pivot.before(tomove);
765 763 this.select(i-1);
764
766 765 };
767 766 this.set_dirty(true);
768 767 };
@@ -779,7 +778,7 b' var IPython = (function (IPython) {'
779 778 **/
780 779 Notebook.prototype.move_cell_down = function (index) {
781 780 var i = this.index_or_selected(index);
782 if ( this.is_valid_cell_index(i) && this.is_valid_cell_index(i+1)) {
781 if (this.is_valid_cell_index(i) && this.is_valid_cell_index(i+1)) {
783 782 var pivot = this.get_cell_element(i+1);
784 783 var tomove = this.get_cell_element(i);
785 784 if (pivot !== null && tomove !== null) {
@@ -1000,7 +999,7 b' var IPython = (function (IPython) {'
1000 999 if (text === source_cell.placeholder) {
1001 1000 text = '';
1002 1001 };
1003 // The edit must come before the set_text.
1002 // We must show the editor before setting its contents
1004 1003 target_cell.unrender();
1005 1004 target_cell.set_text(text);
1006 1005 // make this value the starting point, so that we can only undo
@@ -1032,13 +1031,15 b' var IPython = (function (IPython) {'
1032 1031 if (text === source_cell.placeholder) {
1033 1032 text = '';
1034 1033 };
1035 // The edit must come before the set_text.
1034 // We must show the editor before setting its contents
1036 1035 target_cell.unrender();
1037 1036 target_cell.set_text(text);
1038 1037 // make this value the starting point, so that we can only undo
1039 1038 // to this state, instead of a blank cell
1040 1039 target_cell.code_mirror.clearHistory();
1041 1040 source_element.remove();
1041 this.select(i);
1042 this.edit_mode();
1042 1043 this.set_dirty(true);
1043 1044 };
1044 1045 };
@@ -1066,7 +1067,7 b' var IPython = (function (IPython) {'
1066 1067 if (text === source_cell.placeholder) {
1067 1068 text = '';
1068 1069 };
1069 // The edit must come before the set_text.
1070 // We must show the editor before setting its contents
1070 1071 target_cell.set_level(level);
1071 1072 target_cell.unrender();
1072 1073 target_cell.set_text(text);
@@ -1074,6 +1075,8 b' var IPython = (function (IPython) {'
1074 1075 // to this state, instead of a blank cell
1075 1076 target_cell.code_mirror.clearHistory();
1076 1077 source_element.remove();
1078 this.select(i);
1079 this.edit_mode();
1077 1080 this.set_dirty(true);
1078 1081 };
1079 1082 $([IPython.events]).trigger('selected_cell_type_changed.Notebook',
@@ -1500,34 +1503,35 b' var IPython = (function (IPython) {'
1500 1503 Notebook.prototype.execute_selected_cell = function (mode) {
1501 1504 // mode = shift, ctrl, alt
1502 1505 mode = mode || 'shift'
1503 var that = this;
1504 var cell = that.get_selected_cell();
1505 var cell_index = that.find_cell_index(cell);
1506 var cell = this.get_selected_cell();
1507 var cell_index = this.find_cell_index(cell);
1506 1508
1507 1509 cell.execute();
1508 console.log('Notebook.execute_selected_cell', mode);
1510
1511 // If we are at the end always insert a new cell and return
1512 if (cell_index === (this.ncells()-1)) {
1513 this.insert_cell_below('code');
1514 this.select(cell_index+1);
1515 this.edit_mode();
1516 this.scroll_to_bottom();
1517 this.set_dirty(true);
1518 return;
1519 }
1520
1509 1521 if (mode === 'shift') {
1510 if (cell_index === (that.ncells()-1)) {
1511 that.insert_cell_below('code');
1512 that.select(cell_index+1);
1513 that.edit_mode();
1514 that.scroll_to_bottom();
1515 } else {
1516 that.command_mode();
1517 }
1522 this.command_mode();
1518 1523 } else if (mode === 'ctrl') {
1519 that.select(cell_index+1);
1520 that.get_cell(cell_index+1).focus_cell();
1524 this.select(cell_index+1);
1525 this.get_cell(cell_index+1).focus_cell();
1521 1526 } else if (mode === 'alt') {
1522 1527 // Only insert a new cell, if we ended up in an already populated cell
1523 if (/\S/.test(that.get_next_cell().get_text()) == true) {
1524 that.insert_cell_below('code');
1528 var next_text = this.get_cell(cell_index+1).get_text();
1529 if (/\S/.test(next_text) === true) {
1530 this.insert_cell_below('code');
1525 1531 }
1526 var next_index = cell_index+1;
1527 that.select(cell_index+1);
1528 that.edit_mode();
1532 this.select(cell_index+1);
1533 this.edit_mode();
1529 1534 }
1530
1531 1535 this.set_dirty(true);
1532 1536 };
1533 1537
@@ -1651,7 +1655,7 b' var IPython = (function (IPython) {'
1651 1655 cell_data.cell_type = 'raw';
1652 1656 }
1653 1657
1654 new_cell = this.insert_cell_at_bottom(cell_data.cell_type);
1658 new_cell = this.insert_cell_at_index(cell_data.cell_type, i);
1655 1659 new_cell.fromJSON(cell_data);
1656 1660 };
1657 1661 };
@@ -101,18 +101,11 b' var IPython = (function (IPython) {'
101 101 IPython.Cell.prototype.bind_events.apply(this);
102 102 var that = this;
103 103
104 // TODO: move this to the notebook event handler
105 this.element.keydown(function (event) {
106 if (event.which === 13 && !event.shiftKey) {
107 if (that.rendered) {
108 that.unrender();
109 return false;
110 };
111 };
112 });
113
114 104 this.element.dblclick(function () {
115 that.unrender();
105 if (that.selected === false) {
106 $([IPython.events]).trigger('select.Cell', {'cell':that});
107 };
108 $([IPython.events]).trigger('edit_mode.Cell', {cell: that});
116 109 });
117 110 };
118 111
@@ -129,13 +122,32 b' var IPython = (function (IPython) {'
129 122 * @return {Boolean} `true` if CodeMirror should ignore the event, `false` Otherwise
130 123 */
131 124 TextCell.prototype.handle_codemirror_keyevent = function (editor, event) {
125 var that = this;
132 126 if (this.mode === 'command') {
133 127 return false
134 128 } else if (this.mode === 'edit') {
135 if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) {
129 if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey || event.altKey)) {
136 130 // Always ignore shift-enter in CodeMirror as we handle it.
137 131 return true;
138 };
132 } else if (event.which === key.UPARROW && event.type === 'keydown') {
133 // If we are not at the top, let CM handle the up arrow and
134 // prevent the global keydown handler from handling it.
135 if (!that.at_top()) {
136 event.stop();
137 return false;
138 } else {
139 return true;
140 };
141 } else if (event.which === key.DOWNARROW && event.type === 'keydown') {
142 // If we are not at the bottom, let CM handle the down arrow and
143 // prevent the global keydown handler from handling it.
144 if (!that.at_bottom()) {
145 event.stop();
146 return false;
147 } else {
148 return true;
149 };
150 }
139 151 return false;
140 152 };
141 153 return false;
@@ -186,6 +198,7 b' var IPython = (function (IPython) {'
186 198 TextCell.prototype.edit_mode = function () {
187 199 var cont = IPython.Cell.prototype.edit_mode.apply(this);
188 200 if (cont) {
201 this.unrender();
189 202 this.focus_editor();
190 203 };
191 204 return cont;
@@ -234,6 +247,7 b' var IPython = (function (IPython) {'
234 247 if (this.rendered) {
235 248 return true;
236 249 } else {
250 var cursor = this.code_mirror.getCursor();
237 251 if (cursor.line === 0 && cursor.ch === 0) {
238 252 return true;
239 253 } else {
@@ -369,10 +383,12 b' var IPython = (function (IPython) {'
369 383 * @extends IPython.TextCell
370 384 */
371 385 var RawCell = function (options) {
372 options = this.mergeopt(RawCell, options);
373
374 this.cell_type = 'raw';
386
387 options = this.mergeopt(RawCell,options)
375 388 TextCell.apply(this, [options]);
389 this.cell_type = 'raw';
390 // RawCell should always hide its rendered div
391 this.element.find('div.text_cell_render').hide();
376 392 };
377 393
378 394 RawCell.options_default = {
General Comments 0
You need to be logged in to leave comments. Login now