BBCode color, forkert placering
Hej Eksperter!Først vil jeg lægge ud med at sige det 112% ærligt som det er: Jeg har i flere år rodet med CMS-systemet PHP-Fusion. For ca. 1 års tid siden, kom der en ny version af systemet på gaden. Denne nye version har desværre en fejl, som endnu INGEN har kunne præstere at løse. Det gælder udviklingsholdet bag de officielle supportsider, samt et uhav af folk som jeg selv, der "kun" har en u-officiel hjælpeside/supportside. Med andre ord - så er vi rigtig mange der har forsøgt os ad - uden det er lykkedes det for nogen af os.
Nu til problemets kerne: Hvis man vil bruge knappen BBCode for farver/color, så markerer man den valgte tekst, trykker på knappen for farver (BBCoden color), vælger farve og trykker igen på knappen. Så er den valgte tekst "indhegnet" f.eks. som :
Farvet tekst
Det er helt ok - og virker som det skal. I FF vel og mærke. Desværre ikke i IE7/8.
I IE versionerne ser koden i stedet ud som - når man vælger at farve en tekst:
Farvet tekst
Dvs. at BBKoden bliver indsat EFTER den markerede valgte tekst - og altså ikke således at den "indhegner" teksten med BBKoden.
Et eksempel kan ses på vores egen side - i vores replikboks ude i højre side: http://phpfusion-tips.dk/
Man behøver ikke engang at skrive en replik - før man kan se problemet. I IE vel og mærke.
Prøv her at skrive et par bogstaver, trykke på farve-knappen, vælg farve, og tryk så på farve-knappen igen. Her kan man tydeligt se/fremkalde fejlen/problemet.
Vi er mange her der ville blive ovenud rigtig meget glade, hvis her er et klogt hovede, der netop kan gennemskue det så mange, ja jeg lyver nok ikke hvis jeg siger flere 100, der har forsøgt sig ad ikke kan. Der i blandt også selve dev.teamet for PHP-Fusion.
Jeg poster herunder 3 koder.
color_bbcode_include.php
<?php
/*-------------------------------------------------------+
| PHP-Fusion Content Management System
| Copyright (C) 2002 - 2008 Nick Jones
| http://www.php-fusion.co.uk/
+--------------------------------------------------------+
| Filename: color_bbcode_include.php
| Author: Wooya
+--------------------------------------------------------+
| This program is released as free software under the
| Affero GPL license. You can redistribute it and/or
| modify it under the terms of this license which you
| can read by viewing the included agpl.txt or online
| at www.gnu.org/licenses/agpl.html. Removal of this
| copyright header is strictly prohibited without
| written permission from the original author(s).
+--------------------------------------------------------*/
if (!defined("IN_FUSION")) { die("Access Denied"); }
$text = preg_replace('#\[color=(black|blue|brown|cyan|gray|green|lime|maroon|navy|olive|orange|purple|red|silver|violet|white|yellow)\](.*?)\[/color\]#si', '<span style=\'color:\1\'>\2</span>', $text);
$text = preg_replace('#\[color=([\#a-f0-9]*?)\](.*?)\[/color\]#si', '<span style=\'color:\1\'>\2</span>', $text);
?>
color_bbcode_include_var.php
<?php
/*-------------------------------------------------------+
| PHP-Fusion Content Management System
| Copyright (C) 2002 - 2008 Nick Jones
| http://www.php-fusion.co.uk/
+--------------------------------------------------------+
| Filename: color_bbcode_include_var.php
| Author: Wooya
+--------------------------------------------------------+
| This program is released as free software under the
| Affero GPL license. You can redistribute it and/or
| modify it under the terms of this license which you
| can read by viewing the included agpl.txt or online
| at www.gnu.org/licenses/agpl.html. Removal of this
| copyright header is strictly prohibited without
| written permission from the original author(s).
+--------------------------------------------------------*/
if (!defined("IN_FUSION")) { die("Access Denied"); }
$__BBCODE__[] =
array(
"description" => $locale['bb_color_description'],
"value" => "color",
"bbcode_start" => "",
"bbcode_end" => "",
"usage" => "[color=#".$locale['bb_color_hex']."]".$locale['bb_color_usage']."[/color]",
"onclick" => "return overlay(this, 'bbcode_color_map_".$textarea_name."', 'rightbottom');",
"onmouseover" => "",
"onmouseout" => "",
"html_start" => "<div id='bbcode_color_map_".$textarea_name."' class='tbl1' style='display:none;border:1px solid black;z-index:1;position:absolute;width:220px;height:160px' onclick=\"overlayclose('bbcode_color_map_".$textarea_name."');\">",
"includejscript" => "color_bbcode_include_js.js",
"calljscript" => "ColorMap('".$textarea_name."', '".$inputform_name."');",
"phpfunction" => "",
"html_middle" => "",
"html_end" => "</div>",
);
?>
color_bbcode_include_js.js
//based on TinyMce color map plugin - modified by wooya
function showMapColor(color, mapId) {
document.getElementById("selectedMapColor" + mapId).style.backgroundColor = color;
document.getElementById("selectedMapColorBox" + mapId).value = color;
}
//based on TinyMce color map plugin - modified by wooya
function ColorMap(elname, formname) {
var html = "";
var colors = new Array(
"#000000","#000033","#000066","#000099","#0000cc","#0000ff","#330000","#330033",
"#330066","#330099","#3300cc","#3300ff","#660000","#660033","#660066","#660099",
"#6600cc","#6600ff","#990000","#990033","#990066","#990099","#9900cc","#9900ff",
"#cc0000","#cc0033","#cc0066","#cc0099","#cc00cc","#cc00ff","#ff0000","#ff0033",
"#ff0066","#ff0099","#ff00cc","#ff00ff","#003300","#003333","#003366","#003399",
"#0033cc","#0033ff","#333300","#333333","#333366","#333399","#3333cc","#3333ff",
"#663300","#663333","#663366","#663399","#6633cc","#6633ff","#993300","#993333",
"#993366","#993399","#9933cc","#9933ff","#cc3300","#cc3333","#cc3366","#cc3399",
"#cc33cc","#cc33ff","#ff3300","#ff3333","#ff3366","#ff3399","#ff33cc","#ff33ff",
"#006600","#006633","#006666","#006699","#0066cc","#0066ff","#336600","#336633",
"#336666","#336699","#3366cc","#3366ff","#666600","#666633","#666666","#666699",
"#6666cc","#6666ff","#996600","#996633","#996666","#996699","#9966cc","#9966ff",
"#cc6600","#cc6633","#cc6666","#cc6699","#cc66cc","#cc66ff","#ff6600","#ff6633",
"#ff6666","#ff6699","#ff66cc","#ff66ff","#009900","#009933","#009966","#009999",
"#0099cc","#0099ff","#339900","#339933","#339966","#339999","#3399cc","#3399ff",
"#669900","#669933","#669966","#669999","#6699cc","#6699ff","#999900","#999933",
"#999966","#999999","#9999cc","#9999ff","#cc9900","#cc9933","#cc9966","#cc9999",
"#cc99cc","#cc99ff","#ff9900","#ff9933","#ff9966","#ff9999","#ff99cc","#ff99ff",
"#00cc00","#00cc33","#00cc66","#00cc99","#00cccc","#00ccff","#33cc00","#33cc33",
"#33cc66","#33cc99","#33cccc","#33ccff","#66cc00","#66cc33","#66cc66","#66cc99",
"#66cccc","#66ccff","#99cc00","#99cc33","#99cc66","#99cc99","#99cccc","#99ccff",
"#cccc00","#cccc33","#cccc66","#cccc99","#cccccc","#ccccff","#ffcc00","#ffcc33",
"#ffcc66","#ffcc99","#ffcccc","#ffccff","#00ff00","#00ff33","#00ff66","#00ff99",
"#00ffcc","#00ffff","#33ff00","#33ff33","#33ff66","#33ff99","#33ffcc","#33ffff",
"#66ff00","#66ff33","#66ff66","#66ff99","#66ffcc","#66ffff","#99ff00","#99ff33",
"#99ff66","#99ff99","#99ffcc","#99ffff","#ccff00","#ccff33","#ccff66","#ccff99",
"#ccffcc","#ccffff","#ffff00","#ffff33","#ffff66","#ffff99","#ffffcc","#ffffff"
);
html += '<table border="0" cellspacing="1" cellpadding="0" class="tbl"><tr>';
for (var i=0; i<colors.length; i++) {
if (formname == undefined) {
html += "<td class='tbl1' style='width:10px;height:10px;cursor:crosshair;background-color:" + colors[i] + "' onclick=\"addText('" + elname + "', '[color=" + colors[i] + "]', '[/color]');return false;\" onfocus=\"showMapColor('" + colors[i] + "', '" + elname + "');\" onmouseover=\"showMapColor('" + colors[i] + "', '" + elname + "');\">"
} else {
html += "<td class='tbl1' style='width:10px;height:10px;cursor:crosshair;background-color:" + colors[i] + "' onclick=\"addText('" + elname + "', '[color=" + colors[i] + "]', '[/color]', '" + formname + "');return false;\" onfocus=\"showMapColor('" + colors[i] + "', '" + elname + "');\" onmouseover=\"showMapColor('" + colors[i] + "', '" + elname + "');\">"
}
html += '</td>';
if ((i+1) % 18 == 0) html += '</tr><tr>';
}
html += '<tr><td colspan="18">'
+ '<table width="100%" border="0" cellspacing="0" cellpadding="0">'
+ '<tr><td id="selectedMapColor' + elname + '" width="50%" height="16">'
+ '</td><td width="50%">'
+ '<input id="selectedMapColorBox' + elname + '" name="selectedMapColorBox' + elname + '" type="text" size="7" maxlength="7" style="text-align:center;font-weight:bold;width:100%" class="textbox" value="" />'
+ '</td></tr>'
+ '</table>'
+ '</td></tr>'
+ '</table>';
document.write(html);
}
--------------
Mvh.
Buxxy.
OBS: Jeg undskylder hvis debatten er oprettet under forkert emne. Men jeg vidste ikke rigtigt - det er jo både PHP samt JavaScript her er tale om. Så bær gerne over med mig, hvis den er oprettet under forkert emne.