Openwysiwyg w Django

OpenWYSIWYG to jeden z wielu wizualnych edytorów HTML działający w przeglądarce i napisany w JavaScipcie. Oficjalnie działa w IE i Mozillach, lecz mi również działa pod Operą 9.01. Wadą jest błędne działanie pod Konquerorem (nie daje czystego textarea lecz kawałek edytora). Skrypt rozprowadzany jest na licencji LGPL i może być modyfikowany jak i wykorzystywany do różnych projektów. Pobrać możemy go ze strony projektu

OpenWYSIWYG i Django

Rozpakuj pliki do katalogu na pliki statyczne (media files)
Edytuj wysiwyg.js i popraw ścieżki do komponentów:

// Images Directory
imagesDir = "/site_media/icons/";

// CSS Directory
cssDir = "/site_media/styles/";

// Popups Directory
popupsDir = "/site_media/popups/";

Gdzie /site_media/ to u mnie nazwa katalogu na pliki statyczne wewnątrz django.

W sekcji HEAD swojego szablonu dołącz plik wysiwyg.js:

<script language="JavaScript" type="text/javascript" src="/site_media/wysiwyg.js" />

Skrypt zamienia TEXTAREA na edytory. By dane textarea zostało przemienione w edytor musi mieć atrybut ID:

<textarea name="textarea1" id="ID">Test</textarea>
		</textarea>
		<script language="javascript1.2">
		generate_wysiwyg('ID');
		</script>

Po tagu textarea musimy wstawić wywołanie edytora dla textarea o podanym ID. Jeżeli chcemy kilka edytorów na stronie - tworzymy kilka textarea o różnych ID i dla każdego taga wywołujemy edytor.

Dodatkowo by wysłanie formularza wysyłało dane z edytora należy dodać do taga form lub submit wywołanie funkcji updateTextArea (odpowiednio przez onsubmit i onclick). Przykład:

<form action="." method="POST" onsubmit="updateTextArea('ID');">

Zrobione

Konqueror i Safari

W przypadku konquerora i podobnej safari są problemy z obsługą edytorów WYSIWYG napisanych w JS. W przypadku tego edytora nie dostaniemy czystego textarea tylko nie działający edytor WYSIWYG blokujący edycję danych. By temu zaradzić wyłączymy działanie edytora dla tych dwóch przeglądarek. Edytuj wysiwyg.js, znajdź funkcję generate_wysiwyg(textareaID) i na jej początku wstaw IFa:

function generate_wysiwyg(textareaID) {
 if ((navigator.userAgent.indexOf('Safari') != -1 ) || !document.getElementById || !document.designMode ) 
 {   //no designMode (Safari lies) 
    return;  //leaves standard text box in place 
 } 
  	// Hide the textarea - ciąg dalszy

Dodane: 14.07.2008 przez riklaunim

Openwysiwyg w Django

OpenWYSIWYG i Django

Konqueror i Safari

Podziel się!

Menu

Biblioteki