makary/phpbb
1
0
Fork 0
mirror of https://github.com/phpbb/phpbb.git synced 2025-06-28 06:08:52 +00:00
Code Issues Projects Releases Packages Wiki Activity

[ticket/10810] Make the color palette usable outside of the editor context.

Browse source 
PHPBB3-10810
This commit is contained in:
Cesar G 2013-11-13 00:14:35 -08:00
parent 0385d16364
commit 9a9669bebd
1 changed files with 42 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
phpBB/assets/javascript/core.js
View file

@ -963,7 +963,11 @@ phpbb.registerDropdown = function(toggle, dropdown, options)
}; };
/** /**
* Get the HTML for a color palette table * Get the HTML for a color palette table.
*
* @param string dir Palette direction - either v or h
* @param int width Palette cell width.
* @param int height Palette cell height.
*/ */
phpbb.colorPalette = function(dir, width, height) { phpbb.colorPalette = function(dir, width, height) {
var r = 0, var r = 0,
@ -979,7 +983,7 @@ phpbb.colorPalette = function(dir, width, height) {
numberList[3] = 'BF'; numberList[3] = 'BF';
numberList[4] = 'FF'; numberList[4] = 'FF';
html += '<table>'; html += '<table style="width: auto;">';
for (r = 0; r < 5; r++) { for (r = 0; r < 5; r++) {
if (dir == 'h') { if (dir == 'h') {
@ -994,7 +998,7 @@ phpbb.colorPalette = function(dir, width, height) {
for (b = 0; b < 5; b++) { for (b = 0; b < 5; b++) {
color = String(numberList[r]) + String(numberList[g]) + String(numberList[b]); color = String(numberList[r]) + String(numberList[g]) + String(numberList[b]);
html += '<td style="background-color: #' + color + '; width: ' + width + 'px; height: ' + height + 'px;">'; html += '<td style="background-color: #' + color + '; width: ' + width + 'px; height: ' + height + 'px;">';
html += '<a href="#" onclick="bbfontstyle(\'[color=#' + color + ']\', \'[/color]\'); return false;" style="display: block; width: ' + width + 'px; height: ' + height + 'px; " alt="#' + color + '" title="#' + color + '"></a>'; html += '<a href="#" data-color="' + color + '" style="display: block; width: ' + width + 'px; height: ' + height + 'px; " alt="#' + color + '" title="#' + color + '"></a>';
html += '</td>'; html += '</td>';
} }
@ -1011,6 +1015,40 @@ phpbb.colorPalette = function(dir, width, height) {
return html; return html;
} }
/**
* Register a color palette.
*
* @param object el jQuery object for the palette container.
*/
phpbb.registerPalette = function(el) {
var orientation = el.attr('data-orientation'),
height = el.attr('data-height'),
width = el.attr('data-width'),
target = el.attr('data-target'),
bbcode = el.attr('data-bbcode');
// Insert the palette HTML into the container.
el.html(phpbb.colorPalette(orientation, width, height));
// Add toggle control.
$('#color_palette_toggle').click(function(e) {
el.toggle();
e.preventDefault();
});
// Attach event handler when a palette cell is clicked.
$(el).on('click', 'a', function(e) {
var color = $(this).attr('data-color');
if (bbcode) {
bbfontstyle('[color=#' + color + ']', '[/color]');
} else {
$(target).val(color);
}
e.preventDefault();
});
}
/** /**
* Apply code editor to all textarea elements with data-bbcode attribute * Apply code editor to all textarea elements with data-bbcode attribute
*/ */
@ -1028,11 +1066,7 @@ $(document).ready(function() {
}); });
$('#color_palette_placeholder').each(function() { $('#color_palette_placeholder').each(function() {
var orientation = $(this).attr('data-orientation'), phpbb.registerPalette($(this));
height = $(this).attr('data-height'),
width = $(this).attr('data-width');
$(this).html(phpbb.colorPalette(orientation, width, height));
}); });
}); });