Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add config to map smileys to one or more BBcode-representations. #224

Closed
wants to merge 1 commit into from
Closed

Add config to map smileys to one or more BBcode-representations. #224

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
112 changes: 89 additions & 23 deletions plugins/bbcode/plugin.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,9 @@
* For licensing, see LICENSE.md or http://ckeditor.com/license
*/


( function() {

CKEDITOR.on( 'dialogDefinition', function( ev ) {
var tab,
name = ev.data.name,
Expand Down Expand Up @@ -49,23 +51,6 @@
return styleText;
}

// Maintain the map of smiley-to-description.
// jscs:disable maximumLineLength
var smileyMap = { smiley: ':)', sad: ':(', wink: ';)', laugh: ':D', cheeky: ':P', blush: ':*)', surprise: ':-o', indecision: ':|', angry: '>:(', angel: 'o:)', cool: '8-)', devil: '>:-)', crying: ';(', kiss: ':-*' },
// jscs:enable maximumLineLength
smileyReverseMap = {},
smileyRegExp = [];

// Build regexp for the list of smiley text.
for ( var i in smileyMap ) {
smileyReverseMap[ smileyMap[ i ] ] = i;
smileyRegExp.push( smileyMap[ i ].replace( /\(|\)|\:|\/|\*|\-|\|/g, function( match ) {
return '\\' + match;
} ) );
}

smileyRegExp = new RegExp( smileyRegExp.join( '|' ), 'g' );

var decodeHtml = ( function() {
var regex = [],
entities = {
Expand Down Expand Up @@ -183,7 +168,7 @@
* @param {String} source The HTML to be parsed, filling the fragment.
* @returns {CKEDITOR.htmlParser.fragment} The fragment created.
*/
CKEDITOR.htmlParser.fragment.fromBBCode = function( source ) {
CKEDITOR.htmlParser.fragment.fromBBCode = function( source, smileyConfig ) {
var parser = new CKEDITOR.BBCodeParser(),
fragment = new CKEDITOR.htmlParser.fragment(),
pendingInline = [],
Expand Down Expand Up @@ -382,10 +367,12 @@
else if ( piece.length ) {
var lastIndex = 0;

// Create smiley from text emotion.
piece.replace( smileyRegExp, function( match, index ) {
// Create smiley from BBcode representation.
piece.replace( smileyConfig.regExp, function( ) {
var match = arguments[0];
var index = arguments[arguments.length-2];
addElement( new CKEDITOR.htmlParser.text( piece.substring( lastIndex, index ) ), currentNode );
addElement( new CKEDITOR.htmlParser.element( 'smiley', { desc: smileyReverseMap[ match ] } ), currentNode );
addElement( new CKEDITOR.htmlParser.element( 'smiley', { desc: smileyConfig.reverseMap[ match ] } ), currentNode );
lastIndex = index + match.length;
} );

Expand Down Expand Up @@ -576,8 +563,28 @@
init: function( editor ) {
var config = editor.config;

// Maintain the map of smiley-to-description.
var smileyConfig = {
map: {},
reverseMap: {},
regExp: []
};
for ( var i in editor.config.bbode_smiley_map ) {
var smileyRepresentations = editor.config.bbode_smiley_map[i];
for ( var j in smileyRepresentations ) {
if (j == 0) {
smileyConfig.map[ i ] = smileyRepresentations[ j ];
}
smileyConfig.reverseMap[ smileyRepresentations[ j ] ] = i;
smileyConfig.regExp.push( smileyRepresentations[ j ].replace( /[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&", function( match ) {
return '\\' + match;
} ) );
}
}
smileyConfig.regExp = new RegExp( '('+smileyConfig.regExp.join( ')|(' )+')', 'g' );

function BBCodeToHtml( code ) {
var fragment = CKEDITOR.htmlParser.fragment.fromBBCode( code ),
var fragment = CKEDITOR.htmlParser.fragment.fromBBCode( code, smileyConfig ),
writer = new CKEDITOR.htmlParser.basicWriter();

fragment.writeHtml( writer, bbcodeFilter );
Expand Down Expand Up @@ -718,7 +725,7 @@
alt = attributes.alt;

if ( src && src.indexOf( editor.config.smiley_path ) != -1 && alt )
return new CKEDITOR.htmlParser.text( smileyMap[ alt ] );
return new CKEDITOR.htmlParser.text( smileyConfig.map[ alt ] );
else
element.children = [ new CKEDITOR.htmlParser.text( src ) ];
}
Expand Down Expand Up @@ -789,3 +796,62 @@
} );

} )();

/**
* Maps how each of the smileys defined in the {@link CKEDITOR.config#smiley_descriptions} setting
* can be represented in BBcode. Each value of the {@link CKEDITOR.config#smiley_descriptions} setting
* must be a property of this object, whose value is an array containing one or more BBcode-representations.
* The first element of this array will be used as the standard-representation,
* which will be used, when a smiley is inserted via the editor.
*
* // Default settings.
* config.bbode_smiley_map = {
* 'smiley': [':)', ':-)'],
* 'sad': [':(', ':-('],
* 'wink': [';)', ';-)'],
* 'laugh': [':D', ':-D'],
* 'frown': [':/', ':-/'],
* 'cheeky': [':P', ':-P'],
* 'blush': [':*)', ':-*)'],
* 'surprise': [':o', ':-o'],
* 'indecision': [':|', ':-)'],
* 'angry': ['>:(', '>:-('],
* 'angel': ['o:)', 'o:-)'],
* 'cool': ['8)', '8-)'],
* 'devil': ['>:)', '>:-)'],
* 'crying': [';(', ';-('],
* 'enlightened': [':light:'],
* 'no': [':no:'],
* 'yes': [':yes:'],
* 'heart': ['>3'],
* 'broken heart': ['>/3'],
* 'kiss': [':*', ':-*'],
* 'mail': [':mail:'],
* };
*
* @cfg
* @member CKEDITOR.config
*/
CKEDITOR.config.bbode_smiley_map = {
'smiley': [':)', ':-)'],
'sad': [':(', ':-('],
'wink': [';)', ';-)'],
'laugh': [':D', ':-D'],
'frown': [':/', ':-/'],
'cheeky': [':P', ':-P'],
'blush': [':*)', ':-*)'],
'surprise': [':o', ':-o'],
'indecision': [':|', ':-)'],
'angry': ['>:(', '>:-('],
'angel': ['o:)', 'o:-)'],
'cool': ['8)', '8-)'],
'devil': ['>:)', '>:-)'],
'crying': [';(', ';-('],
'enlightened': [':light:'],
'no': [':no:'],
'yes': [':yes:'],
'heart': ['>3'],
'broken heart': ['>/3'],
'kiss': [':*', ':-*'],
'mail': [':mail:'],
};
40 changes: 30 additions & 10 deletions plugins/bbcode/samples/bbcode.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,16 +82,36 @@ <h1 class="samples">
[ 'NumberedList', 'BulletedList', '-', 'Blockquote' ],
[ 'Maximize' ]
],
// Strip CKEditor smileys to those commonly used in BBCode.
smiley_images: [
'regular_smile.png', 'sad_smile.png', 'wink_smile.png', 'teeth_smile.png', 'tongue_smile.png',
'embarrassed_smile.png', 'omg_smile.png', 'whatchutalkingabout_smile.png', 'angel_smile.png',
'shades_smile.png', 'cry_smile.png', 'kiss.png'
],
smiley_descriptions: [
'smiley', 'sad', 'wink', 'laugh', 'cheeky', 'blush', 'surprise',
'indecision', 'angel', 'cool', 'crying', 'kiss'
]

// Map the smileys defined via the setting config.smiley_descriptions
// to their BBcode-representations.
// Each smiley defined in config.smiley_descriptions must also be
// configured here.
// The first stated BBcode-representation will be used as the standard,
// which will be used, when a smiley is inserted via the editor.
bbode_smiley_map = {
'smiley': [':)', ':-)'],
'sad': [':(', ':-('],
'wink': [';)', ';-)'],
'laugh': [':D', ':-D'],
'frown': [':/', ':-/'],
'cheeky': [':P', ':-P'],
'blush': [':*)', ':-*)'],
'surprise': [':o', ':-o'],
'indecision': [':|', ':-)'],
'angry': ['&gt;:(', '&gt;:-('],
'angel': ['o:)', 'o:-)'],
'cool': ['8)', '8-)'],
'devil': ['&gt;:)', '&gt;:-)'],
'crying': [';(', ';-('],
'enlightened': [':light:'],
'no': [':no:'],
'yes': [':yes:'],
'heart': ['&gt;3'],
'broken heart': ['&gt;/3'],
'kiss': [':*', ':-*'],
'mail': [':mail:'],
},
});

</script>
Expand Down