How-To: Paste Large Code Libraries in Designer
In response to yesterday's post I dared somebody to paste the contents of TinyMCE's main source code file in to a Script Library element in Domino Designer. They would have had a shock (as somebody did) when it crashed Domino Designer. The reason - I'm guessing - is that Domino doesn't like long lines in there.
If you open the file in a text editor, like TextPad, which shows line numbers, you'll see there only nine lines in it. The first eight are comments and then there's one line with 94,000 characters in it. Now, that's what I call a long line! I don't blame Notes for choking on it.
Like many other developers of free JavaScript libraries, they've used a code obsufucator (or however you say it) to stop us seeing the source (or maybe to shrink the file size, I'm not sure). This isn't the only time I've seen code on one long line that I've needed to place in a JavaScript Library. Hence, I've learnt the painful way that it always crashes. Worry not though - there's a workaround.
All we need to do is open the file in a text editor and break it down to a sensible number of lines. To do this I use TextPad's Search/Replace feature, as below:
In effect this inserts a line break before all occurrences of the word "function". I chose this keyword as it's a safe place to break a line of code (adding line breaks in the middle of variable names might cause problems) and there are probably enough occurrences of this word to break it down in to lots of lines.
The resulting JS file is a more sensible 139 lines long, the longest of which is about 12k chars. You can now "safely" paste this in to a Library, without screwing your face up in anticipation of an impending crash.
Note 1: You could go through the file manually and add lots of new lines by hand. Rather you than me though.
Note 2: When you save the pasted code you're likely to see some compile errors. In the case of TinyMCE's code not all occurrences of the word "function" are actually a new function! Take the following line for example:
if(eval("typeof("+templateFunction+")")You don't want a break in the middle of that! So, whenever the compiler finds a problem you just need to remove the new line that has been added.
Note 3: You can of course use some simple hackery to add the .js file as a File Resource or an Image Resource. But, not only is this bad practice it's also got its own problems. When you do this Domino doesn't tell the browser the correct content-type for the file. Some browser don't like this and so it's best to keep the JavaScript in a code library.
Notes 4: Notice that I've checked "Regular Expressions" in the replace dialog. Without this you would get a literal "\n" and still only one line (that's even longer than before)!
Skip to the 
You can subscribe to an individual
Once again, a plan so cunning you could pin a tail on it and call it a fox.
If you change your search to }function and replace with }\nfunction your less likely to cause a break in a bad spot.
Or enable 'match case' and it will not find xxxFunction....
When I downloaded TinyMCE there was a file called tiny_mce_src.js which is the same as tiny_mce.js but without the obscured code...
Of course, now that you've shown us what YOU did, you could post it for us so we can just rip off the file itself, instead of only ripping off the technique ;)
Good one, Jake!
Declan. You can use that file instead but it's 125kb compared to 92kb for the one-line version.
Rock. Will do. I'll update the Zip file that was posted on yesterday's blog and post a new version.
Steve and Patrick. Thanks, you're right. There must be a perfect regexp for this...? Hang on and I'll report back.
Jake, speaking of yesterdays post, did you notice the comments are broken? You're last post is cut off and the form looks to be truncated.
Thanks Lance. Somebody mentioned that yesterday but I didn't see it and thought it must be user error. Turns out it was IE-only. I'd accidentally entered "<script>" thinking it would translate to text. As I was logged in as Admin it remained HTML! Doh!!
Interesting. Replace the \n with a \f (form feed) and it "works" even "better". The text appears to still be on one line but you can paste it in to Domino without a crash and save it without compile errors. The weird side-effect is that, when you open the Library to edit it looks like there's only a little text in there. But looking at the properties you can see it's 92KB! and it gets sent to the browser as you'd expect and everything works. Weird.
You can download a version of the TinyMCE db with these libraries here.
If I had more time to spend on this I'd maybe look for the Unicode char needed to break the lines down without breaking the JavaScript.
BTW: I looked for a better RegExp to split the page on each occurrence of "function" but there are other scenarios to cater for, such as the word function in an alert() box string. It's just not worth it. Consider a big line drawn beneath this ;-)
Jake,
When are you going to convert the add comments box to use TinyMCE or is that in the cards?
Not going to Michael. No point really. All I can let you do is add bold/italic and basic styling. You can add emphasis in other ways. Like \this\ or *this* or THIS if you're angry with me ;-0
Off Topic, you had published a blog/article where you said you where starting to move to a new dev system/language, but can't find it. Can you point it to me?
Is there a way to import a huge hunk of files into the file resources and maintain the directory structure they were in without editing each and every one ?
You can probably write some API trickery to do it Lance. Apart from that, I'm not sure. Maybe this will help? {Link}
Maybe I'm missing something because I haven't tried it, but surely adding a newline after every occurence of open squiggly bracket would work well. Since it is valid to have whitespace after the bracket in all cases.
The only thing you're missing is the gold star you deserve Gareth!
I was never able to get HTMLArea to work so I selected to use the Notes client interface for users to make contributions to the Intranet. To is working very well for many of my clients. However, I now have an application where I will need to have contributions collected via a web browser.
My first question is how do these web browser HTML interfaces work with the Notes Client, i.e., how does a Notes client see the web contributors markup via a richtext field or a text field with the html?
Well, I'll own up, there is maybe one occurence that could break things - Regular Expressions,
You can use squiggly bracket in those, but I think you might get away with newlines there too.
Oh, and any in quoted strings - but to be honest it would be easy to spot and correct!
I use TinyMce also. I ran a "tidy" program over the code before adding it a library. I needed to make a few tweaks to the code for it to work successfully in Domino.
Why not use a bit more complicated regexp and backreferencing (most regexp tools can do it) to get only appropriate "function" keywords?
Something like that:
Find what:
([^a-zA-Z0-9_$])function
Replace with:
\1\nfunction
where parenthesis is used for grouping and backreferencing, and \1 refers to first matched subexpression (syntax may vary in different regexp tools).
Now you only consider "function" word which isn't a part of an identifier (variable name)
I see I'm just a few steps behind everyone else on finding this TinyMCE thing.
Question: Is there a reason why noone wants to just put the TinyMCE files into your Domino/HTML folder? Sure, it's not as portable, but it sure would save a lot of the hassle you guys going through.
Also,
I know that some (if not most) browsers can handle GZIP'd files. Anyone know if perhaps we can shrink down the DL of TinyMCE by GZipping all the files? I'm not certain how/where it would be possible to store it, but it would definately help with the bandwidth problem. I could be wrong- perhaps .JS files might not be supported through the GZip readable files.
MoGryph. That's how I do it (Domino\HTML directory) and I'd recommend anybody who is able to does the same. Makes things so much easier. Not only to upgrade it but also to use in more than one app.
Gzipping and Domino? Seen Web Booster? {Link}
Excuse me for being "not knowing", but when I've downloaded TinyMCE, what of all the stuff in the extracted zip-file do I have to put in the HTML directory...? In some sort of directory structure...?
If I'm not sure what type (simple, adv) I wan't to use in different db's, how do I put'em all up and how do I ref them afterwards...?
Oooh, feel kind of embarrassed...
Gustaf. Just upload the whole unzipped folder to your server. Then reference it as normal.