Merge pull request #86 from afshin/editor-settable-model

Allow CellEditorWidget model to be changed after instantiation

src/notebook/cells/editor.ts

@@ -124,19 +124,14 @@ class CellEditorWidget extends CodeMirrorWidget {
   constructor(model: ICellModel) {
     super();
     this.addClass(CELL_EDITOR_CLASS);
-    this._model = model;
-    let editor = this.editor;
-    let doc = editor.getDoc();
-    if (model.source) {
-      doc.setValue(model.source);
-    }
-    CodeMirror.on(doc, 'change', (instance, change) => {
+    this.model = model;
+
+    CodeMirror.on(this.editor.getDoc(), 'change', (instance, change) => {
       this.onDocChange(instance, change);
     });
-    CodeMirror.on(editor, 'keydown', (instance, evt) => {
+    CodeMirror.on(this.editor, 'keydown', (instance, evt) => {
       this.onEditorKeydown(instance, evt);
     });
-    model.stateChanged.connect(this.onModelChanged, this);
   }
 
   /**
@@ -161,14 +156,33 @@ class CellEditorWidget extends CodeMirrorWidget {
   }
 
   /**
-   * Get the cell model used by the editor.
-   *
-   * #### Notes
-   * This is a read-only property.
+   * The cell model used by the editor.
    */
   get model(): ICellModel {
     return this._model;
   }
+  set model(model: ICellModel) {
+    if (!model && !this._model || model === this._model) {
+      return;
+    }
+
+    let doc = this.editor.getDoc();
+
+    // If the model is being replaced, disconnect the old signal handler.
+    if (this._model) {
+      this._model.stateChanged.disconnect(this.onModelChanged, this);
+    }
+
+    if (!model) {
+      doc.setValue('');
+      this._model = null;
+      return;
+    }
+
+    this._model = model;
+    doc.setValue(this._model.source || '');
+    this._model.stateChanged.connect(this.onModelChanged, this);
+  }
 
   /**
    * Dispose of the resources held by the editor.

src/notebook/cells/widget.ts

@@ -137,6 +137,12 @@ class BaseCellWidget extends Widget {
     super();
     this.addClass(CELL_CLASS);
     this.layout = new PanelLayout();
+
+    let constructor = this.constructor as typeof BaseCellWidget;
+    this._editor = constructor.createCellEditor(model);
+    this._input = constructor.createInputArea(this._editor);
+    (this.layout as PanelLayout).addChild(this._input);
+
     this.model = model;
   }
 
@@ -151,28 +157,24 @@ class BaseCellWidget extends Widget {
       return;
     }
 
+    // If the model is being replaced, disconnect the old signal handler.
+    if (this._model) {
+      this._model.metadataChanged.disconnect(this.onMetadataChanged, this);
+    }
+
     if (!model) {
-      if (this._model) {
-        this._input.dispose();
-        this._editor.dispose();
-        this._model.dispose();
-        this._model = null;
-      }
+      this._editor.model = null;
+      this._model = null;
       return;
     }
 
     this._model = model;
-
-    let ctor = this.constructor as typeof BaseCellWidget;
-    this._editor = ctor.createCellEditor(model);
-    this._input = ctor.createInputArea(this._editor);
+    this._editor.model = this._model;
 
     // Set the editor mode to be the default MIME type.
     loadModeByMIME(this._editor.editor, this._mimetype);
-    (this.layout as PanelLayout).addChild(this._input);
-
-    model.metadataChanged.connect(this.onMetadataChanged, this);
-    this._trustedCursor = model.getMetadata('trusted');
+    this._model.metadataChanged.connect(this.onMetadataChanged, this);
+    this._trustedCursor = this._model.getMetadata('trusted');
     this._trusted = !!this._trustedCursor.getValue();
   }