Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-11-01 11:35:55 +01:00
Code Issues Packages Projects Releases Wiki Activity

added new hook and method for plugins to introduce their own formatting options, #2743

Browse Source
This commit is contained in:
Julian Lam
2015-02-19 16:51:10 -05:00
parent 767816e669
commit ceb18fe73d
3 changed files with 42 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
public/src/modules/composer.js
View File

@@ -16,11 +16,17 @@ define('composer', [
var composer = {
active: undefined,
posts: {},
bsEnvironment: undefined
bsEnvironment: undefined,
formatting: []
};
$(window).off('resize', onWindowResize).on('resize', onWindowResize);
// Query server for formatting options
socket.emit('modules.composer.getFormattingOptions', function(err, options) {
composer.formatting = options;
});
function onWindowResize() {
if (composer.active !== undefined) {
resize.reposition($('#cmp-uuid-' + composer.active));
@@ -232,8 +238,10 @@ define('composer', [
maximumTagLength: config.maximumTagLength,
isTopic: isTopic,
showHandleInput: (app.user.uid === 0 || (isEditing && isGuestPost && app.user.isAdmin)) && config.allowGuestHandles,
handle: composer.posts[post_uuid] ? composer.posts[post_uuid].handle || '' : undefined
handle: composer.posts[post_uuid] ? composer.posts[post_uuid].handle || '' : undefined,
formatting: composer.formatting
};
console.log(composer.formatting);
parseAndTranslate(template, data, function(composerTemplate) {
if ($('#cmp-uuid-' + post_uuid).length) {

82
public/src/modules/composer/formatting.js
View File

@@ -7,61 +7,15 @@ define('composer/formatting', ['composer/controls', 'composer/preview'], functio
var formatting = {};
var formattingDispatchTable = {
'fa fa-bold': function(textarea, selectionStart, selectionEnd){
if(selectionStart === selectionEnd){
controls.insertIntoTextarea(textarea, '**bolded text**');
controls.updateTextareaSelection(textarea, selectionStart + 2, selectionStart + 13);
} else {
controls.wrapSelectionInTextareaWith(textarea, '**');
controls.updateTextareaSelection(textarea, selectionStart + 2, selectionEnd + 2);
}
},
'fa fa-italic': function(textarea, selectionStart, selectionEnd){
if(selectionStart === selectionEnd){
controls.insertIntoTextarea(textarea, "*italicised text*");
controls.updateTextareaSelection(textarea, selectionStart + 1, selectionStart + 16);
} else {
controls.wrapSelectionInTextareaWith(textarea, '*');
controls.updateTextareaSelection(textarea, selectionStart + 1, selectionEnd + 1);
}
},
'fa fa-list': function(textarea, selectionStart, selectionEnd){
if(selectionStart === selectionEnd){
controls.insertIntoTextarea(textarea, "\n* list item");
// Highlight "list item"
controls.updateTextareaSelection(textarea, selectionStart + 3, selectionStart + 12);
} else {
controls.wrapSelectionInTextareaWith(textarea, '\n* ', '');
controls.updateTextareaSelection(textarea, selectionStart + 3, selectionEnd + 3);
}
},
'fa fa-link': function(textarea, selectionStart, selectionEnd){
if(selectionStart === selectionEnd){
controls.insertIntoTextarea(textarea, "[link text](link url)");
// Highlight "link url"
controls.updateTextareaSelection(textarea, selectionStart + 12, selectionEnd + 20);
} else {
controls.wrapSelectionInTextareaWith(textarea, '[', '](link url)');
// Highlight "link url"
controls.updateTextareaSelection(textarea, selectionEnd + 3, selectionEnd + 11);
}
},
'fa fa-picture-o': function(){
'picture-o': function(){
$('#files').click();
},
'fa fa-upload': function(){
upload: function(){
$('#files').click();
},
'fa fa-tags': function() {
tags: function() {
$('.tags-container').toggleClass('hidden');
}
};
@@ -69,27 +23,35 @@ define('composer/formatting', ['composer/controls', 'composer/preview'], functio
var customButtons = [];
formatting.addComposerButtons = function() {
for (var button in customButtons) {
if (customButtons.hasOwnProperty(button)) {
$('.formatting-bar .btn-group form').before('<span class="btn btn-link" tabindex="-1"><i class="' + customButtons[button].iconClass + '"></i></span>');
}
}
for(var x=0,numButtons=customButtons.length;x<numButtons;x++) {
$('.formatting-bar .btn-group form').before('<span class="btn btn-link" tabindex="-1" data-format="' + customButtons[x].name + '"><i class="' + customButtons[x].iconClass + '"></i></span>');
}
};
formatting.addButton = function(iconClass, onClick) {
formattingDispatchTable[iconClass] = onClick;
var name = iconClass.replace('fa fa-', '');
formattingDispatchTable[name] = onClick;
customButtons.push({
name: name,
iconClass: iconClass
});
}
};
formatting.addButtonDispatch = function(name, onClick) {
formattingDispatchTable[name] = onClick;
};
formatting.addHandler = function(postContainer) {
postContainer.on('click', '.formatting-bar span', function () {
var iconClass = $(this).find('i').attr('class');
var textarea = $(this).parents('.composer').find('textarea')[0];
var format = $(this).attr('data-format'),
textarea = $(this).parents('.composer').find('textarea')[0];
console.log('handling', format);
if(formattingDispatchTable.hasOwnProperty(iconClass)){
formattingDispatchTable[iconClass](textarea, textarea.selectionStart, textarea.selectionEnd);
console.log(formattingDispatchTable);
if(formattingDispatchTable.hasOwnProperty(format)){
formattingDispatchTable[format](textarea, textarea.selectionStart, textarea.selectionEnd);
preview.render(postContainer);
}
});

10
src/socket.io/modules.js
View File

@@ -114,6 +114,16 @@ SocketModules.composer.stopNotifyTyping = function(socket, data) {
server.in('topic_' + data.tid).emit('event:topic.stopNotifyTyping', data);
};
SocketModules.composer.getFormattingOptions = function(socket, data, callback) {
plugins.fireHook('filter:composer.formatting', {
options: [
// { className: 'fa fa-bold' } Just an example of what needs to be set via plugins
]
}, function(err, payload) {
callback(err, payload.options);
});
};
/* Chat */
SocketModules.chats.get = function(socket, data, callback) {