use require to load CodeMirror modes

CM's loadmode addon only works if you *don't* load CodeMirror itself with require.

IPython/html/static/base/js/utils.js

@@ -539,6 +539,19 @@ define([
         msg += ajax_error_msg(jqXHR);
         console.log(msg);
     };
+    
+    var requireCodeMirrorMode = function (mode, callback, errback) {
+        // load a mode with requirejs
+        if (typeof mode != "string") mode = mode.name;
+        if (CodeMirror.modes.hasOwnProperty(mode)) {
+            callback(CodeMirror.modes.mode);
+            return;
+        }
+        require([
+                ['codemirror/mode', mode, mode].join('/'),
+            ], callback, errback
+        );
+    };
 
     var utils = {
         regex_split : regex_split,
@@ -564,6 +577,7 @@ define([
         mergeopt: mergeopt,
         ajax_error_msg : ajax_error_msg,
         log_ajax_error : log_ajax_error,
+        requireCodeMirrorMode : requireCodeMirrorMode,
     };
 
     // Backwards compatability.

IPython/html/static/notebook/js/cell.js

@@ -18,29 +18,10 @@ define([
     'codemirror/addon/edit/matchbrackets',
     'codemirror/addon/edit/closebrackets',
     'codemirror/addon/comment/comment'
-], function(IPython, $, utils, CodeMirror, cm_match, cm_closeb, cm_comment) {
+], function(IPython, $, utils, CodeMirror, cm_match, cm_closeb, cm_comment, cm_load) {
     // TODO: remove IPython dependency here 
     "use strict";
 
-    // monkey patch CM to be able to syntax highlight cell magics
-    // bug reported upstream,
-    // see https://github.com/codemirror/CodeMirror/issues/670
-    if(CodeMirror.getMode(1,'text/plain').indent === undefined ){
-        CodeMirror.modes.null = function() {
-            return {token: function(stream) {stream.skipToEnd();},indent : function(){return 0;}};
-        };
-    }
-
-    CodeMirror.patchedGetMode = function(config, mode){
-            var cmmode = CodeMirror.getMode(config, mode);
-            if(cmmode.indent === null) {
-                console.log('patch mode "' , mode, '" on the fly');
-                cmmode.indent = function(){return 0;};
-            }
-            return cmmode;
-        };
-    // end monkey patching CodeMirror
-
     var Cell = function (options) {
         /* Constructor
          *
@@ -533,6 +514,7 @@ define([
      **/
     Cell.prototype._auto_highlight = function (modes) {
         //Here we handle manually selected modes
+        var that = this;
         var mode;
         if( this.user_highlight !== undefined &&  this.user_highlight != 'auto' )
         {
@@ -554,33 +536,34 @@ define([
                         return;
                     }
                     if (mode.search('magic_') !== 0) {
-                        this.code_mirror.setOption('mode', mode);
-                        CodeMirror.autoLoadMode(this.code_mirror, mode);
+                        utils.requireCodeMirrorMode(mode, function () {
+                            that.code_mirror.setOption('mode', mode);
+                        });
                         return;
                     }
                     var open = modes[mode].open || "%%";
                     var close = modes[mode].close || "%%end";
                     var mmode = mode;
                     mode = mmode.substr(6);
-                    if(current_mode == mode){
+                    if(current_mode == mmode){
                         return;
                     }
-                    CodeMirror.autoLoadMode(this.code_mirror, mode);
-                    // create on the fly a mode that swhitch between
-                    // plain/text and smth else otherwise `%%` is
-                    // source of some highlight issues.
-                    // we use patchedGetMode to circumvent a bug in CM
-                    CodeMirror.defineMode(mmode , function(config) {
-                        return CodeMirror.multiplexingMode(
-                        CodeMirror.patchedGetMode(config, 'text/plain'),
-                            // always set someting on close
-                            {open: open, close: close,
-                             mode: CodeMirror.patchedGetMode(config, mode),
-                             delimStyle: "delimit"
-                            }
-                        );
+                    utils.requireCodeMirrorMode(mode, function () {
+                        // create on the fly a mode that switch between
+                        // plain/text and something else, otherwise `%%` is
+                        // source of some highlight issues.
+                        CodeMirror.defineMode(mmode, function(config) {
+                            return CodeMirror.multiplexingMode(
+                                CodeMirror.getMode(config, 'text/plain'),
+                                // always set someting on close
+                                {open: open, close: close,
+                                 mode: CodeMirror.getMode(config, mode),
+                                 delimStyle: "delimit"
+                                }
+                            );
+                        });
+                        that.code_mirror.setOption('mode', mmode);
                     });
-                    this.code_mirror.setOption('mode', mmode);
                     return;
                 }
             }

IPython/html/static/notebook/js/main.js

@@ -20,7 +20,6 @@ require([
     'notebook/js/config',
     'notebook/js/kernelselector',
     'codemirror/lib/codemirror',
-    'codemirror/addon/mode/loadmode',
     // only loaded, not used, please keep sure this is loaded last
     'custom/custom'
 ], function(
@@ -42,7 +41,6 @@ require([
     config,
     kernelselector,
     CodeMirror,
-    cm_loadmode,
     // please keep sure that even if not used, this is loaded last
     custom
     ) {

IPython/html/static/notebook/js/notebook.js

@@ -1532,7 +1532,7 @@ define([
         modename = newmode.name || newmode
 
         that = this;
-        CodeMirror.requireMode(modename, function(){
+        utils.requireCodeMirrorMode(modename, function () {
             $.map(that.get_cells(), function(cell, i) {
                 if (cell.cell_type === 'code'){
                     cell.code_mirror.setOption('mode', newmode);

IPython/html/templates/notebook.html

@@ -312,17 +312,6 @@ class="notebook_app"
 {{super()}}
 
 
-<script type="text/javascript">
-	require(['codemirror/lib/codemirror',
- 		], function(CodeMirror){
-    		CodeMirror.modeURL = "{{ static_url("components/codemirror/mode/%N/%N.js", include_version=False) }}";
-//		require([
-//			 'notebook/js/codemirror-ipython',
-//			 'notebook/js/codemirror-ipythongfm'
-//], function(){})
-	});
-</script>
-
 <script src="{{ static_url("notebook/js/main.js") }}" charset="utf-8"></script>
 
 {% endblock %}