Comments (2)
Source files
compiled version
https://github.com/KodiCMS/kodicms-laravel/tree/dev/public/cms/libs/elfinder
Javascript source
https://github.com/KodiCMS/kodicms-laravel/tree/dev/resources/assets/js/elfinder
from elfinder-nightly-src.
@butschster sorry toooo late.
elFinder 2.1 became easy integration with ACE editor in config commandsOptions.edit.editors
commandsOptions : {
edit : {
editors : [
{
// Do not set `mimes` for support everything kind of text file
load : function(textarea) {
if (typeof ace !== 'object') {
$('head').append($('<script>').attr('src', 'include/js/ace-min-noconflict/ace.js'));
$('head').append($('<script>').attr('src', 'include/js/ace-min-noconflict/ext-modelist.js'));
$('head').append($('<script>').attr('src', 'include/js/ace-min-noconflict/ext-settings_menu.js'));
$('head').append($('<script>').attr('src', 'include/js/ace-min-noconflict/ext-language_tools.js'));
}
var self = this, editor, editorBase, mode,
ta = $(textarea),
taBase = ta.parent(),
dialog = taBase.parent(),
id = textarea.id + '_ace',
mimeMode = {
'text/x-php' : 'php',
'application/x-php' : 'php',
'text/html' : 'html',
'application/xhtml+xml' : 'html',
'text/javascript' : 'javascript',
'application/javascript' : 'javascript',
'text/css' : 'css',
'text/x-c' : 'c_cpp',
'text/x-csrc' : 'c_cpp',
'text/x-chdr' : 'c_cpp',
'text/x-c++' : 'c_cpp',
'text/x-c++src' : 'c_cpp',
'text/x-c++hdr' : 'c_cpp',
'text/x-shellscript' : 'sh',
'application/x-csh' : 'sh',
'text/x-python' : 'python',
'text/x-java' : 'java',
'text/x-java-source' : 'java',
'text/x-ruby' : 'ruby',
'text/x-perl' : 'perl',
'application/x-perl' : 'perl',
'text/x-sql' : 'sql',
'text/xml' : 'xml',
'application/docbook+xml' : 'xml',
'application/xml' : 'xml',
'text/x-markdown' : 'markdown'
},
resize = function(){
dialog.height($(window).height() * 0.9).trigger('posinit');
taBase.height(dialog.height() - taBase.prev().outerHeight(true) - taBase.next().outerHeight(true) - 8);
};
mode = ace.require('ace/ext/modelist').getModeForPath(self.file.name).name;
if (mode === 'text') {
if (mimeMode[self.file.mime]) {
mode = mimeMode[self.file.mime];
}
}
taBase.prev().append(' (' + self.file.mime + ' : ' + mode.split(/[\/\\]/).pop() + ')');
$('<div class="ui-dialog-buttonset"/>').css('float', 'left')
.append(
$('<button>TextArea</button>')
.button()
.on('click', function(){
if (ta.data('ace')) {
ta.data('ace', false);
editorBase.hide();
ta.val(editor.session.getValue()).show().focus();
$(this).find('span').text('AceEditor');
} else {
ta.data('ace', true);
editor.setValue(ta.hide().val(), -1);
editorBase.show();
editor.focus();
$(this).find('span').text('TextArea');
}
})
)
.append(
$('<button>Ace editor setting</button>')
.button({
icons: {
primary: 'ui-icon-gear',
secondary: 'ui-icon-triangle-1-e'
},
text: false
})
.on('click', function(){
editor.showSettingsMenu();
})
)
.prependTo(taBase.next());
editorBase = $('<div id="'+id+'" style="width:100%; height:100%;"/>').text(ta.val()).insertBefore(ta.hide());
ta.data('ace', true);
editor = ace.edit(id);
ace.require('ace/ext/settings_menu').init(editor);
editor.$blockScrolling = Infinity;
editor.setOptions({
theme: 'ace/theme/monokai',
mode: 'ace/mode/' + mode,
wrap: true,
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: false
});
editor.commands.addCommand({
name : "saveFile",
bindKey: {
win : 'Ctrl-s',
mac : 'Command-s'
},
exec: function(editor) {
self.doSave();
}
});
editor.commands.addCommand({
name : "closeEditor",
bindKey: {
win : 'Ctrl-w|Ctrl-q',
mac : 'Command-w|Command-q'
},
exec: function(editor) {
self.doCancel();
}
});
dialog.on('resize', function(){ editor.resize(); });
$(window).on('resize', function(e){
if (e.target !== this) return;
dialog.data('resizeTimer') && clearTimeout(dialog.data('resizeTimer'));
dialog.data('resizeTimer', setTimeout(function(){ resize(); }, 300));
});
resize();
editor.resize();
return editor;
},
close : function(textarea, instance) {
instance.destroy();
$(textarea).show();
},
save : function(textarea, instance) {
if ($(textarea).data('ace')) {
$(textarea).val(instance.session.getValue());
}
},
focus : function(textarea, instance) {
instance.focus();
}
}
]
}
}
Thanks! 👍
from elfinder-nightly-src.
Related Issues (3)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from elfinder-nightly-src.