ID #1035

HTML-Editor (SPAW) für Contenido 4.4.x optimieren!

ein hallo an alle editor-tuner,

ich hab hier mal zusammengefasst wie man - jedenfalls aus meiner sicht - den internen contenido-html-editor sehr sinnvoll optimieren kann. dabei möchte ich mich besonders bei emergence für seine tatkräftige unterstützung bedanken!

mit den hier notierten skript-änderungen ist folgendes möglich ...
a) die einbindung und anzeige der style-sheets im SPAW-editor
und
b) die möglichkeit für style-sheet-zuweisungen mit -tags per dropdown


zu a)

1. zuweisung der stylesheet-datei in der benutzer-administration
dort eine gruppe bzw. einen benutzer auswählen und bei "benutzerdefinierte eigenschaften" folgende einträge machen.

-> zum einbinden der gesamten css-datei
wysiwyg
spaw-stylesheet-file
css/format.css

-> zum einbinden einzelner css-elemente
wysiwyg
spaw-styles
headline1;text_klein;text_rot


2. css in editor einbinden
die datei "editor.php" im verzeichnis "contenidoexternalwysiwygspaw" öffnen und in zeile 25 ...
´´ /*stylesheet file*/

durch ...
$css_stylesheet

ersetzen.


3. datei "spaw_control.config.php" im verzeichnis "contenidoexternalwysiwygspawconfig" öffnen und ab zeile 100

if (is_array($styles))
{
foreach ($styles as $style)
{
$spaw_dropdown_data[´style´][$style] = $style;
}
} else {
/* Default styles */
$spaw_dropdown_data[´style´][´default´] = ´Normal´;
$spaw_dropdown_data[´style´][´style1´] = ´Style No1´;
$spaw_dropdown_data[´style´][´style2´] = ´Style No2´;
}

durch ...
$css_stylesheet = $user->getUserProperty("wysiwyg","spaw-stylesheet-file");
if ($css_stylesheet == false)
{
$css_stylesheet = "";
} else {
$css_stylesheet = $cfgClient[$client]["htmlpath"]["frontend"].$css_stylesheet;
}
$styles = $user->getUserProperty("wysiwyg","spaw-styles");
if ($styles == false && $css_stylesheet == "")
{
// standard settings
$spaw_dropdown_data[´style´][´default´] = ´Normal´;
$spaw_dropdown_data[´style´][´style1´] = ´Style No1´;
$spaw_dropdown_data[´style´][´style2´] = ´Style No2´;
} else {
if ($styles != false) // check if any styles are defined
{
$styles = explode(";",urldecode($styles));
if (is_array($styles))
{
foreach ($styles as $style) // if there are more values
{
$spaw_dropdown_data[´style´][$style] = $style;
}
} else {
$spaw_dropdown_data[´style´][$styles] = $styles; // for one value
}
}
if ($css_stylesheet != "") // get styles from defined stylesheet file
{
$styles = file ($css_stylesheet);
if ($styles) {
foreach ($styles as $style) {
if (preg_match("/.([^s:,{]*)/i", $style, $style_result)) {
// matches all .class in stylesheet, double entries are not possible
$spaw_dropdown_data[´style´][trim($style_result[1])] = trim($style_result[1]);
}
}
asort($spaw_dropdown_data[´style´]); // sort styles alphabetically
} else {
// stylesheet does not exist
}
}
}


ersetzen.

damit sehen die schriftauszeichnungen im SPAW-editor nun wie im frontend bzw. editormodus aus.



zu b)

wer jetzt noch möchte, dass die einzelnen style-sheets auch per -tags ausgezeichnet werden, muss den letzten (optionalen) punkt ausführen.

4. im verzeichnis "contenidoexternalwysiwygspawclass" die datei "script.js.php" öffnen und
... ab zeile 423 die drei "trim-funktionen"
// trim functions
function SPAW_ltrim(txt)
{
var spacers = " 	
";
while (spacers.indexOf(txt.charAt(0)) != -1)
{
txt = txt.substr(1);
}
return(txt);
}
function SPAW_rtrim(txt)
{
var spacers = " 	
";
while (spacers.indexOf(txt.charAt(txt.length-1)) != -1)
{
txt = txt.substr(0,txt.length-1);
}
return(txt);
}
function SPAW_trim(txt)
{
return(SPAW_ltrim(SPAW_rtrim(txt)));
}


durch
// trim functions
function SPAW_ltrim(txt)
{
//Match spaces at beginning of text and replace with a null string
return txt.replace(/^s+/,´´);
}
function SPAW_rtrim(txt)
{
//Match spaces at end of text and replace with a null string
return txt.replace(/s+$/,´´);
}
function SPAW_trim(txt)
{
//Remove spaces at beginning and end of text
return(SPAW_ltrim(SPAW_rtrim(txt)));
}


ersetzen und ...

die function SPAW_style_change (=übernächste funktion)
function SPAW_style_change(editor, sender)
{
classname = sender.options[sender.selectedIndex].value;
window.frames[editor+´_rEdit´].focus();
var el = SPAW_getParentTag(editor);
if (el != null && el.tagName.toLowerCase() != ´body´)
{
if (classname != ´default´)
el.className = classname;
else
el.removeAttribute(´className´);
}
else if (el.tagName.toLowerCase() == ´body´)
{
if (classname != ´default´)
this[editor+´_rEdit´].document.body.innerHTML = ´´+
this[editor+´_rEdit´].document.body.innerHTML+´´;
else
this[editor+´_rEdit´].document.body.innerHTML = ´´+
this[editor+´_rEdit´].document.body.innerHTML+´´;
}
sender.selectedIndex = 0;
SPAW_update_toolbar(editor, true);
}

durch ...
function SPAW_style_change(editor, sender)
{
classname = sender.options[sender.selectedIndex].value;
window.frames[editor+´_rEdit´].focus();
// v2.3 modified version by horwath@opensa.org
var ttext = "";
var trange = this[editor+´_rEdit´].document.selection.createRange();
if (trange != null && this[editor+´_rEdit´].document.selection.type != "Control")
ttext = trange.htmlText;
if (SPAW_trim(ttext) == "") { // if no range was selected
var el = SPAW_getParentTag(editor);
if (el != null && el.tagName.toLowerCase() != ´body´)
{
if (classname != ´default´ && classname != "")
el.className = classname;
else
if (el.tagName.toLowerCase() != ´span´)
el.removeAttribute(´className´);
else
el.removeNode(); // remove span tag
}
else if (el.tagName.toLowerCase() == ´body´)
{
if (classname != ´default´ && classname != "")
this[editor+´_rEdit´].document.body.innerHTML = ´´+
this[editor+´_rEdit´].document.body.innerHTML+´´;
else
this[editor+´_rEdit´].document.body.innerHTML = ´´+
this[editor+´_rEdit´].document.body.innerHTML+´´;
}
} else { // if range was found
this[editor+´_rEdit´].document.selection.clear(); // remove selection
var otext = "556e697175657e537472696e67";         // unique string
trange.pasteHTML(otext);                          // insert placeholder
ttext = ttext.replace(/]*>/gi,´´);     // remove all spans from ttext
if (classname != ´default´ && classname != "")
ttext = ´´+ttext+´´;
// replace placeholder string with ttext
this[editor+´_rEdit´].document.body.innerHTML =
this[editor+´_rEdit´].document.body.innerHTML.replace(otext,ttext);
}
sender.selectedIndex = 0;
SPAW_update_toolbar(editor, true);
}



so ich hoffe ich hab nix vergessen! ;-)
verbesserungen und ergänzungen sind herzlich willkommen!

frohes osterfest,
matze
Mehr Informationen unter: http://forum.contenido.org/viewtopic.php?p=20582#20582

Tags: V4.4

Verwandte Artikel:

Es ist möglich, diese FAQ zu kommentieren.