This repository has been archived on 2023-08-16. You can view files and clone it, but cannot push or open issues or pull requests.
Omphaloskepsis/plugins/jetpack/modules/custom-css/custom-css/js/use-codemirror.js
2018-03-21 18:19:20 +00:00

47 lines
1.3 KiB
JavaScript

/* jshint onevar: false, smarttabs: true */
(function($){
var Jetpack_CSS = {
modes: {
'default': 'text/css',
'less': 'text/x-less',
'sass': 'text/x-scss'
},
init: function() {
this.$textarea = $( '#safecss' );
this.editor = window.CodeMirror.fromTextArea( this.$textarea.get(0),{
mode: this.getMode(),
lineNumbers: true,
tabSize: 2,
indentWithTabs: true,
lineWrapping: true
});
this.setEditorHeight();
},
addListeners: function() {
// nice sizing
$( window ).on( 'resize', _.bind( _.debounce( this.setEditorHeight, 100 ), this ) );
// keep textarea synced up
this.editor.on( 'change', _.bind( function( editor ){
this.$textarea.val( editor.getValue() );
}, this ) );
// change mode
$( '#preprocessor_choices' ).change( _.bind( function(){
this.editor.setOption( 'mode', this.getMode() );
}, this ) );
},
setEditorHeight: function() {
var height = $('html').height() - $( this.editor.getWrapperElement() ).offset().top;
this.editor.setSize( null, height );
},
getMode: function() {
var mode = $( '#preprocessor_choices' ).val();
if ( '' === mode || ! this.modes[ mode ] ) {
mode = 'default';
}
return this.modes[ mode ];
}
};
$( document ).ready( _.bind( Jetpack_CSS.init, Jetpack_CSS ) );
})(jQuery);