Pnuts CC's Blog Flower & World, Life & Paradise.

JS Regex Analysis v0.1

Introduce

RegexAnalysis is a tool designed for helping people reading and understanding regex expression. It's written in javascript and tested in IE6~8, FF, Chrome.

Download

Version V0.1

Features

  • Colorize key words
  • Code folding
  • Highly customizable
  • Block Highlight

Manual

Invoke in javascript

The following coding get the DOM as the result of analysis. The arg could be string or regex.

regexAnalysis.getDOM(arg);

For Example :

var regex = /(abc(?:\(|\[)[^w]{0,10}\[\})\)\\/g;
document.body.append(regexAnalysis.getDOM(regex));

Output :

Feature Manual

Move mouse on the color-bar, the block will be highlighted.

image

Click color-bar, the block would be folded. Another click would cancel folding.

image

Customize

You can customize it by modified regexAnalysis.config.

The following is the default config :

	config : {
		// example : [ 
		//	leftwrap [ prefix, color, bgcolor ],
		//	rightwrap [ prefix, color, bgcolor ],
		//	color, bgcolor,
		//	underline [ bgcolor, border-color, border-width, mouse-over-color, height ]
		//  folder [ folder-text, color, bgcolor, bordercolor ] 
		//  folder only be effective when underline is effective.
		// ]
		"paren" : [ 
			[ "(", 0, "skyblue" ], 
			[ ")", 0, "skyblue" ], 
			0, 0,
			[ "skyblue", "blue", "5px", "rgb(255,255,128)", "4px" ], 
			[ "...", 0, "rgb(230, 230, 255)", "gray"] 
		],
		"bracket" : [ 
			[ "[", 0, "lightgreen" ],
			[ "]", 0, "lightgreen" ],
			0, 0,
			[ "lightgreen", "green", "5px", "rgb(255,255,128)", "4px" ],
			[ "...", 0, "rgb(230, 255, 230)" , "gray"]
		],
		"curly" : [
			[ "{", 0, "#FFB7DD" ],
			[ "}", 0, "#FFB7DD" ],
			0, 0,
			[ "#FFB7DD", "#FF3333", "5px", "rgb(255,255,128)", "4px" ],
			[  "...", 0, "rgb(255, 230, 230)", "gray"] 
		],
		"vertical-bar" : [ [ "|", 0, "orange" ],0, 0, 0, 0, 0, 0, ],
		space : "2px"
	},

config is a object as you see, and most of its attributes are array(Except space). Zero represent none.

paren represent ( ) , bracket represent [ ], curly represent { }, vertical-bar represent |

image

Config.space is the space between two color-bars.

Format of each attribute (array) :

[ leftWrap, rightWrap, color, backgroundColor, underline(color-bar), code-folding ]

The color & backgroundColor effect the text IN the wrap. ( Don't contain the wrap itself. )

leftWrap & rightWrap : ( 0 represent no left/right wrap, for example vertical-bar has no wrap )

image

Format of left/right wrap :

[ wrapText, wrapColor,  wrapBackgroundColor ]

underline / color-bar :

image

Underline Format: [ background-color, border-color, width, mouse-over-color, height ]

Coding Folding:

image

Coding Format: [ folding-text, text-color, background-color, border-color ]

License

It's released under three licenses: MIT, BSD, and GPL. You may pick the license that best suits your development needs.


Comments (159) Trackbacks (2)
  1. With Differenceis number of cashmere sweaters for girls, you can add many different sweater
    models, such as cardigans and pullovers, made to your wardrobe with this material that is upscale.

  2. You are very young Kavya your body will respond very quickly to wholesome
    modifications simply avoid sugar and oily/junk meals you will begin shedding weight from the same week.

  3. Hello po need ko po recommendation ndi ko makuha passport
    ko sa agency.. nag apply ako sa kanila 2013 january..
    umabot ng 3 months lagi sabi could visa na ako puntang bahrain at
    dubai.. nag pidos na nga ako pero ala man ako pinirmahang contract.

  4. You actually make it seem so easy with your
    presentation however I in finding this matter to be really something which I think
    I might never understand. It sort of feels too complex
    and very vast for me. I am looking forward on your next submit,
    I will try to get the dangle of it!

  5. Make it your purpose to provide better oral than the Porn Stars he
    has been watching all his life.

  6. In an exceedingly interesting experiment, two psychiatrists, Claire
    Adams and Mark Leary, analyzed several girls who tried to lose weight.

  7. Currently for every 10 models (tick marks) on your
    needle, you will have 1mg of melanotan 1.

  8. The client agent basically monitors the things theyare
    owed and discounts the remaining of the fee with their customer
    consumer after ending where it’s legitimate.

  9. a2a线上消费平台享受免费购物的乐趣!

    a2a让我们透过两种简易方式累积忠诚积分,兑换免费产品或购物礼券:

    (一) a2a平台有超过6百万种产品让你选择,你也可以透过a2a进入著名的网购平台如Lazada、Zalora、Qoo10、Bonia等消费赚取积分;
    (二) 推荐您的亲朋戚友加入此平台

    不仅如此,您还可以在睡梦中获取源源不断的系统收入!

    欲知详情,请点击此链接:
    http://www.a2a.network/home/?rapid=100035

    Refereral ID : 100035
    WhatsApp : Eric +65 9382 6593

  10. Contractually you’ll be able to stop assignment of the contract to another get together.


Leave a comment