posted August 28, 2002 10:28 AM         

which lets you change any textarea field to a WYSIWYG editor field by adding a few bits of code to the page.

I'm trying to mod the Add Field page to include an extra Input type of WYSIWYG, which will then include the necessary code to the Add Events page to bring up the htmlarea field.
However, it's a bit more tricky than I thought, so I wondered if anyone has any pointers to which file(s) I should be looking in - I guess its somewhere in the admin templates, or should I be looking in calendar_admin itself?

posted August 28, 2002 12:19 PM         

Unfortunately I have discovered that the WYSIWYG bit chokes on underscores in a TEXTAREA name - and the format in calendarscript is FIELD_<fieldname>.

Hmm, well when I've figured out a way round it I'll post back with the modified files so everyone can have funky field editing in their calendars!

Ben.

posted August 29, 2002 06:02 AM         

First of all you should download V1.05 from: http://www.interactivetools.com/products/htmlarea/

and install in the document root of your site (if you put it somewhere else you'll have to make a couple of mods to the scripts in my zip file).

Then download the three modified Calendarscript files from: http://www.willcoxonline.com/cs-htmlarea/cs-htmlarea.zip

and copy these into your calendarscript directory, overwriting the existing ones(after backing them up of course!) I have preserved the directory structure in the zip so you know where they go.

And thats it! In the Customise Event Fields screen the Input Type box now has WYSIWYG as an option. If you set a field with this option and go to the Add/Modify Event page you will get a graphical HTML editor so you can bold, underline, justify etc etc. Note: it will only work with IE 5.5 and above (see the htmlarea docs). Oh, and make sure you've allowed HTML in in the Admin/Calendar Settings screen.

Have fun,

Ben.

posted September 01, 2002 07:07 PM         

One of my prospective customers is managing about 25 bands right now. He'd like to be able to not only update a calendar, but also add/delete pages, change page content (text+images, maybe link to soundfiles later on). And all that w/o knowing or wanting to know html. He also can't afford to have all updating and editing done by me, so he's looking for a sollution that would allow him to do just that, log in, and change/add/delete pages and their content.

Would this be the right program? Or their page publisher?

Anybody got any other ideas/links? Anything pointing me in a good direction is very appreciated!

Thanks!
Oliver

posted January 16, 2003 11:42 PM            

Invalid input type: 'wysiwyg'!

Any thoughts?

thanks
ryan

posted January 17, 2003 08:21 AM            

Ben, great work! I'll definitely be patching a few calendars this evening.

Kriis, is it doing anything, giving an error message at all, or just acting like nothing ever happened?

Ryan, I'll look into the search issues when I install it tonight if ben hasn't figured it out by then.

posted January 19, 2003 08:04 PM            

Go to the modified DBFileUtil.inc used for the 'wysiwyg' display and change one line towards the end of it. In the sub GetSearchFieldInput find the line following
# Define input field based on type
which is:

if (($type =~ /^text(?!area)/) | | ($type =~ /^password/) | | ($type =~ /^textarea/)) {

and change it to:

code:

---

if (($type =~ /^text(?!area)/) | | ($type =~ /^password/) | | ($type =~ /^textarea/) | | ($type =~ /^wysiwyg/)) {

---

See if that makes any difference. Be sure to make a backup of the original!

Dan O.

BTW. This forum adds spaces between the | | which will have to be removed before pasting into the script file.

posted January 20, 2003 12:49 AM            

but has anyone figured out how to add the:

margin-top: 0; margin-bottom: 0

properties to the textarea to prevent the enter key doublespacing between lines? I tried putting in the javscript on the page itself, and also in the editor.js.

I can change colors, and fonts, etc..., but i cant change that. Any thoughts?

thanks
ryan

------------------

posted January 20, 2003 03:19 AM         

Can anyone confirm that the mod works with the latest version of HTMLArea? I have only tested it myself with version 1.5.

Thanks,
Ben

posted January 20, 2003 06:34 PM            

I am not getting any errors, the WYSYWIG editor just isn't showing up in the description box and for the life of my I can't figure out why!

I will greatly appreciate any help you offer.

posted January 20, 2003 07:20 PM            

What browser are you using?
Any popup ad killer software running?
Do you have JavaScript turned on in the browser you're using?

Dan O.

posted January 21, 2003 09:30 AM            

/htmlarea
http://206.159.167.123/htmlarea/example.html proves that it does function...

I installed the three modified files into the proper locations within Calendarscript.

When I go to add event, no html shows up... Wait a minute, I bet I have html turned 'off'.

I'll be right back....

Still no dice. I switched 'allow html' to 'on' and tried to 'add event'. The page took 10 times longer to load, but it finally did. However, no WYSWYG options...

What shall I try?

Thanks

posted January 25, 2003 09:54 PM            

margin-top: 0; margin-bottom: 0

properties to the textarea to prevent doublespacing between lines when you hit enter? I tried putting in the javscript on the page itself, and also in the editor.js.

I can change colors, and fonts, etc..., but i cant change that.

thanks
ryan

posted January 27, 2003 03:21 AM         

If you don't set that, it won't do anything!

Ben

posted January 30, 2003 08:40 AM            

Ben,

Do you mean "input type"? The only options I have are: 'text', 'password', 'textarea', and 'selectbox'. Where else can I look?

Thanks

Dave

posted January 31, 2003 01:37 PM            

It sounds like your CalendarScript is not finding the new templates (included with the WYSIWYG plug-in) in the plug-in's directory. You could try uploading them directly to the admin template directory (aftering making a backup of the originals of course).

What CalendarScript version are you running? I know pre-version 3.2 did have some problems with plug-in files. I don't know if that might be a cause or not.

Dan O.

posted January 31, 2003 06:19 PM           

What CalendarScript version are you running? I know pre-version 3.2 did have some problems with plug-in files. I don't know if that might be a cause or not*

posted February 03, 2003 11:06 AM         

Are you using IE 5.5 or above?
Does the HTMLArea demo on the Interactive tools website work for you?

Ben

posted May 03, 2003 11:42 PM            

Thanks, Ben, for this excellent addition!

Laura

------------------
Laura Ruiz
http://www.increDesign.com

posted June 14, 2003 06:43 AM           

All the information I needed was in this thread. Grateful thanks to Ben, TubaDave and DanO.

For the benefit of someone who is reading this for the first time, I'll post a summary of what worked for me...

STEP ONE: Install "HTML Area" Program

- Download "htmlarea" from http://www.interactivetools.com/products/htmlarea/

- Upload the whole folder to the root of your site (or change references Ben's modified files).

- Confirm that it works by navigating to the example file they included (www.yoursite.com/htmlarea/example.html). Note that the current version only works in IE 5.5+ PC.

STEP TWO: UPLOAD MODIFIED CS FILES

- Ben has already made the neccessary code modifications (thanks!). Download the files at http://www.willcoxonline.com/cs-htmlarea/cs-htmlarea.zip

- There's one fix that still needs to be done to the modified files (for the "search" function to work). See DanO's message (to Ryan) on what line of code needs to be adjusted. This fix did work for me by the way (I was getting the error messages and they went away after I changed this line of code).

- Backup your copies of the modified files then upload Ben's replacement files.

STEP THREE: CUSTOMIZE EVENT FIELDS
I totally missed this step when I first installed the program. I went to "Add Events" and nothing was different. You need to do this last step for it to work.

- Select "Customize Event Fields" (upper menu).
- Click "Edit" Button next to "Title"
- Next to Input Type you'll see a popup menu. Change this to "WYSIWYG".
- Click "Save"
- Select "Customize Event Fields" (again)
- Click "Edit" Button next to "Description"
- Change the input type on this one to "WYSIWYG" too.

STEP FOUR: TEST

- NOW try going to "Add Event". You should see have the ability to add bold, color, etc.

- If no luck go to "Calendar Settings" and make sure "Allow HTML" is selected. If still trouble... um, ask Ben, TubaDave, or DanO (I'm just summarizing their brilliant work).

STEP FIVE: COSMETICS (optional)
I tweaked the cosmetics of the "Add Event" page slightly. Here's what I did...

- Select "Customize Event Fields" (upper menu)
- Click "Edit" button next to Title
- I set Size & Maxlength to "50", Rows to "1" & Cols to "50" (this made the title input area a little wider and only one row).

- Select "Customize Event Fields" (upper menu)
- Click "Edit" button next to Description
- I set Size & Rows to "12" (to make the description input box taller).

posted June 14, 2003 06:48 AM           

- Select "Customize Event Fields" (upper menu)
- Click "Edit" button next to Description
- I set Rows to "12" and Cols to "50" (to make the description input box taller).

* if you're a list monitor feel free to correct this in my post.

posted June 14, 2003 08:10 AM           

I found the answer to Ryan's question about how to make the description field "single space" upon return (right now it double-spaces each time you press the return key.

The solution is to add a snippet of code to the "htmlarea" program's "editor.js" file. See...
http://www.interactivetools.com/forum/gforum.cgi?post=3313#3313

posted July 13, 2003 07:56 AM         

"An error occurred in this dialog.
Error: 166
Object expected"

Any clues?

Jamie

posted November 12, 2003 01:49 PM            

I'm sorry but I don't understand what you're asking.

Dan O.

posted October 12, 2004 09:22 AM           

Has anyone been able to get this working with htmlarea 3.0? I've been trying but have had less than no luck.

Works great with 2.x but I want to be able to use non-IE browsers with my calendar. 2.x doesn't let me. 3.0 is supposed to support browsers like Mozilla.

Thanks,

posted October 12, 2004 10:00 AM         

Let me remember what I did, I may forget a step!....

Extract htmlarea V3 into the htmlarea folder as per the old version.
Note that the name of the file has changed from editor.js to htmlarea.js. So you can either make a copy as the old name, or just update the HTML source to point to the new filename e.g. within the add_edit_event.html admin template:

<script language="Javascript1.2" src="/htmlarea/htmlarea.js"></script>

Then the other change you need to make is because the new htmlarea needs the following onload javascript command in the BODY tag:
HTMLArea.replaceAll()

e.g. my BODY tag in the template is:
<BODY onload="HTMLArea.replaceAll()" BGCOLOR="<%=$AdminConfig->get("page-background-color")%>">

And that should just work. Let us know how you get on.

Cheers,
Ben.

posted October 15, 2004 08:17 AM           

Thanks for the reply. I made those two changed to my add_edit_event.html file, and when I click on "Add Event" I get a window with the following error:

WARNING: _editor_url is not set! You should set this variable to the editor files path; it should preferably be an absolute path, like in '/htmlarea', but it can be relative if you prefer. Further we will try to load the editor files correctly but we'll probably fail.

It then takes me to the add event screen where I can enter a title and description, just no WYSIWYG stuff.

Here's the code that contains the _editor_url:

================================
</SCRIPT>

<!-- START : EDITOR HEADER - INCLUDE THIS IN ANY FILES USING EDITOR -->
<script language="Javascript1.2" src="/htmlarea/htmlarea.js"></script>
<script>
// set this to the URL of editor direcory (with trailing forward slash)
// NOTE: _editor_url MUST be on the same domain as this page or the popups
// won't work (due to IE cross frame/cross window security restrictions).
// example: http://www.hostname.com/editor/

_editor_url = "http://acadia/htmlarea/";

</script>

.....

<BODY onload="HTMLArea.replaceAll()" BGCOLOR="<%=$AdminConfig->get("page-background-color")%>">

================================

(FYI: "acadia" is my internal test server. Htmlarea 2.x works fine on this server with the Calendar).

I also tried using _editor_url = "/htmlarea/"; and got the same error. I tried it in both IE and Firefox and got the same error (at least they both act the same now! :-).

Sure there weren't more mod's you had to do? I was hoping it was gonna be as simple as modifying a couple of lines, but in my case it appears it's not enough.

Thanks again for the help.

posted October 15, 2004 08:44 AM         

Hmm I'm racking my brain to see if I have missed anything...

Just looking at my version of the script in the add_edit_event.html, it looks like this:

<!-- ---------------------------------------------------------------------- -->
<!-- START : EDITOR HEADER - INCLUDE THIS IN ANY FILES USING EDITOR -->
<script>
// set this to the URL of editor direcory (with trailing forward slash)
// NOTE: _editor_url MUST be on the same domain as this page or the popups
// won't work (due to IE cross frame/cross window security restrictions).
// example: http://www.hostname.com/editor/

_editor_url = "/htmlarea";
</script>
<script language="Javascript1.2" src="/htmlarea/htmlarea.js"></script>
<style type="text/css"><!--
.btn { BORDER-WIDTH: 1; width: 26px; height: 24px; }
.btnDN { BORDER-WIDTH: 1; width: 26px; height: 24px; BORDER-STYLE: inset; BACKGROUND-COLOR: buttonhighlight; }
.btnNA { BORDER-WIDTH: 1; width: 26px; height: 24px; filter: alpha(opacity=25); }
--></style>
<!-- END : EDITOR HEADER -->
<!-- ---------------------------------------------------------------------- -->

the htmlarea folder is in my webroot, but notice that I don't have a trailing slash, even though I know it says you should include it! Give this a try, it could be the missing tweak that I forgot..:-)

Cheers,
Ben.

posted October 15, 2004 09:05 AM           

I figured out one problem right about the time you posted. In my original 2.x version of add_edit_event.html I had the javascript call to htmlarea.js before the definition of _url_editor.

Notice in what you sent _url_editor is set BEFORE the call to htmlarea.js. Well, flipping those got rid of that error. Hoorah!

Now I've discovered another oddity. I'm not sure if this is htmlarea/calendar related or Firefox related. With 3.0 htmlarea I am able to add an event in IE. With Firefox I see the WYSIWYG editor in Add Event, can type in text, change font, size, bold, etc... everything seems to work great. I set the schedule then add the event.

I went in and approved the event and saw that the Description wasn't present. If I look in my events.txt, it shows the description when I added an event in IE, but not for Firefox:

12 3.0 test with IE <P> </P>\n<P><FONT size=3>This is
another test</FONT> </P>\n<P><STRONG>1 2 3 4 5 6</STRONG> </P> anonymous Anonymous User 1097848274 0 1
13 3.0 test with Firefox anonymous Anonymous User 1097848387 0 1

I'm not sure if this is a problem with how I've implemented 3.0 htmlarea or with my Firefox. I'm using Firefox 0.10.1 PR. It's the latest-and-greatest Firefox; I'm wondering if it's not compatible with this htmlarea.

Huh, just tried adding an event from my Linux box which is running Mozilla 1.4.2. Same problem as I had with Firefox. The actual event description was never added to the events.txt:

14 3.0 Test with Mozilla 1.4.2 anonymous Anonymous User 1097848956 0 1

Pretty curious. Ben, you say you can add an event with Firefox and later see the description when you view the event? If so, what the heck am I doing wrong?

posted October 15, 2004 09:24 AM         

Ah ha! yes I remember now, there does seem to be a bug of some kind with this - the users have not complained about it since I showed them the workaround, so I actually forgot all about it!

The way to do it is once you've entered your text and set the bold italic etc, switch in, then out of html view. (the <> button on the toolbar). Then saving your changes will work. I guess the bug must be in htmlarea, I suppose I should have logged it with Interactive Tools but as I say I forgot all about it!

Cheers,
Ben.

posted October 15, 2004 10:27 AM           

I tend to agree with you that it seems like an htmlarea issue. I'll try to contact the interactivetools.com people to see if they know about this and if there's a fix for it.

Now I just need to add a "Firefox browser users read this FIRST" link on the Add/edit pages so they'll know about the workaround.

Thanks again. I really appreciate it!

posted October 15, 2004 03:04 PM         

quote:

---

How'd you ever stumble across that workaround?

---

I think after a lot of cursing and pulling my hair out! :-)

Thinking more about it though, it would be a very fundamental bug if it was an htmlarea problem, so I wonder if it's a problem with the implementation.
It seems a lot more complicated than the V2, so maybe it's just something else that needs adding to the HTML code, as I only got this far by trial and error! The Forum at interactivetools.com seems pretty good, so it might be worth asking on there.

If you do find anything else out then let us know!

Cheers,
Ben.