27 replies to this topic

[hugelmopf]

I was getting tired of pasting snippet code from the Etomite manager into a syntax highlighting editor everytime I wanted to edit it, so I looked for an inline syntax highlighter to implement in the manager's snippet section. I found Helene to be the only application capable of this. See attached screenshot for how it looks.

To implement it, you have to:

1. Decompress the attached helene.zip into your manager/media/ directory (this should create the directory manager/media/helene/ with 5 files.
2. Change the "<textarea...>" line at the bottom of "manager/actions/dynamic/mutate_snippet.dynamic.action.php" and insert the Helene lines after it as indicated below:

...
  </table>
  <textarea name="post" style="width:100%; height: 80px;" onChange='documentDirty=true;'><?php echo htmlspecialchars($content['snippet']); ?></textarea><br />

  <!-- Start of Helene PHP syntax highlighter -->
  <input type="button" name="clear" value="Clear" onClick="editor.setContents('');">
  <input type="button" name="save" value="Save to Textarea" onClick="mutate.post.value = editor.getContents().replace(/\<\?/,'').replace(/\?\>/,'');">
  <input type="button" name="load" value="Load from Textarea" onClick="editor.setContents('\<\?'+mutate.post.value+'\?\>');">
  <script src="./media/helene/highlight.js"></script>
  <script src="./media/helene/editor.js"></script>
  <iframe name="editor" src="./media/helene/editor.html" style="width: 100%; height: 270px;"></iframe>
  <!-- End of Helene PHP syntax highlighter -->

  <input type="submit" name="save" style="display:none">
  </div>
</form>

Now you will have two textareas, one small one being the original one and a bigger one for editing. With the buttons in between you can copy the text between the two areas. I have unfortunately not yet found a more comfortable way to integrate Helene (especially not just replacing the original textarea with a syntax highlighted one), but will post here, if I find one.

Disclaimer: Only tested on Firefox so far.

PS: I have seen the "Syntax-Highlighting in Resources" thread, but I don't understand how his suggestions are supposed to work. It didn't work for me, and since there was no more activity in that thread, I guess it doesn't?

Attached Files

•  helene.png   67.96K   453 downloads
•  helene.zip   14.67K   146 downloads

Edited by hugelmopf, 27 August 2005 - 05:53 PM.

[Hans]

Thanks!! Works great in Maxton (=IE) too, exept that I had to point to /manager/helene instead of /media

[hugelmopf]

Thanks!! Works great in Maxton (=IE) too, exept that I had to point to /manager/helene instead of /media

I'm sorry, that was a typo in step one of the installation instructions, which I just corrected.
The helene folder should be under "manager/media/", because that is also, where the WYSIWYG editors are, I guess.

[jaredc]

I have unfortunately not yet found a more comfortable way to integrate Helene (especially not just replacing the original textarea with a syntax highlighted one), but will post here, if I find one.

Oh I hope you find one. I LOVE syntax highlighting. It basically the only reason I use Dreamweaver - that and the built in ftp. So I guess that confirms it... I'm lazy

Great find. It will be super to have ONE field to use.

[Ralph]

This is exactly what I have been looking for recently... Nothing bugs me more than not knowing which line of a snippet is line 47 or whichever... I'll definitely be doing some testing to see how limber Helene really is... :betterwink:

[Mark Kaplan]

You could just wrap all the buttons and the initial test area in a div, add display:none to the style and then when the document is saved execute this js function

mutate.post.value = editor.getContents().replace(/\<\?/,'').replace(/\?\>/,'');

Edited by MARKSVIRTUALDESK, 27 August 2005 - 06:40 PM.

[hugelmopf]

I have to admit, that I am not really satisfied with above solution, but have not found a better one.
The Helene code is being rewritten right now, to directly turn textareas into syntax highlighted ones, so let's see what this turns out to be.

What I do as a workaround instead of editing php in the <textarea> is the following:

Have a directory where I store all my "custom" snippets, e.g. assets/snippets and then just place the following as snippet code:

include('assets/snippets/TheSnippet.php');
return $returnstring;

I put all snippet code in files in this directory, wrap <? and ?> around them and remove the return $returnstring;
So now I can directly open them via FTP in my favourite editor (which is "kate" btw), which means I have all my syntax highlighting, shortcuts and whatever.
Much easier working with them snippets, I can tell you.

[gtatler]

Great ! Works a treat in "Advanced Browser".

I have amended the size of the text area as follows

<textarea name="post" style="width:100%; height: 180px;

which gives a nore manageable display.

[gtatler]

Further testing using ET 0.6.0

Works in Advanced Browser, Firefox, Ace Explorer, Internet Explorer, Netscape and Enigma.

Edited by gtatler, 16 September 2005 - 10:31 AM.

[gtatler]

Errrrrrr - I've got a funny one.

All works fine when viewing a snippet, but it seems to have stopped the ability to save the snippet ! It just sits there looking at me and doing absolutely nothing at all !

Any thoughts ?

p.s. carried out installation instructions as per above, but have now temporarily disabled.

[_rasel^]

Fast Syntax Highlighter (FSHL): http://hvge.sk/scripts/fshl/
On-line test: http://hvge.sk/scripts/fshl/online/

Edited by _rasel^, 17 August 2006 - 06:12 AM.

[Pelleke]

Fast Syntax Highlighter (FSHL): http://hvge.sk/scripts/fshl/
On-line test: http://hvge.sk/scripts/fshl/online/

It seems you just don't get the point; we are talking about syntax highlighting while editing snippets, a thing your program doesn't seem to be capable of...

Edited by pelleke, 30 August 2006 - 02:41 PM.

[Bjarne]

Errrrrrr - I've got a funny one.

All works fine when viewing a snippet, but it seems to have stopped the ability to save the snippet ! It just sits there looking at me and doing absolutely nothing at all !

Any thoughts ?

p.s. carried out installation instructions as per above, but have now temporarily disabled.

This looks really promising. But I have the same problem. Unable to save the snippet.

There is also another weakness. When you hit "Save to textarea" it updates the textarea, but if I then edit more, and hit "Save to textarea" again, nothing happens. So if I want to continue editing after the first save, I have to hit "Load from textarea" again, after hitting "Save from textarea".

[elephant]

This looks really promising. But I have the same problem. Unable to save the snippet.

There is also another weakness. When you hit "Save to textarea" it updates the textarea, but if I then edit more, and hit "Save to textarea" again, nothing happens. So if I want to continue editing after the first save, I have to hit "Load from textarea" again, after hitting "Save from textarea".

Has anybody progressed this issue ?

I noticed another syntax highlight thread, centered around editarea.

Anyone got a recommendation which one is better.

TIA

[Randy]

Hi,

I've been using edit_area for a long long time. I works very, very well. Hanging indents, smart tabs, search and replace, etc.

Send me a PM and I'll let you know how to configure.

I'm hoping to try and convince Ralph to integrate into 0614. We'll see.

[Ralph]

I'm all for considering any code editor that doesn't slow me down... By that I mean that it needs to perform quicker than the ones I have tested to date... Some of them have navigated so slowly that I have grown frustrated in seconds and removed them from my system... Others had one downfall or another that left me less than impressed... For example, some of the code highlighters don't even have an edit mode, making them useless - at least for my needs... Due to these limitations I almost always use my favorite editor, Kate, for working on code and then rely on cut and paste... Or, for internally developed work, conceptualized on my intranet, I link to the external test file from within the snippets and then migrate the code into the database once it is completed...

[elephant]

I'm all for considering any code editor that doesn't slow me down... By that I mean that it needs to perform quicker than the ones I have tested to date... Some of them have navigated so slowly that I have grown frustrated in seconds and removed them from my system... Others had one downfall or another that left me less than impressed... For example, some of the code highlighters don't even have an edit mode, making them useless - at least for my needs... Due to these limitations I almost always use my favorite editor, Kate, for working on code and then rely on cut and paste... Or, for internally developed work, conceptualized on my intranet, I link to the external test file from within the snippets and then migrate the code into the database once it is completed...

Ralph/Randy,

Although it would be nice too have, I also edit offline most of the time, so it is not essential and not-ON if it will slow down / bloat.

I grabbed copies of helene and editarea. The former looks nice and light, but editarea seems to have alot of files.

Randy, is there a minimalist editarea config ?

Cheers

Sean

[Randy]

Hi Sean,

There are five difference 'include' options available. Two of them use gzip compression which is still buggy in IE. In Firefox the gz load times vs. the vanilla load was imperceptible to me. Given the unpredictable nature of compressed http (gzip) in various browsers, I've elected to stay with the out-o-the-box config. That said...

I've been using editarea all along. I'm not sure how 'slow' is being measured, but it takes less that a second to load and highlight the code. Pg Dn/Pg Up are immediate. Search for text..immediate, resize editor window (I operate at 1900X1200) and redraws with highlighted code instantly. Toggle highlights on/off - immediate. Site location (local / remote) makes ZERO difference in load time. Operationally it's all client side so once it is loaded the location won't matter. So I'll continue to use it.

In fact, I'm patching Etomite 0614 (the development version) to include editarea as the code editor. This will be an option. You will have the choice to turn it on or off. Just like the document editor is now. The difference is there will be no configuration options available like there is for the document editor.

Ralph will test and determine whether this stays in or gets taken off the punch list.

[Ralph]

I am just in the process of testing EditArea in the 0614 code base and the lag when doing a test edit of the Copyright snippet, which is only 105 lines long, is terrible... But maybe it's just me... I'm just not used to waiting for the editor to decide what it's doing so I have control again... And, as an example, I add a blank line at line 5 and when I attempt to delete that extra line I get bounced down to line 94 and have to scroll all the way back to the top... These were the exact same reasons I was displeased with this code editor before... There was something else that was happening when I tested it before but I can't remember what it was right now... I'll try to play with it more to see if either I can figure it out or determine that it must have been fixed... I know it was a biggie like trashing code when you least expected it to...

[Randy]

Ok...I've not been plagued by any of these things. If we're talking about the same lag (javascript loading), it takes less than a second for me. The JS file is ~20K that is downloaded and then run in order to render the code highlighting. Perhaps my broadband connection and quick computer makes this appear better to me than to most. AFAIK this is the best of breed.

I was hoping I wouldn't have to put these hacks into every deployment independently. I'll understand and respect your decision if you want to rollback the mod.