diff --git a/public/src/modules/composer.js b/public/src/modules/composer.js index 2194bde928..1672fafbdf 100644 --- a/public/src/modules/composer.js +++ b/public/src/modules/composer.js @@ -2,7 +2,17 @@ /* globals define, socket, app, config, ajaxify, utils, translator, templates, bootbox */ -define('composer', ['taskbar', 'composer/controls', 'composer/uploads', 'composer/formatting', 'composer/drafts', 'composer/tags'], function(taskbar, controls, uploads, formatting, drafts, tags) { +var dependencies = [ + 'taskbar', + 'composer/controls', + 'composer/uploads', + 'composer/formatting', + 'composer/drafts', + 'composer/tags', + 'composer/preview' +]; + +define('composer', dependencies, function(taskbar, controls, uploads, formatting, drafts, tags, preview) { var composer = { active: undefined, posts: {}, @@ -214,7 +224,7 @@ define('composer', ['taskbar', 'composer/controls', 'composer/uploads', 'compose uploads.toggleThumbEls(postContainer, composer.posts[post_uuid].topic_thumb || ''); } - bodyEl.val(draft ? draft : postData.body); + postContainer.on('change', 'input, textarea', function() { composer.posts[post_uuid].modified = true; @@ -249,14 +259,12 @@ define('composer', ['taskbar', 'composer/controls', 'composer/uploads', 'compose return false; }); - bodyEl.on('blur', function() { - socket.emit('modules.composer.renderPreview', bodyEl.val(), function(err, preview) { - preview = $(preview); - preview.find('img').addClass('img-responsive'); - postContainer.find('.preview').html(preview); - }); + bodyEl.on('input propertychange', function() { + preview.render(postContainer); }); + bodyEl.val(draft ? draft : postData.body); + preview.render(postContainer); drafts.init(postContainer, postData); handleResize(postContainer); @@ -274,7 +282,6 @@ define('composer', ['taskbar', 'composer/controls', 'composer/uploads', 'compose formatting.addComposerButtons(); - }); }); } diff --git a/public/src/modules/composer/formatting.js b/public/src/modules/composer/formatting.js index e1495cb02f..f3a9256441 100644 --- a/public/src/modules/composer/formatting.js +++ b/public/src/modules/composer/formatting.js @@ -2,7 +2,7 @@ /* globals define */ -define('composer/formatting', ['composer/controls'], function(controls) { +define('composer/formatting', ['composer/controls', 'composer/preview'], function(controls, preview) { var formatting = {}; @@ -86,6 +86,7 @@ define('composer/formatting', ['composer/controls'], function(controls) { if(formattingDispatchTable.hasOwnProperty(iconClass)){ formattingDispatchTable[iconClass](textarea, textarea.selectionStart, textarea.selectionEnd); + preview.render(postContainer); } }); }; diff --git a/public/src/modules/composer/preview.js b/public/src/modules/composer/preview.js new file mode 100644 index 0000000000..16e4898d97 --- /dev/null +++ b/public/src/modules/composer/preview.js @@ -0,0 +1,22 @@ +'use strict'; + +/* globals define, socket*/ + +define('composer/preview', function() { + var preview = {}; + + preview.render = function(postContainer) { + + var textarea = postContainer.find('textarea'); + socket.emit('modules.composer.renderPreview', textarea.val(), function(err, preview) { + if (err) { + return; + } + preview = $(preview); + preview.find('img').addClass('img-responsive'); + postContainer.find('.preview').html(preview); + }); + }; + + return preview; +}); \ No newline at end of file