Highlight some parts of the code?

[vjeux]

Hello,

I'm working on a presentation (http://vjeux.github.com/jsCollaborativePresentation/#slide-3) where I show a lot of code. I'd like to do two things:

• Highlight some parts of the code
• Have syntax coloration

Do you know if that's possible to integrate some <strong> tag inside codemirror in order to make it stand out?

Thanks

[iros]

I'm not sure I understand your issue. You want to highlight specific lines of your code? If you put strong tags in them they will be interpreted as part of your code.

The CodeMirror programming API has a way to get at specific lines and set css classnames on specific ranges, but I don't have a particularly good idea of how to specify this per element. You may just have to get access to the editor element and handle the specific highlighting behavior yourself. If that is something you'd like to do, then I would need to think of how to properly give you access to that editor (since you can have many on the page and they don't load until you are at least -1 slide away (for performance reasons.)

Alternatively if enough people think this is an important behavior, I can add an attribute called "highlight-lines" that would take a comma delimited list of numbers and those line numbers would be highlighted.

[vjeux]

I want to highlight specific words from the code.

I found out there was a mark API to do that but it's really painful to work with, you have to give the start/end position with line/char position. Not something I want to do by hand.

I gave up the idea of doing such a thing as its too complicated to setup. Thanks for the help :)

Christopher Chedeau

On 13 sept. 2011, at 19:43, Irene [email protected] wrote:

I'm not sure I understand your issue. You want to highlight specific lines of your code? If you put tags in them they will be interpreted as part of your code.

The CodeMirror programming API has a way to get at specific lines and set css classnames on specific ranges, but I don't have a particularly good idea of how to specify this per element. You may just have to get access to the editor element and handle the specific highlighting behavior yourself. If that is something you'd like to do, then I would need to think of how to properly give you access to that editor (since you can have many on the page and they don't load until you are at least -1 slide away (for performance reasons.)

Alternatively if enough people think this is an important behavior, I can add an attribute called "highlight-lines" that would take a comma delimited list of numbers and those line numbers would be highlighted.

Reply to this email directly or view it on GitHub: https://github.com/iros/deck.js-codemirror/issues/3#issuecomment-2084437

[carpeliam]

I saw this feature on the Google io2011 slides, for example on http://www.htmlfivewow.com/slide12 you can press 'H' to turn highlighting on/off. In the markup they had surrounded highlighted code in a <b> tag. Though I don't have a pressing need myself...

[jimklo]

You could do this with the pull request #17 which I just opened. It gives you access to codemirror editor object from within the setup/cleanup scripts, but suppresses evaluation of the codemirror editor contents. With a handle to the editor, you should be able to use the "mark" API.