Code Editor GUI Component.

Post those lines of code you feel like sharing or find what you require for your project here; or simply use them as tutorials.
christianclavet
Posts: 1638
Joined: Mon Apr 30, 2007 3:24 am
Location: Montreal, CANADA
Contact:

Code Editor GUI Component.

Post by christianclavet »

Hi!

This component was started from the EGUIEditBox, and we added further functionnalities as:

- Linecount with a visibility toggle button GUI
- Custom coding terms (language specific terms, and the application terms)
- Scrolling and caret move as in a real editor (the code that we had, have the caret (cursor) always at the bottom when editing. We improved that by allowing the "caret" to move and scroll only when reaching the top or the bottom of the page.
- A vertical scroller, horizontal scrolling still need you to use the caret (cursor)

Here is a screenshot: (From IRB)
Image

Current limitations:
- the TAB key is not implemented (you need the last SVN, as this is been fixed by Cutealien) to use it properly. Right now it change only the focus
- The component is NOT a code patch. And it's needing a device pointer input (need to create timers for the text cursor (caret))
- This code is not as clean as the IRRlicht code. It's directly taken from our last build of IRB (updated with the help of Lonesome Ducky).
- Only tested on IRRlicht 1.7.2.

EDIT: Updated the code (26/08/2011)
The current example show most of the types of highlighting works as in theses 2 pics:
The main menu displayed here is separate from the interface, but we can do copy/paste/undo operations since you implemented the commands. I show in the example code how to access them from outside the GUI component. We can switch "live" the interface language from english to french. (Would be really easy to add other languages (lating based))

This screen show the example with the english interface and give examples of highlighting:
Image

This screen show the example with the french interface, notice that we can also change the submenu language of the editor
Image

The code was proposed to be included in IrrExt (26/08/2011) (EDIT)-Is now part of IrrExt
The archive will be hosted from my web site for a while.
http://www.clavet.org/files/download/code_editor.zip 3.39Mb
Last edited by christianclavet on Fri Aug 26, 2011 6:31 pm, edited 10 times in total.
christianclavet
Posts: 1638
Joined: Mon Apr 30, 2007 3:24 am
Location: Montreal, CANADA
Contact:

Post by christianclavet »

Removed, see first post
Last edited by christianclavet on Fri Aug 26, 2011 2:34 pm, edited 3 times in total.
christianclavet
Posts: 1638
Joined: Mon Apr 30, 2007 3:24 am
Location: Montreal, CANADA
Contact:

Post by christianclavet »

Removed, see first post
Last edited by christianclavet on Fri Aug 26, 2011 2:34 pm, edited 2 times in total.
serengeor
Posts: 1712
Joined: Tue Jan 13, 2009 7:34 pm
Location: Lithuania

Post by serengeor »

Nice, this might come in handy later on 8)

Oh, and I have a suggestion. You should make those language keywords settable from outside the editor, so it could be configured to highlight any language without modifying its source :wink:
Working on game: Marrbles (Currently stopped).
HerrAlmanack
Posts: 52
Joined: Mon Jun 13, 2011 3:50 pm

Post by HerrAlmanack »

serengeor wrote:Nice, this might come in handy later on 8)

Oh, and I have a suggestion. You should make those language keywords settable from outside the editor, so it could be configured to highlight any language without modifying its source :wink:
yes, i think it is good idea to make software like these as data driven an OOP as possible.
CuteAlien
Admin
Posts: 9643
Joined: Mon Mar 06, 2006 2:25 pm
Location: Tübingen, Germany
Contact:

Post by CuteAlien »

Thanks, real nice code snippet!
IRC: #irrlicht on irc.libera.chat
Code snippet repository: https://github.com/mzeilfelder/irr-playground-micha
Free racer made with Irrlicht: http://www.irrgheist.com/hcraftsource.htm
christianclavet
Posts: 1638
Joined: Mon Apr 30, 2007 3:24 am
Location: Montreal, CANADA
Contact:

Post by christianclavet »

Hi,

Thanks for the comments! Hope that will be useful to someone...

serengeor,
Oh, and I have a suggestion. You should make those language keywords settable from outside the editor, so it could be configured to highlight any language without modifying its source
I would like to add this in the future, but it was not yet implemented. For IRB this was absolutely not critical, as explained in my first post. I will probably add this when we update IRB with the next release of IRRlicht (with the new TAB key functionnalitie)
Current limitations:
- Terms are hard coded. A more flexible way would be to have a command to add terms inside an array
- the TAB key is not implemented (you need the last SVN, as this is been fixed by Cutealien) to use it properly. Right now it change only the focus
- The component is NOT a code patch. And it's needing a device pointer input (need to create timers for the text cursor (caret))
- This code is not as clean as the IRRlicht code. It's directly taken from our last build of IRB.
- Only tested on IRRlicht 1.7.2.
Reiko
Posts: 105
Joined: Sun Aug 16, 2009 7:06 am
Location: Australia

Post by Reiko »

Looks really good. Would love to see something similar to this be added to the engine at some point.
Lonesome Ducky
Competition winner
Posts: 1123
Joined: Sun Jun 10, 2007 11:14 pm

Re: Code Editor GUI Component.

Post by Lonesome Ducky »

This is exactly what I was looking for! I plan on using it with angelscript to allow the user to program in custom video effects in my 2d animator. I also plan on implementing some of things you planned on (e.g the double click select), so would you like me to post the changes I've made if and when I do?
christianclavet
Posts: 1638
Joined: Mon Apr 30, 2007 3:24 am
Location: Montreal, CANADA
Contact:

Re: Code Editor GUI Component.

Post by christianclavet »

Yes, That would be great!

You can do what you want since I'm sharing it with everyone here. I'm happy that you would share back! Would be nice that you add a dictionnary. Instead of the code checking for each word, could check an array that has been input in the class... So it could be used for any scripting language...
Lonesome Ducky
Competition winner
Posts: 1123
Joined: Sun Jun 10, 2007 11:14 pm

Re: Code Editor GUI Component.

Post by Lonesome Ducky »

I was thinking of creating a struct that holds both the keyword and the color for it. Something like:

Code: Select all

struct SKeyword {
   irr::core::stringw _text;
   irr::video::SColor _color;
   bool _allowDifferentCases;
}
It will be added to the dictionary in alphabetic order, and I'll keep an index of where each letter starts so I can search more quickly.
I also want to add tokens to color the entire line (i.e. comments) as well as just a certain section (i.e. things in quotes).

So far, I've brought the frame rate up from 200 (with 1000 lines) to 500 (with 1000 lines) because your clipping test code wasn't properly skipping lines.

Now I'm working on the problem with some fonts where if you put in a word that isn't a keyword, keywords after that are slightly off the word they should be on top of.

EDIT: Okay, custom keywords are implemented, as well as keywords that color the whole line, and color a group (say from one quotation mark to the next or something). Here's a screenshot:
Image

I still have to make the line keywords and group keywords work across multiple lines though. And do a fair bit of optimization.
Do you think it would be a good idea to make an undo/redo system as well for it?
christianclavet
Posts: 1638
Joined: Mon Apr 30, 2007 3:24 am
Location: Montreal, CANADA
Contact:

Re: Code Editor GUI Component.

Post by christianclavet »

Wow! All of that should be good. And undo buffer would be nice also! :)
Yeah, it also happened to me, as the text of overlaid color is really written over the text (up to 3 times), the text buffer is made of "spaces", so if your font has irregular spacing, it would offset the colored text.

As for colors that would take the whole line, does it find a starting point?
Lonesome Ducky
Competition winner
Posts: 1123
Joined: Sun Jun 10, 2007 11:14 pm

Re: Code Editor GUI Component.

Post by Lonesome Ducky »

Yep, so you could have text before a comment. I actually put it's own source code in it to make sure all the formatting is correct, and it is!
The things I've done so far:
-Added custom keywords and colors
-Added function automatically add LUA and C++ keywords
-Improved vertical scrolling
-Current selection stays the same while scrolling and on right click inside the selection
-Added a context menu
-Added an insert mode, toggled with the insert key
-Fixed highlighting on non-square fonts (my method works by moving the rectangle of the keyword based on the width of the previous text)
-Sped up number rendering
-Fixed culling of lines (previously it went through and drew all lines)
-Fully functional undo/redo system
-Double click selects word, triple click selects line
-Right click and drag added
-Automatically scrolls to cursor instead of one line at a time
-Made cursor vertical (Personal preference, can easily be changed back)

So the only things I have left to do now are to fix the horizontal scrollbar and only update keywords when a line is changed and I'll post it here. The only problem is that my revisions really don't play nicely with word-wrap.
I have to say, you coded it perfectly for an undo system. All I had to do was record what was inserted into the text and what it was before. Simple, fast, and takes very little memory
Lonesome Ducky
Competition winner
Posts: 1123
Joined: Sun Jun 10, 2007 11:14 pm

Re: Code Editor GUI Component.

Post by Lonesome Ducky »

I've been a bit slow on releasing this, but here's the code with my revisions and additions: http://dl.dropbox.com/u/4241114/CodeEditor.zip
All changes should be listed above.
christianclavet
Posts: 1638
Joined: Mon Apr 30, 2007 3:24 am
Location: Montreal, CANADA
Contact:

Re: Code Editor GUI Component.

Post by christianclavet »

Thanks Lonesome Ducky. How can we propose this for IRREXT?
Post Reply