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

Composer: Switch to using a dispatch table for buttons

Browse Source 
Note: for now, it looks a little messy, but once I merge wrapSelectionInTextareaWith and insertIntoTextarea, it won't be. Promise.
This commit is contained in:
Micheil Smith
2014-04-19 15:13:57 +01:00
parent 016ea8dc32
commit bf7de0d051
1 changed files with 68 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -414,89 +414,100 @@ define(['taskbar'], function(taskbar) {
thumbForm.submit(); thumbForm.submit();
} }
function handleFormattingBarClick() {
var iconClass = $(this).find('i').attr('class');
var textarea = $(this).parents('.composer').find('textarea')[0];
var textareaValue = $(textarea).val(); /*************************************************/
/* Rich Textarea Controls */
/*************************************************/
function insertIntoTextarea(textarea, value) {
var $textarea = $(textarea);
var currentVal = $textarea.val();
var selectionStart = textarea.selectionStart, $textarea.val(
selectionEnd = textarea.selectionEnd, currentVal.slice(0, textarea.selectionStart) +
selectionLength = selectionEnd - selectionStart, value +
isSelectionAtEnd = selectionStart === selectionEnd; currentVal.slice(textarea.selectionStart)
);
function updateSelection(start, end){
textarea.setSelectionRange(start, end);
textarea.focus();
} }
function insertIntoInput(value) { function wrapSelectionInTextareaWith(textarea, leading, trailing){
$(textarea).val(textareaValue.slice(0, selectionStart) + value + textareaValue.slice(selectionStart));
}
function wrapSelectedWith(leading, trailing){
if(trailing === undefined){ if(trailing === undefined){
trailing = leading; trailing = leading;
} }
$(textarea).val(textareaValue.slice(0, selectionStart) + leading + textareaValue.slice(selectionStart, selectionEnd) + trailing + textareaValue.slice(selectionEnd)); var $textarea = $(textarea);
var currentVal = $textarea.val()
$textarea.val(
currentVal.slice(0, textarea.selectionStart) +
leading +
currentVal.slice(textarea.selectionStart, textarea.selectionEnd) +
trailing +
currentVal.slice(textarea.selectionEnd)
);
} }
if(iconClass === 'fa fa-bold') { function updateTextareaSelection(textarea, start, end){
if (isSelectionAtEnd) { textarea.setSelectionRange(start, end);
insertIntoInput("**bolded text**"); $(textarea).focus();
}
updateSelection(selectionStart + 2, selectionStart + 13); var formattingDispatchTable = {
'fa fa-bold': function(textarea, selectionStart, selectionEnd){
if(selectionStart === selectionEnd){
insertIntoTextarea(textarea, '**bolded text**');
updateTextareaSelection(textarea, selectionStart + 2, selectionStart + 13);
} else { } else {
wrapSelectedWith('**'); wrapSelectionInTextareaWith(textarea, '**');
updateTextareaSelection(textarea, selectionStart + 2, selectionEnd + 2);
// Highlight selection
updateSelection(selectionStart + 2, selectionEnd + 2);
}
} }
},
if(iconClass === 'fa fa-italic') { 'fa fa-italic': function(textarea, selectionStart, selectionEnd){
if (isSelectionAtEnd) { if(selectionStart === selectionEnd){
insertIntoInput("*italicised text*"); insertIntoTextarea(textarea, "*italicised text*");
updateTextareaSelection(textarea, selectionStart + 1, selectionStart + 16);
// Highlight selection
updateSelection(selectionStart + 1, selectionStart + 16);
} else { } else {
wrapSelectedWith('*'); wrapSelectionInTextareaWith(textarea, '*');
updateTextareaSelection(textarea, selectionStart + 1, selectionEnd + 1);
// Highlight selection
updateSelection(selectionStart + 1, selectionEnd + 1);
}
} }
},
if (iconClass === 'fa fa-list'){ 'fa fa-list': function(textarea, selectionStart, selectionEnd){
if(isSelectionAtEnd){ if(selectionStart === selectionEnd){
insertIntoInput("\n* list item"); insertIntoTextarea(textarea, "\n* list item");
// Highlight "list item" // Highlight "list item"
updateSelection(selectionStart + 3, selectionStart + 12); updateTextareaSelection(textarea, selectionStart + 3, selectionStart + 12);
} else { } else {
wrapSelectedWith('\n* ', ''); wrapSelectionInTextareaWith(textarea, '\n* ', '');
updateTextareaSelection(textarea, selectionStart + 3, selectionEnd + 3);
// Maintain selection:
updateSelection(selectionStart + 3, selectionEnd + 3);
}
} }
},
if (iconClass === 'fa fa-link') { 'fa fa-link': function(textarea, selectionStart, selectionEnd){
if (isSelectionAtEnd) { if(selectionStart === selectionEnd){
insertIntoInput("[link text](link url)"); insertIntoTextarea(textarea, "[link text](link url)");
// Highlight "link url" // Highlight "link url"
updateSelection(selectionStart + 12, selectionEnd + 20); updateTextareaSelection(textarea, selectionStart + 12, selectionEnd + 20);
} else { } else {
wrapSelectedWith('[', '](link url)'); wrapSelectionInTextareaWith(textarea, '[', '](link url)');
// Highlight "link url" // Highlight "link url"
updateSelection(selectionStart + selectionLength + 3, selectionEnd + 11); updateTextareaSelection(textarea, selectionEnd + 3, selectionEnd + 11);
} }
} }
};
function handleFormattingBarClick() {
var iconClass = $(this).find('i').attr('class');
var textarea = $(this).parents('.composer').find('textarea')[0];
if(formattingDispatchTable.hasOwnProperty(iconClass)){
formattingDispatchTable[iconClass](textarea, textarea.selectionStart, textarea.selectionEnd);
} }
}
composer.newTopic = function(cid) { composer.newTopic = function(cid) {
if(!allowed()) { if(!allowed()) {