Tag: JavaScript

RegEx Magic – Become the Rain Man of SharePoint Programmers for 40 bucks

Regular Expressions.. the name sounds so, simple. They’re just regular expressions eh? Don’t you know?

Really, what Regular Expression are is a means to adapt stodgy, literal programming to the weird rules that humans come up with. Got a crazy inventory name that starts with 5 alphanumeric characters representing a date but ends in the Valley Girl rendition of your profit margin as matched to a syzygy? Perfect, you need a Regular Expression.

Regular expressions originated in 1956, when mathematician Stephen Cole Kleene described regular languages using his mathematical notation called regular sets.  These arose in theoretical computer science, in the subfields of automata theory (models of computation) and the description and classification of formal languages. Other early implementations of pattern matching include the SNOBOL language, which did not use regular expressions, but instead its own syntax.

A regular expression, often called a pattern, is an expression used to specify a set of strings required for a particular purpose. A simple way to specify a finite set of strings is to list its elements or members. However, there are often more concise ways to specify the desired set of strings.

Unfortunately, Regular Expressions are what make you grow bald spots and suffer chest pains. The problems they solve are so out of wack with computers ideas of what is sensible and orderly, the “regular” expressions that are needed become ridiculous endeavours in backtracking, forward looking, being optimistic, and fuzzy. What the hell..

Fortunately, in the cases where you need to be a cool developer, but not make yourself too much of a human jive-talk translator for the almighty .NET  runtime, there’s the program RegEx Magic:

RegexMagic makes creating regular expressions easier than ever. While other regex tools such as RegexBuddy merely make it easier to work with regular expressions, with RegexMagic you don’t have to deal with the regular expression syntax at all. RegexMagic generates complete regular expressions to your specifications.

First, you provide RegexMagic with some samples of the text you want your regular expression to match. RegexMagic can automatically detect what sort of pattern your text looks like. Numbers, dates, and email addresses are just a few examples of the wide range of patterns that RegexMagic supports. By marking different parts of your samples, you can create regular expressions that combine multiple patterns to match exactly what you want. RegexMagic’s patterns provide many options, so you can make your regular expression as loose or as strict as you want.

Best of all, RegexMagic supports nearly all popular regular expression flavors. Select your flavor, and RegexMagic makes sure to generate a regular expression that works with it. RegexMagic can even generate snippets in many programming languages that you can copy and paste directly into your source code to implement your regular expression.

RegexMagic doesn’t automatically generate regular expressions on magic alone. But it sure makes things a lot easier by allowing you to work with your data instead of the cryptic regex syntax.

Easily Create Regexes with RegexMagic


Introducing TypeScript – Microsoft’s new open source JS language

TypeScript is a language for application-scale JavaScript development.TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. Any browser. Any host. Any OS. Open Source.


Starts from JavaScript, Ends with JavaScript

TypeScript starts from the syntax and semantics that millions of JavaScript developers know today. With TypeScript, you can use existing JavaScript code, incorporate popular JavaScript libraries, and be called from other JavaScript code. TypeScript compiles to clean, simple JavaScript code which runs on any browser, in Node.js, or in any other ES3-compatible environment.


Read the specification in doc or pdf

Discuss and provide feedback on the language.

Play with the bits and file bugs.

Join the #typescript Twitter discussion and follow the CodePlex project.


Tutorial – Best way to get up to speed on TypeScript.

Forums – Great place to get help with using TypeScript.

View Source Chart for IE

Thought i’d share that there’s an IE port of a valuable plugin i’ve used in Firefox for a while, View Source Chart:

Steps to get beautiful, visually sensible HTML source viewing in IE9:
1. Copy the script below and paste it into a new browser bookmark.
2. Click the bookmark from any page to view its source chart.

For other browsers, check the first code block on this page.

About View Source Chart

Cross-browser bookmarklet now available at viewsourcechart.com

Eyesight is the most efficient way for the human brain to process information. By placing visual boundaries where they already exist invisibly, Source Charting enables you to take in DOM structure and hierarchy as fast as your brain possibly can.

When mentally building tag boundaries by reading a tag name, then using manual actions like clicking, finding and scrolling, we experience forced breaks in cognitive processing. As the DOM becomes more complex, more productivity is lost. It doesn’t take long before mentally navigating the DOM becomes impossible.

Source Charting eliminates the need for processing any other way but the fastest: visually. It provides an instant and complete visualization of hierarchical nesting of any tag in the view port.

Source Charting…
* Defines HTML Tag Boundaries (so you don’t have to)
* Defines DOM Structure and Hierarchy (so you don’t have to)

Case In Point: The Misapplication of Flowchart-style UI for DOM Inspectors
DOM inspectors and Folder Viewers have historically (and mistakenly) used flowchart-style GUIs to help users navigate hierarchies. The problem is that this type of GUI is intended to convey sequential movement or flow, not structure.

Because sequence and flow is measured one step at a time, the lines connecting elements in a flowchart-like GUI span only one generation (parent-child). When used to depict complex hierarchical structures like the DOM, the user is forced to inefficiently and inaccurately measure hierarchical nesting levels using white space indentation. (See image #3 above)

It is precisely this subtle but monumental mistake that View Source Chart overcomes.

The only way to visualize structure accurately is to measure hierarchical nesting. This is done simply by pictorially delineating element boundaries, which results in a manifestation of document structure.

For a full de-bugging How-To, visit http://viewsourcechart.com/what-why-how

Cross-browser bookmarklet available at http://viewsourcechart.com/get-the-bookmarklet

SharePoint 2010 Get Current Username / Logged in User

Have been exploring the SharePoint Client Object Model and in particular the Javascript Object Model

While there are methods to get the current user info, you can also simply borrow the logged in username from the top right of the screen:

<script type="text/javascript">// <![CDATA[
 var Username = document.getElementById("zz16_Menu").innerHTML ;
 var end = Username.indexOf("<");
 var nameOnly = Username.substring(8, end);

// ]]></script>

This technique is a little complex for my liking however, so here’s a snappier way to grab the current login name (using Jquery):

var Username = $("#zz16_Menu").text();

Note that the #zz16 identifier will vary based on your Master page. Use the Firefox Web Developer tools or Internet Explorer F12 tools to find out what the ID should be on your SharePoint site.

Using this type of technique is definitely more brittle than actually using a CAML query however in my mind would be more performant than actually doing a lookup in the DB. Would love to know if someone knows the scoop on that..

Update 05/12/2011

As my colleague Colin pointed out – the name that appears on the top right can really be anything and can change – for example if a user gets married and their name changes. A better approach would be to retireve the value programmatically using SPServices ( http://spservices.codeplex.com/wikipage?title=$%28%29.SPServices.SPGetCurrentUser ). As of version v0.6.1, you can also request the ID of the user by specifying fieldName: “ID”.  Much more stable to use in most scenarios:

	fieldName: "ID",
	debug: false