Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
ACE editor for editing your gists
// ==UserScript==
// @id acegist
// @name ACEgist
// @author Antoine BERNIER (abernier)
// @version 0.1.2
// @description ACE editor in your gists
// @match https://gist.github.com/gists/*/edit
// ==/UserScript==
(function (d, cb) {
//
// A script loader over here!
//
if (typeof $LAB === 'undefined') {
var s;
s = d.createElement('script');
s.src = 'https://raw.github.com/getify/LABjs/master/LAB.min.js';
s.onload = function () {
var s;
s = d.createElement('script');
s.textContent = '(' + cb.toString() + ')();';
d.body.appendChild(s);
}
d.body.appendChild(s);
} else {
cb()
}
}(document, function () {
//
// Syntax highlighting modes
//
var modes = {
'js': {
url: 'https://raw.github.com/ajaxorg/ace/v0.2.0/build/src/mode-javascript.js',
module: 'ace/mode/javascript'
},
'coffee': {
url: 'https://raw.github.com/ajaxorg/ace/v0.2.0/build/src/mode-coffee.js',
module: 'ace/mode/coffee'
},
'html': {
url: 'https://raw.github.com/ajaxorg/ace/v0.2.0/build/src/mode-html.js',
module: 'ace/mode/html'
},
'css': {
url: 'https://raw.github.com/ajaxorg/ace/v0.2.0/build/src/mode-css.js',
module: 'ace/mode/css'
}
};
$LAB
.script('https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js')
.script('https://raw.github.com/ajaxorg/ace/v0.2.0/build/src/ace.js')
.script('https://raw.github.com/ajaxorg/ace/v0.2.0/build/src/theme-twilight.js')
.wait(function () {
$('textarea').each(function (i, el) {
var $el,
$container,
editor,
ext;
$el = $(el);
//
// Principle: inject an DOM element (sized and positioned) and hide the textarea
//
$container = $('<div/>').css({
position: 'relative',
width: $el.width(),
height: $el.height()
}).insertAfter(el);
$el.hide();
//
// ACE magic
//
editor = ace.edit($container[0]);
editor.setTheme('ace/theme/twilight');
// Keep hidden textarea in sync
editor.getSession().setValue($el.val());
editor.getSession().on('change', function () {
$el.val(editor.getSession().getValue());
});
// Syntax highlighting depending on filename.<ext>
ext = $el.closest('.file').find('.name input').val().split('.').slice(-1)[0];
modes[ext] && $LAB.script(modes[ext].url).wait(function () {
var Mode = require(modes[ext].module).Mode;
editor.getSession().setMode(new Mode());
});
});
})
;
}));
@abernier
Copy link
Author

abernier commented Jul 18, 2012

@rpavlik: ok should be fixed now, thx!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment