How do i activate the fullscreen addon in codemirror? - codemirror

Question

The documentation for CodeMirrors fullscreen mode seems to be a bit sparse. For example how do i tell it to listen for keys to activate fullscreen? or how can i use a button to toggle fullscreen?
For benefit to others bellow is the solution i found.

Answer 1

This will get the option value:
editor.getOption("fullScreen")
This will set the option fullscreen to true:
editor.setOption("fullScreen", true)
(editor is the instance you instantiated)
This is a working example of instantiating a new CodeMirror object written in coffeescript:
$(document).ready ->
editor = CodeMirror.fromTextArea(code_area,
name: 'htmlmixed'
htmlMode: true
theme: 'default'
lineNumbers: true
indentUnit: 4
keyMap: 'sublime'
extraKeys:
"Ctrl-Enter": (cm) ->
cm.setOption "fullScreen", !cm.getOption("fullScreen")
return
Esc: (cm) ->
cm.setOption "fullScreen", false
return
)
Based on this javascript:
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
lineNumbers: true,
theme: "night",
extraKeys: {
"F11": function(cm) {
cm.setOption("fullScreen", !cm.getOption("fullScreen"));
},
"Esc": function(cm) {
if (cm.getOption("fullScreen")) cm.setOption("fullScreen", false);
}
}
});
Taken from here: https://github.com/marijnh/CodeMirror/blob/master/demo/fullscreen.html