From ceb18fe73da77f5ba91bfa4e7af9e4fad7b05610 Mon Sep 17 00:00:00 2001 From: Julian Lam Date: Thu, 19 Feb 2015 16:51:10 -0500 Subject: [PATCH] added new hook and method for plugins to introduce their own formatting options, #2743 --- public/src/modules/composer.js | 12 +++- public/src/modules/composer/formatting.js | 82 ++++++----------------- src/socket.io/modules.js | 10 +++ 3 files changed, 42 insertions(+), 62 deletions(-) diff --git a/public/src/modules/composer.js b/public/src/modules/composer.js index 29154d1523..26f4e4a8f2 100644 --- a/public/src/modules/composer.js +++ b/public/src/modules/composer.js @@ -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) { diff --git a/public/src/modules/composer/formatting.js b/public/src/modules/composer/formatting.js index f29e287a7f..56edd38815 100644 --- a/public/src/modules/composer/formatting.js +++ b/public/src/modules/composer/formatting.js @@ -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(''); - } + for(var x=0,numButtons=customButtons.length;x'); } - } + }; 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); + + console.log(formattingDispatchTable); - if(formattingDispatchTable.hasOwnProperty(iconClass)){ - formattingDispatchTable[iconClass](textarea, textarea.selectionStart, textarea.selectionEnd); + if(formattingDispatchTable.hasOwnProperty(format)){ + formattingDispatchTable[format](textarea, textarea.selectionStart, textarea.selectionEnd); preview.render(postContainer); } }); diff --git a/src/socket.io/modules.js b/src/socket.io/modules.js index 00fdeaf433..306d26d579 100644 --- a/src/socket.io/modules.js +++ b/src/socket.io/modules.js @@ -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) {