Mootools + MooEditable
Ik gebruik sins kort MooEditable, dat werkt prima daar zitten smiley's in waar je op kan klikken en komen die in de textarea. Wat ik graag zou willen is dat hij ze ook plaatst als ik bv :) typ. Zou iemand mijn opweg kunnen helpen om dit op een nete manier in deze code toe te voegen ?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
MooEditable.Actions.Settings.smiley = {
imagesPath: '../../Assets/MooEditable/Smiley/',
smileys: ['angryface', 'blush', 'gasp', 'grin', 'halo', 'lipsaresealed', 'smile', 'undecided', 'wink'],
fileExt: '.png'
};
MooEditable.lang.set({
insertSmiley: 'Insert Smiley'
});
MooEditable.Actions.smiley = {
type: 'button-overlay',
title: MooEditable.lang.get('insertSmiley'),
options: {
overlaySize: {x: 'auto'},
overlayHTML: (function(){
var settings = MooEditable.Actions.Settings.smiley;
var html = '';
settings.smileys.each(function(s){
html += '<img src="'+ settings.imagesPath + s + settings.fileExt + '" alt="" class="smiley-image">';
});
return html;
})()
},
command: function(buttonOverlay, e){
var el = e.target;
if (el.tagName.toLowerCase() != 'img') return;
var src = $(el).get('src');
var content = '<img style="border:0;" class="smiley" src="' + src + '" alt="">';
this.focus();
this.selection.insertContent(content);
},
events: {
attach: function(editor){
if (Browser.Engine.trident){
// addListener instead of addEvent, because controlselect is a native event in IE
editor.doc.addListener('controlselect', function(e){
var el = e.target;
if (el.tagName.toLowerCase() != 'img') return;
if (!$(el).hasClass('smiley')) return;
e.preventDefault();
});
}
},
editorMouseDown: function(e, editor){
var el = e.target;
var isSmiley = (el.tagName.toLowerCase() == 'img') && $(el).hasClass('smiley');
$try(function(){
editor.doc.execCommand('enableObjectResizing', false, !isSmiley);
});
}
}
};
imagesPath: '../../Assets/MooEditable/Smiley/',
smileys: ['angryface', 'blush', 'gasp', 'grin', 'halo', 'lipsaresealed', 'smile', 'undecided', 'wink'],
fileExt: '.png'
};
MooEditable.lang.set({
insertSmiley: 'Insert Smiley'
});
MooEditable.Actions.smiley = {
type: 'button-overlay',
title: MooEditable.lang.get('insertSmiley'),
options: {
overlaySize: {x: 'auto'},
overlayHTML: (function(){
var settings = MooEditable.Actions.Settings.smiley;
var html = '';
settings.smileys.each(function(s){
html += '<img src="'+ settings.imagesPath + s + settings.fileExt + '" alt="" class="smiley-image">';
});
return html;
})()
},
command: function(buttonOverlay, e){
var el = e.target;
if (el.tagName.toLowerCase() != 'img') return;
var src = $(el).get('src');
var content = '<img style="border:0;" class="smiley" src="' + src + '" alt="">';
this.focus();
this.selection.insertContent(content);
},
events: {
attach: function(editor){
if (Browser.Engine.trident){
// addListener instead of addEvent, because controlselect is a native event in IE
editor.doc.addListener('controlselect', function(e){
var el = e.target;
if (el.tagName.toLowerCase() != 'img') return;
if (!$(el).hasClass('smiley')) return;
e.preventDefault();
});
}
},
editorMouseDown: function(e, editor){
var el = e.target;
var isSmiley = (el.tagName.toLowerCase() == 'img') && $(el).hasClass('smiley');
$try(function(){
editor.doc.execCommand('enableObjectResizing', false, !isSmiley);
});
}
}
};
Er zijn nog geen reacties op dit bericht.