Bug 463712 - [HTML] Improve HTML syntax highlighting

-Added matching for HTML attributes
-Added default styling for HTML attributes
-Added a LHS menu option
-Changed wording a bit to conform to the set standard
-Added a new exclusion item for CSS, Java and JS

Change-Id: Icf187f66ed48b8ad90db35cf33b5e6e9b8a010e0
Signed-off-by: Umar Bolatov <ubolatov@ca.ibm.com>
diff --git a/bundles/org.eclipse.orion.client.editor/web/orion/editor/stylers/text_html/syntax.js b/bundles/org.eclipse.orion.client.editor/web/orion/editor/stylers/text_html/syntax.js
index e785982..a421a74 100644
--- a/bundles/org.eclipse.orion.client.editor/web/orion/editor/stylers/text_html/syntax.js
+++ b/bundles/org.eclipse.orion.client.editor/web/orion/editor/stylers/text_html/syntax.js
@@ -12,6 +12,29 @@
 /*eslint-env browser, amd*/
 define("orion/editor/stylers/text_html/syntax", ["orion/editor/stylers/application_javascript/syntax", "orion/editor/stylers/text_css/syntax", "orion/editor/stylers/application_xml/syntax"], //$NON-NLS-3$ //$NON-NLS-2$ //$NON-NLS-1$ //$NON-NLS-0$
 	function(mJS, mCSS, mXML) {
+	var attributes = [
+		"accept-charset", "accept", "accesskey", "action", "align", "alt", "async", "autocomplete", "autoplay", "autosave",
+		"bgcolor", "border", "buffered",
+		"challenge", "charset", "checked", "cite", "class", "codebase", "code", "color", "colspan", "cols", "contenteditable", "content", "contextmenu", "controls", "coords",
+		"data-[A-Za-z]+", "data", "datetime", "default", "defer", "dirname", "dir", "disabled", "download", "draggable", "dropzone",
+		"enctype",
+		"formaction", "form", "for",
+		"headers", "height", "hidden", "high", "hreflang", "href", "http-equiv",
+		"icon", "id", "ismap", "itemprop",
+		"keytype", "kind",
+		"label", "language", "lang", "list", "loop", "low",
+		"manifest", "maxlength", "max", "media", "method", "min", "multiple",
+		"name", "novalidate",
+		"open", "optimum",
+		"pattern", "ping", "placeholder", "poster", "preload", "pubdate",
+		"radiogroup", "readonly", "rel", "required", "reversed", "rowspan", "rows",
+		"sandbox", "scope", "scoped", "seamless", "selected", "shape", "sizes", "size", "span", "spellcheck", "srcdoc", "srclang", "srcset", "src", "start", "step", "style", "summary",
+		"tabindex", "target", "title", "type",
+		"usemap",
+		"value",
+		"width",
+		"wrap"
+	]
 
 	var grammars = [];
 	grammars.push.apply(grammars, mJS.grammars);
@@ -43,11 +66,30 @@
 					{include: "orion.js"} //$NON-NLS-0$
 				]
 			},
+			{
+				begin: "</?[A-Za-z0-9]+", //$NON-NLS-0$
+				end: "/?>", //$NON-NLS-0$
+				captures: {
+					0: {name: "meta.tag.xml"}, //$NON-NLS-0$
+				},
+				name: "meta.tag.xml", //$NON-NLS-0$
+				patterns: [
+					{include: "orion.xml#comment"}, //$NON-NLS-0$
+					{include: "orion.lib#string_doubleQuote"}, //$NON-NLS-0$
+					{include: "orion.lib#string_singleQuote"}, //$NON-NLS-0$
+					{include: "#attribute"} //$NON-NLS-0$
+				]
+			},
 			{include: "orion.xml#comment"}, //$NON-NLS-0$
 			{include: "orion.xml#doctype"}, //$NON-NLS-0$
-			{include: "orion.xml#tag"}, //$NON-NLS-0$
 			{include: "orion.xml#ampersandEscape"} //$NON-NLS-0$
-		]
+		],
+		repository: {
+			attribute:{
+				match: "\\b(?:" + attributes.join("|") + ")\\b", //$NON-NLS-2$ //$NON-NLS-1$ //$NON-NLS-0$
+				name: "meta.tag.html.attribute" //$NON-NLS-0$
+			}
+		}
 	});
 	return {
 		id: grammars[grammars.length - 1].id,
diff --git a/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeBuilder.js b/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeBuilder.js
index 69bbe1d..566dd45 100644
--- a/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeBuilder.js
+++ b/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeBuilder.js
@@ -26,9 +26,9 @@
 	var protectedThemes = [];
 	var defaultColor = "#ff80c0";
 	var htmlExclusions = [];
-	var jsExclusions = ["editorThemePropertyName", "editorThemeMetaTag"];
-	var javaExclusions = ["editorThemeColorEntityColor", "editorThemeFunctionParameterColor", "editorThemePropertyName", "editorThemeMetaTag"];
-	var cssExclusions = ["editorThemeColorEntityColor", "editorThemeControlColor", "editorThemeOperatorColor", "editorThemeFunctionParameterColor", "editorThemeMetaTag"];
+	var jsExclusions = ["editorThemePropertyName", "editorThemeMetaTag", "editorThemeMetaTagAttribute"];
+	var javaExclusions = ["editorThemeColorEntityColor", "editorThemeFunctionParameterColor", "editorThemePropertyName", "editorThemeMetaTag", "editorThemeMetaTagAttribute"];
+	var cssExclusions = ["editorThemeColorEntityColor", "editorThemeControlColor", "editorThemeOperatorColor", "editorThemeFunctionParameterColor", "editorThemeMetaTag", "editorThemeMetaTagAttribute"];
 
 	var scopeList = [
 		{
@@ -42,7 +42,7 @@
 			id:"editorThemeBackground", //$NON-NLS-0$
 			value:defaultColor
 		},{
-			display:"font-color", //$NON-NLS-0$
+			display:"font color", //$NON-NLS-0$
 			objPath:["styles.color"], //$NON-NLS-0$
 			id:"editorThemeColor", //$NON-NLS-0$
 			value:defaultColor
@@ -117,17 +117,22 @@
 			id:"editorThemeDocumentationTask", //$NON-NLS-0$
 			value:defaultColor
 		},{
-			display:"CSS - Property name color",//$NON-NLS-0$
+			display:"CSS property name color",//$NON-NLS-0$
 			objPath:["styles.support.type.propertyName.color"], //$NON-NLS-0$
 			id:"editorThemePropertyName", //$NON-NLS-0$
 			value:defaultColor
 		},{
-			display:"HTML - Tag",//$NON-NLS-0$
+			display:"HTML tag",//$NON-NLS-0$
 			objPath:["styles.meta.tag.color"], //$NON-NLS-0$
 			id:"editorThemeMetaTag", //$NON-NLS-0$
 			value:defaultColor
 		},{
-			display:"Selection Background",//$NON-NLS-0$
+			display:"HTML attribute",//$NON-NLS-0$
+			objPath:["styles.meta.tag.attribute.color"], //$NON-NLS-0$
+			id:"editorThemeMetaTagAttribute", //$NON-NLS-0$
+			value:defaultColor
+		},{
+			display:"selection Background",//$NON-NLS-0$
 			objPath:["styles.textviewContent ::selection.backgroundColor", "styles.textviewContent ::-moz-selection.backgroundColor", "styles.textviewSelection.backgroundColor", "styles.textviewSelectionUnfocused.backgroundColor"], //$NON-NLS-3$ //$NON-NLS-2$ //$NON-NLS-1$ //$NON-NLS-0$
 			id:"editorSelection", //$NON-NLS-0$
 			value:defaultColor
diff --git a/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeVersion.js b/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeVersion.js
index 8d0f1c4..6d4f65d 100644
--- a/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeVersion.js
+++ b/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/ThemeVersion.js
@@ -14,7 +14,7 @@
 	/**
 	 * Version string for theme data. Please update this string whenever you change the style of a themable element.
 	 */
-	var THEMES_VERSION = "6.65";
+	var THEMES_VERSION = "6.75";
 
 	return THEMES_VERSION;
 });
diff --git a/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/editor/ThemeData.js b/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/editor/ThemeData.js
index 5cc6110..c193aac 100644
--- a/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/editor/ThemeData.js
+++ b/bundles/org.eclipse.orion.client.ui/web/orion/widgets/themes/editor/ThemeData.js
@@ -47,10 +47,10 @@
 

 			this.styles = [];

 			

-			var prospecto = {"className":"prospecto","name":"Prospecto","styles":{"annotationLine":{"currentLine":{"backgroundColor":"#EAF2FE"}},"annotationRange":{"currentBracket":{"backgroundColor":"#00FE00"},"matchingBracket":{"backgroundColor":"#00FE00"},"matchingSearch":{"backgroundColor":"#c3e1ff","currentSearch":{"backgroundColor":"#53d1ff"}},"writeOccurrence":{"backgroundColor":"#ffff00"}},"backgroundColor":"#ffffff","color":"#151515","comment":{"color":"#3C802C"},"constant":{"color":"#9932CC"},"entity":{"name":{"color":"#98937B","function":{"color":"#67BBB8","fontWeight":"bold"}},"other":{"attribute-name":{"color":"#5F9EA0"}}},"fontFamily":defaultFont,"fontSize":defaultFontSize,"keyword":{"control":{"color":"#CC4C07","fontWeight":"bold"},"operator":{"color":"#9F4177","fontWeight":"bold"},"other":{"documentation":{"color":"#7F9FBF","task":{"color":"#5595ff"}}}},"markup":{"bold":{"fontWeight":"bold"},"heading":{"color":"#0000FF"},"italic":{"fontStyle":"italic"},"list":{"color":"#CC4C07"},"other":{"separator":{"color":"#00008F"},"strikethrough":{"textDecoration":"line-through"},"table":{"color":"#3C802C"}},"quote":{"color":"#446FBD"},"raw":{"fontFamily":"monospace", "html": {"backgroundColor": "#E4F7EF"}},"underline":{"link":{"textDecoration":"underline"}}},"meta":{"documentation":{"annotation":{"color":"#7F9FBF"},"tag":{"color":"#7F7F9F"}},"preprocessor":{"color":"#A4A4A4"},"tag":{"color":"#CC4C07"}},"ruler":{"annotations":{"backgroundColor":"#ffffff"},"backgroundColor":"#ffffff","overview":{"backgroundColor":"#ffffff"}},"rulerLines":{"color":"#CCCCCC"},"string":{"color":"#446FBD","interpolated":{"color":"#151515"}},"support":{"type":{"propertyName":{"color":"#9F4177"}}},"textviewContent ::-moz-selection":{"backgroundColor":"#b4d5ff"},"textviewContent ::selection":{"backgroundColor":"#b4d5ff"},"textviewLeftRuler":{"borderRight":"1px solid transparent"},"textviewRightRuler":{"borderLeft":"1px solid transparent"},"textviewSelection":{"backgroundColor":"#b4d5ff"},"textviewSelectionUnfocused":{"backgroundColor":"#b4d5ff"},"variable":{"language":{"color":"#7F0055","fontWeight":"bold"},"other":{"color":"#E038AD"},"parameter":{"color":"#D1416F"}}}};

+			var prospecto = { "className":"prospecto", "name":"Prospecto", "styles":{ "annotationLine":{ "currentLine":{ "backgroundColor":"#EAF2FE" } }, "annotationRange":{ "currentBracket":{ "backgroundColor":"#00FE00" }, "matchingBracket":{ "backgroundColor":"#00FE00" }, "matchingSearch":{ "backgroundColor":"#c3e1ff", "currentSearch":{ "backgroundColor":"#53d1ff" } }, "writeOccurrence":{ "backgroundColor":"#ffff00" } }, "backgroundColor":"#ffffff", "color":"#151515", "comment":{ "color":"#3C802C" }, "constant":{ "color":"#9932CC" }, "entity":{ "name":{ "color":"#98937B", "function":{ "color":"#67BBB8", "fontWeight":"bold" } }, "other":{ "attribute-name":{ "color":"#5F9EA0" } } }, "fontFamily":defaultFont, "fontSize":defaultFontSize, "keyword":{ "control":{ "color":"#CC4C07", "fontWeight":"bold" }, "operator":{ "color":"#9F4177", "fontWeight":"bold" }, "other":{ "documentation":{ "color":"#7F9FBF", "task":{ "color":"#5595ff" } } } }, "markup":{ "bold":{ "fontWeight":"bold" }, "heading":{ "color":"#0000FF" }, "italic":{ "fontStyle":"italic" }, "list":{ "color":"#CC4C07" }, "other":{ "separator":{ "color":"#00008F" }, "strikethrough":{ "textDecoration":"line-through" }, "table":{ "color":"#3C802C" } }, "quote":{ "color":"#446FBD" }, "raw":{ "fontFamily":"monospace", "html":{ "backgroundColor":"#E4F7EF" } }, "underline":{ "link":{ "textDecoration":"underline" } } }, "meta":{ "documentation":{ "annotation":{ "color":"#7F9FBF" }, "tag":{ "color":"#7F7F9F" } }, "preprocessor":{ "color":"#A4A4A4" }, "tag":{ "color":"#CC4C07", "attribute": { "color":"#ED0C8C" } } }, "ruler":{ "annotations":{ "backgroundColor":"#ffffff" }, "backgroundColor":"#ffffff", "overview":{ "backgroundColor":"#ffffff" } }, "rulerLines":{ "color":"#CCCCCC" }, "string":{ "color":"#446FBD", "interpolated":{ "color":"#151515" } }, "support":{ "type":{ "propertyName":{ "color":"#9F4177" } } }, "textviewContent ::-moz-selection":{ "backgroundColor":"#b4d5ff" }, "textviewContent ::selection":{ "backgroundColor":"#b4d5ff" }, "textviewLeftRuler":{ "borderRight":"1px solid transparent" }, "textviewRightRuler":{ "borderLeft":"1px solid transparent" }, "textviewSelection":{ "backgroundColor":"#b4d5ff" }, "textviewSelectionUnfocused":{ "backgroundColor":"#b4d5ff" }, "variable":{ "language":{ "color":"#7F0055", "fontWeight":"bold" }, "other":{ "color":"#E038AD" }, "parameter":{ "color":"#D1416F" } } } };			

 			this.styles.push(prospecto);

 	

-			var darker = {"className":"darker","name":"Darker","styles":{"annotationLine":{"currentLine":{"backgroundColor":"#171c20"}},"annotationRange":{"currentBracket":{"backgroundColor":"#006E00"},"currentSearch":{"backgroundColor":"#5d5d5d"},"matchingBracket":{"backgroundColor":"#006E00"},"matchingSearch":{"backgroundColor":"#363636","currentSearch":{"backgroundColor":"#465e47"}},"writeOccurrence":{"backgroundColor":"#093f59"}},"backgroundColor":"#1a1d1e","color":"#dadada","comment":{"block":{"color":"#5e7175"},"color":"#5e7175","line":{"color":"#5e7175"}},"constant":{"color":"#c8333a","numeric":{"color":"#c8333a","hex":{"color":"#cd3f45"},"numeric":{"hex":{"color":"#c8333a"}}}},"entity":{"name":{"color":"#30a7d3","function":{"color":"#30a7d3","fontWeight":"normal"}},"other":{"attribute-name":{"color":"#5F9EA0"}}},"fontFamily":defaultFont,"fontSize":defaultFontSize,"keyword":{"control":{"color":"#e8d075","fontWeight":"normal"},"operator":{"color":"#91c23d","fontWeight":"normal"},"other":{"documentation":{"color":"#7F9FBF","task":{"color":"#8db6f1"}}}},"markup":{"bold":{"fontWeight":"bold"},"heading":{"color":"#91c23d"},"italic":{"fontStyle":"italic"},"list":{"color":"#CC4C07"},"other":{"separator":{"color":"#e8d075"},"strikethrough":{"textDecoration":"line-through"},"table":{"color":"#3C802C"}},"quote":{"color":"#55b5db"},"raw":{"fontFamily":"monospace", "html": {"background-color": "#3B4B53"}},"underline":{"link":{"textDecoration":"underline"}}},"meta":{"documentation":{"annotation":{"color":"#7F9FBF"},"tag":{"color":"#7F7F9F"}},"preprocessor":{"color":"#A4A4A4"},"tag":{"color":"#999999"}},"ruler":{"annotations":{"backgroundColor":"#0f1113"},"backgroundColor":"#0f1113","overview":{"backgroundColor":"#0f1113"}},"rulerLines":{"color":"#3d4750","even":{"color":"#3d4750"},"odd":{"color":"#3d4750"}},"string":{"color":"#55b5db","interpolated":{"color":"#dadada"},"quoted":{"double":{"color":"#55b5db"},"single":{"color":"#55b5db"}}},"support":{"type":{"propertyName":{"color":"#9fca56"}}},"textviewContent ::-moz-selection":{"backgroundColor":"#317370"},"textviewContent ::selection":{"backgroundColor":"#317370"},"textviewLeftRuler":{"borderRight":"1px solid #0e1112"},"textviewRightRuler":{"borderLeft":"1px solid #0e1112"},"textviewSelection":{"backgroundColor":"#317370"},"textviewSelectionUnfocused":{"backgroundColor":"#317370"},"variable":{"language":{"color":"#9fca56","fontWeight":"normal"},"other":{"color":"#E038AD"},"parameter":{"color":"#FF8C00"}}}};		

+			var darker = { "className":"darker", "name":"Darker", "styles":{ "annotationLine":{ "currentLine":{ "backgroundColor":"#171c20" } }, "annotationRange":{ "currentBracket":{ "backgroundColor":"#006E00" }, "currentSearch":{ "backgroundColor":"#5d5d5d" }, "matchingBracket":{ "backgroundColor":"#006E00" }, "matchingSearch":{ "backgroundColor":"#363636", "currentSearch":{ "backgroundColor":"#465e47" } }, "writeOccurrence":{ "backgroundColor":"#093f59" } }, "backgroundColor":"#1a1d1e", "color":"#dadada", "comment":{ "block":{ "color":"#5e7175" }, "color":"#5e7175", "line":{ "color":"#5e7175" } }, "constant":{ "color":"#c8333a", "numeric":{ "color":"#c8333a", "hex":{ "color":"#cd3f45" }, "numeric":{ "hex":{ "color":"#c8333a" } } } }, "entity":{ "name":{ "color":"#30a7d3", "function":{ "color":"#30a7d3", "fontWeight":"normal" } }, "other":{ "attribute-name":{ "color":"#5F9EA0" } } }, "fontFamily":defaultFont, "fontSize":defaultFontSize, "keyword":{ "control":{ "color":"#e8d075", "fontWeight":"normal" }, "operator":{ "color":"#91c23d", "fontWeight":"normal" }, "other":{ "documentation":{ "color":"#7F9FBF", "task":{ "color":"#8db6f1" } } } }, "markup":{ "bold":{ "fontWeight":"bold" }, "heading":{ "color":"#91c23d" }, "italic":{ "fontStyle":"italic" }, "list":{ "color":"#CC4C07" }, "other":{ "separator":{ "color":"#e8d075" }, "strikethrough":{ "textDecoration":"line-through" }, "table":{ "color":"#3C802C" } }, "quote":{ "color":"#55b5db" }, "raw":{ "fontFamily":"monospace", "html":{ "backgroundColor":"#3B4B53" } }, "underline":{ "link":{ "textDecoration":"underline" } } }, "meta":{ "documentation":{ "annotation":{ "color":"#7F9FBF" }, "tag":{ "color":"#7F7F9F" } }, "preprocessor":{ "color":"#A4A4A4" }, "tag":{ "color":"#999999", "attribute": { "color":"#748096" } } }, "ruler":{ "annotations":{ "backgroundColor":"#0f1113" }, "backgroundColor":"#0f1113", "overview":{ "backgroundColor":"#0f1113" } }, "rulerLines":{ "color":"#3d4750", "even":{ "color":"#3d4750" }, "odd":{ "color":"#3d4750" } }, "string":{ "color":"#55b5db", "interpolated":{ "color":"#dadada" }, "quoted":{ "double":{ "color":"#55b5db" }, "single":{ "color":"#55b5db" } } }, "support":{ "type":{ "propertyName":{ "color":"#9fca56" } } }, "textviewContent ::-moz-selection":{ "backgroundColor":"#317370" }, "textviewContent ::selection":{ "backgroundColor":"#317370" }, "textviewLeftRuler":{ "borderRight":"1px solid #0e1112" }, "textviewRightRuler":{ "borderLeft":"1px solid #0e1112" }, "textviewSelection":{ "backgroundColor":"#317370" }, "textviewSelectionUnfocused":{ "backgroundColor":"#317370" }, "variable":{ "language":{ "color":"#9fca56", "fontWeight":"normal" }, "other":{ "color":"#E038AD" }, "parameter":{ "color":"#FF8C00" } } } };			

 			this.styles.push(darker);

 		}