Attachment #265758 for bug #507788

Some Eclipse Foundation services are deprecated, or will be soon. Please ensure you've read this important communication.

Lines 39-44 Link Here

(-)a/bundles/org.eclipse.orion.client.ui/web/js-tests/ui/uiTests.html (+1 lines)
39	// "js-tests/ui/commonjs-unittesting/test.html",	39	// "js-tests/ui/commonjs-unittesting/test.html",
40	// "js-tests/ui/githubfileapi/test.html",	40	// "js-tests/ui/githubfileapi/test.html",
41	// "js-tests/ui/searchRendering/disabled-test.html", // disabled	41	// "js-tests/ui/searchRendering/disabled-test.html", // disabled
		42	"js-tests/ui/widgets/widgetsTests",
42	], function(){	43	], function(){
43	mocha.run();	44	mocha.run();
44	});	45	});




/*******************************************************************************
 * @license
 * Copyright (c) 2016 IBM Corporation and others.
 * All rights reserved. This program and the accompanying materials are made 
 * available under the terms of the Eclipse Public License v1.0 
 * (http://www.eclipse.org/legal/epl-v10.html), and the Eclipse Distribution 
 * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html). 
 * 
 * Contributors: Casey Flynn - Google Inc. - initial API and implementation
 ******************************************************************************/
/*eslint-env browser, amd, mocha*/
define([
	'chai/chai',
	'orion/widgets/themes/container/ThemeSheetWriter',
], function(chai, ThemeSheetWriter) {
	var assert = chai.assert;

	var themeSheetWriter;

	var setUp = function() {
		themeSheetWriter = new ThemeSheetWriter.ThemeSheetWriter();
	},
	tearDown = function() {
		themeSheetWriter = null;
	};
	describe("Widgets", function() {
		beforeEach(setUp);
		afterEach(tearDown);
		describe("Theme Sheet Writer", function() {
			it("Should write a valid style string", function() {
				var settings = {
					"styles": {
						".selector" : {
							"attribute" : "value"
						}
					}
				};
				
				var expected = "\n"+
					".orionPage .selector {\n"+
					"\tattribute: value;\n"+
					"}";
				
				
				var actual = themeSheetWriter.getSheet("orionPage", settings);
				assert.equal(actual, expected);				
			});
			it("Should write a valid style string - 2", function() {
				var settings = {
					"styles": {
						".multi.selector" : {
							"attribute0" : "value0"
						},
						".selector" : {
							".nested.multi.selector" : {
								"attribute1" : "value1",
								"attribute2" : "value2"
							},
							"attribute3" : "value3"
						},
						"#idSelector" : {
							"attribute4" : "value4"
						}
					}
				};
				
				var expected = "\n"+
					".orionPage .multi.selector {\n"+
					"	attribute0: value0;\n"+
					"}\n"+
					".orionPage .selector .nested.multi.selector {\n"+
					"	attribute1: value1;\n"+
					"	attribute2: value2;\n"+
					"}\n"+
					".orionPage .selector {\n"+
					"	attribute3: value3;\n"+
					"}\n"+
					".orionPage #idSelector {\n"+
					"	attribute4: value4;\n"+
					"}";
				
				var actual = themeSheetWriter.getSheet("orionPage", settings);
				assert.equal(actual, expected);				
			});
			it("Should return an empty style if no className is specified", function() {
				var settings = {
					"styles": {
						".selector" : {
							"attribute" : "value"
						}
					}
				};
				
				var expected = "";
				var actual = themeSheetWriter.getSheet(null, settings);
				assert.equal(actual, expected);				
			});
			it ("Should return an empty style if style is invalid - 1", function() {
				var expected = "";
				var actual = themeSheetWriter.getSheet(null, null);
				assert.equal(expected, actual);
			});
			it ("Should return an empty style if style is invalid - 2", function() {
				var expected = "";
				var actual = themeSheetWriter.getSheet(null, "");
				assert.equal(expected, actual);
			});
			it ("Should return an empty style if style is invalid - 3", function() {
				var expected = "";
				var actual = themeSheetWriter.getSheet(null, []);
				assert.equal(expected, actual);
			});
		});
	});
});




 * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html). 
 * 
 * Contributors: Anton McConville - IBM Corporation - initial API and implementation
 * 				 Casey Flynn - Google Inc.
 ******************************************************************************/
/*eslint-env browser, amd*/

define([
	'i18n!orion/settings/nls/messages',
	'orion/editor/textTheme',
	'orion/widgets/themes/container/ThemeSheetWriter',
	'orion/widgets/themes/ThemeVersion'
],
	function(mTextTheme, ThemeSheetWriter, THEMES_VERSION) {

	// *******************************************************************************
	//

	//
	// *******************************************************************************

		function StyleSet(){
		    //
		}
		
		function multiply(a,b){
			var resultString = 'Result:';
			var result = a*b;
			return resultString + result;
		}
		
		// TODO: what are these for? They just get overridden by ThemeData constructor
		StyleSet.prototype.name = 'Orion';
		StyleSet.prototype.navbar = '#404648';
		StyleSet.prototype.button = '#EFEFEF';
		StyleSet.prototype.location = '#333';
		StyleSet.prototype.breadcrumb = '#3087B3';
		StyleSet.prototype.separator = '#333';
		StyleSet.prototype.selection = 'FEC';
		StyleSet.prototype.sidepanel = '#FBFBFB';
		StyleSet.prototype.mainpanel = 'white';
		StyleSet.prototype.toolpanel = 'white';
		StyleSet.prototype.navtext = '#bfbfbf';
		StyleSet.prototype.content = '#3087B3';
		StyleSet.prototype.search = '#444';
		StyleSet.prototype.bannerProgress = "white";

		function ThemeData(){
		
			this.styles = [];
			var lightPage = {
				"className": "lightPage",
				"name": "lightPage",
				"styles": {
					"#configSection": {
						"background-color": "rgba(255,255,255,1) !important",
						"color": "rgba(0,0,0,1) !important"
					},
					"#log": {
						"margin": "5px",
						"width": "calc(100% - 17px)"
					},
					".auxpane": {
						"background": "rgba(196,197,200,1) !important"
					},
					".checkedRow": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important",
						".commandButton": {
							"border-color": "rgba(255,255,255,1)",
							"color": "rgba(255,255,255,1)"
						},
						".commandButton:not(.primaryButton):focus": {
							"background": "rgba(61,114,179,0.50)",
							"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
							"color": "rgba(0,0,0,1)"
						},
						".commandButton:not(.primaryButton):hover": {
							"background": "rgba(61,114,179,0.50)",
							"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
							"color": "rgba(0,0,0,1)"
						},
						".gitStatusIcon": {
							"color": "white !important"
						},
						".gitStatusTitle": {
							"color": "white !important"
						},
						"gitStatusIcon": {
							"color": "rgba(255,255,255,1)"
						},
						"gitStatusTitle": {
							"color": "rgba(255,255,255,1)"
						}
					},
					".commandButton": {
						"background-color": "rgba(0, 0, 0, 0)",
						"border-width": "1px",
						"border-style": "solid",
						"border-color": "rgba(61,114,179,1)",
						"color": "rgba(61,114,179,1)"
					},
					".commandButton.disabled": {
						"color": "#cdcdcd"
					},
					".commandButton.orionButton.dropdownTrigger:hover": {
						"border-color": "#ccc"
					},
					".commandButton:not(.primaryButton):focus": {
						"background-color": "rgba(61,114,179,0.25)",
						"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
						"color": "rgba(0,0,0,1)"
					},
					".commandButton:not(.primaryButton):hover": {
						"background-color": "rgba(61,114,179,0.25)",
						"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
						"color": "rgba(0,0,0,1)"
					},
					".content-fixedHeight": {
						"background": "rgba(196,197,200,1) !important"
					},
					".core-sprite-error": {
						"color": "red"
					},
					".dialogTitle": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".dropdownButtonWithIcon": {
						"color": "rgba(21,41,53,1) !important"
					},
					".dropdownMenu": {
						".dropdownMenuItemSelected": {
							"background": "rgba(61,114,179,0.25)",
							"border-left-color": "rgba(61,114,179,1)"
						}
					},
					".dropdownTrigger:not(.dropdownDefaultButton)": {
						"color": "rgba(21,41,53,1)"
					},
					".editorViewerHeader": {
						"background": "rgba(245,247,250,1) !important",
						"border-bottom-width": "1px",
						"border-bottom-style": "solid",
						"border-bottom-color": "rgba(245,247,250,1)",
						"color": "rgba(0,0,0,1)"
					},
					".filesystemName": {
						"color": "rgba(21,41,53,1) !important"
					},
					".fixedToolbarHolder": {
						"background": "rgba(255,255,255,1)"
					},
					".gitCommitMessage": {
						"gitCommitMessageTopRow": {
							"border-width": "1px",
							"border-style": "solid",
							"border-color": "rgb(61, 114, 179)"
						},
						".gitCommitMessageTopRow": {
							"border-color": "rgba(61,114,179,1)"
						}
					},
					".gitCommitMessageSection": {
						"background-color": "rgba(61,114,179,0.25)"
					},
					".gitCommitMore": {
						"color": "rgba(61,114,179,1) !important"
					},
					".gitStatusIcon": {
						"color": "rgba(61,114,179,1) !important"
					},
					".gitStatusSection": {
						"background-color": "rgba(61,114,179,0.25)"
					},
					".gitStatusTitle": {
						"color": "rgba(61,114,179,1) !important"
					},
					".label.parameterInput": {
						"color": "rgba(255,255,255,1) !important"
					},
					".launchConfigurationMenuItem.dropdownMenuItemActive": {
						"background": "rgba(245,247,250,1)"
					},
					".launchConfigurationsButton": {
						".commandButton.orionButton.dropdownTrigger": {
							"color": "rgba(255,255,255,1) !important"
						}
					},
					".launchConfigurationsWrapper>.launchConfigurationsButton.dropdownTrigger": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".launchConfsDropdown": {
						".dropdownDefaultButton": {
							"background-color": "rgba(61,114,179,1) !important",
							"color": "rgba(255,255,255,1) !important"
						}
					},
					".launchConfsLabel": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".liveUpdateLabel": {
						"color": "rgba(61,114,179,1) !important"
					},
					".mainToolbar": {
						"background-color": "rgba(255,255,255,1)",
						"color": "rgba(21,41,53,1) !important",
						".commandButton.orionButton.dropdownTrigger": {
							"border-color": "rgba(255,255,255,1) !important",
							"color": "rgba(0,0,0,1) !important",
							".dropdownTriggerButtonLabel": {
								"color": "rgba(255,255,255,1)"
							}
						},
						".commandButton.orionButton.dropdownTrigger.dropdownTriggerOpen": {
							"color": "rgba(196,197,200,1) !important"
						},
						".commandButton.orionButton.dropdownTrigger.launchConfigurationsButton": {
							"dropdownArrowDown": {
								"color": "white"
							},
							".dropdownArrowDown": {
								"color": "rgba(255,255,255,1)"
							}
						},
						".commandImage.dropdownTrigger": {
							"color": "rgb(21, 41, 53) !important"
						},
						".gitSectionLabel": {
							"background-color": "rgba(61,114,179,1) !important",
							"color": "rgba(255,255,255,1) !important"
						},
						".sectionWrapper": {
							"background-color": "rgba(61,114,179,1) !important",
							"color": "rgba(255,255,255,1) !important"
						}
					},
					".mainpane": {
						"background": "rgba(196,197,200,1) !important"
					},
					".navbar-item-selected": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".orionSwitchLabel": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".outlineExplorer": {
						".treeIterationCursorRow_Dotted": {
							"background-color": "rgba(61,114,179,1) !important",
							"color": "rgba(255,255,255,1) !important"
						}
					},
					".primaryButton": {
						"background-color": "rgba(61,114,179,1) !important",
						"border-width": "1px",
						"border-style": "solid",
						"border-color": "rgba(61,114,179,1) !important",
						"border-radius": "0 !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".primaryButton:hover,": {
						".primaryButton:focus": {
							"background": "rgb(61, 114, 179)",
							"border-color": "rgb(61, 114, 179)"
						}
					},
					".projectNavColumn": {
						"color": "rgba(0,0,0,1)"
					},
					".searchResultsWrapperDiv": {
						".selectableNavRow:hover": {
							"background": "rgba(61,114,179,0.25)",
							"border-left-color": "rgba(61,114,179,1)"
						}
					},
					".sectionTable": {
						"background-color": "rgba(255,255,255,1)"
					},
					".sideMenu": {
						"background-color": "rgba(255,255,255,1)"
					},
					".sideMenuItem": {
						"color": "rgba(21,41,53,1) !important"
					},
					".sideMenuItem>.submenu-trigger:hover": {
						"color": "rgba(61,114,179,1) !important"
					},
					".sideMenuItemActive": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".sideMenuItemActive:hover": {
						"background": "rgba(61,114,179,0.25) !important",
						"color": "rgba(255,255,255,1)"
					},
					".sidebarWrapper": {
						"background": "rgba(245,247,250,1) !important",
						"color": "rgba(0,0,0,1)"
					},
					".slideParameters": {
						"background-color": "rgba(61,114,179,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					".splash": {
						"background": "rgba(245,247,250,1) !important",
						"box-shadow": "none"
					},
					".splashAbout": {
						"color": "rgba(61,114,179,1) !important"
					},
					".splashDetailedMessage": {
						"color": "rgba(0,0,0,1)"
					},
					".splashLoader": {
						"background": "rgba(245,247,250,1) !important",
						"box-shadow": "none"
					},
					".splashLoadingImage": {
						"-webkit-animation": "rotateThis .5s infinite linear",
						"animation": "rotateThis .5s infinite linear",
						"background": "none",
						"border": "2px solid #00b299",
						"border-radius": "50%",
						"border-right-color": "transparent",
						"display": "inline-block",
						"height": "20px",
						"margin": "0",
						"opacity": ".4",
						"width": "20px"
					},
					".splashLoadingImage.initial": {
						"border-width": "4px",
						"height": "40px",
						"width": "40px"
					},
					".splashMessage": {
						"color": "rgba(0,0,0,1)"
					},
					".splashVerbal": {
						"color": "rgba(61,114,179,1) !important"
					},
					".split": {
						"background": "rgba(196,197,200,1)",
						"width": "4px"
					},
					".splitThumb": {
						"background": "rgba(196,197,200,1)"
					},
					".status": {
						"color": "rgba(0,0,0,1)"
					},
					".statusContainer": {
						"background": "rgba(245,247,250,1)",
						"color": "rgba(0,0,0,1)"
					},
					".statusLight": {
						"background": "lightgray"
					},
					".statusLight.statusLightAmber": {
						"background": "#FFE141"
					},
					".statusLight.statusLightGreen": {
						"background": "#13dd6d"
					},
					".statusLight.statusLightProgress": {
						"background": "transparent",
						"border-color": "lightgray",
						"border-top-color": "transparent"
					},
					".statusLight.statusLightRed": {
						"background": "#C1272D"
					},
					".textviewTooltip": {
						".commandButton": {
							"background-color": "inherit",
							"border": "1px solid #325C80",
							"border-color": "rgba(255,255,255,1)",
							"color": "white",
							"margin-bottom": "2px"
						},
						"color": "rgba(255,255,255,1)"
					},
					".titleActionContainer": {
						"background": "rgba(245,247,250,1) !important",
						"color": "rgba(0,0,0,1)"
					},
					".tooltip": {
						"background-color": "rgba(61,114,179,1) !important",
						"border-width": "1px",
						"border-style": "solid",
						"border-color": "rgba(61,114,179,1)",
						"color": "rgba(255,255,255,1) !important",
						"h2": {
							"color": "rgba(255,255,255,1) !important"
						},
						".navlinkonpage": {
							"background-color": "rgba(61,114,179,1) !important",
							"color": "rgba(255,255,255,1) !important"
						},
						".operationError": {
							"color": "rgba(255,255,255,1) !important"
						}
					},
					".tooltipTailFromabove:after": {
						"border-top-color": "rgba(61,114,179,1)"
					},
					".tooltipTailFromabove:before": {
						"border-top-color": "rgba(61,114,179,1)"
					},
					".tooltipTailFrombelow:after": {
						"border-bottom-color": "rgba(61,114,179,1)"
					},
					".tooltipTailFrombelow:before": {
						"border-bottom-color": "rgba(61,114,179,1)"
					},
					".tooltipTailFromleft:after": {
						"border-left-color": "rgba(61,114,179,1)"
					},
					".tooltipTailFromleft:before": {
						"border-left-color": "rgba(61,114,179,1)"
					},
					".tooltipTailFromright:after": {
						"border-right-color": "rgba(61,114,179,1)"
					},
					".tooltipTailFromright:before": {
						"border-right-color": "rgba(61,114,179,1)"
					},
					".treeIterationCursorRow": {
						"background-color": "rgba(61,114,179,0.25)"
					},
					".treeIterationCursorRow_Dotted": {
						"background-color": "rgba(61,114,179,0.25)"
					},
					".workingTarget": {
						"background-color": "rgba(255,255,255,1)"
					},
					".commandImage.dropdownTrigger": {
						"color": "rgba(21,41,53,1)"
					},
					".dropdownMenuItem": {
						"color": "rgba(245,247,250,1)"
					},
					".pageToolbar": {
						".dropdownTrigger:not(.dropdownDefaultButton)": {
							"color": "rgba(196,197,200,1)"
						}
					},
					".primaryButton:hover": {
						".primaryButton:focus": {
							"background": "rgba(61,114,179,1)",
							"border-color": "rgba(61,114,179,1)"
						}
					}
				}
			}
			this.styles.push(lightPage);
			
			var orionPage = {
				"className": "orionPage",
				"name": "orionPage",
				"styles": {
					"#configSection": {
						"background-color": "rgba(38,52,63,1) !important",
						"color": "rgba(255,255,255,1) !important"
					},
					"#log": {
						"margin": "5px",
						"width": "calc(100% - 17px)"
					},
					".auxpane": {
						"background": "rgba(59,75,84,1) !important"
					},
					".checkedRow": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important",
						".commandButton": {
							"border-color": "rgba(38,52,63,1)",
							"color": "rgba(211,211,211,1)"
						},
						".commandButton:not(.primaryButton):focus": {
							"background": "rgba(27,177,153,0.50)",
							"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
							"color": "rgba(255,255,255,1)"
						},
						".commandButton:not(.primaryButton):hover": {
							"background": "rgba(27,177,153,0.50)",
							"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
							"color": "rgba(255,255,255,1)"
						},
						".gitStatusIcon": {
							"color": "white !important"
						},
						".gitStatusTitle": {
							"color": "white !important"
						},
						"gitStatusIcon": {
							"color": "rgba(211,211,211,1)"
						},
						"gitStatusTitle": {
							"color": "rgba(211,211,211,1)"
						}
					},
					".commandButton": {
						"background-color": "rgba(0, 0, 0, 0)",
						"border-width": "1px",
						"border-style": "solid",
						"border-color": "rgba(27,177,153,1)",
						"color": "rgba(27,177,153,1)"
					},
					".commandButton.disabled": {
						"color": "#cdcdcd"
					},
					".commandButton.orionButton.dropdownTrigger:hover": {
						"border-color": "#ccc"
					},
					".commandButton:not(.primaryButton):focus": {
						"background-color": "rgba(27,177,153,0.25)",
						"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
						"color": "rgba(255,255,255,1)"
					},
					".commandButton:not(.primaryButton):hover": {
						"background-color": "rgba(27,177,153,0.25)",
						"box-shadow": "0 1px 2px 0 rgb(61, 114, 179)",
						"color": "rgba(255,255,255,1)"
					},
					".content-fixedHeight": {
						"background": "rgba(59,75,84,1) !important"
					},
					".core-sprite-error": {
						"color": "red"
					},
					".dialogTitle": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".dropdownButtonWithIcon": {
						"color": "rgba(255,255,255,1) !important"
					},
					".dropdownMenu": {
						".dropdownMenuItemSelected": {
							"background": "rgba(27,177,153,0.25)",
							"border-left-color": "rgba(27,177,153,1)"
						}
					},
					".dropdownTrigger:not(.dropdownDefaultButton)": {
						"color": "rgba(255,255,255,1)"
					},
					".editorViewerHeader": {
						"background": "rgba(59,75,84,1) !important",
						"border-bottom-width": "1px",
						"border-bottom-style": "solid",
						"border-bottom-color": "rgba(59,75,84,1)",
						"color": "rgba(255,255,255,1)"
					},
					".filesystemName": {
						"color": "rgba(255,255,255,1) !important"
					},
					".fixedToolbarHolder": {
						"background": "rgba(38,52,63,1)"
					},
					".gitCommitMessage": {
						"gitCommitMessageTopRow": {
							"border-width": "1px",
							"border-style": "solid",
							"border-color": "rgb(61, 114, 179)"
						},
						".gitCommitMessageTopRow": {
							"border-color": "rgba(27,177,153,1)"
						}
					},
					".gitCommitMessageSection": {
						"background-color": "rgba(27,177,153,0.25)"
					},
					".gitCommitMore": {
						"color": "rgba(27,177,153,1) !important"
					},
					".gitStatusIcon": {
						"color": "rgba(27,177,153,1) !important"
					},
					".gitStatusSection": {
						"background-color": "rgba(27,177,153,0.25)"
					},
					".gitStatusTitle": {
						"color": "rgba(27,177,153,1) !important"
					},
					".label.parameterInput": {
						"color": "rgba(211,211,211,1) !important"
					},
					".launchConfigurationMenuItem.dropdownMenuItemActive": {
						"background": "rgba(59,75,84,1)"
					},
					".launchConfigurationsButton": {
						".commandButton.orionButton.dropdownTrigger": {
							"color": "rgba(211,211,211,1) !important"
						}
					},
					".launchConfigurationsWrapper>.launchConfigurationsButton.dropdownTrigger": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".launchConfsDropdown": {
						".dropdownDefaultButton": {
							"background-color": "rgba(27,177,153,1) !important",
							"color": "rgba(211,211,211,1) !important"
						}
					},
					".launchConfsLabel": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".liveUpdateLabel": {
						"color": "rgba(27,177,153,1) !important"
					},
					".mainToolbar": {
						"background-color": "rgba(38,52,63,1)",
						"color": "rgba(255,255,255,1) !important",
						".commandButton.orionButton.dropdownTrigger": {
							"border-color": "rgba(38,52,63,1) !important",
							"color": "rgba(255,255,255,1) !important",
							".dropdownTriggerButtonLabel": {
								"color": "rgba(211,211,211,1)"
							}
						},
						".commandButton.orionButton.dropdownTrigger.dropdownTriggerOpen": {
							"color": "rgba(59,75,84,1) !important"
						},
						".commandButton.orionButton.dropdownTrigger.launchConfigurationsButton": {
							"dropdownArrowDown": {
								"color": "white"
							},
							".dropdownArrowDown": {
								"color": "rgba(211,211,211,1)"
							}
						},
						".commandImage.dropdownTrigger": {
							"color": "rgb(21, 41, 53) !important"
						},
						".gitSectionLabel": {
							"background-color": "rgba(27,177,153,1) !important",
							"color": "rgba(211,211,211,1) !important"
						},
						".sectionWrapper": {
							"background-color": "rgba(27,177,153,1) !important",
							"color": "rgba(211,211,211,1) !important"
						}
					},
					".mainpane": {
						"background": "rgba(59,75,84,1) !important"
					},
					".navbar-item-selected": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".orionSwitchLabel": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".outlineExplorer": {
						".treeIterationCursorRow_Dotted": {
							"background-color": "rgba(27,177,153,1) !important",
							"color": "rgba(211,211,211,1) !important"
						}
					},
					".primaryButton": {
						"background-color": "rgba(27,177,153,1) !important",
						"border-width": "1px",
						"border-style": "solid",
						"border-color": "rgba(27,177,153,1) !important",
						"border-radius": "0 !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".primaryButton:hover,": {
						".primaryButton:focus": {
							"background": "rgb(61, 114, 179)",
							"border-color": "rgb(61, 114, 179)"
						}
					},
					".projectNavColumn": {
						"color": "rgba(255,255,255,1)"
					},
					".searchResultsWrapperDiv": {
						".selectableNavRow:hover": {
							"background": "rgba(27,177,153,0.25)",
							"border-left-color": "rgba(27,177,153,1)"
						}
					},
					".sectionTable": {
						"background-color": "rgba(255,255,255,1)"
					},
					".sideMenu": {
						"background-color": "rgba(38,52,63,1)"
					},
					".sideMenuItem": {
						"color": "rgba(255,255,255,1) !important"
					},
					".sideMenuItem>.submenu-trigger:hover": {
						"color": "rgba(27,177,153,1) !important"
					},
					".sideMenuItemActive": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".sideMenuItemActive:hover": {
						"background": "rgba(27,177,153,0.25) !important",
						"color": "rgba(211,211,211,1)"
					},
					".sidebarWrapper": {
						"background": "rgba(59,75,84,1) !important",
						"color": "rgba(255,255,255,1)"
					},
					".slideParameters": {
						"background-color": "rgba(27,177,153,1) !important",
						"color": "rgba(211,211,211,1) !important"
					},
					".splash": {
						"background": "rgba(59,75,84,1) !important",
						"box-shadow": "none"
					},
					".splashAbout": {
						"color": "rgba(27,177,153,1) !important"
					},
					".splashDetailedMessage": {
						"color": "rgba(255,255,255,1)"
					},
					".splashLoader": {
						"background": "rgba(59,75,84,1) !important",
						"box-shadow": "none"
					},
					".splashLoadingImage": {
						"-webkit-animation": "rotateThis .5s infinite linear",
						"animation": "rotateThis .5s infinite linear",
						"background": "none",
						"border": "2px solid #00b299",
						"border-radius": "50%",
						"border-right-color": "transparent",
						"display": "inline-block",
						"height": "20px",
						"margin": "0",
						"opacity": ".4",
						"width": "20px"
					},
					".splashLoadingImage.initial": {
						"border-width": "4px",
						"height": "40px",
						"width": "40px"
					},
					".splashMessage": {
						"color": "rgba(255,255,255,1)"
					},
					".splashVerbal": {
						"color": "rgba(27,177,153,1) !important"
					},
					".split": {
						"background": "rgba(59,75,84,1)",
						"width": "4px"
					},
					".splitThumb": {
						"background": "rgba(59,75,84,1)"
					},
					".status": {
						"color": "rgba(255,255,255,1)"
					},
					".statusContainer": {
						"background": "rgba(59,75,84,1)",
						"color": "rgba(255,255,255,1)"
					},
					".statusLight": {
						"background": "lightgray"
					},
					".statusLight.statusLightAmber": {
						"background": "#FFE141"
					},
					".statusLight.statusLightGreen": {
						"background": "#13dd6d"
					},
					".statusLight.statusLightProgress": {
						"background": "transparent",
						"border-color": "lightgray",
						"border-top-color": "transparent"
					},
					".statusLight.statusLightRed": {
						"background": "#C1272D"
					},
					".textviewTooltip": {
						".commandButton": {
							"background-color": "inherit",
							"border": "1px solid #325C80",
							"border-color": "rgba(38,52,63,1)",
							"color": "white",
							"margin-bottom": "2px"
						},
						"color": "rgba(211,211,211,1)"
					},
					".titleActionContainer": {
						"background": "rgba(59,75,84,1) !important",
						"color": "rgba(255,255,255,1)"
					},
					".tooltip": {
						"background-color": "rgba(27,177,153,1) !important",
						"border-width": "1px",
						"border-style": "solid",
						"border-color": "rgba(27,177,153,1)",
						"color": "rgba(211,211,211,1) !important",
						"h2": {
							"color": "rgba(211,211,211,1) !important"
						},
						".navlinkonpage": {
							"background-color": "rgba(27,177,153,1) !important",
							"color": "rgba(211,211,211,1) !important"
						},
						".operationError": {
							"color": "rgba(211,211,211,1) !important"
						}
					},
					".tooltipTailFromabove:after": {
						"border-top-color": "rgba(27,177,153,1)"
					},
					".tooltipTailFromabove:before": {
						"border-top-color": "rgba(27,177,153,1)"
					},
					".tooltipTailFrombelow:after": {
						"border-bottom-color": "rgba(27,177,153,1)"
					},
					".tooltipTailFrombelow:before": {
						"border-bottom-color": "rgba(27,177,153,1)"
					},
					".tooltipTailFromleft:after": {
						"border-left-color": "rgba(27,177,153,1)"
					},
					".tooltipTailFromleft:before": {
						"border-left-color": "rgba(27,177,153,1)"
					},
					".tooltipTailFromright:after": {
						"border-right-color": "rgba(27,177,153,1)"
					},
					".tooltipTailFromright:before": {
						"border-right-color": "rgba(27,177,153,1)"
					},
					".treeIterationCursorRow": {
						"background-color": "rgba(27,177,153,0.25)"
					},
					".treeIterationCursorRow_Dotted": {
						"background-color": "rgba(27,177,153,0.25)"
					},
					".workingTarget": {
						"background-color": "rgba(255,255,255,1)"
					},
					".commandImage.dropdownTrigger": {
						"color": "rgba(255,255,255,1)"
					},
					".dropdownMenuItem": {
						"color": "rgba(59,75,84,1)"
					},
					".pageToolbar": {
						".dropdownTrigger:not(.dropdownDefaultButton)": {
							"color": "rgba(59,75,84,1)"
						}
					},
					".primaryButton:hover": {
						".primaryButton:focus": {
							"background": "rgba(27,177,153,1)",
							"border-color": "rgba(27,177,153,1)"
						}
					}
				}
			};
			this.styles.push(orionPage);
		}
		
		function getStyles(){

		ThemeData.prototype.styles = [];
		ThemeData.prototype.getStyles = getStyles;
		
		function getProtectedThemes() {
			return ["lightPage", "orionPage"]; //$NON-NLS-1$ //$NON-NLS-0$
		}

		ThemeData.prototype.getProtectedThemes = getProtectedThemes;
		
		function getThemeStorageInfo(){
			return {
				storage:'/themes',
				styleset:'containerStyles',
				defaultTheme: 'lightPage',
				selectedKey: 'containerTheme',
				version: THEMES_VERSION
			};
		}

		ThemeData.prototype.getThemeStorageInfo = getThemeStorageInfo;

		function getViewData(){
		
		ThemeData.prototype.getThemeStorageInfo = getThemeStorageInfo;
			var LEFT = 10;
			var UI_SIZE = 350;
			var BANNER_HEIGHT = 32;
			var NAV_HEIGHT = 29;
			var CONTENT_TOP = TOP + BANNER_HEIGHT + NAV_HEIGHT;
		
			var dataset = {};
			dataset.top = TOP;
			dataset.left = LEFT;
			dataset.width = UI_SIZE;
			dataset.height = UI_SIZE;
			
			dataset.shapes = [ 
								{ type:'RECTANGLE', 	name: messages["Navigation Bar"],		x:LEFT,		y:TOP,					width:UI_SIZE,	height: BANNER_HEIGHT, family:'navbar', fill: '#333', order:1 },
								{ type:'TEXT',		name: messages["Navigation Text"],	 label:'UserName',	x:LEFT + UI_SIZE - 70, y:TOP + 20, family:'navtext', fill: '#bfbfbf', font: '8pt sans-serif'},
								{ type:'ROUNDRECTANGLE', name: messages["Search Box"],	x:LEFT + UI_SIZE - 145,	y:TOP + 10, width: 70,	height: 12, family:'search', fill: '#444', order:3 },
								{ type:'RECTANGLE', name: messages["Tool Panel"],	x:LEFT + UI_SIZE * 0.4, y:CONTENT_TOP, width:UI_SIZE * 0.6 -1, height:30, family:'toolpanel', fill: 'white', order:4 },
								{ type:'RECTANGLE', name: messages["Selection Bar"],	x:LEFT + UI_SIZE * 0.4 + 5, y:CONTENT_TOP + 62, width:UI_SIZE * 0.6 -10, height:20, family:'selection', fill: '#FEC', order:7 },
							   	{ type:'RECTANGLE', 	name: messages["Location"],	x:LEFT,		y:TOP + BANNER_HEIGHT, 	width:UI_SIZE,	height: NAV_HEIGHT, family:'location', fill: '#efefef', order:8 },
								{ type:'TEXT',		name: messages["Navigation Text"],	 label:'Navigator',	x:LEFT + 50, y: TOP + 20, family:'navtext', fill: '#bfbfbf', font: '8pt sans-serif', order:2 },
							  	{ type:'TEXT',		name: messages["Content"],	 label:'Breadcrumb',	x:LEFT + 5, y:TOP + BANNER_HEIGHT + 18, family:'content', fill: '#3087B3', font: '8pt sans-serif' },
								{ type:'TEXT',		name: messages["Content"],	 label:'/',	x:LEFT + 68, y:TOP + BANNER_HEIGHT + 18, family:'content', fill: '#3087B3', font: '8pt sans-serif', order:9 },
								{ type:'TEXT',		name: messages["Content"],	 label:'Location',	x:LEFT + 74, y:TOP + BANNER_HEIGHT + 18, family:'content', fill: '#3087B3', font: '8pt sans-serif' },
								{ type:'RECTANGLE', name: messages["Main Panel"],	x:LEFT + UI_SIZE * 0.4, y:CONTENT_TOP + 30, width:UI_SIZE * 0.6 -1, height:UI_SIZE - CONTENT_TOP + TOP -31, family:'mainpanel', fill: 'white', order:6 },
								{ type:'ROUNDRECTANGLE', name: messages["Button"],	x:LEFT + UI_SIZE * 0.4 + 5, y:CONTENT_TOP + 5, width:37, height:20, family:'button', fill: '#EFEFEF', order:11 },
								{ type:'TEXT',		name: messages["Button Text"],	 label:'Button',	x:LEFT + UI_SIZE * 0.4 + 8, y:CONTENT_TOP + 19, family:'navbar', fill: '#333', font: '8pt sans-serif' },
								{ type:'TRIANGLE',	name:'userMenu', x1:LEFT + UI_SIZE - 7, y1:TOP + 14, x2:LEFT + UI_SIZE - 13, y2:TOP + 14, x3:LEFT + UI_SIZE - 10, y3:TOP + 19, family:'userMenu', fill: '#BFBFBF' },
								{ type:'TRIANGLE',	name:'userMenu', x1:LEFT + 10, y1:CONTENT_TOP + 17, x2:LEFT + 16, y2:CONTENT_TOP + 17, x3:LEFT + 13, y3:CONTENT_TOP + 22, family:'userMenu', fill: '#BFBFBF' },
								{ type:'TEXT',		name: messages["Section Text"],	 label:'Section',	x:LEFT + 20, y:CONTENT_TOP + 23, family:'navbar', fill: '#333', font: '8pt sans-serif' },
								{ type:'LINE', 		name: messages["Line Color"], x1:LEFT + UI_SIZE * 0.4, y1:CONTENT_TOP + 30, x2:LEFT + UI_SIZE, y2:CONTENT_TOP + 30, linewidth:2, fill:'#DEDEDE' },
								{ type:'LINE', 		name: messages["Line Color"], x1:LEFT + UI_SIZE * 0.4, y1:CONTENT_TOP, x2:LEFT + UI_SIZE * 0.4, y2:TOP + UI_SIZE, linewidth:2, fill:'#DEDEDE'},
								{ type:'LINE', 		name: messages["Line Color"], x1:LEFT + 10, y1:CONTENT_TOP + 29, x2:LEFT + UI_SIZE * 0.4 - 10, y2:CONTENT_TOP + 29, linewidth:2, fill:'#DEDEDE' },
								{ type:'RECTANGLE', 	name: messages["Side Panel"],	x:LEFT,		y:CONTENT_TOP, 			width: UI_SIZE * 0.4,	height: UI_SIZE - CONTENT_TOP + TOP, family:'sidepanel', fill: '#FBFBFB', order:12 },
								{ type:'TRIANGLE',	name:'userMenu', x1:LEFT + UI_SIZE - 7, y1:TOP + 14, x2:LEFT + UI_SIZE - 13, y2:TOP + 14, x3:LEFT + UI_SIZE - 10, y3:TOP + 19, family:'userMenu', fill: '#BFBFBF' },
								{ type:'TRIANGLE',	name:'userMenu', x1:LEFT + 10, y1:CONTENT_TOP + 17, x2:LEFT + 16, y2:CONTENT_TOP + 17, x3:LEFT + 13, y3:CONTENT_TOP + 22, family:'userMenu', fill: '#BFBFBF' },
								{ type:'TEXT',		name: messages["Navigation Text"],	 label:'Navigator',	x:LEFT + 50, y: TOP + 20, family:'navtext', fill: '#bfbfbf', font: '8pt sans-serif', order:2 },
								{ type:'TRIANGLE',	name:'userMenu', x1:LEFT + UI_SIZE - 7, y1:TOP + 14, x2:LEFT + UI_SIZE - 13, y2:TOP + 14, x3:LEFT + UI_SIZE - 10, y3:TOP + 19, family:'userMenu', fill: '#BFBFBF' },
								{ type:'TRIANGLE',	name:'userMenu', x1:LEFT + 10, y1:CONTENT_TOP + 17, x2:LEFT + 16, y2:CONTENT_TOP + 17, x3:LEFT + 13, y3:CONTENT_TOP + 22, family:'userMenu', fill: '#BFBFBF' }
			];
			
			
			for( var count=0; count < 3; count++ ){
					
				/* Section Items */
					
				dataset.shapes.push( { type:'TEXT', name: messages["Content"], label:'org.eclipse.orion.content', x: LEFT + UI_SIZE * 0.4 + 20, y:CONTENT_TOP + 56 + ( 20 * count ), fill: '#3087B3', family:'content' } );
			}
			
			for( var count=0; count < 3; count++ ){
					
				/* Section Items */
					
				dataset.shapes.push( { type:'TEXT', name: messages["Content"], label:'Item', x:LEFT + 15, y:CONTENT_TOP + 44 + ( 20 * count ), fill: '#3087B3', family:'content' } );
			}
			
			for( var twisty = 0; twisty < 3; twisty++ ){
			
				dataset.shapes.push( { type:'TRIANGLE',	name:'twisty', 
				x1: LEFT + UI_SIZE * 0.4 + 10, y1:CONTENT_TOP + 50 + (twisty*20), 
				x2:LEFT + UI_SIZE * 0.4 + 15, y2: CONTENT_TOP + 53 + (twisty*20), 
				x3:LEFT + UI_SIZE * 0.4 + 10, y3: CONTENT_TOP + 56 + (twisty*20), 
				family:'navbar', fill: '#333' } );
			}
			
			dataset.shapes.push( { type:'IMAGE', 		name:'logo', x: LEFT + 5, y:TOP + 8, source: '../../images/orion-transparent.png', family:'logo' } );
			
			return dataset;
		}

		ThemeData.prototype.getViewData = getViewData;
		
		function processSettings(settings){
			var sheetMaker = new ThemeSheetWriter.ThemeSheetWriter();
			var themeClass = "orionPage";
			var theme = new mTextTheme.TextTheme.getTheme(themeClass);
			theme.setThemeClass(themeClass, sheetMaker.getSheet(themeClass, settings ));
		}
		
		ThemeData.prototype.processSettings = processSettings;

		return{
			ThemeData:ThemeData,
			getStyles:getStyles,
		};
	}
);




 * License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html). 
 * 
 * Contributors: Anton McConville - IBM Corporation - initial API and implementation
 * 				 Casey Flynn - Google Inc - Refactor for new styles.
 ******************************************************************************/
/*eslint-env browser, amd*/

define([],
	function() {
		function writeStyleString(themeClass, settings) {
			if (!settings || !settings.styles) {
				return "";
		var button = '#777777';
		var location = '#EFEFEF';
		var selection = '#cedce7';
		var sidepanel = '#F7F7F7';
		var mainpanel = 'white';
		var navtext = '#bfbfbf';
		var content = '#3087B3';
		var search = '#444';
		var toolpanel = 'white';
		
		function ThemeSheetWriter(){}
		
		ThemeSheetWriter.prototype.navbar = navbar;
		ThemeSheetWriter.prototype.button = button;
		ThemeSheetWriter.prototype.location = location;
		ThemeSheetWriter.prototype.selection = selection;
		ThemeSheetWriter.prototype.sidepanel = sidepanel;
		ThemeSheetWriter.prototype.mainpanel = mainpanel;
		ThemeSheetWriter.prototype.navtext = navtext;
		ThemeSheetWriter.prototype.content = content;
		ThemeSheetWriter.prototype.search = search;
		ThemeSheetWriter.prototype.toolpanel = toolpanel;
		
		function writeNavigationStyle(){
		
			var styleBlock = '';
		
			var styles = [];
		
			var orionPage = new ThemeClass.ThemeClass( 'orionPage' );
			orionPage.style.backgroundColor = '#fdfdfd';
			orionPage.style.width = '100%';
			orionPage.style.height = '100%';
			
			styles.push( orionPage );
			
			var topRowBanner = new ThemeClass.ThemeClass( 'topRowBanner' );
			topRowBanner.style.margin = '0';
			topRowBanner.style.border = '0';
			topRowBanner.style.backgroundColor = this.navbar;
//			topRowBanner.style.background = 'linear-gradient(to bottom, #959595 0%,#0d0d0d 46%,#010101 50%,#0a0a0a 53%,#1b1b1b 100%)';
			/* topRowBanner.style.borderBottom = '1px solid #dddddd'; */
			topRowBanner.style.borderBottom = "none";
			topRowBanner.style.boxShadow = "0 2px 2px 0 rgba(0, 0, 0, 0.1),0 1px 0 0 rgba(0, 0, 0, 0.1)";
			topRowBanner.style.zIndex = "100";
			
			styles.push( topRowBanner );
			
			var a = new ThemeClass.ThemeClass( 'a' );
			a.style.textDecoration = 'none';
			a.style.color = this.content;
			
			styles.push( a );

			var navlink = new ThemeClass.ThemeClass( 'navlink' );
			navlink.style.display = 'inline-block';
			navlink.style.padding = '2px';
			navlink.style.color = this.content;
			navlink.style.verticalAlign = 'bottom';
			
			styles.push( navlink );


		/*	var aVisited = new ThemeClass.ThemeClass( 'a:visited' );
			aVisited.style.color = this.content;
			
			styles.push( aVisited );
				
			var aActive = new ThemeClass.ThemeClass( 'a:active' );
			aActive.style.color = this.content;
			
			styles.push( aActive );
			
			var aHover = new ThemeClass.ThemeClass( 'a:hover' );
			aHover.style.textDecoration = 'underline';
			aHover.style.color = this.content;
			
			styles.push( aHover ); */
			
			var primaryNav = new ThemeClass.ThemeClass( 'primaryNav' );
			primaryNav.style.color = this.navtext;
			primaryNav.style.fontSize = '8pt';
			primaryNav.style.fontWeight = 'normal';
			primaryNav.style.paddingTop = '0';
			primaryNav.style.verticalAlign = 'baseline';
			
			styles.push( primaryNav );
			
			var primaryNavA = new ThemeClass.ThemeClass( 'primaryNav a' );
			primaryNavA.style.fontSize = '8pt'; 
			primaryNavA.style.color = this.navtext;
			primaryNavA.style.marginRight = '6px';
			primaryNavA.style.marginLeft = '6px'; 
			primaryNavA.style.verticalAlign = 'baseline';
			primaryNavA.style.textDecoration = 'none';
			
			styles.push( primaryNavA );
			
			var primaryNavAhover = new ThemeClass.ThemeClass( 'primaryNav a:hover' );
			primaryNavAhover.style.color = '#bfbfbf';
			primaryNavAhover.style.cursor = 'hand';
			primaryNavAhover.style.color = 'white';
			primaryNavAhover.style.fontWeight = 'normal';

			styles.push( primaryNavAhover );
			
			for( var s in styles ){
				styleBlock = styleBlock + styles[s].toString();
			}
						     
			return styleBlock;
		}
		
		ThemeSheetWriter.prototype.writeNavigationStyle = writeNavigationStyle;
		
		function writeLocationStyle(){
		
			var styleBlock = '';
		
			var styles = [];
			
			var titleArea = new ThemeClass.ThemeClass( 'titleArea' );
			titleArea.style.margin = '0';
			titleArea.style.paddingTop = '5px';
		    titleArea.style.border = '0';
		    titleArea.style.background = this.location;
			titleArea.style.background = '-webkit-gradient(linear, left top, left bottom, color-stop(0%,' + this.location + '), color-stop(100%,' + this.location + '))';
		    titleArea.style.borderBottom = '1px solid ' + this.location ;
		    titleArea.style.minHeight = '20px';
		    
		    styles.push( titleArea );

			var breadcrumb = new ThemeClass.ThemeClass( 'breadcrumb' );
			breadcrumb.style.fontSize = '8pt';
			breadcrumb.style.textDecoration = 'none';
			breadcrumb.style.color = '#f1f1f2;';
			breadcrumb.style.paddingTop = '2px';
			
			styles.push( breadcrumb );
			
			var aBreadcrumbHover = new ThemeClass.ThemeClass( 'a.breadcrumb:hover' );
			aBreadcrumbHover.style.textDecoration = 'none';
			aBreadcrumbHover.style.borderBottom = '1px dotted';
			aBreadcrumbHover.style.color = '#F58B0F';
			aBreadcrumbHover.style.cursor = 'pointer';
			
			styles.push( aBreadcrumbHover );

			var breadcrumbSeparator = new ThemeClass.ThemeClass( 'breadcrumbSeparator' );
			breadcrumbSeparator.style.fontSize = '8pt';
			breadcrumbSeparator.style.textDecoration = 'none';
			breadcrumbSeparator.style.color = this.separator;
			breadcrumbSeparator.style.fontWeight = 'bold';
			
			styles.push( breadcrumbSeparator );
			
			var currentLocation = new ThemeClass.ThemeClass( 'currentLocation' );
			currentLocation.style.fontWeight = 'bold';
			currentLocation.style.fontSize = '8pt';
			currentLocation.style.color = this.breadcrumb; //this.navbar; // should be a separate themeable item but hard coded for now.
			currentLocation.style.textDecoration = 'none';
			currentLocation.style.textWrap = 'normal';
			currentLocation.style.lineHeight = '10pt';
			
			styles.push( currentLocation );
			
			var currentLocationHover = new ThemeClass.ThemeClass( 'a.currentLocation:hover' );
			currentLocationHover.style.fontWeight = 'bold';
			currentLocationHover.style.fontSize = '10pt';
			currentLocationHover.style.color = '#666666';
			currentLocationHover.style.textDecoration = 'none';
			currentLocationHover.style.borderBottom = '0';
			
			styles.push( currentLocationHover );
			
			var navlinkonpage = new ThemeClass.ThemeClass( 'navlinkonpage' );
			navlinkonpage.style.color = this.content;
			navlinkonpage.style.verticalAlign = 'middle';
			
			styles.push( navlinkonpage );
			
			if (this.bannerProgress) {
				var progressIndicator = new ThemeClass.ThemeClass( 'topRowBanner .progressPane_running' );
				progressIndicator.style.borderColor = this.bannerProgress;
				styles.push( progressIndicator );
			}	
			
			for( var s in styles ){
				styleBlock = styleBlock + styles[s].toString();
			}
			
			var parseStyles = function(object, ancestors, className, result) {
				if (!ancestors) {
					if (className) {
						parseStyles(object, "." + className, className, result);
					} 
					return;
				}
				var localResult = [];
				var keys = Object.keys(object);
				keys.forEach(function(key) {
					var value = object[key];
					if (typeof value === "string") {
						localResult.push("\t" + key + ": " + value + ";"); 
					} else {
						parseStyles(
							value,
							className === key ? ancestors : ancestors + " " +  key,
							className,
							result);
					}
				});
				if (localResult.length) {
					result.push(ancestors +  " {");
					result.push.apply(result, localResult);
					result.push("}");
				}
			};
			//	-webkit-touch-callout: none;
			//	-webkit-user-select: none;
			//	-khtml-user-select: none;
			//	-moz-user-select: none;
			//	-ms-user-select: none;
			styles.push( commandButton );
			
			var commandButtonOver = new ThemeClass.ThemeClass( 'commandButton:over' );
			commandButtonOver.style.backgroundColor = '#e6e6e6';
			commandButtonOver.style.border = '1px solid #808080';
			styles.push( commandButtonOver );

			var result = [""];
			parseStyles(settings.styles, "", themeClass, result);
			return result.join("\n");
			commandMenu.style.verticalAlign = 'baseline';
			commandMenu.style.margin = '0';
			commandMenu.style.fontSize = '8pt';
			commandMenu.style.fontWeight = 'normal';
			commandMenu.style.border = '1px solid #dedede'; // see https://bugs.eclipse.org/bugs/show_bug.cgi?id=386702#c2
			commandMenu.style.backgroundColor = '#efefef';
		    commandMenu.style.cursor = 'pointer';
		    commandMenu.style.borderRadius = '1px';
			styles.push( commandMenu );
	
			var commandMenuItem = new ThemeClass.ThemeClass( 'commandMenuItem' );
			commandMenuItem.style.border = '0';
			commandMenuItem.style.padding = '0';
			commandMenuItem.style.margin = '0';
			styles.push( commandMenuItem );
			
			for( var s in styles ){
				styleBlock = styleBlock + styles[s].toString();
			}
			
			return styleBlock;
		}
		
		ThemeSheetWriter.prototype.writeButtonStyle = writeButtonStyle;
		
		function writeMainStyle(){
		
			var styleBlock = '';
		
			var styles = [];
			
			var searchbox = new ThemeClass.ThemeClass( 'searchbox' );
			searchbox.style.backgroundImage = 'url(../images/core_sprites.png)';
		    searchbox.style.backgroundRepeat = 'no-repeat'; 
		    searchbox.style.backgroundPosition = '4px -297px'; 
			searchbox.style.width = '12px'; 
			searchbox.style.height = '12px';
		    searchbox.style.backgroundColor = this.search;
			searchbox.style.border = '1px solid ' + this.search;
			searchbox.style.fontSize = '11px';
			searchbox.style.width = '15em';
			searchbox.style.height = '16px';
			searchbox.style.borderRadius = '10px'; /* 10px */
			searchbox.style.color = '#999';
			searchbox.style.padding = '0';
			searchbox.style.paddingLeft = '20px';
			searchbox.style.marginLeft = '5px';
			searchbox.style.marginTop = '6px !important';
			searchbox.style.font = '7pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif !important';
			
			styles.push( searchbox );
			
			var searchboxFocus = new ThemeClass.ThemeClass( 'searchbox:focus' );
			searchboxFocus.style.color = 'white';
			searchboxFocus.style.outline = 'none';
			
			styles.push( searchboxFocus );
			
			var checkedRow = new ThemeClass.ThemeClass( 'checkedRow' );
			checkedRow.style.cssText = 'background-color:' + this.selection + ' !important;';
			
			styles.push( checkedRow );
			
			var navItemSelected = new ThemeClass.ThemeClass( 'navbar-item-selected' );
			navItemSelected.style.background = this.selection;
			navItemSelected.style.color = this.content;
			
			styles.push( navItemSelected );
			
			var auxpane = new ThemeClass.ThemeClass( 'auxpane' );
			auxpane.style.border = '0';
			auxpane.style.background = this.sidepanel;
			styles.push( auxpane );
			
			var mainpane = new ThemeClass.ThemeClass( 'mainpane' );
			mainpane.style.background = this.mainpanel;
			mainpane.style.border = 0;
			
			styles.push( mainpane );
			
			var mainToolbar = new ThemeClass.ThemeClass( 'mainToolbar' );
			mainToolbar.style.background = this.toolpanel;
			styles.push( mainToolbar );
	
			for( var s in styles ){
				styleBlock = styleBlock + styles[s].toString();
			}
			
			return styleBlock;
		}
		
		function ThemeSheetWriter(){}
		
		function render( anchor ){
			console.log( this.writeNavigationStyle() );
			console.log( this.writeLocationStyle() );
			console.log( this.writeMainStyle() );
			console.log( this.writeButtonStyle() );
		}
		
		ThemeSheetWriter.prototype.render = render;
		
		function getSheet(themeClass, settings ){
			var sheet = writeStyleString(themeClass, settings);
			return sheet;
//			if( settings.navbar.value ){	
//				this.navbar = settings.navbar.value;
//				this.button = settings.button.value;
//				this.location = settings.location.value;
//				this.selection = settings.selection.value;
//				this.sidepanel = settings.sidepanel.value;
//				this.mainpanel = settings.mainpanel.value;
//				this.navtext = settings.navtext.value;
//				this.search = settings.search.value;
//				this.content = settings.content.value;
//				this.toolpanel = settings.toolpanel.value;
//				this.bannerProgress = settings.bannerProgress.value;
//			}else{
//				this.navbar = settings.navbar;
//				this.button = settings.button;
//				this.location = settings.location;
//				this.selection = settings.selection;
//				this.sidepanel = settings.sidepanel;
//				this.mainpanel = settings.mainpanel;
//				this.navtext = settings.navtext;
//				this.search = settings.search;
//				this.content = settings.content;
//				this.toolpanel = settings.toolpanel;
//				this.bannerProgress = settings.bannerProgress;
//			}
//			
//			var sheet = this.writeNavigationStyle() + this.writeLocationStyle() + this.writeMainStyle() + this.writeButtonStyle();
//			
//			return sheet;
		}
		
		ThemeSheetWriter.prototype.getSheet = getSheet;

		};

	}
);

Return to bug 507788

Added Link Here

(-)a/bundles/org.eclipse.orion.client.ui/web/js-tests/ui/widgets/widgetsTests.js (+115 lines)
1	/*******************************************************************************
2	* @license
3	* Copyright (c) 2016 IBM Corporation and others.
4	* All rights reserved. This program and the accompanying materials are made
5	* available under the terms of the Eclipse Public License v1.0
6	* (http://www.eclipse.org/legal/epl-v10.html), and the Eclipse Distribution
7	* License v1.0 (http://www.eclipse.org/org/documents/edl-v10.html).
8	*
9	* Contributors: Casey Flynn - Google Inc. - initial API and implementation
10	******************************************************************************/
11	/eslint-env browser, amd, mocha/
12	define([
13	'chai/chai',
14	'orion/widgets/themes/container/ThemeSheetWriter',
15	], function(chai, ThemeSheetWriter) {
16	var assert = chai.assert;
17
18	var themeSheetWriter;
19
20	var setUp = function() {
21	themeSheetWriter = new ThemeSheetWriter.ThemeSheetWriter();
22	},
23	tearDown = function() {
24	themeSheetWriter = null;
25	};
26	describe("Widgets", function() {
27	beforeEach(setUp);
28	afterEach(tearDown);
29	describe("Theme Sheet Writer", function() {
30	it("Should write a valid style string", function() {
31	var settings = {
32	"styles": {
33	".selector" : {
34	"attribute" : "value"
35	}
36	}
37	};
38
39	var expected = "\n"+
40	".orionPage .selector {\n"+
41	"\tattribute: value;\n"+
42	"}";
43
44
45	var actual = themeSheetWriter.getSheet("orionPage", settings);
46	assert.equal(actual, expected);
47	});
48	it("Should write a valid style string - 2", function() {
49	var settings = {
50	"styles": {
51	".multi.selector" : {
52	"attribute0" : "value0"
53	},
54	".selector" : {
55	".nested.multi.selector" : {
56	"attribute1" : "value1",
57	"attribute2" : "value2"
58	},
59	"attribute3" : "value3"
60	},
61	"#idSelector" : {
62	"attribute4" : "value4"
63	}
64	}
65	};
66
67	var expected = "\n"+
68	".orionPage .multi.selector {\n"+
69	" attribute0: value0;\n"+
70	"}\n"+
71	".orionPage .selector .nested.multi.selector {\n"+
72	" attribute1: value1;\n"+
73	" attribute2: value2;\n"+
74	"}\n"+
75	".orionPage .selector {\n"+
76	" attribute3: value3;\n"+
77	"}\n"+
78	".orionPage #idSelector {\n"+
79	" attribute4: value4;\n"+
80	"}";
81
82	var actual = themeSheetWriter.getSheet("orionPage", settings);
83	assert.equal(actual, expected);
84	});
85	it("Should return an empty style if no className is specified", function() {
86	var settings = {
87	"styles": {
88	".selector" : {
89	"attribute" : "value"
90	}
91	}
92	};
93
94	var expected = "";
95	var actual = themeSheetWriter.getSheet(null, settings);
96	assert.equal(actual, expected);
97	});
98	it ("Should return an empty style if style is invalid - 1", function() {
99	var expected = "";
100	var actual = themeSheetWriter.getSheet(null, null);
101	assert.equal(expected, actual);
102	});
103	it ("Should return an empty style if style is invalid - 2", function() {
104	var expected = "";
105	var actual = themeSheetWriter.getSheet(null, "");
106	assert.equal(expected, actual);
107	});
108	it ("Should return an empty style if style is invalid - 3", function() {
109	var expected = "";
110	var actual = themeSheetWriter.getSheet(null, []);
111	assert.equal(expected, actual);
112	});
113	});
114	});
115	});