mel syntax highlight greasemonkey for cgtalk

Become a member of the CGSociety

Connect, Share, and Learn with our Large Growing CG Art Community. It's Free!

Thread Tools Display Modes
  02 February 2011
mel syntax highlight greasemonkey for cgtalk

Hello scripters!

As the oh so magic Jelsoft Enterprises Ltd. won't do anything about the crappy code-highlighting in the vBulletin here. I thought we could help ourselfes: We can fix the whole web so we can do it with the code-boxes here too!

I wrote a lot of mel-parsing stuff already but I'm pretty new to JavaScript. So I'm kind of stuck now. But before I end the day I thought I share what I have so far. Maybe I can trigger some more minds and we come up with a all satisfying solution.

For those who don't know: Greasemonkey is a Firefox extension. But these Java Script Userscripts run in other browsers too.

Ok. As I open up Firebug and look at the page here I see all code-boxes come in <pre> tags with the class='alt2'. Actually I've seen no <pre> without class='alt2' and this actually doesn't seem very solid. But nobody would expect anything to change on this board software anyway. Now from each element we get the textContent and split via \n to get each line:

// ==UserScript==
 // @name		   cgtalk code syntax highlighting
 // @namespace
 // @description	"will" pimp cgtalks Code:-boxes with syntax highlighting and links to docs and stuff
 // @include*
 // ==/UserScript==
 var incrementString = "\t";
 var pres = document.getElementsByTagName('pre');
 var codes = new Array();
 for (i = 0, j = 0; i < pres.length; i++)
 	if ( pres[i].className == 'alt2')
 		codes[j++] = pres[i];
 for (i = 0; i < codes.length; i++)
 	var inc = 0;
 	var newLines = '';
 	var lines = codes[i].textContent.split('\n');
 	for (l = 0; i < lines.length; l++)
 			// ...
I think doing this for Mel first is the easiest thing. As we have discrete {brackets} for scoping and a line finishing character;

So here is what I actually want:

  • You might have noticed that the code box always adds a random number of spaces as indentation. Even if you post with tabs. I'd like to make the format of the code just the way you want: Greasemonkey offers GM_getValue("foo") and GM_setValue("boo","foo"). One could use these to setup a indentation string like tab ("\t") or 3 or 4 spaces (" "/" ")?
  • Then one could also make the curly brackets appear at the right place as well. No matter how the code was written?
  • Spaces between + " " + $var would be cool too or between ( and the content ) vs. (this)?
  • then colors for //comments, $vars and "strings" of course and links to the official documentation like ls for example?
  • a copy button. Maybe made with zeroclipboard?
  • lineNumbers?
But I cannot get my head straight rightnow... JS split method seems to only support one delimiter at a time so we cannot split like in Mel here. Maybe someone else has more JS experience and is willing to participate? Maybe there is a JS syntax lib already? but how to load it with a Greasemonkey script?

what do you think?

Last edited by ewerybody : 02 February 2011 at 11:47 PM.
  02 February 2011
Thread automatically closed

This thread has been automatically closed as it remained inactive for 12 months. If you wish to continue the discussion, please create a new thread in the appropriate forum.
CGTalk Policy/Legalities
Note that as CGTalk Members, you agree to the terms and conditions of using this website.
Thread Closed share thread

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Society of Digital Artists

Powered by vBulletin
Copyright 2000 - 2006,
Jelsoft Enterprises Ltd.
Minimize Ads
Forum Jump

All times are GMT. The time now is 03:21 AM.

Powered by vBulletin
Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.