Bottone Font Awesome per il tuo editor BBcode

Installazione

Codice:

/* Add fontawesome to textarea font-family so the icons are visible */
.sceditor-container textarea { font-family:Verdana, Arial, Helvetica, sans-serif, FontAwesome !important }
/* button image */
.sceditor-button-fontawesome div { background:url(http://i19.servimg.com/u/f19/19/06/98/92/fa-f10.png) !important }

/* drop down */
.sceditor-fontawesome {
  width:220px;
  height:250px;
  overflow-y:auto;
}

/* icons */
.sceditor-fontawesome i {
  color:#333;
  font-size:20px;
  text-align:center;
  cursor:pointer;
  padding:3px 0;
  width:25%;
}
.sceditor-fontawesome i:hover { color:#666 }

Codice:

$(function(){ 
if (!$.sceditor) return; 
var defaultSize = 18, // default icon size 
autoClose = 1, // closes drop down after an icon is clicked, if enabled 

// icon list 
fa = ['','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','',''],
A = '', O = A; 

// if the size is above 0 we'll format a default size for the icons 
if (defaultSize) { 
A += '[size=' + defaultSize + ']'; 
O += '[/size]'; 
} 

// create sceditor button and drop down 
$.sceditor.command.set('fontawesome', { 

dropDown : function(editor, caller, callback) { 
var a, b = '', c = document.createElement('DIV'), i = 0, j = fa.length; 

for (; i<j; i++) b += '<i class="fa">' + fa[i] + '</i>'; 

c.innerHTML = b; 

for (a = c.getElementsByTagName('I'), i = 0, j = a.length; i<j; i++) { 
a[i].onclick = function() { 
callback(this.innerHTML); 
autoClose && editor.closeDropDown(true); 
}; 
} 

editor.createDropDown(caller, 'fontawesome', c); 
}, 

// wysiwyg 
exec : function(c) { 
var e = this; 
$.sceditor.command.get('fontawesome').dropDown(e, c, function(icon) { 
e.insert(' [font=FontAwesome]' + A + icon + O + '[/font]&nbsp;', '', true, true, true); 
}); 
}, 

// source 
txtExec : function(c) { 
var e = this; 
$.sceditor.command.get('fontawesome').dropDown(e, c, function(icon) { 
e.insert(' [font=FontAwesome]' + A + icon + O + '[/font] ', ''); 
}); 
}, 

tooltip : 'Font Awesome Icons' 
}); 

toolbar = toolbar.replace(/date,/,'fontawesome,date,'); // add the button to the toolbar 
});