Hardware, programming and astronomy tutorials and reviews.

Openwysiwyg in Django

A JS wysiwyg

OpenWYSIWYG is one of browser based WYSIWYG editors. Officialy works on IE and mozillas but in my case it works also on opera 9. It's distributed under LGPL license and it can be downloaded from the project website

OpenWYSIWYG and Django

- Extract the archive to your media files folder
- Edid wysiwyg.js and fix the paths to ediotor components:
// Images Directory
imagesDir = "/site_media/icons/";

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

// Popups Directory
popupsDir = "/site_media/popups/";
Where /site_media/ in my case is the media folder name in django.
- In HEAD section of your template add wysiwyg.js:
<script language="JavaScript" type="text/javascript" src="/site_media/wysiwyg.js" />
- In a form add Textareas with id attributes:
<textarea name="textarea1" id="ID">Test</textarea>
		<script language="javascript1.2">
After textarea tag you need to call a function to create a editor for a textarea by given ID. If you want more editors on one page - make some textarea tags with different IDs and call the editor for each one.
- We have to also call in form or submit tag a updateTextArea function (onsubmit and onclick) to get the editor content in the post data (under textarea name request.POST key). For example:
<form action="." method="POST" onsubmit="updateTextArea('ID');">
- Done

Konqueror and Safari

OpenWYSIWYG doesn't work in those browsers. In konqueror it will show a broken editor, which will block all changes. To kill wysiwyg for those browsers edit wysiwyg.js, find function generate_wysiwyg(textareaID) and add an if at start::
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

Python programming, 14 July 2008,

Comment article