diff --git a/editor/browser.js b/editor/browser.js
index 8b5e5b4a..04a484a5 100644
--- a/editor/browser.js
+++ b/editor/browser.js
@@ -16,20 +16,20 @@
 'use strict';
 
 if (!svgedit.browser) {
-	svgedit.browser = {};
+  svgedit.browser = {};
 }
 
 // alias
 var NS = svgedit.NS;
 
 var supportsSvg_ = (function () {
-	return !!document.createElementNS && !!document.createElementNS(NS.SVG, 'svg').createSVGRect;
+  return !!document.createElementNS && !!document.createElementNS(NS.SVG, 'svg').createSVGRect;
 }());
 
 svgedit.browser.supportsSvg = function () { return supportsSvg_; };
 if (!svgedit.browser.supportsSvg()) {
-	window.location = 'browser-not-supported.html';
-	return;
+  window.location = 'browser-not-supported.html';
+  return;
 }
 
 var userAgent = navigator.userAgent;
@@ -46,120 +46,120 @@ var isMac_ = userAgent.indexOf('Macintosh') >= 0;
 var isTouch_ = 'ontouchstart' in window;
 
 var supportsSelectors_ = (function () {
-	return !!svg.querySelector;
+  return !!svg.querySelector;
 }());
 
 var supportsXpath_ = (function () {
-	return !!document.evaluate;
+  return !!document.evaluate;
 }());
 
 // segList functions (for FF1.5 and 2.0)
 var supportsPathReplaceItem_ = (function () {
-	var path = document.createElementNS(NS.SVG, 'path');
-	path.setAttribute('d', 'M0,0 10,10');
-	var seglist = path.pathSegList;
-	var seg = path.createSVGPathSegLinetoAbs(5, 5);
-	try {
-		seglist.replaceItem(seg, 1);
-		return true;
-	} catch (err) {}
-	return false;
+  var path = document.createElementNS(NS.SVG, 'path');
+  path.setAttribute('d', 'M0,0 10,10');
+  var seglist = path.pathSegList;
+  var seg = path.createSVGPathSegLinetoAbs(5, 5);
+  try {
+    seglist.replaceItem(seg, 1);
+    return true;
+  } catch (err) {}
+  return false;
 }());
 
 var supportsPathInsertItemBefore_ = (function () {
-	var path = document.createElementNS(NS.SVG, 'path');
-	path.setAttribute('d', 'M0,0 10,10');
-	var seglist = path.pathSegList;
-	var seg = path.createSVGPathSegLinetoAbs(5, 5);
-	try {
-		seglist.insertItemBefore(seg, 1);
-		return true;
-	} catch (err) {}
-	return false;
+  var path = document.createElementNS(NS.SVG, 'path');
+  path.setAttribute('d', 'M0,0 10,10');
+  var seglist = path.pathSegList;
+  var seg = path.createSVGPathSegLinetoAbs(5, 5);
+  try {
+    seglist.insertItemBefore(seg, 1);
+    return true;
+  } catch (err) {}
+  return false;
 }());
 
 // text character positioning (for IE9)
 var supportsGoodTextCharPos_ = (function () {
-	var svgroot = document.createElementNS(NS.SVG, 'svg');
-	var svgcontent = document.createElementNS(NS.SVG, 'svg');
-	document.documentElement.appendChild(svgroot);
-	svgcontent.setAttribute('x', 5);
-	svgroot.appendChild(svgcontent);
-	var text = document.createElementNS(NS.SVG, 'text');
-	text.textContent = 'a';
-	svgcontent.appendChild(text);
-	var pos = text.getStartPositionOfChar(0).x;
-	document.documentElement.removeChild(svgroot);
-	return (pos === 0);
+  var svgroot = document.createElementNS(NS.SVG, 'svg');
+  var svgcontent = document.createElementNS(NS.SVG, 'svg');
+  document.documentElement.appendChild(svgroot);
+  svgcontent.setAttribute('x', 5);
+  svgroot.appendChild(svgcontent);
+  var text = document.createElementNS(NS.SVG, 'text');
+  text.textContent = 'a';
+  svgcontent.appendChild(text);
+  var pos = text.getStartPositionOfChar(0).x;
+  document.documentElement.removeChild(svgroot);
+  return (pos === 0);
 }());
 
 var supportsPathBBox_ = (function () {
-	var svgcontent = document.createElementNS(NS.SVG, 'svg');
-	document.documentElement.appendChild(svgcontent);
-	var path = document.createElementNS(NS.SVG, 'path');
-	path.setAttribute('d', 'M0,0 C0,0 10,10 10,0');
-	svgcontent.appendChild(path);
-	var bbox = path.getBBox();
-	document.documentElement.removeChild(svgcontent);
-	return (bbox.height > 4 && bbox.height < 5);
+  var svgcontent = document.createElementNS(NS.SVG, 'svg');
+  document.documentElement.appendChild(svgcontent);
+  var path = document.createElementNS(NS.SVG, 'path');
+  path.setAttribute('d', 'M0,0 C0,0 10,10 10,0');
+  svgcontent.appendChild(path);
+  var bbox = path.getBBox();
+  document.documentElement.removeChild(svgcontent);
+  return (bbox.height > 4 && bbox.height < 5);
 }());
 
 // Support for correct bbox sizing on groups with horizontal/vertical lines
 var supportsHVLineContainerBBox_ = (function () {
-	var svgcontent = document.createElementNS(NS.SVG, 'svg');
-	document.documentElement.appendChild(svgcontent);
-	var path = document.createElementNS(NS.SVG, 'path');
-	path.setAttribute('d', 'M0,0 10,0');
-	var path2 = document.createElementNS(NS.SVG, 'path');
-	path2.setAttribute('d', 'M5,0 15,0');
-	var g = document.createElementNS(NS.SVG, 'g');
-	g.appendChild(path);
-	g.appendChild(path2);
-	svgcontent.appendChild(g);
-	var bbox = g.getBBox();
-	document.documentElement.removeChild(svgcontent);
-	// Webkit gives 0, FF gives 10, Opera (correctly) gives 15
-	return (bbox.width === 15);
+  var svgcontent = document.createElementNS(NS.SVG, 'svg');
+  document.documentElement.appendChild(svgcontent);
+  var path = document.createElementNS(NS.SVG, 'path');
+  path.setAttribute('d', 'M0,0 10,0');
+  var path2 = document.createElementNS(NS.SVG, 'path');
+  path2.setAttribute('d', 'M5,0 15,0');
+  var g = document.createElementNS(NS.SVG, 'g');
+  g.appendChild(path);
+  g.appendChild(path2);
+  svgcontent.appendChild(g);
+  var bbox = g.getBBox();
+  document.documentElement.removeChild(svgcontent);
+  // Webkit gives 0, FF gives 10, Opera (correctly) gives 15
+  return (bbox.width === 15);
 }());
 
 var supportsEditableText_ = (function () {
-	// TODO: Find better way to check support for this
-	return isOpera_;
+  // TODO: Find better way to check support for this
+  return isOpera_;
 }());
 
 var supportsGoodDecimals_ = (function () {
-	// Correct decimals on clone attributes (Opera < 10.5/win/non-en)
-	var rect = document.createElementNS(NS.SVG, 'rect');
-	rect.setAttribute('x', 0.1);
-	var crect = rect.cloneNode(false);
-	var retValue = (crect.getAttribute('x').indexOf(',') === -1);
-	if (!retValue) {
-		$.alert('NOTE: This version of Opera is known to contain bugs in SVG-edit.\n' +
-		'Please upgrade to the <a href="http://opera.com">latest version</a> in which the problems have been fixed.');
-	}
-	return retValue;
+  // Correct decimals on clone attributes (Opera < 10.5/win/non-en)
+  var rect = document.createElementNS(NS.SVG, 'rect');
+  rect.setAttribute('x', 0.1);
+  var crect = rect.cloneNode(false);
+  var retValue = (crect.getAttribute('x').indexOf(',') === -1);
+  if (!retValue) {
+    $.alert('NOTE: This version of Opera is known to contain bugs in SVG-edit.\n' +
+    'Please upgrade to the <a href="http://opera.com">latest version</a> in which the problems have been fixed.');
+  }
+  return retValue;
 }());
 
 var supportsNonScalingStroke_ = (function () {
-	var rect = document.createElementNS(NS.SVG, 'rect');
-	rect.setAttribute('style', 'vector-effect:non-scaling-stroke');
-	return rect.style.vectorEffect === 'non-scaling-stroke';
+  var rect = document.createElementNS(NS.SVG, 'rect');
+  rect.setAttribute('style', 'vector-effect:non-scaling-stroke');
+  return rect.style.vectorEffect === 'non-scaling-stroke';
 }());
 
 var supportsNativeSVGTransformLists_ = (function () {
-	var rect = document.createElementNS(NS.SVG, 'rect');
-	var rxform = rect.transform.baseVal;
-	var t1 = svg.createSVGTransform();
-	rxform.appendItem(t1);
-	var r1 = rxform.getItem(0);
-	return r1 instanceof SVGTransform && t1 instanceof SVGTransform &&
-		r1.type === t1.type && r1.angle === t1.angle &&
-		r1.matrix.a === t1.matrix.a &&
-		r1.matrix.b === t1.matrix.b &&
-		r1.matrix.c === t1.matrix.c &&
-		r1.matrix.d === t1.matrix.d &&
-		r1.matrix.e === t1.matrix.e &&
-		r1.matrix.f === t1.matrix.f;
+  var rect = document.createElementNS(NS.SVG, 'rect');
+  var rxform = rect.transform.baseVal;
+  var t1 = svg.createSVGTransform();
+  rxform.appendItem(t1);
+  var r1 = rxform.getItem(0);
+  return r1 instanceof SVGTransform && t1 instanceof SVGTransform &&
+    r1.type === t1.type && r1.angle === t1.angle &&
+    r1.matrix.a === t1.matrix.a &&
+    r1.matrix.b === t1.matrix.b &&
+    r1.matrix.c === t1.matrix.c &&
+    r1.matrix.d === t1.matrix.d &&
+    r1.matrix.e === t1.matrix.e &&
+    r1.matrix.f === t1.matrix.f;
 }());
 
 // Public API
diff --git a/editor/config-sample.js b/editor/config-sample.js
index fc8c24f6..39ad9095 100644
--- a/editor/config-sample.js
+++ b/editor/config-sample.js
@@ -21,86 +21,86 @@ See svg-editor.js for documentation on using setConfig().
 
 // URL OVERRIDE CONFIG
 svgEditor.setConfig({
-	/**
-	To override the ability for URLs to set URL-based SVG content,
-	    uncomment the following:
-	*/
-	// preventURLContentLoading: true,
-	/**
-	To override the ability for URLs to set other configuration (including
-	    extension config), uncomment the following:
-	*/
-	// preventAllURLConfig: true,
-	/**
-	To override the ability for URLs to set their own extensions,
-	  uncomment the following (note that if setConfig() is used in
-	  extension code, it will still be additive to extensions,
-	  however):
-	*/
-	// lockExtensions: true,
+  /**
+  To override the ability for URLs to set URL-based SVG content,
+      uncomment the following:
+  */
+  // preventURLContentLoading: true,
+  /**
+  To override the ability for URLs to set other configuration (including
+      extension config), uncomment the following:
+  */
+  // preventAllURLConfig: true,
+  /**
+  To override the ability for URLs to set their own extensions,
+    uncomment the following (note that if setConfig() is used in
+    extension code, it will still be additive to extensions,
+    however):
+  */
+  // lockExtensions: true,
 });
 
 svgEditor.setConfig({
-	/*
-	Provide default values here which differ from that of the editor but
-		which the URL can override
-	*/
+  /*
+  Provide default values here which differ from that of the editor but
+    which the URL can override
+  */
 }, {allowInitialUserOverride: true});
 
 // EXTENSION CONFIG
 svgEditor.setConfig({
-	extensions: [
-		// 'ext-overview_window.js', 'ext-markers.js', 'ext-connector.js', 'ext-eyedropper.js', 'ext-shapes.js', 'ext-imagelib.js', 'ext-grid.js', 'ext-polygon.js', 'ext-star.js', 'ext-panning.js', 'ext-storage.js'
-	]
-	// , noDefaultExtensions: false, // noDefaultExtensions can only be meaningfully used in config.js or in the URL
+  extensions: [
+    // 'ext-overview_window.js', 'ext-markers.js', 'ext-connector.js', 'ext-eyedropper.js', 'ext-shapes.js', 'ext-imagelib.js', 'ext-grid.js', 'ext-polygon.js', 'ext-star.js', 'ext-panning.js', 'ext-storage.js'
+  ]
+  // , noDefaultExtensions: false, // noDefaultExtensions can only be meaningfully used in config.js or in the URL
 });
 
 // OTHER CONFIG
 svgEditor.setConfig({
-	// canvasName: 'default',
-	// canvas_expansion: 3,
-	// initFill: {
-	// 	color: 'FF0000', // solid red
-	// 	opacity: 1
-	// },
-	// initStroke: {
-	// 	width: 5,
-	// 	color: '000000', // solid black
-	// 	opacity: 1
-	// },
-	// initOpacity: 1,
-	// colorPickerCSS: null,
-	// initTool: 'select',
-	// exportWindowType: 'new', // 'same'
-	// wireframe: false,
-	// showlayers: false,
-	// no_save_warning: false,
-	// PATH CONFIGURATION
-	// imgPath: 'images/',
-	// langPath: 'locale/',
-	// extPath: 'extensions/',
-	// jGraduatePath: 'jgraduate/images/',
-	/*
-	Uncomment the following to allow at least same domain (embedded) access,
-	including file:// access.
-	Setting as `['*']` would allow any domain to access but would be unsafe to
-	data privacy and integrity.
-	*/
-	// allowedOrigins: [window.location.origin || 'null'], // May be 'null' (as a string) when used as a file:// URL
-	// DOCUMENT PROPERTIES
-	// dimensions: [640, 480],
-	// EDITOR OPTIONS
-	// gridSnapping: false,
-	// gridColor: '#000',
-	// baseUnit: 'px',
-	// snappingStep: 10,
-	// showRulers: true,
-	// EXTENSION-RELATED (GRID)
-	// showGrid: false, // Set by ext-grid.js
-	// EXTENSION-RELATED (STORAGE)
-	// noStorageOnLoad: false, // Some interaction with ext-storage.js; prevent even the loading of previously saved local storage
-	// forceStorage: false, // Some interaction with ext-storage.js; strongly discouraged from modification as it bypasses user privacy by preventing them from choosing whether to keep local storage or not
-	// emptyStorageOnDecline: true, // Used by ext-storage.js; empty any prior storage if the user declines to store
+  // canvasName: 'default',
+  // canvas_expansion: 3,
+  // initFill: {
+  // 	color: 'FF0000', // solid red
+  // 	opacity: 1
+  // },
+  // initStroke: {
+  // 	width: 5,
+  // 	color: '000000', // solid black
+  // 	opacity: 1
+  // },
+  // initOpacity: 1,
+  // colorPickerCSS: null,
+  // initTool: 'select',
+  // exportWindowType: 'new', // 'same'
+  // wireframe: false,
+  // showlayers: false,
+  // no_save_warning: false,
+  // PATH CONFIGURATION
+  // imgPath: 'images/',
+  // langPath: 'locale/',
+  // extPath: 'extensions/',
+  // jGraduatePath: 'jgraduate/images/',
+  /*
+  Uncomment the following to allow at least same domain (embedded) access,
+  including file:// access.
+  Setting as `['*']` would allow any domain to access but would be unsafe to
+  data privacy and integrity.
+  */
+  // allowedOrigins: [window.location.origin || 'null'], // May be 'null' (as a string) when used as a file:// URL
+  // DOCUMENT PROPERTIES
+  // dimensions: [640, 480],
+  // EDITOR OPTIONS
+  // gridSnapping: false,
+  // gridColor: '#000',
+  // baseUnit: 'px',
+  // snappingStep: 10,
+  // showRulers: true,
+  // EXTENSION-RELATED (GRID)
+  // showGrid: false, // Set by ext-grid.js
+  // EXTENSION-RELATED (STORAGE)
+  // noStorageOnLoad: false, // Some interaction with ext-storage.js; prevent even the loading of previously saved local storage
+  // forceStorage: false, // Some interaction with ext-storage.js; strongly discouraged from modification as it bypasses user privacy by preventing them from choosing whether to keep local storage or not
+  // emptyStorageOnDecline: true, // Used by ext-storage.js; empty any prior storage if the user declines to store
 });
 
 // PREF CHANGES
@@ -118,29 +118,29 @@ As with configuration, one may use allowInitialUserOverride, but
   are hard-coded here regardless of URL or prior user storage setting.
 */
 svgEditor.setConfig(
-	{
-		// lang: '', // Set dynamically within locale.js if not previously set
-		// iconsize: '', // Will default to 's' if the window height is smaller than the minimum height and 'm' otherwise
-		/**
-		* When showing the preferences dialog, svg-editor.js currently relies
-		* on curPrefs instead of $.pref, so allowing an override for bkgd_color
-		* means that this value won't have priority over block auto-detection as
-		* far as determining which color shows initially in the preferences
-		* dialog (though it can be changed and saved).
-		*/
-		// bkgd_color: '#FFF',
-		// bkgd_url: '',
-		// img_save: 'embed',
-		// Only shows in UI as far as alert notices
-		// save_notice_done: false,
-		// export_notice_done: false
-	}
+  {
+    // lang: '', // Set dynamically within locale.js if not previously set
+    // iconsize: '', // Will default to 's' if the window height is smaller than the minimum height and 'm' otherwise
+    /**
+    * When showing the preferences dialog, svg-editor.js currently relies
+    * on curPrefs instead of $.pref, so allowing an override for bkgd_color
+    * means that this value won't have priority over block auto-detection as
+    * far as determining which color shows initially in the preferences
+    * dialog (though it can be changed and saved).
+    */
+    // bkgd_color: '#FFF',
+    // bkgd_url: '',
+    // img_save: 'embed',
+    // Only shows in UI as far as alert notices
+    // save_notice_done: false,
+    // export_notice_done: false
+  }
 );
 svgEditor.setConfig(
-	{
-		// Indicate pref settings here if you wish to allow user storage or URL settings
-		//   to be able to override your default preferences (unless other config options
-		//   have already explicitly prevented one or the other)
-	},
-	{allowInitialUserOverride: true}
+  {
+    // Indicate pref settings here if you wish to allow user storage or URL settings
+    //   to be able to override your default preferences (unless other config options
+    //   have already explicitly prevented one or the other)
+  },
+  {allowInitialUserOverride: true}
 );
diff --git a/editor/contextmenu.js b/editor/contextmenu.js
index 986c462c..0df08ab4 100644
--- a/editor/contextmenu.js
+++ b/editor/contextmenu.js
@@ -13,51 +13,51 @@ var svgedit = svgedit || {}; // eslint-disable-line no-use-before-define
 (function () {
 var self = this;
 if (!svgedit.contextmenu) {
-	svgedit.contextmenu = {};
+  svgedit.contextmenu = {};
 }
 self.contextMenuExtensions = {};
 var menuItemIsValid = function (menuItem) {
-	return menuItem && menuItem.id && menuItem.label && menuItem.action && typeof menuItem.action === 'function';
+  return menuItem && menuItem.id && menuItem.label && menuItem.action && typeof menuItem.action === 'function';
 };
 var addContextMenuItem = function (menuItem) {
-	// menuItem: {id, label, shortcut, action}
-	if (!menuItemIsValid(menuItem)) {
-		console.error('Menu items must be defined and have at least properties: id, label, action, where action must be a function');
-		return;
-	}
-	if (menuItem.id in self.contextMenuExtensions) {
-		console.error('Cannot add extension "' + menuItem.id + '", an extension by that name already exists"');
-		return;
-	}
-	// Register menuItem action, see below for deferred menu dom injection
-	console.log('Registed contextmenu item: {id:' + menuItem.id + ', label:' + menuItem.label + '}');
-	self.contextMenuExtensions[menuItem.id] = menuItem;
-	// TODO: Need to consider how to handle custom enable/disable behavior
+  // menuItem: {id, label, shortcut, action}
+  if (!menuItemIsValid(menuItem)) {
+    console.error('Menu items must be defined and have at least properties: id, label, action, where action must be a function');
+    return;
+  }
+  if (menuItem.id in self.contextMenuExtensions) {
+    console.error('Cannot add extension "' + menuItem.id + '", an extension by that name already exists"');
+    return;
+  }
+  // Register menuItem action, see below for deferred menu dom injection
+  console.log('Registed contextmenu item: {id:' + menuItem.id + ', label:' + menuItem.label + '}');
+  self.contextMenuExtensions[menuItem.id] = menuItem;
+  // TODO: Need to consider how to handle custom enable/disable behavior
 };
 var hasCustomHandler = function (handlerKey) {
-	return self.contextMenuExtensions[handlerKey] && true;
+  return self.contextMenuExtensions[handlerKey] && true;
 };
 var getCustomHandler = function (handlerKey) {
-	return self.contextMenuExtensions[handlerKey].action;
+  return self.contextMenuExtensions[handlerKey].action;
 };
 var injectExtendedContextMenuItemIntoDom = function (menuItem) {
-	if (Object.keys(self.contextMenuExtensions).length === 0) {
-		// all menuItems appear at the bottom of the menu in their own container.
-		// if this is the first extension menu we need to add the separator.
-		$('#cmenu_canvas').append("<li class='separator'>");
-	}
-	var shortcut = menuItem.shortcut || '';
-	$('#cmenu_canvas').append("<li class='disabled'><a href='#" + menuItem.id + "'>" +
-		menuItem.label + "<span class='shortcut'>" +
-		shortcut + '</span></a></li>');
+  if (Object.keys(self.contextMenuExtensions).length === 0) {
+    // all menuItems appear at the bottom of the menu in their own container.
+    // if this is the first extension menu we need to add the separator.
+    $('#cmenu_canvas').append("<li class='separator'>");
+  }
+  var shortcut = menuItem.shortcut || '';
+  $('#cmenu_canvas').append("<li class='disabled'><a href='#" + menuItem.id + "'>" +
+    menuItem.label + "<span class='shortcut'>" +
+    shortcut + '</span></a></li>');
 };
 // Defer injection to wait out initial menu processing. This probably goes away once all context
 // menu behavior is brought here.
 svgEditor.ready(function () {
-	var menuItem;
-	for (menuItem in self.contextMenuExtensions) {
-		injectExtendedContextMenuItemIntoDom(self.contextMenuExtensions[menuItem]);
-	}
+  var menuItem;
+  for (menuItem in self.contextMenuExtensions) {
+    injectExtendedContextMenuItemIntoDom(self.contextMenuExtensions[menuItem]);
+  }
 });
 svgedit.contextmenu.resetCustomMenus = function () { self.contextMenuExtensions = {}; };
 svgedit.contextmenu.add = addContextMenuItem;
diff --git a/editor/coords.js b/editor/coords.js
index 760e1e4c..682f2273 100644
--- a/editor/coords.js
+++ b/editor/coords.js
@@ -22,12 +22,12 @@ var svgedit = svgedit || {}; // eslint-disable-line no-use-before-define
 'use strict';
 
 if (!svgedit.coords) {
-	svgedit.coords = {};
+  svgedit.coords = {};
 }
 
 // this is how we map paths to our preferred relative segment types
 var pathMap = [0, 'z', 'M', 'm', 'L', 'l', 'C', 'c', 'Q', 'q', 'A', 'a',
-	'H', 'h', 'V', 'v', 'S', 's', 'T', 't'];
+  'H', 'h', 'V', 'v', 'S', 's', 'T', 't'];
 
 /**
  * @typedef editorContext
@@ -41,7 +41,7 @@ var editorContext_ = null;
 * @param {editorContext} editorContext
 */
 svgedit.coords.init = function (editorContext) {
-	editorContext_ = editorContext;
+  editorContext_ = editorContext;
 };
 
 /**
@@ -51,266 +51,266 @@ svgedit.coords.init = function (editorContext) {
  * @param {SVGMatrix} m - Matrix object to use for remapping coordinates
 */
 svgedit.coords.remapElement = function (selected, changes, m) {
-	var i, type,
-		remap = function (x, y) { return svgedit.math.transformPoint(x, y, m); },
-		scalew = function (w) { return m.a * w; },
-		scaleh = function (h) { return m.d * h; },
-		doSnapping = editorContext_.getGridSnapping() && selected.parentNode.parentNode.localName === 'svg',
-		finishUp = function () {
-			var o;
-			if (doSnapping) {
-				for (o in changes) {
-					changes[o] = svgedit.utilities.snapToGrid(changes[o]);
-				}
-			}
-			svgedit.utilities.assignAttributes(selected, changes, 1000, true);
-		},
-		box = svgedit.utilities.getBBox(selected);
+  var i, type,
+    remap = function (x, y) { return svgedit.math.transformPoint(x, y, m); },
+    scalew = function (w) { return m.a * w; },
+    scaleh = function (h) { return m.d * h; },
+    doSnapping = editorContext_.getGridSnapping() && selected.parentNode.parentNode.localName === 'svg',
+    finishUp = function () {
+      var o;
+      if (doSnapping) {
+        for (o in changes) {
+          changes[o] = svgedit.utilities.snapToGrid(changes[o]);
+        }
+      }
+      svgedit.utilities.assignAttributes(selected, changes, 1000, true);
+    },
+    box = svgedit.utilities.getBBox(selected);
 
-	for (i = 0; i < 2; i++) {
-		type = i === 0 ? 'fill' : 'stroke';
-		var attrVal = selected.getAttribute(type);
-		if (attrVal && attrVal.indexOf('url(') === 0) {
-			if (m.a < 0 || m.d < 0) {
-				var grad = svgedit.utilities.getRefElem(attrVal);
-				var newgrad = grad.cloneNode(true);
-				if (m.a < 0) {
-					// flip x
-					var x1 = newgrad.getAttribute('x1');
-					var x2 = newgrad.getAttribute('x2');
-					newgrad.setAttribute('x1', -(x1 - 1));
-					newgrad.setAttribute('x2', -(x2 - 1));
-				}
+  for (i = 0; i < 2; i++) {
+    type = i === 0 ? 'fill' : 'stroke';
+    var attrVal = selected.getAttribute(type);
+    if (attrVal && attrVal.indexOf('url(') === 0) {
+      if (m.a < 0 || m.d < 0) {
+        var grad = svgedit.utilities.getRefElem(attrVal);
+        var newgrad = grad.cloneNode(true);
+        if (m.a < 0) {
+          // flip x
+          var x1 = newgrad.getAttribute('x1');
+          var x2 = newgrad.getAttribute('x2');
+          newgrad.setAttribute('x1', -(x1 - 1));
+          newgrad.setAttribute('x2', -(x2 - 1));
+        }
 
-				if (m.d < 0) {
-					// flip y
-					var y1 = newgrad.getAttribute('y1');
-					var y2 = newgrad.getAttribute('y2');
-					newgrad.setAttribute('y1', -(y1 - 1));
-					newgrad.setAttribute('y2', -(y2 - 1));
-				}
-				newgrad.id = editorContext_.getDrawing().getNextId();
-				svgedit.utilities.findDefs().appendChild(newgrad);
-				selected.setAttribute(type, 'url(#' + newgrad.id + ')');
-			}
+        if (m.d < 0) {
+          // flip y
+          var y1 = newgrad.getAttribute('y1');
+          var y2 = newgrad.getAttribute('y2');
+          newgrad.setAttribute('y1', -(y1 - 1));
+          newgrad.setAttribute('y2', -(y2 - 1));
+        }
+        newgrad.id = editorContext_.getDrawing().getNextId();
+        svgedit.utilities.findDefs().appendChild(newgrad);
+        selected.setAttribute(type, 'url(#' + newgrad.id + ')');
+      }
 
-			// Not really working :(
-			// if (selected.tagName === 'path') {
-			// 	reorientGrads(selected, m);
-			// }
-		}
-	}
+      // Not really working :(
+      // if (selected.tagName === 'path') {
+      // 	reorientGrads(selected, m);
+      // }
+    }
+  }
 
-	var elName = selected.tagName;
-	var chlist, mt;
-	if (elName === 'g' || elName === 'text' || elName === 'tspan' || elName === 'use') {
-		// if it was a translate, then just update x,y
-		if (m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && (m.e !== 0 || m.f !== 0)) {
-			// [T][M] = [M][T']
-			// therefore [T'] = [M_inv][T][M]
-			var existing = svgedit.math.transformListToTransform(selected).matrix,
-				tNew = svgedit.math.matrixMultiply(existing.inverse(), m, existing);
-			changes.x = parseFloat(changes.x) + tNew.e;
-			changes.y = parseFloat(changes.y) + tNew.f;
-		} else {
-			// we just absorb all matrices into the element and don't do any remapping
-			chlist = svgedit.transformlist.getTransformList(selected);
-			mt = svgroot.createSVGTransform();
-			mt.setMatrix(svgedit.math.matrixMultiply(svgedit.math.transformListToTransform(chlist).matrix, m));
-			chlist.clear();
-			chlist.appendItem(mt);
-		}
-	}
-	var c, pt, pt1, pt2, len;
-	// now we have a set of changes and an applied reduced transform list
-	// we apply the changes directly to the DOM
-	switch (elName) {
-	case 'foreignObject':
-	case 'rect':
-	case 'image':
-		// Allow images to be inverted (give them matrix when flipped)
-		if (elName === 'image' && (m.a < 0 || m.d < 0)) {
-			// Convert to matrix
-			chlist = svgedit.transformlist.getTransformList(selected);
-			mt = svgroot.createSVGTransform();
-			mt.setMatrix(svgedit.math.matrixMultiply(svgedit.math.transformListToTransform(chlist).matrix, m));
-			chlist.clear();
-			chlist.appendItem(mt);
-		} else {
-			pt1 = remap(changes.x, changes.y);
-			changes.width = scalew(changes.width);
-			changes.height = scaleh(changes.height);
-			changes.x = pt1.x + Math.min(0, changes.width);
-			changes.y = pt1.y + Math.min(0, changes.height);
-			changes.width = Math.abs(changes.width);
-			changes.height = Math.abs(changes.height);
-		}
-		finishUp();
-		break;
-	case 'ellipse':
-		c = remap(changes.cx, changes.cy);
-		changes.cx = c.x;
-		changes.cy = c.y;
-		changes.rx = scalew(changes.rx);
-		changes.ry = scaleh(changes.ry);
-		changes.rx = Math.abs(changes.rx);
-		changes.ry = Math.abs(changes.ry);
-		finishUp();
-		break;
-	case 'circle':
-		c = remap(changes.cx, changes.cy);
-		changes.cx = c.x;
-		changes.cy = c.y;
-		// take the minimum of the new selected box's dimensions for the new circle radius
-		var tbox = svgedit.math.transformBox(box.x, box.y, box.width, box.height, m);
-		var w = tbox.tr.x - tbox.tl.x, h = tbox.bl.y - tbox.tl.y;
-		changes.r = Math.min(w / 2, h / 2);
+  var elName = selected.tagName;
+  var chlist, mt;
+  if (elName === 'g' || elName === 'text' || elName === 'tspan' || elName === 'use') {
+    // if it was a translate, then just update x,y
+    if (m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && (m.e !== 0 || m.f !== 0)) {
+      // [T][M] = [M][T']
+      // therefore [T'] = [M_inv][T][M]
+      var existing = svgedit.math.transformListToTransform(selected).matrix,
+        tNew = svgedit.math.matrixMultiply(existing.inverse(), m, existing);
+      changes.x = parseFloat(changes.x) + tNew.e;
+      changes.y = parseFloat(changes.y) + tNew.f;
+    } else {
+      // we just absorb all matrices into the element and don't do any remapping
+      chlist = svgedit.transformlist.getTransformList(selected);
+      mt = svgroot.createSVGTransform();
+      mt.setMatrix(svgedit.math.matrixMultiply(svgedit.math.transformListToTransform(chlist).matrix, m));
+      chlist.clear();
+      chlist.appendItem(mt);
+    }
+  }
+  var c, pt, pt1, pt2, len;
+  // now we have a set of changes and an applied reduced transform list
+  // we apply the changes directly to the DOM
+  switch (elName) {
+  case 'foreignObject':
+  case 'rect':
+  case 'image':
+    // Allow images to be inverted (give them matrix when flipped)
+    if (elName === 'image' && (m.a < 0 || m.d < 0)) {
+      // Convert to matrix
+      chlist = svgedit.transformlist.getTransformList(selected);
+      mt = svgroot.createSVGTransform();
+      mt.setMatrix(svgedit.math.matrixMultiply(svgedit.math.transformListToTransform(chlist).matrix, m));
+      chlist.clear();
+      chlist.appendItem(mt);
+    } else {
+      pt1 = remap(changes.x, changes.y);
+      changes.width = scalew(changes.width);
+      changes.height = scaleh(changes.height);
+      changes.x = pt1.x + Math.min(0, changes.width);
+      changes.y = pt1.y + Math.min(0, changes.height);
+      changes.width = Math.abs(changes.width);
+      changes.height = Math.abs(changes.height);
+    }
+    finishUp();
+    break;
+  case 'ellipse':
+    c = remap(changes.cx, changes.cy);
+    changes.cx = c.x;
+    changes.cy = c.y;
+    changes.rx = scalew(changes.rx);
+    changes.ry = scaleh(changes.ry);
+    changes.rx = Math.abs(changes.rx);
+    changes.ry = Math.abs(changes.ry);
+    finishUp();
+    break;
+  case 'circle':
+    c = remap(changes.cx, changes.cy);
+    changes.cx = c.x;
+    changes.cy = c.y;
+    // take the minimum of the new selected box's dimensions for the new circle radius
+    var tbox = svgedit.math.transformBox(box.x, box.y, box.width, box.height, m);
+    var w = tbox.tr.x - tbox.tl.x, h = tbox.bl.y - tbox.tl.y;
+    changes.r = Math.min(w / 2, h / 2);
 
-		if (changes.r) { changes.r = Math.abs(changes.r); }
-		finishUp();
-		break;
-	case 'line':
-		pt1 = remap(changes.x1, changes.y1);
-		pt2 = remap(changes.x2, changes.y2);
-		changes.x1 = pt1.x;
-		changes.y1 = pt1.y;
-		changes.x2 = pt2.x;
-		changes.y2 = pt2.y;
-		// deliberately fall through here
-	case 'text':
-	case 'tspan':
-	case 'use':
-		finishUp();
-		break;
-	case 'g':
-		var gsvg = $(selected).data('gsvg');
-		if (gsvg) {
-			svgedit.utilities.assignAttributes(gsvg, changes, 1000, true);
-		}
-		break;
-	case 'polyline':
-	case 'polygon':
-		len = changes.points.length;
-		for (i = 0; i < len; ++i) {
-			pt = changes.points[i];
-			pt = remap(pt.x, pt.y);
-			changes.points[i].x = pt.x;
-			changes.points[i].y = pt.y;
-		}
+    if (changes.r) { changes.r = Math.abs(changes.r); }
+    finishUp();
+    break;
+  case 'line':
+    pt1 = remap(changes.x1, changes.y1);
+    pt2 = remap(changes.x2, changes.y2);
+    changes.x1 = pt1.x;
+    changes.y1 = pt1.y;
+    changes.x2 = pt2.x;
+    changes.y2 = pt2.y;
+    // deliberately fall through here
+  case 'text':
+  case 'tspan':
+  case 'use':
+    finishUp();
+    break;
+  case 'g':
+    var gsvg = $(selected).data('gsvg');
+    if (gsvg) {
+      svgedit.utilities.assignAttributes(gsvg, changes, 1000, true);
+    }
+    break;
+  case 'polyline':
+  case 'polygon':
+    len = changes.points.length;
+    for (i = 0; i < len; ++i) {
+      pt = changes.points[i];
+      pt = remap(pt.x, pt.y);
+      changes.points[i].x = pt.x;
+      changes.points[i].y = pt.y;
+    }
 
-		len = changes.points.length;
-		var pstr = '';
-		for (i = 0; i < len; ++i) {
-			pt = changes.points[i];
-			pstr += pt.x + ',' + pt.y + ' ';
-		}
-		selected.setAttribute('points', pstr);
-		break;
-	case 'path':
-		var seg;
-		var segList = selected.pathSegList;
-		len = segList.numberOfItems;
-		changes.d = [];
-		for (i = 0; i < len; ++i) {
-			seg = segList.getItem(i);
-			changes.d[i] = {
-				type: seg.pathSegType,
-				x: seg.x,
-				y: seg.y,
-				x1: seg.x1,
-				y1: seg.y1,
-				x2: seg.x2,
-				y2: seg.y2,
-				r1: seg.r1,
-				r2: seg.r2,
-				angle: seg.angle,
-				largeArcFlag: seg.largeArcFlag,
-				sweepFlag: seg.sweepFlag
-			};
-		}
+    len = changes.points.length;
+    var pstr = '';
+    for (i = 0; i < len; ++i) {
+      pt = changes.points[i];
+      pstr += pt.x + ',' + pt.y + ' ';
+    }
+    selected.setAttribute('points', pstr);
+    break;
+  case 'path':
+    var seg;
+    var segList = selected.pathSegList;
+    len = segList.numberOfItems;
+    changes.d = [];
+    for (i = 0; i < len; ++i) {
+      seg = segList.getItem(i);
+      changes.d[i] = {
+        type: seg.pathSegType,
+        x: seg.x,
+        y: seg.y,
+        x1: seg.x1,
+        y1: seg.y1,
+        x2: seg.x2,
+        y2: seg.y2,
+        r1: seg.r1,
+        r2: seg.r2,
+        angle: seg.angle,
+        largeArcFlag: seg.largeArcFlag,
+        sweepFlag: seg.sweepFlag
+      };
+    }
 
-		len = changes.d.length;
-		var firstseg = changes.d[0],
-			currentpt = remap(firstseg.x, firstseg.y);
-		changes.d[0].x = currentpt.x;
-		changes.d[0].y = currentpt.y;
-		for (i = 1; i < len; ++i) {
-			seg = changes.d[i];
-			type = seg.type;
-			// if absolute or first segment, we want to remap x, y, x1, y1, x2, y2
-			// if relative, we want to scalew, scaleh
-			if (type % 2 === 0) { // absolute
-				var thisx = (seg.x !== undefined) ? seg.x : currentpt.x, // for V commands
-					thisy = (seg.y !== undefined) ? seg.y : currentpt.y; // for H commands
-				pt = remap(thisx, thisy);
-				pt1 = remap(seg.x1, seg.y1);
-				pt2 = remap(seg.x2, seg.y2);
-				seg.x = pt.x;
-				seg.y = pt.y;
-				seg.x1 = pt1.x;
-				seg.y1 = pt1.y;
-				seg.x2 = pt2.x;
-				seg.y2 = pt2.y;
-				seg.r1 = scalew(seg.r1);
-				seg.r2 = scaleh(seg.r2);
-			} else { // relative
-				seg.x = scalew(seg.x);
-				seg.y = scaleh(seg.y);
-				seg.x1 = scalew(seg.x1);
-				seg.y1 = scaleh(seg.y1);
-				seg.x2 = scalew(seg.x2);
-				seg.y2 = scaleh(seg.y2);
-				seg.r1 = scalew(seg.r1);
-				seg.r2 = scaleh(seg.r2);
-			}
-		} // for each segment
+    len = changes.d.length;
+    var firstseg = changes.d[0],
+      currentpt = remap(firstseg.x, firstseg.y);
+    changes.d[0].x = currentpt.x;
+    changes.d[0].y = currentpt.y;
+    for (i = 1; i < len; ++i) {
+      seg = changes.d[i];
+      type = seg.type;
+      // if absolute or first segment, we want to remap x, y, x1, y1, x2, y2
+      // if relative, we want to scalew, scaleh
+      if (type % 2 === 0) { // absolute
+        var thisx = (seg.x !== undefined) ? seg.x : currentpt.x, // for V commands
+          thisy = (seg.y !== undefined) ? seg.y : currentpt.y; // for H commands
+        pt = remap(thisx, thisy);
+        pt1 = remap(seg.x1, seg.y1);
+        pt2 = remap(seg.x2, seg.y2);
+        seg.x = pt.x;
+        seg.y = pt.y;
+        seg.x1 = pt1.x;
+        seg.y1 = pt1.y;
+        seg.x2 = pt2.x;
+        seg.y2 = pt2.y;
+        seg.r1 = scalew(seg.r1);
+        seg.r2 = scaleh(seg.r2);
+      } else { // relative
+        seg.x = scalew(seg.x);
+        seg.y = scaleh(seg.y);
+        seg.x1 = scalew(seg.x1);
+        seg.y1 = scaleh(seg.y1);
+        seg.x2 = scalew(seg.x2);
+        seg.y2 = scaleh(seg.y2);
+        seg.r1 = scalew(seg.r1);
+        seg.r2 = scaleh(seg.r2);
+      }
+    } // for each segment
 
-		var dstr = '';
-		len = changes.d.length;
-		for (i = 0; i < len; ++i) {
-			seg = changes.d[i];
-			type = seg.type;
-			dstr += pathMap[type];
-			switch (type) {
-			case 13: // relative horizontal line (h)
-			case 12: // absolute horizontal line (H)
-				dstr += seg.x + ' ';
-				break;
-			case 15: // relative vertical line (v)
-			case 14: // absolute vertical line (V)
-				dstr += seg.y + ' ';
-				break;
-			case 3: // relative move (m)
-			case 5: // relative line (l)
-			case 19: // relative smooth quad (t)
-			case 2: // absolute move (M)
-			case 4: // absolute line (L)
-			case 18: // absolute smooth quad (T)
-				dstr += seg.x + ',' + seg.y + ' ';
-				break;
-			case 7: // relative cubic (c)
-			case 6: // absolute cubic (C)
-				dstr += seg.x1 + ',' + seg.y1 + ' ' + seg.x2 + ',' + seg.y2 + ' ' +
-					seg.x + ',' + seg.y + ' ';
-				break;
-			case 9: // relative quad (q)
-			case 8: // absolute quad (Q)
-				dstr += seg.x1 + ',' + seg.y1 + ' ' + seg.x + ',' + seg.y + ' ';
-				break;
-			case 11: // relative elliptical arc (a)
-			case 10: // absolute elliptical arc (A)
-				dstr += seg.r1 + ',' + seg.r2 + ' ' + seg.angle + ' ' + (+seg.largeArcFlag) +
-					' ' + (+seg.sweepFlag) + ' ' + seg.x + ',' + seg.y + ' ';
-				break;
-			case 17: // relative smooth cubic (s)
-			case 16: // absolute smooth cubic (S)
-				dstr += seg.x2 + ',' + seg.y2 + ' ' + seg.x + ',' + seg.y + ' ';
-				break;
-			}
-		}
+    var dstr = '';
+    len = changes.d.length;
+    for (i = 0; i < len; ++i) {
+      seg = changes.d[i];
+      type = seg.type;
+      dstr += pathMap[type];
+      switch (type) {
+      case 13: // relative horizontal line (h)
+      case 12: // absolute horizontal line (H)
+        dstr += seg.x + ' ';
+        break;
+      case 15: // relative vertical line (v)
+      case 14: // absolute vertical line (V)
+        dstr += seg.y + ' ';
+        break;
+      case 3: // relative move (m)
+      case 5: // relative line (l)
+      case 19: // relative smooth quad (t)
+      case 2: // absolute move (M)
+      case 4: // absolute line (L)
+      case 18: // absolute smooth quad (T)
+        dstr += seg.x + ',' + seg.y + ' ';
+        break;
+      case 7: // relative cubic (c)
+      case 6: // absolute cubic (C)
+        dstr += seg.x1 + ',' + seg.y1 + ' ' + seg.x2 + ',' + seg.y2 + ' ' +
+          seg.x + ',' + seg.y + ' ';
+        break;
+      case 9: // relative quad (q)
+      case 8: // absolute quad (Q)
+        dstr += seg.x1 + ',' + seg.y1 + ' ' + seg.x + ',' + seg.y + ' ';
+        break;
+      case 11: // relative elliptical arc (a)
+      case 10: // absolute elliptical arc (A)
+        dstr += seg.r1 + ',' + seg.r2 + ' ' + seg.angle + ' ' + (+seg.largeArcFlag) +
+          ' ' + (+seg.sweepFlag) + ' ' + seg.x + ',' + seg.y + ' ';
+        break;
+      case 17: // relative smooth cubic (s)
+      case 16: // absolute smooth cubic (S)
+        dstr += seg.x2 + ',' + seg.y2 + ' ' + seg.x + ',' + seg.y + ' ';
+        break;
+      }
+    }
 
-		selected.setAttribute('d', dstr);
-		break;
-	}
+    selected.setAttribute('d', dstr);
+    break;
+  }
 };
 }());
diff --git a/editor/draw.js b/editor/draw.js
index 9799cd9f..7080b9f0 100644
--- a/editor/draw.js
+++ b/editor/draw.js
@@ -17,7 +17,7 @@
 'use strict';
 
 if (!svgedit.draw) {
-	svgedit.draw = {};
+  svgedit.draw = {};
 }
 // alias
 var NS = svgedit.NS;
@@ -25,9 +25,9 @@ var NS = svgedit.NS;
 var visElems = 'a,circle,ellipse,foreignObject,g,image,line,path,polygon,polyline,rect,svg,text,tspan,use'.split(',');
 
 var RandomizeModes = {
-	LET_DOCUMENT_DECIDE: 0,
-	ALWAYS_RANDOMIZE: 1,
-	NEVER_RANDOMIZE: 2
+  LET_DOCUMENT_DECIDE: 0,
+  ALWAYS_RANDOMIZE: 1,
+  NEVER_RANDOMIZE: 2
 };
 var randomizeIds = RandomizeModes.LET_DOCUMENT_DECIDE;
 
@@ -38,15 +38,15 @@ var randomizeIds = RandomizeModes.LET_DOCUMENT_DECIDE;
  * @param {svgedit.draw.Drawing} currentDrawing
  */
 svgedit.draw.randomizeIds = function (enableRandomization, currentDrawing) {
-	randomizeIds = enableRandomization === false
-		? RandomizeModes.NEVER_RANDOMIZE
-		: RandomizeModes.ALWAYS_RANDOMIZE;
+  randomizeIds = enableRandomization === false
+    ? RandomizeModes.NEVER_RANDOMIZE
+    : RandomizeModes.ALWAYS_RANDOMIZE;
 
-	if (randomizeIds === RandomizeModes.ALWAYS_RANDOMIZE && !currentDrawing.getNonce()) {
-		currentDrawing.setNonce(Math.floor(Math.random() * 100001));
-	} else if (randomizeIds === RandomizeModes.NEVER_RANDOMIZE && currentDrawing.getNonce()) {
-		currentDrawing.clearNonce();
-	}
+  if (randomizeIds === RandomizeModes.ALWAYS_RANDOMIZE && !currentDrawing.getNonce()) {
+    currentDrawing.setNonce(Math.floor(Math.random() * 100001));
+  } else if (randomizeIds === RandomizeModes.NEVER_RANDOMIZE && currentDrawing.getNonce()) {
+    currentDrawing.clearNonce();
+  }
 };
 
 /**
@@ -57,72 +57,72 @@ svgedit.draw.randomizeIds = function (enableRandomization, currentDrawing) {
  * @param {String=svg_} [optIdPrefix] - The ID prefix to use.
  */
 svgedit.draw.Drawing = function (svgElem, optIdPrefix) {
-	if (!svgElem || !svgElem.tagName || !svgElem.namespaceURI ||
-		svgElem.tagName !== 'svg' || svgElem.namespaceURI !== NS.SVG) {
-		throw new Error('Error: svgedit.draw.Drawing instance initialized without a <svg> element');
-	}
+  if (!svgElem || !svgElem.tagName || !svgElem.namespaceURI ||
+    svgElem.tagName !== 'svg' || svgElem.namespaceURI !== NS.SVG) {
+    throw new Error('Error: svgedit.draw.Drawing instance initialized without a <svg> element');
+  }
 
-	/**
-	 * The SVG DOM Element that represents this drawing.
-	 * @type {SVGSVGElement}
-	 */
-	this.svgElem_ = svgElem;
+  /**
+   * The SVG DOM Element that represents this drawing.
+   * @type {SVGSVGElement}
+   */
+  this.svgElem_ = svgElem;
 
-	/**
-	 * The latest object number used in this drawing.
-	 * @type {number}
-	 */
-	this.obj_num = 0;
+  /**
+   * The latest object number used in this drawing.
+   * @type {number}
+   */
+  this.obj_num = 0;
 
-	/**
-	 * The prefix to prepend to each element id in the drawing.
-	 * @type {String}
-	 */
-	this.idPrefix = optIdPrefix || 'svg_';
+  /**
+   * The prefix to prepend to each element id in the drawing.
+   * @type {String}
+   */
+  this.idPrefix = optIdPrefix || 'svg_';
 
-	/**
-	 * An array of released element ids to immediately reuse.
-	 * @type {Array.<number>}
-	 */
-	this.releasedNums = [];
+  /**
+   * An array of released element ids to immediately reuse.
+   * @type {Array.<number>}
+   */
+  this.releasedNums = [];
 
-	/**
-	 * The z-ordered array of Layer objects. Each layer has a name
-	 * and group element.
-	 * The first layer is the one at the bottom of the rendering.
-	 * @type {Array.<Layer>}
-	 */
-	this.all_layers = [];
+  /**
+   * The z-ordered array of Layer objects. Each layer has a name
+   * and group element.
+   * The first layer is the one at the bottom of the rendering.
+   * @type {Array.<Layer>}
+   */
+  this.all_layers = [];
 
-	/**
-	 * Map of all_layers by name.
-	 *
-	 * Note: Layers are ordered, but referenced externally by name; so, we need both container
-	 * types depending on which function is called (i.e. all_layers and layer_map).
-	 *
-	 * @type {Object.<string, Layer>}
-	 */
-	this.layer_map = {};
+  /**
+   * Map of all_layers by name.
+   *
+   * Note: Layers are ordered, but referenced externally by name; so, we need both container
+   * types depending on which function is called (i.e. all_layers and layer_map).
+   *
+   * @type {Object.<string, Layer>}
+   */
+  this.layer_map = {};
 
-	/**
-	 * The current layer being used.
-	 * @type {Layer}
-	 */
-	this.current_layer = null;
+  /**
+   * The current layer being used.
+   * @type {Layer}
+   */
+  this.current_layer = null;
 
-	/**
-	 * The nonce to use to uniquely identify elements across drawings.
-	 * @type {!String}
-	 */
-	this.nonce_ = '';
-	var n = this.svgElem_.getAttributeNS(NS.SE, 'nonce');
-	// If already set in the DOM, use the nonce throughout the document
-	// else, if randomizeIds(true) has been called, create and set the nonce.
-	if (!!n && randomizeIds !== RandomizeModes.NEVER_RANDOMIZE) {
-		this.nonce_ = n;
-	} else if (randomizeIds === RandomizeModes.ALWAYS_RANDOMIZE) {
-		this.setNonce(Math.floor(Math.random() * 100001));
-	}
+  /**
+   * The nonce to use to uniquely identify elements across drawings.
+   * @type {!String}
+   */
+  this.nonce_ = '';
+  var n = this.svgElem_.getAttributeNS(NS.SE, 'nonce');
+  // If already set in the DOM, use the nonce throughout the document
+  // else, if randomizeIds(true) has been called, create and set the nonce.
+  if (!!n && randomizeIds !== RandomizeModes.NEVER_RANDOMIZE) {
+    this.nonce_ = n;
+  } else if (randomizeIds === RandomizeModes.ALWAYS_RANDOMIZE) {
+    this.setNonce(Math.floor(Math.random() * 100001));
+  }
 };
 
 /**
@@ -130,44 +130,44 @@ svgedit.draw.Drawing = function (svgElem, optIdPrefix) {
  * @returns {Element} SVG element within the root SVGSVGElement
 */
 svgedit.draw.Drawing.prototype.getElem_ = function (id) {
-	if (this.svgElem_.querySelector) {
-		// querySelector lookup
-		return this.svgElem_.querySelector('#' + id);
-	}
-	// jQuery lookup: twice as slow as xpath in FF
-	return $(this.svgElem_).find('[id=' + id + ']')[0];
+  if (this.svgElem_.querySelector) {
+    // querySelector lookup
+    return this.svgElem_.querySelector('#' + id);
+  }
+  // jQuery lookup: twice as slow as xpath in FF
+  return $(this.svgElem_).find('[id=' + id + ']')[0];
 };
 
 /**
  * @returns {SVGSVGElement}
  */
 svgedit.draw.Drawing.prototype.getSvgElem = function () {
-	return this.svgElem_;
+  return this.svgElem_;
 };
 
 /**
  * @returns {!string|number} The previously set nonce
  */
 svgedit.draw.Drawing.prototype.getNonce = function () {
-	return this.nonce_;
+  return this.nonce_;
 };
 
 /**
  * @param {!string|number} n The nonce to set
  */
 svgedit.draw.Drawing.prototype.setNonce = function (n) {
-	this.svgElem_.setAttributeNS(NS.XMLNS, 'xmlns:se', NS.SE);
-	this.svgElem_.setAttributeNS(NS.SE, 'se:nonce', n);
-	this.nonce_ = n;
+  this.svgElem_.setAttributeNS(NS.XMLNS, 'xmlns:se', NS.SE);
+  this.svgElem_.setAttributeNS(NS.SE, 'se:nonce', n);
+  this.nonce_ = n;
 };
 
 /**
  * Clears any previously set nonce
  */
 svgedit.draw.Drawing.prototype.clearNonce = function () {
-	// We deliberately leave any se:nonce attributes alone,
-	// we just don't use it to randomize ids.
-	this.nonce_ = '';
+  // We deliberately leave any se:nonce attributes alone,
+  // we just don't use it to randomize ids.
+  this.nonce_ = '';
 };
 
 /**
@@ -175,9 +175,9 @@ svgedit.draw.Drawing.prototype.clearNonce = function () {
  * @return {String} The latest object Id.
  */
 svgedit.draw.Drawing.prototype.getId = function () {
-	return this.nonce_
-		? this.idPrefix + this.nonce_ + '_' + this.obj_num
-		: this.idPrefix + this.obj_num;
+  return this.nonce_
+    ? this.idPrefix + this.nonce_ + '_' + this.obj_num
+    : this.idPrefix + this.obj_num;
 };
 
 /**
@@ -185,35 +185,35 @@ svgedit.draw.Drawing.prototype.getId = function () {
  * @return {String} The next object Id to use.
  */
 svgedit.draw.Drawing.prototype.getNextId = function () {
-	var oldObjNum = this.obj_num;
-	var restoreOldObjNum = false;
+  var oldObjNum = this.obj_num;
+  var restoreOldObjNum = false;
 
-	// If there are any released numbers in the release stack,
-	// use the last one instead of the next obj_num.
-	// We need to temporarily use obj_num as that is what getId() depends on.
-	if (this.releasedNums.length > 0) {
-		this.obj_num = this.releasedNums.pop();
-		restoreOldObjNum = true;
-	} else {
-		// If we are not using a released id, then increment the obj_num.
-		this.obj_num++;
-	}
+  // If there are any released numbers in the release stack,
+  // use the last one instead of the next obj_num.
+  // We need to temporarily use obj_num as that is what getId() depends on.
+  if (this.releasedNums.length > 0) {
+    this.obj_num = this.releasedNums.pop();
+    restoreOldObjNum = true;
+  } else {
+    // If we are not using a released id, then increment the obj_num.
+    this.obj_num++;
+  }
 
-	// Ensure the ID does not exist.
-	var id = this.getId();
-	while (this.getElem_(id)) {
-		if (restoreOldObjNum) {
-			this.obj_num = oldObjNum;
-			restoreOldObjNum = false;
-		}
-		this.obj_num++;
-		id = this.getId();
-	}
-	// Restore the old object number if required.
-	if (restoreOldObjNum) {
-		this.obj_num = oldObjNum;
-	}
-	return id;
+  // Ensure the ID does not exist.
+  var id = this.getId();
+  while (this.getElem_(id)) {
+    if (restoreOldObjNum) {
+      this.obj_num = oldObjNum;
+      restoreOldObjNum = false;
+    }
+    this.obj_num++;
+    id = this.getId();
+  }
+  // Restore the old object number if required.
+  if (restoreOldObjNum) {
+    this.obj_num = oldObjNum;
+  }
+  return id;
 };
 
 /**
@@ -224,24 +224,24 @@ svgedit.draw.Drawing.prototype.getNextId = function () {
  * @returns {boolean} True if the id was valid to be released, false otherwise.
 */
 svgedit.draw.Drawing.prototype.releaseId = function (id) {
-	// confirm if this is a valid id for this Document, else return false
-	var front = this.idPrefix + (this.nonce_ ? this.nonce_ + '_' : '');
-	if (typeof id !== 'string' || id.indexOf(front) !== 0) {
-		return false;
-	}
-	// extract the obj_num of this id
-	var num = parseInt(id.substr(front.length), 10);
+  // confirm if this is a valid id for this Document, else return false
+  var front = this.idPrefix + (this.nonce_ ? this.nonce_ + '_' : '');
+  if (typeof id !== 'string' || id.indexOf(front) !== 0) {
+    return false;
+  }
+  // extract the obj_num of this id
+  var num = parseInt(id.substr(front.length), 10);
 
-	// if we didn't get a positive number or we already released this number
-	// then return false.
-	if (typeof num !== 'number' || num <= 0 || this.releasedNums.indexOf(num) !== -1) {
-		return false;
-	}
+  // if we didn't get a positive number or we already released this number
+  // then return false.
+  if (typeof num !== 'number' || num <= 0 || this.releasedNums.indexOf(num) !== -1) {
+    return false;
+  }
 
-	// push the released number into the released queue
-	this.releasedNums.push(num);
+  // push the released number into the released queue
+  this.releasedNums.push(num);
 
-	return true;
+  return true;
 };
 
 /**
@@ -249,7 +249,7 @@ svgedit.draw.Drawing.prototype.releaseId = function (id) {
  * @returns {integer} The number of layers in the current drawing.
 */
 svgedit.draw.Drawing.prototype.getNumLayers = function () {
-	return this.all_layers.length;
+  return this.all_layers.length;
 };
 
 /**
@@ -257,7 +257,7 @@ svgedit.draw.Drawing.prototype.getNumLayers = function () {
  * @param {string} name - The layer name to check
 */
 svgedit.draw.Drawing.prototype.hasLayer = function (name) {
-	return this.layer_map[name] !== undefined;
+  return this.layer_map[name] !== undefined;
 };
 
 /**
@@ -266,14 +266,14 @@ svgedit.draw.Drawing.prototype.hasLayer = function (name) {
  * @returns {string} The name of the ith layer (or the empty string if none found)
 */
 svgedit.draw.Drawing.prototype.getLayerName = function (i) {
-	return i >= 0 && i < this.getNumLayers() ? this.all_layers[i].getName() : '';
+  return i >= 0 && i < this.getNumLayers() ? this.all_layers[i].getName() : '';
 };
 
 /**
  * @returns {SVGGElement} The SVGGElement representing the current layer.
  */
 svgedit.draw.Drawing.prototype.getCurrentLayer = function () {
-	return this.current_layer ? this.current_layer.getGroup() : null;
+  return this.current_layer ? this.current_layer.getGroup() : null;
 };
 
 /**
@@ -281,8 +281,8 @@ svgedit.draw.Drawing.prototype.getCurrentLayer = function () {
  * @returns {SVGGElement} The SVGGElement representing the named layer or null.
  */
 svgedit.draw.Drawing.prototype.getLayerByName = function (name) {
-	var layer = this.layer_map[name];
-	return layer ? layer.getGroup() : null;
+  var layer = this.layer_map[name];
+  return layer ? layer.getGroup() : null;
 };
 
 /**
@@ -291,7 +291,7 @@ svgedit.draw.Drawing.prototype.getLayerByName = function (name) {
  * @returns {string} The name of the currently active layer (or the empty string if none found).
 */
 svgedit.draw.Drawing.prototype.getCurrentLayerName = function () {
-	return this.current_layer ? this.current_layer.getName() : '';
+  return this.current_layer ? this.current_layer.getName() : '';
 };
 
 /**
@@ -301,16 +301,16 @@ svgedit.draw.Drawing.prototype.getCurrentLayerName = function () {
  * @returns {string|null} The new name if changed; otherwise, null.
  */
 svgedit.draw.Drawing.prototype.setCurrentLayerName = function (name, hrService) {
-	var finalName = null;
-	if (this.current_layer) {
-		var oldName = this.current_layer.getName();
-		finalName = this.current_layer.setName(name, hrService);
-		if (finalName) {
-			delete this.layer_map[oldName];
-			this.layer_map[finalName] = this.current_layer;
-		}
-	}
-	return finalName;
+  var finalName = null;
+  if (this.current_layer) {
+    var oldName = this.current_layer.getName();
+    finalName = this.current_layer.setName(name, hrService);
+    if (finalName) {
+      delete this.layer_map[oldName];
+      this.layer_map[finalName] = this.current_layer;
+    }
+  }
+  return finalName;
 };
 
 /**
@@ -319,89 +319,89 @@ svgedit.draw.Drawing.prototype.setCurrentLayerName = function (name, hrService)
  * @returns {Object} If the name was changed, returns {title:SVGGElement, previousName:string}; otherwise null.
  */
 svgedit.draw.Drawing.prototype.setCurrentLayerPosition = function (newpos) {
-	var layerCount = this.getNumLayers();
-	if (!this.current_layer || newpos < 0 || newpos >= layerCount) {
-		return null;
-	}
+  var layerCount = this.getNumLayers();
+  if (!this.current_layer || newpos < 0 || newpos >= layerCount) {
+    return null;
+  }
 
-	var oldpos;
-	for (oldpos = 0; oldpos < layerCount; ++oldpos) {
-		if (this.all_layers[oldpos] === this.current_layer) { break; }
-	}
-	// some unknown error condition (current_layer not in all_layers)
-	if (oldpos === layerCount) { return null; }
+  var oldpos;
+  for (oldpos = 0; oldpos < layerCount; ++oldpos) {
+    if (this.all_layers[oldpos] === this.current_layer) { break; }
+  }
+  // some unknown error condition (current_layer not in all_layers)
+  if (oldpos === layerCount) { return null; }
 
-	if (oldpos !== newpos) {
-		// if our new position is below us, we need to insert before the node after newpos
-		var refGroup = null;
-		var currentGroup = this.current_layer.getGroup();
-		var oldNextSibling = currentGroup.nextSibling;
-		if (newpos > oldpos) {
-			if (newpos < layerCount - 1) {
-				refGroup = this.all_layers[newpos + 1].getGroup();
-			}
-		// if our new position is above us, we need to insert before the node at newpos
-		} else {
-			refGroup = this.all_layers[newpos].getGroup();
-		}
-		this.svgElem_.insertBefore(currentGroup, refGroup);
+  if (oldpos !== newpos) {
+    // if our new position is below us, we need to insert before the node after newpos
+    var refGroup = null;
+    var currentGroup = this.current_layer.getGroup();
+    var oldNextSibling = currentGroup.nextSibling;
+    if (newpos > oldpos) {
+      if (newpos < layerCount - 1) {
+        refGroup = this.all_layers[newpos + 1].getGroup();
+      }
+    // if our new position is above us, we need to insert before the node at newpos
+    } else {
+      refGroup = this.all_layers[newpos].getGroup();
+    }
+    this.svgElem_.insertBefore(currentGroup, refGroup);
 
-		this.identifyLayers();
-		this.setCurrentLayer(this.getLayerName(newpos));
+    this.identifyLayers();
+    this.setCurrentLayer(this.getLayerName(newpos));
 
-		return {
-			currentGroup: currentGroup,
-			oldNextSibling: oldNextSibling
-		};
-	}
-	return null;
+    return {
+      currentGroup: currentGroup,
+      oldNextSibling: oldNextSibling
+    };
+  }
+  return null;
 };
 
 svgedit.draw.Drawing.prototype.mergeLayer = function (hrService) {
-	var currentGroup = this.current_layer.getGroup();
-	var prevGroup = $(currentGroup).prev()[0];
-	if (!prevGroup) { return; }
+  var currentGroup = this.current_layer.getGroup();
+  var prevGroup = $(currentGroup).prev()[0];
+  if (!prevGroup) { return; }
 
-	hrService.startBatchCommand('Merge Layer');
+  hrService.startBatchCommand('Merge Layer');
 
-	var layerNextSibling = currentGroup.nextSibling;
-	hrService.removeElement(currentGroup, layerNextSibling, this.svgElem_);
+  var layerNextSibling = currentGroup.nextSibling;
+  hrService.removeElement(currentGroup, layerNextSibling, this.svgElem_);
 
-	while (currentGroup.firstChild) {
-		var child = currentGroup.firstChild;
-		if (child.localName === 'title') {
-			hrService.removeElement(child, child.nextSibling, currentGroup);
-			currentGroup.removeChild(child);
-			continue;
-		}
-		var oldNextSibling = child.nextSibling;
-		prevGroup.appendChild(child);
-		hrService.moveElement(child, oldNextSibling, currentGroup);
-	}
+  while (currentGroup.firstChild) {
+    var child = currentGroup.firstChild;
+    if (child.localName === 'title') {
+      hrService.removeElement(child, child.nextSibling, currentGroup);
+      currentGroup.removeChild(child);
+      continue;
+    }
+    var oldNextSibling = child.nextSibling;
+    prevGroup.appendChild(child);
+    hrService.moveElement(child, oldNextSibling, currentGroup);
+  }
 
-	// Remove current layer's group
-	this.current_layer.removeGroup();
-	// Remove the current layer and set the previous layer as the new current layer
-	var index = this.all_layers.indexOf(this.current_layer);
-	if (index > 0) {
-		var name = this.current_layer.getName();
-		this.current_layer = this.all_layers[index - 1];
-		this.all_layers.splice(index, 1);
-		delete this.layer_map[name];
-	}
+  // Remove current layer's group
+  this.current_layer.removeGroup();
+  // Remove the current layer and set the previous layer as the new current layer
+  var index = this.all_layers.indexOf(this.current_layer);
+  if (index > 0) {
+    var name = this.current_layer.getName();
+    this.current_layer = this.all_layers[index - 1];
+    this.all_layers.splice(index, 1);
+    delete this.layer_map[name];
+  }
 
-	hrService.endBatchCommand();
+  hrService.endBatchCommand();
 };
 
 svgedit.draw.Drawing.prototype.mergeAllLayers = function (hrService) {
-	// Set the current layer to the last layer.
-	this.current_layer = this.all_layers[this.all_layers.length - 1];
+  // Set the current layer to the last layer.
+  this.current_layer = this.all_layers[this.all_layers.length - 1];
 
-	hrService.startBatchCommand('Merge all Layers');
-	while (this.all_layers.length > 1) {
-		this.mergeLayer(hrService);
-	}
-	hrService.endBatchCommand();
+  hrService.startBatchCommand('Merge all Layers');
+  while (this.all_layers.length > 1) {
+    this.mergeLayer(hrService);
+  }
+  hrService.endBatchCommand();
 };
 
 /**
@@ -412,16 +412,16 @@ svgedit.draw.Drawing.prototype.mergeAllLayers = function (hrService) {
  * @returns {boolean} true if the current layer was switched, otherwise false
  */
 svgedit.draw.Drawing.prototype.setCurrentLayer = function (name) {
-	var layer = this.layer_map[name];
-	if (layer) {
-		if (this.current_layer) {
-			this.current_layer.deactivate();
-		}
-		this.current_layer = layer;
-		this.current_layer.activate();
-		return true;
-	}
-	return false;
+  var layer = this.layer_map[name];
+  if (layer) {
+    if (this.current_layer) {
+      this.current_layer.deactivate();
+    }
+    this.current_layer = layer;
+    this.current_layer.activate();
+    return true;
+  }
+  return false;
 };
 
 /**
@@ -430,12 +430,12 @@ svgedit.draw.Drawing.prototype.setCurrentLayer = function (name) {
  * @returns {SVGGElement} The SVGGElement of the layer removed or null.
  */
 svgedit.draw.Drawing.prototype.deleteCurrentLayer = function () {
-	if (this.current_layer && this.getNumLayers() > 1) {
-		var oldLayerGroup = this.current_layer.removeGroup();
-		this.identifyLayers();
-		return oldLayerGroup;
-	}
-	return null;
+  if (this.current_layer && this.getNumLayers() > 1) {
+    var oldLayerGroup = this.current_layer.removeGroup();
+    this.identifyLayers();
+    return oldLayerGroup;
+  }
+  return null;
 };
 
 /**
@@ -444,13 +444,13 @@ svgedit.draw.Drawing.prototype.deleteCurrentLayer = function () {
  * @returns {string} The layer name or empty string.
  */
 function findLayerNameInGroup (group) {
-	var name = $('title', group).text();
+  var name = $('title', group).text();
 
-	// Hack for Opera 10.60
-	if (!name && svgedit.browser.isOpera() && group.querySelectorAll) {
-		name = $(group.querySelectorAll('title')).text();
-	}
-	return name;
+  // Hack for Opera 10.60
+  if (!name && svgedit.browser.isOpera() && group.querySelectorAll) {
+    name = $(group.querySelectorAll('title')).text();
+  }
+  return name;
 }
 
 /**
@@ -459,10 +459,10 @@ function findLayerNameInGroup (group) {
  * @returns {string} - The new name.
  */
 function getNewLayerName (existingLayerNames) {
-	var i = 1;
-	// TODO(codedread): What about internationalization of "Layer"?
-	while (existingLayerNames.indexOf(('Layer ' + i)) >= 0) { i++; }
-	return 'Layer ' + i;
+  var i = 1;
+  // TODO(codedread): What about internationalization of "Layer"?
+  while (existingLayerNames.indexOf(('Layer ' + i)) >= 0) { i++; }
+  return 'Layer ' + i;
 }
 
 /**
@@ -470,46 +470,46 @@ function getNewLayerName (existingLayerNames) {
  * top-most layer (last <g> child of this drawing).
 */
 svgedit.draw.Drawing.prototype.identifyLayers = function () {
-	this.all_layers = [];
-	this.layer_map = {};
-	var numchildren = this.svgElem_.childNodes.length;
-	// loop through all children of SVG element
-	var orphans = [], layernames = [];
-	var layer = null;
-	var childgroups = false;
-	for (var i = 0; i < numchildren; ++i) {
-		var child = this.svgElem_.childNodes.item(i);
-		// for each g, find its layer name
-		if (child && child.nodeType === 1) {
-			if (child.tagName === 'g') {
-				childgroups = true;
-				var name = findLayerNameInGroup(child);
-				if (name) {
-					layernames.push(name);
-					layer = new svgedit.draw.Layer(name, child);
-					this.all_layers.push(layer);
-					this.layer_map[name] = layer;
-				} else {
-					// if group did not have a name, it is an orphan
-					orphans.push(child);
-				}
-			} else if (~visElems.indexOf(child.nodeName)) {
-				// Child is "visible" (i.e. not a <title> or <defs> element), so it is an orphan
-				orphans.push(child);
-			}
-		}
-	}
+  this.all_layers = [];
+  this.layer_map = {};
+  var numchildren = this.svgElem_.childNodes.length;
+  // loop through all children of SVG element
+  var orphans = [], layernames = [];
+  var layer = null;
+  var childgroups = false;
+  for (var i = 0; i < numchildren; ++i) {
+    var child = this.svgElem_.childNodes.item(i);
+    // for each g, find its layer name
+    if (child && child.nodeType === 1) {
+      if (child.tagName === 'g') {
+        childgroups = true;
+        var name = findLayerNameInGroup(child);
+        if (name) {
+          layernames.push(name);
+          layer = new svgedit.draw.Layer(name, child);
+          this.all_layers.push(layer);
+          this.layer_map[name] = layer;
+        } else {
+          // if group did not have a name, it is an orphan
+          orphans.push(child);
+        }
+      } else if (~visElems.indexOf(child.nodeName)) {
+        // Child is "visible" (i.e. not a <title> or <defs> element), so it is an orphan
+        orphans.push(child);
+      }
+    }
+  }
 
-	// If orphans or no layers found, create a new layer and add all the orphans to it
-	if (orphans.length > 0 || !childgroups) {
-		layer = new svgedit.draw.Layer(getNewLayerName(layernames), null, this.svgElem_);
-		layer.appendChildren(orphans);
-		this.all_layers.push(layer);
-		this.layer_map[name] = layer;
-	} else {
-		layer.activate();
-	}
-	this.current_layer = layer;
+  // If orphans or no layers found, create a new layer and add all the orphans to it
+  if (orphans.length > 0 || !childgroups) {
+    layer = new svgedit.draw.Layer(getNewLayerName(layernames), null, this.svgElem_);
+    layer.appendChildren(orphans);
+    this.all_layers.push(layer);
+    this.layer_map[name] = layer;
+  } else {
+    layer.activate();
+  }
+  this.current_layer = layer;
 };
 
 /**
@@ -521,27 +521,27 @@ svgedit.draw.Drawing.prototype.identifyLayers = function () {
  * 		also the current layer of this drawing.
 */
 svgedit.draw.Drawing.prototype.createLayer = function (name, hrService) {
-	if (this.current_layer) {
-		this.current_layer.deactivate();
-	}
-	// Check for duplicate name.
-	if (name === undefined || name === null || name === '' || this.layer_map[name]) {
-		name = getNewLayerName(Object.keys(this.layer_map));
-	}
+  if (this.current_layer) {
+    this.current_layer.deactivate();
+  }
+  // Check for duplicate name.
+  if (name === undefined || name === null || name === '' || this.layer_map[name]) {
+    name = getNewLayerName(Object.keys(this.layer_map));
+  }
 
-	// Crate new layer and add to DOM as last layer
-	var layer = new svgedit.draw.Layer(name, null, this.svgElem_);
-	// Like to assume hrService exists, but this is backwards compatible with old version of createLayer.
-	if (hrService) {
-		hrService.startBatchCommand('Create Layer');
-		hrService.insertElement(layer.getGroup());
-		hrService.endBatchCommand();
-	}
+  // Crate new layer and add to DOM as last layer
+  var layer = new svgedit.draw.Layer(name, null, this.svgElem_);
+  // Like to assume hrService exists, but this is backwards compatible with old version of createLayer.
+  if (hrService) {
+    hrService.startBatchCommand('Create Layer');
+    hrService.insertElement(layer.getGroup());
+    hrService.endBatchCommand();
+  }
 
-	this.all_layers.push(layer);
-	this.layer_map[name] = layer;
-	this.current_layer = layer;
-	return layer.getGroup();
+  this.all_layers.push(layer);
+  this.layer_map[name] = layer;
+  this.current_layer = layer;
+  return layer.getGroup();
 };
 
 /**
@@ -552,43 +552,43 @@ svgedit.draw.Drawing.prototype.createLayer = function (name, hrService) {
  * 		also the current layer of this drawing.
 */
 svgedit.draw.Drawing.prototype.cloneLayer = function (name, hrService) {
-	if (!this.current_layer) { return null; }
-	this.current_layer.deactivate();
-	// Check for duplicate name.
-	if (name === undefined || name === null || name === '' || this.layer_map[name]) {
-		name = getNewLayerName(Object.keys(this.layer_map));
-	}
+  if (!this.current_layer) { return null; }
+  this.current_layer.deactivate();
+  // Check for duplicate name.
+  if (name === undefined || name === null || name === '' || this.layer_map[name]) {
+    name = getNewLayerName(Object.keys(this.layer_map));
+  }
 
-	// Create new group and add to DOM just after current_layer
-	var currentGroup = this.current_layer.getGroup();
-	var layer = new svgedit.draw.Layer(name, currentGroup, this.svgElem_);
-	var group = layer.getGroup();
+  // Create new group and add to DOM just after current_layer
+  var currentGroup = this.current_layer.getGroup();
+  var layer = new svgedit.draw.Layer(name, currentGroup, this.svgElem_);
+  var group = layer.getGroup();
 
-	// Clone children
-	var children = currentGroup.childNodes;
-	var index;
-	for (index = 0; index < children.length; index++) {
-		var ch = children[index];
-		if (ch.localName === 'title') { continue; }
-		group.appendChild(this.copyElem(ch));
-	}
+  // Clone children
+  var children = currentGroup.childNodes;
+  var index;
+  for (index = 0; index < children.length; index++) {
+    var ch = children[index];
+    if (ch.localName === 'title') { continue; }
+    group.appendChild(this.copyElem(ch));
+  }
 
-	if (hrService) {
-		hrService.startBatchCommand('Duplicate Layer');
-		hrService.insertElement(group);
-		hrService.endBatchCommand();
-	}
+  if (hrService) {
+    hrService.startBatchCommand('Duplicate Layer');
+    hrService.insertElement(group);
+    hrService.endBatchCommand();
+  }
 
-	// Update layer containers and current_layer.
-	index = this.all_layers.indexOf(this.current_layer);
-	if (index >= 0) {
-		this.all_layers.splice(index + 1, 0, layer);
-	} else {
-		this.all_layers.push(layer);
-	}
-	this.layer_map[name] = layer;
-	this.current_layer = layer;
-	return group;
+  // Update layer containers and current_layer.
+  index = this.all_layers.indexOf(this.current_layer);
+  if (index >= 0) {
+    this.all_layers.splice(index + 1, 0, layer);
+  } else {
+    this.all_layers.push(layer);
+  }
+  this.layer_map[name] = layer;
+  this.current_layer = layer;
+  return group;
 };
 
 /**
@@ -598,8 +598,8 @@ svgedit.draw.Drawing.prototype.cloneLayer = function (name, hrService) {
  * @returns {boolean} The visibility state of the layer, or false if the layer name was invalid.
 */
 svgedit.draw.Drawing.prototype.getLayerVisibility = function (layername) {
-	var layer = this.layer_map[layername];
-	return layer ? layer.isVisible() : false;
+  var layer = this.layer_map[layername];
+  return layer ? layer.isVisible() : false;
 };
 
 /**
@@ -612,13 +612,13 @@ svgedit.draw.Drawing.prototype.getLayerVisibility = function (layername) {
  *   layername was valid, otherwise null.
 */
 svgedit.draw.Drawing.prototype.setLayerVisibility = function (layername, bVisible) {
-	if (typeof bVisible !== 'boolean') {
-		return null;
-	}
-	var layer = this.layer_map[layername];
-	if (!layer) { return null; }
-	layer.setVisible(bVisible);
-	return layer.getGroup();
+  if (typeof bVisible !== 'boolean') {
+    return null;
+  }
+  var layer = this.layer_map[layername];
+  if (!layer) { return null; }
+  layer.setVisible(bVisible);
+  return layer.getGroup();
 };
 
 /**
@@ -628,9 +628,9 @@ svgedit.draw.Drawing.prototype.setLayerVisibility = function (layername, bVisibl
  * if layername is not a valid layer
 */
 svgedit.draw.Drawing.prototype.getLayerOpacity = function (layername) {
-	var layer = this.layer_map[layername];
-	if (!layer) { return null; }
-	return layer.getOpacity();
+  var layer = this.layer_map[layername];
+  if (!layer) { return null; }
+  return layer.getOpacity();
 };
 
 /**
@@ -641,13 +641,13 @@ svgedit.draw.Drawing.prototype.getLayerOpacity = function (layername) {
  * @param {number} opacity - A float value in the range 0.0-1.0
 */
 svgedit.draw.Drawing.prototype.setLayerOpacity = function (layername, opacity) {
-	if (typeof opacity !== 'number' || opacity < 0.0 || opacity > 1.0) {
-		return;
-	}
-	var layer = this.layer_map[layername];
-	if (layer) {
-		layer.setOpacity(opacity);
-	}
+  if (typeof opacity !== 'number' || opacity < 0.0 || opacity > 1.0) {
+    return;
+  }
+  var layer = this.layer_map[layername];
+  if (layer) {
+    layer.setOpacity(opacity);
+  }
 };
 
 /**
@@ -656,8 +656,8 @@ svgedit.draw.Drawing.prototype.setLayerOpacity = function (layername, opacity) {
  * @returns {Element}
  */
 svgedit.draw.Drawing.prototype.copyElem = function (el) {
-	var self = this;
-	var getNextIdClosure = function () { return self.getNextId(); };
-	return svgedit.utilities.copyElem(el, getNextIdClosure);
+  var self = this;
+  var getNextIdClosure = function () { return self.getNextId(); };
+  return svgedit.utilities.copyElem(el, getNextIdClosure);
 };
 }());
diff --git a/editor/embedapi-dom.js b/editor/embedapi-dom.js
index 098912df..33c661ff 100644
--- a/editor/embedapi-dom.js
+++ b/editor/embedapi-dom.js
@@ -5,76 +5,76 @@ var initEmbed; // eslint-disable-line no-unused-vars
 // Todo: Get rid of frame.contentWindow dependencies so can be more easily adjusted to work cross-domain
 
 $(function () {
-	'use strict';
+  'use strict';
 
-	var svgCanvas = null;
-	var frame;
+  var svgCanvas = null;
+  var frame;
 
-	initEmbed = function () {
-		var doc, mainButton;
-		svgCanvas = new EmbeddedSVGEdit(frame);
-		// Hide main button, as we will be controlling new, load, save, etc. from the host document
-		doc = frame.contentDocument || frame.contentWindow.document;
-		mainButton = doc.getElementById('main_button');
-		mainButton.style.display = 'none';
-	};
+  initEmbed = function () {
+    var doc, mainButton;
+    svgCanvas = new EmbeddedSVGEdit(frame);
+    // Hide main button, as we will be controlling new, load, save, etc. from the host document
+    doc = frame.contentDocument || frame.contentWindow.document;
+    mainButton = doc.getElementById('main_button');
+    mainButton.style.display = 'none';
+  };
 
-	function handleSvgData (data, error) {
-		if (error) {
-			alert('error ' + error);
-		} else {
-			alert('Congratulations. Your SVG string is back in the host page, do with it what you will\n\n' + data);
-		}
-	}
+  function handleSvgData (data, error) {
+    if (error) {
+      alert('error ' + error);
+    } else {
+      alert('Congratulations. Your SVG string is back in the host page, do with it what you will\n\n' + data);
+    }
+  }
 
-	function loadSvg () {
-		var svgexample = '<svg width="640" height="480" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><g><title>Layer 1</title><rect stroke-width="5" stroke="#000000" fill="#FF0000" id="svg_1" height="35" width="51" y="35" x="32"/><ellipse ry="15" rx="24" stroke-width="5" stroke="#000000" fill="#0000ff" id="svg_2" cy="60" cx="66"/></g></svg>';
-		svgCanvas.setSvgString(svgexample);
-	}
+  function loadSvg () {
+    var svgexample = '<svg width="640" height="480" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><g><title>Layer 1</title><rect stroke-width="5" stroke="#000000" fill="#FF0000" id="svg_1" height="35" width="51" y="35" x="32"/><ellipse ry="15" rx="24" stroke-width="5" stroke="#000000" fill="#0000ff" id="svg_2" cy="60" cx="66"/></g></svg>';
+    svgCanvas.setSvgString(svgexample);
+  }
 
-	function saveSvg () {
-		svgCanvas.getSvgString()(handleSvgData);
-	}
+  function saveSvg () {
+    svgCanvas.getSvgString()(handleSvgData);
+  }
 
-	function exportPNG () {
-		var str = frame.contentWindow.svgEditor.uiStrings.notification.loadingImage;
+  function exportPNG () {
+    var str = frame.contentWindow.svgEditor.uiStrings.notification.loadingImage;
 
-		var exportWindow = window.open(
-			'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
-			'svg-edit-exportWindow'
-		);
-		svgCanvas.rasterExport('PNG', null, exportWindow.name);
-	}
+    var exportWindow = window.open(
+      'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
+      'svg-edit-exportWindow'
+    );
+    svgCanvas.rasterExport('PNG', null, exportWindow.name);
+  }
 
-	function exportPDF () {
-		var str = frame.contentWindow.svgEditor.uiStrings.notification.loadingImage;
+  function exportPDF () {
+    var str = frame.contentWindow.svgEditor.uiStrings.notification.loadingImage;
 
-		/**
-		// If you want to handle the PDF blob yourself, do as follows
-		svgCanvas.bind('exportedPDF', function (win, data) {
-			alert(data.dataurlstring);
-		});
-		svgCanvas.exportPDF(); // Accepts two args: optionalWindowName supplied back to bound exportPDF handler and optionalOutputType (defaults to dataurlstring)
-		return;
-		*/
+    /**
+    // If you want to handle the PDF blob yourself, do as follows
+    svgCanvas.bind('exportedPDF', function (win, data) {
+      alert(data.dataurlstring);
+    });
+    svgCanvas.exportPDF(); // Accepts two args: optionalWindowName supplied back to bound exportPDF handler and optionalOutputType (defaults to dataurlstring)
+    return;
+    */
 
-		var exportWindow = window.open(
-			'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
-			'svg-edit-exportWindow'
-		);
-		svgCanvas.exportPDF(exportWindow.name);
-	}
+    var exportWindow = window.open(
+      'data:text/html;charset=utf-8,' + encodeURIComponent('<title>' + str + '</title><h1>' + str + '</h1>'),
+      'svg-edit-exportWindow'
+    );
+    svgCanvas.exportPDF(exportWindow.name);
+  }
 
-	// Add event handlers
-	$('#load').click(loadSvg);
-	$('#save').click(saveSvg);
-	$('#exportPNG').click(exportPNG);
-	$('#exportPDF').click(exportPDF);
-	$('body').append(
-		$('<iframe src="svg-editor.html?extensions=ext-xdomain-messaging.js' +
-			window.location.href.replace(/\?(.*)$/, '&$1') + // Append arguments to this file onto the iframe
-			'" width="900px" height="600px" id="svgedit" onload="initEmbed();"></iframe>'
-		)
-	);
-	frame = document.getElementById('svgedit');
+  // Add event handlers
+  $('#load').click(loadSvg);
+  $('#save').click(saveSvg);
+  $('#exportPNG').click(exportPNG);
+  $('#exportPDF').click(exportPDF);
+  $('body').append(
+    $('<iframe src="svg-editor.html?extensions=ext-xdomain-messaging.js' +
+      window.location.href.replace(/\?(.*)$/, '&$1') + // Append arguments to this file onto the iframe
+      '" width="900px" height="600px" id="svgedit" onload="initEmbed();"></iframe>'
+    )
+  );
+  frame = document.getElementById('svgedit');
 });
diff --git a/editor/embedapi.html b/editor/embedapi.html
index 04e176a4..95f45572 100644
--- a/editor/embedapi.html
+++ b/editor/embedapi.html
@@ -1,17 +1,17 @@
 <!DOCTYPE html>
 <html>
 <head>
-    <meta charset="utf-8" />
-    <title>Embed API</title>
-    <script src="jquery.js"></script>
-    <script src="embedapi.js"></script>
-    <script src="embedapi-dom.js"></script>
+  <meta charset="utf-8" />
+  <title>Embed API</title>
+  <script src="jquery.js"></script>
+  <script src="embedapi.js"></script>
+  <script src="embedapi-dom.js"></script>
 </head>
 <body>
-    <button id="load">Load example</button>
-    <button id="save">Save data</button>
-    <button id="exportPNG">Export data to PNG</button>
-    <button id="exportPDF">Export data to PDF</button>
-    <br/>
+  <button id="load">Load example</button>
+  <button id="save">Save data</button>
+  <button id="exportPNG">Export data to PNG</button>
+  <button id="exportPDF">Export data to PDF</button>
+  <br/>
 </body>
 </html>
diff --git a/editor/embedapi.js b/editor/embedapi.js
index a996e9b7..af61b41f 100644
--- a/editor/embedapi.js
+++ b/editor/embedapi.js
@@ -10,11 +10,11 @@ var svgCanvas = new EmbeddedSVGEdit(window.frames.svgedit);
 svgCanvas.setSvgString('string')
 - Or if a callback is needed:
 svgCanvas.setSvgString('string')(function(data, error){
-	if (error){
-	// There was an error
-	} else{
-	// Handle data
-	}
+  if (error){
+  // There was an error
+  } else{
+  // Handle data
+  }
 })
 
 Everything is done with the same API as the real svg-edit,
@@ -42,15 +42,15 @@ blah.clearSelection('woot', 'blah', 1337, [1, 2, 3, 4, 5, 'moo'], -42, {a: 'tree
 var cbid = 0;
 
 function getCallbackSetter (d) {
-	return function () {
-		var t = this, // New callback
-			args = [].slice.call(arguments),
-			cbid = t.send(d, args, function () {});	// The callback (currently it's nothing, but will be set later)
+  return function () {
+    var t = this, // New callback
+      args = [].slice.call(arguments),
+      cbid = t.send(d, args, function () {});	// The callback (currently it's nothing, but will be set later)
 
-		return function (newcallback) {
-			t.callbacks[cbid] = newcallback; // Set callback
-		};
-	};
+    return function (newcallback) {
+      t.callbacks[cbid] = newcallback; // Set callback
+    };
+  };
 }
 
 /*
@@ -59,38 +59,38 @@ function getCallbackSetter (d) {
 * of same domain control
 */
 function addCallback (t, data) {
-	var result = data.result || data.error,
-		cbid = data.id;
-	if (t.callbacks[cbid]) {
-		if (data.result) {
-			t.callbacks[cbid](result);
-		} else {
-			t.callbacks[cbid](result, 'error');
-		}
-	}
+  var result = data.result || data.error,
+    cbid = data.id;
+  if (t.callbacks[cbid]) {
+    if (data.result) {
+      t.callbacks[cbid](result);
+    } else {
+      t.callbacks[cbid](result, 'error');
+    }
+  }
 }
 
 function messageListener (e) {
-	// We accept and post strings as opposed to objects for the sake of IE9 support; this
-	//	 will most likely be changed in the future
-	if (typeof e.data !== 'string') {
-		return;
-	}
-	var allowedOrigins = this.allowedOrigins,
-		data = e.data && JSON.parse(e.data);
-	if (!data || typeof data !== 'object' || data.namespace !== 'svg-edit' ||
-		e.source !== this.frame.contentWindow ||
-		(allowedOrigins.indexOf('*') === -1 && allowedOrigins.indexOf(e.origin) === -1)
-	) {
-		return;
-	}
-	addCallback(this, data);
+  // We accept and post strings as opposed to objects for the sake of IE9 support; this
+  //	 will most likely be changed in the future
+  if (typeof e.data !== 'string') {
+    return;
+  }
+  var allowedOrigins = this.allowedOrigins,
+    data = e.data && JSON.parse(e.data);
+  if (!data || typeof data !== 'object' || data.namespace !== 'svg-edit' ||
+    e.source !== this.frame.contentWindow ||
+    (allowedOrigins.indexOf('*') === -1 && allowedOrigins.indexOf(e.origin) === -1)
+  ) {
+    return;
+  }
+  addCallback(this, data);
 }
 
 function getMessageListener (t) {
-	return function (e) {
-		messageListener.call(t, e);
-	};
+  return function (e) {
+    messageListener.call(t, e);
+  };
 }
 
 /**
@@ -100,77 +100,77 @@ function getMessageListener (t) {
 *	 If supplied, it should probably be the same as svgEditor's allowedOrigins
 */
 function EmbeddedSVGEdit (frame, allowedOrigins) {
-	if (!(this instanceof EmbeddedSVGEdit)) { // Allow invocation without 'new' keyword
-		return new EmbeddedSVGEdit(frame);
-	}
-	this.allowedOrigins = allowedOrigins || [];
-	// Initialize communication
-	this.frame = frame;
-	this.callbacks = {};
-	// List of functions extracted with this:
-	// Run in firebug on http://svg-edit.googlecode.com/svn/trunk/docs/files/svgcanvas-js.html
+  if (!(this instanceof EmbeddedSVGEdit)) { // Allow invocation without 'new' keyword
+    return new EmbeddedSVGEdit(frame);
+  }
+  this.allowedOrigins = allowedOrigins || [];
+  // Initialize communication
+  this.frame = frame;
+  this.callbacks = {};
+  // List of functions extracted with this:
+  // Run in firebug on http://svg-edit.googlecode.com/svn/trunk/docs/files/svgcanvas-js.html
 
-	// for (var i=0,q=[],f = document.querySelectorAll('div.CFunction h3.CTitle a'); i < f.length; i++) { q.push(f[i].name); }; q
-	// var functions = ['clearSelection', 'addToSelection', 'removeFromSelection', 'open', 'save', 'getSvgString', 'setSvgString',
-	// 'createLayer', 'deleteCurrentLayer', 'setCurrentLayer', 'renameCurrentLayer', 'setCurrentLayerPosition', 'setLayerVisibility',
-	// 'moveSelectedToLayer', 'clear'];
+  // for (var i=0,q=[],f = document.querySelectorAll('div.CFunction h3.CTitle a'); i < f.length; i++) { q.push(f[i].name); }; q
+  // var functions = ['clearSelection', 'addToSelection', 'removeFromSelection', 'open', 'save', 'getSvgString', 'setSvgString',
+  // 'createLayer', 'deleteCurrentLayer', 'setCurrentLayer', 'renameCurrentLayer', 'setCurrentLayerPosition', 'setLayerVisibility',
+  // 'moveSelectedToLayer', 'clear'];
 
-	// Newer, well, it extracts things that aren't documented as well. All functions accessible through the normal thingy can now be accessed though the API
-	// var svgCanvas = frame.contentWindow.svgCanvas;
-	// var l = []; for (var i in svgCanvas){ if (typeof svgCanvas[i] == 'function') { l.push(i);} };
-	// alert("['" + l.join("', '") + "']");
-	// Run in svgedit itself
-	var i,
-		functions = [
-			'clearSvgContentElement', 'setIdPrefix', 'getCurrentDrawing', 'addSvgElementFromJson', 'getTransformList', 'matrixMultiply', 'hasMatrixTransform', 'transformListToTransform', 'convertToNum', 'findDefs', 'getUrlFromAttr', 'getHref', 'setHref', 'getBBox', 'getRotationAngle', 'getElem', 'getRefElem', 'assignAttributes', 'cleanupElement', 'remapElement', 'recalculateDimensions', 'sanitizeSvg', 'runExtensions', 'addExtension', 'round', 'getIntersectionList', 'getStrokedBBox', 'getVisibleElements', 'getVisibleElementsAndBBoxes', 'groupSvgElem', 'getId', 'getNextId', 'call', 'bind', 'prepareSvg', 'setRotationAngle', 'recalculateAllSelectedDimensions', 'clearSelection', 'addToSelection', 'selectOnly', 'removeFromSelection', 'selectAllInCurrentLayer', 'getMouseTarget', 'removeUnusedDefElems', 'svgCanvasToString', 'svgToString', 'embedImage', 'setGoodImage', 'open', 'save', 'rasterExport', 'exportPDF', 'getSvgString', 'randomizeIds', 'uniquifyElems', 'setUseData', 'convertGradients', 'convertToGroup', 'setSvgString', 'importSvgString', 'identifyLayers', 'createLayer', 'cloneLayer', 'deleteCurrentLayer', 'setCurrentLayer', 'renameCurrentLayer', 'setCurrentLayerPosition', 'setLayerVisibility', 'moveSelectedToLayer', 'mergeLayer', 'mergeAllLayers', 'leaveContext', 'setContext', 'clear', 'linkControlPoints', 'getContentElem', 'getRootElem', 'getSelectedElems', 'getResolution', 'getZoom', 'getVersion', 'setUiStrings', 'setConfig', 'getTitle', 'setGroupTitle', 'getDocumentTitle', 'setDocumentTitle', 'getEditorNS', 'setResolution', 'getOffset', 'setBBoxZoom', 'setZoom', 'getMode', 'setMode', 'getColor', 'setColor', 'setGradient', 'setPaint', 'setStrokePaint', 'setFillPaint', 'getStrokeWidth', 'setStrokeWidth', 'setStrokeAttr', 'getStyle', 'getOpacity', 'setOpacity', 'getFillOpacity', 'getStrokeOpacity', 'setPaintOpacity', 'getPaintOpacity', 'getBlur', 'setBlurNoUndo', 'setBlurOffsets', 'setBlur', 'getBold', 'setBold', 'getItalic', 'setItalic', 'getFontFamily', 'setFontFamily', 'setFontColor', 'getFontColor', 'getFontSize', 'setFontSize', 'getText', 'setTextContent', 'setImageURL', 'setLinkURL', 'setRectRadius', 'makeHyperlink', 'removeHyperlink', 'setSegType', 'convertToPath', 'changeSelectedAttribute', 'deleteSelectedElements', 'cutSelectedElements', 'copySelectedElements', 'pasteElements', 'groupSelectedElements', 'pushGroupProperties', 'ungroupSelectedElement', 'moveToTopSelectedElement', 'moveToBottomSelectedElement', 'moveUpDownSelected', 'moveSelectedElements', 'cloneSelectedElements', 'alignSelectedElements', 'updateCanvas', 'setBackground', 'cycleElement', 'getPrivateMethods', 'zoomChanged', 'ready'
-		];
+  // Newer, well, it extracts things that aren't documented as well. All functions accessible through the normal thingy can now be accessed though the API
+  // var svgCanvas = frame.contentWindow.svgCanvas;
+  // var l = []; for (var i in svgCanvas){ if (typeof svgCanvas[i] == 'function') { l.push(i);} };
+  // alert("['" + l.join("', '") + "']");
+  // Run in svgedit itself
+  var i,
+    functions = [
+      'clearSvgContentElement', 'setIdPrefix', 'getCurrentDrawing', 'addSvgElementFromJson', 'getTransformList', 'matrixMultiply', 'hasMatrixTransform', 'transformListToTransform', 'convertToNum', 'findDefs', 'getUrlFromAttr', 'getHref', 'setHref', 'getBBox', 'getRotationAngle', 'getElem', 'getRefElem', 'assignAttributes', 'cleanupElement', 'remapElement', 'recalculateDimensions', 'sanitizeSvg', 'runExtensions', 'addExtension', 'round', 'getIntersectionList', 'getStrokedBBox', 'getVisibleElements', 'getVisibleElementsAndBBoxes', 'groupSvgElem', 'getId', 'getNextId', 'call', 'bind', 'prepareSvg', 'setRotationAngle', 'recalculateAllSelectedDimensions', 'clearSelection', 'addToSelection', 'selectOnly', 'removeFromSelection', 'selectAllInCurrentLayer', 'getMouseTarget', 'removeUnusedDefElems', 'svgCanvasToString', 'svgToString', 'embedImage', 'setGoodImage', 'open', 'save', 'rasterExport', 'exportPDF', 'getSvgString', 'randomizeIds', 'uniquifyElems', 'setUseData', 'convertGradients', 'convertToGroup', 'setSvgString', 'importSvgString', 'identifyLayers', 'createLayer', 'cloneLayer', 'deleteCurrentLayer', 'setCurrentLayer', 'renameCurrentLayer', 'setCurrentLayerPosition', 'setLayerVisibility', 'moveSelectedToLayer', 'mergeLayer', 'mergeAllLayers', 'leaveContext', 'setContext', 'clear', 'linkControlPoints', 'getContentElem', 'getRootElem', 'getSelectedElems', 'getResolution', 'getZoom', 'getVersion', 'setUiStrings', 'setConfig', 'getTitle', 'setGroupTitle', 'getDocumentTitle', 'setDocumentTitle', 'getEditorNS', 'setResolution', 'getOffset', 'setBBoxZoom', 'setZoom', 'getMode', 'setMode', 'getColor', 'setColor', 'setGradient', 'setPaint', 'setStrokePaint', 'setFillPaint', 'getStrokeWidth', 'setStrokeWidth', 'setStrokeAttr', 'getStyle', 'getOpacity', 'setOpacity', 'getFillOpacity', 'getStrokeOpacity', 'setPaintOpacity', 'getPaintOpacity', 'getBlur', 'setBlurNoUndo', 'setBlurOffsets', 'setBlur', 'getBold', 'setBold', 'getItalic', 'setItalic', 'getFontFamily', 'setFontFamily', 'setFontColor', 'getFontColor', 'getFontSize', 'setFontSize', 'getText', 'setTextContent', 'setImageURL', 'setLinkURL', 'setRectRadius', 'makeHyperlink', 'removeHyperlink', 'setSegType', 'convertToPath', 'changeSelectedAttribute', 'deleteSelectedElements', 'cutSelectedElements', 'copySelectedElements', 'pasteElements', 'groupSelectedElements', 'pushGroupProperties', 'ungroupSelectedElement', 'moveToTopSelectedElement', 'moveToBottomSelectedElement', 'moveUpDownSelected', 'moveSelectedElements', 'cloneSelectedElements', 'alignSelectedElements', 'updateCanvas', 'setBackground', 'cycleElement', 'getPrivateMethods', 'zoomChanged', 'ready'
+    ];
 
-	// TODO: rewrite the following, it's pretty scary.
-	for (i = 0; i < functions.length; i++) {
-		this[functions[i]] = getCallbackSetter(functions[i]);
-	}
+  // TODO: rewrite the following, it's pretty scary.
+  for (i = 0; i < functions.length; i++) {
+    this[functions[i]] = getCallbackSetter(functions[i]);
+  }
 
-	// Older IE may need a polyfill for addEventListener, but so it would for SVG
-	window.addEventListener('message', getMessageListener(this), false);
+  // Older IE may need a polyfill for addEventListener, but so it would for SVG
+  window.addEventListener('message', getMessageListener(this), false);
 }
 
 EmbeddedSVGEdit.prototype.send = function (name, args, callback) {
-	var t = this;
-	cbid++;
+  var t = this;
+  cbid++;
 
-	this.callbacks[cbid] = callback;
-	setTimeout((function (cbid) {
-		return function () { // Delay for the callback to be set in case its synchronous
-			/*
-			* Todo: Handle non-JSON arguments and return values (undefined,
-			*	 nonfinite numbers, functions, and built-in objects like Date,
-			*	 RegExp), etc.? Allow promises instead of callbacks? Review
-			*	 SVG-Edit functions for whether JSON-able parameters can be
-			*	 made compatile with all API functionality
-			*/
-			// We accept and post strings for the sake of IE9 support
-			if (window.location.origin === t.frame.contentWindow.location.origin) {
-				// Although we do not really need this API if we are working same
-				//	domain, it could allow us to write in a way that would work
-				//	cross-domain as well, assuming we stick to the argument limitations
-				//	of the current JSON-based communication API (e.g., not passing
-				//	callbacks). We might be able to address these shortcomings; see
-				//	the todo elsewhere in this file.
-				var message = {id: cbid},
-					svgCanvas = t.frame.contentWindow.svgCanvas;
-				try {
-					message.result = svgCanvas[name].apply(svgCanvas, args);
-				} catch (err) {
-					message.error = err.message;
-				}
-				addCallback(t, message);
-			} else { // Requires the ext-xdomain-messaging.js extension
-				t.frame.contentWindow.postMessage(JSON.stringify({namespace: 'svgCanvas', id: cbid, name: name, args: args}), '*');
-			}
-		};
-	}(cbid)), 0);
+  this.callbacks[cbid] = callback;
+  setTimeout((function (cbid) {
+    return function () { // Delay for the callback to be set in case its synchronous
+      /*
+      * Todo: Handle non-JSON arguments and return values (undefined,
+      *	 nonfinite numbers, functions, and built-in objects like Date,
+      *	 RegExp), etc.? Allow promises instead of callbacks? Review
+      *	 SVG-Edit functions for whether JSON-able parameters can be
+      *	 made compatile with all API functionality
+      */
+      // We accept and post strings for the sake of IE9 support
+      if (window.location.origin === t.frame.contentWindow.location.origin) {
+        // Although we do not really need this API if we are working same
+        //	domain, it could allow us to write in a way that would work
+        //	cross-domain as well, assuming we stick to the argument limitations
+        //	of the current JSON-based communication API (e.g., not passing
+        //	callbacks). We might be able to address these shortcomings; see
+        //	the todo elsewhere in this file.
+        var message = {id: cbid},
+          svgCanvas = t.frame.contentWindow.svgCanvas;
+        try {
+          message.result = svgCanvas[name].apply(svgCanvas, args);
+        } catch (err) {
+          message.error = err.message;
+        }
+        addCallback(t, message);
+      } else { // Requires the ext-xdomain-messaging.js extension
+        t.frame.contentWindow.postMessage(JSON.stringify({namespace: 'svgCanvas', id: cbid, name: name, args: args}), '*');
+      }
+    };
+  }(cbid)), 0);
 
-	return cbid;
+  return cbid;
 };
 
 window.embedded_svg_edit = EmbeddedSVGEdit; // Export old, deprecated API
diff --git a/editor/history.js b/editor/history.js
index d546779b..b2970615 100644
--- a/editor/history.js
+++ b/editor/history.js
@@ -17,15 +17,15 @@
 'use strict';
 
 if (!svgedit.history) {
-	svgedit.history = {};
+  svgedit.history = {};
 }
 
 // Group: Undo/Redo history management
 svgedit.history.HistoryEventTypes = {
-	BEFORE_APPLY: 'before_apply',
-	AFTER_APPLY: 'after_apply',
-	BEFORE_UNAPPLY: 'before_unapply',
-	AFTER_UNAPPLY: 'after_unapply'
+  BEFORE_APPLY: 'before_apply',
+  AFTER_APPLY: 'after_apply',
+  BEFORE_UNAPPLY: 'before_unapply',
+  AFTER_UNAPPLY: 'after_unapply'
 };
 
 // var removedElements = {};
@@ -63,18 +63,18 @@ svgedit.history.HistoryEventTypes = {
  * @param {string} [text] - An optional string visible to user related to this change
 */
 svgedit.history.MoveElementCommand = function (elem, oldNextSibling, oldParent, text) {
-	this.elem = elem;
-	this.text = text ? ('Move ' + elem.tagName + ' to ' + text) : ('Move ' + elem.tagName);
-	this.oldNextSibling = oldNextSibling;
-	this.oldParent = oldParent;
-	this.newNextSibling = elem.nextSibling;
-	this.newParent = elem.parentNode;
+  this.elem = elem;
+  this.text = text ? ('Move ' + elem.tagName + ' to ' + text) : ('Move ' + elem.tagName);
+  this.oldNextSibling = oldNextSibling;
+  this.oldParent = oldParent;
+  this.newNextSibling = elem.nextSibling;
+  this.newParent = elem.parentNode;
 };
 svgedit.history.MoveElementCommand.type = function () { return 'svgedit.history.MoveElementCommand'; };
 svgedit.history.MoveElementCommand.prototype.type = svgedit.history.MoveElementCommand.type;
 
 svgedit.history.MoveElementCommand.prototype.getText = function () {
-	return this.text;
+  return this.text;
 };
 
 /**
@@ -82,16 +82,16 @@ svgedit.history.MoveElementCommand.prototype.getText = function () {
  * @param {handleHistoryEvent: function}
 */
 svgedit.history.MoveElementCommand.prototype.apply = function (handler) {
-	// TODO(codedread): Refactor this common event code into a base HistoryCommand class.
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
-	}
+  // TODO(codedread): Refactor this common event code into a base HistoryCommand class.
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
+  }
 
-	this.elem = this.newParent.insertBefore(this.elem, this.newNextSibling);
+  this.elem = this.newParent.insertBefore(this.elem, this.newNextSibling);
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
+  }
 };
 
 /**
@@ -99,21 +99,21 @@ svgedit.history.MoveElementCommand.prototype.apply = function (handler) {
  * @param {handleHistoryEvent: function}
 */
 svgedit.history.MoveElementCommand.prototype.unapply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
+  }
 
-	this.elem = this.oldParent.insertBefore(this.elem, this.oldNextSibling);
+  this.elem = this.oldParent.insertBefore(this.elem, this.oldNextSibling);
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
+  }
 };
 
 // Function: svgedit.history.MoveElementCommand.elements
 // Returns array with element associated with this command
 svgedit.history.MoveElementCommand.prototype.elements = function () {
-	return [this.elem];
+  return [this.elem];
 };
 
 // Class: svgedit.history.InsertElementCommand
@@ -124,52 +124,52 @@ svgedit.history.MoveElementCommand.prototype.elements = function () {
 // elem - The newly added DOM element
 // text - An optional string visible to user related to this change
 svgedit.history.InsertElementCommand = function (elem, text) {
-	this.elem = elem;
-	this.text = text || ('Create ' + elem.tagName);
-	this.parent = elem.parentNode;
-	this.nextSibling = this.elem.nextSibling;
+  this.elem = elem;
+  this.text = text || ('Create ' + elem.tagName);
+  this.parent = elem.parentNode;
+  this.nextSibling = this.elem.nextSibling;
 };
 svgedit.history.InsertElementCommand.type = function () { return 'svgedit.history.InsertElementCommand'; };
 svgedit.history.InsertElementCommand.prototype.type = svgedit.history.InsertElementCommand.type;
 
 // Function: svgedit.history.InsertElementCommand.getText
 svgedit.history.InsertElementCommand.prototype.getText = function () {
-	return this.text;
+  return this.text;
 };
 
 // Function: svgedit.history.InsertElementCommand.apply
 // Re-Inserts the new element
 svgedit.history.InsertElementCommand.prototype.apply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
+  }
 
-	this.elem = this.parent.insertBefore(this.elem, this.nextSibling);
+  this.elem = this.parent.insertBefore(this.elem, this.nextSibling);
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
+  }
 };
 
 // Function: svgedit.history.InsertElementCommand.unapply
 // Removes the element
 svgedit.history.InsertElementCommand.prototype.unapply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
+  }
 
-	this.parent = this.elem.parentNode;
-	this.elem = this.elem.parentNode.removeChild(this.elem);
+  this.parent = this.elem.parentNode;
+  this.elem = this.elem.parentNode.removeChild(this.elem);
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
+  }
 };
 
 // Function: svgedit.history.InsertElementCommand.elements
 // Returns array with element associated with this command
 svgedit.history.InsertElementCommand.prototype.elements = function () {
-	return [this.elem];
+  return [this.elem];
 };
 
 // Class: svgedit.history.RemoveElementCommand
@@ -182,62 +182,62 @@ svgedit.history.InsertElementCommand.prototype.elements = function () {
 // oldParent - The DOM element's parent
 // text - An optional string visible to user related to this change
 svgedit.history.RemoveElementCommand = function (elem, oldNextSibling, oldParent, text) {
-	this.elem = elem;
-	this.text = text || ('Delete ' + elem.tagName);
-	this.nextSibling = oldNextSibling;
-	this.parent = oldParent;
+  this.elem = elem;
+  this.text = text || ('Delete ' + elem.tagName);
+  this.nextSibling = oldNextSibling;
+  this.parent = oldParent;
 
-	// special hack for webkit: remove this element's entry in the svgTransformLists map
-	svgedit.transformlist.removeElementFromListMap(elem);
+  // special hack for webkit: remove this element's entry in the svgTransformLists map
+  svgedit.transformlist.removeElementFromListMap(elem);
 };
 svgedit.history.RemoveElementCommand.type = function () { return 'svgedit.history.RemoveElementCommand'; };
 svgedit.history.RemoveElementCommand.prototype.type = svgedit.history.RemoveElementCommand.type;
 
 // Function: svgedit.history.RemoveElementCommand.getText
 svgedit.history.RemoveElementCommand.prototype.getText = function () {
-	return this.text;
+  return this.text;
 };
 
 // Function: RemoveElementCommand.apply
 // Re-removes the new element
 svgedit.history.RemoveElementCommand.prototype.apply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
+  }
 
-	svgedit.transformlist.removeElementFromListMap(this.elem);
-	this.parent = this.elem.parentNode;
-	this.elem = this.parent.removeChild(this.elem);
+  svgedit.transformlist.removeElementFromListMap(this.elem);
+  this.parent = this.elem.parentNode;
+  this.elem = this.parent.removeChild(this.elem);
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
+  }
 };
 
 // Function: RemoveElementCommand.unapply
 // Re-adds the new element
 svgedit.history.RemoveElementCommand.prototype.unapply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
+  }
 
-	svgedit.transformlist.removeElementFromListMap(this.elem);
-	if (this.nextSibling == null) {
-		if (window.console) {
-			console.log('Error: reference element was lost');
-		}
-	}
-	this.parent.insertBefore(this.elem, this.nextSibling);
+  svgedit.transformlist.removeElementFromListMap(this.elem);
+  if (this.nextSibling == null) {
+    if (window.console) {
+      console.log('Error: reference element was lost');
+    }
+  }
+  this.parent.insertBefore(this.elem, this.nextSibling);
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
+  }
 };
 
 // Function: RemoveElementCommand.elements
 // Returns array with element associated with this command
 svgedit.history.RemoveElementCommand.prototype.elements = function () {
-	return [this.elem];
+  return [this.elem];
 };
 
 // Class: svgedit.history.ChangeElementCommand
@@ -250,135 +250,135 @@ svgedit.history.RemoveElementCommand.prototype.elements = function () {
 // attrs - An object with the attributes to be changed and the values they had *before* the change
 // text - An optional string visible to user related to this change
 svgedit.history.ChangeElementCommand = function (elem, attrs, text) {
-	this.elem = elem;
-	this.text = text ? ('Change ' + elem.tagName + ' ' + text) : ('Change ' + elem.tagName);
-	this.newValues = {};
-	this.oldValues = attrs;
-	var attr;
-	for (attr in attrs) {
-		if (attr === '#text') {
-			this.newValues[attr] = elem.textContent;
-		} else if (attr === '#href') {
-			this.newValues[attr] = svgedit.utilities.getHref(elem);
-		} else {
-			this.newValues[attr] = elem.getAttribute(attr);
-		}
-	}
+  this.elem = elem;
+  this.text = text ? ('Change ' + elem.tagName + ' ' + text) : ('Change ' + elem.tagName);
+  this.newValues = {};
+  this.oldValues = attrs;
+  var attr;
+  for (attr in attrs) {
+    if (attr === '#text') {
+      this.newValues[attr] = elem.textContent;
+    } else if (attr === '#href') {
+      this.newValues[attr] = svgedit.utilities.getHref(elem);
+    } else {
+      this.newValues[attr] = elem.getAttribute(attr);
+    }
+  }
 };
 svgedit.history.ChangeElementCommand.type = function () { return 'svgedit.history.ChangeElementCommand'; };
 svgedit.history.ChangeElementCommand.prototype.type = svgedit.history.ChangeElementCommand.type;
 
 // Function: svgedit.history.ChangeElementCommand.getText
 svgedit.history.ChangeElementCommand.prototype.getText = function () {
-	return this.text;
+  return this.text;
 };
 
 // Function: svgedit.history.ChangeElementCommand.apply
 // Performs the stored change action
 svgedit.history.ChangeElementCommand.prototype.apply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
+  }
 
-	var bChangedTransform = false;
-	var attr;
-	for (attr in this.newValues) {
-		if (this.newValues[attr]) {
-			if (attr === '#text') {
-				this.elem.textContent = this.newValues[attr];
-			} else if (attr === '#href') {
-				svgedit.utilities.setHref(this.elem, this.newValues[attr]);
-			} else {
-				this.elem.setAttribute(attr, this.newValues[attr]);
-			}
-		} else {
-			if (attr === '#text') {
-				this.elem.textContent = '';
-			} else {
-				this.elem.setAttribute(attr, '');
-				this.elem.removeAttribute(attr);
-			}
-		}
+  var bChangedTransform = false;
+  var attr;
+  for (attr in this.newValues) {
+    if (this.newValues[attr]) {
+      if (attr === '#text') {
+        this.elem.textContent = this.newValues[attr];
+      } else if (attr === '#href') {
+        svgedit.utilities.setHref(this.elem, this.newValues[attr]);
+      } else {
+        this.elem.setAttribute(attr, this.newValues[attr]);
+      }
+    } else {
+      if (attr === '#text') {
+        this.elem.textContent = '';
+      } else {
+        this.elem.setAttribute(attr, '');
+        this.elem.removeAttribute(attr);
+      }
+    }
 
-		if (attr === 'transform') { bChangedTransform = true; }
-	}
+    if (attr === 'transform') { bChangedTransform = true; }
+  }
 
-	// relocate rotational transform, if necessary
-	if (!bChangedTransform) {
-		var angle = svgedit.utilities.getRotationAngle(this.elem);
-		if (angle) {
-			var bbox = this.elem.getBBox();
-			var cx = bbox.x + bbox.width / 2,
-				cy = bbox.y + bbox.height / 2;
-			var rotate = ['rotate(', angle, ' ', cx, ',', cy, ')'].join('');
-			if (rotate !== this.elem.getAttribute('transform')) {
-				this.elem.setAttribute('transform', rotate);
-			}
-		}
-	}
+  // relocate rotational transform, if necessary
+  if (!bChangedTransform) {
+    var angle = svgedit.utilities.getRotationAngle(this.elem);
+    if (angle) {
+      var bbox = this.elem.getBBox();
+      var cx = bbox.x + bbox.width / 2,
+        cy = bbox.y + bbox.height / 2;
+      var rotate = ['rotate(', angle, ' ', cx, ',', cy, ')'].join('');
+      if (rotate !== this.elem.getAttribute('transform')) {
+        this.elem.setAttribute('transform', rotate);
+      }
+    }
+  }
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
+  }
 
-	return true;
+  return true;
 };
 
 // Function: svgedit.history.ChangeElementCommand.unapply
 // Reverses the stored change action
 svgedit.history.ChangeElementCommand.prototype.unapply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
+  }
 
-	var bChangedTransform = false;
-	var attr;
-	for (attr in this.oldValues) {
-		if (this.oldValues[attr]) {
-			if (attr === '#text') {
-				this.elem.textContent = this.oldValues[attr];
-			} else if (attr === '#href') {
-				svgedit.utilities.setHref(this.elem, this.oldValues[attr]);
-			} else {
-				this.elem.setAttribute(attr, this.oldValues[attr]);
-			}
-		} else {
-			if (attr === '#text') {
-				this.elem.textContent = '';
-			} else {
-				this.elem.removeAttribute(attr);
-			}
-		}
-		if (attr === 'transform') { bChangedTransform = true; }
-	}
-	// relocate rotational transform, if necessary
-	if (!bChangedTransform) {
-		var angle = svgedit.utilities.getRotationAngle(this.elem);
-		if (angle) {
-			var bbox = this.elem.getBBox();
-			var cx = bbox.x + bbox.width / 2,
-				cy = bbox.y + bbox.height / 2;
-			var rotate = ['rotate(', angle, ' ', cx, ',', cy, ')'].join('');
-			if (rotate !== this.elem.getAttribute('transform')) {
-				this.elem.setAttribute('transform', rotate);
-			}
-		}
-	}
+  var bChangedTransform = false;
+  var attr;
+  for (attr in this.oldValues) {
+    if (this.oldValues[attr]) {
+      if (attr === '#text') {
+        this.elem.textContent = this.oldValues[attr];
+      } else if (attr === '#href') {
+        svgedit.utilities.setHref(this.elem, this.oldValues[attr]);
+      } else {
+        this.elem.setAttribute(attr, this.oldValues[attr]);
+      }
+    } else {
+      if (attr === '#text') {
+        this.elem.textContent = '';
+      } else {
+        this.elem.removeAttribute(attr);
+      }
+    }
+    if (attr === 'transform') { bChangedTransform = true; }
+  }
+  // relocate rotational transform, if necessary
+  if (!bChangedTransform) {
+    var angle = svgedit.utilities.getRotationAngle(this.elem);
+    if (angle) {
+      var bbox = this.elem.getBBox();
+      var cx = bbox.x + bbox.width / 2,
+        cy = bbox.y + bbox.height / 2;
+      var rotate = ['rotate(', angle, ' ', cx, ',', cy, ')'].join('');
+      if (rotate !== this.elem.getAttribute('transform')) {
+        this.elem.setAttribute('transform', rotate);
+      }
+    }
+  }
 
-	// Remove transformlist to prevent confusion that causes bugs like 575.
-	svgedit.transformlist.removeElementFromListMap(this.elem);
+  // Remove transformlist to prevent confusion that causes bugs like 575.
+  svgedit.transformlist.removeElementFromListMap(this.elem);
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
+  }
 
-	return true;
+  return true;
 };
 
 // Function: ChangeElementCommand.elements
 // Returns array with element associated with this command
 svgedit.history.ChangeElementCommand.prototype.elements = function () {
-	return [this.elem];
+  return [this.elem];
 };
 
 // TODO: create a 'typing' command object that tracks changes in text
@@ -392,65 +392,65 @@ svgedit.history.ChangeElementCommand.prototype.elements = function () {
 // Parameters:
 // text - An optional string visible to user related to this change
 svgedit.history.BatchCommand = function (text) {
-	this.text = text || 'Batch Command';
-	this.stack = [];
+  this.text = text || 'Batch Command';
+  this.stack = [];
 };
 svgedit.history.BatchCommand.type = function () { return 'svgedit.history.BatchCommand'; };
 svgedit.history.BatchCommand.prototype.type = svgedit.history.BatchCommand.type;
 
 // Function: svgedit.history.BatchCommand.getText
 svgedit.history.BatchCommand.prototype.getText = function () {
-	return this.text;
+  return this.text;
 };
 
 // Function: svgedit.history.BatchCommand.apply
 // Runs "apply" on all subcommands
 svgedit.history.BatchCommand.prototype.apply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_APPLY, this);
+  }
 
-	var i,
-		len = this.stack.length;
-	for (i = 0; i < len; ++i) {
-		this.stack[i].apply(handler);
-	}
+  var i,
+    len = this.stack.length;
+  for (i = 0; i < len; ++i) {
+    this.stack[i].apply(handler);
+  }
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_APPLY, this);
+  }
 };
 
 // Function: svgedit.history.BatchCommand.unapply
 // Runs "unapply" on all subcommands
 svgedit.history.BatchCommand.prototype.unapply = function (handler) {
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.BEFORE_UNAPPLY, this);
+  }
 
-	var i;
-	for (i = this.stack.length - 1; i >= 0; i--) {
-		this.stack[i].unapply(handler);
-	}
+  var i;
+  for (i = this.stack.length - 1; i >= 0; i--) {
+    this.stack[i].unapply(handler);
+  }
 
-	if (handler) {
-		handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
-	}
+  if (handler) {
+    handler.handleHistoryEvent(svgedit.history.HistoryEventTypes.AFTER_UNAPPLY, this);
+  }
 };
 
 // Function: svgedit.history.BatchCommand.elements
 // Iterate through all our subcommands and returns all the elements we are changing
 svgedit.history.BatchCommand.prototype.elements = function () {
-	var elems = [];
-	var cmd = this.stack.length;
-	while (cmd--) {
-		var thisElems = this.stack[cmd].elements();
-		var elem = thisElems.length;
-		while (elem--) {
-			if (elems.indexOf(thisElems[elem]) === -1) { elems.push(thisElems[elem]); }
-		}
-	}
-	return elems;
+  var elems = [];
+  var cmd = this.stack.length;
+  while (cmd--) {
+    var thisElems = this.stack[cmd].elements();
+    var elem = thisElems.length;
+    while (elem--) {
+      if (elems.indexOf(thisElems[elem]) === -1) { elems.push(thisElems[elem]); }
+    }
+  }
+  return elems;
 };
 
 // Function: svgedit.history.BatchCommand.addSubCommand
@@ -459,13 +459,13 @@ svgedit.history.BatchCommand.prototype.elements = function () {
 // Parameters:
 // cmd - The undo command object to add
 svgedit.history.BatchCommand.prototype.addSubCommand = function (cmd) {
-	this.stack.push(cmd);
+  this.stack.push(cmd);
 };
 
 // Function: svgedit.history.BatchCommand.isEmpty
 // Returns a boolean indicating whether or not the batch command is empty
 svgedit.history.BatchCommand.prototype.isEmpty = function () {
-	return this.stack.length === 0;
+  return this.stack.length === 0;
 };
 
 // Class: svgedit.history.UndoManager
@@ -473,67 +473,67 @@ svgedit.history.BatchCommand.prototype.isEmpty = function () {
 // historyEventHandler - an object that conforms to the HistoryEventHandler interface
 // (see above)
 svgedit.history.UndoManager = function (historyEventHandler) {
-	this.handler_ = historyEventHandler || null;
-	this.undoStackPointer = 0;
-	this.undoStack = [];
+  this.handler_ = historyEventHandler || null;
+  this.undoStackPointer = 0;
+  this.undoStack = [];
 
-	// this is the stack that stores the original values, the elements and
-	// the attribute name for begin/finish
-	this.undoChangeStackPointer = -1;
-	this.undoableChangeStack = [];
+  // this is the stack that stores the original values, the elements and
+  // the attribute name for begin/finish
+  this.undoChangeStackPointer = -1;
+  this.undoableChangeStack = [];
 };
 
 // Function: svgedit.history.UndoManager.resetUndoStack
 // Resets the undo stack, effectively clearing the undo/redo history
 svgedit.history.UndoManager.prototype.resetUndoStack = function () {
-	this.undoStack = [];
-	this.undoStackPointer = 0;
+  this.undoStack = [];
+  this.undoStackPointer = 0;
 };
 
 // Function: svgedit.history.UndoManager.getUndoStackSize
 // Returns:
 // Integer with the current size of the undo history stack
 svgedit.history.UndoManager.prototype.getUndoStackSize = function () {
-	return this.undoStackPointer;
+  return this.undoStackPointer;
 };
 
 // Function: svgedit.history.UndoManager.getRedoStackSize
 // Returns:
 // Integer with the current size of the redo history stack
 svgedit.history.UndoManager.prototype.getRedoStackSize = function () {
-	return this.undoStack.length - this.undoStackPointer;
+  return this.undoStack.length - this.undoStackPointer;
 };
 
 // Function: svgedit.history.UndoManager.getNextUndoCommandText
 // Returns:
 // String associated with the next undo command
 svgedit.history.UndoManager.prototype.getNextUndoCommandText = function () {
-	return this.undoStackPointer > 0 ? this.undoStack[this.undoStackPointer - 1].getText() : '';
+  return this.undoStackPointer > 0 ? this.undoStack[this.undoStackPointer - 1].getText() : '';
 };
 
 // Function: svgedit.history.UndoManager.getNextRedoCommandText
 // Returns:
 // String associated with the next redo command
 svgedit.history.UndoManager.prototype.getNextRedoCommandText = function () {
-	return this.undoStackPointer < this.undoStack.length ? this.undoStack[this.undoStackPointer].getText() : '';
+  return this.undoStackPointer < this.undoStack.length ? this.undoStack[this.undoStackPointer].getText() : '';
 };
 
 // Function: svgedit.history.UndoManager.undo
 // Performs an undo step
 svgedit.history.UndoManager.prototype.undo = function () {
-	if (this.undoStackPointer > 0) {
-		var cmd = this.undoStack[--this.undoStackPointer];
-		cmd.unapply(this.handler_);
-	}
+  if (this.undoStackPointer > 0) {
+    var cmd = this.undoStack[--this.undoStackPointer];
+    cmd.unapply(this.handler_);
+  }
 };
 
 // Function: svgedit.history.UndoManager.redo
 // Performs a redo step
 svgedit.history.UndoManager.prototype.redo = function () {
-	if (this.undoStackPointer < this.undoStack.length && this.undoStack.length > 0) {
-		var cmd = this.undoStack[this.undoStackPointer++];
-		cmd.apply(this.handler_);
-	}
+  if (this.undoStackPointer < this.undoStack.length && this.undoStack.length > 0) {
+    var cmd = this.undoStack[this.undoStackPointer++];
+    cmd.apply(this.handler_);
+  }
 };
 
 // Function: svgedit.history.UndoManager.addCommandToHistory
@@ -542,18 +542,18 @@ svgedit.history.UndoManager.prototype.redo = function () {
 // Parameters:
 // cmd - The command object to add
 svgedit.history.UndoManager.prototype.addCommandToHistory = function (cmd) {
-	// FIXME: we MUST compress consecutive text changes to the same element
-	// (right now each keystroke is saved as a separate command that includes the
-	// entire text contents of the text element)
-	// TODO: consider limiting the history that we store here (need to do some slicing)
+  // FIXME: we MUST compress consecutive text changes to the same element
+  // (right now each keystroke is saved as a separate command that includes the
+  // entire text contents of the text element)
+  // TODO: consider limiting the history that we store here (need to do some slicing)
 
-	// if our stack pointer is not at the end, then we have to remove
-	// all commands after the pointer and insert the new command
-	if (this.undoStackPointer < this.undoStack.length && this.undoStack.length > 0) {
-		this.undoStack = this.undoStack.splice(0, this.undoStackPointer);
-	}
-	this.undoStack.push(cmd);
-	this.undoStackPointer = this.undoStack.length;
+  // if our stack pointer is not at the end, then we have to remove
+  // all commands after the pointer and insert the new command
+  if (this.undoStackPointer < this.undoStack.length && this.undoStack.length > 0) {
+    this.undoStack = this.undoStack.splice(0, this.undoStackPointer);
+  }
+  this.undoStack.push(cmd);
+  this.undoStackPointer = this.undoStack.length;
 };
 
 // Function: svgedit.history.UndoManager.beginUndoableChange
@@ -567,20 +567,20 @@ svgedit.history.UndoManager.prototype.addCommandToHistory = function (cmd) {
 // attrName - The name of the attribute being changed
 // elems - Array of DOM elements being changed
 svgedit.history.UndoManager.prototype.beginUndoableChange = function (attrName, elems) {
-	var p = ++this.undoChangeStackPointer;
-	var i = elems.length;
-	var oldValues = new Array(i), elements = new Array(i);
-	while (i--) {
-		var elem = elems[i];
-		if (elem == null) { continue; }
-		elements[i] = elem;
-		oldValues[i] = elem.getAttribute(attrName);
-	}
-	this.undoableChangeStack[p] = {
-		'attrName': attrName,
-		'oldValues': oldValues,
-		'elements': elements
-	};
+  var p = ++this.undoChangeStackPointer;
+  var i = elems.length;
+  var oldValues = new Array(i), elements = new Array(i);
+  while (i--) {
+    var elem = elems[i];
+    if (elem == null) { continue; }
+    elements[i] = elem;
+    oldValues[i] = elem.getAttribute(attrName);
+  }
+  this.undoableChangeStack[p] = {
+    'attrName': attrName,
+    'oldValues': oldValues,
+    'elements': elements
+  };
 };
 
 // Function: svgedit.history.UndoManager.finishUndoableChange
@@ -591,21 +591,21 @@ svgedit.history.UndoManager.prototype.beginUndoableChange = function (attrName,
 // Returns:
 // Batch command object with resulting changes
 svgedit.history.UndoManager.prototype.finishUndoableChange = function () {
-	var p = this.undoChangeStackPointer--;
-	var changeset = this.undoableChangeStack[p];
-	var i = changeset.elements.length;
-	var attrName = changeset.attrName;
-	var batchCmd = new svgedit.history.BatchCommand('Change ' + attrName);
-	while (i--) {
-		var elem = changeset.elements[i];
-		if (elem == null) { continue; }
-		var changes = {};
-		changes[attrName] = changeset.oldValues[i];
-		if (changes[attrName] !== elem.getAttribute(attrName)) {
-			batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes, attrName));
-		}
-	}
-	this.undoableChangeStack[p] = null;
-	return batchCmd;
+  var p = this.undoChangeStackPointer--;
+  var changeset = this.undoableChangeStack[p];
+  var i = changeset.elements.length;
+  var attrName = changeset.attrName;
+  var batchCmd = new svgedit.history.BatchCommand('Change ' + attrName);
+  while (i--) {
+    var elem = changeset.elements[i];
+    if (elem == null) { continue; }
+    var changes = {};
+    changes[attrName] = changeset.oldValues[i];
+    if (changes[attrName] !== elem.getAttribute(attrName)) {
+      batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes, attrName));
+    }
+  }
+  this.undoableChangeStack[p] = null;
+  return batchCmd;
 };
 }());
diff --git a/editor/historyrecording.js b/editor/historyrecording.js
index 9fdd0280..2f7a39b4 100644
--- a/editor/historyrecording.js
+++ b/editor/historyrecording.js
@@ -15,7 +15,7 @@
 'use strict';
 
 if (!svgedit.history) {
-	svgedit.history = {};
+  svgedit.history = {};
 }
 var history = svgedit.history;
 
@@ -58,9 +58,9 @@ var history = svgedit.history;
  * 		See singleton: HistoryRecordingService.NO_HISTORY
  */
 var HistoryRecordingService = history.HistoryRecordingService = function (undoManager) {
-	this.undoManager_ = undoManager;
-	this.currentBatchCommand_ = null;
-	this.batchCommandStack_ = [];
+  this.undoManager_ = undoManager;
+  this.currentBatchCommand_ = null;
+  this.batchCommandStack_ = [];
 };
 
 /**
@@ -77,10 +77,10 @@ HistoryRecordingService.NO_HISTORY = new HistoryRecordingService();
  * @returns {svgedit.history.HistoryRecordingService}
  */
 HistoryRecordingService.prototype.startBatchCommand = function (text) {
-	if (!this.undoManager_) { return this; }
-	this.currentBatchCommand_ = new history.BatchCommand(text);
-	this.batchCommandStack_.push(this.currentBatchCommand_);
-	return this;
+  if (!this.undoManager_) { return this; }
+  this.currentBatchCommand_ = new history.BatchCommand(text);
+  this.batchCommandStack_.push(this.currentBatchCommand_);
+  return this;
 };
 
 /**
@@ -88,15 +88,15 @@ HistoryRecordingService.prototype.startBatchCommand = function (text) {
  * @returns {svgedit.history.HistoryRecordingService}
  */
 HistoryRecordingService.prototype.endBatchCommand = function () {
-	if (!this.undoManager_) { return this; }
-	if (this.currentBatchCommand_) {
-		var batchCommand = this.currentBatchCommand_;
-		this.batchCommandStack_.pop();
-		var length = this.batchCommandStack_.length;
-		this.currentBatchCommand_ = length ? this.batchCommandStack_[length - 1] : null;
-		this.addCommand_(batchCommand);
-	}
-	return this;
+  if (!this.undoManager_) { return this; }
+  if (this.currentBatchCommand_) {
+    var batchCommand = this.currentBatchCommand_;
+    this.batchCommandStack_.pop();
+    var length = this.batchCommandStack_.length;
+    this.currentBatchCommand_ = length ? this.batchCommandStack_[length - 1] : null;
+    this.addCommand_(batchCommand);
+  }
+  return this;
 };
 
 /**
@@ -108,9 +108,9 @@ HistoryRecordingService.prototype.endBatchCommand = function () {
  * @returns {svgedit.history.HistoryRecordingService}
  */
 HistoryRecordingService.prototype.moveElement = function (elem, oldNextSibling, oldParent, text) {
-	if (!this.undoManager_) { return this; }
-	this.addCommand_(new history.MoveElementCommand(elem, oldNextSibling, oldParent, text));
-	return this;
+  if (!this.undoManager_) { return this; }
+  this.addCommand_(new history.MoveElementCommand(elem, oldNextSibling, oldParent, text));
+  return this;
 };
 
 /**
@@ -120,9 +120,9 @@ HistoryRecordingService.prototype.moveElement = function (elem, oldNextSibling,
  * @returns {svgedit.history.HistoryRecordingService}
  */
 HistoryRecordingService.prototype.insertElement = function (elem, text) {
-	if (!this.undoManager_) { return this; }
-	this.addCommand_(new history.InsertElementCommand(elem, text));
-	return this;
+  if (!this.undoManager_) { return this; }
+  this.addCommand_(new history.InsertElementCommand(elem, text));
+  return this;
 };
 
 /**
@@ -134,9 +134,9 @@ HistoryRecordingService.prototype.insertElement = function (elem, text) {
  * @returns {svgedit.history.HistoryRecordingService}
  */
 HistoryRecordingService.prototype.removeElement = function (elem, oldNextSibling, oldParent, text) {
-	if (!this.undoManager_) { return this; }
-	this.addCommand_(new history.RemoveElementCommand(elem, oldNextSibling, oldParent, text));
-	return this;
+  if (!this.undoManager_) { return this; }
+  this.addCommand_(new history.RemoveElementCommand(elem, oldNextSibling, oldParent, text));
+  return this;
 };
 
 /**
@@ -147,9 +147,9 @@ HistoryRecordingService.prototype.removeElement = function (elem, oldNextSibling
  * @returns {svgedit.history.HistoryRecordingService}
  */
 HistoryRecordingService.prototype.changeElement = function (elem, attrs, text) {
-	if (!this.undoManager_) { return this; }
-	this.addCommand_(new history.ChangeElementCommand(elem, attrs, text));
-	return this;
+  if (!this.undoManager_) { return this; }
+  this.addCommand_(new history.ChangeElementCommand(elem, attrs, text));
+  return this;
 };
 
 /**
@@ -159,11 +159,11 @@ HistoryRecordingService.prototype.changeElement = function (elem, attrs, text) {
  * @private
  */
 HistoryRecordingService.prototype.addCommand_ = function (cmd) {
-	if (!this.undoManager_) { return this; }
-	if (this.currentBatchCommand_) {
-		this.currentBatchCommand_.addSubCommand(cmd);
-	} else {
-		this.undoManager_.addCommandToHistory(cmd);
-	}
+  if (!this.undoManager_) { return this; }
+  if (this.currentBatchCommand_) {
+    this.currentBatchCommand_.addSubCommand(cmd);
+  } else {
+    this.undoManager_.addCommandToHistory(cmd);
+  }
 };
 }());
diff --git a/editor/layer.js b/editor/layer.js
index b9f56239..197eee9f 100644
--- a/editor/layer.js
+++ b/editor/layer.js
@@ -17,7 +17,7 @@
 'use strict';
 
 if (!svgedit.draw) {
-	svgedit.draw = {};
+  svgedit.draw = {};
 }
 var NS = svgedit.NS;
 
@@ -39,29 +39,29 @@ var NS = svgedit.NS;
  * 		a new layer to the document.
  */
 var Layer = svgedit.draw.Layer = function (name, group, svgElem) {
-	this.name_ = name;
-	this.group_ = svgElem ? null : group;
+  this.name_ = name;
+  this.group_ = svgElem ? null : group;
 
-	if (svgElem) {
-		// Create a group element with title and add it to the DOM.
-		var svgdoc = svgElem.ownerDocument;
-		this.group_ = svgdoc.createElementNS(NS.SVG, 'g');
-		var layerTitle = svgdoc.createElementNS(NS.SVG, 'title');
-		layerTitle.textContent = name;
-		this.group_.appendChild(layerTitle);
-		if (group) {
-			$(group).after(this.group_);
-		} else {
-			svgElem.appendChild(this.group_);
-		}
-	}
+  if (svgElem) {
+    // Create a group element with title and add it to the DOM.
+    var svgdoc = svgElem.ownerDocument;
+    this.group_ = svgdoc.createElementNS(NS.SVG, 'g');
+    var layerTitle = svgdoc.createElementNS(NS.SVG, 'title');
+    layerTitle.textContent = name;
+    this.group_.appendChild(layerTitle);
+    if (group) {
+      $(group).after(this.group_);
+    } else {
+      svgElem.appendChild(this.group_);
+    }
+  }
 
-	addLayerClass(this.group_);
-	svgedit.utilities.walkTree(this.group_, function (e) {
-		e.setAttribute('style', 'pointer-events:inherit');
-	});
+  addLayerClass(this.group_);
+  svgedit.utilities.walkTree(this.group_, function (e) {
+    e.setAttribute('style', 'pointer-events:inherit');
+  });
 
-	this.group_.setAttribute('style', svgElem ? 'pointer-events:all' : 'pointer-events:none');
+  this.group_.setAttribute('style', svgElem ? 'pointer-events:all' : 'pointer-events:none');
 };
 
 /**
@@ -79,7 +79,7 @@ Layer.CLASS_REGEX = new RegExp('(\\s|^)' + Layer.CLASS_NAME + '(\\s|$)');
  * @returns {string} The layer name
  */
 Layer.prototype.getName = function () {
-	return this.name_;
+  return this.name_;
 };
 
 /**
@@ -87,21 +87,21 @@ Layer.prototype.getName = function () {
  * @returns {SVGGElement} The layer SVG group
  */
 Layer.prototype.getGroup = function () {
-	return this.group_;
+  return this.group_;
 };
 
 /**
  * Active this layer so it takes pointer events.
  */
 Layer.prototype.activate = function () {
-	this.group_.setAttribute('style', 'pointer-events:all');
+  this.group_.setAttribute('style', 'pointer-events:all');
 };
 
 /**
  * Deactive this layer so it does NOT take pointer events.
  */
 Layer.prototype.deactivate = function () {
-	this.group_.setAttribute('style', 'pointer-events:none');
+  this.group_.setAttribute('style', 'pointer-events:none');
 };
 
 /**
@@ -109,11 +109,11 @@ Layer.prototype.deactivate = function () {
  * @param {boolean} visible - If true, make visible; otherwise, hide it.
  */
 Layer.prototype.setVisible = function (visible) {
-	var expected = visible === undefined || visible ? 'inline' : 'none';
-	var oldDisplay = this.group_.getAttribute('display');
-	if (oldDisplay !== expected) {
-		this.group_.setAttribute('display', expected);
-	}
+  var expected = visible === undefined || visible ? 'inline' : 'none';
+  var oldDisplay = this.group_.getAttribute('display');
+  if (oldDisplay !== expected) {
+    this.group_.setAttribute('display', expected);
+  }
 };
 
 /**
@@ -121,7 +121,7 @@ Layer.prototype.setVisible = function (visible) {
  * @returns {boolean} True if visible.
  */
 Layer.prototype.isVisible = function () {
-	return this.group_.getAttribute('display') !== 'none';
+  return this.group_.getAttribute('display') !== 'none';
 };
 
 /**
@@ -129,11 +129,11 @@ Layer.prototype.isVisible = function () {
  * @returns {number} Opacity value.
  */
 Layer.prototype.getOpacity = function () {
-	var opacity = this.group_.getAttribute('opacity');
-	if (opacity === null || opacity === undefined) {
-		return 1;
-	}
-	return parseFloat(opacity);
+  var opacity = this.group_.getAttribute('opacity');
+  if (opacity === null || opacity === undefined) {
+    return 1;
+  }
+  return parseFloat(opacity);
 };
 
 /**
@@ -142,9 +142,9 @@ Layer.prototype.getOpacity = function () {
  * @param {number} opacity - A float value in the range 0.0-1.0
  */
 Layer.prototype.setOpacity = function (opacity) {
-	if (typeof opacity === 'number' && opacity >= 0.0 && opacity <= 1.0) {
-		this.group_.setAttribute('opacity', opacity);
-	}
+  if (typeof opacity === 'number' && opacity >= 0.0 && opacity <= 1.0) {
+    this.group_.setAttribute('opacity', opacity);
+  }
 };
 
 /**
@@ -152,20 +152,20 @@ Layer.prototype.setOpacity = function (opacity) {
  * @param {SVGGElement} children - The children to append to this layer.
  */
 Layer.prototype.appendChildren = function (children) {
-	for (var i = 0; i < children.length; ++i) {
-		this.group_.appendChild(children[i]);
-	}
+  for (var i = 0; i < children.length; ++i) {
+    this.group_.appendChild(children[i]);
+  }
 };
 
 Layer.prototype.getTitleElement = function () {
-	var len = this.group_.childNodes.length;
-	for (var i = 0; i < len; ++i) {
-		var child = this.group_.childNodes.item(i);
-		if (child && child.tagName === 'title') {
-			return child;
-		}
-	}
-	return null;
+  var len = this.group_.childNodes.length;
+  for (var i = 0; i < len; ++i) {
+    var child = this.group_.childNodes.item(i);
+    if (child && child.tagName === 'title') {
+      return child;
+    }
+  }
+  return null;
 };
 
 /**
@@ -175,20 +175,20 @@ Layer.prototype.getTitleElement = function () {
  * @returns {string|null} The new name if changed; otherwise, null.
  */
 Layer.prototype.setName = function (name, hrService) {
-	var previousName = this.name_;
-	name = svgedit.utilities.toXml(name);
-	// now change the underlying title element contents
-	var title = this.getTitleElement();
-	if (title) {
-		$(title).empty();
-		title.textContent = name;
-		this.name_ = name;
-		if (hrService) {
-			hrService.changeElement(title, {'#text': previousName});
-		}
-		return this.name_;
-	}
-	return null;
+  var previousName = this.name_;
+  name = svgedit.utilities.toXml(name);
+  // now change the underlying title element contents
+  var title = this.getTitleElement();
+  if (title) {
+    $(title).empty();
+    title.textContent = name;
+    this.name_ = name;
+    if (hrService) {
+      hrService.changeElement(title, {'#text': previousName});
+    }
+    return this.name_;
+  }
+  return null;
 };
 
 /**
@@ -197,10 +197,10 @@ Layer.prototype.setName = function (name, hrService) {
  * @returns {SVGGElement} The layer SVG group that was just removed.
  */
 Layer.prototype.removeGroup = function () {
-	var parent = this.group_.parentNode;
-	var group = parent.removeChild(this.group_);
-	this.group_ = undefined;
-	return group;
+  var parent = this.group_.parentNode;
+  var group = parent.removeChild(this.group_);
+  this.group_ = undefined;
+  return group;
 };
 
 /**
@@ -210,11 +210,11 @@ Layer.prototype.removeGroup = function () {
  * @param {SVGGElement} elem - The SVG element to update
  */
 function addLayerClass (elem) {
-	var classes = elem.getAttribute('class');
-	if (classes === null || classes === undefined || classes.length === 0) {
-		elem.setAttribute('class', Layer.CLASS_NAME);
-	} else if (!Layer.CLASS_REGEX.test(classes)) {
-		elem.setAttribute('class', classes + ' ' + Layer.CLASS_NAME);
-	}
+  var classes = elem.getAttribute('class');
+  if (classes === null || classes === undefined || classes.length === 0) {
+    elem.setAttribute('class', Layer.CLASS_NAME);
+  } else if (!Layer.CLASS_REGEX.test(classes)) {
+    elem.setAttribute('class', classes + ' ' + Layer.CLASS_NAME);
+  }
 }
 }());
diff --git a/editor/math.js b/editor/math.js
index 466f76c0..1f95ec1f 100644
--- a/editor/math.js
+++ b/editor/math.js
@@ -24,7 +24,7 @@
 'use strict';
 
 if (!svgedit.math) {
-	svgedit.math = {};
+  svgedit.math = {};
 }
 
 // Constants
@@ -42,7 +42,7 @@ var svg = document.createElementNS(svgedit.NS.SVG, 'svg');
  * @returns {Object} An x, y object representing the transformed point
 */
 svgedit.math.transformPoint = function (x, y, m) {
-	return {x: m.a * x + m.c * y + m.e, y: m.b * x + m.d * y + m.f};
+  return {x: m.a * x + m.c * y + m.e, y: m.b * x + m.d * y + m.f};
 };
 
 /**
@@ -52,7 +52,7 @@ svgedit.math.transformPoint = function (x, y, m) {
  * @returns {boolean} Indicates whether or not the matrix is 1,0,0,1,0,0
 */
 svgedit.math.isIdentity = function (m) {
-	return (m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && m.e === 0 && m.f === 0);
+  return (m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && m.e === 0 && m.f === 0);
 };
 
 /**
@@ -62,20 +62,20 @@ svgedit.math.isIdentity = function (m) {
  * @returns {SVGMatrix} The matrix object resulting from the calculation
 */
 svgedit.math.matrixMultiply = function (matr) {
-	var args = arguments, i = args.length, m = args[i - 1];
+  var args = arguments, i = args.length, m = args[i - 1];
 
-	while (i-- > 1) {
-		var m1 = args[i - 1];
-		m = m1.multiply(m);
-	}
-	if (Math.abs(m.a) < NEAR_ZERO) { m.a = 0; }
-	if (Math.abs(m.b) < NEAR_ZERO) { m.b = 0; }
-	if (Math.abs(m.c) < NEAR_ZERO) { m.c = 0; }
-	if (Math.abs(m.d) < NEAR_ZERO) { m.d = 0; }
-	if (Math.abs(m.e) < NEAR_ZERO) { m.e = 0; }
-	if (Math.abs(m.f) < NEAR_ZERO) { m.f = 0; }
+  while (i-- > 1) {
+    var m1 = args[i - 1];
+    m = m1.multiply(m);
+  }
+  if (Math.abs(m.a) < NEAR_ZERO) { m.a = 0; }
+  if (Math.abs(m.b) < NEAR_ZERO) { m.b = 0; }
+  if (Math.abs(m.c) < NEAR_ZERO) { m.c = 0; }
+  if (Math.abs(m.d) < NEAR_ZERO) { m.d = 0; }
+  if (Math.abs(m.e) < NEAR_ZERO) { m.e = 0; }
+  if (Math.abs(m.f) < NEAR_ZERO) { m.f = 0; }
 
-	return m;
+  return m;
 };
 
 /**
@@ -84,13 +84,13 @@ svgedit.math.matrixMultiply = function (matr) {
  * @returns {boolean} Whether or not a matrix transform was found
 */
 svgedit.math.hasMatrixTransform = function (tlist) {
-	if (!tlist) { return false; }
-	var num = tlist.numberOfItems;
-	while (num--) {
-		var xform = tlist.getItem(num);
-		if (xform.type === 1 && !svgedit.math.isIdentity(xform.matrix)) { return true; }
-	}
-	return false;
+  if (!tlist) { return false; }
+  var num = tlist.numberOfItems;
+  while (num--) {
+    var xform = tlist.getItem(num);
+    if (xform.type === 1 && !svgedit.math.isIdentity(xform.matrix)) { return true; }
+  }
+  return false;
 };
 
 /**
@@ -112,30 +112,30 @@ svgedit.math.hasMatrixTransform = function (tlist) {
  * height - Float with the axis-aligned height coordinate
 */
 svgedit.math.transformBox = function (l, t, w, h, m) {
-	var transformPoint = svgedit.math.transformPoint,
+  var transformPoint = svgedit.math.transformPoint,
 
-		tl = transformPoint(l, t, m),
-		tr = transformPoint((l + w), t, m),
-		bl = transformPoint(l, (t + h), m),
-		br = transformPoint((l + w), (t + h), m),
+    tl = transformPoint(l, t, m),
+    tr = transformPoint((l + w), t, m),
+    bl = transformPoint(l, (t + h), m),
+    br = transformPoint((l + w), (t + h), m),
 
-		minx = Math.min(tl.x, tr.x, bl.x, br.x),
-		maxx = Math.max(tl.x, tr.x, bl.x, br.x),
-		miny = Math.min(tl.y, tr.y, bl.y, br.y),
-		maxy = Math.max(tl.y, tr.y, bl.y, br.y);
+    minx = Math.min(tl.x, tr.x, bl.x, br.x),
+    maxx = Math.max(tl.x, tr.x, bl.x, br.x),
+    miny = Math.min(tl.y, tr.y, bl.y, br.y),
+    maxy = Math.max(tl.y, tr.y, bl.y, br.y);
 
-	return {
-		tl: tl,
-		tr: tr,
-		bl: bl,
-		br: br,
-		aabox: {
-			x: minx,
-			y: miny,
-			width: (maxx - minx),
-			height: (maxy - miny)
-		}
-	};
+  return {
+    tl: tl,
+    tr: tr,
+    bl: bl,
+    br: br,
+    aabox: {
+      x: minx,
+      y: miny,
+      width: (maxx - minx),
+      height: (maxy - miny)
+    }
+  };
 };
 
 /**
@@ -150,25 +150,25 @@ svgedit.math.transformBox = function (l, t, w, h, m) {
  * @returns {Object} A single matrix transform object
 */
 svgedit.math.transformListToTransform = function (tlist, min, max) {
-	if (tlist == null) {
-		// Or should tlist = null have been prevented before this?
-		return svg.createSVGTransformFromMatrix(svg.createSVGMatrix());
-	}
-	min = min || 0;
-	max = max || (tlist.numberOfItems - 1);
-	min = parseInt(min, 10);
-	max = parseInt(max, 10);
-	if (min > max) { var temp = max; max = min; min = temp; }
-	var m = svg.createSVGMatrix();
-	var i;
-	for (i = min; i <= max; ++i) {
-		// if our indices are out of range, just use a harmless identity matrix
-		var mtom = (i >= 0 && i < tlist.numberOfItems
-			? tlist.getItem(i).matrix
-			: svg.createSVGMatrix());
-		m = svgedit.math.matrixMultiply(m, mtom);
-	}
-	return svg.createSVGTransformFromMatrix(m);
+  if (tlist == null) {
+    // Or should tlist = null have been prevented before this?
+    return svg.createSVGTransformFromMatrix(svg.createSVGMatrix());
+  }
+  min = min || 0;
+  max = max || (tlist.numberOfItems - 1);
+  min = parseInt(min, 10);
+  max = parseInt(max, 10);
+  if (min > max) { var temp = max; max = min; min = temp; }
+  var m = svg.createSVGMatrix();
+  var i;
+  for (i = min; i <= max; ++i) {
+    // if our indices are out of range, just use a harmless identity matrix
+    var mtom = (i >= 0 && i < tlist.numberOfItems
+      ? tlist.getItem(i).matrix
+      : svg.createSVGMatrix());
+    m = svgedit.math.matrixMultiply(m, mtom);
+  }
+  return svg.createSVGTransformFromMatrix(m);
 };
 
 /**
@@ -177,8 +177,8 @@ svgedit.math.transformListToTransform = function (tlist, min, max) {
  * @returns {SVGMatrix} The matrix object associated with the element's transformlist
 */
 svgedit.math.getMatrix = function (elem) {
-	var tlist = svgedit.transformlist.getTransformList(elem);
-	return svgedit.math.transformListToTransform(tlist).matrix;
+  var tlist = svgedit.transformlist.getTransformList(elem);
+  return svgedit.math.transformListToTransform(tlist).matrix;
 };
 
 /**
@@ -191,18 +191,18 @@ svgedit.math.getMatrix = function (elem) {
  * @returns {AngleCoord45}
 */
 svgedit.math.snapToAngle = function (x1, y1, x2, y2) {
-	var snap = Math.PI / 4; // 45 degrees
-	var dx = x2 - x1;
-	var dy = y2 - y1;
-	var angle = Math.atan2(dy, dx);
-	var dist = Math.sqrt(dx * dx + dy * dy);
-	var snapangle = Math.round(angle / snap) * snap;
+  var snap = Math.PI / 4; // 45 degrees
+  var dx = x2 - x1;
+  var dy = y2 - y1;
+  var angle = Math.atan2(dy, dx);
+  var dist = Math.sqrt(dx * dx + dy * dy);
+  var snapangle = Math.round(angle / snap) * snap;
 
-	return {
-		x: x1 + dist * Math.cos(snapangle),
-		y: y1 + dist * Math.sin(snapangle),
-		a: snapangle
-	};
+  return {
+    x: x1 + dist * Math.cos(snapangle),
+    y: y1 + dist * Math.sin(snapangle),
+    a: snapangle
+  };
 };
 
 /**
@@ -212,9 +212,9 @@ svgedit.math.snapToAngle = function (x1, y1, x2, y2) {
  * @returns {boolean} True if rectangles intersect
  */
 svgedit.math.rectsIntersect = function (r1, r2) {
-	return r2.x < (r1.x + r1.width) &&
-		(r2.x + r2.width) > r1.x &&
-		r2.y < (r1.y + r1.height) &&
-		(r2.y + r2.height) > r1.y;
+  return r2.x < (r1.x + r1.width) &&
+    (r2.x + r2.width) > r1.x &&
+    r2.y < (r1.y + r1.height) &&
+    (r2.y + r2.height) > r1.y;
 };
 }());
diff --git a/editor/path.js b/editor/path.js
index 46dca2e9..b8f4207f 100644
--- a/editor/path.js
+++ b/editor/path.js
@@ -19,25 +19,25 @@
 'use strict';
 
 if (!svgedit.path) {
-	svgedit.path = {};
+  svgedit.path = {};
 }
 
 var NS = svgedit.NS;
 var uiStrings = {
-	'pathNodeTooltip': 'Drag node to move it. Double-click node to change segment type',
-	'pathCtrlPtTooltip': 'Drag control point to adjust curve properties'
+  'pathNodeTooltip': 'Drag node to move it. Double-click node to change segment type',
+  'pathCtrlPtTooltip': 'Drag control point to adjust curve properties'
 };
 
 var segData = {
-	2: ['x', 'y'],
-	4: ['x', 'y'],
-	6: ['x', 'y', 'x1', 'y1', 'x2', 'y2'],
-	8: ['x', 'y', 'x1', 'y1'],
-	10: ['x', 'y', 'r1', 'r2', 'angle', 'largeArcFlag', 'sweepFlag'],
-	12: ['x'],
-	14: ['y'],
-	16: ['x', 'y', 'x2', 'y2'],
-	18: ['x', 'y']
+  2: ['x', 'y'],
+  4: ['x', 'y'],
+  6: ['x', 'y', 'x1', 'y1', 'x2', 'y2'],
+  8: ['x', 'y', 'x1', 'y1'],
+  10: ['x', 'y', 'r1', 'r2', 'angle', 'largeArcFlag', 'sweepFlag'],
+  12: ['x'],
+  14: ['y'],
+  16: ['x', 'y', 'x2', 'y2'],
+  18: ['x', 'y']
 };
 
 var pathFuncs = [];
@@ -49,7 +49,7 @@ var linkControlPts = true;
 var pathData = {};
 
 svgedit.path.setLinkControlPoints = function (lcp) {
-	linkControlPts = lcp;
+  linkControlPts = lcp;
 };
 
 svgedit.path.path = null;
@@ -57,300 +57,300 @@ svgedit.path.path = null;
 var editorContext_ = null;
 
 svgedit.path.init = function (editorContext) {
-	editorContext_ = editorContext;
+  editorContext_ = editorContext;
 
-	pathFuncs = [0, 'ClosePath'];
-	var pathFuncsStrs = ['Moveto', 'Lineto', 'CurvetoCubic', 'CurvetoQuadratic', 'Arc',
-		'LinetoHorizontal', 'LinetoVertical', 'CurvetoCubicSmooth', 'CurvetoQuadraticSmooth'];
-	$.each(pathFuncsStrs, function (i, s) {
-		pathFuncs.push(s + 'Abs');
-		pathFuncs.push(s + 'Rel');
-	});
+  pathFuncs = [0, 'ClosePath'];
+  var pathFuncsStrs = ['Moveto', 'Lineto', 'CurvetoCubic', 'CurvetoQuadratic', 'Arc',
+    'LinetoHorizontal', 'LinetoVertical', 'CurvetoCubicSmooth', 'CurvetoQuadraticSmooth'];
+  $.each(pathFuncsStrs, function (i, s) {
+    pathFuncs.push(s + 'Abs');
+    pathFuncs.push(s + 'Rel');
+  });
 };
 
 svgedit.path.insertItemBefore = function (elem, newseg, index) {
-	// Support insertItemBefore on paths for FF2
-	var list = elem.pathSegList;
+  // Support insertItemBefore on paths for FF2
+  var list = elem.pathSegList;
 
-	if (svgedit.browser.supportsPathInsertItemBefore()) {
-		list.insertItemBefore(newseg, index);
-		return;
-	}
-	var len = list.numberOfItems;
-	var arr = [];
-	var i;
-	for (i = 0; i < len; i++) {
-		var curSeg = list.getItem(i);
-		arr.push(curSeg);
-	}
-	list.clear();
-	for (i = 0; i < len; i++) {
-		if (i === index) { // index + 1
-			list.appendItem(newseg);
-		}
-		list.appendItem(arr[i]);
-	}
+  if (svgedit.browser.supportsPathInsertItemBefore()) {
+    list.insertItemBefore(newseg, index);
+    return;
+  }
+  var len = list.numberOfItems;
+  var arr = [];
+  var i;
+  for (i = 0; i < len; i++) {
+    var curSeg = list.getItem(i);
+    arr.push(curSeg);
+  }
+  list.clear();
+  for (i = 0; i < len; i++) {
+    if (i === index) { // index + 1
+      list.appendItem(newseg);
+    }
+    list.appendItem(arr[i]);
+  }
 };
 
 // TODO: See if this should just live in replacePathSeg
 svgedit.path.ptObjToArr = function (type, segItem) {
-	var arr = segData[type], len = arr.length;
-	var i, out = [];
-	for (i = 0; i < len; i++) {
-		out[i] = segItem[arr[i]];
-	}
-	return out;
+  var arr = segData[type], len = arr.length;
+  var i, out = [];
+  for (i = 0; i < len; i++) {
+    out[i] = segItem[arr[i]];
+  }
+  return out;
 };
 
 svgedit.path.getGripPt = function (seg, altPt) {
-	var out = {
-			x: altPt ? altPt.x : seg.item.x,
-			y: altPt ? altPt.y : seg.item.y
-		}, path = seg.path;
+  var out = {
+      x: altPt ? altPt.x : seg.item.x,
+      y: altPt ? altPt.y : seg.item.y
+    }, path = seg.path;
 
-	if (path.matrix) {
-		var pt = svgedit.math.transformPoint(out.x, out.y, path.matrix);
-		out = pt;
-	}
+  if (path.matrix) {
+    var pt = svgedit.math.transformPoint(out.x, out.y, path.matrix);
+    out = pt;
+  }
 
-	out.x *= editorContext_.getCurrentZoom();
-	out.y *= editorContext_.getCurrentZoom();
+  out.x *= editorContext_.getCurrentZoom();
+  out.y *= editorContext_.getCurrentZoom();
 
-	return out;
+  return out;
 };
 
 svgedit.path.getPointFromGrip = function (pt, path) {
-	var out = {
-		x: pt.x,
-		y: pt.y
-	};
+  var out = {
+    x: pt.x,
+    y: pt.y
+  };
 
-	if (path.matrix) {
-		pt = svgedit.math.transformPoint(out.x, out.y, path.imatrix);
-		out.x = pt.x;
-		out.y = pt.y;
-	}
+  if (path.matrix) {
+    pt = svgedit.math.transformPoint(out.x, out.y, path.imatrix);
+    out.x = pt.x;
+    out.y = pt.y;
+  }
 
-	out.x /= editorContext_.getCurrentZoom();
-	out.y /= editorContext_.getCurrentZoom();
+  out.x /= editorContext_.getCurrentZoom();
+  out.y /= editorContext_.getCurrentZoom();
 
-	return out;
+  return out;
 };
 
 svgedit.path.addPointGrip = function (index, x, y) {
-	// create the container of all the point grips
-	var pointGripContainer = svgedit.path.getGripContainer();
+  // create the container of all the point grips
+  var pointGripContainer = svgedit.path.getGripContainer();
 
-	var pointGrip = svgedit.utilities.getElem('pathpointgrip_' + index);
-	// create it
-	if (!pointGrip) {
-		pointGrip = document.createElementNS(NS.SVG, 'circle');
-		svgedit.utilities.assignAttributes(pointGrip, {
-			'id': 'pathpointgrip_' + index,
-			'display': 'none',
-			'r': 4,
-			'fill': '#0FF',
-			'stroke': '#00F',
-			'stroke-width': 2,
-			'cursor': 'move',
-			'style': 'pointer-events:all',
-			'xlink:title': uiStrings.pathNodeTooltip
-		});
-		pointGrip = pointGripContainer.appendChild(pointGrip);
+  var pointGrip = svgedit.utilities.getElem('pathpointgrip_' + index);
+  // create it
+  if (!pointGrip) {
+    pointGrip = document.createElementNS(NS.SVG, 'circle');
+    svgedit.utilities.assignAttributes(pointGrip, {
+      'id': 'pathpointgrip_' + index,
+      'display': 'none',
+      'r': 4,
+      'fill': '#0FF',
+      'stroke': '#00F',
+      'stroke-width': 2,
+      'cursor': 'move',
+      'style': 'pointer-events:all',
+      'xlink:title': uiStrings.pathNodeTooltip
+    });
+    pointGrip = pointGripContainer.appendChild(pointGrip);
 
-		var grip = $('#pathpointgrip_' + index);
-		grip.dblclick(function () {
-			if (svgedit.path.path) {
-				svgedit.path.path.setSegType();
-			}
-		});
-	}
-	if (x && y) {
-		// set up the point grip element and display it
-		svgedit.utilities.assignAttributes(pointGrip, {
-			'cx': x,
-			'cy': y,
-			'display': 'inline'
-		});
-	}
-	return pointGrip;
+    var grip = $('#pathpointgrip_' + index);
+    grip.dblclick(function () {
+      if (svgedit.path.path) {
+        svgedit.path.path.setSegType();
+      }
+    });
+  }
+  if (x && y) {
+    // set up the point grip element and display it
+    svgedit.utilities.assignAttributes(pointGrip, {
+      'cx': x,
+      'cy': y,
+      'display': 'inline'
+    });
+  }
+  return pointGrip;
 };
 
 svgedit.path.getGripContainer = function () {
-	var c = svgedit.utilities.getElem('pathpointgrip_container');
-	if (!c) {
-		var parent = svgedit.utilities.getElem('selectorParentGroup');
-		c = parent.appendChild(document.createElementNS(NS.SVG, 'g'));
-		c.id = 'pathpointgrip_container';
-	}
-	return c;
+  var c = svgedit.utilities.getElem('pathpointgrip_container');
+  if (!c) {
+    var parent = svgedit.utilities.getElem('selectorParentGroup');
+    c = parent.appendChild(document.createElementNS(NS.SVG, 'g'));
+    c.id = 'pathpointgrip_container';
+  }
+  return c;
 };
 
 svgedit.path.addCtrlGrip = function (id) {
-	var pointGrip = svgedit.utilities.getElem('ctrlpointgrip_' + id);
-	if (pointGrip) { return pointGrip; }
+  var pointGrip = svgedit.utilities.getElem('ctrlpointgrip_' + id);
+  if (pointGrip) { return pointGrip; }
 
-	pointGrip = document.createElementNS(NS.SVG, 'circle');
-	svgedit.utilities.assignAttributes(pointGrip, {
-		'id': 'ctrlpointgrip_' + id,
-		'display': 'none',
-		'r': 4,
-		'fill': '#0FF',
-		'stroke': '#55F',
-		'stroke-width': 1,
-		'cursor': 'move',
-		'style': 'pointer-events:all',
-		'xlink:title': uiStrings.pathCtrlPtTooltip
-	});
-	svgedit.path.getGripContainer().appendChild(pointGrip);
-	return pointGrip;
+  pointGrip = document.createElementNS(NS.SVG, 'circle');
+  svgedit.utilities.assignAttributes(pointGrip, {
+    'id': 'ctrlpointgrip_' + id,
+    'display': 'none',
+    'r': 4,
+    'fill': '#0FF',
+    'stroke': '#55F',
+    'stroke-width': 1,
+    'cursor': 'move',
+    'style': 'pointer-events:all',
+    'xlink:title': uiStrings.pathCtrlPtTooltip
+  });
+  svgedit.path.getGripContainer().appendChild(pointGrip);
+  return pointGrip;
 };
 
 svgedit.path.getCtrlLine = function (id) {
-	var ctrlLine = svgedit.utilities.getElem('ctrlLine_' + id);
-	if (ctrlLine) { return ctrlLine; }
+  var ctrlLine = svgedit.utilities.getElem('ctrlLine_' + id);
+  if (ctrlLine) { return ctrlLine; }
 
-	ctrlLine = document.createElementNS(NS.SVG, 'line');
-	svgedit.utilities.assignAttributes(ctrlLine, {
-		'id': 'ctrlLine_' + id,
-		'stroke': '#555',
-		'stroke-width': 1,
-		'style': 'pointer-events:none'
-	});
-	svgedit.path.getGripContainer().appendChild(ctrlLine);
-	return ctrlLine;
+  ctrlLine = document.createElementNS(NS.SVG, 'line');
+  svgedit.utilities.assignAttributes(ctrlLine, {
+    'id': 'ctrlLine_' + id,
+    'stroke': '#555',
+    'stroke-width': 1,
+    'style': 'pointer-events:none'
+  });
+  svgedit.path.getGripContainer().appendChild(ctrlLine);
+  return ctrlLine;
 };
 
 svgedit.path.getPointGrip = function (seg, update) {
-	var index = seg.index;
-	var pointGrip = svgedit.path.addPointGrip(index);
+  var index = seg.index;
+  var pointGrip = svgedit.path.addPointGrip(index);
 
-	if (update) {
-		var pt = svgedit.path.getGripPt(seg);
-		svgedit.utilities.assignAttributes(pointGrip, {
-			'cx': pt.x,
-			'cy': pt.y,
-			'display': 'inline'
-		});
-	}
+  if (update) {
+    var pt = svgedit.path.getGripPt(seg);
+    svgedit.utilities.assignAttributes(pointGrip, {
+      'cx': pt.x,
+      'cy': pt.y,
+      'display': 'inline'
+    });
+  }
 
-	return pointGrip;
+  return pointGrip;
 };
 
 svgedit.path.getControlPoints = function (seg) {
-	var item = seg.item;
-	var index = seg.index;
-	if (!('x1' in item) || !('x2' in item)) { return null; }
-	var cpt = {};
-	/* var pointGripContainer = */ svgedit.path.getGripContainer();
+  var item = seg.item;
+  var index = seg.index;
+  if (!('x1' in item) || !('x2' in item)) { return null; }
+  var cpt = {};
+  /* var pointGripContainer = */ svgedit.path.getGripContainer();
 
-	// Note that this is intentionally not seg.prev.item
-	var prev = svgedit.path.path.segs[index - 1].item;
+  // Note that this is intentionally not seg.prev.item
+  var prev = svgedit.path.path.segs[index - 1].item;
 
-	var segItems = [prev, item];
+  var segItems = [prev, item];
 
-	var i;
-	for (i = 1; i < 3; i++) {
-		var id = index + 'c' + i;
+  var i;
+  for (i = 1; i < 3; i++) {
+    var id = index + 'c' + i;
 
-		var ctrlLine = cpt['c' + i + '_line'] = svgedit.path.getCtrlLine(id);
+    var ctrlLine = cpt['c' + i + '_line'] = svgedit.path.getCtrlLine(id);
 
-		var pt = svgedit.path.getGripPt(seg, {x: item['x' + i], y: item['y' + i]});
-		var gpt = svgedit.path.getGripPt(seg, {x: segItems[i - 1].x, y: segItems[i - 1].y});
+    var pt = svgedit.path.getGripPt(seg, {x: item['x' + i], y: item['y' + i]});
+    var gpt = svgedit.path.getGripPt(seg, {x: segItems[i - 1].x, y: segItems[i - 1].y});
 
-		svgedit.utilities.assignAttributes(ctrlLine, {
-			'x1': pt.x,
-			'y1': pt.y,
-			'x2': gpt.x,
-			'y2': gpt.y,
-			'display': 'inline'
-		});
+    svgedit.utilities.assignAttributes(ctrlLine, {
+      'x1': pt.x,
+      'y1': pt.y,
+      'x2': gpt.x,
+      'y2': gpt.y,
+      'display': 'inline'
+    });
 
-		cpt['c' + i + '_line'] = ctrlLine;
+    cpt['c' + i + '_line'] = ctrlLine;
 
-		// create it
-		var pointGrip = cpt['c' + i] = svgedit.path.addCtrlGrip(id);
+    // create it
+    var pointGrip = cpt['c' + i] = svgedit.path.addCtrlGrip(id);
 
-		svgedit.utilities.assignAttributes(pointGrip, {
-			'cx': pt.x,
-			'cy': pt.y,
-			'display': 'inline'
-		});
-		cpt['c' + i] = pointGrip;
-	}
-	return cpt;
+    svgedit.utilities.assignAttributes(pointGrip, {
+      'cx': pt.x,
+      'cy': pt.y,
+      'display': 'inline'
+    });
+    cpt['c' + i] = pointGrip;
+  }
+  return cpt;
 };
 
 // This replaces the segment at the given index. Type is given as number.
 svgedit.path.replacePathSeg = function (type, index, pts, elem) {
-	var path = elem || svgedit.path.path.elem;
+  var path = elem || svgedit.path.path.elem;
 
-	var func = 'createSVGPathSeg' + pathFuncs[type];
-	var seg = path[func].apply(path, pts);
+  var func = 'createSVGPathSeg' + pathFuncs[type];
+  var seg = path[func].apply(path, pts);
 
-	if (svgedit.browser.supportsPathReplaceItem()) {
-		path.pathSegList.replaceItem(seg, index);
-	} else {
-		var segList = path.pathSegList;
-		var len = segList.numberOfItems;
-		var arr = [];
-		var i;
-		for (i = 0; i < len; i++) {
-			var curSeg = segList.getItem(i);
-			arr.push(curSeg);
-		}
-		segList.clear();
-		for (i = 0; i < len; i++) {
-			if (i === index) {
-				segList.appendItem(seg);
-			} else {
-				segList.appendItem(arr[i]);
-			}
-		}
-	}
+  if (svgedit.browser.supportsPathReplaceItem()) {
+    path.pathSegList.replaceItem(seg, index);
+  } else {
+    var segList = path.pathSegList;
+    var len = segList.numberOfItems;
+    var arr = [];
+    var i;
+    for (i = 0; i < len; i++) {
+      var curSeg = segList.getItem(i);
+      arr.push(curSeg);
+    }
+    segList.clear();
+    for (i = 0; i < len; i++) {
+      if (i === index) {
+        segList.appendItem(seg);
+      } else {
+        segList.appendItem(arr[i]);
+      }
+    }
+  }
 };
 
 svgedit.path.getSegSelector = function (seg, update) {
-	var index = seg.index;
-	var segLine = svgedit.utilities.getElem('segline_' + index);
-	if (!segLine) {
-		var pointGripContainer = svgedit.path.getGripContainer();
-		// create segline
-		segLine = document.createElementNS(NS.SVG, 'path');
-		svgedit.utilities.assignAttributes(segLine, {
-			'id': 'segline_' + index,
-			'display': 'none',
-			'fill': 'none',
-			'stroke': '#0FF',
-			'stroke-width': 2,
-			'style': 'pointer-events:none',
-			'd': 'M0,0 0,0'
-		});
-		pointGripContainer.appendChild(segLine);
-	}
+  var index = seg.index;
+  var segLine = svgedit.utilities.getElem('segline_' + index);
+  if (!segLine) {
+    var pointGripContainer = svgedit.path.getGripContainer();
+    // create segline
+    segLine = document.createElementNS(NS.SVG, 'path');
+    svgedit.utilities.assignAttributes(segLine, {
+      'id': 'segline_' + index,
+      'display': 'none',
+      'fill': 'none',
+      'stroke': '#0FF',
+      'stroke-width': 2,
+      'style': 'pointer-events:none',
+      'd': 'M0,0 0,0'
+    });
+    pointGripContainer.appendChild(segLine);
+  }
 
-	if (update) {
-		var prev = seg.prev;
-		if (!prev) {
-			segLine.setAttribute('display', 'none');
-			return segLine;
-		}
+  if (update) {
+    var prev = seg.prev;
+    if (!prev) {
+      segLine.setAttribute('display', 'none');
+      return segLine;
+    }
 
-		var pt = svgedit.path.getGripPt(prev);
-		// Set start point
-		svgedit.path.replacePathSeg(2, 0, [pt.x, pt.y], segLine);
+    var pt = svgedit.path.getGripPt(prev);
+    // Set start point
+    svgedit.path.replacePathSeg(2, 0, [pt.x, pt.y], segLine);
 
-		var pts = svgedit.path.ptObjToArr(seg.type, seg.item, true);
-		var i;
-		for (i = 0; i < pts.length; i += 2) {
-			pt = svgedit.path.getGripPt(seg, {x: pts[i], y: pts[i + 1]});
-			pts[i] = pt.x;
-			pts[i + 1] = pt.y;
-		}
+    var pts = svgedit.path.ptObjToArr(seg.type, seg.item, true);
+    var i;
+    for (i = 0; i < pts.length; i += 2) {
+      pt = svgedit.path.getGripPt(seg, {x: pts[i], y: pts[i + 1]});
+      pts[i] = pt.x;
+      pts[i + 1] = pt.y;
+    }
 
-		svgedit.path.replacePathSeg(seg.type, 1, pts, segLine);
-	}
-	return segLine;
+    svgedit.path.replacePathSeg(seg.type, 1, pts, segLine);
+  }
+  return segLine;
 };
 
 // Function: smoothControlPoints
@@ -364,571 +364,571 @@ svgedit.path.getSegSelector = function (seg, update) {
 // Returns:
 // Array of two "smoothed" point objects
 svgedit.path.smoothControlPoints = function (ct1, ct2, pt) {
-	// each point must not be the origin
-	var x1 = ct1.x - pt.x,
-		y1 = ct1.y - pt.y,
-		x2 = ct2.x - pt.x,
-		y2 = ct2.y - pt.y;
+  // each point must not be the origin
+  var x1 = ct1.x - pt.x,
+    y1 = ct1.y - pt.y,
+    x2 = ct2.x - pt.x,
+    y2 = ct2.y - pt.y;
 
-	if ((x1 !== 0 || y1 !== 0) && (x2 !== 0 || y2 !== 0)) {
-		var anglea = Math.atan2(y1, x1),
-			angleb = Math.atan2(y2, x2),
-			r1 = Math.sqrt(x1 * x1 + y1 * y1),
-			r2 = Math.sqrt(x2 * x2 + y2 * y2),
-			nct1 = editorContext_.getSVGRoot().createSVGPoint(),
-			nct2 = editorContext_.getSVGRoot().createSVGPoint();
-		if (anglea < 0) { anglea += 2 * Math.PI; }
-		if (angleb < 0) { angleb += 2 * Math.PI; }
+  if ((x1 !== 0 || y1 !== 0) && (x2 !== 0 || y2 !== 0)) {
+    var anglea = Math.atan2(y1, x1),
+      angleb = Math.atan2(y2, x2),
+      r1 = Math.sqrt(x1 * x1 + y1 * y1),
+      r2 = Math.sqrt(x2 * x2 + y2 * y2),
+      nct1 = editorContext_.getSVGRoot().createSVGPoint(),
+      nct2 = editorContext_.getSVGRoot().createSVGPoint();
+    if (anglea < 0) { anglea += 2 * Math.PI; }
+    if (angleb < 0) { angleb += 2 * Math.PI; }
 
-		var angleBetween = Math.abs(anglea - angleb),
-			angleDiff = Math.abs(Math.PI - angleBetween) / 2;
+    var angleBetween = Math.abs(anglea - angleb),
+      angleDiff = Math.abs(Math.PI - angleBetween) / 2;
 
-		var newAnglea, newAngleb;
-		if (anglea - angleb > 0) {
-			newAnglea = angleBetween < Math.PI ? (anglea + angleDiff) : (anglea - angleDiff);
-			newAngleb = angleBetween < Math.PI ? (angleb - angleDiff) : (angleb + angleDiff);
-		} else {
-			newAnglea = angleBetween < Math.PI ? (anglea - angleDiff) : (anglea + angleDiff);
-			newAngleb = angleBetween < Math.PI ? (angleb + angleDiff) : (angleb - angleDiff);
-		}
+    var newAnglea, newAngleb;
+    if (anglea - angleb > 0) {
+      newAnglea = angleBetween < Math.PI ? (anglea + angleDiff) : (anglea - angleDiff);
+      newAngleb = angleBetween < Math.PI ? (angleb - angleDiff) : (angleb + angleDiff);
+    } else {
+      newAnglea = angleBetween < Math.PI ? (anglea - angleDiff) : (anglea + angleDiff);
+      newAngleb = angleBetween < Math.PI ? (angleb + angleDiff) : (angleb - angleDiff);
+    }
 
-		// rotate the points
-		nct1.x = r1 * Math.cos(newAnglea) + pt.x;
-		nct1.y = r1 * Math.sin(newAnglea) + pt.y;
-		nct2.x = r2 * Math.cos(newAngleb) + pt.x;
-		nct2.y = r2 * Math.sin(newAngleb) + pt.y;
+    // rotate the points
+    nct1.x = r1 * Math.cos(newAnglea) + pt.x;
+    nct1.y = r1 * Math.sin(newAnglea) + pt.y;
+    nct2.x = r2 * Math.cos(newAngleb) + pt.x;
+    nct2.y = r2 * Math.sin(newAngleb) + pt.y;
 
-		return [nct1, nct2];
-	}
-	return undefined;
+    return [nct1, nct2];
+  }
+  return undefined;
 };
 
 svgedit.path.Segment = function (index, item) {
-	this.selected = false;
-	this.index = index;
-	this.item = item;
-	this.type = item.pathSegType;
+  this.selected = false;
+  this.index = index;
+  this.item = item;
+  this.type = item.pathSegType;
 
-	this.ctrlpts = [];
-	this.ptgrip = null;
-	this.segsel = null;
+  this.ctrlpts = [];
+  this.ptgrip = null;
+  this.segsel = null;
 };
 
 svgedit.path.Segment.prototype.showCtrlPts = function (y) {
-	var i;
-	for (i in this.ctrlpts) {
-		if (this.ctrlpts.hasOwnProperty(i)) {
-			this.ctrlpts[i].setAttribute('display', y ? 'inline' : 'none');
-		}
-	}
+  var i;
+  for (i in this.ctrlpts) {
+    if (this.ctrlpts.hasOwnProperty(i)) {
+      this.ctrlpts[i].setAttribute('display', y ? 'inline' : 'none');
+    }
+  }
 };
 
 svgedit.path.Segment.prototype.selectCtrls = function (y) {
-	$('#ctrlpointgrip_' + this.index + 'c1, #ctrlpointgrip_' + this.index + 'c2')
-		.attr('fill', y ? '#0FF' : '#EEE');
+  $('#ctrlpointgrip_' + this.index + 'c1, #ctrlpointgrip_' + this.index + 'c2')
+    .attr('fill', y ? '#0FF' : '#EEE');
 };
 
 svgedit.path.Segment.prototype.show = function (y) {
-	if (this.ptgrip) {
-		this.ptgrip.setAttribute('display', y ? 'inline' : 'none');
-		this.segsel.setAttribute('display', y ? 'inline' : 'none');
-		// Show/hide all control points if available
-		this.showCtrlPts(y);
-	}
+  if (this.ptgrip) {
+    this.ptgrip.setAttribute('display', y ? 'inline' : 'none');
+    this.segsel.setAttribute('display', y ? 'inline' : 'none');
+    // Show/hide all control points if available
+    this.showCtrlPts(y);
+  }
 };
 
 svgedit.path.Segment.prototype.select = function (y) {
-	if (this.ptgrip) {
-		this.ptgrip.setAttribute('stroke', y ? '#0FF' : '#00F');
-		this.segsel.setAttribute('display', y ? 'inline' : 'none');
-		if (this.ctrlpts) {
-			this.selectCtrls(y);
-		}
-		this.selected = y;
-	}
+  if (this.ptgrip) {
+    this.ptgrip.setAttribute('stroke', y ? '#0FF' : '#00F');
+    this.segsel.setAttribute('display', y ? 'inline' : 'none');
+    if (this.ctrlpts) {
+      this.selectCtrls(y);
+    }
+    this.selected = y;
+  }
 };
 
 svgedit.path.Segment.prototype.addGrip = function () {
-	this.ptgrip = svgedit.path.getPointGrip(this, true);
-	this.ctrlpts = svgedit.path.getControlPoints(this, true);
-	this.segsel = svgedit.path.getSegSelector(this, true);
+  this.ptgrip = svgedit.path.getPointGrip(this, true);
+  this.ctrlpts = svgedit.path.getControlPoints(this, true);
+  this.segsel = svgedit.path.getSegSelector(this, true);
 };
 
 svgedit.path.Segment.prototype.update = function (full) {
-	if (this.ptgrip) {
-		var pt = svgedit.path.getGripPt(this);
-		svgedit.utilities.assignAttributes(this.ptgrip, {
-			'cx': pt.x,
-			'cy': pt.y
-		});
+  if (this.ptgrip) {
+    var pt = svgedit.path.getGripPt(this);
+    svgedit.utilities.assignAttributes(this.ptgrip, {
+      'cx': pt.x,
+      'cy': pt.y
+    });
 
-		svgedit.path.getSegSelector(this, true);
+    svgedit.path.getSegSelector(this, true);
 
-		if (this.ctrlpts) {
-			if (full) {
-				this.item = svgedit.path.path.elem.pathSegList.getItem(this.index);
-				this.type = this.item.pathSegType;
-			}
-			svgedit.path.getControlPoints(this);
-		}
-		// this.segsel.setAttribute('display', y?'inline':'none');
-	}
+    if (this.ctrlpts) {
+      if (full) {
+        this.item = svgedit.path.path.elem.pathSegList.getItem(this.index);
+        this.type = this.item.pathSegType;
+      }
+      svgedit.path.getControlPoints(this);
+    }
+    // this.segsel.setAttribute('display', y?'inline':'none');
+  }
 };
 
 svgedit.path.Segment.prototype.move = function (dx, dy) {
-	var curPts, item = this.item;
+  var curPts, item = this.item;
 
-	if (this.ctrlpts) {
-		curPts = [item.x += dx, item.y += dy,
-			item.x1, item.y1, item.x2 += dx, item.y2 += dy];
-	} else {
-		curPts = [item.x += dx, item.y += dy];
-	}
+  if (this.ctrlpts) {
+    curPts = [item.x += dx, item.y += dy,
+      item.x1, item.y1, item.x2 += dx, item.y2 += dy];
+  } else {
+    curPts = [item.x += dx, item.y += dy];
+  }
 
-	svgedit.path.replacePathSeg(this.type, this.index, curPts);
+  svgedit.path.replacePathSeg(this.type, this.index, curPts);
 
-	if (this.next && this.next.ctrlpts) {
-		var next = this.next.item;
-		var nextPts = [next.x, next.y,
-			next.x1 += dx, next.y1 += dy, next.x2, next.y2];
-		svgedit.path.replacePathSeg(this.next.type, this.next.index, nextPts);
-	}
+  if (this.next && this.next.ctrlpts) {
+    var next = this.next.item;
+    var nextPts = [next.x, next.y,
+      next.x1 += dx, next.y1 += dy, next.x2, next.y2];
+    svgedit.path.replacePathSeg(this.next.type, this.next.index, nextPts);
+  }
 
-	if (this.mate) {
-		// The last point of a closed subpath has a 'mate',
-		// which is the 'M' segment of the subpath
-		item = this.mate.item;
-		var pts = [item.x += dx, item.y += dy];
-		svgedit.path.replacePathSeg(this.mate.type, this.mate.index, pts);
-		// Has no grip, so does not need 'updating'?
-	}
+  if (this.mate) {
+    // The last point of a closed subpath has a 'mate',
+    // which is the 'M' segment of the subpath
+    item = this.mate.item;
+    var pts = [item.x += dx, item.y += dy];
+    svgedit.path.replacePathSeg(this.mate.type, this.mate.index, pts);
+    // Has no grip, so does not need 'updating'?
+  }
 
-	this.update(true);
-	if (this.next) { this.next.update(true); }
+  this.update(true);
+  if (this.next) { this.next.update(true); }
 };
 
 svgedit.path.Segment.prototype.setLinked = function (num) {
-	var seg, anum, pt;
-	if (num === 2) {
-		anum = 1;
-		seg = this.next;
-		if (!seg) { return; }
-		pt = this.item;
-	} else {
-		anum = 2;
-		seg = this.prev;
-		if (!seg) { return; }
-		pt = seg.item;
-	}
+  var seg, anum, pt;
+  if (num === 2) {
+    anum = 1;
+    seg = this.next;
+    if (!seg) { return; }
+    pt = this.item;
+  } else {
+    anum = 2;
+    seg = this.prev;
+    if (!seg) { return; }
+    pt = seg.item;
+  }
 
-	var item = seg.item;
-	item['x' + anum] = pt.x + (pt.x - this.item['x' + num]);
-	item['y' + anum] = pt.y + (pt.y - this.item['y' + num]);
+  var item = seg.item;
+  item['x' + anum] = pt.x + (pt.x - this.item['x' + num]);
+  item['y' + anum] = pt.y + (pt.y - this.item['y' + num]);
 
-	var pts = [item.x, item.y,
-		item.x1, item.y1,
-		item.x2, item.y2];
+  var pts = [item.x, item.y,
+    item.x1, item.y1,
+    item.x2, item.y2];
 
-	svgedit.path.replacePathSeg(seg.type, seg.index, pts);
-	seg.update(true);
+  svgedit.path.replacePathSeg(seg.type, seg.index, pts);
+  seg.update(true);
 };
 
 svgedit.path.Segment.prototype.moveCtrl = function (num, dx, dy) {
-	var item = this.item;
-	item['x' + num] += dx;
-	item['y' + num] += dy;
+  var item = this.item;
+  item['x' + num] += dx;
+  item['y' + num] += dy;
 
-	var pts = [item.x, item.y,
-		item.x1, item.y1, item.x2, item.y2];
+  var pts = [item.x, item.y,
+    item.x1, item.y1, item.x2, item.y2];
 
-	svgedit.path.replacePathSeg(this.type, this.index, pts);
-	this.update(true);
+  svgedit.path.replacePathSeg(this.type, this.index, pts);
+  this.update(true);
 };
 
 svgedit.path.Segment.prototype.setType = function (newType, pts) {
-	svgedit.path.replacePathSeg(newType, this.index, pts);
-	this.type = newType;
-	this.item = svgedit.path.path.elem.pathSegList.getItem(this.index);
-	this.showCtrlPts(newType === 6);
-	this.ctrlpts = svgedit.path.getControlPoints(this);
-	this.update(true);
+  svgedit.path.replacePathSeg(newType, this.index, pts);
+  this.type = newType;
+  this.item = svgedit.path.path.elem.pathSegList.getItem(this.index);
+  this.showCtrlPts(newType === 6);
+  this.ctrlpts = svgedit.path.getControlPoints(this);
+  this.update(true);
 };
 
 svgedit.path.Path = function (elem) {
-	if (!elem || elem.tagName !== 'path') {
-		throw new Error('svgedit.path.Path constructed without a <path> element');
-	}
+  if (!elem || elem.tagName !== 'path') {
+    throw new Error('svgedit.path.Path constructed without a <path> element');
+  }
 
-	this.elem = elem;
-	this.segs = [];
-	this.selected_pts = [];
-	svgedit.path.path = this;
+  this.elem = elem;
+  this.segs = [];
+  this.selected_pts = [];
+  svgedit.path.path = this;
 
-	this.init();
+  this.init();
 };
 
 // Reset path data
 svgedit.path.Path.prototype.init = function () {
-	// Hide all grips, etc
+  // Hide all grips, etc
 
-	// fixed, needed to work on all found elements, not just first
-	$(svgedit.path.getGripContainer()).find('*').each(function () {
-		$(this).attr('display', 'none');
-	});
+  // fixed, needed to work on all found elements, not just first
+  $(svgedit.path.getGripContainer()).find('*').each(function () {
+    $(this).attr('display', 'none');
+  });
 
-	var segList = this.elem.pathSegList;
-	var len = segList.numberOfItems;
-	this.segs = [];
-	this.selected_pts = [];
-	this.first_seg = null;
+  var segList = this.elem.pathSegList;
+  var len = segList.numberOfItems;
+  this.segs = [];
+  this.selected_pts = [];
+  this.first_seg = null;
 
-	// Set up segs array
-	var i;
-	for (i = 0; i < len; i++) {
-		var item = segList.getItem(i);
-		var segment = new svgedit.path.Segment(i, item);
-		segment.path = this;
-		this.segs.push(segment);
-	}
+  // Set up segs array
+  var i;
+  for (i = 0; i < len; i++) {
+    var item = segList.getItem(i);
+    var segment = new svgedit.path.Segment(i, item);
+    segment.path = this;
+    this.segs.push(segment);
+  }
 
-	var segs = this.segs;
-	var startI = null;
+  var segs = this.segs;
+  var startI = null;
 
-	for (i = 0; i < len; i++) {
-		var seg = segs[i];
-		var nextSeg = (i + 1) >= len ? null : segs[i + 1];
-		var prevSeg = (i - 1) < 0 ? null : segs[i - 1];
-		var startSeg;
-		if (seg.type === 2) {
-			if (prevSeg && prevSeg.type !== 1) {
-				// New sub-path, last one is open,
-				// so add a grip to last sub-path's first point
-				startSeg = segs[startI];
-				startSeg.next = segs[startI + 1];
-				startSeg.next.prev = startSeg;
-				startSeg.addGrip();
-			}
-			// Remember that this is a starter seg
-			startI = i;
-		} else if (nextSeg && nextSeg.type === 1) {
-			// This is the last real segment of a closed sub-path
-			// Next is first seg after "M"
-			seg.next = segs[startI + 1];
+  for (i = 0; i < len; i++) {
+    var seg = segs[i];
+    var nextSeg = (i + 1) >= len ? null : segs[i + 1];
+    var prevSeg = (i - 1) < 0 ? null : segs[i - 1];
+    var startSeg;
+    if (seg.type === 2) {
+      if (prevSeg && prevSeg.type !== 1) {
+        // New sub-path, last one is open,
+        // so add a grip to last sub-path's first point
+        startSeg = segs[startI];
+        startSeg.next = segs[startI + 1];
+        startSeg.next.prev = startSeg;
+        startSeg.addGrip();
+      }
+      // Remember that this is a starter seg
+      startI = i;
+    } else if (nextSeg && nextSeg.type === 1) {
+      // This is the last real segment of a closed sub-path
+      // Next is first seg after "M"
+      seg.next = segs[startI + 1];
 
-			// First seg after "M"'s prev is this
-			seg.next.prev = seg;
-			seg.mate = segs[startI];
-			seg.addGrip();
-			if (this.first_seg == null) {
-				this.first_seg = seg;
-			}
-		} else if (!nextSeg) {
-			if (seg.type !== 1) {
-				// Last seg, doesn't close so add a grip
-				// to last sub-path's first point
-				startSeg = segs[startI];
-				startSeg.next = segs[startI + 1];
-				startSeg.next.prev = startSeg;
-				startSeg.addGrip();
-				seg.addGrip();
+      // First seg after "M"'s prev is this
+      seg.next.prev = seg;
+      seg.mate = segs[startI];
+      seg.addGrip();
+      if (this.first_seg == null) {
+        this.first_seg = seg;
+      }
+    } else if (!nextSeg) {
+      if (seg.type !== 1) {
+        // Last seg, doesn't close so add a grip
+        // to last sub-path's first point
+        startSeg = segs[startI];
+        startSeg.next = segs[startI + 1];
+        startSeg.next.prev = startSeg;
+        startSeg.addGrip();
+        seg.addGrip();
 
-				if (!this.first_seg) {
-					// Open path, so set first as real first and add grip
-					this.first_seg = segs[startI];
-				}
-			}
-		} else if (seg.type !== 1) {
-			// Regular segment, so add grip and its "next"
-			seg.addGrip();
+        if (!this.first_seg) {
+          // Open path, so set first as real first and add grip
+          this.first_seg = segs[startI];
+        }
+      }
+    } else if (seg.type !== 1) {
+      // Regular segment, so add grip and its "next"
+      seg.addGrip();
 
-			// Don't set its "next" if it's an "M"
-			if (nextSeg && nextSeg.type !== 2) {
-				seg.next = nextSeg;
-				seg.next.prev = seg;
-			}
-		}
-	}
-	return this;
+      // Don't set its "next" if it's an "M"
+      if (nextSeg && nextSeg.type !== 2) {
+        seg.next = nextSeg;
+        seg.next.prev = seg;
+      }
+    }
+  }
+  return this;
 };
 
 svgedit.path.Path.prototype.eachSeg = function (fn) {
-	var i;
-	var len = this.segs.length;
-	for (i = 0; i < len; i++) {
-		var ret = fn.call(this.segs[i], i);
-		if (ret === false) { break; }
-	}
+  var i;
+  var len = this.segs.length;
+  for (i = 0; i < len; i++) {
+    var ret = fn.call(this.segs[i], i);
+    if (ret === false) { break; }
+  }
 };
 
 svgedit.path.Path.prototype.addSeg = function (index) {
-	// Adds a new segment
-	var seg = this.segs[index];
-	if (!seg.prev) { return; }
+  // Adds a new segment
+  var seg = this.segs[index];
+  if (!seg.prev) { return; }
 
-	var prev = seg.prev;
-	var newseg, newX, newY;
-	switch (seg.item.pathSegType) {
-	case 4:
-		newX = (seg.item.x + prev.item.x) / 2;
-		newY = (seg.item.y + prev.item.y) / 2;
-		newseg = this.elem.createSVGPathSegLinetoAbs(newX, newY);
-		break;
-	case 6: // make it a curved segment to preserve the shape (WRS)
-		// http://en.wikipedia.org/wiki/De_Casteljau%27s_algorithm#Geometric_interpretation
-		var p0x = (prev.item.x + seg.item.x1) / 2;
-		var p1x = (seg.item.x1 + seg.item.x2) / 2;
-		var p2x = (seg.item.x2 + seg.item.x) / 2;
-		var p01x = (p0x + p1x) / 2;
-		var p12x = (p1x + p2x) / 2;
-		newX = (p01x + p12x) / 2;
-		var p0y = (prev.item.y + seg.item.y1) / 2;
-		var p1y = (seg.item.y1 + seg.item.y2) / 2;
-		var p2y = (seg.item.y2 + seg.item.y) / 2;
-		var p01y = (p0y + p1y) / 2;
-		var p12y = (p1y + p2y) / 2;
-		newY = (p01y + p12y) / 2;
-		newseg = this.elem.createSVGPathSegCurvetoCubicAbs(newX, newY, p0x, p0y, p01x, p01y);
-		var pts = [seg.item.x, seg.item.y, p12x, p12y, p2x, p2y];
-		svgedit.path.replacePathSeg(seg.type, index, pts);
-		break;
-	}
+  var prev = seg.prev;
+  var newseg, newX, newY;
+  switch (seg.item.pathSegType) {
+  case 4:
+    newX = (seg.item.x + prev.item.x) / 2;
+    newY = (seg.item.y + prev.item.y) / 2;
+    newseg = this.elem.createSVGPathSegLinetoAbs(newX, newY);
+    break;
+  case 6: // make it a curved segment to preserve the shape (WRS)
+    // http://en.wikipedia.org/wiki/De_Casteljau%27s_algorithm#Geometric_interpretation
+    var p0x = (prev.item.x + seg.item.x1) / 2;
+    var p1x = (seg.item.x1 + seg.item.x2) / 2;
+    var p2x = (seg.item.x2 + seg.item.x) / 2;
+    var p01x = (p0x + p1x) / 2;
+    var p12x = (p1x + p2x) / 2;
+    newX = (p01x + p12x) / 2;
+    var p0y = (prev.item.y + seg.item.y1) / 2;
+    var p1y = (seg.item.y1 + seg.item.y2) / 2;
+    var p2y = (seg.item.y2 + seg.item.y) / 2;
+    var p01y = (p0y + p1y) / 2;
+    var p12y = (p1y + p2y) / 2;
+    newY = (p01y + p12y) / 2;
+    newseg = this.elem.createSVGPathSegCurvetoCubicAbs(newX, newY, p0x, p0y, p01x, p01y);
+    var pts = [seg.item.x, seg.item.y, p12x, p12y, p2x, p2y];
+    svgedit.path.replacePathSeg(seg.type, index, pts);
+    break;
+  }
 
-	svgedit.path.insertItemBefore(this.elem, newseg, index);
+  svgedit.path.insertItemBefore(this.elem, newseg, index);
 };
 
 svgedit.path.Path.prototype.deleteSeg = function (index) {
-	var seg = this.segs[index];
-	var list = this.elem.pathSegList;
+  var seg = this.segs[index];
+  var list = this.elem.pathSegList;
 
-	seg.show(false);
-	var next = seg.next;
-	var pt;
-	if (seg.mate) {
-		// Make the next point be the "M" point
-		pt = [next.item.x, next.item.y];
-		svgedit.path.replacePathSeg(2, next.index, pt);
+  seg.show(false);
+  var next = seg.next;
+  var pt;
+  if (seg.mate) {
+    // Make the next point be the "M" point
+    pt = [next.item.x, next.item.y];
+    svgedit.path.replacePathSeg(2, next.index, pt);
 
-		// Reposition last node
-		svgedit.path.replacePathSeg(4, seg.index, pt);
+    // Reposition last node
+    svgedit.path.replacePathSeg(4, seg.index, pt);
 
-		list.removeItem(seg.mate.index);
-	} else if (!seg.prev) {
-		// First node of open path, make next point the M
-		// var item = seg.item;
-		pt = [next.item.x, next.item.y];
-		svgedit.path.replacePathSeg(2, seg.next.index, pt);
-		list.removeItem(index);
-	} else {
-		list.removeItem(index);
-	}
+    list.removeItem(seg.mate.index);
+  } else if (!seg.prev) {
+    // First node of open path, make next point the M
+    // var item = seg.item;
+    pt = [next.item.x, next.item.y];
+    svgedit.path.replacePathSeg(2, seg.next.index, pt);
+    list.removeItem(index);
+  } else {
+    list.removeItem(index);
+  }
 };
 
 svgedit.path.Path.prototype.subpathIsClosed = function (index) {
-	var closed = false;
-	// Check if subpath is already open
-	svgedit.path.path.eachSeg(function (i) {
-		if (i <= index) { return true; }
-		if (this.type === 2) {
-			// Found M first, so open
-			return false;
-		}
-		if (this.type === 1) {
-			// Found Z first, so closed
-			closed = true;
-			return false;
-		}
-	});
+  var closed = false;
+  // Check if subpath is already open
+  svgedit.path.path.eachSeg(function (i) {
+    if (i <= index) { return true; }
+    if (this.type === 2) {
+      // Found M first, so open
+      return false;
+    }
+    if (this.type === 1) {
+      // Found Z first, so closed
+      closed = true;
+      return false;
+    }
+  });
 
-	return closed;
+  return closed;
 };
 
 svgedit.path.Path.prototype.removePtFromSelection = function (index) {
-	var pos = this.selected_pts.indexOf(index);
-	if (pos === -1) {
-		return;
-	}
-	this.segs[index].select(false);
-	this.selected_pts.splice(pos, 1);
+  var pos = this.selected_pts.indexOf(index);
+  if (pos === -1) {
+    return;
+  }
+  this.segs[index].select(false);
+  this.selected_pts.splice(pos, 1);
 };
 
 svgedit.path.Path.prototype.clearSelection = function () {
-	this.eachSeg(function () {
-		// 'this' is the segment here
-		this.select(false);
-	});
-	this.selected_pts = [];
+  this.eachSeg(function () {
+    // 'this' is the segment here
+    this.select(false);
+  });
+  this.selected_pts = [];
 };
 
 svgedit.path.Path.prototype.storeD = function () {
-	this.last_d = this.elem.getAttribute('d');
+  this.last_d = this.elem.getAttribute('d');
 };
 
 svgedit.path.Path.prototype.show = function (y) {
-	// Shows this path's segment grips
-	this.eachSeg(function () {
-		// 'this' is the segment here
-		this.show(y);
-	});
-	if (y) {
-		this.selectPt(this.first_seg.index);
-	}
-	return this;
+  // Shows this path's segment grips
+  this.eachSeg(function () {
+    // 'this' is the segment here
+    this.show(y);
+  });
+  if (y) {
+    this.selectPt(this.first_seg.index);
+  }
+  return this;
 };
 
 // Move selected points
 svgedit.path.Path.prototype.movePts = function (dx, dy) {
-	var i = this.selected_pts.length;
-	while (i--) {
-		var seg = this.segs[this.selected_pts[i]];
-		seg.move(dx, dy);
-	}
+  var i = this.selected_pts.length;
+  while (i--) {
+    var seg = this.segs[this.selected_pts[i]];
+    seg.move(dx, dy);
+  }
 };
 
 svgedit.path.Path.prototype.moveCtrl = function (dx, dy) {
-	var seg = this.segs[this.selected_pts[0]];
-	seg.moveCtrl(this.dragctrl, dx, dy);
-	if (linkControlPts) {
-		seg.setLinked(this.dragctrl);
-	}
+  var seg = this.segs[this.selected_pts[0]];
+  seg.moveCtrl(this.dragctrl, dx, dy);
+  if (linkControlPts) {
+    seg.setLinked(this.dragctrl);
+  }
 };
 
 svgedit.path.Path.prototype.setSegType = function (newType) {
-	this.storeD();
-	var i = this.selected_pts.length;
-	var text;
-	while (i--) {
-		var selPt = this.selected_pts[i];
+  this.storeD();
+  var i = this.selected_pts.length;
+  var text;
+  while (i--) {
+    var selPt = this.selected_pts[i];
 
-		// Selected seg
-		var cur = this.segs[selPt];
-		var prev = cur.prev;
-		if (!prev) { continue; }
+    // Selected seg
+    var cur = this.segs[selPt];
+    var prev = cur.prev;
+    if (!prev) { continue; }
 
-		if (!newType) { // double-click, so just toggle
-			text = 'Toggle Path Segment Type';
+    if (!newType) { // double-click, so just toggle
+      text = 'Toggle Path Segment Type';
 
-			// Toggle segment to curve/straight line
-			var oldType = cur.type;
+      // Toggle segment to curve/straight line
+      var oldType = cur.type;
 
-			newType = (oldType === 6) ? 4 : 6;
-		}
+      newType = (oldType === 6) ? 4 : 6;
+    }
 
-		newType = Number(newType);
+    newType = Number(newType);
 
-		var curX = cur.item.x;
-		var curY = cur.item.y;
-		var prevX = prev.item.x;
-		var prevY = prev.item.y;
-		var points;
-		switch (newType) {
-		case 6:
-			if (cur.olditem) {
-				var old = cur.olditem;
-				points = [curX, curY, old.x1, old.y1, old.x2, old.y2];
-			} else {
-				var diffX = curX - prevX;
-				var diffY = curY - prevY;
-				// get control points from straight line segment
-				/*
-				var ct1x = (prevX + (diffY/2));
-				var ct1y = (prevY - (diffX/2));
-				var ct2x = (curX + (diffY/2));
-				var ct2y = (curY - (diffX/2));
-				*/
-				// create control points on the line to preserve the shape (WRS)
-				var ct1x = (prevX + (diffX / 3));
-				var ct1y = (prevY + (diffY / 3));
-				var ct2x = (curX - (diffX / 3));
-				var ct2y = (curY - (diffY / 3));
-				points = [curX, curY, ct1x, ct1y, ct2x, ct2y];
-			}
-			break;
-		case 4:
-			points = [curX, curY];
+    var curX = cur.item.x;
+    var curY = cur.item.y;
+    var prevX = prev.item.x;
+    var prevY = prev.item.y;
+    var points;
+    switch (newType) {
+    case 6:
+      if (cur.olditem) {
+        var old = cur.olditem;
+        points = [curX, curY, old.x1, old.y1, old.x2, old.y2];
+      } else {
+        var diffX = curX - prevX;
+        var diffY = curY - prevY;
+        // get control points from straight line segment
+        /*
+        var ct1x = (prevX + (diffY/2));
+        var ct1y = (prevY - (diffX/2));
+        var ct2x = (curX + (diffY/2));
+        var ct2y = (curY - (diffX/2));
+        */
+        // create control points on the line to preserve the shape (WRS)
+        var ct1x = (prevX + (diffX / 3));
+        var ct1y = (prevY + (diffY / 3));
+        var ct2x = (curX - (diffX / 3));
+        var ct2y = (curY - (diffY / 3));
+        points = [curX, curY, ct1x, ct1y, ct2x, ct2y];
+      }
+      break;
+    case 4:
+      points = [curX, curY];
 
-			// Store original prevve segment nums
-			cur.olditem = cur.item;
-			break;
-		}
+      // Store original prevve segment nums
+      cur.olditem = cur.item;
+      break;
+    }
 
-		cur.setType(newType, points);
-	}
-	svgedit.path.path.endChanges(text);
+    cur.setType(newType, points);
+  }
+  svgedit.path.path.endChanges(text);
 };
 
 svgedit.path.Path.prototype.selectPt = function (pt, ctrlNum) {
-	this.clearSelection();
-	if (pt == null) {
-		this.eachSeg(function (i) {
-			// 'this' is the segment here.
-			if (this.prev) {
-				pt = i;
-			}
-		});
-	}
-	this.addPtsToSelection(pt);
-	if (ctrlNum) {
-		this.dragctrl = ctrlNum;
+  this.clearSelection();
+  if (pt == null) {
+    this.eachSeg(function (i) {
+      // 'this' is the segment here.
+      if (this.prev) {
+        pt = i;
+      }
+    });
+  }
+  this.addPtsToSelection(pt);
+  if (ctrlNum) {
+    this.dragctrl = ctrlNum;
 
-		if (linkControlPts) {
-			this.segs[pt].setLinked(ctrlNum);
-		}
-	}
+    if (linkControlPts) {
+      this.segs[pt].setLinked(ctrlNum);
+    }
+  }
 };
 
 // Update position of all points
 svgedit.path.Path.prototype.update = function () {
-	var elem = this.elem;
-	if (svgedit.utilities.getRotationAngle(elem)) {
-		this.matrix = svgedit.math.getMatrix(elem);
-		this.imatrix = this.matrix.inverse();
-	} else {
-		this.matrix = null;
-		this.imatrix = null;
-	}
+  var elem = this.elem;
+  if (svgedit.utilities.getRotationAngle(elem)) {
+    this.matrix = svgedit.math.getMatrix(elem);
+    this.imatrix = this.matrix.inverse();
+  } else {
+    this.matrix = null;
+    this.imatrix = null;
+  }
 
-	this.eachSeg(function (i) {
-		this.item = elem.pathSegList.getItem(i);
-		this.update();
-	});
+  this.eachSeg(function (i) {
+    this.item = elem.pathSegList.getItem(i);
+    this.update();
+  });
 
-	return this;
+  return this;
 };
 
 svgedit.path.getPath_ = function (elem) {
-	var p = pathData[elem.id];
-	if (!p) {
-		p = pathData[elem.id] = new svgedit.path.Path(elem);
-	}
-	return p;
+  var p = pathData[elem.id];
+  if (!p) {
+    p = pathData[elem.id] = new svgedit.path.Path(elem);
+  }
+  return p;
 };
 
 svgedit.path.removePath_ = function (id) {
-	if (id in pathData) { delete pathData[id]; }
+  if (id in pathData) { delete pathData[id]; }
 };
 var newcx, newcy, oldcx, oldcy, angle;
 var getRotVals = function (x, y) {
-	var dx = x - oldcx;
-	var dy = y - oldcy;
+  var dx = x - oldcx;
+  var dy = y - oldcy;
 
-	// rotate the point around the old center
-	var r = Math.sqrt(dx * dx + dy * dy);
-	var theta = Math.atan2(dy, dx) + angle;
-	dx = r * Math.cos(theta) + oldcx;
-	dy = r * Math.sin(theta) + oldcy;
+  // rotate the point around the old center
+  var r = Math.sqrt(dx * dx + dy * dy);
+  var theta = Math.atan2(dy, dx) + angle;
+  dx = r * Math.cos(theta) + oldcx;
+  dy = r * Math.sin(theta) + oldcy;
 
-	// dx,dy should now hold the actual coordinates of each
-	// point after being rotated
+  // dx,dy should now hold the actual coordinates of each
+  // point after being rotated
 
-	// now we want to rotate them around the new center in the reverse direction
-	dx -= newcx;
-	dy -= newcy;
+  // now we want to rotate them around the new center in the reverse direction
+  dx -= newcx;
+  dy -= newcy;
 
-	r = Math.sqrt(dx * dx + dy * dy);
-	theta = Math.atan2(dy, dx) - angle;
+  r = Math.sqrt(dx * dx + dy * dy);
+  theta = Math.atan2(dy, dx) - angle;
 
-	return {'x': r * Math.cos(theta) + newcx,
-		'y': r * Math.sin(theta) + newcy};
+  return {'x': r * Math.cos(theta) + newcx,
+    'y': r * Math.sin(theta) + newcy};
 };
 
 // If the path was rotated, we must now pay the piper:
@@ -939,59 +939,59 @@ var getRotVals = function (x, y) {
 // TODO: This is still using ye olde transform methods, can probably
 // be optimized or even taken care of by recalculateDimensions
 svgedit.path.recalcRotatedPath = function () {
-	var currentPath = svgedit.path.path.elem;
-	angle = svgedit.utilities.getRotationAngle(currentPath, true);
-	if (!angle) { return; }
-	// selectedBBoxes[0] = svgedit.path.path.oldbbox;
-	var box = svgedit.utilities.getBBox(currentPath),
-		oldbox = svgedit.path.path.oldbbox; // selectedBBoxes[0],
-	oldcx = oldbox.x + oldbox.width / 2;
-	oldcy = oldbox.y + oldbox.height / 2;
-	newcx = box.x + box.width / 2;
-	newcy = box.y + box.height / 2;
+  var currentPath = svgedit.path.path.elem;
+  angle = svgedit.utilities.getRotationAngle(currentPath, true);
+  if (!angle) { return; }
+  // selectedBBoxes[0] = svgedit.path.path.oldbbox;
+  var box = svgedit.utilities.getBBox(currentPath),
+    oldbox = svgedit.path.path.oldbbox; // selectedBBoxes[0],
+  oldcx = oldbox.x + oldbox.width / 2;
+  oldcy = oldbox.y + oldbox.height / 2;
+  newcx = box.x + box.width / 2;
+  newcy = box.y + box.height / 2;
 
-	// un-rotate the new center to the proper position
-	var dx = newcx - oldcx,
-		dy = newcy - oldcy,
-		r = Math.sqrt(dx * dx + dy * dy),
-		theta = Math.atan2(dy, dx) + angle;
+  // un-rotate the new center to the proper position
+  var dx = newcx - oldcx,
+    dy = newcy - oldcy,
+    r = Math.sqrt(dx * dx + dy * dy),
+    theta = Math.atan2(dy, dx) + angle;
 
-	newcx = r * Math.cos(theta) + oldcx;
-	newcy = r * Math.sin(theta) + oldcy;
+  newcx = r * Math.cos(theta) + oldcx;
+  newcy = r * Math.sin(theta) + oldcy;
 
-	var list = currentPath.pathSegList,
-		i = list.numberOfItems;
-	while (i) {
-		i -= 1;
-		var seg = list.getItem(i),
-			type = seg.pathSegType;
-		if (type === 1) { continue; }
+  var list = currentPath.pathSegList,
+    i = list.numberOfItems;
+  while (i) {
+    i -= 1;
+    var seg = list.getItem(i),
+      type = seg.pathSegType;
+    if (type === 1) { continue; }
 
-		var rvals = getRotVals(seg.x, seg.y),
-			points = [rvals.x, rvals.y];
-		if (seg.x1 != null && seg.x2 != null) {
-			var cVals1 = getRotVals(seg.x1, seg.y1);
-			var cVals2 = getRotVals(seg.x2, seg.y2);
-			points.splice(points.length, 0, cVals1.x, cVals1.y, cVals2.x, cVals2.y);
-		}
-		svgedit.path.replacePathSeg(type, i, points);
-	} // loop for each point
+    var rvals = getRotVals(seg.x, seg.y),
+      points = [rvals.x, rvals.y];
+    if (seg.x1 != null && seg.x2 != null) {
+      var cVals1 = getRotVals(seg.x1, seg.y1);
+      var cVals2 = getRotVals(seg.x2, seg.y2);
+      points.splice(points.length, 0, cVals1.x, cVals1.y, cVals2.x, cVals2.y);
+    }
+    svgedit.path.replacePathSeg(type, i, points);
+  } // loop for each point
 
-	box = svgedit.utilities.getBBox(currentPath);
-	// selectedBBoxes[0].x = box.x; selectedBBoxes[0].y = box.y;
-	// selectedBBoxes[0].width = box.width; selectedBBoxes[0].height = box.height;
+  box = svgedit.utilities.getBBox(currentPath);
+  // selectedBBoxes[0].x = box.x; selectedBBoxes[0].y = box.y;
+  // selectedBBoxes[0].width = box.width; selectedBBoxes[0].height = box.height;
 
-	// now we must set the new transform to be rotated around the new center
-	var Rnc = svgroot.createSVGTransform(),
-		tlist = svgedit.transformlist.getTransformList(currentPath);
-	Rnc.setRotate((angle * 180.0 / Math.PI), newcx, newcy);
-	tlist.replaceItem(Rnc, 0);
+  // now we must set the new transform to be rotated around the new center
+  var Rnc = svgroot.createSVGTransform(),
+    tlist = svgedit.transformlist.getTransformList(currentPath);
+  Rnc.setRotate((angle * 180.0 / Math.PI), newcx, newcy);
+  tlist.replaceItem(Rnc, 0);
 };
 
 // ====================================
 // Public API starts here
 
 svgedit.path.clearData = function () {
-	pathData = {};
+  pathData = {};
 };
 }());
diff --git a/editor/pathseg.js b/editor/pathseg.js
index 648721d2..b267c973 100644
--- a/editor/pathseg.js
+++ b/editor/pathseg.js
@@ -9,361 +9,361 @@
 (function () {
 'use strict';
 if (!('SVGPathSeg' in window)) {
-	// Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSeg
-	window.SVGPathSeg = function (type, typeAsLetter, owningPathSegList) {
-		this.pathSegType = type;
-		this.pathSegTypeAsLetter = typeAsLetter;
-		this._owningPathSegList = owningPathSegList;
-	};
+  // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSeg
+  window.SVGPathSeg = function (type, typeAsLetter, owningPathSegList) {
+    this.pathSegType = type;
+    this.pathSegTypeAsLetter = typeAsLetter;
+    this._owningPathSegList = owningPathSegList;
+  };
 
-	window.SVGPathSeg.prototype.classname = 'SVGPathSeg';
+  window.SVGPathSeg.prototype.classname = 'SVGPathSeg';
 
-	window.SVGPathSeg.PATHSEG_UNKNOWN = 0;
-	window.SVGPathSeg.PATHSEG_CLOSEPATH = 1;
-	window.SVGPathSeg.PATHSEG_MOVETO_ABS = 2;
-	window.SVGPathSeg.PATHSEG_MOVETO_REL = 3;
-	window.SVGPathSeg.PATHSEG_LINETO_ABS = 4;
-	window.SVGPathSeg.PATHSEG_LINETO_REL = 5;
-	window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS = 6;
-	window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL = 7;
-	window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS = 8;
-	window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL = 9;
-	window.SVGPathSeg.PATHSEG_ARC_ABS = 10;
-	window.SVGPathSeg.PATHSEG_ARC_REL = 11;
-	window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS = 12;
-	window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL = 13;
-	window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS = 14;
-	window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL = 15;
-	window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS = 16;
-	window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL = 17;
-	window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS = 18;
-	window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL = 19;
+  window.SVGPathSeg.PATHSEG_UNKNOWN = 0;
+  window.SVGPathSeg.PATHSEG_CLOSEPATH = 1;
+  window.SVGPathSeg.PATHSEG_MOVETO_ABS = 2;
+  window.SVGPathSeg.PATHSEG_MOVETO_REL = 3;
+  window.SVGPathSeg.PATHSEG_LINETO_ABS = 4;
+  window.SVGPathSeg.PATHSEG_LINETO_REL = 5;
+  window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS = 6;
+  window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL = 7;
+  window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS = 8;
+  window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL = 9;
+  window.SVGPathSeg.PATHSEG_ARC_ABS = 10;
+  window.SVGPathSeg.PATHSEG_ARC_REL = 11;
+  window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS = 12;
+  window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL = 13;
+  window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS = 14;
+  window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL = 15;
+  window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS = 16;
+  window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL = 17;
+  window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS = 18;
+  window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL = 19;
 
-	// Notify owning PathSegList on any changes so they can be synchronized back to the path element.
-	window.SVGPathSeg.prototype._segmentChanged = function () {
-		if (this._owningPathSegList) {
-			this._owningPathSegList.segmentChanged(this);
-		}
-	};
+  // Notify owning PathSegList on any changes so they can be synchronized back to the path element.
+  window.SVGPathSeg.prototype._segmentChanged = function () {
+    if (this._owningPathSegList) {
+      this._owningPathSegList.segmentChanged(this);
+    }
+  };
 
-	window.SVGPathSegClosePath = function (owningPathSegList) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CLOSEPATH, 'z', owningPathSegList);
-	};
-	window.SVGPathSegClosePath.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegClosePath.prototype.toString = function () { return '[object SVGPathSegClosePath]'; };
-	window.SVGPathSegClosePath.prototype._asPathString = function () { return this.pathSegTypeAsLetter; };
-	window.SVGPathSegClosePath.prototype.clone = function () { return new window.SVGPathSegClosePath(undefined); };
+  window.SVGPathSegClosePath = function (owningPathSegList) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CLOSEPATH, 'z', owningPathSegList);
+  };
+  window.SVGPathSegClosePath.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegClosePath.prototype.toString = function () { return '[object SVGPathSegClosePath]'; };
+  window.SVGPathSegClosePath.prototype._asPathString = function () { return this.pathSegTypeAsLetter; };
+  window.SVGPathSegClosePath.prototype.clone = function () { return new window.SVGPathSegClosePath(undefined); };
 
-	window.SVGPathSegMovetoAbs = function (owningPathSegList, x, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_ABS, 'M', owningPathSegList);
-		this._x = x;
-		this._y = y;
-	};
-	window.SVGPathSegMovetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegMovetoAbs.prototype.toString = function () { return '[object SVGPathSegMovetoAbs]'; };
-	window.SVGPathSegMovetoAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegMovetoAbs.prototype.clone = function () { return new window.SVGPathSegMovetoAbs(undefined, this._x, this._y); };
-	Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegMovetoAbs = function (owningPathSegList, x, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_ABS, 'M', owningPathSegList);
+    this._x = x;
+    this._y = y;
+  };
+  window.SVGPathSegMovetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegMovetoAbs.prototype.toString = function () { return '[object SVGPathSegMovetoAbs]'; };
+  window.SVGPathSegMovetoAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegMovetoAbs.prototype.clone = function () { return new window.SVGPathSegMovetoAbs(undefined, this._x, this._y); };
+  Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegMovetoRel = function (owningPathSegList, x, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_REL, 'm', owningPathSegList);
-		this._x = x;
-		this._y = y;
-	};
-	window.SVGPathSegMovetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegMovetoRel.prototype.toString = function () { return '[object SVGPathSegMovetoRel]'; };
-	window.SVGPathSegMovetoRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegMovetoRel.prototype.clone = function () { return new window.SVGPathSegMovetoRel(undefined, this._x, this._y); };
-	Object.defineProperty(window.SVGPathSegMovetoRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegMovetoRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegMovetoRel = function (owningPathSegList, x, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_REL, 'm', owningPathSegList);
+    this._x = x;
+    this._y = y;
+  };
+  window.SVGPathSegMovetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegMovetoRel.prototype.toString = function () { return '[object SVGPathSegMovetoRel]'; };
+  window.SVGPathSegMovetoRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegMovetoRel.prototype.clone = function () { return new window.SVGPathSegMovetoRel(undefined, this._x, this._y); };
+  Object.defineProperty(window.SVGPathSegMovetoRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegMovetoRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegLinetoAbs = function (owningPathSegList, x, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_ABS, 'L', owningPathSegList);
-		this._x = x;
-		this._y = y;
-	};
-	window.SVGPathSegLinetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegLinetoAbs.prototype.toString = function () { return '[object SVGPathSegLinetoAbs]'; };
-	window.SVGPathSegLinetoAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegLinetoAbs.prototype.clone = function () { return new window.SVGPathSegLinetoAbs(undefined, this._x, this._y); };
-	Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegLinetoAbs = function (owningPathSegList, x, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_ABS, 'L', owningPathSegList);
+    this._x = x;
+    this._y = y;
+  };
+  window.SVGPathSegLinetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegLinetoAbs.prototype.toString = function () { return '[object SVGPathSegLinetoAbs]'; };
+  window.SVGPathSegLinetoAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegLinetoAbs.prototype.clone = function () { return new window.SVGPathSegLinetoAbs(undefined, this._x, this._y); };
+  Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegLinetoRel = function (owningPathSegList, x, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_REL, 'l', owningPathSegList);
-		this._x = x;
-		this._y = y;
-	};
-	window.SVGPathSegLinetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegLinetoRel.prototype.toString = function () { return '[object SVGPathSegLinetoRel]'; };
-	window.SVGPathSegLinetoRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegLinetoRel.prototype.clone = function () { return new window.SVGPathSegLinetoRel(undefined, this._x, this._y); };
-	Object.defineProperty(window.SVGPathSegLinetoRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegLinetoRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegLinetoRel = function (owningPathSegList, x, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_REL, 'l', owningPathSegList);
+    this._x = x;
+    this._y = y;
+  };
+  window.SVGPathSegLinetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegLinetoRel.prototype.toString = function () { return '[object SVGPathSegLinetoRel]'; };
+  window.SVGPathSegLinetoRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegLinetoRel.prototype.clone = function () { return new window.SVGPathSegLinetoRel(undefined, this._x, this._y); };
+  Object.defineProperty(window.SVGPathSegLinetoRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegLinetoRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoCubicAbs = function (owningPathSegList, x, y, x1, y1, x2, y2) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS, 'C', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._x1 = x1;
-		this._y1 = y1;
-		this._x2 = x2;
-		this._y2 = y2;
-	};
-	window.SVGPathSegCurvetoCubicAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoCubicAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicAbs]'; };
-	window.SVGPathSegCurvetoCubicAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoCubicAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicAbs(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2); };
-	Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoCubicAbs = function (owningPathSegList, x, y, x1, y1, x2, y2) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS, 'C', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._x1 = x1;
+    this._y1 = y1;
+    this._x2 = x2;
+    this._y2 = y2;
+  };
+  window.SVGPathSegCurvetoCubicAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoCubicAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicAbs]'; };
+  window.SVGPathSegCurvetoCubicAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoCubicAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicAbs(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2); };
+  Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoCubicRel = function (owningPathSegList, x, y, x1, y1, x2, y2) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, 'c', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._x1 = x1;
-		this._y1 = y1;
-		this._x2 = x2;
-		this._y2 = y2;
-	};
-	window.SVGPathSegCurvetoCubicRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoCubicRel.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicRel]'; };
-	window.SVGPathSegCurvetoCubicRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoCubicRel.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicRel(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2); };
-	Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoCubicRel = function (owningPathSegList, x, y, x1, y1, x2, y2) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, 'c', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._x1 = x1;
+    this._y1 = y1;
+    this._x2 = x2;
+    this._y2 = y2;
+  };
+  window.SVGPathSegCurvetoCubicRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoCubicRel.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicRel]'; };
+  window.SVGPathSegCurvetoCubicRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoCubicRel.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicRel(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2); };
+  Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoQuadraticAbs = function (owningPathSegList, x, y, x1, y1) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS, 'Q', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._x1 = x1;
-		this._y1 = y1;
-	};
-	window.SVGPathSegCurvetoQuadraticAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoQuadraticAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticAbs]'; };
-	window.SVGPathSegCurvetoQuadraticAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoQuadraticAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticAbs(undefined, this._x, this._y, this._x1, this._y1); };
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoQuadraticAbs = function (owningPathSegList, x, y, x1, y1) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS, 'Q', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._x1 = x1;
+    this._y1 = y1;
+  };
+  window.SVGPathSegCurvetoQuadraticAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoQuadraticAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticAbs]'; };
+  window.SVGPathSegCurvetoQuadraticAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoQuadraticAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticAbs(undefined, this._x, this._y, this._x1, this._y1); };
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoQuadraticRel = function (owningPathSegList, x, y, x1, y1) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL, 'q', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._x1 = x1;
-		this._y1 = y1;
-	};
-	window.SVGPathSegCurvetoQuadraticRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoQuadraticRel.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticRel]'; };
-	window.SVGPathSegCurvetoQuadraticRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoQuadraticRel.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticRel(undefined, this._x, this._y, this._x1, this._y1); };
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoQuadraticRel = function (owningPathSegList, x, y, x1, y1) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL, 'q', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._x1 = x1;
+    this._y1 = y1;
+  };
+  window.SVGPathSegCurvetoQuadraticRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoQuadraticRel.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticRel]'; };
+  window.SVGPathSegCurvetoQuadraticRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x1 + ' ' + this._y1 + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoQuadraticRel.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticRel(undefined, this._x, this._y, this._x1, this._y1); };
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'x1', { get: function () { return this._x1; }, set: function (x1) { this._x1 = x1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, 'y1', { get: function () { return this._y1; }, set: function (y1) { this._y1 = y1; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegArcAbs = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_ABS, 'A', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._r1 = r1;
-		this._r2 = r2;
-		this._angle = angle;
-		this._largeArcFlag = largeArcFlag;
-		this._sweepFlag = sweepFlag;
-	};
-	window.SVGPathSegArcAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegArcAbs.prototype.toString = function () { return '[object SVGPathSegArcAbs]'; };
-	window.SVGPathSegArcAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegArcAbs.prototype.clone = function () { return new window.SVGPathSegArcAbs(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag); };
-	Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'r1', { get: function () { return this._r1; }, set: function (r1) { this._r1 = r1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'r2', { get: function () { return this._r2; }, set: function (r2) { this._r2 = r2; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'angle', { get: function () { return this._angle; }, set: function (angle) { this._angle = angle; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'largeArcFlag', { get: function () { return this._largeArcFlag; }, set: function (largeArcFlag) { this._largeArcFlag = largeArcFlag; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'sweepFlag', { get: function () { return this._sweepFlag; }, set: function (sweepFlag) { this._sweepFlag = sweepFlag; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegArcAbs = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_ABS, 'A', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._r1 = r1;
+    this._r2 = r2;
+    this._angle = angle;
+    this._largeArcFlag = largeArcFlag;
+    this._sweepFlag = sweepFlag;
+  };
+  window.SVGPathSegArcAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegArcAbs.prototype.toString = function () { return '[object SVGPathSegArcAbs]'; };
+  window.SVGPathSegArcAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegArcAbs.prototype.clone = function () { return new window.SVGPathSegArcAbs(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag); };
+  Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'r1', { get: function () { return this._r1; }, set: function (r1) { this._r1 = r1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'r2', { get: function () { return this._r2; }, set: function (r2) { this._r2 = r2; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'angle', { get: function () { return this._angle; }, set: function (angle) { this._angle = angle; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'largeArcFlag', { get: function () { return this._largeArcFlag; }, set: function (largeArcFlag) { this._largeArcFlag = largeArcFlag; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcAbs.prototype, 'sweepFlag', { get: function () { return this._sweepFlag; }, set: function (sweepFlag) { this._sweepFlag = sweepFlag; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegArcRel = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_REL, 'a', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._r1 = r1;
-		this._r2 = r2;
-		this._angle = angle;
-		this._largeArcFlag = largeArcFlag;
-		this._sweepFlag = sweepFlag;
-	};
-	window.SVGPathSegArcRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegArcRel.prototype.toString = function () { return '[object SVGPathSegArcRel]'; };
-	window.SVGPathSegArcRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegArcRel.prototype.clone = function () { return new window.SVGPathSegArcRel(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag); };
-	Object.defineProperty(window.SVGPathSegArcRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcRel.prototype, 'r1', { get: function () { return this._r1; }, set: function (r1) { this._r1 = r1; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcRel.prototype, 'r2', { get: function () { return this._r2; }, set: function (r2) { this._r2 = r2; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcRel.prototype, 'angle', { get: function () { return this._angle; }, set: function (angle) { this._angle = angle; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcRel.prototype, 'largeArcFlag', { get: function () { return this._largeArcFlag; }, set: function (largeArcFlag) { this._largeArcFlag = largeArcFlag; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegArcRel.prototype, 'sweepFlag', { get: function () { return this._sweepFlag; }, set: function (sweepFlag) { this._sweepFlag = sweepFlag; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegArcRel = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_REL, 'a', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._r1 = r1;
+    this._r2 = r2;
+    this._angle = angle;
+    this._largeArcFlag = largeArcFlag;
+    this._sweepFlag = sweepFlag;
+  };
+  window.SVGPathSegArcRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegArcRel.prototype.toString = function () { return '[object SVGPathSegArcRel]'; };
+  window.SVGPathSegArcRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._r1 + ' ' + this._r2 + ' ' + this._angle + ' ' + (this._largeArcFlag ? '1' : '0') + ' ' + (this._sweepFlag ? '1' : '0') + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegArcRel.prototype.clone = function () { return new window.SVGPathSegArcRel(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag); };
+  Object.defineProperty(window.SVGPathSegArcRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcRel.prototype, 'r1', { get: function () { return this._r1; }, set: function (r1) { this._r1 = r1; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcRel.prototype, 'r2', { get: function () { return this._r2; }, set: function (r2) { this._r2 = r2; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcRel.prototype, 'angle', { get: function () { return this._angle; }, set: function (angle) { this._angle = angle; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcRel.prototype, 'largeArcFlag', { get: function () { return this._largeArcFlag; }, set: function (largeArcFlag) { this._largeArcFlag = largeArcFlag; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegArcRel.prototype, 'sweepFlag', { get: function () { return this._sweepFlag; }, set: function (sweepFlag) { this._sweepFlag = sweepFlag; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegLinetoHorizontalAbs = function (owningPathSegList, x) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS, 'H', owningPathSegList);
-		this._x = x;
-	};
-	window.SVGPathSegLinetoHorizontalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegLinetoHorizontalAbs.prototype.toString = function () { return '[object SVGPathSegLinetoHorizontalAbs]'; };
-	window.SVGPathSegLinetoHorizontalAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x; };
-	window.SVGPathSegLinetoHorizontalAbs.prototype.clone = function () { return new window.SVGPathSegLinetoHorizontalAbs(undefined, this._x); };
-	Object.defineProperty(window.SVGPathSegLinetoHorizontalAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegLinetoHorizontalAbs = function (owningPathSegList, x) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS, 'H', owningPathSegList);
+    this._x = x;
+  };
+  window.SVGPathSegLinetoHorizontalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegLinetoHorizontalAbs.prototype.toString = function () { return '[object SVGPathSegLinetoHorizontalAbs]'; };
+  window.SVGPathSegLinetoHorizontalAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x; };
+  window.SVGPathSegLinetoHorizontalAbs.prototype.clone = function () { return new window.SVGPathSegLinetoHorizontalAbs(undefined, this._x); };
+  Object.defineProperty(window.SVGPathSegLinetoHorizontalAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegLinetoHorizontalRel = function (owningPathSegList, x) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL, 'h', owningPathSegList);
-		this._x = x;
-	};
-	window.SVGPathSegLinetoHorizontalRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegLinetoHorizontalRel.prototype.toString = function () { return '[object SVGPathSegLinetoHorizontalRel]'; };
-	window.SVGPathSegLinetoHorizontalRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x; };
-	window.SVGPathSegLinetoHorizontalRel.prototype.clone = function () { return new window.SVGPathSegLinetoHorizontalRel(undefined, this._x); };
-	Object.defineProperty(window.SVGPathSegLinetoHorizontalRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegLinetoHorizontalRel = function (owningPathSegList, x) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL, 'h', owningPathSegList);
+    this._x = x;
+  };
+  window.SVGPathSegLinetoHorizontalRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegLinetoHorizontalRel.prototype.toString = function () { return '[object SVGPathSegLinetoHorizontalRel]'; };
+  window.SVGPathSegLinetoHorizontalRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x; };
+  window.SVGPathSegLinetoHorizontalRel.prototype.clone = function () { return new window.SVGPathSegLinetoHorizontalRel(undefined, this._x); };
+  Object.defineProperty(window.SVGPathSegLinetoHorizontalRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegLinetoVerticalAbs = function (owningPathSegList, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS, 'V', owningPathSegList);
-		this._y = y;
-	};
-	window.SVGPathSegLinetoVerticalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegLinetoVerticalAbs.prototype.toString = function () { return '[object SVGPathSegLinetoVerticalAbs]'; };
-	window.SVGPathSegLinetoVerticalAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._y; };
-	window.SVGPathSegLinetoVerticalAbs.prototype.clone = function () { return new window.SVGPathSegLinetoVerticalAbs(undefined, this._y); };
-	Object.defineProperty(window.SVGPathSegLinetoVerticalAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegLinetoVerticalAbs = function (owningPathSegList, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS, 'V', owningPathSegList);
+    this._y = y;
+  };
+  window.SVGPathSegLinetoVerticalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegLinetoVerticalAbs.prototype.toString = function () { return '[object SVGPathSegLinetoVerticalAbs]'; };
+  window.SVGPathSegLinetoVerticalAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._y; };
+  window.SVGPathSegLinetoVerticalAbs.prototype.clone = function () { return new window.SVGPathSegLinetoVerticalAbs(undefined, this._y); };
+  Object.defineProperty(window.SVGPathSegLinetoVerticalAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegLinetoVerticalRel = function (owningPathSegList, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL, 'v', owningPathSegList);
-		this._y = y;
-	};
-	window.SVGPathSegLinetoVerticalRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegLinetoVerticalRel.prototype.toString = function () { return '[object SVGPathSegLinetoVerticalRel]'; };
-	window.SVGPathSegLinetoVerticalRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._y; };
-	window.SVGPathSegLinetoVerticalRel.prototype.clone = function () { return new window.SVGPathSegLinetoVerticalRel(undefined, this._y); };
-	Object.defineProperty(window.SVGPathSegLinetoVerticalRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegLinetoVerticalRel = function (owningPathSegList, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL, 'v', owningPathSegList);
+    this._y = y;
+  };
+  window.SVGPathSegLinetoVerticalRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegLinetoVerticalRel.prototype.toString = function () { return '[object SVGPathSegLinetoVerticalRel]'; };
+  window.SVGPathSegLinetoVerticalRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._y; };
+  window.SVGPathSegLinetoVerticalRel.prototype.clone = function () { return new window.SVGPathSegLinetoVerticalRel(undefined, this._y); };
+  Object.defineProperty(window.SVGPathSegLinetoVerticalRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoCubicSmoothAbs = function (owningPathSegList, x, y, x2, y2) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS, 'S', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._x2 = x2;
-		this._y2 = y2;
-	};
-	window.SVGPathSegCurvetoCubicSmoothAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoCubicSmoothAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicSmoothAbs]'; };
-	window.SVGPathSegCurvetoCubicSmoothAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoCubicSmoothAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicSmoothAbs(undefined, this._x, this._y, this._x2, this._y2); };
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoCubicSmoothAbs = function (owningPathSegList, x, y, x2, y2) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS, 'S', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._x2 = x2;
+    this._y2 = y2;
+  };
+  window.SVGPathSegCurvetoCubicSmoothAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoCubicSmoothAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicSmoothAbs]'; };
+  window.SVGPathSegCurvetoCubicSmoothAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoCubicSmoothAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicSmoothAbs(undefined, this._x, this._y, this._x2, this._y2); };
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoCubicSmoothRel = function (owningPathSegList, x, y, x2, y2) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL, 's', owningPathSegList);
-		this._x = x;
-		this._y = y;
-		this._x2 = x2;
-		this._y2 = y2;
-	};
-	window.SVGPathSegCurvetoCubicSmoothRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoCubicSmoothRel.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicSmoothRel]'; };
-	window.SVGPathSegCurvetoCubicSmoothRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoCubicSmoothRel.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicSmoothRel(undefined, this._x, this._y, this._x2, this._y2); };
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoCubicSmoothRel = function (owningPathSegList, x, y, x2, y2) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL, 's', owningPathSegList);
+    this._x = x;
+    this._y = y;
+    this._x2 = x2;
+    this._y2 = y2;
+  };
+  window.SVGPathSegCurvetoCubicSmoothRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoCubicSmoothRel.prototype.toString = function () { return '[object SVGPathSegCurvetoCubicSmoothRel]'; };
+  window.SVGPathSegCurvetoCubicSmoothRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x2 + ' ' + this._y2 + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoCubicSmoothRel.prototype.clone = function () { return new window.SVGPathSegCurvetoCubicSmoothRel(undefined, this._x, this._y, this._x2, this._y2); };
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'x2', { get: function () { return this._x2; }, set: function (x2) { this._x2 = x2; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, 'y2', { get: function () { return this._y2; }, set: function (y2) { this._y2 = y2; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoQuadraticSmoothAbs = function (owningPathSegList, x, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS, 'T', owningPathSegList);
-		this._x = x;
-		this._y = y;
-	};
-	window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticSmoothAbs]'; };
-	window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticSmoothAbs(undefined, this._x, this._y); };
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoQuadraticSmoothAbs = function (owningPathSegList, x, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS, 'T', owningPathSegList);
+    this._x = x;
+    this._y = y;
+  };
+  window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticSmoothAbs]'; };
+  window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticSmoothAbs(undefined, this._x, this._y); };
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	window.SVGPathSegCurvetoQuadraticSmoothRel = function (owningPathSegList, x, y) {
-		window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL, 't', owningPathSegList);
-		this._x = x;
-		this._y = y;
-	};
-	window.SVGPathSegCurvetoQuadraticSmoothRel.prototype = Object.create(window.SVGPathSeg.prototype);
-	window.SVGPathSegCurvetoQuadraticSmoothRel.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticSmoothRel]'; };
-	window.SVGPathSegCurvetoQuadraticSmoothRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
-	window.SVGPathSegCurvetoQuadraticSmoothRel.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticSmoothRel(undefined, this._x, this._y); };
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
-	Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
+  window.SVGPathSegCurvetoQuadraticSmoothRel = function (owningPathSegList, x, y) {
+    window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL, 't', owningPathSegList);
+    this._x = x;
+    this._y = y;
+  };
+  window.SVGPathSegCurvetoQuadraticSmoothRel.prototype = Object.create(window.SVGPathSeg.prototype);
+  window.SVGPathSegCurvetoQuadraticSmoothRel.prototype.toString = function () { return '[object SVGPathSegCurvetoQuadraticSmoothRel]'; };
+  window.SVGPathSegCurvetoQuadraticSmoothRel.prototype._asPathString = function () { return this.pathSegTypeAsLetter + ' ' + this._x + ' ' + this._y; };
+  window.SVGPathSegCurvetoQuadraticSmoothRel.prototype.clone = function () { return new window.SVGPathSegCurvetoQuadraticSmoothRel(undefined, this._x, this._y); };
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothRel.prototype, 'x', { get: function () { return this._x; }, set: function (x) { this._x = x; this._segmentChanged(); }, enumerable: true });
+  Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothRel.prototype, 'y', { get: function () { return this._y; }, set: function (y) { this._y = y; this._segmentChanged(); }, enumerable: true });
 
-	// Add createSVGPathSeg* functions to window.SVGPathElement.
-	// Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-Interfacewindow.SVGPathElement.
-	window.SVGPathElement.prototype.createSVGPathSegClosePath = function () { return new window.SVGPathSegClosePath(undefined); };
-	window.SVGPathElement.prototype.createSVGPathSegMovetoAbs = function (x, y) { return new window.SVGPathSegMovetoAbs(undefined, x, y); };
-	window.SVGPathElement.prototype.createSVGPathSegMovetoRel = function (x, y) { return new window.SVGPathSegMovetoRel(undefined, x, y); };
-	window.SVGPathElement.prototype.createSVGPathSegLinetoAbs = function (x, y) { return new window.SVGPathSegLinetoAbs(undefined, x, y); };
-	window.SVGPathElement.prototype.createSVGPathSegLinetoRel = function (x, y) { return new window.SVGPathSegLinetoRel(undefined, x, y); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicAbs = function (x, y, x1, y1, x2, y2) { return new window.SVGPathSegCurvetoCubicAbs(undefined, x, y, x1, y1, x2, y2); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicRel = function (x, y, x1, y1, x2, y2) { return new window.SVGPathSegCurvetoCubicRel(undefined, x, y, x1, y1, x2, y2); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticAbs = function (x, y, x1, y1) { return new window.SVGPathSegCurvetoQuadraticAbs(undefined, x, y, x1, y1); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticRel = function (x, y, x1, y1) { return new window.SVGPathSegCurvetoQuadraticRel(undefined, x, y, x1, y1); };
-	window.SVGPathElement.prototype.createSVGPathSegArcAbs = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) { return new window.SVGPathSegArcAbs(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag); };
-	window.SVGPathElement.prototype.createSVGPathSegArcRel = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) { return new window.SVGPathSegArcRel(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag); };
-	window.SVGPathElement.prototype.createSVGPathSegLinetoHorizontalAbs = function (x) { return new window.SVGPathSegLinetoHorizontalAbs(undefined, x); };
-	window.SVGPathElement.prototype.createSVGPathSegLinetoHorizontalRel = function (x) { return new window.SVGPathSegLinetoHorizontalRel(undefined, x); };
-	window.SVGPathElement.prototype.createSVGPathSegLinetoVerticalAbs = function (y) { return new window.SVGPathSegLinetoVerticalAbs(undefined, y); };
-	window.SVGPathElement.prototype.createSVGPathSegLinetoVerticalRel = function (y) { return new window.SVGPathSegLinetoVerticalRel(undefined, y); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothAbs = function (x, y, x2, y2) { return new window.SVGPathSegCurvetoCubicSmoothAbs(undefined, x, y, x2, y2); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothRel = function (x, y, x2, y2) { return new window.SVGPathSegCurvetoCubicSmoothRel(undefined, x, y, x2, y2); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothAbs = function (x, y) { return new window.SVGPathSegCurvetoQuadraticSmoothAbs(undefined, x, y); };
-	window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothRel = function (x, y) { return new window.SVGPathSegCurvetoQuadraticSmoothRel(undefined, x, y); };
+  // Add createSVGPathSeg* functions to window.SVGPathElement.
+  // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-Interfacewindow.SVGPathElement.
+  window.SVGPathElement.prototype.createSVGPathSegClosePath = function () { return new window.SVGPathSegClosePath(undefined); };
+  window.SVGPathElement.prototype.createSVGPathSegMovetoAbs = function (x, y) { return new window.SVGPathSegMovetoAbs(undefined, x, y); };
+  window.SVGPathElement.prototype.createSVGPathSegMovetoRel = function (x, y) { return new window.SVGPathSegMovetoRel(undefined, x, y); };
+  window.SVGPathElement.prototype.createSVGPathSegLinetoAbs = function (x, y) { return new window.SVGPathSegLinetoAbs(undefined, x, y); };
+  window.SVGPathElement.prototype.createSVGPathSegLinetoRel = function (x, y) { return new window.SVGPathSegLinetoRel(undefined, x, y); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicAbs = function (x, y, x1, y1, x2, y2) { return new window.SVGPathSegCurvetoCubicAbs(undefined, x, y, x1, y1, x2, y2); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicRel = function (x, y, x1, y1, x2, y2) { return new window.SVGPathSegCurvetoCubicRel(undefined, x, y, x1, y1, x2, y2); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticAbs = function (x, y, x1, y1) { return new window.SVGPathSegCurvetoQuadraticAbs(undefined, x, y, x1, y1); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticRel = function (x, y, x1, y1) { return new window.SVGPathSegCurvetoQuadraticRel(undefined, x, y, x1, y1); };
+  window.SVGPathElement.prototype.createSVGPathSegArcAbs = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) { return new window.SVGPathSegArcAbs(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag); };
+  window.SVGPathElement.prototype.createSVGPathSegArcRel = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) { return new window.SVGPathSegArcRel(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag); };
+  window.SVGPathElement.prototype.createSVGPathSegLinetoHorizontalAbs = function (x) { return new window.SVGPathSegLinetoHorizontalAbs(undefined, x); };
+  window.SVGPathElement.prototype.createSVGPathSegLinetoHorizontalRel = function (x) { return new window.SVGPathSegLinetoHorizontalRel(undefined, x); };
+  window.SVGPathElement.prototype.createSVGPathSegLinetoVerticalAbs = function (y) { return new window.SVGPathSegLinetoVerticalAbs(undefined, y); };
+  window.SVGPathElement.prototype.createSVGPathSegLinetoVerticalRel = function (y) { return new window.SVGPathSegLinetoVerticalRel(undefined, y); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothAbs = function (x, y, x2, y2) { return new window.SVGPathSegCurvetoCubicSmoothAbs(undefined, x, y, x2, y2); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothRel = function (x, y, x2, y2) { return new window.SVGPathSegCurvetoCubicSmoothRel(undefined, x, y, x2, y2); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothAbs = function (x, y) { return new window.SVGPathSegCurvetoQuadraticSmoothAbs(undefined, x, y); };
+  window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothRel = function (x, y) { return new window.SVGPathSegCurvetoQuadraticSmoothRel(undefined, x, y); };
 
-	if (!('getPathSegAtLength' in window.SVGPathElement.prototype)) {
-		// Add getPathSegAtLength to SVGPathElement.
-		// Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-__svg__SVGPathElement__getPathSegAtLength
-		// This polyfill requires SVGPathElement.getTotalLength to implement the distance-along-a-path algorithm.
-		window.SVGPathElement.prototype.getPathSegAtLength = function (distance) {
-			if (distance === undefined || !isFinite(distance)) {
-				throw new Error('Invalid arguments.');
-			}
+  if (!('getPathSegAtLength' in window.SVGPathElement.prototype)) {
+    // Add getPathSegAtLength to SVGPathElement.
+    // Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-__svg__SVGPathElement__getPathSegAtLength
+    // This polyfill requires SVGPathElement.getTotalLength to implement the distance-along-a-path algorithm.
+    window.SVGPathElement.prototype.getPathSegAtLength = function (distance) {
+      if (distance === undefined || !isFinite(distance)) {
+        throw new Error('Invalid arguments.');
+      }
 
-			var measurementElement = document.createElementNS('http://www.w3.org/2000/svg', 'path');
-			measurementElement.setAttribute('d', this.getAttribute('d'));
-			var lastPathSegment = measurementElement.pathSegList.numberOfItems - 1;
+      var measurementElement = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+      measurementElement.setAttribute('d', this.getAttribute('d'));
+      var lastPathSegment = measurementElement.pathSegList.numberOfItems - 1;
 
-			// If the path is empty, return 0.
-			if (lastPathSegment <= 0) {
-				return 0;
-			}
+      // If the path is empty, return 0.
+      if (lastPathSegment <= 0) {
+        return 0;
+      }
 
-			do {
-				measurementElement.pathSegList.removeItem(lastPathSegment);
-				if (distance > measurementElement.getTotalLength()) {
-					break;
-				}
-				lastPathSegment--;
-			} while (lastPathSegment > 0);
-			return lastPathSegment;
-		};
-	}
+      do {
+        measurementElement.pathSegList.removeItem(lastPathSegment);
+        if (distance > measurementElement.getTotalLength()) {
+          break;
+        }
+        lastPathSegment--;
+      } while (lastPathSegment > 0);
+      return lastPathSegment;
+    };
+  }
 }
 
 // Checking for SVGPathSegList in window checks for the case of an implementation without the
@@ -372,508 +372,508 @@ if (!('SVGPathSeg' in window)) {
 // SVGPathSegList API (e.g., appendItem). In this case we need to re-implement the entire API
 // so the polyfill data (i.e., _list) is used throughout.
 if (!('SVGPathSegList' in window) || !('appendItem' in window.SVGPathSegList.prototype)) {
-	// Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSegList
-	window.SVGPathSegList = function (pathElement) {
-		this._pathElement = pathElement;
-		this._list = this._parsePath(this._pathElement.getAttribute('d'));
+  // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSegList
+  window.SVGPathSegList = function (pathElement) {
+    this._pathElement = pathElement;
+    this._list = this._parsePath(this._pathElement.getAttribute('d'));
 
-		// Use a MutationObserver to catch changes to the path's "d" attribute.
-		this._mutationObserverConfig = { 'attributes': true, 'attributeFilter': ['d'] };
-		this._pathElementMutationObserver = new MutationObserver(this._updateListFromPathMutations.bind(this));
-		this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
-	};
+    // Use a MutationObserver to catch changes to the path's "d" attribute.
+    this._mutationObserverConfig = { 'attributes': true, 'attributeFilter': ['d'] };
+    this._pathElementMutationObserver = new MutationObserver(this._updateListFromPathMutations.bind(this));
+    this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
+  };
 
-	window.SVGPathSegList.prototype.classname = 'SVGPathSegList';
+  window.SVGPathSegList.prototype.classname = 'SVGPathSegList';
 
-	Object.defineProperty(window.SVGPathSegList.prototype, 'numberOfItems', {
-		get: function () {
-			this._checkPathSynchronizedToList();
-			return this._list.length;
-		},
-		enumerable: true
-	});
+  Object.defineProperty(window.SVGPathSegList.prototype, 'numberOfItems', {
+    get: function () {
+      this._checkPathSynchronizedToList();
+      return this._list.length;
+    },
+    enumerable: true
+  });
 
-	// Add the pathSegList accessors to window.SVGPathElement.
-	// Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGAnimatedPathData
-	Object.defineProperty(window.SVGPathElement.prototype, 'pathSegList', {
-		get: function () {
-			if (!this._pathSegList) {
-				this._pathSegList = new window.SVGPathSegList(this);
-			}
-			return this._pathSegList;
-		},
-		enumerable: true
-	});
-	// FIXME: The following are not implemented and simply return window.SVGPathElement.pathSegList.
-	Object.defineProperty(window.SVGPathElement.prototype, 'normalizedPathSegList', { get: function () { return this.pathSegList; }, enumerable: true });
-	Object.defineProperty(window.SVGPathElement.prototype, 'animatedPathSegList', { get: function () { return this.pathSegList; }, enumerable: true });
-	Object.defineProperty(window.SVGPathElement.prototype, 'animatedNormalizedPathSegList', { get: function () { return this.pathSegList; }, enumerable: true });
+  // Add the pathSegList accessors to window.SVGPathElement.
+  // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGAnimatedPathData
+  Object.defineProperty(window.SVGPathElement.prototype, 'pathSegList', {
+    get: function () {
+      if (!this._pathSegList) {
+        this._pathSegList = new window.SVGPathSegList(this);
+      }
+      return this._pathSegList;
+    },
+    enumerable: true
+  });
+  // FIXME: The following are not implemented and simply return window.SVGPathElement.pathSegList.
+  Object.defineProperty(window.SVGPathElement.prototype, 'normalizedPathSegList', { get: function () { return this.pathSegList; }, enumerable: true });
+  Object.defineProperty(window.SVGPathElement.prototype, 'animatedPathSegList', { get: function () { return this.pathSegList; }, enumerable: true });
+  Object.defineProperty(window.SVGPathElement.prototype, 'animatedNormalizedPathSegList', { get: function () { return this.pathSegList; }, enumerable: true });
 
-	// Process any pending mutations to the path element and update the list as needed.
-	// This should be the first call of all public functions and is needed because
-	// MutationObservers are not synchronous so we can have pending asynchronous mutations.
-	window.SVGPathSegList.prototype._checkPathSynchronizedToList = function () {
-		this._updateListFromPathMutations(this._pathElementMutationObserver.takeRecords());
-	};
+  // Process any pending mutations to the path element and update the list as needed.
+  // This should be the first call of all public functions and is needed because
+  // MutationObservers are not synchronous so we can have pending asynchronous mutations.
+  window.SVGPathSegList.prototype._checkPathSynchronizedToList = function () {
+    this._updateListFromPathMutations(this._pathElementMutationObserver.takeRecords());
+  };
 
-	window.SVGPathSegList.prototype._updateListFromPathMutations = function (mutationRecords) {
-		if (!this._pathElement) {
-			return;
-		}
-		var hasPathMutations = false;
-		mutationRecords.forEach(function (record) {
-			if (record.attributeName === 'd') {
-				hasPathMutations = true;
-			}
-		});
-		if (hasPathMutations) {
-			this._list = this._parsePath(this._pathElement.getAttribute('d'));
-		}
-	};
+  window.SVGPathSegList.prototype._updateListFromPathMutations = function (mutationRecords) {
+    if (!this._pathElement) {
+      return;
+    }
+    var hasPathMutations = false;
+    mutationRecords.forEach(function (record) {
+      if (record.attributeName === 'd') {
+        hasPathMutations = true;
+      }
+    });
+    if (hasPathMutations) {
+      this._list = this._parsePath(this._pathElement.getAttribute('d'));
+    }
+  };
 
-	// Serialize the list and update the path's 'd' attribute.
-	window.SVGPathSegList.prototype._writeListToPath = function () {
-		this._pathElementMutationObserver.disconnect();
-		this._pathElement.setAttribute('d', window.SVGPathSegList._pathSegArrayAsString(this._list));
-		this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
-	};
+  // Serialize the list and update the path's 'd' attribute.
+  window.SVGPathSegList.prototype._writeListToPath = function () {
+    this._pathElementMutationObserver.disconnect();
+    this._pathElement.setAttribute('d', window.SVGPathSegList._pathSegArrayAsString(this._list));
+    this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
+  };
 
-	// When a path segment changes the list needs to be synchronized back to the path element.
-	window.SVGPathSegList.prototype.segmentChanged = function (pathSeg) {
-		this._writeListToPath();
-	};
+  // When a path segment changes the list needs to be synchronized back to the path element.
+  window.SVGPathSegList.prototype.segmentChanged = function (pathSeg) {
+    this._writeListToPath();
+  };
 
-	window.SVGPathSegList.prototype.clear = function () {
-		this._checkPathSynchronizedToList();
+  window.SVGPathSegList.prototype.clear = function () {
+    this._checkPathSynchronizedToList();
 
-		this._list.forEach(function (pathSeg) {
-			pathSeg._owningPathSegList = null;
-		});
-		this._list = [];
-		this._writeListToPath();
-	};
+    this._list.forEach(function (pathSeg) {
+      pathSeg._owningPathSegList = null;
+    });
+    this._list = [];
+    this._writeListToPath();
+  };
 
-	window.SVGPathSegList.prototype.initialize = function (newItem) {
-		this._checkPathSynchronizedToList();
+  window.SVGPathSegList.prototype.initialize = function (newItem) {
+    this._checkPathSynchronizedToList();
 
-		this._list = [newItem];
-		newItem._owningPathSegList = this;
-		this._writeListToPath();
-		return newItem;
-	};
+    this._list = [newItem];
+    newItem._owningPathSegList = this;
+    this._writeListToPath();
+    return newItem;
+  };
 
-	window.SVGPathSegList.prototype._checkValidIndex = function (index) {
-		if (isNaN(index) || index < 0 || index >= this.numberOfItems) {
-			throw new Error('INDEX_SIZE_ERR');
-		}
-	};
+  window.SVGPathSegList.prototype._checkValidIndex = function (index) {
+    if (isNaN(index) || index < 0 || index >= this.numberOfItems) {
+      throw new Error('INDEX_SIZE_ERR');
+    }
+  };
 
-	window.SVGPathSegList.prototype.getItem = function (index) {
-		this._checkPathSynchronizedToList();
+  window.SVGPathSegList.prototype.getItem = function (index) {
+    this._checkPathSynchronizedToList();
 
-		this._checkValidIndex(index);
-		return this._list[index];
-	};
+    this._checkValidIndex(index);
+    return this._list[index];
+  };
 
-	window.SVGPathSegList.prototype.insertItemBefore = function (newItem, index) {
-		this._checkPathSynchronizedToList();
+  window.SVGPathSegList.prototype.insertItemBefore = function (newItem, index) {
+    this._checkPathSynchronizedToList();
 
-		// Spec: If the index is greater than or equal to numberOfItems, then the new item is appended to the end of the list.
-		if (index > this.numberOfItems) {
-			index = this.numberOfItems;
-		}
-		if (newItem._owningPathSegList) {
-			// SVG2 spec says to make a copy.
-			newItem = newItem.clone();
-		}
-		this._list.splice(index, 0, newItem);
-		newItem._owningPathSegList = this;
-		this._writeListToPath();
-		return newItem;
-	};
+    // Spec: If the index is greater than or equal to numberOfItems, then the new item is appended to the end of the list.
+    if (index > this.numberOfItems) {
+      index = this.numberOfItems;
+    }
+    if (newItem._owningPathSegList) {
+      // SVG2 spec says to make a copy.
+      newItem = newItem.clone();
+    }
+    this._list.splice(index, 0, newItem);
+    newItem._owningPathSegList = this;
+    this._writeListToPath();
+    return newItem;
+  };
 
-	window.SVGPathSegList.prototype.replaceItem = function (newItem, index) {
-		this._checkPathSynchronizedToList();
+  window.SVGPathSegList.prototype.replaceItem = function (newItem, index) {
+    this._checkPathSynchronizedToList();
 
-		if (newItem._owningPathSegList) {
-			// SVG2 spec says to make a copy.
-			newItem = newItem.clone();
-		}
-		this._checkValidIndex(index);
-		this._list[index] = newItem;
-		newItem._owningPathSegList = this;
-		this._writeListToPath();
-		return newItem;
-	};
+    if (newItem._owningPathSegList) {
+      // SVG2 spec says to make a copy.
+      newItem = newItem.clone();
+    }
+    this._checkValidIndex(index);
+    this._list[index] = newItem;
+    newItem._owningPathSegList = this;
+    this._writeListToPath();
+    return newItem;
+  };
 
-	window.SVGPathSegList.prototype.removeItem = function (index) {
-		this._checkPathSynchronizedToList();
+  window.SVGPathSegList.prototype.removeItem = function (index) {
+    this._checkPathSynchronizedToList();
 
-		this._checkValidIndex(index);
-		var item = this._list[index];
-		this._list.splice(index, 1);
-		this._writeListToPath();
-		return item;
-	};
+    this._checkValidIndex(index);
+    var item = this._list[index];
+    this._list.splice(index, 1);
+    this._writeListToPath();
+    return item;
+  };
 
-	window.SVGPathSegList.prototype.appendItem = function (newItem) {
-		this._checkPathSynchronizedToList();
+  window.SVGPathSegList.prototype.appendItem = function (newItem) {
+    this._checkPathSynchronizedToList();
 
-		if (newItem._owningPathSegList) {
-			// SVG2 spec says to make a copy.
-			newItem = newItem.clone();
-		}
-		this._list.push(newItem);
-		newItem._owningPathSegList = this;
-		// TODO: Optimize this to just append to the existing attribute.
-		this._writeListToPath();
-		return newItem;
-	};
+    if (newItem._owningPathSegList) {
+      // SVG2 spec says to make a copy.
+      newItem = newItem.clone();
+    }
+    this._list.push(newItem);
+    newItem._owningPathSegList = this;
+    // TODO: Optimize this to just append to the existing attribute.
+    this._writeListToPath();
+    return newItem;
+  };
 
-	window.SVGPathSegList._pathSegArrayAsString = function (pathSegArray) {
-		var string = '';
-		var first = true;
-		pathSegArray.forEach(function (pathSeg) {
-			if (first) {
-				first = false;
-				string += pathSeg._asPathString();
-			} else {
-				string += ' ' + pathSeg._asPathString();
-			}
-		});
-		return string;
-	};
+  window.SVGPathSegList._pathSegArrayAsString = function (pathSegArray) {
+    var string = '';
+    var first = true;
+    pathSegArray.forEach(function (pathSeg) {
+      if (first) {
+        first = false;
+        string += pathSeg._asPathString();
+      } else {
+        string += ' ' + pathSeg._asPathString();
+      }
+    });
+    return string;
+  };
 
-	// This closely follows SVGPathParser::parsePath from Source/core/svg/SVGPathParser.cpp.
-	window.SVGPathSegList.prototype._parsePath = function (string) {
-		if (!string || string.length === 0) {
-			return [];
-		}
+  // This closely follows SVGPathParser::parsePath from Source/core/svg/SVGPathParser.cpp.
+  window.SVGPathSegList.prototype._parsePath = function (string) {
+    if (!string || string.length === 0) {
+      return [];
+    }
 
-		var owningPathSegList = this;
+    var owningPathSegList = this;
 
-		var Builder = function () {
-			this.pathSegList = [];
-		};
+    var Builder = function () {
+      this.pathSegList = [];
+    };
 
-		Builder.prototype.appendSegment = function (pathSeg) {
-			this.pathSegList.push(pathSeg);
-		};
+    Builder.prototype.appendSegment = function (pathSeg) {
+      this.pathSegList.push(pathSeg);
+    };
 
-		var Source = function (string) {
-			this._string = string;
-			this._currentIndex = 0;
-			this._endIndex = this._string.length;
-			this._previousCommand = window.SVGPathSeg.PATHSEG_UNKNOWN;
+    var Source = function (string) {
+      this._string = string;
+      this._currentIndex = 0;
+      this._endIndex = this._string.length;
+      this._previousCommand = window.SVGPathSeg.PATHSEG_UNKNOWN;
 
-			this._skipOptionalSpaces();
-		};
+      this._skipOptionalSpaces();
+    };
 
-		Source.prototype._isCurrentSpace = function () {
-			var character = this._string[this._currentIndex];
-			return character <= ' ' && (character === ' ' || character === '\n' || character === '\t' || character === '\r' || character === '\f');
-		};
+    Source.prototype._isCurrentSpace = function () {
+      var character = this._string[this._currentIndex];
+      return character <= ' ' && (character === ' ' || character === '\n' || character === '\t' || character === '\r' || character === '\f');
+    };
 
-		Source.prototype._skipOptionalSpaces = function () {
-			while (this._currentIndex < this._endIndex && this._isCurrentSpace()) {
-				this._currentIndex++;
-			}
-			return this._currentIndex < this._endIndex;
-		};
+    Source.prototype._skipOptionalSpaces = function () {
+      while (this._currentIndex < this._endIndex && this._isCurrentSpace()) {
+        this._currentIndex++;
+      }
+      return this._currentIndex < this._endIndex;
+    };
 
-		Source.prototype._skipOptionalSpacesOrDelimiter = function () {
-			if (this._currentIndex < this._endIndex && !this._isCurrentSpace() && this._string.charAt(this._currentIndex) !== ',') {
-				return false;
-			}
-			if (this._skipOptionalSpaces()) {
-				if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === ',') {
-					this._currentIndex++;
-					this._skipOptionalSpaces();
-				}
-			}
-			return this._currentIndex < this._endIndex;
-		};
+    Source.prototype._skipOptionalSpacesOrDelimiter = function () {
+      if (this._currentIndex < this._endIndex && !this._isCurrentSpace() && this._string.charAt(this._currentIndex) !== ',') {
+        return false;
+      }
+      if (this._skipOptionalSpaces()) {
+        if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === ',') {
+          this._currentIndex++;
+          this._skipOptionalSpaces();
+        }
+      }
+      return this._currentIndex < this._endIndex;
+    };
 
-		Source.prototype.hasMoreData = function () {
-			return this._currentIndex < this._endIndex;
-		};
+    Source.prototype.hasMoreData = function () {
+      return this._currentIndex < this._endIndex;
+    };
 
-		Source.prototype.peekSegmentType = function () {
-			var lookahead = this._string[this._currentIndex];
-			return this._pathSegTypeFromChar(lookahead);
-		};
+    Source.prototype.peekSegmentType = function () {
+      var lookahead = this._string[this._currentIndex];
+      return this._pathSegTypeFromChar(lookahead);
+    };
 
-		Source.prototype._pathSegTypeFromChar = function (lookahead) {
-			switch (lookahead) {
-			case 'Z':
-			case 'z':
-				return window.SVGPathSeg.PATHSEG_CLOSEPATH;
-			case 'M':
-				return window.SVGPathSeg.PATHSEG_MOVETO_ABS;
-			case 'm':
-				return window.SVGPathSeg.PATHSEG_MOVETO_REL;
-			case 'L':
-				return window.SVGPathSeg.PATHSEG_LINETO_ABS;
-			case 'l':
-				return window.SVGPathSeg.PATHSEG_LINETO_REL;
-			case 'C':
-				return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS;
-			case 'c':
-				return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL;
-			case 'Q':
-				return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS;
-			case 'q':
-				return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL;
-			case 'A':
-				return window.SVGPathSeg.PATHSEG_ARC_ABS;
-			case 'a':
-				return window.SVGPathSeg.PATHSEG_ARC_REL;
-			case 'H':
-				return window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS;
-			case 'h':
-				return window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL;
-			case 'V':
-				return window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS;
-			case 'v':
-				return window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL;
-			case 'S':
-				return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS;
-			case 's':
-				return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL;
-			case 'T':
-				return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS;
-			case 't':
-				return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL;
-			default:
-				return window.SVGPathSeg.PATHSEG_UNKNOWN;
-			}
-		};
+    Source.prototype._pathSegTypeFromChar = function (lookahead) {
+      switch (lookahead) {
+      case 'Z':
+      case 'z':
+        return window.SVGPathSeg.PATHSEG_CLOSEPATH;
+      case 'M':
+        return window.SVGPathSeg.PATHSEG_MOVETO_ABS;
+      case 'm':
+        return window.SVGPathSeg.PATHSEG_MOVETO_REL;
+      case 'L':
+        return window.SVGPathSeg.PATHSEG_LINETO_ABS;
+      case 'l':
+        return window.SVGPathSeg.PATHSEG_LINETO_REL;
+      case 'C':
+        return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS;
+      case 'c':
+        return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL;
+      case 'Q':
+        return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS;
+      case 'q':
+        return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL;
+      case 'A':
+        return window.SVGPathSeg.PATHSEG_ARC_ABS;
+      case 'a':
+        return window.SVGPathSeg.PATHSEG_ARC_REL;
+      case 'H':
+        return window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS;
+      case 'h':
+        return window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL;
+      case 'V':
+        return window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS;
+      case 'v':
+        return window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL;
+      case 'S':
+        return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS;
+      case 's':
+        return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL;
+      case 'T':
+        return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS;
+      case 't':
+        return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL;
+      default:
+        return window.SVGPathSeg.PATHSEG_UNKNOWN;
+      }
+    };
 
-		Source.prototype._nextCommandHelper = function (lookahead, previousCommand) {
-			// Check for remaining coordinates in the current command.
-			if ((lookahead === '+' || lookahead === '-' || lookahead === '.' || (lookahead >= '0' && lookahead <= '9')) && previousCommand !== window.SVGPathSeg.PATHSEG_CLOSEPATH) {
-				if (previousCommand === window.SVGPathSeg.PATHSEG_MOVETO_ABS) {
-					return window.SVGPathSeg.PATHSEG_LINETO_ABS;
-				}
-				if (previousCommand === window.SVGPathSeg.PATHSEG_MOVETO_REL) {
-					return window.SVGPathSeg.PATHSEG_LINETO_REL;
-				}
-				return previousCommand;
-			}
-			return window.SVGPathSeg.PATHSEG_UNKNOWN;
-		};
+    Source.prototype._nextCommandHelper = function (lookahead, previousCommand) {
+      // Check for remaining coordinates in the current command.
+      if ((lookahead === '+' || lookahead === '-' || lookahead === '.' || (lookahead >= '0' && lookahead <= '9')) && previousCommand !== window.SVGPathSeg.PATHSEG_CLOSEPATH) {
+        if (previousCommand === window.SVGPathSeg.PATHSEG_MOVETO_ABS) {
+          return window.SVGPathSeg.PATHSEG_LINETO_ABS;
+        }
+        if (previousCommand === window.SVGPathSeg.PATHSEG_MOVETO_REL) {
+          return window.SVGPathSeg.PATHSEG_LINETO_REL;
+        }
+        return previousCommand;
+      }
+      return window.SVGPathSeg.PATHSEG_UNKNOWN;
+    };
 
-		Source.prototype.initialCommandIsMoveTo = function () {
-			// If the path is empty it is still valid, so return true.
-			if (!this.hasMoreData()) {
-				return true;
-			}
-			var command = this.peekSegmentType();
-			// Path must start with moveTo.
-			return command === window.SVGPathSeg.PATHSEG_MOVETO_ABS || command === window.SVGPathSeg.PATHSEG_MOVETO_REL;
-		};
+    Source.prototype.initialCommandIsMoveTo = function () {
+      // If the path is empty it is still valid, so return true.
+      if (!this.hasMoreData()) {
+        return true;
+      }
+      var command = this.peekSegmentType();
+      // Path must start with moveTo.
+      return command === window.SVGPathSeg.PATHSEG_MOVETO_ABS || command === window.SVGPathSeg.PATHSEG_MOVETO_REL;
+    };
 
-		// Parse a number from an SVG path. This very closely follows genericParseNumber(...) from Source/core/svg/SVGParserUtilities.cpp.
-		// Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-PathDataBNF
-		Source.prototype._parseNumber = function () {
-			var exponent = 0;
-			var integer = 0;
-			var frac = 1;
-			var decimal = 0;
-			var sign = 1;
-			var expsign = 1;
+    // Parse a number from an SVG path. This very closely follows genericParseNumber(...) from Source/core/svg/SVGParserUtilities.cpp.
+    // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-PathDataBNF
+    Source.prototype._parseNumber = function () {
+      var exponent = 0;
+      var integer = 0;
+      var frac = 1;
+      var decimal = 0;
+      var sign = 1;
+      var expsign = 1;
 
-			var startIndex = this._currentIndex;
+      var startIndex = this._currentIndex;
 
-			this._skipOptionalSpaces();
+      this._skipOptionalSpaces();
 
-			// Read the sign.
-			if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '+') {
-				this._currentIndex++;
-			} else if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '-') {
-				this._currentIndex++;
-				sign = -1;
-			}
+      // Read the sign.
+      if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '+') {
+        this._currentIndex++;
+      } else if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '-') {
+        this._currentIndex++;
+        sign = -1;
+      }
 
-			if (this._currentIndex === this._endIndex || ((this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') && this._string.charAt(this._currentIndex) !== '.')) {
-				// The first character of a number must be one of [0-9+-.].
-				return undefined;
-			}
+      if (this._currentIndex === this._endIndex || ((this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') && this._string.charAt(this._currentIndex) !== '.')) {
+        // The first character of a number must be one of [0-9+-.].
+        return undefined;
+      }
 
-			// Read the integer part, build right-to-left.
-			var startIntPartIndex = this._currentIndex;
-			while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
-				this._currentIndex++; // Advance to first non-digit.
-			}
+      // Read the integer part, build right-to-left.
+      var startIntPartIndex = this._currentIndex;
+      while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
+        this._currentIndex++; // Advance to first non-digit.
+      }
 
-			if (this._currentIndex !== startIntPartIndex) {
-				var scanIntPartIndex = this._currentIndex - 1;
-				var multiplier = 1;
-				while (scanIntPartIndex >= startIntPartIndex) {
-					integer += multiplier * (this._string.charAt(scanIntPartIndex--) - '0');
-					multiplier *= 10;
-				}
-			}
+      if (this._currentIndex !== startIntPartIndex) {
+        var scanIntPartIndex = this._currentIndex - 1;
+        var multiplier = 1;
+        while (scanIntPartIndex >= startIntPartIndex) {
+          integer += multiplier * (this._string.charAt(scanIntPartIndex--) - '0');
+          multiplier *= 10;
+        }
+      }
 
-			// Read the decimals.
-			if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '.') {
-				this._currentIndex++;
+      // Read the decimals.
+      if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) === '.') {
+        this._currentIndex++;
 
-				// There must be a least one digit following the .
-				if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
-					return undefined;
-				}
-				while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
-					frac *= 10;
-					decimal += (this._string.charAt(this._currentIndex) - '0') / frac;
-					this._currentIndex += 1;
-				}
-			}
+        // There must be a least one digit following the .
+        if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
+          return undefined;
+        }
+        while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
+          frac *= 10;
+          decimal += (this._string.charAt(this._currentIndex) - '0') / frac;
+          this._currentIndex += 1;
+        }
+      }
 
-			// Read the exponent part.
-			if (this._currentIndex !== startIndex && this._currentIndex + 1 < this._endIndex && (this._string.charAt(this._currentIndex) === 'e' || this._string.charAt(this._currentIndex) === 'E') && (this._string.charAt(this._currentIndex + 1) !== 'x' && this._string.charAt(this._currentIndex + 1) !== 'm')) {
-				this._currentIndex++;
+      // Read the exponent part.
+      if (this._currentIndex !== startIndex && this._currentIndex + 1 < this._endIndex && (this._string.charAt(this._currentIndex) === 'e' || this._string.charAt(this._currentIndex) === 'E') && (this._string.charAt(this._currentIndex + 1) !== 'x' && this._string.charAt(this._currentIndex + 1) !== 'm')) {
+        this._currentIndex++;
 
-				// Read the sign of the exponent.
-				if (this._string.charAt(this._currentIndex) === '+') {
-					this._currentIndex++;
-				} else if (this._string.charAt(this._currentIndex) === '-') {
-					this._currentIndex++;
-					expsign = -1;
-				}
+        // Read the sign of the exponent.
+        if (this._string.charAt(this._currentIndex) === '+') {
+          this._currentIndex++;
+        } else if (this._string.charAt(this._currentIndex) === '-') {
+          this._currentIndex++;
+          expsign = -1;
+        }
 
-				// There must be an exponent.
-				if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
-					return undefined;
-				}
+        // There must be an exponent.
+        if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < '0' || this._string.charAt(this._currentIndex) > '9') {
+          return undefined;
+        }
 
-				while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
-					exponent *= 10;
-					exponent += (this._string.charAt(this._currentIndex) - '0');
-					this._currentIndex++;
-				}
-			}
+        while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= '0' && this._string.charAt(this._currentIndex) <= '9') {
+          exponent *= 10;
+          exponent += (this._string.charAt(this._currentIndex) - '0');
+          this._currentIndex++;
+        }
+      }
 
-			var number = integer + decimal;
-			number *= sign;
+      var number = integer + decimal;
+      number *= sign;
 
-			if (exponent) {
-				number *= Math.pow(10, expsign * exponent);
-			}
+      if (exponent) {
+        number *= Math.pow(10, expsign * exponent);
+      }
 
-			if (startIndex === this._currentIndex) {
-				return undefined;
-			}
+      if (startIndex === this._currentIndex) {
+        return undefined;
+      }
 
-			this._skipOptionalSpacesOrDelimiter();
+      this._skipOptionalSpacesOrDelimiter();
 
-			return number;
-		};
+      return number;
+    };
 
-		Source.prototype._parseArcFlag = function () {
-			if (this._currentIndex >= this._endIndex) {
-				return undefined;
-			}
-			var flag = false;
-			var flagChar = this._string.charAt(this._currentIndex++);
-			if (flagChar === '0') {
-				flag = false;
-			} else if (flagChar === '1') {
-				flag = true;
-			} else {
-				return undefined;
-			}
+    Source.prototype._parseArcFlag = function () {
+      if (this._currentIndex >= this._endIndex) {
+        return undefined;
+      }
+      var flag = false;
+      var flagChar = this._string.charAt(this._currentIndex++);
+      if (flagChar === '0') {
+        flag = false;
+      } else if (flagChar === '1') {
+        flag = true;
+      } else {
+        return undefined;
+      }
 
-			this._skipOptionalSpacesOrDelimiter();
-			return flag;
-		};
+      this._skipOptionalSpacesOrDelimiter();
+      return flag;
+    };
 
-		Source.prototype.parseSegment = function () {
-			var lookahead = this._string[this._currentIndex];
-			var command = this._pathSegTypeFromChar(lookahead);
-			if (command === window.SVGPathSeg.PATHSEG_UNKNOWN) {
-				// Possibly an implicit command. Not allowed if this is the first command.
-				if (this._previousCommand === window.SVGPathSeg.PATHSEG_UNKNOWN) {
-					return null;
-				}
-				command = this._nextCommandHelper(lookahead, this._previousCommand);
-				if (command === window.SVGPathSeg.PATHSEG_UNKNOWN) {
-					return null;
-				}
-			} else {
-				this._currentIndex++;
-			}
+    Source.prototype.parseSegment = function () {
+      var lookahead = this._string[this._currentIndex];
+      var command = this._pathSegTypeFromChar(lookahead);
+      if (command === window.SVGPathSeg.PATHSEG_UNKNOWN) {
+        // Possibly an implicit command. Not allowed if this is the first command.
+        if (this._previousCommand === window.SVGPathSeg.PATHSEG_UNKNOWN) {
+          return null;
+        }
+        command = this._nextCommandHelper(lookahead, this._previousCommand);
+        if (command === window.SVGPathSeg.PATHSEG_UNKNOWN) {
+          return null;
+        }
+      } else {
+        this._currentIndex++;
+      }
 
-			this._previousCommand = command;
+      this._previousCommand = command;
 
-			switch (command) {
-			case window.SVGPathSeg.PATHSEG_MOVETO_REL:
-				return new window.SVGPathSegMovetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_MOVETO_ABS:
-				return new window.SVGPathSegMovetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_LINETO_REL:
-				return new window.SVGPathSegLinetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_LINETO_ABS:
-				return new window.SVGPathSegLinetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL:
-				return new window.SVGPathSegLinetoHorizontalRel(owningPathSegList, this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS:
-				return new window.SVGPathSegLinetoHorizontalAbs(owningPathSegList, this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL:
-				return new window.SVGPathSegLinetoVerticalRel(owningPathSegList, this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS:
-				return new window.SVGPathSegLinetoVerticalAbs(owningPathSegList, this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_CLOSEPATH:
-				this._skipOptionalSpaces();
-				return new window.SVGPathSegClosePath(owningPathSegList);
-			case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL:
-				var points = {x1: this._parseNumber(), y1: this._parseNumber(), x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegCurvetoCubicRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
-			case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS:
-				var points = {x1: this._parseNumber(), y1: this._parseNumber(), x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegCurvetoCubicAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
-			case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL:
-				var points = {x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegCurvetoCubicSmoothRel(owningPathSegList, points.x, points.y, points.x2, points.y2);
-			case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS:
-				var points = {x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegCurvetoCubicSmoothAbs(owningPathSegList, points.x, points.y, points.x2, points.y2);
-			case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL:
-				var points = {x1: this._parseNumber(), y1: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegCurvetoQuadraticRel(owningPathSegList, points.x, points.y, points.x1, points.y1);
-			case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS:
-				var points = {x1: this._parseNumber(), y1: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegCurvetoQuadraticAbs(owningPathSegList, points.x, points.y, points.x1, points.y1);
-			case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL:
-				return new window.SVGPathSegCurvetoQuadraticSmoothRel(owningPathSegList, this._parseNumber(), this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS:
-				return new window.SVGPathSegCurvetoQuadraticSmoothAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
-			case window.SVGPathSeg.PATHSEG_ARC_REL:
-				var points = {x1: this._parseNumber(), y1: this._parseNumber(), arcAngle: this._parseNumber(), arcLarge: this._parseArcFlag(), arcSweep: this._parseArcFlag(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegArcRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
-			case window.SVGPathSeg.PATHSEG_ARC_ABS:
-				var points = {x1: this._parseNumber(), y1: this._parseNumber(), arcAngle: this._parseNumber(), arcLarge: this._parseArcFlag(), arcSweep: this._parseArcFlag(), x: this._parseNumber(), y: this._parseNumber()};
-				return new window.SVGPathSegArcAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
-			default:
-				throw new Error('Unknown path seg type.');
-			}
-		};
+      switch (command) {
+      case window.SVGPathSeg.PATHSEG_MOVETO_REL:
+        return new window.SVGPathSegMovetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_MOVETO_ABS:
+        return new window.SVGPathSegMovetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_LINETO_REL:
+        return new window.SVGPathSegLinetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_LINETO_ABS:
+        return new window.SVGPathSegLinetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL:
+        return new window.SVGPathSegLinetoHorizontalRel(owningPathSegList, this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS:
+        return new window.SVGPathSegLinetoHorizontalAbs(owningPathSegList, this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL:
+        return new window.SVGPathSegLinetoVerticalRel(owningPathSegList, this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS:
+        return new window.SVGPathSegLinetoVerticalAbs(owningPathSegList, this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_CLOSEPATH:
+        this._skipOptionalSpaces();
+        return new window.SVGPathSegClosePath(owningPathSegList);
+      case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL:
+        var points = {x1: this._parseNumber(), y1: this._parseNumber(), x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegCurvetoCubicRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
+      case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS:
+        var points = {x1: this._parseNumber(), y1: this._parseNumber(), x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegCurvetoCubicAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
+      case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL:
+        var points = {x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegCurvetoCubicSmoothRel(owningPathSegList, points.x, points.y, points.x2, points.y2);
+      case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS:
+        var points = {x2: this._parseNumber(), y2: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegCurvetoCubicSmoothAbs(owningPathSegList, points.x, points.y, points.x2, points.y2);
+      case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL:
+        var points = {x1: this._parseNumber(), y1: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegCurvetoQuadraticRel(owningPathSegList, points.x, points.y, points.x1, points.y1);
+      case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS:
+        var points = {x1: this._parseNumber(), y1: this._parseNumber(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegCurvetoQuadraticAbs(owningPathSegList, points.x, points.y, points.x1, points.y1);
+      case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL:
+        return new window.SVGPathSegCurvetoQuadraticSmoothRel(owningPathSegList, this._parseNumber(), this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS:
+        return new window.SVGPathSegCurvetoQuadraticSmoothAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
+      case window.SVGPathSeg.PATHSEG_ARC_REL:
+        var points = {x1: this._parseNumber(), y1: this._parseNumber(), arcAngle: this._parseNumber(), arcLarge: this._parseArcFlag(), arcSweep: this._parseArcFlag(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegArcRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
+      case window.SVGPathSeg.PATHSEG_ARC_ABS:
+        var points = {x1: this._parseNumber(), y1: this._parseNumber(), arcAngle: this._parseNumber(), arcLarge: this._parseArcFlag(), arcSweep: this._parseArcFlag(), x: this._parseNumber(), y: this._parseNumber()};
+        return new window.SVGPathSegArcAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
+      default:
+        throw new Error('Unknown path seg type.');
+      }
+    };
 
-		var builder = new Builder();
-		var source = new Source(string);
+    var builder = new Builder();
+    var source = new Source(string);
 
-		if (!source.initialCommandIsMoveTo()) {
-			return [];
-		}
-		while (source.hasMoreData()) {
-			var pathSeg = source.parseSegment();
-			if (!pathSeg) {
-				return [];
-			}
-			builder.appendSegment(pathSeg);
-		}
+    if (!source.initialCommandIsMoveTo()) {
+      return [];
+    }
+    while (source.hasMoreData()) {
+      var pathSeg = source.parseSegment();
+      if (!pathSeg) {
+        return [];
+      }
+      builder.appendSegment(pathSeg);
+    }
 
-		return builder.pathSegList;
-	};
+    return builder.pathSegList;
+  };
 }
 }());
diff --git a/editor/recalculate.js b/editor/recalculate.js
index 0065bdb7..3e37eacc 100644
--- a/editor/recalculate.js
+++ b/editor/recalculate.js
@@ -24,7 +24,7 @@ var svgedit = svgedit || {}; // eslint-disable-line no-use-before-define
 
 (function () {
 if (!svgedit.recalculate) {
-	svgedit.recalculate = {};
+  svgedit.recalculate = {};
 }
 
 var NS = svgedit.NS;
@@ -32,7 +32,7 @@ var context_;
 
 // Function: svgedit.recalculate.init
 svgedit.recalculate.init = function (editorContext) {
-	context_ = editorContext;
+  context_ = editorContext;
 };
 
 // Function: svgedit.recalculate.updateClipPath
@@ -43,15 +43,15 @@ svgedit.recalculate.init = function (editorContext) {
 // tx - The translation's x value
 // ty - The translation's y value
 svgedit.recalculate.updateClipPath = function (attr, tx, ty) {
-	var path = getRefElem(attr).firstChild;
-	var cpXform = svgedit.transformlist.getTransformList(path);
-	var newxlate = context_.getSVGRoot().createSVGTransform();
-	newxlate.setTranslate(tx, ty);
+  var path = getRefElem(attr).firstChild;
+  var cpXform = svgedit.transformlist.getTransformList(path);
+  var newxlate = context_.getSVGRoot().createSVGTransform();
+  newxlate.setTranslate(tx, ty);
 
-	cpXform.appendItem(newxlate);
+  cpXform.appendItem(newxlate);
 
-	// Update clipPath's dimensions
-	svgedit.recalculate.recalculateDimensions(path);
+  // Update clipPath's dimensions
+  svgedit.recalculate.recalculateDimensions(path);
 };
 
 // Function: svgedit.recalculate.recalculateDimensions
@@ -63,748 +63,748 @@ svgedit.recalculate.updateClipPath = function (attr, tx, ty) {
 // Returns:
 // Undo command object with the resulting change
 svgedit.recalculate.recalculateDimensions = function (selected) {
-	if (selected == null) { return null; }
+  if (selected == null) { return null; }
 
-	// Firefox Issue - 1081
-	if (selected.nodeName === 'svg' && navigator.userAgent.indexOf('Firefox/20') >= 0) {
-		return null;
-	}
+  // Firefox Issue - 1081
+  if (selected.nodeName === 'svg' && navigator.userAgent.indexOf('Firefox/20') >= 0) {
+    return null;
+  }
 
-	var svgroot = context_.getSVGRoot();
-	var tlist = svgedit.transformlist.getTransformList(selected);
-	var k;
-	// remove any unnecessary transforms
-	if (tlist && tlist.numberOfItems > 0) {
-		k = tlist.numberOfItems;
-		var noi = k;
-		while (k--) {
-			var xform = tlist.getItem(k);
-			if (xform.type === 0) {
-				tlist.removeItem(k);
-			// remove identity matrices
-			} else if (xform.type === 1) {
-				if (svgedit.math.isIdentity(xform.matrix)) {
-					if (noi === 1) {
-						// Overcome Chrome bug (though only when noi is 1) with
-						//    `removeItem` preventing `removeAttribute` from
-						//    subsequently working
-						// See https://bugs.chromium.org/p/chromium/issues/detail?id=843901
-						selected.removeAttribute('transform');
-						return null;
-					}
-					tlist.removeItem(k);
-				}
-			// remove zero-degree rotations
-			} else if (xform.type === 4) {
-				if (xform.angle === 0) {
-					tlist.removeItem(k);
-				}
-			}
-		}
-		// End here if all it has is a rotation
-		if (tlist.numberOfItems === 1 &&
-				svgedit.utilities.getRotationAngle(selected)) { return null; }
-	}
+  var svgroot = context_.getSVGRoot();
+  var tlist = svgedit.transformlist.getTransformList(selected);
+  var k;
+  // remove any unnecessary transforms
+  if (tlist && tlist.numberOfItems > 0) {
+    k = tlist.numberOfItems;
+    var noi = k;
+    while (k--) {
+      var xform = tlist.getItem(k);
+      if (xform.type === 0) {
+        tlist.removeItem(k);
+      // remove identity matrices
+      } else if (xform.type === 1) {
+        if (svgedit.math.isIdentity(xform.matrix)) {
+          if (noi === 1) {
+            // Overcome Chrome bug (though only when noi is 1) with
+            //    `removeItem` preventing `removeAttribute` from
+            //    subsequently working
+            // See https://bugs.chromium.org/p/chromium/issues/detail?id=843901
+            selected.removeAttribute('transform');
+            return null;
+          }
+          tlist.removeItem(k);
+        }
+      // remove zero-degree rotations
+      } else if (xform.type === 4) {
+        if (xform.angle === 0) {
+          tlist.removeItem(k);
+        }
+      }
+    }
+    // End here if all it has is a rotation
+    if (tlist.numberOfItems === 1 &&
+        svgedit.utilities.getRotationAngle(selected)) { return null; }
+  }
 
-	// if this element had no transforms, we are done
-	if (!tlist || tlist.numberOfItems === 0) {
-		// Chrome apparently had a bug that requires clearing the attribute first.
-		selected.setAttribute('transform', '');
-		// However, this still next line currently doesn't work at all in Chrome
-		selected.removeAttribute('transform');
-		// selected.transform.baseVal.clear(); // Didn't help for Chrome bug
-		return null;
-	}
+  // if this element had no transforms, we are done
+  if (!tlist || tlist.numberOfItems === 0) {
+    // Chrome apparently had a bug that requires clearing the attribute first.
+    selected.setAttribute('transform', '');
+    // However, this still next line currently doesn't work at all in Chrome
+    selected.removeAttribute('transform');
+    // selected.transform.baseVal.clear(); // Didn't help for Chrome bug
+    return null;
+  }
 
-	// TODO: Make this work for more than 2
-	if (tlist) {
-		k = tlist.numberOfItems;
-		var mxs = [];
-		while (k--) {
-			var xform = tlist.getItem(k);
-			if (xform.type === 1) {
-				mxs.push([xform.matrix, k]);
-			} else if (mxs.length) {
-				mxs = [];
-			}
-		}
-		if (mxs.length === 2) {
-			var mNew = svgroot.createSVGTransformFromMatrix(svgedit.math.matrixMultiply(mxs[1][0], mxs[0][0]));
-			tlist.removeItem(mxs[0][1]);
-			tlist.removeItem(mxs[1][1]);
-			tlist.insertItemBefore(mNew, mxs[1][1]);
-		}
+  // TODO: Make this work for more than 2
+  if (tlist) {
+    k = tlist.numberOfItems;
+    var mxs = [];
+    while (k--) {
+      var xform = tlist.getItem(k);
+      if (xform.type === 1) {
+        mxs.push([xform.matrix, k]);
+      } else if (mxs.length) {
+        mxs = [];
+      }
+    }
+    if (mxs.length === 2) {
+      var mNew = svgroot.createSVGTransformFromMatrix(svgedit.math.matrixMultiply(mxs[1][0], mxs[0][0]));
+      tlist.removeItem(mxs[0][1]);
+      tlist.removeItem(mxs[1][1]);
+      tlist.insertItemBefore(mNew, mxs[1][1]);
+    }
 
-		// combine matrix + translate
-		k = tlist.numberOfItems;
-		if (k >= 2 && tlist.getItem(k - 2).type === 1 && tlist.getItem(k - 1).type === 2) {
-			var mt = svgroot.createSVGTransform();
+    // combine matrix + translate
+    k = tlist.numberOfItems;
+    if (k >= 2 && tlist.getItem(k - 2).type === 1 && tlist.getItem(k - 1).type === 2) {
+      var mt = svgroot.createSVGTransform();
 
-			var m = svgedit.math.matrixMultiply(
-				tlist.getItem(k - 2).matrix,
-				tlist.getItem(k - 1).matrix);
-			mt.setMatrix(m);
-			tlist.removeItem(k - 2);
-			tlist.removeItem(k - 2);
-			tlist.appendItem(mt);
-		}
-	}
+      var m = svgedit.math.matrixMultiply(
+        tlist.getItem(k - 2).matrix,
+        tlist.getItem(k - 1).matrix);
+      mt.setMatrix(m);
+      tlist.removeItem(k - 2);
+      tlist.removeItem(k - 2);
+      tlist.appendItem(mt);
+    }
+  }
 
-	// If it still has a single [M] or [R][M], return null too (prevents BatchCommand from being returned).
-	switch (selected.tagName) {
-	// Ignore these elements, as they can absorb the [M]
-	case 'line':
-	case 'polyline':
-	case 'polygon':
-	case 'path':
-		break;
-	default:
-		if ((tlist.numberOfItems === 1 && tlist.getItem(0).type === 1) ||
-				(tlist.numberOfItems === 2 && tlist.getItem(0).type === 1 && tlist.getItem(0).type === 4)) {
-			return null;
-		}
-	}
+  // If it still has a single [M] or [R][M], return null too (prevents BatchCommand from being returned).
+  switch (selected.tagName) {
+  // Ignore these elements, as they can absorb the [M]
+  case 'line':
+  case 'polyline':
+  case 'polygon':
+  case 'path':
+    break;
+  default:
+    if ((tlist.numberOfItems === 1 && tlist.getItem(0).type === 1) ||
+        (tlist.numberOfItems === 2 && tlist.getItem(0).type === 1 && tlist.getItem(0).type === 4)) {
+      return null;
+    }
+  }
 
-	// Grouped SVG element
-	var gsvg = $(selected).data('gsvg');
+  // Grouped SVG element
+  var gsvg = $(selected).data('gsvg');
 
-	// we know we have some transforms, so set up return variable
-	var batchCmd = new svgedit.history.BatchCommand('Transform');
+  // we know we have some transforms, so set up return variable
+  var batchCmd = new svgedit.history.BatchCommand('Transform');
 
-	// store initial values that will be affected by reducing the transform list
-	var changes = {}, initial = null, attrs = [];
-	switch (selected.tagName) {
-	case 'line':
-		attrs = ['x1', 'y1', 'x2', 'y2'];
-		break;
-	case 'circle':
-		attrs = ['cx', 'cy', 'r'];
-		break;
-	case 'ellipse':
-		attrs = ['cx', 'cy', 'rx', 'ry'];
-		break;
-	case 'foreignObject':
-	case 'rect':
-	case 'image':
-		attrs = ['width', 'height', 'x', 'y'];
-		break;
-	case 'use':
-	case 'text':
-	case 'tspan':
-		attrs = ['x', 'y'];
-		break;
-	case 'polygon':
-	case 'polyline':
-		initial = {};
-		initial.points = selected.getAttribute('points');
-		var list = selected.points;
-		var len = list.numberOfItems;
-		changes.points = new Array(len);
-		var i;
-		for (i = 0; i < len; ++i) {
-			var pt = list.getItem(i);
-			changes.points[i] = {x: pt.x, y: pt.y};
-		}
-		break;
-	case 'path':
-		initial = {};
-		initial.d = selected.getAttribute('d');
-		changes.d = selected.getAttribute('d');
-		break;
-	} // switch on element type to get initial values
+  // store initial values that will be affected by reducing the transform list
+  var changes = {}, initial = null, attrs = [];
+  switch (selected.tagName) {
+  case 'line':
+    attrs = ['x1', 'y1', 'x2', 'y2'];
+    break;
+  case 'circle':
+    attrs = ['cx', 'cy', 'r'];
+    break;
+  case 'ellipse':
+    attrs = ['cx', 'cy', 'rx', 'ry'];
+    break;
+  case 'foreignObject':
+  case 'rect':
+  case 'image':
+    attrs = ['width', 'height', 'x', 'y'];
+    break;
+  case 'use':
+  case 'text':
+  case 'tspan':
+    attrs = ['x', 'y'];
+    break;
+  case 'polygon':
+  case 'polyline':
+    initial = {};
+    initial.points = selected.getAttribute('points');
+    var list = selected.points;
+    var len = list.numberOfItems;
+    changes.points = new Array(len);
+    var i;
+    for (i = 0; i < len; ++i) {
+      var pt = list.getItem(i);
+      changes.points[i] = {x: pt.x, y: pt.y};
+    }
+    break;
+  case 'path':
+    initial = {};
+    initial.d = selected.getAttribute('d');
+    changes.d = selected.getAttribute('d');
+    break;
+  } // switch on element type to get initial values
 
-	if (attrs.length) {
-		changes = $(selected).attr(attrs);
-		$.each(changes, function (attr, val) {
-			changes[attr] = svgedit.units.convertToNum(attr, val);
-		});
-	} else if (gsvg) {
-		// GSVG exception
-		changes = {
-			x: $(gsvg).attr('x') || 0,
-			y: $(gsvg).attr('y') || 0
-		};
-	}
+  if (attrs.length) {
+    changes = $(selected).attr(attrs);
+    $.each(changes, function (attr, val) {
+      changes[attr] = svgedit.units.convertToNum(attr, val);
+    });
+  } else if (gsvg) {
+    // GSVG exception
+    changes = {
+      x: $(gsvg).attr('x') || 0,
+      y: $(gsvg).attr('y') || 0
+    };
+  }
 
-	// if we haven't created an initial array in polygon/polyline/path, then
-	// make a copy of initial values and include the transform
-	if (initial == null) {
-		initial = $.extend(true, {}, changes);
-		$.each(initial, function (attr, val) {
-			initial[attr] = svgedit.units.convertToNum(attr, val);
-		});
-	}
-	// save the start transform value too
-	initial.transform = context_.getStartTransform() || '';
+  // if we haven't created an initial array in polygon/polyline/path, then
+  // make a copy of initial values and include the transform
+  if (initial == null) {
+    initial = $.extend(true, {}, changes);
+    $.each(initial, function (attr, val) {
+      initial[attr] = svgedit.units.convertToNum(attr, val);
+    });
+  }
+  // save the start transform value too
+  initial.transform = context_.getStartTransform() || '';
 
-	// if it's a regular group, we have special processing to flatten transforms
-	if ((selected.tagName === 'g' && !gsvg) || selected.tagName === 'a') {
-		var box = svgedit.utilities.getBBox(selected),
-			oldcenter = {x: box.x + box.width / 2, y: box.y + box.height / 2},
-			newcenter = svgedit.math.transformPoint(box.x + box.width / 2,
-				box.y + box.height / 2,
-				svgedit.math.transformListToTransform(tlist).matrix),
-			m = svgroot.createSVGMatrix();
+  // if it's a regular group, we have special processing to flatten transforms
+  if ((selected.tagName === 'g' && !gsvg) || selected.tagName === 'a') {
+    var box = svgedit.utilities.getBBox(selected),
+      oldcenter = {x: box.x + box.width / 2, y: box.y + box.height / 2},
+      newcenter = svgedit.math.transformPoint(box.x + box.width / 2,
+        box.y + box.height / 2,
+        svgedit.math.transformListToTransform(tlist).matrix),
+      m = svgroot.createSVGMatrix();
 
-		// temporarily strip off the rotate and save the old center
-		var gangle = svgedit.utilities.getRotationAngle(selected);
-		if (gangle) {
-			var a = gangle * Math.PI / 180;
-			if (Math.abs(a) > (1.0e-10)) {
-				var s = Math.sin(a) / (1 - Math.cos(a));
-			} else {
-				// FIXME: This blows up if the angle is exactly 0!
-				var s = 2 / a;
-			}
-			var i;
-			for (i = 0; i < tlist.numberOfItems; ++i) {
-				var xform = tlist.getItem(i);
-				if (xform.type === 4) {
-					// extract old center through mystical arts
-					var rm = xform.matrix;
-					oldcenter.y = (s * rm.e + rm.f) / 2;
-					oldcenter.x = (rm.e - s * rm.f) / 2;
-					tlist.removeItem(i);
-					break;
-				}
-			}
-		}
-		var tx = 0, ty = 0,
-			operation = 0,
-			N = tlist.numberOfItems;
+    // temporarily strip off the rotate and save the old center
+    var gangle = svgedit.utilities.getRotationAngle(selected);
+    if (gangle) {
+      var a = gangle * Math.PI / 180;
+      if (Math.abs(a) > (1.0e-10)) {
+        var s = Math.sin(a) / (1 - Math.cos(a));
+      } else {
+        // FIXME: This blows up if the angle is exactly 0!
+        var s = 2 / a;
+      }
+      var i;
+      for (i = 0; i < tlist.numberOfItems; ++i) {
+        var xform = tlist.getItem(i);
+        if (xform.type === 4) {
+          // extract old center through mystical arts
+          var rm = xform.matrix;
+          oldcenter.y = (s * rm.e + rm.f) / 2;
+          oldcenter.x = (rm.e - s * rm.f) / 2;
+          tlist.removeItem(i);
+          break;
+        }
+      }
+    }
+    var tx = 0, ty = 0,
+      operation = 0,
+      N = tlist.numberOfItems;
 
-		if (N) {
-			var firstM = tlist.getItem(0).matrix;
-		}
+    if (N) {
+      var firstM = tlist.getItem(0).matrix;
+    }
 
-		// first, if it was a scale then the second-last transform will be it
-		if (N >= 3 && tlist.getItem(N - 2).type === 3 &&
-			tlist.getItem(N - 3).type === 2 && tlist.getItem(N - 1).type === 2) {
-			operation = 3; // scale
+    // first, if it was a scale then the second-last transform will be it
+    if (N >= 3 && tlist.getItem(N - 2).type === 3 &&
+      tlist.getItem(N - 3).type === 2 && tlist.getItem(N - 1).type === 2) {
+      operation = 3; // scale
 
-			// if the children are unrotated, pass the scale down directly
-			// otherwise pass the equivalent matrix() down directly
-			var tm = tlist.getItem(N - 3).matrix,
-				sm = tlist.getItem(N - 2).matrix,
-				tmn = tlist.getItem(N - 1).matrix;
+      // if the children are unrotated, pass the scale down directly
+      // otherwise pass the equivalent matrix() down directly
+      var tm = tlist.getItem(N - 3).matrix,
+        sm = tlist.getItem(N - 2).matrix,
+        tmn = tlist.getItem(N - 1).matrix;
 
-			var children = selected.childNodes;
-			var c = children.length;
-			while (c--) {
-				var child = children.item(c);
-				tx = 0;
-				ty = 0;
-				if (child.nodeType === 1) {
-					var childTlist = svgedit.transformlist.getTransformList(child);
+      var children = selected.childNodes;
+      var c = children.length;
+      while (c--) {
+        var child = children.item(c);
+        tx = 0;
+        ty = 0;
+        if (child.nodeType === 1) {
+          var childTlist = svgedit.transformlist.getTransformList(child);
 
-					// some children might not have a transform (<metadata>, <defs>, etc)
-					if (!childTlist) { continue; }
+          // some children might not have a transform (<metadata>, <defs>, etc)
+          if (!childTlist) { continue; }
 
-					var m = svgedit.math.transformListToTransform(childTlist).matrix;
+          var m = svgedit.math.transformListToTransform(childTlist).matrix;
 
-					// Convert a matrix to a scale if applicable
-					// if (svgedit.math.hasMatrixTransform(childTlist) && childTlist.numberOfItems == 1) {
-					// 	if (m.b==0 && m.c==0 && m.e==0 && m.f==0) {
-					// 		childTlist.removeItem(0);
-					// 		var translateOrigin = svgroot.createSVGTransform(),
-					// 			scale = svgroot.createSVGTransform(),
-					// 			translateBack = svgroot.createSVGTransform();
-					// 		translateOrigin.setTranslate(0, 0);
-					// 		scale.setScale(m.a, m.d);
-					// 		translateBack.setTranslate(0, 0);
-					// 		childTlist.appendItem(translateBack);
-					// 		childTlist.appendItem(scale);
-					// 		childTlist.appendItem(translateOrigin);
-					// 	}
-					// }
+          // Convert a matrix to a scale if applicable
+          // if (svgedit.math.hasMatrixTransform(childTlist) && childTlist.numberOfItems == 1) {
+          // 	if (m.b==0 && m.c==0 && m.e==0 && m.f==0) {
+          // 		childTlist.removeItem(0);
+          // 		var translateOrigin = svgroot.createSVGTransform(),
+          // 			scale = svgroot.createSVGTransform(),
+          // 			translateBack = svgroot.createSVGTransform();
+          // 		translateOrigin.setTranslate(0, 0);
+          // 		scale.setScale(m.a, m.d);
+          // 		translateBack.setTranslate(0, 0);
+          // 		childTlist.appendItem(translateBack);
+          // 		childTlist.appendItem(scale);
+          // 		childTlist.appendItem(translateOrigin);
+          // 	}
+          // }
 
-					var angle = svgedit.utilities.getRotationAngle(child);
-					var oldStartTransform = context_.getStartTransform();
-					var childxforms = [];
-					context_.setStartTransform(child.getAttribute('transform'));
-					if (angle || svgedit.math.hasMatrixTransform(childTlist)) {
-						var e2t = svgroot.createSVGTransform();
-						e2t.setMatrix(svgedit.math.matrixMultiply(tm, sm, tmn, m));
-						childTlist.clear();
-						childTlist.appendItem(e2t);
-						childxforms.push(e2t);
-					// if not rotated or skewed, push the [T][S][-T] down to the child
-					} else {
-						// update the transform list with translate,scale,translate
+          var angle = svgedit.utilities.getRotationAngle(child);
+          var oldStartTransform = context_.getStartTransform();
+          var childxforms = [];
+          context_.setStartTransform(child.getAttribute('transform'));
+          if (angle || svgedit.math.hasMatrixTransform(childTlist)) {
+            var e2t = svgroot.createSVGTransform();
+            e2t.setMatrix(svgedit.math.matrixMultiply(tm, sm, tmn, m));
+            childTlist.clear();
+            childTlist.appendItem(e2t);
+            childxforms.push(e2t);
+          // if not rotated or skewed, push the [T][S][-T] down to the child
+          } else {
+            // update the transform list with translate,scale,translate
 
-						// slide the [T][S][-T] from the front to the back
-						// [T][S][-T][M] = [M][T2][S2][-T2]
+            // slide the [T][S][-T] from the front to the back
+            // [T][S][-T][M] = [M][T2][S2][-T2]
 
-						// (only bringing [-T] to the right of [M])
-						// [T][S][-T][M] = [T][S][M][-T2]
-						// [-T2] = [M_inv][-T][M]
-						var t2n = svgedit.math.matrixMultiply(m.inverse(), tmn, m);
-						// [T2] is always negative translation of [-T2]
-						var t2 = svgroot.createSVGMatrix();
-						t2.e = -t2n.e;
-						t2.f = -t2n.f;
+            // (only bringing [-T] to the right of [M])
+            // [T][S][-T][M] = [T][S][M][-T2]
+            // [-T2] = [M_inv][-T][M]
+            var t2n = svgedit.math.matrixMultiply(m.inverse(), tmn, m);
+            // [T2] is always negative translation of [-T2]
+            var t2 = svgroot.createSVGMatrix();
+            t2.e = -t2n.e;
+            t2.f = -t2n.f;
 
-						// [T][S][-T][M] = [M][T2][S2][-T2]
-						// [S2] = [T2_inv][M_inv][T][S][-T][M][-T2_inv]
-						var s2 = svgedit.math.matrixMultiply(t2.inverse(), m.inverse(), tm, sm, tmn, m, t2n.inverse());
+            // [T][S][-T][M] = [M][T2][S2][-T2]
+            // [S2] = [T2_inv][M_inv][T][S][-T][M][-T2_inv]
+            var s2 = svgedit.math.matrixMultiply(t2.inverse(), m.inverse(), tm, sm, tmn, m, t2n.inverse());
 
-						var translateOrigin = svgroot.createSVGTransform(),
-							scale = svgroot.createSVGTransform(),
-							translateBack = svgroot.createSVGTransform();
-						translateOrigin.setTranslate(t2n.e, t2n.f);
-						scale.setScale(s2.a, s2.d);
-						translateBack.setTranslate(t2.e, t2.f);
-						childTlist.appendItem(translateBack);
-						childTlist.appendItem(scale);
-						childTlist.appendItem(translateOrigin);
-						childxforms.push(translateBack);
-						childxforms.push(scale);
-						childxforms.push(translateOrigin);
-						// logMatrix(translateBack.matrix);
-						// logMatrix(scale.matrix);
-					} // not rotated
-					batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
-					// TODO: If any <use> have this group as a parent and are
-					// referencing this child, then we need to impose a reverse
-					// scale on it so that when it won't get double-translated
-					// var uses = selected.getElementsByTagNameNS(NS.SVG, 'use');
-					// var href = '#' + child.id;
-					// var u = uses.length;
-					// while (u--) {
-					// 	var useElem = uses.item(u);
-					// 	if (href == svgedit.utilities.getHref(useElem)) {
-					// 		var usexlate = svgroot.createSVGTransform();
-					// 		usexlate.setTranslate(-tx,-ty);
-					// 		svgedit.transformlist.getTransformList(useElem).insertItemBefore(usexlate,0);
-					// 		batchCmd.addSubCommand( svgedit.recalculate.recalculateDimensions(useElem) );
-					// 	}
-					// }
-					context_.setStartTransform(oldStartTransform);
-				} // element
-			} // for each child
-			// Remove these transforms from group
-			tlist.removeItem(N - 1);
-			tlist.removeItem(N - 2);
-			tlist.removeItem(N - 3);
-		} else if (N >= 3 && tlist.getItem(N - 1).type === 1) {
-			operation = 3; // scale
-			m = svgedit.math.transformListToTransform(tlist).matrix;
-			var e2t = svgroot.createSVGTransform();
-			e2t.setMatrix(m);
-			tlist.clear();
-			tlist.appendItem(e2t);
-		// next, check if the first transform was a translate
-		// if we had [ T1 ] [ M ] we want to transform this into [ M ] [ T2 ]
-		// therefore [ T2 ] = [ M_inv ] [ T1 ] [ M ]
-		} else if ((N === 1 || (N > 1 && tlist.getItem(1).type !== 3)) &&
-			tlist.getItem(0).type === 2) {
-			operation = 2; // translate
-			var T_M = svgedit.math.transformListToTransform(tlist).matrix;
-			tlist.removeItem(0);
-			var mInv = svgedit.math.transformListToTransform(tlist).matrix.inverse();
-			var M2 = svgedit.math.matrixMultiply(mInv, T_M);
+            var translateOrigin = svgroot.createSVGTransform(),
+              scale = svgroot.createSVGTransform(),
+              translateBack = svgroot.createSVGTransform();
+            translateOrigin.setTranslate(t2n.e, t2n.f);
+            scale.setScale(s2.a, s2.d);
+            translateBack.setTranslate(t2.e, t2.f);
+            childTlist.appendItem(translateBack);
+            childTlist.appendItem(scale);
+            childTlist.appendItem(translateOrigin);
+            childxforms.push(translateBack);
+            childxforms.push(scale);
+            childxforms.push(translateOrigin);
+            // logMatrix(translateBack.matrix);
+            // logMatrix(scale.matrix);
+          } // not rotated
+          batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
+          // TODO: If any <use> have this group as a parent and are
+          // referencing this child, then we need to impose a reverse
+          // scale on it so that when it won't get double-translated
+          // var uses = selected.getElementsByTagNameNS(NS.SVG, 'use');
+          // var href = '#' + child.id;
+          // var u = uses.length;
+          // while (u--) {
+          // 	var useElem = uses.item(u);
+          // 	if (href == svgedit.utilities.getHref(useElem)) {
+          // 		var usexlate = svgroot.createSVGTransform();
+          // 		usexlate.setTranslate(-tx,-ty);
+          // 		svgedit.transformlist.getTransformList(useElem).insertItemBefore(usexlate,0);
+          // 		batchCmd.addSubCommand( svgedit.recalculate.recalculateDimensions(useElem) );
+          // 	}
+          // }
+          context_.setStartTransform(oldStartTransform);
+        } // element
+      } // for each child
+      // Remove these transforms from group
+      tlist.removeItem(N - 1);
+      tlist.removeItem(N - 2);
+      tlist.removeItem(N - 3);
+    } else if (N >= 3 && tlist.getItem(N - 1).type === 1) {
+      operation = 3; // scale
+      m = svgedit.math.transformListToTransform(tlist).matrix;
+      var e2t = svgroot.createSVGTransform();
+      e2t.setMatrix(m);
+      tlist.clear();
+      tlist.appendItem(e2t);
+    // next, check if the first transform was a translate
+    // if we had [ T1 ] [ M ] we want to transform this into [ M ] [ T2 ]
+    // therefore [ T2 ] = [ M_inv ] [ T1 ] [ M ]
+    } else if ((N === 1 || (N > 1 && tlist.getItem(1).type !== 3)) &&
+      tlist.getItem(0).type === 2) {
+      operation = 2; // translate
+      var T_M = svgedit.math.transformListToTransform(tlist).matrix;
+      tlist.removeItem(0);
+      var mInv = svgedit.math.transformListToTransform(tlist).matrix.inverse();
+      var M2 = svgedit.math.matrixMultiply(mInv, T_M);
 
-			tx = M2.e;
-			ty = M2.f;
+      tx = M2.e;
+      ty = M2.f;
 
-			if (tx !== 0 || ty !== 0) {
-				// we pass the translates down to the individual children
-				var children = selected.childNodes;
-				var c = children.length;
+      if (tx !== 0 || ty !== 0) {
+        // we pass the translates down to the individual children
+        var children = selected.childNodes;
+        var c = children.length;
 
-				var clipPathsDone = [];
+        var clipPathsDone = [];
 
-				while (c--) {
-					var child = children.item(c);
-					if (child.nodeType === 1) {
-						// Check if child has clip-path
-						if (child.getAttribute('clip-path')) {
-							// tx, ty
-							var attr = child.getAttribute('clip-path');
-							if (clipPathsDone.indexOf(attr) === -1) {
-								svgedit.recalculate.updateClipPath(attr, tx, ty);
-								clipPathsDone.push(attr);
-							}
-						}
+        while (c--) {
+          var child = children.item(c);
+          if (child.nodeType === 1) {
+            // Check if child has clip-path
+            if (child.getAttribute('clip-path')) {
+              // tx, ty
+              var attr = child.getAttribute('clip-path');
+              if (clipPathsDone.indexOf(attr) === -1) {
+                svgedit.recalculate.updateClipPath(attr, tx, ty);
+                clipPathsDone.push(attr);
+              }
+            }
 
-						var oldStartTransform = context_.getStartTransform();
-						context_.setStartTransform(child.getAttribute('transform'));
+            var oldStartTransform = context_.getStartTransform();
+            context_.setStartTransform(child.getAttribute('transform'));
 
-						var childTlist = svgedit.transformlist.getTransformList(child);
-						// some children might not have a transform (<metadata>, <defs>, etc)
-						if (childTlist) {
-							var newxlate = svgroot.createSVGTransform();
-							newxlate.setTranslate(tx, ty);
-							if (childTlist.numberOfItems) {
-								childTlist.insertItemBefore(newxlate, 0);
-							} else {
-								childTlist.appendItem(newxlate);
-							}
-							batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
-							// If any <use> have this group as a parent and are
-							// referencing this child, then impose a reverse translate on it
-							// so that when it won't get double-translated
-							var uses = selected.getElementsByTagNameNS(NS.SVG, 'use');
-							var href = '#' + child.id;
-							var u = uses.length;
-							while (u--) {
-								var useElem = uses.item(u);
-								if (href === svgedit.utilities.getHref(useElem)) {
-									var usexlate = svgroot.createSVGTransform();
-									usexlate.setTranslate(-tx, -ty);
-									svgedit.transformlist.getTransformList(useElem).insertItemBefore(usexlate, 0);
-									batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(useElem));
-								}
-							}
-							context_.setStartTransform(oldStartTransform);
-						}
-					}
-				}
+            var childTlist = svgedit.transformlist.getTransformList(child);
+            // some children might not have a transform (<metadata>, <defs>, etc)
+            if (childTlist) {
+              var newxlate = svgroot.createSVGTransform();
+              newxlate.setTranslate(tx, ty);
+              if (childTlist.numberOfItems) {
+                childTlist.insertItemBefore(newxlate, 0);
+              } else {
+                childTlist.appendItem(newxlate);
+              }
+              batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
+              // If any <use> have this group as a parent and are
+              // referencing this child, then impose a reverse translate on it
+              // so that when it won't get double-translated
+              var uses = selected.getElementsByTagNameNS(NS.SVG, 'use');
+              var href = '#' + child.id;
+              var u = uses.length;
+              while (u--) {
+                var useElem = uses.item(u);
+                if (href === svgedit.utilities.getHref(useElem)) {
+                  var usexlate = svgroot.createSVGTransform();
+                  usexlate.setTranslate(-tx, -ty);
+                  svgedit.transformlist.getTransformList(useElem).insertItemBefore(usexlate, 0);
+                  batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(useElem));
+                }
+              }
+              context_.setStartTransform(oldStartTransform);
+            }
+          }
+        }
 
-				clipPathsDone = [];
-				context_.setStartTransform(oldStartTransform);
-			}
-		// else, a matrix imposition from a parent group
-		// keep pushing it down to the children
-		} else if (N === 1 && tlist.getItem(0).type === 1 && !gangle) {
-			operation = 1;
-			var m = tlist.getItem(0).matrix,
-				children = selected.childNodes,
-				c = children.length;
-			while (c--) {
-				var child = children.item(c);
-				if (child.nodeType === 1) {
-					var oldStartTransform = context_.getStartTransform();
-					context_.setStartTransform(child.getAttribute('transform'));
-					var childTlist = svgedit.transformlist.getTransformList(child);
+        clipPathsDone = [];
+        context_.setStartTransform(oldStartTransform);
+      }
+    // else, a matrix imposition from a parent group
+    // keep pushing it down to the children
+    } else if (N === 1 && tlist.getItem(0).type === 1 && !gangle) {
+      operation = 1;
+      var m = tlist.getItem(0).matrix,
+        children = selected.childNodes,
+        c = children.length;
+      while (c--) {
+        var child = children.item(c);
+        if (child.nodeType === 1) {
+          var oldStartTransform = context_.getStartTransform();
+          context_.setStartTransform(child.getAttribute('transform'));
+          var childTlist = svgedit.transformlist.getTransformList(child);
 
-					if (!childTlist) { continue; }
+          if (!childTlist) { continue; }
 
-					var em = svgedit.math.matrixMultiply(m, svgedit.math.transformListToTransform(childTlist).matrix);
-					var e2m = svgroot.createSVGTransform();
-					e2m.setMatrix(em);
-					childTlist.clear();
-					childTlist.appendItem(e2m, 0);
+          var em = svgedit.math.matrixMultiply(m, svgedit.math.transformListToTransform(childTlist).matrix);
+          var e2m = svgroot.createSVGTransform();
+          e2m.setMatrix(em);
+          childTlist.clear();
+          childTlist.appendItem(e2m, 0);
 
-					batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
-					context_.setStartTransform(oldStartTransform);
+          batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
+          context_.setStartTransform(oldStartTransform);
 
-					// Convert stroke
-					// TODO: Find out if this should actually happen somewhere else
-					var sw = child.getAttribute('stroke-width');
-					if (child.getAttribute('stroke') !== 'none' && !isNaN(sw)) {
-						var avg = (Math.abs(em.a) + Math.abs(em.d)) / 2;
-						child.setAttribute('stroke-width', sw * avg);
-					}
-				}
-			}
-			tlist.clear();
-		// else it was just a rotate
-		} else {
-			if (gangle) {
-				var newRot = svgroot.createSVGTransform();
-				newRot.setRotate(gangle, newcenter.x, newcenter.y);
-				if (tlist.numberOfItems) {
-					tlist.insertItemBefore(newRot, 0);
-				} else {
-					tlist.appendItem(newRot);
-				}
-			}
-			if (tlist.numberOfItems === 0) {
-				selected.removeAttribute('transform');
-			}
-			return null;
-		}
+          // Convert stroke
+          // TODO: Find out if this should actually happen somewhere else
+          var sw = child.getAttribute('stroke-width');
+          if (child.getAttribute('stroke') !== 'none' && !isNaN(sw)) {
+            var avg = (Math.abs(em.a) + Math.abs(em.d)) / 2;
+            child.setAttribute('stroke-width', sw * avg);
+          }
+        }
+      }
+      tlist.clear();
+    // else it was just a rotate
+    } else {
+      if (gangle) {
+        var newRot = svgroot.createSVGTransform();
+        newRot.setRotate(gangle, newcenter.x, newcenter.y);
+        if (tlist.numberOfItems) {
+          tlist.insertItemBefore(newRot, 0);
+        } else {
+          tlist.appendItem(newRot);
+        }
+      }
+      if (tlist.numberOfItems === 0) {
+        selected.removeAttribute('transform');
+      }
+      return null;
+    }
 
-		// if it was a translate, put back the rotate at the new center
-		if (operation === 2) {
-			if (gangle) {
-				newcenter = {
-					x: oldcenter.x + firstM.e,
-					y: oldcenter.y + firstM.f
-				};
+    // if it was a translate, put back the rotate at the new center
+    if (operation === 2) {
+      if (gangle) {
+        newcenter = {
+          x: oldcenter.x + firstM.e,
+          y: oldcenter.y + firstM.f
+        };
 
-				var newRot = svgroot.createSVGTransform();
-				newRot.setRotate(gangle, newcenter.x, newcenter.y);
-				if (tlist.numberOfItems) {
-					tlist.insertItemBefore(newRot, 0);
-				} else {
-					tlist.appendItem(newRot);
-				}
-			}
-		// if it was a resize
-		} else if (operation === 3) {
-			var m = svgedit.math.transformListToTransform(tlist).matrix;
-			var roldt = svgroot.createSVGTransform();
-			roldt.setRotate(gangle, oldcenter.x, oldcenter.y);
-			var rold = roldt.matrix;
-			var rnew = svgroot.createSVGTransform();
-			rnew.setRotate(gangle, newcenter.x, newcenter.y);
-			var rnewInv = rnew.matrix.inverse(),
-				mInv = m.inverse(),
-				extrat = svgedit.math.matrixMultiply(mInv, rnewInv, rold, m);
+        var newRot = svgroot.createSVGTransform();
+        newRot.setRotate(gangle, newcenter.x, newcenter.y);
+        if (tlist.numberOfItems) {
+          tlist.insertItemBefore(newRot, 0);
+        } else {
+          tlist.appendItem(newRot);
+        }
+      }
+    // if it was a resize
+    } else if (operation === 3) {
+      var m = svgedit.math.transformListToTransform(tlist).matrix;
+      var roldt = svgroot.createSVGTransform();
+      roldt.setRotate(gangle, oldcenter.x, oldcenter.y);
+      var rold = roldt.matrix;
+      var rnew = svgroot.createSVGTransform();
+      rnew.setRotate(gangle, newcenter.x, newcenter.y);
+      var rnewInv = rnew.matrix.inverse(),
+        mInv = m.inverse(),
+        extrat = svgedit.math.matrixMultiply(mInv, rnewInv, rold, m);
 
-			tx = extrat.e;
-			ty = extrat.f;
+      tx = extrat.e;
+      ty = extrat.f;
 
-			if (tx !== 0 || ty !== 0) {
-				// now push this transform down to the children
-				// we pass the translates down to the individual children
-				var children = selected.childNodes;
-				var c = children.length;
-				while (c--) {
-					var child = children.item(c);
-					if (child.nodeType === 1) {
-						var oldStartTransform = context_.getStartTransform();
-						context_.setStartTransform(child.getAttribute('transform'));
-						var childTlist = svgedit.transformlist.getTransformList(child);
-						var newxlate = svgroot.createSVGTransform();
-						newxlate.setTranslate(tx, ty);
-						if (childTlist.numberOfItems) {
-							childTlist.insertItemBefore(newxlate, 0);
-						} else {
-							childTlist.appendItem(newxlate);
-						}
+      if (tx !== 0 || ty !== 0) {
+        // now push this transform down to the children
+        // we pass the translates down to the individual children
+        var children = selected.childNodes;
+        var c = children.length;
+        while (c--) {
+          var child = children.item(c);
+          if (child.nodeType === 1) {
+            var oldStartTransform = context_.getStartTransform();
+            context_.setStartTransform(child.getAttribute('transform'));
+            var childTlist = svgedit.transformlist.getTransformList(child);
+            var newxlate = svgroot.createSVGTransform();
+            newxlate.setTranslate(tx, ty);
+            if (childTlist.numberOfItems) {
+              childTlist.insertItemBefore(newxlate, 0);
+            } else {
+              childTlist.appendItem(newxlate);
+            }
 
-						batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
-						context_.setStartTransform(oldStartTransform);
-					}
-				}
-			}
+            batchCmd.addSubCommand(svgedit.recalculate.recalculateDimensions(child));
+            context_.setStartTransform(oldStartTransform);
+          }
+        }
+      }
 
-			if (gangle) {
-				if (tlist.numberOfItems) {
-					tlist.insertItemBefore(rnew, 0);
-				} else {
-					tlist.appendItem(rnew);
-				}
-			}
-		}
-	// else, it's a non-group
-	} else {
-		// FIXME: box might be null for some elements (<metadata> etc), need to handle this
-		var box = svgedit.utilities.getBBox(selected);
+      if (gangle) {
+        if (tlist.numberOfItems) {
+          tlist.insertItemBefore(rnew, 0);
+        } else {
+          tlist.appendItem(rnew);
+        }
+      }
+    }
+  // else, it's a non-group
+  } else {
+    // FIXME: box might be null for some elements (<metadata> etc), need to handle this
+    var box = svgedit.utilities.getBBox(selected);
 
-		// Paths (and possbly other shapes) will have no BBox while still in <defs>,
-		// but we still may need to recalculate them (see issue 595).
-		// TODO: Figure out how to get BBox from these elements in case they
-		// have a rotation transform
+    // Paths (and possbly other shapes) will have no BBox while still in <defs>,
+    // but we still may need to recalculate them (see issue 595).
+    // TODO: Figure out how to get BBox from these elements in case they
+    // have a rotation transform
 
-		if (!box && selected.tagName !== 'path') return null;
+    if (!box && selected.tagName !== 'path') return null;
 
-		var m = svgroot.createSVGMatrix(),
-			// temporarily strip off the rotate and save the old center
-			angle = svgedit.utilities.getRotationAngle(selected);
-		if (angle) {
-			var oldcenter = {x: box.x + box.width / 2, y: box.y + box.height / 2},
-				newcenter = svgedit.math.transformPoint(box.x + box.width / 2, box.y + box.height / 2,
-					svgedit.math.transformListToTransform(tlist).matrix);
+    var m = svgroot.createSVGMatrix(),
+      // temporarily strip off the rotate and save the old center
+      angle = svgedit.utilities.getRotationAngle(selected);
+    if (angle) {
+      var oldcenter = {x: box.x + box.width / 2, y: box.y + box.height / 2},
+        newcenter = svgedit.math.transformPoint(box.x + box.width / 2, box.y + box.height / 2,
+          svgedit.math.transformListToTransform(tlist).matrix);
 
-			var a = angle * Math.PI / 180;
-			if (Math.abs(a) > (1.0e-10)) {
-				var s = Math.sin(a) / (1 - Math.cos(a));
-			} else {
-				// FIXME: This blows up if the angle is exactly 0!
-				var s = 2 / a;
-			}
-			for (var i = 0; i < tlist.numberOfItems; ++i) {
-				var xform = tlist.getItem(i);
-				if (xform.type === 4) {
-					// extract old center through mystical arts
-					var rm = xform.matrix;
-					oldcenter.y = (s * rm.e + rm.f) / 2;
-					oldcenter.x = (rm.e - s * rm.f) / 2;
-					tlist.removeItem(i);
-					break;
-				}
-			}
-		}
+      var a = angle * Math.PI / 180;
+      if (Math.abs(a) > (1.0e-10)) {
+        var s = Math.sin(a) / (1 - Math.cos(a));
+      } else {
+        // FIXME: This blows up if the angle is exactly 0!
+        var s = 2 / a;
+      }
+      for (var i = 0; i < tlist.numberOfItems; ++i) {
+        var xform = tlist.getItem(i);
+        if (xform.type === 4) {
+          // extract old center through mystical arts
+          var rm = xform.matrix;
+          oldcenter.y = (s * rm.e + rm.f) / 2;
+          oldcenter.x = (rm.e - s * rm.f) / 2;
+          tlist.removeItem(i);
+          break;
+        }
+      }
+    }
 
-		// 2 = translate, 3 = scale, 4 = rotate, 1 = matrix imposition
-		var operation = 0;
-		var N = tlist.numberOfItems;
+    // 2 = translate, 3 = scale, 4 = rotate, 1 = matrix imposition
+    var operation = 0;
+    var N = tlist.numberOfItems;
 
-		// Check if it has a gradient with userSpaceOnUse, in which case
-		// adjust it by recalculating the matrix transform.
-		// TODO: Make this work in Webkit using svgedit.transformlist.SVGTransformList
-		if (!svgedit.browser.isWebkit()) {
-			var fill = selected.getAttribute('fill');
-			if (fill && fill.indexOf('url(') === 0) {
-				var paint = getRefElem(fill);
-				var type = 'pattern';
-				if (paint.tagName !== type) type = 'gradient';
-				var attrVal = paint.getAttribute(type + 'Units');
-				if (attrVal === 'userSpaceOnUse') {
-					// Update the userSpaceOnUse element
-					m = svgedit.math.transformListToTransform(tlist).matrix;
-					var gtlist = svgedit.transformlist.getTransformList(paint);
-					var gmatrix = svgedit.math.transformListToTransform(gtlist).matrix;
-					m = svgedit.math.matrixMultiply(m, gmatrix);
-					var mStr = 'matrix(' + [m.a, m.b, m.c, m.d, m.e, m.f].join(',') + ')';
-					paint.setAttribute(type + 'Transform', mStr);
-				}
-			}
-		}
+    // Check if it has a gradient with userSpaceOnUse, in which case
+    // adjust it by recalculating the matrix transform.
+    // TODO: Make this work in Webkit using svgedit.transformlist.SVGTransformList
+    if (!svgedit.browser.isWebkit()) {
+      var fill = selected.getAttribute('fill');
+      if (fill && fill.indexOf('url(') === 0) {
+        var paint = getRefElem(fill);
+        var type = 'pattern';
+        if (paint.tagName !== type) type = 'gradient';
+        var attrVal = paint.getAttribute(type + 'Units');
+        if (attrVal === 'userSpaceOnUse') {
+          // Update the userSpaceOnUse element
+          m = svgedit.math.transformListToTransform(tlist).matrix;
+          var gtlist = svgedit.transformlist.getTransformList(paint);
+          var gmatrix = svgedit.math.transformListToTransform(gtlist).matrix;
+          m = svgedit.math.matrixMultiply(m, gmatrix);
+          var mStr = 'matrix(' + [m.a, m.b, m.c, m.d, m.e, m.f].join(',') + ')';
+          paint.setAttribute(type + 'Transform', mStr);
+        }
+      }
+    }
 
-		// first, if it was a scale of a non-skewed element, then the second-last
-		// transform will be the [S]
-		// if we had [M][T][S][T] we want to extract the matrix equivalent of
-		// [T][S][T] and push it down to the element
-		if (N >= 3 && tlist.getItem(N - 2).type === 3 &&
-			tlist.getItem(N - 3).type === 2 && tlist.getItem(N - 1).type === 2) {
-			// Removed this so a <use> with a given [T][S][T] would convert to a matrix.
-			// Is that bad?
-			//	&& selected.nodeName != 'use'
-			operation = 3; // scale
-			m = svgedit.math.transformListToTransform(tlist, N - 3, N - 1).matrix;
-			tlist.removeItem(N - 1);
-			tlist.removeItem(N - 2);
-			tlist.removeItem(N - 3);
-		// if we had [T][S][-T][M], then this was a skewed element being resized
-		// Thus, we simply combine it all into one matrix
-		} else if (N === 4 && tlist.getItem(N - 1).type === 1) {
-			operation = 3; // scale
-			m = svgedit.math.transformListToTransform(tlist).matrix;
-			var e2t = svgroot.createSVGTransform();
-			e2t.setMatrix(m);
-			tlist.clear();
-			tlist.appendItem(e2t);
-			// reset the matrix so that the element is not re-mapped
-			m = svgroot.createSVGMatrix();
-		// if we had [R][T][S][-T][M], then this was a rotated matrix-element
-		// if we had [T1][M] we want to transform this into [M][T2]
-		// therefore [ T2 ] = [ M_inv ] [ T1 ] [ M ] and we can push [T2]
-		// down to the element
-		} else if ((N === 1 || (N > 1 && tlist.getItem(1).type !== 3)) &&
-			tlist.getItem(0).type === 2) {
-			operation = 2; // translate
-			var oldxlate = tlist.getItem(0).matrix,
-				meq = svgedit.math.transformListToTransform(tlist, 1).matrix,
-				meqInv = meq.inverse();
-			m = svgedit.math.matrixMultiply(meqInv, oldxlate, meq);
-			tlist.removeItem(0);
-		// else if this child now has a matrix imposition (from a parent group)
-		// we might be able to simplify
-		} else if (N === 1 && tlist.getItem(0).type === 1 && !angle) {
-			// Remap all point-based elements
-			m = svgedit.math.transformListToTransform(tlist).matrix;
-			switch (selected.tagName) {
-			case 'line':
-				changes = $(selected).attr(['x1', 'y1', 'x2', 'y2']);
-				// Fallthrough
-			case 'polyline':
-			case 'polygon':
-				changes.points = selected.getAttribute('points');
-				if (changes.points) {
-					var list = selected.points;
-					var len = list.numberOfItems;
-					changes.points = new Array(len);
-					for (var i = 0; i < len; ++i) {
-						var pt = list.getItem(i);
-						changes.points[i] = {x: pt.x, y: pt.y};
-					}
-				}
-				// Fallthrough
-			case 'path':
-				changes.d = selected.getAttribute('d');
-				operation = 1;
-				tlist.clear();
-				break;
-			default:
-				break;
-			}
-		// if it was a rotation, put the rotate back and return without a command
-		// (this function has zero work to do for a rotate())
-		} else {
-			operation = 4; // rotation
-			if (angle) {
-				var newRot = svgroot.createSVGTransform();
-				newRot.setRotate(angle, newcenter.x, newcenter.y);
+    // first, if it was a scale of a non-skewed element, then the second-last
+    // transform will be the [S]
+    // if we had [M][T][S][T] we want to extract the matrix equivalent of
+    // [T][S][T] and push it down to the element
+    if (N >= 3 && tlist.getItem(N - 2).type === 3 &&
+      tlist.getItem(N - 3).type === 2 && tlist.getItem(N - 1).type === 2) {
+      // Removed this so a <use> with a given [T][S][T] would convert to a matrix.
+      // Is that bad?
+      //	&& selected.nodeName != 'use'
+      operation = 3; // scale
+      m = svgedit.math.transformListToTransform(tlist, N - 3, N - 1).matrix;
+      tlist.removeItem(N - 1);
+      tlist.removeItem(N - 2);
+      tlist.removeItem(N - 3);
+    // if we had [T][S][-T][M], then this was a skewed element being resized
+    // Thus, we simply combine it all into one matrix
+    } else if (N === 4 && tlist.getItem(N - 1).type === 1) {
+      operation = 3; // scale
+      m = svgedit.math.transformListToTransform(tlist).matrix;
+      var e2t = svgroot.createSVGTransform();
+      e2t.setMatrix(m);
+      tlist.clear();
+      tlist.appendItem(e2t);
+      // reset the matrix so that the element is not re-mapped
+      m = svgroot.createSVGMatrix();
+    // if we had [R][T][S][-T][M], then this was a rotated matrix-element
+    // if we had [T1][M] we want to transform this into [M][T2]
+    // therefore [ T2 ] = [ M_inv ] [ T1 ] [ M ] and we can push [T2]
+    // down to the element
+    } else if ((N === 1 || (N > 1 && tlist.getItem(1).type !== 3)) &&
+      tlist.getItem(0).type === 2) {
+      operation = 2; // translate
+      var oldxlate = tlist.getItem(0).matrix,
+        meq = svgedit.math.transformListToTransform(tlist, 1).matrix,
+        meqInv = meq.inverse();
+      m = svgedit.math.matrixMultiply(meqInv, oldxlate, meq);
+      tlist.removeItem(0);
+    // else if this child now has a matrix imposition (from a parent group)
+    // we might be able to simplify
+    } else if (N === 1 && tlist.getItem(0).type === 1 && !angle) {
+      // Remap all point-based elements
+      m = svgedit.math.transformListToTransform(tlist).matrix;
+      switch (selected.tagName) {
+      case 'line':
+        changes = $(selected).attr(['x1', 'y1', 'x2', 'y2']);
+        // Fallthrough
+      case 'polyline':
+      case 'polygon':
+        changes.points = selected.getAttribute('points');
+        if (changes.points) {
+          var list = selected.points;
+          var len = list.numberOfItems;
+          changes.points = new Array(len);
+          for (var i = 0; i < len; ++i) {
+            var pt = list.getItem(i);
+            changes.points[i] = {x: pt.x, y: pt.y};
+          }
+        }
+        // Fallthrough
+      case 'path':
+        changes.d = selected.getAttribute('d');
+        operation = 1;
+        tlist.clear();
+        break;
+      default:
+        break;
+      }
+    // if it was a rotation, put the rotate back and return without a command
+    // (this function has zero work to do for a rotate())
+    } else {
+      operation = 4; // rotation
+      if (angle) {
+        var newRot = svgroot.createSVGTransform();
+        newRot.setRotate(angle, newcenter.x, newcenter.y);
 
-				if (tlist.numberOfItems) {
-					tlist.insertItemBefore(newRot, 0);
-				} else {
-					tlist.appendItem(newRot);
-				}
-			}
-			if (tlist.numberOfItems === 0) {
-				selected.removeAttribute('transform');
-			}
-			return null;
-		}
+        if (tlist.numberOfItems) {
+          tlist.insertItemBefore(newRot, 0);
+        } else {
+          tlist.appendItem(newRot);
+        }
+      }
+      if (tlist.numberOfItems === 0) {
+        selected.removeAttribute('transform');
+      }
+      return null;
+    }
 
-		// if it was a translate or resize, we need to remap the element and absorb the xform
-		if (operation === 1 || operation === 2 || operation === 3) {
-			svgedit.coords.remapElement(selected, changes, m);
-		} // if we are remapping
+    // if it was a translate or resize, we need to remap the element and absorb the xform
+    if (operation === 1 || operation === 2 || operation === 3) {
+      svgedit.coords.remapElement(selected, changes, m);
+    } // if we are remapping
 
-		// if it was a translate, put back the rotate at the new center
-		if (operation === 2) {
-			if (angle) {
-				if (!svgedit.math.hasMatrixTransform(tlist)) {
-					newcenter = {
-						x: oldcenter.x + m.e,
-						y: oldcenter.y + m.f
-					};
-				}
-				var newRot = svgroot.createSVGTransform();
-				newRot.setRotate(angle, newcenter.x, newcenter.y);
-				if (tlist.numberOfItems) {
-					tlist.insertItemBefore(newRot, 0);
-				} else {
-					tlist.appendItem(newRot);
-				}
-			}
-			// We have special processing for tspans:	Tspans are not transformable
-			// but they can have x,y coordinates (sigh).	Thus, if this was a translate,
-			// on a text element, also translate any tspan children.
-			if (selected.tagName === 'text') {
-				var children = selected.childNodes;
-				var c = children.length;
-				while (c--) {
-					var child = children.item(c);
-					if (child.tagName === 'tspan') {
-						var tspanChanges = {
-							x: $(child).attr('x') || 0,
-							y: $(child).attr('y') || 0
-						};
-						svgedit.coords.remapElement(child, tspanChanges, m);
-					}
-				}
-			}
-		// [Rold][M][T][S][-T] became [Rold][M]
-		// we want it to be [Rnew][M][Tr] where Tr is the
-		// translation required to re-center it
-		// Therefore, [Tr] = [M_inv][Rnew_inv][Rold][M]
-		} else if (operation === 3 && angle) {
-			var m = svgedit.math.transformListToTransform(tlist).matrix;
-			var roldt = svgroot.createSVGTransform();
-			roldt.setRotate(angle, oldcenter.x, oldcenter.y);
-			var rold = roldt.matrix;
-			var rnew = svgroot.createSVGTransform();
-			rnew.setRotate(angle, newcenter.x, newcenter.y);
-			var rnewInv = rnew.matrix.inverse();
-			var mInv = m.inverse();
-			var extrat = svgedit.math.matrixMultiply(mInv, rnewInv, rold, m);
+    // if it was a translate, put back the rotate at the new center
+    if (operation === 2) {
+      if (angle) {
+        if (!svgedit.math.hasMatrixTransform(tlist)) {
+          newcenter = {
+            x: oldcenter.x + m.e,
+            y: oldcenter.y + m.f
+          };
+        }
+        var newRot = svgroot.createSVGTransform();
+        newRot.setRotate(angle, newcenter.x, newcenter.y);
+        if (tlist.numberOfItems) {
+          tlist.insertItemBefore(newRot, 0);
+        } else {
+          tlist.appendItem(newRot);
+        }
+      }
+      // We have special processing for tspans:	Tspans are not transformable
+      // but they can have x,y coordinates (sigh).	Thus, if this was a translate,
+      // on a text element, also translate any tspan children.
+      if (selected.tagName === 'text') {
+        var children = selected.childNodes;
+        var c = children.length;
+        while (c--) {
+          var child = children.item(c);
+          if (child.tagName === 'tspan') {
+            var tspanChanges = {
+              x: $(child).attr('x') || 0,
+              y: $(child).attr('y') || 0
+            };
+            svgedit.coords.remapElement(child, tspanChanges, m);
+          }
+        }
+      }
+    // [Rold][M][T][S][-T] became [Rold][M]
+    // we want it to be [Rnew][M][Tr] where Tr is the
+    // translation required to re-center it
+    // Therefore, [Tr] = [M_inv][Rnew_inv][Rold][M]
+    } else if (operation === 3 && angle) {
+      var m = svgedit.math.transformListToTransform(tlist).matrix;
+      var roldt = svgroot.createSVGTransform();
+      roldt.setRotate(angle, oldcenter.x, oldcenter.y);
+      var rold = roldt.matrix;
+      var rnew = svgroot.createSVGTransform();
+      rnew.setRotate(angle, newcenter.x, newcenter.y);
+      var rnewInv = rnew.matrix.inverse();
+      var mInv = m.inverse();
+      var extrat = svgedit.math.matrixMultiply(mInv, rnewInv, rold, m);
 
-			svgedit.coords.remapElement(selected, changes, extrat);
-			if (angle) {
-				if (tlist.numberOfItems) {
-					tlist.insertItemBefore(rnew, 0);
-				} else {
-					tlist.appendItem(rnew);
-				}
-			}
-		}
-	} // a non-group
+      svgedit.coords.remapElement(selected, changes, extrat);
+      if (angle) {
+        if (tlist.numberOfItems) {
+          tlist.insertItemBefore(rnew, 0);
+        } else {
+          tlist.appendItem(rnew);
+        }
+      }
+    }
+  } // a non-group
 
-	// if the transform list has been emptied, remove it
-	if (tlist.numberOfItems === 0) {
-		selected.removeAttribute('transform');
-	}
+  // if the transform list has been emptied, remove it
+  if (tlist.numberOfItems === 0) {
+    selected.removeAttribute('transform');
+  }
 
-	batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(selected, initial));
+  batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(selected, initial));
 
-	return batchCmd;
+  return batchCmd;
 };
 })();
diff --git a/editor/sanitize.js b/editor/sanitize.js
index 8c237bc3..ac1c864c 100644
--- a/editor/sanitize.js
+++ b/editor/sanitize.js
@@ -19,95 +19,95 @@
 'use strict';
 
 if (!svgedit.sanitize) {
-	svgedit.sanitize = {};
+  svgedit.sanitize = {};
 }
 
 var NS = svgedit.NS,
-	REVERSE_NS = svgedit.getReverseNS();
+  REVERSE_NS = svgedit.getReverseNS();
 
 // this defines which elements and attributes that we support
 var svgWhiteList_ = {
-	// SVG Elements
-	'a': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'mask', 'opacity', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'xlink:href', 'xlink:title'],
-	'circle': ['class', 'clip-path', 'clip-rule', 'cx', 'cy', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'mask', 'opacity', 'r', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
-	'clipPath': ['class', 'clipPathUnits', 'id'],
-	'defs': [],
-	'style': ['type'],
-	'desc': [],
-	'ellipse': ['class', 'clip-path', 'clip-rule', 'cx', 'cy', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'mask', 'opacity', 'requiredFeatures', 'rx', 'ry', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
-	'feGaussianBlur': ['class', 'color-interpolation-filters', 'id', 'requiredFeatures', 'stdDeviation'],
-	'filter': ['class', 'color-interpolation-filters', 'filterRes', 'filterUnits', 'height', 'id', 'primitiveUnits', 'requiredFeatures', 'width', 'x', 'xlink:href', 'y'],
-	'foreignObject': ['class', 'font-size', 'height', 'id', 'opacity', 'requiredFeatures', 'style', 'transform', 'width', 'x', 'y'],
-	'g': ['class', 'clip-path', 'clip-rule', 'id', 'display', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'font-family', 'font-size', 'font-style', 'font-weight', 'text-anchor'],
-	'image': ['class', 'clip-path', 'clip-rule', 'filter', 'height', 'id', 'mask', 'opacity', 'requiredFeatures', 'style', 'systemLanguage', 'transform', 'width', 'x', 'xlink:href', 'xlink:title', 'y'],
-	'line': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'x1', 'x2', 'y1', 'y2'],
-	'linearGradient': ['class', 'id', 'gradientTransform', 'gradientUnits', 'requiredFeatures', 'spreadMethod', 'systemLanguage', 'x1', 'x2', 'xlink:href', 'y1', 'y2'],
-	'marker': ['id', 'class', 'markerHeight', 'markerUnits', 'markerWidth', 'orient', 'preserveAspectRatio', 'refX', 'refY', 'systemLanguage', 'viewBox'],
-	'mask': ['class', 'height', 'id', 'maskContentUnits', 'maskUnits', 'width', 'x', 'y'],
-	'metadata': ['class', 'id'],
-	'path': ['class', 'clip-path', 'clip-rule', 'd', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
-	'pattern': ['class', 'height', 'id', 'patternContentUnits', 'patternTransform', 'patternUnits', 'requiredFeatures', 'style', 'systemLanguage', 'viewBox', 'width', 'x', 'xlink:href', 'y'],
-	'polygon': ['class', 'clip-path', 'clip-rule', 'id', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'class', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'points', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
-	'polyline': ['class', 'clip-path', 'clip-rule', 'id', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'points', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
-	'radialGradient': ['class', 'cx', 'cy', 'fx', 'fy', 'gradientTransform', 'gradientUnits', 'id', 'r', 'requiredFeatures', 'spreadMethod', 'systemLanguage', 'xlink:href'],
-	'rect': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'height', 'id', 'mask', 'opacity', 'requiredFeatures', 'rx', 'ry', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'width', 'x', 'y'],
-	'stop': ['class', 'id', 'offset', 'requiredFeatures', 'stop-color', 'stop-opacity', 'style', 'systemLanguage'],
-	'svg': ['class', 'clip-path', 'clip-rule', 'filter', 'id', 'height', 'mask', 'preserveAspectRatio', 'requiredFeatures', 'style', 'systemLanguage', 'viewBox', 'width', 'x', 'xmlns', 'xmlns:se', 'xmlns:xlink', 'y'],
-	'switch': ['class', 'id', 'requiredFeatures', 'systemLanguage'],
-	'symbol': ['class', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'id', 'opacity', 'preserveAspectRatio', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'viewBox'],
-	'text': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'id', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'text-anchor', 'transform', 'x', 'xml:space', 'y'],
-	'textPath': ['class', 'id', 'method', 'requiredFeatures', 'spacing', 'startOffset', 'style', 'systemLanguage', 'transform', 'xlink:href'],
-	'title': [],
-	'tspan': ['class', 'clip-path', 'clip-rule', 'dx', 'dy', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'id', 'mask', 'opacity', 'requiredFeatures', 'rotate', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'text-anchor', 'textLength', 'transform', 'x', 'xml:space', 'y'],
-	'use': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'height', 'id', 'mask', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'transform', 'width', 'x', 'xlink:href', 'y'],
+  // SVG Elements
+  'a': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'mask', 'opacity', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'xlink:href', 'xlink:title'],
+  'circle': ['class', 'clip-path', 'clip-rule', 'cx', 'cy', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'mask', 'opacity', 'r', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
+  'clipPath': ['class', 'clipPathUnits', 'id'],
+  'defs': [],
+  'style': ['type'],
+  'desc': [],
+  'ellipse': ['class', 'clip-path', 'clip-rule', 'cx', 'cy', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'mask', 'opacity', 'requiredFeatures', 'rx', 'ry', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
+  'feGaussianBlur': ['class', 'color-interpolation-filters', 'id', 'requiredFeatures', 'stdDeviation'],
+  'filter': ['class', 'color-interpolation-filters', 'filterRes', 'filterUnits', 'height', 'id', 'primitiveUnits', 'requiredFeatures', 'width', 'x', 'xlink:href', 'y'],
+  'foreignObject': ['class', 'font-size', 'height', 'id', 'opacity', 'requiredFeatures', 'style', 'transform', 'width', 'x', 'y'],
+  'g': ['class', 'clip-path', 'clip-rule', 'id', 'display', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'font-family', 'font-size', 'font-style', 'font-weight', 'text-anchor'],
+  'image': ['class', 'clip-path', 'clip-rule', 'filter', 'height', 'id', 'mask', 'opacity', 'requiredFeatures', 'style', 'systemLanguage', 'transform', 'width', 'x', 'xlink:href', 'xlink:title', 'y'],
+  'line': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'x1', 'x2', 'y1', 'y2'],
+  'linearGradient': ['class', 'id', 'gradientTransform', 'gradientUnits', 'requiredFeatures', 'spreadMethod', 'systemLanguage', 'x1', 'x2', 'xlink:href', 'y1', 'y2'],
+  'marker': ['id', 'class', 'markerHeight', 'markerUnits', 'markerWidth', 'orient', 'preserveAspectRatio', 'refX', 'refY', 'systemLanguage', 'viewBox'],
+  'mask': ['class', 'height', 'id', 'maskContentUnits', 'maskUnits', 'width', 'x', 'y'],
+  'metadata': ['class', 'id'],
+  'path': ['class', 'clip-path', 'clip-rule', 'd', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
+  'pattern': ['class', 'height', 'id', 'patternContentUnits', 'patternTransform', 'patternUnits', 'requiredFeatures', 'style', 'systemLanguage', 'viewBox', 'width', 'x', 'xlink:href', 'y'],
+  'polygon': ['class', 'clip-path', 'clip-rule', 'id', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'id', 'class', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'points', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
+  'polyline': ['class', 'clip-path', 'clip-rule', 'id', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'opacity', 'points', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform'],
+  'radialGradient': ['class', 'cx', 'cy', 'fx', 'fy', 'gradientTransform', 'gradientUnits', 'id', 'r', 'requiredFeatures', 'spreadMethod', 'systemLanguage', 'xlink:href'],
+  'rect': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'height', 'id', 'mask', 'opacity', 'requiredFeatures', 'rx', 'ry', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'width', 'x', 'y'],
+  'stop': ['class', 'id', 'offset', 'requiredFeatures', 'stop-color', 'stop-opacity', 'style', 'systemLanguage'],
+  'svg': ['class', 'clip-path', 'clip-rule', 'filter', 'id', 'height', 'mask', 'preserveAspectRatio', 'requiredFeatures', 'style', 'systemLanguage', 'viewBox', 'width', 'x', 'xmlns', 'xmlns:se', 'xmlns:xlink', 'y'],
+  'switch': ['class', 'id', 'requiredFeatures', 'systemLanguage'],
+  'symbol': ['class', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'id', 'opacity', 'preserveAspectRatio', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'transform', 'viewBox'],
+  'text': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'id', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'text-anchor', 'transform', 'x', 'xml:space', 'y'],
+  'textPath': ['class', 'id', 'method', 'requiredFeatures', 'spacing', 'startOffset', 'style', 'systemLanguage', 'transform', 'xlink:href'],
+  'title': [],
+  'tspan': ['class', 'clip-path', 'clip-rule', 'dx', 'dy', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'id', 'mask', 'opacity', 'requiredFeatures', 'rotate', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'systemLanguage', 'text-anchor', 'textLength', 'transform', 'x', 'xml:space', 'y'],
+  'use': ['class', 'clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'height', 'id', 'mask', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'style', 'transform', 'width', 'x', 'xlink:href', 'y'],
 
-	// MathML Elements
-	'annotation': ['encoding'],
-	'annotation-xml': ['encoding'],
-	'maction': ['actiontype', 'other', 'selection'],
-	'math': ['class', 'id', 'display', 'xmlns'],
-	'menclose': ['notation'],
-	'merror': [],
-	'mfrac': ['linethickness'],
-	'mi': ['mathvariant'],
-	'mmultiscripts': [],
-	'mn': [],
-	'mo': ['fence', 'lspace', 'maxsize', 'minsize', 'rspace', 'stretchy'],
-	'mover': [],
-	'mpadded': ['lspace', 'width', 'height', 'depth', 'voffset'],
-	'mphantom': [],
-	'mprescripts': [],
-	'mroot': [],
-	'mrow': ['xlink:href', 'xlink:type', 'xmlns:xlink'],
-	'mspace': ['depth', 'height', 'width'],
-	'msqrt': [],
-	'mstyle': ['displaystyle', 'mathbackground', 'mathcolor', 'mathvariant', 'scriptlevel'],
-	'msub': [],
-	'msubsup': [],
-	'msup': [],
-	'mtable': ['align', 'columnalign', 'columnlines', 'columnspacing', 'displaystyle', 'equalcolumns', 'equalrows', 'frame', 'rowalign', 'rowlines', 'rowspacing', 'width'],
-	'mtd': ['columnalign', 'columnspan', 'rowalign', 'rowspan'],
-	'mtext': [],
-	'mtr': ['columnalign', 'rowalign'],
-	'munder': [],
-	'munderover': [],
-	'none': [],
-	'semantics': []
+  // MathML Elements
+  'annotation': ['encoding'],
+  'annotation-xml': ['encoding'],
+  'maction': ['actiontype', 'other', 'selection'],
+  'math': ['class', 'id', 'display', 'xmlns'],
+  'menclose': ['notation'],
+  'merror': [],
+  'mfrac': ['linethickness'],
+  'mi': ['mathvariant'],
+  'mmultiscripts': [],
+  'mn': [],
+  'mo': ['fence', 'lspace', 'maxsize', 'minsize', 'rspace', 'stretchy'],
+  'mover': [],
+  'mpadded': ['lspace', 'width', 'height', 'depth', 'voffset'],
+  'mphantom': [],
+  'mprescripts': [],
+  'mroot': [],
+  'mrow': ['xlink:href', 'xlink:type', 'xmlns:xlink'],
+  'mspace': ['depth', 'height', 'width'],
+  'msqrt': [],
+  'mstyle': ['displaystyle', 'mathbackground', 'mathcolor', 'mathvariant', 'scriptlevel'],
+  'msub': [],
+  'msubsup': [],
+  'msup': [],
+  'mtable': ['align', 'columnalign', 'columnlines', 'columnspacing', 'displaystyle', 'equalcolumns', 'equalrows', 'frame', 'rowalign', 'rowlines', 'rowspacing', 'width'],
+  'mtd': ['columnalign', 'columnspan', 'rowalign', 'rowspan'],
+  'mtext': [],
+  'mtr': ['columnalign', 'rowalign'],
+  'munder': [],
+  'munderover': [],
+  'none': [],
+  'semantics': []
 };
 
 // Produce a Namespace-aware version of svgWhitelist
 var svgWhiteListNS_ = {};
 $.each(svgWhiteList_, function (elt, atts) {
-	var attNS = {};
-	$.each(atts, function (i, att) {
-		if (att.indexOf(':') >= 0) {
-			var v = att.split(':');
-			attNS[v[1]] = NS[(v[0]).toUpperCase()];
-		} else {
-			attNS[att] = att === 'xmlns' ? NS.XMLNS : null;
-		}
-	});
-	svgWhiteListNS_[elt] = attNS;
+  var attNS = {};
+  $.each(atts, function (i, att) {
+    if (att.indexOf(':') >= 0) {
+      var v = att.split(':');
+      attNS[v[1]] = NS[(v[0]).toUpperCase()];
+    } else {
+      attNS[att] = att === 'xmlns' ? NS.XMLNS : null;
+    }
+  });
+  svgWhiteListNS_[elt] = attNS;
 });
 
 // Function: svgedit.sanitize.sanitizeSvg
@@ -117,140 +117,140 @@ $.each(svgWhiteList_, function (elt, atts) {
 // Parameters:
 // node - The DOM element to be checked (we'll also check its children)
 svgedit.sanitize.sanitizeSvg = function (node) {
-	// Cleanup text nodes
-	if (node.nodeType === 3) { // 3 == TEXT_NODE
-		// Trim whitespace
-		node.nodeValue = node.nodeValue.replace(/^\s+|\s+$/g, '');
-		// Remove if empty
-		if (node.nodeValue.length === 0) {
-			node.parentNode.removeChild(node);
-		}
-	}
+  // Cleanup text nodes
+  if (node.nodeType === 3) { // 3 == TEXT_NODE
+    // Trim whitespace
+    node.nodeValue = node.nodeValue.replace(/^\s+|\s+$/g, '');
+    // Remove if empty
+    if (node.nodeValue.length === 0) {
+      node.parentNode.removeChild(node);
+    }
+  }
 
-	// We only care about element nodes.
-	// Automatically return for all non-element nodes, such as comments, etc.
-	if (node.nodeType !== 1) { // 1 == ELEMENT_NODE
-		return;
-	}
+  // We only care about element nodes.
+  // Automatically return for all non-element nodes, such as comments, etc.
+  if (node.nodeType !== 1) { // 1 == ELEMENT_NODE
+    return;
+  }
 
-	var doc = node.ownerDocument;
-	var parent = node.parentNode;
-	// can parent ever be null here?	I think the root node's parent is the document...
-	if (!doc || !parent) {
-		return;
-	}
+  var doc = node.ownerDocument;
+  var parent = node.parentNode;
+  // can parent ever be null here?	I think the root node's parent is the document...
+  if (!doc || !parent) {
+    return;
+  }
 
-	var allowedAttrs = svgWhiteList_[node.nodeName];
-	var allowedAttrsNS = svgWhiteListNS_[node.nodeName];
-	var i;
-	// if this element is supported, sanitize it
-	if (typeof allowedAttrs !== 'undefined') {
-		var seAttrs = [];
-		i = node.attributes.length;
-		while (i--) {
-			// if the attribute is not in our whitelist, then remove it
-			// could use jQuery's inArray(), but I don't know if that's any better
-			var attr = node.attributes.item(i);
-			var attrName = attr.nodeName;
-			var attrLocalName = attr.localName;
-			var attrNsURI = attr.namespaceURI;
-			// Check that an attribute with the correct localName in the correct namespace is on
-			// our whitelist or is a namespace declaration for one of our allowed namespaces
-			if (!(allowedAttrsNS.hasOwnProperty(attrLocalName) && attrNsURI === allowedAttrsNS[attrLocalName] && attrNsURI !== NS.XMLNS) &&
-				!(attrNsURI === NS.XMLNS && REVERSE_NS[attr.value])) {
-				// TODO(codedread): Programmatically add the se: attributes to the NS-aware whitelist.
-				// Bypassing the whitelist to allow se: prefixes.
-				// Is there a more appropriate way to do this?
-				if (attrName.indexOf('se:') === 0 || attrName.indexOf('data-') === 0) {
-					seAttrs.push([attrName, attr.value]);
-				}
-				node.removeAttributeNS(attrNsURI, attrLocalName);
-			}
+  var allowedAttrs = svgWhiteList_[node.nodeName];
+  var allowedAttrsNS = svgWhiteListNS_[node.nodeName];
+  var i;
+  // if this element is supported, sanitize it
+  if (typeof allowedAttrs !== 'undefined') {
+    var seAttrs = [];
+    i = node.attributes.length;
+    while (i--) {
+      // if the attribute is not in our whitelist, then remove it
+      // could use jQuery's inArray(), but I don't know if that's any better
+      var attr = node.attributes.item(i);
+      var attrName = attr.nodeName;
+      var attrLocalName = attr.localName;
+      var attrNsURI = attr.namespaceURI;
+      // Check that an attribute with the correct localName in the correct namespace is on
+      // our whitelist or is a namespace declaration for one of our allowed namespaces
+      if (!(allowedAttrsNS.hasOwnProperty(attrLocalName) && attrNsURI === allowedAttrsNS[attrLocalName] && attrNsURI !== NS.XMLNS) &&
+        !(attrNsURI === NS.XMLNS && REVERSE_NS[attr.value])) {
+        // TODO(codedread): Programmatically add the se: attributes to the NS-aware whitelist.
+        // Bypassing the whitelist to allow se: prefixes.
+        // Is there a more appropriate way to do this?
+        if (attrName.indexOf('se:') === 0 || attrName.indexOf('data-') === 0) {
+          seAttrs.push([attrName, attr.value]);
+        }
+        node.removeAttributeNS(attrNsURI, attrLocalName);
+      }
 
-			// Add spaces before negative signs where necessary
-			if (svgedit.browser.isGecko()) {
-				switch (attrName) {
-				case 'transform':
-				case 'gradientTransform':
-				case 'patternTransform':
-					var val = attr.value.replace(/(\d)-/g, '$1 -');
-					node.setAttribute(attrName, val);
-					break;
-				}
-			}
+      // Add spaces before negative signs where necessary
+      if (svgedit.browser.isGecko()) {
+        switch (attrName) {
+        case 'transform':
+        case 'gradientTransform':
+        case 'patternTransform':
+          var val = attr.value.replace(/(\d)-/g, '$1 -');
+          node.setAttribute(attrName, val);
+          break;
+        }
+      }
 
-			// For the style attribute, rewrite it in terms of XML presentational attributes
-			if (attrName === 'style') {
-				var props = attr.value.split(';'),
-					p = props.length;
-				while (p--) {
-					var nv = props[p].split(':');
-					var styleAttrName = $.trim(nv[0]);
-					var styleAttrVal = $.trim(nv[1]);
-					// Now check that this attribute is supported
-					if (allowedAttrs.indexOf(styleAttrName) >= 0) {
-						node.setAttribute(styleAttrName, styleAttrVal);
-					}
-				}
-				node.removeAttribute('style');
-			}
-		}
+      // For the style attribute, rewrite it in terms of XML presentational attributes
+      if (attrName === 'style') {
+        var props = attr.value.split(';'),
+          p = props.length;
+        while (p--) {
+          var nv = props[p].split(':');
+          var styleAttrName = $.trim(nv[0]);
+          var styleAttrVal = $.trim(nv[1]);
+          // Now check that this attribute is supported
+          if (allowedAttrs.indexOf(styleAttrName) >= 0) {
+            node.setAttribute(styleAttrName, styleAttrVal);
+          }
+        }
+        node.removeAttribute('style');
+      }
+    }
 
-		$.each(seAttrs, function (i, attr) {
-			node.setAttributeNS(NS.SE, attr[0], attr[1]);
-		});
+    $.each(seAttrs, function (i, attr) {
+      node.setAttributeNS(NS.SE, attr[0], attr[1]);
+    });
 
-		// for some elements that have a xlink:href, ensure the URI refers to a local element
-		// (but not for links)
-		var href = svgedit.utilities.getHref(node);
-		if (href &&
-			['filter', 'linearGradient', 'pattern',
-				'radialGradient', 'textPath', 'use'].indexOf(node.nodeName) >= 0) {
-			// TODO: we simply check if the first character is a #, is this bullet-proof?
-			if (href[0] !== '#') {
-				// remove the attribute (but keep the element)
-				svgedit.utilities.setHref(node, '');
-				node.removeAttributeNS(NS.XLINK, 'href');
-			}
-		}
+    // for some elements that have a xlink:href, ensure the URI refers to a local element
+    // (but not for links)
+    var href = svgedit.utilities.getHref(node);
+    if (href &&
+      ['filter', 'linearGradient', 'pattern',
+        'radialGradient', 'textPath', 'use'].indexOf(node.nodeName) >= 0) {
+      // TODO: we simply check if the first character is a #, is this bullet-proof?
+      if (href[0] !== '#') {
+        // remove the attribute (but keep the element)
+        svgedit.utilities.setHref(node, '');
+        node.removeAttributeNS(NS.XLINK, 'href');
+      }
+    }
 
-		// Safari crashes on a <use> without a xlink:href, so we just remove the node here
-		if (node.nodeName === 'use' && !svgedit.utilities.getHref(node)) {
-			parent.removeChild(node);
-			return;
-		}
-		// if the element has attributes pointing to a non-local reference,
-		// need to remove the attribute
-		$.each(['clip-path', 'fill', 'filter', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'stroke'], function (i, attr) {
-			var val = node.getAttribute(attr);
-			if (val) {
-				val = svgedit.utilities.getUrlFromAttr(val);
-				// simply check for first character being a '#'
-				if (val && val[0] !== '#') {
-					node.setAttribute(attr, '');
-					node.removeAttribute(attr);
-				}
-			}
-		});
+    // Safari crashes on a <use> without a xlink:href, so we just remove the node here
+    if (node.nodeName === 'use' && !svgedit.utilities.getHref(node)) {
+      parent.removeChild(node);
+      return;
+    }
+    // if the element has attributes pointing to a non-local reference,
+    // need to remove the attribute
+    $.each(['clip-path', 'fill', 'filter', 'marker-end', 'marker-mid', 'marker-start', 'mask', 'stroke'], function (i, attr) {
+      var val = node.getAttribute(attr);
+      if (val) {
+        val = svgedit.utilities.getUrlFromAttr(val);
+        // simply check for first character being a '#'
+        if (val && val[0] !== '#') {
+          node.setAttribute(attr, '');
+          node.removeAttribute(attr);
+        }
+      }
+    });
 
-		// recurse to children
-		i = node.childNodes.length;
-		while (i--) { svgedit.sanitize.sanitizeSvg(node.childNodes.item(i)); }
-	// else (element not supported), remove it
-	} else {
-		// remove all children from this node and insert them before this node
-		// FIXME: in the case of animation elements this will hardly ever be correct
-		var children = [];
-		while (node.hasChildNodes()) {
-			children.push(parent.insertBefore(node.firstChild, node));
-		}
+    // recurse to children
+    i = node.childNodes.length;
+    while (i--) { svgedit.sanitize.sanitizeSvg(node.childNodes.item(i)); }
+  // else (element not supported), remove it
+  } else {
+    // remove all children from this node and insert them before this node
+    // FIXME: in the case of animation elements this will hardly ever be correct
+    var children = [];
+    while (node.hasChildNodes()) {
+      children.push(parent.insertBefore(node.firstChild, node));
+    }
 
-		// remove this node from the document altogether
-		parent.removeChild(node);
+    // remove this node from the document altogether
+    parent.removeChild(node);
 
-		// call sanitizeSvg on each of those children
-		i = children.length;
-		while (i--) { svgedit.sanitize.sanitizeSvg(children[i]); }
-	}
+    // call sanitizeSvg on each of those children
+    i = children.length;
+    while (i--) { svgedit.sanitize.sanitizeSvg(children[i]); }
+  }
 };
 }());
diff --git a/editor/select.js b/editor/select.js
index 661bd863..43ed97e7 100644
--- a/editor/select.js
+++ b/editor/select.js
@@ -20,7 +20,7 @@
 'use strict';
 
 if (!svgedit.select) {
-	svgedit.select = {};
+  svgedit.select = {};
 }
 
 var svgFactory_;
@@ -36,50 +36,50 @@ var gripRadius = svgedit.browser.isTouch() ? 10 : 4;
 // elem - DOM element associated with this selector
 // bbox - Optional bbox to use for initialization (prevents duplicate getBBox call).
 svgedit.select.Selector = function (id, elem, bbox) {
-	// this is the selector's unique number
-	this.id = id;
+  // this is the selector's unique number
+  this.id = id;
 
-	// this holds a reference to the element for which this selector is being used
-	this.selectedElement = elem;
+  // this holds a reference to the element for which this selector is being used
+  this.selectedElement = elem;
 
-	// this is a flag used internally to track whether the selector is being used or not
-	this.locked = true;
+  // this is a flag used internally to track whether the selector is being used or not
+  this.locked = true;
 
-	// this holds a reference to the <g> element that holds all visual elements of the selector
-	this.selectorGroup = svgFactory_.createSVGElement({
-		'element': 'g',
-		'attr': {'id': ('selectorGroup' + this.id)}
-	});
+  // this holds a reference to the <g> element that holds all visual elements of the selector
+  this.selectorGroup = svgFactory_.createSVGElement({
+    'element': 'g',
+    'attr': {'id': ('selectorGroup' + this.id)}
+  });
 
-	// this holds a reference to the path rect
-	this.selectorRect = this.selectorGroup.appendChild(
-		svgFactory_.createSVGElement({
-			'element': 'path',
-			'attr': {
-				'id': ('selectedBox' + this.id),
-				'fill': 'none',
-				'stroke': '#22C',
-				'stroke-width': '1',
-				'stroke-dasharray': '5,5',
-				// need to specify this so that the rect is not selectable
-				'style': 'pointer-events:none'
-			}
-		})
-	);
+  // this holds a reference to the path rect
+  this.selectorRect = this.selectorGroup.appendChild(
+    svgFactory_.createSVGElement({
+      'element': 'path',
+      'attr': {
+        'id': ('selectedBox' + this.id),
+        'fill': 'none',
+        'stroke': '#22C',
+        'stroke-width': '1',
+        'stroke-dasharray': '5,5',
+        // need to specify this so that the rect is not selectable
+        'style': 'pointer-events:none'
+      }
+    })
+  );
 
-	// this holds a reference to the grip coordinates for this selector
-	this.gripCoords = {
-		'nw': null,
-		'n': null,
-		'ne': null,
-		'e': null,
-		'se': null,
-		's': null,
-		'sw': null,
-		'w': null
-	};
+  // this holds a reference to the grip coordinates for this selector
+  this.gripCoords = {
+    'nw': null,
+    'n': null,
+    'ne': null,
+    'e': null,
+    'se': null,
+    's': null,
+    'sw': null,
+    'w': null
+  };
 
-	this.reset(this.selectedElement, bbox);
+  this.reset(this.selectedElement, bbox);
 };
 
 // Function: svgedit.select.Selector.reset
@@ -89,10 +89,10 @@ svgedit.select.Selector = function (id, elem, bbox) {
 // e - DOM element associated with this selector
 // bbox - Optional bbox to use for reset (prevents duplicate getBBox call).
 svgedit.select.Selector.prototype.reset = function (e, bbox) {
-	this.locked = true;
-	this.selectedElement = e;
-	this.resize(bbox);
-	this.selectorGroup.setAttribute('display', 'inline');
+  this.locked = true;
+  this.selectedElement = e;
+  this.resize(bbox);
+  this.selectorGroup.setAttribute('display', 'inline');
 };
 
 // Function: svgedit.select.Selector.updateGripCursors
@@ -101,22 +101,22 @@ svgedit.select.Selector.prototype.reset = function (e, bbox) {
 // Parameters:
 // angle - Float indicating current rotation angle in degrees
 svgedit.select.Selector.prototype.updateGripCursors = function (angle) {
-	var dir,
-		dirArr = [],
-		steps = Math.round(angle / 45);
-	if (steps < 0) { steps += 8; }
-	for (dir in selectorManager_.selectorGrips) {
-		dirArr.push(dir);
-	}
-	while (steps > 0) {
-		dirArr.push(dirArr.shift());
-		steps--;
-	}
-	var i = 0;
-	for (dir in selectorManager_.selectorGrips) {
-		selectorManager_.selectorGrips[dir].setAttribute('style', ('cursor:' + dirArr[i] + '-resize'));
-		i++;
-	}
+  var dir,
+    dirArr = [],
+    steps = Math.round(angle / 45);
+  if (steps < 0) { steps += 8; }
+  for (dir in selectorManager_.selectorGrips) {
+    dirArr.push(dir);
+  }
+  while (steps > 0) {
+    dirArr.push(dirArr.shift());
+    steps--;
+  }
+  var i = 0;
+  for (dir in selectorManager_.selectorGrips) {
+    selectorManager_.selectorGrips[dir].setAttribute('style', ('cursor:' + dirArr[i] + '-resize'));
+    i++;
+  }
 };
 
 // Function: svgedit.select.Selector.showGrips
@@ -125,292 +125,292 @@ svgedit.select.Selector.prototype.updateGripCursors = function (angle) {
 // Parameters:
 // show - boolean indicating whether grips should be shown or not
 svgedit.select.Selector.prototype.showGrips = function (show) {
-	var bShow = show ? 'inline' : 'none';
-	selectorManager_.selectorGripsGroup.setAttribute('display', bShow);
-	var elem = this.selectedElement;
-	this.hasGrips = show;
-	if (elem && show) {
-		this.selectorGroup.appendChild(selectorManager_.selectorGripsGroup);
-		this.updateGripCursors(svgedit.utilities.getRotationAngle(elem));
-	}
+  var bShow = show ? 'inline' : 'none';
+  selectorManager_.selectorGripsGroup.setAttribute('display', bShow);
+  var elem = this.selectedElement;
+  this.hasGrips = show;
+  if (elem && show) {
+    this.selectorGroup.appendChild(selectorManager_.selectorGripsGroup);
+    this.updateGripCursors(svgedit.utilities.getRotationAngle(elem));
+  }
 };
 
 // Function: svgedit.select.Selector.resize
 // Updates the selector to match the element's size
 // bbox - Optional bbox to use for resize (prevents duplicate getBBox call).
 svgedit.select.Selector.prototype.resize = function (bbox) {
-	var selectedBox = this.selectorRect,
-		mgr = selectorManager_,
-		selectedGrips = mgr.selectorGrips,
-		selected = this.selectedElement,
-		sw = selected.getAttribute('stroke-width'),
-		currentZoom = svgFactory_.currentZoom();
-	var offset = 1 / currentZoom;
-	if (selected.getAttribute('stroke') !== 'none' && !isNaN(sw)) {
-		offset += (sw / 2);
-	}
+  var selectedBox = this.selectorRect,
+    mgr = selectorManager_,
+    selectedGrips = mgr.selectorGrips,
+    selected = this.selectedElement,
+    sw = selected.getAttribute('stroke-width'),
+    currentZoom = svgFactory_.currentZoom();
+  var offset = 1 / currentZoom;
+  if (selected.getAttribute('stroke') !== 'none' && !isNaN(sw)) {
+    offset += (sw / 2);
+  }
 
-	var tagName = selected.tagName;
-	if (tagName === 'text') {
-		offset += 2 / currentZoom;
-	}
+  var tagName = selected.tagName;
+  if (tagName === 'text') {
+    offset += 2 / currentZoom;
+  }
 
-	// loop and transform our bounding box until we reach our first rotation
-	var tlist = svgedit.transformlist.getTransformList(selected);
-	var m = svgedit.math.transformListToTransform(tlist).matrix;
+  // loop and transform our bounding box until we reach our first rotation
+  var tlist = svgedit.transformlist.getTransformList(selected);
+  var m = svgedit.math.transformListToTransform(tlist).matrix;
 
-	// This should probably be handled somewhere else, but for now
-	// it keeps the selection box correctly positioned when zoomed
-	m.e *= currentZoom;
-	m.f *= currentZoom;
+  // This should probably be handled somewhere else, but for now
+  // it keeps the selection box correctly positioned when zoomed
+  m.e *= currentZoom;
+  m.f *= currentZoom;
 
-	if (!bbox) {
-		bbox = svgedit.utilities.getBBox(selected);
-	}
-	// TODO: svgedit.utilities.getBBox (previous line) already knows to call getStrokedBBox when tagName === 'g'. Remove this?
-	// TODO: svgedit.utilities.getBBox doesn't exclude 'gsvg' and calls getStrokedBBox for any 'g'. Should getBBox be updated?
-	if (tagName === 'g' && !$.data(selected, 'gsvg')) {
-		// The bbox for a group does not include stroke vals, so we
-		// get the bbox based on its children.
-		var strokedBbox = svgFactory_.getStrokedBBox(selected.childNodes);
-		if (strokedBbox) {
-			bbox = strokedBbox;
-		}
-	}
+  if (!bbox) {
+    bbox = svgedit.utilities.getBBox(selected);
+  }
+  // TODO: svgedit.utilities.getBBox (previous line) already knows to call getStrokedBBox when tagName === 'g'. Remove this?
+  // TODO: svgedit.utilities.getBBox doesn't exclude 'gsvg' and calls getStrokedBBox for any 'g'. Should getBBox be updated?
+  if (tagName === 'g' && !$.data(selected, 'gsvg')) {
+    // The bbox for a group does not include stroke vals, so we
+    // get the bbox based on its children.
+    var strokedBbox = svgFactory_.getStrokedBBox(selected.childNodes);
+    if (strokedBbox) {
+      bbox = strokedBbox;
+    }
+  }
 
-	// apply the transforms
-	var l = bbox.x, t = bbox.y, w = bbox.width, h = bbox.height;
-	bbox = {x: l, y: t, width: w, height: h};
+  // apply the transforms
+  var l = bbox.x, t = bbox.y, w = bbox.width, h = bbox.height;
+  bbox = {x: l, y: t, width: w, height: h};
 
-	// we need to handle temporary transforms too
-	// if skewed, get its transformed box, then find its axis-aligned bbox
+  // we need to handle temporary transforms too
+  // if skewed, get its transformed box, then find its axis-aligned bbox
 
-	// *
-	offset *= currentZoom;
+  // *
+  offset *= currentZoom;
 
-	var nbox = svgedit.math.transformBox(l * currentZoom, t * currentZoom, w * currentZoom, h * currentZoom, m),
-		aabox = nbox.aabox,
-		nbax = aabox.x - offset,
-		nbay = aabox.y - offset,
-		nbaw = aabox.width + (offset * 2),
-		nbah = aabox.height + (offset * 2);
+  var nbox = svgedit.math.transformBox(l * currentZoom, t * currentZoom, w * currentZoom, h * currentZoom, m),
+    aabox = nbox.aabox,
+    nbax = aabox.x - offset,
+    nbay = aabox.y - offset,
+    nbaw = aabox.width + (offset * 2),
+    nbah = aabox.height + (offset * 2);
 
-	// now if the shape is rotated, un-rotate it
-	var cx = nbax + nbaw / 2,
-		cy = nbay + nbah / 2;
+  // now if the shape is rotated, un-rotate it
+  var cx = nbax + nbaw / 2,
+    cy = nbay + nbah / 2;
 
-	var angle = svgedit.utilities.getRotationAngle(selected);
-	if (angle) {
-		var rot = svgFactory_.svgRoot().createSVGTransform();
-		rot.setRotate(-angle, cx, cy);
-		var rotm = rot.matrix;
-		nbox.tl = svgedit.math.transformPoint(nbox.tl.x, nbox.tl.y, rotm);
-		nbox.tr = svgedit.math.transformPoint(nbox.tr.x, nbox.tr.y, rotm);
-		nbox.bl = svgedit.math.transformPoint(nbox.bl.x, nbox.bl.y, rotm);
-		nbox.br = svgedit.math.transformPoint(nbox.br.x, nbox.br.y, rotm);
+  var angle = svgedit.utilities.getRotationAngle(selected);
+  if (angle) {
+    var rot = svgFactory_.svgRoot().createSVGTransform();
+    rot.setRotate(-angle, cx, cy);
+    var rotm = rot.matrix;
+    nbox.tl = svgedit.math.transformPoint(nbox.tl.x, nbox.tl.y, rotm);
+    nbox.tr = svgedit.math.transformPoint(nbox.tr.x, nbox.tr.y, rotm);
+    nbox.bl = svgedit.math.transformPoint(nbox.bl.x, nbox.bl.y, rotm);
+    nbox.br = svgedit.math.transformPoint(nbox.br.x, nbox.br.y, rotm);
 
-		// calculate the axis-aligned bbox
-		var tl = nbox.tl;
-		var minx = tl.x,
-			miny = tl.y,
-			maxx = tl.x,
-			maxy = tl.y;
+    // calculate the axis-aligned bbox
+    var tl = nbox.tl;
+    var minx = tl.x,
+      miny = tl.y,
+      maxx = tl.x,
+      maxy = tl.y;
 
-		var min = Math.min, max = Math.max;
+    var min = Math.min, max = Math.max;
 
-		minx = min(minx, min(nbox.tr.x, min(nbox.bl.x, nbox.br.x))) - offset;
-		miny = min(miny, min(nbox.tr.y, min(nbox.bl.y, nbox.br.y))) - offset;
-		maxx = max(maxx, max(nbox.tr.x, max(nbox.bl.x, nbox.br.x))) + offset;
-		maxy = max(maxy, max(nbox.tr.y, max(nbox.bl.y, nbox.br.y))) + offset;
+    minx = min(minx, min(nbox.tr.x, min(nbox.bl.x, nbox.br.x))) - offset;
+    miny = min(miny, min(nbox.tr.y, min(nbox.bl.y, nbox.br.y))) - offset;
+    maxx = max(maxx, max(nbox.tr.x, max(nbox.bl.x, nbox.br.x))) + offset;
+    maxy = max(maxy, max(nbox.tr.y, max(nbox.bl.y, nbox.br.y))) + offset;
 
-		nbax = minx;
-		nbay = miny;
-		nbaw = (maxx - minx);
-		nbah = (maxy - miny);
-	}
+    nbax = minx;
+    nbay = miny;
+    nbaw = (maxx - minx);
+    nbah = (maxy - miny);
+  }
 
-	var dstr = 'M' + nbax + ',' + nbay +
-		' L' + (nbax + nbaw) + ',' + nbay +
-		' ' + (nbax + nbaw) + ',' + (nbay + nbah) +
-		' ' + nbax + ',' + (nbay + nbah) + 'z';
-	selectedBox.setAttribute('d', dstr);
+  var dstr = 'M' + nbax + ',' + nbay +
+    ' L' + (nbax + nbaw) + ',' + nbay +
+    ' ' + (nbax + nbaw) + ',' + (nbay + nbah) +
+    ' ' + nbax + ',' + (nbay + nbah) + 'z';
+  selectedBox.setAttribute('d', dstr);
 
-	var xform = angle ? 'rotate(' + [angle, cx, cy].join(',') + ')' : '';
-	this.selectorGroup.setAttribute('transform', xform);
+  var xform = angle ? 'rotate(' + [angle, cx, cy].join(',') + ')' : '';
+  this.selectorGroup.setAttribute('transform', xform);
 
-	// TODO(codedread): Is this if needed?
-	//	if (selected === selectedElements[0]) {
-	this.gripCoords = {
-		'nw': [nbax, nbay],
-		'ne': [nbax + nbaw, nbay],
-		'sw': [nbax, nbay + nbah],
-		'se': [nbax + nbaw, nbay + nbah],
-		'n': [nbax + (nbaw) / 2, nbay],
-		'w': [nbax, nbay + (nbah) / 2],
-		'e': [nbax + nbaw, nbay + (nbah) / 2],
-		's': [nbax + (nbaw) / 2, nbay + nbah]
-	};
-	var dir;
-	for (dir in this.gripCoords) {
-		var coords = this.gripCoords[dir];
-		selectedGrips[dir].setAttribute('cx', coords[0]);
-		selectedGrips[dir].setAttribute('cy', coords[1]);
-	}
+  // TODO(codedread): Is this if needed?
+  //	if (selected === selectedElements[0]) {
+  this.gripCoords = {
+    'nw': [nbax, nbay],
+    'ne': [nbax + nbaw, nbay],
+    'sw': [nbax, nbay + nbah],
+    'se': [nbax + nbaw, nbay + nbah],
+    'n': [nbax + (nbaw) / 2, nbay],
+    'w': [nbax, nbay + (nbah) / 2],
+    'e': [nbax + nbaw, nbay + (nbah) / 2],
+    's': [nbax + (nbaw) / 2, nbay + nbah]
+  };
+  var dir;
+  for (dir in this.gripCoords) {
+    var coords = this.gripCoords[dir];
+    selectedGrips[dir].setAttribute('cx', coords[0]);
+    selectedGrips[dir].setAttribute('cy', coords[1]);
+  }
 
-	// we want to go 20 pixels in the negative transformed y direction, ignoring scale
-	mgr.rotateGripConnector.setAttribute('x1', nbax + (nbaw) / 2);
-	mgr.rotateGripConnector.setAttribute('y1', nbay);
-	mgr.rotateGripConnector.setAttribute('x2', nbax + (nbaw) / 2);
-	mgr.rotateGripConnector.setAttribute('y2', nbay - (gripRadius * 5));
+  // we want to go 20 pixels in the negative transformed y direction, ignoring scale
+  mgr.rotateGripConnector.setAttribute('x1', nbax + (nbaw) / 2);
+  mgr.rotateGripConnector.setAttribute('y1', nbay);
+  mgr.rotateGripConnector.setAttribute('x2', nbax + (nbaw) / 2);
+  mgr.rotateGripConnector.setAttribute('y2', nbay - (gripRadius * 5));
 
-	mgr.rotateGrip.setAttribute('cx', nbax + (nbaw) / 2);
-	mgr.rotateGrip.setAttribute('cy', nbay - (gripRadius * 5));
-	// }
+  mgr.rotateGrip.setAttribute('cx', nbax + (nbaw) / 2);
+  mgr.rotateGrip.setAttribute('cy', nbay - (gripRadius * 5));
+  // }
 };
 
 // Class: svgedit.select.SelectorManager
 svgedit.select.SelectorManager = function () {
-	// this will hold the <g> element that contains all selector rects/grips
-	this.selectorParentGroup = null;
+  // this will hold the <g> element that contains all selector rects/grips
+  this.selectorParentGroup = null;
 
-	// this is a special rect that is used for multi-select
-	this.rubberBandBox = null;
+  // this is a special rect that is used for multi-select
+  this.rubberBandBox = null;
 
-	// this will hold objects of type svgedit.select.Selector (see above)
-	this.selectors = [];
+  // this will hold objects of type svgedit.select.Selector (see above)
+  this.selectors = [];
 
-	// this holds a map of SVG elements to their Selector object
-	this.selectorMap = {};
+  // this holds a map of SVG elements to their Selector object
+  this.selectorMap = {};
 
-	// this holds a reference to the grip elements
-	this.selectorGrips = {
-		'nw': null,
-		'n': null,
-		'ne': null,
-		'e': null,
-		'se': null,
-		's': null,
-		'sw': null,
-		'w': null
-	};
+  // this holds a reference to the grip elements
+  this.selectorGrips = {
+    'nw': null,
+    'n': null,
+    'ne': null,
+    'e': null,
+    'se': null,
+    's': null,
+    'sw': null,
+    'w': null
+  };
 
-	this.selectorGripsGroup = null;
-	this.rotateGripConnector = null;
-	this.rotateGrip = null;
+  this.selectorGripsGroup = null;
+  this.rotateGripConnector = null;
+  this.rotateGrip = null;
 
-	this.initGroup();
+  this.initGroup();
 };
 
 // Function: svgedit.select.SelectorManager.initGroup
 // Resets the parent selector group element
 svgedit.select.SelectorManager.prototype.initGroup = function () {
-	// remove old selector parent group if it existed
-	if (this.selectorParentGroup && this.selectorParentGroup.parentNode) {
-		this.selectorParentGroup.parentNode.removeChild(this.selectorParentGroup);
-	}
+  // remove old selector parent group if it existed
+  if (this.selectorParentGroup && this.selectorParentGroup.parentNode) {
+    this.selectorParentGroup.parentNode.removeChild(this.selectorParentGroup);
+  }
 
-	// create parent selector group and add it to svgroot
-	this.selectorParentGroup = svgFactory_.createSVGElement({
-		'element': 'g',
-		'attr': {'id': 'selectorParentGroup'}
-	});
-	this.selectorGripsGroup = svgFactory_.createSVGElement({
-		'element': 'g',
-		'attr': {'display': 'none'}
-	});
-	this.selectorParentGroup.appendChild(this.selectorGripsGroup);
-	svgFactory_.svgRoot().appendChild(this.selectorParentGroup);
+  // create parent selector group and add it to svgroot
+  this.selectorParentGroup = svgFactory_.createSVGElement({
+    'element': 'g',
+    'attr': {'id': 'selectorParentGroup'}
+  });
+  this.selectorGripsGroup = svgFactory_.createSVGElement({
+    'element': 'g',
+    'attr': {'display': 'none'}
+  });
+  this.selectorParentGroup.appendChild(this.selectorGripsGroup);
+  svgFactory_.svgRoot().appendChild(this.selectorParentGroup);
 
-	this.selectorMap = {};
-	this.selectors = [];
-	this.rubberBandBox = null;
+  this.selectorMap = {};
+  this.selectors = [];
+  this.rubberBandBox = null;
 
-	// add the corner grips
-	var dir;
-	for (dir in this.selectorGrips) {
-		var grip = svgFactory_.createSVGElement({
-			'element': 'circle',
-			'attr': {
-				'id': ('selectorGrip_resize_' + dir),
-				'fill': '#22C',
-				'r': gripRadius,
-				'style': ('cursor:' + dir + '-resize'),
-				// This expands the mouse-able area of the grips making them
-				// easier to grab with the mouse.
-				// This works in Opera and WebKit, but does not work in Firefox
-				// see https://bugzilla.mozilla.org/show_bug.cgi?id=500174
-				'stroke-width': 2,
-				'pointer-events': 'all'
-			}
-		});
+  // add the corner grips
+  var dir;
+  for (dir in this.selectorGrips) {
+    var grip = svgFactory_.createSVGElement({
+      'element': 'circle',
+      'attr': {
+        'id': ('selectorGrip_resize_' + dir),
+        'fill': '#22C',
+        'r': gripRadius,
+        'style': ('cursor:' + dir + '-resize'),
+        // This expands the mouse-able area of the grips making them
+        // easier to grab with the mouse.
+        // This works in Opera and WebKit, but does not work in Firefox
+        // see https://bugzilla.mozilla.org/show_bug.cgi?id=500174
+        'stroke-width': 2,
+        'pointer-events': 'all'
+      }
+    });
 
-		$.data(grip, 'dir', dir);
-		$.data(grip, 'type', 'resize');
-		this.selectorGrips[dir] = this.selectorGripsGroup.appendChild(grip);
-	}
+    $.data(grip, 'dir', dir);
+    $.data(grip, 'type', 'resize');
+    this.selectorGrips[dir] = this.selectorGripsGroup.appendChild(grip);
+  }
 
-	// add rotator elems
-	this.rotateGripConnector = this.selectorGripsGroup.appendChild(
-		svgFactory_.createSVGElement({
-			'element': 'line',
-			'attr': {
-				'id': ('selectorGrip_rotateconnector'),
-				'stroke': '#22C',
-				'stroke-width': '1'
-			}
-		})
-	);
+  // add rotator elems
+  this.rotateGripConnector = this.selectorGripsGroup.appendChild(
+    svgFactory_.createSVGElement({
+      'element': 'line',
+      'attr': {
+        'id': ('selectorGrip_rotateconnector'),
+        'stroke': '#22C',
+        'stroke-width': '1'
+      }
+    })
+  );
 
-	this.rotateGrip = this.selectorGripsGroup.appendChild(
-		svgFactory_.createSVGElement({
-			'element': 'circle',
-			'attr': {
-				'id': 'selectorGrip_rotate',
-				'fill': 'lime',
-				'r': gripRadius,
-				'stroke': '#22C',
-				'stroke-width': 2,
-				'style': 'cursor:url(' + config_.imgPath + 'rotate.png) 12 12, auto;'
-			}
-		})
-	);
-	$.data(this.rotateGrip, 'type', 'rotate');
+  this.rotateGrip = this.selectorGripsGroup.appendChild(
+    svgFactory_.createSVGElement({
+      'element': 'circle',
+      'attr': {
+        'id': 'selectorGrip_rotate',
+        'fill': 'lime',
+        'r': gripRadius,
+        'stroke': '#22C',
+        'stroke-width': 2,
+        'style': 'cursor:url(' + config_.imgPath + 'rotate.png) 12 12, auto;'
+      }
+    })
+  );
+  $.data(this.rotateGrip, 'type', 'rotate');
 
-	if ($('#canvasBackground').length) { return; }
+  if ($('#canvasBackground').length) { return; }
 
-	var dims = config_.dimensions;
-	var canvasbg = svgFactory_.createSVGElement({
-		'element': 'svg',
-		'attr': {
-			'id': 'canvasBackground',
-			'width': dims[0],
-			'height': dims[1],
-			'x': 0,
-			'y': 0,
-			'overflow': (svgedit.browser.isWebkit() ? 'none' : 'visible'), // Chrome 7 has a problem with this when zooming out
-			'style': 'pointer-events:none'
-		}
-	});
+  var dims = config_.dimensions;
+  var canvasbg = svgFactory_.createSVGElement({
+    'element': 'svg',
+    'attr': {
+      'id': 'canvasBackground',
+      'width': dims[0],
+      'height': dims[1],
+      'x': 0,
+      'y': 0,
+      'overflow': (svgedit.browser.isWebkit() ? 'none' : 'visible'), // Chrome 7 has a problem with this when zooming out
+      'style': 'pointer-events:none'
+    }
+  });
 
-	var rect = svgFactory_.createSVGElement({
-		'element': 'rect',
-		'attr': {
-			'width': '100%',
-			'height': '100%',
-			'x': 0,
-			'y': 0,
-			'stroke-width': 1,
-			'stroke': '#000',
-			'fill': '#FFF',
-			'style': 'pointer-events:none'
-		}
-	});
+  var rect = svgFactory_.createSVGElement({
+    'element': 'rect',
+    'attr': {
+      'width': '100%',
+      'height': '100%',
+      'x': 0,
+      'y': 0,
+      'stroke-width': 1,
+      'stroke': '#000',
+      'fill': '#FFF',
+      'style': 'pointer-events:none'
+    }
+  });
 
-	// Both Firefox and WebKit are too slow with this filter region (especially at higher
-	// zoom levels) and Opera has at least one bug
-	// if (!svgedit.browser.isOpera()) rect.setAttribute('filter', 'url(#canvashadow)');
-	canvasbg.appendChild(rect);
-	svgFactory_.svgRoot().insertBefore(canvasbg, svgFactory_.svgContent());
+  // Both Firefox and WebKit are too slow with this filter region (especially at higher
+  // zoom levels) and Opera has at least one bug
+  // if (!svgedit.browser.isOpera()) rect.setAttribute('filter', 'url(#canvashadow)');
+  canvasbg.appendChild(rect);
+  svgFactory_.svgRoot().insertBefore(canvasbg, svgFactory_.svgContent());
 };
 
 // Function: svgedit.select.SelectorManager.requestSelector
@@ -420,27 +420,27 @@ svgedit.select.SelectorManager.prototype.initGroup = function () {
 // elem - DOM element to get the selector for
 // bbox - Optional bbox to use for reset (prevents duplicate getBBox call).
 svgedit.select.SelectorManager.prototype.requestSelector = function (elem, bbox) {
-	if (elem == null) { return null; }
-	var i,
-		N = this.selectors.length;
-	// If we've already acquired one for this element, return it.
-	if (typeof this.selectorMap[elem.id] === 'object') {
-		this.selectorMap[elem.id].locked = true;
-		return this.selectorMap[elem.id];
-	}
-	for (i = 0; i < N; ++i) {
-		if (this.selectors[i] && !this.selectors[i].locked) {
-			this.selectors[i].locked = true;
-			this.selectors[i].reset(elem, bbox);
-			this.selectorMap[elem.id] = this.selectors[i];
-			return this.selectors[i];
-		}
-	}
-	// if we reached here, no available selectors were found, we create one
-	this.selectors[N] = new svgedit.select.Selector(N, elem, bbox);
-	this.selectorParentGroup.appendChild(this.selectors[N].selectorGroup);
-	this.selectorMap[elem.id] = this.selectors[N];
-	return this.selectors[N];
+  if (elem == null) { return null; }
+  var i,
+    N = this.selectors.length;
+  // If we've already acquired one for this element, return it.
+  if (typeof this.selectorMap[elem.id] === 'object') {
+    this.selectorMap[elem.id].locked = true;
+    return this.selectorMap[elem.id];
+  }
+  for (i = 0; i < N; ++i) {
+    if (this.selectors[i] && !this.selectors[i].locked) {
+      this.selectors[i].locked = true;
+      this.selectors[i].reset(elem, bbox);
+      this.selectorMap[elem.id] = this.selectors[i];
+      return this.selectors[i];
+    }
+  }
+  // if we reached here, no available selectors were found, we create one
+  this.selectors[N] = new svgedit.select.Selector(N, elem, bbox);
+  this.selectorParentGroup.appendChild(this.selectors[N].selectorGroup);
+  this.selectorMap[elem.id] = this.selectors[N];
+  return this.selectors[N];
 };
 
 // Function: svgedit.select.SelectorManager.releaseSelector
@@ -449,51 +449,51 @@ svgedit.select.SelectorManager.prototype.requestSelector = function (elem, bbox)
 // Parameters:
 // elem - DOM element to remove the selector for
 svgedit.select.SelectorManager.prototype.releaseSelector = function (elem) {
-	if (elem == null) { return; }
-	var i,
-		N = this.selectors.length,
-		sel = this.selectorMap[elem.id];
-	if (!sel.locked) {
-		// TODO(codedread): Ensure this exists in this module.
-		console.log('WARNING! selector was released but was already unlocked');
-	}
-	for (i = 0; i < N; ++i) {
-		if (this.selectors[i] && this.selectors[i] === sel) {
-			delete this.selectorMap[elem.id];
-			sel.locked = false;
-			sel.selectedElement = null;
-			sel.showGrips(false);
+  if (elem == null) { return; }
+  var i,
+    N = this.selectors.length,
+    sel = this.selectorMap[elem.id];
+  if (!sel.locked) {
+    // TODO(codedread): Ensure this exists in this module.
+    console.log('WARNING! selector was released but was already unlocked');
+  }
+  for (i = 0; i < N; ++i) {
+    if (this.selectors[i] && this.selectors[i] === sel) {
+      delete this.selectorMap[elem.id];
+      sel.locked = false;
+      sel.selectedElement = null;
+      sel.showGrips(false);
 
-			// remove from DOM and store reference in JS but only if it exists in the DOM
-			try {
-				sel.selectorGroup.setAttribute('display', 'none');
-			} catch (e) {}
+      // remove from DOM and store reference in JS but only if it exists in the DOM
+      try {
+        sel.selectorGroup.setAttribute('display', 'none');
+      } catch (e) {}
 
-			break;
-		}
-	}
+      break;
+    }
+  }
 };
 
 // Function: svgedit.select.SelectorManager.getRubberBandBox
 // Returns the rubberBandBox DOM element. This is the rectangle drawn by the user for selecting/zooming
 svgedit.select.SelectorManager.prototype.getRubberBandBox = function () {
-	if (!this.rubberBandBox) {
-		this.rubberBandBox = this.selectorParentGroup.appendChild(
-			svgFactory_.createSVGElement({
-				'element': 'rect',
-				'attr': {
-					'id': 'selectorRubberBand',
-					'fill': '#22C',
-					'fill-opacity': 0.15,
-					'stroke': '#22C',
-					'stroke-width': 0.5,
-					'display': 'none',
-					'style': 'pointer-events:none'
-				}
-			})
-		);
-	}
-	return this.rubberBandBox;
+  if (!this.rubberBandBox) {
+    this.rubberBandBox = this.selectorParentGroup.appendChild(
+      svgFactory_.createSVGElement({
+        'element': 'rect',
+        'attr': {
+          'id': 'selectorRubberBand',
+          'fill': '#22C',
+          'fill-opacity': 0.15,
+          'stroke': '#22C',
+          'stroke-width': 0.5,
+          'display': 'none',
+          'style': 'pointer-events:none'
+        }
+      })
+    );
+  }
+  return this.rubberBandBox;
 };
 
 /**
@@ -519,9 +519,9 @@ svgedit.select.SelectorManager.prototype.getRubberBandBox = function () {
  * svgFactory - an object implementing the SVGFactory interface (see above).
  */
 svgedit.select.init = function (config, svgFactory) {
-	config_ = config;
-	svgFactory_ = svgFactory;
-	selectorManager_ = new svgedit.select.SelectorManager();
+  config_ = config;
+  svgFactory_ = svgFactory;
+  selectorManager_ = new svgedit.select.SelectorManager();
 };
 
 /**
@@ -531,6 +531,6 @@ svgedit.select.init = function (config, svgFactory) {
  * The SelectorManager instance.
  */
 svgedit.select.getSelectorManager = function () {
-	return selectorManager_;
+  return selectorManager_;
 };
 }());
diff --git a/editor/svg-editor.css b/editor/svg-editor.css
index 2b744a8f..47622325 100644
--- a/editor/svg-editor.css
+++ b/editor/svg-editor.css
@@ -1,450 +1,450 @@
 body {
-	background: #D0D0D0;
+  background: #D0D0D0;
 }
 
 html, body, div{
-	-webkit-user-select: text;
-	-khtml-user-select: text;
-	-moz-user-select: text;
-	-o-user-select: text;
-	user-select: text;
-	/* this will work for QtWebKit in future */
-	-webkit-user-drag: text;
+  -webkit-user-select: text;
+  -khtml-user-select: text;
+  -moz-user-select: text;
+  -o-user-select: text;
+  user-select: text;
+  /* this will work for QtWebKit in future */
+  -webkit-user-drag: text;
 }
 
 #svg_editor * {
-	transform-origin: 0 0;
-	-moz-transform-origin: 0 0;
-	-o-transform-origin: 0 0;
-	-webkit-transform-origin: 0 0;
+  transform-origin: 0 0;
+  -moz-transform-origin: 0 0;
+  -o-transform-origin: 0 0;
+  -webkit-transform-origin: 0 0;
 }
 
 #svg_editor {
-	font-size: 8pt;
-	font-family: Verdana, Helvetica, Arial;
-	color: #000000;
+  font-size: 8pt;
+  font-family: Verdana, Helvetica, Arial;
+  color: #000000;
 }
 
 a {
-	color: #19c;
+  color: #19c;
 }
 
 hr {
-	border: none;
-	border-bottom: 1px solid #808080;
+  border: none;
+  border-bottom: 1px solid #808080;
 }
 
 select {
-	margin-top: 4px;
+  margin-top: 4px;
 }
 
 #svgroot {
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	position: absolute;
-	top: 0;
-	left: 0;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  position: absolute;
+  top: 0;
+  left: 0;
 }
 
 #svgcanvas {
-	line-height: normal;
-	display: inline-block;
-	background-color: #A0A0A0;
-	text-align: center;
-	vertical-align: middle;
-	width: 640px;
-	height: 480px;
-	-apple-dashboard-region:dashboard-region(control rectangle 0px 0px 0px 0px); /* for widget regions that shouldn't react to dragging */
-	position: relative;
-	/*
-	  A subtle gradient effect in the canvas.
-	  Just experimenting - not sure if this is worth it.
-	*/
-	background: -moz-radial-gradient(45deg,#bbb,#222);
-	background: -webkit-gradient(radial, center center, 3, center center, 1000, from(#bbb), to(#222));
+  line-height: normal;
+  display: inline-block;
+  background-color: #A0A0A0;
+  text-align: center;
+  vertical-align: middle;
+  width: 640px;
+  height: 480px;
+  -apple-dashboard-region:dashboard-region(control rectangle 0px 0px 0px 0px); /* for widget regions that shouldn't react to dragging */
+  position: relative;
+  /*
+    A subtle gradient effect in the canvas.
+    Just experimenting - not sure if this is worth it.
+  */
+  background: -moz-radial-gradient(45deg,#bbb,#222);
+  background: -webkit-gradient(radial, center center, 3, center center, 1000, from(#bbb), to(#222));
 }
 
 /* Rulers
 ——————————————————————————————————————*/
 
 #rulers > div {
-	position: absolute;
-	background: #DDD;
-	z-index: 1;
-	overflow: hidden;
+  position: absolute;
+  background: #DDD;
+  z-index: 1;
+  overflow: hidden;
 }
 
 #ruler_corner {
-	top: 41px;
-	left: 41px;
-	width: 15px;
-	height: 15px;
+  top: 41px;
+  left: 41px;
+  width: 15px;
+  height: 15px;
 }
 
 #ruler_x {
-	height: 15px;
-	top: 41px;
-	left: 56px;
-	right: 30px;
-	border-bottom: 1px solid;
-	border-left: 1px solid #777;
+  height: 15px;
+  top: 41px;
+  left: 56px;
+  right: 30px;
+  border-bottom: 1px solid;
+  border-left: 1px solid #777;
 }
 
 #ruler_y {
-	width: 15px;
-	top: 55px;
-	left: 41px;
-	bottom: 56px;
-	border-right: 1px solid;
-	border-top: 1px solid #777;
+  width: 15px;
+  top: 55px;
+  left: 41px;
+  bottom: 56px;
+  border-right: 1px solid;
+  border-top: 1px solid #777;
 }
 
 #ruler_x canvas:first-child {
-	margin-left: -16px;
+  margin-left: -16px;
 }
 
 #ruler_x canvas {
-	float: left;
+  float: left;
 }
 
 #ruler_y canvas {
-	margin-top: -16px;
+  margin-top: -16px;
 }
 
 #ruler_x > div,
 #ruler_y > div {
-	overflow: hidden;
+  overflow: hidden;
 }
 
 #palette_holder {
-	overflow: hidden;
-	margin-top: 5px;
-	padding: 5px;
-	position: absolute;
-	right: 15px;
-	height: 16px;
-	background: #f0f0f0;
-	border-radius: 3px;
-	z-index: 2;
+  overflow: hidden;
+  margin-top: 5px;
+  padding: 5px;
+  position: absolute;
+  right: 15px;
+  height: 16px;
+  background: #f0f0f0;
+  border-radius: 3px;
+  z-index: 2;
 }
 
 #stroke_bg,
 #fill_bg {
-	height: 16px;
-	width: 16px;
-	margin: 1px;
+  height: 16px;
+  width: 16px;
+  margin: 1px;
 }
 
 #zoomLabel {
-	cursor: pointer;
-	margin-right: 5px;
-	padding-top: 4px
+  cursor: pointer;
+  margin-right: 5px;
+  padding-top: 4px
 }
 
 #linkLabel > svg {
-	height: 20px;
-	padding-top: 4px;
+  height: 20px;
+  padding-top: 4px;
 }
 
 #palette {
-	float: left;
-	width: 632px;
-	height: 16px;
+  float: left;
+  width: 632px;
+  height: 16px;
 }
 
 #workarea {
-	display: inline-table-cell;
-	position:absolute;
-	top: 40px;
-	left: 40px;
-	bottom: 40px;
-	right: 14px;
-	background-color: #A0A0A0;
-	border: 1px solid #808080;
-	overflow: auto;
-	text-align: center;
+  display: inline-table-cell;
+  position:absolute;
+  top: 40px;
+  left: 40px;
+  bottom: 40px;
+  right: 14px;
+  background-color: #A0A0A0;
+  border: 1px solid #808080;
+  overflow: auto;
+  text-align: center;
 }
 
 #sidepanels {
-	display: inline-block;
-	position:absolute;
-	top: 40px;
-	bottom: 40px;
-	right: 0;
-	width: 2px;
-	padding: 10px;
-	border-color: #808080;
-	border-style: solid;
-	border-width: 1px;
-	border-left: none;
-	overflow-x:hidden;
-	overflow-y:visible;
+  display: inline-block;
+  position:absolute;
+  top: 40px;
+  bottom: 40px;
+  right: 0;
+  width: 2px;
+  padding: 10px;
+  border-color: #808080;
+  border-style: solid;
+  border-width: 1px;
+  border-left: none;
+  overflow-x:hidden;
+  overflow-y:visible;
 }
 
 #layerpanel {
-	display: inline-block;
-	position:relative;
-	top: 0px;
-	bottom: 0;
-	left: 12px;
-	width: 0;
-	overflow: hidden;
-	margin: 0;
-	-moz-user-select: none;
-	-webkit-user-select: none;
+  display: inline-block;
+  position:relative;
+  top: 0px;
+  bottom: 0;
+  left: 12px;
+  width: 0;
+  overflow: hidden;
+  margin: 0;
+  -moz-user-select: none;
+  -webkit-user-select: none;
 }
 
 /*
-	border-style: solid;
-	border-color: #666;
-	border-width: 0px 0px 0px 1px;
+  border-style: solid;
+  border-color: #666;
+  border-width: 0px 0px 0px 1px;
 */
 #sidepanel_handle {
-	display: inline-block;
-	position: absolute;
-	background-color: #D0D0D0;
-	font-weight: bold;
-	left: 0;
-	top: 40%;
-	width: 1em;
-	padding: 5px 1px 5px 5px;
-	margin-left: 3px;
-	cursor: pointer;
-	border-radius: 5px;
-	-moz-border-radius: 5px;
-	-webkit-border-radius: 5px;
-	-moz-user-select: none;
-	-webkit-user-select: none;
+  display: inline-block;
+  position: absolute;
+  background-color: #D0D0D0;
+  font-weight: bold;
+  left: 0;
+  top: 40%;
+  width: 1em;
+  padding: 5px 1px 5px 5px;
+  margin-left: 3px;
+  cursor: pointer;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  -moz-user-select: none;
+  -webkit-user-select: none;
 }
 
 #sidepanel_handle:hover {
-	font-weight: bold;
+  font-weight: bold;
 }
 
 #sidepanel_handle * {
-	cursor: pointer;
-	-moz-user-select: none;
-	-webkit-user-select: none;
+  cursor: pointer;
+  -moz-user-select: none;
+  -webkit-user-select: none;
 }
 #layerbuttons {
-	margin: 0;
-	padding: 0;
-	padding-left: 2px;
-	padding-right: 2px;
-	width: 125px;
-	height: 20px;
-	border-right: 1px solid #FFFFFF;
-	border-bottom: 1px solid #FFFFFF;
-	border-left: 1px solid #808080;
-	border-top: 1px solid #808080;
-	overflow: hidden;
+  margin: 0;
+  padding: 0;
+  padding-left: 2px;
+  padding-right: 2px;
+  width: 125px;
+  height: 20px;
+  border-right: 1px solid #FFFFFF;
+  border-bottom: 1px solid #FFFFFF;
+  border-left: 1px solid #808080;
+  border-top: 1px solid #808080;
+  overflow: hidden;
 }
 
 .layer_button {
-	width: 14px;
-	height: 14px;
-	padding: 1px;
-	border-left: 1px solid #FFFFFF;
-	border-top: 1px solid #FFFFFF;
-	border-right: 1px solid #808080;
-	border-bottom: 1px solid #808080;
-	cursor: pointer;
-	float: left;
-	margin-right: 3px;
+  width: 14px;
+  height: 14px;
+  padding: 1px;
+  border-left: 1px solid #FFFFFF;
+  border-top: 1px solid #FFFFFF;
+  border-right: 1px solid #808080;
+  border-bottom: 1px solid #808080;
+  cursor: pointer;
+  float: left;
+  margin-right: 3px;
 }
 
 .layer_button:last-child {
-	margin-right: 0;
+  margin-right: 0;
 }
 
 .layer_buttonpressed {
-	width: 14px;
-	height: 14px;
-	padding: 1px;
-	border-right: 1px solid #FFFFFF;
-	border-bottom: 1px solid #FFFFFF;
-	border-left: 1px solid #808080;
-	border-top: 1px solid #808080;
-	cursor: pointer;
+  width: 14px;
+  height: 14px;
+  padding: 1px;
+  border-right: 1px solid #FFFFFF;
+  border-bottom: 1px solid #FFFFFF;
+  border-left: 1px solid #808080;
+  border-top: 1px solid #808080;
+  cursor: pointer;
 }
 
 #layerlist {
-	margin: 1px;
-	padding: 0;
-	width: 127px;
-	border-collapse: collapse;
-	border: 1px solid #808080;
-	background-color: #FFFFFF;
+  margin: 1px;
+  padding: 0;
+  width: 127px;
+  border-collapse: collapse;
+  border: 1px solid #808080;
+  background-color: #FFFFFF;
 }
 
 #layerlist tr.layer {
-	background-color: #FFFFFF;
-	margin: 0;
-	padding: 0;
+  background-color: #FFFFFF;
+  margin: 0;
+  padding: 0;
 }
 
 #layerlist tr.layersel {
-	border: 1px solid #808080;
-	background-color: #CCCCCC;
+  border: 1px solid #808080;
+  background-color: #CCCCCC;
 }
 
 #layerlist td.layervis {
-	width: 22px;
-	cursor: pointer;
+  width: 22px;
+  cursor: pointer;
 }
 
 #layerlist td.layerinvis {
-	background-image: none;
-	cursor: pointer;
+  background-image: none;
+  cursor: pointer;
 }
 
 #layerlist td.layervis * {
-	display: block;
+  display: block;
 }
 
 #layerlist td.layerinvis * {
-	display: none;
+  display: none;
 }
 
 #layerlist td.layername {
-	cursor: pointer;
+  cursor: pointer;
 }
 
 #layerlist td.layername:hover {
-	color: blue;
-	font-style: italic;
+  color: blue;
+  font-style: italic;
 }
 
 #layerlist tr.layersel td.layername {
-	font-weight: bold;
+  font-weight: bold;
 }
 
 #selLayerLabel {
-	white-space: nowrap;
+  white-space: nowrap;
 }
 
 #selLayerNames {
-	display: block;
+  display: block;
 }
 
 div.palette_item {
-	height: 15px;
-	width: 15px;
-	float: left;
+  height: 15px;
+  width: 15px;
+  float: left;
 }
 
 div.palette_item:first-child {
-	background: white;
+  background: white;
 }
 
 /* Main button
 —————————————————————————————*/
 
 #main_button {
-	position: absolute;
-	top: 4px;
-	left: 5px;
-	z-index: 5;
+  position: absolute;
+  top: 4px;
+  left: 5px;
+  z-index: 5;
 }
 
 #main_icon {
-	position: relative;
-	top: -2px;
-	left: -2px;
-	width: 95px;
-	line-height: 26px;
+  position: relative;
+  top: -2px;
+  left: -2px;
+  width: 95px;
+  line-height: 26px;
 }
 
 #main_icon:hover {
-	background: #eee !important;
+  background: #eee !important;
 }
 
 #main_icon.buttondown {
-	background: #eee !important;
-	-moz-box-shadow: none !important;
-	-webkit-box-shadow: none !important;
-	box-shadow: none !important;
-	border-radius: 3px 3px 0 0;
+  background: #eee !important;
+  -moz-box-shadow: none !important;
+  -webkit-box-shadow: none !important;
+  box-shadow: none !important;
+  border-radius: 3px 3px 0 0;
 }
 
 #logo {
-	margin-top: -2px;
+  margin-top: -2px;
 }
 
 #logo img {
-	border: 0;
-	width: 28px;
-	height: 28px;
+  border: 0;
+  width: 28px;
+  height: 28px;
 }
 
 #main_icon > div {
-	float: left;
+  float: left;
 }
 
 #main_button .dropdown {
-	position: absolute;
-	right: 7px;
-	top: 4px;
+  position: absolute;
+  right: 7px;
+  top: 4px;
 }
 
 #main_icon span {
-	position: absolute;
-	top: 0;
-	left: 0;
-	bottom: 0;
-	right: 0;
-	display: block;
-	z-index: 2;
-	font-weight: bold;
-	padding-left: 34px;
-	line-height: 32px;
-	font-family: sans-serif;
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  display: block;
+  z-index: 2;
+  font-weight: bold;
+  padding-left: 34px;
+  line-height: 32px;
+  font-family: sans-serif;
 }
 
 #main_menu {
-	z-index: 12;
-	background: #eee;
-	position: relative;
-	width: 230px;
-	padding: 5px;
-	-moz-box-shadow: #555 1px 1px 4px;
-	-webkit-box-shadow: #555 1px 1px 4px;
-	box-shadow: #555 1px 1px 4px;
-	font-size: 1.1em;
-	display: none;
-	overflow: hidden;
-	clear: both;
-	top: -9px;
+  z-index: 12;
+  background: #eee;
+  position: relative;
+  width: 230px;
+  padding: 5px;
+  -moz-box-shadow: #555 1px 1px 4px;
+  -webkit-box-shadow: #555 1px 1px 4px;
+  box-shadow: #555 1px 1px 4px;
+  font-size: 1.1em;
+  display: none;
+  overflow: hidden;
+  clear: both;
+  top: -9px;
 }
 
 #main_menu ul,
 #main_menu li {
-	list-style: none;
-	margin: 0;
-	padding: 0;
+  list-style: none;
+  margin: 0;
+  padding: 0;
 }
 
 #main_menu li {
 /*	height: 35px;*/
-	line-height: 22px;
-	padding-top: 7px;
-	padding-left: 7px;
-	margin: -5px;
-	overflow: auto;
-	cursor: default;
+  line-height: 22px;
+  padding-top: 7px;
+  padding-left: 7px;
+  margin: -5px;
+  overflow: auto;
+  cursor: default;
 }
 
 #main_menu li:hover {
-	background: #FFC;
+  background: #FFC;
 }
 
 #main_menu li > div {
-	float: left;
-	padding-right: 5px;
+  float: left;
+  padding-right: 5px;
 }
 
 #main_menu p {
-	margin-top: 5px;
+  margin-top: 5px;
 }
 
 /*—————————————————————————————*/
@@ -456,232 +456,232 @@ div.palette_item:first-child {
 .tool_button_current,
 .push_button_pressed
 {
-	background-color: #ffc !important;
+  background-color: #ffc !important;
 }
 
 .tool_button_current,
 .push_button_pressed,
 .buttondown {
-	background-color: #f4e284 !important;
-	-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4), 1px 1px  0 white  !important;
-	-moz-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4), 1px 1px  0 white  !important;
-	box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4), 1px 1px  0 white  !important;
+  background-color: #f4e284 !important;
+  -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4), 1px 1px  0 white  !important;
+  -moz-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4), 1px 1px  0 white  !important;
+  box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4), 1px 1px  0 white  !important;
 }
 
 #tools_top {
-	position: absolute;
-	left: 108px;
-	right: 2px;
-	top: 2px;
-	height: 40px;
-	border-bottom: none;
-	overflow: auto;
+  position: absolute;
+  left: 108px;
+  right: 2px;
+  top: 2px;
+  height: 40px;
+  border-bottom: none;
+  overflow: auto;
 }
 
 #tools_top .tool_sep {
-	margin-top: 5px;
+  margin-top: 5px;
 }
 
 #tools_left {
-	position: absolute;
-	border-right: none;
-	width: 32px;
-	top: 40px;
-	left: 1px;
-	margin-top: -2px;
-	padding-left: 2px;
-	background: #D0D0D0; /* Needed so flyout icons don't appear on the left */
-	z-index: 4;
+  position: absolute;
+  border-right: none;
+  width: 32px;
+  top: 40px;
+  left: 1px;
+  margin-top: -2px;
+  padding-left: 2px;
+  background: #D0D0D0; /* Needed so flyout icons don't appear on the left */
+  z-index: 4;
 }
 
 #workarea.wireframe #svgcontent * {
-	fill: none;
-	stroke: #000;
-	stroke-width: 1px;
-	stroke-opacity: 1.0;
-	stroke-dasharray: 0;
-	opacity: 1;
-	pointer-events: stroke;
-	vector-effect: non-scaling-stroke;
-	filter: none;
+  fill: none;
+  stroke: #000;
+  stroke-width: 1px;
+  stroke-opacity: 1.0;
+  stroke-dasharray: 0;
+  opacity: 1;
+  pointer-events: stroke;
+  vector-effect: non-scaling-stroke;
+  filter: none;
 }
 
 #workarea.wireframe #svgcontent text {
-	fill: #000;
-	stroke: none;
+  fill: #000;
+  stroke: none;
 }
 
 #workarea.wireframe #canvasBackground > rect {
-	fill: #FFF !important;
+  fill: #FFF !important;
 }
 
 #tools_top div[id$="_panel"]:not(#editor_panel):not(#history_panel) {
-	display: none;
+  display: none;
 }
 
 #editor_panel, #history_panel {
-	height: 34px;
-	float: left;
+  height: 34px;
+  float: left;
 }
 
 #multiselected_panel .selected_tool {
-	vertical-align: 12px;
+  vertical-align: 12px;
 }
 
 /*TODO: Adjust position of rulers are not visible*/
 #cur_context_panel {
-	position: absolute;
-	top: 57px;
-	left: 56px;
-	line-height: 22px;
-	overflow: auto;
-	padding-left: 5px;
-	font-size: 12px;
-	background: rgba(0, 0, 0, 0.8);
-	color: #ccc;
-	padding: 0 10px;
-	border-radius: 0 0 3px 0;
+  position: absolute;
+  top: 57px;
+  left: 56px;
+  line-height: 22px;
+  overflow: auto;
+  padding-left: 5px;
+  font-size: 12px;
+  background: rgba(0, 0, 0, 0.8);
+  color: #ccc;
+  padding: 0 10px;
+  border-radius: 0 0 3px 0;
 }
 
 #cur_context_panel a {
-	float: none;
-	text-decoration: none;
+  float: none;
+  text-decoration: none;
 }
 
 #cur_context_panel a:hover {
-	text-decoration: underline;
+  text-decoration: underline;
 }
 
 #tools_top > div, #tools_top {
-	line-height: 26px;
+  line-height: 26px;
 }
 
 div.toolset,
 div.toolset > * {
-	float: left;
+  float: left;
 }
 
 div.toolset {
-	height: 34px;
+  height: 34px;
 }
 
 div.toolset label span {
 /*	outline: 1px solid red;*/
-	padding-top: 3px;
-	display: inline-block;
+  padding-top: 3px;
+  display: inline-block;
 }
 
 #tools_top > div > * {
-	float: left;
-	margin-right: 2px;
+  float: left;
+  margin-right: 2px;
 }
 
 #tools_top label {
-	margin-top: 0;
-	margin-left: 5px;
+  margin-top: 0;
+  margin-left: 5px;
 }
 
 #tools_top input {
-	margin-top: 5px;
-	height: 15px;
+  margin-top: 5px;
+  height: 15px;
 }
 
 input[type=text] {
-	padding: 2px;
+  padding: 2px;
 }
 
 #tools_left .tool_button,
 #tools_left .tool_button_current {
-	position: relative;
-	z-index: 11;
+  position: relative;
+  z-index: 11;
 }
 
 .flyout_arrow_horiz {
-	position: absolute;
-	bottom: -1px;
-	right: 0;
-	z-index: 10;
+  position: absolute;
+  bottom: -1px;
+  right: 0;
+  z-index: 10;
 }
 
 
 span.zoom_tool {
-	line-height: 26px;
-	padding: 3px;
+  line-height: 26px;
+  padding: 3px;
 }
 
 #zoom_panel {
-	margin-top: 5px;
+  margin-top: 5px;
 }
 
 .dropdown {
-	position: relative;
+  position: relative;
 }
 
 .dropdown button {
-	width: 15px;
-	height: 21px;
-	margin: 6px 0 0 1px;
-	padding: 0;
-	border-left: 1px solid #FFFFFF;
-	border-top: 1px solid #FFFFFF;
-	border-right: 1px solid #808080;
-	border-bottom: 1px solid #808080;
-	background-color: #E8E8E8;
+  width: 15px;
+  height: 21px;
+  margin: 6px 0 0 1px;
+  padding: 0;
+  border-left: 1px solid #FFFFFF;
+  border-top: 1px solid #FFFFFF;
+  border-right: 1px solid #808080;
+  border-bottom: 1px solid #808080;
+  background-color: #E8E8E8;
 }
 
 .dropdown button.down {
-	border-left: 1px solid #808080;
-	border-top: 1px solid #808080;
-	border-right: 1px solid #FFFFFF;
-	border-bottom: 1px solid #FFFFFF;
-	background-color: #B0B0B0;
+  border-left: 1px solid #808080;
+  border-top: 1px solid #808080;
+  border-right: 1px solid #FFFFFF;
+  border-bottom: 1px solid #FFFFFF;
+  background-color: #B0B0B0;
 }
 
 .dropdown ul {
-	list-style: none;
-	position: absolute;
-	margin: 0;
-	padding: 0;
-	left: -85px;
-	top: 26px;
-	z-index: 4;
-	display: none;
+  list-style: none;
+  position: absolute;
+  margin: 0;
+  padding: 0;
+  left: -85px;
+  top: 26px;
+  z-index: 4;
+  display: none;
 }
 
 .dropup ul {
-	top: auto;
-	bottom: 24px;
+  top: auto;
+  bottom: 24px;
 }
 
 .dropdown li {
-	display: block;
-	width: 120px;
-	padding: 4px;
-	background: #E8E8E8;
-	border: 1px solid #B0B0B0;
-	margin: 0 0 -1px 0;
-	line-height: 16px;
+  display: block;
+  width: 120px;
+  padding: 4px;
+  background: #E8E8E8;
+  border: 1px solid #B0B0B0;
+  margin: 0 0 -1px 0;
+  line-height: 16px;
 }
 
 .dropdown li:hover {
-	background-color: #FFC;
+  background-color: #FFC;
 }
 
 .dropdown li.special {
-	padding: 10px 4px;
+  padding: 10px 4px;
 }
 
 .dropdown li.special:hover {
-	background: #FFC;
+  background: #FFC;
 }
 
 #font_family_dropdown-list li {
-	font-size: 1.4em;
+  font-size: 1.4em;
 }
 
 #font_family {
-	margin-left: 5px;
-	margin-right: 0;
+  margin-left: 5px;
+  margin-right: 0;
 }
 
 .tool_button,
@@ -689,179 +689,179 @@ span.zoom_tool {
 .tool_button_current,
 .push_button_pressed
 {
-	height: 24px;
-	width: 24px;
-	margin: 2px 2px 4px 2px;
-	padding: 3px;
-	-webkit-box-shadow: inset 1px 1px 2px white, 1px 1px 1px rgba(0,0,0,0.3);
-	moz-box-shadow: inset 1px 1px 2px white, 1px 1px 1px rgba(0,0,0,0.3);
-	box-shadow: inset 1px 1px 2px white, 1px 1px 1px rgba(0,0,0,0.3);
-	background-color: #E8E8E8;
-	cursor: pointer;
-	border-radius: 3px;
-	-moz-border-radius: 3px;
-	-webkit-border-radius: 3px;
+  height: 24px;
+  width: 24px;
+  margin: 2px 2px 4px 2px;
+  padding: 3px;
+  -webkit-box-shadow: inset 1px 1px 2px white, 1px 1px 1px rgba(0,0,0,0.3);
+  moz-box-shadow: inset 1px 1px 2px white, 1px 1px 1px rgba(0,0,0,0.3);
+  box-shadow: inset 1px 1px 2px white, 1px 1px 1px rgba(0,0,0,0.3);
+  background-color: #E8E8E8;
+  cursor: pointer;
+  border-radius: 3px;
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
 }
 
  #main_menu li#tool_open,  #main_menu li#tool_import {
-	position: relative;
-	overflow: hidden;
+  position: relative;
+  overflow: hidden;
 }
 
 #tool_image {
-	overflow: hidden;
+  overflow: hidden;
 }
 
 #tool_open input,
 #tool_import input,
 #tool_image input {
-	position: absolute;
-	opacity: 0;
-	font-size: 10em;
-	top: -5px;
-	right: -5px;
-	margin: 0;
-	cursor: pointer; /* Sadly doesn't appear to have an effect */
+  position: absolute;
+  opacity: 0;
+  font-size: 10em;
+  top: -5px;
+  right: -5px;
+  margin: 0;
+  cursor: pointer; /* Sadly doesn't appear to have an effect */
 }
 
 .disabled {
-	opacity: 0.5;
-	cursor: default;
+  opacity: 0.5;
+  cursor: default;
 }
 
 .tool_sep {
-	width: 1px;
-	background: #888;
-	border-left: 1px outset #EEE;
-	margin: 2px 3px;
-	padding: 0;
-	height: 24px;
+  width: 1px;
+  background: #888;
+  border-left: 1px outset #EEE;
+  margin: 2px 3px;
+  padding: 0;
+  height: 24px;
 }
 
 .icon_label {
-	float: left;
-	padding-top: 3px;
-	padding-right: 3px;
-	box-sizing: border-box;
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	height: 0;
+  float: left;
+  padding-top: 3px;
+  padding-right: 3px;
+  box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  height: 0;
 }
 
 .width_label {
-	padding-right: 5px;
+  padding-right: 5px;
 }
 
 #tool_bold, #tool_italic {
-	font: bold 2.1em/1.1em serif;
-	text-align: center;
-	padding-left: 2px;
-	position: relative;
+  font: bold 2.1em/1.1em serif;
+  text-align: center;
+  padding-left: 2px;
+  position: relative;
 }
 
 #text {
-	position: absolute;
-	left: -9999px;
+  position: absolute;
+  left: -9999px;
 }
 
 #tool_bold span, #tool_italic span {
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	top: 0; left: 0;
-	background: #000;
-	opacity: 0;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0; left: 0;
+  background: #000;
+  opacity: 0;
 }
 
 #tool_italic {
-	font-weight: normal;
-	font-style: italic;
+  font-weight: normal;
+  font-style: italic;
 }
 
 #url_notice {
-	padding-top: 4px;
-	display: none;
+  padding-top: 4px;
+  display: none;
 }
 
 #color_picker {
-	position: absolute;
-	display: none;
-	background: #E8E8E8;
-	height: 350px;
-	z-index: 5;
+  position: absolute;
+  display: none;
+  background: #E8E8E8;
+  height: 350px;
+  z-index: 5;
 }
 
 .tools_flyout {
-	position: absolute;
-	display: none;
-	cursor: pointer;
-	width: 400px;
-	z-index: 1;
+  position: absolute;
+  display: none;
+  cursor: pointer;
+  width: 400px;
+  z-index: 1;
 }
 
 .tools_flyout_v {
-	position: absolute;
-	display: none;
-	cursor: pointer;
-	width: 30px;
+  position: absolute;
+  display: none;
+  cursor: pointer;
+  width: 30px;
 }
 
 .tools_flyout .tool_button {
-	float: left;
-	background-color: #E8E8E8;
-	border-left: 1px solid #FFFFFF;
-	border-top: 1px solid #FFFFFF;
-	border-right: 1px solid #808080;
-	border-bottom: 1px solid #808080;
-	height: 28px;
-	width: 28px;
+  float: left;
+  background-color: #E8E8E8;
+  border-left: 1px solid #FFFFFF;
+  border-top: 1px solid #FFFFFF;
+  border-right: 1px solid #808080;
+  border-bottom: 1px solid #808080;
+  height: 28px;
+  width: 28px;
 }
 
 #tools_bottom {
-	position: absolute;
-	left: 40px;
-	right: 0;
-	bottom: 0;
-	height: 40px;
-	overflow: visible;
+  position: absolute;
+  left: 40px;
+  right: 0;
+  bottom: 0;
+  height: 40px;
+  overflow: visible;
 }
 
 #tools_bottom_1 {
-	width: 115px;
-	float: left;
+  width: 115px;
+  float: left;
 }
 
 #tools_bottom input[type=text] {
-	width: 2.2em;
+  width: 2.2em;
 }
 
 /* Color tools: fill, stroke, opacity
 –––––––––––––––––––––––––––––––––––––*/
 
 #tools_bottom_2 {
-	float: left;
-	width: 300px;
-	position: relative;
-	margin-top: 5px;
-	-webkit-transition: width 150ms ease;
+  float: left;
+  width: 300px;
+  position: relative;
+  margin-top: 5px;
+  -webkit-transition: width 150ms ease;
 }
 
 .expanded #tools_bottom_2 {
-	width: 450px;
+  width: 450px;
 }
 
 #tools_bottom #tools_bottom_2 .dropdown button {
-	margin-top: 2px;
+  margin-top: 2px;
 }
 
 .dropdown li.tool_button {
-	width: 24px;
+  width: 24px;
 }
 
 #tools_bottom_2 .icon_label {
-	display: block;
-	margin: 3px 5px;
-	padding: 0;
+  display: block;
+  margin: 3px 5px;
+  padding: 0;
 }
 
 #tool_opacity { right: 0;}
@@ -869,477 +869,477 @@ span.zoom_tool {
 #tool_stroke { left: 60px;}
 
 #fill_color,  #stroke_color {
-	height: 16px;
-	width: 16px;
-	border: 1px solid #808080;
-	cursor: pointer;
-	overflow: hidden;
+  height: 16px;
+  width: 16px;
+  border: 1px solid #808080;
+  cursor: pointer;
+  overflow: hidden;
 }
 
 #stroke_expand {
-	width: 0;
-	overflow: hidden;
+  width: 0;
+  overflow: hidden;
 }
 
 #toggle_stroke_tools {
-	position: absolute;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	width: 25px;
-	text-align: center;
-	border-radius: 0 3px 3px 0;
-	margin: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  width: 25px;
+  text-align: center;
+  border-radius: 0 3px 3px 0;
+  margin: 0;
 }
 
 #toggle_stroke_tools:before {
-	content: '>>';
-	letter-spacing: -3px;
-	font-weight: bold;
-	color: #666;
+  content: '>>';
+  letter-spacing: -3px;
+  font-weight: bold;
+  color: #666;
 }
 
 .expanded #tool_stroke.color_tool {
-	width: 280px;
+  width: 280px;
 }
 
 .expanded #toggle_stroke_tools:before {
-	content: '<<';
+  content: '<<';
 }
 
 #toggle_stroke_tools:hover {
-	background: white;
+  background: white;
 }
 
 .color_tool {
-	position: absolute;
-	overflow: hidden;
-	background: #f0f0f0;
-	height: 26px;
-	line-height: 26px;
-	border-radius: 3px;
-	min-width: 52px;
+  position: absolute;
+  overflow: hidden;
+  background: #f0f0f0;
+  height: 26px;
+  line-height: 26px;
+  border-radius: 3px;
+  min-width: 52px;
 }
 
 #tool_stroke.color_tool {
-	width: 130px;
-	z-index: 2;
-	-webkit-transition: width 150ms ease;
-	-moz-transition: width 150ms ease;
-	-o-transition: width 150ms ease;
-	-ms-transition: width 150ms ease;
-	transition: width 150ms ease;
+  width: 130px;
+  z-index: 2;
+  -webkit-transition: width 150ms ease;
+  -moz-transition: width 150ms ease;
+  -o-transition: width 150ms ease;
+  -ms-transition: width 150ms ease;
+  transition: width 150ms ease;
 }
 
 .color_block {
-	position: absolute;
-	top: 0;
-	left: 0;
+  position: absolute;
+  top: 0;
+  left: 0;
 }
 
 .color_block svg {
-	display: block;
+  display: block;
 }
 
 .color_tool > * {
-	float: left;
-	margin-right: 5px;
+  float: left;
+  margin-right: 5px;
 }
 
 .color_tool .dropdown > * {
-	float: left;
+  float: left;
 }
 
 .color_tool .stroke_label {
-	margin-left: 25px;
-	float: left;
+  margin-left: 25px;
+  float: left;
 }
 
 .color_tool > .color_block {
-	top: 3px;
-	left: 29px;
+  top: 3px;
+  left: 29px;
 }
 
 .color_tool input {
-	margin: 0;
+  margin: 0;
 }
 
 #tool_opacity {
-	overflow: visible;
+  overflow: visible;
 }
 
 @media screen and (max-width:1250px) {
-	.expanded #palette_holder {
-		left: 560px;
-		overflow-x: scroll;
-		padding: 0 5px;
-		margin-top: 2px;
-		height: 30px;
-	}
-	#tools_top {
-		height: 71px;
-	}
-	#workarea, #sidepanels {
-		top: 70px;
-	}
-	#rulers #ruler_corner,
-	#rulers #ruler_x, #tools_left {
-		top: 71px;
-	}
+  .expanded #palette_holder {
+    left: 560px;
+    overflow-x: scroll;
+    padding: 0 5px;
+    margin-top: 2px;
+    height: 30px;
+  }
+  #tools_top {
+    height: 71px;
+  }
+  #workarea, #sidepanels {
+    top: 70px;
+  }
+  #rulers #ruler_corner,
+  #rulers #ruler_x, #tools_left {
+    top: 71px;
+  }
 
-	#rulers #ruler_y {
-		top: 86px;
-	}
+  #rulers #ruler_y {
+    top: 86px;
+  }
 
-	#cur_context_panel {
-		top: 87px;
-	}
+  #cur_context_panel {
+    top: 87px;
+  }
 
-	#selected_panel {
-		clear: right;
-	}
+  #selected_panel {
+    clear: right;
+  }
 }
 
 @media screen and (max-width:1100px) {
-	#tools_bottom:not(.expanded) #palette_holder {
-		left: 410px;
-		overflow-x: scroll;
-		padding: 0 5px;
-		margin-top: 2px;
-		height: 30px;
-	}
+  #tools_bottom:not(.expanded) #palette_holder {
+    left: 410px;
+    overflow-x: scroll;
+    padding: 0 5px;
+    margin-top: 2px;
+    height: 30px;
+  }
 }
 
 /*–––––––––––––––––––––––––––––––––––––*/
 
 #option_lists ul {
-	display: none;
-	position: absolute;
-	height: auto;
-	z-index: 3;
-	margin: -10px;
-	list-style: none;
-	padding-left: 0;
+  display: none;
+  position: absolute;
+  height: auto;
+  z-index: 3;
+  margin: -10px;
+  list-style: none;
+  padding-left: 0;
 }
 
 #option_lists .optcols2 {
-	width: 70px;
-	margin-left: -15px;
+  width: 70px;
+  margin-left: -15px;
 }
 
 #option_lists .optcols3 {
-	width: 90px;
-	margin-left: -31px;
+  width: 90px;
+  margin-left: -31px;
 }
 
 #option_lists .optcols4 {
-	width: 130px;
-	margin-left: -44px;
+  width: 130px;
+  margin-left: -44px;
 }
 
 #option_lists ul[class^=optcols] li {
-	float: left;
+  float: left;
 }
 
 ul li.current {
-	background-color: #F4E284;
+  background-color: #F4E284;
 }
 
 #option_lists ul li {
-	margin: 0;
-	border-radius: 0;
-	-moz-border-radius: 0;
-	-webkit-border-radius: 0;
+  margin: 0;
+  border-radius: 0;
+  -moz-border-radius: 0;
+  -webkit-border-radius: 0;
 }
 
 #tools_bottom .dropdown button {
-	margin-top: 2px;
+  margin-top: 2px;
 }
 
 #opacity_dropdown li {
-	width: 140px;
+  width: 140px;
 }
 
  #copyright {
-	text-align: right;
-	padding-right: .3em;
+  text-align: right;
+  padding-right: .3em;
 }
 
 #svg_source_editor {
-	display: none;
+  display: none;
 }
 
 .overlay {
-	position: absolute;
-	top: 0;
-	right: 0;
-	left: 0;
-	bottom: 0;
-	background-color: black;
-	opacity: 0.6;
-	z-index: 5;
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  background-color: black;
+  opacity: 0.6;
+  z-index: 5;
 }
 
 #svg_source_editor #svg_source_container {
-	position: absolute;
-	top: 30px;
-	left: 30px;
-	right: 30px;
-	bottom: 30px;
-	background-color: #B0B0B0;
-	opacity: 1.0;
-	text-align: center;
-	border: 1px outset #777;
-	z-index: 6;
+  position: absolute;
+  top: 30px;
+  left: 30px;
+  right: 30px;
+  bottom: 30px;
+  background-color: #B0B0B0;
+  opacity: 1.0;
+  text-align: center;
+  border: 1px outset #777;
+  z-index: 6;
 }
 
 #save_output_btns {
-	display: none;
-	text-align: left;
+  display: none;
+  text-align: left;
 }
 
 #save_output_btns p {
-	margin: .5em 1.5em;
-	display: inline-block;
+  margin: .5em 1.5em;
+  display: inline-block;
 }
 
 #bg_blocks {
-	overflow: auto;
-	margin-left: 30px;
+  overflow: auto;
+  margin-left: 30px;
 }
 
 #bg_blocks .color_block {
-	position: static;
+  position: static;
 }
 
 #svg_docprops #svg_docprops_container,
 #svg_prefs #svg_prefs_container {
-	position: absolute;
-	top: 50px;
-	padding: 10px;
-	background-color: #B0B0B0;
-	border: 1px outset #777;
-	opacity: 1.0;
+  position: absolute;
+  top: 50px;
+  padding: 10px;
+  background-color: #B0B0B0;
+  border: 1px outset #777;
+  opacity: 1.0;
 /*	width: 450px;*/
-	font-family: Verdana, Helvetica, sans-serif;
-	font-size: .8em;
-	z-index: 20001;
+  font-family: Verdana, Helvetica, sans-serif;
+  font-size: .8em;
+  z-index: 20001;
 }
 
 #svg_docprops .error {
-	border: 1px solid red;
-	padding: 3px;
+  border: 1px solid red;
+  padding: 3px;
 }
 
 #svg_docprops #resolution {
-	max-width: 14em;
+  max-width: 14em;
 }
 
 #tool_docprops_back,
 #tool_prefs_back {
-	margin-left: 1em;
-	overflow: auto;
+  margin-left: 1em;
+  overflow: auto;
 }
 
 #svg_docprops_container #svg_docprops_docprops,
 #svg_prefs #svg_docprops_prefs {
-	float: left;
-	width: 221px;
-	margin: 5px .7em;
-	overflow: hidden;
+  float: left;
+  width: 221px;
+  margin: 5px .7em;
+  overflow: hidden;
 }
 
 #svg_prefs_container fieldset + fieldset {
-	float: right;
+  float: right;
 }
 
 #svg_docprops legend,
 #svg_prefs legend {
-	max-width: 195px;
+  max-width: 195px;
 }
 
 #svg_docprops_docprops > legend,
 #svg_prefs_container > fieldset > legend {
-	font-weight: bold;
-	font-size: 1.1em;
+  font-weight: bold;
+  font-size: 1.1em;
 }
 
 #svg_docprops_container fieldset,
 #svg_prefs fieldset {
-	padding: 5px;
-	margin: 5px;
-	border: 1px solid #DDD;
+  padding: 5px;
+  margin: 5px;
+  border: 1px solid #DDD;
 }
 
 #svg_docprops_container label,
 #svg_prefs_container label {
-	display: block;
-	margin: .5em;
+  display: block;
+  margin: .5em;
 }
 
 #svginfo_bg_note {
-	font-size: .9em;
-	font-style: italic;
-	color: #444;
+  font-size: .9em;
+  font-style: italic;
+  color: #444;
 }
 
 #canvas_title, #canvas_bg_url {
-	display: block;
-	width: 96%;
+  display: block;
+  width: 96%;
 }
 
 
 #svg_source_editor form {
-	position: absolute;
-	top: 40px;
-	bottom: 30px;
-	width: 100%;
+  position: absolute;
+  top: 40px;
+  bottom: 30px;
+  width: 100%;
 }
 
 #svg_source_editor #svg_source_textarea {
-	position: relative;
-	width: 95%;
-	height: 95%;
-	padding: 5px;
-	font-size: 12px;
+  position: relative;
+  width: 95%;
+  height: 95%;
+  padding: 5px;
+  font-size: 12px;
 }
 
 #svg_source_editor #tool_source_back {
-	text-align: left;
-	padding-left: 20px;
+  text-align: left;
+  padding-left: 20px;
 }
 
 #svg_prefs_container div.color_block {
-	float: left;
-	margin: 2px;
-	padding: 20px;
+  float: left;
+  margin: 2px;
+  padding: 20px;
 }
 
 #change_background div.cur_background {
-	border: 2px solid blue;
-	padding: 18px;
+  border: 2px solid blue;
+  padding: 18px;
 }
 
 #background_img {
-	position: absolute;
-	top: 0;
-	left: 0;
-	text-align: left;
+  position: absolute;
+  top: 0;
+  left: 0;
+  text-align: left;
 }
 
 #svg_docprops button,
 #svg_prefs button {
-	margin-top: 0;
-	margin-bottom: 5px;
+  margin-top: 0;
+  margin-bottom: 5px;
 }
 
 #svg_docprops,
 #svg_prefs {
-	display: none;
+  display: none;
 }
 
 #image_save_opts label {
-	font-size: .9em;
+  font-size: .9em;
 }
 
 #image_save_opts input {
-	margin-left: 0;
+  margin-left: 0;
 }
 
 #tool_prefs_option {
-	float: right;
+  float: right;
 }
 
 .toolbar_button button {
-	border:1px solid #dedede;
-	line-height:130%;
-	float: left;
-	background: #E8E8E8 none;
-	padding:5px 10px 5px 7px; /* Firefox */
-	line-height:17px; /* Safari */
-	margin: 5px 20px 0 0;
-	border: 1px #808080 solid;
-	border-top-color: #FFF;
-	border-left-color: #FFF;
-	border-radius: 5px;
-	-moz-border-radius: 5px;
-	-webkit-border-radius: 5px;
+  border:1px solid #dedede;
+  line-height:130%;
+  float: left;
+  background: #E8E8E8 none;
+  padding:5px 10px 5px 7px; /* Firefox */
+  line-height:17px; /* Safari */
+  margin: 5px 20px 0 0;
+  border: 1px #808080 solid;
+  border-top-color: #FFF;
+  border-left-color: #FFF;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
 }
 
 .toolbar_button button:hover {
-	border: 1px #e0a874 solid;
-	border-top-color: #fcd9ba;
-	border-left-color: #fcd9ba;
-	background-color: #FFC;
+  border: 1px #e0a874 solid;
+  border-top-color: #fcd9ba;
+  border-left-color: #fcd9ba;
+  background-color: #FFC;
 }
 .toolbar_button button:active {
-	background-color: #F4E284;
-	border-left: 1px solid #663300;
-	border-top: 1px solid #663300;
+  background-color: #F4E284;
+  border-left: 1px solid #663300;
+  border-top: 1px solid #663300;
 }
 
 .toolbar_button button .svg_icon {
-	margin: 0 3px -3px 0 !important;
-	padding: 0;
-	border: none;
-	width: 16px;
-	height: 16px;
+  margin: 0 3px -3px 0 !important;
+  padding: 0;
+  border: none;
+  width: 16px;
+  height: 16px;
 }
 
 #dialog_box {
-	display: none;
+  display: none;
 }
 
 #dialog_content {
-	height: 95px;
-	margin: 10px 10px 5px 10px;
-	background: #DDD;
-	overflow: auto;
-	text-align: left;
-	border: 1px solid #B0B0B0;
+  height: 95px;
+  margin: 10px 10px 5px 10px;
+  background: #DDD;
+  overflow: auto;
+  text-align: left;
+  border: 1px solid #B0B0B0;
 }
 
 #dialog_content.prompt {
-	height: 75px;
+  height: 75px;
 }
 
 #dialog_content p {
-	margin: 10px;
-	line-height: 1.3em;
+  margin: 10px;
+  line-height: 1.3em;
 }
 
 #dialog_container {
-	position: absolute;
-	font-family: Verdana;
-	text-align: center;
-	left: 50%;
-	top: 50%;
-	width: 300px;
-	margin-left: -150px;
-	height: 150px;
-	margin-top: -80px;
-	position: fixed;
-	z-index: 50001;
-	background: #CCC;
-	border: 1px outset #777;
-	font-family:Verdana,Helvetica,sans-serif;
-	font-size:0.8em;
+  position: absolute;
+  font-family: Verdana;
+  text-align: center;
+  left: 50%;
+  top: 50%;
+  width: 300px;
+  margin-left: -150px;
+  height: 150px;
+  margin-top: -80px;
+  position: fixed;
+  z-index: 50001;
+  background: #CCC;
+  border: 1px outset #777;
+  font-family:Verdana,Helvetica,sans-serif;
+  font-size:0.8em;
 }
 
 #dialog_container, #dialog_content {
-	border-radius: 5px;
-	-moz-border-radius: 5px;
-	-webkit-border-radius: 5px;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
 }
 
 #dialog_buttons input[type=text] {
-	width: 90%;
-	display: block;
-	margin: 0 0 5px 11px;
+  width: 90%;
+  display: block;
+  margin: 0 0 5px 11px;
 }
 
 #dialog_buttons input[type=button] {
-	margin: 0 1em;
+  margin: 0 1em;
 }
 
 /* Slider
@@ -1361,93 +1361,93 @@ ul li.current {
 .ui-slider-vertical .ui-slider-range-max { top: 0; }
 
 .ui-slider {
-	border: 1px solid #B0B0B0;
+  border: 1px solid #B0B0B0;
 }
 
 .ui-slider-handle {
-	background: #B0B0B0;
-	border: 1px solid #000;
+  background: #B0B0B0;
+  border: 1px solid #000;
 }
 
 /* Necessary to keep the flyouts sized properly */
 .tools_flyout .tool_button,
 .tools_flyout .tool_flyout {
-	padding: 2px;
-	width: 24px;
-	height: 24px;
-	margin: 0;
-	border-radius: 0px;
-	-moz-border-radius: 0px;
-	-webkit-border-radius: 0px;
+  padding: 2px;
+  width: 24px;
+  height: 24px;
+  margin: 0;
+  border-radius: 0px;
+  -moz-border-radius: 0px;
+  -webkit-border-radius: 0px;
 }
 
 /* Generic context menu styles */
 .contextMenu {
-	position: absolute;
-	z-index: 99999;
-	border: solid 1px rgba(0,0,0,.33);
-	background: rgba(255,255,255,.95);
-	padding: 5px 0;
-	margin: 0px;
-	display: none;
-	font: 12px/15px Lucida Sans, Helvetica, Verdana, sans-serif;
-	border-radius: 5px;
-	-moz-border-radius: 5px;
-	-moz-box-shadow: 2px 5px 10px rgba(0,0,0,.3);
-	-webkit-box-shadow: 2px 5px 10px rgba(0,0,0,.3);
-	box-shadow: 2px 5px 10px rgba(0,0,0,.3);
+  position: absolute;
+  z-index: 99999;
+  border: solid 1px rgba(0,0,0,.33);
+  background: rgba(255,255,255,.95);
+  padding: 5px 0;
+  margin: 0px;
+  display: none;
+  font: 12px/15px Lucida Sans, Helvetica, Verdana, sans-serif;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -moz-box-shadow: 2px 5px 10px rgba(0,0,0,.3);
+  -webkit-box-shadow: 2px 5px 10px rgba(0,0,0,.3);
+  box-shadow: 2px 5px 10px rgba(0,0,0,.3);
 }
 
 .contextMenu LI {
-	list-style: none;
-	padding: 0px;
-	margin: 0px;
+  list-style: none;
+  padding: 0px;
+  margin: 0px;
 }
 
 .contextMenu .shortcut {
-	width: 115px;
-	text-align:right;
-	float:right;
+  width: 115px;
+  text-align:right;
+  float:right;
 }
 
 .contextMenu A {
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	color: #222;
-	text-decoration: none;
-	display: block;
-	line-height: 20px;
-	height: 20px;
-	background-position: 6px center;
-	background-repeat: no-repeat;
-	outline: none;
-	padding: 0px 15px 1px 20px;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  color: #222;
+  text-decoration: none;
+  display: block;
+  line-height: 20px;
+  height: 20px;
+  background-position: 6px center;
+  background-repeat: no-repeat;
+  outline: none;
+  padding: 0px 15px 1px 20px;
 }
 
 .contextMenu LI.hover A {
-	background-color: #2e5dea;
-	color: white;
-	cursor: default;
+  background-color: #2e5dea;
+  color: white;
+  cursor: default;
 }
 
 .contextMenu LI.disabled A {
-	color: #999;
+  color: #999;
 }
 
 .contextMenu LI.hover.disabled A {
-	background-color: transparent;
+  background-color: transparent;
 }
 
 .contextMenu LI.separator {
-	border-top: solid 1px #E3E3E3;
-	padding-top: 5px;
-	margin-top: 5px;
+  border-top: solid 1px #E3E3E3;
+  padding-top: 5px;
+  margin-top: 5px;
 }
 
 /*
-	Adding Icons
-	You can add icons to the context menu by adding
-	classes to the respective LI element(s)
+  Adding Icons
+  You can add icons to the context menu by adding
+  classes to the respective LI element(s)
 */
 /*
 
diff --git a/editor/svg-editor.html b/editor/svg-editor.html
index 8c93d9e6..0439b938 100644
--- a/editor/svg-editor.html
+++ b/editor/svg-editor.html
@@ -71,17 +71,17 @@
 <div id="svg_editor">
 
 <div id="rulers">
-	<div id="ruler_corner"></div>
-	<div id="ruler_x">
-		<div>
-			<canvas height="15"></canvas>
-		</div>
-	</div>
-	<div id="ruler_y">
-		<div>
-			<canvas width="15"></canvas>
-		</div>
-	</div>
+  <div id="ruler_corner"></div>
+  <div id="ruler_x">
+    <div>
+      <canvas height="15"></canvas>
+    </div>
+  </div>
+  <div id="ruler_y">
+    <div>
+      <canvas width="15"></canvas>
+    </div>
+  </div>
 </div>
 
 <div id="workarea">
@@ -92,514 +92,514 @@
 </div>
 
 <div id="sidepanels">
-	<div id="layerpanel">
-		<h3 id="layersLabel">Layers</h3>
-		<fieldset id="layerbuttons">
-			<div id="layer_new" class="layer_button"  title="New Layer"></div>
-			<div id="layer_delete" class="layer_button"  title="Delete Layer"></div>
-			<div id="layer_rename" class="layer_button"  title="Rename Layer"></div>
-			<div id="layer_up" class="layer_button"  title="Move Layer Up"></div>
-			<div id="layer_down" class="layer_button"  title="Move Layer Down"></div>
-			<div id="layer_moreopts" class="layer_button"  title="More Options"></div>
-		</fieldset>
+  <div id="layerpanel">
+    <h3 id="layersLabel">Layers</h3>
+    <fieldset id="layerbuttons">
+      <div id="layer_new" class="layer_button"  title="New Layer"></div>
+      <div id="layer_delete" class="layer_button"  title="Delete Layer"></div>
+      <div id="layer_rename" class="layer_button"  title="Rename Layer"></div>
+      <div id="layer_up" class="layer_button"  title="Move Layer Up"></div>
+      <div id="layer_down" class="layer_button"  title="Move Layer Down"></div>
+      <div id="layer_moreopts" class="layer_button"  title="More Options"></div>
+    </fieldset>
 
-		<table id="layerlist">
-			<tr class="layer">
-				<td class="layervis"></td>
-				<td class="layername">Layer 1</td>
-			</tr>
-		</table>
-		<span id="selLayerLabel">Move elements to:</span>
-		<select id="selLayerNames" title="Move selected elements to a different layer" disabled="disabled">
-			<option selected="selected" value="layer1">Layer 1</option>
-		</select>
-	</div>
-	<div id="sidepanel_handle" title="Drag left/right to resize side panel [X]">L a y e r s</div>
+    <table id="layerlist">
+      <tr class="layer">
+        <td class="layervis"></td>
+        <td class="layername">Layer 1</td>
+      </tr>
+    </table>
+    <span id="selLayerLabel">Move elements to:</span>
+    <select id="selLayerNames" title="Move selected elements to a different layer" disabled="disabled">
+      <option selected="selected" value="layer1">Layer 1</option>
+    </select>
+  </div>
+  <div id="sidepanel_handle" title="Drag left/right to resize side panel [X]">L a y e r s</div>
 </div>
 
 <div id="main_button">
-	<div id="main_icon" class="tool_button" title="Main Menu">
-		<span>SVG-Edit</span>
-		<div id="logo"></div>
-		<div class="dropdown"></div>
-	</div>
+  <div id="main_icon" class="tool_button" title="Main Menu">
+    <span>SVG-Edit</span>
+    <div id="logo"></div>
+    <div class="dropdown"></div>
+  </div>
 
-	<div id="main_menu">
+  <div id="main_menu">
 
-		<!-- File-like buttons: New, Save, Source -->
-		<ul>
-			<li id="tool_clear">
-				<div></div>
-				New Image (N)
-			</li>
+    <!-- File-like buttons: New, Save, Source -->
+    <ul>
+      <li id="tool_clear">
+        <div></div>
+        New Image (N)
+      </li>
 
-			<li id="tool_open" style="display:none;">
-				<div id="fileinputs">
-					<div></div>
-				</div>
-				Open SVG
-			</li>
+      <li id="tool_open" style="display:none;">
+        <div id="fileinputs">
+          <div></div>
+        </div>
+        Open SVG
+      </li>
 
-			<li id="tool_import" style="display:none;">
-				<div id="fileinputs_import">
-					<div></div>
-				</div>
-				Import Image
-			</li>
+      <li id="tool_import" style="display:none;">
+        <div id="fileinputs_import">
+          <div></div>
+        </div>
+        Import Image
+      </li>
 
-			<li id="tool_save">
-				<div></div>
-				Save Image (S)
-			</li>
+      <li id="tool_save">
+        <div></div>
+        Save Image (S)
+      </li>
 
-			<li id="tool_export">
-				<div></div>
-				Export
-			</li>
+      <li id="tool_export">
+        <div></div>
+        Export
+      </li>
 
-			<li id="tool_docprops">
-				<div></div>
-				Document Properties (D)
-			</li>
-		</ul>
+      <li id="tool_docprops">
+        <div></div>
+        Document Properties (D)
+      </li>
+    </ul>
 
-		<p>
-			<a href="https://github.com/SVG-Edit/svgedit" target="_blank">
-				SVG-edit Home Page
-			</a>
-		</p>
+    <p>
+      <a href="https://github.com/SVG-Edit/svgedit" target="_blank">
+        SVG-edit Home Page
+      </a>
+    </p>
 
-		<button id="tool_prefs_option">
-			Editor Options
-		</button>
+    <button id="tool_prefs_option">
+      Editor Options
+    </button>
 
 
-	</div>
+  </div>
 </div>
 
 
 
 <div id="tools_top" class="tools_panel">
 
-	<div id="editor_panel">
-		<div class="tool_sep"></div>
-		<div class="push_button" id="tool_source" title="Edit Source [U]"></div>
-		<div class="tool_button" id="tool_wireframe" title="Wireframe Mode [F]"></div>
-	</div>
-
-	<!-- History buttons -->
-	<div id="history_panel">
-		<div class="tool_sep"></div>
-		<div class="push_button tool_button_disabled" id="tool_undo" title="Undo [Z]"></div>
-		<div class="push_button tool_button_disabled" id="tool_redo" title="Redo [Y]"></div>
-	</div>
-
-	<!-- Buttons when a single element is selected -->
-	<div id="selected_panel">
-		<div class="toolset">
-			<div class="tool_sep"></div>
-			<div class="push_button" id="tool_clone" title="Duplicate Element [D]"></div>
-			<div class="push_button" id="tool_delete" title="Delete Element [Delete/Backspace]"></div>
-			<div class="tool_sep"></div>
-			<div class="push_button" id="tool_move_top" title="Bring to Front [ Ctrl+Shift+] ]"></div>
-			<div class="push_button" id="tool_move_bottom" title="Send to Back [ Ctrl+Shift+[ ]"></div>
-			<div class="push_button" id="tool_topath" title="Convert to Path"></div>
-			<div class="push_button" id="tool_reorient" title="Reorient path"></div>
-			<div class="push_button" id="tool_make_link" title="Make (hyper)link"></div>
-			<div class="tool_sep"></div>
-			<label id="idLabel" title="Identify the element">
-				<span>id:</span>
-				<input id="elem_id" class="attr_changer" data-attr="id" size="10" type="text"/>
-			</label>
-			<label id="classLabel" title="Element class">
-				<span>class:</span>
-				<input id="elem_class" class="attr_changer" data-attr="class" size="10" type="text"/>
-			</label>
-		</div>
-
-		<label id="tool_angle" title="Change rotation angle" class="toolset">
-			<span id="angleLabel" class="icon_label"></span>
-			<input id="angle" size="2" value="0" type="text"/>
-		</label>
-
-		<div class="toolset" id="tool_blur" title="Change gaussian blur value">
-			<label>
-				<span id="blurLabel" class="icon_label"></span>
-				<input id="blur" size="2" value="0" type="text"/>
-			</label>
-			<div id="blur_dropdown" class="dropdown">
-				<button></button>
-				<ul>
-					<li class="special"><div id="blur_slider"></div></li>
-				</ul>
-			</div>
-		</div>
-
-		<div class="dropdown toolset" id="tool_position" title="Align Element to Page">
-				<div id="cur_position" class="icon_label"></div>
-				<button></button>
-		</div>
-
-		<div id="xy_panel" class="toolset">
-			<label>
-				x: <input id="selected_x" class="attr_changer" title="Change X coordinate" size="3" data-attr="x"/>
-			</label>
-			<label>
-				y: <input id="selected_y" class="attr_changer" title="Change Y coordinate" size="3" data-attr="y"/>
-			</label>
-		</div>
-	</div>
-
-	<!-- Buttons when multiple elements are selected -->
-	<div id="multiselected_panel">
-		<div class="tool_sep"></div>
-		<div class="push_button" id="tool_clone_multi" title="Clone Elements [C]"></div>
-		<div class="push_button" id="tool_delete_multi" title="Delete Selected Elements [Delete/Backspace]"></div>
-		<div class="tool_sep"></div>
-		<div class="push_button" id="tool_group_elements" title="Group Elements [G]"></div>
-		<div class="push_button" id="tool_make_link_multi" title="Make (hyper)link"></div>
-		<div class="push_button" id="tool_alignleft" title="Align Left"></div>
-		<div class="push_button" id="tool_aligncenter" title="Align Center"></div>
-		<div class="push_button" id="tool_alignright" title="Align Right"></div>
-		<div class="push_button" id="tool_aligntop" title="Align Top"></div>
-		<div class="push_button" id="tool_alignmiddle" title="Align Middle"></div>
-		<div class="push_button" id="tool_alignbottom" title="Align Bottom"></div>
-		<label id="tool_align_relative">
-			<span id="relativeToLabel">relative to:</span>
-			<select id="align_relative_to" title="Align relative to ...">
-			<option id="selected_objects" value="selected">selected objects</option>
-			<option id="largest_object" value="largest">largest object</option>
-			<option id="smallest_object" value="smallest">smallest object</option>
-			<option id="page" value="page">page</option>
-			</select>
-		</label>
-		<div class="tool_sep"></div>
-
-	</div>
-
-	<div id="rect_panel">
-		<div class="toolset">
-			<label id="rect_width_tool" title="Change rectangle width">
-				<span id="rwidthLabel" class="icon_label"></span>
-				<input id="rect_width" class="attr_changer" size="3" data-attr="width"/>
-			</label>
-			<label id="rect_height_tool" title="Change rectangle height">
-				<span id="rheightLabel" class="icon_label"></span>
-				<input id="rect_height" class="attr_changer" size="3" data-attr="height"/>
-			</label>
-		</div>
-		<label id="cornerRadiusLabel" title="Change Rectangle Corner Radius" class="toolset">
-			<span class="icon_label"></span>
-			<input id="rect_rx" size="3" value="0" type="text" data-attr="Corner Radius"/>
-		</label>
-	</div>
-
-	<div id="image_panel">
-	<div class="toolset">
-		<label><span id="iwidthLabel" class="icon_label"></span>
-		<input id="image_width" class="attr_changer" title="Change image width" size="3" data-attr="width"/>
-		</label>
-		<label><span id="iheightLabel" class="icon_label"></span>
-		<input id="image_height" class="attr_changer" title="Change image height" size="3" data-attr="height"/>
-		</label>
-	</div>
-	<div class="toolset">
-		<label id="tool_image_url">url:
-			<input id="image_url" type="text" title="Change URL" size="35"/>
-		</label>
-		<label id="tool_change_image">
-			<button id="change_image_url" style="display:none;">Change Image</button>
-			<span id="url_notice" title="NOTE: This image cannot be embedded. It will depend on this path to be displayed"></span>
-		</label>
-	</div>
+  <div id="editor_panel">
+    <div class="tool_sep"></div>
+    <div class="push_button" id="tool_source" title="Edit Source [U]"></div>
+    <div class="tool_button" id="tool_wireframe" title="Wireframe Mode [F]"></div>
   </div>
 
-	<div id="circle_panel">
-		<div class="toolset">
-			<label id="tool_circle_cx">cx:
-			<input id="circle_cx" class="attr_changer" title="Change circle's cx coordinate" size="3" data-attr="cx"/>
-			</label>
-			<label id="tool_circle_cy">cy:
-			<input id="circle_cy" class="attr_changer" title="Change circle's cy coordinate" size="3" data-attr="cy"/>
-			</label>
-		</div>
-		<div class="toolset">
-			<label id="tool_circle_r">r:
-			<input id="circle_r" class="attr_changer" title="Change circle's radius" size="3" data-attr="r"/>
-			</label>
-		</div>
-	</div>
+  <!-- History buttons -->
+  <div id="history_panel">
+    <div class="tool_sep"></div>
+    <div class="push_button tool_button_disabled" id="tool_undo" title="Undo [Z]"></div>
+    <div class="push_button tool_button_disabled" id="tool_redo" title="Redo [Y]"></div>
+  </div>
 
-	<div id="ellipse_panel">
-		<div class="toolset">
-			<label id="tool_ellipse_cx">cx:
-			<input id="ellipse_cx" class="attr_changer" title="Change ellipse's cx coordinate" size="3" data-attr="cx"/>
-			</label>
-			<label id="tool_ellipse_cy">cy:
-			<input id="ellipse_cy" class="attr_changer" title="Change ellipse's cy coordinate" size="3" data-attr="cy"/>
-			</label>
-		</div>
-		<div class="toolset">
-			<label id="tool_ellipse_rx">rx:
-			<input id="ellipse_rx" class="attr_changer" title="Change ellipse's x radius" size="3" data-attr="rx"/>
-			</label>
-			<label id="tool_ellipse_ry">ry:
-			<input id="ellipse_ry" class="attr_changer" title="Change ellipse's y radius" size="3" data-attr="ry"/>
-			</label>
-		</div>
-	</div>
+  <!-- Buttons when a single element is selected -->
+  <div id="selected_panel">
+    <div class="toolset">
+      <div class="tool_sep"></div>
+      <div class="push_button" id="tool_clone" title="Duplicate Element [D]"></div>
+      <div class="push_button" id="tool_delete" title="Delete Element [Delete/Backspace]"></div>
+      <div class="tool_sep"></div>
+      <div class="push_button" id="tool_move_top" title="Bring to Front [ Ctrl+Shift+] ]"></div>
+      <div class="push_button" id="tool_move_bottom" title="Send to Back [ Ctrl+Shift+[ ]"></div>
+      <div class="push_button" id="tool_topath" title="Convert to Path"></div>
+      <div class="push_button" id="tool_reorient" title="Reorient path"></div>
+      <div class="push_button" id="tool_make_link" title="Make (hyper)link"></div>
+      <div class="tool_sep"></div>
+      <label id="idLabel" title="Identify the element">
+        <span>id:</span>
+        <input id="elem_id" class="attr_changer" data-attr="id" size="10" type="text"/>
+      </label>
+      <label id="classLabel" title="Element class">
+        <span>class:</span>
+        <input id="elem_class" class="attr_changer" data-attr="class" size="10" type="text"/>
+      </label>
+    </div>
 
-	<div id="line_panel">
-		<div class="toolset">
-			<label id="tool_line_x1">x1:
-			<input id="line_x1" class="attr_changer" title="Change line's starting x coordinate" size="3" data-attr="x1"/>
-			</label>
-			<label id="tool_line_y1">y1:
-			<input id="line_y1" class="attr_changer" title="Change line's starting y coordinate" size="3" data-attr="y1"/>
-			</label>
-		</div>
-		<div class="toolset">
-			<label id="tool_line_x2">x2:
-			<input id="line_x2" class="attr_changer" title="Change line's ending x coordinate" size="3" data-attr="x2"/>
-			</label>
-			<label id="tool_line_y2">y2:
-			<input id="line_y2" class="attr_changer" title="Change line's ending y coordinate" size="3" data-attr="y2"/>
-			</label>
-		</div>
-	</div>
+    <label id="tool_angle" title="Change rotation angle" class="toolset">
+      <span id="angleLabel" class="icon_label"></span>
+      <input id="angle" size="2" value="0" type="text"/>
+    </label>
 
-	<div id="text_panel">
-		<div class="toolset">
-			<div class="tool_button" id="tool_bold" title="Bold Text [B]"><span></span>B</div>
-			<div class="tool_button" id="tool_italic" title="Italic Text [I]"><span></span>i</div>
-		</div>
+    <div class="toolset" id="tool_blur" title="Change gaussian blur value">
+      <label>
+        <span id="blurLabel" class="icon_label"></span>
+        <input id="blur" size="2" value="0" type="text"/>
+      </label>
+      <div id="blur_dropdown" class="dropdown">
+        <button></button>
+        <ul>
+          <li class="special"><div id="blur_slider"></div></li>
+        </ul>
+      </div>
+    </div>
 
-		<div class="toolset" id="tool_font_family">
-			<label>
-				<!-- Font family -->
-				<input id="font_family" type="text" title="Change Font Family" size="12"/>
-			</label>
-			<div id="font_family_dropdown" class="dropdown">
-				<button></button>
-				<ul>
-					<li style="font-family:serif">Serif</li>
-					<li style="font-family:sans-serif">Sans-serif</li>
-					<li style="font-family:cursive">Cursive</li>
-					<li style="font-family:fantasy">Fantasy</li>
-					<li style="font-family:monospace">Monospace</li>
-				</ul>
-			</div>
-		</div>
+    <div class="dropdown toolset" id="tool_position" title="Align Element to Page">
+        <div id="cur_position" class="icon_label"></div>
+        <button></button>
+    </div>
 
-		<label id="tool_font_size" title="Change Font Size">
-			<span id="font_sizeLabel" class="icon_label"></span>
-			<input id="font_size" size="3" value="0" type="text"/>
-		</label>
+    <div id="xy_panel" class="toolset">
+      <label>
+        x: <input id="selected_x" class="attr_changer" title="Change X coordinate" size="3" data-attr="x"/>
+      </label>
+      <label>
+        y: <input id="selected_y" class="attr_changer" title="Change Y coordinate" size="3" data-attr="y"/>
+      </label>
+    </div>
+  </div>
 
-		<!-- Not visible, but still used -->
-		<input id="text" type="text" size="35"/>
-	</div>
+  <!-- Buttons when multiple elements are selected -->
+  <div id="multiselected_panel">
+    <div class="tool_sep"></div>
+    <div class="push_button" id="tool_clone_multi" title="Clone Elements [C]"></div>
+    <div class="push_button" id="tool_delete_multi" title="Delete Selected Elements [Delete/Backspace]"></div>
+    <div class="tool_sep"></div>
+    <div class="push_button" id="tool_group_elements" title="Group Elements [G]"></div>
+    <div class="push_button" id="tool_make_link_multi" title="Make (hyper)link"></div>
+    <div class="push_button" id="tool_alignleft" title="Align Left"></div>
+    <div class="push_button" id="tool_aligncenter" title="Align Center"></div>
+    <div class="push_button" id="tool_alignright" title="Align Right"></div>
+    <div class="push_button" id="tool_aligntop" title="Align Top"></div>
+    <div class="push_button" id="tool_alignmiddle" title="Align Middle"></div>
+    <div class="push_button" id="tool_alignbottom" title="Align Bottom"></div>
+    <label id="tool_align_relative">
+      <span id="relativeToLabel">relative to:</span>
+      <select id="align_relative_to" title="Align relative to ...">
+      <option id="selected_objects" value="selected">selected objects</option>
+      <option id="largest_object" value="largest">largest object</option>
+      <option id="smallest_object" value="smallest">smallest object</option>
+      <option id="page" value="page">page</option>
+      </select>
+    </label>
+    <div class="tool_sep"></div>
 
-	<!-- formerly gsvg_panel -->
-	<div id="container_panel">
-		<div class="tool_sep"></div>
+  </div>
 
-		<!-- Add viewBox field here? -->
+  <div id="rect_panel">
+    <div class="toolset">
+      <label id="rect_width_tool" title="Change rectangle width">
+        <span id="rwidthLabel" class="icon_label"></span>
+        <input id="rect_width" class="attr_changer" size="3" data-attr="width"/>
+      </label>
+      <label id="rect_height_tool" title="Change rectangle height">
+        <span id="rheightLabel" class="icon_label"></span>
+        <input id="rect_height" class="attr_changer" size="3" data-attr="height"/>
+      </label>
+    </div>
+    <label id="cornerRadiusLabel" title="Change Rectangle Corner Radius" class="toolset">
+      <span class="icon_label"></span>
+      <input id="rect_rx" size="3" value="0" type="text" data-attr="Corner Radius"/>
+    </label>
+  </div>
 
-		<label id="group_title" title="Group identification label">
-			<span>label:</span>
-			<input id="g_title" data-attr="title" size="10" type="text"/>
-		</label>
-	</div>
+  <div id="image_panel">
+  <div class="toolset">
+    <label><span id="iwidthLabel" class="icon_label"></span>
+    <input id="image_width" class="attr_changer" title="Change image width" size="3" data-attr="width"/>
+    </label>
+    <label><span id="iheightLabel" class="icon_label"></span>
+    <input id="image_height" class="attr_changer" title="Change image height" size="3" data-attr="height"/>
+    </label>
+  </div>
+  <div class="toolset">
+    <label id="tool_image_url">url:
+      <input id="image_url" type="text" title="Change URL" size="35"/>
+    </label>
+    <label id="tool_change_image">
+      <button id="change_image_url" style="display:none;">Change Image</button>
+      <span id="url_notice" title="NOTE: This image cannot be embedded. It will depend on this path to be displayed"></span>
+    </label>
+  </div>
+  </div>
 
-	<div id="use_panel">
-		<div class="push_button" id="tool_unlink_use" title="Break link to reference element (make unique)"></div>
-	</div>
+  <div id="circle_panel">
+    <div class="toolset">
+      <label id="tool_circle_cx">cx:
+      <input id="circle_cx" class="attr_changer" title="Change circle's cx coordinate" size="3" data-attr="cx"/>
+      </label>
+      <label id="tool_circle_cy">cy:
+      <input id="circle_cy" class="attr_changer" title="Change circle's cy coordinate" size="3" data-attr="cy"/>
+      </label>
+    </div>
+    <div class="toolset">
+      <label id="tool_circle_r">r:
+      <input id="circle_r" class="attr_changer" title="Change circle's radius" size="3" data-attr="r"/>
+      </label>
+    </div>
+  </div>
 
-	<div id="g_panel">
-		<div class="push_button" id="tool_ungroup" title="Ungroup Elements [G]"></div>
-	</div>
+  <div id="ellipse_panel">
+    <div class="toolset">
+      <label id="tool_ellipse_cx">cx:
+      <input id="ellipse_cx" class="attr_changer" title="Change ellipse's cx coordinate" size="3" data-attr="cx"/>
+      </label>
+      <label id="tool_ellipse_cy">cy:
+      <input id="ellipse_cy" class="attr_changer" title="Change ellipse's cy coordinate" size="3" data-attr="cy"/>
+      </label>
+    </div>
+    <div class="toolset">
+      <label id="tool_ellipse_rx">rx:
+      <input id="ellipse_rx" class="attr_changer" title="Change ellipse's x radius" size="3" data-attr="rx"/>
+      </label>
+      <label id="tool_ellipse_ry">ry:
+      <input id="ellipse_ry" class="attr_changer" title="Change ellipse's y radius" size="3" data-attr="ry"/>
+      </label>
+    </div>
+  </div>
 
-	<!-- For anchor elements -->
-	<div id="a_panel">
-		<label id="tool_link_url" title="Set link URL (leave empty to remove)">
-			<span id="linkLabel" class="icon_label"></span>
-			<input id="link_url" type="text" size="35"/>
-		</label>
-	</div>
+  <div id="line_panel">
+    <div class="toolset">
+      <label id="tool_line_x1">x1:
+      <input id="line_x1" class="attr_changer" title="Change line's starting x coordinate" size="3" data-attr="x1"/>
+      </label>
+      <label id="tool_line_y1">y1:
+      <input id="line_y1" class="attr_changer" title="Change line's starting y coordinate" size="3" data-attr="y1"/>
+      </label>
+    </div>
+    <div class="toolset">
+      <label id="tool_line_x2">x2:
+      <input id="line_x2" class="attr_changer" title="Change line's ending x coordinate" size="3" data-attr="x2"/>
+      </label>
+      <label id="tool_line_y2">y2:
+      <input id="line_y2" class="attr_changer" title="Change line's ending y coordinate" size="3" data-attr="y2"/>
+      </label>
+    </div>
+  </div>
 
-	<div id="path_node_panel">
-		<div class="tool_sep"></div>
-		<div class="tool_button push_button_pressed" id="tool_node_link" title="Link Control Points"></div>
-		<div class="tool_sep"></div>
-		<label id="tool_node_x">x:
-			<input id="path_node_x" class="attr_changer" title="Change node's x coordinate" size="3" data-attr="x"/>
-		</label>
-		<label id="tool_node_y">y:
-			<input id="path_node_y" class="attr_changer" title="Change node's y coordinate" size="3" data-attr="y"/>
-		</label>
+  <div id="text_panel">
+    <div class="toolset">
+      <div class="tool_button" id="tool_bold" title="Bold Text [B]"><span></span>B</div>
+      <div class="tool_button" id="tool_italic" title="Italic Text [I]"><span></span>i</div>
+    </div>
 
-		<select id="seg_type" title="Change Segment type">
-			<option id="straight_segments" selected="selected" value="4">Straight</option>
-			<option id="curve_segments" value="6">Curve</option>
-		</select>
-		<div class="tool_button" id="tool_node_clone" title="Clone Node"></div>
-		<div class="tool_button" id="tool_node_delete" title="Delete Node"></div>
-		<div class="tool_button" id="tool_openclose_path" title="Open/close sub-path"></div>
-		<div class="tool_button" id="tool_add_subpath" title="Add sub-path"></div>
-	</div>
+    <div class="toolset" id="tool_font_family">
+      <label>
+        <!-- Font family -->
+        <input id="font_family" type="text" title="Change Font Family" size="12"/>
+      </label>
+      <div id="font_family_dropdown" class="dropdown">
+        <button></button>
+        <ul>
+          <li style="font-family:serif">Serif</li>
+          <li style="font-family:sans-serif">Sans-serif</li>
+          <li style="font-family:cursive">Cursive</li>
+          <li style="font-family:fantasy">Fantasy</li>
+          <li style="font-family:monospace">Monospace</li>
+        </ul>
+      </div>
+    </div>
+
+    <label id="tool_font_size" title="Change Font Size">
+      <span id="font_sizeLabel" class="icon_label"></span>
+      <input id="font_size" size="3" value="0" type="text"/>
+    </label>
+
+    <!-- Not visible, but still used -->
+    <input id="text" type="text" size="35"/>
+  </div>
+
+  <!-- formerly gsvg_panel -->
+  <div id="container_panel">
+    <div class="tool_sep"></div>
+
+    <!-- Add viewBox field here? -->
+
+    <label id="group_title" title="Group identification label">
+      <span>label:</span>
+      <input id="g_title" data-attr="title" size="10" type="text"/>
+    </label>
+  </div>
+
+  <div id="use_panel">
+    <div class="push_button" id="tool_unlink_use" title="Break link to reference element (make unique)"></div>
+  </div>
+
+  <div id="g_panel">
+    <div class="push_button" id="tool_ungroup" title="Ungroup Elements [G]"></div>
+  </div>
+
+  <!-- For anchor elements -->
+  <div id="a_panel">
+    <label id="tool_link_url" title="Set link URL (leave empty to remove)">
+      <span id="linkLabel" class="icon_label"></span>
+      <input id="link_url" type="text" size="35"/>
+    </label>
+  </div>
+
+  <div id="path_node_panel">
+    <div class="tool_sep"></div>
+    <div class="tool_button push_button_pressed" id="tool_node_link" title="Link Control Points"></div>
+    <div class="tool_sep"></div>
+    <label id="tool_node_x">x:
+      <input id="path_node_x" class="attr_changer" title="Change node's x coordinate" size="3" data-attr="x"/>
+    </label>
+    <label id="tool_node_y">y:
+      <input id="path_node_y" class="attr_changer" title="Change node's y coordinate" size="3" data-attr="y"/>
+    </label>
+
+    <select id="seg_type" title="Change Segment type">
+      <option id="straight_segments" selected="selected" value="4">Straight</option>
+      <option id="curve_segments" value="6">Curve</option>
+    </select>
+    <div class="tool_button" id="tool_node_clone" title="Clone Node"></div>
+    <div class="tool_button" id="tool_node_delete" title="Delete Node"></div>
+    <div class="tool_button" id="tool_openclose_path" title="Open/close sub-path"></div>
+    <div class="tool_button" id="tool_add_subpath" title="Add sub-path"></div>
+  </div>
 </div> <!-- tools_top -->
-	<div id="cur_context_panel">
+  <div id="cur_context_panel">
 
-	</div>
+  </div>
 
 
 <div id="tools_left" class="tools_panel">
-	<div class="tool_button" id="tool_select" title="Select Tool"></div>
-	<div class="tool_button" id="tool_fhpath" title="Pencil Tool"></div>
-	<div class="tool_button" id="tool_line" title="Line Tool"></div>
-	<div class="tool_button flyout_current" id="tools_rect_show" title="Square/Rect Tool">
-		<div class="flyout_arrow_horiz"></div>
-	</div>
-	<div class="tool_button flyout_current" id="tools_ellipse_show" title="Ellipse/Circle Tool">
-		<div class="flyout_arrow_horiz"></div>
-	</div>
-	<div class="tool_button" id="tool_path" title="Path Tool"></div>
-	<div class="tool_button" id="tool_text" title="Text Tool"></div>
-	<div class="tool_button" id="tool_image" title="Image Tool"></div>
-	<div class="tool_button" id="tool_zoom" title="Zoom Tool [Ctrl+Up/Down]"></div>
+  <div class="tool_button" id="tool_select" title="Select Tool"></div>
+  <div class="tool_button" id="tool_fhpath" title="Pencil Tool"></div>
+  <div class="tool_button" id="tool_line" title="Line Tool"></div>
+  <div class="tool_button flyout_current" id="tools_rect_show" title="Square/Rect Tool">
+    <div class="flyout_arrow_horiz"></div>
+  </div>
+  <div class="tool_button flyout_current" id="tools_ellipse_show" title="Ellipse/Circle Tool">
+    <div class="flyout_arrow_horiz"></div>
+  </div>
+  <div class="tool_button" id="tool_path" title="Path Tool"></div>
+  <div class="tool_button" id="tool_text" title="Text Tool"></div>
+  <div class="tool_button" id="tool_image" title="Image Tool"></div>
+  <div class="tool_button" id="tool_zoom" title="Zoom Tool [Ctrl+Up/Down]"></div>
 
-	<div style="display: none">
-		<div id="tool_rect" title="Rectangle"></div>
-		<div id="tool_square" title="Square"></div>
-		<div id="tool_fhrect" title="Free-Hand Rectangle"></div>
-		<div id="tool_ellipse" title="Ellipse"></div>
-		<div id="tool_circle" title="Circle"></div>
-		<div id="tool_fhellipse" title="Free-Hand Ellipse"></div>
-	</div>
+  <div style="display: none">
+    <div id="tool_rect" title="Rectangle"></div>
+    <div id="tool_square" title="Square"></div>
+    <div id="tool_fhrect" title="Free-Hand Rectangle"></div>
+    <div id="tool_ellipse" title="Ellipse"></div>
+    <div id="tool_circle" title="Circle"></div>
+    <div id="tool_fhellipse" title="Free-Hand Ellipse"></div>
+  </div>
 </div> <!-- tools_left -->
 
 <div id="tools_bottom" class="tools_panel">
 
-	<!-- Zoom buttons -->
-	<div id="zoom_panel" class="toolset" title="Change zoom level">
-		<label>
-		<span id="zoomLabel" class="zoom_tool icon_label"></span>
-		<input id="zoom" size="3" value="100" type="text" />
-		</label>
-		<div id="zoom_dropdown" class="dropdown">
-			<button></button>
-			<ul>
-				<li>1000%</li>
-				<li>400%</li>
-				<li>200%</li>
-				<li>100%</li>
-				<li>50%</li>
-				<li>25%</li>
-				<li id="fit_to_canvas" data-val="canvas">Fit to canvas</li>
-				<li id="fit_to_sel" data-val="selection">Fit to selection</li>
-				<li id="fit_to_layer_content" data-val="layer">Fit to layer content</li>
-				<li id="fit_to_all" data-val="content">Fit to all content</li>
-				<li>100%</li>
-			</ul>
-		</div>
-		<div class="tool_sep"></div>
-	</div>
+  <!-- Zoom buttons -->
+  <div id="zoom_panel" class="toolset" title="Change zoom level">
+    <label>
+    <span id="zoomLabel" class="zoom_tool icon_label"></span>
+    <input id="zoom" size="3" value="100" type="text" />
+    </label>
+    <div id="zoom_dropdown" class="dropdown">
+      <button></button>
+      <ul>
+        <li>1000%</li>
+        <li>400%</li>
+        <li>200%</li>
+        <li>100%</li>
+        <li>50%</li>
+        <li>25%</li>
+        <li id="fit_to_canvas" data-val="canvas">Fit to canvas</li>
+        <li id="fit_to_sel" data-val="selection">Fit to selection</li>
+        <li id="fit_to_layer_content" data-val="layer">Fit to layer content</li>
+        <li id="fit_to_all" data-val="content">Fit to all content</li>
+        <li>100%</li>
+      </ul>
+    </div>
+    <div class="tool_sep"></div>
+  </div>
 
-	<div id="tools_bottom_2">
-		<div id="color_tools">
+  <div id="tools_bottom_2">
+    <div id="color_tools">
 
-			<div class="color_tool" id="tool_fill">
-				<label class="icon_label" for="fill_color" title="Change fill color"></label>
-				<div class="color_block">
-					<div id="fill_bg"></div>
-					<div id="fill_color" class="color_block"></div>
-				</div>
-			</div>
+      <div class="color_tool" id="tool_fill">
+        <label class="icon_label" for="fill_color" title="Change fill color"></label>
+        <div class="color_block">
+          <div id="fill_bg"></div>
+          <div id="fill_color" class="color_block"></div>
+        </div>
+      </div>
 
-			<div class="color_tool" id="tool_stroke">
-				<label class="icon_label" title="Change stroke color"></label>
-				<div class="color_block">
-					<div id="stroke_bg"></div>
-					<div id="stroke_color" class="color_block" title="Change stroke color"></div>
-				</div>
+      <div class="color_tool" id="tool_stroke">
+        <label class="icon_label" title="Change stroke color"></label>
+        <div class="color_block">
+          <div id="stroke_bg"></div>
+          <div id="stroke_color" class="color_block" title="Change stroke color"></div>
+        </div>
 
-				<label class="stroke_label">
-					<input id="stroke_width" title="Change stroke width by 1, shift-click to change by 0.1" size="2" value="5" type="text" data-attr="Stroke Width"/>
-				</label>
+        <label class="stroke_label">
+          <input id="stroke_width" title="Change stroke width by 1, shift-click to change by 0.1" size="2" value="5" type="text" data-attr="Stroke Width"/>
+        </label>
 
-				<div id="toggle_stroke_tools" title="Show/hide more stroke tools"></div>
+        <div id="toggle_stroke_tools" title="Show/hide more stroke tools"></div>
 
-				<label class="stroke_tool">
-					<select id="stroke_style" title="Change stroke dash style">
-						<option selected="selected" value="none">&#8212;</option>
-						<option value="2,2">...</option>
-						<option value="5,5">- -</option>
-						<option value="5,2,2,2">- .</option>
-						<option value="5,2,2,2,2,2">- ..</option>
-					</select>
-				</label>
+        <label class="stroke_tool">
+          <select id="stroke_style" title="Change stroke dash style">
+            <option selected="selected" value="none">&#8212;</option>
+            <option value="2,2">...</option>
+            <option value="5,5">- -</option>
+            <option value="5,2,2,2">- .</option>
+            <option value="5,2,2,2,2,2">- ..</option>
+          </select>
+        </label>
 
- 				<div class="stroke_tool dropdown" id="stroke_linejoin">
-					<div id="cur_linejoin" title="Linejoin: Miter"></div>
-					<button></button>
- 				</div>
+         <div class="stroke_tool dropdown" id="stroke_linejoin">
+          <div id="cur_linejoin" title="Linejoin: Miter"></div>
+          <button></button>
+         </div>
 
- 				<div class="stroke_tool dropdown" id="stroke_linecap">
-					<div id="cur_linecap" title="Linecap: Butt"></div>
-					<button></button>
- 				</div>
+         <div class="stroke_tool dropdown" id="stroke_linecap">
+          <div id="cur_linecap" title="Linecap: Butt"></div>
+          <button></button>
+         </div>
 
-			</div>
+      </div>
 
-			<div class="color_tool" id="tool_opacity" title="Change selected item opacity">
-				<label>
-					<span id="group_opacityLabel" class="icon_label"></span>
-					<input id="group_opacity" size="3" value="100" type="text"/>
-				</label>
-				<div id="opacity_dropdown" class="dropdown">
-					<button></button>
-					<ul>
-						<li>0%</li>
-						<li>25%</li>
-						<li>50%</li>
-						<li>75%</li>
-						<li>100%</li>
-						<li class="special"><div id="opac_slider"></div></li>
-					</ul>
-				</div>
-			</div>
-		</div>
+      <div class="color_tool" id="tool_opacity" title="Change selected item opacity">
+        <label>
+          <span id="group_opacityLabel" class="icon_label"></span>
+          <input id="group_opacity" size="3" value="100" type="text"/>
+        </label>
+        <div id="opacity_dropdown" class="dropdown">
+          <button></button>
+          <ul>
+            <li>0%</li>
+            <li>25%</li>
+            <li>50%</li>
+            <li>75%</li>
+            <li>100%</li>
+            <li class="special"><div id="opac_slider"></div></li>
+          </ul>
+        </div>
+      </div>
+    </div>
 
-	</div>
+  </div>
 
-	<div id="tools_bottom_3">
-		<div id="palette_holder"><div id="palette" title="Click to change fill color, shift-click to change stroke color"></div></div>
-	</div>
-	<!-- <div id="copyright"><span id="copyrightLabel">Powered by</span> <a href="http://svg-edit.googlecode.com/" target="_blank">SVG-edit v2.6-beta</a></div> -->
+  <div id="tools_bottom_3">
+    <div id="palette_holder"><div id="palette" title="Click to change fill color, shift-click to change stroke color"></div></div>
+  </div>
+  <!-- <div id="copyright"><span id="copyrightLabel">Powered by</span> <a href="http://svg-edit.googlecode.com/" target="_blank">SVG-edit v2.6-beta</a></div> -->
 </div>
 
 <div id="option_lists" class="dropdown">
-	<ul id="linejoin_opts">
-		<li class="tool_button current" id="linejoin_miter" title="Linejoin: Miter"></li>
-		<li class="tool_button" id="linejoin_round" title="Linejoin: Round"></li>
-		<li class="tool_button" id="linejoin_bevel" title="Linejoin: Bevel"></li>
-	</ul>
+  <ul id="linejoin_opts">
+    <li class="tool_button current" id="linejoin_miter" title="Linejoin: Miter"></li>
+    <li class="tool_button" id="linejoin_round" title="Linejoin: Round"></li>
+    <li class="tool_button" id="linejoin_bevel" title="Linejoin: Bevel"></li>
+  </ul>
 
-	<ul id="linecap_opts">
-		<li class="tool_button current" id="linecap_butt" title="Linecap: Butt"></li>
-		<li class="tool_button" id="linecap_square" title="Linecap: Square"></li>
-		<li class="tool_button" id="linecap_round" title="Linecap: Round"></li>
-	</ul>
+  <ul id="linecap_opts">
+    <li class="tool_button current" id="linecap_butt" title="Linecap: Butt"></li>
+    <li class="tool_button" id="linecap_square" title="Linecap: Square"></li>
+    <li class="tool_button" id="linecap_round" title="Linecap: Round"></li>
+  </ul>
 
-	<ul id="position_opts" class="optcols3">
-		<li class="push_button" id="tool_posleft" title="Align Left"></li>
-		<li class="push_button" id="tool_poscenter" title="Align Center"></li>
-		<li class="push_button" id="tool_posright" title="Align Right"></li>
-		<li class="push_button" id="tool_postop" title="Align Top"></li>
-		<li class="push_button" id="tool_posmiddle" title="Align Middle"></li>
-		<li class="push_button" id="tool_posbottom" title="Align Bottom"></li>
-	</ul>
+  <ul id="position_opts" class="optcols3">
+    <li class="push_button" id="tool_posleft" title="Align Left"></li>
+    <li class="push_button" id="tool_poscenter" title="Align Center"></li>
+    <li class="push_button" id="tool_posright" title="Align Right"></li>
+    <li class="push_button" id="tool_postop" title="Align Top"></li>
+    <li class="push_button" id="tool_posmiddle" title="Align Middle"></li>
+    <li class="push_button" id="tool_posbottom" title="Align Bottom"></li>
+  </ul>
 </div>
 
 
@@ -609,194 +609,194 @@
 </div> <!-- svg_editor -->
 
 <div id="svg_source_editor">
-	<div class="overlay"></div>
-	<div id="svg_source_container">
-		<div id="tool_source_back" class="toolbar_button">
-			<button id="tool_source_save">Apply Changes</button>
-			<button id="tool_source_cancel">Cancel</button>
-		</div>
-		<div id="save_output_btns">
-			<p id="copy_save_note">Copy the contents of this box into a text editor, then save the file with a .svg extension.</p>
-			<button id="copy_save_done">Done</button>
-		</div>
-		<form>
-			<textarea id="svg_source_textarea" spellcheck="false"></textarea>
-		</form>
-	</div>
+  <div class="overlay"></div>
+  <div id="svg_source_container">
+    <div id="tool_source_back" class="toolbar_button">
+      <button id="tool_source_save">Apply Changes</button>
+      <button id="tool_source_cancel">Cancel</button>
+    </div>
+    <div id="save_output_btns">
+      <p id="copy_save_note">Copy the contents of this box into a text editor, then save the file with a .svg extension.</p>
+      <button id="copy_save_done">Done</button>
+    </div>
+    <form>
+      <textarea id="svg_source_textarea" spellcheck="false"></textarea>
+    </form>
+  </div>
 </div>
 
 
 <div id="svg_docprops">
-	<div class="overlay"></div>
-	<div id="svg_docprops_container">
-		<div id="tool_docprops_back" class="toolbar_button">
-			<button id="tool_docprops_save">OK</button>
-			<button id="tool_docprops_cancel">Cancel</button>
-		</div>
+  <div class="overlay"></div>
+  <div id="svg_docprops_container">
+    <div id="tool_docprops_back" class="toolbar_button">
+      <button id="tool_docprops_save">OK</button>
+      <button id="tool_docprops_cancel">Cancel</button>
+    </div>
 
 
-		<fieldset id="svg_docprops_docprops">
-			<legend id="svginfo_image_props">Image Properties</legend>
-			<label>
-				<span id="svginfo_title">Title:</span>
-				<input type="text" id="canvas_title"/>
-			</label>
+    <fieldset id="svg_docprops_docprops">
+      <legend id="svginfo_image_props">Image Properties</legend>
+      <label>
+        <span id="svginfo_title">Title:</span>
+        <input type="text" id="canvas_title"/>
+      </label>
 
-			<fieldset id="change_resolution">
-				<legend id="svginfo_dim">Canvas Dimensions</legend>
+      <fieldset id="change_resolution">
+        <legend id="svginfo_dim">Canvas Dimensions</legend>
 
-				<label><span id="svginfo_width">width:</span> <input type="text" id="canvas_width" size="6"/></label>
+        <label><span id="svginfo_width">width:</span> <input type="text" id="canvas_width" size="6"/></label>
 
-				<label><span id="svginfo_height">height:</span> <input type="text" id="canvas_height" size="6"/></label>
+        <label><span id="svginfo_height">height:</span> <input type="text" id="canvas_height" size="6"/></label>
 
-				<label>
-					<select id="resolution">
-						<option id="selectedPredefined" selected="selected">Select predefined:</option>
-						<option>640x480</option>
-						<option>800x600</option>
-						<option>1024x768</option>
-						<option>1280x960</option>
-						<option>1600x1200</option>
-						<option id="fitToContent" value="content">Fit to Content</option>
-					</select>
-				</label>
-			</fieldset>
+        <label>
+          <select id="resolution">
+            <option id="selectedPredefined" selected="selected">Select predefined:</option>
+            <option>640x480</option>
+            <option>800x600</option>
+            <option>1024x768</option>
+            <option>1280x960</option>
+            <option>1600x1200</option>
+            <option id="fitToContent" value="content">Fit to Content</option>
+          </select>
+        </label>
+      </fieldset>
 
-			<fieldset id="image_save_opts">
-				<legend id="includedImages">Included Images</legend>
-				<label><input type="radio" name="image_opt" value="embed" checked="checked"/> <span id="image_opt_embed">Embed data (local files)</span> </label>
-				<label><input type="radio" name="image_opt" value="ref"/> <span id="image_opt_ref">Use file reference</span> </label>
-			</fieldset>
-		</fieldset>
+      <fieldset id="image_save_opts">
+        <legend id="includedImages">Included Images</legend>
+        <label><input type="radio" name="image_opt" value="embed" checked="checked"/> <span id="image_opt_embed">Embed data (local files)</span> </label>
+        <label><input type="radio" name="image_opt" value="ref"/> <span id="image_opt_ref">Use file reference</span> </label>
+      </fieldset>
+    </fieldset>
 
-	</div>
+  </div>
 </div>
 
 <div id="svg_prefs">
-	<div class="overlay"></div>
-	<div id="svg_prefs_container">
-		<div id="tool_prefs_back" class="toolbar_button">
-			<button id="tool_prefs_save">OK</button>
-			<button id="tool_prefs_cancel">Cancel</button>
-		</div>
+  <div class="overlay"></div>
+  <div id="svg_prefs_container">
+    <div id="tool_prefs_back" class="toolbar_button">
+      <button id="tool_prefs_save">OK</button>
+      <button id="tool_prefs_cancel">Cancel</button>
+    </div>
 
-		<fieldset>
-			<legend id="svginfo_editor_prefs">Editor Preferences</legend>
+    <fieldset>
+      <legend id="svginfo_editor_prefs">Editor Preferences</legend>
 
-			<label><span id="svginfo_lang">Language:</span>
-				<!-- Source: http://en.wikipedia.org/wiki/Language_names -->
-				<select id="lang_select">
-					<option id="lang_ar" value="ar">العربية</option>
-					<option id="lang_cs" value="cs">Čeština</option>
-					<option id="lang_de" value="de">Deutsch</option>
-					<option id="lang_en" value="en" selected="selected">English</option>
-					<option id="lang_es" value="es">Español</option>
-					<option id="lang_fa" value="fa">فارسی</option>
-					<option id="lang_fr" value="fr">Français</option>
-					<option id="lang_fy" value="fy">Frysk</option>
-					<option id="lang_hi" value="hi">&#2361;&#2367;&#2344;&#2381;&#2342;&#2368;, &#2361;&#2367;&#2306;&#2342;&#2368;</option>
-					<option id="lang_it" value="it">Italiano</option>
-					<option id="lang_ja" value="ja">日本語</option>
-					<option id="lang_nl" value="nl">Nederlands</option>
-					<option id="lang_pl" value="pl">Polski</option>
-					<option id="lang_pt-BR" value="pt-BR">Português (BR)</option>
-					<option id="lang_ro" value="ro">Română</option>
-					<option id="lang_ru" value="ru">Русский</option>
-					<option id="lang_sk" value="sk">Slovenčina</option>
-					<option id="lang_sl" value="sl">Slovenščina</option>
-					<option id="lang_zh-CN" value="zh-CN">简体中文</option>
-					<option id="lang_zh-TW" value="zh-TW">繁體中文</option>
-				</select>
-			</label>
+      <label><span id="svginfo_lang">Language:</span>
+        <!-- Source: http://en.wikipedia.org/wiki/Language_names -->
+        <select id="lang_select">
+          <option id="lang_ar" value="ar">العربية</option>
+          <option id="lang_cs" value="cs">Čeština</option>
+          <option id="lang_de" value="de">Deutsch</option>
+          <option id="lang_en" value="en" selected="selected">English</option>
+          <option id="lang_es" value="es">Español</option>
+          <option id="lang_fa" value="fa">فارسی</option>
+          <option id="lang_fr" value="fr">Français</option>
+          <option id="lang_fy" value="fy">Frysk</option>
+          <option id="lang_hi" value="hi">&#2361;&#2367;&#2344;&#2381;&#2342;&#2368;, &#2361;&#2367;&#2306;&#2342;&#2368;</option>
+          <option id="lang_it" value="it">Italiano</option>
+          <option id="lang_ja" value="ja">日本語</option>
+          <option id="lang_nl" value="nl">Nederlands</option>
+          <option id="lang_pl" value="pl">Polski</option>
+          <option id="lang_pt-BR" value="pt-BR">Português (BR)</option>
+          <option id="lang_ro" value="ro">Română</option>
+          <option id="lang_ru" value="ru">Русский</option>
+          <option id="lang_sk" value="sk">Slovenčina</option>
+          <option id="lang_sl" value="sl">Slovenščina</option>
+          <option id="lang_zh-CN" value="zh-CN">简体中文</option>
+          <option id="lang_zh-TW" value="zh-TW">繁體中文</option>
+        </select>
+      </label>
 
-			<label><span id="svginfo_icons">Icon size:</span>
-				<select id="iconsize">
-					<option id="icon_small" value="s">Small</option>
-					<option id="icon_medium" value="m" selected="selected">Medium</option>
-					<option id="icon_large" value="l">Large</option>
-					<option id="icon_xlarge" value="xl">Extra Large</option>
-				</select>
-			</label>
+      <label><span id="svginfo_icons">Icon size:</span>
+        <select id="iconsize">
+          <option id="icon_small" value="s">Small</option>
+          <option id="icon_medium" value="m" selected="selected">Medium</option>
+          <option id="icon_large" value="l">Large</option>
+          <option id="icon_xlarge" value="xl">Extra Large</option>
+        </select>
+      </label>
 
-			<fieldset id="change_background">
-				<legend id="svginfo_change_background">Editor Background</legend>
-				<div id="bg_blocks"></div>
-				<label><span id="svginfo_bg_url">URL:</span> <input type="text" id="canvas_bg_url"/></label>
-				<p id="svginfo_bg_note">Note: Background will not be saved with image.</p>
-			</fieldset>
+      <fieldset id="change_background">
+        <legend id="svginfo_change_background">Editor Background</legend>
+        <div id="bg_blocks"></div>
+        <label><span id="svginfo_bg_url">URL:</span> <input type="text" id="canvas_bg_url"/></label>
+        <p id="svginfo_bg_note">Note: Background will not be saved with image.</p>
+      </fieldset>
 
-			<fieldset id="change_grid">
-				<legend id="svginfo_grid_settings">Grid</legend>
-				<label><span id="svginfo_snap_onoff">Snapping on/off</span><input type="checkbox" value="snapping_on" id="grid_snapping_on"/></label>
-				<label><span id="svginfo_snap_step">Snapping Step-Size:</span> <input type="text" id="grid_snapping_step" size="3" value="10"/></label>
-				<label><span id="svginfo_grid_color">Grid color:</span> <input type="text" id="grid_color" size="3" value="#000"/></label>
-			</fieldset>
+      <fieldset id="change_grid">
+        <legend id="svginfo_grid_settings">Grid</legend>
+        <label><span id="svginfo_snap_onoff">Snapping on/off</span><input type="checkbox" value="snapping_on" id="grid_snapping_on"/></label>
+        <label><span id="svginfo_snap_step">Snapping Step-Size:</span> <input type="text" id="grid_snapping_step" size="3" value="10"/></label>
+        <label><span id="svginfo_grid_color">Grid color:</span> <input type="text" id="grid_color" size="3" value="#000"/></label>
+      </fieldset>
 
-			<fieldset id="units_rulers">
-				<legend id="svginfo_units_rulers">Units &amp; Rulers</legend>
-				<label><span id="svginfo_rulers_onoff">Show rulers</span><input type="checkbox" value="show_rulers" id="show_rulers" checked="checked"/></label>
-				<label>
-					<span id="svginfo_unit">Base Unit:</span>
-					<select id="base_unit">
-						<option value="px">Pixels</option>
-						<option value="cm">Centimeters</option>
-						<option value="mm">Millimeters</option>
-						<option value="in">Inches</option>
-						<option value="pt">Points</option>
-						<option value="pc">Picas</option>
-						<option value="em">Ems</option>
-						<option value="ex">Exs</option>
-					</select>
-				</label>
-				<!-- Should this be an export option instead? -->
+      <fieldset id="units_rulers">
+        <legend id="svginfo_units_rulers">Units &amp; Rulers</legend>
+        <label><span id="svginfo_rulers_onoff">Show rulers</span><input type="checkbox" value="show_rulers" id="show_rulers" checked="checked"/></label>
+        <label>
+          <span id="svginfo_unit">Base Unit:</span>
+          <select id="base_unit">
+            <option value="px">Pixels</option>
+            <option value="cm">Centimeters</option>
+            <option value="mm">Millimeters</option>
+            <option value="in">Inches</option>
+            <option value="pt">Points</option>
+            <option value="pc">Picas</option>
+            <option value="em">Ems</option>
+            <option value="ex">Exs</option>
+          </select>
+        </label>
+        <!-- Should this be an export option instead? -->
 <!--
-				<span id="svginfo_unit_system">Unit System:</span>
-				<label>
-					<input type="radio" name="unit_system" value="single" checked="checked"/>
-					<span id="svginfo_single_type_unit">Single type unit</span>
-					<small id="svginfo_single_type_unit_sub">CSS unit type is set on root element. If a different unit type is entered in a text field, it is converted back to user units on export.</small>
-				</label>
-				<label>
-					<input type="radio" name="unit_system" value="multi"/>
-					<span id="svginfo_multi_units">Multiple CSS units</span>
-					<small id="svginfo_single_type_unit_sub">Attributes can be given different CSS units, which may lead to inconsistant results among viewers.</small>
-				</label>
+        <span id="svginfo_unit_system">Unit System:</span>
+        <label>
+          <input type="radio" name="unit_system" value="single" checked="checked"/>
+          <span id="svginfo_single_type_unit">Single type unit</span>
+          <small id="svginfo_single_type_unit_sub">CSS unit type is set on root element. If a different unit type is entered in a text field, it is converted back to user units on export.</small>
+        </label>
+        <label>
+          <input type="radio" name="unit_system" value="multi"/>
+          <span id="svginfo_multi_units">Multiple CSS units</span>
+          <small id="svginfo_single_type_unit_sub">Attributes can be given different CSS units, which may lead to inconsistant results among viewers.</small>
+        </label>
  -->
-			</fieldset>
+      </fieldset>
 
-		</fieldset>
+    </fieldset>
 
-	</div>
+  </div>
 </div>
 
 <div id="dialog_box">
-	<div class="overlay"></div>
-	<div id="dialog_container">
-		<div id="dialog_content"></div>
-		<div id="dialog_buttons"></div>
-	</div>
+  <div class="overlay"></div>
+  <div id="dialog_container">
+    <div id="dialog_content"></div>
+    <div id="dialog_buttons"></div>
+  </div>
 </div>
 
 <ul id="cmenu_canvas" class="contextMenu">
-	<li><a href="#cut">Cut</a></li>
-	<li><a href="#copy">Copy</a></li>
-	<li><a href="#paste">Paste</a></li>
-	<li><a href="#paste_in_place">Paste in Place</a></li>
-	<li class="separator"><a href="#delete">Delete</a></li>
-	<li class="separator"><a href="#group">Group<span class="shortcut">G</span></a></li>
-	<li><a href="#ungroup">Ungroup<span class="shortcut">G</span></a></li>
-	<li class="separator"><a href="#move_front">Bring to Front<span class="shortcut">SHFT+CTRL+]</span></a></li>
-	<li><a href="#move_up">Bring Forward<span class="shortcut">CTRL+]</span></a></li>
-	<li><a href="#move_down">Send Backward<span class="shortcut">CTRL+[</span></a></li>
-	<li><a href="#move_back">Send to Back<span class="shortcut">SHFT+CTRL+[</span></a></li>
+  <li><a href="#cut">Cut</a></li>
+  <li><a href="#copy">Copy</a></li>
+  <li><a href="#paste">Paste</a></li>
+  <li><a href="#paste_in_place">Paste in Place</a></li>
+  <li class="separator"><a href="#delete">Delete</a></li>
+  <li class="separator"><a href="#group">Group<span class="shortcut">G</span></a></li>
+  <li><a href="#ungroup">Ungroup<span class="shortcut">G</span></a></li>
+  <li class="separator"><a href="#move_front">Bring to Front<span class="shortcut">SHFT+CTRL+]</span></a></li>
+  <li><a href="#move_up">Bring Forward<span class="shortcut">CTRL+]</span></a></li>
+  <li><a href="#move_down">Send Backward<span class="shortcut">CTRL+[</span></a></li>
+  <li><a href="#move_back">Send to Back<span class="shortcut">SHFT+CTRL+[</span></a></li>
 </ul>
 
 
 <ul id="cmenu_layers" class="contextMenu">
-	<li><a href="#dupe">Duplicate Layer...</a></li>
-	<li><a href="#delete">Delete Layer</a></li>
-	<li><a href="#merge_down">Merge Down</a></li>
-	<li><a href="#merge_all">Merge All</a></li>
+  <li><a href="#dupe">Duplicate Layer...</a></li>
+  <li><a href="#delete">Delete Layer</a></li>
+  <li><a href="#merge_down">Merge Down</a></li>
+  <li><a href="#merge_all">Merge All</a></li>
 </ul>
 
 </body>
diff --git a/editor/svg-editor.js b/editor/svg-editor.js
index 2cb022f3..cd247e42 100644
--- a/editor/svg-editor.js
+++ b/editor/svg-editor.js
@@ -24,5154 +24,5154 @@ TODOS
 */
 (function () {
 if (window.svgEditor) {
-	return;
+  return;
 }
 window.svgEditor = (function ($) {
-	var editor = {};
-	// EDITOR PROPERTIES: (defined below)
-	//		curPrefs, curConfig, canvas, storage, uiStrings
-	//
-	// STATE MAINTENANCE PROPERTIES
-	editor.tool_scale = 1; // Dependent on icon size, so any use to making configurable instead? Used by JQuerySpinBtn.js
-	editor.exportWindowCt = 0;
-	editor.langChanged = false;
-	editor.showSaveWarning = false;
-	editor.storagePromptClosed = false; // For use with ext-storage.js
-
-	var svgCanvas, urldata,
-		Utils = svgedit.utilities,
-		isReady = false,
-		customExportImage = false,
-		customExportPDF = false,
-		callbacks = [],
-		/**
-		* PREFS AND CONFIG
-		*/
-		// The iteration algorithm for defaultPrefs does not currently support array/objects
-		defaultPrefs = {
-			// EDITOR OPTIONS (DIALOG)
-			lang: '', // Default to "en" if locale.js detection does not detect another language
-			iconsize: '', // Will default to 's' if the window height is smaller than the minimum height and 'm' otherwise
-			bkgd_color: '#FFF',
-			bkgd_url: '',
-			// DOCUMENT PROPERTIES (DIALOG)
-			img_save: 'embed',
-			// ALERT NOTICES
-			// Only shows in UI as far as alert notices, but useful to remember, so keeping as pref
-			save_notice_done: false,
-			export_notice_done: false
-		},
-		curPrefs = {},
-		// Note: The difference between Prefs and Config is that Prefs
-		//   can be changed in the UI and are stored in the browser,
-		//   while config cannot
-		curConfig = {
-			// We do not put on defaultConfig to simplify object copying
-			//   procedures (we obtain instead from defaultExtensions)
-			extensions: [],
-			/**
-			* Can use window.location.origin to indicate the current
-			* origin. Can contain a '*' to allow all domains or 'null' (as
-			* a string) to support all file:// URLs. Cannot be set by
-			* URL for security reasons (not safe, at least for
-			* privacy or data integrity of SVG content).
-			* Might have been fairly safe to allow
-			*   `new URL(window.location.href).origin` by default but
-			*   avoiding it ensures some more security that even third
-			*   party apps on the same domain also cannot communicate
-			*   with this app by default.
-			* For use with ext-xdomain-messaging.js
-			* @todo We might instead make as a user-facing preference.
-			*/
-			allowedOrigins: []
-		},
-		defaultExtensions = [
-			'ext-overview_window.js',
-			'ext-markers.js',
-			'ext-connector.js',
-			'ext-eyedropper.js',
-			'ext-shapes.js',
-			'ext-imagelib.js',
-			'ext-grid.js',
-			'ext-polygon.js',
-			'ext-star.js',
-			'ext-panning.js',
-			'ext-storage.js'
-		],
-		defaultConfig = {
-			// Todo: svgcanvas.js also sets and checks: show_outside_canvas, selectNew; add here?
-			// Change the following to preferences and add pref controls to the UI (e.g., initTool, wireframe, showlayers)?
-			canvasName: 'default',
-			canvas_expansion: 3,
-			initFill: {
-				color: 'FF0000', // solid red
-				opacity: 1
-			},
-			initStroke: {
-				width: 5,
-				color: '000000', // solid black
-				opacity: 1
-			},
-			text: {
-				stroke_width: 0,
-				font_size: 24,
-				font_family: 'serif'
-			},
-			initOpacity: 1,
-			colorPickerCSS: null, // Defaults to 'left' with a position equal to that of the fill_color or stroke_color element minus 140, and a 'bottom' equal to 40
-			initTool: 'select',
-			exportWindowType: 'new', // 'same' (todo: also support 'download')
-			wireframe: false,
-			showlayers: false,
-			no_save_warning: false,
-			// PATH CONFIGURATION
-			// The following path configuration items are disallowed in the URL (as should any future path configurations)
-			imgPath: 'images/',
-			langPath: 'locale/',
-			extPath: 'extensions/',
-			jGraduatePath: 'jgraduate/images/',
-			// DOCUMENT PROPERTIES
-			// Change the following to a preference (already in the Document Properties dialog)?
-			dimensions: [640, 480],
-			// EDITOR OPTIONS
-			// Change the following to preferences (already in the Editor Options dialog)?
-			gridSnapping: false,
-			gridColor: '#000',
-			baseUnit: 'px',
-			snappingStep: 10,
-			showRulers: true,
-			// URL BEHAVIOR CONFIGURATION
-			preventAllURLConfig: false,
-			preventURLContentLoading: false,
-			// EXTENSION CONFIGURATION (see also preventAllURLConfig)
-			lockExtensions: false, // Disallowed in URL setting
-			noDefaultExtensions: false, // noDefaultExtensions can only be meaningfully used in config.js or in the URL
-			// EXTENSION-RELATED (GRID)
-			showGrid: false, // Set by ext-grid.js
-			// EXTENSION-RELATED (STORAGE)
-			noStorageOnLoad: false, // Some interaction with ext-storage.js; prevent even the loading of previously saved local storage
-			forceStorage: false, // Some interaction with ext-storage.js; strongly discouraged from modification as it bypasses user privacy by preventing them from choosing whether to keep local storage or not
-			emptyStorageOnDecline: false // Used by ext-storage.js; empty any prior storage if the user declines to store
-		},
-		/**
-		* LOCALE
-		* @todo Can we remove now that we are always loading even English? (unless locale is set to null)
-		*/
-		uiStrings = editor.uiStrings = {
-			common: {
-				ok: 'OK',
-				cancel: 'Cancel',
-				key_up: 'Up',
-				key_down: 'Down',
-				key_backspace: 'Backspace',
-				key_del: 'Del'
-			},
-			// This is needed if the locale is English, since the locale strings are not read in that instance.
-			layers: {
-				layer: 'Layer'
-			},
-			notification: {
-				invalidAttrValGiven: 'Invalid value given',
-				noContentToFitTo: 'No content to fit to',
-				dupeLayerName: 'There is already a layer named that!',
-				enterUniqueLayerName: 'Please enter a unique layer name',
-				enterNewLayerName: 'Please enter the new layer name',
-				layerHasThatName: 'Layer already has that name',
-				QmoveElemsToLayer: 'Move selected elements to layer \'%s\'?',
-				QwantToClear: 'Do you want to clear the drawing?\nThis will also erase your undo history!',
-				QwantToOpen: 'Do you want to open a new file?\nThis will also erase your undo history!',
-				QerrorsRevertToSource: 'There were parsing errors in your SVG source.\nRevert back to original SVG source?',
-				QignoreSourceChanges: 'Ignore changes made to SVG source?',
-				featNotSupported: 'Feature not supported',
-				enterNewImgURL: 'Enter the new image URL',
-				defsFailOnSave: 'NOTE: Due to a bug in your browser, this image may appear wrong (missing gradients or elements). It will however appear correct once actually saved.',
-				loadingImage: 'Loading image, please wait...',
-				saveFromBrowser: 'Select \'Save As...\' in your browser to save this image as a %s file.',
-				noteTheseIssues: 'Also note the following issues: ',
-				unsavedChanges: 'There are unsaved changes.',
-				enterNewLinkURL: 'Enter the new hyperlink URL',
-				errorLoadingSVG: 'Error: Unable to load SVG data',
-				URLloadFail: 'Unable to load from URL',
-				retrieving: 'Retrieving \'%s\' ...',
-				popupWindowBlocked: 'Popup window may be blocked by browser'
-			}
-		};
-
-	function loadSvgString (str, callback) {
-		var success = svgCanvas.setSvgString(str) !== false;
-		callback = callback || $.noop;
-		if (success) {
-			callback(true);
-		} else {
-			$.alert(uiStrings.notification.errorLoadingSVG, function () {
-				callback(false);
-			});
-		}
-	}
-
-	/**
-	* EXPORTS
-	*/
-
-	/**
-	* Store and retrieve preferences
-	* @param {string} key The preference name to be retrieved or set
-	* @param {string} [val] The value. If the value supplied is missing or falsey, no change to the preference will be made.
-	* @returns {string} If val is missing or falsey, the value of the previously stored preference will be returned.
-	* @todo Can we change setting on the jQuery namespace (onto editor) to avoid conflicts?
-	* @todo Review whether any remaining existing direct references to
-	*	getting curPrefs can be changed to use $.pref() getting to ensure
-	*	defaultPrefs fallback (also for sake of allowInitialUserOverride); specifically, bkgd_color could be changed so that
-	*	the pref dialog has a button to auto-calculate background, but otherwise uses $.pref() to be able to get default prefs
-	*	or overridable settings
-	*/
-	$.pref = function (key, val) {
-		if (val) {
-			curPrefs[key] = val;
-			editor.curPrefs = curPrefs; // Update exported value
-			return;
-		}
-		return (key in curPrefs) ? curPrefs[key] : defaultPrefs[key];
-	};
-
-	/**
-	* EDITOR PUBLIC METHODS
-	* locale.js also adds "putLang" and "readLang" as editor methods
-	* @todo Sort these methods per invocation order, ideally with init at the end
-	* @todo Prevent execution until init executes if dependent on it?
-	*/
-
-	/**
-	* Where permitted, sets canvas and/or defaultPrefs based on previous
-	*	storage. This will override URL settings (for security reasons) but
-	*	not config.js configuration (unless initial user overriding is explicitly
-	*	permitted there via allowInitialUserOverride).
-	* @todo Split allowInitialUserOverride into allowOverrideByURL and
-	*	allowOverrideByUserStorage so config.js can disallow some
-	*	individual items for URL setting but allow for user storage AND/OR
-	*	change URL setting so that it always uses a different namespace,
-	*	so it won't affect pre-existing user storage (but then if users saves
-	*	that, it will then be subject to tampering
-	*/
-	editor.loadContentAndPrefs = function () {
-		if (!curConfig.forceStorage && (curConfig.noStorageOnLoad || !document.cookie.match(/(?:^|;\s*)store=(?:prefsAndContent|prefsOnly)/))) {
-			return;
-		}
-
-		// LOAD CONTENT
-		if (editor.storage && // Cookies do not have enough available memory to hold large documents
-			(curConfig.forceStorage || (!curConfig.noStorageOnLoad && document.cookie.match(/(?:^|;\s*)store=prefsAndContent/)))
-		) {
-			var name = 'svgedit-' + curConfig.canvasName;
-			var cached = editor.storage.getItem(name);
-			if (cached) {
-				editor.loadFromString(cached);
-			}
-		}
-
-		// LOAD PREFS
-		var key;
-		for (key in defaultPrefs) {
-			if (defaultPrefs.hasOwnProperty(key)) { // It's our own config, so we don't need to iterate up the prototype chain
-				var storeKey = 'svg-edit-' + key;
-				if (editor.storage) {
-					var val = editor.storage.getItem(storeKey);
-					if (val) {
-						defaultPrefs[key] = String(val); // Convert to string for FF (.value fails in Webkit)
-					}
-				} else if (window.widget) {
-					defaultPrefs[key] = widget.preferenceForKey(storeKey);
-				} else {
-					var result = document.cookie.match(new RegExp('(?:^|;\\s*)' + Utils.preg_quote(encodeURIComponent(storeKey)) + '=([^;]+)'));
-					defaultPrefs[key] = result ? decodeURIComponent(result[1]) : '';
-				}
-			}
-		}
-	};
-
-	/**
-	* Allows setting of preferences or configuration (including extensions).
-	* @param {Object} opts The preferences or configuration (including extensions)
-	* @param {Object} [cfgCfg] Describes configuration which applies to the particular batch of supplied options
-	* @param {boolean} [cfgCfg.allowInitialUserOverride=false] Set to true if you wish
-	*	to allow initial overriding of settings by the user via the URL
-	*	(if permitted) or previously stored preferences (if permitted);
-	*	note that it will be too late if you make such calls in extension
-	*	code because the URL or preference storage settings will
-	*   have already taken place.
-	* @param {boolean} [cfgCfg.overwrite=true] Set to false if you wish to
-	*	prevent the overwriting of prior-set preferences or configuration
-	*	(URL settings will always follow this requirement for security
-	*	reasons, so config.js settings cannot be overridden unless it
-	*	explicitly permits via "allowInitialUserOverride" but extension config
-	*	can be overridden as they will run after URL settings). Should
-	*   not be needed in config.js.
-	*/
-	editor.setConfig = function (opts, cfgCfg) {
-		cfgCfg = cfgCfg || {};
-		function extendOrAdd (cfgObj, key, val) {
-			if (cfgObj[key] && typeof cfgObj[key] === 'object') {
-				$.extend(true, cfgObj[key], val);
-			} else {
-				cfgObj[key] = val;
-			}
-		}
-		$.each(opts, function (key, val) {
-			if (opts.hasOwnProperty(key)) {
-				// Only allow prefs defined in defaultPrefs
-				if (defaultPrefs.hasOwnProperty(key)) {
-					if (cfgCfg.overwrite === false && (
-						curConfig.preventAllURLConfig ||
-						curPrefs.hasOwnProperty(key)
-					)) {
-						return;
-					}
-					if (cfgCfg.allowInitialUserOverride === true) {
-						defaultPrefs[key] = val;
-					} else {
-						$.pref(key, val);
-					}
-				} else if (['extensions', 'allowedOrigins'].indexOf(key) > -1) {
-					if (cfgCfg.overwrite === false &&
-						(
-							curConfig.preventAllURLConfig ||
-							key === 'allowedOrigins' ||
-							(key === 'extensions' && curConfig.lockExtensions)
-						)
-					) {
-						return;
-					}
-					curConfig[key] = curConfig[key].concat(val); // We will handle any dupes later
-				// Only allow other curConfig if defined in defaultConfig
-				} else if (defaultConfig.hasOwnProperty(key)) {
-					if (cfgCfg.overwrite === false && (
-						curConfig.preventAllURLConfig ||
-						curConfig.hasOwnProperty(key)
-					)) {
-						return;
-					}
-					// Potentially overwriting of previously set config
-					if (curConfig.hasOwnProperty(key)) {
-						if (cfgCfg.overwrite === false) {
-							return;
-						}
-						extendOrAdd(curConfig, key, val);
-					} else {
-						if (cfgCfg.allowInitialUserOverride === true) {
-							extendOrAdd(defaultConfig, key, val);
-						} else {
-							if (defaultConfig[key] && typeof defaultConfig[key] === 'object') {
-								curConfig[key] = {};
-								$.extend(true, curConfig[key], val); // Merge properties recursively, e.g., on initFill, initStroke objects
-							} else {
-								curConfig[key] = val;
-							}
-						}
-					}
-				}
-			}
-		});
-		editor.curConfig = curConfig; // Update exported value
-	};
-
-	/**
-	* @param {Object} opts Extension mechanisms may call setCustomHandlers with three functions: opts.open, opts.save, and opts.exportImage
-	* opts.open's responsibilities are:
-	*	- invoke a file chooser dialog in 'open' mode
-	*	- let user pick a SVG file
-	*	- calls svgCanvas.setSvgString() with the string contents of that file
-	*  opts.save's responsibilities are:
-	*	- accept the string contents of the current document
-	*	- invoke a file chooser dialog in 'save' mode
-	*	- save the file to location chosen by the user
-	*  opts.exportImage's responsibilities (with regard to the object it is supplied in its 2nd argument) are:
-	*	- inform user of any issues supplied via the "issues" property
-	*	- convert the "svg" property SVG string into an image for export;
-	*		utilize the properties "type" (currently 'PNG', 'JPEG', 'BMP',
-	*		'WEBP', 'PDF'), "mimeType", and "quality" (for 'JPEG' and 'WEBP'
-	*		types) to determine the proper output.
-	*/
-	editor.setCustomHandlers = function (opts) {
-		editor.ready(function () {
-			if (opts.open) {
-				$('#tool_open > input[type="file"]').remove();
-				$('#tool_open').show();
-				svgCanvas.open = opts.open;
-			}
-			if (opts.save) {
-				editor.showSaveWarning = false;
-				svgCanvas.bind('saved', opts.save);
-			}
-			if (opts.exportImage) {
-				customExportImage = opts.exportImage;
-				svgCanvas.bind('exported', customExportImage); // canvg and our RGBColor will be available to the method
-			}
-			if (opts.exportPDF) {
-				customExportPDF = opts.exportPDF;
-				svgCanvas.bind('exportedPDF', customExportPDF); // jsPDF and our RGBColor will be available to the method
-			}
-		});
-	};
-
-	editor.randomizeIds = function () {
-		svgCanvas.randomizeIds(arguments);
-	};
-
-	editor.init = function () {
-		// var host = location.hostname,
-		//	onWeb = host && host.indexOf('.') >= 0;
-		// Some FF versions throw security errors here when directly accessing
-		try {
-			if ('localStorage' in window) { // && onWeb removed so Webkit works locally
-				editor.storage = localStorage;
-			}
-		} catch (err) {}
-
-		// Todo: Avoid var-defined functions and group functions together, etc. where possible
-		var goodLangs = [];
-		$('#lang_select option').each(function () {
-			goodLangs.push(this.value);
-		});
-
-		function setupCurPrefs () {
-			curPrefs = $.extend(true, {}, defaultPrefs, curPrefs); // Now safe to merge with priority for curPrefs in the event any are already set
-			// Export updated prefs
-			editor.curPrefs = curPrefs;
-		}
-		function setupCurConfig () {
-			curConfig = $.extend(true, {}, defaultConfig, curConfig); // Now safe to merge with priority for curConfig in the event any are already set
-
-			// Now deal with extensions and other array config
-			if (!curConfig.noDefaultExtensions) {
-				curConfig.extensions = curConfig.extensions.concat(defaultExtensions);
-			}
-			// ...and remove any dupes
-			$.each(['extensions', 'allowedOrigins'], function (i, cfg) {
-				curConfig[cfg] = $.grep(curConfig[cfg], function (n, i) {
-					return i === curConfig[cfg].indexOf(n);
-				});
-			});
-			// Export updated config
-			editor.curConfig = curConfig;
-		}
-		(function () {
-			// Load config/data from URL if given
-			var src, qstr;
-			urldata = $.deparam.querystring(true);
-			if (!$.isEmptyObject(urldata)) {
-				if (urldata.dimensions) {
-					urldata.dimensions = urldata.dimensions.split(',');
-				}
-
-				if (urldata.bkgd_color) {
-					urldata.bkgd_color = '#' + urldata.bkgd_color;
-				}
-
-				if (urldata.extensions) {
-					// For security reasons, disallow cross-domain or cross-folder extensions via URL
-					urldata.extensions = urldata.extensions.match(/[:/\\]/) ? '' : urldata.extensions.split(',');
-				}
-
-				// Disallowing extension paths via URL for
-				// security reasons, even for same-domain
-				// ones given potential to interact in undesirable
-				// ways with other script resources
-				$.each(
-					[
-						'extPath', 'imgPath',
-						'langPath', 'jGraduatePath'
-					],
-					function (pathConfig) {
-						if (urldata[pathConfig]) {
-							delete urldata[pathConfig];
-						}
-					}
-				);
-
-				editor.setConfig(urldata, {overwrite: false}); // Note: source and url (as with storagePrompt later) are not set on config but are used below
-
-				setupCurConfig();
-
-				if (!curConfig.preventURLContentLoading) {
-					src = urldata.source;
-					qstr = $.param.querystring();
-					if (!src) { // urldata.source may have been null if it ended with '='
-						if (qstr.indexOf('source=data:') >= 0) {
-							src = qstr.match(/source=(data:[^&]*)/)[1];
-						}
-					}
-					if (src) {
-						if (src.indexOf('data:') === 0) {
-							editor.loadFromDataURI(src);
-						} else {
-							editor.loadFromString(src);
-						}
-						return;
-					}
-					if (urldata.url) {
-						editor.loadFromURL(urldata.url);
-						return;
-					}
-				}
-				if (!urldata.noStorageOnLoad || curConfig.forceStorage) {
-					editor.loadContentAndPrefs();
-				}
-				setupCurPrefs();
-			} else {
-				setupCurConfig();
-				editor.loadContentAndPrefs();
-				setupCurPrefs();
-			}
-		}());
-
-		var setIcon = editor.setIcon = function (elem, iconId, forcedSize) {
-			var icon = (typeof iconId === 'string') ? $.getSvgIcon(iconId, true) : iconId.clone();
-			if (!icon) {
-				console.log('NOTE: Icon image missing: ' + iconId);
-				return;
-			}
-			$(elem).empty().append(icon);
-		};
-
-		var extFunc = function () {
-			$.each(curConfig.extensions, function () {
-				var extname = this;
-				if (!extname.match(/^ext-.*\.js/)) { // Ensure URL cannot specify some other unintended file in the extPath
-					return;
-				}
-				$.getScript(curConfig.extPath + extname, function (d) {
-					// Fails locally in Chrome 5
-					if (!d) {
-						var s = document.createElement('script');
-						s.src = curConfig.extPath + extname;
-						document.querySelector('head').appendChild(s);
-					}
-				}).fail(function (jqxhr, settings, exception) {
-					console.log(exception);
-				});
-			});
-
-			// var lang = ('lang' in curPrefs) ? curPrefs.lang : null;
-			editor.putLocale(null, goodLangs);
-		};
-
-		// Load extensions
-		// Bit of a hack to run extensions in local Opera/IE9
-		if (document.location.protocol === 'file:') {
-			setTimeout(extFunc, 100);
-		} else {
-			extFunc();
-		}
-		$.svgIcons(curConfig.imgPath + 'svg_edit_icons.svg', {
-			w: 24, h: 24,
-			id_match: false,
-			no_img: !svgedit.browser.isWebkit(), // Opera & Firefox 4 gives odd behavior w/images
-			fallback_path: curConfig.imgPath,
-			fallback: {
-				'new_image': 'clear.png',
-				'save': 'save.png',
-				'open': 'open.png',
-				'source': 'source.png',
-				'docprops': 'document-properties.png',
-				'wireframe': 'wireframe.png',
-
-				'undo': 'undo.png',
-				'redo': 'redo.png',
-
-				'select': 'select.png',
-				'select_node': 'select_node.png',
-				'pencil': 'fhpath.png',
-				'pen': 'line.png',
-				'square': 'square.png',
-				'rect': 'rect.png',
-				'fh_rect': 'freehand-square.png',
-				'circle': 'circle.png',
-				'ellipse': 'ellipse.png',
-				'fh_ellipse': 'freehand-circle.png',
-				'path': 'path.png',
-				'text': 'text.png',
-				'image': 'image.png',
-				'zoom': 'zoom.png',
-
-				'clone': 'clone.png',
-				'node_clone': 'node_clone.png',
-				'delete': 'delete.png',
-				'node_delete': 'node_delete.png',
-				'group': 'shape_group_elements.png',
-				'ungroup': 'shape_ungroup.png',
-				'move_top': 'move_top.png',
-				'move_bottom': 'move_bottom.png',
-				'to_path': 'to_path.png',
-				'link_controls': 'link_controls.png',
-				'reorient': 'reorient.png',
-
-				'align_left': 'align-left.png',
-				'align_center': 'align-center.png',
-				'align_right': 'align-right.png',
-				'align_top': 'align-top.png',
-				'align_middle': 'align-middle.png',
-				'align_bottom': 'align-bottom.png',
-
-				'go_up': 'go-up.png',
-				'go_down': 'go-down.png',
-
-				'ok': 'save.png',
-				'cancel': 'cancel.png',
-
-				'arrow_right': 'flyouth.png',
-				'arrow_down': 'dropdown.gif'
-			},
-			placement: {
-				'#logo': 'logo',
-
-				'#tool_clear div,#layer_new': 'new_image',
-				'#tool_save div': 'save',
-				'#tool_export div': 'export',
-				'#tool_open div div': 'open',
-				'#tool_import div div': 'import',
-				'#tool_source': 'source',
-				'#tool_docprops > div': 'docprops',
-				'#tool_wireframe': 'wireframe',
-
-				'#tool_undo': 'undo',
-				'#tool_redo': 'redo',
-
-				'#tool_select': 'select',
-				'#tool_fhpath': 'pencil',
-				'#tool_line': 'pen',
-				'#tool_rect,#tools_rect_show': 'rect',
-				'#tool_square': 'square',
-				'#tool_fhrect': 'fh_rect',
-				'#tool_ellipse,#tools_ellipse_show': 'ellipse',
-				'#tool_circle': 'circle',
-				'#tool_fhellipse': 'fh_ellipse',
-				'#tool_path': 'path',
-				'#tool_text,#layer_rename': 'text',
-				'#tool_image': 'image',
-				'#tool_zoom': 'zoom',
-
-				'#tool_clone,#tool_clone_multi': 'clone',
-				'#tool_node_clone': 'node_clone',
-				'#layer_delete,#tool_delete,#tool_delete_multi': 'delete',
-				'#tool_node_delete': 'node_delete',
-				'#tool_add_subpath': 'add_subpath',
-				'#tool_openclose_path': 'open_path',
-				'#tool_move_top': 'move_top',
-				'#tool_move_bottom': 'move_bottom',
-				'#tool_topath': 'to_path',
-				'#tool_node_link': 'link_controls',
-				'#tool_reorient': 'reorient',
-				'#tool_group_elements': 'group_elements',
-				'#tool_ungroup': 'ungroup',
-				'#tool_unlink_use': 'unlink_use',
-
-				'#tool_alignleft, #tool_posleft': 'align_left',
-				'#tool_aligncenter, #tool_poscenter': 'align_center',
-				'#tool_alignright, #tool_posright': 'align_right',
-				'#tool_aligntop, #tool_postop': 'align_top',
-				'#tool_alignmiddle, #tool_posmiddle': 'align_middle',
-				'#tool_alignbottom, #tool_posbottom': 'align_bottom',
-				'#cur_position': 'align',
-
-				'#linecap_butt,#cur_linecap': 'linecap_butt',
-				'#linecap_round': 'linecap_round',
-				'#linecap_square': 'linecap_square',
-
-				'#linejoin_miter,#cur_linejoin': 'linejoin_miter',
-				'#linejoin_round': 'linejoin_round',
-				'#linejoin_bevel': 'linejoin_bevel',
-
-				'#url_notice': 'warning',
-
-				'#layer_up': 'go_up',
-				'#layer_down': 'go_down',
-				'#layer_moreopts': 'context_menu',
-				'#layerlist td.layervis': 'eye',
-
-				'#tool_source_save,#tool_docprops_save,#tool_prefs_save': 'ok',
-				'#tool_source_cancel,#tool_docprops_cancel,#tool_prefs_cancel': 'cancel',
-
-				'#rwidthLabel, #iwidthLabel': 'width',
-				'#rheightLabel, #iheightLabel': 'height',
-				'#cornerRadiusLabel span': 'c_radius',
-				'#angleLabel': 'angle',
-				'#linkLabel,#tool_make_link,#tool_make_link_multi': 'globe_link',
-				'#zoomLabel': 'zoom',
-				'#tool_fill label': 'fill',
-				'#tool_stroke .icon_label': 'stroke',
-				'#group_opacityLabel': 'opacity',
-				'#blurLabel': 'blur',
-				'#font_sizeLabel': 'fontsize',
-
-				'.flyout_arrow_horiz': 'arrow_right',
-				'.dropdown button, #main_button .dropdown': 'arrow_down',
-				'#palette .palette_item:first, #fill_bg, #stroke_bg': 'no_color'
-			},
-			resize: {
-				'#logo .svg_icon': 28,
-				'.flyout_arrow_horiz .svg_icon': 5,
-				'.layer_button .svg_icon, #layerlist td.layervis .svg_icon': 14,
-				'.dropdown button .svg_icon': 7,
-				'#main_button .dropdown .svg_icon': 9,
-				'.palette_item:first .svg_icon': 15,
-				'#fill_bg .svg_icon, #stroke_bg .svg_icon': 16,
-				'.toolbar_button button .svg_icon': 16,
-				'.stroke_tool div div .svg_icon': 20,
-				'#tools_bottom label .svg_icon': 18
-			},
-			callback: function (icons) {
-				$('.toolbar_button button > svg, .toolbar_button button > img').each(function () {
-					$(this).parent().prepend(this);
-				});
-
-				var minHeight,
-					tleft = $('#tools_left');
-				if (tleft.length !== 0) {
-					minHeight = tleft.offset().top + tleft.outerHeight();
-				}
-
-				var size = $.pref('iconsize');
-				editor.setIconSize(size || ($(window).height() < minHeight ? 's' : 'm'));
-
-				// Look for any missing flyout icons from plugins
-				$('.tools_flyout').each(function () {
-					var shower = $('#' + this.id + '_show');
-					var sel = shower.attr('data-curopt');
-					// Check if there's an icon here
-					if (!shower.children('svg, img').length) {
-						var clone = $(sel).children().clone();
-						if (clone.length) {
-							clone[0].removeAttribute('style'); // Needed for Opera
-							shower.append(clone);
-						}
-					}
-				});
-
-				editor.runCallbacks();
-
-				setTimeout(function () {
-					$('.flyout_arrow_horiz:empty').each(function () {
-						$(this).append($.getSvgIcon('arrow_right').width(5).height(5));
-					});
-				}, 1);
-			}
-		});
-
-		editor.canvas = svgCanvas = new $.SvgCanvas(document.getElementById('svgcanvas'), curConfig);
-		var supportsNonSS, resizeTimer, changeZoom, Actions, curScrollPos,
-			palette = [ // Todo: Make into configuration item?
-				'#000000', '#3f3f3f', '#7f7f7f', '#bfbfbf', '#ffffff',
-				'#ff0000', '#ff7f00', '#ffff00', '#7fff00',
-				'#00ff00', '#00ff7f', '#00ffff', '#007fff',
-				'#0000ff', '#7f00ff', '#ff00ff', '#ff007f',
-				'#7f0000', '#7f3f00', '#7f7f00', '#3f7f00',
-				'#007f00', '#007f3f', '#007f7f', '#003f7f',
-				'#00007f', '#3f007f', '#7f007f', '#7f003f',
-				'#ffaaaa', '#ffd4aa', '#ffffaa', '#d4ffaa',
-				'#aaffaa', '#aaffd4', '#aaffff', '#aad4ff',
-				'#aaaaff', '#d4aaff', '#ffaaff', '#ffaad4'
-			],
-			modKey = (svgedit.browser.isMac() ? 'meta+' : 'ctrl+'), // ⌘
-			path = svgCanvas.pathActions,
-			undoMgr = svgCanvas.undoMgr,
-			defaultImageURL = curConfig.imgPath + 'logo.png',
-			workarea = $('#workarea'),
-			canvMenu = $('#cmenu_canvas'),
-			// layerMenu = $('#cmenu_layers'), // Unused
-			exportWindow = null,
-			zoomInIcon = 'crosshair',
-			zoomOutIcon = 'crosshair',
-			uiContext = 'toolbars',
-			origSource = '',
-			paintBox = {fill: null, stroke: null};
-
-		// For external openers
-		(function () {
-			// let the opener know SVG Edit is ready (now that config is set up)
-			var svgEditorReadyEvent,
-				w = window.opener || window.parent;
-			if (w) {
-				try {
-					svgEditorReadyEvent = w.document.createEvent('Event');
-					svgEditorReadyEvent.initEvent('svgEditorReady', true, true);
-					w.document.documentElement.dispatchEvent(svgEditorReadyEvent);
-				} catch (e) {}
-			}
-		}());
-
-		// This sets up alternative dialog boxes. They mostly work the same way as
-		// their UI counterparts, expect instead of returning the result, a callback
-		// needs to be included that returns the result as its first parameter.
-		// In the future we may want to add additional types of dialog boxes, since
-		// they should be easy to handle this way.
-		(function () {
-			$('#dialog_container').draggable({cancel: '#dialog_content, #dialog_buttons *', containment: 'window'});
-			var box = $('#dialog_box'),
-				btnHolder = $('#dialog_buttons'),
-				dialogContent = $('#dialog_content'),
-				dbox = function (type, msg, callback, defaultVal, opts, changeCb, checkbox) {
-					var ok, ctrl, chkbx;
-					dialogContent.html('<p>' + msg.replace(/\n/g, '</p><p>') + '</p>')
-						.toggleClass('prompt', (type === 'prompt'));
-					btnHolder.empty();
-
-					ok = $('<input type="button" value="' + uiStrings.common.ok + '">').appendTo(btnHolder);
-
-					if (type !== 'alert') {
-						$('<input type="button" value="' + uiStrings.common.cancel + '">')
-							.appendTo(btnHolder)
-							.click(function () { box.hide(); if (callback) { callback(false); } });
-					}
-
-					if (type === 'prompt') {
-						ctrl = $('<input type="text">').prependTo(btnHolder);
-						ctrl.val(defaultVal || '');
-						ctrl.bind('keydown', 'return', function () { ok.click(); });
-					} else if (type === 'select') {
-						var div = $('<div style="text-align:center;">');
-						ctrl = $('<select>').appendTo(div);
-						if (checkbox) {
-							var label = $('<label>').text(checkbox.label);
-							chkbx = $('<input type="checkbox">').appendTo(label);
-							chkbx.val(checkbox.value);
-							if (checkbox.tooltip) {
-								label.attr('title', checkbox.tooltip);
-							}
-							chkbx.prop('checked', !!checkbox.checked);
-							div.append($('<div>').append(label));
-						}
-						$.each(opts || [], function (opt, val) {
-							if (typeof val === 'object') {
-								ctrl.append($('<option>').val(val.value).html(val.text));
-							} else {
-								ctrl.append($('<option>').html(val));
-							}
-						});
-						dialogContent.append(div);
-						if (defaultVal) {
-							ctrl.val(defaultVal);
-						}
-						if (changeCb) {
-							ctrl.bind('change', 'return', changeCb);
-						}
-						ctrl.bind('keydown', 'return', function () { ok.click(); });
-					} else if (type === 'process') {
-						ok.hide();
-					}
-
-					box.show();
-
-					ok.click(function () {
-						box.hide();
-						var resp = (type === 'prompt' || type === 'select') ? ctrl.val() : true;
-						if (callback) {
-							if (chkbx) {
-								callback(resp, chkbx.prop('checked'));
-							} else {
-								callback(resp);
-							}
-						}
-					}).focus();
-
-					if (type === 'prompt' || type === 'select') {
-						ctrl.focus();
-					}
-				};
-
-			$.alert = function (msg, cb) { dbox('alert', msg, cb); };
-			$.confirm = function (msg, cb) { dbox('confirm', msg, cb); };
-			$.process_cancel = function (msg, cb) { dbox('process', msg, cb); };
-			$.prompt = function (msg, txt, cb) { dbox('prompt', msg, cb, txt); };
-			$.select = function (msg, opts, cb, changeCb, txt, checkbox) { dbox('select', msg, cb, txt, opts, changeCb, checkbox); };
-		}());
-
-		var setSelectMode = function () {
-			var curr = $('.tool_button_current');
-			if (curr.length && curr[0].id !== 'tool_select') {
-				curr.removeClass('tool_button_current').addClass('tool_button');
-				$('#tool_select').addClass('tool_button_current').removeClass('tool_button');
-				$('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all} #svgcanvas svg{cursor:default}');
-			}
-			svgCanvas.setMode('select');
-			workarea.css('cursor', 'auto');
-		};
-
-		// used to make the flyouts stay on the screen longer the very first time
-		// var flyoutspeed = 1250; // Currently unused
-		// var textBeingEntered = false; // Currently unused
-		var selectedElement = null;
-		var multiselected = false;
-		var editingsource = false;
-		var docprops = false;
-		var preferences = false;
-		var curContext = '';
-		var origTitle = $('title:first').text();
-		// Make [1,2,5] array
-		var rIntervals = [];
-		var i;
-		for (i = 0.1; i < 1E5; i *= 10) {
-			rIntervals.push(i);
-			rIntervals.push(2 * i);
-			rIntervals.push(5 * i);
-		}
-
-		// This function highlights the layer passed in (by fading out the other layers)
-		// if no layer is passed in, this function restores the other layers
-		var toggleHighlightLayer = function (layerNameToHighlight) {
-			var i, curNames = [], numLayers = svgCanvas.getCurrentDrawing().getNumLayers();
-			for (i = 0; i < numLayers; i++) {
-				curNames[i] = svgCanvas.getCurrentDrawing().getLayerName(i);
-			}
-
-			if (layerNameToHighlight) {
-				for (i = 0; i < numLayers; ++i) {
-					if (curNames[i] !== layerNameToHighlight) {
-						svgCanvas.getCurrentDrawing().setLayerOpacity(curNames[i], 0.5);
-					}
-				}
-			} else {
-				for (i = 0; i < numLayers; ++i) {
-					svgCanvas.getCurrentDrawing().setLayerOpacity(curNames[i], 1.0);
-				}
-			}
-		};
-
-		var populateLayers = function () {
-			svgCanvas.clearSelection();
-			var layerlist = $('#layerlist tbody').empty();
-			var selLayerNames = $('#selLayerNames').empty();
-			var drawing = svgCanvas.getCurrentDrawing();
-			var currentLayerName = drawing.getCurrentLayerName();
-			var layer = svgCanvas.getCurrentDrawing().getNumLayers();
-			var icon = $.getSvgIcon('eye');
-			// we get the layers in the reverse z-order (the layer rendered on top is listed first)
-			while (layer--) {
-				var name = drawing.getLayerName(layer);
-				var layerTr = $('<tr class="layer">').toggleClass('layersel', name === currentLayerName);
-				var layerVis = $('<td class="layervis">').toggleClass('layerinvis', !drawing.getLayerVisibility(name));
-				var layerName = $('<td class="layername">' + name + '</td>');
-				layerlist.append(layerTr.append(layerVis, layerName));
-				selLayerNames.append('<option value="' + name + '">' + name + '</option>');
-			}
-			if (icon !== undefined) {
-				var copy = icon.clone();
-				$('td.layervis', layerlist).append(copy);
-				$.resizeSvgIcons({'td.layervis .svg_icon': 14});
-			}
-			// handle selection of layer
-			$('#layerlist td.layername')
-				.mouseup(function (evt) {
-					$('#layerlist tr.layer').removeClass('layersel');
-					$(this.parentNode).addClass('layersel');
-					svgCanvas.setCurrentLayer(this.textContent);
-					evt.preventDefault();
-				})
-				.mouseover(function () {
-					toggleHighlightLayer(this.textContent);
-				})
-				.mouseout(function () {
-					toggleHighlightLayer();
-				});
-			$('#layerlist td.layervis').click(function () {
-				var row = $(this.parentNode).prevAll().length;
-				var name = $('#layerlist tr.layer:eq(' + row + ') td.layername').text();
-				var vis = $(this).hasClass('layerinvis');
-				svgCanvas.setLayerVisibility(name, vis);
-				$(this).toggleClass('layerinvis');
-			});
-
-			// if there were too few rows, let's add a few to make it not so lonely
-			var num = 5 - $('#layerlist tr.layer').size();
-			while (num-- > 0) {
-				// FIXME: there must a better way to do this
-				layerlist.append('<tr><td style="color:white">_</td><td/></tr>');
-			}
-		};
-
-		var showSourceEditor = function (e, forSaving) {
-			if (editingsource) { return; }
-
-			editingsource = true;
-			origSource = svgCanvas.getSvgString();
-			$('#save_output_btns').toggle(!!forSaving);
-			$('#tool_source_back').toggle(!forSaving);
-			$('#svg_source_textarea').val(origSource);
-			$('#svg_source_editor').fadeIn();
-			$('#svg_source_textarea').focus();
-		};
-
-		var togglePathEditMode = function (editmode, elems) {
-			$('#path_node_panel').toggle(editmode);
-			$('#tools_bottom_2,#tools_bottom_3').toggle(!editmode);
-			if (editmode) {
-				// Change select icon
-				$('.tool_button_current').removeClass('tool_button_current').addClass('tool_button');
-				$('#tool_select').addClass('tool_button_current').removeClass('tool_button');
-				setIcon('#tool_select', 'select_node');
-				multiselected = false;
-				if (elems.length) {
-					selectedElement = elems[0];
-				}
-			} else {
-				setTimeout(function () {
-					setIcon('#tool_select', 'select');
-				}, 1000);
-			}
-		};
-
-		var saveHandler = function (wind, svg) {
-			editor.showSaveWarning = false;
-
-			// by default, we add the XML prolog back, systems integrating SVG-edit (wikis, CMSs)
-			// can just provide their own custom save handler and might not want the XML prolog
-			svg = '<?xml version="1.0"?>\n' + svg;
-
-			// IE9 doesn't allow standalone Data URLs
-			// https://connect.microsoft.com/IE/feedback/details/542600/data-uri-images-fail-when-loaded-by-themselves
-			if (svgedit.browser.isIE()) {
-				showSourceEditor(0, true);
-				return;
-			}
-
-			// Since saving SVGs by opening a new window was removed in Chrome use artificial link-click
-			// https://stackoverflow.com/questions/45603201/window-is-not-allowed-to-navigate-top-frame-navigations-to-data-urls
-			var a = document.createElement('a');
-			a.href = 'data:image/svg+xml;base64,' + Utils.encode64(svg);
-			a.download = 'icon.svg';
-
-			a.click();
-
-			// Alert will only appear the first time saved OR the
-			//   first time the bug is encountered
-			var done = $.pref('save_notice_done');
-			if (done !== 'all') {
-				var note = uiStrings.notification.saveFromBrowser.replace('%s', 'SVG');
-
-				// Check if FF and has <defs/>
-				if (svgedit.browser.isGecko()) {
-					if (svg.indexOf('<defs') !== -1) {
-						// warning about Mozilla bug #308590 when applicable (seems to be fixed now in Feb 2013)
-						note += '\n\n' + uiStrings.notification.defsFailOnSave;
-						$.pref('save_notice_done', 'all');
-						done = 'all';
-					} else {
-						$.pref('save_notice_done', 'part');
-					}
-				} else {
-					$.pref('save_notice_done', 'all');
-				}
-				if (done !== 'part') {
-					alert(note);
-				}
-			}
-		};
-
-		var exportHandler = function (win, data) {
-			var issues = data.issues,
-				exportWindowName = data.exportWindowName;
-
-			if (exportWindowName) {
-				exportWindow = window.open(svgedit.utilities.blankPageObjectURL || '', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
-			}
-
-			if (!exportWindow || exportWindow.closed) {
-				$.alert(uiStrings.notification.popupWindowBlocked);
-				return;
-			}
-
-			exportWindow.location.href = data.bloburl || data.datauri;
-			var done = $.pref('export_notice_done');
-			if (done !== 'all') {
-				var note = uiStrings.notification.saveFromBrowser.replace('%s', data.type);
-
-				// Check if there's issues
-				if (issues.length) {
-					var pre = '\n \u2022 ';
-					note += ('\n\n' + uiStrings.notification.noteTheseIssues + pre + issues.join(pre));
-				}
-
-				// Note that this will also prevent the notice even though new issues may appear later.
-				// May want to find a way to deal with that without annoying the user
-				$.pref('export_notice_done', 'all');
-				exportWindow.alert(note);
-			}
-		};
-
-		var operaRepaint = function () {
-			// Repaints canvas in Opera. Needed for stroke-dasharray change as well as fill change
-			if (!window.opera) {
-				return;
-			}
-			$('<p/>').hide().appendTo('body').remove();
-		};
-
-		function setStrokeOpt (opt, changeElem) {
-			var id = opt.id;
-			var bits = id.split('_');
-			var pre = bits[0];
-			var val = bits[1];
-
-			if (changeElem) {
-				svgCanvas.setStrokeAttr('stroke-' + pre, val);
-			}
-			operaRepaint();
-			setIcon('#cur_' + pre, id, 20);
-			$(opt).addClass('current').siblings().removeClass('current');
-		}
-
-		// This is a common function used when a tool has been clicked (chosen)
-		// It does several common things:
-		// - removes the tool_button_current class from whatever tool currently has it
-		// - hides any flyouts
-		// - adds the tool_button_current class to the button passed in
-		var toolButtonClick = editor.toolButtonClick = function (button, noHiding) {
-			if ($(button).hasClass('disabled')) { return false; }
-			if ($(button).parent().hasClass('tools_flyout')) { return true; }
-			var fadeFlyouts = 'normal';
-			if (!noHiding) {
-				$('.tools_flyout').fadeOut(fadeFlyouts);
-			}
-			$('#styleoverrides').text('');
-			workarea.css('cursor', 'auto');
-			$('.tool_button_current').removeClass('tool_button_current').addClass('tool_button');
-			$(button).addClass('tool_button_current').removeClass('tool_button');
-			return true;
-		};
-
-		var clickSelect = editor.clickSelect = function () {
-			if (toolButtonClick('#tool_select')) {
-				svgCanvas.setMode('select');
-				$('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all}, #svgcanvas svg{cursor:default}');
-			}
-		};
-
-		var setImageURL = editor.setImageURL = function (url) {
-			if (!url) {
-				url = defaultImageURL;
-			}
-			svgCanvas.setImageURL(url);
-			$('#image_url').val(url);
-
-			if (url.indexOf('data:') === 0) {
-				// data URI found
-				$('#image_url').hide();
-				$('#change_image_url').show();
-			} else {
-				// regular URL
-				svgCanvas.embedImage(url, function (dataURI) {
-					// Couldn't embed, so show warning
-					$('#url_notice').toggle(!dataURI);
-					defaultImageURL = url;
-				});
-				$('#image_url').show();
-				$('#change_image_url').hide();
-			}
-		};
-
-		function setBackground (color, url) {
-			// if (color == $.pref('bkgd_color') && url == $.pref('bkgd_url')) { return; }
-			$.pref('bkgd_color', color);
-			$.pref('bkgd_url', url);
-
-			// This should be done in svgcanvas.js for the borderRect fill
-			svgCanvas.setBackground(color, url);
-		}
-
-		function promptImgURL () {
-			var curhref = svgCanvas.getHref(selectedElement);
-			curhref = curhref.indexOf('data:') === 0 ? '' : curhref;
-			$.prompt(uiStrings.notification.enterNewImgURL, curhref, function (url) {
-				if (url) { setImageURL(url); }
-			});
-		}
-
-		var setInputWidth = function (elem) {
-			var w = Math.min(Math.max(12 + elem.value.length * 6, 50), 300);
-			$(elem).width(w);
-		};
-
-		function updateRulers (scanvas, zoom) {
-			if (!zoom) { zoom = svgCanvas.getZoom(); }
-			if (!scanvas) { scanvas = $('#svgcanvas'); }
-
-			var d, i;
-			var limit = 30000;
-			var contentElem = svgCanvas.getContentElem();
-			var units = svgedit.units.getTypeMap();
-			var unit = units[curConfig.baseUnit]; // 1 = 1px
-
-			// draw x ruler then y ruler
-			for (d = 0; d < 2; d++) {
-				var isX = (d === 0);
-				var dim = isX ? 'x' : 'y';
-				var lentype = isX ? 'width' : 'height';
-				var contentDim = Number(contentElem.getAttribute(dim));
-
-				var $hcanvOrig = $('#ruler_' + dim + ' canvas:first');
-
-				// Bit of a hack to fully clear the canvas in Safari & IE9
-				var $hcanv = $hcanvOrig.clone();
-				$hcanvOrig.replaceWith($hcanv);
-
-				var hcanv = $hcanv[0];
-
-				// Set the canvas size to the width of the container
-				var rulerLen = scanvas[lentype]();
-				var totalLen = rulerLen;
-				hcanv.parentNode.style[lentype] = totalLen + 'px';
-				var ctxNum = 0;
-				var ctx = hcanv.getContext('2d');
-				var ctxArr, num, ctxArrNum;
-
-				ctx.fillStyle = 'rgb(200,0,0)';
-				ctx.fillRect(0, 0, hcanv.width, hcanv.height);
-
-				// Remove any existing canvasses
-				$hcanv.siblings().remove();
-
-				// Create multiple canvases when necessary (due to browser limits)
-				if (rulerLen >= limit) {
-					ctxArrNum = parseInt(rulerLen / limit, 10) + 1;
-					ctxArr = [];
-					ctxArr[0] = ctx;
-					var copy;
-					for (i = 1; i < ctxArrNum; i++) {
-						hcanv[lentype] = limit;
-						copy = hcanv.cloneNode(true);
-						hcanv.parentNode.appendChild(copy);
-						ctxArr[i] = copy.getContext('2d');
-					}
-
-					copy[lentype] = rulerLen % limit;
-
-					// set copy width to last
-					rulerLen = limit;
-				}
-
-				hcanv[lentype] = rulerLen;
-
-				var uMulti = unit * zoom;
-
-				// Calculate the main number interval
-				var rawM = 50 / uMulti;
-				var multi = 1;
-				for (i = 0; i < rIntervals.length; i++) {
-					num = rIntervals[i];
-					multi = num;
-					if (rawM <= num) {
-						break;
-					}
-				}
-
-				var bigInt = multi * uMulti;
-
-				ctx.font = '9px sans-serif';
-
-				var rulerD = ((contentDim / uMulti) % multi) * uMulti;
-				var labelPos = rulerD - bigInt;
-				// draw big intervals
-				while (rulerD < totalLen) {
-					labelPos += bigInt;
-					// var real_d = rulerD - contentDim; // Currently unused
-
-					var curD = Math.round(rulerD) + 0.5;
-					if (isX) {
-						ctx.moveTo(curD, 15);
-						ctx.lineTo(curD, 0);
-					} else {
-						ctx.moveTo(15, curD);
-						ctx.lineTo(0, curD);
-					}
-
-					num = (labelPos - contentDim) / uMulti;
-					var label;
-					if (multi >= 1) {
-						label = Math.round(num);
-					} else {
-						var decs = String(multi).split('.')[1].length;
-						label = num.toFixed(decs);
-					}
-
-					// Change 1000s to Ks
-					if (label !== 0 && label !== 1000 && label % 1000 === 0) {
-						label = (label / 1000) + 'K';
-					}
-
-					if (isX) {
-						ctx.fillText(label, rulerD + 2, 8);
-					} else {
-						// draw label vertically
-						var str = String(label).split('');
-						for (i = 0; i < str.length; i++) {
-							ctx.fillText(str[i], 1, (rulerD + 9) + i * 9);
-						}
-					}
-
-					var part = bigInt / 10;
-					// draw the small intervals
-					for (i = 1; i < 10; i++) {
-						var subD = Math.round(rulerD + part * i) + 0.5;
-						if (ctxArr && subD > rulerLen) {
-							ctxNum++;
-							ctx.stroke();
-							if (ctxNum >= ctxArrNum) {
-								i = 10;
-								rulerD = totalLen;
-								continue;
-							}
-							ctx = ctxArr[ctxNum];
-							rulerD -= limit;
-							subD = Math.round(rulerD + part * i) + 0.5;
-						}
-
-						// odd lines are slighly longer
-						var lineNum = (i % 2) ? 12 : 10;
-						if (isX) {
-							ctx.moveTo(subD, 15);
-							ctx.lineTo(subD, lineNum);
-						} else {
-							ctx.moveTo(15, subD);
-							ctx.lineTo(lineNum, subD);
-						}
-					}
-					rulerD += bigInt;
-				}
-				ctx.strokeStyle = '#000';
-				ctx.stroke();
-			}
-		}
-
-		var updateCanvas = editor.updateCanvas = function (center, newCtr) {
-			var w = workarea.width(), h = workarea.height();
-			var wOrig = w, hOrig = h;
-			var zoom = svgCanvas.getZoom();
-			var wArea = workarea;
-			var cnvs = $('#svgcanvas');
-			var oldCtr = {
-				x: wArea[0].scrollLeft + wOrig / 2,
-				y: wArea[0].scrollTop + hOrig / 2
-			};
-			var multi = curConfig.canvas_expansion;
-			w = Math.max(wOrig, svgCanvas.contentW * zoom * multi);
-			h = Math.max(hOrig, svgCanvas.contentH * zoom * multi);
-
-			if (w === wOrig && h === hOrig) {
-				workarea.css('overflow', 'hidden');
-			} else {
-				workarea.css('overflow', 'scroll');
-			}
-
-			var oldCanY = cnvs.height() / 2;
-			var oldCanX = cnvs.width() / 2;
-			cnvs.width(w).height(h);
-			var newCanY = h / 2;
-			var newCanX = w / 2;
-			var offset = svgCanvas.updateCanvas(w, h);
-
-			var ratio = newCanX / oldCanX;
-
-			var scrollX = w / 2 - wOrig / 2;
-			var scrollY = h / 2 - hOrig / 2;
-
-			if (!newCtr) {
-				var oldDistX = oldCtr.x - oldCanX;
-				var newX = newCanX + oldDistX * ratio;
-
-				var oldDistY = oldCtr.y - oldCanY;
-				var newY = newCanY + oldDistY * ratio;
-
-				newCtr = {
-					x: newX,
-					y: newY
-				};
-			} else {
-				newCtr.x += offset.x;
-				newCtr.y += offset.y;
-			}
-
-			if (center) {
-				// Go to top-left for larger documents
-				if (svgCanvas.contentW > wArea.width()) {
-					// Top-left
-					workarea[0].scrollLeft = offset.x - 10;
-					workarea[0].scrollTop = offset.y - 10;
-				} else {
-					// Center
-					wArea[0].scrollLeft = scrollX;
-					wArea[0].scrollTop = scrollY;
-				}
-			} else {
-				wArea[0].scrollLeft = newCtr.x - wOrig / 2;
-				wArea[0].scrollTop = newCtr.y - hOrig / 2;
-			}
-			if (curConfig.showRulers) {
-				updateRulers(cnvs, zoom);
-				workarea.scroll();
-			}
-			if (urldata.storagePrompt !== true && !editor.storagePromptClosed) {
-				$('#dialog_box').hide();
-			}
-		};
-
-		var updateToolButtonState = function () {
-			var index, button;
-			var bNoFill = (svgCanvas.getColor('fill') === 'none');
-			var bNoStroke = (svgCanvas.getColor('stroke') === 'none');
-			var buttonsNeedingStroke = ['#tool_fhpath', '#tool_line'];
-			var buttonsNeedingFillAndStroke = ['#tools_rect .tool_button', '#tools_ellipse .tool_button', '#tool_text', '#tool_path'];
-			if (bNoStroke) {
-				for (index in buttonsNeedingStroke) {
-					button = buttonsNeedingStroke[index];
-					if ($(button).hasClass('tool_button_current')) {
-						clickSelect();
-					}
-					$(button).addClass('disabled');
-				}
-			} else {
-				for (index in buttonsNeedingStroke) {
-					button = buttonsNeedingStroke[index];
-					$(button).removeClass('disabled');
-				}
-			}
-
-			if (bNoStroke && bNoFill) {
-				for (index in buttonsNeedingFillAndStroke) {
-					button = buttonsNeedingFillAndStroke[index];
-					if ($(button).hasClass('tool_button_current')) {
-						clickSelect();
-					}
-					$(button).addClass('disabled');
-				}
-			} else {
-				for (index in buttonsNeedingFillAndStroke) {
-					button = buttonsNeedingFillAndStroke[index];
-					$(button).removeClass('disabled');
-				}
-			}
-
-			svgCanvas.runExtensions('toolButtonStateUpdate', {
-				nofill: bNoFill,
-				nostroke: bNoStroke
-			});
-
-			// Disable flyouts if all inside are disabled
-			$('.tools_flyout').each(function () {
-				var shower = $('#' + this.id + '_show');
-				var hasEnabled = false;
-				$(this).children().each(function () {
-					if (!$(this).hasClass('disabled')) {
-						hasEnabled = true;
-					}
-				});
-				shower.toggleClass('disabled', !hasEnabled);
-			});
-
-			operaRepaint();
-		};
-
-		// Updates the toolbar (colors, opacity, etc) based on the selected element
-		// This function also updates the opacity and id elements that are in the context panel
-		var updateToolbar = function () {
-			var i, len;
-			if (selectedElement != null) {
-				switch (selectedElement.tagName) {
-				case 'use':
-				case 'image':
-				case 'foreignObject':
-					break;
-				case 'g':
-				case 'a':
-					// Look for common styles
-					var gWidth = null;
-					var childs = selectedElement.getElementsByTagName('*');
-					for (i = 0, len = childs.length; i < len; i++) {
-						var swidth = childs[i].getAttribute('stroke-width');
-
-						if (i === 0) {
-							gWidth = swidth;
-						} else if (gWidth !== swidth) {
-							gWidth = null;
-						}
-					}
-
-					$('#stroke_width').val(gWidth === null ? '' : gWidth);
-
-					paintBox.fill.update(true);
-					paintBox.stroke.update(true);
-
-					break;
-				default:
-					paintBox.fill.update(true);
-					paintBox.stroke.update(true);
-
-					$('#stroke_width').val(selectedElement.getAttribute('stroke-width') || 1);
-					$('#stroke_style').val(selectedElement.getAttribute('stroke-dasharray') || 'none');
-
-					var attr = selectedElement.getAttribute('stroke-linejoin') || 'miter';
-
-					if ($('#linejoin_' + attr).length !== 0) {
-						setStrokeOpt($('#linejoin_' + attr)[0]);
-					}
-
-					attr = selectedElement.getAttribute('stroke-linecap') || 'butt';
-
-					if ($('#linecap_' + attr).length !== 0) {
-						setStrokeOpt($('#linecap_' + attr)[0]);
-					}
-				}
-			}
-
-			// All elements including image and group have opacity
-			if (selectedElement != null) {
-				var opacPerc = (selectedElement.getAttribute('opacity') || 1.0) * 100;
-				$('#group_opacity').val(opacPerc);
-				$('#opac_slider').slider('option', 'value', opacPerc);
-				$('#elem_id').val(selectedElement.id);
-				$('#elem_class').val(selectedElement.getAttribute('class'));
-			}
-
-			updateToolButtonState();
-		};
-
-		// updates the context panel tools based on the selected element
-		var updateContextPanel = function () {
-			var elem = selectedElement;
-			// If element has just been deleted, consider it null
-			if (elem != null && !elem.parentNode) { elem = null; }
-			var currentLayerName = svgCanvas.getCurrentDrawing().getCurrentLayerName();
-			var currentMode = svgCanvas.getMode();
-			var unit = curConfig.baseUnit !== 'px' ? curConfig.baseUnit : null;
-
-			var isNode = currentMode === 'pathedit'; // elem ? (elem.id && elem.id.indexOf('pathpointgrip') == 0) : false;
-			var menuItems = $('#cmenu_canvas li');
-			$('#selected_panel, #multiselected_panel, #g_panel, #rect_panel, #circle_panel,' +
-				'#ellipse_panel, #line_panel, #text_panel, #image_panel, #container_panel,' +
-				' #use_panel, #a_panel').hide();
-			if (elem != null) {
-				var elname = elem.nodeName;
-				// If this is a link with no transform and one child, pretend
-				// its child is selected
-				// if (elname === 'a') { // && !$(elem).attr('transform')) {
-				// 	elem = elem.firstChild;
-				// }
-
-				var angle = svgCanvas.getRotationAngle(elem);
-				$('#angle').val(angle);
-
-				var blurval = svgCanvas.getBlur(elem);
-				$('#blur').val(blurval);
-				$('#blur_slider').slider('option', 'value', blurval);
-
-				if (svgCanvas.addedNew) {
-					if (elname === 'image' && svgCanvas.getMode() === 'image') {
-						// Prompt for URL if not a data URL
-						if (svgCanvas.getHref(elem).indexOf('data:') !== 0) {
-							promptImgURL();
-						}
-					}
-					/* else if (elname == 'text') {
-						// TODO: Do something here for new text
-					} */
-				}
-
-				if (!isNode && currentMode !== 'pathedit') {
-					$('#selected_panel').show();
-					// Elements in this array already have coord fields
-					if (['line', 'circle', 'ellipse'].indexOf(elname) >= 0) {
-						$('#xy_panel').hide();
-					} else {
-						var x, y;
-
-						// Get BBox vals for g, polyline and path
-						if (['g', 'polyline', 'path'].indexOf(elname) >= 0) {
-							var bb = svgCanvas.getStrokedBBox([elem]);
-							if (bb) {
-								x = bb.x;
-								y = bb.y;
-							}
-						} else {
-							x = elem.getAttribute('x');
-							y = elem.getAttribute('y');
-						}
-
-						if (unit) {
-							x = svgedit.units.convertUnit(x);
-							y = svgedit.units.convertUnit(y);
-						}
-
-						$('#selected_x').val(x || 0);
-						$('#selected_y').val(y || 0);
-						$('#xy_panel').show();
-					}
-
-					// Elements in this array cannot be converted to a path
-					var noPath = ['image', 'text', 'path', 'g', 'use'].indexOf(elname) === -1;
-					$('#tool_topath').toggle(noPath);
-					$('#tool_reorient').toggle(elname === 'path');
-					$('#tool_reorient').toggleClass('disabled', angle === 0);
-				} else {
-					var point = path.getNodePoint();
-					$('#tool_add_subpath').removeClass('push_button_pressed').addClass('tool_button');
-					$('#tool_node_delete').toggleClass('disabled', !path.canDeleteNodes);
-
-					// Show open/close button based on selected point
-					setIcon('#tool_openclose_path', path.closed_subpath ? 'open_path' : 'close_path');
-
-					if (point) {
-						var segType = $('#seg_type');
-						if (unit) {
-							point.x = svgedit.units.convertUnit(point.x);
-							point.y = svgedit.units.convertUnit(point.y);
-						}
-						$('#path_node_x').val(point.x);
-						$('#path_node_y').val(point.y);
-						if (point.type) {
-							segType.val(point.type).removeAttr('disabled');
-						} else {
-							segType.val(4).attr('disabled', 'disabled');
-						}
-					}
-					return;
-				}
-
-				// update contextual tools here
-				var panels = {
-					g: [],
-					a: [],
-					rect: ['rx', 'width', 'height'],
-					image: ['width', 'height'],
-					circle: ['cx', 'cy', 'r'],
-					ellipse: ['cx', 'cy', 'rx', 'ry'],
-					line: ['x1', 'y1', 'x2', 'y2'],
-					text: [],
-					use: []
-				};
-
-				var tagName = elem.tagName;
-
-				// if ($(elem).data('gsvg')) {
-				// 	$('#g_panel').show();
-				// }
-
-				var linkHref = null;
-				if (tagName === 'a') {
-					linkHref = svgCanvas.getHref(elem);
-					$('#g_panel').show();
-				}
-
-				if (elem.parentNode.tagName === 'a') {
-					if (!$(elem).siblings().length) {
-						$('#a_panel').show();
-						linkHref = svgCanvas.getHref(elem.parentNode);
-					}
-				}
-
-				// Hide/show the make_link buttons
-				$('#tool_make_link, #tool_make_link').toggle(!linkHref);
-
-				if (linkHref) {
-					$('#link_url').val(linkHref);
-				}
-
-				if (panels[tagName]) {
-					var curPanel = panels[tagName];
-
-					$('#' + tagName + '_panel').show();
-
-					$.each(curPanel, function (i, item) {
-						var attrVal = elem.getAttribute(item);
-						if (curConfig.baseUnit !== 'px' && elem[item]) {
-							var bv = elem[item].baseVal.value;
-							attrVal = svgedit.units.convertUnit(bv);
-						}
-						$('#' + tagName + '_' + item).val(attrVal || 0);
-					});
-
-					if (tagName === 'text') {
-						$('#text_panel').css('display', 'inline');
-						$('#tool_font_size').css('display', 'inline');
-						if (svgCanvas.getItalic()) {
-							$('#tool_italic').addClass('push_button_pressed').removeClass('tool_button');
-						} else {
-							$('#tool_italic').removeClass('push_button_pressed').addClass('tool_button');
-						}
-						if (svgCanvas.getBold()) {
-							$('#tool_bold').addClass('push_button_pressed').removeClass('tool_button');
-						} else {
-							$('#tool_bold').removeClass('push_button_pressed').addClass('tool_button');
-						}
-						$('#font_family').val(elem.getAttribute('font-family'));
-						$('#font_size').val(elem.getAttribute('font-size'));
-						$('#text').val(elem.textContent);
-						if (svgCanvas.addedNew) {
-							// Timeout needed for IE9
-							setTimeout(function () {
-								$('#text').focus().select();
-							}, 100);
-						}
-					// text
-					} else if (tagName === 'image' && svgCanvas.getMode() === 'image') {
-						setImageURL(svgCanvas.getHref(elem));
-					// image
-					} else if (tagName === 'g' || tagName === 'use') {
-						$('#container_panel').show();
-						var title = svgCanvas.getTitle();
-						var label = $('#g_title')[0];
-						label.value = title;
-						setInputWidth(label);
-						$('#g_title').prop('disabled', tagName === 'use');
-					}
-				}
-				menuItems[(tagName === 'g' ? 'en' : 'dis') + 'ableContextMenuItems']('#ungroup');
-				menuItems[((tagName === 'g' || !multiselected) ? 'dis' : 'en') + 'ableContextMenuItems']('#group');
-			// if (elem != null)
-			} else if (multiselected) {
-				$('#multiselected_panel').show();
-				menuItems
-					.enableContextMenuItems('#group')
-					.disableContextMenuItems('#ungroup');
-			} else {
-				menuItems.disableContextMenuItems('#delete,#cut,#copy,#group,#ungroup,#move_front,#move_up,#move_down,#move_back');
-			}
-
-			// update history buttons
-			$('#tool_undo').toggleClass('disabled', undoMgr.getUndoStackSize() === 0);
-			$('#tool_redo').toggleClass('disabled', undoMgr.getRedoStackSize() === 0);
-
-			svgCanvas.addedNew = false;
-
-			if ((elem && !isNode) || multiselected) {
-				// update the selected elements' layer
-				$('#selLayerNames').removeAttr('disabled').val(currentLayerName);
-
-				// Enable regular menu options
-				canvMenu.enableContextMenuItems('#delete,#cut,#copy,#move_front,#move_up,#move_down,#move_back');
-			} else {
-				$('#selLayerNames').attr('disabled', 'disabled');
-			}
-		};
-
-		var updateWireFrame = function () {
-			// Test support
-			if (supportsNonSS) { return; }
-
-			var rule = '#workarea.wireframe #svgcontent * { stroke-width: ' + 1 / svgCanvas.getZoom() + 'px; }';
-			$('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : '');
-		};
-
-		var updateTitle = function (title) {
-			title = title || svgCanvas.getDocumentTitle();
-			var newTitle = origTitle + (title ? ': ' + title : '');
-
-			// Remove title update with current context info, isn't really necessary
-			// if (curContext) {
-			// 	new_title = new_title + curContext;
-			// }
-			$('title:first').text(newTitle);
-		};
-
-		// called when we've selected a different element
-		var selectedChanged = function (win, elems) {
-			var mode = svgCanvas.getMode();
-			if (mode === 'select') {
-				setSelectMode();
-			}
-			var isNode = mode === 'pathedit';
-			// if elems[1] is present, then we have more than one element
-			selectedElement = (elems.length === 1 || elems[1] == null ? elems[0] : null);
-			multiselected = (elems.length >= 2 && elems[1] != null);
-			if (selectedElement != null) {
-				// unless we're already in always set the mode of the editor to select because
-				// upon creation of a text element the editor is switched into
-				// select mode and this event fires - we need our UI to be in sync
-
-				if (!isNode) {
-					updateToolbar();
-				}
-			} // if (elem != null)
-
-			// Deal with pathedit mode
-			togglePathEditMode(isNode, elems);
-			updateContextPanel();
-			svgCanvas.runExtensions('selectedChanged', {
-				elems: elems,
-				selectedElement: selectedElement,
-				multiselected: multiselected
-			});
-		};
-
-		// Call when part of element is in process of changing, generally
-		// on mousemove actions like rotate, move, etc.
-		var elementTransition = function (win, elems) {
-			var mode = svgCanvas.getMode();
-			var elem = elems[0];
-
-			if (!elem) {
-				return;
-			}
-
-			multiselected = (elems.length >= 2 && elems[1] != null);
-			// Only updating fields for single elements for now
-			if (!multiselected) {
-				switch (mode) {
-				case 'rotate':
-					var ang = svgCanvas.getRotationAngle(elem);
-					$('#angle').val(ang);
-					$('#tool_reorient').toggleClass('disabled', ang === 0);
-					break;
-
-				// TODO: Update values that change on move/resize, etc
-				// case "select":
-				// case "resize":
-				// 	break;
-				}
-			}
-			svgCanvas.runExtensions('elementTransition', {
-				elems: elems
-			});
-		};
-
-		/**
-		 * Test whether an element is a layer or not.
-		 * @param {SVGGElement} elem - The SVGGElement to test.
-		 * @returns {boolean} True if the element is a layer
-		 */
-		function isLayer (elem) {
-			return elem && elem.tagName === 'g' && svgedit.draw.Layer.CLASS_REGEX.test(elem.getAttribute('class'));
-		}
-
-		// called when any element has changed
-		var elementChanged = function (win, elems) {
-			var i,
-				mode = svgCanvas.getMode();
-			if (mode === 'select') {
-				setSelectMode();
-			}
-
-			for (i = 0; i < elems.length; ++i) {
-				var elem = elems[i];
-
-				var isSvgElem = (elem && elem.tagName === 'svg');
-				if (isSvgElem || isLayer(elem)) {
-					populateLayers();
-					// if the element changed was the svg, then it could be a resolution change
-					if (isSvgElem) {
-						updateCanvas();
-					}
-				// Update selectedElement if element is no longer part of the image.
-				// This occurs for the text elements in Firefox
-				} else if (elem && selectedElement && selectedElement.parentNode == null) {
-					// || elem && elem.tagName == "path" && !multiselected) { // This was added in r1430, but not sure why
-					selectedElement = elem;
-				}
-			}
-
-			editor.showSaveWarning = true;
-
-			// we update the contextual panel with potentially new
-			// positional/sizing information (we DON'T want to update the
-			// toolbar here as that creates an infinite loop)
-			// also this updates the history buttons
-
-			// we tell it to skip focusing the text control if the
-			// text element was previously in focus
-			updateContextPanel();
-
-			// In the event a gradient was flipped:
-			if (selectedElement && mode === 'select') {
-				paintBox.fill.update();
-				paintBox.stroke.update();
-			}
-
-			svgCanvas.runExtensions('elementChanged', {
-				elems: elems
-			});
-		};
-
-		var zoomDone = function () {
-			updateWireFrame();
-			// updateCanvas(); // necessary?
-		};
-
-		var zoomChanged = svgCanvas.zoomChanged = function (win, bbox, autoCenter) {
-			var scrbar = 15,
-				// res = svgCanvas.getResolution(), // Currently unused
-				wArea = workarea;
-			// var canvas_pos = $('#svgcanvas').position(); // Currently unused
-			var zInfo = svgCanvas.setBBoxZoom(bbox, wArea.width() - scrbar, wArea.height() - scrbar);
-			if (!zInfo) { return; }
-			var zoomlevel = zInfo.zoom,
-				bb = zInfo.bbox;
-
-			if (zoomlevel < 0.001) {
-				changeZoom({value: 0.1});
-				return;
-			}
-
-			$('#zoom').val((zoomlevel * 100).toFixed(1));
-
-			if (autoCenter) {
-				updateCanvas();
-			} else {
-				updateCanvas(false, {x: bb.x * zoomlevel + (bb.width * zoomlevel) / 2, y: bb.y * zoomlevel + (bb.height * zoomlevel) / 2});
-			}
-
-			if (svgCanvas.getMode() === 'zoom' && bb.width) {
-				// Go to select if a zoom box was drawn
-				setSelectMode();
-			}
-
-			zoomDone();
-		};
-
-		changeZoom = function (ctl) {
-			var zoomlevel = ctl.value / 100;
-			if (zoomlevel < 0.001) {
-				ctl.value = 0.1;
-				return;
-			}
-			var zoom = svgCanvas.getZoom();
-			var wArea = workarea;
-
-			zoomChanged(window, {
-				width: 0,
-				height: 0,
-				// center pt of scroll position
-				x: (wArea[0].scrollLeft + wArea.width() / 2) / zoom,
-				y: (wArea[0].scrollTop + wArea.height() / 2) / zoom,
-				zoom: zoomlevel
-			}, true);
-		};
-
-		$('#cur_context_panel').delegate('a', 'click', function () {
-			var link = $(this);
-			if (link.attr('data-root')) {
-				svgCanvas.leaveContext();
-			} else {
-				svgCanvas.setContext(link.text());
-			}
-			svgCanvas.clearSelection();
-			return false;
-		});
-
-		var contextChanged = function (win, context) {
-			var linkStr = '';
-			if (context) {
-				var str = '';
-				linkStr = '<a href="#" data-root="y">' + svgCanvas.getCurrentDrawing().getCurrentLayerName() + '</a>';
-
-				$(context).parentsUntil('#svgcontent > g').andSelf().each(function () {
-					if (this.id) {
-						str += ' > ' + this.id;
-						if (this !== context) {
-							linkStr += ' > <a href="#">' + this.id + '</a>';
-						} else {
-							linkStr += ' > ' + this.id;
-						}
-					}
-				});
-
-				curContext = str;
-			} else {
-				curContext = null;
-			}
-			$('#cur_context_panel').toggle(!!context).html(linkStr);
-
-			updateTitle();
-		};
-
-		// Makes sure the current selected paint is available to work with
-		var prepPaints = function () {
-			paintBox.fill.prep();
-			paintBox.stroke.prep();
-		};
-
-		var flyoutFuncs = {};
-
-		var setFlyoutTitles = function () {
-			$('.tools_flyout').each(function () {
-				var shower = $('#' + this.id + '_show');
-				if (shower.data('isLibrary')) {
-					return;
-				}
-
-				var tooltips = [];
-				$(this).children().each(function () {
-					tooltips.push(this.title);
-				});
-				shower[0].title = tooltips.join(' / ');
-			});
-		};
-
-		var setFlyoutPositions = function () {
-			$('.tools_flyout').each(function () {
-				var shower = $('#' + this.id + '_show');
-				var pos = shower.offset();
-				var w = shower.outerWidth();
-				$(this).css({left: (pos.left + w) * editor.tool_scale, top: pos.top});
-			});
-		};
-
-		var setupFlyouts = function (holders) {
-			$.each(holders, function (holdSel, btnOpts) {
-				var buttons = $(holdSel).children();
-				var showSel = holdSel + '_show';
-				var shower = $(showSel);
-				var def = false;
-				buttons.addClass('tool_button')
-					.unbind('click mousedown mouseup') // may not be necessary
-					.each(function (i) {
-						// Get this buttons options
-						var opts = btnOpts[i];
-
-						// Remember the function that goes with this ID
-						flyoutFuncs[opts.sel] = opts.fn;
-
-						if (opts.isDefault) { def = i; }
-
-						// Clicking the icon in flyout should set this set's icon
-						var func = function (event) {
-							var options = opts;
-							// Find the currently selected tool if comes from keystroke
-							if (event.type === 'keydown') {
-								var flyoutIsSelected = $(options.parent + '_show').hasClass('tool_button_current');
-								var currentOperation = $(options.parent + '_show').attr('data-curopt');
-								$.each(holders[opts.parent], function (i, tool) {
-									if (tool.sel === currentOperation) {
-										if (!event.shiftKey || !flyoutIsSelected) {
-											options = tool;
-										} else {
-											options = holders[opts.parent][i + 1] || holders[opts.parent][0];
-										}
-									}
-								});
-							}
-							if ($(this).hasClass('disabled')) { return false; }
-							if (toolButtonClick(showSel)) {
-								options.fn();
-							}
-							var icon;
-							if (options.icon) {
-								icon = $.getSvgIcon(options.icon, true);
-							} else {
-								icon = $(options.sel).children().eq(0).clone();
-							}
-
-							icon[0].setAttribute('width', shower.width());
-							icon[0].setAttribute('height', shower.height());
-							shower.children(':not(.flyout_arrow_horiz)').remove();
-							shower.append(icon).attr('data-curopt', options.sel); // This sets the current mode
-						};
-
-						$(this).mouseup(func);
-
-						if (opts.key) {
-							$(document).bind('keydown', opts.key[0] + ' shift+' + opts.key[0], func);
-						}
-					});
-
-				if (def) {
-					shower.attr('data-curopt', btnOpts[def].sel);
-				} else if (!shower.attr('data-curopt')) {
-					// Set first as default
-					shower.attr('data-curopt', btnOpts[0].sel);
-				}
-
-				var timer;
-				var pos = $(showSel).position();
-
-				// Clicking the "show" icon should set the current mode
-				shower.mousedown(function (evt) {
-					if (shower.hasClass('disabled')) {
-						return false;
-					}
-					var holder = $(holdSel);
-					var l = pos.left + 34;
-					var w = holder.width() * -1;
-					var time = holder.data('shown_popop') ? 200 : 0;
-					timer = setTimeout(function () {
-						// Show corresponding menu
-						if (!shower.data('isLibrary')) {
-							holder.css('left', w).show().animate({
-								left: l
-							}, 150);
-						} else {
-							holder.css('left', l).show();
-						}
-						holder.data('shown_popop', true);
-					}, time);
-					evt.preventDefault();
-				}).mouseup(function (evt) {
-					clearTimeout(timer);
-					var opt = $(this).attr('data-curopt');
-					// Is library and popped up, so do nothing
-					if (shower.data('isLibrary') && $(showSel.replace('_show', '')).is(':visible')) {
-						toolButtonClick(showSel, true);
-						return;
-					}
-					if (toolButtonClick(showSel) && flyoutFuncs[opt]) {
-						flyoutFuncs[opt]();
-					}
-				});
-				// $('#tools_rect').mouseleave(function () { $('#tools_rect').fadeOut(); });
-			});
-			setFlyoutTitles();
-			setFlyoutPositions();
-		};
-
-		var makeFlyoutHolder = function (id, child) {
-			var div = $('<div>', {
-				'class': 'tools_flyout',
-				id: id
-			}).appendTo('#svg_editor').append(child);
-
-			return div;
-		};
-
-		var uaPrefix = (function () {
-			var prop;
-			var regex = /^(Moz|Webkit|Khtml|O|ms|Icab)(?=[A-Z])/;
-			var someScript = document.getElementsByTagName('script')[0];
-			for (prop in someScript.style) {
-				if (regex.test(prop)) {
-					// test is faster than match, so it's better to perform
-					// that on the lot and match only when necessary
-					return prop.match(regex)[0];
-				}
-			}
-			// Nothing found so far?
-			if ('WebkitOpacity' in someScript.style) { return 'Webkit'; }
-			if ('KhtmlOpacity' in someScript.style) { return 'Khtml'; }
-
-			return '';
-		}());
-
-		var scaleElements = function (elems, scale) {
-			// var prefix = '-' + uaPrefix.toLowerCase() + '-'; // Currently unused
-			var sides = ['top', 'left', 'bottom', 'right'];
-
-			elems.each(function () {
-				// Handled in CSS
-				// this.style[uaPrefix + 'Transform'] = 'scale(' + scale + ')';
-				var i;
-				var el = $(this);
-				var w = el.outerWidth() * (scale - 1);
-				var h = el.outerHeight() * (scale - 1);
-				// var margins = {}; // Currently unused
-
-				for (i = 0; i < 4; i++) {
-					var s = sides[i];
-					var cur = el.data('orig_margin-' + s);
-					if (cur == null) {
-						cur = parseInt(el.css('margin-' + s), 10);
-						// Cache the original margin
-						el.data('orig_margin-' + s, cur);
-					}
-					var val = cur * scale;
-					if (s === 'right') {
-						val += w;
-					} else if (s === 'bottom') {
-						val += h;
-					}
-
-					el.css('margin-' + s, val);
-					// el.css('outline', '1px solid red');
-				}
-			});
-		};
-
-		var setIconSize = editor.setIconSize = function (size) {
-			// var elems = $('.tool_button, .push_button, .tool_button_current, .disabled, .icon_label, #url_notice, #tool_open');
-			var selToscale = '#tools_top .toolset, #editor_panel > *, #history_panel > *,' +
+  var editor = {};
+  // EDITOR PROPERTIES: (defined below)
+  //		curPrefs, curConfig, canvas, storage, uiStrings
+  //
+  // STATE MAINTENANCE PROPERTIES
+  editor.tool_scale = 1; // Dependent on icon size, so any use to making configurable instead? Used by JQuerySpinBtn.js
+  editor.exportWindowCt = 0;
+  editor.langChanged = false;
+  editor.showSaveWarning = false;
+  editor.storagePromptClosed = false; // For use with ext-storage.js
+
+  var svgCanvas, urldata,
+    Utils = svgedit.utilities,
+    isReady = false,
+    customExportImage = false,
+    customExportPDF = false,
+    callbacks = [],
+    /**
+    * PREFS AND CONFIG
+    */
+    // The iteration algorithm for defaultPrefs does not currently support array/objects
+    defaultPrefs = {
+      // EDITOR OPTIONS (DIALOG)
+      lang: '', // Default to "en" if locale.js detection does not detect another language
+      iconsize: '', // Will default to 's' if the window height is smaller than the minimum height and 'm' otherwise
+      bkgd_color: '#FFF',
+      bkgd_url: '',
+      // DOCUMENT PROPERTIES (DIALOG)
+      img_save: 'embed',
+      // ALERT NOTICES
+      // Only shows in UI as far as alert notices, but useful to remember, so keeping as pref
+      save_notice_done: false,
+      export_notice_done: false
+    },
+    curPrefs = {},
+    // Note: The difference between Prefs and Config is that Prefs
+    //   can be changed in the UI and are stored in the browser,
+    //   while config cannot
+    curConfig = {
+      // We do not put on defaultConfig to simplify object copying
+      //   procedures (we obtain instead from defaultExtensions)
+      extensions: [],
+      /**
+      * Can use window.location.origin to indicate the current
+      * origin. Can contain a '*' to allow all domains or 'null' (as
+      * a string) to support all file:// URLs. Cannot be set by
+      * URL for security reasons (not safe, at least for
+      * privacy or data integrity of SVG content).
+      * Might have been fairly safe to allow
+      *   `new URL(window.location.href).origin` by default but
+      *   avoiding it ensures some more security that even third
+      *   party apps on the same domain also cannot communicate
+      *   with this app by default.
+      * For use with ext-xdomain-messaging.js
+      * @todo We might instead make as a user-facing preference.
+      */
+      allowedOrigins: []
+    },
+    defaultExtensions = [
+      'ext-overview_window.js',
+      'ext-markers.js',
+      'ext-connector.js',
+      'ext-eyedropper.js',
+      'ext-shapes.js',
+      'ext-imagelib.js',
+      'ext-grid.js',
+      'ext-polygon.js',
+      'ext-star.js',
+      'ext-panning.js',
+      'ext-storage.js'
+    ],
+    defaultConfig = {
+      // Todo: svgcanvas.js also sets and checks: show_outside_canvas, selectNew; add here?
+      // Change the following to preferences and add pref controls to the UI (e.g., initTool, wireframe, showlayers)?
+      canvasName: 'default',
+      canvas_expansion: 3,
+      initFill: {
+        color: 'FF0000', // solid red
+        opacity: 1
+      },
+      initStroke: {
+        width: 5,
+        color: '000000', // solid black
+        opacity: 1
+      },
+      text: {
+        stroke_width: 0,
+        font_size: 24,
+        font_family: 'serif'
+      },
+      initOpacity: 1,
+      colorPickerCSS: null, // Defaults to 'left' with a position equal to that of the fill_color or stroke_color element minus 140, and a 'bottom' equal to 40
+      initTool: 'select',
+      exportWindowType: 'new', // 'same' (todo: also support 'download')
+      wireframe: false,
+      showlayers: false,
+      no_save_warning: false,
+      // PATH CONFIGURATION
+      // The following path configuration items are disallowed in the URL (as should any future path configurations)
+      imgPath: 'images/',
+      langPath: 'locale/',
+      extPath: 'extensions/',
+      jGraduatePath: 'jgraduate/images/',
+      // DOCUMENT PROPERTIES
+      // Change the following to a preference (already in the Document Properties dialog)?
+      dimensions: [640, 480],
+      // EDITOR OPTIONS
+      // Change the following to preferences (already in the Editor Options dialog)?
+      gridSnapping: false,
+      gridColor: '#000',
+      baseUnit: 'px',
+      snappingStep: 10,
+      showRulers: true,
+      // URL BEHAVIOR CONFIGURATION
+      preventAllURLConfig: false,
+      preventURLContentLoading: false,
+      // EXTENSION CONFIGURATION (see also preventAllURLConfig)
+      lockExtensions: false, // Disallowed in URL setting
+      noDefaultExtensions: false, // noDefaultExtensions can only be meaningfully used in config.js or in the URL
+      // EXTENSION-RELATED (GRID)
+      showGrid: false, // Set by ext-grid.js
+      // EXTENSION-RELATED (STORAGE)
+      noStorageOnLoad: false, // Some interaction with ext-storage.js; prevent even the loading of previously saved local storage
+      forceStorage: false, // Some interaction with ext-storage.js; strongly discouraged from modification as it bypasses user privacy by preventing them from choosing whether to keep local storage or not
+      emptyStorageOnDecline: false // Used by ext-storage.js; empty any prior storage if the user declines to store
+    },
+    /**
+    * LOCALE
+    * @todo Can we remove now that we are always loading even English? (unless locale is set to null)
+    */
+    uiStrings = editor.uiStrings = {
+      common: {
+        ok: 'OK',
+        cancel: 'Cancel',
+        key_up: 'Up',
+        key_down: 'Down',
+        key_backspace: 'Backspace',
+        key_del: 'Del'
+      },
+      // This is needed if the locale is English, since the locale strings are not read in that instance.
+      layers: {
+        layer: 'Layer'
+      },
+      notification: {
+        invalidAttrValGiven: 'Invalid value given',
+        noContentToFitTo: 'No content to fit to',
+        dupeLayerName: 'There is already a layer named that!',
+        enterUniqueLayerName: 'Please enter a unique layer name',
+        enterNewLayerName: 'Please enter the new layer name',
+        layerHasThatName: 'Layer already has that name',
+        QmoveElemsToLayer: 'Move selected elements to layer \'%s\'?',
+        QwantToClear: 'Do you want to clear the drawing?\nThis will also erase your undo history!',
+        QwantToOpen: 'Do you want to open a new file?\nThis will also erase your undo history!',
+        QerrorsRevertToSource: 'There were parsing errors in your SVG source.\nRevert back to original SVG source?',
+        QignoreSourceChanges: 'Ignore changes made to SVG source?',
+        featNotSupported: 'Feature not supported',
+        enterNewImgURL: 'Enter the new image URL',
+        defsFailOnSave: 'NOTE: Due to a bug in your browser, this image may appear wrong (missing gradients or elements). It will however appear correct once actually saved.',
+        loadingImage: 'Loading image, please wait...',
+        saveFromBrowser: 'Select \'Save As...\' in your browser to save this image as a %s file.',
+        noteTheseIssues: 'Also note the following issues: ',
+        unsavedChanges: 'There are unsaved changes.',
+        enterNewLinkURL: 'Enter the new hyperlink URL',
+        errorLoadingSVG: 'Error: Unable to load SVG data',
+        URLloadFail: 'Unable to load from URL',
+        retrieving: 'Retrieving \'%s\' ...',
+        popupWindowBlocked: 'Popup window may be blocked by browser'
+      }
+    };
+
+  function loadSvgString (str, callback) {
+    var success = svgCanvas.setSvgString(str) !== false;
+    callback = callback || $.noop;
+    if (success) {
+      callback(true);
+    } else {
+      $.alert(uiStrings.notification.errorLoadingSVG, function () {
+        callback(false);
+      });
+    }
+  }
+
+  /**
+  * EXPORTS
+  */
+
+  /**
+  * Store and retrieve preferences
+  * @param {string} key The preference name to be retrieved or set
+  * @param {string} [val] The value. If the value supplied is missing or falsey, no change to the preference will be made.
+  * @returns {string} If val is missing or falsey, the value of the previously stored preference will be returned.
+  * @todo Can we change setting on the jQuery namespace (onto editor) to avoid conflicts?
+  * @todo Review whether any remaining existing direct references to
+  *	getting curPrefs can be changed to use $.pref() getting to ensure
+  *	defaultPrefs fallback (also for sake of allowInitialUserOverride); specifically, bkgd_color could be changed so that
+  *	the pref dialog has a button to auto-calculate background, but otherwise uses $.pref() to be able to get default prefs
+  *	or overridable settings
+  */
+  $.pref = function (key, val) {
+    if (val) {
+      curPrefs[key] = val;
+      editor.curPrefs = curPrefs; // Update exported value
+      return;
+    }
+    return (key in curPrefs) ? curPrefs[key] : defaultPrefs[key];
+  };
+
+  /**
+  * EDITOR PUBLIC METHODS
+  * locale.js also adds "putLang" and "readLang" as editor methods
+  * @todo Sort these methods per invocation order, ideally with init at the end
+  * @todo Prevent execution until init executes if dependent on it?
+  */
+
+  /**
+  * Where permitted, sets canvas and/or defaultPrefs based on previous
+  *	storage. This will override URL settings (for security reasons) but
+  *	not config.js configuration (unless initial user overriding is explicitly
+  *	permitted there via allowInitialUserOverride).
+  * @todo Split allowInitialUserOverride into allowOverrideByURL and
+  *	allowOverrideByUserStorage so config.js can disallow some
+  *	individual items for URL setting but allow for user storage AND/OR
+  *	change URL setting so that it always uses a different namespace,
+  *	so it won't affect pre-existing user storage (but then if users saves
+  *	that, it will then be subject to tampering
+  */
+  editor.loadContentAndPrefs = function () {
+    if (!curConfig.forceStorage && (curConfig.noStorageOnLoad || !document.cookie.match(/(?:^|;\s*)store=(?:prefsAndContent|prefsOnly)/))) {
+      return;
+    }
+
+    // LOAD CONTENT
+    if (editor.storage && // Cookies do not have enough available memory to hold large documents
+      (curConfig.forceStorage || (!curConfig.noStorageOnLoad && document.cookie.match(/(?:^|;\s*)store=prefsAndContent/)))
+    ) {
+      var name = 'svgedit-' + curConfig.canvasName;
+      var cached = editor.storage.getItem(name);
+      if (cached) {
+        editor.loadFromString(cached);
+      }
+    }
+
+    // LOAD PREFS
+    var key;
+    for (key in defaultPrefs) {
+      if (defaultPrefs.hasOwnProperty(key)) { // It's our own config, so we don't need to iterate up the prototype chain
+        var storeKey = 'svg-edit-' + key;
+        if (editor.storage) {
+          var val = editor.storage.getItem(storeKey);
+          if (val) {
+            defaultPrefs[key] = String(val); // Convert to string for FF (.value fails in Webkit)
+          }
+        } else if (window.widget) {
+          defaultPrefs[key] = widget.preferenceForKey(storeKey);
+        } else {
+          var result = document.cookie.match(new RegExp('(?:^|;\\s*)' + Utils.preg_quote(encodeURIComponent(storeKey)) + '=([^;]+)'));
+          defaultPrefs[key] = result ? decodeURIComponent(result[1]) : '';
+        }
+      }
+    }
+  };
+
+  /**
+  * Allows setting of preferences or configuration (including extensions).
+  * @param {Object} opts The preferences or configuration (including extensions)
+  * @param {Object} [cfgCfg] Describes configuration which applies to the particular batch of supplied options
+  * @param {boolean} [cfgCfg.allowInitialUserOverride=false] Set to true if you wish
+  *	to allow initial overriding of settings by the user via the URL
+  *	(if permitted) or previously stored preferences (if permitted);
+  *	note that it will be too late if you make such calls in extension
+  *	code because the URL or preference storage settings will
+  *   have already taken place.
+  * @param {boolean} [cfgCfg.overwrite=true] Set to false if you wish to
+  *	prevent the overwriting of prior-set preferences or configuration
+  *	(URL settings will always follow this requirement for security
+  *	reasons, so config.js settings cannot be overridden unless it
+  *	explicitly permits via "allowInitialUserOverride" but extension config
+  *	can be overridden as they will run after URL settings). Should
+  *   not be needed in config.js.
+  */
+  editor.setConfig = function (opts, cfgCfg) {
+    cfgCfg = cfgCfg || {};
+    function extendOrAdd (cfgObj, key, val) {
+      if (cfgObj[key] && typeof cfgObj[key] === 'object') {
+        $.extend(true, cfgObj[key], val);
+      } else {
+        cfgObj[key] = val;
+      }
+    }
+    $.each(opts, function (key, val) {
+      if (opts.hasOwnProperty(key)) {
+        // Only allow prefs defined in defaultPrefs
+        if (defaultPrefs.hasOwnProperty(key)) {
+          if (cfgCfg.overwrite === false && (
+            curConfig.preventAllURLConfig ||
+            curPrefs.hasOwnProperty(key)
+          )) {
+            return;
+          }
+          if (cfgCfg.allowInitialUserOverride === true) {
+            defaultPrefs[key] = val;
+          } else {
+            $.pref(key, val);
+          }
+        } else if (['extensions', 'allowedOrigins'].indexOf(key) > -1) {
+          if (cfgCfg.overwrite === false &&
+            (
+              curConfig.preventAllURLConfig ||
+              key === 'allowedOrigins' ||
+              (key === 'extensions' && curConfig.lockExtensions)
+            )
+          ) {
+            return;
+          }
+          curConfig[key] = curConfig[key].concat(val); // We will handle any dupes later
+        // Only allow other curConfig if defined in defaultConfig
+        } else if (defaultConfig.hasOwnProperty(key)) {
+          if (cfgCfg.overwrite === false && (
+            curConfig.preventAllURLConfig ||
+            curConfig.hasOwnProperty(key)
+          )) {
+            return;
+          }
+          // Potentially overwriting of previously set config
+          if (curConfig.hasOwnProperty(key)) {
+            if (cfgCfg.overwrite === false) {
+              return;
+            }
+            extendOrAdd(curConfig, key, val);
+          } else {
+            if (cfgCfg.allowInitialUserOverride === true) {
+              extendOrAdd(defaultConfig, key, val);
+            } else {
+              if (defaultConfig[key] && typeof defaultConfig[key] === 'object') {
+                curConfig[key] = {};
+                $.extend(true, curConfig[key], val); // Merge properties recursively, e.g., on initFill, initStroke objects
+              } else {
+                curConfig[key] = val;
+              }
+            }
+          }
+        }
+      }
+    });
+    editor.curConfig = curConfig; // Update exported value
+  };
+
+  /**
+  * @param {Object} opts Extension mechanisms may call setCustomHandlers with three functions: opts.open, opts.save, and opts.exportImage
+  * opts.open's responsibilities are:
+  *	- invoke a file chooser dialog in 'open' mode
+  *	- let user pick a SVG file
+  *	- calls svgCanvas.setSvgString() with the string contents of that file
+  *  opts.save's responsibilities are:
+  *	- accept the string contents of the current document
+  *	- invoke a file chooser dialog in 'save' mode
+  *	- save the file to location chosen by the user
+  *  opts.exportImage's responsibilities (with regard to the object it is supplied in its 2nd argument) are:
+  *	- inform user of any issues supplied via the "issues" property
+  *	- convert the "svg" property SVG string into an image for export;
+  *		utilize the properties "type" (currently 'PNG', 'JPEG', 'BMP',
+  *		'WEBP', 'PDF'), "mimeType", and "quality" (for 'JPEG' and 'WEBP'
+  *		types) to determine the proper output.
+  */
+  editor.setCustomHandlers = function (opts) {
+    editor.ready(function () {
+      if (opts.open) {
+        $('#tool_open > input[type="file"]').remove();
+        $('#tool_open').show();
+        svgCanvas.open = opts.open;
+      }
+      if (opts.save) {
+        editor.showSaveWarning = false;
+        svgCanvas.bind('saved', opts.save);
+      }
+      if (opts.exportImage) {
+        customExportImage = opts.exportImage;
+        svgCanvas.bind('exported', customExportImage); // canvg and our RGBColor will be available to the method
+      }
+      if (opts.exportPDF) {
+        customExportPDF = opts.exportPDF;
+        svgCanvas.bind('exportedPDF', customExportPDF); // jsPDF and our RGBColor will be available to the method
+      }
+    });
+  };
+
+  editor.randomizeIds = function () {
+    svgCanvas.randomizeIds(arguments);
+  };
+
+  editor.init = function () {
+    // var host = location.hostname,
+    //	onWeb = host && host.indexOf('.') >= 0;
+    // Some FF versions throw security errors here when directly accessing
+    try {
+      if ('localStorage' in window) { // && onWeb removed so Webkit works locally
+        editor.storage = localStorage;
+      }
+    } catch (err) {}
+
+    // Todo: Avoid var-defined functions and group functions together, etc. where possible
+    var goodLangs = [];
+    $('#lang_select option').each(function () {
+      goodLangs.push(this.value);
+    });
+
+    function setupCurPrefs () {
+      curPrefs = $.extend(true, {}, defaultPrefs, curPrefs); // Now safe to merge with priority for curPrefs in the event any are already set
+      // Export updated prefs
+      editor.curPrefs = curPrefs;
+    }
+    function setupCurConfig () {
+      curConfig = $.extend(true, {}, defaultConfig, curConfig); // Now safe to merge with priority for curConfig in the event any are already set
+
+      // Now deal with extensions and other array config
+      if (!curConfig.noDefaultExtensions) {
+        curConfig.extensions = curConfig.extensions.concat(defaultExtensions);
+      }
+      // ...and remove any dupes
+      $.each(['extensions', 'allowedOrigins'], function (i, cfg) {
+        curConfig[cfg] = $.grep(curConfig[cfg], function (n, i) {
+          return i === curConfig[cfg].indexOf(n);
+        });
+      });
+      // Export updated config
+      editor.curConfig = curConfig;
+    }
+    (function () {
+      // Load config/data from URL if given
+      var src, qstr;
+      urldata = $.deparam.querystring(true);
+      if (!$.isEmptyObject(urldata)) {
+        if (urldata.dimensions) {
+          urldata.dimensions = urldata.dimensions.split(',');
+        }
+
+        if (urldata.bkgd_color) {
+          urldata.bkgd_color = '#' + urldata.bkgd_color;
+        }
+
+        if (urldata.extensions) {
+          // For security reasons, disallow cross-domain or cross-folder extensions via URL
+          urldata.extensions = urldata.extensions.match(/[:/\\]/) ? '' : urldata.extensions.split(',');
+        }
+
+        // Disallowing extension paths via URL for
+        // security reasons, even for same-domain
+        // ones given potential to interact in undesirable
+        // ways with other script resources
+        $.each(
+          [
+            'extPath', 'imgPath',
+            'langPath', 'jGraduatePath'
+          ],
+          function (pathConfig) {
+            if (urldata[pathConfig]) {
+              delete urldata[pathConfig];
+            }
+          }
+        );
+
+        editor.setConfig(urldata, {overwrite: false}); // Note: source and url (as with storagePrompt later) are not set on config but are used below
+
+        setupCurConfig();
+
+        if (!curConfig.preventURLContentLoading) {
+          src = urldata.source;
+          qstr = $.param.querystring();
+          if (!src) { // urldata.source may have been null if it ended with '='
+            if (qstr.indexOf('source=data:') >= 0) {
+              src = qstr.match(/source=(data:[^&]*)/)[1];
+            }
+          }
+          if (src) {
+            if (src.indexOf('data:') === 0) {
+              editor.loadFromDataURI(src);
+            } else {
+              editor.loadFromString(src);
+            }
+            return;
+          }
+          if (urldata.url) {
+            editor.loadFromURL(urldata.url);
+            return;
+          }
+        }
+        if (!urldata.noStorageOnLoad || curConfig.forceStorage) {
+          editor.loadContentAndPrefs();
+        }
+        setupCurPrefs();
+      } else {
+        setupCurConfig();
+        editor.loadContentAndPrefs();
+        setupCurPrefs();
+      }
+    }());
+
+    var setIcon = editor.setIcon = function (elem, iconId, forcedSize) {
+      var icon = (typeof iconId === 'string') ? $.getSvgIcon(iconId, true) : iconId.clone();
+      if (!icon) {
+        console.log('NOTE: Icon image missing: ' + iconId);
+        return;
+      }
+      $(elem).empty().append(icon);
+    };
+
+    var extFunc = function () {
+      $.each(curConfig.extensions, function () {
+        var extname = this;
+        if (!extname.match(/^ext-.*\.js/)) { // Ensure URL cannot specify some other unintended file in the extPath
+          return;
+        }
+        $.getScript(curConfig.extPath + extname, function (d) {
+          // Fails locally in Chrome 5
+          if (!d) {
+            var s = document.createElement('script');
+            s.src = curConfig.extPath + extname;
+            document.querySelector('head').appendChild(s);
+          }
+        }).fail(function (jqxhr, settings, exception) {
+          console.log(exception);
+        });
+      });
+
+      // var lang = ('lang' in curPrefs) ? curPrefs.lang : null;
+      editor.putLocale(null, goodLangs);
+    };
+
+    // Load extensions
+    // Bit of a hack to run extensions in local Opera/IE9
+    if (document.location.protocol === 'file:') {
+      setTimeout(extFunc, 100);
+    } else {
+      extFunc();
+    }
+    $.svgIcons(curConfig.imgPath + 'svg_edit_icons.svg', {
+      w: 24, h: 24,
+      id_match: false,
+      no_img: !svgedit.browser.isWebkit(), // Opera & Firefox 4 gives odd behavior w/images
+      fallback_path: curConfig.imgPath,
+      fallback: {
+        'new_image': 'clear.png',
+        'save': 'save.png',
+        'open': 'open.png',
+        'source': 'source.png',
+        'docprops': 'document-properties.png',
+        'wireframe': 'wireframe.png',
+
+        'undo': 'undo.png',
+        'redo': 'redo.png',
+
+        'select': 'select.png',
+        'select_node': 'select_node.png',
+        'pencil': 'fhpath.png',
+        'pen': 'line.png',
+        'square': 'square.png',
+        'rect': 'rect.png',
+        'fh_rect': 'freehand-square.png',
+        'circle': 'circle.png',
+        'ellipse': 'ellipse.png',
+        'fh_ellipse': 'freehand-circle.png',
+        'path': 'path.png',
+        'text': 'text.png',
+        'image': 'image.png',
+        'zoom': 'zoom.png',
+
+        'clone': 'clone.png',
+        'node_clone': 'node_clone.png',
+        'delete': 'delete.png',
+        'node_delete': 'node_delete.png',
+        'group': 'shape_group_elements.png',
+        'ungroup': 'shape_ungroup.png',
+        'move_top': 'move_top.png',
+        'move_bottom': 'move_bottom.png',
+        'to_path': 'to_path.png',
+        'link_controls': 'link_controls.png',
+        'reorient': 'reorient.png',
+
+        'align_left': 'align-left.png',
+        'align_center': 'align-center.png',
+        'align_right': 'align-right.png',
+        'align_top': 'align-top.png',
+        'align_middle': 'align-middle.png',
+        'align_bottom': 'align-bottom.png',
+
+        'go_up': 'go-up.png',
+        'go_down': 'go-down.png',
+
+        'ok': 'save.png',
+        'cancel': 'cancel.png',
+
+        'arrow_right': 'flyouth.png',
+        'arrow_down': 'dropdown.gif'
+      },
+      placement: {
+        '#logo': 'logo',
+
+        '#tool_clear div,#layer_new': 'new_image',
+        '#tool_save div': 'save',
+        '#tool_export div': 'export',
+        '#tool_open div div': 'open',
+        '#tool_import div div': 'import',
+        '#tool_source': 'source',
+        '#tool_docprops > div': 'docprops',
+        '#tool_wireframe': 'wireframe',
+
+        '#tool_undo': 'undo',
+        '#tool_redo': 'redo',
+
+        '#tool_select': 'select',
+        '#tool_fhpath': 'pencil',
+        '#tool_line': 'pen',
+        '#tool_rect,#tools_rect_show': 'rect',
+        '#tool_square': 'square',
+        '#tool_fhrect': 'fh_rect',
+        '#tool_ellipse,#tools_ellipse_show': 'ellipse',
+        '#tool_circle': 'circle',
+        '#tool_fhellipse': 'fh_ellipse',
+        '#tool_path': 'path',
+        '#tool_text,#layer_rename': 'text',
+        '#tool_image': 'image',
+        '#tool_zoom': 'zoom',
+
+        '#tool_clone,#tool_clone_multi': 'clone',
+        '#tool_node_clone': 'node_clone',
+        '#layer_delete,#tool_delete,#tool_delete_multi': 'delete',
+        '#tool_node_delete': 'node_delete',
+        '#tool_add_subpath': 'add_subpath',
+        '#tool_openclose_path': 'open_path',
+        '#tool_move_top': 'move_top',
+        '#tool_move_bottom': 'move_bottom',
+        '#tool_topath': 'to_path',
+        '#tool_node_link': 'link_controls',
+        '#tool_reorient': 'reorient',
+        '#tool_group_elements': 'group_elements',
+        '#tool_ungroup': 'ungroup',
+        '#tool_unlink_use': 'unlink_use',
+
+        '#tool_alignleft, #tool_posleft': 'align_left',
+        '#tool_aligncenter, #tool_poscenter': 'align_center',
+        '#tool_alignright, #tool_posright': 'align_right',
+        '#tool_aligntop, #tool_postop': 'align_top',
+        '#tool_alignmiddle, #tool_posmiddle': 'align_middle',
+        '#tool_alignbottom, #tool_posbottom': 'align_bottom',
+        '#cur_position': 'align',
+
+        '#linecap_butt,#cur_linecap': 'linecap_butt',
+        '#linecap_round': 'linecap_round',
+        '#linecap_square': 'linecap_square',
+
+        '#linejoin_miter,#cur_linejoin': 'linejoin_miter',
+        '#linejoin_round': 'linejoin_round',
+        '#linejoin_bevel': 'linejoin_bevel',
+
+        '#url_notice': 'warning',
+
+        '#layer_up': 'go_up',
+        '#layer_down': 'go_down',
+        '#layer_moreopts': 'context_menu',
+        '#layerlist td.layervis': 'eye',
+
+        '#tool_source_save,#tool_docprops_save,#tool_prefs_save': 'ok',
+        '#tool_source_cancel,#tool_docprops_cancel,#tool_prefs_cancel': 'cancel',
+
+        '#rwidthLabel, #iwidthLabel': 'width',
+        '#rheightLabel, #iheightLabel': 'height',
+        '#cornerRadiusLabel span': 'c_radius',
+        '#angleLabel': 'angle',
+        '#linkLabel,#tool_make_link,#tool_make_link_multi': 'globe_link',
+        '#zoomLabel': 'zoom',
+        '#tool_fill label': 'fill',
+        '#tool_stroke .icon_label': 'stroke',
+        '#group_opacityLabel': 'opacity',
+        '#blurLabel': 'blur',
+        '#font_sizeLabel': 'fontsize',
+
+        '.flyout_arrow_horiz': 'arrow_right',
+        '.dropdown button, #main_button .dropdown': 'arrow_down',
+        '#palette .palette_item:first, #fill_bg, #stroke_bg': 'no_color'
+      },
+      resize: {
+        '#logo .svg_icon': 28,
+        '.flyout_arrow_horiz .svg_icon': 5,
+        '.layer_button .svg_icon, #layerlist td.layervis .svg_icon': 14,
+        '.dropdown button .svg_icon': 7,
+        '#main_button .dropdown .svg_icon': 9,
+        '.palette_item:first .svg_icon': 15,
+        '#fill_bg .svg_icon, #stroke_bg .svg_icon': 16,
+        '.toolbar_button button .svg_icon': 16,
+        '.stroke_tool div div .svg_icon': 20,
+        '#tools_bottom label .svg_icon': 18
+      },
+      callback: function (icons) {
+        $('.toolbar_button button > svg, .toolbar_button button > img').each(function () {
+          $(this).parent().prepend(this);
+        });
+
+        var minHeight,
+          tleft = $('#tools_left');
+        if (tleft.length !== 0) {
+          minHeight = tleft.offset().top + tleft.outerHeight();
+        }
+
+        var size = $.pref('iconsize');
+        editor.setIconSize(size || ($(window).height() < minHeight ? 's' : 'm'));
+
+        // Look for any missing flyout icons from plugins
+        $('.tools_flyout').each(function () {
+          var shower = $('#' + this.id + '_show');
+          var sel = shower.attr('data-curopt');
+          // Check if there's an icon here
+          if (!shower.children('svg, img').length) {
+            var clone = $(sel).children().clone();
+            if (clone.length) {
+              clone[0].removeAttribute('style'); // Needed for Opera
+              shower.append(clone);
+            }
+          }
+        });
+
+        editor.runCallbacks();
+
+        setTimeout(function () {
+          $('.flyout_arrow_horiz:empty').each(function () {
+            $(this).append($.getSvgIcon('arrow_right').width(5).height(5));
+          });
+        }, 1);
+      }
+    });
+
+    editor.canvas = svgCanvas = new $.SvgCanvas(document.getElementById('svgcanvas'), curConfig);
+    var supportsNonSS, resizeTimer, changeZoom, Actions, curScrollPos,
+      palette = [ // Todo: Make into configuration item?
+        '#000000', '#3f3f3f', '#7f7f7f', '#bfbfbf', '#ffffff',
+        '#ff0000', '#ff7f00', '#ffff00', '#7fff00',
+        '#00ff00', '#00ff7f', '#00ffff', '#007fff',
+        '#0000ff', '#7f00ff', '#ff00ff', '#ff007f',
+        '#7f0000', '#7f3f00', '#7f7f00', '#3f7f00',
+        '#007f00', '#007f3f', '#007f7f', '#003f7f',
+        '#00007f', '#3f007f', '#7f007f', '#7f003f',
+        '#ffaaaa', '#ffd4aa', '#ffffaa', '#d4ffaa',
+        '#aaffaa', '#aaffd4', '#aaffff', '#aad4ff',
+        '#aaaaff', '#d4aaff', '#ffaaff', '#ffaad4'
+      ],
+      modKey = (svgedit.browser.isMac() ? 'meta+' : 'ctrl+'), // ⌘
+      path = svgCanvas.pathActions,
+      undoMgr = svgCanvas.undoMgr,
+      defaultImageURL = curConfig.imgPath + 'logo.png',
+      workarea = $('#workarea'),
+      canvMenu = $('#cmenu_canvas'),
+      // layerMenu = $('#cmenu_layers'), // Unused
+      exportWindow = null,
+      zoomInIcon = 'crosshair',
+      zoomOutIcon = 'crosshair',
+      uiContext = 'toolbars',
+      origSource = '',
+      paintBox = {fill: null, stroke: null};
+
+    // For external openers
+    (function () {
+      // let the opener know SVG Edit is ready (now that config is set up)
+      var svgEditorReadyEvent,
+        w = window.opener || window.parent;
+      if (w) {
+        try {
+          svgEditorReadyEvent = w.document.createEvent('Event');
+          svgEditorReadyEvent.initEvent('svgEditorReady', true, true);
+          w.document.documentElement.dispatchEvent(svgEditorReadyEvent);
+        } catch (e) {}
+      }
+    }());
+
+    // This sets up alternative dialog boxes. They mostly work the same way as
+    // their UI counterparts, expect instead of returning the result, a callback
+    // needs to be included that returns the result as its first parameter.
+    // In the future we may want to add additional types of dialog boxes, since
+    // they should be easy to handle this way.
+    (function () {
+      $('#dialog_container').draggable({cancel: '#dialog_content, #dialog_buttons *', containment: 'window'});
+      var box = $('#dialog_box'),
+        btnHolder = $('#dialog_buttons'),
+        dialogContent = $('#dialog_content'),
+        dbox = function (type, msg, callback, defaultVal, opts, changeCb, checkbox) {
+          var ok, ctrl, chkbx;
+          dialogContent.html('<p>' + msg.replace(/\n/g, '</p><p>') + '</p>')
+            .toggleClass('prompt', (type === 'prompt'));
+          btnHolder.empty();
+
+          ok = $('<input type="button" value="' + uiStrings.common.ok + '">').appendTo(btnHolder);
+
+          if (type !== 'alert') {
+            $('<input type="button" value="' + uiStrings.common.cancel + '">')
+              .appendTo(btnHolder)
+              .click(function () { box.hide(); if (callback) { callback(false); } });
+          }
+
+          if (type === 'prompt') {
+            ctrl = $('<input type="text">').prependTo(btnHolder);
+            ctrl.val(defaultVal || '');
+            ctrl.bind('keydown', 'return', function () { ok.click(); });
+          } else if (type === 'select') {
+            var div = $('<div style="text-align:center;">');
+            ctrl = $('<select>').appendTo(div);
+            if (checkbox) {
+              var label = $('<label>').text(checkbox.label);
+              chkbx = $('<input type="checkbox">').appendTo(label);
+              chkbx.val(checkbox.value);
+              if (checkbox.tooltip) {
+                label.attr('title', checkbox.tooltip);
+              }
+              chkbx.prop('checked', !!checkbox.checked);
+              div.append($('<div>').append(label));
+            }
+            $.each(opts || [], function (opt, val) {
+              if (typeof val === 'object') {
+                ctrl.append($('<option>').val(val.value).html(val.text));
+              } else {
+                ctrl.append($('<option>').html(val));
+              }
+            });
+            dialogContent.append(div);
+            if (defaultVal) {
+              ctrl.val(defaultVal);
+            }
+            if (changeCb) {
+              ctrl.bind('change', 'return', changeCb);
+            }
+            ctrl.bind('keydown', 'return', function () { ok.click(); });
+          } else if (type === 'process') {
+            ok.hide();
+          }
+
+          box.show();
+
+          ok.click(function () {
+            box.hide();
+            var resp = (type === 'prompt' || type === 'select') ? ctrl.val() : true;
+            if (callback) {
+              if (chkbx) {
+                callback(resp, chkbx.prop('checked'));
+              } else {
+                callback(resp);
+              }
+            }
+          }).focus();
+
+          if (type === 'prompt' || type === 'select') {
+            ctrl.focus();
+          }
+        };
+
+      $.alert = function (msg, cb) { dbox('alert', msg, cb); };
+      $.confirm = function (msg, cb) { dbox('confirm', msg, cb); };
+      $.process_cancel = function (msg, cb) { dbox('process', msg, cb); };
+      $.prompt = function (msg, txt, cb) { dbox('prompt', msg, cb, txt); };
+      $.select = function (msg, opts, cb, changeCb, txt, checkbox) { dbox('select', msg, cb, txt, opts, changeCb, checkbox); };
+    }());
+
+    var setSelectMode = function () {
+      var curr = $('.tool_button_current');
+      if (curr.length && curr[0].id !== 'tool_select') {
+        curr.removeClass('tool_button_current').addClass('tool_button');
+        $('#tool_select').addClass('tool_button_current').removeClass('tool_button');
+        $('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all} #svgcanvas svg{cursor:default}');
+      }
+      svgCanvas.setMode('select');
+      workarea.css('cursor', 'auto');
+    };
+
+    // used to make the flyouts stay on the screen longer the very first time
+    // var flyoutspeed = 1250; // Currently unused
+    // var textBeingEntered = false; // Currently unused
+    var selectedElement = null;
+    var multiselected = false;
+    var editingsource = false;
+    var docprops = false;
+    var preferences = false;
+    var curContext = '';
+    var origTitle = $('title:first').text();
+    // Make [1,2,5] array
+    var rIntervals = [];
+    var i;
+    for (i = 0.1; i < 1E5; i *= 10) {
+      rIntervals.push(i);
+      rIntervals.push(2 * i);
+      rIntervals.push(5 * i);
+    }
+
+    // This function highlights the layer passed in (by fading out the other layers)
+    // if no layer is passed in, this function restores the other layers
+    var toggleHighlightLayer = function (layerNameToHighlight) {
+      var i, curNames = [], numLayers = svgCanvas.getCurrentDrawing().getNumLayers();
+      for (i = 0; i < numLayers; i++) {
+        curNames[i] = svgCanvas.getCurrentDrawing().getLayerName(i);
+      }
+
+      if (layerNameToHighlight) {
+        for (i = 0; i < numLayers; ++i) {
+          if (curNames[i] !== layerNameToHighlight) {
+            svgCanvas.getCurrentDrawing().setLayerOpacity(curNames[i], 0.5);
+          }
+        }
+      } else {
+        for (i = 0; i < numLayers; ++i) {
+          svgCanvas.getCurrentDrawing().setLayerOpacity(curNames[i], 1.0);
+        }
+      }
+    };
+
+    var populateLayers = function () {
+      svgCanvas.clearSelection();
+      var layerlist = $('#layerlist tbody').empty();
+      var selLayerNames = $('#selLayerNames').empty();
+      var drawing = svgCanvas.getCurrentDrawing();
+      var currentLayerName = drawing.getCurrentLayerName();
+      var layer = svgCanvas.getCurrentDrawing().getNumLayers();
+      var icon = $.getSvgIcon('eye');
+      // we get the layers in the reverse z-order (the layer rendered on top is listed first)
+      while (layer--) {
+        var name = drawing.getLayerName(layer);
+        var layerTr = $('<tr class="layer">').toggleClass('layersel', name === currentLayerName);
+        var layerVis = $('<td class="layervis">').toggleClass('layerinvis', !drawing.getLayerVisibility(name));
+        var layerName = $('<td class="layername">' + name + '</td>');
+        layerlist.append(layerTr.append(layerVis, layerName));
+        selLayerNames.append('<option value="' + name + '">' + name + '</option>');
+      }
+      if (icon !== undefined) {
+        var copy = icon.clone();
+        $('td.layervis', layerlist).append(copy);
+        $.resizeSvgIcons({'td.layervis .svg_icon': 14});
+      }
+      // handle selection of layer
+      $('#layerlist td.layername')
+        .mouseup(function (evt) {
+          $('#layerlist tr.layer').removeClass('layersel');
+          $(this.parentNode).addClass('layersel');
+          svgCanvas.setCurrentLayer(this.textContent);
+          evt.preventDefault();
+        })
+        .mouseover(function () {
+          toggleHighlightLayer(this.textContent);
+        })
+        .mouseout(function () {
+          toggleHighlightLayer();
+        });
+      $('#layerlist td.layervis').click(function () {
+        var row = $(this.parentNode).prevAll().length;
+        var name = $('#layerlist tr.layer:eq(' + row + ') td.layername').text();
+        var vis = $(this).hasClass('layerinvis');
+        svgCanvas.setLayerVisibility(name, vis);
+        $(this).toggleClass('layerinvis');
+      });
+
+      // if there were too few rows, let's add a few to make it not so lonely
+      var num = 5 - $('#layerlist tr.layer').size();
+      while (num-- > 0) {
+        // FIXME: there must a better way to do this
+        layerlist.append('<tr><td style="color:white">_</td><td/></tr>');
+      }
+    };
+
+    var showSourceEditor = function (e, forSaving) {
+      if (editingsource) { return; }
+
+      editingsource = true;
+      origSource = svgCanvas.getSvgString();
+      $('#save_output_btns').toggle(!!forSaving);
+      $('#tool_source_back').toggle(!forSaving);
+      $('#svg_source_textarea').val(origSource);
+      $('#svg_source_editor').fadeIn();
+      $('#svg_source_textarea').focus();
+    };
+
+    var togglePathEditMode = function (editmode, elems) {
+      $('#path_node_panel').toggle(editmode);
+      $('#tools_bottom_2,#tools_bottom_3').toggle(!editmode);
+      if (editmode) {
+        // Change select icon
+        $('.tool_button_current').removeClass('tool_button_current').addClass('tool_button');
+        $('#tool_select').addClass('tool_button_current').removeClass('tool_button');
+        setIcon('#tool_select', 'select_node');
+        multiselected = false;
+        if (elems.length) {
+          selectedElement = elems[0];
+        }
+      } else {
+        setTimeout(function () {
+          setIcon('#tool_select', 'select');
+        }, 1000);
+      }
+    };
+
+    var saveHandler = function (wind, svg) {
+      editor.showSaveWarning = false;
+
+      // by default, we add the XML prolog back, systems integrating SVG-edit (wikis, CMSs)
+      // can just provide their own custom save handler and might not want the XML prolog
+      svg = '<?xml version="1.0"?>\n' + svg;
+
+      // IE9 doesn't allow standalone Data URLs
+      // https://connect.microsoft.com/IE/feedback/details/542600/data-uri-images-fail-when-loaded-by-themselves
+      if (svgedit.browser.isIE()) {
+        showSourceEditor(0, true);
+        return;
+      }
+
+      // Since saving SVGs by opening a new window was removed in Chrome use artificial link-click
+      // https://stackoverflow.com/questions/45603201/window-is-not-allowed-to-navigate-top-frame-navigations-to-data-urls
+      var a = document.createElement('a');
+      a.href = 'data:image/svg+xml;base64,' + Utils.encode64(svg);
+      a.download = 'icon.svg';
+
+      a.click();
+
+      // Alert will only appear the first time saved OR the
+      //   first time the bug is encountered
+      var done = $.pref('save_notice_done');
+      if (done !== 'all') {
+        var note = uiStrings.notification.saveFromBrowser.replace('%s', 'SVG');
+
+        // Check if FF and has <defs/>
+        if (svgedit.browser.isGecko()) {
+          if (svg.indexOf('<defs') !== -1) {
+            // warning about Mozilla bug #308590 when applicable (seems to be fixed now in Feb 2013)
+            note += '\n\n' + uiStrings.notification.defsFailOnSave;
+            $.pref('save_notice_done', 'all');
+            done = 'all';
+          } else {
+            $.pref('save_notice_done', 'part');
+          }
+        } else {
+          $.pref('save_notice_done', 'all');
+        }
+        if (done !== 'part') {
+          alert(note);
+        }
+      }
+    };
+
+    var exportHandler = function (win, data) {
+      var issues = data.issues,
+        exportWindowName = data.exportWindowName;
+
+      if (exportWindowName) {
+        exportWindow = window.open(svgedit.utilities.blankPageObjectURL || '', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
+      }
+
+      if (!exportWindow || exportWindow.closed) {
+        $.alert(uiStrings.notification.popupWindowBlocked);
+        return;
+      }
+
+      exportWindow.location.href = data.bloburl || data.datauri;
+      var done = $.pref('export_notice_done');
+      if (done !== 'all') {
+        var note = uiStrings.notification.saveFromBrowser.replace('%s', data.type);
+
+        // Check if there's issues
+        if (issues.length) {
+          var pre = '\n \u2022 ';
+          note += ('\n\n' + uiStrings.notification.noteTheseIssues + pre + issues.join(pre));
+        }
+
+        // Note that this will also prevent the notice even though new issues may appear later.
+        // May want to find a way to deal with that without annoying the user
+        $.pref('export_notice_done', 'all');
+        exportWindow.alert(note);
+      }
+    };
+
+    var operaRepaint = function () {
+      // Repaints canvas in Opera. Needed for stroke-dasharray change as well as fill change
+      if (!window.opera) {
+        return;
+      }
+      $('<p/>').hide().appendTo('body').remove();
+    };
+
+    function setStrokeOpt (opt, changeElem) {
+      var id = opt.id;
+      var bits = id.split('_');
+      var pre = bits[0];
+      var val = bits[1];
+
+      if (changeElem) {
+        svgCanvas.setStrokeAttr('stroke-' + pre, val);
+      }
+      operaRepaint();
+      setIcon('#cur_' + pre, id, 20);
+      $(opt).addClass('current').siblings().removeClass('current');
+    }
+
+    // This is a common function used when a tool has been clicked (chosen)
+    // It does several common things:
+    // - removes the tool_button_current class from whatever tool currently has it
+    // - hides any flyouts
+    // - adds the tool_button_current class to the button passed in
+    var toolButtonClick = editor.toolButtonClick = function (button, noHiding) {
+      if ($(button).hasClass('disabled')) { return false; }
+      if ($(button).parent().hasClass('tools_flyout')) { return true; }
+      var fadeFlyouts = 'normal';
+      if (!noHiding) {
+        $('.tools_flyout').fadeOut(fadeFlyouts);
+      }
+      $('#styleoverrides').text('');
+      workarea.css('cursor', 'auto');
+      $('.tool_button_current').removeClass('tool_button_current').addClass('tool_button');
+      $(button).addClass('tool_button_current').removeClass('tool_button');
+      return true;
+    };
+
+    var clickSelect = editor.clickSelect = function () {
+      if (toolButtonClick('#tool_select')) {
+        svgCanvas.setMode('select');
+        $('#styleoverrides').text('#svgcanvas svg *{cursor:move;pointer-events:all}, #svgcanvas svg{cursor:default}');
+      }
+    };
+
+    var setImageURL = editor.setImageURL = function (url) {
+      if (!url) {
+        url = defaultImageURL;
+      }
+      svgCanvas.setImageURL(url);
+      $('#image_url').val(url);
+
+      if (url.indexOf('data:') === 0) {
+        // data URI found
+        $('#image_url').hide();
+        $('#change_image_url').show();
+      } else {
+        // regular URL
+        svgCanvas.embedImage(url, function (dataURI) {
+          // Couldn't embed, so show warning
+          $('#url_notice').toggle(!dataURI);
+          defaultImageURL = url;
+        });
+        $('#image_url').show();
+        $('#change_image_url').hide();
+      }
+    };
+
+    function setBackground (color, url) {
+      // if (color == $.pref('bkgd_color') && url == $.pref('bkgd_url')) { return; }
+      $.pref('bkgd_color', color);
+      $.pref('bkgd_url', url);
+
+      // This should be done in svgcanvas.js for the borderRect fill
+      svgCanvas.setBackground(color, url);
+    }
+
+    function promptImgURL () {
+      var curhref = svgCanvas.getHref(selectedElement);
+      curhref = curhref.indexOf('data:') === 0 ? '' : curhref;
+      $.prompt(uiStrings.notification.enterNewImgURL, curhref, function (url) {
+        if (url) { setImageURL(url); }
+      });
+    }
+
+    var setInputWidth = function (elem) {
+      var w = Math.min(Math.max(12 + elem.value.length * 6, 50), 300);
+      $(elem).width(w);
+    };
+
+    function updateRulers (scanvas, zoom) {
+      if (!zoom) { zoom = svgCanvas.getZoom(); }
+      if (!scanvas) { scanvas = $('#svgcanvas'); }
+
+      var d, i;
+      var limit = 30000;
+      var contentElem = svgCanvas.getContentElem();
+      var units = svgedit.units.getTypeMap();
+      var unit = units[curConfig.baseUnit]; // 1 = 1px
+
+      // draw x ruler then y ruler
+      for (d = 0; d < 2; d++) {
+        var isX = (d === 0);
+        var dim = isX ? 'x' : 'y';
+        var lentype = isX ? 'width' : 'height';
+        var contentDim = Number(contentElem.getAttribute(dim));
+
+        var $hcanvOrig = $('#ruler_' + dim + ' canvas:first');
+
+        // Bit of a hack to fully clear the canvas in Safari & IE9
+        var $hcanv = $hcanvOrig.clone();
+        $hcanvOrig.replaceWith($hcanv);
+
+        var hcanv = $hcanv[0];
+
+        // Set the canvas size to the width of the container
+        var rulerLen = scanvas[lentype]();
+        var totalLen = rulerLen;
+        hcanv.parentNode.style[lentype] = totalLen + 'px';
+        var ctxNum = 0;
+        var ctx = hcanv.getContext('2d');
+        var ctxArr, num, ctxArrNum;
+
+        ctx.fillStyle = 'rgb(200,0,0)';
+        ctx.fillRect(0, 0, hcanv.width, hcanv.height);
+
+        // Remove any existing canvasses
+        $hcanv.siblings().remove();
+
+        // Create multiple canvases when necessary (due to browser limits)
+        if (rulerLen >= limit) {
+          ctxArrNum = parseInt(rulerLen / limit, 10) + 1;
+          ctxArr = [];
+          ctxArr[0] = ctx;
+          var copy;
+          for (i = 1; i < ctxArrNum; i++) {
+            hcanv[lentype] = limit;
+            copy = hcanv.cloneNode(true);
+            hcanv.parentNode.appendChild(copy);
+            ctxArr[i] = copy.getContext('2d');
+          }
+
+          copy[lentype] = rulerLen % limit;
+
+          // set copy width to last
+          rulerLen = limit;
+        }
+
+        hcanv[lentype] = rulerLen;
+
+        var uMulti = unit * zoom;
+
+        // Calculate the main number interval
+        var rawM = 50 / uMulti;
+        var multi = 1;
+        for (i = 0; i < rIntervals.length; i++) {
+          num = rIntervals[i];
+          multi = num;
+          if (rawM <= num) {
+            break;
+          }
+        }
+
+        var bigInt = multi * uMulti;
+
+        ctx.font = '9px sans-serif';
+
+        var rulerD = ((contentDim / uMulti) % multi) * uMulti;
+        var labelPos = rulerD - bigInt;
+        // draw big intervals
+        while (rulerD < totalLen) {
+          labelPos += bigInt;
+          // var real_d = rulerD - contentDim; // Currently unused
+
+          var curD = Math.round(rulerD) + 0.5;
+          if (isX) {
+            ctx.moveTo(curD, 15);
+            ctx.lineTo(curD, 0);
+          } else {
+            ctx.moveTo(15, curD);
+            ctx.lineTo(0, curD);
+          }
+
+          num = (labelPos - contentDim) / uMulti;
+          var label;
+          if (multi >= 1) {
+            label = Math.round(num);
+          } else {
+            var decs = String(multi).split('.')[1].length;
+            label = num.toFixed(decs);
+          }
+
+          // Change 1000s to Ks
+          if (label !== 0 && label !== 1000 && label % 1000 === 0) {
+            label = (label / 1000) + 'K';
+          }
+
+          if (isX) {
+            ctx.fillText(label, rulerD + 2, 8);
+          } else {
+            // draw label vertically
+            var str = String(label).split('');
+            for (i = 0; i < str.length; i++) {
+              ctx.fillText(str[i], 1, (rulerD + 9) + i * 9);
+            }
+          }
+
+          var part = bigInt / 10;
+          // draw the small intervals
+          for (i = 1; i < 10; i++) {
+            var subD = Math.round(rulerD + part * i) + 0.5;
+            if (ctxArr && subD > rulerLen) {
+              ctxNum++;
+              ctx.stroke();
+              if (ctxNum >= ctxArrNum) {
+                i = 10;
+                rulerD = totalLen;
+                continue;
+              }
+              ctx = ctxArr[ctxNum];
+              rulerD -= limit;
+              subD = Math.round(rulerD + part * i) + 0.5;
+            }
+
+            // odd lines are slighly longer
+            var lineNum = (i % 2) ? 12 : 10;
+            if (isX) {
+              ctx.moveTo(subD, 15);
+              ctx.lineTo(subD, lineNum);
+            } else {
+              ctx.moveTo(15, subD);
+              ctx.lineTo(lineNum, subD);
+            }
+          }
+          rulerD += bigInt;
+        }
+        ctx.strokeStyle = '#000';
+        ctx.stroke();
+      }
+    }
+
+    var updateCanvas = editor.updateCanvas = function (center, newCtr) {
+      var w = workarea.width(), h = workarea.height();
+      var wOrig = w, hOrig = h;
+      var zoom = svgCanvas.getZoom();
+      var wArea = workarea;
+      var cnvs = $('#svgcanvas');
+      var oldCtr = {
+        x: wArea[0].scrollLeft + wOrig / 2,
+        y: wArea[0].scrollTop + hOrig / 2
+      };
+      var multi = curConfig.canvas_expansion;
+      w = Math.max(wOrig, svgCanvas.contentW * zoom * multi);
+      h = Math.max(hOrig, svgCanvas.contentH * zoom * multi);
+
+      if (w === wOrig && h === hOrig) {
+        workarea.css('overflow', 'hidden');
+      } else {
+        workarea.css('overflow', 'scroll');
+      }
+
+      var oldCanY = cnvs.height() / 2;
+      var oldCanX = cnvs.width() / 2;
+      cnvs.width(w).height(h);
+      var newCanY = h / 2;
+      var newCanX = w / 2;
+      var offset = svgCanvas.updateCanvas(w, h);
+
+      var ratio = newCanX / oldCanX;
+
+      var scrollX = w / 2 - wOrig / 2;
+      var scrollY = h / 2 - hOrig / 2;
+
+      if (!newCtr) {
+        var oldDistX = oldCtr.x - oldCanX;
+        var newX = newCanX + oldDistX * ratio;
+
+        var oldDistY = oldCtr.y - oldCanY;
+        var newY = newCanY + oldDistY * ratio;
+
+        newCtr = {
+          x: newX,
+          y: newY
+        };
+      } else {
+        newCtr.x += offset.x;
+        newCtr.y += offset.y;
+      }
+
+      if (center) {
+        // Go to top-left for larger documents
+        if (svgCanvas.contentW > wArea.width()) {
+          // Top-left
+          workarea[0].scrollLeft = offset.x - 10;
+          workarea[0].scrollTop = offset.y - 10;
+        } else {
+          // Center
+          wArea[0].scrollLeft = scrollX;
+          wArea[0].scrollTop = scrollY;
+        }
+      } else {
+        wArea[0].scrollLeft = newCtr.x - wOrig / 2;
+        wArea[0].scrollTop = newCtr.y - hOrig / 2;
+      }
+      if (curConfig.showRulers) {
+        updateRulers(cnvs, zoom);
+        workarea.scroll();
+      }
+      if (urldata.storagePrompt !== true && !editor.storagePromptClosed) {
+        $('#dialog_box').hide();
+      }
+    };
+
+    var updateToolButtonState = function () {
+      var index, button;
+      var bNoFill = (svgCanvas.getColor('fill') === 'none');
+      var bNoStroke = (svgCanvas.getColor('stroke') === 'none');
+      var buttonsNeedingStroke = ['#tool_fhpath', '#tool_line'];
+      var buttonsNeedingFillAndStroke = ['#tools_rect .tool_button', '#tools_ellipse .tool_button', '#tool_text', '#tool_path'];
+      if (bNoStroke) {
+        for (index in buttonsNeedingStroke) {
+          button = buttonsNeedingStroke[index];
+          if ($(button).hasClass('tool_button_current')) {
+            clickSelect();
+          }
+          $(button).addClass('disabled');
+        }
+      } else {
+        for (index in buttonsNeedingStroke) {
+          button = buttonsNeedingStroke[index];
+          $(button).removeClass('disabled');
+        }
+      }
+
+      if (bNoStroke && bNoFill) {
+        for (index in buttonsNeedingFillAndStroke) {
+          button = buttonsNeedingFillAndStroke[index];
+          if ($(button).hasClass('tool_button_current')) {
+            clickSelect();
+          }
+          $(button).addClass('disabled');
+        }
+      } else {
+        for (index in buttonsNeedingFillAndStroke) {
+          button = buttonsNeedingFillAndStroke[index];
+          $(button).removeClass('disabled');
+        }
+      }
+
+      svgCanvas.runExtensions('toolButtonStateUpdate', {
+        nofill: bNoFill,
+        nostroke: bNoStroke
+      });
+
+      // Disable flyouts if all inside are disabled
+      $('.tools_flyout').each(function () {
+        var shower = $('#' + this.id + '_show');
+        var hasEnabled = false;
+        $(this).children().each(function () {
+          if (!$(this).hasClass('disabled')) {
+            hasEnabled = true;
+          }
+        });
+        shower.toggleClass('disabled', !hasEnabled);
+      });
+
+      operaRepaint();
+    };
+
+    // Updates the toolbar (colors, opacity, etc) based on the selected element
+    // This function also updates the opacity and id elements that are in the context panel
+    var updateToolbar = function () {
+      var i, len;
+      if (selectedElement != null) {
+        switch (selectedElement.tagName) {
+        case 'use':
+        case 'image':
+        case 'foreignObject':
+          break;
+        case 'g':
+        case 'a':
+          // Look for common styles
+          var gWidth = null;
+          var childs = selectedElement.getElementsByTagName('*');
+          for (i = 0, len = childs.length; i < len; i++) {
+            var swidth = childs[i].getAttribute('stroke-width');
+
+            if (i === 0) {
+              gWidth = swidth;
+            } else if (gWidth !== swidth) {
+              gWidth = null;
+            }
+          }
+
+          $('#stroke_width').val(gWidth === null ? '' : gWidth);
+
+          paintBox.fill.update(true);
+          paintBox.stroke.update(true);
+
+          break;
+        default:
+          paintBox.fill.update(true);
+          paintBox.stroke.update(true);
+
+          $('#stroke_width').val(selectedElement.getAttribute('stroke-width') || 1);
+          $('#stroke_style').val(selectedElement.getAttribute('stroke-dasharray') || 'none');
+
+          var attr = selectedElement.getAttribute('stroke-linejoin') || 'miter';
+
+          if ($('#linejoin_' + attr).length !== 0) {
+            setStrokeOpt($('#linejoin_' + attr)[0]);
+          }
+
+          attr = selectedElement.getAttribute('stroke-linecap') || 'butt';
+
+          if ($('#linecap_' + attr).length !== 0) {
+            setStrokeOpt($('#linecap_' + attr)[0]);
+          }
+        }
+      }
+
+      // All elements including image and group have opacity
+      if (selectedElement != null) {
+        var opacPerc = (selectedElement.getAttribute('opacity') || 1.0) * 100;
+        $('#group_opacity').val(opacPerc);
+        $('#opac_slider').slider('option', 'value', opacPerc);
+        $('#elem_id').val(selectedElement.id);
+        $('#elem_class').val(selectedElement.getAttribute('class'));
+      }
+
+      updateToolButtonState();
+    };
+
+    // updates the context panel tools based on the selected element
+    var updateContextPanel = function () {
+      var elem = selectedElement;
+      // If element has just been deleted, consider it null
+      if (elem != null && !elem.parentNode) { elem = null; }
+      var currentLayerName = svgCanvas.getCurrentDrawing().getCurrentLayerName();
+      var currentMode = svgCanvas.getMode();
+      var unit = curConfig.baseUnit !== 'px' ? curConfig.baseUnit : null;
+
+      var isNode = currentMode === 'pathedit'; // elem ? (elem.id && elem.id.indexOf('pathpointgrip') == 0) : false;
+      var menuItems = $('#cmenu_canvas li');
+      $('#selected_panel, #multiselected_panel, #g_panel, #rect_panel, #circle_panel,' +
+        '#ellipse_panel, #line_panel, #text_panel, #image_panel, #container_panel,' +
+        ' #use_panel, #a_panel').hide();
+      if (elem != null) {
+        var elname = elem.nodeName;
+        // If this is a link with no transform and one child, pretend
+        // its child is selected
+        // if (elname === 'a') { // && !$(elem).attr('transform')) {
+        // 	elem = elem.firstChild;
+        // }
+
+        var angle = svgCanvas.getRotationAngle(elem);
+        $('#angle').val(angle);
+
+        var blurval = svgCanvas.getBlur(elem);
+        $('#blur').val(blurval);
+        $('#blur_slider').slider('option', 'value', blurval);
+
+        if (svgCanvas.addedNew) {
+          if (elname === 'image' && svgCanvas.getMode() === 'image') {
+            // Prompt for URL if not a data URL
+            if (svgCanvas.getHref(elem).indexOf('data:') !== 0) {
+              promptImgURL();
+            }
+          }
+          /* else if (elname == 'text') {
+            // TODO: Do something here for new text
+          } */
+        }
+
+        if (!isNode && currentMode !== 'pathedit') {
+          $('#selected_panel').show();
+          // Elements in this array already have coord fields
+          if (['line', 'circle', 'ellipse'].indexOf(elname) >= 0) {
+            $('#xy_panel').hide();
+          } else {
+            var x, y;
+
+            // Get BBox vals for g, polyline and path
+            if (['g', 'polyline', 'path'].indexOf(elname) >= 0) {
+              var bb = svgCanvas.getStrokedBBox([elem]);
+              if (bb) {
+                x = bb.x;
+                y = bb.y;
+              }
+            } else {
+              x = elem.getAttribute('x');
+              y = elem.getAttribute('y');
+            }
+
+            if (unit) {
+              x = svgedit.units.convertUnit(x);
+              y = svgedit.units.convertUnit(y);
+            }
+
+            $('#selected_x').val(x || 0);
+            $('#selected_y').val(y || 0);
+            $('#xy_panel').show();
+          }
+
+          // Elements in this array cannot be converted to a path
+          var noPath = ['image', 'text', 'path', 'g', 'use'].indexOf(elname) === -1;
+          $('#tool_topath').toggle(noPath);
+          $('#tool_reorient').toggle(elname === 'path');
+          $('#tool_reorient').toggleClass('disabled', angle === 0);
+        } else {
+          var point = path.getNodePoint();
+          $('#tool_add_subpath').removeClass('push_button_pressed').addClass('tool_button');
+          $('#tool_node_delete').toggleClass('disabled', !path.canDeleteNodes);
+
+          // Show open/close button based on selected point
+          setIcon('#tool_openclose_path', path.closed_subpath ? 'open_path' : 'close_path');
+
+          if (point) {
+            var segType = $('#seg_type');
+            if (unit) {
+              point.x = svgedit.units.convertUnit(point.x);
+              point.y = svgedit.units.convertUnit(point.y);
+            }
+            $('#path_node_x').val(point.x);
+            $('#path_node_y').val(point.y);
+            if (point.type) {
+              segType.val(point.type).removeAttr('disabled');
+            } else {
+              segType.val(4).attr('disabled', 'disabled');
+            }
+          }
+          return;
+        }
+
+        // update contextual tools here
+        var panels = {
+          g: [],
+          a: [],
+          rect: ['rx', 'width', 'height'],
+          image: ['width', 'height'],
+          circle: ['cx', 'cy', 'r'],
+          ellipse: ['cx', 'cy', 'rx', 'ry'],
+          line: ['x1', 'y1', 'x2', 'y2'],
+          text: [],
+          use: []
+        };
+
+        var tagName = elem.tagName;
+
+        // if ($(elem).data('gsvg')) {
+        // 	$('#g_panel').show();
+        // }
+
+        var linkHref = null;
+        if (tagName === 'a') {
+          linkHref = svgCanvas.getHref(elem);
+          $('#g_panel').show();
+        }
+
+        if (elem.parentNode.tagName === 'a') {
+          if (!$(elem).siblings().length) {
+            $('#a_panel').show();
+            linkHref = svgCanvas.getHref(elem.parentNode);
+          }
+        }
+
+        // Hide/show the make_link buttons
+        $('#tool_make_link, #tool_make_link').toggle(!linkHref);
+
+        if (linkHref) {
+          $('#link_url').val(linkHref);
+        }
+
+        if (panels[tagName]) {
+          var curPanel = panels[tagName];
+
+          $('#' + tagName + '_panel').show();
+
+          $.each(curPanel, function (i, item) {
+            var attrVal = elem.getAttribute(item);
+            if (curConfig.baseUnit !== 'px' && elem[item]) {
+              var bv = elem[item].baseVal.value;
+              attrVal = svgedit.units.convertUnit(bv);
+            }
+            $('#' + tagName + '_' + item).val(attrVal || 0);
+          });
+
+          if (tagName === 'text') {
+            $('#text_panel').css('display', 'inline');
+            $('#tool_font_size').css('display', 'inline');
+            if (svgCanvas.getItalic()) {
+              $('#tool_italic').addClass('push_button_pressed').removeClass('tool_button');
+            } else {
+              $('#tool_italic').removeClass('push_button_pressed').addClass('tool_button');
+            }
+            if (svgCanvas.getBold()) {
+              $('#tool_bold').addClass('push_button_pressed').removeClass('tool_button');
+            } else {
+              $('#tool_bold').removeClass('push_button_pressed').addClass('tool_button');
+            }
+            $('#font_family').val(elem.getAttribute('font-family'));
+            $('#font_size').val(elem.getAttribute('font-size'));
+            $('#text').val(elem.textContent);
+            if (svgCanvas.addedNew) {
+              // Timeout needed for IE9
+              setTimeout(function () {
+                $('#text').focus().select();
+              }, 100);
+            }
+          // text
+          } else if (tagName === 'image' && svgCanvas.getMode() === 'image') {
+            setImageURL(svgCanvas.getHref(elem));
+          // image
+          } else if (tagName === 'g' || tagName === 'use') {
+            $('#container_panel').show();
+            var title = svgCanvas.getTitle();
+            var label = $('#g_title')[0];
+            label.value = title;
+            setInputWidth(label);
+            $('#g_title').prop('disabled', tagName === 'use');
+          }
+        }
+        menuItems[(tagName === 'g' ? 'en' : 'dis') + 'ableContextMenuItems']('#ungroup');
+        menuItems[((tagName === 'g' || !multiselected) ? 'dis' : 'en') + 'ableContextMenuItems']('#group');
+      // if (elem != null)
+      } else if (multiselected) {
+        $('#multiselected_panel').show();
+        menuItems
+          .enableContextMenuItems('#group')
+          .disableContextMenuItems('#ungroup');
+      } else {
+        menuItems.disableContextMenuItems('#delete,#cut,#copy,#group,#ungroup,#move_front,#move_up,#move_down,#move_back');
+      }
+
+      // update history buttons
+      $('#tool_undo').toggleClass('disabled', undoMgr.getUndoStackSize() === 0);
+      $('#tool_redo').toggleClass('disabled', undoMgr.getRedoStackSize() === 0);
+
+      svgCanvas.addedNew = false;
+
+      if ((elem && !isNode) || multiselected) {
+        // update the selected elements' layer
+        $('#selLayerNames').removeAttr('disabled').val(currentLayerName);
+
+        // Enable regular menu options
+        canvMenu.enableContextMenuItems('#delete,#cut,#copy,#move_front,#move_up,#move_down,#move_back');
+      } else {
+        $('#selLayerNames').attr('disabled', 'disabled');
+      }
+    };
+
+    var updateWireFrame = function () {
+      // Test support
+      if (supportsNonSS) { return; }
+
+      var rule = '#workarea.wireframe #svgcontent * { stroke-width: ' + 1 / svgCanvas.getZoom() + 'px; }';
+      $('#wireframe_rules').text(workarea.hasClass('wireframe') ? rule : '');
+    };
+
+    var updateTitle = function (title) {
+      title = title || svgCanvas.getDocumentTitle();
+      var newTitle = origTitle + (title ? ': ' + title : '');
+
+      // Remove title update with current context info, isn't really necessary
+      // if (curContext) {
+      // 	new_title = new_title + curContext;
+      // }
+      $('title:first').text(newTitle);
+    };
+
+    // called when we've selected a different element
+    var selectedChanged = function (win, elems) {
+      var mode = svgCanvas.getMode();
+      if (mode === 'select') {
+        setSelectMode();
+      }
+      var isNode = mode === 'pathedit';
+      // if elems[1] is present, then we have more than one element
+      selectedElement = (elems.length === 1 || elems[1] == null ? elems[0] : null);
+      multiselected = (elems.length >= 2 && elems[1] != null);
+      if (selectedElement != null) {
+        // unless we're already in always set the mode of the editor to select because
+        // upon creation of a text element the editor is switched into
+        // select mode and this event fires - we need our UI to be in sync
+
+        if (!isNode) {
+          updateToolbar();
+        }
+      } // if (elem != null)
+
+      // Deal with pathedit mode
+      togglePathEditMode(isNode, elems);
+      updateContextPanel();
+      svgCanvas.runExtensions('selectedChanged', {
+        elems: elems,
+        selectedElement: selectedElement,
+        multiselected: multiselected
+      });
+    };
+
+    // Call when part of element is in process of changing, generally
+    // on mousemove actions like rotate, move, etc.
+    var elementTransition = function (win, elems) {
+      var mode = svgCanvas.getMode();
+      var elem = elems[0];
+
+      if (!elem) {
+        return;
+      }
+
+      multiselected = (elems.length >= 2 && elems[1] != null);
+      // Only updating fields for single elements for now
+      if (!multiselected) {
+        switch (mode) {
+        case 'rotate':
+          var ang = svgCanvas.getRotationAngle(elem);
+          $('#angle').val(ang);
+          $('#tool_reorient').toggleClass('disabled', ang === 0);
+          break;
+
+        // TODO: Update values that change on move/resize, etc
+        // case "select":
+        // case "resize":
+        // 	break;
+        }
+      }
+      svgCanvas.runExtensions('elementTransition', {
+        elems: elems
+      });
+    };
+
+    /**
+     * Test whether an element is a layer or not.
+     * @param {SVGGElement} elem - The SVGGElement to test.
+     * @returns {boolean} True if the element is a layer
+     */
+    function isLayer (elem) {
+      return elem && elem.tagName === 'g' && svgedit.draw.Layer.CLASS_REGEX.test(elem.getAttribute('class'));
+    }
+
+    // called when any element has changed
+    var elementChanged = function (win, elems) {
+      var i,
+        mode = svgCanvas.getMode();
+      if (mode === 'select') {
+        setSelectMode();
+      }
+
+      for (i = 0; i < elems.length; ++i) {
+        var elem = elems[i];
+
+        var isSvgElem = (elem && elem.tagName === 'svg');
+        if (isSvgElem || isLayer(elem)) {
+          populateLayers();
+          // if the element changed was the svg, then it could be a resolution change
+          if (isSvgElem) {
+            updateCanvas();
+          }
+        // Update selectedElement if element is no longer part of the image.
+        // This occurs for the text elements in Firefox
+        } else if (elem && selectedElement && selectedElement.parentNode == null) {
+          // || elem && elem.tagName == "path" && !multiselected) { // This was added in r1430, but not sure why
+          selectedElement = elem;
+        }
+      }
+
+      editor.showSaveWarning = true;
+
+      // we update the contextual panel with potentially new
+      // positional/sizing information (we DON'T want to update the
+      // toolbar here as that creates an infinite loop)
+      // also this updates the history buttons
+
+      // we tell it to skip focusing the text control if the
+      // text element was previously in focus
+      updateContextPanel();
+
+      // In the event a gradient was flipped:
+      if (selectedElement && mode === 'select') {
+        paintBox.fill.update();
+        paintBox.stroke.update();
+      }
+
+      svgCanvas.runExtensions('elementChanged', {
+        elems: elems
+      });
+    };
+
+    var zoomDone = function () {
+      updateWireFrame();
+      // updateCanvas(); // necessary?
+    };
+
+    var zoomChanged = svgCanvas.zoomChanged = function (win, bbox, autoCenter) {
+      var scrbar = 15,
+        // res = svgCanvas.getResolution(), // Currently unused
+        wArea = workarea;
+      // var canvas_pos = $('#svgcanvas').position(); // Currently unused
+      var zInfo = svgCanvas.setBBoxZoom(bbox, wArea.width() - scrbar, wArea.height() - scrbar);
+      if (!zInfo) { return; }
+      var zoomlevel = zInfo.zoom,
+        bb = zInfo.bbox;
+
+      if (zoomlevel < 0.001) {
+        changeZoom({value: 0.1});
+        return;
+      }
+
+      $('#zoom').val((zoomlevel * 100).toFixed(1));
+
+      if (autoCenter) {
+        updateCanvas();
+      } else {
+        updateCanvas(false, {x: bb.x * zoomlevel + (bb.width * zoomlevel) / 2, y: bb.y * zoomlevel + (bb.height * zoomlevel) / 2});
+      }
+
+      if (svgCanvas.getMode() === 'zoom' && bb.width) {
+        // Go to select if a zoom box was drawn
+        setSelectMode();
+      }
+
+      zoomDone();
+    };
+
+    changeZoom = function (ctl) {
+      var zoomlevel = ctl.value / 100;
+      if (zoomlevel < 0.001) {
+        ctl.value = 0.1;
+        return;
+      }
+      var zoom = svgCanvas.getZoom();
+      var wArea = workarea;
+
+      zoomChanged(window, {
+        width: 0,
+        height: 0,
+        // center pt of scroll position
+        x: (wArea[0].scrollLeft + wArea.width() / 2) / zoom,
+        y: (wArea[0].scrollTop + wArea.height() / 2) / zoom,
+        zoom: zoomlevel
+      }, true);
+    };
+
+    $('#cur_context_panel').delegate('a', 'click', function () {
+      var link = $(this);
+      if (link.attr('data-root')) {
+        svgCanvas.leaveContext();
+      } else {
+        svgCanvas.setContext(link.text());
+      }
+      svgCanvas.clearSelection();
+      return false;
+    });
+
+    var contextChanged = function (win, context) {
+      var linkStr = '';
+      if (context) {
+        var str = '';
+        linkStr = '<a href="#" data-root="y">' + svgCanvas.getCurrentDrawing().getCurrentLayerName() + '</a>';
+
+        $(context).parentsUntil('#svgcontent > g').andSelf().each(function () {
+          if (this.id) {
+            str += ' > ' + this.id;
+            if (this !== context) {
+              linkStr += ' > <a href="#">' + this.id + '</a>';
+            } else {
+              linkStr += ' > ' + this.id;
+            }
+          }
+        });
+
+        curContext = str;
+      } else {
+        curContext = null;
+      }
+      $('#cur_context_panel').toggle(!!context).html(linkStr);
+
+      updateTitle();
+    };
+
+    // Makes sure the current selected paint is available to work with
+    var prepPaints = function () {
+      paintBox.fill.prep();
+      paintBox.stroke.prep();
+    };
+
+    var flyoutFuncs = {};
+
+    var setFlyoutTitles = function () {
+      $('.tools_flyout').each(function () {
+        var shower = $('#' + this.id + '_show');
+        if (shower.data('isLibrary')) {
+          return;
+        }
+
+        var tooltips = [];
+        $(this).children().each(function () {
+          tooltips.push(this.title);
+        });
+        shower[0].title = tooltips.join(' / ');
+      });
+    };
+
+    var setFlyoutPositions = function () {
+      $('.tools_flyout').each(function () {
+        var shower = $('#' + this.id + '_show');
+        var pos = shower.offset();
+        var w = shower.outerWidth();
+        $(this).css({left: (pos.left + w) * editor.tool_scale, top: pos.top});
+      });
+    };
+
+    var setupFlyouts = function (holders) {
+      $.each(holders, function (holdSel, btnOpts) {
+        var buttons = $(holdSel).children();
+        var showSel = holdSel + '_show';
+        var shower = $(showSel);
+        var def = false;
+        buttons.addClass('tool_button')
+          .unbind('click mousedown mouseup') // may not be necessary
+          .each(function (i) {
+            // Get this buttons options
+            var opts = btnOpts[i];
+
+            // Remember the function that goes with this ID
+            flyoutFuncs[opts.sel] = opts.fn;
+
+            if (opts.isDefault) { def = i; }
+
+            // Clicking the icon in flyout should set this set's icon
+            var func = function (event) {
+              var options = opts;
+              // Find the currently selected tool if comes from keystroke
+              if (event.type === 'keydown') {
+                var flyoutIsSelected = $(options.parent + '_show').hasClass('tool_button_current');
+                var currentOperation = $(options.parent + '_show').attr('data-curopt');
+                $.each(holders[opts.parent], function (i, tool) {
+                  if (tool.sel === currentOperation) {
+                    if (!event.shiftKey || !flyoutIsSelected) {
+                      options = tool;
+                    } else {
+                      options = holders[opts.parent][i + 1] || holders[opts.parent][0];
+                    }
+                  }
+                });
+              }
+              if ($(this).hasClass('disabled')) { return false; }
+              if (toolButtonClick(showSel)) {
+                options.fn();
+              }
+              var icon;
+              if (options.icon) {
+                icon = $.getSvgIcon(options.icon, true);
+              } else {
+                icon = $(options.sel).children().eq(0).clone();
+              }
+
+              icon[0].setAttribute('width', shower.width());
+              icon[0].setAttribute('height', shower.height());
+              shower.children(':not(.flyout_arrow_horiz)').remove();
+              shower.append(icon).attr('data-curopt', options.sel); // This sets the current mode
+            };
+
+            $(this).mouseup(func);
+
+            if (opts.key) {
+              $(document).bind('keydown', opts.key[0] + ' shift+' + opts.key[0], func);
+            }
+          });
+
+        if (def) {
+          shower.attr('data-curopt', btnOpts[def].sel);
+        } else if (!shower.attr('data-curopt')) {
+          // Set first as default
+          shower.attr('data-curopt', btnOpts[0].sel);
+        }
+
+        var timer;
+        var pos = $(showSel).position();
+
+        // Clicking the "show" icon should set the current mode
+        shower.mousedown(function (evt) {
+          if (shower.hasClass('disabled')) {
+            return false;
+          }
+          var holder = $(holdSel);
+          var l = pos.left + 34;
+          var w = holder.width() * -1;
+          var time = holder.data('shown_popop') ? 200 : 0;
+          timer = setTimeout(function () {
+            // Show corresponding menu
+            if (!shower.data('isLibrary')) {
+              holder.css('left', w).show().animate({
+                left: l
+              }, 150);
+            } else {
+              holder.css('left', l).show();
+            }
+            holder.data('shown_popop', true);
+          }, time);
+          evt.preventDefault();
+        }).mouseup(function (evt) {
+          clearTimeout(timer);
+          var opt = $(this).attr('data-curopt');
+          // Is library and popped up, so do nothing
+          if (shower.data('isLibrary') && $(showSel.replace('_show', '')).is(':visible')) {
+            toolButtonClick(showSel, true);
+            return;
+          }
+          if (toolButtonClick(showSel) && flyoutFuncs[opt]) {
+            flyoutFuncs[opt]();
+          }
+        });
+        // $('#tools_rect').mouseleave(function () { $('#tools_rect').fadeOut(); });
+      });
+      setFlyoutTitles();
+      setFlyoutPositions();
+    };
+
+    var makeFlyoutHolder = function (id, child) {
+      var div = $('<div>', {
+        'class': 'tools_flyout',
+        id: id
+      }).appendTo('#svg_editor').append(child);
+
+      return div;
+    };
+
+    var uaPrefix = (function () {
+      var prop;
+      var regex = /^(Moz|Webkit|Khtml|O|ms|Icab)(?=[A-Z])/;
+      var someScript = document.getElementsByTagName('script')[0];
+      for (prop in someScript.style) {
+        if (regex.test(prop)) {
+          // test is faster than match, so it's better to perform
+          // that on the lot and match only when necessary
+          return prop.match(regex)[0];
+        }
+      }
+      // Nothing found so far?
+      if ('WebkitOpacity' in someScript.style) { return 'Webkit'; }
+      if ('KhtmlOpacity' in someScript.style) { return 'Khtml'; }
+
+      return '';
+    }());
+
+    var scaleElements = function (elems, scale) {
+      // var prefix = '-' + uaPrefix.toLowerCase() + '-'; // Currently unused
+      var sides = ['top', 'left', 'bottom', 'right'];
+
+      elems.each(function () {
+        // Handled in CSS
+        // this.style[uaPrefix + 'Transform'] = 'scale(' + scale + ')';
+        var i;
+        var el = $(this);
+        var w = el.outerWidth() * (scale - 1);
+        var h = el.outerHeight() * (scale - 1);
+        // var margins = {}; // Currently unused
+
+        for (i = 0; i < 4; i++) {
+          var s = sides[i];
+          var cur = el.data('orig_margin-' + s);
+          if (cur == null) {
+            cur = parseInt(el.css('margin-' + s), 10);
+            // Cache the original margin
+            el.data('orig_margin-' + s, cur);
+          }
+          var val = cur * scale;
+          if (s === 'right') {
+            val += w;
+          } else if (s === 'bottom') {
+            val += h;
+          }
+
+          el.css('margin-' + s, val);
+          // el.css('outline', '1px solid red');
+        }
+      });
+    };
+
+    var setIconSize = editor.setIconSize = function (size) {
+      // var elems = $('.tool_button, .push_button, .tool_button_current, .disabled, .icon_label, #url_notice, #tool_open');
+      var selToscale = '#tools_top .toolset, #editor_panel > *, #history_panel > *,' +
 '				#main_button, #tools_left > *, #path_node_panel > *, #multiselected_panel > *,' +
 '				#g_panel > *, #tool_font_size > *, .tools_flyout';
 
-			var elems = $(selToscale);
-			var scale = 1;
-
-			if (typeof size === 'number') {
-				scale = size;
-			} else {
-				var iconSizes = {s: 0.75, m: 1, l: 1.25, xl: 1.5};
-				scale = iconSizes[size];
-			}
-
-			editor.tool_scale = scale;
-
-			setFlyoutPositions();
-			// $('.tools_flyout').each(function () {
-			// 	var pos = $(this).position();
-			// 	console.log($(this), pos.left+(34 * scale));
-			// 	$(this).css({'left': pos.left+(34 * scale), 'top': pos.top+(77 * scale)});
-			// 	console.log('l', $(this).css('left'));
-			// });
-			//
-			// var scale = .75;
-
-			var hiddenPs = elems.parents(':hidden');
-			hiddenPs.css('visibility', 'hidden').show();
-			scaleElements(elems, scale);
-			hiddenPs.css('visibility', 'visible').hide();
-			// return;
-
-			$.pref('iconsize', size);
-			$('#iconsize').val(size);
-
-			// Change icon size
-			// $('.tool_button, .push_button, .tool_button_current, .disabled, .icon_label, #url_notice, #tool_open')
-			// .find('> svg, > img').each(function () {
-			// 	this.setAttribute('width',size_num);
-			// 	this.setAttribute('height',size_num);
-			// });
-			//
-			// $.resizeSvgIcons({
-			// 	'.flyout_arrow_horiz > svg, .flyout_arrow_horiz > img': size_num / 5,
-			// 	'#logo > svg, #logo > img': size_num * 1.3,
-			// 	'#tools_bottom .icon_label > *': (size_num === 16 ? 18 : size_num * .75)
-			// });
-			// if (size != 's') {
-			// 	$.resizeSvgIcons({'#layerbuttons svg, #layerbuttons img': size_num * .6});
-			// }
-
-			// Note that all rules will be prefixed with '#svg_editor' when parsed
-			var cssResizeRules = {
-				// '.tool_button,\
-				// .push_button,\
-				// .tool_button_current,\
-				// .push_button_pressed,\
-				// .disabled,\
-				// .icon_label,\
-				// .tools_flyout .tool_button': {
-				// 	'width': {s: '16px', l: '32px', xl: '48px'},
-				// 	'height': {s: '16px', l: '32px', xl: '48px'},
-				// 	'padding': {s: '1px', l: '2px', xl: '3px'}
-				// },
-				// '.tool_sep': {
-				// 	'height': {s: '16px', l: '32px', xl: '48px'},
-				// 	'margin': {s: '2px 2px', l: '2px 5px', xl: '2px 8px'}
-				// },
-				// '#main_icon': {
-				// 	'width': {s: '31px', l: '53px', xl: '75px'},
-				// 	'height': {s: '22px', l: '42px', xl: '64px'}
-				// },
-				'#tools_top': {
-					'left': 50 + $('#main_button').width(),
-					'height': 72
-				},
-				'#tools_left': {
-					'width': 31,
-					'top': 74
-				},
-				'div#workarea': {
-					'left': 38,
-					'top': 74
-				}
-				// '#tools_bottom': {
-				// 	'left': {s: '27px', l: '46px', xl: '65px'},
-				// 	'height': {s: '58px', l: '98px', xl: '145px'}
-				// },
-				// '#color_tools': {
-				// 	'border-spacing': {s: '0 1px'},
-				// 	'margin-top': {s: '-1px'}
-				// },
-				// '#color_tools .icon_label': {
-				// 	'width': {l:'43px', xl: '60px'}
-				// },
-				// '.color_tool': {
-				// 	'height': {s: '20px'}
-				// },
-				// '#tool_opacity': {
-				// 	'top': {s: '1px'},
-				// 	'height': {s: 'auto', l:'auto', xl:'auto'}
-				// },
-				// '#tools_top input, #tools_bottom input': {
-				// 	'margin-top': {s: '2px', l: '4px', xl: '5px'},
-				// 	'height': {s: 'auto', l: 'auto', xl: 'auto'},
-				// 	'border': {s: '1px solid #555', l: 'auto', xl: 'auto'},
-				// 	'font-size': {s: '.9em', l: '1.2em', xl: '1.4em'}
-				// },
-				// '#zoom_panel': {
-				// 	'margin-top': {s: '3px', l: '4px', xl: '5px'}
-				// },
-				// '#copyright, #tools_bottom .label': {
-				// 	'font-size': {l: '1.5em', xl: '2em'},
-				// 	'line-height': {s: '15px'}
-				// },
-				// '#tools_bottom_2': {
-				// 	'width': {l: '295px', xl: '355px'},
-				// 	'top': {s: '4px'}
-				// },
-				// '#tools_top > div, #tools_top': {
-				// 	'line-height': {s: '17px', l: '34px', xl: '50px'}
-				// },
-				// '.dropdown button': {
-				// 	'height': {s: '18px', l: '34px', xl: '40px'},
-				// 	'line-height': {s: '18px', l: '34px', xl: '40px'},
-				// 	'margin-top': {s: '3px'}
-				// },
-				// '#tools_top label, #tools_bottom label': {
-				// 	'font-size': {s: '1em', l: '1.5em', xl: '2em'},
-				// 	'height': {s: '25px', l: '42px', xl: '64px'}
-				// },
-				// 'div.toolset': {
-				// 	'height': {s: '25px', l: '42px', xl: '64px'}
-				// },
-				// '#tool_bold, #tool_italic': {
-				// 	'font-size': {s: '1.5em', l: '3em', xl: '4.5em'}
-				// },
-				// '#sidepanels': {
-				// 	'top': {s: '50px', l: '88px', xl: '125px'},
-				// 	'bottom': {s: '51px', l: '68px', xl: '65px'}
-				// },
-				// '#layerbuttons': {
-				// 	'width': {l: '130px', xl: '175px'},
-				// 	'height': {l: '24px', xl: '30px'}
-				// },
-				// '#layerlist': {
-				// 	'width': {l: '128px', xl: '150px'}
-				// },
-				// '.layer_button': {
-				// 	'width': {l: '19px', xl: '28px'},
-				// 	'height': {l: '19px', xl: '28px'}
-				// },
-				// 'input.spin-button': {
-				// 	'background-image': {l: 'url('images/spinbtn_updn_big.png')', xl: 'url('images/spinbtn_updn_big.png')'},
-				// 	'background-position': {l: '100% -5px', xl: '100% -2px'},
-				// 	'padding-right': {l: '24px', xl: '24px' }
-				// },
-				// 'input.spin-button.up': {
-				// 	'background-position': {l: '100% -45px', xl: '100% -42px'}
-				// },
-				// 'input.spin-button.down': {
-				// 	'background-position': {l: '100% -85px', xl: '100% -82px'}
-				// },
-				// '#position_opts': {
-				// 	'width': {all: (size_num*4) +'px'}
-				// }
-			};
-
-			var ruleElem = $('#tool_size_rules');
-			if (!ruleElem.length) {
-				ruleElem = $('<style id="tool_size_rules"></style>').appendTo('head');
-			} else {
-				ruleElem.empty();
-			}
-
-			if (size !== 'm') {
-				var styleStr = '';
-				$.each(cssResizeRules, function (selector, rules) {
-					selector = '#svg_editor ' + selector.replace(/,/g, ', #svg_editor');
-					styleStr += selector + '{';
-					$.each(rules, function (prop, values) {
-						var val;
-						if (typeof values === 'number') {
-							val = (values * scale) + 'px';
-						} else if (values[size] || values.all) {
-							val = (values[size] || values.all);
-						}
-						styleStr += (prop + ':' + val + ';');
-					});
-					styleStr += '}';
-				});
-				// this.style[uaPrefix + 'Transform'] = 'scale(' + scale + ')';
-				var prefix = '-' + uaPrefix.toLowerCase() + '-';
-				styleStr += (selToscale + '{' + prefix + 'transform: scale(' + scale + ');}' +
-					' #svg_editor div.toolset .toolset {' + prefix + 'transform: scale(1); margin: 1px !important;}' + // Hack for markers
-					' #svg_editor .ui-slider {' + prefix + 'transform: scale(' + (1 / scale) + ');}' // Hack for sliders
-				);
-				ruleElem.text(styleStr);
-			}
-
-			setFlyoutPositions();
-		};
-
-		// TODO: Combine this with addDropDown or find other way to optimize
-		var addAltDropDown = function (elem, list, callback, opts) {
-			var button = $(elem);
-			list = $(list);
-			var onButton = false;
-			var dropUp = opts.dropUp;
-			if (dropUp) {
-				$(elem).addClass('dropup');
-			}
-			list.find('li').bind('mouseup', function () {
-				if (opts.seticon) {
-					setIcon('#cur_' + button[0].id, $(this).children());
-					$(this).addClass('current').siblings().removeClass('current');
-				}
-				callback.apply(this, arguments);
-			});
-
-			$(window).mouseup(function (evt) {
-				if (!onButton) {
-					button.removeClass('down');
-					list.hide();
-					list.css({top: 0, left: 0});
-				}
-				onButton = false;
-			});
-
-			// var height = list.height(); // Currently unused
-			button.bind('mousedown', function () {
-				var off = button.offset();
-				if (dropUp) {
-					off.top -= list.height();
-					off.left += 8;
-				} else {
-					off.top += button.height();
-				}
-				list.offset(off);
-
-				if (!button.hasClass('down')) {
-					list.show();
-					onButton = true;
-				} else {
-					// CSS position must be reset for Webkit
-					list.hide();
-					list.css({top: 0, left: 0});
-				}
-				button.toggleClass('down');
-			}).hover(function () {
-				onButton = true;
-			}).mouseout(function () {
-				onButton = false;
-			});
-
-			if (opts.multiclick) {
-				list.mousedown(function () {
-					onButton = true;
-				});
-			}
-		};
-
-		var extsPreLang = [];
-		var extAdded = function (win, ext) {
-			if (!ext) {
-				return;
-			}
-			var cbCalled = false;
-			var resizeDone = false;
-			var cbReady = true; // Set to false to delay callback (e.g. wait for $.svgIcons)
-
-			if (ext.langReady) {
-				if (editor.langChanged) { // We check for this since the "lang" pref could have been set by storage
-					var lang = $.pref('lang');
-					ext.langReady({lang: lang, uiStrings: uiStrings});
-				} else {
-					extsPreLang.push(ext);
-				}
-			}
-
-			function prepResize () {
-				if (resizeTimer) {
-					clearTimeout(resizeTimer);
-					resizeTimer = null;
-				}
-				if (!resizeDone) {
-					resizeTimer = setTimeout(function () {
-						resizeDone = true;
-						setIconSize($.pref('iconsize'));
-					}, 50);
-				}
-			}
-
-			var runCallback = function () {
-				if (ext.callback && !cbCalled && cbReady) {
-					cbCalled = true;
-					ext.callback();
-				}
-			};
-
-			var btnSelects = [];
-
-			if (ext.context_tools) {
-				$.each(ext.context_tools, function (i, tool) {
-					// Add select tool
-					var html;
-					var contId = tool.container_id ? (' id="' + tool.container_id + '"') : '';
-					var panel = $('#' + tool.panel);
-
-					// create the panel if it doesn't exist
-					if (!panel.length) {
-						panel = $('<div>', {id: tool.panel}).appendTo('#tools_top');
-					}
-
-					// TODO: Allow support for other types, or adding to existing tool
-					switch (tool.type) {
-					case 'tool_button':
-						html = '<div class="tool_button">' + tool.id + '</div>';
-						var div = $(html).appendTo(panel);
-						if (tool.events) {
-							$.each(tool.events, function (evt, func) {
-								$(div).bind(evt, func);
-							});
-						}
-						break;
-					case 'select':
-						html = '<label' + contId + '>' +
-							'<select id="' + tool.id + '">';
-						$.each(tool.options, function (val, text) {
-							var sel = (val === tool.defval) ? ' selected' : '';
-							html += '<option value="' + val + '"' + sel + '>' + text + '</option>';
-						});
-						html += '</select></label>';
-						// Creates the tool, hides & adds it, returns the select element
-						var sel = $(html).appendTo(panel).find('select');
-
-						$.each(tool.events, function (evt, func) {
-							$(sel).bind(evt, func);
-						});
-						break;
-					case 'button-select':
-						html = '<div id="' + tool.id + '" class="dropdown toolset" title="' + tool.title + '">' +
-							'<div id="cur_' + tool.id + '" class="icon_label"></div><button></button></div>';
-
-						var list = $('<ul id="' + tool.id + '_opts"></ul>').appendTo('#option_lists');
-
-						if (tool.colnum) {
-							list.addClass('optcols' + tool.colnum);
-						}
-
-						// Creates the tool, hides & adds it, returns the select element
-						/* var dropdown = */ $(html).appendTo(panel).children();
-
-						btnSelects.push({
-							elem: ('#' + tool.id),
-							list: ('#' + tool.id + '_opts'),
-							title: tool.title,
-							callback: tool.events.change,
-							cur: ('#cur_' + tool.id)
-						});
-
-						break;
-					case 'input':
-						html = '<label' + contId + '>' +
-							'<span id="' + tool.id + '_label">' +
-							tool.label + ':</span>' +
-							'<input id="' + tool.id + '" title="' + tool.title +
-							'" size="' + (tool.size || '4') + '" value="' + (tool.defval || '') + '" type="text"/></label>';
-
-						// Creates the tool, hides & adds it, returns the select element
-
-						// Add to given tool.panel
-						var inp = $(html).appendTo(panel).find('input');
-
-						if (tool.spindata) {
-							inp.SpinButton(tool.spindata);
-						}
-
-						if (tool.events) {
-							$.each(tool.events, function (evt, func) {
-								inp.bind(evt, func);
-							});
-						}
-						break;
-
-					default:
-						break;
-					}
-				});
-			}
-
-			if (ext.buttons) {
-				var fallbackObj = {},
-					placementObj = {},
-					svgicons = ext.svgicons,
-					holders = {};
-
-				// Add buttons given by extension
-				$.each(ext.buttons, function (i, btn) {
-					var icon, svgicon, tlsId;
-					var id = btn.id;
-					var num = i;
-
-					// Give button a unique ID
-					while ($('#' + id).length) {
-						id = btn.id + '_' + (++num);
-					}
-
-					if (!svgicons) {
-						icon = $('<img src="' + btn.icon + '">');
-					} else {
-						fallbackObj[id] = btn.icon;
-						svgicon = btn.svgicon || btn.id;
-						if (btn.type === 'app_menu') {
-							placementObj['#' + id + ' > div'] = svgicon;
-						} else {
-							placementObj['#' + id] = svgicon;
-						}
-					}
-
-					var cls, parent;
-
-					// Set button up according to its type
-					switch (btn.type) {
-					case 'mode_flyout':
-					case 'mode':
-						cls = 'tool_button';
-						parent = '#tools_left';
-						break;
-					case 'context':
-						cls = 'tool_button';
-						parent = '#' + btn.panel;
-						// create the panel if it doesn't exist
-						if (!$(parent).length) {
-							$('<div>', {id: btn.panel}).appendTo('#tools_top');
-						}
-						break;
-					case 'app_menu':
-						cls = '';
-						parent = '#main_menu ul';
-						break;
-					}
-					var flyoutHolder, curH, showBtn, refData, refBtn;
-					var button = $((btn.list || btn.type === 'app_menu') ? '<li/>' : '<div/>')
-						.attr('id', id)
-						.attr('title', btn.title)
-						.addClass(cls);
-					if (!btn.includeWith && !btn.list) {
-						if ('position' in btn) {
-							if ($(parent).children().eq(btn.position).length) {
-								$(parent).children().eq(btn.position).before(button);
-							} else {
-								$(parent).children().last().before(button);
-							}
-						} else {
-							button.appendTo(parent);
-						}
-
-						if (btn.type === 'mode_flyout') {
-						// Add to flyout menu / make flyout menu
-							// var opts = btn.includeWith;
-							// // opts.button, default, position
-							refBtn = $(button);
-
-							flyoutHolder = refBtn.parent();
-							// Create a flyout menu if there isn't one already
-							if (!refBtn.parent().hasClass('tools_flyout')) {
-								// Create flyout placeholder
-								tlsId = refBtn[0].id.replace('tool_', 'tools_');
-								showBtn = refBtn.clone()
-									.attr('id', tlsId + '_show')
-									.append($('<div>', {'class': 'flyout_arrow_horiz'}));
-
-								refBtn.before(showBtn);
-
-								// Create a flyout div
-								flyoutHolder = makeFlyoutHolder(tlsId, refBtn);
-								flyoutHolder.data('isLibrary', true);
-								showBtn.data('isLibrary', true);
-							}
-							// refData = Actions.getButtonData(opts.button);
-
-							placementObj['#' + tlsId + '_show'] = btn.id;
-							// TODO: Find way to set the current icon using the iconloader if this is not default
-
-							// Include data for extension button as well as ref button
-							curH = holders['#' + flyoutHolder[0].id] = [{
-								sel: '#' + id,
-								fn: btn.events.click,
-								icon: btn.id,
-								// key: btn.key,
-								isDefault: true
-							}, refData];
-							//
-							// // {sel:'#tool_rect', fn: clickRect, evt: 'mouseup', key: 4, parent: '#tools_rect', icon: 'rect'}
-							//
-							// var pos = ('position' in opts)?opts.position:'last';
-							// var len = flyoutHolder.children().length;
-							//
-							// // Add at given position or end
-							// if (!isNaN(pos) && pos >= 0 && pos < len) {
-							// 	flyoutHolder.children().eq(pos).before(button);
-							// } else {
-							// 	flyoutHolder.append(button);
-							// 	curH.reverse();
-							// }
-						} else if (btn.type === 'app_menu') {
-							button.append('<div>').append(btn.title);
-						}
-					} else if (btn.list) {
-						// Add button to list
-						button.addClass('push_button');
-						$('#' + btn.list + '_opts').append(button);
-						if (btn.isDefault) {
-							$('#cur_' + btn.list).append(button.children().clone());
-							svgicon = btn.svgicon || btn.id;
-							placementObj['#cur_' + btn.list] = svgicon;
-						}
-					} else if (btn.includeWith) {
-						// Add to flyout menu / make flyout menu
-						var opts = btn.includeWith;
-						// opts.button, default, position
-						refBtn = $(opts.button);
-
-						flyoutHolder = refBtn.parent();
-						// Create a flyout menu if there isn't one already
-						if (!refBtn.parent().hasClass('tools_flyout')) {
-							// Create flyout placeholder
-							tlsId = refBtn[0].id.replace('tool_', 'tools_');
-							showBtn = refBtn.clone()
-								.attr('id', tlsId + '_show')
-								.append($('<div>', {'class': 'flyout_arrow_horiz'}));
-
-							refBtn.before(showBtn);
-
-							// Create a flyout div
-							flyoutHolder = makeFlyoutHolder(tlsId, refBtn);
-						}
-
-						refData = Actions.getButtonData(opts.button);
-
-						if (opts.isDefault) {
-							placementObj['#' + tlsId + '_show'] = btn.id;
-						}
-						// TODO: Find way to set the current icon using the iconloader if this is not default
-
-						// Include data for extension button as well as ref button
-						curH = holders['#' + flyoutHolder[0].id] = [{
-							sel: '#' + id,
-							fn: btn.events.click,
-							icon: btn.id,
-							key: btn.key,
-							isDefault: btn.includeWith ? btn.includeWith.isDefault : 0
-						}, refData];
-
-						// {sel:'#tool_rect', fn: clickRect, evt: 'mouseup', key: 4, parent: '#tools_rect', icon: 'rect'}
-
-						var pos = ('position' in opts) ? opts.position : 'last';
-						var len = flyoutHolder.children().length;
-
-						// Add at given position or end
-						if (!isNaN(pos) && pos >= 0 && pos < len) {
-							flyoutHolder.children().eq(pos).before(button);
-						} else {
-							flyoutHolder.append(button);
-							curH.reverse();
-						}
-					}
-
-					if (!svgicons) {
-						button.append(icon);
-					}
-
-					if (!btn.list) {
-						// Add given events to button
-						$.each(btn.events, function (name, func) {
-							if (name === 'click' && btn.type === 'mode') {
-								if (btn.includeWith) {
-									button.bind(name, func);
-								} else {
-									button.bind(name, function () {
-										if (toolButtonClick(button)) {
-											func();
-										}
-									});
-								}
-								if (btn.key) {
-									$(document).bind('keydown', btn.key, func);
-									if (btn.title) {
-										button.attr('title', btn.title + ' [' + btn.key + ']');
-									}
-								}
-							} else {
-								button.bind(name, func);
-							}
-						});
-					}
-
-					setupFlyouts(holders);
-				});
-
-				$.each(btnSelects, function () {
-					addAltDropDown(this.elem, this.list, this.callback, {seticon: true});
-				});
-
-				if (svgicons) {
-					cbReady = false; // Delay callback
-				}
-
-				$.svgIcons(svgicons, {
-					w: 24, h: 24,
-					id_match: false,
-					no_img: (!svgedit.browser.isWebkit()),
-					fallback: fallbackObj,
-					placement: placementObj,
-					callback: function (icons) {
-						// Non-ideal hack to make the icon match the current size
-						// if (curPrefs.iconsize && curPrefs.iconsize !== 'm') {
-						if ($.pref('iconsize') !== 'm') {
-							prepResize();
-						}
-						cbReady = true; // Ready for callback
-						runCallback();
-					}
-				});
-			}
-
-			runCallback();
-		};
-
-		var getPaint = function (color, opac, type) {
-			// update the editor's fill paint
-			var opts = { alpha: opac };
-			if (color.indexOf('url(#') === 0) {
-				var refElem = svgCanvas.getRefElem(color);
-				if (refElem) {
-					refElem = refElem.cloneNode(true);
-				} else {
-					refElem = $('#' + type + '_color defs *')[0];
-				}
-				opts[refElem.tagName] = refElem;
-			} else if (color.indexOf('#') === 0) {
-				opts.solidColor = color.substr(1);
-			} else {
-				opts.solidColor = 'none';
-			}
-			return new $.jGraduate.Paint(opts);
-		};
-
-		// $('#text').focus(function () { textBeingEntered = true; });
-		// $('#text').blur(function () { textBeingEntered = false; });
-
-		// bind the selected event to our function that handles updates to the UI
-		svgCanvas.bind('selected', selectedChanged);
-		svgCanvas.bind('transition', elementTransition);
-		svgCanvas.bind('changed', elementChanged);
-		svgCanvas.bind('saved', saveHandler);
-		svgCanvas.bind('exported', exportHandler);
-		svgCanvas.bind('exportedPDF', function (win, data) {
-			var exportWindowName = data.exportWindowName;
-			if (exportWindowName) {
-				exportWindow = window.open('', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
-			}
-			exportWindow.location.href = data.dataurlstring;
-		});
-		svgCanvas.bind('zoomed', zoomChanged);
-		svgCanvas.bind('contextset', contextChanged);
-		svgCanvas.bind('extension_added', extAdded);
-		svgCanvas.textActions.setInputElem($('#text')[0]);
-
-		var str = '<div class="palette_item" data-rgb="none"></div>';
-		$.each(palette, function (i, item) {
-			str += '<div class="palette_item" style="background-color: ' + item + ';" data-rgb="' + item + '"></div>';
-		});
-		$('#palette').append(str);
-
-		// Set up editor background functionality
-		// TODO add checkerboard as "pattern"
-		var colorBlocks = ['#FFF', '#888', '#000']; // ,'url(data:image/gif;base64,R0lGODlhEAAQAIAAAP%2F%2F%2F9bW1iH5BAAAAAAALAAAAAAQABAAAAIfjG%2Bgq4jM3IFLJgpswNly%2FXkcBpIiVaInlLJr9FZWAQA7)'];
-		str = '';
-		$.each(colorBlocks, function () {
-			str += '<div class="color_block" style="background-color:' + this + ';"></div>';
-		});
-		$('#bg_blocks').append(str);
-		var blocks = $('#bg_blocks div');
-		var curBg = 'cur_background';
-		blocks.each(function () {
-			var blk = $(this);
-			blk.click(function () {
-				blocks.removeClass(curBg);
-				$(this).addClass(curBg);
-			});
-		});
-
-		setBackground($.pref('bkgd_color'), $.pref('bkgd_url'));
-
-		$('#image_save_opts input').val([$.pref('img_save')]);
-
-		var changeRectRadius = function (ctl) {
-			svgCanvas.setRectRadius(ctl.value);
-		};
-
-		var changeFontSize = function (ctl) {
-			svgCanvas.setFontSize(ctl.value);
-		};
-
-		var changeStrokeWidth = function (ctl) {
-			var val = ctl.value;
-			if (val === 0 && selectedElement && ['line', 'polyline'].indexOf(selectedElement.nodeName) >= 0) {
-				val = ctl.value = 1;
-			}
-			svgCanvas.setStrokeWidth(val);
-		};
-
-		var changeRotationAngle = function (ctl) {
-			svgCanvas.setRotationAngle(ctl.value);
-			$('#tool_reorient').toggleClass('disabled', parseInt(ctl.value, 10) === 0);
-		};
-
-		var changeOpacity = function (ctl, val) {
-			if (val == null) { val = ctl.value; }
-			$('#group_opacity').val(val);
-			if (!ctl || !ctl.handle) {
-				$('#opac_slider').slider('option', 'value', val);
-			}
-			svgCanvas.setOpacity(val / 100);
-		};
-
-		var changeBlur = function (ctl, val, noUndo) {
-			if (val == null) { val = ctl.value; }
-			$('#blur').val(val);
-			var complete = false;
-			if (!ctl || !ctl.handle) {
-				$('#blur_slider').slider('option', 'value', val);
-				complete = true;
-			}
-			if (noUndo) {
-				svgCanvas.setBlurNoUndo(val);
-			} else {
-				svgCanvas.setBlur(val, complete);
-			}
-		};
-
-		$('#stroke_style').change(function () {
-			svgCanvas.setStrokeAttr('stroke-dasharray', $(this).val());
-			operaRepaint();
-		});
-
-		$('#stroke_linejoin').change(function () {
-			svgCanvas.setStrokeAttr('stroke-linejoin', $(this).val());
-			operaRepaint();
-		});
-
-		// Lose focus for select elements when changed (Allows keyboard shortcuts to work better)
-		$('select').change(function () { $(this).blur(); });
-
-		// fired when user wants to move elements to another layer
-		var promptMoveLayerOnce = false;
-		$('#selLayerNames').change(function () {
-			var destLayer = this.options[this.selectedIndex].value;
-			var confirmStr = uiStrings.notification.QmoveElemsToLayer.replace('%s', destLayer);
-			var moveToLayer = function (ok) {
-				if (!ok) { return; }
-				promptMoveLayerOnce = true;
-				svgCanvas.moveSelectedToLayer(destLayer);
-				svgCanvas.clearSelection();
-				populateLayers();
-			};
-			if (destLayer) {
-				if (promptMoveLayerOnce) {
-					moveToLayer(true);
-				} else {
-					$.confirm(confirmStr, moveToLayer);
-				}
-			}
-		});
-
-		$('#font_family').change(function () {
-			svgCanvas.setFontFamily(this.value);
-		});
-
-		$('#seg_type').change(function () {
-			svgCanvas.setSegType($(this).val());
-		});
-
-		$('#text').bind('keyup input', function () {
-			svgCanvas.setTextContent(this.value);
-		});
-
-		$('#image_url').change(function () {
-			setImageURL(this.value);
-		});
-
-		$('#link_url').change(function () {
-			if (this.value.length) {
-				svgCanvas.setLinkURL(this.value);
-			} else {
-				svgCanvas.removeHyperlink();
-			}
-		});
-
-		$('#g_title').change(function () {
-			svgCanvas.setGroupTitle(this.value);
-		});
-
-		$('.attr_changer').change(function () {
-			var attr = this.getAttribute('data-attr');
-			var val = this.value;
-			var valid = svgedit.units.isValidUnit(attr, val, selectedElement);
-
-			if (!valid) {
-				$.alert(uiStrings.notification.invalidAttrValGiven);
-				this.value = selectedElement.getAttribute(attr);
-				return false;
-			}
-
-			if (attr !== 'id' && attr !== 'class') {
-				if (isNaN(val)) {
-					val = svgCanvas.convertToNum(attr, val);
-				} else if (curConfig.baseUnit !== 'px') {
-					// Convert unitless value to one with given unit
-
-					var unitData = svgedit.units.getTypeMap();
-
-					if (selectedElement[attr] || svgCanvas.getMode() === 'pathedit' || attr === 'x' || attr === 'y') {
-						val *= unitData[curConfig.baseUnit];
-					}
-				}
-			}
-
-			// if the user is changing the id, then de-select the element first
-			// change the ID, then re-select it with the new ID
-			if (attr === 'id') {
-				var elem = selectedElement;
-				svgCanvas.clearSelection();
-				elem.id = val;
-				svgCanvas.addToSelection([elem], true);
-			} else {
-				svgCanvas.changeSelectedAttribute(attr, val);
-			}
-			this.blur();
-		});
-
-		// Prevent selection of elements when shift-clicking
-		$('#palette').mouseover(function () {
-			var inp = $('<input type="hidden">');
-			$(this).append(inp);
-			inp.focus().remove();
-		});
-
-		$('.palette_item').mousedown(function (evt) {
-			// shift key or right click for stroke
-			var picker = evt.shiftKey || evt.button === 2 ? 'stroke' : 'fill';
-			var color = $(this).data('rgb');
-			var paint;
-
-			// Webkit-based browsers returned 'initial' here for no stroke
-			if (color === 'none' || color === 'transparent' || color === 'initial') {
-				color = 'none';
-				paint = new $.jGraduate.Paint();
-			} else {
-				paint = new $.jGraduate.Paint({alpha: 100, solidColor: color.substr(1)});
-			}
-
-			paintBox[picker].setPaint(paint);
-			svgCanvas.setColor(picker, color);
-
-			if (color !== 'none' && svgCanvas.getPaintOpacity(picker) !== 1) {
-				svgCanvas.setPaintOpacity(picker, 1.0);
-			}
-			updateToolButtonState();
-		}).bind('contextmenu', function (e) { e.preventDefault(); });
-
-		$('#toggle_stroke_tools').on('click', function () {
-			$('#tools_bottom').toggleClass('expanded');
-		});
-
-		(function () {
-			var lastX = null, lastY = null, wArea = workarea[0],
-				panning = false, keypan = false;
-
-			$('#svgcanvas').bind('mousemove mouseup', function (evt) {
-				if (panning === false) { return; }
-
-				wArea.scrollLeft -= (evt.clientX - lastX);
-				wArea.scrollTop -= (evt.clientY - lastY);
-
-				lastX = evt.clientX;
-				lastY = evt.clientY;
-
-				if (evt.type === 'mouseup') { panning = false; }
-				return false;
-			}).mousedown(function (evt) {
-				if (evt.button === 1 || keypan === true) {
-					panning = true;
-					lastX = evt.clientX;
-					lastY = evt.clientY;
-					return false;
-				}
-			});
-
-			$(window).mouseup(function () {
-				panning = false;
-			});
-
-			$(document).bind('keydown', 'space', function (evt) {
-				svgCanvas.spaceKey = keypan = true;
-				evt.preventDefault();
-			}).bind('keyup', 'space', function (evt) {
-				evt.preventDefault();
-				svgCanvas.spaceKey = keypan = false;
-			}).bind('keydown', 'shift', function (evt) {
-				if (svgCanvas.getMode() === 'zoom') {
-					workarea.css('cursor', zoomOutIcon);
-				}
-			}).bind('keyup', 'shift', function (evt) {
-				if (svgCanvas.getMode() === 'zoom') {
-					workarea.css('cursor', zoomInIcon);
-				}
-			});
-
-			editor.setPanning = function (active) {
-				svgCanvas.spaceKey = keypan = active;
-			};
-		}());
-
-		(function () {
-			var button = $('#main_icon');
-			var overlay = $('#main_icon span');
-			var list = $('#main_menu');
-			var onButton = false;
-			var height = 0;
-			var jsHover = true;
-			var setClick = false;
-
-			/*
-			// Currently unused
-			var hideMenu = function () {
-				list.fadeOut(200);
-			};
-			*/
-
-			$(window).mouseup(function (evt) {
-				if (!onButton) {
-					button.removeClass('buttondown');
-					// do not hide if it was the file input as that input needs to be visible
-					// for its change event to fire
-					if (evt.target.tagName !== 'INPUT') {
-						list.fadeOut(200);
-					} else if (!setClick) {
-						setClick = true;
-						$(evt.target).click(function () {
-							list.css('margin-left', '-9999px').show();
-						});
-					}
-				}
-				onButton = false;
-			}).mousedown(function (evt) {
-				// $('.contextMenu').hide();
-				var islib = $(evt.target).closest('div.tools_flyout, .contextMenu').length;
-				if (!islib) {
-					$('.tools_flyout:visible,.contextMenu').fadeOut(250);
-				}
-			});
-
-			overlay.bind('mousedown', function () {
-				if (!button.hasClass('buttondown')) {
-					// Margin must be reset in case it was changed before;
-					list.css('margin-left', 0).show();
-					if (!height) {
-						height = list.height();
-					}
-					// Using custom animation as slideDown has annoying 'bounce effect'
-					list.css('height', 0).animate({
-						'height': height
-					}, 200);
-					onButton = true;
-				} else {
-					list.fadeOut(200);
-				}
-				button.toggleClass('buttondown buttonup');
-			}).hover(function () {
-				onButton = true;
-			}).mouseout(function () {
-				onButton = false;
-			});
-
-			var listItems = $('#main_menu li');
-
-			// Check if JS method of hovering needs to be used (Webkit bug)
-			listItems.mouseover(function () {
-				jsHover = ($(this).css('background-color') === 'rgba(0, 0, 0, 0)');
-
-				listItems.unbind('mouseover');
-				if (jsHover) {
-					listItems.mouseover(function () {
-						this.style.backgroundColor = '#FFC';
-					}).mouseout(function () {
-						this.style.backgroundColor = 'transparent';
-						return true;
-					});
-				}
-			});
-		}());
-		// Made public for UI customization.
-		// TODO: Group UI functions into a public editor.ui interface.
-		editor.addDropDown = function (elem, callback, dropUp) {
-			if ($(elem).length === 0) { return; } // Quit if called on non-existant element
-			var button = $(elem).find('button');
-			var list = $(elem).find('ul').attr('id', $(elem)[0].id + '-list');
-			var onButton = false;
-			if (dropUp) {
-				$(elem).addClass('dropup');
-			} else {
-				// Move list to place where it can overflow container
-				$('#option_lists').append(list);
-			}
-			list.find('li').bind('mouseup', callback);
-
-			$(window).mouseup(function (evt) {
-				if (!onButton) {
-					button.removeClass('down');
-					list.hide();
-				}
-				onButton = false;
-			});
-
-			button.bind('mousedown', function () {
-				if (!button.hasClass('down')) {
-					if (!dropUp) {
-						var pos = $(elem).position();
-						list.css({
-							top: pos.top + 24,
-							left: pos.left - 10
-						});
-					}
-					list.show();
-					onButton = true;
-				} else {
-					list.hide();
-				}
-				button.toggleClass('down');
-			}).hover(function () {
-				onButton = true;
-			}).mouseout(function () {
-				onButton = false;
-			});
-		};
-
-		editor.addDropDown('#font_family_dropdown', function () {
-			$('#font_family').val($(this).text()).change();
-		});
-
-		editor.addDropDown('#opacity_dropdown', function () {
-			if ($(this).find('div').length) { return; }
-			var perc = parseInt($(this).text().split('%')[0], 10);
-			changeOpacity(false, perc);
-		}, true);
-
-		// For slider usage, see: http://jqueryui.com/demos/slider/
-		$('#opac_slider').slider({
-			start: function () {
-				$('#opacity_dropdown li:not(.special)').hide();
-			},
-			stop: function () {
-				$('#opacity_dropdown li').show();
-				$(window).mouseup();
-			},
-			slide: function (evt, ui) {
-				changeOpacity(ui);
-			}
-		});
-
-		editor.addDropDown('#blur_dropdown', $.noop);
-
-		var slideStart = false;
-
-		$('#blur_slider').slider({
-			max: 10,
-			step: 0.1,
-			stop: function (evt, ui) {
-				slideStart = false;
-				changeBlur(ui);
-				$('#blur_dropdown li').show();
-				$(window).mouseup();
-			},
-			start: function () {
-				slideStart = true;
-			},
-			slide: function (evt, ui) {
-				changeBlur(ui, null, slideStart);
-			}
-		});
-
-		editor.addDropDown('#zoom_dropdown', function () {
-			var item = $(this);
-			var val = item.data('val');
-			if (val) {
-				zoomChanged(window, val);
-			} else {
-				changeZoom({value: parseFloat(item.text())});
-			}
-		}, true);
-
-		addAltDropDown('#stroke_linecap', '#linecap_opts', function () {
-			setStrokeOpt(this, true);
-		}, {dropUp: true});
-
-		addAltDropDown('#stroke_linejoin', '#linejoin_opts', function () {
-			setStrokeOpt(this, true);
-		}, {dropUp: true});
-
-		addAltDropDown('#tool_position', '#position_opts', function () {
-			var letter = this.id.replace('tool_pos', '').charAt(0);
-			svgCanvas.alignSelectedElements(letter, 'page');
-		}, {multiclick: true});
-
-		/*
-
-		When a flyout icon is selected
-			(if flyout) {
-			- Change the icon
-			- Make pressing the button run its stuff
-			}
-			- Run its stuff
-
-		When its shortcut key is pressed
-			- If not current in list, do as above
-			, else:
-			- Just run its stuff
-
-		*/
-
-		// Unfocus text input when workarea is mousedowned.
-		(function () {
-			var inp;
-			var unfocus = function () {
-				$(inp).blur();
-			};
-
-			$('#svg_editor').find('button, select, input:not(#text)').focus(function () {
-				inp = this;
-				uiContext = 'toolbars';
-				workarea.mousedown(unfocus);
-			}).blur(function () {
-				uiContext = 'canvas';
-				workarea.unbind('mousedown', unfocus);
-				// Go back to selecting text if in textedit mode
-				if (svgCanvas.getMode() === 'textedit') {
-					$('#text').focus();
-				}
-			});
-		}());
-
-		var clickFHPath = function () {
-			if (toolButtonClick('#tool_fhpath')) {
-				svgCanvas.setMode('fhpath');
-			}
-		};
-
-		var clickLine = function () {
-			if (toolButtonClick('#tool_line')) {
-				svgCanvas.setMode('line');
-			}
-		};
-
-		var clickSquare = function () {
-			if (toolButtonClick('#tool_square')) {
-				svgCanvas.setMode('square');
-			}
-		};
-
-		var clickRect = function () {
-			if (toolButtonClick('#tool_rect')) {
-				svgCanvas.setMode('rect');
-			}
-		};
-
-		var clickFHRect = function () {
-			if (toolButtonClick('#tool_fhrect')) {
-				svgCanvas.setMode('fhrect');
-			}
-		};
-
-		var clickCircle = function () {
-			if (toolButtonClick('#tool_circle')) {
-				svgCanvas.setMode('circle');
-			}
-		};
-
-		var clickEllipse = function () {
-			if (toolButtonClick('#tool_ellipse')) {
-				svgCanvas.setMode('ellipse');
-			}
-		};
-
-		var clickFHEllipse = function () {
-			if (toolButtonClick('#tool_fhellipse')) {
-				svgCanvas.setMode('fhellipse');
-			}
-		};
-
-		var clickImage = function () {
-			if (toolButtonClick('#tool_image')) {
-				svgCanvas.setMode('image');
-			}
-		};
-
-		var clickZoom = function () {
-			if (toolButtonClick('#tool_zoom')) {
-				svgCanvas.setMode('zoom');
-				workarea.css('cursor', zoomInIcon);
-			}
-		};
-
-		var zoomImage = function (multiplier) {
-			var res = svgCanvas.getResolution();
-			multiplier = multiplier ? res.zoom * multiplier : 1;
-			// setResolution(res.w * multiplier, res.h * multiplier, true);
-			$('#zoom').val(multiplier * 100);
-			svgCanvas.setZoom(multiplier);
-			zoomDone();
-			updateCanvas(true);
-		};
-
-		var dblclickZoom = function () {
-			if (toolButtonClick('#tool_zoom')) {
-				zoomImage();
-				setSelectMode();
-			}
-		};
-
-		var clickText = function () {
-			if (toolButtonClick('#tool_text')) {
-				svgCanvas.setMode('text');
-			}
-		};
-
-		var clickPath = function () {
-			if (toolButtonClick('#tool_path')) {
-				svgCanvas.setMode('path');
-			}
-		};
-
-		// Delete is a contextual tool that only appears in the ribbon if
-		// an element has been selected
-		var deleteSelected = function () {
-			if (selectedElement != null || multiselected) {
-				svgCanvas.deleteSelectedElements();
-			}
-		};
-
-		var cutSelected = function () {
-			if (selectedElement != null || multiselected) {
-				svgCanvas.cutSelectedElements();
-			}
-		};
-
-		var copySelected = function () {
-			if (selectedElement != null || multiselected) {
-				svgCanvas.copySelectedElements();
-			}
-		};
-
-		var pasteInCenter = function () {
-			var zoom = svgCanvas.getZoom();
-			var x = (workarea[0].scrollLeft + workarea.width() / 2) / zoom - svgCanvas.contentW;
-			var y = (workarea[0].scrollTop + workarea.height() / 2) / zoom - svgCanvas.contentH;
-			svgCanvas.pasteElements('point', x, y);
-		};
-
-		var moveToTopSelected = function () {
-			if (selectedElement != null) {
-				svgCanvas.moveToTopSelectedElement();
-			}
-		};
-
-		var moveToBottomSelected = function () {
-			if (selectedElement != null) {
-				svgCanvas.moveToBottomSelectedElement();
-			}
-		};
-
-		var moveUpDownSelected = function (dir) {
-			if (selectedElement != null) {
-				svgCanvas.moveUpDownSelected(dir);
-			}
-		};
-
-		var convertToPath = function () {
-			if (selectedElement != null) {
-				svgCanvas.convertToPath();
-			}
-		};
-
-		var reorientPath = function () {
-			if (selectedElement != null) {
-				path.reorient();
-			}
-		};
-
-		var makeHyperlink = function () {
-			if (selectedElement != null || multiselected) {
-				$.prompt(uiStrings.notification.enterNewLinkURL, 'http://', function (url) {
-					if (url) { svgCanvas.makeHyperlink(url); }
-				});
-			}
-		};
-
-		var moveSelected = function (dx, dy) {
-			if (selectedElement != null || multiselected) {
-				if (curConfig.gridSnapping) {
-					// Use grid snap value regardless of zoom level
-					var multi = svgCanvas.getZoom() * curConfig.snappingStep;
-					dx *= multi;
-					dy *= multi;
-				}
-				svgCanvas.moveSelectedElements(dx, dy);
-			}
-		};
-
-		var linkControlPoints = function () {
-			$('#tool_node_link').toggleClass('push_button_pressed tool_button');
-			var linked = $('#tool_node_link').hasClass('push_button_pressed');
-			path.linkControlPoints(linked);
-		};
-
-		var clonePathNode = function () {
-			if (path.getNodePoint()) {
-				path.clonePathNode();
-			}
-		};
-
-		var deletePathNode = function () {
-			if (path.getNodePoint()) {
-				path.deletePathNode();
-			}
-		};
-
-		var addSubPath = function () {
-			var button = $('#tool_add_subpath');
-			var sp = !button.hasClass('push_button_pressed');
-			button.toggleClass('push_button_pressed tool_button');
-			path.addSubPath(sp);
-		};
-
-		var opencloseSubPath = function () {
-			path.opencloseSubPath();
-		};
-
-		var selectNext = function () {
-			svgCanvas.cycleElement(1);
-		};
-
-		var selectPrev = function () {
-			svgCanvas.cycleElement(0);
-		};
-
-		var rotateSelected = function (cw, step) {
-			if (selectedElement == null || multiselected) { return; }
-			if (!cw) { step *= -1; }
-			var angle = parseFloat($('#angle').val()) + step;
-			svgCanvas.setRotationAngle(angle);
-			updateContextPanel();
-		};
-
-		var clickClear = function () {
-			var dims = curConfig.dimensions;
-			$.confirm(uiStrings.notification.QwantToClear, function (ok) {
-				if (!ok) { return; }
-				setSelectMode();
-				svgCanvas.clear();
-				svgCanvas.setResolution(dims[0], dims[1]);
-				updateCanvas(true);
-				zoomImage();
-				populateLayers();
-				updateContextPanel();
-				prepPaints();
-				svgCanvas.runExtensions('onNewDocument');
-			});
-		};
-
-		var clickBold = function () {
-			svgCanvas.setBold(!svgCanvas.getBold());
-			updateContextPanel();
-			return false;
-		};
-
-		var clickItalic = function () {
-			svgCanvas.setItalic(!svgCanvas.getItalic());
-			updateContextPanel();
-			return false;
-		};
-
-		var clickSave = function () {
-			// In the future, more options can be provided here
-			var saveOpts = {
-				'images': $.pref('img_save'),
-				'round_digits': 6
-			};
-			svgCanvas.save(saveOpts);
-		};
-
-		var loadingURL;
-		var clickExport = function () {
-			$.select('Select an image type for export: ', [
-				// See http://kangax.github.io/jstests/toDataUrl_mime_type_test/ for a useful list of MIME types and browser support
-				// 'ICO', // Todo: Find a way to preserve transparency in SVG-Edit if not working presently and do full packaging for x-icon; then switch back to position after 'PNG'
-				'PNG',
-				'JPEG', 'BMP', 'WEBP', 'PDF'
-			], function (imgType) { // todo: replace hard-coded msg with uiStrings.notification.
-				if (!imgType) {
-					return;
-				}
-				// Open placeholder window (prevents popup)
-				var exportWindowName;
-				function openExportWindow () {
-					var str = uiStrings.notification.loadingImage;
-					if (curConfig.exportWindowType === 'new') {
-						editor.exportWindowCt++;
-					}
-					exportWindowName = curConfig.canvasName + editor.exportWindowCt;
-					var popHTML, popURL;
-					if (loadingURL) {
-						popURL = loadingURL;
-					} else {
-						popHTML = '<!DOCTYPE html><html><head><meta charset="utf-8"><title>' + str + '</title></head><body><h1>' + str + '</h1></body><html>';
-						if (typeof URL && URL.createObjectURL) {
-							var blob = new Blob([popHTML], {type: 'text/html'});
-							popURL = URL.createObjectURL(blob);
-						} else {
-							popURL = 'data:text/html;base64;charset=utf-8,' + svgedit.utilities.encode64(popHTML);
-						}
-						loadingURL = popURL;
-					}
-					exportWindow = window.open(popURL, exportWindowName);
-				}
-				if (imgType === 'PDF') {
-					if (!customExportPDF) {
-						openExportWindow();
-					}
-					svgCanvas.exportPDF(exportWindowName);
-				} else {
-					if (!customExportImage) {
-						openExportWindow();
-					}
-					var quality = parseInt($('#image-slider').val(), 10) / 100;
-					svgCanvas.rasterExport(imgType, quality, exportWindowName);
-				}
-			}, function () {
-				var sel = $(this);
-				if (sel.val() === 'JPEG' || sel.val() === 'WEBP') {
-					if (!$('#image-slider').length) {
-						$('<div><label>Quality: <input id="image-slider" type="range" min="1" max="100" value="92" /></label></div>').appendTo(sel.parent()); // Todo: i18n-ize label
-					}
-				} else {
-					$('#image-slider').parent().remove();
-				}
-			});
-		};
-
-		// by default, svgCanvas.open() is a no-op.
-		// it is up to an extension mechanism (opera widget, etc)
-		// to call setCustomHandlers() which will make it do something
-		var clickOpen = function () {
-			svgCanvas.open();
-		};
-
-		var clickImport = function () {
-		};
-
-		var clickUndo = function () {
-			if (undoMgr.getUndoStackSize() > 0) {
-				undoMgr.undo();
-				populateLayers();
-			}
-		};
-
-		var clickRedo = function () {
-			if (undoMgr.getRedoStackSize() > 0) {
-				undoMgr.redo();
-				populateLayers();
-			}
-		};
-
-		var clickGroup = function () {
-			// group
-			if (multiselected) {
-				svgCanvas.groupSelectedElements();
-			// ungroup
-			} else if (selectedElement) {
-				svgCanvas.ungroupSelectedElement();
-			}
-		};
-
-		var clickClone = function () {
-			svgCanvas.cloneSelectedElements(20, 20);
-		};
-
-		var clickAlign = function () {
-			var letter = this.id.replace('tool_align', '').charAt(0);
-			svgCanvas.alignSelectedElements(letter, $('#align_relative_to').val());
-		};
-
-		var clickWireframe = function () {
-			$('#tool_wireframe').toggleClass('push_button_pressed tool_button');
-			workarea.toggleClass('wireframe');
-
-			if (supportsNonSS) { return; }
-			var wfRules = $('#wireframe_rules');
-			if (!wfRules.length) {
-				wfRules = $('<style id="wireframe_rules"></style>').appendTo('head');
-			} else {
-				wfRules.empty();
-			}
-
-			updateWireFrame();
-		};
-
-		$('#svg_docprops_container, #svg_prefs_container').draggable({cancel: 'button,fieldset', containment: 'window'});
-
-		var showDocProperties = function () {
-			if (docprops) { return; }
-			docprops = true;
-
-			// This selects the correct radio button by using the array notation
-			$('#image_save_opts input').val([$.pref('img_save')]);
-
-			// update resolution option with actual resolution
-			var res = svgCanvas.getResolution();
-			if (curConfig.baseUnit !== 'px') {
-				res.w = svgedit.units.convertUnit(res.w) + curConfig.baseUnit;
-				res.h = svgedit.units.convertUnit(res.h) + curConfig.baseUnit;
-			}
-
-			$('#canvas_width').val(res.w);
-			$('#canvas_height').val(res.h);
-			$('#canvas_title').val(svgCanvas.getDocumentTitle());
-
-			$('#svg_docprops').show();
-		};
-
-		var showPreferences = function () {
-			if (preferences) { return; }
-			preferences = true;
-			$('#main_menu').hide();
-
-			// Update background color with current one
-			var blocks = $('#bg_blocks div');
-			var curBg = 'cur_background';
-			var canvasBg = curPrefs.bkgd_color;
-			var url = $.pref('bkgd_url');
-			blocks.each(function () {
-				var blk = $(this);
-				var isBg = blk.css('background-color') === canvasBg;
-				blk.toggleClass(curBg, isBg);
-				if (isBg) { $('#canvas_bg_url').removeClass(curBg); }
-			});
-			if (!canvasBg) { blocks.eq(0).addClass(curBg); }
-			if (url) {
-				$('#canvas_bg_url').val(url);
-			}
-			$('#grid_snapping_on').prop('checked', curConfig.gridSnapping);
-			$('#grid_snapping_step').attr('value', curConfig.snappingStep);
-			$('#grid_color').attr('value', curConfig.gridColor);
-
-			$('#svg_prefs').show();
-		};
-
-		var hideSourceEditor = function () {
-			$('#svg_source_editor').hide();
-			editingsource = false;
-			$('#svg_source_textarea').blur();
-		};
-
-		var saveSourceEditor = function () {
-			if (!editingsource) { return; }
-
-			var saveChanges = function () {
-				svgCanvas.clearSelection();
-				hideSourceEditor();
-				zoomImage();
-				populateLayers();
-				updateTitle();
-				prepPaints();
-			};
-
-			if (!svgCanvas.setSvgString($('#svg_source_textarea').val())) {
-				$.confirm(uiStrings.notification.QerrorsRevertToSource, function (ok) {
-					if (!ok) { return false; }
-					saveChanges();
-				});
-			} else {
-				saveChanges();
-			}
-			setSelectMode();
-		};
-
-		var hideDocProperties = function () {
-			$('#svg_docprops').hide();
-			$('#canvas_width,#canvas_height').removeAttr('disabled');
-			$('#resolution')[0].selectedIndex = 0;
-			$('#image_save_opts input').val([$.pref('img_save')]);
-			docprops = false;
-		};
-
-		var hidePreferences = function () {
-			$('#svg_prefs').hide();
-			preferences = false;
-		};
-
-		var saveDocProperties = function () {
-			// set title
-			var newTitle = $('#canvas_title').val();
-			updateTitle(newTitle);
-			svgCanvas.setDocumentTitle(newTitle);
-
-			// update resolution
-			var width = $('#canvas_width'), w = width.val();
-			var height = $('#canvas_height'), h = height.val();
-
-			if (w !== 'fit' && !svgedit.units.isValidUnit('width', w)) {
-				$.alert(uiStrings.notification.invalidAttrValGiven);
-				width.parent().addClass('error');
-				return false;
-			}
-
-			width.parent().removeClass('error');
-
-			if (h !== 'fit' && !svgedit.units.isValidUnit('height', h)) {
-				$.alert(uiStrings.notification.invalidAttrValGiven);
-				height.parent().addClass('error');
-				return false;
-			}
-
-			height.parent().removeClass('error');
-
-			if (!svgCanvas.setResolution(w, h)) {
-				$.alert(uiStrings.notification.noContentToFitTo);
-				return false;
-			}
-
-			// Set image save option
-			$.pref('img_save', $('#image_save_opts :checked').val());
-			updateCanvas();
-			hideDocProperties();
-		};
-
-		var savePreferences = editor.savePreferences = function () {
-			// Set background
-			var color = $('#bg_blocks div.cur_background').css('background-color') || '#FFF';
-			setBackground(color, $('#canvas_bg_url').val());
-
-			// set language
-			var lang = $('#lang_select').val();
-			if (lang !== $.pref('lang')) {
-				editor.putLocale(lang, goodLangs);
-			}
-
-			// set icon size
-			setIconSize($('#iconsize').val());
-
-			// set grid setting
-			curConfig.gridSnapping = $('#grid_snapping_on')[0].checked;
-			curConfig.snappingStep = $('#grid_snapping_step').val();
-			curConfig.gridColor = $('#grid_color').val();
-			curConfig.showRulers = $('#show_rulers')[0].checked;
-
-			$('#rulers').toggle(curConfig.showRulers);
-			if (curConfig.showRulers) { updateRulers(); }
-			curConfig.baseUnit = $('#base_unit').val();
-
-			svgCanvas.setConfig(curConfig);
-
-			updateCanvas();
-			hidePreferences();
-		};
-
-		var resetScrollPos = $.noop;
-
-		var cancelOverlays = function () {
-			$('#dialog_box').hide();
-			if (!editingsource && !docprops && !preferences) {
-				if (curContext) {
-					svgCanvas.leaveContext();
-				}
-				return;
-			}
-
-			if (editingsource) {
-				if (origSource !== $('#svg_source_textarea').val()) {
-					$.confirm(uiStrings.notification.QignoreSourceChanges, function (ok) {
-						if (ok) { hideSourceEditor(); }
-					});
-				} else {
-					hideSourceEditor();
-				}
-			} else if (docprops) {
-				hideDocProperties();
-			} else if (preferences) {
-				hidePreferences();
-			}
-			resetScrollPos();
-		};
-
-		var winWh = {width: $(window).width(), height: $(window).height()};
-
-		// Fix for Issue 781: Drawing area jumps to top-left corner on window resize (IE9)
-		if (svgedit.browser.isIE()) {
-			(function () {
-				resetScrollPos = function () {
-					if (workarea[0].scrollLeft === 0 && workarea[0].scrollTop === 0) {
-						workarea[0].scrollLeft = curScrollPos.left;
-						workarea[0].scrollTop = curScrollPos.top;
-					}
-				};
-
-				curScrollPos = {
-					left: workarea[0].scrollLeft,
-					top: workarea[0].scrollTop
-				};
-
-				$(window).resize(resetScrollPos);
-				editor.ready(function () {
-					// TODO: Find better way to detect when to do this to minimize
-					// flickering effect
-					setTimeout(function () {
-						resetScrollPos();
-					}, 500);
-				});
-
-				workarea.scroll(function () {
-					curScrollPos = {
-						left: workarea[0].scrollLeft,
-						top: workarea[0].scrollTop
-					};
-				});
-			}());
-		}
-
-		$(window).resize(function (evt) {
-			$.each(winWh, function (type, val) {
-				var curval = $(window)[type]();
-				workarea[0]['scroll' + (type === 'width' ? 'Left' : 'Top')] -= (curval - val) / 2;
-				winWh[type] = curval;
-			});
-			setFlyoutPositions();
-		});
-
-		(function () {
-			workarea.scroll(function () {
-				// TODO: jQuery's scrollLeft/Top() wouldn't require a null check
-				if ($('#ruler_x').length !== 0) {
-					$('#ruler_x')[0].scrollLeft = workarea[0].scrollLeft;
-				}
-				if ($('#ruler_y').length !== 0) {
-					$('#ruler_y')[0].scrollTop = workarea[0].scrollTop;
-				}
-			});
-		}());
-
-		$('#url_notice').click(function () {
-			$.alert(this.title);
-		});
-
-		$('#change_image_url').click(promptImgURL);
-
-		// added these event handlers for all the push buttons so they
-		// behave more like buttons being pressed-in and not images
-		(function () {
-			var toolnames = ['clear', 'open', 'save', 'source', 'delete', 'delete_multi', 'paste', 'clone', 'clone_multi', 'move_top', 'move_bottom'];
-			var allTools = '';
-			var curClass = 'tool_button_current';
-
-			$.each(toolnames, function (i, item) {
-				allTools += (i ? ',' : '') + '#tool_' + item;
-			});
-
-			$(allTools).mousedown(function () {
-				$(this).addClass(curClass);
-			}).bind('mousedown mouseout', function () {
-				$(this).removeClass(curClass);
-			});
-
-			$('#tool_undo, #tool_redo').mousedown(function () {
-				if (!$(this).hasClass('disabled')) { $(this).addClass(curClass); }
-			}).bind('mousedown mouseout', function () {
-				$(this).removeClass(curClass);
-			});
-		}());
-
-		// switch modifier key in tooltips if mac
-		// NOTE: This code is not used yet until I can figure out how to successfully bind ctrl/meta
-		// in Opera and Chrome
-		if (svgedit.browser.isMac() && !window.opera) {
-			var shortcutButtons = ['tool_clear', 'tool_save', 'tool_source', 'tool_undo', 'tool_redo', 'tool_clone'];
-			i = shortcutButtons.length;
-			while (i--) {
-				var button = document.getElementById(shortcutButtons[i]);
-				if (button) {
-					var title = button.title;
-					var index = title.indexOf('Ctrl+');
-					button.title = [title.substr(0, index), 'Cmd+', title.substr(index + 5)].join('');
-				}
-			}
-		}
-
-		// TODO: go back to the color boxes having white background-color and then setting
-		//	background-image to none.png (otherwise partially transparent gradients look weird)
-		var colorPicker = function (elem) {
-			var picker = elem.attr('id') === 'stroke_color' ? 'stroke' : 'fill';
-			// var opacity = (picker == 'stroke' ? $('#stroke_opacity') : $('#fill_opacity'));
-			var paint = paintBox[picker].paint;
-			var title = (picker === 'stroke' ? 'Pick a Stroke Paint and Opacity' : 'Pick a Fill Paint and Opacity');
-			// var was_none = false; // Currently unused
-			var pos = elem.offset();
-			$('#color_picker')
-				.draggable({cancel: '.jGraduate_tabs, .jGraduate_colPick, .jGraduate_gradPick, .jPicker', containment: 'window'})
-				.css(curConfig.colorPickerCSS || {'left': pos.left - 140, 'bottom': 40})
-				.jGraduate(
-					{
-						paint: paint,
-						window: { pickerTitle: title },
-						images: { clientPath: curConfig.jGraduatePath },
-						newstop: 'inverse'
-					},
-					function (p) {
-						paint = new $.jGraduate.Paint(p);
-						paintBox[picker].setPaint(paint);
-						svgCanvas.setPaint(picker, paint);
-						$('#color_picker').hide();
-					},
-					function () {
-						$('#color_picker').hide();
-					}
-				);
-		};
-
-		var PaintBox = function (container, type) {
-			var paintColor, paintOpacity,
-				cur = curConfig[type === 'fill' ? 'initFill' : 'initStroke'];
-			// set up gradients to be used for the buttons
-			var svgdocbox = new DOMParser().parseFromString(
-				'<svg xmlns="http://www.w3.org/2000/svg"><rect width="16.5" height="16.5"' +
+      var elems = $(selToscale);
+      var scale = 1;
+
+      if (typeof size === 'number') {
+        scale = size;
+      } else {
+        var iconSizes = {s: 0.75, m: 1, l: 1.25, xl: 1.5};
+        scale = iconSizes[size];
+      }
+
+      editor.tool_scale = scale;
+
+      setFlyoutPositions();
+      // $('.tools_flyout').each(function () {
+      // 	var pos = $(this).position();
+      // 	console.log($(this), pos.left+(34 * scale));
+      // 	$(this).css({'left': pos.left+(34 * scale), 'top': pos.top+(77 * scale)});
+      // 	console.log('l', $(this).css('left'));
+      // });
+      //
+      // var scale = .75;
+
+      var hiddenPs = elems.parents(':hidden');
+      hiddenPs.css('visibility', 'hidden').show();
+      scaleElements(elems, scale);
+      hiddenPs.css('visibility', 'visible').hide();
+      // return;
+
+      $.pref('iconsize', size);
+      $('#iconsize').val(size);
+
+      // Change icon size
+      // $('.tool_button, .push_button, .tool_button_current, .disabled, .icon_label, #url_notice, #tool_open')
+      // .find('> svg, > img').each(function () {
+      // 	this.setAttribute('width',size_num);
+      // 	this.setAttribute('height',size_num);
+      // });
+      //
+      // $.resizeSvgIcons({
+      // 	'.flyout_arrow_horiz > svg, .flyout_arrow_horiz > img': size_num / 5,
+      // 	'#logo > svg, #logo > img': size_num * 1.3,
+      // 	'#tools_bottom .icon_label > *': (size_num === 16 ? 18 : size_num * .75)
+      // });
+      // if (size != 's') {
+      // 	$.resizeSvgIcons({'#layerbuttons svg, #layerbuttons img': size_num * .6});
+      // }
+
+      // Note that all rules will be prefixed with '#svg_editor' when parsed
+      var cssResizeRules = {
+        // '.tool_button,\
+        // .push_button,\
+        // .tool_button_current,\
+        // .push_button_pressed,\
+        // .disabled,\
+        // .icon_label,\
+        // .tools_flyout .tool_button': {
+        // 	'width': {s: '16px', l: '32px', xl: '48px'},
+        // 	'height': {s: '16px', l: '32px', xl: '48px'},
+        // 	'padding': {s: '1px', l: '2px', xl: '3px'}
+        // },
+        // '.tool_sep': {
+        // 	'height': {s: '16px', l: '32px', xl: '48px'},
+        // 	'margin': {s: '2px 2px', l: '2px 5px', xl: '2px 8px'}
+        // },
+        // '#main_icon': {
+        // 	'width': {s: '31px', l: '53px', xl: '75px'},
+        // 	'height': {s: '22px', l: '42px', xl: '64px'}
+        // },
+        '#tools_top': {
+          'left': 50 + $('#main_button').width(),
+          'height': 72
+        },
+        '#tools_left': {
+          'width': 31,
+          'top': 74
+        },
+        'div#workarea': {
+          'left': 38,
+          'top': 74
+        }
+        // '#tools_bottom': {
+        // 	'left': {s: '27px', l: '46px', xl: '65px'},
+        // 	'height': {s: '58px', l: '98px', xl: '145px'}
+        // },
+        // '#color_tools': {
+        // 	'border-spacing': {s: '0 1px'},
+        // 	'margin-top': {s: '-1px'}
+        // },
+        // '#color_tools .icon_label': {
+        // 	'width': {l:'43px', xl: '60px'}
+        // },
+        // '.color_tool': {
+        // 	'height': {s: '20px'}
+        // },
+        // '#tool_opacity': {
+        // 	'top': {s: '1px'},
+        // 	'height': {s: 'auto', l:'auto', xl:'auto'}
+        // },
+        // '#tools_top input, #tools_bottom input': {
+        // 	'margin-top': {s: '2px', l: '4px', xl: '5px'},
+        // 	'height': {s: 'auto', l: 'auto', xl: 'auto'},
+        // 	'border': {s: '1px solid #555', l: 'auto', xl: 'auto'},
+        // 	'font-size': {s: '.9em', l: '1.2em', xl: '1.4em'}
+        // },
+        // '#zoom_panel': {
+        // 	'margin-top': {s: '3px', l: '4px', xl: '5px'}
+        // },
+        // '#copyright, #tools_bottom .label': {
+        // 	'font-size': {l: '1.5em', xl: '2em'},
+        // 	'line-height': {s: '15px'}
+        // },
+        // '#tools_bottom_2': {
+        // 	'width': {l: '295px', xl: '355px'},
+        // 	'top': {s: '4px'}
+        // },
+        // '#tools_top > div, #tools_top': {
+        // 	'line-height': {s: '17px', l: '34px', xl: '50px'}
+        // },
+        // '.dropdown button': {
+        // 	'height': {s: '18px', l: '34px', xl: '40px'},
+        // 	'line-height': {s: '18px', l: '34px', xl: '40px'},
+        // 	'margin-top': {s: '3px'}
+        // },
+        // '#tools_top label, #tools_bottom label': {
+        // 	'font-size': {s: '1em', l: '1.5em', xl: '2em'},
+        // 	'height': {s: '25px', l: '42px', xl: '64px'}
+        // },
+        // 'div.toolset': {
+        // 	'height': {s: '25px', l: '42px', xl: '64px'}
+        // },
+        // '#tool_bold, #tool_italic': {
+        // 	'font-size': {s: '1.5em', l: '3em', xl: '4.5em'}
+        // },
+        // '#sidepanels': {
+        // 	'top': {s: '50px', l: '88px', xl: '125px'},
+        // 	'bottom': {s: '51px', l: '68px', xl: '65px'}
+        // },
+        // '#layerbuttons': {
+        // 	'width': {l: '130px', xl: '175px'},
+        // 	'height': {l: '24px', xl: '30px'}
+        // },
+        // '#layerlist': {
+        // 	'width': {l: '128px', xl: '150px'}
+        // },
+        // '.layer_button': {
+        // 	'width': {l: '19px', xl: '28px'},
+        // 	'height': {l: '19px', xl: '28px'}
+        // },
+        // 'input.spin-button': {
+        // 	'background-image': {l: 'url('images/spinbtn_updn_big.png')', xl: 'url('images/spinbtn_updn_big.png')'},
+        // 	'background-position': {l: '100% -5px', xl: '100% -2px'},
+        // 	'padding-right': {l: '24px', xl: '24px' }
+        // },
+        // 'input.spin-button.up': {
+        // 	'background-position': {l: '100% -45px', xl: '100% -42px'}
+        // },
+        // 'input.spin-button.down': {
+        // 	'background-position': {l: '100% -85px', xl: '100% -82px'}
+        // },
+        // '#position_opts': {
+        // 	'width': {all: (size_num*4) +'px'}
+        // }
+      };
+
+      var ruleElem = $('#tool_size_rules');
+      if (!ruleElem.length) {
+        ruleElem = $('<style id="tool_size_rules"></style>').appendTo('head');
+      } else {
+        ruleElem.empty();
+      }
+
+      if (size !== 'm') {
+        var styleStr = '';
+        $.each(cssResizeRules, function (selector, rules) {
+          selector = '#svg_editor ' + selector.replace(/,/g, ', #svg_editor');
+          styleStr += selector + '{';
+          $.each(rules, function (prop, values) {
+            var val;
+            if (typeof values === 'number') {
+              val = (values * scale) + 'px';
+            } else if (values[size] || values.all) {
+              val = (values[size] || values.all);
+            }
+            styleStr += (prop + ':' + val + ';');
+          });
+          styleStr += '}';
+        });
+        // this.style[uaPrefix + 'Transform'] = 'scale(' + scale + ')';
+        var prefix = '-' + uaPrefix.toLowerCase() + '-';
+        styleStr += (selToscale + '{' + prefix + 'transform: scale(' + scale + ');}' +
+          ' #svg_editor div.toolset .toolset {' + prefix + 'transform: scale(1); margin: 1px !important;}' + // Hack for markers
+          ' #svg_editor .ui-slider {' + prefix + 'transform: scale(' + (1 / scale) + ');}' // Hack for sliders
+        );
+        ruleElem.text(styleStr);
+      }
+
+      setFlyoutPositions();
+    };
+
+    // TODO: Combine this with addDropDown or find other way to optimize
+    var addAltDropDown = function (elem, list, callback, opts) {
+      var button = $(elem);
+      list = $(list);
+      var onButton = false;
+      var dropUp = opts.dropUp;
+      if (dropUp) {
+        $(elem).addClass('dropup');
+      }
+      list.find('li').bind('mouseup', function () {
+        if (opts.seticon) {
+          setIcon('#cur_' + button[0].id, $(this).children());
+          $(this).addClass('current').siblings().removeClass('current');
+        }
+        callback.apply(this, arguments);
+      });
+
+      $(window).mouseup(function (evt) {
+        if (!onButton) {
+          button.removeClass('down');
+          list.hide();
+          list.css({top: 0, left: 0});
+        }
+        onButton = false;
+      });
+
+      // var height = list.height(); // Currently unused
+      button.bind('mousedown', function () {
+        var off = button.offset();
+        if (dropUp) {
+          off.top -= list.height();
+          off.left += 8;
+        } else {
+          off.top += button.height();
+        }
+        list.offset(off);
+
+        if (!button.hasClass('down')) {
+          list.show();
+          onButton = true;
+        } else {
+          // CSS position must be reset for Webkit
+          list.hide();
+          list.css({top: 0, left: 0});
+        }
+        button.toggleClass('down');
+      }).hover(function () {
+        onButton = true;
+      }).mouseout(function () {
+        onButton = false;
+      });
+
+      if (opts.multiclick) {
+        list.mousedown(function () {
+          onButton = true;
+        });
+      }
+    };
+
+    var extsPreLang = [];
+    var extAdded = function (win, ext) {
+      if (!ext) {
+        return;
+      }
+      var cbCalled = false;
+      var resizeDone = false;
+      var cbReady = true; // Set to false to delay callback (e.g. wait for $.svgIcons)
+
+      if (ext.langReady) {
+        if (editor.langChanged) { // We check for this since the "lang" pref could have been set by storage
+          var lang = $.pref('lang');
+          ext.langReady({lang: lang, uiStrings: uiStrings});
+        } else {
+          extsPreLang.push(ext);
+        }
+      }
+
+      function prepResize () {
+        if (resizeTimer) {
+          clearTimeout(resizeTimer);
+          resizeTimer = null;
+        }
+        if (!resizeDone) {
+          resizeTimer = setTimeout(function () {
+            resizeDone = true;
+            setIconSize($.pref('iconsize'));
+          }, 50);
+        }
+      }
+
+      var runCallback = function () {
+        if (ext.callback && !cbCalled && cbReady) {
+          cbCalled = true;
+          ext.callback();
+        }
+      };
+
+      var btnSelects = [];
+
+      if (ext.context_tools) {
+        $.each(ext.context_tools, function (i, tool) {
+          // Add select tool
+          var html;
+          var contId = tool.container_id ? (' id="' + tool.container_id + '"') : '';
+          var panel = $('#' + tool.panel);
+
+          // create the panel if it doesn't exist
+          if (!panel.length) {
+            panel = $('<div>', {id: tool.panel}).appendTo('#tools_top');
+          }
+
+          // TODO: Allow support for other types, or adding to existing tool
+          switch (tool.type) {
+          case 'tool_button':
+            html = '<div class="tool_button">' + tool.id + '</div>';
+            var div = $(html).appendTo(panel);
+            if (tool.events) {
+              $.each(tool.events, function (evt, func) {
+                $(div).bind(evt, func);
+              });
+            }
+            break;
+          case 'select':
+            html = '<label' + contId + '>' +
+              '<select id="' + tool.id + '">';
+            $.each(tool.options, function (val, text) {
+              var sel = (val === tool.defval) ? ' selected' : '';
+              html += '<option value="' + val + '"' + sel + '>' + text + '</option>';
+            });
+            html += '</select></label>';
+            // Creates the tool, hides & adds it, returns the select element
+            var sel = $(html).appendTo(panel).find('select');
+
+            $.each(tool.events, function (evt, func) {
+              $(sel).bind(evt, func);
+            });
+            break;
+          case 'button-select':
+            html = '<div id="' + tool.id + '" class="dropdown toolset" title="' + tool.title + '">' +
+              '<div id="cur_' + tool.id + '" class="icon_label"></div><button></button></div>';
+
+            var list = $('<ul id="' + tool.id + '_opts"></ul>').appendTo('#option_lists');
+
+            if (tool.colnum) {
+              list.addClass('optcols' + tool.colnum);
+            }
+
+            // Creates the tool, hides & adds it, returns the select element
+            /* var dropdown = */ $(html).appendTo(panel).children();
+
+            btnSelects.push({
+              elem: ('#' + tool.id),
+              list: ('#' + tool.id + '_opts'),
+              title: tool.title,
+              callback: tool.events.change,
+              cur: ('#cur_' + tool.id)
+            });
+
+            break;
+          case 'input':
+            html = '<label' + contId + '>' +
+              '<span id="' + tool.id + '_label">' +
+              tool.label + ':</span>' +
+              '<input id="' + tool.id + '" title="' + tool.title +
+              '" size="' + (tool.size || '4') + '" value="' + (tool.defval || '') + '" type="text"/></label>';
+
+            // Creates the tool, hides & adds it, returns the select element
+
+            // Add to given tool.panel
+            var inp = $(html).appendTo(panel).find('input');
+
+            if (tool.spindata) {
+              inp.SpinButton(tool.spindata);
+            }
+
+            if (tool.events) {
+              $.each(tool.events, function (evt, func) {
+                inp.bind(evt, func);
+              });
+            }
+            break;
+
+          default:
+            break;
+          }
+        });
+      }
+
+      if (ext.buttons) {
+        var fallbackObj = {},
+          placementObj = {},
+          svgicons = ext.svgicons,
+          holders = {};
+
+        // Add buttons given by extension
+        $.each(ext.buttons, function (i, btn) {
+          var icon, svgicon, tlsId;
+          var id = btn.id;
+          var num = i;
+
+          // Give button a unique ID
+          while ($('#' + id).length) {
+            id = btn.id + '_' + (++num);
+          }
+
+          if (!svgicons) {
+            icon = $('<img src="' + btn.icon + '">');
+          } else {
+            fallbackObj[id] = btn.icon;
+            svgicon = btn.svgicon || btn.id;
+            if (btn.type === 'app_menu') {
+              placementObj['#' + id + ' > div'] = svgicon;
+            } else {
+              placementObj['#' + id] = svgicon;
+            }
+          }
+
+          var cls, parent;
+
+          // Set button up according to its type
+          switch (btn.type) {
+          case 'mode_flyout':
+          case 'mode':
+            cls = 'tool_button';
+            parent = '#tools_left';
+            break;
+          case 'context':
+            cls = 'tool_button';
+            parent = '#' + btn.panel;
+            // create the panel if it doesn't exist
+            if (!$(parent).length) {
+              $('<div>', {id: btn.panel}).appendTo('#tools_top');
+            }
+            break;
+          case 'app_menu':
+            cls = '';
+            parent = '#main_menu ul';
+            break;
+          }
+          var flyoutHolder, curH, showBtn, refData, refBtn;
+          var button = $((btn.list || btn.type === 'app_menu') ? '<li/>' : '<div/>')
+            .attr('id', id)
+            .attr('title', btn.title)
+            .addClass(cls);
+          if (!btn.includeWith && !btn.list) {
+            if ('position' in btn) {
+              if ($(parent).children().eq(btn.position).length) {
+                $(parent).children().eq(btn.position).before(button);
+              } else {
+                $(parent).children().last().before(button);
+              }
+            } else {
+              button.appendTo(parent);
+            }
+
+            if (btn.type === 'mode_flyout') {
+            // Add to flyout menu / make flyout menu
+              // var opts = btn.includeWith;
+              // // opts.button, default, position
+              refBtn = $(button);
+
+              flyoutHolder = refBtn.parent();
+              // Create a flyout menu if there isn't one already
+              if (!refBtn.parent().hasClass('tools_flyout')) {
+                // Create flyout placeholder
+                tlsId = refBtn[0].id.replace('tool_', 'tools_');
+                showBtn = refBtn.clone()
+                  .attr('id', tlsId + '_show')
+                  .append($('<div>', {'class': 'flyout_arrow_horiz'}));
+
+                refBtn.before(showBtn);
+
+                // Create a flyout div
+                flyoutHolder = makeFlyoutHolder(tlsId, refBtn);
+                flyoutHolder.data('isLibrary', true);
+                showBtn.data('isLibrary', true);
+              }
+              // refData = Actions.getButtonData(opts.button);
+
+              placementObj['#' + tlsId + '_show'] = btn.id;
+              // TODO: Find way to set the current icon using the iconloader if this is not default
+
+              // Include data for extension button as well as ref button
+              curH = holders['#' + flyoutHolder[0].id] = [{
+                sel: '#' + id,
+                fn: btn.events.click,
+                icon: btn.id,
+                // key: btn.key,
+                isDefault: true
+              }, refData];
+              //
+              // // {sel:'#tool_rect', fn: clickRect, evt: 'mouseup', key: 4, parent: '#tools_rect', icon: 'rect'}
+              //
+              // var pos = ('position' in opts)?opts.position:'last';
+              // var len = flyoutHolder.children().length;
+              //
+              // // Add at given position or end
+              // if (!isNaN(pos) && pos >= 0 && pos < len) {
+              // 	flyoutHolder.children().eq(pos).before(button);
+              // } else {
+              // 	flyoutHolder.append(button);
+              // 	curH.reverse();
+              // }
+            } else if (btn.type === 'app_menu') {
+              button.append('<div>').append(btn.title);
+            }
+          } else if (btn.list) {
+            // Add button to list
+            button.addClass('push_button');
+            $('#' + btn.list + '_opts').append(button);
+            if (btn.isDefault) {
+              $('#cur_' + btn.list).append(button.children().clone());
+              svgicon = btn.svgicon || btn.id;
+              placementObj['#cur_' + btn.list] = svgicon;
+            }
+          } else if (btn.includeWith) {
+            // Add to flyout menu / make flyout menu
+            var opts = btn.includeWith;
+            // opts.button, default, position
+            refBtn = $(opts.button);
+
+            flyoutHolder = refBtn.parent();
+            // Create a flyout menu if there isn't one already
+            if (!refBtn.parent().hasClass('tools_flyout')) {
+              // Create flyout placeholder
+              tlsId = refBtn[0].id.replace('tool_', 'tools_');
+              showBtn = refBtn.clone()
+                .attr('id', tlsId + '_show')
+                .append($('<div>', {'class': 'flyout_arrow_horiz'}));
+
+              refBtn.before(showBtn);
+
+              // Create a flyout div
+              flyoutHolder = makeFlyoutHolder(tlsId, refBtn);
+            }
+
+            refData = Actions.getButtonData(opts.button);
+
+            if (opts.isDefault) {
+              placementObj['#' + tlsId + '_show'] = btn.id;
+            }
+            // TODO: Find way to set the current icon using the iconloader if this is not default
+
+            // Include data for extension button as well as ref button
+            curH = holders['#' + flyoutHolder[0].id] = [{
+              sel: '#' + id,
+              fn: btn.events.click,
+              icon: btn.id,
+              key: btn.key,
+              isDefault: btn.includeWith ? btn.includeWith.isDefault : 0
+            }, refData];
+
+            // {sel:'#tool_rect', fn: clickRect, evt: 'mouseup', key: 4, parent: '#tools_rect', icon: 'rect'}
+
+            var pos = ('position' in opts) ? opts.position : 'last';
+            var len = flyoutHolder.children().length;
+
+            // Add at given position or end
+            if (!isNaN(pos) && pos >= 0 && pos < len) {
+              flyoutHolder.children().eq(pos).before(button);
+            } else {
+              flyoutHolder.append(button);
+              curH.reverse();
+            }
+          }
+
+          if (!svgicons) {
+            button.append(icon);
+          }
+
+          if (!btn.list) {
+            // Add given events to button
+            $.each(btn.events, function (name, func) {
+              if (name === 'click' && btn.type === 'mode') {
+                if (btn.includeWith) {
+                  button.bind(name, func);
+                } else {
+                  button.bind(name, function () {
+                    if (toolButtonClick(button)) {
+                      func();
+                    }
+                  });
+                }
+                if (btn.key) {
+                  $(document).bind('keydown', btn.key, func);
+                  if (btn.title) {
+                    button.attr('title', btn.title + ' [' + btn.key + ']');
+                  }
+                }
+              } else {
+                button.bind(name, func);
+              }
+            });
+          }
+
+          setupFlyouts(holders);
+        });
+
+        $.each(btnSelects, function () {
+          addAltDropDown(this.elem, this.list, this.callback, {seticon: true});
+        });
+
+        if (svgicons) {
+          cbReady = false; // Delay callback
+        }
+
+        $.svgIcons(svgicons, {
+          w: 24, h: 24,
+          id_match: false,
+          no_img: (!svgedit.browser.isWebkit()),
+          fallback: fallbackObj,
+          placement: placementObj,
+          callback: function (icons) {
+            // Non-ideal hack to make the icon match the current size
+            // if (curPrefs.iconsize && curPrefs.iconsize !== 'm') {
+            if ($.pref('iconsize') !== 'm') {
+              prepResize();
+            }
+            cbReady = true; // Ready for callback
+            runCallback();
+          }
+        });
+      }
+
+      runCallback();
+    };
+
+    var getPaint = function (color, opac, type) {
+      // update the editor's fill paint
+      var opts = { alpha: opac };
+      if (color.indexOf('url(#') === 0) {
+        var refElem = svgCanvas.getRefElem(color);
+        if (refElem) {
+          refElem = refElem.cloneNode(true);
+        } else {
+          refElem = $('#' + type + '_color defs *')[0];
+        }
+        opts[refElem.tagName] = refElem;
+      } else if (color.indexOf('#') === 0) {
+        opts.solidColor = color.substr(1);
+      } else {
+        opts.solidColor = 'none';
+      }
+      return new $.jGraduate.Paint(opts);
+    };
+
+    // $('#text').focus(function () { textBeingEntered = true; });
+    // $('#text').blur(function () { textBeingEntered = false; });
+
+    // bind the selected event to our function that handles updates to the UI
+    svgCanvas.bind('selected', selectedChanged);
+    svgCanvas.bind('transition', elementTransition);
+    svgCanvas.bind('changed', elementChanged);
+    svgCanvas.bind('saved', saveHandler);
+    svgCanvas.bind('exported', exportHandler);
+    svgCanvas.bind('exportedPDF', function (win, data) {
+      var exportWindowName = data.exportWindowName;
+      if (exportWindowName) {
+        exportWindow = window.open('', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
+      }
+      exportWindow.location.href = data.dataurlstring;
+    });
+    svgCanvas.bind('zoomed', zoomChanged);
+    svgCanvas.bind('contextset', contextChanged);
+    svgCanvas.bind('extension_added', extAdded);
+    svgCanvas.textActions.setInputElem($('#text')[0]);
+
+    var str = '<div class="palette_item" data-rgb="none"></div>';
+    $.each(palette, function (i, item) {
+      str += '<div class="palette_item" style="background-color: ' + item + ';" data-rgb="' + item + '"></div>';
+    });
+    $('#palette').append(str);
+
+    // Set up editor background functionality
+    // TODO add checkerboard as "pattern"
+    var colorBlocks = ['#FFF', '#888', '#000']; // ,'url(data:image/gif;base64,R0lGODlhEAAQAIAAAP%2F%2F%2F9bW1iH5BAAAAAAALAAAAAAQABAAAAIfjG%2Bgq4jM3IFLJgpswNly%2FXkcBpIiVaInlLJr9FZWAQA7)'];
+    str = '';
+    $.each(colorBlocks, function () {
+      str += '<div class="color_block" style="background-color:' + this + ';"></div>';
+    });
+    $('#bg_blocks').append(str);
+    var blocks = $('#bg_blocks div');
+    var curBg = 'cur_background';
+    blocks.each(function () {
+      var blk = $(this);
+      blk.click(function () {
+        blocks.removeClass(curBg);
+        $(this).addClass(curBg);
+      });
+    });
+
+    setBackground($.pref('bkgd_color'), $.pref('bkgd_url'));
+
+    $('#image_save_opts input').val([$.pref('img_save')]);
+
+    var changeRectRadius = function (ctl) {
+      svgCanvas.setRectRadius(ctl.value);
+    };
+
+    var changeFontSize = function (ctl) {
+      svgCanvas.setFontSize(ctl.value);
+    };
+
+    var changeStrokeWidth = function (ctl) {
+      var val = ctl.value;
+      if (val === 0 && selectedElement && ['line', 'polyline'].indexOf(selectedElement.nodeName) >= 0) {
+        val = ctl.value = 1;
+      }
+      svgCanvas.setStrokeWidth(val);
+    };
+
+    var changeRotationAngle = function (ctl) {
+      svgCanvas.setRotationAngle(ctl.value);
+      $('#tool_reorient').toggleClass('disabled', parseInt(ctl.value, 10) === 0);
+    };
+
+    var changeOpacity = function (ctl, val) {
+      if (val == null) { val = ctl.value; }
+      $('#group_opacity').val(val);
+      if (!ctl || !ctl.handle) {
+        $('#opac_slider').slider('option', 'value', val);
+      }
+      svgCanvas.setOpacity(val / 100);
+    };
+
+    var changeBlur = function (ctl, val, noUndo) {
+      if (val == null) { val = ctl.value; }
+      $('#blur').val(val);
+      var complete = false;
+      if (!ctl || !ctl.handle) {
+        $('#blur_slider').slider('option', 'value', val);
+        complete = true;
+      }
+      if (noUndo) {
+        svgCanvas.setBlurNoUndo(val);
+      } else {
+        svgCanvas.setBlur(val, complete);
+      }
+    };
+
+    $('#stroke_style').change(function () {
+      svgCanvas.setStrokeAttr('stroke-dasharray', $(this).val());
+      operaRepaint();
+    });
+
+    $('#stroke_linejoin').change(function () {
+      svgCanvas.setStrokeAttr('stroke-linejoin', $(this).val());
+      operaRepaint();
+    });
+
+    // Lose focus for select elements when changed (Allows keyboard shortcuts to work better)
+    $('select').change(function () { $(this).blur(); });
+
+    // fired when user wants to move elements to another layer
+    var promptMoveLayerOnce = false;
+    $('#selLayerNames').change(function () {
+      var destLayer = this.options[this.selectedIndex].value;
+      var confirmStr = uiStrings.notification.QmoveElemsToLayer.replace('%s', destLayer);
+      var moveToLayer = function (ok) {
+        if (!ok) { return; }
+        promptMoveLayerOnce = true;
+        svgCanvas.moveSelectedToLayer(destLayer);
+        svgCanvas.clearSelection();
+        populateLayers();
+      };
+      if (destLayer) {
+        if (promptMoveLayerOnce) {
+          moveToLayer(true);
+        } else {
+          $.confirm(confirmStr, moveToLayer);
+        }
+      }
+    });
+
+    $('#font_family').change(function () {
+      svgCanvas.setFontFamily(this.value);
+    });
+
+    $('#seg_type').change(function () {
+      svgCanvas.setSegType($(this).val());
+    });
+
+    $('#text').bind('keyup input', function () {
+      svgCanvas.setTextContent(this.value);
+    });
+
+    $('#image_url').change(function () {
+      setImageURL(this.value);
+    });
+
+    $('#link_url').change(function () {
+      if (this.value.length) {
+        svgCanvas.setLinkURL(this.value);
+      } else {
+        svgCanvas.removeHyperlink();
+      }
+    });
+
+    $('#g_title').change(function () {
+      svgCanvas.setGroupTitle(this.value);
+    });
+
+    $('.attr_changer').change(function () {
+      var attr = this.getAttribute('data-attr');
+      var val = this.value;
+      var valid = svgedit.units.isValidUnit(attr, val, selectedElement);
+
+      if (!valid) {
+        $.alert(uiStrings.notification.invalidAttrValGiven);
+        this.value = selectedElement.getAttribute(attr);
+        return false;
+      }
+
+      if (attr !== 'id' && attr !== 'class') {
+        if (isNaN(val)) {
+          val = svgCanvas.convertToNum(attr, val);
+        } else if (curConfig.baseUnit !== 'px') {
+          // Convert unitless value to one with given unit
+
+          var unitData = svgedit.units.getTypeMap();
+
+          if (selectedElement[attr] || svgCanvas.getMode() === 'pathedit' || attr === 'x' || attr === 'y') {
+            val *= unitData[curConfig.baseUnit];
+          }
+        }
+      }
+
+      // if the user is changing the id, then de-select the element first
+      // change the ID, then re-select it with the new ID
+      if (attr === 'id') {
+        var elem = selectedElement;
+        svgCanvas.clearSelection();
+        elem.id = val;
+        svgCanvas.addToSelection([elem], true);
+      } else {
+        svgCanvas.changeSelectedAttribute(attr, val);
+      }
+      this.blur();
+    });
+
+    // Prevent selection of elements when shift-clicking
+    $('#palette').mouseover(function () {
+      var inp = $('<input type="hidden">');
+      $(this).append(inp);
+      inp.focus().remove();
+    });
+
+    $('.palette_item').mousedown(function (evt) {
+      // shift key or right click for stroke
+      var picker = evt.shiftKey || evt.button === 2 ? 'stroke' : 'fill';
+      var color = $(this).data('rgb');
+      var paint;
+
+      // Webkit-based browsers returned 'initial' here for no stroke
+      if (color === 'none' || color === 'transparent' || color === 'initial') {
+        color = 'none';
+        paint = new $.jGraduate.Paint();
+      } else {
+        paint = new $.jGraduate.Paint({alpha: 100, solidColor: color.substr(1)});
+      }
+
+      paintBox[picker].setPaint(paint);
+      svgCanvas.setColor(picker, color);
+
+      if (color !== 'none' && svgCanvas.getPaintOpacity(picker) !== 1) {
+        svgCanvas.setPaintOpacity(picker, 1.0);
+      }
+      updateToolButtonState();
+    }).bind('contextmenu', function (e) { e.preventDefault(); });
+
+    $('#toggle_stroke_tools').on('click', function () {
+      $('#tools_bottom').toggleClass('expanded');
+    });
+
+    (function () {
+      var lastX = null, lastY = null, wArea = workarea[0],
+        panning = false, keypan = false;
+
+      $('#svgcanvas').bind('mousemove mouseup', function (evt) {
+        if (panning === false) { return; }
+
+        wArea.scrollLeft -= (evt.clientX - lastX);
+        wArea.scrollTop -= (evt.clientY - lastY);
+
+        lastX = evt.clientX;
+        lastY = evt.clientY;
+
+        if (evt.type === 'mouseup') { panning = false; }
+        return false;
+      }).mousedown(function (evt) {
+        if (evt.button === 1 || keypan === true) {
+          panning = true;
+          lastX = evt.clientX;
+          lastY = evt.clientY;
+          return false;
+        }
+      });
+
+      $(window).mouseup(function () {
+        panning = false;
+      });
+
+      $(document).bind('keydown', 'space', function (evt) {
+        svgCanvas.spaceKey = keypan = true;
+        evt.preventDefault();
+      }).bind('keyup', 'space', function (evt) {
+        evt.preventDefault();
+        svgCanvas.spaceKey = keypan = false;
+      }).bind('keydown', 'shift', function (evt) {
+        if (svgCanvas.getMode() === 'zoom') {
+          workarea.css('cursor', zoomOutIcon);
+        }
+      }).bind('keyup', 'shift', function (evt) {
+        if (svgCanvas.getMode() === 'zoom') {
+          workarea.css('cursor', zoomInIcon);
+        }
+      });
+
+      editor.setPanning = function (active) {
+        svgCanvas.spaceKey = keypan = active;
+      };
+    }());
+
+    (function () {
+      var button = $('#main_icon');
+      var overlay = $('#main_icon span');
+      var list = $('#main_menu');
+      var onButton = false;
+      var height = 0;
+      var jsHover = true;
+      var setClick = false;
+
+      /*
+      // Currently unused
+      var hideMenu = function () {
+        list.fadeOut(200);
+      };
+      */
+
+      $(window).mouseup(function (evt) {
+        if (!onButton) {
+          button.removeClass('buttondown');
+          // do not hide if it was the file input as that input needs to be visible
+          // for its change event to fire
+          if (evt.target.tagName !== 'INPUT') {
+            list.fadeOut(200);
+          } else if (!setClick) {
+            setClick = true;
+            $(evt.target).click(function () {
+              list.css('margin-left', '-9999px').show();
+            });
+          }
+        }
+        onButton = false;
+      }).mousedown(function (evt) {
+        // $('.contextMenu').hide();
+        var islib = $(evt.target).closest('div.tools_flyout, .contextMenu').length;
+        if (!islib) {
+          $('.tools_flyout:visible,.contextMenu').fadeOut(250);
+        }
+      });
+
+      overlay.bind('mousedown', function () {
+        if (!button.hasClass('buttondown')) {
+          // Margin must be reset in case it was changed before;
+          list.css('margin-left', 0).show();
+          if (!height) {
+            height = list.height();
+          }
+          // Using custom animation as slideDown has annoying 'bounce effect'
+          list.css('height', 0).animate({
+            'height': height
+          }, 200);
+          onButton = true;
+        } else {
+          list.fadeOut(200);
+        }
+        button.toggleClass('buttondown buttonup');
+      }).hover(function () {
+        onButton = true;
+      }).mouseout(function () {
+        onButton = false;
+      });
+
+      var listItems = $('#main_menu li');
+
+      // Check if JS method of hovering needs to be used (Webkit bug)
+      listItems.mouseover(function () {
+        jsHover = ($(this).css('background-color') === 'rgba(0, 0, 0, 0)');
+
+        listItems.unbind('mouseover');
+        if (jsHover) {
+          listItems.mouseover(function () {
+            this.style.backgroundColor = '#FFC';
+          }).mouseout(function () {
+            this.style.backgroundColor = 'transparent';
+            return true;
+          });
+        }
+      });
+    }());
+    // Made public for UI customization.
+    // TODO: Group UI functions into a public editor.ui interface.
+    editor.addDropDown = function (elem, callback, dropUp) {
+      if ($(elem).length === 0) { return; } // Quit if called on non-existant element
+      var button = $(elem).find('button');
+      var list = $(elem).find('ul').attr('id', $(elem)[0].id + '-list');
+      var onButton = false;
+      if (dropUp) {
+        $(elem).addClass('dropup');
+      } else {
+        // Move list to place where it can overflow container
+        $('#option_lists').append(list);
+      }
+      list.find('li').bind('mouseup', callback);
+
+      $(window).mouseup(function (evt) {
+        if (!onButton) {
+          button.removeClass('down');
+          list.hide();
+        }
+        onButton = false;
+      });
+
+      button.bind('mousedown', function () {
+        if (!button.hasClass('down')) {
+          if (!dropUp) {
+            var pos = $(elem).position();
+            list.css({
+              top: pos.top + 24,
+              left: pos.left - 10
+            });
+          }
+          list.show();
+          onButton = true;
+        } else {
+          list.hide();
+        }
+        button.toggleClass('down');
+      }).hover(function () {
+        onButton = true;
+      }).mouseout(function () {
+        onButton = false;
+      });
+    };
+
+    editor.addDropDown('#font_family_dropdown', function () {
+      $('#font_family').val($(this).text()).change();
+    });
+
+    editor.addDropDown('#opacity_dropdown', function () {
+      if ($(this).find('div').length) { return; }
+      var perc = parseInt($(this).text().split('%')[0], 10);
+      changeOpacity(false, perc);
+    }, true);
+
+    // For slider usage, see: http://jqueryui.com/demos/slider/
+    $('#opac_slider').slider({
+      start: function () {
+        $('#opacity_dropdown li:not(.special)').hide();
+      },
+      stop: function () {
+        $('#opacity_dropdown li').show();
+        $(window).mouseup();
+      },
+      slide: function (evt, ui) {
+        changeOpacity(ui);
+      }
+    });
+
+    editor.addDropDown('#blur_dropdown', $.noop);
+
+    var slideStart = false;
+
+    $('#blur_slider').slider({
+      max: 10,
+      step: 0.1,
+      stop: function (evt, ui) {
+        slideStart = false;
+        changeBlur(ui);
+        $('#blur_dropdown li').show();
+        $(window).mouseup();
+      },
+      start: function () {
+        slideStart = true;
+      },
+      slide: function (evt, ui) {
+        changeBlur(ui, null, slideStart);
+      }
+    });
+
+    editor.addDropDown('#zoom_dropdown', function () {
+      var item = $(this);
+      var val = item.data('val');
+      if (val) {
+        zoomChanged(window, val);
+      } else {
+        changeZoom({value: parseFloat(item.text())});
+      }
+    }, true);
+
+    addAltDropDown('#stroke_linecap', '#linecap_opts', function () {
+      setStrokeOpt(this, true);
+    }, {dropUp: true});
+
+    addAltDropDown('#stroke_linejoin', '#linejoin_opts', function () {
+      setStrokeOpt(this, true);
+    }, {dropUp: true});
+
+    addAltDropDown('#tool_position', '#position_opts', function () {
+      var letter = this.id.replace('tool_pos', '').charAt(0);
+      svgCanvas.alignSelectedElements(letter, 'page');
+    }, {multiclick: true});
+
+    /*
+
+    When a flyout icon is selected
+      (if flyout) {
+      - Change the icon
+      - Make pressing the button run its stuff
+      }
+      - Run its stuff
+
+    When its shortcut key is pressed
+      - If not current in list, do as above
+      , else:
+      - Just run its stuff
+
+    */
+
+    // Unfocus text input when workarea is mousedowned.
+    (function () {
+      var inp;
+      var unfocus = function () {
+        $(inp).blur();
+      };
+
+      $('#svg_editor').find('button, select, input:not(#text)').focus(function () {
+        inp = this;
+        uiContext = 'toolbars';
+        workarea.mousedown(unfocus);
+      }).blur(function () {
+        uiContext = 'canvas';
+        workarea.unbind('mousedown', unfocus);
+        // Go back to selecting text if in textedit mode
+        if (svgCanvas.getMode() === 'textedit') {
+          $('#text').focus();
+        }
+      });
+    }());
+
+    var clickFHPath = function () {
+      if (toolButtonClick('#tool_fhpath')) {
+        svgCanvas.setMode('fhpath');
+      }
+    };
+
+    var clickLine = function () {
+      if (toolButtonClick('#tool_line')) {
+        svgCanvas.setMode('line');
+      }
+    };
+
+    var clickSquare = function () {
+      if (toolButtonClick('#tool_square')) {
+        svgCanvas.setMode('square');
+      }
+    };
+
+    var clickRect = function () {
+      if (toolButtonClick('#tool_rect')) {
+        svgCanvas.setMode('rect');
+      }
+    };
+
+    var clickFHRect = function () {
+      if (toolButtonClick('#tool_fhrect')) {
+        svgCanvas.setMode('fhrect');
+      }
+    };
+
+    var clickCircle = function () {
+      if (toolButtonClick('#tool_circle')) {
+        svgCanvas.setMode('circle');
+      }
+    };
+
+    var clickEllipse = function () {
+      if (toolButtonClick('#tool_ellipse')) {
+        svgCanvas.setMode('ellipse');
+      }
+    };
+
+    var clickFHEllipse = function () {
+      if (toolButtonClick('#tool_fhellipse')) {
+        svgCanvas.setMode('fhellipse');
+      }
+    };
+
+    var clickImage = function () {
+      if (toolButtonClick('#tool_image')) {
+        svgCanvas.setMode('image');
+      }
+    };
+
+    var clickZoom = function () {
+      if (toolButtonClick('#tool_zoom')) {
+        svgCanvas.setMode('zoom');
+        workarea.css('cursor', zoomInIcon);
+      }
+    };
+
+    var zoomImage = function (multiplier) {
+      var res = svgCanvas.getResolution();
+      multiplier = multiplier ? res.zoom * multiplier : 1;
+      // setResolution(res.w * multiplier, res.h * multiplier, true);
+      $('#zoom').val(multiplier * 100);
+      svgCanvas.setZoom(multiplier);
+      zoomDone();
+      updateCanvas(true);
+    };
+
+    var dblclickZoom = function () {
+      if (toolButtonClick('#tool_zoom')) {
+        zoomImage();
+        setSelectMode();
+      }
+    };
+
+    var clickText = function () {
+      if (toolButtonClick('#tool_text')) {
+        svgCanvas.setMode('text');
+      }
+    };
+
+    var clickPath = function () {
+      if (toolButtonClick('#tool_path')) {
+        svgCanvas.setMode('path');
+      }
+    };
+
+    // Delete is a contextual tool that only appears in the ribbon if
+    // an element has been selected
+    var deleteSelected = function () {
+      if (selectedElement != null || multiselected) {
+        svgCanvas.deleteSelectedElements();
+      }
+    };
+
+    var cutSelected = function () {
+      if (selectedElement != null || multiselected) {
+        svgCanvas.cutSelectedElements();
+      }
+    };
+
+    var copySelected = function () {
+      if (selectedElement != null || multiselected) {
+        svgCanvas.copySelectedElements();
+      }
+    };
+
+    var pasteInCenter = function () {
+      var zoom = svgCanvas.getZoom();
+      var x = (workarea[0].scrollLeft + workarea.width() / 2) / zoom - svgCanvas.contentW;
+      var y = (workarea[0].scrollTop + workarea.height() / 2) / zoom - svgCanvas.contentH;
+      svgCanvas.pasteElements('point', x, y);
+    };
+
+    var moveToTopSelected = function () {
+      if (selectedElement != null) {
+        svgCanvas.moveToTopSelectedElement();
+      }
+    };
+
+    var moveToBottomSelected = function () {
+      if (selectedElement != null) {
+        svgCanvas.moveToBottomSelectedElement();
+      }
+    };
+
+    var moveUpDownSelected = function (dir) {
+      if (selectedElement != null) {
+        svgCanvas.moveUpDownSelected(dir);
+      }
+    };
+
+    var convertToPath = function () {
+      if (selectedElement != null) {
+        svgCanvas.convertToPath();
+      }
+    };
+
+    var reorientPath = function () {
+      if (selectedElement != null) {
+        path.reorient();
+      }
+    };
+
+    var makeHyperlink = function () {
+      if (selectedElement != null || multiselected) {
+        $.prompt(uiStrings.notification.enterNewLinkURL, 'http://', function (url) {
+          if (url) { svgCanvas.makeHyperlink(url); }
+        });
+      }
+    };
+
+    var moveSelected = function (dx, dy) {
+      if (selectedElement != null || multiselected) {
+        if (curConfig.gridSnapping) {
+          // Use grid snap value regardless of zoom level
+          var multi = svgCanvas.getZoom() * curConfig.snappingStep;
+          dx *= multi;
+          dy *= multi;
+        }
+        svgCanvas.moveSelectedElements(dx, dy);
+      }
+    };
+
+    var linkControlPoints = function () {
+      $('#tool_node_link').toggleClass('push_button_pressed tool_button');
+      var linked = $('#tool_node_link').hasClass('push_button_pressed');
+      path.linkControlPoints(linked);
+    };
+
+    var clonePathNode = function () {
+      if (path.getNodePoint()) {
+        path.clonePathNode();
+      }
+    };
+
+    var deletePathNode = function () {
+      if (path.getNodePoint()) {
+        path.deletePathNode();
+      }
+    };
+
+    var addSubPath = function () {
+      var button = $('#tool_add_subpath');
+      var sp = !button.hasClass('push_button_pressed');
+      button.toggleClass('push_button_pressed tool_button');
+      path.addSubPath(sp);
+    };
+
+    var opencloseSubPath = function () {
+      path.opencloseSubPath();
+    };
+
+    var selectNext = function () {
+      svgCanvas.cycleElement(1);
+    };
+
+    var selectPrev = function () {
+      svgCanvas.cycleElement(0);
+    };
+
+    var rotateSelected = function (cw, step) {
+      if (selectedElement == null || multiselected) { return; }
+      if (!cw) { step *= -1; }
+      var angle = parseFloat($('#angle').val()) + step;
+      svgCanvas.setRotationAngle(angle);
+      updateContextPanel();
+    };
+
+    var clickClear = function () {
+      var dims = curConfig.dimensions;
+      $.confirm(uiStrings.notification.QwantToClear, function (ok) {
+        if (!ok) { return; }
+        setSelectMode();
+        svgCanvas.clear();
+        svgCanvas.setResolution(dims[0], dims[1]);
+        updateCanvas(true);
+        zoomImage();
+        populateLayers();
+        updateContextPanel();
+        prepPaints();
+        svgCanvas.runExtensions('onNewDocument');
+      });
+    };
+
+    var clickBold = function () {
+      svgCanvas.setBold(!svgCanvas.getBold());
+      updateContextPanel();
+      return false;
+    };
+
+    var clickItalic = function () {
+      svgCanvas.setItalic(!svgCanvas.getItalic());
+      updateContextPanel();
+      return false;
+    };
+
+    var clickSave = function () {
+      // In the future, more options can be provided here
+      var saveOpts = {
+        'images': $.pref('img_save'),
+        'round_digits': 6
+      };
+      svgCanvas.save(saveOpts);
+    };
+
+    var loadingURL;
+    var clickExport = function () {
+      $.select('Select an image type for export: ', [
+        // See http://kangax.github.io/jstests/toDataUrl_mime_type_test/ for a useful list of MIME types and browser support
+        // 'ICO', // Todo: Find a way to preserve transparency in SVG-Edit if not working presently and do full packaging for x-icon; then switch back to position after 'PNG'
+        'PNG',
+        'JPEG', 'BMP', 'WEBP', 'PDF'
+      ], function (imgType) { // todo: replace hard-coded msg with uiStrings.notification.
+        if (!imgType) {
+          return;
+        }
+        // Open placeholder window (prevents popup)
+        var exportWindowName;
+        function openExportWindow () {
+          var str = uiStrings.notification.loadingImage;
+          if (curConfig.exportWindowType === 'new') {
+            editor.exportWindowCt++;
+          }
+          exportWindowName = curConfig.canvasName + editor.exportWindowCt;
+          var popHTML, popURL;
+          if (loadingURL) {
+            popURL = loadingURL;
+          } else {
+            popHTML = '<!DOCTYPE html><html><head><meta charset="utf-8"><title>' + str + '</title></head><body><h1>' + str + '</h1></body><html>';
+            if (typeof URL && URL.createObjectURL) {
+              var blob = new Blob([popHTML], {type: 'text/html'});
+              popURL = URL.createObjectURL(blob);
+            } else {
+              popURL = 'data:text/html;base64;charset=utf-8,' + svgedit.utilities.encode64(popHTML);
+            }
+            loadingURL = popURL;
+          }
+          exportWindow = window.open(popURL, exportWindowName);
+        }
+        if (imgType === 'PDF') {
+          if (!customExportPDF) {
+            openExportWindow();
+          }
+          svgCanvas.exportPDF(exportWindowName);
+        } else {
+          if (!customExportImage) {
+            openExportWindow();
+          }
+          var quality = parseInt($('#image-slider').val(), 10) / 100;
+          svgCanvas.rasterExport(imgType, quality, exportWindowName);
+        }
+      }, function () {
+        var sel = $(this);
+        if (sel.val() === 'JPEG' || sel.val() === 'WEBP') {
+          if (!$('#image-slider').length) {
+            $('<div><label>Quality: <input id="image-slider" type="range" min="1" max="100" value="92" /></label></div>').appendTo(sel.parent()); // Todo: i18n-ize label
+          }
+        } else {
+          $('#image-slider').parent().remove();
+        }
+      });
+    };
+
+    // by default, svgCanvas.open() is a no-op.
+    // it is up to an extension mechanism (opera widget, etc)
+    // to call setCustomHandlers() which will make it do something
+    var clickOpen = function () {
+      svgCanvas.open();
+    };
+
+    var clickImport = function () {
+    };
+
+    var clickUndo = function () {
+      if (undoMgr.getUndoStackSize() > 0) {
+        undoMgr.undo();
+        populateLayers();
+      }
+    };
+
+    var clickRedo = function () {
+      if (undoMgr.getRedoStackSize() > 0) {
+        undoMgr.redo();
+        populateLayers();
+      }
+    };
+
+    var clickGroup = function () {
+      // group
+      if (multiselected) {
+        svgCanvas.groupSelectedElements();
+      // ungroup
+      } else if (selectedElement) {
+        svgCanvas.ungroupSelectedElement();
+      }
+    };
+
+    var clickClone = function () {
+      svgCanvas.cloneSelectedElements(20, 20);
+    };
+
+    var clickAlign = function () {
+      var letter = this.id.replace('tool_align', '').charAt(0);
+      svgCanvas.alignSelectedElements(letter, $('#align_relative_to').val());
+    };
+
+    var clickWireframe = function () {
+      $('#tool_wireframe').toggleClass('push_button_pressed tool_button');
+      workarea.toggleClass('wireframe');
+
+      if (supportsNonSS) { return; }
+      var wfRules = $('#wireframe_rules');
+      if (!wfRules.length) {
+        wfRules = $('<style id="wireframe_rules"></style>').appendTo('head');
+      } else {
+        wfRules.empty();
+      }
+
+      updateWireFrame();
+    };
+
+    $('#svg_docprops_container, #svg_prefs_container').draggable({cancel: 'button,fieldset', containment: 'window'});
+
+    var showDocProperties = function () {
+      if (docprops) { return; }
+      docprops = true;
+
+      // This selects the correct radio button by using the array notation
+      $('#image_save_opts input').val([$.pref('img_save')]);
+
+      // update resolution option with actual resolution
+      var res = svgCanvas.getResolution();
+      if (curConfig.baseUnit !== 'px') {
+        res.w = svgedit.units.convertUnit(res.w) + curConfig.baseUnit;
+        res.h = svgedit.units.convertUnit(res.h) + curConfig.baseUnit;
+      }
+
+      $('#canvas_width').val(res.w);
+      $('#canvas_height').val(res.h);
+      $('#canvas_title').val(svgCanvas.getDocumentTitle());
+
+      $('#svg_docprops').show();
+    };
+
+    var showPreferences = function () {
+      if (preferences) { return; }
+      preferences = true;
+      $('#main_menu').hide();
+
+      // Update background color with current one
+      var blocks = $('#bg_blocks div');
+      var curBg = 'cur_background';
+      var canvasBg = curPrefs.bkgd_color;
+      var url = $.pref('bkgd_url');
+      blocks.each(function () {
+        var blk = $(this);
+        var isBg = blk.css('background-color') === canvasBg;
+        blk.toggleClass(curBg, isBg);
+        if (isBg) { $('#canvas_bg_url').removeClass(curBg); }
+      });
+      if (!canvasBg) { blocks.eq(0).addClass(curBg); }
+      if (url) {
+        $('#canvas_bg_url').val(url);
+      }
+      $('#grid_snapping_on').prop('checked', curConfig.gridSnapping);
+      $('#grid_snapping_step').attr('value', curConfig.snappingStep);
+      $('#grid_color').attr('value', curConfig.gridColor);
+
+      $('#svg_prefs').show();
+    };
+
+    var hideSourceEditor = function () {
+      $('#svg_source_editor').hide();
+      editingsource = false;
+      $('#svg_source_textarea').blur();
+    };
+
+    var saveSourceEditor = function () {
+      if (!editingsource) { return; }
+
+      var saveChanges = function () {
+        svgCanvas.clearSelection();
+        hideSourceEditor();
+        zoomImage();
+        populateLayers();
+        updateTitle();
+        prepPaints();
+      };
+
+      if (!svgCanvas.setSvgString($('#svg_source_textarea').val())) {
+        $.confirm(uiStrings.notification.QerrorsRevertToSource, function (ok) {
+          if (!ok) { return false; }
+          saveChanges();
+        });
+      } else {
+        saveChanges();
+      }
+      setSelectMode();
+    };
+
+    var hideDocProperties = function () {
+      $('#svg_docprops').hide();
+      $('#canvas_width,#canvas_height').removeAttr('disabled');
+      $('#resolution')[0].selectedIndex = 0;
+      $('#image_save_opts input').val([$.pref('img_save')]);
+      docprops = false;
+    };
+
+    var hidePreferences = function () {
+      $('#svg_prefs').hide();
+      preferences = false;
+    };
+
+    var saveDocProperties = function () {
+      // set title
+      var newTitle = $('#canvas_title').val();
+      updateTitle(newTitle);
+      svgCanvas.setDocumentTitle(newTitle);
+
+      // update resolution
+      var width = $('#canvas_width'), w = width.val();
+      var height = $('#canvas_height'), h = height.val();
+
+      if (w !== 'fit' && !svgedit.units.isValidUnit('width', w)) {
+        $.alert(uiStrings.notification.invalidAttrValGiven);
+        width.parent().addClass('error');
+        return false;
+      }
+
+      width.parent().removeClass('error');
+
+      if (h !== 'fit' && !svgedit.units.isValidUnit('height', h)) {
+        $.alert(uiStrings.notification.invalidAttrValGiven);
+        height.parent().addClass('error');
+        return false;
+      }
+
+      height.parent().removeClass('error');
+
+      if (!svgCanvas.setResolution(w, h)) {
+        $.alert(uiStrings.notification.noContentToFitTo);
+        return false;
+      }
+
+      // Set image save option
+      $.pref('img_save', $('#image_save_opts :checked').val());
+      updateCanvas();
+      hideDocProperties();
+    };
+
+    var savePreferences = editor.savePreferences = function () {
+      // Set background
+      var color = $('#bg_blocks div.cur_background').css('background-color') || '#FFF';
+      setBackground(color, $('#canvas_bg_url').val());
+
+      // set language
+      var lang = $('#lang_select').val();
+      if (lang !== $.pref('lang')) {
+        editor.putLocale(lang, goodLangs);
+      }
+
+      // set icon size
+      setIconSize($('#iconsize').val());
+
+      // set grid setting
+      curConfig.gridSnapping = $('#grid_snapping_on')[0].checked;
+      curConfig.snappingStep = $('#grid_snapping_step').val();
+      curConfig.gridColor = $('#grid_color').val();
+      curConfig.showRulers = $('#show_rulers')[0].checked;
+
+      $('#rulers').toggle(curConfig.showRulers);
+      if (curConfig.showRulers) { updateRulers(); }
+      curConfig.baseUnit = $('#base_unit').val();
+
+      svgCanvas.setConfig(curConfig);
+
+      updateCanvas();
+      hidePreferences();
+    };
+
+    var resetScrollPos = $.noop;
+
+    var cancelOverlays = function () {
+      $('#dialog_box').hide();
+      if (!editingsource && !docprops && !preferences) {
+        if (curContext) {
+          svgCanvas.leaveContext();
+        }
+        return;
+      }
+
+      if (editingsource) {
+        if (origSource !== $('#svg_source_textarea').val()) {
+          $.confirm(uiStrings.notification.QignoreSourceChanges, function (ok) {
+            if (ok) { hideSourceEditor(); }
+          });
+        } else {
+          hideSourceEditor();
+        }
+      } else if (docprops) {
+        hideDocProperties();
+      } else if (preferences) {
+        hidePreferences();
+      }
+      resetScrollPos();
+    };
+
+    var winWh = {width: $(window).width(), height: $(window).height()};
+
+    // Fix for Issue 781: Drawing area jumps to top-left corner on window resize (IE9)
+    if (svgedit.browser.isIE()) {
+      (function () {
+        resetScrollPos = function () {
+          if (workarea[0].scrollLeft === 0 && workarea[0].scrollTop === 0) {
+            workarea[0].scrollLeft = curScrollPos.left;
+            workarea[0].scrollTop = curScrollPos.top;
+          }
+        };
+
+        curScrollPos = {
+          left: workarea[0].scrollLeft,
+          top: workarea[0].scrollTop
+        };
+
+        $(window).resize(resetScrollPos);
+        editor.ready(function () {
+          // TODO: Find better way to detect when to do this to minimize
+          // flickering effect
+          setTimeout(function () {
+            resetScrollPos();
+          }, 500);
+        });
+
+        workarea.scroll(function () {
+          curScrollPos = {
+            left: workarea[0].scrollLeft,
+            top: workarea[0].scrollTop
+          };
+        });
+      }());
+    }
+
+    $(window).resize(function (evt) {
+      $.each(winWh, function (type, val) {
+        var curval = $(window)[type]();
+        workarea[0]['scroll' + (type === 'width' ? 'Left' : 'Top')] -= (curval - val) / 2;
+        winWh[type] = curval;
+      });
+      setFlyoutPositions();
+    });
+
+    (function () {
+      workarea.scroll(function () {
+        // TODO: jQuery's scrollLeft/Top() wouldn't require a null check
+        if ($('#ruler_x').length !== 0) {
+          $('#ruler_x')[0].scrollLeft = workarea[0].scrollLeft;
+        }
+        if ($('#ruler_y').length !== 0) {
+          $('#ruler_y')[0].scrollTop = workarea[0].scrollTop;
+        }
+      });
+    }());
+
+    $('#url_notice').click(function () {
+      $.alert(this.title);
+    });
+
+    $('#change_image_url').click(promptImgURL);
+
+    // added these event handlers for all the push buttons so they
+    // behave more like buttons being pressed-in and not images
+    (function () {
+      var toolnames = ['clear', 'open', 'save', 'source', 'delete', 'delete_multi', 'paste', 'clone', 'clone_multi', 'move_top', 'move_bottom'];
+      var allTools = '';
+      var curClass = 'tool_button_current';
+
+      $.each(toolnames, function (i, item) {
+        allTools += (i ? ',' : '') + '#tool_' + item;
+      });
+
+      $(allTools).mousedown(function () {
+        $(this).addClass(curClass);
+      }).bind('mousedown mouseout', function () {
+        $(this).removeClass(curClass);
+      });
+
+      $('#tool_undo, #tool_redo').mousedown(function () {
+        if (!$(this).hasClass('disabled')) { $(this).addClass(curClass); }
+      }).bind('mousedown mouseout', function () {
+        $(this).removeClass(curClass);
+      });
+    }());
+
+    // switch modifier key in tooltips if mac
+    // NOTE: This code is not used yet until I can figure out how to successfully bind ctrl/meta
+    // in Opera and Chrome
+    if (svgedit.browser.isMac() && !window.opera) {
+      var shortcutButtons = ['tool_clear', 'tool_save', 'tool_source', 'tool_undo', 'tool_redo', 'tool_clone'];
+      i = shortcutButtons.length;
+      while (i--) {
+        var button = document.getElementById(shortcutButtons[i]);
+        if (button) {
+          var title = button.title;
+          var index = title.indexOf('Ctrl+');
+          button.title = [title.substr(0, index), 'Cmd+', title.substr(index + 5)].join('');
+        }
+      }
+    }
+
+    // TODO: go back to the color boxes having white background-color and then setting
+    //	background-image to none.png (otherwise partially transparent gradients look weird)
+    var colorPicker = function (elem) {
+      var picker = elem.attr('id') === 'stroke_color' ? 'stroke' : 'fill';
+      // var opacity = (picker == 'stroke' ? $('#stroke_opacity') : $('#fill_opacity'));
+      var paint = paintBox[picker].paint;
+      var title = (picker === 'stroke' ? 'Pick a Stroke Paint and Opacity' : 'Pick a Fill Paint and Opacity');
+      // var was_none = false; // Currently unused
+      var pos = elem.offset();
+      $('#color_picker')
+        .draggable({cancel: '.jGraduate_tabs, .jGraduate_colPick, .jGraduate_gradPick, .jPicker', containment: 'window'})
+        .css(curConfig.colorPickerCSS || {'left': pos.left - 140, 'bottom': 40})
+        .jGraduate(
+          {
+            paint: paint,
+            window: { pickerTitle: title },
+            images: { clientPath: curConfig.jGraduatePath },
+            newstop: 'inverse'
+          },
+          function (p) {
+            paint = new $.jGraduate.Paint(p);
+            paintBox[picker].setPaint(paint);
+            svgCanvas.setPaint(picker, paint);
+            $('#color_picker').hide();
+          },
+          function () {
+            $('#color_picker').hide();
+          }
+        );
+    };
+
+    var PaintBox = function (container, type) {
+      var paintColor, paintOpacity,
+        cur = curConfig[type === 'fill' ? 'initFill' : 'initStroke'];
+      // set up gradients to be used for the buttons
+      var svgdocbox = new DOMParser().parseFromString(
+        '<svg xmlns="http://www.w3.org/2000/svg"><rect width="16.5" height="16.5"' +
 '					fill="#' + cur.color + '" opacity="' + cur.opacity + '"/>' +
 '					<defs><linearGradient id="gradbox_"/></defs></svg>', 'text/xml');
-			var docElem = svgdocbox.documentElement;
-
-			docElem = $(container)[0].appendChild(document.importNode(docElem, true));
-			docElem.setAttribute('width', 16.5);
-
-			this.rect = docElem.firstChild;
-			this.defs = docElem.getElementsByTagName('defs')[0];
-			this.grad = this.defs.firstChild;
-			this.paint = new $.jGraduate.Paint({solidColor: cur.color});
-			this.type = type;
-
-			this.setPaint = function (paint, apply) {
-				this.paint = paint;
-
-				var fillAttr = 'none';
-				var ptype = paint.type;
-				var opac = paint.alpha / 100;
-
-				switch (ptype) {
-				case 'solidColor':
-					fillAttr = (paint[ptype] !== 'none') ? '#' + paint[ptype] : paint[ptype];
-					break;
-				case 'linearGradient':
-				case 'radialGradient':
-					this.defs.removeChild(this.grad);
-					this.grad = this.defs.appendChild(paint[ptype]);
-					var id = this.grad.id = 'gradbox_' + this.type;
-					fillAttr = 'url(#' + id + ')';
-					break;
-				}
-
-				this.rect.setAttribute('fill', fillAttr);
-				this.rect.setAttribute('opacity', opac);
-
-				if (apply) {
-					svgCanvas.setColor(this.type, paintColor, true);
-					svgCanvas.setPaintOpacity(this.type, paintOpacity, true);
-				}
-			};
-
-			this.update = function (apply) {
-				if (!selectedElement) { return; }
-				var i, len;
-				var type = this.type;
-				switch (selectedElement.tagName) {
-				case 'use':
-				case 'image':
-				case 'foreignObject':
-					// These elements don't have fill or stroke, so don't change
-					// the current value
-					return;
-				case 'g':
-				case 'a':
-					var gPaint = null;
-
-					var childs = selectedElement.getElementsByTagName('*');
-					for (i = 0, len = childs.length; i < len; i++) {
-						var elem = childs[i];
-						var p = elem.getAttribute(type);
-						if (i === 0) {
-							gPaint = p;
-						} else if (gPaint !== p) {
-							gPaint = null;
-							break;
-						}
-					}
-
-					if (gPaint === null) {
-						// No common color, don't update anything
-						paintColor = null;
-						return;
-					}
-					paintColor = gPaint;
-					paintOpacity = 1;
-					break;
-				default:
-					paintOpacity = parseFloat(selectedElement.getAttribute(type + '-opacity'));
-					if (isNaN(paintOpacity)) {
-						paintOpacity = 1.0;
-					}
-
-					var defColor = type === 'fill' ? 'black' : 'none';
-					paintColor = selectedElement.getAttribute(type) || defColor;
-				}
-
-				if (apply) {
-					svgCanvas.setColor(type, paintColor, true);
-					svgCanvas.setPaintOpacity(type, paintOpacity, true);
-				}
-
-				paintOpacity *= 100;
-
-				var paint = getPaint(paintColor, paintOpacity, type);
-				// update the rect inside #fill_color/#stroke_color
-				this.setPaint(paint);
-			};
-
-			this.prep = function () {
-				var ptype = this.paint.type;
-
-				switch (ptype) {
-				case 'linearGradient':
-				case 'radialGradient':
-					var paint = new $.jGraduate.Paint({copy: this.paint});
-					svgCanvas.setPaint(type, paint);
-					break;
-				}
-			};
-		};
-
-		paintBox.fill = new PaintBox('#fill_color', 'fill');
-		paintBox.stroke = new PaintBox('#stroke_color', 'stroke');
-
-		$('#stroke_width').val(curConfig.initStroke.width);
-		$('#group_opacity').val(curConfig.initOpacity * 100);
-
-		// Use this SVG elem to test vectorEffect support
-		var testEl = paintBox.fill.rect.cloneNode(false);
-		testEl.setAttribute('style', 'vector-effect:non-scaling-stroke');
-		supportsNonSS = (testEl.style.vectorEffect === 'non-scaling-stroke');
-		testEl.removeAttribute('style');
-		var svgdocbox = paintBox.fill.rect.ownerDocument;
-		// Use this to test support for blur element. Seems to work to test support in Webkit
-		var blurTest = svgdocbox.createElementNS(svgedit.NS.SVG, 'feGaussianBlur');
-		if (blurTest.stdDeviationX === undefined) {
-			$('#tool_blur').hide();
-		}
-		$(blurTest).remove();
-
-		// Test for zoom icon support
-		(function () {
-			var pre = '-' + uaPrefix.toLowerCase() + '-zoom-';
-			var zoom = pre + 'in';
-			workarea.css('cursor', zoom);
-			if (workarea.css('cursor') === zoom) {
-				zoomInIcon = zoom;
-				zoomOutIcon = pre + 'out';
-			}
-			workarea.css('cursor', 'auto');
-		}());
-
-		// Test for embedImage support (use timeout to not interfere with page load)
-		setTimeout(function () {
-			svgCanvas.embedImage('images/logo.png', function (datauri) {
-				if (!datauri) {
-					// Disable option
-					$('#image_save_opts [value=embed]').attr('disabled', 'disabled');
-					$('#image_save_opts input').val(['ref']);
-					$.pref('img_save', 'ref');
-					$('#image_opt_embed').css('color', '#666').attr('title', uiStrings.notification.featNotSupported);
-				}
-			});
-		}, 1000);
-
-		$('#fill_color, #tool_fill .icon_label').click(function () {
-			colorPicker($('#fill_color'));
-			updateToolButtonState();
-		});
-
-		$('#stroke_color, #tool_stroke .icon_label').click(function () {
-			colorPicker($('#stroke_color'));
-			updateToolButtonState();
-		});
-
-		$('#group_opacityLabel').click(function () {
-			$('#opacity_dropdown button').mousedown();
-			$(window).mouseup();
-		});
-
-		$('#zoomLabel').click(function () {
-			$('#zoom_dropdown button').mousedown();
-			$(window).mouseup();
-		});
-
-		$('#tool_move_top').mousedown(function (evt) {
-			$('#tools_stacking').show();
-			evt.preventDefault();
-		});
-
-		$('.layer_button').mousedown(function () {
-			$(this).addClass('layer_buttonpressed');
-		}).mouseout(function () {
-			$(this).removeClass('layer_buttonpressed');
-		}).mouseup(function () {
-			$(this).removeClass('layer_buttonpressed');
-		});
-
-		$('.push_button').mousedown(function () {
-			if (!$(this).hasClass('disabled')) {
-				$(this).addClass('push_button_pressed').removeClass('push_button');
-			}
-		}).mouseout(function () {
-			$(this).removeClass('push_button_pressed').addClass('push_button');
-		}).mouseup(function () {
-			$(this).removeClass('push_button_pressed').addClass('push_button');
-		});
-
-		// ask for a layer name
-		$('#layer_new').click(function () {
-			var uniqName,
-				i = svgCanvas.getCurrentDrawing().getNumLayers();
-			do {
-				uniqName = uiStrings.layers.layer + ' ' + (++i);
-			} while (svgCanvas.getCurrentDrawing().hasLayer(uniqName));
-
-			$.prompt(uiStrings.notification.enterUniqueLayerName, uniqName, function (newName) {
-				if (!newName) { return; }
-				if (svgCanvas.getCurrentDrawing().hasLayer(newName)) {
-					$.alert(uiStrings.notification.dupeLayerName);
-					return;
-				}
-				svgCanvas.createLayer(newName);
-				updateContextPanel();
-				populateLayers();
-			});
-		});
-
-		function deleteLayer () {
-			if (svgCanvas.deleteCurrentLayer()) {
-				updateContextPanel();
-				populateLayers();
-				// This matches what SvgCanvas does
-				// TODO: make this behavior less brittle (svg-editor should get which
-				// layer is selected from the canvas and then select that one in the UI)
-				$('#layerlist tr.layer').removeClass('layersel');
-				$('#layerlist tr.layer:first').addClass('layersel');
-			}
-		}
-
-		function cloneLayer () {
-			var name = svgCanvas.getCurrentDrawing().getCurrentLayerName() + ' copy';
-
-			$.prompt(uiStrings.notification.enterUniqueLayerName, name, function (newName) {
-				if (!newName) { return; }
-				if (svgCanvas.getCurrentDrawing().hasLayer(newName)) {
-					$.alert(uiStrings.notification.dupeLayerName);
-					return;
-				}
-				svgCanvas.cloneLayer(newName);
-				updateContextPanel();
-				populateLayers();
-			});
-		}
-
-		function mergeLayer () {
-			if ($('#layerlist tr.layersel').index() === svgCanvas.getCurrentDrawing().getNumLayers() - 1) {
-				return;
-			}
-			svgCanvas.mergeLayer();
-			updateContextPanel();
-			populateLayers();
-		}
-
-		function moveLayer (pos) {
-			var curIndex = $('#layerlist tr.layersel').index();
-			var total = svgCanvas.getCurrentDrawing().getNumLayers();
-			if (curIndex > 0 || curIndex < total - 1) {
-				curIndex += pos;
-				svgCanvas.setCurrentLayerPosition(total - curIndex - 1);
-				populateLayers();
-			}
-		}
-
-		$('#layer_delete').click(deleteLayer);
-
-		$('#layer_up').click(function () {
-			moveLayer(-1);
-		});
-
-		$('#layer_down').click(function () {
-			moveLayer(1);
-		});
-
-		$('#layer_rename').click(function () {
-			// var curIndex = $('#layerlist tr.layersel').prevAll().length; // Currently unused
-			var oldName = $('#layerlist tr.layersel td.layername').text();
-			$.prompt(uiStrings.notification.enterNewLayerName, '', function (newName) {
-				if (!newName) { return; }
-				if (oldName === newName || svgCanvas.getCurrentDrawing().hasLayer(newName)) {
-					$.alert(uiStrings.notification.layerHasThatName);
-					return;
-				}
-
-				svgCanvas.renameCurrentLayer(newName);
-				populateLayers();
-			});
-		});
-
-		var SIDEPANEL_MAXWIDTH = 300;
-		var SIDEPANEL_OPENWIDTH = 150;
-		var sidedrag = -1, sidedragging = false, allowmove = false;
-
-		var changeSidePanelWidth = function (delta) {
-			var rulerX = $('#ruler_x');
-			$('#sidepanels').width('+=' + delta);
-			$('#layerpanel').width('+=' + delta);
-			rulerX.css('right', parseInt(rulerX.css('right'), 10) + delta);
-			workarea.css('right', parseInt(workarea.css('right'), 10) + delta);
-			svgCanvas.runExtensions('workareaResized');
-		};
-
-		var resizeSidePanel = function (evt) {
-			if (!allowmove) { return; }
-			if (sidedrag === -1) { return; }
-			sidedragging = true;
-			var deltaX = sidedrag - evt.pageX;
-			var sideWidth = $('#sidepanels').width();
-			if (sideWidth + deltaX > SIDEPANEL_MAXWIDTH) {
-				deltaX = SIDEPANEL_MAXWIDTH - sideWidth;
-				sideWidth = SIDEPANEL_MAXWIDTH;
-			} else if (sideWidth + deltaX < 2) {
-				deltaX = 2 - sideWidth;
-				sideWidth = 2;
-			}
-			if (deltaX === 0) { return; }
-			sidedrag -= deltaX;
-			changeSidePanelWidth(deltaX);
-		};
-
-		// if width is non-zero, then fully close it, otherwise fully open it
-		// the optional close argument forces the side panel closed
-		var toggleSidePanel = function (close) {
-			var w = $('#sidepanels').width();
-			var deltaX = (w > 2 || close ? 2 : SIDEPANEL_OPENWIDTH) - w;
-			changeSidePanelWidth(deltaX);
-		};
-
-		$('#sidepanel_handle')
-			.mousedown(function (evt) {
-				sidedrag = evt.pageX;
-				$(window).mousemove(resizeSidePanel);
-				allowmove = false;
-				// Silly hack for Chrome, which always runs mousemove right after mousedown
-				setTimeout(function () {
-					allowmove = true;
-				}, 20);
-			})
-			.mouseup(function (evt) {
-				if (!sidedragging) { toggleSidePanel(); }
-				sidedrag = -1;
-				sidedragging = false;
-			});
-
-		$(window).mouseup(function () {
-			sidedrag = -1;
-			sidedragging = false;
-			$('#svg_editor').unbind('mousemove', resizeSidePanel);
-		});
-
-		populateLayers();
-
-		// function changeResolution (x,y) {
-		// 	var zoom = svgCanvas.getResolution().zoom;
-		// 	setResolution(x * zoom, y * zoom);
-		// }
-
-		var centerCanvas = function () {
-			// this centers the canvas vertically in the workarea (horizontal handled in CSS)
-			workarea.css('line-height', workarea.height() + 'px');
-		};
-
-		$(window).bind('load resize', centerCanvas);
-
-		function stepFontSize (elem, step) {
-			var origVal = Number(elem.value);
-			var sugVal = origVal + step;
-			var increasing = sugVal >= origVal;
-			if (step === 0) { return origVal; }
-
-			if (origVal >= 24) {
-				if (increasing) {
-					return Math.round(origVal * 1.1);
-				}
-				return Math.round(origVal / 1.1);
-			}
-			if (origVal <= 1) {
-				if (increasing) {
-					return origVal * 2;
-				}
-				return origVal / 2;
-			}
-			return sugVal;
-		}
-
-		function stepZoom (elem, step) {
-			var origVal = Number(elem.value);
-			if (origVal === 0) { return 100; }
-			var sugVal = origVal + step;
-			if (step === 0) { return origVal; }
-
-			if (origVal >= 100) {
-				return sugVal;
-			}
-			if (sugVal >= origVal) {
-				return origVal * 2;
-			}
-			return origVal / 2;
-		}
-
-		// function setResolution (w, h, center) {
-		// 	updateCanvas();
-		// 	// w -= 0; h -= 0;
-		// 	// $('#svgcanvas').css({'width': w, 'height': h});
-		// 	// $('#canvas_width').val(w);
-		// 	// $('#canvas_height').val(h);
-		// 	//
-		// 	// if (center) {
-		// 	// 	var wArea = workarea;
-		// 	// 	var scrollY = h/2 - wArea.height()/2;
-		// 	// 	var scrollX = w/2 - wArea.width()/2;
-		// 	// 	wArea[0].scrollTop = scrollY;
-		// 	// 	wArea[0].scrollLeft = scrollX;
-		// 	// }
-		// }
-
-		$('#resolution').change(function () {
-			var wh = $('#canvas_width,#canvas_height');
-			if (!this.selectedIndex) {
-				if ($('#canvas_width').val() === 'fit') {
-					wh.removeAttr('disabled').val(100);
-				}
-			} else if (this.value === 'content') {
-				wh.val('fit').attr('disabled', 'disabled');
-			} else {
-				var dims = this.value.split('x');
-				$('#canvas_width').val(dims[0]);
-				$('#canvas_height').val(dims[1]);
-				wh.removeAttr('disabled');
-			}
-		});
-
-		// Prevent browser from erroneously repopulating fields
-		$('input,select').attr('autocomplete', 'off');
-
-		// Associate all button actions as well as non-button keyboard shortcuts
-		Actions = (function () {
-			// sel:'selector', fn:function, evt:'event', key:[key, preventDefault, NoDisableInInput]
-			var toolButtons = [
-				{sel: '#tool_select', fn: clickSelect, evt: 'click', key: ['V', true]},
-				{sel: '#tool_fhpath', fn: clickFHPath, evt: 'click', key: ['Q', true]},
-				{sel: '#tool_line', fn: clickLine, evt: 'click', key: ['L', true]},
-				{sel: '#tool_rect', fn: clickRect, evt: 'mouseup', key: ['R', true], parent: '#tools_rect', icon: 'rect'},
-				{sel: '#tool_square', fn: clickSquare, evt: 'mouseup', parent: '#tools_rect', icon: 'square'},
-				{sel: '#tool_fhrect', fn: clickFHRect, evt: 'mouseup', parent: '#tools_rect', icon: 'fh_rect'},
-				{sel: '#tool_ellipse', fn: clickEllipse, evt: 'mouseup', key: ['E', true], parent: '#tools_ellipse', icon: 'ellipse'},
-				{sel: '#tool_circle', fn: clickCircle, evt: 'mouseup', parent: '#tools_ellipse', icon: 'circle'},
-				{sel: '#tool_fhellipse', fn: clickFHEllipse, evt: 'mouseup', parent: '#tools_ellipse', icon: 'fh_ellipse'},
-				{sel: '#tool_path', fn: clickPath, evt: 'click', key: ['P', true]},
-				{sel: '#tool_text', fn: clickText, evt: 'click', key: ['T', true]},
-				{sel: '#tool_image', fn: clickImage, evt: 'mouseup'},
-				{sel: '#tool_zoom', fn: clickZoom, evt: 'mouseup', key: ['Z', true]},
-				{sel: '#tool_clear', fn: clickClear, evt: 'mouseup', key: ['N', true]},
-				{sel: '#tool_save', fn: function () {
-					if (editingsource) {
-						saveSourceEditor();
-					} else {
-						clickSave();
-					}
-				}, evt: 'mouseup', key: ['S', true]},
-				{sel: '#tool_export', fn: clickExport, evt: 'mouseup'},
-				{sel: '#tool_open', fn: clickOpen, evt: 'mouseup', key: ['O', true]},
-				{sel: '#tool_import', fn: clickImport, evt: 'mouseup'},
-				{sel: '#tool_source', fn: showSourceEditor, evt: 'click', key: ['U', true]},
-				{sel: '#tool_wireframe', fn: clickWireframe, evt: 'click', key: ['F', true]},
-				{sel: '#tool_source_cancel,.overlay,#tool_docprops_cancel,#tool_prefs_cancel', fn: cancelOverlays, evt: 'click', key: ['esc', false, false], hidekey: true},
-				{sel: '#tool_source_save', fn: saveSourceEditor, evt: 'click'},
-				{sel: '#tool_docprops_save', fn: saveDocProperties, evt: 'click'},
-				{sel: '#tool_docprops', fn: showDocProperties, evt: 'mouseup'},
-				{sel: '#tool_prefs_save', fn: savePreferences, evt: 'click'},
-				{sel: '#tool_prefs_option', fn: function () { showPreferences(); return false; }, evt: 'mouseup'},
-				{sel: '#tool_delete,#tool_delete_multi', fn: deleteSelected, evt: 'click', key: ['del/backspace', true]},
-				{sel: '#tool_reorient', fn: reorientPath, evt: 'click'},
-				{sel: '#tool_node_link', fn: linkControlPoints, evt: 'click'},
-				{sel: '#tool_node_clone', fn: clonePathNode, evt: 'click'},
-				{sel: '#tool_node_delete', fn: deletePathNode, evt: 'click'},
-				{sel: '#tool_openclose_path', fn: opencloseSubPath, evt: 'click'},
-				{sel: '#tool_add_subpath', fn: addSubPath, evt: 'click'},
-				{sel: '#tool_move_top', fn: moveToTopSelected, evt: 'click', key: 'ctrl+shift+]'},
-				{sel: '#tool_move_bottom', fn: moveToBottomSelected, evt: 'click', key: 'ctrl+shift+['},
-				{sel: '#tool_topath', fn: convertToPath, evt: 'click'},
-				{sel: '#tool_make_link,#tool_make_link_multi', fn: makeHyperlink, evt: 'click'},
-				{sel: '#tool_undo', fn: clickUndo, evt: 'click'},
-				{sel: '#tool_redo', fn: clickRedo, evt: 'click'},
-				{sel: '#tool_clone,#tool_clone_multi', fn: clickClone, evt: 'click', key: ['D', true]},
-				{sel: '#tool_group_elements', fn: clickGroup, evt: 'click', key: ['G', true]},
-				{sel: '#tool_ungroup', fn: clickGroup, evt: 'click'},
-				{sel: '#tool_unlink_use', fn: clickGroup, evt: 'click'},
-				{sel: '[id^=tool_align]', fn: clickAlign, evt: 'click'},
-				// these two lines are required to make Opera work properly with the flyout mechanism
-				// {sel: '#tools_rect_show', fn: clickRect, evt: 'click'},
-				// {sel: '#tools_ellipse_show', fn: clickEllipse, evt: 'click'},
-				{sel: '#tool_bold', fn: clickBold, evt: 'mousedown'},
-				{sel: '#tool_italic', fn: clickItalic, evt: 'mousedown'},
-				{sel: '#sidepanel_handle', fn: toggleSidePanel, key: ['X']},
-				{sel: '#copy_save_done', fn: cancelOverlays, evt: 'click'},
-
-				// Shortcuts not associated with buttons
-
-				{key: 'ctrl+left', fn: function () { rotateSelected(0, 1); }},
-				{key: 'ctrl+right', fn: function () { rotateSelected(1, 1); }},
-				{key: 'ctrl+shift+left', fn: function () { rotateSelected(0, 5); }},
-				{key: 'ctrl+shift+right', fn: function () { rotateSelected(1, 5); }},
-				{key: 'shift+O', fn: selectPrev},
-				{key: 'shift+P', fn: selectNext},
-				{key: [modKey + 'up', true], fn: function () { zoomImage(2); }},
-				{key: [modKey + 'down', true], fn: function () { zoomImage(0.5); }},
-				{key: [modKey + ']', true], fn: function () { moveUpDownSelected('Up'); }},
-				{key: [modKey + '[', true], fn: function () { moveUpDownSelected('Down'); }},
-				{key: ['up', true], fn: function () { moveSelected(0, -1); }},
-				{key: ['down', true], fn: function () { moveSelected(0, 1); }},
-				{key: ['left', true], fn: function () { moveSelected(-1, 0); }},
-				{key: ['right', true], fn: function () { moveSelected(1, 0); }},
-				{key: 'shift+up', fn: function () { moveSelected(0, -10); }},
-				{key: 'shift+down', fn: function () { moveSelected(0, 10); }},
-				{key: 'shift+left', fn: function () { moveSelected(-10, 0); }},
-				{key: 'shift+right', fn: function () { moveSelected(10, 0); }},
-				{key: ['alt+up', true], fn: function () { svgCanvas.cloneSelectedElements(0, -1); }},
-				{key: ['alt+down', true], fn: function () { svgCanvas.cloneSelectedElements(0, 1); }},
-				{key: ['alt+left', true], fn: function () { svgCanvas.cloneSelectedElements(-1, 0); }},
-				{key: ['alt+right', true], fn: function () { svgCanvas.cloneSelectedElements(1, 0); }},
-				{key: ['alt+shift+up', true], fn: function () { svgCanvas.cloneSelectedElements(0, -10); }},
-				{key: ['alt+shift+down', true], fn: function () { svgCanvas.cloneSelectedElements(0, 10); }},
-				{key: ['alt+shift+left', true], fn: function () { svgCanvas.cloneSelectedElements(-10, 0); }},
-				{key: ['alt+shift+right', true], fn: function () { svgCanvas.cloneSelectedElements(10, 0); }},
-				{key: 'A', fn: function () { svgCanvas.selectAllInCurrentLayer(); }},
-
-				// Standard shortcuts
-				{key: modKey + 'z', fn: clickUndo},
-				{key: modKey + 'shift+z', fn: clickRedo},
-				{key: modKey + 'y', fn: clickRedo},
-
-				{key: modKey + 'x', fn: cutSelected},
-				{key: modKey + 'c', fn: copySelected},
-				{key: modKey + 'v', fn: pasteInCenter}
-			];
-
-			// Tooltips not directly associated with a single function
-			var keyAssocs = {
-				'4/Shift+4': '#tools_rect_show',
-				'5/Shift+5': '#tools_ellipse_show'
-			};
-
-			return {
-				setAll: function () {
-					var flyouts = {};
-
-					$.each(toolButtons, function (i, opts) {
-						// Bind function to button
-						var btn;
-						if (opts.sel) {
-							btn = $(opts.sel);
-							if (btn.length === 0) { return true; } // Skip if markup does not exist
-							if (opts.evt) {
-								if (svgedit.browser.isTouch() && opts.evt === 'click') {
-									opts.evt = 'mousedown';
-								}
-								btn[opts.evt](opts.fn);
-							}
-
-							// Add to parent flyout menu, if able to be displayed
-							if (opts.parent && $(opts.parent + '_show').length !== 0) {
-								var fH = $(opts.parent);
-								if (!fH.length) {
-									fH = makeFlyoutHolder(opts.parent.substr(1));
-								}
-
-								fH.append(btn);
-
-								if (!$.isArray(flyouts[opts.parent])) {
-									flyouts[opts.parent] = [];
-								}
-								flyouts[opts.parent].push(opts);
-							}
-						}
-
-						// Bind function to shortcut key
-						if (opts.key) {
-							// Set shortcut based on options
-							var keyval,
-								// disInInp = true,
-								fn = opts.fn,
-								pd = false;
-							if ($.isArray(opts.key)) {
-								keyval = opts.key[0];
-								if (opts.key.length > 1) { pd = opts.key[1]; }
-								// if (opts.key.length > 2) { disInInp = opts.key[2]; }
-							} else {
-								keyval = opts.key;
-							}
-							keyval += '';
-
-							$.each(keyval.split('/'), function (i, key) {
-								$(document).bind('keydown', key, function (e) {
-									fn();
-									if (pd) {
-										e.preventDefault();
-									}
-									// Prevent default on ALL keys?
-									return false;
-								});
-							});
-
-							// Put shortcut in title
-							if (opts.sel && !opts.hidekey && btn.attr('title')) {
-								var newTitle = btn.attr('title').split('[')[0] + ' (' + keyval + ')';
-								keyAssocs[keyval] = opts.sel;
-								// Disregard for menu items
-								if (!btn.parents('#main_menu').length) {
-									btn.attr('title', newTitle);
-								}
-							}
-						}
-					});
-
-					// Setup flyouts
-					setupFlyouts(flyouts);
-
-					// Misc additional actions
-
-					// Make 'return' keypress trigger the change event
-					$('.attr_changer, #image_url').bind('keydown', 'return',
-						function (evt) {
-							$(this).change();
-							evt.preventDefault();
-						}
-					);
-
-					$(window).bind('keydown', 'tab', function (e) {
-						if (uiContext === 'canvas') {
-							e.preventDefault();
-							selectNext();
-						}
-					}).bind('keydown', 'shift+tab', function (e) {
-						if (uiContext === 'canvas') {
-							e.preventDefault();
-							selectPrev();
-						}
-					});
-
-					$('#tool_zoom').dblclick(dblclickZoom);
-				},
-				setTitles: function () {
-					$.each(keyAssocs, function (keyval, sel) {
-						var menu = ($(sel).parents('#main_menu').length);
-
-						$(sel).each(function () {
-							var t;
-							if (menu) {
-								t = $(this).text().split(' [')[0];
-							} else {
-								t = this.title.split(' [')[0];
-							}
-							var keyStr = '';
-							// Shift+Up
-							$.each(keyval.split('/'), function (i, key) {
-								var modBits = key.split('+'), mod = '';
-								if (modBits.length > 1) {
-									mod = modBits[0] + '+';
-									key = modBits[1];
-								}
-								keyStr += (i ? '/' : '') + mod + (uiStrings['key_' + key] || key);
-							});
-							if (menu) {
-								this.lastChild.textContent = t + ' [' + keyStr + ']';
-							} else {
-								this.title = t + ' [' + keyStr + ']';
-							}
-						});
-					});
-				},
-				getButtonData: function (sel) {
-					var b;
-					$.each(toolButtons, function (i, btn) {
-						if (btn.sel === sel) { b = btn; }
-					});
-					return b;
-				}
-			};
-		}());
-
-		Actions.setAll();
-
-		// Select given tool
-		editor.ready(function () {
-			var tool,
-				itool = curConfig.initTool,
-				container = $('#tools_left, #svg_editor .tools_flyout'),
-				preTool = container.find('#tool_' + itool),
-				regTool = container.find('#' + itool);
-			if (preTool.length) {
-				tool = preTool;
-			} else if (regTool.length) {
-				tool = regTool;
-			} else {
-				tool = $('#tool_select');
-			}
-			tool.click().mouseup();
-
-			if (curConfig.wireframe) {
-				$('#tool_wireframe').click();
-			}
-
-			if (curConfig.showlayers) {
-				toggleSidePanel();
-			}
-
-			$('#rulers').toggle(!!curConfig.showRulers);
-
-			if (curConfig.showRulers) {
-				$('#show_rulers')[0].checked = true;
-			}
-
-			if (curConfig.baseUnit) {
-				$('#base_unit').val(curConfig.baseUnit);
-			}
-
-			if (curConfig.gridSnapping) {
-				$('#grid_snapping_on')[0].checked = true;
-			}
-
-			if (curConfig.snappingStep) {
-				$('#grid_snapping_step').val(curConfig.snappingStep);
-			}
-
-			if (curConfig.gridColor) {
-				$('#grid_color').val(curConfig.gridColor);
-			}
-		});
-
-		// init SpinButtons
-		$('#rect_rx').SpinButton({min: 0, max: 1000, callback: changeRectRadius});
-		$('#stroke_width').SpinButton({min: 0, max: 99, smallStep: 0.1, callback: changeStrokeWidth});
-		$('#angle').SpinButton({min: -180, max: 180, step: 5, callback: changeRotationAngle});
-		$('#font_size').SpinButton({min: 0.001, stepfunc: stepFontSize, callback: changeFontSize});
-		$('#group_opacity').SpinButton({min: 0, max: 100, step: 5, callback: changeOpacity});
-		$('#blur').SpinButton({min: 0, max: 10, step: 0.1, callback: changeBlur});
-		$('#zoom').SpinButton({min: 0.001, max: 10000, step: 50, stepfunc: stepZoom, callback: changeZoom})
-			// Set default zoom
-			.val(svgCanvas.getZoom() * 100);
-
-		$('#workarea').contextMenu(
-			{
-				menu: 'cmenu_canvas',
-				inSpeed: 0
-			},
-			function (action, el, pos) {
-				switch (action) {
-				case 'delete':
-					deleteSelected();
-					break;
-				case 'cut':
-					cutSelected();
-					break;
-				case 'copy':
-					copySelected();
-					break;
-				case 'paste':
-					svgCanvas.pasteElements();
-					break;
-				case 'paste_in_place':
-					svgCanvas.pasteElements('in_place');
-					break;
-				case 'group':
-				case 'group_elements':
-					svgCanvas.groupSelectedElements();
-					break;
-				case 'ungroup':
-					svgCanvas.ungroupSelectedElement();
-					break;
-				case 'move_front':
-					moveToTopSelected();
-					break;
-				case 'move_up':
-					moveUpDownSelected('Up');
-					break;
-				case 'move_down':
-					moveUpDownSelected('Down');
-					break;
-				case 'move_back':
-					moveToBottomSelected();
-					break;
-				default:
-					if (svgedit.contextmenu && svgedit.contextmenu.hasCustomHandler(action)) {
-						svgedit.contextmenu.getCustomHandler(action).call();
-					}
-					break;
-				}
-			}
-		);
-
-		var lmenuFunc = function (action, el, pos) {
-			switch (action) {
-			case 'dupe':
-				cloneLayer();
-				break;
-			case 'delete':
-				deleteLayer();
-				break;
-			case 'merge_down':
-				mergeLayer();
-				break;
-			case 'merge_all':
-				svgCanvas.mergeAllLayers();
-				updateContextPanel();
-				populateLayers();
-				break;
-			}
-		};
-
-		$('#layerlist').contextMenu(
-			{
-				menu: 'cmenu_layers',
-				inSpeed: 0
-			},
-			lmenuFunc
-		);
-
-		$('#layer_moreopts').contextMenu(
-			{
-				menu: 'cmenu_layers',
-				inSpeed: 0,
-				allowLeft: true
-			},
-			lmenuFunc
-		);
-
-		$('.contextMenu li').mousedown(function (ev) {
-			ev.preventDefault();
-		});
-
-		$('#cmenu_canvas li').disableContextMenu();
-		canvMenu.enableContextMenuItems('#delete,#cut,#copy');
-
-		canvMenu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems'](
-			'#paste,#paste_in_place'
-		);
-		window.addEventListener('storage', function (e) {
-			if (e.key !== 'svgedit_clipboard') return;
-
-			canvMenu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems'](
-				'#paste,#paste_in_place'
-			);
-		});
-
-		window.addEventListener('beforeunload', function (e) {
-			// Suppress warning if page is empty
-			if (undoMgr.getUndoStackSize() === 0) {
-				editor.showSaveWarning = false;
-			}
-
-			// showSaveWarning is set to 'false' when the page is saved.
-			if (!curConfig.no_save_warning && editor.showSaveWarning) {
-				// Browser already asks question about closing the page
-				e.returnValue = uiStrings.notification.unsavedChanges; // Firefox needs this when beforeunload set by addEventListener (even though message is not used)
-				return uiStrings.notification.unsavedChanges;
-			}
-		}, false);
-
-		editor.openPrep = function (func) {
-			$('#main_menu').hide();
-			if (undoMgr.getUndoStackSize() === 0) {
-				func(true);
-			} else {
-				$.confirm(uiStrings.notification.QwantToOpen, func);
-			}
-		};
-
-		function onDragEnter (e) {
-			e.stopPropagation();
-			e.preventDefault();
-			// and indicator should be displayed here, such as "drop files here"
-		}
-
-		function onDragOver (e) {
-			e.stopPropagation();
-			e.preventDefault();
-		}
-
-		function onDragLeave (e) {
-			e.stopPropagation();
-			e.preventDefault();
-			// hypothetical indicator should be removed here
-		}
-		// Use HTML5 File API: http://www.w3.org/TR/FileAPI/
-		// if browser has HTML5 File API support, then we will show the open menu item
-		// and provide a file input to click. When that change event fires, it will
-		// get the text contents of the file and send it to the canvas
-		if (window.FileReader) {
-			var importImage = function (e) {
-				$.process_cancel(uiStrings.notification.loadingImage);
-				e.stopPropagation();
-				e.preventDefault();
-				$('#workarea').removeAttr('style');
-				$('#main_menu').hide();
-				var file = (e.type === 'drop') ? e.dataTransfer.files[0] : this.files[0];
-				if (!file) {
-					$('#dialog_box').hide();
-					return;
-				}
-				/* if (file.type === 'application/pdf') { // Todo: Handle PDF imports
-
-				}
-				else */
-				if (file.type.indexOf('image') > -1) {
-					// Detected an image
-					// svg handling
-					var reader;
-					if (file.type.indexOf('svg') > -1) {
-						reader = new FileReader();
-						reader.onloadend = function (e) {
-							var newElement = svgCanvas.importSvgString(e.target.result, true);
-							svgCanvas.ungroupSelectedElement();
-							svgCanvas.ungroupSelectedElement();
-							svgCanvas.groupSelectedElements();
-							svgCanvas.alignSelectedElements('m', 'page');
-							svgCanvas.alignSelectedElements('c', 'page');
-							// highlight imported element, otherwise we get strange empty selectbox
-							svgCanvas.selectOnly([newElement]);
-							$('#dialog_box').hide();
-						};
-						reader.readAsText(file);
-					} else {
-						// bitmap handling
-						reader = new FileReader();
-						reader.onloadend = function (e) {
-							// let's insert the new image until we know its dimensions
-							var insertNewImage = function (width, height) {
-								var newImage = svgCanvas.addSvgElementFromJson({
-									element: 'image',
-									attr: {
-										x: 0,
-										y: 0,
-										width: width,
-										height: height,
-										id: svgCanvas.getNextId(),
-										style: 'pointer-events:inherit'
-									}
-								});
-								svgCanvas.setHref(newImage, e.target.result);
-								svgCanvas.selectOnly([newImage]);
-								svgCanvas.alignSelectedElements('m', 'page');
-								svgCanvas.alignSelectedElements('c', 'page');
-								updateContextPanel();
-								$('#dialog_box').hide();
-							};
-							// create dummy img so we know the default dimensions
-							var imgWidth = 100;
-							var imgHeight = 100;
-							var img = new Image();
-							img.src = e.target.result;
-							img.style.opacity = 0;
-							img.onload = function () {
-								imgWidth = img.offsetWidth;
-								imgHeight = img.offsetHeight;
-								insertNewImage(imgWidth, imgHeight);
-							};
-						};
-						reader.readAsDataURL(file);
-					}
-				}
-			};
-
-			workarea[0].addEventListener('dragenter', onDragEnter, false);
-			workarea[0].addEventListener('dragover', onDragOver, false);
-			workarea[0].addEventListener('dragleave', onDragLeave, false);
-			workarea[0].addEventListener('drop', importImage, false);
-
-			var open = $('<input type="file">').change(function () {
-				var f = this;
-				editor.openPrep(function (ok) {
-					if (!ok) { return; }
-					svgCanvas.clear();
-					if (f.files.length === 1) {
-						$.process_cancel(uiStrings.notification.loadingImage);
-						var reader = new FileReader();
-						reader.onloadend = function (e) {
-							loadSvgString(e.target.result);
-							updateCanvas();
-						};
-						reader.readAsText(f.files[0]);
-					}
-				});
-			});
-			$('#tool_open').show().prepend(open);
-
-			var imgImport = $('<input type="file">').change(importImage);
-			$('#tool_import').show().prepend(imgImport);
-		}
-
-		// $(function () {
-		updateCanvas(true);
-		// });
-
-		//	var revnums = "svg-editor.js ($Rev$) ";
-		//	revnums += svgCanvas.getVersion();
-		//	$('#copyright')[0].setAttribute('title', revnums);
-
-		// For Compatibility with older extensions
-		$(function () {
-			window.svgCanvas = svgCanvas;
-			svgCanvas.ready = editor.ready;
-		});
-
-		editor.setLang = function (lang, allStrings) {
-			editor.langChanged = true;
-			$.pref('lang', lang);
-			$('#lang_select').val(lang);
-			if (!allStrings) {
-				return;
-			}
-			// var notif = allStrings.notification; // Currently unused
-			// $.extend will only replace the given strings
-			var oldLayerName = $('#layerlist tr.layersel td.layername').text();
-			var renameLayer = (oldLayerName === uiStrings.common.layer + ' 1');
-
-			$.extend(uiStrings, allStrings);
-			svgCanvas.setUiStrings(allStrings);
-			Actions.setTitles();
-
-			if (renameLayer) {
-				svgCanvas.renameCurrentLayer(uiStrings.common.layer + ' 1');
-				populateLayers();
-			}
-
-			// In case extensions loaded before the locale, now we execute a callback on them
-			if (extsPreLang.length) {
-				while (extsPreLang.length) {
-					var ext = extsPreLang.shift();
-					ext.langReady({lang: lang, uiStrings: uiStrings});
-				}
-			} else {
-				svgCanvas.runExtensions('langReady', {lang: lang, uiStrings: uiStrings});
-			}
-			svgCanvas.runExtensions('langChanged', lang);
-
-			// Update flyout tooltips
-			setFlyoutTitles();
-
-			// Copy title for certain tool elements
-			var elems = {
-				'#stroke_color': '#tool_stroke .icon_label, #tool_stroke .color_block',
-				'#fill_color': '#tool_fill label, #tool_fill .color_block',
-				'#linejoin_miter': '#cur_linejoin',
-				'#linecap_butt': '#cur_linecap'
-			};
-
-			$.each(elems, function (source, dest) {
-				$(dest).attr('title', $(source)[0].title);
-			});
-
-			// Copy alignment titles
-			$('#multiselected_panel div[id^=tool_align]').each(function () {
-				$('#tool_pos' + this.id.substr(10))[0].title = this.title;
-			});
-		};
-	};
-
-	editor.ready = function (cb) {
-		if (!isReady) {
-			callbacks.push(cb);
-		} else {
-			cb();
-		}
-	};
-
-	editor.runCallbacks = function () {
-		$.each(callbacks, function () {
-			this();
-		});
-		isReady = true;
-	};
-
-	editor.loadFromString = function (str) {
-		editor.ready(function () {
-			loadSvgString(str);
-		});
-	};
-
-	editor.disableUI = function (featList) {
-		// $(function () {
-		// 	$('#tool_wireframe, #tool_image, #main_button, #tool_source, #sidepanels').remove();
-		// 	$('#tools_top').css('left', 5);
-		// });
-	};
-
-	editor.loadFromURL = function (url, opts) {
-		if (!opts) { opts = {}; }
-
-		var cache = opts.cache;
-		var cb = opts.callback;
-
-		editor.ready(function () {
-			$.ajax({
-				'url': url,
-				'dataType': 'text',
-				cache: !!cache,
-				beforeSend: function () {
-					$.process_cancel(uiStrings.notification.loadingImage);
-				},
-				success: function (str) {
-					loadSvgString(str, cb);
-				},
-				error: function (xhr, stat, err) {
-					if (xhr.status !== 404 && xhr.responseText) {
-						loadSvgString(xhr.responseText, cb);
-					} else {
-						$.alert(uiStrings.notification.URLloadFail + ': \n' + err, cb);
-					}
-				},
-				complete: function () {
-					$('#dialog_box').hide();
-				}
-			});
-		});
-	};
-
-	editor.loadFromDataURI = function (str) {
-		editor.ready(function () {
-			var base64 = false;
-			var pre = str.match(/^data:image\/svg\+xml;base64,/);
-			if (pre) {
-				base64 = true;
-			} else {
-				pre = str.match(/^data:image\/svg\+xml(?:;(?:utf8)?)?,/);
-			}
-			if (pre) {
-				pre = pre[0];
-			}
-			var src = str.slice(pre.length);
-			loadSvgString(base64 ? Utils.decode64(src) : decodeURIComponent(src));
-		});
-	};
-
-	editor.addExtension = function () {
-		var args = arguments;
-
-		// Note that we don't want this on editor.ready since some extensions
-		// may want to run before then (like server_opensave).
-		$(function () {
-			if (svgCanvas) { svgCanvas.addExtension.apply(this, args); }
-		});
-	};
-
-	return editor;
+      var docElem = svgdocbox.documentElement;
+
+      docElem = $(container)[0].appendChild(document.importNode(docElem, true));
+      docElem.setAttribute('width', 16.5);
+
+      this.rect = docElem.firstChild;
+      this.defs = docElem.getElementsByTagName('defs')[0];
+      this.grad = this.defs.firstChild;
+      this.paint = new $.jGraduate.Paint({solidColor: cur.color});
+      this.type = type;
+
+      this.setPaint = function (paint, apply) {
+        this.paint = paint;
+
+        var fillAttr = 'none';
+        var ptype = paint.type;
+        var opac = paint.alpha / 100;
+
+        switch (ptype) {
+        case 'solidColor':
+          fillAttr = (paint[ptype] !== 'none') ? '#' + paint[ptype] : paint[ptype];
+          break;
+        case 'linearGradient':
+        case 'radialGradient':
+          this.defs.removeChild(this.grad);
+          this.grad = this.defs.appendChild(paint[ptype]);
+          var id = this.grad.id = 'gradbox_' + this.type;
+          fillAttr = 'url(#' + id + ')';
+          break;
+        }
+
+        this.rect.setAttribute('fill', fillAttr);
+        this.rect.setAttribute('opacity', opac);
+
+        if (apply) {
+          svgCanvas.setColor(this.type, paintColor, true);
+          svgCanvas.setPaintOpacity(this.type, paintOpacity, true);
+        }
+      };
+
+      this.update = function (apply) {
+        if (!selectedElement) { return; }
+        var i, len;
+        var type = this.type;
+        switch (selectedElement.tagName) {
+        case 'use':
+        case 'image':
+        case 'foreignObject':
+          // These elements don't have fill or stroke, so don't change
+          // the current value
+          return;
+        case 'g':
+        case 'a':
+          var gPaint = null;
+
+          var childs = selectedElement.getElementsByTagName('*');
+          for (i = 0, len = childs.length; i < len; i++) {
+            var elem = childs[i];
+            var p = elem.getAttribute(type);
+            if (i === 0) {
+              gPaint = p;
+            } else if (gPaint !== p) {
+              gPaint = null;
+              break;
+            }
+          }
+
+          if (gPaint === null) {
+            // No common color, don't update anything
+            paintColor = null;
+            return;
+          }
+          paintColor = gPaint;
+          paintOpacity = 1;
+          break;
+        default:
+          paintOpacity = parseFloat(selectedElement.getAttribute(type + '-opacity'));
+          if (isNaN(paintOpacity)) {
+            paintOpacity = 1.0;
+          }
+
+          var defColor = type === 'fill' ? 'black' : 'none';
+          paintColor = selectedElement.getAttribute(type) || defColor;
+        }
+
+        if (apply) {
+          svgCanvas.setColor(type, paintColor, true);
+          svgCanvas.setPaintOpacity(type, paintOpacity, true);
+        }
+
+        paintOpacity *= 100;
+
+        var paint = getPaint(paintColor, paintOpacity, type);
+        // update the rect inside #fill_color/#stroke_color
+        this.setPaint(paint);
+      };
+
+      this.prep = function () {
+        var ptype = this.paint.type;
+
+        switch (ptype) {
+        case 'linearGradient':
+        case 'radialGradient':
+          var paint = new $.jGraduate.Paint({copy: this.paint});
+          svgCanvas.setPaint(type, paint);
+          break;
+        }
+      };
+    };
+
+    paintBox.fill = new PaintBox('#fill_color', 'fill');
+    paintBox.stroke = new PaintBox('#stroke_color', 'stroke');
+
+    $('#stroke_width').val(curConfig.initStroke.width);
+    $('#group_opacity').val(curConfig.initOpacity * 100);
+
+    // Use this SVG elem to test vectorEffect support
+    var testEl = paintBox.fill.rect.cloneNode(false);
+    testEl.setAttribute('style', 'vector-effect:non-scaling-stroke');
+    supportsNonSS = (testEl.style.vectorEffect === 'non-scaling-stroke');
+    testEl.removeAttribute('style');
+    var svgdocbox = paintBox.fill.rect.ownerDocument;
+    // Use this to test support for blur element. Seems to work to test support in Webkit
+    var blurTest = svgdocbox.createElementNS(svgedit.NS.SVG, 'feGaussianBlur');
+    if (blurTest.stdDeviationX === undefined) {
+      $('#tool_blur').hide();
+    }
+    $(blurTest).remove();
+
+    // Test for zoom icon support
+    (function () {
+      var pre = '-' + uaPrefix.toLowerCase() + '-zoom-';
+      var zoom = pre + 'in';
+      workarea.css('cursor', zoom);
+      if (workarea.css('cursor') === zoom) {
+        zoomInIcon = zoom;
+        zoomOutIcon = pre + 'out';
+      }
+      workarea.css('cursor', 'auto');
+    }());
+
+    // Test for embedImage support (use timeout to not interfere with page load)
+    setTimeout(function () {
+      svgCanvas.embedImage('images/logo.png', function (datauri) {
+        if (!datauri) {
+          // Disable option
+          $('#image_save_opts [value=embed]').attr('disabled', 'disabled');
+          $('#image_save_opts input').val(['ref']);
+          $.pref('img_save', 'ref');
+          $('#image_opt_embed').css('color', '#666').attr('title', uiStrings.notification.featNotSupported);
+        }
+      });
+    }, 1000);
+
+    $('#fill_color, #tool_fill .icon_label').click(function () {
+      colorPicker($('#fill_color'));
+      updateToolButtonState();
+    });
+
+    $('#stroke_color, #tool_stroke .icon_label').click(function () {
+      colorPicker($('#stroke_color'));
+      updateToolButtonState();
+    });
+
+    $('#group_opacityLabel').click(function () {
+      $('#opacity_dropdown button').mousedown();
+      $(window).mouseup();
+    });
+
+    $('#zoomLabel').click(function () {
+      $('#zoom_dropdown button').mousedown();
+      $(window).mouseup();
+    });
+
+    $('#tool_move_top').mousedown(function (evt) {
+      $('#tools_stacking').show();
+      evt.preventDefault();
+    });
+
+    $('.layer_button').mousedown(function () {
+      $(this).addClass('layer_buttonpressed');
+    }).mouseout(function () {
+      $(this).removeClass('layer_buttonpressed');
+    }).mouseup(function () {
+      $(this).removeClass('layer_buttonpressed');
+    });
+
+    $('.push_button').mousedown(function () {
+      if (!$(this).hasClass('disabled')) {
+        $(this).addClass('push_button_pressed').removeClass('push_button');
+      }
+    }).mouseout(function () {
+      $(this).removeClass('push_button_pressed').addClass('push_button');
+    }).mouseup(function () {
+      $(this).removeClass('push_button_pressed').addClass('push_button');
+    });
+
+    // ask for a layer name
+    $('#layer_new').click(function () {
+      var uniqName,
+        i = svgCanvas.getCurrentDrawing().getNumLayers();
+      do {
+        uniqName = uiStrings.layers.layer + ' ' + (++i);
+      } while (svgCanvas.getCurrentDrawing().hasLayer(uniqName));
+
+      $.prompt(uiStrings.notification.enterUniqueLayerName, uniqName, function (newName) {
+        if (!newName) { return; }
+        if (svgCanvas.getCurrentDrawing().hasLayer(newName)) {
+          $.alert(uiStrings.notification.dupeLayerName);
+          return;
+        }
+        svgCanvas.createLayer(newName);
+        updateContextPanel();
+        populateLayers();
+      });
+    });
+
+    function deleteLayer () {
+      if (svgCanvas.deleteCurrentLayer()) {
+        updateContextPanel();
+        populateLayers();
+        // This matches what SvgCanvas does
+        // TODO: make this behavior less brittle (svg-editor should get which
+        // layer is selected from the canvas and then select that one in the UI)
+        $('#layerlist tr.layer').removeClass('layersel');
+        $('#layerlist tr.layer:first').addClass('layersel');
+      }
+    }
+
+    function cloneLayer () {
+      var name = svgCanvas.getCurrentDrawing().getCurrentLayerName() + ' copy';
+
+      $.prompt(uiStrings.notification.enterUniqueLayerName, name, function (newName) {
+        if (!newName) { return; }
+        if (svgCanvas.getCurrentDrawing().hasLayer(newName)) {
+          $.alert(uiStrings.notification.dupeLayerName);
+          return;
+        }
+        svgCanvas.cloneLayer(newName);
+        updateContextPanel();
+        populateLayers();
+      });
+    }
+
+    function mergeLayer () {
+      if ($('#layerlist tr.layersel').index() === svgCanvas.getCurrentDrawing().getNumLayers() - 1) {
+        return;
+      }
+      svgCanvas.mergeLayer();
+      updateContextPanel();
+      populateLayers();
+    }
+
+    function moveLayer (pos) {
+      var curIndex = $('#layerlist tr.layersel').index();
+      var total = svgCanvas.getCurrentDrawing().getNumLayers();
+      if (curIndex > 0 || curIndex < total - 1) {
+        curIndex += pos;
+        svgCanvas.setCurrentLayerPosition(total - curIndex - 1);
+        populateLayers();
+      }
+    }
+
+    $('#layer_delete').click(deleteLayer);
+
+    $('#layer_up').click(function () {
+      moveLayer(-1);
+    });
+
+    $('#layer_down').click(function () {
+      moveLayer(1);
+    });
+
+    $('#layer_rename').click(function () {
+      // var curIndex = $('#layerlist tr.layersel').prevAll().length; // Currently unused
+      var oldName = $('#layerlist tr.layersel td.layername').text();
+      $.prompt(uiStrings.notification.enterNewLayerName, '', function (newName) {
+        if (!newName) { return; }
+        if (oldName === newName || svgCanvas.getCurrentDrawing().hasLayer(newName)) {
+          $.alert(uiStrings.notification.layerHasThatName);
+          return;
+        }
+
+        svgCanvas.renameCurrentLayer(newName);
+        populateLayers();
+      });
+    });
+
+    var SIDEPANEL_MAXWIDTH = 300;
+    var SIDEPANEL_OPENWIDTH = 150;
+    var sidedrag = -1, sidedragging = false, allowmove = false;
+
+    var changeSidePanelWidth = function (delta) {
+      var rulerX = $('#ruler_x');
+      $('#sidepanels').width('+=' + delta);
+      $('#layerpanel').width('+=' + delta);
+      rulerX.css('right', parseInt(rulerX.css('right'), 10) + delta);
+      workarea.css('right', parseInt(workarea.css('right'), 10) + delta);
+      svgCanvas.runExtensions('workareaResized');
+    };
+
+    var resizeSidePanel = function (evt) {
+      if (!allowmove) { return; }
+      if (sidedrag === -1) { return; }
+      sidedragging = true;
+      var deltaX = sidedrag - evt.pageX;
+      var sideWidth = $('#sidepanels').width();
+      if (sideWidth + deltaX > SIDEPANEL_MAXWIDTH) {
+        deltaX = SIDEPANEL_MAXWIDTH - sideWidth;
+        sideWidth = SIDEPANEL_MAXWIDTH;
+      } else if (sideWidth + deltaX < 2) {
+        deltaX = 2 - sideWidth;
+        sideWidth = 2;
+      }
+      if (deltaX === 0) { return; }
+      sidedrag -= deltaX;
+      changeSidePanelWidth(deltaX);
+    };
+
+    // if width is non-zero, then fully close it, otherwise fully open it
+    // the optional close argument forces the side panel closed
+    var toggleSidePanel = function (close) {
+      var w = $('#sidepanels').width();
+      var deltaX = (w > 2 || close ? 2 : SIDEPANEL_OPENWIDTH) - w;
+      changeSidePanelWidth(deltaX);
+    };
+
+    $('#sidepanel_handle')
+      .mousedown(function (evt) {
+        sidedrag = evt.pageX;
+        $(window).mousemove(resizeSidePanel);
+        allowmove = false;
+        // Silly hack for Chrome, which always runs mousemove right after mousedown
+        setTimeout(function () {
+          allowmove = true;
+        }, 20);
+      })
+      .mouseup(function (evt) {
+        if (!sidedragging) { toggleSidePanel(); }
+        sidedrag = -1;
+        sidedragging = false;
+      });
+
+    $(window).mouseup(function () {
+      sidedrag = -1;
+      sidedragging = false;
+      $('#svg_editor').unbind('mousemove', resizeSidePanel);
+    });
+
+    populateLayers();
+
+    // function changeResolution (x,y) {
+    // 	var zoom = svgCanvas.getResolution().zoom;
+    // 	setResolution(x * zoom, y * zoom);
+    // }
+
+    var centerCanvas = function () {
+      // this centers the canvas vertically in the workarea (horizontal handled in CSS)
+      workarea.css('line-height', workarea.height() + 'px');
+    };
+
+    $(window).bind('load resize', centerCanvas);
+
+    function stepFontSize (elem, step) {
+      var origVal = Number(elem.value);
+      var sugVal = origVal + step;
+      var increasing = sugVal >= origVal;
+      if (step === 0) { return origVal; }
+
+      if (origVal >= 24) {
+        if (increasing) {
+          return Math.round(origVal * 1.1);
+        }
+        return Math.round(origVal / 1.1);
+      }
+      if (origVal <= 1) {
+        if (increasing) {
+          return origVal * 2;
+        }
+        return origVal / 2;
+      }
+      return sugVal;
+    }
+
+    function stepZoom (elem, step) {
+      var origVal = Number(elem.value);
+      if (origVal === 0) { return 100; }
+      var sugVal = origVal + step;
+      if (step === 0) { return origVal; }
+
+      if (origVal >= 100) {
+        return sugVal;
+      }
+      if (sugVal >= origVal) {
+        return origVal * 2;
+      }
+      return origVal / 2;
+    }
+
+    // function setResolution (w, h, center) {
+    // 	updateCanvas();
+    // 	// w -= 0; h -= 0;
+    // 	// $('#svgcanvas').css({'width': w, 'height': h});
+    // 	// $('#canvas_width').val(w);
+    // 	// $('#canvas_height').val(h);
+    // 	//
+    // 	// if (center) {
+    // 	// 	var wArea = workarea;
+    // 	// 	var scrollY = h/2 - wArea.height()/2;
+    // 	// 	var scrollX = w/2 - wArea.width()/2;
+    // 	// 	wArea[0].scrollTop = scrollY;
+    // 	// 	wArea[0].scrollLeft = scrollX;
+    // 	// }
+    // }
+
+    $('#resolution').change(function () {
+      var wh = $('#canvas_width,#canvas_height');
+      if (!this.selectedIndex) {
+        if ($('#canvas_width').val() === 'fit') {
+          wh.removeAttr('disabled').val(100);
+        }
+      } else if (this.value === 'content') {
+        wh.val('fit').attr('disabled', 'disabled');
+      } else {
+        var dims = this.value.split('x');
+        $('#canvas_width').val(dims[0]);
+        $('#canvas_height').val(dims[1]);
+        wh.removeAttr('disabled');
+      }
+    });
+
+    // Prevent browser from erroneously repopulating fields
+    $('input,select').attr('autocomplete', 'off');
+
+    // Associate all button actions as well as non-button keyboard shortcuts
+    Actions = (function () {
+      // sel:'selector', fn:function, evt:'event', key:[key, preventDefault, NoDisableInInput]
+      var toolButtons = [
+        {sel: '#tool_select', fn: clickSelect, evt: 'click', key: ['V', true]},
+        {sel: '#tool_fhpath', fn: clickFHPath, evt: 'click', key: ['Q', true]},
+        {sel: '#tool_line', fn: clickLine, evt: 'click', key: ['L', true]},
+        {sel: '#tool_rect', fn: clickRect, evt: 'mouseup', key: ['R', true], parent: '#tools_rect', icon: 'rect'},
+        {sel: '#tool_square', fn: clickSquare, evt: 'mouseup', parent: '#tools_rect', icon: 'square'},
+        {sel: '#tool_fhrect', fn: clickFHRect, evt: 'mouseup', parent: '#tools_rect', icon: 'fh_rect'},
+        {sel: '#tool_ellipse', fn: clickEllipse, evt: 'mouseup', key: ['E', true], parent: '#tools_ellipse', icon: 'ellipse'},
+        {sel: '#tool_circle', fn: clickCircle, evt: 'mouseup', parent: '#tools_ellipse', icon: 'circle'},
+        {sel: '#tool_fhellipse', fn: clickFHEllipse, evt: 'mouseup', parent: '#tools_ellipse', icon: 'fh_ellipse'},
+        {sel: '#tool_path', fn: clickPath, evt: 'click', key: ['P', true]},
+        {sel: '#tool_text', fn: clickText, evt: 'click', key: ['T', true]},
+        {sel: '#tool_image', fn: clickImage, evt: 'mouseup'},
+        {sel: '#tool_zoom', fn: clickZoom, evt: 'mouseup', key: ['Z', true]},
+        {sel: '#tool_clear', fn: clickClear, evt: 'mouseup', key: ['N', true]},
+        {sel: '#tool_save', fn: function () {
+          if (editingsource) {
+            saveSourceEditor();
+          } else {
+            clickSave();
+          }
+        }, evt: 'mouseup', key: ['S', true]},
+        {sel: '#tool_export', fn: clickExport, evt: 'mouseup'},
+        {sel: '#tool_open', fn: clickOpen, evt: 'mouseup', key: ['O', true]},
+        {sel: '#tool_import', fn: clickImport, evt: 'mouseup'},
+        {sel: '#tool_source', fn: showSourceEditor, evt: 'click', key: ['U', true]},
+        {sel: '#tool_wireframe', fn: clickWireframe, evt: 'click', key: ['F', true]},
+        {sel: '#tool_source_cancel,.overlay,#tool_docprops_cancel,#tool_prefs_cancel', fn: cancelOverlays, evt: 'click', key: ['esc', false, false], hidekey: true},
+        {sel: '#tool_source_save', fn: saveSourceEditor, evt: 'click'},
+        {sel: '#tool_docprops_save', fn: saveDocProperties, evt: 'click'},
+        {sel: '#tool_docprops', fn: showDocProperties, evt: 'mouseup'},
+        {sel: '#tool_prefs_save', fn: savePreferences, evt: 'click'},
+        {sel: '#tool_prefs_option', fn: function () { showPreferences(); return false; }, evt: 'mouseup'},
+        {sel: '#tool_delete,#tool_delete_multi', fn: deleteSelected, evt: 'click', key: ['del/backspace', true]},
+        {sel: '#tool_reorient', fn: reorientPath, evt: 'click'},
+        {sel: '#tool_node_link', fn: linkControlPoints, evt: 'click'},
+        {sel: '#tool_node_clone', fn: clonePathNode, evt: 'click'},
+        {sel: '#tool_node_delete', fn: deletePathNode, evt: 'click'},
+        {sel: '#tool_openclose_path', fn: opencloseSubPath, evt: 'click'},
+        {sel: '#tool_add_subpath', fn: addSubPath, evt: 'click'},
+        {sel: '#tool_move_top', fn: moveToTopSelected, evt: 'click', key: 'ctrl+shift+]'},
+        {sel: '#tool_move_bottom', fn: moveToBottomSelected, evt: 'click', key: 'ctrl+shift+['},
+        {sel: '#tool_topath', fn: convertToPath, evt: 'click'},
+        {sel: '#tool_make_link,#tool_make_link_multi', fn: makeHyperlink, evt: 'click'},
+        {sel: '#tool_undo', fn: clickUndo, evt: 'click'},
+        {sel: '#tool_redo', fn: clickRedo, evt: 'click'},
+        {sel: '#tool_clone,#tool_clone_multi', fn: clickClone, evt: 'click', key: ['D', true]},
+        {sel: '#tool_group_elements', fn: clickGroup, evt: 'click', key: ['G', true]},
+        {sel: '#tool_ungroup', fn: clickGroup, evt: 'click'},
+        {sel: '#tool_unlink_use', fn: clickGroup, evt: 'click'},
+        {sel: '[id^=tool_align]', fn: clickAlign, evt: 'click'},
+        // these two lines are required to make Opera work properly with the flyout mechanism
+        // {sel: '#tools_rect_show', fn: clickRect, evt: 'click'},
+        // {sel: '#tools_ellipse_show', fn: clickEllipse, evt: 'click'},
+        {sel: '#tool_bold', fn: clickBold, evt: 'mousedown'},
+        {sel: '#tool_italic', fn: clickItalic, evt: 'mousedown'},
+        {sel: '#sidepanel_handle', fn: toggleSidePanel, key: ['X']},
+        {sel: '#copy_save_done', fn: cancelOverlays, evt: 'click'},
+
+        // Shortcuts not associated with buttons
+
+        {key: 'ctrl+left', fn: function () { rotateSelected(0, 1); }},
+        {key: 'ctrl+right', fn: function () { rotateSelected(1, 1); }},
+        {key: 'ctrl+shift+left', fn: function () { rotateSelected(0, 5); }},
+        {key: 'ctrl+shift+right', fn: function () { rotateSelected(1, 5); }},
+        {key: 'shift+O', fn: selectPrev},
+        {key: 'shift+P', fn: selectNext},
+        {key: [modKey + 'up', true], fn: function () { zoomImage(2); }},
+        {key: [modKey + 'down', true], fn: function () { zoomImage(0.5); }},
+        {key: [modKey + ']', true], fn: function () { moveUpDownSelected('Up'); }},
+        {key: [modKey + '[', true], fn: function () { moveUpDownSelected('Down'); }},
+        {key: ['up', true], fn: function () { moveSelected(0, -1); }},
+        {key: ['down', true], fn: function () { moveSelected(0, 1); }},
+        {key: ['left', true], fn: function () { moveSelected(-1, 0); }},
+        {key: ['right', true], fn: function () { moveSelected(1, 0); }},
+        {key: 'shift+up', fn: function () { moveSelected(0, -10); }},
+        {key: 'shift+down', fn: function () { moveSelected(0, 10); }},
+        {key: 'shift+left', fn: function () { moveSelected(-10, 0); }},
+        {key: 'shift+right', fn: function () { moveSelected(10, 0); }},
+        {key: ['alt+up', true], fn: function () { svgCanvas.cloneSelectedElements(0, -1); }},
+        {key: ['alt+down', true], fn: function () { svgCanvas.cloneSelectedElements(0, 1); }},
+        {key: ['alt+left', true], fn: function () { svgCanvas.cloneSelectedElements(-1, 0); }},
+        {key: ['alt+right', true], fn: function () { svgCanvas.cloneSelectedElements(1, 0); }},
+        {key: ['alt+shift+up', true], fn: function () { svgCanvas.cloneSelectedElements(0, -10); }},
+        {key: ['alt+shift+down', true], fn: function () { svgCanvas.cloneSelectedElements(0, 10); }},
+        {key: ['alt+shift+left', true], fn: function () { svgCanvas.cloneSelectedElements(-10, 0); }},
+        {key: ['alt+shift+right', true], fn: function () { svgCanvas.cloneSelectedElements(10, 0); }},
+        {key: 'A', fn: function () { svgCanvas.selectAllInCurrentLayer(); }},
+
+        // Standard shortcuts
+        {key: modKey + 'z', fn: clickUndo},
+        {key: modKey + 'shift+z', fn: clickRedo},
+        {key: modKey + 'y', fn: clickRedo},
+
+        {key: modKey + 'x', fn: cutSelected},
+        {key: modKey + 'c', fn: copySelected},
+        {key: modKey + 'v', fn: pasteInCenter}
+      ];
+
+      // Tooltips not directly associated with a single function
+      var keyAssocs = {
+        '4/Shift+4': '#tools_rect_show',
+        '5/Shift+5': '#tools_ellipse_show'
+      };
+
+      return {
+        setAll: function () {
+          var flyouts = {};
+
+          $.each(toolButtons, function (i, opts) {
+            // Bind function to button
+            var btn;
+            if (opts.sel) {
+              btn = $(opts.sel);
+              if (btn.length === 0) { return true; } // Skip if markup does not exist
+              if (opts.evt) {
+                if (svgedit.browser.isTouch() && opts.evt === 'click') {
+                  opts.evt = 'mousedown';
+                }
+                btn[opts.evt](opts.fn);
+              }
+
+              // Add to parent flyout menu, if able to be displayed
+              if (opts.parent && $(opts.parent + '_show').length !== 0) {
+                var fH = $(opts.parent);
+                if (!fH.length) {
+                  fH = makeFlyoutHolder(opts.parent.substr(1));
+                }
+
+                fH.append(btn);
+
+                if (!$.isArray(flyouts[opts.parent])) {
+                  flyouts[opts.parent] = [];
+                }
+                flyouts[opts.parent].push(opts);
+              }
+            }
+
+            // Bind function to shortcut key
+            if (opts.key) {
+              // Set shortcut based on options
+              var keyval,
+                // disInInp = true,
+                fn = opts.fn,
+                pd = false;
+              if ($.isArray(opts.key)) {
+                keyval = opts.key[0];
+                if (opts.key.length > 1) { pd = opts.key[1]; }
+                // if (opts.key.length > 2) { disInInp = opts.key[2]; }
+              } else {
+                keyval = opts.key;
+              }
+              keyval += '';
+
+              $.each(keyval.split('/'), function (i, key) {
+                $(document).bind('keydown', key, function (e) {
+                  fn();
+                  if (pd) {
+                    e.preventDefault();
+                  }
+                  // Prevent default on ALL keys?
+                  return false;
+                });
+              });
+
+              // Put shortcut in title
+              if (opts.sel && !opts.hidekey && btn.attr('title')) {
+                var newTitle = btn.attr('title').split('[')[0] + ' (' + keyval + ')';
+                keyAssocs[keyval] = opts.sel;
+                // Disregard for menu items
+                if (!btn.parents('#main_menu').length) {
+                  btn.attr('title', newTitle);
+                }
+              }
+            }
+          });
+
+          // Setup flyouts
+          setupFlyouts(flyouts);
+
+          // Misc additional actions
+
+          // Make 'return' keypress trigger the change event
+          $('.attr_changer, #image_url').bind('keydown', 'return',
+            function (evt) {
+              $(this).change();
+              evt.preventDefault();
+            }
+          );
+
+          $(window).bind('keydown', 'tab', function (e) {
+            if (uiContext === 'canvas') {
+              e.preventDefault();
+              selectNext();
+            }
+          }).bind('keydown', 'shift+tab', function (e) {
+            if (uiContext === 'canvas') {
+              e.preventDefault();
+              selectPrev();
+            }
+          });
+
+          $('#tool_zoom').dblclick(dblclickZoom);
+        },
+        setTitles: function () {
+          $.each(keyAssocs, function (keyval, sel) {
+            var menu = ($(sel).parents('#main_menu').length);
+
+            $(sel).each(function () {
+              var t;
+              if (menu) {
+                t = $(this).text().split(' [')[0];
+              } else {
+                t = this.title.split(' [')[0];
+              }
+              var keyStr = '';
+              // Shift+Up
+              $.each(keyval.split('/'), function (i, key) {
+                var modBits = key.split('+'), mod = '';
+                if (modBits.length > 1) {
+                  mod = modBits[0] + '+';
+                  key = modBits[1];
+                }
+                keyStr += (i ? '/' : '') + mod + (uiStrings['key_' + key] || key);
+              });
+              if (menu) {
+                this.lastChild.textContent = t + ' [' + keyStr + ']';
+              } else {
+                this.title = t + ' [' + keyStr + ']';
+              }
+            });
+          });
+        },
+        getButtonData: function (sel) {
+          var b;
+          $.each(toolButtons, function (i, btn) {
+            if (btn.sel === sel) { b = btn; }
+          });
+          return b;
+        }
+      };
+    }());
+
+    Actions.setAll();
+
+    // Select given tool
+    editor.ready(function () {
+      var tool,
+        itool = curConfig.initTool,
+        container = $('#tools_left, #svg_editor .tools_flyout'),
+        preTool = container.find('#tool_' + itool),
+        regTool = container.find('#' + itool);
+      if (preTool.length) {
+        tool = preTool;
+      } else if (regTool.length) {
+        tool = regTool;
+      } else {
+        tool = $('#tool_select');
+      }
+      tool.click().mouseup();
+
+      if (curConfig.wireframe) {
+        $('#tool_wireframe').click();
+      }
+
+      if (curConfig.showlayers) {
+        toggleSidePanel();
+      }
+
+      $('#rulers').toggle(!!curConfig.showRulers);
+
+      if (curConfig.showRulers) {
+        $('#show_rulers')[0].checked = true;
+      }
+
+      if (curConfig.baseUnit) {
+        $('#base_unit').val(curConfig.baseUnit);
+      }
+
+      if (curConfig.gridSnapping) {
+        $('#grid_snapping_on')[0].checked = true;
+      }
+
+      if (curConfig.snappingStep) {
+        $('#grid_snapping_step').val(curConfig.snappingStep);
+      }
+
+      if (curConfig.gridColor) {
+        $('#grid_color').val(curConfig.gridColor);
+      }
+    });
+
+    // init SpinButtons
+    $('#rect_rx').SpinButton({min: 0, max: 1000, callback: changeRectRadius});
+    $('#stroke_width').SpinButton({min: 0, max: 99, smallStep: 0.1, callback: changeStrokeWidth});
+    $('#angle').SpinButton({min: -180, max: 180, step: 5, callback: changeRotationAngle});
+    $('#font_size').SpinButton({min: 0.001, stepfunc: stepFontSize, callback: changeFontSize});
+    $('#group_opacity').SpinButton({min: 0, max: 100, step: 5, callback: changeOpacity});
+    $('#blur').SpinButton({min: 0, max: 10, step: 0.1, callback: changeBlur});
+    $('#zoom').SpinButton({min: 0.001, max: 10000, step: 50, stepfunc: stepZoom, callback: changeZoom})
+      // Set default zoom
+      .val(svgCanvas.getZoom() * 100);
+
+    $('#workarea').contextMenu(
+      {
+        menu: 'cmenu_canvas',
+        inSpeed: 0
+      },
+      function (action, el, pos) {
+        switch (action) {
+        case 'delete':
+          deleteSelected();
+          break;
+        case 'cut':
+          cutSelected();
+          break;
+        case 'copy':
+          copySelected();
+          break;
+        case 'paste':
+          svgCanvas.pasteElements();
+          break;
+        case 'paste_in_place':
+          svgCanvas.pasteElements('in_place');
+          break;
+        case 'group':
+        case 'group_elements':
+          svgCanvas.groupSelectedElements();
+          break;
+        case 'ungroup':
+          svgCanvas.ungroupSelectedElement();
+          break;
+        case 'move_front':
+          moveToTopSelected();
+          break;
+        case 'move_up':
+          moveUpDownSelected('Up');
+          break;
+        case 'move_down':
+          moveUpDownSelected('Down');
+          break;
+        case 'move_back':
+          moveToBottomSelected();
+          break;
+        default:
+          if (svgedit.contextmenu && svgedit.contextmenu.hasCustomHandler(action)) {
+            svgedit.contextmenu.getCustomHandler(action).call();
+          }
+          break;
+        }
+      }
+    );
+
+    var lmenuFunc = function (action, el, pos) {
+      switch (action) {
+      case 'dupe':
+        cloneLayer();
+        break;
+      case 'delete':
+        deleteLayer();
+        break;
+      case 'merge_down':
+        mergeLayer();
+        break;
+      case 'merge_all':
+        svgCanvas.mergeAllLayers();
+        updateContextPanel();
+        populateLayers();
+        break;
+      }
+    };
+
+    $('#layerlist').contextMenu(
+      {
+        menu: 'cmenu_layers',
+        inSpeed: 0
+      },
+      lmenuFunc
+    );
+
+    $('#layer_moreopts').contextMenu(
+      {
+        menu: 'cmenu_layers',
+        inSpeed: 0,
+        allowLeft: true
+      },
+      lmenuFunc
+    );
+
+    $('.contextMenu li').mousedown(function (ev) {
+      ev.preventDefault();
+    });
+
+    $('#cmenu_canvas li').disableContextMenu();
+    canvMenu.enableContextMenuItems('#delete,#cut,#copy');
+
+    canvMenu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems'](
+      '#paste,#paste_in_place'
+    );
+    window.addEventListener('storage', function (e) {
+      if (e.key !== 'svgedit_clipboard') return;
+
+      canvMenu[(localStorage.getItem('svgedit_clipboard') ? 'en' : 'dis') + 'ableContextMenuItems'](
+        '#paste,#paste_in_place'
+      );
+    });
+
+    window.addEventListener('beforeunload', function (e) {
+      // Suppress warning if page is empty
+      if (undoMgr.getUndoStackSize() === 0) {
+        editor.showSaveWarning = false;
+      }
+
+      // showSaveWarning is set to 'false' when the page is saved.
+      if (!curConfig.no_save_warning && editor.showSaveWarning) {
+        // Browser already asks question about closing the page
+        e.returnValue = uiStrings.notification.unsavedChanges; // Firefox needs this when beforeunload set by addEventListener (even though message is not used)
+        return uiStrings.notification.unsavedChanges;
+      }
+    }, false);
+
+    editor.openPrep = function (func) {
+      $('#main_menu').hide();
+      if (undoMgr.getUndoStackSize() === 0) {
+        func(true);
+      } else {
+        $.confirm(uiStrings.notification.QwantToOpen, func);
+      }
+    };
+
+    function onDragEnter (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      // and indicator should be displayed here, such as "drop files here"
+    }
+
+    function onDragOver (e) {
+      e.stopPropagation();
+      e.preventDefault();
+    }
+
+    function onDragLeave (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      // hypothetical indicator should be removed here
+    }
+    // Use HTML5 File API: http://www.w3.org/TR/FileAPI/
+    // if browser has HTML5 File API support, then we will show the open menu item
+    // and provide a file input to click. When that change event fires, it will
+    // get the text contents of the file and send it to the canvas
+    if (window.FileReader) {
+      var importImage = function (e) {
+        $.process_cancel(uiStrings.notification.loadingImage);
+        e.stopPropagation();
+        e.preventDefault();
+        $('#workarea').removeAttr('style');
+        $('#main_menu').hide();
+        var file = (e.type === 'drop') ? e.dataTransfer.files[0] : this.files[0];
+        if (!file) {
+          $('#dialog_box').hide();
+          return;
+        }
+        /* if (file.type === 'application/pdf') { // Todo: Handle PDF imports
+
+        }
+        else */
+        if (file.type.indexOf('image') > -1) {
+          // Detected an image
+          // svg handling
+          var reader;
+          if (file.type.indexOf('svg') > -1) {
+            reader = new FileReader();
+            reader.onloadend = function (e) {
+              var newElement = svgCanvas.importSvgString(e.target.result, true);
+              svgCanvas.ungroupSelectedElement();
+              svgCanvas.ungroupSelectedElement();
+              svgCanvas.groupSelectedElements();
+              svgCanvas.alignSelectedElements('m', 'page');
+              svgCanvas.alignSelectedElements('c', 'page');
+              // highlight imported element, otherwise we get strange empty selectbox
+              svgCanvas.selectOnly([newElement]);
+              $('#dialog_box').hide();
+            };
+            reader.readAsText(file);
+          } else {
+            // bitmap handling
+            reader = new FileReader();
+            reader.onloadend = function (e) {
+              // let's insert the new image until we know its dimensions
+              var insertNewImage = function (width, height) {
+                var newImage = svgCanvas.addSvgElementFromJson({
+                  element: 'image',
+                  attr: {
+                    x: 0,
+                    y: 0,
+                    width: width,
+                    height: height,
+                    id: svgCanvas.getNextId(),
+                    style: 'pointer-events:inherit'
+                  }
+                });
+                svgCanvas.setHref(newImage, e.target.result);
+                svgCanvas.selectOnly([newImage]);
+                svgCanvas.alignSelectedElements('m', 'page');
+                svgCanvas.alignSelectedElements('c', 'page');
+                updateContextPanel();
+                $('#dialog_box').hide();
+              };
+              // create dummy img so we know the default dimensions
+              var imgWidth = 100;
+              var imgHeight = 100;
+              var img = new Image();
+              img.src = e.target.result;
+              img.style.opacity = 0;
+              img.onload = function () {
+                imgWidth = img.offsetWidth;
+                imgHeight = img.offsetHeight;
+                insertNewImage(imgWidth, imgHeight);
+              };
+            };
+            reader.readAsDataURL(file);
+          }
+        }
+      };
+
+      workarea[0].addEventListener('dragenter', onDragEnter, false);
+      workarea[0].addEventListener('dragover', onDragOver, false);
+      workarea[0].addEventListener('dragleave', onDragLeave, false);
+      workarea[0].addEventListener('drop', importImage, false);
+
+      var open = $('<input type="file">').change(function () {
+        var f = this;
+        editor.openPrep(function (ok) {
+          if (!ok) { return; }
+          svgCanvas.clear();
+          if (f.files.length === 1) {
+            $.process_cancel(uiStrings.notification.loadingImage);
+            var reader = new FileReader();
+            reader.onloadend = function (e) {
+              loadSvgString(e.target.result);
+              updateCanvas();
+            };
+            reader.readAsText(f.files[0]);
+          }
+        });
+      });
+      $('#tool_open').show().prepend(open);
+
+      var imgImport = $('<input type="file">').change(importImage);
+      $('#tool_import').show().prepend(imgImport);
+    }
+
+    // $(function () {
+    updateCanvas(true);
+    // });
+
+    //	var revnums = "svg-editor.js ($Rev$) ";
+    //	revnums += svgCanvas.getVersion();
+    //	$('#copyright')[0].setAttribute('title', revnums);
+
+    // For Compatibility with older extensions
+    $(function () {
+      window.svgCanvas = svgCanvas;
+      svgCanvas.ready = editor.ready;
+    });
+
+    editor.setLang = function (lang, allStrings) {
+      editor.langChanged = true;
+      $.pref('lang', lang);
+      $('#lang_select').val(lang);
+      if (!allStrings) {
+        return;
+      }
+      // var notif = allStrings.notification; // Currently unused
+      // $.extend will only replace the given strings
+      var oldLayerName = $('#layerlist tr.layersel td.layername').text();
+      var renameLayer = (oldLayerName === uiStrings.common.layer + ' 1');
+
+      $.extend(uiStrings, allStrings);
+      svgCanvas.setUiStrings(allStrings);
+      Actions.setTitles();
+
+      if (renameLayer) {
+        svgCanvas.renameCurrentLayer(uiStrings.common.layer + ' 1');
+        populateLayers();
+      }
+
+      // In case extensions loaded before the locale, now we execute a callback on them
+      if (extsPreLang.length) {
+        while (extsPreLang.length) {
+          var ext = extsPreLang.shift();
+          ext.langReady({lang: lang, uiStrings: uiStrings});
+        }
+      } else {
+        svgCanvas.runExtensions('langReady', {lang: lang, uiStrings: uiStrings});
+      }
+      svgCanvas.runExtensions('langChanged', lang);
+
+      // Update flyout tooltips
+      setFlyoutTitles();
+
+      // Copy title for certain tool elements
+      var elems = {
+        '#stroke_color': '#tool_stroke .icon_label, #tool_stroke .color_block',
+        '#fill_color': '#tool_fill label, #tool_fill .color_block',
+        '#linejoin_miter': '#cur_linejoin',
+        '#linecap_butt': '#cur_linecap'
+      };
+
+      $.each(elems, function (source, dest) {
+        $(dest).attr('title', $(source)[0].title);
+      });
+
+      // Copy alignment titles
+      $('#multiselected_panel div[id^=tool_align]').each(function () {
+        $('#tool_pos' + this.id.substr(10))[0].title = this.title;
+      });
+    };
+  };
+
+  editor.ready = function (cb) {
+    if (!isReady) {
+      callbacks.push(cb);
+    } else {
+      cb();
+    }
+  };
+
+  editor.runCallbacks = function () {
+    $.each(callbacks, function () {
+      this();
+    });
+    isReady = true;
+  };
+
+  editor.loadFromString = function (str) {
+    editor.ready(function () {
+      loadSvgString(str);
+    });
+  };
+
+  editor.disableUI = function (featList) {
+    // $(function () {
+    // 	$('#tool_wireframe, #tool_image, #main_button, #tool_source, #sidepanels').remove();
+    // 	$('#tools_top').css('left', 5);
+    // });
+  };
+
+  editor.loadFromURL = function (url, opts) {
+    if (!opts) { opts = {}; }
+
+    var cache = opts.cache;
+    var cb = opts.callback;
+
+    editor.ready(function () {
+      $.ajax({
+        'url': url,
+        'dataType': 'text',
+        cache: !!cache,
+        beforeSend: function () {
+          $.process_cancel(uiStrings.notification.loadingImage);
+        },
+        success: function (str) {
+          loadSvgString(str, cb);
+        },
+        error: function (xhr, stat, err) {
+          if (xhr.status !== 404 && xhr.responseText) {
+            loadSvgString(xhr.responseText, cb);
+          } else {
+            $.alert(uiStrings.notification.URLloadFail + ': \n' + err, cb);
+          }
+        },
+        complete: function () {
+          $('#dialog_box').hide();
+        }
+      });
+    });
+  };
+
+  editor.loadFromDataURI = function (str) {
+    editor.ready(function () {
+      var base64 = false;
+      var pre = str.match(/^data:image\/svg\+xml;base64,/);
+      if (pre) {
+        base64 = true;
+      } else {
+        pre = str.match(/^data:image\/svg\+xml(?:;(?:utf8)?)?,/);
+      }
+      if (pre) {
+        pre = pre[0];
+      }
+      var src = str.slice(pre.length);
+      loadSvgString(base64 ? Utils.decode64(src) : decodeURIComponent(src));
+    });
+  };
+
+  editor.addExtension = function () {
+    var args = arguments;
+
+    // Note that we don't want this on editor.ready since some extensions
+    // may want to run before then (like server_opensave).
+    $(function () {
+      if (svgCanvas) { svgCanvas.addExtension.apply(this, args); }
+    });
+  };
+
+  return editor;
 }(jQuery));
 
 // Run init once DOM is loaded
diff --git a/editor/svgcanvas.js b/editor/svgcanvas.js
index 2ed645d8..ca72c1f0 100644
--- a/editor/svgcanvas.js
+++ b/editor/svgcanvas.js
@@ -30,14 +30,14 @@
 
 (function () {
 if (!window.console) {
-	window.console = {};
-	window.console.log = function (str) {};
-	window.console.dir = function (str) {};
+  window.console = {};
+  window.console.log = function (str) {};
+  window.console.dir = function (str) {};
 }
 
 if (window.opera) {
-	window.console.log = function (str) { opera.postError(str); };
-	window.console.dir = function (str) {};
+  window.console.log = function (str) { opera.postError(str); };
+  window.console.dir = function (str) {};
 }
 }());
 
@@ -54,14 +54,14 @@ var NS = svgedit.NS;
 
 // Default configuration options
 var curConfig = {
-	show_outside_canvas: true,
-	selectNew: true,
-	dimensions: [640, 480]
+  show_outside_canvas: true,
+  selectNew: true,
+  dimensions: [640, 480]
 };
 
 // Update config with new one if given
 if (config) {
-	$.extend(curConfig, config);
+  $.extend(curConfig, config);
 }
 
 // Array with width/height of canvas
@@ -75,22 +75,22 @@ var svgdoc = container.ownerDocument;
 
 // This is a container for the document being edited, not the document itself.
 var svgroot = svgdoc.importNode(
-	svgedit.utilities.text2xml(
-		'<svg id="svgroot" xmlns="' + NS.SVG + '" xlinkns="' + NS.XLINK + '" ' +
-			'width="' + dimensions[0] + '" height="' + dimensions[1] + '" x="' + dimensions[0] + '" y="' + dimensions[1] + '" overflow="visible">' +
-			'<defs>' +
-				'<filter id="canvashadow" filterUnits="objectBoundingBox">' +
-					'<feGaussianBlur in="SourceAlpha" stdDeviation="4" result="blur"/>' +
-					'<feOffset in="blur" dx="5" dy="5" result="offsetBlur"/>' +
-					'<feMerge>' +
-						'<feMergeNode in="offsetBlur"/>' +
-						'<feMergeNode in="SourceGraphic"/>' +
-					'</feMerge>' +
-				'</filter>' +
-			'</defs>' +
-		'</svg>'
-	).documentElement,
-	true
+  svgedit.utilities.text2xml(
+    '<svg id="svgroot" xmlns="' + NS.SVG + '" xlinkns="' + NS.XLINK + '" ' +
+      'width="' + dimensions[0] + '" height="' + dimensions[1] + '" x="' + dimensions[0] + '" y="' + dimensions[1] + '" overflow="visible">' +
+      '<defs>' +
+        '<filter id="canvashadow" filterUnits="objectBoundingBox">' +
+          '<feGaussianBlur in="SourceAlpha" stdDeviation="4" result="blur"/>' +
+          '<feOffset in="blur" dx="5" dy="5" result="offsetBlur"/>' +
+          '<feMerge>' +
+            '<feMergeNode in="offsetBlur"/>' +
+            '<feMergeNode in="SourceGraphic"/>' +
+          '</feMerge>' +
+        '</filter>' +
+      '</defs>' +
+    '</svg>'
+  ).documentElement,
+  true
 );
 container.appendChild(svgroot);
 
@@ -99,24 +99,24 @@ var svgcontent = svgdoc.createElementNS(NS.SVG, 'svg');
 
 // This function resets the svgcontent element while keeping it in the DOM.
 var clearSvgContentElement = canvas.clearSvgContentElement = function () {
-	$(svgcontent).empty();
+  $(svgcontent).empty();
 
-	// TODO: Clear out all other attributes first?
-	$(svgcontent).attr({
-		id: 'svgcontent',
-		width: dimensions[0],
-		height: dimensions[1],
-		x: dimensions[0],
-		y: dimensions[1],
-		overflow: curConfig.show_outside_canvas ? 'visible' : 'hidden',
-		xmlns: NS.SVG,
-		'xmlns:se': NS.SE,
-		'xmlns:xlink': NS.XLINK
-	}).appendTo(svgroot);
+  // TODO: Clear out all other attributes first?
+  $(svgcontent).attr({
+    id: 'svgcontent',
+    width: dimensions[0],
+    height: dimensions[1],
+    x: dimensions[0],
+    y: dimensions[1],
+    overflow: curConfig.show_outside_canvas ? 'visible' : 'hidden',
+    xmlns: NS.SVG,
+    'xmlns:se': NS.SE,
+    'xmlns:xlink': NS.XLINK
+  }).appendTo(svgroot);
 
-	// TODO: make this string optional and set by the client
-	var comment = svgdoc.createComment(' Created with SVG-edit - https://github.com/SVG-Edit/svgedit');
-	svgcontent.appendChild(comment);
+  // TODO: make this string optional and set by the client
+  var comment = svgdoc.createComment(' Created with SVG-edit - https://github.com/SVG-Edit/svgedit');
+  svgcontent.appendChild(comment);
 };
 clearSvgContentElement();
 
@@ -129,7 +129,7 @@ var idprefix = 'svg_';
 // Parameters:
 // p - String with the new prefix
 canvas.setIdPrefix = function (p) {
-	idprefix = p;
+  idprefix = p;
 };
 
 // Current svgedit.draw.Drawing object
@@ -140,7 +140,7 @@ canvas.current_drawing_ = new svgedit.draw.Drawing(svgcontent, idprefix);
 // Returns the current Drawing.
 // @return {svgedit.draw.Drawing}
 var getCurrentDrawing = canvas.getCurrentDrawing = function () {
-	return canvas.current_drawing_;
+  return canvas.current_drawing_;
 };
 
 // Float displaying the current zoom level (1 = 100%, .5 = 50%, etc)
@@ -151,27 +151,27 @@ var currentGroup = null;
 
 // Object containing data for the currently selected styles
 var allProperties = {
-	shape: {
-		fill: (curConfig.initFill.color === 'none' ? '' : '#') + curConfig.initFill.color,
-		fill_paint: null,
-		fill_opacity: curConfig.initFill.opacity,
-		stroke: '#' + curConfig.initStroke.color,
-		stroke_paint: null,
-		stroke_opacity: curConfig.initStroke.opacity,
-		stroke_width: curConfig.initStroke.width,
-		stroke_dasharray: 'none',
-		stroke_linejoin: 'miter',
-		stroke_linecap: 'butt',
-		opacity: curConfig.initOpacity
-	}
+  shape: {
+    fill: (curConfig.initFill.color === 'none' ? '' : '#') + curConfig.initFill.color,
+    fill_paint: null,
+    fill_opacity: curConfig.initFill.opacity,
+    stroke: '#' + curConfig.initStroke.color,
+    stroke_paint: null,
+    stroke_opacity: curConfig.initStroke.opacity,
+    stroke_width: curConfig.initStroke.width,
+    stroke_dasharray: 'none',
+    stroke_linejoin: 'miter',
+    stroke_linecap: 'butt',
+    opacity: curConfig.initOpacity
+  }
 };
 
 allProperties.text = $.extend(true, {}, allProperties.shape);
 $.extend(allProperties.text, {
-	fill: '#000000',
-	stroke_width: curConfig.text.stroke_width,
-	font_size: curConfig.text.font_size,
-	font_family: curConfig.text.font_family
+  fill: '#000000',
+  stroke_width: curConfig.text.stroke_width,
+  font_size: curConfig.text.font_size,
+  font_family: curConfig.text.font_family
 });
 
 // Current shape style properties
@@ -182,27 +182,27 @@ var curShape = allProperties.shape;
 var selectedElements = [];
 
 var getJsonFromSvgElement = this.getJsonFromSvgElement = function (data) {
-	// Text node
-	if (data.nodeType === 3) return data.nodeValue;
+  // Text node
+  if (data.nodeType === 3) return data.nodeValue;
 
-	var retval = {
-		element: data.tagName,
-		// namespace: nsMap[data.namespaceURI],
-		attr: {},
-		children: []
-	};
+  var retval = {
+    element: data.tagName,
+    // namespace: nsMap[data.namespaceURI],
+    attr: {},
+    children: []
+  };
 
-	// Iterate attributes
-	for (var i = 0, attr; (attr = data.attributes[i]); i++) {
-		retval.attr[attr.name] = attr.value;
-	}
+  // Iterate attributes
+  for (var i = 0, attr; (attr = data.attributes[i]); i++) {
+    retval.attr[attr.name] = attr.value;
+  }
 
-	// Iterate children
-	for (var i = 0, node; (node = data.childNodes[i]); i++) {
-		retval.children[i] = getJsonFromSvgElement(node);
-	}
+  // Iterate children
+  for (var i = 0, node; (node = data.childNodes[i]); i++) {
+    retval.children[i] = getJsonFromSvgElement(node);
+  }
 
-	return retval;
+  return retval;
 };
 
 // Function: addSvgElementFromJson
@@ -218,46 +218,46 @@ var getJsonFromSvgElement = this.getJsonFromSvgElement = function (data) {
 //
 // Returns: The new element
 var addSvgElementFromJson = this.addSvgElementFromJson = function (data) {
-	if (typeof data === 'string') return svgdoc.createTextNode(data);
+  if (typeof data === 'string') return svgdoc.createTextNode(data);
 
-	var shape = svgedit.utilities.getElem(data.attr.id);
-	// if shape is a path but we need to create a rect/ellipse, then remove the path
-	var currentLayer = getCurrentDrawing().getCurrentLayer();
-	if (shape && data.element !== shape.tagName) {
-		currentLayer.removeChild(shape);
-		shape = null;
-	}
-	if (!shape) {
-		shape = svgdoc.createElementNS(NS.SVG, data.element);
-		if (currentLayer) {
-			(currentGroup || currentLayer).appendChild(shape);
-		}
-	}
-	if (data.curStyles) {
-		svgedit.utilities.assignAttributes(shape, {
-			'fill': curShape.fill,
-			'stroke': curShape.stroke,
-			'stroke-width': curShape.stroke_width,
-			'stroke-dasharray': curShape.stroke_dasharray,
-			'stroke-linejoin': curShape.stroke_linejoin,
-			'stroke-linecap': curShape.stroke_linecap,
-			'stroke-opacity': curShape.stroke_opacity,
-			'fill-opacity': curShape.fill_opacity,
-			'opacity': curShape.opacity / 2,
-			'style': 'pointer-events:inherit'
-		}, 100);
-	}
-	svgedit.utilities.assignAttributes(shape, data.attr, 100);
-	svgedit.utilities.cleanupElement(shape);
+  var shape = svgedit.utilities.getElem(data.attr.id);
+  // if shape is a path but we need to create a rect/ellipse, then remove the path
+  var currentLayer = getCurrentDrawing().getCurrentLayer();
+  if (shape && data.element !== shape.tagName) {
+    currentLayer.removeChild(shape);
+    shape = null;
+  }
+  if (!shape) {
+    shape = svgdoc.createElementNS(NS.SVG, data.element);
+    if (currentLayer) {
+      (currentGroup || currentLayer).appendChild(shape);
+    }
+  }
+  if (data.curStyles) {
+    svgedit.utilities.assignAttributes(shape, {
+      'fill': curShape.fill,
+      'stroke': curShape.stroke,
+      'stroke-width': curShape.stroke_width,
+      'stroke-dasharray': curShape.stroke_dasharray,
+      'stroke-linejoin': curShape.stroke_linejoin,
+      'stroke-linecap': curShape.stroke_linecap,
+      'stroke-opacity': curShape.stroke_opacity,
+      'fill-opacity': curShape.fill_opacity,
+      'opacity': curShape.opacity / 2,
+      'style': 'pointer-events:inherit'
+    }, 100);
+  }
+  svgedit.utilities.assignAttributes(shape, data.attr, 100);
+  svgedit.utilities.cleanupElement(shape);
 
-	// Children
-	if (data.children) {
-		data.children.forEach(function (child) {
-			shape.appendChild(addSvgElementFromJson(child));
-		});
-	}
+  // Children
+  if (data.children) {
+    data.children.forEach(function (child) {
+      shape.appendChild(addSvgElementFromJson(child));
+    });
+  }
 
-	return shape;
+  return shape;
 };
 
 // import svgtransformlist.js
@@ -274,25 +274,25 @@ var transformListToTransform = canvas.transformListToTransform = svgedit.math.tr
 // initialize from units.js
 // send in an object implementing the ElementContainer interface (see units.js)
 svgedit.units.init({
-	getBaseUnit: function () { return curConfig.baseUnit; },
-	getElement: svgedit.utilities.getElem,
-	getHeight: function () { return svgcontent.getAttribute('height') / currentZoom; },
-	getWidth: function () { return svgcontent.getAttribute('width') / currentZoom; },
-	getRoundDigits: function () { return saveOptions.round_digits; }
+  getBaseUnit: function () { return curConfig.baseUnit; },
+  getElement: svgedit.utilities.getElem,
+  getHeight: function () { return svgcontent.getAttribute('height') / currentZoom; },
+  getWidth: function () { return svgcontent.getAttribute('width') / currentZoom; },
+  getRoundDigits: function () { return saveOptions.round_digits; }
 });
 // import from units.js
 /* var convertToNum = */ canvas.convertToNum = svgedit.units.convertToNum;
 
 // import from svgutils.js
 svgedit.utilities.init({
-	getDOMDocument: function () { return svgdoc; },
-	getDOMContainer: function () { return container; },
-	getSVGRoot: function () { return svgroot; },
-	// TODO: replace this mostly with a way to get the current drawing.
-	getSelectedElements: function () { return selectedElements; },
-	getSVGContent: function () { return svgcontent; },
-	getBaseUnit: function () { return curConfig.baseUnit; },
-	getSnappingStep: function () { return curConfig.snappingStep; }
+  getDOMDocument: function () { return svgdoc; },
+  getDOMContainer: function () { return container; },
+  getSVGRoot: function () { return svgroot; },
+  // TODO: replace this mostly with a way to get the current drawing.
+  getSelectedElements: function () { return selectedElements; },
+  getSVGContent: function () { return svgcontent; },
+  getBaseUnit: function () { return curConfig.baseUnit; },
+  getSnappingStep: function () { return curConfig.snappingStep; }
 });
 var findDefs = canvas.findDefs = svgedit.utilities.findDefs;
 var getUrlFromAttr = canvas.getUrlFromAttr = svgedit.utilities.getUrlFromAttr;
@@ -308,16 +308,16 @@ var cleanupElement = this.cleanupElement = svgedit.utilities.cleanupElement;
 
 // import from coords.js
 svgedit.coords.init({
-	getDrawing: function () { return getCurrentDrawing(); },
-	getGridSnapping: function () { return curConfig.gridSnapping; }
+  getDrawing: function () { return getCurrentDrawing(); },
+  getGridSnapping: function () { return curConfig.gridSnapping; }
 });
 var remapElement = this.remapElement = svgedit.coords.remapElement;
 
 // import from recalculate.js
 svgedit.recalculate.init({
-	getSVGRoot: function () { return svgroot; },
-	getStartTransform: function () { return startTransform; },
-	setStartTransform: function (transform) { startTransform = transform; }
+  getSVGRoot: function () { return svgroot; },
+  getStartTransform: function () { return startTransform; },
+  setStartTransform: function (transform) { startTransform = transform; }
 });
 var recalculateDimensions = this.recalculateDimensions = svgedit.recalculate.recalculateDimensions;
 
@@ -334,66 +334,66 @@ var BatchCommand = svgedit.history.BatchCommand;
 var call;
 // Implement the svgedit.history.HistoryEventHandler interface.
 canvas.undoMgr = new svgedit.history.UndoManager({
-	handleHistoryEvent: function (eventType, cmd) {
-		var EventTypes = svgedit.history.HistoryEventTypes;
-		// TODO: handle setBlurOffsets.
-		if (eventType === EventTypes.BEFORE_UNAPPLY || eventType === EventTypes.BEFORE_APPLY) {
-			canvas.clearSelection();
-		} else if (eventType === EventTypes.AFTER_APPLY || eventType === EventTypes.AFTER_UNAPPLY) {
-			var elems = cmd.elements();
-			canvas.pathActions.clear();
-			call('changed', elems);
-			var cmdType = cmd.type();
-			var isApply = (eventType === EventTypes.AFTER_APPLY);
-			if (cmdType === MoveElementCommand.type()) {
-				var parent = isApply ? cmd.newParent : cmd.oldParent;
-				if (parent === svgcontent) {
-					canvas.identifyLayers();
-				}
-			} else if (cmdType === InsertElementCommand.type() ||
-					cmdType === RemoveElementCommand.type()) {
-				if (cmd.parent === svgcontent) {
-					canvas.identifyLayers();
-				}
-				if (cmdType === InsertElementCommand.type()) {
-					if (isApply) { restoreRefElems(cmd.elem); }
-				} else {
-					if (!isApply) { restoreRefElems(cmd.elem); }
-				}
-				if (cmd.elem.tagName === 'use') {
-					setUseData(cmd.elem);
-				}
-			} else if (cmdType === ChangeElementCommand.type()) {
-				// if we are changing layer names, re-identify all layers
-				if (cmd.elem.tagName === 'title' &&
-					cmd.elem.parentNode.parentNode === svgcontent
-				) {
-					canvas.identifyLayers();
-				}
-				var values = isApply ? cmd.newValues : cmd.oldValues;
-				// If stdDeviation was changed, update the blur.
-				if (values.stdDeviation) {
-					canvas.setBlurOffsets(cmd.elem.parentNode, values.stdDeviation);
-				}
-				// This is resolved in later versions of webkit, perhaps we should
-				// have a featured detection for correct 'use' behavior?
-				// ——————————
-				// Remove & Re-add hack for Webkit (issue 775)
-				// if (cmd.elem.tagName === 'use' && svgedit.browser.isWebkit()) {
-				//	var elem = cmd.elem;
-				//	if (!elem.getAttribute('x') && !elem.getAttribute('y')) {
-				//		var parent = elem.parentNode;
-				//		var sib = elem.nextSibling;
-				//		parent.removeChild(elem);
-				//		parent.insertBefore(elem, sib);
-				//	}
-				// }
-			}
-		}
-	}
+  handleHistoryEvent: function (eventType, cmd) {
+    var EventTypes = svgedit.history.HistoryEventTypes;
+    // TODO: handle setBlurOffsets.
+    if (eventType === EventTypes.BEFORE_UNAPPLY || eventType === EventTypes.BEFORE_APPLY) {
+      canvas.clearSelection();
+    } else if (eventType === EventTypes.AFTER_APPLY || eventType === EventTypes.AFTER_UNAPPLY) {
+      var elems = cmd.elements();
+      canvas.pathActions.clear();
+      call('changed', elems);
+      var cmdType = cmd.type();
+      var isApply = (eventType === EventTypes.AFTER_APPLY);
+      if (cmdType === MoveElementCommand.type()) {
+        var parent = isApply ? cmd.newParent : cmd.oldParent;
+        if (parent === svgcontent) {
+          canvas.identifyLayers();
+        }
+      } else if (cmdType === InsertElementCommand.type() ||
+          cmdType === RemoveElementCommand.type()) {
+        if (cmd.parent === svgcontent) {
+          canvas.identifyLayers();
+        }
+        if (cmdType === InsertElementCommand.type()) {
+          if (isApply) { restoreRefElems(cmd.elem); }
+        } else {
+          if (!isApply) { restoreRefElems(cmd.elem); }
+        }
+        if (cmd.elem.tagName === 'use') {
+          setUseData(cmd.elem);
+        }
+      } else if (cmdType === ChangeElementCommand.type()) {
+        // if we are changing layer names, re-identify all layers
+        if (cmd.elem.tagName === 'title' &&
+          cmd.elem.parentNode.parentNode === svgcontent
+        ) {
+          canvas.identifyLayers();
+        }
+        var values = isApply ? cmd.newValues : cmd.oldValues;
+        // If stdDeviation was changed, update the blur.
+        if (values.stdDeviation) {
+          canvas.setBlurOffsets(cmd.elem.parentNode, values.stdDeviation);
+        }
+        // This is resolved in later versions of webkit, perhaps we should
+        // have a featured detection for correct 'use' behavior?
+        // ——————————
+        // Remove & Re-add hack for Webkit (issue 775)
+        // if (cmd.elem.tagName === 'use' && svgedit.browser.isWebkit()) {
+        //	var elem = cmd.elem;
+        //	if (!elem.getAttribute('x') && !elem.getAttribute('y')) {
+        //		var parent = elem.parentNode;
+        //		var sib = elem.nextSibling;
+        //		parent.removeChild(elem);
+        //		parent.insertBefore(elem, sib);
+        //	}
+        // }
+      }
+    }
+  }
 });
 var addCommandToHistory = function (cmd) {
-	canvas.undoMgr.addCommandToHistory(cmd);
+  canvas.undoMgr.addCommandToHistory(cmd);
 };
 
 /**
@@ -402,33 +402,33 @@ var addCommandToHistory = function (cmd) {
  * @returns {svgedit.history.HistoryRecordingService}
  */
 function historyRecordingService (hrService) {
-	return hrService || new svgedit.history.HistoryRecordingService(canvas.undoMgr);
+  return hrService || new svgedit.history.HistoryRecordingService(canvas.undoMgr);
 }
 
 // import from select.js
 svgedit.select.init(curConfig, {
-	createSVGElement: function (jsonMap) { return canvas.addSvgElementFromJson(jsonMap); },
-	svgRoot: function () { return svgroot; },
-	svgContent: function () { return svgcontent; },
-	currentZoom: function () { return currentZoom; },
-	// TODO(codedread): Remove when getStrokedBBox() has been put into svgutils.js.
-	getStrokedBBox: function (elems) { return canvas.getStrokedBBox([elems]); }
+  createSVGElement: function (jsonMap) { return canvas.addSvgElementFromJson(jsonMap); },
+  svgRoot: function () { return svgroot; },
+  svgContent: function () { return svgcontent; },
+  currentZoom: function () { return currentZoom; },
+  // TODO(codedread): Remove when getStrokedBBox() has been put into svgutils.js.
+  getStrokedBBox: function (elems) { return canvas.getStrokedBBox([elems]); }
 });
 // this object manages selectors for us
 var selectorManager = this.selectorManager = svgedit.select.getSelectorManager();
 
 // Import from path.js
 svgedit.path.init({
-	getCurrentZoom: function () { return currentZoom; },
-	getSVGRoot: function () { return svgroot; }
+  getCurrentZoom: function () { return currentZoom; },
+  getSVGRoot: function () { return svgroot; }
 });
 
 // Interface strings, usually for title elements
 var uiStrings = {
-	exportNoBlur: 'Blurred elements will appear as un-blurred',
-	exportNoforeignObject: 'foreignObject elements will not appear',
-	exportNoDashArray: 'Strokes will appear filled',
-	exportNoText: 'Text may not appear as expected'
+  exportNoBlur: 'Blurred elements will appear as un-blurred',
+  exportNoforeignObject: 'foreignObject elements will not appear',
+  exportNoDashArray: 'Strokes will appear filled',
+  exportNoText: 'Text may not appear as expected'
 };
 
 var visElems = 'a,circle,ellipse,foreignObject,g,image,line,path,polygon,polyline,rect,svg,text,tspan,use';
@@ -439,35 +439,35 @@ var elData = $.data;
 // Animation element to change the opacity of any newly created element
 var opacAni = document.createElementNS(NS.SVG, 'animate');
 $(opacAni).attr({
-	attributeName: 'opacity',
-	begin: 'indefinite',
-	dur: 1,
-	fill: 'freeze'
+  attributeName: 'opacity',
+  begin: 'indefinite',
+  dur: 1,
+  fill: 'freeze'
 }).appendTo(svgroot);
 
 var restoreRefElems = function (elem) {
-	// Look for missing reference elements, restore any found
-	var o, i, l,
-		attrs = $(elem).attr(refAttrs);
-	for (o in attrs) {
-		var val = attrs[o];
-		if (val && val.indexOf('url(') === 0) {
-			var id = svgedit.utilities.getUrlFromAttr(val).substr(1);
-			var ref = getElem(id);
-			if (!ref) {
-				svgedit.utilities.findDefs().appendChild(removedElements[id]);
-				delete removedElements[id];
-			}
-		}
-	}
+  // Look for missing reference elements, restore any found
+  var o, i, l,
+    attrs = $(elem).attr(refAttrs);
+  for (o in attrs) {
+    var val = attrs[o];
+    if (val && val.indexOf('url(') === 0) {
+      var id = svgedit.utilities.getUrlFromAttr(val).substr(1);
+      var ref = getElem(id);
+      if (!ref) {
+        svgedit.utilities.findDefs().appendChild(removedElements[id]);
+        delete removedElements[id];
+      }
+    }
+  }
 
-	var childs = elem.getElementsByTagName('*');
+  var childs = elem.getElementsByTagName('*');
 
-	if (childs.length) {
-		for (i = 0, l = childs.length; i < l; i++) {
-			restoreRefElems(childs[i]);
-		}
-	}
+  if (childs.length) {
+    for (i = 0, l = childs.length; i < l; i++) {
+      restoreRefElems(childs[i]);
+    }
+  }
 };
 
 // (function () {
@@ -482,70 +482,70 @@ var restoreRefElems = function (elem) {
 // Object to contain image data for raster images that were found encodable
 var encodableImages = {},
 
-	// String with image URL of last loadable image
-	lastGoodImgUrl = curConfig.imgPath + 'logo.png',
+  // String with image URL of last loadable image
+  lastGoodImgUrl = curConfig.imgPath + 'logo.png',
 
-	// Array with current disabled elements (for in-group editing)
-	disabledElems = [],
+  // Array with current disabled elements (for in-group editing)
+  disabledElems = [],
 
-	// Object with save options
-	saveOptions = {round_digits: 5},
+  // Object with save options
+  saveOptions = {round_digits: 5},
 
-	// Boolean indicating whether or not a draw action has been started
-	started = false,
+  // Boolean indicating whether or not a draw action has been started
+  started = false,
 
-	// String with an element's initial transform attribute value
-	startTransform = null,
+  // String with an element's initial transform attribute value
+  startTransform = null,
 
-	// String indicating the current editor mode
-	currentMode = 'select',
+  // String indicating the current editor mode
+  currentMode = 'select',
 
-	// String with the current direction in which an element is being resized
-	currentResizeMode = 'none',
+  // String with the current direction in which an element is being resized
+  currentResizeMode = 'none',
 
-	// Object with IDs for imported files, to see if one was already added
-	importIds = {},
+  // Object with IDs for imported files, to see if one was already added
+  importIds = {},
 
-	// Current text style properties
-	curText = allProperties.text,
+  // Current text style properties
+  curText = allProperties.text,
 
-	// Current general properties
-	curProperties = curShape,
+  // Current general properties
+  curProperties = curShape,
 
-	// Array with selected elements' Bounding box object
-	// selectedBBoxes = new Array(1),
+  // Array with selected elements' Bounding box object
+  // selectedBBoxes = new Array(1),
 
-	// The DOM element that was just selected
-	justSelected = null,
+  // The DOM element that was just selected
+  justSelected = null,
 
-	// DOM element for selection rectangle drawn by the user
-	rubberBox = null,
+  // DOM element for selection rectangle drawn by the user
+  rubberBox = null,
 
-	// Array of current BBoxes, used in getIntersectionList().
-	curBBoxes = [],
+  // Array of current BBoxes, used in getIntersectionList().
+  curBBoxes = [],
 
-	// Object to contain all included extensions
-	extensions = {},
+  // Object to contain all included extensions
+  extensions = {},
 
-	// Canvas point for the most recent right click
-	lastClickPoint = null,
+  // Canvas point for the most recent right click
+  lastClickPoint = null,
 
-	// Map of deleted reference elements
-	removedElements = {};
+  // Map of deleted reference elements
+  removedElements = {};
 
 // Should this return an array by default, so extension results aren't overwritten?
 var runExtensions = this.runExtensions = function (action, vars, returnArray) {
-	var result = returnArray ? [] : false;
-	$.each(extensions, function (name, opts) {
-		if (opts && action in opts) {
-			if (returnArray) {
-				result.push(opts[action](vars));
-			} else {
-				result = opts[action](vars);
-			}
-		}
-	});
-	return result;
+  var result = returnArray ? [] : false;
+  $.each(extensions, function (name, opts) {
+    if (opts && action in opts) {
+      if (returnArray) {
+        result.push(opts[action](vars));
+      } else {
+        result = opts[action](vars);
+      }
+    }
+  });
+  return result;
 };
 
 // Function: addExtension
@@ -555,29 +555,29 @@ var runExtensions = this.runExtensions = function (action, vars, returnArray) {
 // name - String with the ID of the extension
 // extFunc - Function supplied by the extension with its data
 this.addExtension = function (name, extFunc) {
-	var ext;
-	if (!(name in extensions)) {
-		// Provide private vars/funcs here. Is there a better way to do this?
-		if ($.isFunction(extFunc)) {
-			ext = extFunc($.extend(canvas.getPrivateMethods(), {
-				svgroot: svgroot,
-				svgcontent: svgcontent,
-				nonce: getCurrentDrawing().getNonce(),
-				selectorManager: selectorManager
-			}));
-		} else {
-			ext = extFunc;
-		}
-		extensions[name] = ext;
-		call('extension_added', ext);
-	} else {
-		console.log('Cannot add extension "' + name + '", an extension by that name already exists.');
-	}
+  var ext;
+  if (!(name in extensions)) {
+    // Provide private vars/funcs here. Is there a better way to do this?
+    if ($.isFunction(extFunc)) {
+      ext = extFunc($.extend(canvas.getPrivateMethods(), {
+        svgroot: svgroot,
+        svgcontent: svgcontent,
+        nonce: getCurrentDrawing().getNonce(),
+        selectorManager: selectorManager
+      }));
+    } else {
+      ext = extFunc;
+    }
+    extensions[name] = ext;
+    call('extension_added', ext);
+  } else {
+    console.log('Cannot add extension "' + name + '", an extension by that name already exists.');
+  }
 };
 
 // This method rounds the incoming value to the nearest value based on the currentZoom
 var round = this.round = function (val) {
-	return parseInt(val * currentZoom, 10) / currentZoom;
+  return parseInt(val * currentZoom, 10) / currentZoom;
 };
 
 // This method sends back an array or a NodeList full of elements that
@@ -588,58 +588,58 @@ var round = this.round = function (val) {
 // Reference:
 // Firefox does not implement getIntersectionList(), see https://bugzilla.mozilla.org/show_bug.cgi?id=501421
 var getIntersectionList = this.getIntersectionList = function (rect) {
-	if (rubberBox == null) { return null; }
+  if (rubberBox == null) { return null; }
 
-	var parent = currentGroup || getCurrentDrawing().getCurrentLayer();
+  var parent = currentGroup || getCurrentDrawing().getCurrentLayer();
 
-	var rubberBBox;
-	if (!rect) {
-		rubberBBox = rubberBox.getBBox();
-		var o, bb = svgcontent.createSVGRect();
+  var rubberBBox;
+  if (!rect) {
+    rubberBBox = rubberBox.getBBox();
+    var o, bb = svgcontent.createSVGRect();
 
-		for (o in rubberBBox) {
-			bb[o] = rubberBBox[o] / currentZoom;
-		}
-		rubberBBox = bb;
-	} else {
-		rubberBBox = svgcontent.createSVGRect();
-		rubberBBox.x = rect.x;
-		rubberBBox.y = rect.y;
-		rubberBBox.width = rect.width;
-		rubberBBox.height = rect.height;
-	}
+    for (o in rubberBBox) {
+      bb[o] = rubberBBox[o] / currentZoom;
+    }
+    rubberBBox = bb;
+  } else {
+    rubberBBox = svgcontent.createSVGRect();
+    rubberBBox.x = rect.x;
+    rubberBBox.y = rect.y;
+    rubberBBox.width = rect.width;
+    rubberBBox.height = rect.height;
+  }
 
-	var resultList = null;
-	if (!svgedit.browser.isIE) {
-		if (typeof svgroot.getIntersectionList === 'function') {
-			// Offset the bbox of the rubber box by the offset of the svgcontent element.
-			rubberBBox.x += parseInt(svgcontent.getAttribute('x'), 10);
-			rubberBBox.y += parseInt(svgcontent.getAttribute('y'), 10);
+  var resultList = null;
+  if (!svgedit.browser.isIE) {
+    if (typeof svgroot.getIntersectionList === 'function') {
+      // Offset the bbox of the rubber box by the offset of the svgcontent element.
+      rubberBBox.x += parseInt(svgcontent.getAttribute('x'), 10);
+      rubberBBox.y += parseInt(svgcontent.getAttribute('y'), 10);
 
-			resultList = svgroot.getIntersectionList(rubberBBox, parent);
-		}
-	}
+      resultList = svgroot.getIntersectionList(rubberBBox, parent);
+    }
+  }
 
-	if (resultList == null || typeof resultList.item !== 'function') {
-		resultList = [];
+  if (resultList == null || typeof resultList.item !== 'function') {
+    resultList = [];
 
-		if (!curBBoxes.length) {
-			// Cache all bboxes
-			curBBoxes = getVisibleElementsAndBBoxes(parent);
-		}
-		var i = curBBoxes.length;
-		while (i--) {
-			if (!rubberBBox.width) { continue; }
-			if (svgedit.math.rectsIntersect(rubberBBox, curBBoxes[i].bbox)) {
-				resultList.push(curBBoxes[i].elem);
-			}
-		}
-	}
+    if (!curBBoxes.length) {
+      // Cache all bboxes
+      curBBoxes = getVisibleElementsAndBBoxes(parent);
+    }
+    var i = curBBoxes.length;
+    while (i--) {
+      if (!rubberBBox.width) { continue; }
+      if (svgedit.math.rectsIntersect(rubberBBox, curBBoxes[i].bbox)) {
+        resultList.push(curBBoxes[i].elem);
+      }
+    }
+  }
 
-	// addToSelection expects an array, but it's ok to pass a NodeList
-	// because using square-bracket notation is allowed:
-	// http://www.w3.org/TR/DOM-Level-2-Core/ecma-script-binding.html
-	return resultList;
+  // addToSelection expects an array, but it's ok to pass a NodeList
+  // because using square-bracket notation is allowed:
+  // http://www.w3.org/TR/DOM-Level-2-Core/ecma-script-binding.html
+  return resultList;
 };
 
 // TODO(codedread): Migrate this into svgutils.js
@@ -652,8 +652,8 @@ var getIntersectionList = this.getIntersectionList = function (rect) {
 // Returns:
 // A single bounding box object
 var getStrokedBBox = this.getStrokedBBox = function (elems) {
-	if (!elems) { elems = getVisibleElements(); }
-	return svgedit.utilities.getStrokedBBox(elems, addSvgElementFromJson, pathActions);
+  if (!elems) { elems = getVisibleElements(); }
+  return svgedit.utilities.getStrokedBBox(elems, addSvgElementFromJson, pathActions);
 };
 
 // Function: getVisibleElements
@@ -667,17 +667,17 @@ var getStrokedBBox = this.getStrokedBBox = function (elems) {
 // Returns:
 // An array with all "visible" elements.
 var getVisibleElements = this.getVisibleElements = function (parent) {
-	if (!parent) {
-		parent = $(svgcontent).children(); // Prevent layers from being included
-	}
+  if (!parent) {
+    parent = $(svgcontent).children(); // Prevent layers from being included
+  }
 
-	var contentElems = [];
-	$(parent).children().each(function (i, elem) {
-		if (elem.getBBox) {
-			contentElems.push(elem);
-		}
-	});
-	return contentElems.reverse();
+  var contentElems = [];
+  $(parent).children().each(function (i, elem) {
+    if (elem.getBBox) {
+      contentElems.push(elem);
+    }
+  });
+  return contentElems.reverse();
 };
 
 // Function: getVisibleElementsAndBBoxes
@@ -693,16 +693,16 @@ var getVisibleElements = this.getVisibleElements = function (parent) {
 // * elem - The element
 // * bbox - The element's BBox as retrieved from getStrokedBBox
 var getVisibleElementsAndBBoxes = this.getVisibleElementsAndBBoxes = function (parent) {
-	if (!parent) {
-		parent = $(svgcontent).children(); // Prevent layers from being included
-	}
-	var contentElems = [];
-	$(parent).children().each(function (i, elem) {
-		if (elem.getBBox) {
-			contentElems.push({elem: elem, bbox: getStrokedBBox([elem])});
-		}
-	});
-	return contentElems.reverse();
+  if (!parent) {
+    parent = $(svgcontent).children(); // Prevent layers from being included
+  }
+  var contentElems = [];
+  $(parent).children().each(function (i, elem) {
+    if (elem.getBBox) {
+      contentElems.push({elem: elem, bbox: getStrokedBBox([elem])});
+    }
+  });
+  return contentElems.reverse();
 };
 
 // Function: groupSvgElem
@@ -711,9 +711,9 @@ var getVisibleElementsAndBBoxes = this.getVisibleElementsAndBBoxes = function (p
 // Parameters:
 // elem - SVG element to wrap
 var groupSvgElem = this.groupSvgElem = function (elem) {
-	var g = document.createElementNS(NS.SVG, 'g');
-	elem.parentNode.replaceChild(g, elem);
-	$(g).append(elem).data('gsvg', elem)[0].id = getNextId();
+  var g = document.createElementNS(NS.SVG, 'g');
+  elem.parentNode.replaceChild(g, elem);
+  $(g).append(elem).data('gsvg', elem)[0].id = getNextId();
 };
 
 // Set scope for these functions
@@ -734,9 +734,9 @@ getNextId = c.getNextId = function () { return getCurrentDrawing().getNextId();
 // event - String with the event name
 // arg - Argument to pass through to the callback function
 call = c.call = function (event, arg) {
-	if (events[event]) {
-		return events[event](this, arg);
-	}
+  if (events[event]) {
+    return events[event](this, arg);
+  }
 };
 
 // Function: bind
@@ -749,9 +749,9 @@ call = c.call = function (event, arg) {
 // Return:
 // The previous event
 c.bind = function (event, f) {
-	var old = events[event];
-	events[event] = f;
-	return old;
+  var old = events[event];
+  events[event] = f;
+  return old;
 };
 }(canvas));
 
@@ -761,16 +761,16 @@ c.bind = function (event, f) {
 // Parameters:
 // newDoc - The SVG DOM document
 this.prepareSvg = function (newDoc) {
-	this.sanitizeSvg(newDoc.documentElement);
+  this.sanitizeSvg(newDoc.documentElement);
 
-	// convert paths into absolute commands
-	var i, path, len,
-		paths = newDoc.getElementsByTagNameNS(NS.SVG, 'path');
-	for (i = 0, len = paths.length; i < len; ++i) {
-		path = paths[i];
-		path.setAttribute('d', pathActions.convertPath(path));
-		pathActions.fixEnd(path);
-	}
+  // convert paths into absolute commands
+  var i, path, len,
+    paths = newDoc.getElementsByTagNameNS(NS.SVG, 'path');
+  for (i = 0, len = paths.length; i < len; ++i) {
+    path = paths[i];
+    path.setAttribute('d', pathActions.convertPath(path));
+    pathActions.fixEnd(path);
+  }
 };
 
 // Function: ffClone
@@ -783,14 +783,14 @@ this.prepareSvg = function (newDoc) {
 // Parameters:
 // elem - The (text) DOM element to clone
 var ffClone = function (elem) {
-	if (!svgedit.browser.isGecko()) { return elem; }
-	var clone = elem.cloneNode(true);
-	elem.parentNode.insertBefore(clone, elem);
-	elem.parentNode.removeChild(elem);
-	selectorManager.releaseSelector(elem);
-	selectedElements[0] = clone;
-	selectorManager.requestSelector(clone).showGrips(true);
-	return clone;
+  if (!svgedit.browser.isGecko()) { return elem; }
+  var clone = elem.cloneNode(true);
+  elem.parentNode.insertBefore(clone, elem);
+  elem.parentNode.removeChild(elem);
+  selectorManager.releaseSelector(elem);
+  selectedElements[0] = clone;
+  selectorManager.requestSelector(clone).showGrips(true);
+  return clone;
 };
 
 // this.each is deprecated, if any extension used this it can be recreated by doing this:
@@ -808,78 +808,78 @@ var ffClone = function (elem) {
 // val - The new rotation angle in degrees
 // preventUndo - Boolean indicating whether the action should be undoable or not
 this.setRotationAngle = function (val, preventUndo) {
-	// ensure val is the proper type
-	val = parseFloat(val);
-	var elem = selectedElements[0];
-	var oldTransform = elem.getAttribute('transform');
-	var bbox = svgedit.utilities.getBBox(elem);
-	var cx = bbox.x + bbox.width / 2, cy = bbox.y + bbox.height / 2;
-	var tlist = svgedit.transformlist.getTransformList(elem);
+  // ensure val is the proper type
+  val = parseFloat(val);
+  var elem = selectedElements[0];
+  var oldTransform = elem.getAttribute('transform');
+  var bbox = svgedit.utilities.getBBox(elem);
+  var cx = bbox.x + bbox.width / 2, cy = bbox.y + bbox.height / 2;
+  var tlist = svgedit.transformlist.getTransformList(elem);
 
-	// only remove the real rotational transform if present (i.e. at index=0)
-	if (tlist.numberOfItems > 0) {
-		var xform = tlist.getItem(0);
-		if (xform.type === 4) {
-			tlist.removeItem(0);
-		}
-	}
-	// find Rnc and insert it
-	if (val !== 0) {
-		var center = svgedit.math.transformPoint(cx, cy, svgedit.math.transformListToTransform(tlist).matrix);
-		var Rnc = svgroot.createSVGTransform();
-		Rnc.setRotate(val, center.x, center.y);
-		if (tlist.numberOfItems) {
-			tlist.insertItemBefore(Rnc, 0);
-		} else {
-			tlist.appendItem(Rnc);
-		}
-	} else if (tlist.numberOfItems === 0) {
-		elem.removeAttribute('transform');
-	}
+  // only remove the real rotational transform if present (i.e. at index=0)
+  if (tlist.numberOfItems > 0) {
+    var xform = tlist.getItem(0);
+    if (xform.type === 4) {
+      tlist.removeItem(0);
+    }
+  }
+  // find Rnc and insert it
+  if (val !== 0) {
+    var center = svgedit.math.transformPoint(cx, cy, svgedit.math.transformListToTransform(tlist).matrix);
+    var Rnc = svgroot.createSVGTransform();
+    Rnc.setRotate(val, center.x, center.y);
+    if (tlist.numberOfItems) {
+      tlist.insertItemBefore(Rnc, 0);
+    } else {
+      tlist.appendItem(Rnc);
+    }
+  } else if (tlist.numberOfItems === 0) {
+    elem.removeAttribute('transform');
+  }
 
-	if (!preventUndo) {
-		// we need to undo it, then redo it so it can be undo-able! :)
-		// TODO: figure out how to make changes to transform list undo-able cross-browser?
-		var newTransform = elem.getAttribute('transform');
-		elem.setAttribute('transform', oldTransform);
-		changeSelectedAttribute('transform', newTransform, selectedElements);
-		call('changed', selectedElements);
-	}
-	// var pointGripContainer = svgedit.utilities.getElem('pathpointgrip_container');
-	// if (elem.nodeName === 'path' && pointGripContainer) {
-	// 	pathActions.setPointContainerTransform(elem.getAttribute('transform'));
-	// }
-	var selector = selectorManager.requestSelector(selectedElements[0]);
-	selector.resize();
-	selector.updateGripCursors(val);
+  if (!preventUndo) {
+    // we need to undo it, then redo it so it can be undo-able! :)
+    // TODO: figure out how to make changes to transform list undo-able cross-browser?
+    var newTransform = elem.getAttribute('transform');
+    elem.setAttribute('transform', oldTransform);
+    changeSelectedAttribute('transform', newTransform, selectedElements);
+    call('changed', selectedElements);
+  }
+  // var pointGripContainer = svgedit.utilities.getElem('pathpointgrip_container');
+  // if (elem.nodeName === 'path' && pointGripContainer) {
+  // 	pathActions.setPointContainerTransform(elem.getAttribute('transform'));
+  // }
+  var selector = selectorManager.requestSelector(selectedElements[0]);
+  selector.resize();
+  selector.updateGripCursors(val);
 };
 
 // Function: recalculateAllSelectedDimensions
 // Runs recalculateDimensions on the selected elements,
 // adding the changes to a single batch command
 var recalculateAllSelectedDimensions = this.recalculateAllSelectedDimensions = function () {
-	var text = (currentResizeMode === 'none' ? 'position' : 'size');
-	var batchCmd = new svgedit.history.BatchCommand(text);
+  var text = (currentResizeMode === 'none' ? 'position' : 'size');
+  var batchCmd = new svgedit.history.BatchCommand(text);
 
-	var i = selectedElements.length;
-	while (i--) {
-		var elem = selectedElements[i];
-		// if (svgedit.utilities.getRotationAngle(elem) && !svgedit.math.hasMatrixTransform(getTransformList(elem))) { continue; }
-		var cmd = svgedit.recalculate.recalculateDimensions(elem);
-		if (cmd) {
-			batchCmd.addSubCommand(cmd);
-		}
-	}
+  var i = selectedElements.length;
+  while (i--) {
+    var elem = selectedElements[i];
+    // if (svgedit.utilities.getRotationAngle(elem) && !svgedit.math.hasMatrixTransform(getTransformList(elem))) { continue; }
+    var cmd = svgedit.recalculate.recalculateDimensions(elem);
+    if (cmd) {
+      batchCmd.addSubCommand(cmd);
+    }
+  }
 
-	if (!batchCmd.isEmpty()) {
-		addCommandToHistory(batchCmd);
-		call('changed', selectedElements);
-	}
+  if (!batchCmd.isEmpty()) {
+    addCommandToHistory(batchCmd);
+    call('changed', selectedElements);
+  }
 };
 
 // Debug tool to easily see the current matrix in the browser's console
 var logMatrix = function (m) {
-	console.log([m.a, m.b, m.c, m.d, m.e, m.f]);
+  console.log([m.a, m.b, m.c, m.d, m.e, m.f]);
 };
 
 // Root Current Transformation Matrix in user units
@@ -892,14 +892,14 @@ var rootSctm = null;
 // Parameters:
 // noCall - Optional boolean that when true does not call the "selected" handler
 var clearSelection = this.clearSelection = function (noCall) {
-	selectedElements.map(function (elem) {
-		if (elem == null) return;
+  selectedElements.map(function (elem) {
+    if (elem == null) return;
 
-		selectorManager.releaseSelector(elem);
-	});
-	selectedElements = [];
+    selectorManager.releaseSelector(elem);
+  });
+  selectedElements = [];
 
-	if (!noCall) { call('selected', selectedElements); }
+  if (!noCall) { call('selected', selectedElements); }
 };
 
 // TODO: do we need to worry about selectedBBoxes here?
@@ -911,68 +911,68 @@ var clearSelection = this.clearSelection = function (noCall) {
 // elemsToAdd - an array of DOM elements to add to the selection
 // showGrips - a boolean flag indicating whether the resize grips should be shown
 var addToSelection = this.addToSelection = function (elemsToAdd, showGrips) {
-	if (elemsToAdd.length === 0) { return; }
-	// find the first null in our selectedElements array
-	var j = 0;
+  if (elemsToAdd.length === 0) { return; }
+  // find the first null in our selectedElements array
+  var j = 0;
 
-	while (j < selectedElements.length) {
-		if (selectedElements[j] == null) {
-			break;
-		}
-		++j;
-	}
+  while (j < selectedElements.length) {
+    if (selectedElements[j] == null) {
+      break;
+    }
+    ++j;
+  }
 
-	// now add each element consecutively
-	var i = elemsToAdd.length;
-	while (i--) {
-		var elem = elemsToAdd[i];
-		if (!elem) { continue; }
-		var bbox = svgedit.utilities.getBBox(elem);
-		if (!bbox) { continue; }
+  // now add each element consecutively
+  var i = elemsToAdd.length;
+  while (i--) {
+    var elem = elemsToAdd[i];
+    if (!elem) { continue; }
+    var bbox = svgedit.utilities.getBBox(elem);
+    if (!bbox) { continue; }
 
-		if (elem.tagName === 'a' && elem.childNodes.length === 1) {
-			// Make "a" element's child be the selected element
-			elem = elem.firstChild;
-		}
+    if (elem.tagName === 'a' && elem.childNodes.length === 1) {
+      // Make "a" element's child be the selected element
+      elem = elem.firstChild;
+    }
 
-		// if it's not already there, add it
-		if (selectedElements.indexOf(elem) === -1) {
-			selectedElements[j] = elem;
+    // if it's not already there, add it
+    if (selectedElements.indexOf(elem) === -1) {
+      selectedElements[j] = elem;
 
-			// only the first selectedBBoxes element is ever used in the codebase these days
-			// if (j === 0) selectedBBoxes[0] = svgedit.utilities.getBBox(elem);
-			j++;
-			var sel = selectorManager.requestSelector(elem, bbox);
+      // only the first selectedBBoxes element is ever used in the codebase these days
+      // if (j === 0) selectedBBoxes[0] = svgedit.utilities.getBBox(elem);
+      j++;
+      var sel = selectorManager.requestSelector(elem, bbox);
 
-			if (selectedElements.length > 1) {
-				sel.showGrips(false);
-			}
-		}
-	}
-	call('selected', selectedElements);
+      if (selectedElements.length > 1) {
+        sel.showGrips(false);
+      }
+    }
+  }
+  call('selected', selectedElements);
 
-	if (showGrips || selectedElements.length === 1) {
-		selectorManager.requestSelector(selectedElements[0]).showGrips(true);
-	} else {
-		selectorManager.requestSelector(selectedElements[0]).showGrips(false);
-	}
+  if (showGrips || selectedElements.length === 1) {
+    selectorManager.requestSelector(selectedElements[0]).showGrips(true);
+  } else {
+    selectorManager.requestSelector(selectedElements[0]).showGrips(false);
+  }
 
-	// make sure the elements are in the correct order
-	// See: http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-compareDocumentPosition
+  // make sure the elements are in the correct order
+  // See: http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-compareDocumentPosition
 
-	selectedElements.sort(function (a, b) {
-		if (a && b && a.compareDocumentPosition) {
-			return 3 - (b.compareDocumentPosition(a) & 6);
-		}
-		if (a == null) {
-			return 1;
-		}
-	});
+  selectedElements.sort(function (a, b) {
+    if (a && b && a.compareDocumentPosition) {
+      return 3 - (b.compareDocumentPosition(a) & 6);
+    }
+    if (a == null) {
+      return 1;
+    }
+  });
 
-	// Make sure first elements are not null
-	while (selectedElements[0] == null) {
-		selectedElements.shift(0);
-	}
+  // Make sure first elements are not null
+  while (selectedElements[0] == null) {
+    selectedElements.shift(0);
+  }
 };
 
 // Function: selectOnly()
@@ -981,8 +981,8 @@ var addToSelection = this.addToSelection = function (elemsToAdd, showGrips) {
 // Parameters:
 // elems - an array of DOM elements to be selected
 var selectOnly = this.selectOnly = function (elems, showGrips) {
-	clearSelection(true);
-	addToSelection(elems, showGrips);
+  clearSelection(true);
+  addToSelection(elems, showGrips);
 };
 
 // TODO: could use slice here to make this faster?
@@ -994,39 +994,39 @@ var selectOnly = this.selectOnly = function (elems, showGrips) {
 // Parameters:
 // elemsToRemove - an array of elements to remove from selection
 /* var removeFromSelection = */ this.removeFromSelection = function (elemsToRemove) {
-	if (selectedElements[0] == null) { return; }
-	if (elemsToRemove.length === 0) { return; }
+  if (selectedElements[0] == null) { return; }
+  if (elemsToRemove.length === 0) { return; }
 
-	// find every element and remove it from our array copy
-	var i,
-		j = 0,
-		newSelectedItems = [],
-		len = selectedElements.length;
-	newSelectedItems.length = len;
-	for (i = 0; i < len; ++i) {
-		var elem = selectedElements[i];
-		if (elem) {
-			// keep the item
-			if (elemsToRemove.indexOf(elem) === -1) {
-				newSelectedItems[j] = elem;
-				j++;
-			} else { // remove the item and its selector
-				selectorManager.releaseSelector(elem);
-			}
-		}
-	}
-	// the copy becomes the master now
-	selectedElements = newSelectedItems;
+  // find every element and remove it from our array copy
+  var i,
+    j = 0,
+    newSelectedItems = [],
+    len = selectedElements.length;
+  newSelectedItems.length = len;
+  for (i = 0; i < len; ++i) {
+    var elem = selectedElements[i];
+    if (elem) {
+      // keep the item
+      if (elemsToRemove.indexOf(elem) === -1) {
+        newSelectedItems[j] = elem;
+        j++;
+      } else { // remove the item and its selector
+        selectorManager.releaseSelector(elem);
+      }
+    }
+  }
+  // the copy becomes the master now
+  selectedElements = newSelectedItems;
 };
 
 // Function: selectAllInCurrentLayer
 // Clears the selection, then adds all elements in the current layer to the selection.
 this.selectAllInCurrentLayer = function () {
-	var currentLayer = getCurrentDrawing().getCurrentLayer();
-	if (currentLayer) {
-		currentMode = 'select';
-		selectOnly($(currentGroup || currentLayer).children());
-	}
+  var currentLayer = getCurrentDrawing().getCurrentLayer();
+  if (currentLayer) {
+    currentMode = 'select';
+    selectOnly($(currentGroup || currentLayer).children());
+  }
 };
 
 // Function: getMouseTarget
@@ -1038,57 +1038,57 @@ this.selectAllInCurrentLayer = function () {
 // Returns:
 // DOM element we want
 var getMouseTarget = this.getMouseTarget = function (evt) {
-	if (evt == null) {
-		return null;
-	}
-	var mouseTarget = evt.target;
+  if (evt == null) {
+    return null;
+  }
+  var mouseTarget = evt.target;
 
-	// if it was a <use>, Opera and WebKit return the SVGElementInstance
-	if (mouseTarget.correspondingUseElement) { mouseTarget = mouseTarget.correspondingUseElement; }
+  // if it was a <use>, Opera and WebKit return the SVGElementInstance
+  if (mouseTarget.correspondingUseElement) { mouseTarget = mouseTarget.correspondingUseElement; }
 
-	// for foreign content, go up until we find the foreignObject
-	// WebKit browsers set the mouse target to the svgcanvas div
-	if ([NS.MATH, NS.HTML].indexOf(mouseTarget.namespaceURI) >= 0 &&
-		mouseTarget.id !== 'svgcanvas'
-	) {
-		while (mouseTarget.nodeName !== 'foreignObject') {
-			mouseTarget = mouseTarget.parentNode;
-			if (!mouseTarget) { return svgroot; }
-		}
-	}
+  // for foreign content, go up until we find the foreignObject
+  // WebKit browsers set the mouse target to the svgcanvas div
+  if ([NS.MATH, NS.HTML].indexOf(mouseTarget.namespaceURI) >= 0 &&
+    mouseTarget.id !== 'svgcanvas'
+  ) {
+    while (mouseTarget.nodeName !== 'foreignObject') {
+      mouseTarget = mouseTarget.parentNode;
+      if (!mouseTarget) { return svgroot; }
+    }
+  }
 
-	// Get the desired mouseTarget with jQuery selector-fu
-	// If it's root-like, select the root
-	var currentLayer = getCurrentDrawing().getCurrentLayer();
-	if ([svgroot, container, svgcontent, currentLayer].indexOf(mouseTarget) >= 0) {
-		return svgroot;
-	}
+  // Get the desired mouseTarget with jQuery selector-fu
+  // If it's root-like, select the root
+  var currentLayer = getCurrentDrawing().getCurrentLayer();
+  if ([svgroot, container, svgcontent, currentLayer].indexOf(mouseTarget) >= 0) {
+    return svgroot;
+  }
 
-	var $target = $(mouseTarget);
+  var $target = $(mouseTarget);
 
-	// If it's a selection grip, return the grip parent
-	if ($target.closest('#selectorParentGroup').length) {
-		// While we could instead have just returned mouseTarget,
-		// this makes it easier to indentify as being a selector grip
-		return selectorManager.selectorParentGroup;
-	}
+  // If it's a selection grip, return the grip parent
+  if ($target.closest('#selectorParentGroup').length) {
+    // While we could instead have just returned mouseTarget,
+    // this makes it easier to indentify as being a selector grip
+    return selectorManager.selectorParentGroup;
+  }
 
-	while (mouseTarget.parentNode !== (currentGroup || currentLayer)) {
-		mouseTarget = mouseTarget.parentNode;
-	}
+  while (mouseTarget.parentNode !== (currentGroup || currentLayer)) {
+    mouseTarget = mouseTarget.parentNode;
+  }
 
-	//
-	// // go up until we hit a child of a layer
-	// while (mouseTarget.parentNode.parentNode.tagName == 'g') {
-	// 	mouseTarget = mouseTarget.parentNode;
-	// }
-	// Webkit bubbles the mouse event all the way up to the div, so we
-	// set the mouseTarget to the svgroot like the other browsers
-	// if (mouseTarget.nodeName.toLowerCase() == 'div') {
-	// 	mouseTarget = svgroot;
-	// }
+  //
+  // // go up until we hit a child of a layer
+  // while (mouseTarget.parentNode.parentNode.tagName == 'g') {
+  // 	mouseTarget = mouseTarget.parentNode;
+  // }
+  // Webkit bubbles the mouse event all the way up to the div, so we
+  // set the mouseTarget to the svgroot like the other browsers
+  // if (mouseTarget.nodeName.toLowerCase() == 'div') {
+  // 	mouseTarget = svgroot;
+  // }
 
-	return mouseTarget;
+  return mouseTarget;
 };
 
 var drawnPath = null;
@@ -1096,853 +1096,853 @@ var drawnPath = null;
 // Mouse events
 (function () {
 var dAttr = null,
-	startX = null,
-	startY = null,
-	rStartX = null,
-	rStartY = null,
-	initBbox = {},
-	freehand = {
-		minx: null,
-		miny: null,
-		maxx: null,
-		maxy: null
-	},
-	sumDistance = 0,
-	controllPoint2 = {x: 0, y: 0},
-	controllPoint1 = {x: 0, y: 0},
-	start = {x: 0, y: 0},
-	end = {x: 0, y: 0},
-	parameter,
-	nextParameter,
-	bSpline = {x: 0, y: 0},
-	nextPos = {x: 0, y: 0},
-	THRESHOLD_DIST = 0.8,
-	STEP_COUNT = 10;
+  startX = null,
+  startY = null,
+  rStartX = null,
+  rStartY = null,
+  initBbox = {},
+  freehand = {
+    minx: null,
+    miny: null,
+    maxx: null,
+    maxy: null
+  },
+  sumDistance = 0,
+  controllPoint2 = {x: 0, y: 0},
+  controllPoint1 = {x: 0, y: 0},
+  start = {x: 0, y: 0},
+  end = {x: 0, y: 0},
+  parameter,
+  nextParameter,
+  bSpline = {x: 0, y: 0},
+  nextPos = {x: 0, y: 0},
+  THRESHOLD_DIST = 0.8,
+  STEP_COUNT = 10;
 
 var getBsplinePoint = function (t) {
-	var spline = {x: 0, y: 0},
-		p0 = controllPoint2,
-		p1 = controllPoint1,
-		p2 = start,
-		p3 = end,
-		S = 1.0 / 6.0,
-		t2 = t * t,
-		t3 = t2 * t;
+  var spline = {x: 0, y: 0},
+    p0 = controllPoint2,
+    p1 = controllPoint1,
+    p2 = start,
+    p3 = end,
+    S = 1.0 / 6.0,
+    t2 = t * t,
+    t3 = t2 * t;
 
-	var m = [
-		[-1, 3, -3, 1],
-		[3, -6, 3, 0],
-		[-3, 0, 3, 0],
-		[1, 4, 1, 0]
-	];
+  var m = [
+    [-1, 3, -3, 1],
+    [3, -6, 3, 0],
+    [-3, 0, 3, 0],
+    [1, 4, 1, 0]
+  ];
 
-	spline.x = S * (
-		(p0.x * m[0][0] + p1.x * m[0][1] + p2.x * m[0][2] + p3.x * m[0][3]) * t3 +
-			(p0.x * m[1][0] + p1.x * m[1][1] + p2.x * m[1][2] + p3.x * m[1][3]) * t2 +
-			(p0.x * m[2][0] + p1.x * m[2][1] + p2.x * m[2][2] + p3.x * m[2][3]) * t +
-			(p0.x * m[3][0] + p1.x * m[3][1] + p2.x * m[3][2] + p3.x * m[3][3])
-	);
-	spline.y = S * (
-		(p0.y * m[0][0] + p1.y * m[0][1] + p2.y * m[0][2] + p3.y * m[0][3]) * t3 +
-			(p0.y * m[1][0] + p1.y * m[1][1] + p2.y * m[1][2] + p3.y * m[1][3]) * t2 +
-			(p0.y * m[2][0] + p1.y * m[2][1] + p2.y * m[2][2] + p3.y * m[2][3]) * t +
-			(p0.y * m[3][0] + p1.y * m[3][1] + p2.y * m[3][2] + p3.y * m[3][3])
-	);
+  spline.x = S * (
+    (p0.x * m[0][0] + p1.x * m[0][1] + p2.x * m[0][2] + p3.x * m[0][3]) * t3 +
+      (p0.x * m[1][0] + p1.x * m[1][1] + p2.x * m[1][2] + p3.x * m[1][3]) * t2 +
+      (p0.x * m[2][0] + p1.x * m[2][1] + p2.x * m[2][2] + p3.x * m[2][3]) * t +
+      (p0.x * m[3][0] + p1.x * m[3][1] + p2.x * m[3][2] + p3.x * m[3][3])
+  );
+  spline.y = S * (
+    (p0.y * m[0][0] + p1.y * m[0][1] + p2.y * m[0][2] + p3.y * m[0][3]) * t3 +
+      (p0.y * m[1][0] + p1.y * m[1][1] + p2.y * m[1][2] + p3.y * m[1][3]) * t2 +
+      (p0.y * m[2][0] + p1.y * m[2][1] + p2.y * m[2][2] + p3.y * m[2][3]) * t +
+      (p0.y * m[3][0] + p1.y * m[3][1] + p2.y * m[3][2] + p3.y * m[3][3])
+  );
 
-	return {
-		x: spline.x,
-		y: spline.y
-	};
+  return {
+    x: spline.x,
+    y: spline.y
+  };
 };
 // - when we are in a create mode, the element is added to the canvas
 // but the action is not recorded until mousing up
 // - when we are in select mode, select the element, remember the position
 // and do nothing else
 var mouseDown = function (evt) {
-	if (canvas.spaceKey || evt.button === 1) { return; }
+  if (canvas.spaceKey || evt.button === 1) { return; }
 
-	var rightClick = evt.button === 2;
+  var rightClick = evt.button === 2;
 
-	if (evt.altKey) { // duplicate when dragging
-		svgCanvas.cloneSelectedElements(0, 0);
-	}
+  if (evt.altKey) { // duplicate when dragging
+    svgCanvas.cloneSelectedElements(0, 0);
+  }
 
-	rootSctm = $('#svgcontent g')[0].getScreenCTM().inverse();
+  rootSctm = $('#svgcontent g')[0].getScreenCTM().inverse();
 
-	var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
-		mouseX = pt.x * currentZoom,
-		mouseY = pt.y * currentZoom;
+  var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
+    mouseX = pt.x * currentZoom,
+    mouseY = pt.y * currentZoom;
 
-	evt.preventDefault();
+  evt.preventDefault();
 
-	if (rightClick) {
-		currentMode = 'select';
-		lastClickPoint = pt;
-	}
+  if (rightClick) {
+    currentMode = 'select';
+    lastClickPoint = pt;
+  }
 
-	// This would seem to be unnecessary...
-	// if (['select', 'resize'].indexOf(currentMode) === -1) {
-	// 	setGradient();
-	// }
+  // This would seem to be unnecessary...
+  // if (['select', 'resize'].indexOf(currentMode) === -1) {
+  // 	setGradient();
+  // }
 
-	var x = mouseX / currentZoom,
-		y = mouseY / currentZoom,
-		mouseTarget = getMouseTarget(evt);
+  var x = mouseX / currentZoom,
+    y = mouseY / currentZoom,
+    mouseTarget = getMouseTarget(evt);
 
-	if (mouseTarget.tagName === 'a' && mouseTarget.childNodes.length === 1) {
-		mouseTarget = mouseTarget.firstChild;
-	}
+  if (mouseTarget.tagName === 'a' && mouseTarget.childNodes.length === 1) {
+    mouseTarget = mouseTarget.firstChild;
+  }
 
-	// realX/y ignores grid-snap value
-	var realX = x;
-	rStartX = startX = x;
-	var realY = y;
-	rStartY = startY = y;
+  // realX/y ignores grid-snap value
+  var realX = x;
+  rStartX = startX = x;
+  var realY = y;
+  rStartY = startY = y;
 
-	if (curConfig.gridSnapping) {
-		x = svgedit.utilities.snapToGrid(x);
-		y = svgedit.utilities.snapToGrid(y);
-		startX = svgedit.utilities.snapToGrid(startX);
-		startY = svgedit.utilities.snapToGrid(startY);
-	}
+  if (curConfig.gridSnapping) {
+    x = svgedit.utilities.snapToGrid(x);
+    y = svgedit.utilities.snapToGrid(y);
+    startX = svgedit.utilities.snapToGrid(startX);
+    startY = svgedit.utilities.snapToGrid(startY);
+  }
 
-	// if it is a selector grip, then it must be a single element selected,
-	// set the mouseTarget to that and update the mode to rotate/resize
+  // if it is a selector grip, then it must be a single element selected,
+  // set the mouseTarget to that and update the mode to rotate/resize
 
-	if (mouseTarget === selectorManager.selectorParentGroup && selectedElements[0] != null) {
-		var grip = evt.target;
-		var griptype = elData(grip, 'type');
-		// rotating
-		if (griptype === 'rotate') {
-			currentMode = 'rotate';
-		// resizing
-		} else if (griptype === 'resize') {
-			currentMode = 'resize';
-			currentResizeMode = elData(grip, 'dir');
-		}
-		mouseTarget = selectedElements[0];
-	}
+  if (mouseTarget === selectorManager.selectorParentGroup && selectedElements[0] != null) {
+    var grip = evt.target;
+    var griptype = elData(grip, 'type');
+    // rotating
+    if (griptype === 'rotate') {
+      currentMode = 'rotate';
+    // resizing
+    } else if (griptype === 'resize') {
+      currentMode = 'resize';
+      currentResizeMode = elData(grip, 'dir');
+    }
+    mouseTarget = selectedElements[0];
+  }
 
-	startTransform = mouseTarget.getAttribute('transform');
-	var i, strokeW,
-		tlist = svgedit.transformlist.getTransformList(mouseTarget);
-	switch (currentMode) {
-	case 'select':
-		started = true;
-		currentResizeMode = 'none';
-		if (rightClick) { started = false; }
+  startTransform = mouseTarget.getAttribute('transform');
+  var i, strokeW,
+    tlist = svgedit.transformlist.getTransformList(mouseTarget);
+  switch (currentMode) {
+  case 'select':
+    started = true;
+    currentResizeMode = 'none';
+    if (rightClick) { started = false; }
 
-		if (mouseTarget !== svgroot) {
-			// if this element is not yet selected, clear selection and select it
-			if (selectedElements.indexOf(mouseTarget) === -1) {
-				// only clear selection if shift is not pressed (otherwise, add
-				// element to selection)
-				if (!evt.shiftKey) {
-					// No need to do the call here as it will be done on addToSelection
-					clearSelection(true);
-				}
-				addToSelection([mouseTarget]);
-				justSelected = mouseTarget;
-				pathActions.clear();
-			}
-			// else if it's a path, go into pathedit mode in mouseup
+    if (mouseTarget !== svgroot) {
+      // if this element is not yet selected, clear selection and select it
+      if (selectedElements.indexOf(mouseTarget) === -1) {
+        // only clear selection if shift is not pressed (otherwise, add
+        // element to selection)
+        if (!evt.shiftKey) {
+          // No need to do the call here as it will be done on addToSelection
+          clearSelection(true);
+        }
+        addToSelection([mouseTarget]);
+        justSelected = mouseTarget;
+        pathActions.clear();
+      }
+      // else if it's a path, go into pathedit mode in mouseup
 
-			if (!rightClick) {
-				// insert a dummy transform so if the element(s) are moved it will have
-				// a transform to use for its translate
-				for (i = 0; i < selectedElements.length; ++i) {
-					if (selectedElements[i] == null) { continue; }
-					var slist = svgedit.transformlist.getTransformList(selectedElements[i]);
-					if (slist.numberOfItems) {
-						slist.insertItemBefore(svgroot.createSVGTransform(), 0);
-					} else {
-						slist.appendItem(svgroot.createSVGTransform());
-					}
-				}
-			}
-		} else if (!rightClick) {
-			clearSelection();
-			currentMode = 'multiselect';
-			if (rubberBox == null) {
-				rubberBox = selectorManager.getRubberBandBox();
-			}
-			rStartX *= currentZoom;
-			rStartY *= currentZoom;
-			// console.log('p',[evt.pageX, evt.pageY]);
-			// console.log('c',[evt.clientX, evt.clientY]);
-			// console.log('o',[evt.offsetX, evt.offsetY]);
-			// console.log('s',[startX, startY]);
+      if (!rightClick) {
+        // insert a dummy transform so if the element(s) are moved it will have
+        // a transform to use for its translate
+        for (i = 0; i < selectedElements.length; ++i) {
+          if (selectedElements[i] == null) { continue; }
+          var slist = svgedit.transformlist.getTransformList(selectedElements[i]);
+          if (slist.numberOfItems) {
+            slist.insertItemBefore(svgroot.createSVGTransform(), 0);
+          } else {
+            slist.appendItem(svgroot.createSVGTransform());
+          }
+        }
+      }
+    } else if (!rightClick) {
+      clearSelection();
+      currentMode = 'multiselect';
+      if (rubberBox == null) {
+        rubberBox = selectorManager.getRubberBandBox();
+      }
+      rStartX *= currentZoom;
+      rStartY *= currentZoom;
+      // console.log('p',[evt.pageX, evt.pageY]);
+      // console.log('c',[evt.clientX, evt.clientY]);
+      // console.log('o',[evt.offsetX, evt.offsetY]);
+      // console.log('s',[startX, startY]);
 
-			svgedit.utilities.assignAttributes(rubberBox, {
-				'x': rStartX,
-				'y': rStartY,
-				'width': 0,
-				'height': 0,
-				'display': 'inline'
-			}, 100);
-		}
-		break;
-	case 'zoom':
-		started = true;
-		if (rubberBox == null) {
-			rubberBox = selectorManager.getRubberBandBox();
-		}
-		svgedit.utilities.assignAttributes(rubberBox, {
-			'x': realX * currentZoom,
-			'y': realX * currentZoom,
-			'width': 0,
-			'height': 0,
-			'display': 'inline'
-		}, 100);
-		break;
-	case 'resize':
-		started = true;
-		startX = x;
-		startY = y;
+      svgedit.utilities.assignAttributes(rubberBox, {
+        'x': rStartX,
+        'y': rStartY,
+        'width': 0,
+        'height': 0,
+        'display': 'inline'
+      }, 100);
+    }
+    break;
+  case 'zoom':
+    started = true;
+    if (rubberBox == null) {
+      rubberBox = selectorManager.getRubberBandBox();
+    }
+    svgedit.utilities.assignAttributes(rubberBox, {
+      'x': realX * currentZoom,
+      'y': realX * currentZoom,
+      'width': 0,
+      'height': 0,
+      'display': 'inline'
+    }, 100);
+    break;
+  case 'resize':
+    started = true;
+    startX = x;
+    startY = y;
 
-		// Getting the BBox from the selection box, since we know we
-		// want to orient around it
-		initBbox = svgedit.utilities.getBBox($('#selectedBox0')[0]);
-		var bb = {};
-		$.each(initBbox, function (key, val) {
-			bb[key] = val / currentZoom;
-		});
-		initBbox = bb;
+    // Getting the BBox from the selection box, since we know we
+    // want to orient around it
+    initBbox = svgedit.utilities.getBBox($('#selectedBox0')[0]);
+    var bb = {};
+    $.each(initBbox, function (key, val) {
+      bb[key] = val / currentZoom;
+    });
+    initBbox = bb;
 
-		// append three dummy transforms to the tlist so that
-		// we can translate,scale,translate in mousemove
-		var pos = svgedit.utilities.getRotationAngle(mouseTarget) ? 1 : 0;
+    // append three dummy transforms to the tlist so that
+    // we can translate,scale,translate in mousemove
+    var pos = svgedit.utilities.getRotationAngle(mouseTarget) ? 1 : 0;
 
-		if (svgedit.math.hasMatrixTransform(tlist)) {
-			tlist.insertItemBefore(svgroot.createSVGTransform(), pos);
-			tlist.insertItemBefore(svgroot.createSVGTransform(), pos);
-			tlist.insertItemBefore(svgroot.createSVGTransform(), pos);
-		} else {
-			tlist.appendItem(svgroot.createSVGTransform());
-			tlist.appendItem(svgroot.createSVGTransform());
-			tlist.appendItem(svgroot.createSVGTransform());
+    if (svgedit.math.hasMatrixTransform(tlist)) {
+      tlist.insertItemBefore(svgroot.createSVGTransform(), pos);
+      tlist.insertItemBefore(svgroot.createSVGTransform(), pos);
+      tlist.insertItemBefore(svgroot.createSVGTransform(), pos);
+    } else {
+      tlist.appendItem(svgroot.createSVGTransform());
+      tlist.appendItem(svgroot.createSVGTransform());
+      tlist.appendItem(svgroot.createSVGTransform());
 
-			if (svgedit.browser.supportsNonScalingStroke()) {
-				// Handle crash for newer Chrome and Safari 6 (Mobile and Desktop):
-				// https://code.google.com/p/svg-edit/issues/detail?id=904
-				// Chromium issue: https://code.google.com/p/chromium/issues/detail?id=114625
-				// TODO: Remove this workaround once vendor fixes the issue
-				var isWebkit = svgedit.browser.isWebkit();
+      if (svgedit.browser.supportsNonScalingStroke()) {
+        // Handle crash for newer Chrome and Safari 6 (Mobile and Desktop):
+        // https://code.google.com/p/svg-edit/issues/detail?id=904
+        // Chromium issue: https://code.google.com/p/chromium/issues/detail?id=114625
+        // TODO: Remove this workaround once vendor fixes the issue
+        var isWebkit = svgedit.browser.isWebkit();
 
-				if (isWebkit) {
-					var delayedStroke = function (ele) {
-						var _stroke = ele.getAttributeNS(null, 'stroke');
-						ele.removeAttributeNS(null, 'stroke');
-						// Re-apply stroke after delay. Anything higher than 1 seems to cause flicker
-						if (_stroke !== null) setTimeout(function () { ele.setAttributeNS(null, 'stroke', _stroke); }, 0);
-					};
-				}
-				mouseTarget.style.vectorEffect = 'non-scaling-stroke';
-				if (isWebkit) { delayedStroke(mouseTarget); }
+        if (isWebkit) {
+          var delayedStroke = function (ele) {
+            var _stroke = ele.getAttributeNS(null, 'stroke');
+            ele.removeAttributeNS(null, 'stroke');
+            // Re-apply stroke after delay. Anything higher than 1 seems to cause flicker
+            if (_stroke !== null) setTimeout(function () { ele.setAttributeNS(null, 'stroke', _stroke); }, 0);
+          };
+        }
+        mouseTarget.style.vectorEffect = 'non-scaling-stroke';
+        if (isWebkit) { delayedStroke(mouseTarget); }
 
-				var all = mouseTarget.getElementsByTagName('*'),
-					len = all.length;
-				for (i = 0; i < len; i++) {
-					all[i].style.vectorEffect = 'non-scaling-stroke';
-					if (isWebkit) { delayedStroke(all[i]); }
-				}
-			}
-		}
-		break;
-	case 'fhellipse':
-	case 'fhrect':
-	case 'fhpath':
-		start.x = realX;
-		start.y = realY;
-		started = true;
-		dAttr = realX + ',' + realY + ' ';
-		strokeW = parseFloat(curShape.stroke_width) === 0 ? 1 : curShape.stroke_width;
-		addSvgElementFromJson({
-			element: 'polyline',
-			curStyles: true,
-			attr: {
-				points: dAttr,
-				id: getNextId(),
-				fill: 'none',
-				opacity: curShape.opacity / 2,
-				'stroke-linecap': 'round',
-				style: 'pointer-events:none'
-			}
-		});
-		freehand.minx = realX;
-		freehand.maxx = realX;
-		freehand.miny = realY;
-		freehand.maxy = realY;
-		break;
-	case 'image':
-		started = true;
-		var newImage = addSvgElementFromJson({
-			element: 'image',
-			attr: {
-				x: x,
-				y: y,
-				width: 0,
-				height: 0,
-				id: getNextId(),
-				opacity: curShape.opacity / 2,
-				style: 'pointer-events:inherit'
-			}
-		});
-		setHref(newImage, lastGoodImgUrl);
-		svgedit.utilities.preventClickDefault(newImage);
-		break;
-	case 'square':
-		// FIXME: once we create the rect, we lose information that this was a square
-		// (for resizing purposes this could be important)
-		// Fallthrough
-	case 'rect':
-		started = true;
-		startX = x;
-		startY = y;
-		addSvgElementFromJson({
-			element: 'rect',
-			curStyles: true,
-			attr: {
-				x: x,
-				y: y,
-				width: 0,
-				height: 0,
-				id: getNextId(),
-				opacity: curShape.opacity / 2
-			}
-		});
-		break;
-	case 'line':
-		started = true;
-		strokeW = Number(curShape.stroke_width) === 0 ? 1 : curShape.stroke_width;
-		addSvgElementFromJson({
-			element: 'line',
-			curStyles: true,
-			attr: {
-				x1: x,
-				y1: y,
-				x2: x,
-				y2: y,
-				id: getNextId(),
-				stroke: curShape.stroke,
-				'stroke-width': strokeW,
-				'stroke-dasharray': curShape.stroke_dasharray,
-				'stroke-linejoin': curShape.stroke_linejoin,
-				'stroke-linecap': curShape.stroke_linecap,
-				'stroke-opacity': curShape.stroke_opacity,
-				fill: 'none',
-				opacity: curShape.opacity / 2,
-				style: 'pointer-events:none'
-			}
-		});
-		break;
-	case 'circle':
-		started = true;
-		addSvgElementFromJson({
-			element: 'circle',
-			curStyles: true,
-			attr: {
-				cx: x,
-				cy: y,
-				r: 0,
-				id: getNextId(),
-				opacity: curShape.opacity / 2
-			}
-		});
-		break;
-	case 'ellipse':
-		started = true;
-		addSvgElementFromJson({
-			element: 'ellipse',
-			curStyles: true,
-			attr: {
-				cx: x,
-				cy: y,
-				rx: 0,
-				ry: 0,
-				id: getNextId(),
-				opacity: curShape.opacity / 2
-			}
-		});
-		break;
-	case 'text':
-		started = true;
-		/* var newText = */ addSvgElementFromJson({
-			element: 'text',
-			curStyles: true,
-			attr: {
-				x: x,
-				y: y,
-				id: getNextId(),
-				fill: curText.fill,
-				'stroke-width': curText.stroke_width,
-				'font-size': curText.font_size,
-				'font-family': curText.font_family,
-				'text-anchor': 'middle',
-				'xml:space': 'preserve',
-				opacity: curShape.opacity
-			}
-		});
-		// newText.textContent = 'text';
-		break;
-	case 'path':
-		// Fall through
-	case 'pathedit':
-		startX *= currentZoom;
-		startY *= currentZoom;
-		pathActions.mouseDown(evt, mouseTarget, startX, startY);
-		started = true;
-		break;
-	case 'textedit':
-		startX *= currentZoom;
-		startY *= currentZoom;
-		textActions.mouseDown(evt, mouseTarget, startX, startY);
-		started = true;
-		break;
-	case 'rotate':
-		started = true;
-		// we are starting an undoable change (a drag-rotation)
-		canvas.undoMgr.beginUndoableChange('transform', selectedElements);
-		break;
-	default:
-		// This could occur in an extension
-		break;
-	}
+        var all = mouseTarget.getElementsByTagName('*'),
+          len = all.length;
+        for (i = 0; i < len; i++) {
+          all[i].style.vectorEffect = 'non-scaling-stroke';
+          if (isWebkit) { delayedStroke(all[i]); }
+        }
+      }
+    }
+    break;
+  case 'fhellipse':
+  case 'fhrect':
+  case 'fhpath':
+    start.x = realX;
+    start.y = realY;
+    started = true;
+    dAttr = realX + ',' + realY + ' ';
+    strokeW = parseFloat(curShape.stroke_width) === 0 ? 1 : curShape.stroke_width;
+    addSvgElementFromJson({
+      element: 'polyline',
+      curStyles: true,
+      attr: {
+        points: dAttr,
+        id: getNextId(),
+        fill: 'none',
+        opacity: curShape.opacity / 2,
+        'stroke-linecap': 'round',
+        style: 'pointer-events:none'
+      }
+    });
+    freehand.minx = realX;
+    freehand.maxx = realX;
+    freehand.miny = realY;
+    freehand.maxy = realY;
+    break;
+  case 'image':
+    started = true;
+    var newImage = addSvgElementFromJson({
+      element: 'image',
+      attr: {
+        x: x,
+        y: y,
+        width: 0,
+        height: 0,
+        id: getNextId(),
+        opacity: curShape.opacity / 2,
+        style: 'pointer-events:inherit'
+      }
+    });
+    setHref(newImage, lastGoodImgUrl);
+    svgedit.utilities.preventClickDefault(newImage);
+    break;
+  case 'square':
+    // FIXME: once we create the rect, we lose information that this was a square
+    // (for resizing purposes this could be important)
+    // Fallthrough
+  case 'rect':
+    started = true;
+    startX = x;
+    startY = y;
+    addSvgElementFromJson({
+      element: 'rect',
+      curStyles: true,
+      attr: {
+        x: x,
+        y: y,
+        width: 0,
+        height: 0,
+        id: getNextId(),
+        opacity: curShape.opacity / 2
+      }
+    });
+    break;
+  case 'line':
+    started = true;
+    strokeW = Number(curShape.stroke_width) === 0 ? 1 : curShape.stroke_width;
+    addSvgElementFromJson({
+      element: 'line',
+      curStyles: true,
+      attr: {
+        x1: x,
+        y1: y,
+        x2: x,
+        y2: y,
+        id: getNextId(),
+        stroke: curShape.stroke,
+        'stroke-width': strokeW,
+        'stroke-dasharray': curShape.stroke_dasharray,
+        'stroke-linejoin': curShape.stroke_linejoin,
+        'stroke-linecap': curShape.stroke_linecap,
+        'stroke-opacity': curShape.stroke_opacity,
+        fill: 'none',
+        opacity: curShape.opacity / 2,
+        style: 'pointer-events:none'
+      }
+    });
+    break;
+  case 'circle':
+    started = true;
+    addSvgElementFromJson({
+      element: 'circle',
+      curStyles: true,
+      attr: {
+        cx: x,
+        cy: y,
+        r: 0,
+        id: getNextId(),
+        opacity: curShape.opacity / 2
+      }
+    });
+    break;
+  case 'ellipse':
+    started = true;
+    addSvgElementFromJson({
+      element: 'ellipse',
+      curStyles: true,
+      attr: {
+        cx: x,
+        cy: y,
+        rx: 0,
+        ry: 0,
+        id: getNextId(),
+        opacity: curShape.opacity / 2
+      }
+    });
+    break;
+  case 'text':
+    started = true;
+    /* var newText = */ addSvgElementFromJson({
+      element: 'text',
+      curStyles: true,
+      attr: {
+        x: x,
+        y: y,
+        id: getNextId(),
+        fill: curText.fill,
+        'stroke-width': curText.stroke_width,
+        'font-size': curText.font_size,
+        'font-family': curText.font_family,
+        'text-anchor': 'middle',
+        'xml:space': 'preserve',
+        opacity: curShape.opacity
+      }
+    });
+    // newText.textContent = 'text';
+    break;
+  case 'path':
+    // Fall through
+  case 'pathedit':
+    startX *= currentZoom;
+    startY *= currentZoom;
+    pathActions.mouseDown(evt, mouseTarget, startX, startY);
+    started = true;
+    break;
+  case 'textedit':
+    startX *= currentZoom;
+    startY *= currentZoom;
+    textActions.mouseDown(evt, mouseTarget, startX, startY);
+    started = true;
+    break;
+  case 'rotate':
+    started = true;
+    // we are starting an undoable change (a drag-rotation)
+    canvas.undoMgr.beginUndoableChange('transform', selectedElements);
+    break;
+  default:
+    // This could occur in an extension
+    break;
+  }
 
-	var extResult = runExtensions('mouseDown', {
-		event: evt,
-		start_x: startX,
-		start_y: startY,
-		selectedElements: selectedElements
-	}, true);
+  var extResult = runExtensions('mouseDown', {
+    event: evt,
+    start_x: startX,
+    start_y: startY,
+    selectedElements: selectedElements
+  }, true);
 
-	$.each(extResult, function (i, r) {
-		if (r && r.started) {
-			started = true;
-		}
-	});
+  $.each(extResult, function (i, r) {
+    if (r && r.started) {
+      started = true;
+    }
+  });
 };
 
 // in this function we do not record any state changes yet (but we do update
 // any elements that are still being created, moved or resized on the canvas)
 var mouseMove = function (evt) {
-	if (!started) { return; }
-	if (evt.button === 1 || canvas.spaceKey) { return; }
+  if (!started) { return; }
+  if (evt.button === 1 || canvas.spaceKey) { return; }
 
-	var i, xya, c, cx, cy, dx, dy, len, angle, box,
-		selected = selectedElements[0],
-		pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
-		mouseX = pt.x * currentZoom,
-		mouseY = pt.y * currentZoom,
-		shape = svgedit.utilities.getElem(getId());
+  var i, xya, c, cx, cy, dx, dy, len, angle, box,
+    selected = selectedElements[0],
+    pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
+    mouseX = pt.x * currentZoom,
+    mouseY = pt.y * currentZoom,
+    shape = svgedit.utilities.getElem(getId());
 
-	var realX = mouseX / currentZoom;
-	var x = realX;
-	var realY = mouseY / currentZoom;
-	var y = realY;
+  var realX = mouseX / currentZoom;
+  var x = realX;
+  var realY = mouseY / currentZoom;
+  var y = realY;
 
-	if (curConfig.gridSnapping) {
-		x = svgedit.utilities.snapToGrid(x);
-		y = svgedit.utilities.snapToGrid(y);
-	}
+  if (curConfig.gridSnapping) {
+    x = svgedit.utilities.snapToGrid(x);
+    y = svgedit.utilities.snapToGrid(y);
+  }
 
-	evt.preventDefault();
-	var tlist;
-	switch (currentMode) {
-	case 'select':
-		// we temporarily use a translate on the element(s) being dragged
-		// this transform is removed upon mousing up and the element is
-		// relocated to the new location
-		if (selectedElements[0] !== null) {
-			dx = x - startX;
-			dy = y - startY;
+  evt.preventDefault();
+  var tlist;
+  switch (currentMode) {
+  case 'select':
+    // we temporarily use a translate on the element(s) being dragged
+    // this transform is removed upon mousing up and the element is
+    // relocated to the new location
+    if (selectedElements[0] !== null) {
+      dx = x - startX;
+      dy = y - startY;
 
-			if (curConfig.gridSnapping) {
-				dx = svgedit.utilities.snapToGrid(dx);
-				dy = svgedit.utilities.snapToGrid(dy);
-			}
+      if (curConfig.gridSnapping) {
+        dx = svgedit.utilities.snapToGrid(dx);
+        dy = svgedit.utilities.snapToGrid(dy);
+      }
 
-			if (evt.shiftKey) {
-				xya = svgedit.math.snapToAngle(startX, startY, x, y);
-				x = xya.x;
-				y = xya.y;
-			}
+      if (evt.shiftKey) {
+        xya = svgedit.math.snapToAngle(startX, startY, x, y);
+        x = xya.x;
+        y = xya.y;
+      }
 
-			if (dx !== 0 || dy !== 0) {
-				len = selectedElements.length;
-				for (i = 0; i < len; ++i) {
-					selected = selectedElements[i];
-					if (selected == null) { break; }
-					// if (i === 0) {
-					// 	var box = svgedit.utilities.getBBox(selected);
-					// 		selectedBBoxes[i].x = box.x + dx;
-					// 		selectedBBoxes[i].y = box.y + dy;
-					// }
+      if (dx !== 0 || dy !== 0) {
+        len = selectedElements.length;
+        for (i = 0; i < len; ++i) {
+          selected = selectedElements[i];
+          if (selected == null) { break; }
+          // if (i === 0) {
+          // 	var box = svgedit.utilities.getBBox(selected);
+          // 		selectedBBoxes[i].x = box.x + dx;
+          // 		selectedBBoxes[i].y = box.y + dy;
+          // }
 
-					// update the dummy transform in our transform list
-					// to be a translate
-					var xform = svgroot.createSVGTransform();
-					tlist = svgedit.transformlist.getTransformList(selected);
-					// Note that if Webkit and there's no ID for this
-					// element, the dummy transform may have gotten lost.
-					// This results in unexpected behaviour
+          // update the dummy transform in our transform list
+          // to be a translate
+          var xform = svgroot.createSVGTransform();
+          tlist = svgedit.transformlist.getTransformList(selected);
+          // Note that if Webkit and there's no ID for this
+          // element, the dummy transform may have gotten lost.
+          // This results in unexpected behaviour
 
-					xform.setTranslate(dx, dy);
-					if (tlist.numberOfItems) {
-						tlist.replaceItem(xform, 0);
-					} else {
-						tlist.appendItem(xform);
-					}
+          xform.setTranslate(dx, dy);
+          if (tlist.numberOfItems) {
+            tlist.replaceItem(xform, 0);
+          } else {
+            tlist.appendItem(xform);
+          }
 
-					// update our internal bbox that we're tracking while dragging
-					selectorManager.requestSelector(selected).resize();
-				}
+          // update our internal bbox that we're tracking while dragging
+          selectorManager.requestSelector(selected).resize();
+        }
 
-				call('transition', selectedElements);
-			}
-		}
-		break;
-	case 'multiselect':
-		realX *= currentZoom;
-		realY *= currentZoom;
-		svgedit.utilities.assignAttributes(rubberBox, {
-			'x': Math.min(rStartX, realX),
-			'y': Math.min(rStartY, realY),
-			'width': Math.abs(realX - rStartX),
-			'height': Math.abs(realY - rStartY)
-		}, 100);
+        call('transition', selectedElements);
+      }
+    }
+    break;
+  case 'multiselect':
+    realX *= currentZoom;
+    realY *= currentZoom;
+    svgedit.utilities.assignAttributes(rubberBox, {
+      'x': Math.min(rStartX, realX),
+      'y': Math.min(rStartY, realY),
+      'width': Math.abs(realX - rStartX),
+      'height': Math.abs(realY - rStartY)
+    }, 100);
 
-		// for each selected:
-		// - if newList contains selected, do nothing
-		// - if newList doesn't contain selected, remove it from selected
-		// - for any newList that was not in selectedElements, add it to selected
-		var elemsToRemove = selectedElements.slice(), elemsToAdd = [],
-			newList = getIntersectionList();
+    // for each selected:
+    // - if newList contains selected, do nothing
+    // - if newList doesn't contain selected, remove it from selected
+    // - for any newList that was not in selectedElements, add it to selected
+    var elemsToRemove = selectedElements.slice(), elemsToAdd = [],
+      newList = getIntersectionList();
 
-		// For every element in the intersection, add if not present in selectedElements.
-		len = newList.length;
-		for (i = 0; i < len; ++i) {
-			var intElem = newList[i];
-			// Found an element that was not selected before, so we should add it.
-			if (selectedElements.indexOf(intElem) === -1) {
-				elemsToAdd.push(intElem);
-			}
-			// Found an element that was already selected, so we shouldn't remove it.
-			var foundInd = elemsToRemove.indexOf(intElem);
-			if (foundInd !== -1) {
-				elemsToRemove.splice(foundInd, 1);
-			}
-		}
+    // For every element in the intersection, add if not present in selectedElements.
+    len = newList.length;
+    for (i = 0; i < len; ++i) {
+      var intElem = newList[i];
+      // Found an element that was not selected before, so we should add it.
+      if (selectedElements.indexOf(intElem) === -1) {
+        elemsToAdd.push(intElem);
+      }
+      // Found an element that was already selected, so we shouldn't remove it.
+      var foundInd = elemsToRemove.indexOf(intElem);
+      if (foundInd !== -1) {
+        elemsToRemove.splice(foundInd, 1);
+      }
+    }
 
-		if (elemsToRemove.length > 0) {
-			canvas.removeFromSelection(elemsToRemove);
-		}
+    if (elemsToRemove.length > 0) {
+      canvas.removeFromSelection(elemsToRemove);
+    }
 
-		if (elemsToAdd.length > 0) {
-			canvas.addToSelection(elemsToAdd);
-		}
+    if (elemsToAdd.length > 0) {
+      canvas.addToSelection(elemsToAdd);
+    }
 
-		break;
-	case 'resize':
-		// we track the resize bounding box and translate/scale the selected element
-		// while the mouse is down, when mouse goes up, we use this to recalculate
-		// the shape's coordinates
-		tlist = svgedit.transformlist.getTransformList(selected);
-		var hasMatrix = svgedit.math.hasMatrixTransform(tlist);
-		box = hasMatrix ? initBbox : svgedit.utilities.getBBox(selected);
-		var left = box.x, top = box.y, width = box.width,
-			height = box.height;
-		dx = (x - startX);
-		dy = (y - startY);
+    break;
+  case 'resize':
+    // we track the resize bounding box and translate/scale the selected element
+    // while the mouse is down, when mouse goes up, we use this to recalculate
+    // the shape's coordinates
+    tlist = svgedit.transformlist.getTransformList(selected);
+    var hasMatrix = svgedit.math.hasMatrixTransform(tlist);
+    box = hasMatrix ? initBbox : svgedit.utilities.getBBox(selected);
+    var left = box.x, top = box.y, width = box.width,
+      height = box.height;
+    dx = (x - startX);
+    dy = (y - startY);
 
-		if (curConfig.gridSnapping) {
-			dx = svgedit.utilities.snapToGrid(dx);
-			dy = svgedit.utilities.snapToGrid(dy);
-			height = svgedit.utilities.snapToGrid(height);
-			width = svgedit.utilities.snapToGrid(width);
-		}
+    if (curConfig.gridSnapping) {
+      dx = svgedit.utilities.snapToGrid(dx);
+      dy = svgedit.utilities.snapToGrid(dy);
+      height = svgedit.utilities.snapToGrid(height);
+      width = svgedit.utilities.snapToGrid(width);
+    }
 
-		// if rotated, adjust the dx,dy values
-		angle = svgedit.utilities.getRotationAngle(selected);
-		if (angle) {
-			var r = Math.sqrt(dx * dx + dy * dy),
-				theta = Math.atan2(dy, dx) - angle * Math.PI / 180.0;
-			dx = r * Math.cos(theta);
-			dy = r * Math.sin(theta);
-		}
+    // if rotated, adjust the dx,dy values
+    angle = svgedit.utilities.getRotationAngle(selected);
+    if (angle) {
+      var r = Math.sqrt(dx * dx + dy * dy),
+        theta = Math.atan2(dy, dx) - angle * Math.PI / 180.0;
+      dx = r * Math.cos(theta);
+      dy = r * Math.sin(theta);
+    }
 
-		// if not stretching in y direction, set dy to 0
-		// if not stretching in x direction, set dx to 0
-		if (currentResizeMode.indexOf('n') === -1 && currentResizeMode.indexOf('s') === -1) {
-			dy = 0;
-		}
-		if (currentResizeMode.indexOf('e') === -1 && currentResizeMode.indexOf('w') === -1) {
-			dx = 0;
-		}
+    // if not stretching in y direction, set dy to 0
+    // if not stretching in x direction, set dx to 0
+    if (currentResizeMode.indexOf('n') === -1 && currentResizeMode.indexOf('s') === -1) {
+      dy = 0;
+    }
+    if (currentResizeMode.indexOf('e') === -1 && currentResizeMode.indexOf('w') === -1) {
+      dx = 0;
+    }
 
-		var // ts = null,
-			tx = 0, ty = 0,
-			sy = height ? (height + dy) / height : 1,
-			sx = width ? (width + dx) / width : 1;
-		// if we are dragging on the north side, then adjust the scale factor and ty
-		if (currentResizeMode.indexOf('n') >= 0) {
-			sy = height ? (height - dy) / height : 1;
-			ty = height;
-		}
+    var // ts = null,
+      tx = 0, ty = 0,
+      sy = height ? (height + dy) / height : 1,
+      sx = width ? (width + dx) / width : 1;
+    // if we are dragging on the north side, then adjust the scale factor and ty
+    if (currentResizeMode.indexOf('n') >= 0) {
+      sy = height ? (height - dy) / height : 1;
+      ty = height;
+    }
 
-		// if we dragging on the east side, then adjust the scale factor and tx
-		if (currentResizeMode.indexOf('w') >= 0) {
-			sx = width ? (width - dx) / width : 1;
-			tx = width;
-		}
+    // if we dragging on the east side, then adjust the scale factor and tx
+    if (currentResizeMode.indexOf('w') >= 0) {
+      sx = width ? (width - dx) / width : 1;
+      tx = width;
+    }
 
-		// update the transform list with translate,scale,translate
-		var translateOrigin = svgroot.createSVGTransform(),
-			scale = svgroot.createSVGTransform(),
-			translateBack = svgroot.createSVGTransform();
+    // update the transform list with translate,scale,translate
+    var translateOrigin = svgroot.createSVGTransform(),
+      scale = svgroot.createSVGTransform(),
+      translateBack = svgroot.createSVGTransform();
 
-		if (curConfig.gridSnapping) {
-			left = svgedit.utilities.snapToGrid(left);
-			tx = svgedit.utilities.snapToGrid(tx);
-			top = svgedit.utilities.snapToGrid(top);
-			ty = svgedit.utilities.snapToGrid(ty);
-		}
+    if (curConfig.gridSnapping) {
+      left = svgedit.utilities.snapToGrid(left);
+      tx = svgedit.utilities.snapToGrid(tx);
+      top = svgedit.utilities.snapToGrid(top);
+      ty = svgedit.utilities.snapToGrid(ty);
+    }
 
-		translateOrigin.setTranslate(-(left + tx), -(top + ty));
-		if (evt.shiftKey) {
-			if (sx === 1) {
-				sx = sy;
-			} else { sy = sx; }
-		}
-		scale.setScale(sx, sy);
+    translateOrigin.setTranslate(-(left + tx), -(top + ty));
+    if (evt.shiftKey) {
+      if (sx === 1) {
+        sx = sy;
+      } else { sy = sx; }
+    }
+    scale.setScale(sx, sy);
 
-		translateBack.setTranslate(left + tx, top + ty);
-		if (hasMatrix) {
-			var diff = angle ? 1 : 0;
-			tlist.replaceItem(translateOrigin, 2 + diff);
-			tlist.replaceItem(scale, 1 + diff);
-			tlist.replaceItem(translateBack, Number(diff));
-		} else {
-			var N = tlist.numberOfItems;
-			tlist.replaceItem(translateBack, N - 3);
-			tlist.replaceItem(scale, N - 2);
-			tlist.replaceItem(translateOrigin, N - 1);
-		}
+    translateBack.setTranslate(left + tx, top + ty);
+    if (hasMatrix) {
+      var diff = angle ? 1 : 0;
+      tlist.replaceItem(translateOrigin, 2 + diff);
+      tlist.replaceItem(scale, 1 + diff);
+      tlist.replaceItem(translateBack, Number(diff));
+    } else {
+      var N = tlist.numberOfItems;
+      tlist.replaceItem(translateBack, N - 3);
+      tlist.replaceItem(scale, N - 2);
+      tlist.replaceItem(translateOrigin, N - 1);
+    }
 
-		selectorManager.requestSelector(selected).resize();
+    selectorManager.requestSelector(selected).resize();
 
-		call('transition', selectedElements);
+    call('transition', selectedElements);
 
-		break;
-	case 'zoom':
-		realX *= currentZoom;
-		realY *= currentZoom;
-		svgedit.utilities.assignAttributes(rubberBox, {
-			'x': Math.min(rStartX * currentZoom, realX),
-			'y': Math.min(rStartY * currentZoom, realY),
-			'width': Math.abs(realX - rStartX * currentZoom),
-			'height': Math.abs(realY - rStartY * currentZoom)
-		}, 100);
-		break;
-	case 'text':
-		svgedit.utilities.assignAttributes(shape, {
-			'x': x,
-			'y': y
-		}, 1000);
-		break;
-	case 'line':
-		if (curConfig.gridSnapping) {
-			x = svgedit.utilities.snapToGrid(x);
-			y = svgedit.utilities.snapToGrid(y);
-		}
+    break;
+  case 'zoom':
+    realX *= currentZoom;
+    realY *= currentZoom;
+    svgedit.utilities.assignAttributes(rubberBox, {
+      'x': Math.min(rStartX * currentZoom, realX),
+      'y': Math.min(rStartY * currentZoom, realY),
+      'width': Math.abs(realX - rStartX * currentZoom),
+      'height': Math.abs(realY - rStartY * currentZoom)
+    }, 100);
+    break;
+  case 'text':
+    svgedit.utilities.assignAttributes(shape, {
+      'x': x,
+      'y': y
+    }, 1000);
+    break;
+  case 'line':
+    if (curConfig.gridSnapping) {
+      x = svgedit.utilities.snapToGrid(x);
+      y = svgedit.utilities.snapToGrid(y);
+    }
 
-		var x2 = x;
-		var y2 = y;
+    var x2 = x;
+    var y2 = y;
 
-		if (evt.shiftKey) {
-			xya = svgedit.math.snapToAngle(startX, startY, x2, y2);
-			x2 = xya.x;
-			y2 = xya.y;
-		}
+    if (evt.shiftKey) {
+      xya = svgedit.math.snapToAngle(startX, startY, x2, y2);
+      x2 = xya.x;
+      y2 = xya.y;
+    }
 
-		shape.setAttributeNS(null, 'x2', x2);
-		shape.setAttributeNS(null, 'y2', y2);
-		break;
-	case 'foreignObject':
-		// fall through
-	case 'square':
-		// fall through
-	case 'rect':
-		// fall through
-	case 'image':
-		var square = (currentMode === 'square') || evt.shiftKey,
-			w = Math.abs(x - startX),
-			h = Math.abs(y - startY),
-			newX, newY;
-		if (square) {
-			w = h = Math.max(w, h);
-			newX = startX < x ? startX : startX - w;
-			newY = startY < y ? startY : startY - h;
-		} else {
-			newX = Math.min(startX, x);
-			newY = Math.min(startY, y);
-		}
+    shape.setAttributeNS(null, 'x2', x2);
+    shape.setAttributeNS(null, 'y2', y2);
+    break;
+  case 'foreignObject':
+    // fall through
+  case 'square':
+    // fall through
+  case 'rect':
+    // fall through
+  case 'image':
+    var square = (currentMode === 'square') || evt.shiftKey,
+      w = Math.abs(x - startX),
+      h = Math.abs(y - startY),
+      newX, newY;
+    if (square) {
+      w = h = Math.max(w, h);
+      newX = startX < x ? startX : startX - w;
+      newY = startY < y ? startY : startY - h;
+    } else {
+      newX = Math.min(startX, x);
+      newY = Math.min(startY, y);
+    }
 
-		if (curConfig.gridSnapping) {
-			w = svgedit.utilities.snapToGrid(w);
-			h = svgedit.utilities.snapToGrid(h);
-			newX = svgedit.utilities.snapToGrid(newX);
-			newY = svgedit.utilities.snapToGrid(newY);
-		}
+    if (curConfig.gridSnapping) {
+      w = svgedit.utilities.snapToGrid(w);
+      h = svgedit.utilities.snapToGrid(h);
+      newX = svgedit.utilities.snapToGrid(newX);
+      newY = svgedit.utilities.snapToGrid(newY);
+    }
 
-		svgedit.utilities.assignAttributes(shape, {
-			'width': w,
-			'height': h,
-			'x': newX,
-			'y': newY
-		}, 1000);
+    svgedit.utilities.assignAttributes(shape, {
+      'width': w,
+      'height': h,
+      'x': newX,
+      'y': newY
+    }, 1000);
 
-		break;
-	case 'circle':
-		c = $(shape).attr(['cx', 'cy']);
-		cx = c.cx;
-		cy = c.cy;
-		var rad = Math.sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy));
-		if (curConfig.gridSnapping) {
-			rad = svgedit.utilities.snapToGrid(rad);
-		}
-		shape.setAttributeNS(null, 'r', rad);
-		break;
-	case 'ellipse':
-		c = $(shape).attr(['cx', 'cy']);
-		cx = c.cx;
-		cy = c.cy;
-		if (curConfig.gridSnapping) {
-			x = svgedit.utilities.snapToGrid(x);
-			cx = svgedit.utilities.snapToGrid(cx);
-			y = svgedit.utilities.snapToGrid(y);
-			cy = svgedit.utilities.snapToGrid(cy);
-		}
-		shape.setAttributeNS(null, 'rx', Math.abs(x - cx));
-		var ry = Math.abs(evt.shiftKey ? (x - cx) : (y - cy));
-		shape.setAttributeNS(null, 'ry', ry);
-		break;
-	case 'fhellipse':
-	case 'fhrect':
-		freehand.minx = Math.min(realX, freehand.minx);
-		freehand.maxx = Math.max(realX, freehand.maxx);
-		freehand.miny = Math.min(realY, freehand.miny);
-		freehand.maxy = Math.max(realY, freehand.maxy);
-		// Fallthrough
-	case 'fhpath':
-		// dAttr += + realX + ',' + realY + ' ';
-		// shape.setAttributeNS(null, 'points', dAttr);
-		end.x = realX; end.y = realY;
-		if (controllPoint2.x && controllPoint2.y) {
-			for (i = 0; i < STEP_COUNT - 1; i++) {
-				parameter = i / STEP_COUNT;
-				nextParameter = (i + 1) / STEP_COUNT;
-				bSpline = getBsplinePoint(nextParameter);
-				nextPos = bSpline;
-				bSpline = getBsplinePoint(parameter);
-				sumDistance += Math.sqrt((nextPos.x - bSpline.x) * (nextPos.x - bSpline.x) + (nextPos.y - bSpline.y) * (nextPos.y - bSpline.y));
-				if (sumDistance > THRESHOLD_DIST) {
-					dAttr += +bSpline.x + ',' + bSpline.y + ' ';
-					shape.setAttributeNS(null, 'points', dAttr);
-					sumDistance -= THRESHOLD_DIST;
-				}
-			}
-		}
-		controllPoint2 = {x: controllPoint1.x, y: controllPoint1.y};
-		controllPoint1 = {x: start.x, y: start.y};
-		start = {x: end.x, y: end.y};
-		break;
-	// update path stretch line coordinates
-	case 'path':
-		// fall through
-	case 'pathedit':
-		x *= currentZoom;
-		y *= currentZoom;
+    break;
+  case 'circle':
+    c = $(shape).attr(['cx', 'cy']);
+    cx = c.cx;
+    cy = c.cy;
+    var rad = Math.sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy));
+    if (curConfig.gridSnapping) {
+      rad = svgedit.utilities.snapToGrid(rad);
+    }
+    shape.setAttributeNS(null, 'r', rad);
+    break;
+  case 'ellipse':
+    c = $(shape).attr(['cx', 'cy']);
+    cx = c.cx;
+    cy = c.cy;
+    if (curConfig.gridSnapping) {
+      x = svgedit.utilities.snapToGrid(x);
+      cx = svgedit.utilities.snapToGrid(cx);
+      y = svgedit.utilities.snapToGrid(y);
+      cy = svgedit.utilities.snapToGrid(cy);
+    }
+    shape.setAttributeNS(null, 'rx', Math.abs(x - cx));
+    var ry = Math.abs(evt.shiftKey ? (x - cx) : (y - cy));
+    shape.setAttributeNS(null, 'ry', ry);
+    break;
+  case 'fhellipse':
+  case 'fhrect':
+    freehand.minx = Math.min(realX, freehand.minx);
+    freehand.maxx = Math.max(realX, freehand.maxx);
+    freehand.miny = Math.min(realY, freehand.miny);
+    freehand.maxy = Math.max(realY, freehand.maxy);
+    // Fallthrough
+  case 'fhpath':
+    // dAttr += + realX + ',' + realY + ' ';
+    // shape.setAttributeNS(null, 'points', dAttr);
+    end.x = realX; end.y = realY;
+    if (controllPoint2.x && controllPoint2.y) {
+      for (i = 0; i < STEP_COUNT - 1; i++) {
+        parameter = i / STEP_COUNT;
+        nextParameter = (i + 1) / STEP_COUNT;
+        bSpline = getBsplinePoint(nextParameter);
+        nextPos = bSpline;
+        bSpline = getBsplinePoint(parameter);
+        sumDistance += Math.sqrt((nextPos.x - bSpline.x) * (nextPos.x - bSpline.x) + (nextPos.y - bSpline.y) * (nextPos.y - bSpline.y));
+        if (sumDistance > THRESHOLD_DIST) {
+          dAttr += +bSpline.x + ',' + bSpline.y + ' ';
+          shape.setAttributeNS(null, 'points', dAttr);
+          sumDistance -= THRESHOLD_DIST;
+        }
+      }
+    }
+    controllPoint2 = {x: controllPoint1.x, y: controllPoint1.y};
+    controllPoint1 = {x: start.x, y: start.y};
+    start = {x: end.x, y: end.y};
+    break;
+  // update path stretch line coordinates
+  case 'path':
+    // fall through
+  case 'pathedit':
+    x *= currentZoom;
+    y *= currentZoom;
 
-		if (curConfig.gridSnapping) {
-			x = svgedit.utilities.snapToGrid(x);
-			y = svgedit.utilities.snapToGrid(y);
-			startX = svgedit.utilities.snapToGrid(startX);
-			startY = svgedit.utilities.snapToGrid(startY);
-		}
-		if (evt.shiftKey) {
-			var path = svgedit.path.path;
-			var x1, y1;
-			if (path) {
-				x1 = path.dragging ? path.dragging[0] : startX;
-				y1 = path.dragging ? path.dragging[1] : startY;
-			} else {
-				x1 = startX;
-				y1 = startY;
-			}
-			xya = svgedit.math.snapToAngle(x1, y1, x, y);
-			x = xya.x;
-			y = xya.y;
-		}
+    if (curConfig.gridSnapping) {
+      x = svgedit.utilities.snapToGrid(x);
+      y = svgedit.utilities.snapToGrid(y);
+      startX = svgedit.utilities.snapToGrid(startX);
+      startY = svgedit.utilities.snapToGrid(startY);
+    }
+    if (evt.shiftKey) {
+      var path = svgedit.path.path;
+      var x1, y1;
+      if (path) {
+        x1 = path.dragging ? path.dragging[0] : startX;
+        y1 = path.dragging ? path.dragging[1] : startY;
+      } else {
+        x1 = startX;
+        y1 = startY;
+      }
+      xya = svgedit.math.snapToAngle(x1, y1, x, y);
+      x = xya.x;
+      y = xya.y;
+    }
 
-		if (rubberBox && rubberBox.getAttribute('display') !== 'none') {
-			realX *= currentZoom;
-			realY *= currentZoom;
-			svgedit.utilities.assignAttributes(rubberBox, {
-				'x': Math.min(rStartX * currentZoom, realX),
-				'y': Math.min(rStartY * currentZoom, realY),
-				'width': Math.abs(realX - rStartX * currentZoom),
-				'height': Math.abs(realY - rStartY * currentZoom)
-			}, 100);
-		}
-		pathActions.mouseMove(x, y);
+    if (rubberBox && rubberBox.getAttribute('display') !== 'none') {
+      realX *= currentZoom;
+      realY *= currentZoom;
+      svgedit.utilities.assignAttributes(rubberBox, {
+        'x': Math.min(rStartX * currentZoom, realX),
+        'y': Math.min(rStartY * currentZoom, realY),
+        'width': Math.abs(realX - rStartX * currentZoom),
+        'height': Math.abs(realY - rStartY * currentZoom)
+      }, 100);
+    }
+    pathActions.mouseMove(x, y);
 
-		break;
-	case 'textedit':
-		x *= currentZoom;
-		y *= currentZoom;
-		// if (rubberBox && rubberBox.getAttribute('display') !== 'none') {
-		// 	svgedit.utilities.assignAttributes(rubberBox, {
-		// 		'x': Math.min(startX, x),
-		// 		'y': Math.min(startY, y),
-		// 		'width': Math.abs(x - startX),
-		// 		'height': Math.abs(y - startY)
-		// 	}, 100);
-		// }
+    break;
+  case 'textedit':
+    x *= currentZoom;
+    y *= currentZoom;
+    // if (rubberBox && rubberBox.getAttribute('display') !== 'none') {
+    // 	svgedit.utilities.assignAttributes(rubberBox, {
+    // 		'x': Math.min(startX, x),
+    // 		'y': Math.min(startY, y),
+    // 		'width': Math.abs(x - startX),
+    // 		'height': Math.abs(y - startY)
+    // 	}, 100);
+    // }
 
-		textActions.mouseMove(mouseX, mouseY);
+    textActions.mouseMove(mouseX, mouseY);
 
-		break;
-	case 'rotate':
-		box = svgedit.utilities.getBBox(selected);
-		cx = box.x + box.width / 2;
-		cy = box.y + box.height / 2;
-		var m = svgedit.math.getMatrix(selected),
-			center = svgedit.math.transformPoint(cx, cy, m);
-		cx = center.x;
-		cy = center.y;
-		angle = ((Math.atan2(cy - y, cx - x) * (180 / Math.PI)) - 90) % 360;
-		if (curConfig.gridSnapping) {
-			angle = svgedit.utilities.snapToGrid(angle);
-		}
-		if (evt.shiftKey) { // restrict rotations to nice angles (WRS)
-			var snap = 45;
-			angle = Math.round(angle / snap) * snap;
-		}
+    break;
+  case 'rotate':
+    box = svgedit.utilities.getBBox(selected);
+    cx = box.x + box.width / 2;
+    cy = box.y + box.height / 2;
+    var m = svgedit.math.getMatrix(selected),
+      center = svgedit.math.transformPoint(cx, cy, m);
+    cx = center.x;
+    cy = center.y;
+    angle = ((Math.atan2(cy - y, cx - x) * (180 / Math.PI)) - 90) % 360;
+    if (curConfig.gridSnapping) {
+      angle = svgedit.utilities.snapToGrid(angle);
+    }
+    if (evt.shiftKey) { // restrict rotations to nice angles (WRS)
+      var snap = 45;
+      angle = Math.round(angle / snap) * snap;
+    }
 
-		canvas.setRotationAngle(angle < -180 ? (360 + angle) : angle, true);
-		call('transition', selectedElements);
-		break;
-	default:
-		break;
-	}
+    canvas.setRotationAngle(angle < -180 ? (360 + angle) : angle, true);
+    call('transition', selectedElements);
+    break;
+  default:
+    break;
+  }
 
-	runExtensions('mouseMove', {
-		event: evt,
-		mouse_x: mouseX,
-		mouse_y: mouseY,
-		selected: selected
-	});
+  runExtensions('mouseMove', {
+    event: evt,
+    mouse_x: mouseX,
+    mouse_y: mouseY,
+    selected: selected
+  });
 }; // mouseMove()
 
 // - in create mode, the element's opacity is set properly, we create an InsertElementCommand
@@ -1951,362 +1951,362 @@ var mouseMove = function (evt) {
 // identified, a ChangeElementCommand is created and stored on the stack for those attrs
 // this is done in when we recalculate the selected dimensions()
 var mouseUp = function (evt) {
-	if (evt.button === 2) { return; }
-	var tempJustSelected = justSelected;
-	justSelected = null;
-	if (!started) { return; }
-	var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
-		mouseX = pt.x * currentZoom,
-		mouseY = pt.y * currentZoom,
-		x = mouseX / currentZoom,
-		y = mouseY / currentZoom,
-		element = svgedit.utilities.getElem(getId()),
-		keep = false;
+  if (evt.button === 2) { return; }
+  var tempJustSelected = justSelected;
+  justSelected = null;
+  if (!started) { return; }
+  var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
+    mouseX = pt.x * currentZoom,
+    mouseY = pt.y * currentZoom,
+    x = mouseX / currentZoom,
+    y = mouseY / currentZoom,
+    element = svgedit.utilities.getElem(getId()),
+    keep = false;
 
-	var realX = x;
-	var realY = y;
+  var realX = x;
+  var realY = y;
 
-	// TODO: Make true when in multi-unit mode
-	var useUnit = false; // (curConfig.baseUnit !== 'px');
-	started = false;
-	var attrs, t;
-	switch (currentMode) {
-	// intentionally fall-through to select here
-	case 'resize':
-	case 'multiselect':
-		if (rubberBox != null) {
-			rubberBox.setAttribute('display', 'none');
-			curBBoxes = [];
-		}
-		currentMode = 'select';
-		// Fallthrough
-	case 'select':
-		if (selectedElements[0] != null) {
-			// if we only have one selected element
-			if (selectedElements[1] == null) {
-				// set our current stroke/fill properties to the element's
-				var selected = selectedElements[0];
-				switch (selected.tagName) {
-				case 'g':
-				case 'use':
-				case 'image':
-				case 'foreignObject':
-					break;
-				default:
-					curProperties.fill = selected.getAttribute('fill');
-					curProperties.fill_opacity = selected.getAttribute('fill-opacity');
-					curProperties.stroke = selected.getAttribute('stroke');
-					curProperties.stroke_opacity = selected.getAttribute('stroke-opacity');
-					curProperties.stroke_width = selected.getAttribute('stroke-width');
-					curProperties.stroke_dasharray = selected.getAttribute('stroke-dasharray');
-					curProperties.stroke_linejoin = selected.getAttribute('stroke-linejoin');
-					curProperties.stroke_linecap = selected.getAttribute('stroke-linecap');
-				}
+  // TODO: Make true when in multi-unit mode
+  var useUnit = false; // (curConfig.baseUnit !== 'px');
+  started = false;
+  var attrs, t;
+  switch (currentMode) {
+  // intentionally fall-through to select here
+  case 'resize':
+  case 'multiselect':
+    if (rubberBox != null) {
+      rubberBox.setAttribute('display', 'none');
+      curBBoxes = [];
+    }
+    currentMode = 'select';
+    // Fallthrough
+  case 'select':
+    if (selectedElements[0] != null) {
+      // if we only have one selected element
+      if (selectedElements[1] == null) {
+        // set our current stroke/fill properties to the element's
+        var selected = selectedElements[0];
+        switch (selected.tagName) {
+        case 'g':
+        case 'use':
+        case 'image':
+        case 'foreignObject':
+          break;
+        default:
+          curProperties.fill = selected.getAttribute('fill');
+          curProperties.fill_opacity = selected.getAttribute('fill-opacity');
+          curProperties.stroke = selected.getAttribute('stroke');
+          curProperties.stroke_opacity = selected.getAttribute('stroke-opacity');
+          curProperties.stroke_width = selected.getAttribute('stroke-width');
+          curProperties.stroke_dasharray = selected.getAttribute('stroke-dasharray');
+          curProperties.stroke_linejoin = selected.getAttribute('stroke-linejoin');
+          curProperties.stroke_linecap = selected.getAttribute('stroke-linecap');
+        }
 
-				if (selected.tagName === 'text') {
-					curText.font_size = selected.getAttribute('font-size');
-					curText.font_family = selected.getAttribute('font-family');
-				}
-				selectorManager.requestSelector(selected).showGrips(true);
+        if (selected.tagName === 'text') {
+          curText.font_size = selected.getAttribute('font-size');
+          curText.font_family = selected.getAttribute('font-family');
+        }
+        selectorManager.requestSelector(selected).showGrips(true);
 
-				// This shouldn't be necessary as it was done on mouseDown...
-				// call('selected', [selected]);
-			}
-			// always recalculate dimensions to strip off stray identity transforms
-			recalculateAllSelectedDimensions();
-			// if it was being dragged/resized
-			if (realX !== rStartX || realY !== rStartY) {
-				var i, len = selectedElements.length;
-				for (i = 0; i < len; ++i) {
-					if (selectedElements[i] == null) { break; }
-					if (!selectedElements[i].firstChild) {
-						// Not needed for groups (incorrectly resizes elems), possibly not needed at all?
-						selectorManager.requestSelector(selectedElements[i]).resize();
-					}
-				}
-			// no change in position/size, so maybe we should move to pathedit
-			} else {
-				t = evt.target;
-				if (selectedElements[0].nodeName === 'path' && selectedElements[1] == null) {
-					pathActions.select(selectedElements[0]);
-				// if it was a path
-				// else, if it was selected and this is a shift-click, remove it from selection
-				} else if (evt.shiftKey) {
-					if (tempJustSelected !== t) {
-						canvas.removeFromSelection([t]);
-					}
-				}
-			} // no change in mouse position
+        // This shouldn't be necessary as it was done on mouseDown...
+        // call('selected', [selected]);
+      }
+      // always recalculate dimensions to strip off stray identity transforms
+      recalculateAllSelectedDimensions();
+      // if it was being dragged/resized
+      if (realX !== rStartX || realY !== rStartY) {
+        var i, len = selectedElements.length;
+        for (i = 0; i < len; ++i) {
+          if (selectedElements[i] == null) { break; }
+          if (!selectedElements[i].firstChild) {
+            // Not needed for groups (incorrectly resizes elems), possibly not needed at all?
+            selectorManager.requestSelector(selectedElements[i]).resize();
+          }
+        }
+      // no change in position/size, so maybe we should move to pathedit
+      } else {
+        t = evt.target;
+        if (selectedElements[0].nodeName === 'path' && selectedElements[1] == null) {
+          pathActions.select(selectedElements[0]);
+        // if it was a path
+        // else, if it was selected and this is a shift-click, remove it from selection
+        } else if (evt.shiftKey) {
+          if (tempJustSelected !== t) {
+            canvas.removeFromSelection([t]);
+          }
+        }
+      } // no change in mouse position
 
-			// Remove non-scaling stroke
-			if (svgedit.browser.supportsNonScalingStroke()) {
-				var elem = selectedElements[0];
-				if (elem) {
-					elem.removeAttribute('style');
-					svgedit.utilities.walkTree(elem, function (elem) {
-						elem.removeAttribute('style');
-					});
-				}
-			}
-		}
-		return;
-	case 'zoom':
-		if (rubberBox != null) {
-			rubberBox.setAttribute('display', 'none');
-		}
-		var factor = evt.shiftKey ? 0.5 : 2;
-		call('zoomed', {
-			'x': Math.min(rStartX, realX),
-			'y': Math.min(rStartY, realY),
-			'width': Math.abs(realX - rStartX),
-			'height': Math.abs(realY - rStartY),
-			'factor': factor
-		});
-		return;
-	case 'fhpath':
-		// Check that the path contains at least 2 points; a degenerate one-point path
-		// causes problems.
-		// Webkit ignores how we set the points attribute with commas and uses space
-		// to separate all coordinates, see https://bugs.webkit.org/show_bug.cgi?id=29870
-		sumDistance = 0;
-		controllPoint2 = {x: 0, y: 0};
-		controllPoint1 = {x: 0, y: 0};
-		start = {x: 0, y: 0};
-		end = {x: 0, y: 0};
-		var coords = element.getAttribute('points');
-		var commaIndex = coords.indexOf(',');
-		if (commaIndex >= 0) {
-			keep = coords.indexOf(',', commaIndex + 1) >= 0;
-		} else {
-			keep = coords.indexOf(' ', coords.indexOf(' ') + 1) >= 0;
-		}
-		if (keep) {
-			element = pathActions.smoothPolylineIntoPath(element);
-		}
-		break;
-	case 'line':
-		attrs = $(element).attr(['x1', 'x2', 'y1', 'y2']);
-		keep = (attrs.x1 !== attrs.x2 || attrs.y1 !== attrs.y2);
-		break;
-	case 'foreignObject':
-	case 'square':
-	case 'rect':
-	case 'image':
-		attrs = $(element).attr(['width', 'height']);
-		// Image should be kept regardless of size (use inherit dimensions later)
-		keep = (attrs.width !== '0' || attrs.height !== '0') || currentMode === 'image';
-		break;
-	case 'circle':
-		keep = (element.getAttribute('r') !== '0');
-		break;
-	case 'ellipse':
-		attrs = $(element).attr(['rx', 'ry']);
-		keep = (attrs.rx != null || attrs.ry != null);
-		break;
-	case 'fhellipse':
-		if ((freehand.maxx - freehand.minx) > 0 &&
-			(freehand.maxy - freehand.miny) > 0) {
-			element = addSvgElementFromJson({
-				element: 'ellipse',
-				curStyles: true,
-				attr: {
-					cx: (freehand.minx + freehand.maxx) / 2,
-					cy: (freehand.miny + freehand.maxy) / 2,
-					rx: (freehand.maxx - freehand.minx) / 2,
-					ry: (freehand.maxy - freehand.miny) / 2,
-					id: getId()
-				}
-			});
-			call('changed', [element]);
-			keep = true;
-		}
-		break;
-	case 'fhrect':
-		if ((freehand.maxx - freehand.minx) > 0 &&
-			(freehand.maxy - freehand.miny) > 0) {
-			element = addSvgElementFromJson({
-				element: 'rect',
-				curStyles: true,
-				attr: {
-					x: freehand.minx,
-					y: freehand.miny,
-					width: (freehand.maxx - freehand.minx),
-					height: (freehand.maxy - freehand.miny),
-					id: getId()
-				}
-			});
-			call('changed', [element]);
-			keep = true;
-		}
-		break;
-	case 'text':
-		keep = true;
-		selectOnly([element]);
-		textActions.start(element);
-		break;
-	case 'path':
-		// set element to null here so that it is not removed nor finalized
-		element = null;
-		// continue to be set to true so that mouseMove happens
-		started = true;
+      // Remove non-scaling stroke
+      if (svgedit.browser.supportsNonScalingStroke()) {
+        var elem = selectedElements[0];
+        if (elem) {
+          elem.removeAttribute('style');
+          svgedit.utilities.walkTree(elem, function (elem) {
+            elem.removeAttribute('style');
+          });
+        }
+      }
+    }
+    return;
+  case 'zoom':
+    if (rubberBox != null) {
+      rubberBox.setAttribute('display', 'none');
+    }
+    var factor = evt.shiftKey ? 0.5 : 2;
+    call('zoomed', {
+      'x': Math.min(rStartX, realX),
+      'y': Math.min(rStartY, realY),
+      'width': Math.abs(realX - rStartX),
+      'height': Math.abs(realY - rStartY),
+      'factor': factor
+    });
+    return;
+  case 'fhpath':
+    // Check that the path contains at least 2 points; a degenerate one-point path
+    // causes problems.
+    // Webkit ignores how we set the points attribute with commas and uses space
+    // to separate all coordinates, see https://bugs.webkit.org/show_bug.cgi?id=29870
+    sumDistance = 0;
+    controllPoint2 = {x: 0, y: 0};
+    controllPoint1 = {x: 0, y: 0};
+    start = {x: 0, y: 0};
+    end = {x: 0, y: 0};
+    var coords = element.getAttribute('points');
+    var commaIndex = coords.indexOf(',');
+    if (commaIndex >= 0) {
+      keep = coords.indexOf(',', commaIndex + 1) >= 0;
+    } else {
+      keep = coords.indexOf(' ', coords.indexOf(' ') + 1) >= 0;
+    }
+    if (keep) {
+      element = pathActions.smoothPolylineIntoPath(element);
+    }
+    break;
+  case 'line':
+    attrs = $(element).attr(['x1', 'x2', 'y1', 'y2']);
+    keep = (attrs.x1 !== attrs.x2 || attrs.y1 !== attrs.y2);
+    break;
+  case 'foreignObject':
+  case 'square':
+  case 'rect':
+  case 'image':
+    attrs = $(element).attr(['width', 'height']);
+    // Image should be kept regardless of size (use inherit dimensions later)
+    keep = (attrs.width !== '0' || attrs.height !== '0') || currentMode === 'image';
+    break;
+  case 'circle':
+    keep = (element.getAttribute('r') !== '0');
+    break;
+  case 'ellipse':
+    attrs = $(element).attr(['rx', 'ry']);
+    keep = (attrs.rx != null || attrs.ry != null);
+    break;
+  case 'fhellipse':
+    if ((freehand.maxx - freehand.minx) > 0 &&
+      (freehand.maxy - freehand.miny) > 0) {
+      element = addSvgElementFromJson({
+        element: 'ellipse',
+        curStyles: true,
+        attr: {
+          cx: (freehand.minx + freehand.maxx) / 2,
+          cy: (freehand.miny + freehand.maxy) / 2,
+          rx: (freehand.maxx - freehand.minx) / 2,
+          ry: (freehand.maxy - freehand.miny) / 2,
+          id: getId()
+        }
+      });
+      call('changed', [element]);
+      keep = true;
+    }
+    break;
+  case 'fhrect':
+    if ((freehand.maxx - freehand.minx) > 0 &&
+      (freehand.maxy - freehand.miny) > 0) {
+      element = addSvgElementFromJson({
+        element: 'rect',
+        curStyles: true,
+        attr: {
+          x: freehand.minx,
+          y: freehand.miny,
+          width: (freehand.maxx - freehand.minx),
+          height: (freehand.maxy - freehand.miny),
+          id: getId()
+        }
+      });
+      call('changed', [element]);
+      keep = true;
+    }
+    break;
+  case 'text':
+    keep = true;
+    selectOnly([element]);
+    textActions.start(element);
+    break;
+  case 'path':
+    // set element to null here so that it is not removed nor finalized
+    element = null;
+    // continue to be set to true so that mouseMove happens
+    started = true;
 
-		var res = pathActions.mouseUp(evt, element, mouseX, mouseY);
-		element = res.element;
-		keep = res.keep;
-		break;
-	case 'pathedit':
-		keep = true;
-		element = null;
-		pathActions.mouseUp(evt);
-		break;
-	case 'textedit':
-		keep = false;
-		element = null;
-		textActions.mouseUp(evt, mouseX, mouseY);
-		break;
-	case 'rotate':
-		keep = true;
-		element = null;
-		currentMode = 'select';
-		var batchCmd = canvas.undoMgr.finishUndoableChange();
-		if (!batchCmd.isEmpty()) {
-			addCommandToHistory(batchCmd);
-		}
-		// perform recalculation to weed out any stray identity transforms that might get stuck
-		recalculateAllSelectedDimensions();
-		call('changed', selectedElements);
-		break;
-	default:
-		// This could occur in an extension
-		break;
-	}
+    var res = pathActions.mouseUp(evt, element, mouseX, mouseY);
+    element = res.element;
+    keep = res.keep;
+    break;
+  case 'pathedit':
+    keep = true;
+    element = null;
+    pathActions.mouseUp(evt);
+    break;
+  case 'textedit':
+    keep = false;
+    element = null;
+    textActions.mouseUp(evt, mouseX, mouseY);
+    break;
+  case 'rotate':
+    keep = true;
+    element = null;
+    currentMode = 'select';
+    var batchCmd = canvas.undoMgr.finishUndoableChange();
+    if (!batchCmd.isEmpty()) {
+      addCommandToHistory(batchCmd);
+    }
+    // perform recalculation to weed out any stray identity transforms that might get stuck
+    recalculateAllSelectedDimensions();
+    call('changed', selectedElements);
+    break;
+  default:
+    // This could occur in an extension
+    break;
+  }
 
-	var extResult = runExtensions('mouseUp', {
-		event: evt,
-		mouse_x: mouseX,
-		mouse_y: mouseY
-	}, true);
+  var extResult = runExtensions('mouseUp', {
+    event: evt,
+    mouse_x: mouseX,
+    mouse_y: mouseY
+  }, true);
 
-	$.each(extResult, function (i, r) {
-		if (r) {
-			keep = r.keep || keep;
-			element = r.element;
-			started = r.started || started;
-		}
-	});
+  $.each(extResult, function (i, r) {
+    if (r) {
+      keep = r.keep || keep;
+      element = r.element;
+      started = r.started || started;
+    }
+  });
 
-	if (!keep && element != null) {
-		getCurrentDrawing().releaseId(getId());
-		element.parentNode.removeChild(element);
-		element = null;
+  if (!keep && element != null) {
+    getCurrentDrawing().releaseId(getId());
+    element.parentNode.removeChild(element);
+    element = null;
 
-		t = evt.target;
+    t = evt.target;
 
-		// if this element is in a group, go up until we reach the top-level group
-		// just below the layer groups
-		// TODO: once we implement links, we also would have to check for <a> elements
-		while (t && t.parentNode && t.parentNode.parentNode && t.parentNode.parentNode.tagName === 'g') {
-			t = t.parentNode;
-		}
-		// if we are not in the middle of creating a path, and we've clicked on some shape,
-		// then go to Select mode.
-		// WebKit returns <div> when the canvas is clicked, Firefox/Opera return <svg>
-		if ((currentMode !== 'path' || !drawnPath) &&
-			t && t.parentNode &&
-			t.parentNode.id !== 'selectorParentGroup' &&
-			t.id !== 'svgcanvas' && t.id !== 'svgroot'
-		) {
-			// switch into "select" mode if we've clicked on an element
-			canvas.setMode('select');
-			selectOnly([t], true);
-		}
-	} else if (element != null) {
-		canvas.addedNew = true;
+    // if this element is in a group, go up until we reach the top-level group
+    // just below the layer groups
+    // TODO: once we implement links, we also would have to check for <a> elements
+    while (t && t.parentNode && t.parentNode.parentNode && t.parentNode.parentNode.tagName === 'g') {
+      t = t.parentNode;
+    }
+    // if we are not in the middle of creating a path, and we've clicked on some shape,
+    // then go to Select mode.
+    // WebKit returns <div> when the canvas is clicked, Firefox/Opera return <svg>
+    if ((currentMode !== 'path' || !drawnPath) &&
+      t && t.parentNode &&
+      t.parentNode.id !== 'selectorParentGroup' &&
+      t.id !== 'svgcanvas' && t.id !== 'svgroot'
+    ) {
+      // switch into "select" mode if we've clicked on an element
+      canvas.setMode('select');
+      selectOnly([t], true);
+    }
+  } else if (element != null) {
+    canvas.addedNew = true;
 
-		if (useUnit) { svgedit.units.convertAttrs(element); }
+    if (useUnit) { svgedit.units.convertAttrs(element); }
 
-		var aniDur = 0.2, cAni;
-		if (opacAni.beginElement && parseFloat(element.getAttribute('opacity')) !== curShape.opacity) {
-			cAni = $(opacAni).clone().attr({
-				to: curShape.opacity,
-				dur: aniDur
-			}).appendTo(element);
-			try {
-				// Fails in FF4 on foreignObject
-				cAni[0].beginElement();
-			} catch (e) {}
-		} else {
-			aniDur = 0;
-		}
+    var aniDur = 0.2, cAni;
+    if (opacAni.beginElement && parseFloat(element.getAttribute('opacity')) !== curShape.opacity) {
+      cAni = $(opacAni).clone().attr({
+        to: curShape.opacity,
+        dur: aniDur
+      }).appendTo(element);
+      try {
+        // Fails in FF4 on foreignObject
+        cAni[0].beginElement();
+      } catch (e) {}
+    } else {
+      aniDur = 0;
+    }
 
-		// Ideally this would be done on the endEvent of the animation,
-		// but that doesn't seem to be supported in Webkit
-		setTimeout(function () {
-			if (cAni) { cAni.remove(); }
-			element.setAttribute('opacity', curShape.opacity);
-			element.setAttribute('style', 'pointer-events:inherit');
-			cleanupElement(element);
-			if (currentMode === 'path') {
-				pathActions.toEditMode(element);
-			} else if (curConfig.selectNew) {
-				selectOnly([element], true);
-			}
-			// we create the insert command that is stored on the stack
-			// undo means to call cmd.unapply(), redo means to call cmd.apply()
-			addCommandToHistory(new svgedit.history.InsertElementCommand(element));
+    // Ideally this would be done on the endEvent of the animation,
+    // but that doesn't seem to be supported in Webkit
+    setTimeout(function () {
+      if (cAni) { cAni.remove(); }
+      element.setAttribute('opacity', curShape.opacity);
+      element.setAttribute('style', 'pointer-events:inherit');
+      cleanupElement(element);
+      if (currentMode === 'path') {
+        pathActions.toEditMode(element);
+      } else if (curConfig.selectNew) {
+        selectOnly([element], true);
+      }
+      // we create the insert command that is stored on the stack
+      // undo means to call cmd.unapply(), redo means to call cmd.apply()
+      addCommandToHistory(new svgedit.history.InsertElementCommand(element));
 
-			call('changed', [element]);
-		}, aniDur * 1000);
-	}
+      call('changed', [element]);
+    }, aniDur * 1000);
+  }
 
-	startTransform = null;
+  startTransform = null;
 };
 
 var dblClick = function (evt) {
-	var evtTarget = evt.target;
-	var parent = evtTarget.parentNode;
+  var evtTarget = evt.target;
+  var parent = evtTarget.parentNode;
 
-	// Do nothing if already in current group
-	if (parent === currentGroup) { return; }
+  // Do nothing if already in current group
+  if (parent === currentGroup) { return; }
 
-	var mouseTarget = getMouseTarget(evt);
-	var tagName = mouseTarget.tagName;
+  var mouseTarget = getMouseTarget(evt);
+  var tagName = mouseTarget.tagName;
 
-	if (tagName === 'text' && currentMode !== 'textedit') {
-		var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm);
-		textActions.select(mouseTarget, pt.x, pt.y);
-	}
+  if (tagName === 'text' && currentMode !== 'textedit') {
+    var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm);
+    textActions.select(mouseTarget, pt.x, pt.y);
+  }
 
-	if ((tagName === 'g' || tagName === 'a') &&
-		svgedit.utilities.getRotationAngle(mouseTarget)
-	) {
-		// TODO: Allow method of in-group editing without having to do
-		// this (similar to editing rotated paths)
+  if ((tagName === 'g' || tagName === 'a') &&
+    svgedit.utilities.getRotationAngle(mouseTarget)
+  ) {
+    // TODO: Allow method of in-group editing without having to do
+    // this (similar to editing rotated paths)
 
-		// Ungroup and regroup
-		pushGroupProperties(mouseTarget);
-		mouseTarget = selectedElements[0];
-		clearSelection(true);
-	}
-	// Reset context
-	if (currentGroup) {
-		leaveContext();
-	}
+    // Ungroup and regroup
+    pushGroupProperties(mouseTarget);
+    mouseTarget = selectedElements[0];
+    clearSelection(true);
+  }
+  // Reset context
+  if (currentGroup) {
+    leaveContext();
+  }
 
-	if ((parent.tagName !== 'g' && parent.tagName !== 'a') ||
-		parent === getCurrentDrawing().getCurrentLayer() ||
-		mouseTarget === selectorManager.selectorParentGroup
-	) {
-		// Escape from in-group edit
-		return;
-	}
-	setContext(mouseTarget);
+  if ((parent.tagName !== 'g' && parent.tagName !== 'a') ||
+    parent === getCurrentDrawing().getCurrentLayer() ||
+    mouseTarget === selectorManager.selectorParentGroup
+  ) {
+    // Escape from in-group edit
+    return;
+  }
+  setContext(mouseTarget);
 };
 
 // prevent links from being followed in the canvas
 var handleLinkInCanvas = function (e) {
-	e.preventDefault();
-	return false;
+  e.preventDefault();
+  return false;
 };
 
 // Added mouseup to the container here.
@@ -2316,26 +2316,26 @@ $(container).mousedown(mouseDown).mousemove(mouseMove).click(handleLinkInCanvas)
 
 // TODO(rafaelcastrocouto): User preference for shift key and zoom factor
 $(container).bind('mousewheel DOMMouseScroll', function (e) {
-	// if (!e.shiftKey) { return; }
-	e.preventDefault();
-	var evt = e.originalEvent;
+  // if (!e.shiftKey) { return; }
+  e.preventDefault();
+  var evt = e.originalEvent;
 
-	rootSctm = $('#svgcontent g')[0].getScreenCTM().inverse();
-	var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm);
+  rootSctm = $('#svgcontent g')[0].getScreenCTM().inverse();
+  var pt = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm);
 
-	var bbox = {
-		'x': pt.x,
-		'y': pt.y,
-		'width': 0,
-		'height': 0
-	};
+  var bbox = {
+    'x': pt.x,
+    'y': pt.y,
+    'width': 0,
+    'height': 0
+  };
 
-	var delta = (evt.wheelDelta) ? evt.wheelDelta : (evt.detail) ? -evt.detail : 0;
-	if (!delta) { return; }
+  var delta = (evt.wheelDelta) ? evt.wheelDelta : (evt.detail) ? -evt.detail : 0;
+  if (!delta) { return; }
 
-	bbox.factor = Math.max(3 / 4, Math.min(4 / 3, (delta)));
+  bbox.factor = Math.max(3 / 4, Math.min(4 / 3, (delta)));
 
-	call('zoomed', bbox);
+  call('zoomed', bbox);
 });
 }());
 
@@ -2354,386 +2354,386 @@ var lastX, lastY;
 var allowDbl;
 
 function setCursor (index) {
-	var empty = (textinput.value === '');
-	$(textinput).focus();
+  var empty = (textinput.value === '');
+  $(textinput).focus();
 
-	if (!arguments.length) {
-		if (empty) {
-			index = 0;
-		} else {
-			if (textinput.selectionEnd !== textinput.selectionStart) { return; }
-			index = textinput.selectionEnd;
-		}
-	}
+  if (!arguments.length) {
+    if (empty) {
+      index = 0;
+    } else {
+      if (textinput.selectionEnd !== textinput.selectionStart) { return; }
+      index = textinput.selectionEnd;
+    }
+  }
 
-	var charbb;
-	charbb = chardata[index];
-	if (!empty) {
-		textinput.setSelectionRange(index, index);
-	}
-	cursor = svgedit.utilities.getElem('text_cursor');
-	if (!cursor) {
-		cursor = document.createElementNS(NS.SVG, 'line');
-		svgedit.utilities.assignAttributes(cursor, {
-			id: 'text_cursor',
-			stroke: '#333',
-			'stroke-width': 1
-		});
-		cursor = svgedit.utilities.getElem('selectorParentGroup').appendChild(cursor);
-	}
+  var charbb;
+  charbb = chardata[index];
+  if (!empty) {
+    textinput.setSelectionRange(index, index);
+  }
+  cursor = svgedit.utilities.getElem('text_cursor');
+  if (!cursor) {
+    cursor = document.createElementNS(NS.SVG, 'line');
+    svgedit.utilities.assignAttributes(cursor, {
+      id: 'text_cursor',
+      stroke: '#333',
+      'stroke-width': 1
+    });
+    cursor = svgedit.utilities.getElem('selectorParentGroup').appendChild(cursor);
+  }
 
-	if (!blinker) {
-		blinker = setInterval(function () {
-			var show = (cursor.getAttribute('display') === 'none');
-			cursor.setAttribute('display', show ? 'inline' : 'none');
-		}, 600);
-	}
+  if (!blinker) {
+    blinker = setInterval(function () {
+      var show = (cursor.getAttribute('display') === 'none');
+      cursor.setAttribute('display', show ? 'inline' : 'none');
+    }, 600);
+  }
 
-	var startPt = ptToScreen(charbb.x, textbb.y);
-	var endPt = ptToScreen(charbb.x, (textbb.y + textbb.height));
+  var startPt = ptToScreen(charbb.x, textbb.y);
+  var endPt = ptToScreen(charbb.x, (textbb.y + textbb.height));
 
-	svgedit.utilities.assignAttributes(cursor, {
-		x1: startPt.x,
-		y1: startPt.y,
-		x2: endPt.x,
-		y2: endPt.y,
-		visibility: 'visible',
-		display: 'inline'
-	});
+  svgedit.utilities.assignAttributes(cursor, {
+    x1: startPt.x,
+    y1: startPt.y,
+    x2: endPt.x,
+    y2: endPt.y,
+    visibility: 'visible',
+    display: 'inline'
+  });
 
-	if (selblock) { selblock.setAttribute('d', ''); }
+  if (selblock) { selblock.setAttribute('d', ''); }
 }
 
 function setSelection (start, end, skipInput) {
-	if (start === end) {
-		setCursor(end);
-		return;
-	}
+  if (start === end) {
+    setCursor(end);
+    return;
+  }
 
-	if (!skipInput) {
-		textinput.setSelectionRange(start, end);
-	}
+  if (!skipInput) {
+    textinput.setSelectionRange(start, end);
+  }
 
-	selblock = svgedit.utilities.getElem('text_selectblock');
-	if (!selblock) {
-		selblock = document.createElementNS(NS.SVG, 'path');
-		svgedit.utilities.assignAttributes(selblock, {
-			id: 'text_selectblock',
-			fill: 'green',
-			opacity: 0.5,
-			style: 'pointer-events:none'
-		});
-		svgedit.utilities.getElem('selectorParentGroup').appendChild(selblock);
-	}
+  selblock = svgedit.utilities.getElem('text_selectblock');
+  if (!selblock) {
+    selblock = document.createElementNS(NS.SVG, 'path');
+    svgedit.utilities.assignAttributes(selblock, {
+      id: 'text_selectblock',
+      fill: 'green',
+      opacity: 0.5,
+      style: 'pointer-events:none'
+    });
+    svgedit.utilities.getElem('selectorParentGroup').appendChild(selblock);
+  }
 
-	var startbb = chardata[start];
-	var endbb = chardata[end];
+  var startbb = chardata[start];
+  var endbb = chardata[end];
 
-	cursor.setAttribute('visibility', 'hidden');
+  cursor.setAttribute('visibility', 'hidden');
 
-	var tl = ptToScreen(startbb.x, textbb.y),
-		tr = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y),
-		bl = ptToScreen(startbb.x, textbb.y + textbb.height),
-		br = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y + textbb.height);
+  var tl = ptToScreen(startbb.x, textbb.y),
+    tr = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y),
+    bl = ptToScreen(startbb.x, textbb.y + textbb.height),
+    br = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y + textbb.height);
 
-	var dstr = 'M' + tl.x + ',' + tl.y +
-		' L' + tr.x + ',' + tr.y +
-		' ' + br.x + ',' + br.y +
-		' ' + bl.x + ',' + bl.y + 'z';
+  var dstr = 'M' + tl.x + ',' + tl.y +
+    ' L' + tr.x + ',' + tr.y +
+    ' ' + br.x + ',' + br.y +
+    ' ' + bl.x + ',' + bl.y + 'z';
 
-	svgedit.utilities.assignAttributes(selblock, {
-		d: dstr,
-		'display': 'inline'
-	});
+  svgedit.utilities.assignAttributes(selblock, {
+    d: dstr,
+    'display': 'inline'
+  });
 }
 
 function getIndexFromPoint (mouseX, mouseY) {
-	// Position cursor here
-	var pt = svgroot.createSVGPoint();
-	pt.x = mouseX;
-	pt.y = mouseY;
+  // Position cursor here
+  var pt = svgroot.createSVGPoint();
+  pt.x = mouseX;
+  pt.y = mouseY;
 
-	// No content, so return 0
-	if (chardata.length === 1) { return 0; }
-	// Determine if cursor should be on left or right of character
-	var charpos = curtext.getCharNumAtPosition(pt);
-	if (charpos < 0) {
-		// Out of text range, look at mouse coords
-		charpos = chardata.length - 2;
-		if (mouseX <= chardata[0].x) {
-			charpos = 0;
-		}
-	} else if (charpos >= chardata.length - 2) {
-		charpos = chardata.length - 2;
-	}
-	var charbb = chardata[charpos];
-	var mid = charbb.x + (charbb.width / 2);
-	if (mouseX > mid) {
-		charpos++;
-	}
-	return charpos;
+  // No content, so return 0
+  if (chardata.length === 1) { return 0; }
+  // Determine if cursor should be on left or right of character
+  var charpos = curtext.getCharNumAtPosition(pt);
+  if (charpos < 0) {
+    // Out of text range, look at mouse coords
+    charpos = chardata.length - 2;
+    if (mouseX <= chardata[0].x) {
+      charpos = 0;
+    }
+  } else if (charpos >= chardata.length - 2) {
+    charpos = chardata.length - 2;
+  }
+  var charbb = chardata[charpos];
+  var mid = charbb.x + (charbb.width / 2);
+  if (mouseX > mid) {
+    charpos++;
+  }
+  return charpos;
 }
 
 function setCursorFromPoint (mouseX, mouseY) {
-	setCursor(getIndexFromPoint(mouseX, mouseY));
+  setCursor(getIndexFromPoint(mouseX, mouseY));
 }
 
 function setEndSelectionFromPoint (x, y, apply) {
-	var i1 = textinput.selectionStart;
-	var i2 = getIndexFromPoint(x, y);
+  var i1 = textinput.selectionStart;
+  var i2 = getIndexFromPoint(x, y);
 
-	var start = Math.min(i1, i2);
-	var end = Math.max(i1, i2);
-	setSelection(start, end, !apply);
+  var start = Math.min(i1, i2);
+  var end = Math.max(i1, i2);
+  setSelection(start, end, !apply);
 }
 
 function screenToPt (xIn, yIn) {
-	var out = {
-		x: xIn,
-		y: yIn
-	};
+  var out = {
+    x: xIn,
+    y: yIn
+  };
 
-	out.x /= currentZoom;
-	out.y /= currentZoom;
+  out.x /= currentZoom;
+  out.y /= currentZoom;
 
-	if (matrix) {
-		var pt = svgedit.math.transformPoint(out.x, out.y, matrix.inverse());
-		out.x = pt.x;
-		out.y = pt.y;
-	}
+  if (matrix) {
+    var pt = svgedit.math.transformPoint(out.x, out.y, matrix.inverse());
+    out.x = pt.x;
+    out.y = pt.y;
+  }
 
-	return out;
+  return out;
 }
 
 function ptToScreen (xIn, yIn) {
-	var out = {
-		x: xIn,
-		y: yIn
-	};
+  var out = {
+    x: xIn,
+    y: yIn
+  };
 
-	if (matrix) {
-		var pt = svgedit.math.transformPoint(out.x, out.y, matrix);
-		out.x = pt.x;
-		out.y = pt.y;
-	}
+  if (matrix) {
+    var pt = svgedit.math.transformPoint(out.x, out.y, matrix);
+    out.x = pt.x;
+    out.y = pt.y;
+  }
 
-	out.x *= currentZoom;
-	out.y *= currentZoom;
+  out.x *= currentZoom;
+  out.y *= currentZoom;
 
-	return out;
+  return out;
 }
 
 /*
 // Not currently in use
 function hideCursor () {
-	if (cursor) {
-		cursor.setAttribute('visibility', 'hidden');
-	}
+  if (cursor) {
+    cursor.setAttribute('visibility', 'hidden');
+  }
 }
 */
 
 function selectAll (evt) {
-	setSelection(0, curtext.textContent.length);
-	$(this).unbind(evt);
+  setSelection(0, curtext.textContent.length);
+  $(this).unbind(evt);
 }
 
 function selectWord (evt) {
-	if (!allowDbl || !curtext) { return; }
+  if (!allowDbl || !curtext) { return; }
 
-	var ept = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
-		mouseX = ept.x * currentZoom,
-		mouseY = ept.y * currentZoom;
-	var pt = screenToPt(mouseX, mouseY);
+  var ept = svgedit.math.transformPoint(evt.pageX, evt.pageY, rootSctm),
+    mouseX = ept.x * currentZoom,
+    mouseY = ept.y * currentZoom;
+  var pt = screenToPt(mouseX, mouseY);
 
-	var index = getIndexFromPoint(pt.x, pt.y);
-	var str = curtext.textContent;
-	var first = str.substr(0, index).replace(/[a-z0-9]+$/i, '').length;
-	var m = str.substr(index).match(/^[a-z0-9]+/i);
-	var last = (m ? m[0].length : 0) + index;
-	setSelection(first, last);
+  var index = getIndexFromPoint(pt.x, pt.y);
+  var str = curtext.textContent;
+  var first = str.substr(0, index).replace(/[a-z0-9]+$/i, '').length;
+  var m = str.substr(index).match(/^[a-z0-9]+/i);
+  var last = (m ? m[0].length : 0) + index;
+  setSelection(first, last);
 
-	// Set tripleclick
-	$(evt.target).click(selectAll);
-	setTimeout(function () {
-		$(evt.target).unbind('click', selectAll);
-	}, 300);
+  // Set tripleclick
+  $(evt.target).click(selectAll);
+  setTimeout(function () {
+    $(evt.target).unbind('click', selectAll);
+  }, 300);
 }
 
 return {
-	select: function (target, x, y) {
-		curtext = target;
-		textActions.toEditMode(x, y);
-	},
-	start: function (elem) {
-		curtext = elem;
-		textActions.toEditMode();
-	},
-	mouseDown: function (evt, mouseTarget, startX, startY) {
-		var pt = screenToPt(startX, startY);
+  select: function (target, x, y) {
+    curtext = target;
+    textActions.toEditMode(x, y);
+  },
+  start: function (elem) {
+    curtext = elem;
+    textActions.toEditMode();
+  },
+  mouseDown: function (evt, mouseTarget, startX, startY) {
+    var pt = screenToPt(startX, startY);
 
-		textinput.focus();
-		setCursorFromPoint(pt.x, pt.y);
-		lastX = startX;
-		lastY = startY;
+    textinput.focus();
+    setCursorFromPoint(pt.x, pt.y);
+    lastX = startX;
+    lastY = startY;
 
-		// TODO: Find way to block native selection
-	},
-	mouseMove: function (mouseX, mouseY) {
-		var pt = screenToPt(mouseX, mouseY);
-		setEndSelectionFromPoint(pt.x, pt.y);
-	},
-	mouseUp: function (evt, mouseX, mouseY) {
-		var pt = screenToPt(mouseX, mouseY);
+    // TODO: Find way to block native selection
+  },
+  mouseMove: function (mouseX, mouseY) {
+    var pt = screenToPt(mouseX, mouseY);
+    setEndSelectionFromPoint(pt.x, pt.y);
+  },
+  mouseUp: function (evt, mouseX, mouseY) {
+    var pt = screenToPt(mouseX, mouseY);
 
-		setEndSelectionFromPoint(pt.x, pt.y, true);
+    setEndSelectionFromPoint(pt.x, pt.y, true);
 
-		// TODO: Find a way to make this work: Use transformed BBox instead of evt.target
-		// if (lastX === mouseX && lastY === mouseY
-		// 	&& !svgedit.math.rectsIntersect(transbb, {x: pt.x, y: pt.y, width: 0, height: 0})) {
-		// 	textActions.toSelectMode(true);
-		// }
+    // TODO: Find a way to make this work: Use transformed BBox instead of evt.target
+    // if (lastX === mouseX && lastY === mouseY
+    // 	&& !svgedit.math.rectsIntersect(transbb, {x: pt.x, y: pt.y, width: 0, height: 0})) {
+    // 	textActions.toSelectMode(true);
+    // }
 
-		if (
-			evt.target !== curtext &&
-			mouseX < lastX + 2 &&
-			mouseX > lastX - 2 &&
-			mouseY < lastY + 2 &&
-			mouseY > lastY - 2
-		) {
-			textActions.toSelectMode(true);
-		}
-	},
-	setCursor: setCursor,
-	toEditMode: function (x, y) {
-		allowDbl = false;
-		currentMode = 'textedit';
-		selectorManager.requestSelector(curtext).showGrips(false);
-		// Make selector group accept clicks
-		/* var selector = */ selectorManager.requestSelector(curtext); // Do we need this? Has side effect of setting lock, so keeping for now, but next line wasn't being used
-		// var sel = selector.selectorRect;
+    if (
+      evt.target !== curtext &&
+      mouseX < lastX + 2 &&
+      mouseX > lastX - 2 &&
+      mouseY < lastY + 2 &&
+      mouseY > lastY - 2
+    ) {
+      textActions.toSelectMode(true);
+    }
+  },
+  setCursor: setCursor,
+  toEditMode: function (x, y) {
+    allowDbl = false;
+    currentMode = 'textedit';
+    selectorManager.requestSelector(curtext).showGrips(false);
+    // Make selector group accept clicks
+    /* var selector = */ selectorManager.requestSelector(curtext); // Do we need this? Has side effect of setting lock, so keeping for now, but next line wasn't being used
+    // var sel = selector.selectorRect;
 
-		textActions.init();
+    textActions.init();
 
-		$(curtext).css('cursor', 'text');
+    $(curtext).css('cursor', 'text');
 
-		// if (svgedit.browser.supportsEditableText()) {
-		// 	curtext.setAttribute('editable', 'simple');
-		// 	return;
-		// }
+    // if (svgedit.browser.supportsEditableText()) {
+    // 	curtext.setAttribute('editable', 'simple');
+    // 	return;
+    // }
 
-		if (!arguments.length) {
-			setCursor();
-		} else {
-			var pt = screenToPt(x, y);
-			setCursorFromPoint(pt.x, pt.y);
-		}
+    if (!arguments.length) {
+      setCursor();
+    } else {
+      var pt = screenToPt(x, y);
+      setCursorFromPoint(pt.x, pt.y);
+    }
 
-		setTimeout(function () {
-			allowDbl = true;
-		}, 300);
-	},
-	toSelectMode: function (selectElem) {
-		currentMode = 'select';
-		clearInterval(blinker);
-		blinker = null;
-		if (selblock) { $(selblock).attr('display', 'none'); }
-		if (cursor) { $(cursor).attr('visibility', 'hidden'); }
-		$(curtext).css('cursor', 'move');
+    setTimeout(function () {
+      allowDbl = true;
+    }, 300);
+  },
+  toSelectMode: function (selectElem) {
+    currentMode = 'select';
+    clearInterval(blinker);
+    blinker = null;
+    if (selblock) { $(selblock).attr('display', 'none'); }
+    if (cursor) { $(cursor).attr('visibility', 'hidden'); }
+    $(curtext).css('cursor', 'move');
 
-		if (selectElem) {
-			clearSelection();
-			$(curtext).css('cursor', 'move');
+    if (selectElem) {
+      clearSelection();
+      $(curtext).css('cursor', 'move');
 
-			call('selected', [curtext]);
-			addToSelection([curtext], true);
-		}
-		if (curtext && !curtext.textContent.length) {
-			// No content, so delete
-			canvas.deleteSelectedElements();
-		}
+      call('selected', [curtext]);
+      addToSelection([curtext], true);
+    }
+    if (curtext && !curtext.textContent.length) {
+      // No content, so delete
+      canvas.deleteSelectedElements();
+    }
 
-		$(textinput).blur();
+    $(textinput).blur();
 
-		curtext = false;
+    curtext = false;
 
-		// if (svgedit.browser.supportsEditableText()) {
-		// 	curtext.removeAttribute('editable');
-		// }
-	},
-	setInputElem: function (elem) {
-		textinput = elem;
-		// $(textinput).blur(hideCursor);
-	},
-	clear: function () {
-		if (currentMode === 'textedit') {
-			textActions.toSelectMode();
-		}
-	},
-	init: function (inputElem) {
-		if (!curtext) { return; }
-		var i, end;
-		// if (svgedit.browser.supportsEditableText()) {
-		// 	curtext.select();
-		// 	return;
-		// }
+    // if (svgedit.browser.supportsEditableText()) {
+    // 	curtext.removeAttribute('editable');
+    // }
+  },
+  setInputElem: function (elem) {
+    textinput = elem;
+    // $(textinput).blur(hideCursor);
+  },
+  clear: function () {
+    if (currentMode === 'textedit') {
+      textActions.toSelectMode();
+    }
+  },
+  init: function (inputElem) {
+    if (!curtext) { return; }
+    var i, end;
+    // if (svgedit.browser.supportsEditableText()) {
+    // 	curtext.select();
+    // 	return;
+    // }
 
-		if (!curtext.parentNode) {
-			// Result of the ffClone, need to get correct element
-			curtext = selectedElements[0];
-			selectorManager.requestSelector(curtext).showGrips(false);
-		}
+    if (!curtext.parentNode) {
+      // Result of the ffClone, need to get correct element
+      curtext = selectedElements[0];
+      selectorManager.requestSelector(curtext).showGrips(false);
+    }
 
-		var str = curtext.textContent;
-		var len = str.length;
+    var str = curtext.textContent;
+    var len = str.length;
 
-		var xform = curtext.getAttribute('transform');
+    var xform = curtext.getAttribute('transform');
 
-		textbb = svgedit.utilities.getBBox(curtext);
+    textbb = svgedit.utilities.getBBox(curtext);
 
-		matrix = xform ? svgedit.math.getMatrix(curtext) : null;
+    matrix = xform ? svgedit.math.getMatrix(curtext) : null;
 
-		chardata = [];
-		chardata.length = len;
-		textinput.focus();
+    chardata = [];
+    chardata.length = len;
+    textinput.focus();
 
-		$(curtext).unbind('dblclick', selectWord).dblclick(selectWord);
+    $(curtext).unbind('dblclick', selectWord).dblclick(selectWord);
 
-		if (!len) {
-			end = {x: textbb.x + (textbb.width / 2), width: 0};
-		}
+    if (!len) {
+      end = {x: textbb.x + (textbb.width / 2), width: 0};
+    }
 
-		for (i = 0; i < len; i++) {
-			var start = curtext.getStartPositionOfChar(i);
-			end = curtext.getEndPositionOfChar(i);
+    for (i = 0; i < len; i++) {
+      var start = curtext.getStartPositionOfChar(i);
+      end = curtext.getEndPositionOfChar(i);
 
-			if (!svgedit.browser.supportsGoodTextCharPos()) {
-				var offset = canvas.contentW * currentZoom;
-				start.x -= offset;
-				end.x -= offset;
+      if (!svgedit.browser.supportsGoodTextCharPos()) {
+        var offset = canvas.contentW * currentZoom;
+        start.x -= offset;
+        end.x -= offset;
 
-				start.x /= currentZoom;
-				end.x /= currentZoom;
-			}
+        start.x /= currentZoom;
+        end.x /= currentZoom;
+      }
 
-			// Get a "bbox" equivalent for each character. Uses the
-			// bbox data of the actual text for y, height purposes
+      // Get a "bbox" equivalent for each character. Uses the
+      // bbox data of the actual text for y, height purposes
 
-			// TODO: Decide if y, width and height are actually necessary
-			chardata[i] = {
-				x: start.x,
-				y: textbb.y, // start.y?
-				width: end.x - start.x,
-				height: textbb.height
-			};
-		}
+      // TODO: Decide if y, width and height are actually necessary
+      chardata[i] = {
+        x: start.x,
+        y: textbb.y, // start.y?
+        width: end.x - start.x,
+        height: textbb.height
+      };
+    }
 
-		// Add a last bbox for cursor at end of text
-		chardata.push({
-			x: end.x,
-			width: 0
-		});
-		setSelection(textinput.selectionStart, textinput.selectionEnd, true);
-	}
+    // Add a last bbox for cursor at end of text
+    chardata.push({
+      x: end.x,
+      width: 0
+    });
+    setSelection(textinput.selectionStart, textinput.selectionEnd, true);
+  }
 };
 }());
 
@@ -2746,46 +2746,46 @@ var currentPath;
 var newPoint, firstCtrl;
 
 function resetD (p) {
-	p.setAttribute('d', pathActions.convertPath(p));
+  p.setAttribute('d', pathActions.convertPath(p));
 }
 
 // TODO: Move into path.js
 svgedit.path.Path.prototype.endChanges = function (text) {
-	if (svgedit.browser.isWebkit()) { resetD(this.elem); }
-	var cmd = new svgedit.history.ChangeElementCommand(this.elem, {d: this.last_d}, text);
-	addCommandToHistory(cmd);
-	call('changed', [this.elem]);
+  if (svgedit.browser.isWebkit()) { resetD(this.elem); }
+  var cmd = new svgedit.history.ChangeElementCommand(this.elem, {d: this.last_d}, text);
+  addCommandToHistory(cmd);
+  call('changed', [this.elem]);
 };
 
 svgedit.path.Path.prototype.addPtsToSelection = function (indexes) {
-	var i, seg;
-	if (!$.isArray(indexes)) { indexes = [indexes]; }
-	for (i = 0; i < indexes.length; i++) {
-		var index = indexes[i];
-		seg = this.segs[index];
-		if (seg.ptgrip) {
-			if (this.selected_pts.indexOf(index) === -1 && index >= 0) {
-				this.selected_pts.push(index);
-			}
-		}
-	}
-	this.selected_pts.sort();
-	i = this.selected_pts.length;
-	var grips = [];
-	grips.length = i;
-	// Loop through points to be selected and highlight each
-	while (i--) {
-		var pt = this.selected_pts[i];
-		seg = this.segs[pt];
-		seg.select(true);
-		grips[i] = seg.ptgrip;
-	}
-	// TODO: Correct this:
-	pathActions.canDeleteNodes = true;
+  var i, seg;
+  if (!$.isArray(indexes)) { indexes = [indexes]; }
+  for (i = 0; i < indexes.length; i++) {
+    var index = indexes[i];
+    seg = this.segs[index];
+    if (seg.ptgrip) {
+      if (this.selected_pts.indexOf(index) === -1 && index >= 0) {
+        this.selected_pts.push(index);
+      }
+    }
+  }
+  this.selected_pts.sort();
+  i = this.selected_pts.length;
+  var grips = [];
+  grips.length = i;
+  // Loop through points to be selected and highlight each
+  while (i--) {
+    var pt = this.selected_pts[i];
+    seg = this.segs[pt];
+    seg.select(true);
+    grips[i] = seg.ptgrip;
+  }
+  // TODO: Correct this:
+  pathActions.canDeleteNodes = true;
 
-	pathActions.closed_subpath = this.subpathIsClosed(this.selected_pts[0]);
+  pathActions.closed_subpath = this.subpathIsClosed(this.selected_pts[0]);
 
-	call('selected', grips);
+  call('selected', grips);
 };
 
 currentPath = null;
@@ -2796,867 +2796,867 @@ var hasMoved = false;
 // a path element and coverts every three line segments into a single bezier
 // curve in an attempt to smooth out the free-hand
 var smoothPolylineIntoPath = function (element) {
-	var i, points = element.points;
-	var N = points.numberOfItems;
-	if (N >= 4) {
-		// loop through every 3 points and convert to a cubic bezier curve segment
-		//
-		// NOTE: this is cheating, it means that every 3 points has the potential to
-		// be a corner instead of treating each point in an equal manner. In general,
-		// this technique does not look that good.
-		//
-		// I am open to better ideas!
-		//
-		// Reading:
-		// - http://www.efg2.com/Lab/Graphics/Jean-YvesQueinecBezierCurves.htm
-		// - http://www.codeproject.com/KB/graphics/BezierSpline.aspx?msg=2956963
-		// - http://www.ian-ko.com/ET_GeoWizards/UserGuide/smooth.htm
-		// - http://www.cs.mtu.edu/~shene/COURSES/cs3621/NOTES/spline/Bezier/bezier-der.html
-		var curpos = points.getItem(0), prevCtlPt = null;
-		var d = [];
-		d.push(['M', curpos.x, ',', curpos.y, ' C'].join(''));
-		for (i = 1; i <= (N - 4); i += 3) {
-			var ct1 = points.getItem(i);
-			var ct2 = points.getItem(i + 1);
-			var end = points.getItem(i + 2);
+  var i, points = element.points;
+  var N = points.numberOfItems;
+  if (N >= 4) {
+    // loop through every 3 points and convert to a cubic bezier curve segment
+    //
+    // NOTE: this is cheating, it means that every 3 points has the potential to
+    // be a corner instead of treating each point in an equal manner. In general,
+    // this technique does not look that good.
+    //
+    // I am open to better ideas!
+    //
+    // Reading:
+    // - http://www.efg2.com/Lab/Graphics/Jean-YvesQueinecBezierCurves.htm
+    // - http://www.codeproject.com/KB/graphics/BezierSpline.aspx?msg=2956963
+    // - http://www.ian-ko.com/ET_GeoWizards/UserGuide/smooth.htm
+    // - http://www.cs.mtu.edu/~shene/COURSES/cs3621/NOTES/spline/Bezier/bezier-der.html
+    var curpos = points.getItem(0), prevCtlPt = null;
+    var d = [];
+    d.push(['M', curpos.x, ',', curpos.y, ' C'].join(''));
+    for (i = 1; i <= (N - 4); i += 3) {
+      var ct1 = points.getItem(i);
+      var ct2 = points.getItem(i + 1);
+      var end = points.getItem(i + 2);
 
-			// if the previous segment had a control point, we want to smooth out
-			// the control points on both sides
-			if (prevCtlPt) {
-				var newpts = svgedit.path.smoothControlPoints(prevCtlPt, ct1, curpos);
-				if (newpts && newpts.length === 2) {
-					var prevArr = d[d.length - 1].split(',');
-					prevArr[2] = newpts[0].x;
-					prevArr[3] = newpts[0].y;
-					d[d.length - 1] = prevArr.join(',');
-					ct1 = newpts[1];
-				}
-			}
+      // if the previous segment had a control point, we want to smooth out
+      // the control points on both sides
+      if (prevCtlPt) {
+        var newpts = svgedit.path.smoothControlPoints(prevCtlPt, ct1, curpos);
+        if (newpts && newpts.length === 2) {
+          var prevArr = d[d.length - 1].split(',');
+          prevArr[2] = newpts[0].x;
+          prevArr[3] = newpts[0].y;
+          d[d.length - 1] = prevArr.join(',');
+          ct1 = newpts[1];
+        }
+      }
 
-			d.push([ct1.x, ct1.y, ct2.x, ct2.y, end.x, end.y].join(','));
+      d.push([ct1.x, ct1.y, ct2.x, ct2.y, end.x, end.y].join(','));
 
-			curpos = end;
-			prevCtlPt = ct2;
-		}
-		// handle remaining line segments
-		d.push('L');
-		while (i < N) {
-			var pt = points.getItem(i);
-			d.push([pt.x, pt.y].join(','));
-			i++;
-		}
-		d = d.join(' ');
+      curpos = end;
+      prevCtlPt = ct2;
+    }
+    // handle remaining line segments
+    d.push('L');
+    while (i < N) {
+      var pt = points.getItem(i);
+      d.push([pt.x, pt.y].join(','));
+      i++;
+    }
+    d = d.join(' ');
 
-		// create new path element
-		element = addSvgElementFromJson({
-			element: 'path',
-			curStyles: true,
-			attr: {
-				id: getId(),
-				d: d,
-				fill: 'none'
-			}
-		});
-		// No need to call "changed", as this is already done under mouseUp
-	}
-	return element;
+    // create new path element
+    element = addSvgElementFromJson({
+      element: 'path',
+      curStyles: true,
+      attr: {
+        id: getId(),
+        d: d,
+        fill: 'none'
+      }
+    });
+    // No need to call "changed", as this is already done under mouseUp
+  }
+  return element;
 };
 
 return {
-	mouseDown: function (evt, mouseTarget, startX, startY) {
-		var id;
-		if (currentMode === 'path') {
-			var mouseX = startX; // Was this meant to work with the other `mouseX`? (was defined globally so adding `var` to at least avoid a global)
-			var mouseY = startY; // Was this meant to work with the other `mouseY`? (was defined globally so adding `var` to at least avoid a global)
-
-			var x = mouseX / currentZoom,
-				y = mouseY / currentZoom,
-				stretchy = svgedit.utilities.getElem('path_stretch_line');
-			newPoint = [x, y];
-
-			if (curConfig.gridSnapping) {
-				x = svgedit.utilities.snapToGrid(x);
-				y = svgedit.utilities.snapToGrid(y);
-				mouseX = svgedit.utilities.snapToGrid(mouseX);
-				mouseY = svgedit.utilities.snapToGrid(mouseY);
-			}
-
-			if (!stretchy) {
-				stretchy = document.createElementNS(NS.SVG, 'path');
-				svgedit.utilities.assignAttributes(stretchy, {
-					id: 'path_stretch_line',
-					stroke: '#22C',
-					'stroke-width': '0.5',
-					fill: 'none'
-				});
-				stretchy = svgedit.utilities.getElem('selectorParentGroup').appendChild(stretchy);
-			}
-			stretchy.setAttribute('display', 'inline');
-
-			var keep = null;
-			var index;
-			// if pts array is empty, create path element with M at current point
-			if (!drawnPath) {
-				var dAttr = 'M' + x + ',' + y + ' '; // Was this meant to work with the other `dAttr`? (was defined globally so adding `var` to at least avoid a global)
-				drawnPath = addSvgElementFromJson({
-					element: 'path',
-					curStyles: true,
-					attr: {
-						d: dAttr,
-						id: getNextId(),
-						opacity: curShape.opacity / 2
-					}
-				});
-				// set stretchy line to first point
-				stretchy.setAttribute('d', ['M', mouseX, mouseY, mouseX, mouseY].join(' '));
-				index = subpath ? svgedit.path.path.segs.length : 0;
-				svgedit.path.addPointGrip(index, mouseX, mouseY);
-			} else {
-				// determine if we clicked on an existing point
-				var seglist = drawnPath.pathSegList;
-				var i = seglist.numberOfItems;
-				var FUZZ = 6 / currentZoom;
-				var clickOnPoint = false;
-				while (i) {
-					i--;
-					var item = seglist.getItem(i);
-					var px = item.x, py = item.y;
-					// found a matching point
-					if (x >= (px - FUZZ) && x <= (px + FUZZ) &&
-						y >= (py - FUZZ) && y <= (py + FUZZ)
-					) {
-						clickOnPoint = true;
-						break;
-					}
-				}
-
-				// get path element that we are in the process of creating
-				id = getId();
-
-				// Remove previous path object if previously created
-				svgedit.path.removePath_(id);
-
-				var newpath = svgedit.utilities.getElem(id);
-				var newseg;
-				var sSeg;
-				var len = seglist.numberOfItems;
-				// if we clicked on an existing point, then we are done this path, commit it
-				// (i, i+1) are the x,y that were clicked on
-				if (clickOnPoint) {
-					// if clicked on any other point but the first OR
-					// the first point was clicked on and there are less than 3 points
-					// then leave the path open
-					// otherwise, close the path
-					if (i <= 1 && len >= 2) {
-						// Create end segment
-						var absX = seglist.getItem(0).x;
-						var absY = seglist.getItem(0).y;
-
-						sSeg = stretchy.pathSegList.getItem(1);
-						if (sSeg.pathSegType === 4) {
-							newseg = drawnPath.createSVGPathSegLinetoAbs(absX, absY);
-						} else {
-							newseg = drawnPath.createSVGPathSegCurvetoCubicAbs(
-								absX,
-								absY,
-								sSeg.x1 / currentZoom,
-								sSeg.y1 / currentZoom,
-								absX,
-								absY
-							);
-						}
-
-						var endseg = drawnPath.createSVGPathSegClosePath();
-						seglist.appendItem(newseg);
-						seglist.appendItem(endseg);
-					} else if (len < 3) {
-						keep = false;
-						return keep;
-					}
-					$(stretchy).remove();
-
-					// This will signal to commit the path
-					// var element = newpath; // Other event handlers define own `element`, so this was probably not meant to interact with them or one which shares state (as there were none); I therefore adding a missing `var` to avoid a global
-					drawnPath = null;
-					started = false;
-
-					if (subpath) {
-						if (svgedit.path.path.matrix) {
-							svgedit.coords.remapElement(newpath, {}, svgedit.path.path.matrix.inverse());
-						}
-
-						var newD = newpath.getAttribute('d');
-						var origD = $(svgedit.path.path.elem).attr('d');
-						$(svgedit.path.path.elem).attr('d', origD + newD);
-						$(newpath).remove();
-						if (svgedit.path.path.matrix) {
-							svgedit.path.recalcRotatedPath();
-						}
-						svgedit.path.path.init();
-						pathActions.toEditMode(svgedit.path.path.elem);
-						svgedit.path.path.selectPt();
-						return false;
-					}
-				// else, create a new point, update path element
-				} else {
-					// Checks if current target or parents are #svgcontent
-					if (!$.contains(container, getMouseTarget(evt))) {
-						// Clicked outside canvas, so don't make point
-						console.log('Clicked outside canvas');
-						return false;
-					}
-
-					var num = drawnPath.pathSegList.numberOfItems;
-					var last = drawnPath.pathSegList.getItem(num - 1);
-					var lastx = last.x, lasty = last.y;
-
-					if (evt.shiftKey) {
-						var xya = svgedit.math.snapToAngle(lastx, lasty, x, y);
-						x = xya.x;
-						y = xya.y;
-					}
-
-					// Use the segment defined by stretchy
-					sSeg = stretchy.pathSegList.getItem(1);
-					if (sSeg.pathSegType === 4) {
-						newseg = drawnPath.createSVGPathSegLinetoAbs(round(x), round(y));
-					} else {
-						newseg = drawnPath.createSVGPathSegCurvetoCubicAbs(
-							round(x),
-							round(y),
-							sSeg.x1 / currentZoom,
-							sSeg.y1 / currentZoom,
-							sSeg.x2 / currentZoom,
-							sSeg.y2 / currentZoom
-						);
-					}
-
-					drawnPath.pathSegList.appendItem(newseg);
-
-					x *= currentZoom;
-					y *= currentZoom;
-
-					// set stretchy line to latest point
-					stretchy.setAttribute('d', ['M', x, y, x, y].join(' '));
-					index = num;
-					if (subpath) { index += svgedit.path.path.segs.length; }
-					svgedit.path.addPointGrip(index, x, y);
-				}
-				// keep = true;
-			}
-
-			return;
-		}
-
-		// TODO: Make sure currentPath isn't null at this point
-		if (!svgedit.path.path) { return; }
-
-		svgedit.path.path.storeD();
-
-		id = evt.target.id;
-		var curPt;
-		if (id.substr(0, 14) === 'pathpointgrip_') {
-			// Select this point
-			curPt = svgedit.path.path.cur_pt = parseInt(id.substr(14), 10);
-			svgedit.path.path.dragging = [startX, startY];
-			var seg = svgedit.path.path.segs[curPt];
-
-			// only clear selection if shift is not pressed (otherwise, add
-			// node to selection)
-			if (!evt.shiftKey) {
-				if (svgedit.path.path.selected_pts.length <= 1 || !seg.selected) {
-					svgedit.path.path.clearSelection();
-				}
-				svgedit.path.path.addPtsToSelection(curPt);
-			} else if (seg.selected) {
-				svgedit.path.path.removePtFromSelection(curPt);
-			} else {
-				svgedit.path.path.addPtsToSelection(curPt);
-			}
-		} else if (id.indexOf('ctrlpointgrip_') === 0) {
-			svgedit.path.path.dragging = [startX, startY];
-
-			var parts = id.split('_')[1].split('c');
-			curPt = Number(parts[0]);
-			var ctrlNum = Number(parts[1]);
-			svgedit.path.path.selectPt(curPt, ctrlNum);
-		}
-
-		// Start selection box
-		if (!svgedit.path.path.dragging) {
-			if (rubberBox == null) {
-				rubberBox = selectorManager.getRubberBandBox();
-			}
-			svgedit.utilities.assignAttributes(rubberBox, {
-				'x': startX * currentZoom,
-				'y': startY * currentZoom,
-				'width': 0,
-				'height': 0,
-				'display': 'inline'
-			}, 100);
-		}
-	},
-	mouseMove: function (mouseX, mouseY) {
-		hasMoved = true;
-		if (currentMode === 'path') {
-			if (!drawnPath) { return; }
-			var seglist = drawnPath.pathSegList;
-			var index = seglist.numberOfItems - 1;
-
-			if (newPoint) {
-				// First point
-				// if (!index) { return; }
-
-				// Set control points
-				var pointGrip1 = svgedit.path.addCtrlGrip('1c1');
-				var pointGrip2 = svgedit.path.addCtrlGrip('0c2');
-
-				// dragging pointGrip1
-				pointGrip1.setAttribute('cx', mouseX);
-				pointGrip1.setAttribute('cy', mouseY);
-				pointGrip1.setAttribute('display', 'inline');
-
-				var ptX = newPoint[0];
-				var ptY = newPoint[1];
-
-				// set curve
-				// var seg = seglist.getItem(index);
-				var curX = mouseX / currentZoom;
-				var curY = mouseY / currentZoom;
-				var altX = (ptX + (ptX - curX));
-				var altY = (ptY + (ptY - curY));
-
-				pointGrip2.setAttribute('cx', altX * currentZoom);
-				pointGrip2.setAttribute('cy', altY * currentZoom);
-				pointGrip2.setAttribute('display', 'inline');
-
-				var ctrlLine = svgedit.path.getCtrlLine(1);
-				svgedit.utilities.assignAttributes(ctrlLine, {
-					x1: mouseX,
-					y1: mouseY,
-					x2: altX * currentZoom,
-					y2: altY * currentZoom,
-					display: 'inline'
-				});
-
-				if (index === 0) {
-					firstCtrl = [mouseX, mouseY];
-				} else {
-					var last = seglist.getItem(index - 1);
-					var lastX = last.x;
-					var lastY = last.y;
-
-					if (last.pathSegType === 6) {
-						lastX += (lastX - last.x2);
-						lastY += (lastY - last.y2);
-					} else if (firstCtrl) {
-						lastX = firstCtrl[0] / currentZoom;
-						lastY = firstCtrl[1] / currentZoom;
-					}
-					svgedit.path.replacePathSeg(6, index, [ptX, ptY, lastX, lastY, altX, altY], drawnPath);
-				}
-			} else {
-				var stretchy = svgedit.utilities.getElem('path_stretch_line');
-				if (stretchy) {
-					var prev = seglist.getItem(index);
-					if (prev.pathSegType === 6) {
-						var prevX = prev.x + (prev.x - prev.x2);
-						var prevY = prev.y + (prev.y - prev.y2);
-						svgedit.path.replacePathSeg(6, 1, [mouseX, mouseY, prevX * currentZoom, prevY * currentZoom, mouseX, mouseY], stretchy);
-					} else if (firstCtrl) {
-						svgedit.path.replacePathSeg(6, 1, [mouseX, mouseY, firstCtrl[0], firstCtrl[1], mouseX, mouseY], stretchy);
-					} else {
-						svgedit.path.replacePathSeg(4, 1, [mouseX, mouseY], stretchy);
-					}
-				}
-			}
-			return;
-		}
-		// if we are dragging a point, let's move it
-		if (svgedit.path.path.dragging) {
-			var pt = svgedit.path.getPointFromGrip({
-				x: svgedit.path.path.dragging[0],
-				y: svgedit.path.path.dragging[1]
-			}, svgedit.path.path);
-			var mpt = svgedit.path.getPointFromGrip({
-				x: mouseX,
-				y: mouseY
-			}, svgedit.path.path);
-			var diffX = mpt.x - pt.x;
-			var diffY = mpt.y - pt.y;
-			svgedit.path.path.dragging = [mouseX, mouseY];
-
-			if (svgedit.path.path.dragctrl) {
-				svgedit.path.path.moveCtrl(diffX, diffY);
-			} else {
-				svgedit.path.path.movePts(diffX, diffY);
-			}
-		} else {
-			svgedit.path.path.selected_pts = [];
-			svgedit.path.path.eachSeg(function (i) {
-				var seg = this;
-				if (!seg.next && !seg.prev) { return; }
-
-				// var item = seg.item;
-				var rbb = rubberBox.getBBox();
-
-				var pt = svgedit.path.getGripPt(seg);
-				var ptBb = {
-					x: pt.x,
-					y: pt.y,
-					width: 0,
-					height: 0
-				};
-
-				var sel = svgedit.math.rectsIntersect(rbb, ptBb);
-
-				this.select(sel);
-				// Note that addPtsToSelection is not being run
-				if (sel) { svgedit.path.path.selected_pts.push(seg.index); }
-			});
-		}
-	},
-	mouseUp: function (evt, element, mouseX, mouseY) {
-		// Create mode
-		if (currentMode === 'path') {
-			newPoint = null;
-			if (!drawnPath) {
-				element = svgedit.utilities.getElem(getId());
-				started = false;
-				firstCtrl = null;
-			}
-
-			return {
-				keep: true,
-				element: element
-			};
-		}
-
-		// Edit mode
-
-		if (svgedit.path.path.dragging) {
-			var lastPt = svgedit.path.path.cur_pt;
-
-			svgedit.path.path.dragging = false;
-			svgedit.path.path.dragctrl = false;
-			svgedit.path.path.update();
-
-			if (hasMoved) {
-				svgedit.path.path.endChanges('Move path point(s)');
-			}
-
-			if (!evt.shiftKey && !hasMoved) {
-				svgedit.path.path.selectPt(lastPt);
-			}
-		} else if (rubberBox && rubberBox.getAttribute('display') !== 'none') {
-			// Done with multi-node-select
-			rubberBox.setAttribute('display', 'none');
-
-			if (rubberBox.getAttribute('width') <= 2 && rubberBox.getAttribute('height') <= 2) {
-				pathActions.toSelectMode(evt.target);
-			}
-
-		// else, move back to select mode
-		} else {
-			pathActions.toSelectMode(evt.target);
-		}
-		hasMoved = false;
-	},
-	toEditMode: function (element) {
-		svgedit.path.path = svgedit.path.getPath_(element);
-		currentMode = 'pathedit';
-		clearSelection();
-		svgedit.path.path.show(true).update();
-		svgedit.path.path.oldbbox = svgedit.utilities.getBBox(svgedit.path.path.elem);
-		subpath = false;
-	},
-	toSelectMode: function (elem) {
-		var selPath = (elem === svgedit.path.path.elem);
-		currentMode = 'select';
-		svgedit.path.path.show(false);
-		currentPath = false;
-		clearSelection();
-
-		if (svgedit.path.path.matrix) {
-			// Rotated, so may need to re-calculate the center
-			svgedit.path.recalcRotatedPath();
-		}
-
-		if (selPath) {
-			call('selected', [elem]);
-			addToSelection([elem], true);
-		}
-	},
-	addSubPath: function (on) {
-		if (on) {
-			// Internally we go into "path" mode, but in the UI it will
-			// still appear as if in "pathedit" mode.
-			currentMode = 'path';
-			subpath = true;
-		} else {
-			pathActions.clear(true);
-			pathActions.toEditMode(svgedit.path.path.elem);
-		}
-	},
-	select: function (target) {
-		if (currentPath === target) {
-			pathActions.toEditMode(target);
-			currentMode = 'pathedit';
-		// going into pathedit mode
-		} else {
-			currentPath = target;
-		}
-	},
-	reorient: function () {
-		var elem = selectedElements[0];
-		if (!elem) { return; }
-		var angle = svgedit.utilities.getRotationAngle(elem);
-		if (angle === 0) { return; }
-
-		var batchCmd = new svgedit.history.BatchCommand('Reorient path');
-		var changes = {
-			d: elem.getAttribute('d'),
-			transform: elem.getAttribute('transform')
-		};
-		batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
-		clearSelection();
-		this.resetOrientation(elem);
-
-		addCommandToHistory(batchCmd);
-
-		// Set matrix to null
-		svgedit.path.getPath_(elem).show(false).matrix = null;
-
-		this.clear();
-
-		addToSelection([elem], true);
-		call('changed', selectedElements);
-	},
-
-	clear: function (remove) {
-		currentPath = null;
-		if (drawnPath) {
-			var elem = svgedit.utilities.getElem(getId());
-			$(svgedit.utilities.getElem('path_stretch_line')).remove();
-			$(elem).remove();
-			$(svgedit.utilities.getElem('pathpointgrip_container')).find('*').attr('display', 'none');
-			drawnPath = firstCtrl = null;
-			started = false;
-		} else if (currentMode === 'pathedit') {
-			this.toSelectMode();
-		}
-		if (svgedit.path.path) { svgedit.path.path.init().show(false); }
-	},
-	resetOrientation: function (path) {
-		if (path == null || path.nodeName !== 'path') { return false; }
-		var tlist = svgedit.transformlist.getTransformList(path);
-		var m = svgedit.math.transformListToTransform(tlist).matrix;
-		tlist.clear();
-		path.removeAttribute('transform');
-		var segList = path.pathSegList;
-
-		// Opera/win/non-EN throws an error here.
-		// TODO: Find out why!
-		// Presumed fixed in Opera 10.5, so commented out for now
-
-		// try {
-		var len = segList.numberOfItems;
-		// } catch(err) {
-		// 	var fixed_d = pathActions.convertPath(path);
-		// 	path.setAttribute('d', fixed_d);
-		// 	segList = path.pathSegList;
-		// 	var len = segList.numberOfItems;
-		// }
-		var i; // , lastX, lastY;
-		for (i = 0; i < len; ++i) {
-			var seg = segList.getItem(i);
-			var type = seg.pathSegType;
-			if (type === 1) { continue; }
-			var pts = [];
-			$.each(['', 1, 2], function (j, n) {
-				var x = seg['x' + n], y = seg['y' + n];
-				if (x !== undefined && y !== undefined) {
-					var pt = svgedit.math.transformPoint(x, y, m);
-					pts.splice(pts.length, 0, pt.x, pt.y);
-				}
-			});
-			svgedit.path.replacePathSeg(type, i, pts, path);
-		}
-
-		reorientGrads(path, m);
-	},
-	zoomChange: function () {
-		if (currentMode === 'pathedit') {
-			svgedit.path.path.update();
-		}
-	},
-	getNodePoint: function () {
-		var selPt = svgedit.path.path.selected_pts.length ? svgedit.path.path.selected_pts[0] : 1;
-
-		var seg = svgedit.path.path.segs[selPt];
-		return {
-			x: seg.item.x,
-			y: seg.item.y,
-			type: seg.type
-		};
-	},
-	linkControlPoints: function (linkPoints) {
-		svgedit.path.setLinkControlPoints(linkPoints);
-	},
-	clonePathNode: function () {
-		svgedit.path.path.storeD();
-
-		var selPts = svgedit.path.path.selected_pts;
-		// var segs = svgedit.path.path.segs;
-
-		var i = selPts.length;
-		var nums = [];
-
-		while (i--) {
-			var pt = selPts[i];
-			svgedit.path.path.addSeg(pt);
-
-			nums.push(pt + i);
-			nums.push(pt + i + 1);
-		}
-		svgedit.path.path.init().addPtsToSelection(nums);
-
-		svgedit.path.path.endChanges('Clone path node(s)');
-	},
-	opencloseSubPath: function () {
-		var selPts = svgedit.path.path.selected_pts;
-		// Only allow one selected node for now
-		if (selPts.length !== 1) { return; }
-
-		var elem = svgedit.path.path.elem;
-		var list = elem.pathSegList;
-
-		// var len = list.numberOfItems;
-
-		var index = selPts[0];
-
-		var openPt = null;
-		var startItem = null;
-
-		// Check if subpath is already open
-		svgedit.path.path.eachSeg(function (i) {
-			if (this.type === 2 && i <= index) {
-				startItem = this.item;
-			}
-			if (i <= index) { return true; }
-			if (this.type === 2) {
-				// Found M first, so open
-				openPt = i;
-				return false;
-			}
-			if (this.type === 1) {
-				// Found Z first, so closed
-				openPt = false;
-				return false;
-			}
-		});
-
-		if (openPt == null) {
-			// Single path, so close last seg
-			openPt = svgedit.path.path.segs.length - 1;
-		}
-
-		if (openPt !== false) {
-			// Close this path
-
-			// Create a line going to the previous "M"
-			var newseg = elem.createSVGPathSegLinetoAbs(startItem.x, startItem.y);
-
-			var closer = elem.createSVGPathSegClosePath();
-			if (openPt === svgedit.path.path.segs.length - 1) {
-				list.appendItem(newseg);
-				list.appendItem(closer);
-			} else {
-				svgedit.path.insertItemBefore(elem, closer, openPt);
-				svgedit.path.insertItemBefore(elem, newseg, openPt);
-			}
-
-			svgedit.path.path.init().selectPt(openPt + 1);
-			return;
-		}
-
-		// M 1,1 L 2,2 L 3,3 L 1,1 z // open at 2,2
-		// M 2,2 L 3,3 L 1,1
-
-		// M 1,1 L 2,2 L 1,1 z M 4,4 L 5,5 L6,6 L 5,5 z
-		// M 1,1 L 2,2 L 1,1 z [M 4,4] L 5,5 L(M)6,6 L 5,5 z
-
-		var seg = svgedit.path.path.segs[index];
-
-		if (seg.mate) {
-			list.removeItem(index); // Removes last "L"
-			list.removeItem(index); // Removes the "Z"
-			svgedit.path.path.init().selectPt(index - 1);
-			return;
-		}
-
-		var i, lastM, zSeg;
-
-		// Find this sub-path's closing point and remove
-		for (i = 0; i < list.numberOfItems; i++) {
-			var item = list.getItem(i);
-
-			if (item.pathSegType === 2) {
-				// Find the preceding M
-				lastM = i;
-			} else if (i === index) {
-				// Remove it
-				list.removeItem(lastM);
-				// index--;
-			} else if (item.pathSegType === 1 && index < i) {
-				// Remove the closing seg of this subpath
-				zSeg = i - 1;
-				list.removeItem(i);
-				break;
-			}
-		}
-
-		var num = (index - lastM) - 1;
-
-		while (num--) {
-			svgedit.path.insertItemBefore(elem, list.getItem(lastM), zSeg);
-		}
-
-		var pt = list.getItem(lastM);
-
-		// Make this point the new "M"
-		svgedit.path.replacePathSeg(2, lastM, [pt.x, pt.y]);
-
-		i = index; // i is local here, so has no effect; what is the reason for this?
-
-		svgedit.path.path.init().selectPt(0);
-	},
-	deletePathNode: function () {
-		if (!pathActions.canDeleteNodes) { return; }
-		svgedit.path.path.storeD();
-
-		var selPts = svgedit.path.path.selected_pts;
-		var i = selPts.length;
-
-		while (i--) {
-			var pt = selPts[i];
-			svgedit.path.path.deleteSeg(pt);
-		}
-
-		// Cleanup
-		var cleanup = function () {
-			var segList = svgedit.path.path.elem.pathSegList;
-			var len = segList.numberOfItems;
-
-			var remItems = function (pos, count) {
-				while (count--) {
-					segList.removeItem(pos);
-				}
-			};
-
-			if (len <= 1) { return true; }
-
-			while (len--) {
-				var item = segList.getItem(len);
-				if (item.pathSegType === 1) {
-					var prev = segList.getItem(len - 1);
-					var nprev = segList.getItem(len - 2);
-					if (prev.pathSegType === 2) {
-						remItems(len - 1, 2);
-						cleanup();
-						break;
-					} else if (nprev.pathSegType === 2) {
-						remItems(len - 2, 3);
-						cleanup();
-						break;
-					}
-				} else if (item.pathSegType === 2) {
-					if (len > 0) {
-						var prevType = segList.getItem(len - 1).pathSegType;
-						// Path has M M
-						if (prevType === 2) {
-							remItems(len - 1, 1);
-							cleanup();
-							break;
-						// Entire path ends with Z M
-						} else if (prevType === 1 && segList.numberOfItems - 1 === len) {
-							remItems(len, 1);
-							cleanup();
-							break;
-						}
-					}
-				}
-			}
-			return false;
-		};
-
-		cleanup();
-
-		// Completely delete a path with 1 or 0 segments
-		if (svgedit.path.path.elem.pathSegList.numberOfItems <= 1) {
-			pathActions.toSelectMode(svgedit.path.path.elem);
-			canvas.deleteSelectedElements();
-			return;
-		}
-
-		svgedit.path.path.init();
-		svgedit.path.path.clearSelection();
-
-		// TODO: Find right way to select point now
-		// path.selectPt(selPt);
-		if (window.opera) { // Opera repaints incorrectly
-			var cp = $(svgedit.path.path.elem);
-			cp.attr('d', cp.attr('d'));
-		}
-		svgedit.path.path.endChanges('Delete path node(s)');
-	},
-	smoothPolylineIntoPath: smoothPolylineIntoPath,
-	setSegType: function (v) {
-		svgedit.path.path.setSegType(v);
-	},
-	moveNode: function (attr, newValue) {
-		var selPts = svgedit.path.path.selected_pts;
-		if (!selPts.length) { return; }
-
-		svgedit.path.path.storeD();
-
-		// Get first selected point
-		var seg = svgedit.path.path.segs[selPts[0]];
-		var diff = {x: 0, y: 0};
-		diff[attr] = newValue - seg.item[attr];
-
-		seg.move(diff.x, diff.y);
-		svgedit.path.path.endChanges('Move path point');
-	},
-	fixEnd: function (elem) {
-		// Adds an extra segment if the last seg before a Z doesn't end
-		// at its M point
-		// M0,0 L0,100 L100,100 z
-		var segList = elem.pathSegList;
-		var len = segList.numberOfItems;
-		var i, lastM;
-		for (i = 0; i < len; ++i) {
-			var item = segList.getItem(i);
-			if (item.pathSegType === 2) {
-				lastM = item;
-			}
-
-			if (item.pathSegType === 1) {
-				var prev = segList.getItem(i - 1);
-				if (prev.x !== lastM.x || prev.y !== lastM.y) {
-					// Add an L segment here
-					var newseg = elem.createSVGPathSegLinetoAbs(lastM.x, lastM.y);
-					svgedit.path.insertItemBefore(elem, newseg, i);
-					// Can this be done better?
-					pathActions.fixEnd(elem);
-					break;
-				}
-			}
-		}
-		if (svgedit.browser.isWebkit()) { resetD(elem); }
-	},
-	// Convert a path to one with only absolute or relative values
-	convertPath: svgedit.utilities.convertPath
+  mouseDown: function (evt, mouseTarget, startX, startY) {
+    var id;
+    if (currentMode === 'path') {
+      var mouseX = startX; // Was this meant to work with the other `mouseX`? (was defined globally so adding `var` to at least avoid a global)
+      var mouseY = startY; // Was this meant to work with the other `mouseY`? (was defined globally so adding `var` to at least avoid a global)
+
+      var x = mouseX / currentZoom,
+        y = mouseY / currentZoom,
+        stretchy = svgedit.utilities.getElem('path_stretch_line');
+      newPoint = [x, y];
+
+      if (curConfig.gridSnapping) {
+        x = svgedit.utilities.snapToGrid(x);
+        y = svgedit.utilities.snapToGrid(y);
+        mouseX = svgedit.utilities.snapToGrid(mouseX);
+        mouseY = svgedit.utilities.snapToGrid(mouseY);
+      }
+
+      if (!stretchy) {
+        stretchy = document.createElementNS(NS.SVG, 'path');
+        svgedit.utilities.assignAttributes(stretchy, {
+          id: 'path_stretch_line',
+          stroke: '#22C',
+          'stroke-width': '0.5',
+          fill: 'none'
+        });
+        stretchy = svgedit.utilities.getElem('selectorParentGroup').appendChild(stretchy);
+      }
+      stretchy.setAttribute('display', 'inline');
+
+      var keep = null;
+      var index;
+      // if pts array is empty, create path element with M at current point
+      if (!drawnPath) {
+        var dAttr = 'M' + x + ',' + y + ' '; // Was this meant to work with the other `dAttr`? (was defined globally so adding `var` to at least avoid a global)
+        drawnPath = addSvgElementFromJson({
+          element: 'path',
+          curStyles: true,
+          attr: {
+            d: dAttr,
+            id: getNextId(),
+            opacity: curShape.opacity / 2
+          }
+        });
+        // set stretchy line to first point
+        stretchy.setAttribute('d', ['M', mouseX, mouseY, mouseX, mouseY].join(' '));
+        index = subpath ? svgedit.path.path.segs.length : 0;
+        svgedit.path.addPointGrip(index, mouseX, mouseY);
+      } else {
+        // determine if we clicked on an existing point
+        var seglist = drawnPath.pathSegList;
+        var i = seglist.numberOfItems;
+        var FUZZ = 6 / currentZoom;
+        var clickOnPoint = false;
+        while (i) {
+          i--;
+          var item = seglist.getItem(i);
+          var px = item.x, py = item.y;
+          // found a matching point
+          if (x >= (px - FUZZ) && x <= (px + FUZZ) &&
+            y >= (py - FUZZ) && y <= (py + FUZZ)
+          ) {
+            clickOnPoint = true;
+            break;
+          }
+        }
+
+        // get path element that we are in the process of creating
+        id = getId();
+
+        // Remove previous path object if previously created
+        svgedit.path.removePath_(id);
+
+        var newpath = svgedit.utilities.getElem(id);
+        var newseg;
+        var sSeg;
+        var len = seglist.numberOfItems;
+        // if we clicked on an existing point, then we are done this path, commit it
+        // (i, i+1) are the x,y that were clicked on
+        if (clickOnPoint) {
+          // if clicked on any other point but the first OR
+          // the first point was clicked on and there are less than 3 points
+          // then leave the path open
+          // otherwise, close the path
+          if (i <= 1 && len >= 2) {
+            // Create end segment
+            var absX = seglist.getItem(0).x;
+            var absY = seglist.getItem(0).y;
+
+            sSeg = stretchy.pathSegList.getItem(1);
+            if (sSeg.pathSegType === 4) {
+              newseg = drawnPath.createSVGPathSegLinetoAbs(absX, absY);
+            } else {
+              newseg = drawnPath.createSVGPathSegCurvetoCubicAbs(
+                absX,
+                absY,
+                sSeg.x1 / currentZoom,
+                sSeg.y1 / currentZoom,
+                absX,
+                absY
+              );
+            }
+
+            var endseg = drawnPath.createSVGPathSegClosePath();
+            seglist.appendItem(newseg);
+            seglist.appendItem(endseg);
+          } else if (len < 3) {
+            keep = false;
+            return keep;
+          }
+          $(stretchy).remove();
+
+          // This will signal to commit the path
+          // var element = newpath; // Other event handlers define own `element`, so this was probably not meant to interact with them or one which shares state (as there were none); I therefore adding a missing `var` to avoid a global
+          drawnPath = null;
+          started = false;
+
+          if (subpath) {
+            if (svgedit.path.path.matrix) {
+              svgedit.coords.remapElement(newpath, {}, svgedit.path.path.matrix.inverse());
+            }
+
+            var newD = newpath.getAttribute('d');
+            var origD = $(svgedit.path.path.elem).attr('d');
+            $(svgedit.path.path.elem).attr('d', origD + newD);
+            $(newpath).remove();
+            if (svgedit.path.path.matrix) {
+              svgedit.path.recalcRotatedPath();
+            }
+            svgedit.path.path.init();
+            pathActions.toEditMode(svgedit.path.path.elem);
+            svgedit.path.path.selectPt();
+            return false;
+          }
+        // else, create a new point, update path element
+        } else {
+          // Checks if current target or parents are #svgcontent
+          if (!$.contains(container, getMouseTarget(evt))) {
+            // Clicked outside canvas, so don't make point
+            console.log('Clicked outside canvas');
+            return false;
+          }
+
+          var num = drawnPath.pathSegList.numberOfItems;
+          var last = drawnPath.pathSegList.getItem(num - 1);
+          var lastx = last.x, lasty = last.y;
+
+          if (evt.shiftKey) {
+            var xya = svgedit.math.snapToAngle(lastx, lasty, x, y);
+            x = xya.x;
+            y = xya.y;
+          }
+
+          // Use the segment defined by stretchy
+          sSeg = stretchy.pathSegList.getItem(1);
+          if (sSeg.pathSegType === 4) {
+            newseg = drawnPath.createSVGPathSegLinetoAbs(round(x), round(y));
+          } else {
+            newseg = drawnPath.createSVGPathSegCurvetoCubicAbs(
+              round(x),
+              round(y),
+              sSeg.x1 / currentZoom,
+              sSeg.y1 / currentZoom,
+              sSeg.x2 / currentZoom,
+              sSeg.y2 / currentZoom
+            );
+          }
+
+          drawnPath.pathSegList.appendItem(newseg);
+
+          x *= currentZoom;
+          y *= currentZoom;
+
+          // set stretchy line to latest point
+          stretchy.setAttribute('d', ['M', x, y, x, y].join(' '));
+          index = num;
+          if (subpath) { index += svgedit.path.path.segs.length; }
+          svgedit.path.addPointGrip(index, x, y);
+        }
+        // keep = true;
+      }
+
+      return;
+    }
+
+    // TODO: Make sure currentPath isn't null at this point
+    if (!svgedit.path.path) { return; }
+
+    svgedit.path.path.storeD();
+
+    id = evt.target.id;
+    var curPt;
+    if (id.substr(0, 14) === 'pathpointgrip_') {
+      // Select this point
+      curPt = svgedit.path.path.cur_pt = parseInt(id.substr(14), 10);
+      svgedit.path.path.dragging = [startX, startY];
+      var seg = svgedit.path.path.segs[curPt];
+
+      // only clear selection if shift is not pressed (otherwise, add
+      // node to selection)
+      if (!evt.shiftKey) {
+        if (svgedit.path.path.selected_pts.length <= 1 || !seg.selected) {
+          svgedit.path.path.clearSelection();
+        }
+        svgedit.path.path.addPtsToSelection(curPt);
+      } else if (seg.selected) {
+        svgedit.path.path.removePtFromSelection(curPt);
+      } else {
+        svgedit.path.path.addPtsToSelection(curPt);
+      }
+    } else if (id.indexOf('ctrlpointgrip_') === 0) {
+      svgedit.path.path.dragging = [startX, startY];
+
+      var parts = id.split('_')[1].split('c');
+      curPt = Number(parts[0]);
+      var ctrlNum = Number(parts[1]);
+      svgedit.path.path.selectPt(curPt, ctrlNum);
+    }
+
+    // Start selection box
+    if (!svgedit.path.path.dragging) {
+      if (rubberBox == null) {
+        rubberBox = selectorManager.getRubberBandBox();
+      }
+      svgedit.utilities.assignAttributes(rubberBox, {
+        'x': startX * currentZoom,
+        'y': startY * currentZoom,
+        'width': 0,
+        'height': 0,
+        'display': 'inline'
+      }, 100);
+    }
+  },
+  mouseMove: function (mouseX, mouseY) {
+    hasMoved = true;
+    if (currentMode === 'path') {
+      if (!drawnPath) { return; }
+      var seglist = drawnPath.pathSegList;
+      var index = seglist.numberOfItems - 1;
+
+      if (newPoint) {
+        // First point
+        // if (!index) { return; }
+
+        // Set control points
+        var pointGrip1 = svgedit.path.addCtrlGrip('1c1');
+        var pointGrip2 = svgedit.path.addCtrlGrip('0c2');
+
+        // dragging pointGrip1
+        pointGrip1.setAttribute('cx', mouseX);
+        pointGrip1.setAttribute('cy', mouseY);
+        pointGrip1.setAttribute('display', 'inline');
+
+        var ptX = newPoint[0];
+        var ptY = newPoint[1];
+
+        // set curve
+        // var seg = seglist.getItem(index);
+        var curX = mouseX / currentZoom;
+        var curY = mouseY / currentZoom;
+        var altX = (ptX + (ptX - curX));
+        var altY = (ptY + (ptY - curY));
+
+        pointGrip2.setAttribute('cx', altX * currentZoom);
+        pointGrip2.setAttribute('cy', altY * currentZoom);
+        pointGrip2.setAttribute('display', 'inline');
+
+        var ctrlLine = svgedit.path.getCtrlLine(1);
+        svgedit.utilities.assignAttributes(ctrlLine, {
+          x1: mouseX,
+          y1: mouseY,
+          x2: altX * currentZoom,
+          y2: altY * currentZoom,
+          display: 'inline'
+        });
+
+        if (index === 0) {
+          firstCtrl = [mouseX, mouseY];
+        } else {
+          var last = seglist.getItem(index - 1);
+          var lastX = last.x;
+          var lastY = last.y;
+
+          if (last.pathSegType === 6) {
+            lastX += (lastX - last.x2);
+            lastY += (lastY - last.y2);
+          } else if (firstCtrl) {
+            lastX = firstCtrl[0] / currentZoom;
+            lastY = firstCtrl[1] / currentZoom;
+          }
+          svgedit.path.replacePathSeg(6, index, [ptX, ptY, lastX, lastY, altX, altY], drawnPath);
+        }
+      } else {
+        var stretchy = svgedit.utilities.getElem('path_stretch_line');
+        if (stretchy) {
+          var prev = seglist.getItem(index);
+          if (prev.pathSegType === 6) {
+            var prevX = prev.x + (prev.x - prev.x2);
+            var prevY = prev.y + (prev.y - prev.y2);
+            svgedit.path.replacePathSeg(6, 1, [mouseX, mouseY, prevX * currentZoom, prevY * currentZoom, mouseX, mouseY], stretchy);
+          } else if (firstCtrl) {
+            svgedit.path.replacePathSeg(6, 1, [mouseX, mouseY, firstCtrl[0], firstCtrl[1], mouseX, mouseY], stretchy);
+          } else {
+            svgedit.path.replacePathSeg(4, 1, [mouseX, mouseY], stretchy);
+          }
+        }
+      }
+      return;
+    }
+    // if we are dragging a point, let's move it
+    if (svgedit.path.path.dragging) {
+      var pt = svgedit.path.getPointFromGrip({
+        x: svgedit.path.path.dragging[0],
+        y: svgedit.path.path.dragging[1]
+      }, svgedit.path.path);
+      var mpt = svgedit.path.getPointFromGrip({
+        x: mouseX,
+        y: mouseY
+      }, svgedit.path.path);
+      var diffX = mpt.x - pt.x;
+      var diffY = mpt.y - pt.y;
+      svgedit.path.path.dragging = [mouseX, mouseY];
+
+      if (svgedit.path.path.dragctrl) {
+        svgedit.path.path.moveCtrl(diffX, diffY);
+      } else {
+        svgedit.path.path.movePts(diffX, diffY);
+      }
+    } else {
+      svgedit.path.path.selected_pts = [];
+      svgedit.path.path.eachSeg(function (i) {
+        var seg = this;
+        if (!seg.next && !seg.prev) { return; }
+
+        // var item = seg.item;
+        var rbb = rubberBox.getBBox();
+
+        var pt = svgedit.path.getGripPt(seg);
+        var ptBb = {
+          x: pt.x,
+          y: pt.y,
+          width: 0,
+          height: 0
+        };
+
+        var sel = svgedit.math.rectsIntersect(rbb, ptBb);
+
+        this.select(sel);
+        // Note that addPtsToSelection is not being run
+        if (sel) { svgedit.path.path.selected_pts.push(seg.index); }
+      });
+    }
+  },
+  mouseUp: function (evt, element, mouseX, mouseY) {
+    // Create mode
+    if (currentMode === 'path') {
+      newPoint = null;
+      if (!drawnPath) {
+        element = svgedit.utilities.getElem(getId());
+        started = false;
+        firstCtrl = null;
+      }
+
+      return {
+        keep: true,
+        element: element
+      };
+    }
+
+    // Edit mode
+
+    if (svgedit.path.path.dragging) {
+      var lastPt = svgedit.path.path.cur_pt;
+
+      svgedit.path.path.dragging = false;
+      svgedit.path.path.dragctrl = false;
+      svgedit.path.path.update();
+
+      if (hasMoved) {
+        svgedit.path.path.endChanges('Move path point(s)');
+      }
+
+      if (!evt.shiftKey && !hasMoved) {
+        svgedit.path.path.selectPt(lastPt);
+      }
+    } else if (rubberBox && rubberBox.getAttribute('display') !== 'none') {
+      // Done with multi-node-select
+      rubberBox.setAttribute('display', 'none');
+
+      if (rubberBox.getAttribute('width') <= 2 && rubberBox.getAttribute('height') <= 2) {
+        pathActions.toSelectMode(evt.target);
+      }
+
+    // else, move back to select mode
+    } else {
+      pathActions.toSelectMode(evt.target);
+    }
+    hasMoved = false;
+  },
+  toEditMode: function (element) {
+    svgedit.path.path = svgedit.path.getPath_(element);
+    currentMode = 'pathedit';
+    clearSelection();
+    svgedit.path.path.show(true).update();
+    svgedit.path.path.oldbbox = svgedit.utilities.getBBox(svgedit.path.path.elem);
+    subpath = false;
+  },
+  toSelectMode: function (elem) {
+    var selPath = (elem === svgedit.path.path.elem);
+    currentMode = 'select';
+    svgedit.path.path.show(false);
+    currentPath = false;
+    clearSelection();
+
+    if (svgedit.path.path.matrix) {
+      // Rotated, so may need to re-calculate the center
+      svgedit.path.recalcRotatedPath();
+    }
+
+    if (selPath) {
+      call('selected', [elem]);
+      addToSelection([elem], true);
+    }
+  },
+  addSubPath: function (on) {
+    if (on) {
+      // Internally we go into "path" mode, but in the UI it will
+      // still appear as if in "pathedit" mode.
+      currentMode = 'path';
+      subpath = true;
+    } else {
+      pathActions.clear(true);
+      pathActions.toEditMode(svgedit.path.path.elem);
+    }
+  },
+  select: function (target) {
+    if (currentPath === target) {
+      pathActions.toEditMode(target);
+      currentMode = 'pathedit';
+    // going into pathedit mode
+    } else {
+      currentPath = target;
+    }
+  },
+  reorient: function () {
+    var elem = selectedElements[0];
+    if (!elem) { return; }
+    var angle = svgedit.utilities.getRotationAngle(elem);
+    if (angle === 0) { return; }
+
+    var batchCmd = new svgedit.history.BatchCommand('Reorient path');
+    var changes = {
+      d: elem.getAttribute('d'),
+      transform: elem.getAttribute('transform')
+    };
+    batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
+    clearSelection();
+    this.resetOrientation(elem);
+
+    addCommandToHistory(batchCmd);
+
+    // Set matrix to null
+    svgedit.path.getPath_(elem).show(false).matrix = null;
+
+    this.clear();
+
+    addToSelection([elem], true);
+    call('changed', selectedElements);
+  },
+
+  clear: function (remove) {
+    currentPath = null;
+    if (drawnPath) {
+      var elem = svgedit.utilities.getElem(getId());
+      $(svgedit.utilities.getElem('path_stretch_line')).remove();
+      $(elem).remove();
+      $(svgedit.utilities.getElem('pathpointgrip_container')).find('*').attr('display', 'none');
+      drawnPath = firstCtrl = null;
+      started = false;
+    } else if (currentMode === 'pathedit') {
+      this.toSelectMode();
+    }
+    if (svgedit.path.path) { svgedit.path.path.init().show(false); }
+  },
+  resetOrientation: function (path) {
+    if (path == null || path.nodeName !== 'path') { return false; }
+    var tlist = svgedit.transformlist.getTransformList(path);
+    var m = svgedit.math.transformListToTransform(tlist).matrix;
+    tlist.clear();
+    path.removeAttribute('transform');
+    var segList = path.pathSegList;
+
+    // Opera/win/non-EN throws an error here.
+    // TODO: Find out why!
+    // Presumed fixed in Opera 10.5, so commented out for now
+
+    // try {
+    var len = segList.numberOfItems;
+    // } catch(err) {
+    // 	var fixed_d = pathActions.convertPath(path);
+    // 	path.setAttribute('d', fixed_d);
+    // 	segList = path.pathSegList;
+    // 	var len = segList.numberOfItems;
+    // }
+    var i; // , lastX, lastY;
+    for (i = 0; i < len; ++i) {
+      var seg = segList.getItem(i);
+      var type = seg.pathSegType;
+      if (type === 1) { continue; }
+      var pts = [];
+      $.each(['', 1, 2], function (j, n) {
+        var x = seg['x' + n], y = seg['y' + n];
+        if (x !== undefined && y !== undefined) {
+          var pt = svgedit.math.transformPoint(x, y, m);
+          pts.splice(pts.length, 0, pt.x, pt.y);
+        }
+      });
+      svgedit.path.replacePathSeg(type, i, pts, path);
+    }
+
+    reorientGrads(path, m);
+  },
+  zoomChange: function () {
+    if (currentMode === 'pathedit') {
+      svgedit.path.path.update();
+    }
+  },
+  getNodePoint: function () {
+    var selPt = svgedit.path.path.selected_pts.length ? svgedit.path.path.selected_pts[0] : 1;
+
+    var seg = svgedit.path.path.segs[selPt];
+    return {
+      x: seg.item.x,
+      y: seg.item.y,
+      type: seg.type
+    };
+  },
+  linkControlPoints: function (linkPoints) {
+    svgedit.path.setLinkControlPoints(linkPoints);
+  },
+  clonePathNode: function () {
+    svgedit.path.path.storeD();
+
+    var selPts = svgedit.path.path.selected_pts;
+    // var segs = svgedit.path.path.segs;
+
+    var i = selPts.length;
+    var nums = [];
+
+    while (i--) {
+      var pt = selPts[i];
+      svgedit.path.path.addSeg(pt);
+
+      nums.push(pt + i);
+      nums.push(pt + i + 1);
+    }
+    svgedit.path.path.init().addPtsToSelection(nums);
+
+    svgedit.path.path.endChanges('Clone path node(s)');
+  },
+  opencloseSubPath: function () {
+    var selPts = svgedit.path.path.selected_pts;
+    // Only allow one selected node for now
+    if (selPts.length !== 1) { return; }
+
+    var elem = svgedit.path.path.elem;
+    var list = elem.pathSegList;
+
+    // var len = list.numberOfItems;
+
+    var index = selPts[0];
+
+    var openPt = null;
+    var startItem = null;
+
+    // Check if subpath is already open
+    svgedit.path.path.eachSeg(function (i) {
+      if (this.type === 2 && i <= index) {
+        startItem = this.item;
+      }
+      if (i <= index) { return true; }
+      if (this.type === 2) {
+        // Found M first, so open
+        openPt = i;
+        return false;
+      }
+      if (this.type === 1) {
+        // Found Z first, so closed
+        openPt = false;
+        return false;
+      }
+    });
+
+    if (openPt == null) {
+      // Single path, so close last seg
+      openPt = svgedit.path.path.segs.length - 1;
+    }
+
+    if (openPt !== false) {
+      // Close this path
+
+      // Create a line going to the previous "M"
+      var newseg = elem.createSVGPathSegLinetoAbs(startItem.x, startItem.y);
+
+      var closer = elem.createSVGPathSegClosePath();
+      if (openPt === svgedit.path.path.segs.length - 1) {
+        list.appendItem(newseg);
+        list.appendItem(closer);
+      } else {
+        svgedit.path.insertItemBefore(elem, closer, openPt);
+        svgedit.path.insertItemBefore(elem, newseg, openPt);
+      }
+
+      svgedit.path.path.init().selectPt(openPt + 1);
+      return;
+    }
+
+    // M 1,1 L 2,2 L 3,3 L 1,1 z // open at 2,2
+    // M 2,2 L 3,3 L 1,1
+
+    // M 1,1 L 2,2 L 1,1 z M 4,4 L 5,5 L6,6 L 5,5 z
+    // M 1,1 L 2,2 L 1,1 z [M 4,4] L 5,5 L(M)6,6 L 5,5 z
+
+    var seg = svgedit.path.path.segs[index];
+
+    if (seg.mate) {
+      list.removeItem(index); // Removes last "L"
+      list.removeItem(index); // Removes the "Z"
+      svgedit.path.path.init().selectPt(index - 1);
+      return;
+    }
+
+    var i, lastM, zSeg;
+
+    // Find this sub-path's closing point and remove
+    for (i = 0; i < list.numberOfItems; i++) {
+      var item = list.getItem(i);
+
+      if (item.pathSegType === 2) {
+        // Find the preceding M
+        lastM = i;
+      } else if (i === index) {
+        // Remove it
+        list.removeItem(lastM);
+        // index--;
+      } else if (item.pathSegType === 1 && index < i) {
+        // Remove the closing seg of this subpath
+        zSeg = i - 1;
+        list.removeItem(i);
+        break;
+      }
+    }
+
+    var num = (index - lastM) - 1;
+
+    while (num--) {
+      svgedit.path.insertItemBefore(elem, list.getItem(lastM), zSeg);
+    }
+
+    var pt = list.getItem(lastM);
+
+    // Make this point the new "M"
+    svgedit.path.replacePathSeg(2, lastM, [pt.x, pt.y]);
+
+    i = index; // i is local here, so has no effect; what is the reason for this?
+
+    svgedit.path.path.init().selectPt(0);
+  },
+  deletePathNode: function () {
+    if (!pathActions.canDeleteNodes) { return; }
+    svgedit.path.path.storeD();
+
+    var selPts = svgedit.path.path.selected_pts;
+    var i = selPts.length;
+
+    while (i--) {
+      var pt = selPts[i];
+      svgedit.path.path.deleteSeg(pt);
+    }
+
+    // Cleanup
+    var cleanup = function () {
+      var segList = svgedit.path.path.elem.pathSegList;
+      var len = segList.numberOfItems;
+
+      var remItems = function (pos, count) {
+        while (count--) {
+          segList.removeItem(pos);
+        }
+      };
+
+      if (len <= 1) { return true; }
+
+      while (len--) {
+        var item = segList.getItem(len);
+        if (item.pathSegType === 1) {
+          var prev = segList.getItem(len - 1);
+          var nprev = segList.getItem(len - 2);
+          if (prev.pathSegType === 2) {
+            remItems(len - 1, 2);
+            cleanup();
+            break;
+          } else if (nprev.pathSegType === 2) {
+            remItems(len - 2, 3);
+            cleanup();
+            break;
+          }
+        } else if (item.pathSegType === 2) {
+          if (len > 0) {
+            var prevType = segList.getItem(len - 1).pathSegType;
+            // Path has M M
+            if (prevType === 2) {
+              remItems(len - 1, 1);
+              cleanup();
+              break;
+            // Entire path ends with Z M
+            } else if (prevType === 1 && segList.numberOfItems - 1 === len) {
+              remItems(len, 1);
+              cleanup();
+              break;
+            }
+          }
+        }
+      }
+      return false;
+    };
+
+    cleanup();
+
+    // Completely delete a path with 1 or 0 segments
+    if (svgedit.path.path.elem.pathSegList.numberOfItems <= 1) {
+      pathActions.toSelectMode(svgedit.path.path.elem);
+      canvas.deleteSelectedElements();
+      return;
+    }
+
+    svgedit.path.path.init();
+    svgedit.path.path.clearSelection();
+
+    // TODO: Find right way to select point now
+    // path.selectPt(selPt);
+    if (window.opera) { // Opera repaints incorrectly
+      var cp = $(svgedit.path.path.elem);
+      cp.attr('d', cp.attr('d'));
+    }
+    svgedit.path.path.endChanges('Delete path node(s)');
+  },
+  smoothPolylineIntoPath: smoothPolylineIntoPath,
+  setSegType: function (v) {
+    svgedit.path.path.setSegType(v);
+  },
+  moveNode: function (attr, newValue) {
+    var selPts = svgedit.path.path.selected_pts;
+    if (!selPts.length) { return; }
+
+    svgedit.path.path.storeD();
+
+    // Get first selected point
+    var seg = svgedit.path.path.segs[selPts[0]];
+    var diff = {x: 0, y: 0};
+    diff[attr] = newValue - seg.item[attr];
+
+    seg.move(diff.x, diff.y);
+    svgedit.path.path.endChanges('Move path point');
+  },
+  fixEnd: function (elem) {
+    // Adds an extra segment if the last seg before a Z doesn't end
+    // at its M point
+    // M0,0 L0,100 L100,100 z
+    var segList = elem.pathSegList;
+    var len = segList.numberOfItems;
+    var i, lastM;
+    for (i = 0; i < len; ++i) {
+      var item = segList.getItem(i);
+      if (item.pathSegType === 2) {
+        lastM = item;
+      }
+
+      if (item.pathSegType === 1) {
+        var prev = segList.getItem(i - 1);
+        if (prev.x !== lastM.x || prev.y !== lastM.y) {
+          // Add an L segment here
+          var newseg = elem.createSVGPathSegLinetoAbs(lastM.x, lastM.y);
+          svgedit.path.insertItemBefore(elem, newseg, i);
+          // Can this be done better?
+          pathActions.fixEnd(elem);
+          break;
+        }
+      }
+    }
+    if (svgedit.browser.isWebkit()) { resetD(elem); }
+  },
+  // Convert a path to one with only absolute or relative values
+  convertPath: svgedit.utilities.convertPath
 };
 })();
 // end pathActions
@@ -3670,50 +3670,50 @@ return {
 // Returns:
 // The amount of elements that were removed
 var removeUnusedDefElems = this.removeUnusedDefElems = function () {
-	var defs = svgcontent.getElementsByTagNameNS(NS.SVG, 'defs');
-	if (!defs || !defs.length) { return 0; }
+  var defs = svgcontent.getElementsByTagNameNS(NS.SVG, 'defs');
+  if (!defs || !defs.length) { return 0; }
 
-	// if (!defs.firstChild) { return; }
+  // if (!defs.firstChild) { return; }
 
-	var defelemUses = [],
-		numRemoved = 0;
-	var attrs = ['fill', 'stroke', 'filter', 'marker-start', 'marker-mid', 'marker-end'];
-	var alen = attrs.length;
+  var defelemUses = [],
+    numRemoved = 0;
+  var attrs = ['fill', 'stroke', 'filter', 'marker-start', 'marker-mid', 'marker-end'];
+  var alen = attrs.length;
 
-	var allEls = svgcontent.getElementsByTagNameNS(NS.SVG, '*');
-	var allLen = allEls.length;
+  var allEls = svgcontent.getElementsByTagNameNS(NS.SVG, '*');
+  var allLen = allEls.length;
 
-	var i, j;
-	for (i = 0; i < allLen; i++) {
-		var el = allEls[i];
-		for (j = 0; j < alen; j++) {
-			var ref = svgedit.utilities.getUrlFromAttr(el.getAttribute(attrs[j]));
-			if (ref) {
-				defelemUses.push(ref.substr(1));
-			}
-		}
+  var i, j;
+  for (i = 0; i < allLen; i++) {
+    var el = allEls[i];
+    for (j = 0; j < alen; j++) {
+      var ref = svgedit.utilities.getUrlFromAttr(el.getAttribute(attrs[j]));
+      if (ref) {
+        defelemUses.push(ref.substr(1));
+      }
+    }
 
-		// gradients can refer to other gradients
-		var href = getHref(el);
-		if (href && href.indexOf('#') === 0) {
-			defelemUses.push(href.substr(1));
-		}
-	}
+    // gradients can refer to other gradients
+    var href = getHref(el);
+    if (href && href.indexOf('#') === 0) {
+      defelemUses.push(href.substr(1));
+    }
+  }
 
-	var defelems = $(defs).find('linearGradient, radialGradient, filter, marker, svg, symbol');
-	i = defelems.length;
-	while (i--) {
-		var defelem = defelems[i];
-		var id = defelem.id;
-		if (defelemUses.indexOf(id) < 0) {
-			// Not found, so remove (but remember)
-			removedElements[id] = defelem;
-			defelem.parentNode.removeChild(defelem);
-			numRemoved++;
-		}
-	}
+  var defelems = $(defs).find('linearGradient, radialGradient, filter, marker, svg, symbol');
+  i = defelems.length;
+  while (i--) {
+    var defelem = defelems[i];
+    var id = defelem.id;
+    if (defelemUses.indexOf(id) < 0) {
+      // Not found, so remove (but remember)
+      removedElements[id] = defelem;
+      defelem.parentNode.removeChild(defelem);
+      numRemoved++;
+    }
+  }
 
-	return numRemoved;
+  return numRemoved;
 };
 
 // Function: svgCanvasToString
@@ -3722,53 +3722,53 @@ var removeUnusedDefElems = this.removeUnusedDefElems = function () {
 // Returns:
 // String containing the SVG image for output
 this.svgCanvasToString = function () {
-	// keep calling it until there are none to remove
-	while (removeUnusedDefElems() > 0) {}
+  // keep calling it until there are none to remove
+  while (removeUnusedDefElems() > 0) {}
 
-	pathActions.clear(true);
+  pathActions.clear(true);
 
-	// Keep SVG-Edit comment on top
-	$.each(svgcontent.childNodes, function (i, node) {
-		if (i && node.nodeType === 8 && node.data.indexOf('Created with') >= 0) {
-			svgcontent.insertBefore(node, svgcontent.firstChild);
-		}
-	});
+  // Keep SVG-Edit comment on top
+  $.each(svgcontent.childNodes, function (i, node) {
+    if (i && node.nodeType === 8 && node.data.indexOf('Created with') >= 0) {
+      svgcontent.insertBefore(node, svgcontent.firstChild);
+    }
+  });
 
-	// Move out of in-group editing mode
-	if (currentGroup) {
-		leaveContext();
-		selectOnly([currentGroup]);
-	}
+  // Move out of in-group editing mode
+  if (currentGroup) {
+    leaveContext();
+    selectOnly([currentGroup]);
+  }
 
-	var nakedSvgs = [];
+  var nakedSvgs = [];
 
-	// Unwrap gsvg if it has no special attributes (only id and style)
-	$(svgcontent).find('g:data(gsvg)').each(function () {
-		var attrs = this.attributes;
-		var len = attrs.length;
-		var i;
-		for (i = 0; i < len; i++) {
-			if (attrs[i].nodeName === 'id' || attrs[i].nodeName === 'style') {
-				len--;
-			}
-		}
-		// No significant attributes, so ungroup
-		if (len <= 0) {
-			var svg = this.firstChild;
-			nakedSvgs.push(svg);
-			$(this).replaceWith(svg);
-		}
-	});
-	var output = this.svgToString(svgcontent, 0);
+  // Unwrap gsvg if it has no special attributes (only id and style)
+  $(svgcontent).find('g:data(gsvg)').each(function () {
+    var attrs = this.attributes;
+    var len = attrs.length;
+    var i;
+    for (i = 0; i < len; i++) {
+      if (attrs[i].nodeName === 'id' || attrs[i].nodeName === 'style') {
+        len--;
+      }
+    }
+    // No significant attributes, so ungroup
+    if (len <= 0) {
+      var svg = this.firstChild;
+      nakedSvgs.push(svg);
+      $(this).replaceWith(svg);
+    }
+  });
+  var output = this.svgToString(svgcontent, 0);
 
-	// Rewrap gsvg
-	if (nakedSvgs.length) {
-		$(nakedSvgs).each(function () {
-			groupSvgElem(this);
-		});
-	}
+  // Rewrap gsvg
+  if (nakedSvgs.length) {
+    $(nakedSvgs).each(function () {
+      groupSvgElem(this);
+    });
+  }
 
-	return output;
+  return output;
 };
 
 // Function: svgToString
@@ -3781,171 +3781,171 @@ this.svgCanvasToString = function () {
 // Returns:
 // String with the given element as an SVG tag
 this.svgToString = function (elem, indent) {
-	var out = [],
-		toXml = svgedit.utilities.toXml;
-	var unit = curConfig.baseUnit;
-	var unitRe = new RegExp('^-?[\\d\\.]+' + unit + '$');
+  var out = [],
+    toXml = svgedit.utilities.toXml;
+  var unit = curConfig.baseUnit;
+  var unitRe = new RegExp('^-?[\\d\\.]+' + unit + '$');
 
-	if (elem) {
-		cleanupElement(elem);
-		var attrs = elem.attributes,
-			attr,
-			i,
-			childs = elem.childNodes;
+  if (elem) {
+    cleanupElement(elem);
+    var attrs = elem.attributes,
+      attr,
+      i,
+      childs = elem.childNodes;
 
-		for (i = 0; i < indent; i++) { out.push(' '); }
-		out.push('<'); out.push(elem.nodeName);
-		if (elem.id === 'svgcontent') {
-			// Process root element separately
-			var res = getResolution();
+    for (i = 0; i < indent; i++) { out.push(' '); }
+    out.push('<'); out.push(elem.nodeName);
+    if (elem.id === 'svgcontent') {
+      // Process root element separately
+      var res = getResolution();
 
-			var vb = '';
-			// TODO: Allow this by dividing all values by current baseVal
-			// Note that this also means we should properly deal with this on import
-			// if (curConfig.baseUnit !== 'px') {
-			// 	var unit = curConfig.baseUnit;
-			// 	var unitM = svgedit.units.getTypeMap()[unit];
-			// 	res.w = svgedit.units.shortFloat(res.w / unitM);
-			// 	res.h = svgedit.units.shortFloat(res.h / unitM);
-			// 	vb = ' viewBox="' + [0, 0, res.w, res.h].join(' ') + '"';
-			// 	res.w += unit;
-			// 	res.h += unit;
-			// }
+      var vb = '';
+      // TODO: Allow this by dividing all values by current baseVal
+      // Note that this also means we should properly deal with this on import
+      // if (curConfig.baseUnit !== 'px') {
+      // 	var unit = curConfig.baseUnit;
+      // 	var unitM = svgedit.units.getTypeMap()[unit];
+      // 	res.w = svgedit.units.shortFloat(res.w / unitM);
+      // 	res.h = svgedit.units.shortFloat(res.h / unitM);
+      // 	vb = ' viewBox="' + [0, 0, res.w, res.h].join(' ') + '"';
+      // 	res.w += unit;
+      // 	res.h += unit;
+      // }
 
-			if (unit !== 'px') {
-				res.w = svgedit.units.convertUnit(res.w, unit) + unit;
-				res.h = svgedit.units.convertUnit(res.h, unit) + unit;
-			}
+      if (unit !== 'px') {
+        res.w = svgedit.units.convertUnit(res.w, unit) + unit;
+        res.h = svgedit.units.convertUnit(res.h, unit) + unit;
+      }
 
-			out.push(' width="' + res.w + '" height="' + res.h + '"' + vb + ' xmlns="' + NS.SVG + '"');
+      out.push(' width="' + res.w + '" height="' + res.h + '"' + vb + ' xmlns="' + NS.SVG + '"');
 
-			var nsuris = {};
+      var nsuris = {};
 
-			// Check elements for namespaces, add if found
-			$(elem).find('*').andSelf().each(function () {
-				// var el = this;
-				// for some elements have no attribute
-				var uri = this.namespaceURI;
-				if (uri && !nsuris[uri] && nsMap[uri] && nsMap[uri] !== 'xmlns' && nsMap[uri] !== 'xml') {
-					nsuris[uri] = true;
-					out.push(' xmlns:' + nsMap[uri] + '="' + uri + '"');
-				}
+      // Check elements for namespaces, add if found
+      $(elem).find('*').andSelf().each(function () {
+        // var el = this;
+        // for some elements have no attribute
+        var uri = this.namespaceURI;
+        if (uri && !nsuris[uri] && nsMap[uri] && nsMap[uri] !== 'xmlns' && nsMap[uri] !== 'xml') {
+          nsuris[uri] = true;
+          out.push(' xmlns:' + nsMap[uri] + '="' + uri + '"');
+        }
 
-				$.each(this.attributes, function (i, attr) {
-					var uri = attr.namespaceURI;
-					if (uri && !nsuris[uri] && nsMap[uri] !== 'xmlns' && nsMap[uri] !== 'xml') {
-						nsuris[uri] = true;
-						out.push(' xmlns:' + nsMap[uri] + '="' + uri + '"');
-					}
-				});
-			});
+        $.each(this.attributes, function (i, attr) {
+          var uri = attr.namespaceURI;
+          if (uri && !nsuris[uri] && nsMap[uri] !== 'xmlns' && nsMap[uri] !== 'xml') {
+            nsuris[uri] = true;
+            out.push(' xmlns:' + nsMap[uri] + '="' + uri + '"');
+          }
+        });
+      });
 
-			i = attrs.length;
-			var attrNames = ['width', 'height', 'xmlns', 'x', 'y', 'viewBox', 'id', 'overflow'];
-			while (i--) {
-				attr = attrs.item(i);
-				var attrVal = toXml(attr.value);
+      i = attrs.length;
+      var attrNames = ['width', 'height', 'xmlns', 'x', 'y', 'viewBox', 'id', 'overflow'];
+      while (i--) {
+        attr = attrs.item(i);
+        var attrVal = toXml(attr.value);
 
-				// Namespaces have already been dealt with, so skip
-				if (attr.nodeName.indexOf('xmlns:') === 0) { continue; }
+        // Namespaces have already been dealt with, so skip
+        if (attr.nodeName.indexOf('xmlns:') === 0) { continue; }
 
-				// only serialize attributes we don't use internally
-				if (attrVal !== '' && attrNames.indexOf(attr.localName) === -1) {
-					if (!attr.namespaceURI || nsMap[attr.namespaceURI]) {
-						out.push(' ');
-						out.push(attr.nodeName); out.push('="');
-						out.push(attrVal); out.push('"');
-					}
-				}
-			}
-		} else {
-			// Skip empty defs
-			if (elem.nodeName === 'defs' && !elem.firstChild) { return; }
+        // only serialize attributes we don't use internally
+        if (attrVal !== '' && attrNames.indexOf(attr.localName) === -1) {
+          if (!attr.namespaceURI || nsMap[attr.namespaceURI]) {
+            out.push(' ');
+            out.push(attr.nodeName); out.push('="');
+            out.push(attrVal); out.push('"');
+          }
+        }
+      }
+    } else {
+      // Skip empty defs
+      if (elem.nodeName === 'defs' && !elem.firstChild) { return; }
 
-			var mozAttrs = ['-moz-math-font-style', '_moz-math-font-style'];
-			for (i = attrs.length - 1; i >= 0; i--) {
-				attr = attrs.item(i);
-				var attrVal = toXml(attr.value);
-				// remove bogus attributes added by Gecko
-				if (mozAttrs.indexOf(attr.localName) >= 0) { continue; }
-				if (attrVal !== '') {
-					if (attrVal.indexOf('pointer-events') === 0) { continue; }
-					if (attr.localName === 'class' && attrVal.indexOf('se_') === 0) { continue; }
-					out.push(' ');
-					if (attr.localName === 'd') { attrVal = pathActions.convertPath(elem, true); }
-					if (!isNaN(attrVal)) {
-						attrVal = svgedit.units.shortFloat(attrVal);
-					} else if (unitRe.test(attrVal)) {
-						attrVal = svgedit.units.shortFloat(attrVal) + unit;
-					}
+      var mozAttrs = ['-moz-math-font-style', '_moz-math-font-style'];
+      for (i = attrs.length - 1; i >= 0; i--) {
+        attr = attrs.item(i);
+        var attrVal = toXml(attr.value);
+        // remove bogus attributes added by Gecko
+        if (mozAttrs.indexOf(attr.localName) >= 0) { continue; }
+        if (attrVal !== '') {
+          if (attrVal.indexOf('pointer-events') === 0) { continue; }
+          if (attr.localName === 'class' && attrVal.indexOf('se_') === 0) { continue; }
+          out.push(' ');
+          if (attr.localName === 'd') { attrVal = pathActions.convertPath(elem, true); }
+          if (!isNaN(attrVal)) {
+            attrVal = svgedit.units.shortFloat(attrVal);
+          } else if (unitRe.test(attrVal)) {
+            attrVal = svgedit.units.shortFloat(attrVal) + unit;
+          }
 
-					// Embed images when saving
-					if (saveOptions.apply &&
-						elem.nodeName === 'image' &&
-						attr.localName === 'href' &&
-						saveOptions.images &&
-						saveOptions.images === 'embed'
-					) {
-						var img = encodableImages[attrVal];
-						if (img) { attrVal = img; }
-					}
+          // Embed images when saving
+          if (saveOptions.apply &&
+            elem.nodeName === 'image' &&
+            attr.localName === 'href' &&
+            saveOptions.images &&
+            saveOptions.images === 'embed'
+          ) {
+            var img = encodableImages[attrVal];
+            if (img) { attrVal = img; }
+          }
 
-					// map various namespaces to our fixed namespace prefixes
-					// (the default xmlns attribute itself does not get a prefix)
-					if (!attr.namespaceURI || attr.namespaceURI === NS.SVG || nsMap[attr.namespaceURI]) {
-						out.push(attr.nodeName); out.push('="');
-						out.push(attrVal); out.push('"');
-					}
-				}
-			}
-		}
+          // map various namespaces to our fixed namespace prefixes
+          // (the default xmlns attribute itself does not get a prefix)
+          if (!attr.namespaceURI || attr.namespaceURI === NS.SVG || nsMap[attr.namespaceURI]) {
+            out.push(attr.nodeName); out.push('="');
+            out.push(attrVal); out.push('"');
+          }
+        }
+      }
+    }
 
-		if (elem.hasChildNodes()) {
-			out.push('>');
-			indent++;
-			var bOneLine = false;
+    if (elem.hasChildNodes()) {
+      out.push('>');
+      indent++;
+      var bOneLine = false;
 
-			for (i = 0; i < childs.length; i++) {
-				var child = childs.item(i);
-				switch (child.nodeType) {
-				case 1: // element node
-					out.push('\n');
-					out.push(this.svgToString(childs.item(i), indent));
-					break;
-				case 3: // text node
-					var str = child.nodeValue.replace(/^\s+|\s+$/g, '');
-					if (str !== '') {
-						bOneLine = true;
-						out.push(String(toXml(str)));
-					}
-					break;
-				case 4: // cdata node
-					out.push('\n');
-					out.push(new Array(indent + 1).join(' '));
-					out.push('<![CDATA[');
-					out.push(child.nodeValue);
-					out.push(']]>');
-					break;
-				case 8: // comment
-					out.push('\n');
-					out.push(new Array(indent + 1).join(' '));
-					out.push('<!--');
-					out.push(child.data);
-					out.push('-->');
-					break;
-				} // switch on node type
-			}
-			indent--;
-			if (!bOneLine) {
-				out.push('\n');
-				for (i = 0; i < indent; i++) { out.push(' '); }
-			}
-			out.push('</'); out.push(elem.nodeName); out.push('>');
-		} else {
-			out.push('/>');
-		}
-	}
-	return out.join('');
+      for (i = 0; i < childs.length; i++) {
+        var child = childs.item(i);
+        switch (child.nodeType) {
+        case 1: // element node
+          out.push('\n');
+          out.push(this.svgToString(childs.item(i), indent));
+          break;
+        case 3: // text node
+          var str = child.nodeValue.replace(/^\s+|\s+$/g, '');
+          if (str !== '') {
+            bOneLine = true;
+            out.push(String(toXml(str)));
+          }
+          break;
+        case 4: // cdata node
+          out.push('\n');
+          out.push(new Array(indent + 1).join(' '));
+          out.push('<![CDATA[');
+          out.push(child.nodeValue);
+          out.push(']]>');
+          break;
+        case 8: // comment
+          out.push('\n');
+          out.push(new Array(indent + 1).join(' '));
+          out.push('<!--');
+          out.push(child.data);
+          out.push('-->');
+          break;
+        } // switch on node type
+      }
+      indent--;
+      if (!bOneLine) {
+        out.push('\n');
+        for (i = 0; i < indent; i++) { out.push(' '); }
+      }
+      out.push('</'); out.push(elem.nodeName); out.push('>');
+    } else {
+      out.push('/>');
+    }
+  }
+  return out.join('');
 }; // end svgToString()
 
 // Function: embedImage
@@ -3956,35 +3956,35 @@ this.svgToString = function (elem, indent) {
 // callback - Optional function to run when image data is found, supplies the
 // result (data URL or false) as first parameter.
 this.embedImage = function (val, callback) {
-	// load in the image and once it's loaded, get the dimensions
-	$(new Image()).load(function () {
-		// create a canvas the same size as the raster image
-		var canvas = document.createElement('canvas');
-		canvas.width = this.width;
-		canvas.height = this.height;
-		// load the raster image into the canvas
-		canvas.getContext('2d').drawImage(this, 0, 0);
-		// retrieve the data: URL
-		try {
-			var urldata = ';svgedit_url=' + encodeURIComponent(val);
-			urldata = canvas.toDataURL().replace(';base64', urldata + ';base64');
-			encodableImages[val] = urldata;
-		} catch (e) {
-			encodableImages[val] = false;
-		}
-		lastGoodImgUrl = val;
-		if (callback) { callback(encodableImages[val]); }
-	}).attr('src', val);
+  // load in the image and once it's loaded, get the dimensions
+  $(new Image()).load(function () {
+    // create a canvas the same size as the raster image
+    var canvas = document.createElement('canvas');
+    canvas.width = this.width;
+    canvas.height = this.height;
+    // load the raster image into the canvas
+    canvas.getContext('2d').drawImage(this, 0, 0);
+    // retrieve the data: URL
+    try {
+      var urldata = ';svgedit_url=' + encodeURIComponent(val);
+      urldata = canvas.toDataURL().replace(';base64', urldata + ';base64');
+      encodableImages[val] = urldata;
+    } catch (e) {
+      encodableImages[val] = false;
+    }
+    lastGoodImgUrl = val;
+    if (callback) { callback(encodableImages[val]); }
+  }).attr('src', val);
 };
 
 // Function: setGoodImage
 // Sets a given URL to be a "last good image" URL
 this.setGoodImage = function (val) {
-	lastGoodImgUrl = val;
+  lastGoodImgUrl = val;
 };
 
 this.open = function () {
-	// Nothing by default, handled by optional widget/extension
+  // Nothing by default, handled by optional widget/extension
 };
 
 // Function: save
@@ -3995,111 +3995,111 @@ this.open = function () {
 // Returns:
 // Nothing
 this.save = function (opts) {
-	// remove the selected outline before serializing
-	clearSelection();
-	// Update save options if provided
-	if (opts) { $.extend(saveOptions, opts); }
-	saveOptions.apply = true;
+  // remove the selected outline before serializing
+  clearSelection();
+  // Update save options if provided
+  if (opts) { $.extend(saveOptions, opts); }
+  saveOptions.apply = true;
 
-	// no need for doctype, see http://jwatt.org/svg/authoring/#doctype-declaration
-	var str = this.svgCanvasToString();
-	call('saved', str);
+  // no need for doctype, see http://jwatt.org/svg/authoring/#doctype-declaration
+  var str = this.svgCanvasToString();
+  call('saved', str);
 };
 
 function getIssues () {
-	// remove the selected outline before serializing
-	clearSelection();
+  // remove the selected outline before serializing
+  clearSelection();
 
-	// Check for known CanVG issues
-	var issues = [];
+  // Check for known CanVG issues
+  var issues = [];
 
-	// Selector and notice
-	var issueList = {
-		'feGaussianBlur': uiStrings.exportNoBlur,
-		'foreignObject': uiStrings.exportNoforeignObject,
-		'[stroke-dasharray]': uiStrings.exportNoDashArray
-	};
-	var content = $(svgcontent);
+  // Selector and notice
+  var issueList = {
+    'feGaussianBlur': uiStrings.exportNoBlur,
+    'foreignObject': uiStrings.exportNoforeignObject,
+    '[stroke-dasharray]': uiStrings.exportNoDashArray
+  };
+  var content = $(svgcontent);
 
-	// Add font/text check if Canvas Text API is not implemented
-	if (!('font' in $('<canvas>')[0].getContext('2d'))) {
-		issueList.text = uiStrings.exportNoText;
-	}
+  // Add font/text check if Canvas Text API is not implemented
+  if (!('font' in $('<canvas>')[0].getContext('2d'))) {
+    issueList.text = uiStrings.exportNoText;
+  }
 
-	$.each(issueList, function (sel, descr) {
-		if (content.find(sel).length) {
-			issues.push(descr);
-		}
-	});
-	return issues;
+  $.each(issueList, function (sel, descr) {
+    if (content.find(sel).length) {
+      issues.push(descr);
+    }
+  });
+  return issues;
 }
 
 // Function: rasterExport
 // Generates a Data URL based on the current image, then calls "exported"
 // with an object including the string, image information, and any issues found
 this.rasterExport = function (imgType, quality, exportWindowName) {
-	var mimeType = 'image/' + imgType.toLowerCase();
-	var issues = getIssues();
-	var str = this.svgCanvasToString();
+  var mimeType = 'image/' + imgType.toLowerCase();
+  var issues = getIssues();
+  var str = this.svgCanvasToString();
 
-	svgedit.utilities.buildCanvgCallback(function () {
-		var type = imgType || 'PNG';
-		if (!$('#export_canvas').length) {
-			$('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
-		}
-		var c = $('#export_canvas')[0];
-		c.width = svgCanvas.contentW;
-		c.height = svgCanvas.contentH;
+  svgedit.utilities.buildCanvgCallback(function () {
+    var type = imgType || 'PNG';
+    if (!$('#export_canvas').length) {
+      $('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
+    }
+    var c = $('#export_canvas')[0];
+    c.width = svgCanvas.contentW;
+    c.height = svgCanvas.contentH;
 
-		canvg(c, str, {renderCallback: function () {
-			var dataURLType = (type === 'ICO' ? 'BMP' : type).toLowerCase();
-			var datauri = quality ? c.toDataURL('image/' + dataURLType, quality) : c.toDataURL('image/' + dataURLType);
-			if (c.toBlob) {
-				c.toBlob(function (blob) {
-					var bloburl = svgedit.utilities.createObjectURL(blob);
-					call('exported', {datauri: datauri, bloburl: bloburl, svg: str, issues: issues, type: imgType, mimeType: mimeType, quality: quality, exportWindowName: exportWindowName});
-				}, mimeType, quality);
-				return;
-			}
-			var bloburl = svgedit.utilities.dataURLToObjectURL(datauri);
-			call('exported', {datauri: datauri, bloburl: bloburl, svg: str, issues: issues, type: imgType, mimeType: mimeType, quality: quality, exportWindowName: exportWindowName});
-		}});
-	})();
+    canvg(c, str, {renderCallback: function () {
+      var dataURLType = (type === 'ICO' ? 'BMP' : type).toLowerCase();
+      var datauri = quality ? c.toDataURL('image/' + dataURLType, quality) : c.toDataURL('image/' + dataURLType);
+      if (c.toBlob) {
+        c.toBlob(function (blob) {
+          var bloburl = svgedit.utilities.createObjectURL(blob);
+          call('exported', {datauri: datauri, bloburl: bloburl, svg: str, issues: issues, type: imgType, mimeType: mimeType, quality: quality, exportWindowName: exportWindowName});
+        }, mimeType, quality);
+        return;
+      }
+      var bloburl = svgedit.utilities.dataURLToObjectURL(datauri);
+      call('exported', {datauri: datauri, bloburl: bloburl, svg: str, issues: issues, type: imgType, mimeType: mimeType, quality: quality, exportWindowName: exportWindowName});
+    }});
+  })();
 };
 
 this.exportPDF = function (exportWindowName, outputType) {
-	var that = this;
-	svgedit.utilities.buildJSPDFCallback(function () {
-		var res = getResolution();
-		var orientation = res.w > res.h ? 'landscape' : 'portrait';
-		var units = 'pt'; // curConfig.baseUnit; // We could use baseUnit, but that is presumably not intended for export purposes
-		var doc = jsPDF({
-			orientation: orientation,
-			unit: units,
-			format: [res.w, res.h]
-			// , compressPdf: true
-		}); // Todo: Give options to use predefined jsPDF formats like "a4", etc. from pull-down (with option to keep customizable)
-		var docTitle = getDocumentTitle();
-		doc.setProperties({
-			title: docTitle /* ,
-			subject: '',
-			author: '',
-			keywords: '',
-			creator: '' */
-		});
-		var issues = getIssues();
-		var str = that.svgCanvasToString();
-		doc.addSVG(str, 0, 0);
+  var that = this;
+  svgedit.utilities.buildJSPDFCallback(function () {
+    var res = getResolution();
+    var orientation = res.w > res.h ? 'landscape' : 'portrait';
+    var units = 'pt'; // curConfig.baseUnit; // We could use baseUnit, but that is presumably not intended for export purposes
+    var doc = jsPDF({
+      orientation: orientation,
+      unit: units,
+      format: [res.w, res.h]
+      // , compressPdf: true
+    }); // Todo: Give options to use predefined jsPDF formats like "a4", etc. from pull-down (with option to keep customizable)
+    var docTitle = getDocumentTitle();
+    doc.setProperties({
+      title: docTitle /* ,
+      subject: '',
+      author: '',
+      keywords: '',
+      creator: '' */
+    });
+    var issues = getIssues();
+    var str = that.svgCanvasToString();
+    doc.addSVG(str, 0, 0);
 
-		// doc.output('save'); // Works to open in a new
-		//  window; todo: configure this and other export
-		//  options to optionally work in this manner as
-		//  opposed to opening a new tab
-		var obj = {svg: str, issues: issues, exportWindowName: exportWindowName};
-		var method = outputType || 'dataurlstring';
-		obj[method] = doc.output(method);
-		call('exportedPDF', obj);
-	})();
+    // doc.output('save'); // Works to open in a new
+    //  window; todo: configure this and other export
+    //  options to optionally work in this manner as
+    //  opposed to opening a new tab
+    var obj = {svg: str, issues: issues, exportWindowName: exportWindowName};
+    var method = outputType || 'dataurlstring';
+    obj[method] = doc.output(method);
+    call('exportedPDF', obj);
+  })();
 };
 
 // Function: getSvgString
@@ -4108,8 +4108,8 @@ this.exportPDF = function (exportWindowName, outputType) {
 // Returns:
 // The current drawing as raw SVG XML text.
 this.getSvgString = function () {
-	saveOptions.apply = false;
-	return this.svgCanvasToString();
+  saveOptions.apply = false;
+  return this.svgCanvasToString();
 };
 
 // Function: randomizeIds
@@ -4124,11 +4124,11 @@ this.getSvgString = function () {
 // this BEFORE calling svgCanvas.setSvgString
 //
 this.randomizeIds = function (enableRandomization) {
-	if (arguments.length > 0 && enableRandomization === false) {
-		svgedit.draw.randomizeIds(false, getCurrentDrawing());
-	} else {
-		svgedit.draw.randomizeIds(true, getCurrentDrawing());
-	}
+  if (arguments.length > 0 && enableRandomization === false) {
+    svgedit.draw.randomizeIds(false, getCurrentDrawing());
+  } else {
+    svgedit.draw.randomizeIds(true, getCurrentDrawing());
+  }
 };
 
 // Function: uniquifyElems
@@ -4137,314 +4137,314 @@ this.randomizeIds = function (enableRandomization) {
 // Parameters:
 // g - The parent element of the tree to give unique IDs
 var uniquifyElems = this.uniquifyElems = function (g) {
-	var ids = {};
-	// TODO: Handle markers and connectors. These are not yet re-identified properly
-	// as their referring elements do not get remapped.
-	//
-	// <marker id='se_marker_end_svg_7'/>
-	// <polyline id='svg_7' se:connector='svg_1 svg_6' marker-end='url(#se_marker_end_svg_7)'/>
-	//
-	// Problem #1: if svg_1 gets renamed, we do not update the polyline's se:connector attribute
-	// Problem #2: if the polyline svg_7 gets renamed, we do not update the marker id nor the polyline's marker-end attribute
-	var refElems = ['filter', 'linearGradient', 'pattern',	'radialGradient', 'symbol', 'textPath', 'use'];
+  var ids = {};
+  // TODO: Handle markers and connectors. These are not yet re-identified properly
+  // as their referring elements do not get remapped.
+  //
+  // <marker id='se_marker_end_svg_7'/>
+  // <polyline id='svg_7' se:connector='svg_1 svg_6' marker-end='url(#se_marker_end_svg_7)'/>
+  //
+  // Problem #1: if svg_1 gets renamed, we do not update the polyline's se:connector attribute
+  // Problem #2: if the polyline svg_7 gets renamed, we do not update the marker id nor the polyline's marker-end attribute
+  var refElems = ['filter', 'linearGradient', 'pattern',	'radialGradient', 'symbol', 'textPath', 'use'];
 
-	svgedit.utilities.walkTree(g, function (n) {
-		// if it's an element node
-		if (n.nodeType === 1) {
-			// and the element has an ID
-			if (n.id) {
-				// and we haven't tracked this ID yet
-				if (!(n.id in ids)) {
-					// add this id to our map
-					ids[n.id] = {elem: null, attrs: [], hrefs: []};
-				}
-				ids[n.id].elem = n;
-			}
+  svgedit.utilities.walkTree(g, function (n) {
+    // if it's an element node
+    if (n.nodeType === 1) {
+      // and the element has an ID
+      if (n.id) {
+        // and we haven't tracked this ID yet
+        if (!(n.id in ids)) {
+          // add this id to our map
+          ids[n.id] = {elem: null, attrs: [], hrefs: []};
+        }
+        ids[n.id].elem = n;
+      }
 
-			// now search for all attributes on this element that might refer
-			// to other elements
-			$.each(refAttrs, function (i, attr) {
-				var attrnode = n.getAttributeNode(attr);
-				if (attrnode) {
-					// the incoming file has been sanitized, so we should be able to safely just strip off the leading #
-					var url = svgedit.utilities.getUrlFromAttr(attrnode.value),
-						refid = url ? url.substr(1) : null;
-					if (refid) {
-						if (!(refid in ids)) {
-							// add this id to our map
-							ids[refid] = {elem: null, attrs: [], hrefs: []};
-						}
-						ids[refid].attrs.push(attrnode);
-					}
-				}
-			});
+      // now search for all attributes on this element that might refer
+      // to other elements
+      $.each(refAttrs, function (i, attr) {
+        var attrnode = n.getAttributeNode(attr);
+        if (attrnode) {
+          // the incoming file has been sanitized, so we should be able to safely just strip off the leading #
+          var url = svgedit.utilities.getUrlFromAttr(attrnode.value),
+            refid = url ? url.substr(1) : null;
+          if (refid) {
+            if (!(refid in ids)) {
+              // add this id to our map
+              ids[refid] = {elem: null, attrs: [], hrefs: []};
+            }
+            ids[refid].attrs.push(attrnode);
+          }
+        }
+      });
 
-			// check xlink:href now
-			var href = svgedit.utilities.getHref(n);
-			// TODO: what if an <image> or <a> element refers to an element internally?
-			if (href && refElems.indexOf(n.nodeName) >= 0) {
-				var refid = href.substr(1);
-				if (refid) {
-					if (!(refid in ids)) {
-						// add this id to our map
-						ids[refid] = {elem: null, attrs: [], hrefs: []};
-					}
-					ids[refid].hrefs.push(n);
-				}
-			}
-		}
-	});
+      // check xlink:href now
+      var href = svgedit.utilities.getHref(n);
+      // TODO: what if an <image> or <a> element refers to an element internally?
+      if (href && refElems.indexOf(n.nodeName) >= 0) {
+        var refid = href.substr(1);
+        if (refid) {
+          if (!(refid in ids)) {
+            // add this id to our map
+            ids[refid] = {elem: null, attrs: [], hrefs: []};
+          }
+          ids[refid].hrefs.push(n);
+        }
+      }
+    }
+  });
 
-	// in ids, we now have a map of ids, elements and attributes, let's re-identify
-	var oldid;
-	for (oldid in ids) {
-		if (!oldid) { continue; }
-		var elem = ids[oldid].elem;
-		if (elem) {
-			var newid = getNextId();
+  // in ids, we now have a map of ids, elements and attributes, let's re-identify
+  var oldid;
+  for (oldid in ids) {
+    if (!oldid) { continue; }
+    var elem = ids[oldid].elem;
+    if (elem) {
+      var newid = getNextId();
 
-			// assign element its new id
-			elem.id = newid;
+      // assign element its new id
+      elem.id = newid;
 
-			// remap all url() attributes
-			var attrs = ids[oldid].attrs;
-			var j = attrs.length;
-			while (j--) {
-				var attr = attrs[j];
-				attr.ownerElement.setAttribute(attr.name, 'url(#' + newid + ')');
-			}
+      // remap all url() attributes
+      var attrs = ids[oldid].attrs;
+      var j = attrs.length;
+      while (j--) {
+        var attr = attrs[j];
+        attr.ownerElement.setAttribute(attr.name, 'url(#' + newid + ')');
+      }
 
-			// remap all href attributes
-			var hreffers = ids[oldid].hrefs;
-			var k = hreffers.length;
-			while (k--) {
-				var hreffer = hreffers[k];
-				svgedit.utilities.setHref(hreffer, '#' + newid);
-			}
-		}
-	}
+      // remap all href attributes
+      var hreffers = ids[oldid].hrefs;
+      var k = hreffers.length;
+      while (k--) {
+        var hreffer = hreffers[k];
+        svgedit.utilities.setHref(hreffer, '#' + newid);
+      }
+    }
+  }
 };
 
 // Function setUseData
 // Assigns reference data for each use element
 var setUseData = this.setUseData = function (parent) {
-	var elems = $(parent);
+  var elems = $(parent);
 
-	if (parent.tagName !== 'use') {
-		elems = elems.find('use');
-	}
+  if (parent.tagName !== 'use') {
+    elems = elems.find('use');
+  }
 
-	elems.each(function () {
-		var id = getHref(this).substr(1);
-		var refElem = svgedit.utilities.getElem(id);
-		if (!refElem) { return; }
-		$(this).data('ref', refElem);
-		if (refElem.tagName === 'symbol' || refElem.tagName === 'svg') {
-			$(this).data('symbol', refElem).data('ref', refElem);
-		}
-	});
+  elems.each(function () {
+    var id = getHref(this).substr(1);
+    var refElem = svgedit.utilities.getElem(id);
+    if (!refElem) { return; }
+    $(this).data('ref', refElem);
+    if (refElem.tagName === 'symbol' || refElem.tagName === 'svg') {
+      $(this).data('symbol', refElem).data('ref', refElem);
+    }
+  });
 };
 
 // Function convertGradients
 // Converts gradients from userSpaceOnUse to objectBoundingBox
 var convertGradients = this.convertGradients = function (elem) {
-	var elems = $(elem).find('linearGradient, radialGradient');
-	if (!elems.length && svgedit.browser.isWebkit()) {
-		// Bug in webkit prevents regular *Gradient selector search
-		elems = $(elem).find('*').filter(function () {
-			return (this.tagName.indexOf('Gradient') >= 0);
-		});
-	}
+  var elems = $(elem).find('linearGradient, radialGradient');
+  if (!elems.length && svgedit.browser.isWebkit()) {
+    // Bug in webkit prevents regular *Gradient selector search
+    elems = $(elem).find('*').filter(function () {
+      return (this.tagName.indexOf('Gradient') >= 0);
+    });
+  }
 
-	elems.each(function () {
-		var grad = this;
-		if ($(grad).attr('gradientUnits') === 'userSpaceOnUse') {
-			// TODO: Support more than one element with this ref by duplicating parent grad
-			var elems = $(svgcontent).find('[fill="url(#' + grad.id + ')"],[stroke="url(#' + grad.id + ')"]');
-			if (!elems.length) { return; }
+  elems.each(function () {
+    var grad = this;
+    if ($(grad).attr('gradientUnits') === 'userSpaceOnUse') {
+      // TODO: Support more than one element with this ref by duplicating parent grad
+      var elems = $(svgcontent).find('[fill="url(#' + grad.id + ')"],[stroke="url(#' + grad.id + ')"]');
+      if (!elems.length) { return; }
 
-			// get object's bounding box
-			var bb = svgedit.utilities.getBBox(elems[0]);
+      // get object's bounding box
+      var bb = svgedit.utilities.getBBox(elems[0]);
 
-			// This will occur if the element is inside a <defs> or a <symbol>,
-			// in which we shouldn't need to convert anyway.
-			if (!bb) { return; }
+      // This will occur if the element is inside a <defs> or a <symbol>,
+      // in which we shouldn't need to convert anyway.
+      if (!bb) { return; }
 
-			if (grad.tagName === 'linearGradient') {
-				var gCoords = $(grad).attr(['x1', 'y1', 'x2', 'y2']);
+      if (grad.tagName === 'linearGradient') {
+        var gCoords = $(grad).attr(['x1', 'y1', 'x2', 'y2']);
 
-				// If has transform, convert
-				var tlist = grad.gradientTransform.baseVal;
-				if (tlist && tlist.numberOfItems > 0) {
-					var m = svgedit.math.transformListToTransform(tlist).matrix;
-					var pt1 = svgedit.math.transformPoint(gCoords.x1, gCoords.y1, m);
-					var pt2 = svgedit.math.transformPoint(gCoords.x2, gCoords.y2, m);
+        // If has transform, convert
+        var tlist = grad.gradientTransform.baseVal;
+        if (tlist && tlist.numberOfItems > 0) {
+          var m = svgedit.math.transformListToTransform(tlist).matrix;
+          var pt1 = svgedit.math.transformPoint(gCoords.x1, gCoords.y1, m);
+          var pt2 = svgedit.math.transformPoint(gCoords.x2, gCoords.y2, m);
 
-					gCoords.x1 = pt1.x;
-					gCoords.y1 = pt1.y;
-					gCoords.x2 = pt2.x;
-					gCoords.y2 = pt2.y;
-					grad.removeAttribute('gradientTransform');
-				}
+          gCoords.x1 = pt1.x;
+          gCoords.y1 = pt1.y;
+          gCoords.x2 = pt2.x;
+          gCoords.y2 = pt2.y;
+          grad.removeAttribute('gradientTransform');
+        }
 
-				$(grad).attr({
-					x1: (gCoords.x1 - bb.x) / bb.width,
-					y1: (gCoords.y1 - bb.y) / bb.height,
-					x2: (gCoords.x2 - bb.x) / bb.width,
-					y2: (gCoords.y2 - bb.y) / bb.height
-				});
-				grad.removeAttribute('gradientUnits');
-			}
-			// else {
-			// 	Note: radialGradient elements cannot be easily converted
-			// 	because userSpaceOnUse will keep circular gradients, while
-			// 	objectBoundingBox will x/y scale the gradient according to
-			// 	its bbox.
-			//
-			// 	For now we'll do nothing, though we should probably have
-			// 	the gradient be updated as the element is moved, as
-			// 	inkscape/illustrator do.
-			//
-			// 	var gCoords = $(grad).attr(['cx', 'cy', 'r']);
-			//
-			// 	$(grad).attr({
-			// 		cx: (gCoords.cx - bb.x) / bb.width,
-			// 		cy: (gCoords.cy - bb.y) / bb.height,
-			// 		r: gCoords.r
-			// 	});
-			//
-			// 	grad.removeAttribute('gradientUnits');
-			// }
-		}
-	});
+        $(grad).attr({
+          x1: (gCoords.x1 - bb.x) / bb.width,
+          y1: (gCoords.y1 - bb.y) / bb.height,
+          x2: (gCoords.x2 - bb.x) / bb.width,
+          y2: (gCoords.y2 - bb.y) / bb.height
+        });
+        grad.removeAttribute('gradientUnits');
+      }
+      // else {
+      // 	Note: radialGradient elements cannot be easily converted
+      // 	because userSpaceOnUse will keep circular gradients, while
+      // 	objectBoundingBox will x/y scale the gradient according to
+      // 	its bbox.
+      //
+      // 	For now we'll do nothing, though we should probably have
+      // 	the gradient be updated as the element is moved, as
+      // 	inkscape/illustrator do.
+      //
+      // 	var gCoords = $(grad).attr(['cx', 'cy', 'r']);
+      //
+      // 	$(grad).attr({
+      // 		cx: (gCoords.cx - bb.x) / bb.width,
+      // 		cy: (gCoords.cy - bb.y) / bb.height,
+      // 		r: gCoords.r
+      // 	});
+      //
+      // 	grad.removeAttribute('gradientUnits');
+      // }
+    }
+  });
 };
 
 // Function: convertToGroup
 // Converts selected/given <use> or child SVG element to a group
 var convertToGroup = this.convertToGroup = function (elem) {
-	if (!elem) {
-		elem = selectedElements[0];
-	}
-	var $elem = $(elem);
-	var batchCmd = new svgedit.history.BatchCommand();
-	var ts;
+  if (!elem) {
+    elem = selectedElements[0];
+  }
+  var $elem = $(elem);
+  var batchCmd = new svgedit.history.BatchCommand();
+  var ts;
 
-	if ($elem.data('gsvg')) {
-		// Use the gsvg as the new group
-		var svg = elem.firstChild;
-		var pt = $(svg).attr(['x', 'y']);
+  if ($elem.data('gsvg')) {
+    // Use the gsvg as the new group
+    var svg = elem.firstChild;
+    var pt = $(svg).attr(['x', 'y']);
 
-		$(elem.firstChild.firstChild).unwrap();
-		$(elem).removeData('gsvg');
+    $(elem.firstChild.firstChild).unwrap();
+    $(elem).removeData('gsvg');
 
-		var tlist = svgedit.transformlist.getTransformList(elem);
-		var xform = svgroot.createSVGTransform();
-		xform.setTranslate(pt.x, pt.y);
-		tlist.appendItem(xform);
-		svgedit.recalculate.recalculateDimensions(elem);
-		call('selected', [elem]);
-	} else if ($elem.data('symbol')) {
-		elem = $elem.data('symbol');
+    var tlist = svgedit.transformlist.getTransformList(elem);
+    var xform = svgroot.createSVGTransform();
+    xform.setTranslate(pt.x, pt.y);
+    tlist.appendItem(xform);
+    svgedit.recalculate.recalculateDimensions(elem);
+    call('selected', [elem]);
+  } else if ($elem.data('symbol')) {
+    elem = $elem.data('symbol');
 
-		ts = $elem.attr('transform');
-		var pos = $elem.attr(['x', 'y']);
+    ts = $elem.attr('transform');
+    var pos = $elem.attr(['x', 'y']);
 
-		var vb = elem.getAttribute('viewBox');
+    var vb = elem.getAttribute('viewBox');
 
-		if (vb) {
-			var nums = vb.split(' ');
-			pos.x -= +nums[0];
-			pos.y -= +nums[1];
-		}
+    if (vb) {
+      var nums = vb.split(' ');
+      pos.x -= +nums[0];
+      pos.y -= +nums[1];
+    }
 
-		// Not ideal, but works
-		ts += ' translate(' + (pos.x || 0) + ',' + (pos.y || 0) + ')';
+    // Not ideal, but works
+    ts += ' translate(' + (pos.x || 0) + ',' + (pos.y || 0) + ')';
 
-		var prev = $elem.prev();
+    var prev = $elem.prev();
 
-		// Remove <use> element
-		batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand($elem[0], $elem[0].nextSibling, $elem[0].parentNode));
-		$elem.remove();
+    // Remove <use> element
+    batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand($elem[0], $elem[0].nextSibling, $elem[0].parentNode));
+    $elem.remove();
 
-		// See if other elements reference this symbol
-		var hasMore = $(svgcontent).find('use:data(symbol)').length;
+    // See if other elements reference this symbol
+    var hasMore = $(svgcontent).find('use:data(symbol)').length;
 
-		var g = svgdoc.createElementNS(NS.SVG, 'g');
-		var childs = elem.childNodes;
+    var g = svgdoc.createElementNS(NS.SVG, 'g');
+    var childs = elem.childNodes;
 
-		var i;
-		for (i = 0; i < childs.length; i++) {
-			g.appendChild(childs[i].cloneNode(true));
-		}
+    var i;
+    for (i = 0; i < childs.length; i++) {
+      g.appendChild(childs[i].cloneNode(true));
+    }
 
-		// Duplicate the gradients for Gecko, since they weren't included in the <symbol>
-		if (svgedit.browser.isGecko()) {
-			var dupeGrads = $(svgedit.utilities.findDefs()).children('linearGradient,radialGradient,pattern').clone();
-			$(g).append(dupeGrads);
-		}
+    // Duplicate the gradients for Gecko, since they weren't included in the <symbol>
+    if (svgedit.browser.isGecko()) {
+      var dupeGrads = $(svgedit.utilities.findDefs()).children('linearGradient,radialGradient,pattern').clone();
+      $(g).append(dupeGrads);
+    }
 
-		if (ts) {
-			g.setAttribute('transform', ts);
-		}
+    if (ts) {
+      g.setAttribute('transform', ts);
+    }
 
-		var parent = elem.parentNode;
+    var parent = elem.parentNode;
 
-		uniquifyElems(g);
+    uniquifyElems(g);
 
-		// Put the dupe gradients back into <defs> (after uniquifying them)
-		if (svgedit.browser.isGecko()) {
-			$(findDefs()).append($(g).find('linearGradient,radialGradient,pattern'));
-		}
+    // Put the dupe gradients back into <defs> (after uniquifying them)
+    if (svgedit.browser.isGecko()) {
+      $(findDefs()).append($(g).find('linearGradient,radialGradient,pattern'));
+    }
 
-		// now give the g itself a new id
-		g.id = getNextId();
+    // now give the g itself a new id
+    g.id = getNextId();
 
-		prev.after(g);
+    prev.after(g);
 
-		if (parent) {
-			if (!hasMore) {
-				// remove symbol/svg element
-				var nextSibling = elem.nextSibling;
-				parent.removeChild(elem);
-				batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(elem, nextSibling, parent));
-			}
-			batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(g));
-		}
+    if (parent) {
+      if (!hasMore) {
+        // remove symbol/svg element
+        var nextSibling = elem.nextSibling;
+        parent.removeChild(elem);
+        batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(elem, nextSibling, parent));
+      }
+      batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(g));
+    }
 
-		setUseData(g);
+    setUseData(g);
 
-		if (svgedit.browser.isGecko()) {
-			convertGradients(svgedit.utilities.findDefs());
-		} else {
-			convertGradients(g);
-		}
+    if (svgedit.browser.isGecko()) {
+      convertGradients(svgedit.utilities.findDefs());
+    } else {
+      convertGradients(g);
+    }
 
-		// recalculate dimensions on the top-level children so that unnecessary transforms
-		// are removed
-		svgedit.utilities.walkTreePost(g, function (n) {
-			try {
-				svgedit.recalculate.recalculateDimensions(n);
-			} catch (e) {
-				console.log(e);
-			}
-		});
+    // recalculate dimensions on the top-level children so that unnecessary transforms
+    // are removed
+    svgedit.utilities.walkTreePost(g, function (n) {
+      try {
+        svgedit.recalculate.recalculateDimensions(n);
+      } catch (e) {
+        console.log(e);
+      }
+    });
 
-		// Give ID for any visible element missing one
-		$(g).find(visElems).each(function () {
-			if (!this.id) { this.id = getNextId(); }
-		});
+    // Give ID for any visible element missing one
+    $(g).find(visElems).each(function () {
+      if (!this.id) { this.id = getNextId(); }
+    });
 
-		selectOnly([g]);
+    selectOnly([g]);
 
-		var cm = pushGroupProperties(g, true);
-		if (cm) {
-			batchCmd.addSubCommand(cm);
-		}
+    var cm = pushGroupProperties(g, true);
+    if (cm) {
+      batchCmd.addSubCommand(cm);
+    }
 
-		addCommandToHistory(batchCmd);
-	} else {
-		console.log('Unexpected element to ungroup:', elem);
-	}
+    addCommandToHistory(batchCmd);
+  } else {
+    console.log('Unexpected element to ungroup:', elem);
+  }
 };
 
 //
@@ -4460,165 +4460,165 @@ var convertToGroup = this.convertToGroup = function (elem) {
 // Returns:
 // This function returns false if the set was unsuccessful, true otherwise.
 this.setSvgString = function (xmlString, preventUndo) {
-	try {
-		// convert string into XML document
-		var newDoc = svgedit.utilities.text2xml(xmlString);
+  try {
+    // convert string into XML document
+    var newDoc = svgedit.utilities.text2xml(xmlString);
 
-		this.prepareSvg(newDoc);
+    this.prepareSvg(newDoc);
 
-		var batchCmd = new svgedit.history.BatchCommand('Change Source');
+    var batchCmd = new svgedit.history.BatchCommand('Change Source');
 
-		// remove old svg document
-		var nextSibling = svgcontent.nextSibling;
-		var oldzoom = svgroot.removeChild(svgcontent);
-		batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(oldzoom, nextSibling, svgroot));
+    // remove old svg document
+    var nextSibling = svgcontent.nextSibling;
+    var oldzoom = svgroot.removeChild(svgcontent);
+    batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(oldzoom, nextSibling, svgroot));
 
-		// set new svg document
-		// If DOM3 adoptNode() available, use it. Otherwise fall back to DOM2 importNode()
-		if (svgdoc.adoptNode) {
-			svgcontent = svgdoc.adoptNode(newDoc.documentElement);
-		} else {
-			svgcontent = svgdoc.importNode(newDoc.documentElement, true);
-		}
+    // set new svg document
+    // If DOM3 adoptNode() available, use it. Otherwise fall back to DOM2 importNode()
+    if (svgdoc.adoptNode) {
+      svgcontent = svgdoc.adoptNode(newDoc.documentElement);
+    } else {
+      svgcontent = svgdoc.importNode(newDoc.documentElement, true);
+    }
 
-		svgroot.appendChild(svgcontent);
-		var content = $(svgcontent);
+    svgroot.appendChild(svgcontent);
+    var content = $(svgcontent);
 
-		canvas.current_drawing_ = new svgedit.draw.Drawing(svgcontent, idprefix);
+    canvas.current_drawing_ = new svgedit.draw.Drawing(svgcontent, idprefix);
 
-		// retrieve or set the nonce
-		var nonce = getCurrentDrawing().getNonce();
-		if (nonce) {
-			call('setnonce', nonce);
-		} else {
-			call('unsetnonce');
-		}
+    // retrieve or set the nonce
+    var nonce = getCurrentDrawing().getNonce();
+    if (nonce) {
+      call('setnonce', nonce);
+    } else {
+      call('unsetnonce');
+    }
 
-		// change image href vals if possible
-		content.find('image').each(function () {
-			var image = this;
-			svgedit.utilities.preventClickDefault(image);
-			var val = getHref(this);
-			if (val) {
-				if (val.indexOf('data:') === 0) {
-					// Check if an SVG-edit data URI
-					var m = val.match(/svgedit_url=(.*?);/);
-					if (m) {
-						var url = decodeURIComponent(m[1]);
-						$(new Image()).load(function () {
-							image.setAttributeNS(NS.XLINK, 'xlink:href', url);
-						}).attr('src', url);
-					}
-				}
-				// Add to encodableImages if it loads
-				canvas.embedImage(val);
-			}
-		});
+    // change image href vals if possible
+    content.find('image').each(function () {
+      var image = this;
+      svgedit.utilities.preventClickDefault(image);
+      var val = getHref(this);
+      if (val) {
+        if (val.indexOf('data:') === 0) {
+          // Check if an SVG-edit data URI
+          var m = val.match(/svgedit_url=(.*?);/);
+          if (m) {
+            var url = decodeURIComponent(m[1]);
+            $(new Image()).load(function () {
+              image.setAttributeNS(NS.XLINK, 'xlink:href', url);
+            }).attr('src', url);
+          }
+        }
+        // Add to encodableImages if it loads
+        canvas.embedImage(val);
+      }
+    });
 
-		// Wrap child SVGs in group elements
-		content.find('svg').each(function () {
-			// Skip if it's in a <defs>
-			if ($(this).closest('defs').length) { return; }
+    // Wrap child SVGs in group elements
+    content.find('svg').each(function () {
+      // Skip if it's in a <defs>
+      if ($(this).closest('defs').length) { return; }
 
-			uniquifyElems(this);
+      uniquifyElems(this);
 
-			// Check if it already has a gsvg group
-			var pa = this.parentNode;
-			if (pa.childNodes.length === 1 && pa.nodeName === 'g') {
-				$(pa).data('gsvg', this);
-				pa.id = pa.id || getNextId();
-			} else {
-				groupSvgElem(this);
-			}
-		});
+      // Check if it already has a gsvg group
+      var pa = this.parentNode;
+      if (pa.childNodes.length === 1 && pa.nodeName === 'g') {
+        $(pa).data('gsvg', this);
+        pa.id = pa.id || getNextId();
+      } else {
+        groupSvgElem(this);
+      }
+    });
 
-		// For Firefox: Put all paint elems in defs
-		if (svgedit.browser.isGecko()) {
-			content.find('linearGradient, radialGradient, pattern').appendTo(svgedit.utilities.findDefs());
-		}
+    // For Firefox: Put all paint elems in defs
+    if (svgedit.browser.isGecko()) {
+      content.find('linearGradient, radialGradient, pattern').appendTo(svgedit.utilities.findDefs());
+    }
 
-		// Set ref element for <use> elements
+    // Set ref element for <use> elements
 
-		// TODO: This should also be done if the object is re-added through "redo"
-		setUseData(content);
+    // TODO: This should also be done if the object is re-added through "redo"
+    setUseData(content);
 
-		convertGradients(content[0]);
+    convertGradients(content[0]);
 
-		var attrs = {
-			id: 'svgcontent',
-			overflow: curConfig.show_outside_canvas ? 'visible' : 'hidden'
-		};
+    var attrs = {
+      id: 'svgcontent',
+      overflow: curConfig.show_outside_canvas ? 'visible' : 'hidden'
+    };
 
-		var percs = false;
+    var percs = false;
 
-		// determine proper size
-		if (content.attr('viewBox')) {
-			var vb = content.attr('viewBox').split(' ');
-			attrs.width = vb[2];
-			attrs.height = vb[3];
-		// handle content that doesn't have a viewBox
-		} else {
-			$.each(['width', 'height'], function (i, dim) {
-				// Set to 100 if not given
-				var val = content.attr(dim);
+    // determine proper size
+    if (content.attr('viewBox')) {
+      var vb = content.attr('viewBox').split(' ');
+      attrs.width = vb[2];
+      attrs.height = vb[3];
+    // handle content that doesn't have a viewBox
+    } else {
+      $.each(['width', 'height'], function (i, dim) {
+        // Set to 100 if not given
+        var val = content.attr(dim);
 
-				if (!val) { val = '100%'; }
+        if (!val) { val = '100%'; }
 
-				if (String(val).substr(-1) === '%') {
-					// Use user units if percentage given
-					percs = true;
-				} else {
-					attrs[dim] = svgedit.units.convertToNum(dim, val);
-				}
-			});
-		}
+        if (String(val).substr(-1) === '%') {
+          // Use user units if percentage given
+          percs = true;
+        } else {
+          attrs[dim] = svgedit.units.convertToNum(dim, val);
+        }
+      });
+    }
 
-		// identify layers
-		identifyLayers();
+    // identify layers
+    identifyLayers();
 
-		// Give ID for any visible layer children missing one
-		content.children().find(visElems).each(function () {
-			if (!this.id) { this.id = getNextId(); }
-		});
+    // Give ID for any visible layer children missing one
+    content.children().find(visElems).each(function () {
+      if (!this.id) { this.id = getNextId(); }
+    });
 
-		// Percentage width/height, so let's base it on visible elements
-		if (percs) {
-			var bb = getStrokedBBox();
-			attrs.width = bb.width + bb.x;
-			attrs.height = bb.height + bb.y;
-		}
+    // Percentage width/height, so let's base it on visible elements
+    if (percs) {
+      var bb = getStrokedBBox();
+      attrs.width = bb.width + bb.x;
+      attrs.height = bb.height + bb.y;
+    }
 
-		// Just in case negative numbers are given or
-		// result from the percs calculation
-		if (attrs.width <= 0) { attrs.width = 100; }
-		if (attrs.height <= 0) { attrs.height = 100; }
+    // Just in case negative numbers are given or
+    // result from the percs calculation
+    if (attrs.width <= 0) { attrs.width = 100; }
+    if (attrs.height <= 0) { attrs.height = 100; }
 
-		content.attr(attrs);
-		this.contentW = attrs.width;
-		this.contentH = attrs.height;
+    content.attr(attrs);
+    this.contentW = attrs.width;
+    this.contentH = attrs.height;
 
-		batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(svgcontent));
-		// update root to the correct size
-		var changes = content.attr(['width', 'height']);
-		batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(svgroot, changes));
+    batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(svgcontent));
+    // update root to the correct size
+    var changes = content.attr(['width', 'height']);
+    batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(svgroot, changes));
 
-		// reset zoom
-		currentZoom = 1;
+    // reset zoom
+    currentZoom = 1;
 
-		// reset transform lists
-		svgedit.transformlist.resetListMap();
-		clearSelection();
-		svgedit.path.clearData();
-		svgroot.appendChild(selectorManager.selectorParentGroup);
+    // reset transform lists
+    svgedit.transformlist.resetListMap();
+    clearSelection();
+    svgedit.path.clearData();
+    svgroot.appendChild(selectorManager.selectorParentGroup);
 
-		if (!preventUndo) addCommandToHistory(batchCmd);
-		call('changed', [svgcontent]);
-	} catch (e) {
-		console.log(e);
-		return false;
-	}
+    if (!preventUndo) addCommandToHistory(batchCmd);
+    call('changed', [svgcontent]);
+  } catch (e) {
+    console.log(e);
+    return false;
+  }
 
-	return true;
+  return true;
 };
 
 // Function: importSvgString
@@ -4638,123 +4638,123 @@ this.setSvgString = function (xmlString, preventUndo) {
 // was obtained
 // * import should happen in top-left of current zoomed viewport
 this.importSvgString = function (xmlString) {
-	var j, ts;
-	try {
-		// Get unique ID
-		var uid = svgedit.utilities.encode64(xmlString.length + xmlString).substr(0, 32);
+  var j, ts;
+  try {
+    // Get unique ID
+    var uid = svgedit.utilities.encode64(xmlString.length + xmlString).substr(0, 32);
 
-		var useExisting = false;
+    var useExisting = false;
 
-		// Look for symbol and make sure symbol exists in image
-		if (importIds[uid]) {
-			if ($(importIds[uid].symbol).parents('#svgroot').length) {
-				useExisting = true;
-			}
-		}
+    // Look for symbol and make sure symbol exists in image
+    if (importIds[uid]) {
+      if ($(importIds[uid].symbol).parents('#svgroot').length) {
+        useExisting = true;
+      }
+    }
 
-		var batchCmd = new svgedit.history.BatchCommand('Import Image');
-		var symbol;
-		if (useExisting) {
-			symbol = importIds[uid].symbol;
-			ts = importIds[uid].xform;
-		} else {
-			// convert string into XML document
-			var newDoc = svgedit.utilities.text2xml(xmlString);
+    var batchCmd = new svgedit.history.BatchCommand('Import Image');
+    var symbol;
+    if (useExisting) {
+      symbol = importIds[uid].symbol;
+      ts = importIds[uid].xform;
+    } else {
+      // convert string into XML document
+      var newDoc = svgedit.utilities.text2xml(xmlString);
 
-			this.prepareSvg(newDoc);
+      this.prepareSvg(newDoc);
 
-			// import new svg document into our document
-			var svg;
-			// If DOM3 adoptNode() available, use it. Otherwise fall back to DOM2 importNode()
-			if (svgdoc.adoptNode) {
-				svg = svgdoc.adoptNode(newDoc.documentElement);
-			} else {
-				svg = svgdoc.importNode(newDoc.documentElement, true);
-			}
+      // import new svg document into our document
+      var svg;
+      // If DOM3 adoptNode() available, use it. Otherwise fall back to DOM2 importNode()
+      if (svgdoc.adoptNode) {
+        svg = svgdoc.adoptNode(newDoc.documentElement);
+      } else {
+        svg = svgdoc.importNode(newDoc.documentElement, true);
+      }
 
-			uniquifyElems(svg);
+      uniquifyElems(svg);
 
-			var innerw = svgedit.units.convertToNum('width', svg.getAttribute('width')),
-				innerh = svgedit.units.convertToNum('height', svg.getAttribute('height')),
-				innervb = svg.getAttribute('viewBox'),
-				// if no explicit viewbox, create one out of the width and height
-				vb = innervb ? innervb.split(' ') : [0, 0, innerw, innerh];
-			for (j = 0; j < 4; ++j) {
-				vb[j] = +(vb[j]);
-			}
+      var innerw = svgedit.units.convertToNum('width', svg.getAttribute('width')),
+        innerh = svgedit.units.convertToNum('height', svg.getAttribute('height')),
+        innervb = svg.getAttribute('viewBox'),
+        // if no explicit viewbox, create one out of the width and height
+        vb = innervb ? innervb.split(' ') : [0, 0, innerw, innerh];
+      for (j = 0; j < 4; ++j) {
+        vb[j] = +(vb[j]);
+      }
 
-			// TODO: properly handle preserveAspectRatio
-			var // canvasw = +svgcontent.getAttribute('width'),
-				canvash = +svgcontent.getAttribute('height');
-			// imported content should be 1/3 of the canvas on its largest dimension
+      // TODO: properly handle preserveAspectRatio
+      var // canvasw = +svgcontent.getAttribute('width'),
+        canvash = +svgcontent.getAttribute('height');
+      // imported content should be 1/3 of the canvas on its largest dimension
 
-			if (innerh > innerw) {
-				ts = 'scale(' + (canvash / 3) / vb[3] + ')';
-			} else {
-				ts = 'scale(' + (canvash / 3) / vb[2] + ')';
-			}
+      if (innerh > innerw) {
+        ts = 'scale(' + (canvash / 3) / vb[3] + ')';
+      } else {
+        ts = 'scale(' + (canvash / 3) / vb[2] + ')';
+      }
 
-			// Hack to make recalculateDimensions understand how to scale
-			ts = 'translate(0) ' + ts + ' translate(0)';
+      // Hack to make recalculateDimensions understand how to scale
+      ts = 'translate(0) ' + ts + ' translate(0)';
 
-			symbol = svgdoc.createElementNS(NS.SVG, 'symbol');
-			var defs = svgedit.utilities.findDefs();
+      symbol = svgdoc.createElementNS(NS.SVG, 'symbol');
+      var defs = svgedit.utilities.findDefs();
 
-			if (svgedit.browser.isGecko()) {
-				// Move all gradients into root for Firefox, workaround for this bug:
-				// https://bugzilla.mozilla.org/show_bug.cgi?id=353575
-				// TODO: Make this properly undo-able.
-				$(svg).find('linearGradient, radialGradient, pattern').appendTo(defs);
-			}
+      if (svgedit.browser.isGecko()) {
+        // Move all gradients into root for Firefox, workaround for this bug:
+        // https://bugzilla.mozilla.org/show_bug.cgi?id=353575
+        // TODO: Make this properly undo-able.
+        $(svg).find('linearGradient, radialGradient, pattern').appendTo(defs);
+      }
 
-			while (svg.firstChild) {
-				var first = svg.firstChild;
-				symbol.appendChild(first);
-			}
-			var attrs = svg.attributes;
-			var i;
-			for (i = 0; i < attrs.length; i++) {
-				var attr = attrs[i];
-				symbol.setAttribute(attr.nodeName, attr.value);
-			}
-			symbol.id = getNextId();
+      while (svg.firstChild) {
+        var first = svg.firstChild;
+        symbol.appendChild(first);
+      }
+      var attrs = svg.attributes;
+      var i;
+      for (i = 0; i < attrs.length; i++) {
+        var attr = attrs[i];
+        symbol.setAttribute(attr.nodeName, attr.value);
+      }
+      symbol.id = getNextId();
 
-			// Store data
-			importIds[uid] = {
-				symbol: symbol,
-				xform: ts
-			};
+      // Store data
+      importIds[uid] = {
+        symbol: symbol,
+        xform: ts
+      };
 
-			svgedit.utilities.findDefs().appendChild(symbol);
-			batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(symbol));
-		}
+      svgedit.utilities.findDefs().appendChild(symbol);
+      batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(symbol));
+    }
 
-		var useEl = svgdoc.createElementNS(NS.SVG, 'use');
-		useEl.id = getNextId();
-		setHref(useEl, '#' + symbol.id);
+    var useEl = svgdoc.createElementNS(NS.SVG, 'use');
+    useEl.id = getNextId();
+    setHref(useEl, '#' + symbol.id);
 
-		(currentGroup || getCurrentDrawing().getCurrentLayer()).appendChild(useEl);
-		batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(useEl));
-		clearSelection();
+    (currentGroup || getCurrentDrawing().getCurrentLayer()).appendChild(useEl);
+    batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(useEl));
+    clearSelection();
 
-		useEl.setAttribute('transform', ts);
-		svgedit.recalculate.recalculateDimensions(useEl);
-		$(useEl).data('symbol', symbol).data('ref', symbol);
-		addToSelection([useEl]);
+    useEl.setAttribute('transform', ts);
+    svgedit.recalculate.recalculateDimensions(useEl);
+    $(useEl).data('symbol', symbol).data('ref', symbol);
+    addToSelection([useEl]);
 
-		// TODO: Find way to add this in a recalculateDimensions-parsable way
-		// if (vb[0] != 0 || vb[1] != 0) {
-		// 	ts = 'translate(' + (-vb[0]) + ',' + (-vb[1]) + ') ' + ts;
-		// }
-		addCommandToHistory(batchCmd);
-		call('changed', [svgcontent]);
-	} catch (e) {
-		console.log(e);
-		return null;
-	}
+    // TODO: Find way to add this in a recalculateDimensions-parsable way
+    // if (vb[0] != 0 || vb[1] != 0) {
+    // 	ts = 'translate(' + (-vb[0]) + ',' + (-vb[1]) + ') ' + ts;
+    // }
+    addCommandToHistory(batchCmd);
+    call('changed', [svgcontent]);
+  } catch (e) {
+    console.log(e);
+    return null;
+  }
 
-	// we want to return the element so we can automatically select it
-	return useEl;
+  // we want to return the element so we can automatically select it
+  return useEl;
 };
 
 // TODO(codedread): Move all layer/context functions in draw.js
@@ -4765,8 +4765,8 @@ this.importSvgString = function (xmlString) {
 // Function: identifyLayers
 // Updates layer system
 var identifyLayers = canvas.identifyLayers = function () {
-	leaveContext();
-	getCurrentDrawing().identifyLayers();
+  leaveContext();
+  getCurrentDrawing().identifyLayers();
 };
 
 // Function: createLayer
@@ -4777,9 +4777,9 @@ var identifyLayers = canvas.identifyLayers = function () {
 // Parameters:
 // name - The given name
 this.createLayer = function (name, hrService) {
-	var newLayer = getCurrentDrawing().createLayer(name, historyRecordingService(hrService));
-	clearSelection();
-	call('changed', [newLayer]);
+  var newLayer = getCurrentDrawing().createLayer(name, historyRecordingService(hrService));
+  clearSelection();
+  call('changed', [newLayer]);
 };
 
 /**
@@ -4790,32 +4790,32 @@ this.createLayer = function (name, hrService) {
  * @param {svgedit.history.HistoryRecordingService} hrService - History recording service
  */
 this.cloneLayer = function (name, hrService) {
-	// Clone the current layer and make the cloned layer the new current layer
-	var newLayer = getCurrentDrawing().cloneLayer(name, historyRecordingService(hrService));
+  // Clone the current layer and make the cloned layer the new current layer
+  var newLayer = getCurrentDrawing().cloneLayer(name, historyRecordingService(hrService));
 
-	clearSelection();
-	leaveContext();
-	call('changed', [newLayer]);
+  clearSelection();
+  leaveContext();
+  call('changed', [newLayer]);
 };
 
 // Function: deleteCurrentLayer
 // Deletes the current layer from the drawing and then clears the selection. This function
 // then calls the 'changed' handler. This is an undoable action.
 this.deleteCurrentLayer = function () {
-	var currentLayer = getCurrentDrawing().getCurrentLayer();
-	var nextSibling = currentLayer.nextSibling;
-	var parent = currentLayer.parentNode;
-	currentLayer = getCurrentDrawing().deleteCurrentLayer();
-	if (currentLayer) {
-		var batchCmd = new svgedit.history.BatchCommand('Delete Layer');
-		// store in our Undo History
-		batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(currentLayer, nextSibling, parent));
-		addCommandToHistory(batchCmd);
-		clearSelection();
-		call('changed', [parent]);
-		return true;
-	}
-	return false;
+  var currentLayer = getCurrentDrawing().getCurrentLayer();
+  var nextSibling = currentLayer.nextSibling;
+  var parent = currentLayer.parentNode;
+  currentLayer = getCurrentDrawing().deleteCurrentLayer();
+  if (currentLayer) {
+    var batchCmd = new svgedit.history.BatchCommand('Delete Layer');
+    // store in our Undo History
+    batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(currentLayer, nextSibling, parent));
+    addCommandToHistory(batchCmd);
+    clearSelection();
+    call('changed', [parent]);
+    return true;
+  }
+  return false;
 };
 
 // Function: setCurrentLayer
@@ -4828,11 +4828,11 @@ this.deleteCurrentLayer = function () {
 // Returns:
 // true if the current layer was switched, otherwise false
 this.setCurrentLayer = function (name) {
-	var result = getCurrentDrawing().setCurrentLayer(svgedit.utilities.toXml(name));
-	if (result) {
-		clearSelection();
-	}
-	return result;
+  var result = getCurrentDrawing().setCurrentLayer(svgedit.utilities.toXml(name));
+  if (result) {
+    clearSelection();
+  }
+  return result;
 };
 
 // Function: renameCurrentLayer
@@ -4846,16 +4846,16 @@ this.setCurrentLayer = function (name) {
 // Returns:
 // true if the rename succeeded, false otherwise.
 this.renameCurrentLayer = function (newname) {
-	var drawing = getCurrentDrawing();
-	var layer = drawing.getCurrentLayer();
-	if (layer) {
-		var result = drawing.setCurrentLayerName(newname, historyRecordingService());
-		if (result) {
-			call('changed', [layer]);
-			return true;
-		}
-	}
-	return false;
+  var drawing = getCurrentDrawing();
+  var layer = drawing.getCurrentLayer();
+  if (layer) {
+    var result = drawing.setCurrentLayerName(newname, historyRecordingService());
+    if (result) {
+      call('changed', [layer]);
+      return true;
+    }
+  }
+  return false;
 };
 
 // Function: setCurrentLayerPosition
@@ -4870,13 +4870,13 @@ this.renameCurrentLayer = function (newname) {
 // Returns:
 // true if the current layer position was changed, false otherwise.
 this.setCurrentLayerPosition = function (newpos) {
-	var drawing = getCurrentDrawing();
-	var result = drawing.setCurrentLayerPosition(newpos);
-	if (result) {
-		addCommandToHistory(new svgedit.history.MoveElementCommand(result.currentGroup, result.oldNextSibling, svgcontent));
-		return true;
-	}
-	return false;
+  var drawing = getCurrentDrawing();
+  var result = drawing.setCurrentLayerPosition(newpos);
+  if (result) {
+    addCommandToHistory(new svgedit.history.MoveElementCommand(result.currentGroup, result.oldNextSibling, svgcontent));
+    return true;
+  }
+  return false;
 };
 
 // Function: setLayerVisibility
@@ -4890,22 +4890,22 @@ this.setCurrentLayerPosition = function (newpos) {
 // Returns:
 // true if the layer's visibility was set, false otherwise
 this.setLayerVisibility = function (layername, bVisible) {
-	var drawing = getCurrentDrawing();
-	var prevVisibility = drawing.getLayerVisibility(layername);
-	var layer = drawing.setLayerVisibility(layername, bVisible);
-	if (layer) {
-		var oldDisplay = prevVisibility ? 'inline' : 'none';
-		addCommandToHistory(new svgedit.history.ChangeElementCommand(layer, {'display': oldDisplay}, 'Layer Visibility'));
-	} else {
-		return false;
-	}
+  var drawing = getCurrentDrawing();
+  var prevVisibility = drawing.getLayerVisibility(layername);
+  var layer = drawing.setLayerVisibility(layername, bVisible);
+  if (layer) {
+    var oldDisplay = prevVisibility ? 'inline' : 'none';
+    addCommandToHistory(new svgedit.history.ChangeElementCommand(layer, {'display': oldDisplay}, 'Layer Visibility'));
+  } else {
+    return false;
+  }
 
-	if (layer === drawing.getCurrentLayer()) {
-		clearSelection();
-		pathActions.clear();
-	}
-	// call('changed', [selected]);
-	return true;
+  if (layer === drawing.getCurrentLayer()) {
+    clearSelection();
+    pathActions.clear();
+  }
+  // call('changed', [selected]);
+  return true;
 };
 
 // Function: moveSelectedToLayer
@@ -4918,92 +4918,92 @@ this.setLayerVisibility = function (layername, bVisible) {
 // Returns:
 // true if the selected elements were moved to the layer, false otherwise.
 this.moveSelectedToLayer = function (layername) {
-	// find the layer
-	var i;
-	var drawing = getCurrentDrawing();
-	var layer = drawing.getLayerByName(layername);
-	if (!layer) { return false; }
+  // find the layer
+  var i;
+  var drawing = getCurrentDrawing();
+  var layer = drawing.getLayerByName(layername);
+  if (!layer) { return false; }
 
-	var batchCmd = new svgedit.history.BatchCommand('Move Elements to Layer');
+  var batchCmd = new svgedit.history.BatchCommand('Move Elements to Layer');
 
-	// loop for each selected element and move it
-	var selElems = selectedElements;
-	i = selElems.length;
-	while (i--) {
-		var elem = selElems[i];
-		if (!elem) { continue; }
-		var oldNextSibling = elem.nextSibling;
-		// TODO: this is pretty brittle!
-		var oldLayer = elem.parentNode;
-		layer.appendChild(elem);
-		batchCmd.addSubCommand(new svgedit.history.MoveElementCommand(elem, oldNextSibling, oldLayer));
-	}
+  // loop for each selected element and move it
+  var selElems = selectedElements;
+  i = selElems.length;
+  while (i--) {
+    var elem = selElems[i];
+    if (!elem) { continue; }
+    var oldNextSibling = elem.nextSibling;
+    // TODO: this is pretty brittle!
+    var oldLayer = elem.parentNode;
+    layer.appendChild(elem);
+    batchCmd.addSubCommand(new svgedit.history.MoveElementCommand(elem, oldNextSibling, oldLayer));
+  }
 
-	addCommandToHistory(batchCmd);
+  addCommandToHistory(batchCmd);
 
-	return true;
+  return true;
 };
 
 this.mergeLayer = function (hrService) {
-	getCurrentDrawing().mergeLayer(historyRecordingService(hrService));
-	clearSelection();
-	leaveContext();
-	call('changed', [svgcontent]);
+  getCurrentDrawing().mergeLayer(historyRecordingService(hrService));
+  clearSelection();
+  leaveContext();
+  call('changed', [svgcontent]);
 };
 
 this.mergeAllLayers = function (hrService) {
-	getCurrentDrawing().mergeAllLayers(historyRecordingService(hrService));
-	clearSelection();
-	leaveContext();
-	call('changed', [svgcontent]);
+  getCurrentDrawing().mergeAllLayers(historyRecordingService(hrService));
+  clearSelection();
+  leaveContext();
+  call('changed', [svgcontent]);
 };
 
 // Function: leaveContext
 // Return from a group context to the regular kind, make any previously
 // disabled elements enabled again
 var leaveContext = this.leaveContext = function () {
-	var i, len = disabledElems.length;
-	if (len) {
-		for (i = 0; i < len; i++) {
-			var elem = disabledElems[i];
-			var orig = elData(elem, 'orig_opac');
-			if (orig !== 1) {
-				elem.setAttribute('opacity', orig);
-			} else {
-				elem.removeAttribute('opacity');
-			}
-			elem.setAttribute('style', 'pointer-events: inherit');
-		}
-		disabledElems = [];
-		clearSelection(true);
-		call('contextset', null);
-	}
-	currentGroup = null;
+  var i, len = disabledElems.length;
+  if (len) {
+    for (i = 0; i < len; i++) {
+      var elem = disabledElems[i];
+      var orig = elData(elem, 'orig_opac');
+      if (orig !== 1) {
+        elem.setAttribute('opacity', orig);
+      } else {
+        elem.removeAttribute('opacity');
+      }
+      elem.setAttribute('style', 'pointer-events: inherit');
+    }
+    disabledElems = [];
+    clearSelection(true);
+    call('contextset', null);
+  }
+  currentGroup = null;
 };
 
 // Function: setContext
 // Set the current context (for in-group editing)
 var setContext = this.setContext = function (elem) {
-	leaveContext();
-	if (typeof elem === 'string') {
-		elem = svgedit.utilities.getElem(elem);
-	}
+  leaveContext();
+  if (typeof elem === 'string') {
+    elem = svgedit.utilities.getElem(elem);
+  }
 
-	// Edit inside this group
-	currentGroup = elem;
+  // Edit inside this group
+  currentGroup = elem;
 
-	// Disable other elements
-	$(elem).parentsUntil('#svgcontent').andSelf().siblings().each(function () {
-		var opac = this.getAttribute('opacity') || 1;
-		// Store the original's opacity
-		elData(this, 'orig_opac', opac);
-		this.setAttribute('opacity', opac * 0.33);
-		this.setAttribute('style', 'pointer-events: none');
-		disabledElems.push(this);
-	});
+  // Disable other elements
+  $(elem).parentsUntil('#svgcontent').andSelf().siblings().each(function () {
+    var opac = this.getAttribute('opacity') || 1;
+    // Store the original's opacity
+    elData(this, 'orig_opac', opac);
+    this.setAttribute('opacity', opac * 0.33);
+    this.setAttribute('style', 'pointer-events: none');
+    disabledElems.push(this);
+  });
 
-	clearSelection();
-	call('contextset', currentGroup);
+  clearSelection();
+  call('contextset', currentGroup);
 };
 
 // Group: Document functions
@@ -5011,29 +5011,29 @@ var setContext = this.setContext = function (elem) {
 // Function: clear
 // Clears the current document. This is not an undoable action.
 this.clear = function () {
-	pathActions.clear();
+  pathActions.clear();
 
-	clearSelection();
+  clearSelection();
 
-	// clear the svgcontent node
-	canvas.clearSvgContentElement();
+  // clear the svgcontent node
+  canvas.clearSvgContentElement();
 
-	// create new document
-	canvas.current_drawing_ = new svgedit.draw.Drawing(svgcontent);
+  // create new document
+  canvas.current_drawing_ = new svgedit.draw.Drawing(svgcontent);
 
-	// create empty first layer
-	canvas.createLayer('Layer 1');
+  // create empty first layer
+  canvas.createLayer('Layer 1');
 
-	// clear the undo stack
-	canvas.undoMgr.resetUndoStack();
+  // clear the undo stack
+  canvas.undoMgr.resetUndoStack();
 
-	// reset the selector manager
-	selectorManager.initGroup();
+  // reset the selector manager
+  selectorManager.initGroup();
 
-	// reset the rubber band box
-	rubberBox = selectorManager.getRubberBandBox();
+  // reset the rubber band box
+  rubberBox = selectorManager.getRubberBandBox();
 
-	call('cleared');
+  call('cleared');
 };
 
 // Function: linkControlPoints
@@ -5058,14 +5058,14 @@ var getResolution = this.getResolution = function () {
 //		var vb = svgcontent.getAttribute('viewBox').split(' ');
 //		return {'w':vb[2], 'h':vb[3], 'zoom': currentZoom};
 
-	var width = svgcontent.getAttribute('width') / currentZoom;
-	var height = svgcontent.getAttribute('height') / currentZoom;
+  var width = svgcontent.getAttribute('width') / currentZoom;
+  var height = svgcontent.getAttribute('height') / currentZoom;
 
-	return {
-		'w': width,
-		'h': height,
-		'zoom': currentZoom
-	};
+  return {
+    'w': width,
+    'h': height,
+    'zoom': currentZoom
+  };
 };
 
 // Function: getZoom
@@ -5079,7 +5079,7 @@ this.getSnapToGrid = function () { return curConfig.gridSnapping; };
 // Function: getVersion
 // Returns a string which describes the revision number of SvgCanvas.
 this.getVersion = function () {
-	return 'svgcanvas.js ($Rev$)';
+  return 'svgcanvas.js ($Rev$)';
 };
 
 // Function: setUiStrings
@@ -5088,7 +5088,7 @@ this.getVersion = function () {
 // Parameters:
 // strs - Object with strings (see uiStrings for examples)
 this.setUiStrings = function (strs) {
-	$.extend(uiStrings, strs.notification);
+  $.extend(uiStrings, strs.notification);
 };
 
 // Function: setConfig
@@ -5097,61 +5097,61 @@ this.setUiStrings = function (strs) {
 // Parameters:
 // opts - Object with options (see curConfig for examples)
 this.setConfig = function (opts) {
-	$.extend(curConfig, opts);
+  $.extend(curConfig, opts);
 };
 
 // Function: getTitle
 // Returns the current group/SVG's title contents
 this.getTitle = function (elem) {
-	var i;
-	elem = elem || selectedElements[0];
-	if (!elem) { return; }
-	elem = $(elem).data('gsvg') || $(elem).data('symbol') || elem;
-	var childs = elem.childNodes;
-	for (i = 0; i < childs.length; i++) {
-		if (childs[i].nodeName === 'title') {
-			return childs[i].textContent;
-		}
-	}
-	return '';
+  var i;
+  elem = elem || selectedElements[0];
+  if (!elem) { return; }
+  elem = $(elem).data('gsvg') || $(elem).data('symbol') || elem;
+  var childs = elem.childNodes;
+  for (i = 0; i < childs.length; i++) {
+    if (childs[i].nodeName === 'title') {
+      return childs[i].textContent;
+    }
+  }
+  return '';
 };
 
 // Function: setGroupTitle
 // Sets the group/SVG's title content
 // TODO: Combine this with setDocumentTitle
 this.setGroupTitle = function (val) {
-	var elem = selectedElements[0];
-	elem = $(elem).data('gsvg') || elem;
+  var elem = selectedElements[0];
+  elem = $(elem).data('gsvg') || elem;
 
-	var ts = $(elem).children('title');
+  var ts = $(elem).children('title');
 
-	var batchCmd = new svgedit.history.BatchCommand('Set Label');
+  var batchCmd = new svgedit.history.BatchCommand('Set Label');
 
-	if (!val.length) {
-		// Remove title element
-		var tsNextSibling = ts.nextSibling;
-		batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(ts[0], tsNextSibling, elem));
-		ts.remove();
-	} else if (ts.length) {
-		// Change title contents
-		var title = ts[0];
-		batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(title, {'#text': title.textContent}));
-		title.textContent = val;
-	} else {
-		// Add title element
-		title = svgdoc.createElementNS(NS.SVG, 'title');
-		title.textContent = val;
-		$(elem).prepend(title);
-		batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(title));
-	}
+  if (!val.length) {
+    // Remove title element
+    var tsNextSibling = ts.nextSibling;
+    batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(ts[0], tsNextSibling, elem));
+    ts.remove();
+  } else if (ts.length) {
+    // Change title contents
+    var title = ts[0];
+    batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(title, {'#text': title.textContent}));
+    title.textContent = val;
+  } else {
+    // Add title element
+    title = svgdoc.createElementNS(NS.SVG, 'title');
+    title.textContent = val;
+    $(elem).prepend(title);
+    batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(title));
+  }
 
-	addCommandToHistory(batchCmd);
+  addCommandToHistory(batchCmd);
 };
 
 // Function: getDocumentTitle
 // Returns the current document title or an empty string if not found
 var getDocumentTitle = this.getDocumentTitle = function () {
-	return canvas.getTitle(svgcontent);
+  return canvas.getTitle(svgcontent);
 };
 
 // Function: setDocumentTitle
@@ -5161,31 +5161,31 @@ var getDocumentTitle = this.getDocumentTitle = function () {
 // Parameters:
 // newtitle - String with the new title
 this.setDocumentTitle = function (newtitle) {
-	var i;
-	var childs = svgcontent.childNodes, docTitle = false, oldTitle = '';
+  var i;
+  var childs = svgcontent.childNodes, docTitle = false, oldTitle = '';
 
-	var batchCmd = new svgedit.history.BatchCommand('Change Image Title');
+  var batchCmd = new svgedit.history.BatchCommand('Change Image Title');
 
-	for (i = 0; i < childs.length; i++) {
-		if (childs[i].nodeName === 'title') {
-			docTitle = childs[i];
-			oldTitle = docTitle.textContent;
-			break;
-		}
-	}
-	if (!docTitle) {
-		docTitle = svgdoc.createElementNS(NS.SVG, 'title');
-		svgcontent.insertBefore(docTitle, svgcontent.firstChild);
-	}
+  for (i = 0; i < childs.length; i++) {
+    if (childs[i].nodeName === 'title') {
+      docTitle = childs[i];
+      oldTitle = docTitle.textContent;
+      break;
+    }
+  }
+  if (!docTitle) {
+    docTitle = svgdoc.createElementNS(NS.SVG, 'title');
+    svgcontent.insertBefore(docTitle, svgcontent.firstChild);
+  }
 
-	if (newtitle.length) {
-		docTitle.textContent = newtitle;
-	} else {
-		// No title given, so element is not necessary
-		docTitle.parentNode.removeChild(docTitle);
-	}
-	batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(docTitle, {'#text': oldTitle}));
-	addCommandToHistory(batchCmd);
+  if (newtitle.length) {
+    docTitle.textContent = newtitle;
+  } else {
+    // No title given, so element is not necessary
+    docTitle.parentNode.removeChild(docTitle);
+  }
+  batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(docTitle, {'#text': oldTitle}));
+  addCommandToHistory(batchCmd);
 };
 
 // Function: getEditorNS
@@ -5194,10 +5194,10 @@ this.setDocumentTitle = function (newtitle) {
 // Parameters:
 // add - Boolean to indicate whether or not to add the namespace value
 this.getEditorNS = function (add) {
-	if (add) {
-		svgcontent.setAttribute('xmlns:se', NS.SE);
-	}
-	return NS.SE;
+  if (add) {
+    svgcontent.setAttribute('xmlns:se', NS.SE);
+  }
+  return NS.SE;
 };
 
 // Function: setResolution
@@ -5212,63 +5212,63 @@ this.getEditorNS = function (add) {
 // Boolean to indicate if resolution change was succesful.
 // It will fail on "fit to content" option with no content to fit to.
 this.setResolution = function (x, y) {
-	var res = getResolution();
-	var w = res.w, h = res.h;
-	var batchCmd;
+  var res = getResolution();
+  var w = res.w, h = res.h;
+  var batchCmd;
 
-	if (x === 'fit') {
-		// Get bounding box
-		var bbox = getStrokedBBox();
+  if (x === 'fit') {
+    // Get bounding box
+    var bbox = getStrokedBBox();
 
-		if (bbox) {
-			batchCmd = new svgedit.history.BatchCommand('Fit Canvas to Content');
-			var visEls = getVisibleElements();
-			addToSelection(visEls);
-			var dx = [], dy = [];
-			$.each(visEls, function (i, item) {
-				dx.push(bbox.x * -1);
-				dy.push(bbox.y * -1);
-			});
+    if (bbox) {
+      batchCmd = new svgedit.history.BatchCommand('Fit Canvas to Content');
+      var visEls = getVisibleElements();
+      addToSelection(visEls);
+      var dx = [], dy = [];
+      $.each(visEls, function (i, item) {
+        dx.push(bbox.x * -1);
+        dy.push(bbox.y * -1);
+      });
 
-			var cmd = canvas.moveSelectedElements(dx, dy, true);
-			batchCmd.addSubCommand(cmd);
-			clearSelection();
+      var cmd = canvas.moveSelectedElements(dx, dy, true);
+      batchCmd.addSubCommand(cmd);
+      clearSelection();
 
-			x = Math.round(bbox.width);
-			y = Math.round(bbox.height);
-		} else {
-			return false;
-		}
-	}
-	if (x !== w || y !== h) {
-		if (!batchCmd) {
-			batchCmd = new svgedit.history.BatchCommand('Change Image Dimensions');
-		}
+      x = Math.round(bbox.width);
+      y = Math.round(bbox.height);
+    } else {
+      return false;
+    }
+  }
+  if (x !== w || y !== h) {
+    if (!batchCmd) {
+      batchCmd = new svgedit.history.BatchCommand('Change Image Dimensions');
+    }
 
-		x = svgedit.units.convertToNum('width', x);
-		y = svgedit.units.convertToNum('height', y);
+    x = svgedit.units.convertToNum('width', x);
+    y = svgedit.units.convertToNum('height', y);
 
-		svgcontent.setAttribute('width', x);
-		svgcontent.setAttribute('height', y);
+    svgcontent.setAttribute('width', x);
+    svgcontent.setAttribute('height', y);
 
-		this.contentW = x;
-		this.contentH = y;
-		batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(svgcontent, {'width': w, 'height': h}));
+    this.contentW = x;
+    this.contentH = y;
+    batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(svgcontent, {'width': w, 'height': h}));
 
-		svgcontent.setAttribute('viewBox', [0, 0, x / currentZoom, y / currentZoom].join(' '));
-		batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(svgcontent, {'viewBox': ['0 0', w, h].join(' ')}));
+    svgcontent.setAttribute('viewBox', [0, 0, x / currentZoom, y / currentZoom].join(' '));
+    batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(svgcontent, {'viewBox': ['0 0', w, h].join(' ')}));
 
-		addCommandToHistory(batchCmd);
-		call('changed', [svgcontent]);
-	}
-	return true;
+    addCommandToHistory(batchCmd);
+    call('changed', [svgcontent]);
+  }
+  return true;
 };
 
 // Function: getOffset
 // Returns an object with x, y values indicating the svgcontent element's
 // position in the editor's canvas.
 this.getOffset = function () {
-	return $(svgcontent).attr(['x', 'y']);
+  return $(svgcontent).attr(['x', 'y']);
 };
 
 // Function: setBBoxZoom
@@ -5279,48 +5279,48 @@ this.getOffset = function () {
 // editorW - Integer with the editor's workarea box's width
 // editorH - Integer with the editor's workarea box's height
 this.setBBoxZoom = function (val, editorW, editorH) {
-	var spacer = 0.85;
-	var bb;
-	var calcZoom = function (bb) {
-		if (!bb) { return false; }
-		var wZoom = Math.round((editorW / bb.width) * 100 * spacer) / 100;
-		var hZoom = Math.round((editorH / bb.height) * 100 * spacer) / 100;
-		var zoomlevel = Math.min(wZoom, hZoom);
-		canvas.setZoom(zoomlevel);
-		return {'zoom': zoomlevel, 'bbox': bb};
-	};
+  var spacer = 0.85;
+  var bb;
+  var calcZoom = function (bb) {
+    if (!bb) { return false; }
+    var wZoom = Math.round((editorW / bb.width) * 100 * spacer) / 100;
+    var hZoom = Math.round((editorH / bb.height) * 100 * spacer) / 100;
+    var zoomlevel = Math.min(wZoom, hZoom);
+    canvas.setZoom(zoomlevel);
+    return {'zoom': zoomlevel, 'bbox': bb};
+  };
 
-	if (typeof val === 'object') {
-		bb = val;
-		if (bb.width === 0 || bb.height === 0) {
-			var newzoom = bb.zoom ? bb.zoom : currentZoom * bb.factor;
-			canvas.setZoom(newzoom);
-			return {'zoom': currentZoom, 'bbox': bb};
-		}
-		return calcZoom(bb);
-	}
+  if (typeof val === 'object') {
+    bb = val;
+    if (bb.width === 0 || bb.height === 0) {
+      var newzoom = bb.zoom ? bb.zoom : currentZoom * bb.factor;
+      canvas.setZoom(newzoom);
+      return {'zoom': currentZoom, 'bbox': bb};
+    }
+    return calcZoom(bb);
+  }
 
-	switch (val) {
-	case 'selection':
-		if (!selectedElements[0]) { return; }
-		var selectedElems = $.map(selectedElements, function (n) { if (n) { return n; } });
-		bb = getStrokedBBox(selectedElems);
-		break;
-	case 'canvas':
-		var res = getResolution();
-		spacer = 0.95;
-		bb = {width: res.w, height: res.h, x: 0, y: 0};
-		break;
-	case 'content':
-		bb = getStrokedBBox();
-		break;
-	case 'layer':
-		bb = getStrokedBBox(getVisibleElements(getCurrentDrawing().getCurrentLayer()));
-		break;
-	default:
-		return;
-	}
-	return calcZoom(bb);
+  switch (val) {
+  case 'selection':
+    if (!selectedElements[0]) { return; }
+    var selectedElems = $.map(selectedElements, function (n) { if (n) { return n; } });
+    bb = getStrokedBBox(selectedElems);
+    break;
+  case 'canvas':
+    var res = getResolution();
+    spacer = 0.95;
+    bb = {width: res.w, height: res.h, x: 0, y: 0};
+    break;
+  case 'content':
+    bb = getStrokedBBox();
+    break;
+  case 'layer':
+    bb = getStrokedBBox(getVisibleElements(getCurrentDrawing().getCurrentLayer()));
+    break;
+  default:
+    return;
+  }
+  return calcZoom(bb);
 };
 
 // Function: setZoom
@@ -5329,21 +5329,21 @@ this.setBBoxZoom = function (val, editorW, editorH) {
 // Parameters:
 // zoomlevel - Float indicating the zoom level to change to
 this.setZoom = function (zoomlevel) {
-	var res = getResolution();
-	svgcontent.setAttribute('viewBox', '0 0 ' + res.w / zoomlevel + ' ' + res.h / zoomlevel);
-	currentZoom = zoomlevel;
-	$.each(selectedElements, function (i, elem) {
-		if (!elem) { return; }
-		selectorManager.requestSelector(elem).resize();
-	});
-	pathActions.zoomChange();
-	runExtensions('zoomChanged', zoomlevel);
+  var res = getResolution();
+  svgcontent.setAttribute('viewBox', '0 0 ' + res.w / zoomlevel + ' ' + res.h / zoomlevel);
+  currentZoom = zoomlevel;
+  $.each(selectedElements, function (i, elem) {
+    if (!elem) { return; }
+    selectorManager.requestSelector(elem).resize();
+  });
+  pathActions.zoomChange();
+  runExtensions('zoomChanged', zoomlevel);
 };
 
 // Function: getMode
 // Returns the current editor mode string
 this.getMode = function () {
-	return currentMode;
+  return currentMode;
 };
 
 // Function: setMode
@@ -5352,10 +5352,10 @@ this.getMode = function () {
 // Parameters:
 // name - String with the new mode to change to
 this.setMode = function (name) {
-	pathActions.clear(true);
-	textActions.clear();
-	curProperties = (selectedElements[0] && selectedElements[0].nodeName === 'text') ? curText : curShape;
-	currentMode = name;
+  pathActions.clear(true);
+  textActions.clear();
+  curProperties = (selectedElements[0] && selectedElements[0].nodeName === 'text') ? curText : curShape;
+  currentMode = name;
 };
 
 // Group: Element Styling
@@ -5363,7 +5363,7 @@ this.setMode = function (name) {
 // Function: getColor
 // Returns the current fill/stroke option
 this.getColor = function (type) {
-	return curProperties[type];
+  return curProperties[type];
 };
 
 // Function: setColor
@@ -5374,39 +5374,39 @@ this.getColor = function (type) {
 // val - The value to set the stroke attribute to
 // preventUndo - Boolean indicating whether or not this should be and undoable option
 this.setColor = function (type, val, preventUndo) {
-	curShape[type] = val;
-	curProperties[type + '_paint'] = {type: 'solidColor'};
-	var elems = [];
-	function addNonG (e) {
-		if (e.nodeName !== 'g') {
-			elems.push(e);
-		}
-	}
-	var i = selectedElements.length;
-	while (i--) {
-		var elem = selectedElements[i];
-		if (elem) {
-			if (elem.tagName === 'g') {
-				svgedit.utilities.walkTree(elem, addNonG);
-			} else {
-				if (type === 'fill') {
-					if (elem.tagName !== 'polyline' && elem.tagName !== 'line') {
-						elems.push(elem);
-					}
-				} else {
-					elems.push(elem);
-				}
-			}
-		}
-	}
-	if (elems.length > 0) {
-		if (!preventUndo) {
-			changeSelectedAttribute(type, val, elems);
-			call('changed', elems);
-		} else {
-			changeSelectedAttributeNoUndo(type, val, elems);
-		}
-	}
+  curShape[type] = val;
+  curProperties[type + '_paint'] = {type: 'solidColor'};
+  var elems = [];
+  function addNonG (e) {
+    if (e.nodeName !== 'g') {
+      elems.push(e);
+    }
+  }
+  var i = selectedElements.length;
+  while (i--) {
+    var elem = selectedElements[i];
+    if (elem) {
+      if (elem.tagName === 'g') {
+        svgedit.utilities.walkTree(elem, addNonG);
+      } else {
+        if (type === 'fill') {
+          if (elem.tagName !== 'polyline' && elem.tagName !== 'line') {
+            elems.push(elem);
+          }
+        } else {
+          elems.push(elem);
+        }
+      }
+    }
+  }
+  if (elems.length > 0) {
+    if (!preventUndo) {
+      changeSelectedAttribute(type, val, elems);
+      call('changed', elems);
+    } else {
+      changeSelectedAttributeNoUndo(type, val, elems);
+    }
+  }
 };
 
 // Function: setGradient
@@ -5415,21 +5415,21 @@ this.setColor = function (type, val, preventUndo) {
 // Parameters
 // type - String indicating "fill" or "stroke" to apply to an element
 var setGradient = this.setGradient = function (type) {
-	if (!curProperties[type + '_paint'] || curProperties[type + '_paint'].type === 'solidColor') { return; }
-	var grad = canvas[type + 'Grad'];
-	// find out if there is a duplicate gradient already in the defs
-	var duplicateGrad = findDuplicateGradient(grad);
-	var defs = svgedit.utilities.findDefs();
-	// no duplicate found, so import gradient into defs
-	if (!duplicateGrad) {
-		// var origGrad = grad;
-		grad = defs.appendChild(svgdoc.importNode(grad, true));
-		// get next id and set it on the grad
-		grad.id = getNextId();
-	} else { // use existing gradient
-		grad = duplicateGrad;
-	}
-	canvas.setColor(type, 'url(#' + grad.id + ')');
+  if (!curProperties[type + '_paint'] || curProperties[type + '_paint'].type === 'solidColor') { return; }
+  var grad = canvas[type + 'Grad'];
+  // find out if there is a duplicate gradient already in the defs
+  var duplicateGrad = findDuplicateGradient(grad);
+  var defs = svgedit.utilities.findDefs();
+  // no duplicate found, so import gradient into defs
+  if (!duplicateGrad) {
+    // var origGrad = grad;
+    grad = defs.appendChild(svgdoc.importNode(grad, true));
+    // get next id and set it on the grad
+    grad.id = getNextId();
+  } else { // use existing gradient
+    grad = duplicateGrad;
+  }
+  canvas.setColor(type, 'url(#' + grad.id + ')');
 };
 
 // Function: findDuplicateGradient
@@ -5441,101 +5441,101 @@ var setGradient = this.setGradient = function (type) {
 // Returns:
 // The existing gradient if found, null if not
 var findDuplicateGradient = function (grad) {
-	var defs = svgedit.utilities.findDefs();
-	var existingGrads = $(defs).find('linearGradient, radialGradient');
-	var i = existingGrads.length;
-	var radAttrs = ['r', 'cx', 'cy', 'fx', 'fy'];
-	while (i--) {
-		var og = existingGrads[i];
-		if (grad.tagName === 'linearGradient') {
-			if (grad.getAttribute('x1') !== og.getAttribute('x1') ||
-				grad.getAttribute('y1') !== og.getAttribute('y1') ||
-				grad.getAttribute('x2') !== og.getAttribute('x2') ||
-				grad.getAttribute('y2') !== og.getAttribute('y2')
-			) {
-				continue;
-			}
-		} else {
-			var gradAttrs = $(grad).attr(radAttrs);
-			var ogAttrs = $(og).attr(radAttrs);
+  var defs = svgedit.utilities.findDefs();
+  var existingGrads = $(defs).find('linearGradient, radialGradient');
+  var i = existingGrads.length;
+  var radAttrs = ['r', 'cx', 'cy', 'fx', 'fy'];
+  while (i--) {
+    var og = existingGrads[i];
+    if (grad.tagName === 'linearGradient') {
+      if (grad.getAttribute('x1') !== og.getAttribute('x1') ||
+        grad.getAttribute('y1') !== og.getAttribute('y1') ||
+        grad.getAttribute('x2') !== og.getAttribute('x2') ||
+        grad.getAttribute('y2') !== og.getAttribute('y2')
+      ) {
+        continue;
+      }
+    } else {
+      var gradAttrs = $(grad).attr(radAttrs);
+      var ogAttrs = $(og).attr(radAttrs);
 
-			var diff = false;
-			$.each(radAttrs, function (i, attr) {
-				if (gradAttrs[attr] !== ogAttrs[attr]) { diff = true; }
-			});
+      var diff = false;
+      $.each(radAttrs, function (i, attr) {
+        if (gradAttrs[attr] !== ogAttrs[attr]) { diff = true; }
+      });
 
-			if (diff) { continue; }
-		}
+      if (diff) { continue; }
+    }
 
-		// else could be a duplicate, iterate through stops
-		var stops = grad.getElementsByTagNameNS(NS.SVG, 'stop');
-		var ostops = og.getElementsByTagNameNS(NS.SVG, 'stop');
+    // else could be a duplicate, iterate through stops
+    var stops = grad.getElementsByTagNameNS(NS.SVG, 'stop');
+    var ostops = og.getElementsByTagNameNS(NS.SVG, 'stop');
 
-		if (stops.length !== ostops.length) {
-			continue;
-		}
+    if (stops.length !== ostops.length) {
+      continue;
+    }
 
-		var j = stops.length;
-		while (j--) {
-			var stop = stops[j];
-			var ostop = ostops[j];
+    var j = stops.length;
+    while (j--) {
+      var stop = stops[j];
+      var ostop = ostops[j];
 
-			if (stop.getAttribute('offset') !== ostop.getAttribute('offset') ||
-				stop.getAttribute('stop-opacity') !== ostop.getAttribute('stop-opacity') ||
-				stop.getAttribute('stop-color') !== ostop.getAttribute('stop-color')) {
-				break;
-			}
-		}
+      if (stop.getAttribute('offset') !== ostop.getAttribute('offset') ||
+        stop.getAttribute('stop-opacity') !== ostop.getAttribute('stop-opacity') ||
+        stop.getAttribute('stop-color') !== ostop.getAttribute('stop-color')) {
+        break;
+      }
+    }
 
-		if (j === -1) {
-			return og;
-		}
-	} // for each gradient in defs
+    if (j === -1) {
+      return og;
+    }
+  } // for each gradient in defs
 
-	return null;
+  return null;
 };
 
 function reorientGrads (elem, m) {
-	var i;
-	var bb = svgedit.utilities.getBBox(elem);
-	for (i = 0; i < 2; i++) {
-		var type = i === 0 ? 'fill' : 'stroke';
-		var attrVal = elem.getAttribute(type);
-		if (attrVal && attrVal.indexOf('url(') === 0) {
-			var grad = svgedit.utilities.getRefElem(attrVal);
-			if (grad.tagName === 'linearGradient') {
-				var x1 = grad.getAttribute('x1') || 0;
-				var y1 = grad.getAttribute('y1') || 0;
-				var x2 = grad.getAttribute('x2') || 1;
-				var y2 = grad.getAttribute('y2') || 0;
+  var i;
+  var bb = svgedit.utilities.getBBox(elem);
+  for (i = 0; i < 2; i++) {
+    var type = i === 0 ? 'fill' : 'stroke';
+    var attrVal = elem.getAttribute(type);
+    if (attrVal && attrVal.indexOf('url(') === 0) {
+      var grad = svgedit.utilities.getRefElem(attrVal);
+      if (grad.tagName === 'linearGradient') {
+        var x1 = grad.getAttribute('x1') || 0;
+        var y1 = grad.getAttribute('y1') || 0;
+        var x2 = grad.getAttribute('x2') || 1;
+        var y2 = grad.getAttribute('y2') || 0;
 
-				// Convert to USOU points
-				x1 = (bb.width * x1) + bb.x;
-				y1 = (bb.height * y1) + bb.y;
-				x2 = (bb.width * x2) + bb.x;
-				y2 = (bb.height * y2) + bb.y;
+        // Convert to USOU points
+        x1 = (bb.width * x1) + bb.x;
+        y1 = (bb.height * y1) + bb.y;
+        x2 = (bb.width * x2) + bb.x;
+        y2 = (bb.height * y2) + bb.y;
 
-				// Transform those points
-				var pt1 = svgedit.math.transformPoint(x1, y1, m);
-				var pt2 = svgedit.math.transformPoint(x2, y2, m);
+        // Transform those points
+        var pt1 = svgedit.math.transformPoint(x1, y1, m);
+        var pt2 = svgedit.math.transformPoint(x2, y2, m);
 
-				// Convert back to BB points
-				var gCoords = {};
+        // Convert back to BB points
+        var gCoords = {};
 
-				gCoords.x1 = (pt1.x - bb.x) / bb.width;
-				gCoords.y1 = (pt1.y - bb.y) / bb.height;
-				gCoords.x2 = (pt2.x - bb.x) / bb.width;
-				gCoords.y2 = (pt2.y - bb.y) / bb.height;
+        gCoords.x1 = (pt1.x - bb.x) / bb.width;
+        gCoords.y1 = (pt1.y - bb.y) / bb.height;
+        gCoords.x2 = (pt2.x - bb.x) / bb.width;
+        gCoords.y2 = (pt2.y - bb.y) / bb.height;
 
-				var newgrad = grad.cloneNode(true);
-				$(newgrad).attr(gCoords);
+        var newgrad = grad.cloneNode(true);
+        $(newgrad).attr(gCoords);
 
-				newgrad.id = getNextId();
-				svgedit.utilities.findDefs().appendChild(newgrad);
-				elem.setAttribute(type, 'url(#' + newgrad.id + ')');
-			}
-		}
-	}
+        newgrad.id = getNextId();
+        svgedit.utilities.findDefs().appendChild(newgrad);
+        elem.setAttribute(type, 'url(#' + newgrad.id + ')');
+      }
+    }
+  }
 }
 
 // Function: setPaint
@@ -5545,37 +5545,37 @@ function reorientGrads (elem, m) {
 // type - String with "fill" or "stroke"
 // paint - The jGraduate paint object to apply
 this.setPaint = function (type, paint) {
-	// make a copy
-	var p = new $.jGraduate.Paint(paint);
-	this.setPaintOpacity(type, p.alpha / 100, true);
+  // make a copy
+  var p = new $.jGraduate.Paint(paint);
+  this.setPaintOpacity(type, p.alpha / 100, true);
 
-	// now set the current paint object
-	curProperties[type + '_paint'] = p;
-	switch (p.type) {
-	case 'solidColor':
-		this.setColor(type, p.solidColor !== 'none' ? '#' + p.solidColor : 'none');
-		break;
-	case 'linearGradient':
-	case 'radialGradient':
-		canvas[type + 'Grad'] = p[p.type];
-		setGradient(type);
-		break;
-	}
+  // now set the current paint object
+  curProperties[type + '_paint'] = p;
+  switch (p.type) {
+  case 'solidColor':
+    this.setColor(type, p.solidColor !== 'none' ? '#' + p.solidColor : 'none');
+    break;
+  case 'linearGradient':
+  case 'radialGradient':
+    canvas[type + 'Grad'] = p[p.type];
+    setGradient(type);
+    break;
+  }
 };
 
 // alias
 this.setStrokePaint = function (paint) {
-	this.setPaint('stroke', paint);
+  this.setPaint('stroke', paint);
 };
 
 this.setFillPaint = function (paint) {
-	this.setPaint('fill', paint);
+  this.setPaint('fill', paint);
 };
 
 // Function: getStrokeWidth
 // Returns the current stroke-width value
 this.getStrokeWidth = function () {
-	return curProperties.stroke_width;
+  return curProperties.stroke_width;
 };
 
 // Function: setStrokeWidth
@@ -5585,33 +5585,33 @@ this.getStrokeWidth = function () {
 // Parameters:
 // val - A Float indicating the new stroke width value
 this.setStrokeWidth = function (val) {
-	if (val === 0 && ['line', 'path'].indexOf(currentMode) >= 0) {
-		canvas.setStrokeWidth(1);
-		return;
-	}
-	curProperties.stroke_width = val;
+  if (val === 0 && ['line', 'path'].indexOf(currentMode) >= 0) {
+    canvas.setStrokeWidth(1);
+    return;
+  }
+  curProperties.stroke_width = val;
 
-	var elems = [];
-	function addNonG (e) {
-		if (e.nodeName !== 'g') {
-			elems.push(e);
-		}
-	}
-	var i = selectedElements.length;
-	while (i--) {
-		var elem = selectedElements[i];
-		if (elem) {
-			if (elem.tagName === 'g') {
-				svgedit.utilities.walkTree(elem, addNonG);
-			} else {
-				elems.push(elem);
-			}
-		}
-	}
-	if (elems.length > 0) {
-		changeSelectedAttribute('stroke-width', val, elems);
-		call('changed', selectedElements);
-	}
+  var elems = [];
+  function addNonG (e) {
+    if (e.nodeName !== 'g') {
+      elems.push(e);
+    }
+  }
+  var i = selectedElements.length;
+  while (i--) {
+    var elem = selectedElements[i];
+    if (elem) {
+      if (elem.tagName === 'g') {
+        svgedit.utilities.walkTree(elem, addNonG);
+      } else {
+        elems.push(elem);
+      }
+    }
+  }
+  if (elems.length > 0) {
+    changeSelectedAttribute('stroke-width', val, elems);
+    call('changed', selectedElements);
+  }
 };
 
 // Function: setStrokeAttr
@@ -5621,55 +5621,55 @@ this.setStrokeWidth = function (val) {
 // attr - String with the attribute name
 // val - String or number with the attribute value
 this.setStrokeAttr = function (attr, val) {
-	curShape[attr.replace('-', '_')] = val;
-	var elems = [];
+  curShape[attr.replace('-', '_')] = val;
+  var elems = [];
 
-	var i = selectedElements.length;
-	while (i--) {
-		var elem = selectedElements[i];
-		if (elem) {
-			if (elem.tagName === 'g') {
-				svgedit.utilities.walkTree(elem, function (e) { if (e.nodeName !== 'g') { elems.push(e); } });
-			} else {
-				elems.push(elem);
-			}
-		}
-	}
-	if (elems.length > 0) {
-		changeSelectedAttribute(attr, val, elems);
-		call('changed', selectedElements);
-	}
+  var i = selectedElements.length;
+  while (i--) {
+    var elem = selectedElements[i];
+    if (elem) {
+      if (elem.tagName === 'g') {
+        svgedit.utilities.walkTree(elem, function (e) { if (e.nodeName !== 'g') { elems.push(e); } });
+      } else {
+        elems.push(elem);
+      }
+    }
+  }
+  if (elems.length > 0) {
+    changeSelectedAttribute(attr, val, elems);
+    call('changed', selectedElements);
+  }
 };
 
 // Function: getStyle
 // Returns current style options
 this.getStyle = function () {
-	return curShape;
+  return curShape;
 };
 
 // Function: getOpacity
 // Returns the current opacity
 this.getOpacity = function () {
-	return curShape.opacity;
+  return curShape.opacity;
 };
 
 // Function: setOpacity
 // Sets the given opacity to the current selected elements
 this.setOpacity = function (val) {
-	curShape.opacity = val;
-	changeSelectedAttribute('opacity', val);
+  curShape.opacity = val;
+  changeSelectedAttribute('opacity', val);
 };
 
 // Function: getOpacity
 // Returns the current fill opacity
 this.getFillOpacity = function () {
-	return curShape.fill_opacity;
+  return curShape.fill_opacity;
 };
 
 // Function: getStrokeOpacity
 // Returns the current stroke opacity
 this.getStrokeOpacity = function () {
-	return curShape.stroke_opacity;
+  return curShape.stroke_opacity;
 };
 
 // Function: setPaintOpacity
@@ -5680,12 +5680,12 @@ this.getStrokeOpacity = function () {
 // val - Float with the new opacity value
 // preventUndo - Boolean indicating whether or not this should be an undoable action
 this.setPaintOpacity = function (type, val, preventUndo) {
-	curShape[type + '_opacity'] = val;
-	if (!preventUndo) {
-		changeSelectedAttribute(type + '-opacity', val);
-	} else {
-		changeSelectedAttributeNoUndo(type + '-opacity', val);
-	}
+  curShape[type + '_opacity'] = val;
+  if (!preventUndo) {
+    changeSelectedAttribute(type + '-opacity', val);
+  } else {
+    changeSelectedAttributeNoUndo(type + '-opacity', val);
+  }
 };
 
 // Function: getPaintOpacity
@@ -5694,7 +5694,7 @@ this.setPaintOpacity = function (type, val, preventUndo) {
 // Parameters:
 // type - String with "fill" or "stroke"
 this.getPaintOpacity = function (type) {
-	return type === 'fill' ? this.getFillOpacity() : this.getStrokeOpacity();
+  return type === 'fill' ? this.getFillOpacity() : this.getStrokeOpacity();
 };
 
 // Function: getBlur
@@ -5703,19 +5703,19 @@ this.getPaintOpacity = function (type) {
 // Parameters:
 // elem - The element to check the blur value for
 this.getBlur = function (elem) {
-	var val = 0;
-	// var elem = selectedElements[0];
+  var val = 0;
+  // var elem = selectedElements[0];
 
-	if (elem) {
-		var filterUrl = elem.getAttribute('filter');
-		if (filterUrl) {
-			var blur = svgedit.utilities.getElem(elem.id + '_blur');
-			if (blur) {
-				val = blur.firstChild.getAttribute('stdDeviation');
-			}
-		}
-	}
-	return val;
+  if (elem) {
+    var filterUrl = elem.getAttribute('filter');
+    if (filterUrl) {
+      var blur = svgedit.utilities.getElem(elem.id + '_blur');
+      if (blur) {
+        val = blur.firstChild.getAttribute('stdDeviation');
+      }
+    }
+  }
+  return val;
 };
 
 (function () {
@@ -5729,36 +5729,36 @@ var filterHidden = false;
 // Parameters:
 // val - The new stdDeviation value
 canvas.setBlurNoUndo = function (val) {
-	if (!filter) {
-		canvas.setBlur(val);
-		return;
-	}
-	if (val === 0) {
-		// Don't change the StdDev, as that will hide the element.
-		// Instead, just remove the value for "filter"
-		changeSelectedAttributeNoUndo('filter', '');
-		filterHidden = true;
-	} else {
-		var elem = selectedElements[0];
-		if (filterHidden) {
-			changeSelectedAttributeNoUndo('filter', 'url(#' + elem.id + '_blur)');
-		}
-		if (svgedit.browser.isWebkit()) {
-			console.log('e', elem);
-			elem.removeAttribute('filter');
-			elem.setAttribute('filter', 'url(#' + elem.id + '_blur)');
-		}
-		changeSelectedAttributeNoUndo('stdDeviation', val, [filter.firstChild]);
-		canvas.setBlurOffsets(filter, val);
-	}
+  if (!filter) {
+    canvas.setBlur(val);
+    return;
+  }
+  if (val === 0) {
+    // Don't change the StdDev, as that will hide the element.
+    // Instead, just remove the value for "filter"
+    changeSelectedAttributeNoUndo('filter', '');
+    filterHidden = true;
+  } else {
+    var elem = selectedElements[0];
+    if (filterHidden) {
+      changeSelectedAttributeNoUndo('filter', 'url(#' + elem.id + '_blur)');
+    }
+    if (svgedit.browser.isWebkit()) {
+      console.log('e', elem);
+      elem.removeAttribute('filter');
+      elem.setAttribute('filter', 'url(#' + elem.id + '_blur)');
+    }
+    changeSelectedAttributeNoUndo('stdDeviation', val, [filter.firstChild]);
+    canvas.setBlurOffsets(filter, val);
+  }
 };
 
 function finishChange () {
-	var bCmd = canvas.undoMgr.finishUndoableChange();
-	curCommand.addSubCommand(bCmd);
-	addCommandToHistory(curCommand);
-	curCommand = null;
-	filter = null;
+  var bCmd = canvas.undoMgr.finishUndoableChange();
+  curCommand.addSubCommand(bCmd);
+  addCommandToHistory(curCommand);
+  curCommand = null;
+  filter = null;
 }
 
 // Function: setBlurOffsets
@@ -5769,23 +5769,23 @@ function finishChange () {
 // filter - The filter DOM element to update
 // stdDev - The standard deviation value on which to base the offset size
 canvas.setBlurOffsets = function (filter, stdDev) {
-	if (stdDev > 3) {
-		// TODO: Create algorithm here where size is based on expected blur
-		svgedit.utilities.assignAttributes(filter, {
-			x: '-50%',
-			y: '-50%',
-			width: '200%',
-			height: '200%'
-		}, 100);
-	} else {
-		// Removing these attributes hides text in Chrome (see Issue 579)
-		if (!svgedit.browser.isWebkit()) {
-			filter.removeAttribute('x');
-			filter.removeAttribute('y');
-			filter.removeAttribute('width');
-			filter.removeAttribute('height');
-		}
-	}
+  if (stdDev > 3) {
+    // TODO: Create algorithm here where size is based on expected blur
+    svgedit.utilities.assignAttributes(filter, {
+      x: '-50%',
+      y: '-50%',
+      width: '200%',
+      height: '200%'
+    }, 100);
+  } else {
+    // Removing these attributes hides text in Chrome (see Issue 579)
+    if (!svgedit.browser.isWebkit()) {
+      filter.removeAttribute('x');
+      filter.removeAttribute('y');
+      filter.removeAttribute('width');
+      filter.removeAttribute('height');
+    }
+  }
 };
 
 // Function: setBlur
@@ -5795,64 +5795,64 @@ canvas.setBlurOffsets = function (filter, stdDev) {
 // val - Float with the new stdDeviation blur value
 // complete - Boolean indicating whether or not the action should be completed (to add to the undo manager)
 canvas.setBlur = function (val, complete) {
-	if (curCommand) {
-		finishChange();
-		return;
-	}
+  if (curCommand) {
+    finishChange();
+    return;
+  }
 
-	// Looks for associated blur, creates one if not found
-	var elem = selectedElements[0];
-	var elemId = elem.id;
-	filter = svgedit.utilities.getElem(elemId + '_blur');
+  // Looks for associated blur, creates one if not found
+  var elem = selectedElements[0];
+  var elemId = elem.id;
+  filter = svgedit.utilities.getElem(elemId + '_blur');
 
-	val -= 0;
+  val -= 0;
 
-	var batchCmd = new svgedit.history.BatchCommand();
+  var batchCmd = new svgedit.history.BatchCommand();
 
-	// Blur found!
-	if (filter) {
-		if (val === 0) {
-			filter = null;
-		}
-	} else {
-		// Not found, so create
-		var newblur = addSvgElementFromJson({ 'element': 'feGaussianBlur',
-			'attr': {
-				'in': 'SourceGraphic',
-				'stdDeviation': val
-			}
-		});
+  // Blur found!
+  if (filter) {
+    if (val === 0) {
+      filter = null;
+    }
+  } else {
+    // Not found, so create
+    var newblur = addSvgElementFromJson({ 'element': 'feGaussianBlur',
+      'attr': {
+        'in': 'SourceGraphic',
+        'stdDeviation': val
+      }
+    });
 
-		filter = addSvgElementFromJson({ 'element': 'filter',
-			'attr': {
-				'id': elemId + '_blur'
-			}
-		});
+    filter = addSvgElementFromJson({ 'element': 'filter',
+      'attr': {
+        'id': elemId + '_blur'
+      }
+    });
 
-		filter.appendChild(newblur);
-		svgedit.utilities.findDefs().appendChild(filter);
+    filter.appendChild(newblur);
+    svgedit.utilities.findDefs().appendChild(filter);
 
-		batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(filter));
-	}
+    batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(filter));
+  }
 
-	var changes = {filter: elem.getAttribute('filter')};
+  var changes = {filter: elem.getAttribute('filter')};
 
-	if (val === 0) {
-		elem.removeAttribute('filter');
-		batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
-		return;
-	}
+  if (val === 0) {
+    elem.removeAttribute('filter');
+    batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
+    return;
+  }
 
-	changeSelectedAttribute('filter', 'url(#' + elemId + '_blur)');
-	batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
-	canvas.setBlurOffsets(filter, val);
+  changeSelectedAttribute('filter', 'url(#' + elemId + '_blur)');
+  batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
+  canvas.setBlurOffsets(filter, val);
 
-	curCommand = batchCmd;
-	canvas.undoMgr.beginUndoableChange('stdDeviation', [filter ? filter.firstChild : null]);
-	if (complete) {
-		canvas.setBlurNoUndo(val);
-		finishChange();
-	}
+  curCommand = batchCmd;
+  canvas.undoMgr.beginUndoableChange('stdDeviation', [filter ? filter.firstChild : null]);
+  if (complete) {
+    canvas.setBlurNoUndo(val);
+    finishChange();
+  }
 };
 }());
 
@@ -5862,13 +5862,13 @@ canvas.setBlur = function (val, complete) {
 // Returns:
 // Boolean indicating whether or not element is bold
 this.getBold = function () {
-	// should only have one element selected
-	var selected = selectedElements[0];
-	if (selected != null && selected.tagName === 'text' &&
-		selectedElements[1] == null) {
-		return (selected.getAttribute('font-weight') === 'bold');
-	}
-	return false;
+  // should only have one element selected
+  var selected = selectedElements[0];
+  if (selected != null && selected.tagName === 'text' &&
+    selectedElements[1] == null) {
+    return (selected.getAttribute('font-weight') === 'bold');
+  }
+  return false;
 };
 
 // Function: setBold
@@ -5877,14 +5877,14 @@ this.getBold = function () {
 // Parameters:
 // b - Boolean indicating bold (true) or normal (false)
 this.setBold = function (b) {
-	var selected = selectedElements[0];
-	if (selected != null && selected.tagName === 'text' &&
-		selectedElements[1] == null) {
-		changeSelectedAttribute('font-weight', b ? 'bold' : 'normal');
-	}
-	if (!selectedElements[0].textContent) {
-		textActions.setCursor();
-	}
+  var selected = selectedElements[0];
+  if (selected != null && selected.tagName === 'text' &&
+    selectedElements[1] == null) {
+    changeSelectedAttribute('font-weight', b ? 'bold' : 'normal');
+  }
+  if (!selectedElements[0].textContent) {
+    textActions.setCursor();
+  }
 };
 
 // Function: getItalic
@@ -5893,12 +5893,12 @@ this.setBold = function (b) {
 // Returns:
 // Boolean indicating whether or not element is italic
 this.getItalic = function () {
-	var selected = selectedElements[0];
-	if (selected != null && selected.tagName === 'text' &&
-		selectedElements[1] == null) {
-		return (selected.getAttribute('font-style') === 'italic');
-	}
-	return false;
+  var selected = selectedElements[0];
+  if (selected != null && selected.tagName === 'text' &&
+    selectedElements[1] == null) {
+    return (selected.getAttribute('font-style') === 'italic');
+  }
+  return false;
 };
 
 // Function: setItalic
@@ -5907,20 +5907,20 @@ this.getItalic = function () {
 // Parameters:
 // b - Boolean indicating italic (true) or normal (false)
 this.setItalic = function (i) {
-	var selected = selectedElements[0];
-	if (selected != null && selected.tagName === 'text' &&
-		selectedElements[1] == null) {
-		changeSelectedAttribute('font-style', i ? 'italic' : 'normal');
-	}
-	if (!selectedElements[0].textContent) {
-		textActions.setCursor();
-	}
+  var selected = selectedElements[0];
+  if (selected != null && selected.tagName === 'text' &&
+    selectedElements[1] == null) {
+    changeSelectedAttribute('font-style', i ? 'italic' : 'normal');
+  }
+  if (!selectedElements[0].textContent) {
+    textActions.setCursor();
+  }
 };
 
 // Function: getFontFamily
 // Returns the current font family
 this.getFontFamily = function () {
-	return curText.font_family;
+  return curText.font_family;
 };
 
 // Function: setFontFamily
@@ -5929,11 +5929,11 @@ this.getFontFamily = function () {
 // Parameters:
 // val - String with the new font family
 this.setFontFamily = function (val) {
-	curText.font_family = val;
-	changeSelectedAttribute('font-family', val);
-	if (selectedElements[0] && !selectedElements[0].textContent) {
-		textActions.setCursor();
-	}
+  curText.font_family = val;
+  changeSelectedAttribute('font-family', val);
+  if (selectedElements[0] && !selectedElements[0].textContent) {
+    textActions.setCursor();
+  }
 };
 
 // Function: setFontColor
@@ -5942,20 +5942,20 @@ this.setFontFamily = function (val) {
 // Parameters:
 // val - String with the new font color
 this.setFontColor = function (val) {
-	curText.fill = val;
-	changeSelectedAttribute('fill', val);
+  curText.fill = val;
+  changeSelectedAttribute('fill', val);
 };
 
 // Function: getFontColor
 // Returns the current font color
 this.getFontColor = function () {
-	return curText.fill;
+  return curText.fill;
 };
 
 // Function: getFontSize
 // Returns the current font size
 this.getFontSize = function () {
-	return curText.font_size;
+  return curText.font_size;
 };
 
 // Function: setFontSize
@@ -5964,19 +5964,19 @@ this.getFontSize = function () {
 // Parameters:
 // val - Float with the new font size
 this.setFontSize = function (val) {
-	curText.font_size = val;
-	changeSelectedAttribute('font-size', val);
-	if (!selectedElements[0].textContent) {
-		textActions.setCursor();
-	}
+  curText.font_size = val;
+  changeSelectedAttribute('font-size', val);
+  if (!selectedElements[0].textContent) {
+    textActions.setCursor();
+  }
 };
 
 // Function: getText
 // Returns the current text (textContent) of the selected element
 this.getText = function () {
-	var selected = selectedElements[0];
-	if (selected == null) { return ''; }
-	return selected.textContent;
+  var selected = selectedElements[0];
+  if (selected == null) { return ''; }
+  return selected.textContent;
 };
 
 // Function: setTextContent
@@ -5985,9 +5985,9 @@ this.getText = function () {
 // Parameters:
 // val - String with the new text
 this.setTextContent = function (val) {
-	changeSelectedAttribute('#text', val);
-	textActions.init(val);
-	textActions.setCursor();
+  changeSelectedAttribute('#text', val);
+  textActions.init(val);
+  textActions.setCursor();
 };
 
 // Function: setImageURL
@@ -5997,44 +5997,44 @@ this.setTextContent = function (val) {
 // Parameters:
 // val - String with the image URL/path
 this.setImageURL = function (val) {
-	var elem = selectedElements[0];
-	if (!elem) { return; }
+  var elem = selectedElements[0];
+  if (!elem) { return; }
 
-	var attrs = $(elem).attr(['width', 'height']);
-	var setsize = (!attrs.width || !attrs.height);
+  var attrs = $(elem).attr(['width', 'height']);
+  var setsize = (!attrs.width || !attrs.height);
 
-	var curHref = getHref(elem);
+  var curHref = getHref(elem);
 
-	// Do nothing if no URL change or size change
-	if (curHref !== val) {
-		setsize = true;
-	} else if (!setsize) { return; }
+  // Do nothing if no URL change or size change
+  if (curHref !== val) {
+    setsize = true;
+  } else if (!setsize) { return; }
 
-	var batchCmd = new svgedit.history.BatchCommand('Change Image URL');
+  var batchCmd = new svgedit.history.BatchCommand('Change Image URL');
 
-	setHref(elem, val);
-	batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, {
-		'#href': curHref
-	}));
+  setHref(elem, val);
+  batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, {
+    '#href': curHref
+  }));
 
-	if (setsize) {
-		$(new Image()).load(function () {
-			var changes = $(elem).attr(['width', 'height']);
+  if (setsize) {
+    $(new Image()).load(function () {
+      var changes = $(elem).attr(['width', 'height']);
 
-			$(elem).attr({
-				width: this.width,
-				height: this.height
-			});
+      $(elem).attr({
+        width: this.width,
+        height: this.height
+      });
 
-			selectorManager.requestSelector(elem).resize();
+      selectorManager.requestSelector(elem).resize();
 
-			batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
-			addCommandToHistory(batchCmd);
-			call('changed', [elem]);
-		}).attr('src', val);
-	} else {
-		addCommandToHistory(batchCmd);
-	}
+      batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, changes));
+      addCommandToHistory(batchCmd);
+      call('changed', [elem]);
+    }).attr('src', val);
+  } else {
+    addCommandToHistory(batchCmd);
+  }
 };
 
 // Function: setLinkURL
@@ -6043,30 +6043,30 @@ this.setImageURL = function (val) {
 // Parameters:
 // val - String with the link URL/path
 this.setLinkURL = function (val) {
-	var elem = selectedElements[0];
-	if (!elem) { return; }
-	if (elem.tagName !== 'a') {
-		// See if parent is an anchor
-		var parentsA = $(elem).parents('a');
-		if (parentsA.length) {
-			elem = parentsA[0];
-		} else {
-			return;
-		}
-	}
+  var elem = selectedElements[0];
+  if (!elem) { return; }
+  if (elem.tagName !== 'a') {
+    // See if parent is an anchor
+    var parentsA = $(elem).parents('a');
+    if (parentsA.length) {
+      elem = parentsA[0];
+    } else {
+      return;
+    }
+  }
 
-	var curHref = getHref(elem);
+  var curHref = getHref(elem);
 
-	if (curHref === val) { return; }
+  if (curHref === val) { return; }
 
-	var batchCmd = new svgedit.history.BatchCommand('Change Link URL');
+  var batchCmd = new svgedit.history.BatchCommand('Change Link URL');
 
-	setHref(elem, val);
-	batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, {
-		'#href': curHref
-	}));
+  setHref(elem, val);
+  batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(elem, {
+    '#href': curHref
+  }));
 
-	addCommandToHistory(batchCmd);
+  addCommandToHistory(batchCmd);
 };
 
 // Function: setRectRadius
@@ -6075,30 +6075,30 @@ this.setLinkURL = function (val) {
 // Parameters:
 // val - The new radius
 this.setRectRadius = function (val) {
-	var selected = selectedElements[0];
-	if (selected != null && selected.tagName === 'rect') {
-		var r = selected.getAttribute('rx');
-		if (r !== String(val)) {
-			selected.setAttribute('rx', val);
-			selected.setAttribute('ry', val);
-			addCommandToHistory(new svgedit.history.ChangeElementCommand(selected, {'rx': r, 'ry': r}, 'Radius'));
-			call('changed', [selected]);
-		}
-	}
+  var selected = selectedElements[0];
+  if (selected != null && selected.tagName === 'rect') {
+    var r = selected.getAttribute('rx');
+    if (r !== String(val)) {
+      selected.setAttribute('rx', val);
+      selected.setAttribute('ry', val);
+      addCommandToHistory(new svgedit.history.ChangeElementCommand(selected, {'rx': r, 'ry': r}, 'Radius'));
+      call('changed', [selected]);
+    }
+  }
 };
 
 // Function: makeHyperlink
 // Wraps the selected element(s) in an anchor element or converts group to one
 this.makeHyperlink = function (url) {
-	canvas.groupSelectedElements('a', url);
+  canvas.groupSelectedElements('a', url);
 
-	// TODO: If element is a single "g", convert to "a"
-	//	if (selectedElements.length > 1 && selectedElements[1]) {
+  // TODO: If element is a single "g", convert to "a"
+  //	if (selectedElements.length > 1 && selectedElements[1]) {
 };
 
 // Function: removeHyperlink
 this.removeHyperlink = function () {
-	canvas.ungroupSelectedElement();
+  canvas.ungroupSelectedElement();
 };
 
 // Group: Element manipulation
@@ -6110,7 +6110,7 @@ this.removeHyperlink = function () {
 // new_type - Integer with the new segment type
 // See http://www.w3.org/TR/SVG/paths.html#InterfaceSVGPathSeg for list
 this.setSegType = function (newType) {
-	pathActions.setSegType(newType);
+  pathActions.setSegType(newType);
 };
 
 // TODO(codedread): Remove the getBBox argument and split this function into two.
@@ -6125,32 +6125,32 @@ this.setSegType = function (newType) {
 // If the getBBox flag is true, the resulting path's bounding box object.
 // Otherwise the resulting path element is returned.
 this.convertToPath = function (elem, getBBox) {
-	if (elem == null) {
-		var elems = selectedElements;
-		$.each(elems, function (i, elem) {
-			if (elem) { canvas.convertToPath(elem); }
-		});
-		return;
-	}
-	if (getBBox) {
-		return svgedit.utilities.getBBoxOfElementAsPath(elem, addSvgElementFromJson, pathActions);
-	} else {
-		// TODO: Why is this applying attributes from curShape, then inside utilities.convertToPath it's pulling addition attributes from elem?
-		// TODO: If convertToPath is called with one elem, curShape and elem are probably the same; but calling with multiple is a bug or cool feature.
-		var attrs = {
-			'fill': curShape.fill,
-			'fill-opacity': curShape.fill_opacity,
-			'stroke': curShape.stroke,
-			'stroke-width': curShape.stroke_width,
-			'stroke-dasharray': curShape.stroke_dasharray,
-			'stroke-linejoin': curShape.stroke_linejoin,
-			'stroke-linecap': curShape.stroke_linecap,
-			'stroke-opacity': curShape.stroke_opacity,
-			'opacity': curShape.opacity,
-			'visibility': 'hidden'
-		};
-		return svgedit.utilities.convertToPath(elem, attrs, addSvgElementFromJson, pathActions, clearSelection, addToSelection, svgedit.history, addCommandToHistory);
-	}
+  if (elem == null) {
+    var elems = selectedElements;
+    $.each(elems, function (i, elem) {
+      if (elem) { canvas.convertToPath(elem); }
+    });
+    return;
+  }
+  if (getBBox) {
+    return svgedit.utilities.getBBoxOfElementAsPath(elem, addSvgElementFromJson, pathActions);
+  } else {
+    // TODO: Why is this applying attributes from curShape, then inside utilities.convertToPath it's pulling addition attributes from elem?
+    // TODO: If convertToPath is called with one elem, curShape and elem are probably the same; but calling with multiple is a bug or cool feature.
+    var attrs = {
+      'fill': curShape.fill,
+      'fill-opacity': curShape.fill_opacity,
+      'stroke': curShape.stroke,
+      'stroke-width': curShape.stroke_width,
+      'stroke-dasharray': curShape.stroke_dasharray,
+      'stroke-linejoin': curShape.stroke_linejoin,
+      'stroke-linecap': curShape.stroke_linecap,
+      'stroke-opacity': curShape.stroke_opacity,
+      'opacity': curShape.opacity,
+      'visibility': 'hidden'
+    };
+    return svgedit.utilities.convertToPath(elem, attrs, addSvgElementFromJson, pathActions, clearSelection, addToSelection, svgedit.history, addCommandToHistory);
+  }
 };
 
 // Function: changeSelectedAttributeNoUndo
@@ -6162,116 +6162,116 @@ this.convertToPath = function (elem, getBBox) {
 // newValue - String or number with the new attribute value
 // elems - The DOM elements to apply the change to
 var changeSelectedAttributeNoUndo = function (attr, newValue, elems) {
-	if (currentMode === 'pathedit') {
-		// Editing node
-		pathActions.moveNode(attr, newValue);
-	}
-	elems = elems || selectedElements;
-	var i = elems.length;
-	var noXYElems = ['g', 'polyline', 'path'];
-	var goodGAttrs = ['transform', 'opacity', 'filter'];
+  if (currentMode === 'pathedit') {
+    // Editing node
+    pathActions.moveNode(attr, newValue);
+  }
+  elems = elems || selectedElements;
+  var i = elems.length;
+  var noXYElems = ['g', 'polyline', 'path'];
+  var goodGAttrs = ['transform', 'opacity', 'filter'];
 
-	while (i--) {
-		var elem = elems[i];
-		if (elem == null) { continue; }
+  while (i--) {
+    var elem = elems[i];
+    if (elem == null) { continue; }
 
-		// Set x,y vals on elements that don't have them
-		if ((attr === 'x' || attr === 'y') && noXYElems.indexOf(elem.tagName) >= 0) {
-			var bbox = getStrokedBBox([elem]);
-			var diffX = attr === 'x' ? newValue - bbox.x : 0;
-			var diffY = attr === 'y' ? newValue - bbox.y : 0;
-			canvas.moveSelectedElements(diffX * currentZoom, diffY * currentZoom, true);
-			continue;
-		}
+    // Set x,y vals on elements that don't have them
+    if ((attr === 'x' || attr === 'y') && noXYElems.indexOf(elem.tagName) >= 0) {
+      var bbox = getStrokedBBox([elem]);
+      var diffX = attr === 'x' ? newValue - bbox.x : 0;
+      var diffY = attr === 'y' ? newValue - bbox.y : 0;
+      canvas.moveSelectedElements(diffX * currentZoom, diffY * currentZoom, true);
+      continue;
+    }
 
-		// only allow the transform/opacity/filter attribute to change on <g> elements, slightly hacky
-		// TODO: FIXME: This doesn't seem right. Where's the body of this if statement?
-		if (elem.tagName === 'g' && goodGAttrs.indexOf(attr) >= 0) {}
-		var oldval = attr === '#text' ? elem.textContent : elem.getAttribute(attr);
-		if (oldval == null) { oldval = ''; }
-		if (oldval !== String(newValue)) {
-			if (attr === '#text') {
-				// var oldW = svgedit.utilities.getBBox(elem).width;
-				elem.textContent = newValue;
+    // only allow the transform/opacity/filter attribute to change on <g> elements, slightly hacky
+    // TODO: FIXME: This doesn't seem right. Where's the body of this if statement?
+    if (elem.tagName === 'g' && goodGAttrs.indexOf(attr) >= 0) {}
+    var oldval = attr === '#text' ? elem.textContent : elem.getAttribute(attr);
+    if (oldval == null) { oldval = ''; }
+    if (oldval !== String(newValue)) {
+      if (attr === '#text') {
+        // var oldW = svgedit.utilities.getBBox(elem).width;
+        elem.textContent = newValue;
 
-				// FF bug occurs on on rotated elements
-				if ((/rotate/).test(elem.getAttribute('transform'))) {
-					elem = ffClone(elem);
-				}
-				// Hoped to solve the issue of moving text with text-anchor="start",
-				// but this doesn't actually fix it. Hopefully on the right track, though. -Fyrd
-				// var box = getBBox(elem), left = box.x, top = box.y, width = box.width,
-				// 	height = box.height, dx = width - oldW, dy = 0;
-				// var angle = svgedit.utilities.getRotationAngle(elem, true);
-				// if (angle) {
-				// 	var r = Math.sqrt(dx * dx + dy * dy);
-				// 	var theta = Math.atan2(dy, dx) - angle;
-				// 	dx = r * Math.cos(theta);
-				// 	dy = r * Math.sin(theta);
-				//
-				// 	elem.setAttribute('x', elem.getAttribute('x') - dx);
-				// 	elem.setAttribute('y', elem.getAttribute('y') - dy);
-				// }
-			} else if (attr === '#href') {
-				setHref(elem, newValue);
-			} else { elem.setAttribute(attr, newValue); }
+        // FF bug occurs on on rotated elements
+        if ((/rotate/).test(elem.getAttribute('transform'))) {
+          elem = ffClone(elem);
+        }
+        // Hoped to solve the issue of moving text with text-anchor="start",
+        // but this doesn't actually fix it. Hopefully on the right track, though. -Fyrd
+        // var box = getBBox(elem), left = box.x, top = box.y, width = box.width,
+        // 	height = box.height, dx = width - oldW, dy = 0;
+        // var angle = svgedit.utilities.getRotationAngle(elem, true);
+        // if (angle) {
+        // 	var r = Math.sqrt(dx * dx + dy * dy);
+        // 	var theta = Math.atan2(dy, dx) - angle;
+        // 	dx = r * Math.cos(theta);
+        // 	dy = r * Math.sin(theta);
+        //
+        // 	elem.setAttribute('x', elem.getAttribute('x') - dx);
+        // 	elem.setAttribute('y', elem.getAttribute('y') - dy);
+        // }
+      } else if (attr === '#href') {
+        setHref(elem, newValue);
+      } else { elem.setAttribute(attr, newValue); }
 
-			// Go into "select" mode for text changes
-			// NOTE: Important that this happens AFTER elem.setAttribute() or else attributes like
-			// font-size can get reset to their old value, ultimately by svgEditor.updateContextPanel(),
-			// after calling textActions.toSelectMode() below
-			if (currentMode === 'textedit' && attr !== '#text' && elem.textContent.length) {
-				textActions.toSelectMode(elem);
-			}
+      // Go into "select" mode for text changes
+      // NOTE: Important that this happens AFTER elem.setAttribute() or else attributes like
+      // font-size can get reset to their old value, ultimately by svgEditor.updateContextPanel(),
+      // after calling textActions.toSelectMode() below
+      if (currentMode === 'textedit' && attr !== '#text' && elem.textContent.length) {
+        textActions.toSelectMode(elem);
+      }
 
-			// if (i === 0) {
-			// 	selectedBBoxes[0] = svgedit.utilities.getBBox(elem);
-			// }
+      // if (i === 0) {
+      // 	selectedBBoxes[0] = svgedit.utilities.getBBox(elem);
+      // }
 
-			// Use the Firefox ffClone hack for text elements with gradients or
-			// where other text attributes are changed.
-			if (svgedit.browser.isGecko() && elem.nodeName === 'text' && (/rotate/).test(elem.getAttribute('transform'))) {
-				if (String(newValue).indexOf('url') === 0 || (['font-size', 'font-family', 'x', 'y'].indexOf(attr) >= 0 && elem.textContent)) {
-					elem = ffClone(elem);
-				}
-			}
-			// Timeout needed for Opera & Firefox
-			// codedread: it is now possible for this function to be called with elements
-			// that are not in the selectedElements array, we need to only request a
-			// selector if the element is in that array
-			if (selectedElements.indexOf(elem) >= 0) {
-				setTimeout(function () {
-					// Due to element replacement, this element may no longer
-					// be part of the DOM
-					if (!elem.parentNode) { return; }
-					selectorManager.requestSelector(elem).resize();
-				}, 0);
-			}
-			// if this element was rotated, and we changed the position of this element
-			// we need to update the rotational transform attribute
-			var angle = svgedit.utilities.getRotationAngle(elem);
-			if (angle !== 0 && attr !== 'transform') {
-				var tlist = svgedit.transformlist.getTransformList(elem);
-				var n = tlist.numberOfItems;
-				while (n--) {
-					var xform = tlist.getItem(n);
-					if (xform.type === 4) {
-						// remove old rotate
-						tlist.removeItem(n);
+      // Use the Firefox ffClone hack for text elements with gradients or
+      // where other text attributes are changed.
+      if (svgedit.browser.isGecko() && elem.nodeName === 'text' && (/rotate/).test(elem.getAttribute('transform'))) {
+        if (String(newValue).indexOf('url') === 0 || (['font-size', 'font-family', 'x', 'y'].indexOf(attr) >= 0 && elem.textContent)) {
+          elem = ffClone(elem);
+        }
+      }
+      // Timeout needed for Opera & Firefox
+      // codedread: it is now possible for this function to be called with elements
+      // that are not in the selectedElements array, we need to only request a
+      // selector if the element is in that array
+      if (selectedElements.indexOf(elem) >= 0) {
+        setTimeout(function () {
+          // Due to element replacement, this element may no longer
+          // be part of the DOM
+          if (!elem.parentNode) { return; }
+          selectorManager.requestSelector(elem).resize();
+        }, 0);
+      }
+      // if this element was rotated, and we changed the position of this element
+      // we need to update the rotational transform attribute
+      var angle = svgedit.utilities.getRotationAngle(elem);
+      if (angle !== 0 && attr !== 'transform') {
+        var tlist = svgedit.transformlist.getTransformList(elem);
+        var n = tlist.numberOfItems;
+        while (n--) {
+          var xform = tlist.getItem(n);
+          if (xform.type === 4) {
+            // remove old rotate
+            tlist.removeItem(n);
 
-						var box = svgedit.utilities.getBBox(elem);
-						var center = svgedit.math.transformPoint(box.x + box.width / 2, box.y + box.height / 2, svgedit.math.transformListToTransform(tlist).matrix);
-						var cx = center.x,
-							cy = center.y;
-						var newrot = svgroot.createSVGTransform();
-						newrot.setRotate(angle, cx, cy);
-						tlist.insertItemBefore(newrot, n);
-						break;
-					}
-				}
-			}
-		} // if oldValue != newValue
-	} // for each elem
+            var box = svgedit.utilities.getBBox(elem);
+            var center = svgedit.math.transformPoint(box.x + box.width / 2, box.y + box.height / 2, svgedit.math.transformListToTransform(tlist).matrix);
+            var cx = center.x,
+              cy = center.y;
+            var newrot = svgroot.createSVGTransform();
+            newrot.setRotate(angle, cx, cy);
+            tlist.insertItemBefore(newrot, n);
+            break;
+          }
+        }
+      }
+    } // if oldValue != newValue
+  } // for each elem
 };
 
 // Function: changeSelectedAttribute
@@ -6285,149 +6285,149 @@ var changeSelectedAttributeNoUndo = function (attr, newValue, elems) {
 // newValue - String or number with the new attribute value
 // elems - The DOM elements to apply the change to
 var changeSelectedAttribute = this.changeSelectedAttribute = function (attr, val, elems) {
-	elems = elems || selectedElements;
-	canvas.undoMgr.beginUndoableChange(attr, elems);
-	// var i = elems.length;
+  elems = elems || selectedElements;
+  canvas.undoMgr.beginUndoableChange(attr, elems);
+  // var i = elems.length;
 
-	changeSelectedAttributeNoUndo(attr, val, elems);
+  changeSelectedAttributeNoUndo(attr, val, elems);
 
-	var batchCmd = canvas.undoMgr.finishUndoableChange();
-	if (!batchCmd.isEmpty()) {
-		addCommandToHistory(batchCmd);
-	}
+  var batchCmd = canvas.undoMgr.finishUndoableChange();
+  if (!batchCmd.isEmpty()) {
+    addCommandToHistory(batchCmd);
+  }
 };
 
 // Function: deleteSelectedElements
 // Removes all selected elements from the DOM and adds the change to the
 // history stack
 this.deleteSelectedElements = function () {
-	var i;
-	var batchCmd = new svgedit.history.BatchCommand('Delete Elements');
-	var len = selectedElements.length;
-	var selectedCopy = []; // selectedElements is being deleted
+  var i;
+  var batchCmd = new svgedit.history.BatchCommand('Delete Elements');
+  var len = selectedElements.length;
+  var selectedCopy = []; // selectedElements is being deleted
 
-	for (i = 0; i < len; ++i) {
-		var selected = selectedElements[i];
-		if (selected == null) { break; }
+  for (i = 0; i < len; ++i) {
+    var selected = selectedElements[i];
+    if (selected == null) { break; }
 
-		var parent = selected.parentNode;
-		var t = selected;
+    var parent = selected.parentNode;
+    var t = selected;
 
-		// this will unselect the element and remove the selectedOutline
-		selectorManager.releaseSelector(t);
+    // this will unselect the element and remove the selectedOutline
+    selectorManager.releaseSelector(t);
 
-		// Remove the path if present.
-		svgedit.path.removePath_(t.id);
+    // Remove the path if present.
+    svgedit.path.removePath_(t.id);
 
-		// Get the parent if it's a single-child anchor
-		if (parent.tagName === 'a' && parent.childNodes.length === 1) {
-			t = parent;
-			parent = parent.parentNode;
-		}
+    // Get the parent if it's a single-child anchor
+    if (parent.tagName === 'a' && parent.childNodes.length === 1) {
+      t = parent;
+      parent = parent.parentNode;
+    }
 
-		var nextSibling = t.nextSibling;
-		var elem = parent.removeChild(t);
-		selectedCopy.push(selected); // for the copy
-		batchCmd.addSubCommand(new RemoveElementCommand(elem, nextSibling, parent));
-	}
-	selectedElements = [];
+    var nextSibling = t.nextSibling;
+    var elem = parent.removeChild(t);
+    selectedCopy.push(selected); // for the copy
+    batchCmd.addSubCommand(new RemoveElementCommand(elem, nextSibling, parent));
+  }
+  selectedElements = [];
 
-	if (!batchCmd.isEmpty()) { addCommandToHistory(batchCmd); }
-	call('changed', selectedCopy);
-	clearSelection();
+  if (!batchCmd.isEmpty()) { addCommandToHistory(batchCmd); }
+  call('changed', selectedCopy);
+  clearSelection();
 };
 
 // Function: cutSelectedElements
 // Removes all selected elements from the DOM and adds the change to the
 // history stack. Remembers removed elements on the clipboard
 this.cutSelectedElements = function () {
-	svgCanvas.copySelectedElements();
-	svgCanvas.deleteSelectedElements();
+  svgCanvas.copySelectedElements();
+  svgCanvas.deleteSelectedElements();
 };
 
 // Function: copySelectedElements
 // Remembers the current selected elements on the clipboard
 this.copySelectedElements = function () {
-	localStorage.setItem('svgedit_clipboard', JSON.stringify(
-		selectedElements.map(function (x) { return getJsonFromSvgElement(x); })
-	));
+  localStorage.setItem('svgedit_clipboard', JSON.stringify(
+    selectedElements.map(function (x) { return getJsonFromSvgElement(x); })
+  ));
 
-	$('#cmenu_canvas').enableContextMenuItems('#paste,#paste_in_place');
+  $('#cmenu_canvas').enableContextMenuItems('#paste,#paste_in_place');
 };
 
 this.pasteElements = function (type, x, y) {
-	var cb = JSON.parse(localStorage.getItem('svgedit_clipboard'));
-	var len = cb.length;
-	if (!len) { return; }
+  var cb = JSON.parse(localStorage.getItem('svgedit_clipboard'));
+  var len = cb.length;
+  if (!len) { return; }
 
-	var pasted = [];
-	var batchCmd = new svgedit.history.BatchCommand('Paste elements');
-	// var drawing = getCurrentDrawing();
-	var changedIDs = {};
+  var pasted = [];
+  var batchCmd = new svgedit.history.BatchCommand('Paste elements');
+  // var drawing = getCurrentDrawing();
+  var changedIDs = {};
 
-	// Recursively replace IDs and record the changes
-	function checkIDs (elem) {
-		if (elem.attr && elem.attr.id) {
-			changedIDs[elem.attr.id] = getNextId();
-			elem.attr.id = changedIDs[elem.attr.id];
-		}
-		if (elem.children) elem.children.forEach(checkIDs);
-	}
-	cb.forEach(checkIDs);
+  // Recursively replace IDs and record the changes
+  function checkIDs (elem) {
+    if (elem.attr && elem.attr.id) {
+      changedIDs[elem.attr.id] = getNextId();
+      elem.attr.id = changedIDs[elem.attr.id];
+    }
+    if (elem.children) elem.children.forEach(checkIDs);
+  }
+  cb.forEach(checkIDs);
 
-	// Give extensions like the connector extension a chance to reflect new IDs and remove invalid elements
-	runExtensions('IDsUpdated', {elems: cb, changes: changedIDs}, true).forEach(function (extChanges) {
-		if (!extChanges || !('remove' in extChanges)) return;
+  // Give extensions like the connector extension a chance to reflect new IDs and remove invalid elements
+  runExtensions('IDsUpdated', {elems: cb, changes: changedIDs}, true).forEach(function (extChanges) {
+    if (!extChanges || !('remove' in extChanges)) return;
 
-		extChanges.remove.forEach(function (removeID) {
-			cb = cb.filter(function (cbItem) {
-				return cbItem.attr.id !== removeID;
-			});
-		});
-	});
+    extChanges.remove.forEach(function (removeID) {
+      cb = cb.filter(function (cbItem) {
+        return cbItem.attr.id !== removeID;
+      });
+    });
+  });
 
-	// Move elements to lastClickPoint
-	while (len--) {
-		var elem = cb[len];
-		if (!elem) { continue; }
+  // Move elements to lastClickPoint
+  while (len--) {
+    var elem = cb[len];
+    if (!elem) { continue; }
 
-		var copy = addSvgElementFromJson(elem);
-		pasted.push(copy);
-		batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(copy));
+    var copy = addSvgElementFromJson(elem);
+    pasted.push(copy);
+    batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(copy));
 
-		restoreRefElems(copy);
-	}
+    restoreRefElems(copy);
+  }
 
-	selectOnly(pasted);
+  selectOnly(pasted);
 
-	if (type !== 'in_place') {
-		var ctrX, ctrY;
+  if (type !== 'in_place') {
+    var ctrX, ctrY;
 
-		if (!type) {
-			ctrX = lastClickPoint.x;
-			ctrY = lastClickPoint.y;
-		} else if (type === 'point') {
-			ctrX = x;
-			ctrY = y;
-		}
+    if (!type) {
+      ctrX = lastClickPoint.x;
+      ctrY = lastClickPoint.y;
+    } else if (type === 'point') {
+      ctrX = x;
+      ctrY = y;
+    }
 
-		var bbox = getStrokedBBox(pasted);
-		var cx = ctrX - (bbox.x + bbox.width / 2),
-			cy = ctrY - (bbox.y + bbox.height / 2),
-			dx = [],
-			dy = [];
+    var bbox = getStrokedBBox(pasted);
+    var cx = ctrX - (bbox.x + bbox.width / 2),
+      cy = ctrY - (bbox.y + bbox.height / 2),
+      dx = [],
+      dy = [];
 
-		$.each(pasted, function (i, item) {
-			dx.push(cx);
-			dy.push(cy);
-		});
+    $.each(pasted, function (i, item) {
+      dx.push(cx);
+      dy.push(cy);
+    });
 
-		var cmd = canvas.moveSelectedElements(dx, dy, false);
-		if (cmd) batchCmd.addSubCommand(cmd);
-	}
+    var cmd = canvas.moveSelectedElements(dx, dy, false);
+    if (cmd) batchCmd.addSubCommand(cmd);
+  }
 
-	addCommandToHistory(batchCmd);
-	call('changed', pasted);
+  addCommandToHistory(batchCmd);
+  call('changed', pasted);
 };
 
 // Function: groupSelectedElements
@@ -6436,355 +6436,355 @@ this.pasteElements = function (type, x, y) {
 // Parameters:
 // type - type of element to group into, defaults to <g>
 this.groupSelectedElements = function (type, urlArg) {
-	if (!type) { type = 'g'; }
-	var cmdStr = '';
+  if (!type) { type = 'g'; }
+  var cmdStr = '';
 
-	switch (type) {
-	case 'a':
-		cmdStr = 'Make hyperlink';
-		var url = '';
-		if (arguments.length > 1) {
-			url = urlArg;
-		}
-		break;
-	default:
-		type = 'g';
-		cmdStr = 'Group Elements';
-		break;
-	}
+  switch (type) {
+  case 'a':
+    cmdStr = 'Make hyperlink';
+    var url = '';
+    if (arguments.length > 1) {
+      url = urlArg;
+    }
+    break;
+  default:
+    type = 'g';
+    cmdStr = 'Group Elements';
+    break;
+  }
 
-	var batchCmd = new svgedit.history.BatchCommand(cmdStr);
+  var batchCmd = new svgedit.history.BatchCommand(cmdStr);
 
-	// create and insert the group element
-	var g = addSvgElementFromJson({
-		'element': type,
-		'attr': {
-			'id': getNextId()
-		}
-	});
-	if (type === 'a') {
-		setHref(g, url);
-	}
-	batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(g));
+  // create and insert the group element
+  var g = addSvgElementFromJson({
+    'element': type,
+    'attr': {
+      'id': getNextId()
+    }
+  });
+  if (type === 'a') {
+    setHref(g, url);
+  }
+  batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(g));
 
-	// now move all children into the group
-	var i = selectedElements.length;
-	while (i--) {
-		var elem = selectedElements[i];
-		if (elem == null) { continue; }
+  // now move all children into the group
+  var i = selectedElements.length;
+  while (i--) {
+    var elem = selectedElements[i];
+    if (elem == null) { continue; }
 
-		if (elem.parentNode.tagName === 'a' && elem.parentNode.childNodes.length === 1) {
-			elem = elem.parentNode;
-		}
+    if (elem.parentNode.tagName === 'a' && elem.parentNode.childNodes.length === 1) {
+      elem = elem.parentNode;
+    }
 
-		var oldNextSibling = elem.nextSibling;
-		var oldParent = elem.parentNode;
-		g.appendChild(elem);
-		batchCmd.addSubCommand(new svgedit.history.MoveElementCommand(elem, oldNextSibling, oldParent));
-	}
-	if (!batchCmd.isEmpty()) { addCommandToHistory(batchCmd); }
+    var oldNextSibling = elem.nextSibling;
+    var oldParent = elem.parentNode;
+    g.appendChild(elem);
+    batchCmd.addSubCommand(new svgedit.history.MoveElementCommand(elem, oldNextSibling, oldParent));
+  }
+  if (!batchCmd.isEmpty()) { addCommandToHistory(batchCmd); }
 
-	// update selection
-	selectOnly([g], true);
+  // update selection
+  selectOnly([g], true);
 };
 
 // Function: pushGroupProperties
 // Pushes all appropriate parent group properties down to its children, then
 // removes them from the group
 var pushGroupProperties = this.pushGroupProperties = function (g, undoable) {
-	var children = g.childNodes;
-	var len = children.length;
-	var xform = g.getAttribute('transform');
+  var children = g.childNodes;
+  var len = children.length;
+  var xform = g.getAttribute('transform');
 
-	var glist = svgedit.transformlist.getTransformList(g);
-	var m = svgedit.math.transformListToTransform(glist).matrix;
+  var glist = svgedit.transformlist.getTransformList(g);
+  var m = svgedit.math.transformListToTransform(glist).matrix;
 
-	var batchCmd = new svgedit.history.BatchCommand('Push group properties');
+  var batchCmd = new svgedit.history.BatchCommand('Push group properties');
 
-	// TODO: get all fill/stroke properties from the group that we are about to destroy
-	// "fill", "fill-opacity", "fill-rule", "stroke", "stroke-dasharray", "stroke-dashoffset",
-	// "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity",
-	// "stroke-width"
-	// and then for each child, if they do not have the attribute (or the value is 'inherit')
-	// then set the child's attribute
+  // TODO: get all fill/stroke properties from the group that we are about to destroy
+  // "fill", "fill-opacity", "fill-rule", "stroke", "stroke-dasharray", "stroke-dashoffset",
+  // "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity",
+  // "stroke-width"
+  // and then for each child, if they do not have the attribute (or the value is 'inherit')
+  // then set the child's attribute
 
-	var i = 0;
-	var gangle = svgedit.utilities.getRotationAngle(g);
+  var i = 0;
+  var gangle = svgedit.utilities.getRotationAngle(g);
 
-	var gattrs = $(g).attr(['filter', 'opacity']);
-	var gfilter, gblur, changes;
-	var drawing = getCurrentDrawing();
+  var gattrs = $(g).attr(['filter', 'opacity']);
+  var gfilter, gblur, changes;
+  var drawing = getCurrentDrawing();
 
-	for (i = 0; i < len; i++) {
-		var elem = children[i];
+  for (i = 0; i < len; i++) {
+    var elem = children[i];
 
-		if (elem.nodeType !== 1) { continue; }
+    if (elem.nodeType !== 1) { continue; }
 
-		if (gattrs.opacity !== null && gattrs.opacity !== 1) {
-			// var c_opac = elem.getAttribute('opacity') || 1;
-			var newOpac = Math.round((elem.getAttribute('opacity') || 1) * gattrs.opacity * 100) / 100;
-			changeSelectedAttribute('opacity', newOpac, [elem]);
-		}
+    if (gattrs.opacity !== null && gattrs.opacity !== 1) {
+      // var c_opac = elem.getAttribute('opacity') || 1;
+      var newOpac = Math.round((elem.getAttribute('opacity') || 1) * gattrs.opacity * 100) / 100;
+      changeSelectedAttribute('opacity', newOpac, [elem]);
+    }
 
-		if (gattrs.filter) {
-			var cblur = this.getBlur(elem);
-			var origCblur = cblur;
-			if (!gblur) { gblur = this.getBlur(g); }
-			if (cblur) {
-				// Is this formula correct?
-				cblur = Number(gblur) + Number(cblur);
-			} else if (cblur === 0) {
-				cblur = gblur;
-			}
+    if (gattrs.filter) {
+      var cblur = this.getBlur(elem);
+      var origCblur = cblur;
+      if (!gblur) { gblur = this.getBlur(g); }
+      if (cblur) {
+        // Is this formula correct?
+        cblur = Number(gblur) + Number(cblur);
+      } else if (cblur === 0) {
+        cblur = gblur;
+      }
 
-			// If child has no current filter, get group's filter or clone it.
-			if (!origCblur) {
-				// Set group's filter to use first child's ID
-				if (!gfilter) {
-					gfilter = svgedit.utilities.getRefElem(gattrs.filter);
-				} else {
-					// Clone the group's filter
-					gfilter = drawing.copyElem(gfilter);
-					svgedit.utilities.findDefs().appendChild(gfilter);
-				}
-			} else {
-				gfilter = svgedit.utilities.getRefElem(elem.getAttribute('filter'));
-			}
+      // If child has no current filter, get group's filter or clone it.
+      if (!origCblur) {
+        // Set group's filter to use first child's ID
+        if (!gfilter) {
+          gfilter = svgedit.utilities.getRefElem(gattrs.filter);
+        } else {
+          // Clone the group's filter
+          gfilter = drawing.copyElem(gfilter);
+          svgedit.utilities.findDefs().appendChild(gfilter);
+        }
+      } else {
+        gfilter = svgedit.utilities.getRefElem(elem.getAttribute('filter'));
+      }
 
-			// Change this in future for different filters
-			var suffix = (gfilter.firstChild.tagName === 'feGaussianBlur') ? 'blur' : 'filter';
-			gfilter.id = elem.id + '_' + suffix;
-			changeSelectedAttribute('filter', 'url(#' + gfilter.id + ')', [elem]);
+      // Change this in future for different filters
+      var suffix = (gfilter.firstChild.tagName === 'feGaussianBlur') ? 'blur' : 'filter';
+      gfilter.id = elem.id + '_' + suffix;
+      changeSelectedAttribute('filter', 'url(#' + gfilter.id + ')', [elem]);
 
-			// Update blur value
-			if (cblur) {
-				changeSelectedAttribute('stdDeviation', cblur, [gfilter.firstChild]);
-				canvas.setBlurOffsets(gfilter, cblur);
-			}
-		}
+      // Update blur value
+      if (cblur) {
+        changeSelectedAttribute('stdDeviation', cblur, [gfilter.firstChild]);
+        canvas.setBlurOffsets(gfilter, cblur);
+      }
+    }
 
-		var chtlist = svgedit.transformlist.getTransformList(elem);
+    var chtlist = svgedit.transformlist.getTransformList(elem);
 
-		// Don't process gradient transforms
-		if (~elem.tagName.indexOf('Gradient')) { chtlist = null; }
+    // Don't process gradient transforms
+    if (~elem.tagName.indexOf('Gradient')) { chtlist = null; }
 
-		// Hopefully not a problem to add this. Necessary for elements like <desc/>
-		if (!chtlist) { continue; }
+    // Hopefully not a problem to add this. Necessary for elements like <desc/>
+    if (!chtlist) { continue; }
 
-		// Apparently <defs> can get get a transformlist, but we don't want it to have one!
-		if (elem.tagName === 'defs') { continue; }
+    // Apparently <defs> can get get a transformlist, but we don't want it to have one!
+    if (elem.tagName === 'defs') { continue; }
 
-		if (glist.numberOfItems) {
-			// TODO: if the group's transform is just a rotate, we can always transfer the
-			// rotate() down to the children (collapsing consecutive rotates and factoring
-			// out any translates)
-			if (gangle && glist.numberOfItems === 1) {
-				// [Rg] [Rc] [Mc]
-				// we want [Tr] [Rc2] [Mc] where:
-				//	- [Rc2] is at the child's current center but has the
-				// sum of the group and child's rotation angles
-				//	- [Tr] is the equivalent translation that this child
-				// undergoes if the group wasn't there
+    if (glist.numberOfItems) {
+      // TODO: if the group's transform is just a rotate, we can always transfer the
+      // rotate() down to the children (collapsing consecutive rotates and factoring
+      // out any translates)
+      if (gangle && glist.numberOfItems === 1) {
+        // [Rg] [Rc] [Mc]
+        // we want [Tr] [Rc2] [Mc] where:
+        //	- [Rc2] is at the child's current center but has the
+        // sum of the group and child's rotation angles
+        //	- [Tr] is the equivalent translation that this child
+        // undergoes if the group wasn't there
 
-				// [Tr] = [Rg] [Rc] [Rc2_inv]
+        // [Tr] = [Rg] [Rc] [Rc2_inv]
 
-				// get group's rotation matrix (Rg)
-				var rgm = glist.getItem(0).matrix;
+        // get group's rotation matrix (Rg)
+        var rgm = glist.getItem(0).matrix;
 
-				// get child's rotation matrix (Rc)
-				var rcm = svgroot.createSVGMatrix();
-				var cangle = svgedit.utilities.getRotationAngle(elem);
-				if (cangle) {
-					rcm = chtlist.getItem(0).matrix;
-				}
+        // get child's rotation matrix (Rc)
+        var rcm = svgroot.createSVGMatrix();
+        var cangle = svgedit.utilities.getRotationAngle(elem);
+        if (cangle) {
+          rcm = chtlist.getItem(0).matrix;
+        }
 
-				// get child's old center of rotation
-				var cbox = svgedit.utilities.getBBox(elem);
-				var ceqm = svgedit.math.transformListToTransform(chtlist).matrix;
-				var coldc = svgedit.math.transformPoint(cbox.x + cbox.width / 2, cbox.y + cbox.height / 2, ceqm);
+        // get child's old center of rotation
+        var cbox = svgedit.utilities.getBBox(elem);
+        var ceqm = svgedit.math.transformListToTransform(chtlist).matrix;
+        var coldc = svgedit.math.transformPoint(cbox.x + cbox.width / 2, cbox.y + cbox.height / 2, ceqm);
 
-				// sum group and child's angles
-				var sangle = gangle + cangle;
+        // sum group and child's angles
+        var sangle = gangle + cangle;
 
-				// get child's rotation at the old center (Rc2_inv)
-				var r2 = svgroot.createSVGTransform();
-				r2.setRotate(sangle, coldc.x, coldc.y);
+        // get child's rotation at the old center (Rc2_inv)
+        var r2 = svgroot.createSVGTransform();
+        r2.setRotate(sangle, coldc.x, coldc.y);
 
-				// calculate equivalent translate
-				var trm = svgedit.math.matrixMultiply(rgm, rcm, r2.matrix.inverse());
+        // calculate equivalent translate
+        var trm = svgedit.math.matrixMultiply(rgm, rcm, r2.matrix.inverse());
 
-				// set up tlist
-				if (cangle) {
-					chtlist.removeItem(0);
-				}
+        // set up tlist
+        if (cangle) {
+          chtlist.removeItem(0);
+        }
 
-				if (sangle) {
-					if (chtlist.numberOfItems) {
-						chtlist.insertItemBefore(r2, 0);
-					} else {
-						chtlist.appendItem(r2);
-					}
-				}
+        if (sangle) {
+          if (chtlist.numberOfItems) {
+            chtlist.insertItemBefore(r2, 0);
+          } else {
+            chtlist.appendItem(r2);
+          }
+        }
 
-				if (trm.e || trm.f) {
-					var tr = svgroot.createSVGTransform();
-					tr.setTranslate(trm.e, trm.f);
-					if (chtlist.numberOfItems) {
-						chtlist.insertItemBefore(tr, 0);
-					} else {
-						chtlist.appendItem(tr);
-					}
-				}
-			} else { // more complicated than just a rotate
-				// transfer the group's transform down to each child and then
-				// call svgedit.recalculate.recalculateDimensions()
-				var oldxform = elem.getAttribute('transform');
-				changes = {};
-				changes.transform = oldxform || '';
+        if (trm.e || trm.f) {
+          var tr = svgroot.createSVGTransform();
+          tr.setTranslate(trm.e, trm.f);
+          if (chtlist.numberOfItems) {
+            chtlist.insertItemBefore(tr, 0);
+          } else {
+            chtlist.appendItem(tr);
+          }
+        }
+      } else { // more complicated than just a rotate
+        // transfer the group's transform down to each child and then
+        // call svgedit.recalculate.recalculateDimensions()
+        var oldxform = elem.getAttribute('transform');
+        changes = {};
+        changes.transform = oldxform || '';
 
-				var newxform = svgroot.createSVGTransform();
+        var newxform = svgroot.createSVGTransform();
 
-				// [ gm ] [ chm ] = [ chm ] [ gm' ]
-				// [ gm' ] = [ chmInv ] [ gm ] [ chm ]
-				var chm = svgedit.math.transformListToTransform(chtlist).matrix,
-					chmInv = chm.inverse();
-				var gm = svgedit.math.matrixMultiply(chmInv, m, chm);
-				newxform.setMatrix(gm);
-				chtlist.appendItem(newxform);
-			}
-			var cmd = svgedit.recalculate.recalculateDimensions(elem);
-			if (cmd) { batchCmd.addSubCommand(cmd); }
-		}
-	}
+        // [ gm ] [ chm ] = [ chm ] [ gm' ]
+        // [ gm' ] = [ chmInv ] [ gm ] [ chm ]
+        var chm = svgedit.math.transformListToTransform(chtlist).matrix,
+          chmInv = chm.inverse();
+        var gm = svgedit.math.matrixMultiply(chmInv, m, chm);
+        newxform.setMatrix(gm);
+        chtlist.appendItem(newxform);
+      }
+      var cmd = svgedit.recalculate.recalculateDimensions(elem);
+      if (cmd) { batchCmd.addSubCommand(cmd); }
+    }
+  }
 
-	// remove transform and make it undo-able
-	if (xform) {
-		changes = {};
-		changes.transform = xform;
-		g.setAttribute('transform', '');
-		g.removeAttribute('transform');
-		batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(g, changes));
-	}
+  // remove transform and make it undo-able
+  if (xform) {
+    changes = {};
+    changes.transform = xform;
+    g.setAttribute('transform', '');
+    g.removeAttribute('transform');
+    batchCmd.addSubCommand(new svgedit.history.ChangeElementCommand(g, changes));
+  }
 
-	if (undoable && !batchCmd.isEmpty()) {
-		return batchCmd;
-	}
+  if (undoable && !batchCmd.isEmpty()) {
+    return batchCmd;
+  }
 };
 
 // Function: ungroupSelectedElement
 // Unwraps all the elements in a selected group (g) element. This requires
 // significant recalculations to apply group's transforms, etc to its children
 this.ungroupSelectedElement = function () {
-	var g = selectedElements[0];
-	if (!g) {
-		return;
-	}
-	if ($(g).data('gsvg') || $(g).data('symbol')) {
-		// Is svg, so actually convert to group
-		convertToGroup(g);
-		return;
-	}
-	if (g.tagName === 'use') {
-		// Somehow doesn't have data set, so retrieve
-		var symbol = svgedit.utilities.getElem(getHref(g).substr(1));
-		$(g).data('symbol', symbol).data('ref', symbol);
-		convertToGroup(g);
-		return;
-	}
-	var parentsA = $(g).parents('a');
-	if (parentsA.length) {
-		g = parentsA[0];
-	}
+  var g = selectedElements[0];
+  if (!g) {
+    return;
+  }
+  if ($(g).data('gsvg') || $(g).data('symbol')) {
+    // Is svg, so actually convert to group
+    convertToGroup(g);
+    return;
+  }
+  if (g.tagName === 'use') {
+    // Somehow doesn't have data set, so retrieve
+    var symbol = svgedit.utilities.getElem(getHref(g).substr(1));
+    $(g).data('symbol', symbol).data('ref', symbol);
+    convertToGroup(g);
+    return;
+  }
+  var parentsA = $(g).parents('a');
+  if (parentsA.length) {
+    g = parentsA[0];
+  }
 
-	// Look for parent "a"
-	if (g.tagName === 'g' || g.tagName === 'a') {
-		var batchCmd = new svgedit.history.BatchCommand('Ungroup Elements');
-		var cmd = pushGroupProperties(g, true);
-		if (cmd) { batchCmd.addSubCommand(cmd); }
+  // Look for parent "a"
+  if (g.tagName === 'g' || g.tagName === 'a') {
+    var batchCmd = new svgedit.history.BatchCommand('Ungroup Elements');
+    var cmd = pushGroupProperties(g, true);
+    if (cmd) { batchCmd.addSubCommand(cmd); }
 
-		var parent = g.parentNode;
-		var anchor = g.nextSibling;
-		var children = new Array(g.childNodes.length);
+    var parent = g.parentNode;
+    var anchor = g.nextSibling;
+    var children = new Array(g.childNodes.length);
 
-		var i = 0;
+    var i = 0;
 
-		while (g.firstChild) {
-			var elem = g.firstChild;
-			var oldNextSibling = elem.nextSibling;
-			var oldParent = elem.parentNode;
+    while (g.firstChild) {
+      var elem = g.firstChild;
+      var oldNextSibling = elem.nextSibling;
+      var oldParent = elem.parentNode;
 
-			// Remove child title elements
-			if (elem.tagName === 'title') {
-				var nextSibling = elem.nextSibling;
-				batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(elem, nextSibling, oldParent));
-				oldParent.removeChild(elem);
-				continue;
-			}
+      // Remove child title elements
+      if (elem.tagName === 'title') {
+        var nextSibling = elem.nextSibling;
+        batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(elem, nextSibling, oldParent));
+        oldParent.removeChild(elem);
+        continue;
+      }
 
-			children[i++] = elem = parent.insertBefore(elem, anchor);
-			batchCmd.addSubCommand(new svgedit.history.MoveElementCommand(elem, oldNextSibling, oldParent));
-		}
+      children[i++] = elem = parent.insertBefore(elem, anchor);
+      batchCmd.addSubCommand(new svgedit.history.MoveElementCommand(elem, oldNextSibling, oldParent));
+    }
 
-		// remove the group from the selection
-		clearSelection();
+    // remove the group from the selection
+    clearSelection();
 
-		// delete the group element (but make undo-able)
-		var gNextSibling = g.nextSibling;
-		g = parent.removeChild(g);
-		batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(g, gNextSibling, parent));
+    // delete the group element (but make undo-able)
+    var gNextSibling = g.nextSibling;
+    g = parent.removeChild(g);
+    batchCmd.addSubCommand(new svgedit.history.RemoveElementCommand(g, gNextSibling, parent));
 
-		if (!batchCmd.isEmpty()) { addCommandToHistory(batchCmd); }
+    if (!batchCmd.isEmpty()) { addCommandToHistory(batchCmd); }
 
-		// update selection
-		addToSelection(children);
-	}
+    // update selection
+    addToSelection(children);
+  }
 };
 
 // Function: moveToTopSelectedElement
 // Repositions the selected element to the bottom in the DOM to appear on top of
 // other elements
 this.moveToTopSelectedElement = function () {
-	var selected = selectedElements[0];
-	if (selected != null) {
-		var t = selected;
-		var oldParent = t.parentNode;
-		var oldNextSibling = t.nextSibling;
-		t = t.parentNode.appendChild(t);
-		// If the element actually moved position, add the command and fire the changed
-		// event handler.
-		if (oldNextSibling !== t.nextSibling) {
-			addCommandToHistory(new svgedit.history.MoveElementCommand(t, oldNextSibling, oldParent, 'top'));
-			call('changed', [t]);
-		}
-	}
+  var selected = selectedElements[0];
+  if (selected != null) {
+    var t = selected;
+    var oldParent = t.parentNode;
+    var oldNextSibling = t.nextSibling;
+    t = t.parentNode.appendChild(t);
+    // If the element actually moved position, add the command and fire the changed
+    // event handler.
+    if (oldNextSibling !== t.nextSibling) {
+      addCommandToHistory(new svgedit.history.MoveElementCommand(t, oldNextSibling, oldParent, 'top'));
+      call('changed', [t]);
+    }
+  }
 };
 
 // Function: moveToBottomSelectedElement
 // Repositions the selected element to the top in the DOM to appear under
 // other elements
 this.moveToBottomSelectedElement = function () {
-	var selected = selectedElements[0];
-	if (selected != null) {
-		var t = selected;
-		var oldParent = t.parentNode;
-		var oldNextSibling = t.nextSibling;
-		var firstChild = t.parentNode.firstChild;
-		if (firstChild.tagName === 'title') {
-			firstChild = firstChild.nextSibling;
-		}
-		// This can probably be removed, as the defs should not ever apppear
-		// inside a layer group
-		if (firstChild.tagName === 'defs') {
-			firstChild = firstChild.nextSibling;
-		}
-		t = t.parentNode.insertBefore(t, firstChild);
-		// If the element actually moved position, add the command and fire the changed
-		// event handler.
-		if (oldNextSibling !== t.nextSibling) {
-			addCommandToHistory(new svgedit.history.MoveElementCommand(t, oldNextSibling, oldParent, 'bottom'));
-			call('changed', [t]);
-		}
-	}
+  var selected = selectedElements[0];
+  if (selected != null) {
+    var t = selected;
+    var oldParent = t.parentNode;
+    var oldNextSibling = t.nextSibling;
+    var firstChild = t.parentNode.firstChild;
+    if (firstChild.tagName === 'title') {
+      firstChild = firstChild.nextSibling;
+    }
+    // This can probably be removed, as the defs should not ever apppear
+    // inside a layer group
+    if (firstChild.tagName === 'defs') {
+      firstChild = firstChild.nextSibling;
+    }
+    t = t.parentNode.insertBefore(t, firstChild);
+    // If the element actually moved position, add the command and fire the changed
+    // event handler.
+    if (oldNextSibling !== t.nextSibling) {
+      addCommandToHistory(new svgedit.history.MoveElementCommand(t, oldNextSibling, oldParent, 'bottom'));
+      call('changed', [t]);
+    }
+  }
 };
 
 // Function: moveUpDownSelected
@@ -6794,37 +6794,37 @@ this.moveToBottomSelectedElement = function () {
 // Parameters:
 // dir - String that's either 'Up' or 'Down'
 this.moveUpDownSelected = function (dir) {
-	var selected = selectedElements[0];
-	if (!selected) { return; }
+  var selected = selectedElements[0];
+  if (!selected) { return; }
 
-	curBBoxes = [];
-	var closest, foundCur;
-	// jQuery sorts this list
-	var list = $(getIntersectionList(getStrokedBBox([selected]))).toArray();
-	if (dir === 'Down') { list.reverse(); }
+  curBBoxes = [];
+  var closest, foundCur;
+  // jQuery sorts this list
+  var list = $(getIntersectionList(getStrokedBBox([selected]))).toArray();
+  if (dir === 'Down') { list.reverse(); }
 
-	$.each(list, function () {
-		if (!foundCur) {
-			if (this === selected) {
-				foundCur = true;
-			}
-			return;
-		}
-		closest = this;
-		return false;
-	});
-	if (!closest) { return; }
+  $.each(list, function () {
+    if (!foundCur) {
+      if (this === selected) {
+        foundCur = true;
+      }
+      return;
+    }
+    closest = this;
+    return false;
+  });
+  if (!closest) { return; }
 
-	var t = selected;
-	var oldParent = t.parentNode;
-	var oldNextSibling = t.nextSibling;
-	$(closest)[dir === 'Down' ? 'before' : 'after'](t);
-	// If the element actually moved position, add the command and fire the changed
-	// event handler.
-	if (oldNextSibling !== t.nextSibling) {
-		addCommandToHistory(new svgedit.history.MoveElementCommand(t, oldNextSibling, oldParent, 'Move ' + dir));
-		call('changed', [t]);
-	}
+  var t = selected;
+  var oldParent = t.parentNode;
+  var oldNextSibling = t.nextSibling;
+  $(closest)[dir === 'Down' ? 'before' : 'after'](t);
+  // If the element actually moved position, add the command and fire the changed
+  // event handler.
+  if (oldNextSibling !== t.nextSibling) {
+    addCommandToHistory(new svgedit.history.MoveElementCommand(t, oldNextSibling, oldParent, 'Move ' + dir));
+    call('changed', [t]);
+  }
 };
 
 // Function: moveSelectedElements
@@ -6838,101 +6838,101 @@ this.moveUpDownSelected = function (dir) {
 // Returns:
 // Batch command for the move
 this.moveSelectedElements = function (dx, dy, undoable) {
-	// if undoable is not sent, default to true
-	// if single values, scale them to the zoom
-	if (dx.constructor !== Array) {
-		dx /= currentZoom;
-		dy /= currentZoom;
-	}
-	undoable = undoable || true;
-	var batchCmd = new svgedit.history.BatchCommand('position');
-	var i = selectedElements.length;
-	while (i--) {
-		var selected = selectedElements[i];
-		if (selected != null) {
-			// if (i === 0) {
-			// 	selectedBBoxes[0] = svgedit.utilities.getBBox(selected);
-			// }
-			// var b = {};
-			// for (var j in selectedBBoxes[i]) b[j] = selectedBBoxes[i][j];
-			// selectedBBoxes[i] = b;
+  // if undoable is not sent, default to true
+  // if single values, scale them to the zoom
+  if (dx.constructor !== Array) {
+    dx /= currentZoom;
+    dy /= currentZoom;
+  }
+  undoable = undoable || true;
+  var batchCmd = new svgedit.history.BatchCommand('position');
+  var i = selectedElements.length;
+  while (i--) {
+    var selected = selectedElements[i];
+    if (selected != null) {
+      // if (i === 0) {
+      // 	selectedBBoxes[0] = svgedit.utilities.getBBox(selected);
+      // }
+      // var b = {};
+      // for (var j in selectedBBoxes[i]) b[j] = selectedBBoxes[i][j];
+      // selectedBBoxes[i] = b;
 
-			var xform = svgroot.createSVGTransform();
-			var tlist = svgedit.transformlist.getTransformList(selected);
+      var xform = svgroot.createSVGTransform();
+      var tlist = svgedit.transformlist.getTransformList(selected);
 
-			// dx and dy could be arrays
-			if (dx.constructor === Array) {
-				// if (i === 0) {
-				// 	selectedBBoxes[0].x += dx[0];
-				// 	selectedBBoxes[0].y += dy[0];
-				// }
-				xform.setTranslate(dx[i], dy[i]);
-			} else {
-				// if (i === 0) {
-				// 	selectedBBoxes[0].x += dx;
-				// 	selectedBBoxes[0].y += dy;
-				// }
-				xform.setTranslate(dx, dy);
-			}
+      // dx and dy could be arrays
+      if (dx.constructor === Array) {
+        // if (i === 0) {
+        // 	selectedBBoxes[0].x += dx[0];
+        // 	selectedBBoxes[0].y += dy[0];
+        // }
+        xform.setTranslate(dx[i], dy[i]);
+      } else {
+        // if (i === 0) {
+        // 	selectedBBoxes[0].x += dx;
+        // 	selectedBBoxes[0].y += dy;
+        // }
+        xform.setTranslate(dx, dy);
+      }
 
-			if (tlist.numberOfItems) {
-				tlist.insertItemBefore(xform, 0);
-			} else {
-				tlist.appendItem(xform);
-			}
+      if (tlist.numberOfItems) {
+        tlist.insertItemBefore(xform, 0);
+      } else {
+        tlist.appendItem(xform);
+      }
 
-			var cmd = svgedit.recalculate.recalculateDimensions(selected);
-			if (cmd) {
-				batchCmd.addSubCommand(cmd);
-			}
+      var cmd = svgedit.recalculate.recalculateDimensions(selected);
+      if (cmd) {
+        batchCmd.addSubCommand(cmd);
+      }
 
-			selectorManager.requestSelector(selected).resize();
-		}
-	}
-	if (!batchCmd.isEmpty()) {
-		if (undoable) {
-			addCommandToHistory(batchCmd);
-		}
-		call('changed', selectedElements);
-		return batchCmd;
-	}
+      selectorManager.requestSelector(selected).resize();
+    }
+  }
+  if (!batchCmd.isEmpty()) {
+    if (undoable) {
+      addCommandToHistory(batchCmd);
+    }
+    call('changed', selectedElements);
+    return batchCmd;
+  }
 };
 
 // Function: cloneSelectedElements
 // Create deep DOM copies (clones) of all selected elements and move them slightly
 // from their originals
 this.cloneSelectedElements = function (x, y) {
-	var i, elem;
-	var batchCmd = new svgedit.history.BatchCommand('Clone Elements');
-	// find all the elements selected (stop at first null)
-	var len = selectedElements.length;
-	function sortfunction (a, b) {
-		return ($(b).index() - $(a).index()); // causes an array to be sorted numerically and ascending
-	}
-	selectedElements.sort(sortfunction);
-	for (i = 0; i < len; ++i) {
-		elem = selectedElements[i];
-		if (elem == null) { break; }
-	}
-	// use slice to quickly get the subset of elements we need
-	var copiedElements = selectedElements.slice(0, i);
-	this.clearSelection(true);
-	// note that we loop in the reverse way because of the way elements are added
-	// to the selectedElements array (top-first)
-	var drawing = getCurrentDrawing();
-	i = copiedElements.length;
-	while (i--) {
-		// clone each element and replace it within copiedElements
-		elem = copiedElements[i] = drawing.copyElem(copiedElements[i]);
-		(currentGroup || drawing.getCurrentLayer()).appendChild(elem);
-		batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(elem));
-	}
+  var i, elem;
+  var batchCmd = new svgedit.history.BatchCommand('Clone Elements');
+  // find all the elements selected (stop at first null)
+  var len = selectedElements.length;
+  function sortfunction (a, b) {
+    return ($(b).index() - $(a).index()); // causes an array to be sorted numerically and ascending
+  }
+  selectedElements.sort(sortfunction);
+  for (i = 0; i < len; ++i) {
+    elem = selectedElements[i];
+    if (elem == null) { break; }
+  }
+  // use slice to quickly get the subset of elements we need
+  var copiedElements = selectedElements.slice(0, i);
+  this.clearSelection(true);
+  // note that we loop in the reverse way because of the way elements are added
+  // to the selectedElements array (top-first)
+  var drawing = getCurrentDrawing();
+  i = copiedElements.length;
+  while (i--) {
+    // clone each element and replace it within copiedElements
+    elem = copiedElements[i] = drawing.copyElem(copiedElements[i]);
+    (currentGroup || drawing.getCurrentLayer()).appendChild(elem);
+    batchCmd.addSubCommand(new svgedit.history.InsertElementCommand(elem));
+  }
 
-	if (!batchCmd.isEmpty()) {
-		addToSelection(copiedElements.reverse()); // Need to reverse for correct selection-adding
-		this.moveSelectedElements(x, y, false);
-		addCommandToHistory(batchCmd);
-	}
+  if (!batchCmd.isEmpty()) {
+    addToSelection(copiedElements.reverse()); // Need to reverse for correct selection-adding
+    this.moveSelectedElements(x, y, false);
+    addCommandToHistory(batchCmd);
+  }
 };
 
 // Function: alignSelectedElements
@@ -6943,93 +6943,93 @@ this.cloneSelectedElements = function (x, y) {
 // relativeTo - String that must be one of the following:
 // "selected", "largest", "smallest", "page"
 this.alignSelectedElements = function (type, relativeTo) {
-	var i, elem;
-	var bboxes = []; // angles = [];
-	var minx = Number.MAX_VALUE, maxx = Number.MIN_VALUE, miny = Number.MAX_VALUE, maxy = Number.MIN_VALUE;
-	var curwidth = Number.MIN_VALUE, curheight = Number.MIN_VALUE;
-	var len = selectedElements.length;
-	if (!len) { return; }
-	for (i = 0; i < len; ++i) {
-		if (selectedElements[i] == null) { break; }
-		elem = selectedElements[i];
-		bboxes[i] = getStrokedBBox([elem]);
+  var i, elem;
+  var bboxes = []; // angles = [];
+  var minx = Number.MAX_VALUE, maxx = Number.MIN_VALUE, miny = Number.MAX_VALUE, maxy = Number.MIN_VALUE;
+  var curwidth = Number.MIN_VALUE, curheight = Number.MIN_VALUE;
+  var len = selectedElements.length;
+  if (!len) { return; }
+  for (i = 0; i < len; ++i) {
+    if (selectedElements[i] == null) { break; }
+    elem = selectedElements[i];
+    bboxes[i] = getStrokedBBox([elem]);
 
-		// now bbox is axis-aligned and handles rotation
-		switch (relativeTo) {
-		case 'smallest':
-			if (((type === 'l' || type === 'c' || type === 'r') &&
-				(curwidth === Number.MIN_VALUE || curwidth > bboxes[i].width)) ||
-				((type === 't' || type === 'm' || type === 'b') &&
-				(curheight === Number.MIN_VALUE || curheight > bboxes[i].height))
-			) {
-				minx = bboxes[i].x;
-				miny = bboxes[i].y;
-				maxx = bboxes[i].x + bboxes[i].width;
-				maxy = bboxes[i].y + bboxes[i].height;
-				curwidth = bboxes[i].width;
-				curheight = bboxes[i].height;
-			}
-			break;
-		case 'largest':
-			if (((type === 'l' || type === 'c' || type === 'r') &&
-				(curwidth === Number.MIN_VALUE || curwidth < bboxes[i].width)) ||
-				((type === 't' || type === 'm' || type === 'b') &&
-				(curheight === Number.MIN_VALUE || curheight < bboxes[i].height))
-			) {
-				minx = bboxes[i].x;
-				miny = bboxes[i].y;
-				maxx = bboxes[i].x + bboxes[i].width;
-				maxy = bboxes[i].y + bboxes[i].height;
-				curwidth = bboxes[i].width;
-				curheight = bboxes[i].height;
-			}
-			break;
-		default: // 'selected'
-			if (bboxes[i].x < minx) { minx = bboxes[i].x; }
-			if (bboxes[i].y < miny) { miny = bboxes[i].y; }
-			if (bboxes[i].x + bboxes[i].width > maxx) { maxx = bboxes[i].x + bboxes[i].width; }
-			if (bboxes[i].y + bboxes[i].height > maxy) { maxy = bboxes[i].y + bboxes[i].height; }
-			break;
-		}
-	} // loop for each element to find the bbox and adjust min/max
+    // now bbox is axis-aligned and handles rotation
+    switch (relativeTo) {
+    case 'smallest':
+      if (((type === 'l' || type === 'c' || type === 'r') &&
+        (curwidth === Number.MIN_VALUE || curwidth > bboxes[i].width)) ||
+        ((type === 't' || type === 'm' || type === 'b') &&
+        (curheight === Number.MIN_VALUE || curheight > bboxes[i].height))
+      ) {
+        minx = bboxes[i].x;
+        miny = bboxes[i].y;
+        maxx = bboxes[i].x + bboxes[i].width;
+        maxy = bboxes[i].y + bboxes[i].height;
+        curwidth = bboxes[i].width;
+        curheight = bboxes[i].height;
+      }
+      break;
+    case 'largest':
+      if (((type === 'l' || type === 'c' || type === 'r') &&
+        (curwidth === Number.MIN_VALUE || curwidth < bboxes[i].width)) ||
+        ((type === 't' || type === 'm' || type === 'b') &&
+        (curheight === Number.MIN_VALUE || curheight < bboxes[i].height))
+      ) {
+        minx = bboxes[i].x;
+        miny = bboxes[i].y;
+        maxx = bboxes[i].x + bboxes[i].width;
+        maxy = bboxes[i].y + bboxes[i].height;
+        curwidth = bboxes[i].width;
+        curheight = bboxes[i].height;
+      }
+      break;
+    default: // 'selected'
+      if (bboxes[i].x < minx) { minx = bboxes[i].x; }
+      if (bboxes[i].y < miny) { miny = bboxes[i].y; }
+      if (bboxes[i].x + bboxes[i].width > maxx) { maxx = bboxes[i].x + bboxes[i].width; }
+      if (bboxes[i].y + bboxes[i].height > maxy) { maxy = bboxes[i].y + bboxes[i].height; }
+      break;
+    }
+  } // loop for each element to find the bbox and adjust min/max
 
-	if (relativeTo === 'page') {
-		minx = 0;
-		miny = 0;
-		maxx = canvas.contentW;
-		maxy = canvas.contentH;
-	}
+  if (relativeTo === 'page') {
+    minx = 0;
+    miny = 0;
+    maxx = canvas.contentW;
+    maxy = canvas.contentH;
+  }
 
-	var dx = new Array(len);
-	var dy = new Array(len);
-	for (i = 0; i < len; ++i) {
-		if (selectedElements[i] == null) { break; }
-		elem = selectedElements[i];
-		var bbox = bboxes[i];
-		dx[i] = 0;
-		dy[i] = 0;
-		switch (type) {
-		case 'l': // left (horizontal)
-			dx[i] = minx - bbox.x;
-			break;
-		case 'c': // center (horizontal)
-			dx[i] = (minx + maxx) / 2 - (bbox.x + bbox.width / 2);
-			break;
-		case 'r': // right (horizontal)
-			dx[i] = maxx - (bbox.x + bbox.width);
-			break;
-		case 't': // top (vertical)
-			dy[i] = miny - bbox.y;
-			break;
-		case 'm': // middle (vertical)
-			dy[i] = (miny + maxy) / 2 - (bbox.y + bbox.height / 2);
-			break;
-		case 'b': // bottom (vertical)
-			dy[i] = maxy - (bbox.y + bbox.height);
-			break;
-		}
-	}
-	this.moveSelectedElements(dx, dy);
+  var dx = new Array(len);
+  var dy = new Array(len);
+  for (i = 0; i < len; ++i) {
+    if (selectedElements[i] == null) { break; }
+    elem = selectedElements[i];
+    var bbox = bboxes[i];
+    dx[i] = 0;
+    dy[i] = 0;
+    switch (type) {
+    case 'l': // left (horizontal)
+      dx[i] = minx - bbox.x;
+      break;
+    case 'c': // center (horizontal)
+      dx[i] = (minx + maxx) / 2 - (bbox.x + bbox.width / 2);
+      break;
+    case 'r': // right (horizontal)
+      dx[i] = maxx - (bbox.x + bbox.width);
+      break;
+    case 't': // top (vertical)
+      dy[i] = miny - bbox.y;
+      break;
+    case 'm': // middle (vertical)
+      dy[i] = (miny + maxy) / 2 - (bbox.y + bbox.height / 2);
+      break;
+    case 'b': // bottom (vertical)
+      dy[i] = maxy - (bbox.y + bbox.height);
+      break;
+    }
+  }
+  this.moveSelectedElements(dx, dy);
 };
 
 // Group: Additional editor tools
@@ -7053,40 +7053,40 @@ this.contentH = getResolution().h;
 // * d_x - The x position difference
 // * d_y - The y position difference
 this.updateCanvas = function (w, h) {
-	svgroot.setAttribute('width', w);
-	svgroot.setAttribute('height', h);
-	var bg = $('#canvasBackground')[0];
-	var oldX = svgcontent.getAttribute('x');
-	var oldY = svgcontent.getAttribute('y');
-	var x = (w / 2 - this.contentW * currentZoom / 2);
-	var y = (h / 2 - this.contentH * currentZoom / 2);
+  svgroot.setAttribute('width', w);
+  svgroot.setAttribute('height', h);
+  var bg = $('#canvasBackground')[0];
+  var oldX = svgcontent.getAttribute('x');
+  var oldY = svgcontent.getAttribute('y');
+  var x = (w / 2 - this.contentW * currentZoom / 2);
+  var y = (h / 2 - this.contentH * currentZoom / 2);
 
-	svgedit.utilities.assignAttributes(svgcontent, {
-		width: this.contentW * currentZoom,
-		height: this.contentH * currentZoom,
-		'x': x,
-		'y': y,
-		'viewBox': '0 0 ' + this.contentW + ' ' + this.contentH
-	});
+  svgedit.utilities.assignAttributes(svgcontent, {
+    width: this.contentW * currentZoom,
+    height: this.contentH * currentZoom,
+    'x': x,
+    'y': y,
+    'viewBox': '0 0 ' + this.contentW + ' ' + this.contentH
+  });
 
-	svgedit.utilities.assignAttributes(bg, {
-		width: svgcontent.getAttribute('width'),
-		height: svgcontent.getAttribute('height'),
-		x: x,
-		y: y
-	});
+  svgedit.utilities.assignAttributes(bg, {
+    width: svgcontent.getAttribute('width'),
+    height: svgcontent.getAttribute('height'),
+    x: x,
+    y: y
+  });
 
-	var bgImg = svgedit.utilities.getElem('background_image');
-	if (bgImg) {
-		svgedit.utilities.assignAttributes(bgImg, {
-			'width': '100%',
-			'height': '100%'
-		});
-	}
+  var bgImg = svgedit.utilities.getElem('background_image');
+  if (bgImg) {
+    svgedit.utilities.assignAttributes(bgImg, {
+      'width': '100%',
+      'height': '100%'
+    });
+  }
 
-	selectorManager.selectorParentGroup.setAttribute('transform', 'translate(' + x + ',' + y + ')');
-	runExtensions('canvasUpdated', {new_x: x, new_y: y, old_x: oldX, old_y: oldY, d_x: x - oldX, d_y: y - oldY});
-	return {x: x, y: y, old_x: oldX, old_y: oldY, d_x: x - oldX, d_y: y - oldY};
+  selectorManager.selectorParentGroup.setAttribute('transform', 'translate(' + x + ',' + y + ')');
+  runExtensions('canvasUpdated', {new_x: x, new_y: y, old_x: oldX, old_y: oldY, d_x: x - oldX, d_y: y - oldY});
+  return {x: x, y: y, old_x: oldX, old_y: oldY, d_x: x - oldX, d_y: y - oldY};
 };
 
 // Function: setBackground
@@ -7096,26 +7096,26 @@ this.updateCanvas = function (w, h) {
 // color - String with fill color to apply
 // url - URL or path to image to use
 this.setBackground = function (color, url) {
-	var bg = svgedit.utilities.getElem('canvasBackground');
-	var border = $(bg).find('rect')[0];
-	var bgImg = svgedit.utilities.getElem('background_image');
-	border.setAttribute('fill', color);
-	if (url) {
-		if (!bgImg) {
-			bgImg = svgdoc.createElementNS(NS.SVG, 'image');
-			svgedit.utilities.assignAttributes(bgImg, {
-				'id': 'background_image',
-				'width': '100%',
-				'height': '100%',
-				'preserveAspectRatio': 'xMinYMin',
-				'style': 'pointer-events:none'
-			});
-		}
-		setHref(bgImg, url);
-		bg.appendChild(bgImg);
-	} else if (bgImg) {
-		bgImg.parentNode.removeChild(bgImg);
-	}
+  var bg = svgedit.utilities.getElem('canvasBackground');
+  var border = $(bg).find('rect')[0];
+  var bgImg = svgedit.utilities.getElem('background_image');
+  border.setAttribute('fill', color);
+  if (url) {
+    if (!bgImg) {
+      bgImg = svgdoc.createElementNS(NS.SVG, 'image');
+      svgedit.utilities.assignAttributes(bgImg, {
+        'id': 'background_image',
+        'width': '100%',
+        'height': '100%',
+        'preserveAspectRatio': 'xMinYMin',
+        'style': 'pointer-events:none'
+      });
+    }
+    setHref(bgImg, url);
+    bg.appendChild(bgImg);
+  } else if (bgImg) {
+    bgImg.parentNode.removeChild(bgImg);
+  }
 };
 
 // Function: cycleElement
@@ -7124,31 +7124,31 @@ this.setBackground = function (color, url) {
 // Parameters:
 // next - Boolean where true = next and false = previous element
 this.cycleElement = function (next) {
-	var num;
-	var curElem = selectedElements[0];
-	var elem = false;
-	var allElems = getVisibleElements(currentGroup || getCurrentDrawing().getCurrentLayer());
-	if (!allElems.length) { return; }
-	if (curElem == null) {
-		num = next ? allElems.length - 1 : 0;
-		elem = allElems[num];
-	} else {
-		var i = allElems.length;
-		while (i--) {
-			if (allElems[i] === curElem) {
-				num = next ? i - 1 : i + 1;
-				if (num >= allElems.length) {
-					num = 0;
-				} else if (num < 0) {
-					num = allElems.length - 1;
-				}
-				elem = allElems[num];
-				break;
-			}
-		}
-	}
-	selectOnly([elem], true);
-	call('selected', selectedElements);
+  var num;
+  var curElem = selectedElements[0];
+  var elem = false;
+  var allElems = getVisibleElements(currentGroup || getCurrentDrawing().getCurrentLayer());
+  if (!allElems.length) { return; }
+  if (curElem == null) {
+    num = next ? allElems.length - 1 : 0;
+    elem = allElems[num];
+  } else {
+    var i = allElems.length;
+    while (i--) {
+      if (allElems[i] === curElem) {
+        num = next ? i - 1 : i + 1;
+        if (num >= allElems.length) {
+          num = 0;
+        } else if (num < 0) {
+          num = allElems.length - 1;
+        }
+        elem = allElems[num];
+        break;
+      }
+    }
+  }
+  selectOnly([elem], true);
+  call('selected', selectedElements);
 };
 
 this.clear();
@@ -7160,48 +7160,48 @@ this.clear();
 // but currently appears to be the best way to allow testing and provide
 // access to them to plugins.
 this.getPrivateMethods = function () {
-	var obj = {
-		addCommandToHistory: addCommandToHistory,
-		setGradient: setGradient,
-		addSvgElementFromJson: addSvgElementFromJson,
-		assignAttributes: assignAttributes,
-		BatchCommand: BatchCommand,
-		call: call,
-		ChangeElementCommand: ChangeElementCommand,
-		copyElem: function (elem) { return getCurrentDrawing().copyElem(elem); },
-		ffClone: ffClone,
-		findDefs: findDefs,
-		findDuplicateGradient: findDuplicateGradient,
-		getElem: getElem,
-		getId: getId,
-		getIntersectionList: getIntersectionList,
-		getMouseTarget: getMouseTarget,
-		getNextId: getNextId,
-		getPathBBox: getPathBBox,
-		getUrlFromAttr: getUrlFromAttr,
-		hasMatrixTransform: hasMatrixTransform,
-		identifyLayers: identifyLayers,
-		InsertElementCommand: InsertElementCommand,
-		isIdentity: svgedit.math.isIdentity,
-		logMatrix: logMatrix,
-		matrixMultiply: matrixMultiply,
-		MoveElementCommand: MoveElementCommand,
-		preventClickDefault: svgedit.utilities.preventClickDefault,
-		recalculateAllSelectedDimensions: recalculateAllSelectedDimensions,
-		recalculateDimensions: recalculateDimensions,
-		remapElement: remapElement,
-		RemoveElementCommand: RemoveElementCommand,
-		removeUnusedDefElems: removeUnusedDefElems,
-		round: round,
-		runExtensions: runExtensions,
-		sanitizeSvg: sanitizeSvg,
-		SVGEditTransformList: svgedit.transformlist.SVGTransformList,
-		toString: toString,
-		transformBox: svgedit.math.transformBox,
-		transformListToTransform: transformListToTransform,
-		transformPoint: transformPoint,
-		walkTree: svgedit.utilities.walkTree
-	};
-	return obj;
+  var obj = {
+    addCommandToHistory: addCommandToHistory,
+    setGradient: setGradient,
+    addSvgElementFromJson: addSvgElementFromJson,
+    assignAttributes: assignAttributes,
+    BatchCommand: BatchCommand,
+    call: call,
+    ChangeElementCommand: ChangeElementCommand,
+    copyElem: function (elem) { return getCurrentDrawing().copyElem(elem); },
+    ffClone: ffClone,
+    findDefs: findDefs,
+    findDuplicateGradient: findDuplicateGradient,
+    getElem: getElem,
+    getId: getId,
+    getIntersectionList: getIntersectionList,
+    getMouseTarget: getMouseTarget,
+    getNextId: getNextId,
+    getPathBBox: getPathBBox,
+    getUrlFromAttr: getUrlFromAttr,
+    hasMatrixTransform: hasMatrixTransform,
+    identifyLayers: identifyLayers,
+    InsertElementCommand: InsertElementCommand,
+    isIdentity: svgedit.math.isIdentity,
+    logMatrix: logMatrix,
+    matrixMultiply: matrixMultiply,
+    MoveElementCommand: MoveElementCommand,
+    preventClickDefault: svgedit.utilities.preventClickDefault,
+    recalculateAllSelectedDimensions: recalculateAllSelectedDimensions,
+    recalculateDimensions: recalculateDimensions,
+    remapElement: remapElement,
+    RemoveElementCommand: RemoveElementCommand,
+    removeUnusedDefElems: removeUnusedDefElems,
+    round: round,
+    runExtensions: runExtensions,
+    sanitizeSvg: sanitizeSvg,
+    SVGEditTransformList: svgedit.transformlist.SVGTransformList,
+    toString: toString,
+    transformBox: svgedit.math.transformBox,
+    transformListToTransform: transformListToTransform,
+    transformPoint: transformPoint,
+    walkTree: svgedit.utilities.walkTree
+  };
+  return obj;
 };
 };
diff --git a/editor/svgedit.js b/editor/svgedit.js
index e8611567..065155cc 100644
--- a/editor/svgedit.js
+++ b/editor/svgedit.js
@@ -7,24 +7,24 @@
  */
 
 svgedit = {
-	// common namepaces constants in alpha order
-	NS: {
-		HTML: 'http://www.w3.org/1999/xhtml',
-		MATH: 'http://www.w3.org/1998/Math/MathML',
-		SE: 'http://svg-edit.googlecode.com',
-		SVG: 'http://www.w3.org/2000/svg',
-		XLINK: 'http://www.w3.org/1999/xlink',
-		XML: 'http://www.w3.org/XML/1998/namespace',
-		XMLNS: 'http://www.w3.org/2000/xmlns/' // see http://www.w3.org/TR/REC-xml-names/#xmlReserved
-	}
+  // common namepaces constants in alpha order
+  NS: {
+    HTML: 'http://www.w3.org/1999/xhtml',
+    MATH: 'http://www.w3.org/1998/Math/MathML',
+    SE: 'http://svg-edit.googlecode.com',
+    SVG: 'http://www.w3.org/2000/svg',
+    XLINK: 'http://www.w3.org/1999/xlink',
+    XML: 'http://www.w3.org/XML/1998/namespace',
+    XMLNS: 'http://www.w3.org/2000/xmlns/' // see http://www.w3.org/TR/REC-xml-names/#xmlReserved
+  }
 };
 
 // return the svgedit.NS with key values switched and lowercase
 svgedit.getReverseNS = function () {
-	'use strict';
-	var reverseNS = {};
-	$.each(this.NS, function (name, URI) {
-		reverseNS[URI] = name.toLowerCase();
-	});
-	return reverseNS;
+  'use strict';
+  var reverseNS = {};
+  $.each(this.NS, function (name, URI) {
+    reverseNS[URI] = name.toLowerCase();
+  });
+  return reverseNS;
 };
diff --git a/editor/svgtransformlist.js b/editor/svgtransformlist.js
index d9603a07..02aeb439 100644
--- a/editor/svgtransformlist.js
+++ b/editor/svgtransformlist.js
@@ -16,41 +16,41 @@
 'use strict';
 
 if (!svgedit.transformlist) {
-	svgedit.transformlist = {};
+  svgedit.transformlist = {};
 }
 
 var svgroot = document.createElementNS(svgedit.NS.SVG, 'svg');
 
 // Helper function.
 function transformToString (xform) {
-	var m = xform.matrix,
-		text = '';
-	switch (xform.type) {
-	case 1: // MATRIX
-		text = 'matrix(' + [m.a, m.b, m.c, m.d, m.e, m.f].join(',') + ')';
-		break;
-	case 2: // TRANSLATE
-		text = 'translate(' + m.e + ',' + m.f + ')';
-		break;
-	case 3: // SCALE
-		if (m.a === m.d) {
-			text = 'scale(' + m.a + ')';
-		} else {
-			text = 'scale(' + m.a + ',' + m.d + ')';
-		}
-		break;
-	case 4: // ROTATE
-		var cx = 0, cy = 0;
-		// this prevents divide by zero
-		if (xform.angle !== 0) {
-			var K = 1 - m.a;
-			cy = (K * m.f + m.b * m.e) / (K * K + m.b * m.b);
-			cx = (m.e - m.b * cy) / K;
-		}
-		text = 'rotate(' + xform.angle + ' ' + cx + ',' + cy + ')';
-		break;
-	}
-	return text;
+  var m = xform.matrix,
+    text = '';
+  switch (xform.type) {
+  case 1: // MATRIX
+    text = 'matrix(' + [m.a, m.b, m.c, m.d, m.e, m.f].join(',') + ')';
+    break;
+  case 2: // TRANSLATE
+    text = 'translate(' + m.e + ',' + m.f + ')';
+    break;
+  case 3: // SCALE
+    if (m.a === m.d) {
+      text = 'scale(' + m.a + ')';
+    } else {
+      text = 'scale(' + m.a + ',' + m.d + ')';
+    }
+    break;
+  case 4: // ROTATE
+    var cx = 0, cy = 0;
+    // this prevents divide by zero
+    if (xform.angle !== 0) {
+      var K = 1 - m.a;
+      cy = (K * m.f + m.b * m.e) / (K * K + m.b * m.b);
+      cx = (m.e - m.b * cy) / K;
+    }
+    text = 'rotate(' + xform.angle + ' ' + cx + ',' + cy + ')';
+    break;
+  }
+  return text;
 }
 
 /**
@@ -78,176 +78,176 @@ var listMap_ = {};
 //	}
 // **************************************************************************************
 svgedit.transformlist.SVGTransformList = function (elem) {
-	this._elem = elem || null;
-	this._xforms = [];
-	// TODO: how do we capture the undo-ability in the changed transform list?
-	this._update = function () {
-		var tstr = '';
-		/* var concatMatrix = */ svgroot.createSVGMatrix();
-		var i;
-		for (i = 0; i < this.numberOfItems; ++i) {
-			var xform = this._list.getItem(i);
-			tstr += transformToString(xform) + ' ';
-		}
-		this._elem.setAttribute('transform', tstr);
-	};
-	this._list = this;
-	this._init = function () {
-		// Transform attribute parser
-		var str = this._elem.getAttribute('transform');
-		if (!str) { return; }
+  this._elem = elem || null;
+  this._xforms = [];
+  // TODO: how do we capture the undo-ability in the changed transform list?
+  this._update = function () {
+    var tstr = '';
+    /* var concatMatrix = */ svgroot.createSVGMatrix();
+    var i;
+    for (i = 0; i < this.numberOfItems; ++i) {
+      var xform = this._list.getItem(i);
+      tstr += transformToString(xform) + ' ';
+    }
+    this._elem.setAttribute('transform', tstr);
+  };
+  this._list = this;
+  this._init = function () {
+    // Transform attribute parser
+    var str = this._elem.getAttribute('transform');
+    if (!str) { return; }
 
-		// TODO: Add skew support in future
-		var re = /\s*((scale|matrix|rotate|translate)\s*\(.*?\))\s*,?\s*/;
-		var m = true;
-		while (m) {
-			m = str.match(re);
-			str = str.replace(re, '');
-			if (m && m[1]) {
-				var x = m[1];
-				var bits = x.split(/\s*\(/);
-				var name = bits[0];
-				var valBits = bits[1].match(/\s*(.*?)\s*\)/);
-				valBits[1] = valBits[1].replace(/(\d)-/g, '$1 -');
-				var valArr = valBits[1].split(/[, ]+/);
-				var letters = 'abcdef'.split('');
-				var mtx = svgroot.createSVGMatrix();
-				$.each(valArr, function (i, item) {
-					valArr[i] = parseFloat(item);
-					if (name === 'matrix') {
-						mtx[letters[i]] = valArr[i];
-					}
-				});
-				var xform = svgroot.createSVGTransform();
-				var fname = 'set' + name.charAt(0).toUpperCase() + name.slice(1);
-				var values = name === 'matrix' ? [mtx] : valArr;
+    // TODO: Add skew support in future
+    var re = /\s*((scale|matrix|rotate|translate)\s*\(.*?\))\s*,?\s*/;
+    var m = true;
+    while (m) {
+      m = str.match(re);
+      str = str.replace(re, '');
+      if (m && m[1]) {
+        var x = m[1];
+        var bits = x.split(/\s*\(/);
+        var name = bits[0];
+        var valBits = bits[1].match(/\s*(.*?)\s*\)/);
+        valBits[1] = valBits[1].replace(/(\d)-/g, '$1 -');
+        var valArr = valBits[1].split(/[, ]+/);
+        var letters = 'abcdef'.split('');
+        var mtx = svgroot.createSVGMatrix();
+        $.each(valArr, function (i, item) {
+          valArr[i] = parseFloat(item);
+          if (name === 'matrix') {
+            mtx[letters[i]] = valArr[i];
+          }
+        });
+        var xform = svgroot.createSVGTransform();
+        var fname = 'set' + name.charAt(0).toUpperCase() + name.slice(1);
+        var values = name === 'matrix' ? [mtx] : valArr;
 
-				if (name === 'scale' && values.length === 1) {
-					values.push(values[0]);
-				} else if (name === 'translate' && values.length === 1) {
-					values.push(0);
-				} else if (name === 'rotate' && values.length === 1) {
-					values.push(0, 0);
-				}
-				xform[fname].apply(xform, values);
-				this._list.appendItem(xform);
-			}
-		}
-	};
-	this._removeFromOtherLists = function (item) {
-		if (item) {
-			// Check if this transform is already in a transformlist, and
-			// remove it if so.
-			var found = false;
-			var id;
-			for (id in listMap_) {
-				var tl = listMap_[id];
-				var i, len;
-				for (i = 0, len = tl._xforms.length; i < len; ++i) {
-					if (tl._xforms[i] === item) {
-						found = true;
-						tl.removeItem(i);
-						break;
-					}
-				}
-				if (found) {
-					break;
-				}
-			}
-		}
-	};
+        if (name === 'scale' && values.length === 1) {
+          values.push(values[0]);
+        } else if (name === 'translate' && values.length === 1) {
+          values.push(0);
+        } else if (name === 'rotate' && values.length === 1) {
+          values.push(0, 0);
+        }
+        xform[fname].apply(xform, values);
+        this._list.appendItem(xform);
+      }
+    }
+  };
+  this._removeFromOtherLists = function (item) {
+    if (item) {
+      // Check if this transform is already in a transformlist, and
+      // remove it if so.
+      var found = false;
+      var id;
+      for (id in listMap_) {
+        var tl = listMap_[id];
+        var i, len;
+        for (i = 0, len = tl._xforms.length; i < len; ++i) {
+          if (tl._xforms[i] === item) {
+            found = true;
+            tl.removeItem(i);
+            break;
+          }
+        }
+        if (found) {
+          break;
+        }
+      }
+    }
+  };
 
-	this.numberOfItems = 0;
-	this.clear = function () {
-		this.numberOfItems = 0;
-		this._xforms = [];
-	};
+  this.numberOfItems = 0;
+  this.clear = function () {
+    this.numberOfItems = 0;
+    this._xforms = [];
+  };
 
-	this.initialize = function (newItem) {
-		this.numberOfItems = 1;
-		this._removeFromOtherLists(newItem);
-		this._xforms = [newItem];
-	};
+  this.initialize = function (newItem) {
+    this.numberOfItems = 1;
+    this._removeFromOtherLists(newItem);
+    this._xforms = [newItem];
+  };
 
-	this.getItem = function (index) {
-		if (index < this.numberOfItems && index >= 0) {
-			return this._xforms[index];
-		}
-		var err = new Error('DOMException with code=INDEX_SIZE_ERR');
-		err.code = 1;
-		throw err;
-	};
+  this.getItem = function (index) {
+    if (index < this.numberOfItems && index >= 0) {
+      return this._xforms[index];
+    }
+    var err = new Error('DOMException with code=INDEX_SIZE_ERR');
+    err.code = 1;
+    throw err;
+  };
 
-	this.insertItemBefore = function (newItem, index) {
-		var retValue = null;
-		if (index >= 0) {
-			if (index < this.numberOfItems) {
-				this._removeFromOtherLists(newItem);
-				var newxforms = new Array(this.numberOfItems + 1);
-				// TODO: use array copying and slicing
-				var i;
-				for (i = 0; i < index; ++i) {
-					newxforms[i] = this._xforms[i];
-				}
-				newxforms[i] = newItem;
-				var j;
-				for (j = i + 1; i < this.numberOfItems; ++j, ++i) {
-					newxforms[j] = this._xforms[i];
-				}
-				this.numberOfItems++;
-				this._xforms = newxforms;
-				retValue = newItem;
-				this._list._update();
-			} else {
-				retValue = this._list.appendItem(newItem);
-			}
-		}
-		return retValue;
-	};
+  this.insertItemBefore = function (newItem, index) {
+    var retValue = null;
+    if (index >= 0) {
+      if (index < this.numberOfItems) {
+        this._removeFromOtherLists(newItem);
+        var newxforms = new Array(this.numberOfItems + 1);
+        // TODO: use array copying and slicing
+        var i;
+        for (i = 0; i < index; ++i) {
+          newxforms[i] = this._xforms[i];
+        }
+        newxforms[i] = newItem;
+        var j;
+        for (j = i + 1; i < this.numberOfItems; ++j, ++i) {
+          newxforms[j] = this._xforms[i];
+        }
+        this.numberOfItems++;
+        this._xforms = newxforms;
+        retValue = newItem;
+        this._list._update();
+      } else {
+        retValue = this._list.appendItem(newItem);
+      }
+    }
+    return retValue;
+  };
 
-	this.replaceItem = function (newItem, index) {
-		var retValue = null;
-		if (index < this.numberOfItems && index >= 0) {
-			this._removeFromOtherLists(newItem);
-			this._xforms[index] = newItem;
-			retValue = newItem;
-			this._list._update();
-		}
-		return retValue;
-	};
+  this.replaceItem = function (newItem, index) {
+    var retValue = null;
+    if (index < this.numberOfItems && index >= 0) {
+      this._removeFromOtherLists(newItem);
+      this._xforms[index] = newItem;
+      retValue = newItem;
+      this._list._update();
+    }
+    return retValue;
+  };
 
-	this.removeItem = function (index) {
-		if (index < this.numberOfItems && index >= 0) {
-			var retValue = this._xforms[index];
-			var newxforms = new Array(this.numberOfItems - 1);
-			var i, j;
-			for (i = 0; i < index; ++i) {
-				newxforms[i] = this._xforms[i];
-			}
-			for (j = i; j < this.numberOfItems - 1; ++j, ++i) {
-				newxforms[j] = this._xforms[i + 1];
-			}
-			this.numberOfItems--;
-			this._xforms = newxforms;
-			this._list._update();
-			return retValue;
-		}
-		var err = new Error('DOMException with code=INDEX_SIZE_ERR');
-		err.code = 1;
-		throw err;
-	};
+  this.removeItem = function (index) {
+    if (index < this.numberOfItems && index >= 0) {
+      var retValue = this._xforms[index];
+      var newxforms = new Array(this.numberOfItems - 1);
+      var i, j;
+      for (i = 0; i < index; ++i) {
+        newxforms[i] = this._xforms[i];
+      }
+      for (j = i; j < this.numberOfItems - 1; ++j, ++i) {
+        newxforms[j] = this._xforms[i + 1];
+      }
+      this.numberOfItems--;
+      this._xforms = newxforms;
+      this._list._update();
+      return retValue;
+    }
+    var err = new Error('DOMException with code=INDEX_SIZE_ERR');
+    err.code = 1;
+    throw err;
+  };
 
-	this.appendItem = function (newItem) {
-		this._removeFromOtherLists(newItem);
-		this._xforms.push(newItem);
-		this.numberOfItems++;
-		this._list._update();
-		return newItem;
-	};
+  this.appendItem = function (newItem) {
+    this._removeFromOtherLists(newItem);
+    this._xforms.push(newItem);
+    this.numberOfItems++;
+    this._list._update();
+    return newItem;
+  };
 };
 
 svgedit.transformlist.resetListMap = function () {
-	listMap_ = {};
+  listMap_ = {};
 };
 
 /**
@@ -256,9 +256,9 @@ svgedit.transformlist.resetListMap = function () {
  * elem - a DOM Element
  */
 svgedit.transformlist.removeElementFromListMap = function (elem) {
-	if (elem.id && listMap_[elem.id]) {
-		delete listMap_[elem.id];
-	}
+  if (elem.id && listMap_[elem.id]) {
+    delete listMap_[elem.id];
+  }
 };
 
 // Function: getTransformList
@@ -267,26 +267,26 @@ svgedit.transformlist.removeElementFromListMap = function (elem) {
 // Parameters:
 // elem - DOM element to get a transformlist from
 svgedit.transformlist.getTransformList = function (elem) {
-	if (!svgedit.browser.supportsNativeTransformLists()) {
-		var id = elem.id || 'temp';
-		var t = listMap_[id];
-		if (!t || id === 'temp') {
-			listMap_[id] = new svgedit.transformlist.SVGTransformList(elem);
-			listMap_[id]._init();
-			t = listMap_[id];
-		}
-		return t;
-	}
-	if (elem.transform) {
-		return elem.transform.baseVal;
-	}
-	if (elem.gradientTransform) {
-		return elem.gradientTransform.baseVal;
-	}
-	if (elem.patternTransform) {
-		return elem.patternTransform.baseVal;
-	}
+  if (!svgedit.browser.supportsNativeTransformLists()) {
+    var id = elem.id || 'temp';
+    var t = listMap_[id];
+    if (!t || id === 'temp') {
+      listMap_[id] = new svgedit.transformlist.SVGTransformList(elem);
+      listMap_[id]._init();
+      t = listMap_[id];
+    }
+    return t;
+  }
+  if (elem.transform) {
+    return elem.transform.baseVal;
+  }
+  if (elem.gradientTransform) {
+    return elem.gradientTransform.baseVal;
+  }
+  if (elem.patternTransform) {
+    return elem.patternTransform.baseVal;
+  }
 
-	return null;
+  return null;
 };
 }());
diff --git a/editor/svgutils.js b/editor/svgutils.js
index 48ea412b..8a9ef172 100644
--- a/editor/svgutils.js
+++ b/editor/svgutils.js
@@ -20,7 +20,7 @@
 'use strict';
 
 if (!svgedit.utilities) {
-	svgedit.utilities = {};
+  svgedit.utilities = {};
 }
 
 // Constants
@@ -40,10 +40,10 @@ var domcontainer_ = null;
 var svgroot_ = null;
 
 svgedit.utilities.init = function (editorContext) {
-	editorContext_ = editorContext;
-	domdoc_ = editorContext.getDOMDocument();
-	domcontainer_ = editorContext.getDOMContainer();
-	svgroot_ = editorContext.getSVGRoot();
+  editorContext_ = editorContext;
+  domdoc_ = editorContext.getDOMDocument();
+  domcontainer_ = editorContext.getDOMContainer();
+  svgroot_ = editorContext.getSVGRoot();
 };
 
 // Function: svgedit.utilities.toXml
@@ -57,9 +57,9 @@ svgedit.utilities.init = function (editorContext) {
 // Returns:
 // The converted string
 svgedit.utilities.toXml = function (str) {
-	// &apos; is ok in XML, but not HTML
-	// &gt; does not normally need escaping, though it can if within a CDATA expression (and preceded by "]]")
-	return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/, '&#x27;');
+  // &apos; is ok in XML, but not HTML
+  // &gt; does not normally need escaping, though it can if within a CDATA expression (and preceded by "]]")
+  return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/, '&#x27;');
 };
 
 // Function: svgedit.utilities.fromXml
@@ -72,7 +72,7 @@ svgedit.utilities.toXml = function (str) {
 // Returns:
 // The converted string
 svgedit.utilities.fromXml = function (str) {
-	return $('<p/>').html(str).text();
+  return $('<p/>').html(str).text();
 };
 
 // This code was written by Tyler Akins and has been placed in the
@@ -85,89 +85,89 @@ svgedit.utilities.fromXml = function (str) {
 // Function: svgedit.utilities.encode64
 // Converts a string to base64
 svgedit.utilities.encode64 = function (input) {
-	// base64 strings are 4/3 larger than the original string
-	input = svgedit.utilities.encodeUTF8(input); // convert non-ASCII characters
-	// input = svgedit.utilities.convertToXMLReferences(input);
-	if (window.btoa) {
-		return window.btoa(input); // Use native if available
-	}
-	var output = [];
-	output.length = Math.floor((input.length + 2) / 3) * 4;
-	var chr1, chr2, chr3;
-	var enc1, enc2, enc3, enc4;
-	var i = 0, p = 0;
+  // base64 strings are 4/3 larger than the original string
+  input = svgedit.utilities.encodeUTF8(input); // convert non-ASCII characters
+  // input = svgedit.utilities.convertToXMLReferences(input);
+  if (window.btoa) {
+    return window.btoa(input); // Use native if available
+  }
+  var output = [];
+  output.length = Math.floor((input.length + 2) / 3) * 4;
+  var chr1, chr2, chr3;
+  var enc1, enc2, enc3, enc4;
+  var i = 0, p = 0;
 
-	do {
-		chr1 = input.charCodeAt(i++);
-		chr2 = input.charCodeAt(i++);
-		chr3 = input.charCodeAt(i++);
+  do {
+    chr1 = input.charCodeAt(i++);
+    chr2 = input.charCodeAt(i++);
+    chr3 = input.charCodeAt(i++);
 
-		enc1 = chr1 >> 2;
-		enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
-		enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
-		enc4 = chr3 & 63;
+    enc1 = chr1 >> 2;
+    enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
+    enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
+    enc4 = chr3 & 63;
 
-		if (isNaN(chr2)) {
-			enc3 = enc4 = 64;
-		} else if (isNaN(chr3)) {
-			enc4 = 64;
-		}
+    if (isNaN(chr2)) {
+      enc3 = enc4 = 64;
+    } else if (isNaN(chr3)) {
+      enc4 = 64;
+    }
 
-		output[p++] = KEYSTR.charAt(enc1);
-		output[p++] = KEYSTR.charAt(enc2);
-		output[p++] = KEYSTR.charAt(enc3);
-		output[p++] = KEYSTR.charAt(enc4);
-	} while (i < input.length);
+    output[p++] = KEYSTR.charAt(enc1);
+    output[p++] = KEYSTR.charAt(enc2);
+    output[p++] = KEYSTR.charAt(enc3);
+    output[p++] = KEYSTR.charAt(enc4);
+  } while (i < input.length);
 
-	return output.join('');
+  return output.join('');
 };
 
 // Function: svgedit.utilities.decode64
 // Converts a string from base64
 svgedit.utilities.decode64 = function (input) {
-	if (window.atob) {
-		return svgedit.utilities.decodeUTF8(window.atob(input));
-	}
-	var output = '';
-	var chr1, chr2, chr3 = '';
-	var enc1, enc2, enc3, enc4 = '';
-	var i = 0;
+  if (window.atob) {
+    return svgedit.utilities.decodeUTF8(window.atob(input));
+  }
+  var output = '';
+  var chr1, chr2, chr3 = '';
+  var enc1, enc2, enc3, enc4 = '';
+  var i = 0;
 
-	// remove all characters that are not A-Z, a-z, 0-9, +, /, or =
-	input = input.replace(/[^A-Za-z0-9+/=]/g, '');
+  // remove all characters that are not A-Z, a-z, 0-9, +, /, or =
+  input = input.replace(/[^A-Za-z0-9+/=]/g, '');
 
-	do {
-		enc1 = KEYSTR.indexOf(input.charAt(i++));
-		enc2 = KEYSTR.indexOf(input.charAt(i++));
-		enc3 = KEYSTR.indexOf(input.charAt(i++));
-		enc4 = KEYSTR.indexOf(input.charAt(i++));
+  do {
+    enc1 = KEYSTR.indexOf(input.charAt(i++));
+    enc2 = KEYSTR.indexOf(input.charAt(i++));
+    enc3 = KEYSTR.indexOf(input.charAt(i++));
+    enc4 = KEYSTR.indexOf(input.charAt(i++));
 
-		chr1 = (enc1 << 2) | (enc2 >> 4);
-		chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
-		chr3 = ((enc3 & 3) << 6) | enc4;
+    chr1 = (enc1 << 2) | (enc2 >> 4);
+    chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+    chr3 = ((enc3 & 3) << 6) | enc4;
 
-		output = output + String.fromCharCode(chr1);
+    output = output + String.fromCharCode(chr1);
 
-		if (enc3 !== 64) {
-			output = output + String.fromCharCode(chr2);
-		}
-		if (enc4 !== 64) {
-			output = output + String.fromCharCode(chr3);
-		}
+    if (enc3 !== 64) {
+      output = output + String.fromCharCode(chr2);
+    }
+    if (enc4 !== 64) {
+      output = output + String.fromCharCode(chr3);
+    }
 
-		chr1 = chr2 = chr3 = '';
-		enc1 = enc2 = enc3 = enc4 = '';
-	} while (i < input.length);
-	return svgedit.utilities.decodeUTF8(output);
+    chr1 = chr2 = chr3 = '';
+    enc1 = enc2 = enc3 = enc4 = '';
+  } while (i < input.length);
+  return svgedit.utilities.decodeUTF8(output);
 };
 
 svgedit.utilities.decodeUTF8 = function (argString) {
-	return decodeURIComponent(escape(argString));
+  return decodeURIComponent(escape(argString));
 };
 
 // codedread:does not seem to work with webkit-based browsers on OSX // Brettz9: please test again as function upgraded
 svgedit.utilities.encodeUTF8 = function (argString) {
-	return unescape(encodeURIComponent(argString));
+  return unescape(encodeURIComponent(argString));
 };
 
 /**
@@ -176,16 +176,16 @@ svgedit.utilities.encodeUTF8 = function (argString) {
  * @return {string} object URL or empty string
  */
 svgedit.utilities.dataURLToObjectURL = function (dataurl) {
-	if (typeof Uint8Array === 'undefined' || typeof Blob === 'undefined' || typeof URL === 'undefined' || !URL.createObjectURL) {
-		return '';
-	}
-	var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
-		bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
-	while (n--) {
-		u8arr[n] = bstr.charCodeAt(n);
-	}
-	var blob = new Blob([u8arr], {type: mime});
-	return URL.createObjectURL(blob);
+  if (typeof Uint8Array === 'undefined' || typeof Blob === 'undefined' || typeof URL === 'undefined' || !URL.createObjectURL) {
+    return '';
+  }
+  var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
+    bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
+  while (n--) {
+    u8arr[n] = bstr.charCodeAt(n);
+  }
+  var blob = new Blob([u8arr], {type: mime});
+  return URL.createObjectURL(blob);
 };
 
 /**
@@ -194,62 +194,62 @@ svgedit.utilities.dataURLToObjectURL = function (dataurl) {
  * @return {string} object URL or empty string
  */
 svgedit.utilities.createObjectURL = function (blob) {
-	if (!blob || typeof URL === 'undefined' || !URL.createObjectURL) {
-		return '';
-	}
-	return URL.createObjectURL(blob);
+  if (!blob || typeof URL === 'undefined' || !URL.createObjectURL) {
+    return '';
+  }
+  return URL.createObjectURL(blob);
 };
 
 /**
  * @property {string} blankPageObjectURL
  */
 svgedit.utilities.blankPageObjectURL = (function () {
-	if (typeof Blob === 'undefined') {
-		return '';
-	}
-	var blob = new Blob(['<html><head><title>SVG-edit</title></head><body>&nbsp;</body></html>'], {type: 'text/html'});
-	return svgedit.utilities.createObjectURL(blob);
+  if (typeof Blob === 'undefined') {
+    return '';
+  }
+  var blob = new Blob(['<html><head><title>SVG-edit</title></head><body>&nbsp;</body></html>'], {type: 'text/html'});
+  return svgedit.utilities.createObjectURL(blob);
 })();
 
 // Function: svgedit.utilities.convertToXMLReferences
 // Converts a string to use XML references
 svgedit.utilities.convertToXMLReferences = function (input) {
-	var n,
-		output = '';
-	for (n = 0; n < input.length; n++) {
-		var c = input.charCodeAt(n);
-		if (c < 128) {
-			output += input[n];
-		} else if (c > 127) {
-			output += ('&#' + c + ';');
-		}
-	}
-	return output;
+  var n,
+    output = '';
+  for (n = 0; n < input.length; n++) {
+    var c = input.charCodeAt(n);
+    if (c < 128) {
+      output += input[n];
+    } else if (c > 127) {
+      output += ('&#' + c + ';');
+    }
+  }
+  return output;
 };
 
 // Function: svgedit.utilities.text2xml
 // Cross-browser compatible method of converting a string to an XML tree
 // found this function here: http://groups.google.com/group/jquery-dev/browse_thread/thread/c6d11387c580a77f
 svgedit.utilities.text2xml = function (sXML) {
-	if (sXML.indexOf('<svg:svg') >= 0) {
-		sXML = sXML.replace(/<(\/?)svg:/g, '<$1').replace('xmlns:svg', 'xmlns');
-	}
+  if (sXML.indexOf('<svg:svg') >= 0) {
+    sXML = sXML.replace(/<(\/?)svg:/g, '<$1').replace('xmlns:svg', 'xmlns');
+  }
 
-	var out, dXML;
-	try {
-		dXML = (window.DOMParser) ? new DOMParser() : new ActiveXObject('Microsoft.XMLDOM');
-		dXML.async = false;
-	} catch (e) {
-		throw new Error('XML Parser could not be instantiated');
-	}
-	try {
-		if (dXML.loadXML) {
-			out = (dXML.loadXML(sXML)) ? dXML : false;
-		} else {
-			out = dXML.parseFromString(sXML, 'text/xml');
-		}
-	} catch (e2) { throw new Error('Error parsing XML string'); }
-	return out;
+  var out, dXML;
+  try {
+    dXML = (window.DOMParser) ? new DOMParser() : new ActiveXObject('Microsoft.XMLDOM');
+    dXML.async = false;
+  } catch (e) {
+    throw new Error('XML Parser could not be instantiated');
+  }
+  try {
+    if (dXML.loadXML) {
+      out = (dXML.loadXML(sXML)) ? dXML : false;
+    } else {
+      out = dXML.parseFromString(sXML, 'text/xml');
+    }
+  } catch (e2) { throw new Error('Error parsing XML string'); }
+  return out;
 };
 
 // Function: svgedit.utilities.bboxToObj
@@ -261,12 +261,12 @@ svgedit.utilities.text2xml = function (sXML) {
 // Returns:
 // An object with properties names x, y, width, height.
 svgedit.utilities.bboxToObj = function (bbox) {
-	return {
-		x: bbox.x,
-		y: bbox.y,
-		width: bbox.width,
-		height: bbox.height
-	};
+  return {
+    x: bbox.x,
+    y: bbox.y,
+    width: bbox.width,
+    height: bbox.height
+  };
 };
 
 // Function: svgedit.utilities.walkTree
@@ -276,13 +276,13 @@ svgedit.utilities.bboxToObj = function (bbox) {
 // elem - DOM element to traverse
 // cbFn - Callback function to run on each element
 svgedit.utilities.walkTree = function (elem, cbFn) {
-	if (elem && elem.nodeType === 1) {
-		cbFn(elem);
-		var i = elem.childNodes.length;
-		while (i--) {
-			svgedit.utilities.walkTree(elem.childNodes.item(i), cbFn);
-		}
-	}
+  if (elem && elem.nodeType === 1) {
+    cbFn(elem);
+    var i = elem.childNodes.length;
+    while (i--) {
+      svgedit.utilities.walkTree(elem.childNodes.item(i), cbFn);
+    }
+  }
 };
 
 // Function: svgedit.utilities.walkTreePost
@@ -293,13 +293,13 @@ svgedit.utilities.walkTree = function (elem, cbFn) {
 // elem - DOM element to traverse
 // cbFn - Callback function to run on each element
 svgedit.utilities.walkTreePost = function (elem, cbFn) {
-	if (elem && elem.nodeType === 1) {
-		var i = elem.childNodes.length;
-		while (i--) {
-			svgedit.utilities.walkTree(elem.childNodes.item(i), cbFn);
-		}
-		cbFn(elem);
-	}
+  if (elem && elem.nodeType === 1) {
+    var i = elem.childNodes.length;
+    while (i--) {
+      svgedit.utilities.walkTree(elem.childNodes.item(i), cbFn);
+    }
+    cbFn(elem);
+  }
 };
 
 // Function: svgedit.utilities.getUrlFromAttr
@@ -315,32 +315,32 @@ svgedit.utilities.walkTreePost = function (elem, cbFn) {
 // Returns:
 // String with just the URL, like someFile.svg#foo
 svgedit.utilities.getUrlFromAttr = function (attrVal) {
-	if (attrVal) {
-		// url("#somegrad")
-		if (attrVal.indexOf('url("') === 0) {
-			return attrVal.substring(5, attrVal.indexOf('"', 6));
-		}
-		// url('#somegrad')
-		if (attrVal.indexOf("url('") === 0) {
-			return attrVal.substring(5, attrVal.indexOf("'", 6));
-		}
-		if (attrVal.indexOf('url(') === 0) {
-			return attrVal.substring(4, attrVal.indexOf(')'));
-		}
-	}
-	return null;
+  if (attrVal) {
+    // url("#somegrad")
+    if (attrVal.indexOf('url("') === 0) {
+      return attrVal.substring(5, attrVal.indexOf('"', 6));
+    }
+    // url('#somegrad')
+    if (attrVal.indexOf("url('") === 0) {
+      return attrVal.substring(5, attrVal.indexOf("'", 6));
+    }
+    if (attrVal.indexOf('url(') === 0) {
+      return attrVal.substring(4, attrVal.indexOf(')'));
+    }
+  }
+  return null;
 };
 
 // Function: svgedit.utilities.getHref
 // Returns the given element's xlink:href value
 svgedit.utilities.getHref = function (elem) {
-	return elem.getAttributeNS(NS.XLINK, 'href');
+  return elem.getAttributeNS(NS.XLINK, 'href');
 };
 
 // Function: svgedit.utilities.setHref
 // Sets the given element's xlink:href value
 svgedit.utilities.setHref = function (elem, val) {
-	elem.setAttributeNS(NS.XLINK, 'xlink:href', val);
+  elem.setAttributeNS(NS.XLINK, 'xlink:href', val);
 };
 
 // Function: findDefs
@@ -348,20 +348,20 @@ svgedit.utilities.setHref = function (elem, val) {
 // Returns:
 // The document's <defs> element, create it first if necessary
 svgedit.utilities.findDefs = function () {
-	var svgElement = editorContext_.getSVGContent();
-	var defs = svgElement.getElementsByTagNameNS(NS.SVG, 'defs');
-	if (defs.length > 0) {
-		defs = defs[0];
-	} else {
-		defs = svgElement.ownerDocument.createElementNS(NS.SVG, 'defs');
-		if (svgElement.firstChild) {
-			// first child is a comment, so call nextSibling
-			svgElement.insertBefore(defs, svgElement.firstChild.nextSibling);
-		} else {
-			svgElement.appendChild(defs);
-		}
-	}
-	return defs;
+  var svgElement = editorContext_.getSVGContent();
+  var defs = svgElement.getElementsByTagNameNS(NS.SVG, 'defs');
+  if (defs.length > 0) {
+    defs = defs[0];
+  } else {
+    defs = svgElement.ownerDocument.createElementNS(NS.SVG, 'defs');
+    if (svgElement.firstChild) {
+      // first child is a comment, so call nextSibling
+      svgElement.insertBefore(defs, svgElement.firstChild.nextSibling);
+    } else {
+      svgElement.appendChild(defs);
+    }
+  }
+  return defs;
 };
 
 // TODO(codedread): Consider moving the next to functions to bbox.js
@@ -377,75 +377,75 @@ svgedit.utilities.findDefs = function () {
 // Returns:
 // A BBox-like object
 svgedit.utilities.getPathBBox = function (path) {
-	var seglist = path.pathSegList;
-	var tot = seglist.numberOfItems;
+  var seglist = path.pathSegList;
+  var tot = seglist.numberOfItems;
 
-	var bounds = [[], []];
-	var start = seglist.getItem(0);
-	var P0 = [start.x, start.y];
+  var bounds = [[], []];
+  var start = seglist.getItem(0);
+  var P0 = [start.x, start.y];
 
-	var i;
-	for (i = 0; i < tot; i++) {
-		var seg = seglist.getItem(i);
+  var i;
+  for (i = 0; i < tot; i++) {
+    var seg = seglist.getItem(i);
 
-		if (seg.x === undef) { continue; }
+    if (seg.x === undef) { continue; }
 
-		// Add actual points to limits
-		bounds[0].push(P0[0]);
-		bounds[1].push(P0[1]);
+    // Add actual points to limits
+    bounds[0].push(P0[0]);
+    bounds[1].push(P0[1]);
 
-		if (seg.x1) {
-			var P1 = [seg.x1, seg.y1],
-				P2 = [seg.x2, seg.y2],
-				P3 = [seg.x, seg.y];
+    if (seg.x1) {
+      var P1 = [seg.x1, seg.y1],
+        P2 = [seg.x2, seg.y2],
+        P3 = [seg.x, seg.y];
 
-			var j;
-			for (j = 0; j < 2; j++) {
-				var calc = function (t) {
-					return Math.pow(1 - t, 3) * P0[j] +
-						3 * Math.pow(1 - t, 2) * t * P1[j] +
-						3 * (1 - t) * Math.pow(t, 2) * P2[j] +
-						Math.pow(t, 3) * P3[j];
-				};
+      var j;
+      for (j = 0; j < 2; j++) {
+        var calc = function (t) {
+          return Math.pow(1 - t, 3) * P0[j] +
+            3 * Math.pow(1 - t, 2) * t * P1[j] +
+            3 * (1 - t) * Math.pow(t, 2) * P2[j] +
+            Math.pow(t, 3) * P3[j];
+        };
 
-				var b = 6 * P0[j] - 12 * P1[j] + 6 * P2[j];
-				var a = -3 * P0[j] + 9 * P1[j] - 9 * P2[j] + 3 * P3[j];
-				var c = 3 * P1[j] - 3 * P0[j];
+        var b = 6 * P0[j] - 12 * P1[j] + 6 * P2[j];
+        var a = -3 * P0[j] + 9 * P1[j] - 9 * P2[j] + 3 * P3[j];
+        var c = 3 * P1[j] - 3 * P0[j];
 
-				if (a === 0) {
-					if (b === 0) {
-						continue;
-					}
-					var t = -c / b;
-					if (t > 0 && t < 1) {
-						bounds[j].push(calc(t));
-					}
-					continue;
-				}
-				var b2ac = Math.pow(b, 2) - 4 * c * a;
-				if (b2ac < 0) { continue; }
-				var t1 = (-b + Math.sqrt(b2ac)) / (2 * a);
-				if (t1 > 0 && t1 < 1) { bounds[j].push(calc(t1)); }
-				var t2 = (-b - Math.sqrt(b2ac)) / (2 * a);
-				if (t2 > 0 && t2 < 1) { bounds[j].push(calc(t2)); }
-			}
-			P0 = P3;
-		} else {
-			bounds[0].push(seg.x);
-			bounds[1].push(seg.y);
-		}
-	}
+        if (a === 0) {
+          if (b === 0) {
+            continue;
+          }
+          var t = -c / b;
+          if (t > 0 && t < 1) {
+            bounds[j].push(calc(t));
+          }
+          continue;
+        }
+        var b2ac = Math.pow(b, 2) - 4 * c * a;
+        if (b2ac < 0) { continue; }
+        var t1 = (-b + Math.sqrt(b2ac)) / (2 * a);
+        if (t1 > 0 && t1 < 1) { bounds[j].push(calc(t1)); }
+        var t2 = (-b - Math.sqrt(b2ac)) / (2 * a);
+        if (t2 > 0 && t2 < 1) { bounds[j].push(calc(t2)); }
+      }
+      P0 = P3;
+    } else {
+      bounds[0].push(seg.x);
+      bounds[1].push(seg.y);
+    }
+  }
 
-	var x = Math.min.apply(null, bounds[0]);
-	var w = Math.max.apply(null, bounds[0]) - x;
-	var y = Math.min.apply(null, bounds[1]);
-	var h = Math.max.apply(null, bounds[1]) - y;
-	return {
-		'x': x,
-		'y': y,
-		'width': w,
-		'height': h
-	};
+  var x = Math.min.apply(null, bounds[0]);
+  var w = Math.max.apply(null, bounds[0]) - x;
+  var y = Math.min.apply(null, bounds[1]);
+  var h = Math.max.apply(null, bounds[1]) - y;
+  return {
+    'x': x,
+    'y': y,
+    'width': w,
+    'height': h
+  };
 };
 
 // Function: groupBBFix
@@ -457,42 +457,42 @@ svgedit.utilities.getPathBBox = function (path) {
 // Parameters:
 // selected - Container or <use> DOM element
 function groupBBFix (selected) {
-	if (svgedit.browser.supportsHVLineContainerBBox()) {
-		try { return selected.getBBox(); } catch (e) {}
-	}
-	var ref = $.data(selected, 'ref');
-	var matched = null;
-	var ret, copy;
+  if (svgedit.browser.supportsHVLineContainerBBox()) {
+    try { return selected.getBBox(); } catch (e) {}
+  }
+  var ref = $.data(selected, 'ref');
+  var matched = null;
+  var ret, copy;
 
-	if (ref) {
-		copy = $(ref).children().clone().attr('visibility', 'hidden');
-		$(svgroot_).append(copy);
-		matched = copy.filter('line, path');
-	} else {
-		matched = $(selected).find('line, path');
-	}
+  if (ref) {
+    copy = $(ref).children().clone().attr('visibility', 'hidden');
+    $(svgroot_).append(copy);
+    matched = copy.filter('line, path');
+  } else {
+    matched = $(selected).find('line, path');
+  }
 
-	var issue = false;
-	if (matched.length) {
-		matched.each(function () {
-			var bb = this.getBBox();
-			if (!bb.width || !bb.height) {
-				issue = true;
-			}
-		});
-		if (issue) {
-			var elems = ref ? copy : $(selected).children();
-			ret = getStrokedBBox(elems); // getStrokedBBox defined in svgcanvas
-		} else {
-			ret = selected.getBBox();
-		}
-	} else {
-		ret = selected.getBBox();
-	}
-	if (ref) {
-		copy.remove();
-	}
-	return ret;
+  var issue = false;
+  if (matched.length) {
+    matched.each(function () {
+      var bb = this.getBBox();
+      if (!bb.width || !bb.height) {
+        issue = true;
+      }
+    });
+    if (issue) {
+      var elems = ref ? copy : $(selected).children();
+      ret = getStrokedBBox(elems); // getStrokedBBox defined in svgcanvas
+    } else {
+      ret = selected.getBBox();
+    }
+  } else {
+    ret = selected.getBBox();
+  }
+  if (ref) {
+    copy.remove();
+  }
+  return ret;
 }
 
 // Function: svgedit.utilities.getBBox
@@ -502,83 +502,83 @@ function groupBBFix (selected) {
 // Parameters:
 // elem - Optional DOM element to get the BBox for
 svgedit.utilities.getBBox = function (elem) {
-	var selected = elem || editorContext_.geSelectedElements()[0];
-	if (elem.nodeType !== 1) { return null; }
-	var ret = null;
-	var elname = selected.nodeName;
+  var selected = elem || editorContext_.geSelectedElements()[0];
+  if (elem.nodeType !== 1) { return null; }
+  var ret = null;
+  var elname = selected.nodeName;
 
-	switch (elname) {
-	case 'text':
-		if (selected.textContent === '') {
-			selected.textContent = 'a'; // Some character needed for the selector to use.
-			ret = selected.getBBox();
-			selected.textContent = '';
-		} else {
-			if (selected.getBBox) { ret = selected.getBBox(); }
-		}
-		break;
-	case 'path':
-		if (!svgedit.browser.supportsPathBBox()) {
-			ret = svgedit.utilities.getPathBBox(selected);
-		} else {
-			if (selected.getBBox) { ret = selected.getBBox(); }
-		}
-		break;
-	case 'g':
-	case 'a':
-		ret = groupBBFix(selected);
-		break;
-	default:
+  switch (elname) {
+  case 'text':
+    if (selected.textContent === '') {
+      selected.textContent = 'a'; // Some character needed for the selector to use.
+      ret = selected.getBBox();
+      selected.textContent = '';
+    } else {
+      if (selected.getBBox) { ret = selected.getBBox(); }
+    }
+    break;
+  case 'path':
+    if (!svgedit.browser.supportsPathBBox()) {
+      ret = svgedit.utilities.getPathBBox(selected);
+    } else {
+      if (selected.getBBox) { ret = selected.getBBox(); }
+    }
+    break;
+  case 'g':
+  case 'a':
+    ret = groupBBFix(selected);
+    break;
+  default:
 
-		if (elname === 'use') {
-			ret = groupBBFix(selected, true);
-		}
-		if (elname === 'use' || (elname === 'foreignObject' && svgedit.browser.isWebkit())) {
-			if (!ret) { ret = selected.getBBox(); }
-			// This is resolved in later versions of webkit, perhaps we should
-			// have a featured detection for correct 'use' behavior?
-			// ——————————
-			if (!svgedit.browser.isWebkit()) {
-				var bb = {};
-				bb.width = ret.width;
-				bb.height = ret.height;
-				bb.x = ret.x + parseFloat(selected.getAttribute('x') || 0);
-				bb.y = ret.y + parseFloat(selected.getAttribute('y') || 0);
-				ret = bb;
-			}
-		} else if (~visElemsArr.indexOf(elname)) {
-			if (selected) {
-				try {
-					ret = selected.getBBox();
-				} catch (err) {
-					// tspan (and textPath apparently) have no `getBBox` in Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=937268
-					// Re: Chrome returning bbox for containing text element, see: https://bugs.chromium.org/p/chromium/issues/detail?id=349835
-					var extent = selected.getExtentOfChar(0); // pos+dimensions of the first glyph
-					var width = selected.getComputedTextLength(); // width of the tspan
-					ret = {
-						x: extent.x,
-						y: extent.y,
-						width: width,
-						height: extent.height
-					};
-				}
-			} else {
-				// Check if element is child of a foreignObject
-				var fo = $(selected).closest('foreignObject');
-				if (fo.length) {
-					if (fo[0].getBBox) {
-						ret = fo[0].getBBox();
-					}
-				}
-			}
-		}
-	}
-	if (ret) {
-		ret = svgedit.utilities.bboxToObj(ret);
-	}
+    if (elname === 'use') {
+      ret = groupBBFix(selected, true);
+    }
+    if (elname === 'use' || (elname === 'foreignObject' && svgedit.browser.isWebkit())) {
+      if (!ret) { ret = selected.getBBox(); }
+      // This is resolved in later versions of webkit, perhaps we should
+      // have a featured detection for correct 'use' behavior?
+      // ——————————
+      if (!svgedit.browser.isWebkit()) {
+        var bb = {};
+        bb.width = ret.width;
+        bb.height = ret.height;
+        bb.x = ret.x + parseFloat(selected.getAttribute('x') || 0);
+        bb.y = ret.y + parseFloat(selected.getAttribute('y') || 0);
+        ret = bb;
+      }
+    } else if (~visElemsArr.indexOf(elname)) {
+      if (selected) {
+        try {
+          ret = selected.getBBox();
+        } catch (err) {
+          // tspan (and textPath apparently) have no `getBBox` in Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=937268
+          // Re: Chrome returning bbox for containing text element, see: https://bugs.chromium.org/p/chromium/issues/detail?id=349835
+          var extent = selected.getExtentOfChar(0); // pos+dimensions of the first glyph
+          var width = selected.getComputedTextLength(); // width of the tspan
+          ret = {
+            x: extent.x,
+            y: extent.y,
+            width: width,
+            height: extent.height
+          };
+        }
+      } else {
+        // Check if element is child of a foreignObject
+        var fo = $(selected).closest('foreignObject');
+        if (fo.length) {
+          if (fo[0].getBBox) {
+            ret = fo[0].getBBox();
+          }
+        }
+      }
+    }
+  }
+  if (ret) {
+    ret = svgedit.utilities.bboxToObj(ret);
+  }
 
-	// get the bounding box from the DOM (which is in that element's coordinate system)
-	return ret;
+  // get the bounding box from the DOM (which is in that element's coordinate system)
+  return ret;
 };
 
 // Function: getPathDFromSegments
@@ -591,18 +591,18 @@ svgedit.utilities.getBBox = function (elem) {
 // Returns:
 // The converted path d attribute.
 svgedit.utilities.getPathDFromSegments = function (pathSegments) {
-	var d = '';
+  var d = '';
 
-	$.each(pathSegments, function (j, seg) {
-		var i;
-		var pts = seg[1];
-		d += seg[0];
-		for (i = 0; i < pts.length; i += 2) {
-			d += (pts[i] + ',' + pts[i + 1]) + ' ';
-		}
-	});
+  $.each(pathSegments, function (j, seg) {
+    var i;
+    var pts = seg[1];
+    d += seg[0];
+    for (i = 0; i < pts.length; i += 2) {
+      d += (pts[i] + ',' + pts[i + 1]) + ' ';
+    }
+  });
 
-	return d;
+  return d;
 };
 
 // Function: getPathDFromElement
@@ -614,80 +614,80 @@ svgedit.utilities.getPathDFromSegments = function (pathSegments) {
 // Returns:
 // The path d attribute or undefined if the element type is unknown.
 svgedit.utilities.getPathDFromElement = function (elem) {
-	// Possibly the cubed root of 6, but 1.81 works best
-	var num = 1.81;
-	var d, a, rx, ry;
-	switch (elem.tagName) {
-	case 'ellipse':
-	case 'circle':
-		a = $(elem).attr(['rx', 'ry', 'cx', 'cy']);
-		var cx = a.cx, cy = a.cy;
-		rx = a.rx;
-		ry = a.ry;
-		if (elem.tagName === 'circle') {
-			rx = ry = $(elem).attr('r');
-		}
+  // Possibly the cubed root of 6, but 1.81 works best
+  var num = 1.81;
+  var d, a, rx, ry;
+  switch (elem.tagName) {
+  case 'ellipse':
+  case 'circle':
+    a = $(elem).attr(['rx', 'ry', 'cx', 'cy']);
+    var cx = a.cx, cy = a.cy;
+    rx = a.rx;
+    ry = a.ry;
+    if (elem.tagName === 'circle') {
+      rx = ry = $(elem).attr('r');
+    }
 
-		d = svgedit.utilities.getPathDFromSegments([
-			['M', [(cx - rx), (cy)]],
-			['C', [(cx - rx), (cy - ry / num), (cx - rx / num), (cy - ry), (cx), (cy - ry)]],
-			['C', [(cx + rx / num), (cy - ry), (cx + rx), (cy - ry / num), (cx + rx), (cy)]],
-			['C', [(cx + rx), (cy + ry / num), (cx + rx / num), (cy + ry), (cx), (cy + ry)]],
-			['C', [(cx - rx / num), (cy + ry), (cx - rx), (cy + ry / num), (cx - rx), (cy)]],
-			['Z', []]
-		]);
-		break;
-	case 'path':
-		d = elem.getAttribute('d');
-		break;
-	case 'line':
-		a = $(elem).attr(['x1', 'y1', 'x2', 'y2']);
-		d = 'M' + a.x1 + ',' + a.y1 + 'L' + a.x2 + ',' + a.y2;
-		break;
-	case 'polyline':
-		d = 'M' + elem.getAttribute('points');
-		break;
-	case 'polygon':
-		d = 'M' + elem.getAttribute('points') + ' Z';
-		break;
-	case 'rect':
-		var r = $(elem).attr(['rx', 'ry']);
-		rx = r.rx;
-		ry = r.ry;
-		var b = elem.getBBox();
-		var x = b.x, y = b.y, w = b.width, h = b.height;
-		num = 4 - num; // Why? Because!
+    d = svgedit.utilities.getPathDFromSegments([
+      ['M', [(cx - rx), (cy)]],
+      ['C', [(cx - rx), (cy - ry / num), (cx - rx / num), (cy - ry), (cx), (cy - ry)]],
+      ['C', [(cx + rx / num), (cy - ry), (cx + rx), (cy - ry / num), (cx + rx), (cy)]],
+      ['C', [(cx + rx), (cy + ry / num), (cx + rx / num), (cy + ry), (cx), (cy + ry)]],
+      ['C', [(cx - rx / num), (cy + ry), (cx - rx), (cy + ry / num), (cx - rx), (cy)]],
+      ['Z', []]
+    ]);
+    break;
+  case 'path':
+    d = elem.getAttribute('d');
+    break;
+  case 'line':
+    a = $(elem).attr(['x1', 'y1', 'x2', 'y2']);
+    d = 'M' + a.x1 + ',' + a.y1 + 'L' + a.x2 + ',' + a.y2;
+    break;
+  case 'polyline':
+    d = 'M' + elem.getAttribute('points');
+    break;
+  case 'polygon':
+    d = 'M' + elem.getAttribute('points') + ' Z';
+    break;
+  case 'rect':
+    var r = $(elem).attr(['rx', 'ry']);
+    rx = r.rx;
+    ry = r.ry;
+    var b = elem.getBBox();
+    var x = b.x, y = b.y, w = b.width, h = b.height;
+    num = 4 - num; // Why? Because!
 
-		if (!rx && !ry) {
-			// Regular rect
-			d = svgedit.utilities.getPathDFromSegments([
-				['M', [x, y]],
-				['L', [x + w, y]],
-				['L', [x + w, y + h]],
-				['L', [x, y + h]],
-				['L', [x, y]],
-				['Z', []]
-			]);
-		} else {
-			d = svgedit.utilities.getPathDFromSegments([
-				['M', [x, y + ry]],
-				['C', [x, y + ry / num, x + rx / num, y, x + rx, y]],
-				['L', [x + w - rx, y]],
-				['C', [x + w - rx / num, y, x + w, y + ry / num, x + w, y + ry]],
-				['L', [x + w, y + h - ry]],
-				['C', [x + w, y + h - ry / num, x + w - rx / num, y + h, x + w - rx, y + h]],
-				['L', [x + rx, y + h]],
-				['C', [x + rx / num, y + h, x, y + h - ry / num, x, y + h - ry]],
-				['L', [x, y + ry]],
-				['Z', []]
-			]);
-		}
-		break;
-	default:
-		break;
-	}
+    if (!rx && !ry) {
+      // Regular rect
+      d = svgedit.utilities.getPathDFromSegments([
+        ['M', [x, y]],
+        ['L', [x + w, y]],
+        ['L', [x + w, y + h]],
+        ['L', [x, y + h]],
+        ['L', [x, y]],
+        ['Z', []]
+      ]);
+    } else {
+      d = svgedit.utilities.getPathDFromSegments([
+        ['M', [x, y + ry]],
+        ['C', [x, y + ry / num, x + rx / num, y, x + rx, y]],
+        ['L', [x + w - rx, y]],
+        ['C', [x + w - rx / num, y, x + w, y + ry / num, x + w, y + ry]],
+        ['L', [x + w, y + h - ry]],
+        ['C', [x + w, y + h - ry / num, x + w - rx / num, y + h, x + w - rx, y + h]],
+        ['L', [x + rx, y + h]],
+        ['C', [x + rx / num, y + h, x, y + h - ry / num, x, y + h - ry]],
+        ['L', [x, y + ry]],
+        ['Z', []]
+      ]);
+    }
+    break;
+  default:
+    break;
+  }
 
-	return d;
+  return d;
 };
 
 // Function: getExtraAttributesForConvertToPath
@@ -699,16 +699,16 @@ svgedit.utilities.getPathDFromElement = function (elem) {
 // Returns:
 // An object with attributes.
 svgedit.utilities.getExtraAttributesForConvertToPath = function (elem) {
-	var attrs = {};
-	// TODO: make this list global so that we can properly maintain it
-	// TODO: what about @transform, @clip-rule, @fill-rule, etc?
-	$.each(['marker-start', 'marker-end', 'marker-mid', 'filter', 'clip-path'], function () {
-		var a = elem.getAttribute(this);
-		if (a) {
-			attrs[this] = a;
-		}
-	});
-	return attrs;
+  var attrs = {};
+  // TODO: make this list global so that we can properly maintain it
+  // TODO: what about @transform, @clip-rule, @fill-rule, etc?
+  $.each(['marker-start', 'marker-end', 'marker-mid', 'filter', 'clip-path'], function () {
+    var a = elem.getAttribute(this);
+    if (a) {
+      attrs[this] = a;
+    }
+  });
+  return attrs;
 };
 
 // Function: getBBoxOfElementAsPath
@@ -722,37 +722,37 @@ svgedit.utilities.getExtraAttributesForConvertToPath = function (elem) {
 // Returns:
 // The resulting path's bounding box object.
 svgedit.utilities.getBBoxOfElementAsPath = function (elem, addSvgElementFromJson, pathActions) {
-	var path = addSvgElementFromJson({
-		'element': 'path',
-		'attr': svgedit.utilities.getExtraAttributesForConvertToPath(elem)
-	});
+  var path = addSvgElementFromJson({
+    'element': 'path',
+    'attr': svgedit.utilities.getExtraAttributesForConvertToPath(elem)
+  });
 
-	var eltrans = elem.getAttribute('transform');
-	if (eltrans) {
-		path.setAttribute('transform', eltrans);
-	}
+  var eltrans = elem.getAttribute('transform');
+  if (eltrans) {
+    path.setAttribute('transform', eltrans);
+  }
 
-	var parent = elem.parentNode;
-	if (elem.nextSibling) {
-		parent.insertBefore(path, elem);
-	} else {
-		parent.appendChild(path);
-	}
+  var parent = elem.parentNode;
+  if (elem.nextSibling) {
+    parent.insertBefore(path, elem);
+  } else {
+    parent.appendChild(path);
+  }
 
-	var d = svgedit.utilities.getPathDFromElement(elem);
-	if (d) path.setAttribute('d', d);
-	else path.parentNode.removeChild(path);
+  var d = svgedit.utilities.getPathDFromElement(elem);
+  if (d) path.setAttribute('d', d);
+  else path.parentNode.removeChild(path);
 
-	// Get the correct BBox of the new path, then discard it
-	pathActions.resetOrientation(path);
-	var bb = false;
-	try {
-		bb = path.getBBox();
-	} catch (e) {
-		// Firefox fails
-	}
-	path.parentNode.removeChild(path);
-	return bb;
+  // Get the correct BBox of the new path, then discard it
+  pathActions.resetOrientation(path);
+  var bb = false;
+  try {
+    bb = path.getBBox();
+  } catch (e) {
+    // Firefox fails
+  }
+  path.parentNode.removeChild(path);
+  return bb;
 };
 
 // Function: convertToPath
@@ -771,61 +771,61 @@ svgedit.utilities.getBBoxOfElementAsPath = function (elem, addSvgElementFromJson
 // Returns:
 // The converted path element or null if the DOM element was not recognized.
 svgedit.utilities.convertToPath = function (elem, attrs, addSvgElementFromJson, pathActions, clearSelection, addToSelection, history, addCommandToHistory) {
-	var batchCmd = new history.BatchCommand('Convert element to Path');
+  var batchCmd = new history.BatchCommand('Convert element to Path');
 
-	// Any attribute on the element not covered by the passed-in attributes
-	attrs = $.extend({}, attrs, svgedit.utilities.getExtraAttributesForConvertToPath(elem));
+  // Any attribute on the element not covered by the passed-in attributes
+  attrs = $.extend({}, attrs, svgedit.utilities.getExtraAttributesForConvertToPath(elem));
 
-	var path = addSvgElementFromJson({
-		'element': 'path',
-		'attr': attrs
-	});
+  var path = addSvgElementFromJson({
+    'element': 'path',
+    'attr': attrs
+  });
 
-	var eltrans = elem.getAttribute('transform');
-	if (eltrans) {
-		path.setAttribute('transform', eltrans);
-	}
+  var eltrans = elem.getAttribute('transform');
+  if (eltrans) {
+    path.setAttribute('transform', eltrans);
+  }
 
-	var id = elem.id;
-	var parent = elem.parentNode;
-	if (elem.nextSibling) {
-		parent.insertBefore(path, elem);
-	} else {
-		parent.appendChild(path);
-	}
+  var id = elem.id;
+  var parent = elem.parentNode;
+  if (elem.nextSibling) {
+    parent.insertBefore(path, elem);
+  } else {
+    parent.appendChild(path);
+  }
 
-	var d = svgedit.utilities.getPathDFromElement(elem);
-	if (d) {
-		path.setAttribute('d', d);
+  var d = svgedit.utilities.getPathDFromElement(elem);
+  if (d) {
+    path.setAttribute('d', d);
 
-		// Replace the current element with the converted one
+    // Replace the current element with the converted one
 
-		// Reorient if it has a matrix
-		if (eltrans) {
-			var tlist = svgedit.transformlist.getTransformList(path);
-			if (svgedit.math.hasMatrixTransform(tlist)) {
-				pathActions.resetOrientation(path);
-			}
-		}
+    // Reorient if it has a matrix
+    if (eltrans) {
+      var tlist = svgedit.transformlist.getTransformList(path);
+      if (svgedit.math.hasMatrixTransform(tlist)) {
+        pathActions.resetOrientation(path);
+      }
+    }
 
-		var nextSibling = elem.nextSibling;
-		batchCmd.addSubCommand(new history.RemoveElementCommand(elem, nextSibling, parent));
-		batchCmd.addSubCommand(new history.InsertElementCommand(path));
+    var nextSibling = elem.nextSibling;
+    batchCmd.addSubCommand(new history.RemoveElementCommand(elem, nextSibling, parent));
+    batchCmd.addSubCommand(new history.InsertElementCommand(path));
 
-		clearSelection();
-		elem.parentNode.removeChild(elem);
-		path.setAttribute('id', id);
-		path.removeAttribute('visibility');
-		addToSelection([path], true);
+    clearSelection();
+    elem.parentNode.removeChild(elem);
+    path.setAttribute('id', id);
+    path.removeAttribute('visibility');
+    addToSelection([path], true);
 
-		addCommandToHistory(batchCmd);
+    addCommandToHistory(batchCmd);
 
-		return path;
-	} else {
-		// the elem.tagName was not recognized, so no "d" attribute. Remove it, so we've haven't changed anything.
-		path.parentNode.removeChild(path);
-		return null;
-	}
+    return path;
+  } else {
+    // the elem.tagName was not recognized, so no "d" attribute. Remove it, so we've haven't changed anything.
+    path.parentNode.removeChild(path);
+    return null;
+  }
 };
 
 // Function: bBoxCanBeOptimizedOverNativeGetBBox
@@ -851,10 +851,10 @@ svgedit.utilities.convertToPath = function (elem, attrs, addSvgElementFromJson,
 // Returns:
 // True if the bbox can be optimized.
 function bBoxCanBeOptimizedOverNativeGetBBox (angle, hasMatrixTransform) {
-	var angleModulo90 = angle % 90;
-	var closeTo90 = angleModulo90 < -89.99 || angleModulo90 > 89.99;
-	var closeTo0 = angleModulo90 > -0.001 && angleModulo90 < 0.001;
-	return hasMatrixTransform || !(closeTo0 || closeTo90);
+  var angleModulo90 = angle % 90;
+  var closeTo90 = angleModulo90 < -89.99 || angleModulo90 > 89.99;
+  var closeTo0 = angleModulo90 > -0.001 && angleModulo90 < 0.001;
+  return hasMatrixTransform || !(closeTo0 || closeTo90);
 }
 
 // Function: getBBoxWithTransform
@@ -868,64 +868,64 @@ function bBoxCanBeOptimizedOverNativeGetBBox (angle, hasMatrixTransform) {
 // Returns:
 // A single bounding box object
 svgedit.utilities.getBBoxWithTransform = function (elem, addSvgElementFromJson, pathActions) {
-	// TODO: Fix issue with rotated groups. Currently they work
-	// fine in FF, but not in other browsers (same problem mentioned
-	// in Issue 339 comment #2).
+  // TODO: Fix issue with rotated groups. Currently they work
+  // fine in FF, but not in other browsers (same problem mentioned
+  // in Issue 339 comment #2).
 
-	var bb = svgedit.utilities.getBBox(elem);
+  var bb = svgedit.utilities.getBBox(elem);
 
-	if (!bb) {
-		return null;
-	}
+  if (!bb) {
+    return null;
+  }
 
-	var tlist = svgedit.transformlist.getTransformList(elem);
-	var angle = svgedit.utilities.getRotationAngleFromTransformList(tlist);
-	var hasMatrixTransform = svgedit.math.hasMatrixTransform(tlist);
+  var tlist = svgedit.transformlist.getTransformList(elem);
+  var angle = svgedit.utilities.getRotationAngleFromTransformList(tlist);
+  var hasMatrixTransform = svgedit.math.hasMatrixTransform(tlist);
 
-	if (angle || hasMatrixTransform) {
-		var goodBb = false;
-		if (bBoxCanBeOptimizedOverNativeGetBBox(angle, hasMatrixTransform)) {
-			// Get the BBox from the raw path for these elements
-			// TODO: why ellipse and not circle
-			var elemNames = ['ellipse', 'path', 'line', 'polyline', 'polygon'];
-			if (elemNames.indexOf(elem.tagName) >= 0) {
-				bb = goodBb = svgedit.utilities.getBBoxOfElementAsPath(elem, addSvgElementFromJson, pathActions);
-			} else if (elem.tagName === 'rect') {
-				// Look for radius
-				var rx = elem.getAttribute('rx');
-				var ry = elem.getAttribute('ry');
-				if (rx || ry) {
-					bb = goodBb = svgedit.utilities.getBBoxOfElementAsPath(elem, addSvgElementFromJson, pathActions);
-				}
-			}
-		}
+  if (angle || hasMatrixTransform) {
+    var goodBb = false;
+    if (bBoxCanBeOptimizedOverNativeGetBBox(angle, hasMatrixTransform)) {
+      // Get the BBox from the raw path for these elements
+      // TODO: why ellipse and not circle
+      var elemNames = ['ellipse', 'path', 'line', 'polyline', 'polygon'];
+      if (elemNames.indexOf(elem.tagName) >= 0) {
+        bb = goodBb = svgedit.utilities.getBBoxOfElementAsPath(elem, addSvgElementFromJson, pathActions);
+      } else if (elem.tagName === 'rect') {
+        // Look for radius
+        var rx = elem.getAttribute('rx');
+        var ry = elem.getAttribute('ry');
+        if (rx || ry) {
+          bb = goodBb = svgedit.utilities.getBBoxOfElementAsPath(elem, addSvgElementFromJson, pathActions);
+        }
+      }
+    }
 
-		if (!goodBb) {
-			var matrix = svgedit.math.transformListToTransform(tlist).matrix;
-			bb = svgedit.math.transformBox(bb.x, bb.y, bb.width, bb.height, matrix).aabox;
+    if (!goodBb) {
+      var matrix = svgedit.math.transformListToTransform(tlist).matrix;
+      bb = svgedit.math.transformBox(bb.x, bb.y, bb.width, bb.height, matrix).aabox;
 
-			// Old technique that was exceedingly slow with large documents.
-			//
-			// Accurate way to get BBox of rotated element in Firefox:
-			// Put element in group and get its BBox
-			//
-			// Must use clone else FF freaks out
-			// var clone = elem.cloneNode(true);
-			// var g = document.createElementNS(NS.SVG, 'g');
-			// var parent = elem.parentNode;
-			// parent.appendChild(g);
-			// g.appendChild(clone);
-			// var bb2 = svgedit.utilities.bboxToObj(g.getBBox());
-			// parent.removeChild(g);
-		}
-	}
-	return bb;
+      // Old technique that was exceedingly slow with large documents.
+      //
+      // Accurate way to get BBox of rotated element in Firefox:
+      // Put element in group and get its BBox
+      //
+      // Must use clone else FF freaks out
+      // var clone = elem.cloneNode(true);
+      // var g = document.createElementNS(NS.SVG, 'g');
+      // var parent = elem.parentNode;
+      // parent.appendChild(g);
+      // g.appendChild(clone);
+      // var bb2 = svgedit.utilities.bboxToObj(g.getBBox());
+      // parent.removeChild(g);
+    }
+  }
+  return bb;
 };
 
 // TODO: This is problematic with large stroke-width and, for example, a single horizontal line. The calculated BBox extends way beyond left and right sides.
 function getStrokeOffsetForBBox (elem) {
-	var sw = elem.getAttribute('stroke-width');
-	return (!isNaN(sw) && elem.getAttribute('stroke') !== 'none') ? sw / 2 : 0;
+  var sw = elem.getAttribute('stroke-width');
+  return (!isNaN(sw) && elem.getAttribute('stroke') !== 'none') ? sw / 2 : 0;
 }
 
 // Function: getStrokedBBox
@@ -939,54 +939,54 @@ function getStrokeOffsetForBBox (elem) {
 // Returns:
 // A single bounding box object
 svgedit.utilities.getStrokedBBox = function (elems, addSvgElementFromJson, pathActions) {
-	if (!elems || !elems.length) { return false; }
+  if (!elems || !elems.length) { return false; }
 
-	var fullBb;
-	$.each(elems, function () {
-		if (fullBb) { return; }
-		if (!this.parentNode) { return; }
-		fullBb = svgedit.utilities.getBBoxWithTransform(this, addSvgElementFromJson, pathActions);
-	});
+  var fullBb;
+  $.each(elems, function () {
+    if (fullBb) { return; }
+    if (!this.parentNode) { return; }
+    fullBb = svgedit.utilities.getBBoxWithTransform(this, addSvgElementFromJson, pathActions);
+  });
 
-	// This shouldn't ever happen...
-	if (fullBb === undefined) { return null; }
+  // This shouldn't ever happen...
+  if (fullBb === undefined) { return null; }
 
-	// fullBb doesn't include the stoke, so this does no good!
-	// if (elems.length == 1) return fullBb;
+  // fullBb doesn't include the stoke, so this does no good!
+  // if (elems.length == 1) return fullBb;
 
-	var maxX = fullBb.x + fullBb.width;
-	var maxY = fullBb.y + fullBb.height;
-	var minX = fullBb.x;
-	var minY = fullBb.y;
+  var maxX = fullBb.x + fullBb.width;
+  var maxY = fullBb.y + fullBb.height;
+  var minX = fullBb.x;
+  var minY = fullBb.y;
 
-	// If only one elem, don't call the potentially slow getBBoxWithTransform method again.
-	if (elems.length === 1) {
-		var offset = getStrokeOffsetForBBox(elems[0]);
-		minX -= offset;
-		minY -= offset;
-		maxX += offset;
-		maxY += offset;
-	} else {
-		$.each(elems, function (i, elem) {
-			var curBb = svgedit.utilities.getBBoxWithTransform(elem, addSvgElementFromJson, pathActions);
-			if (curBb) {
-				var offset = getStrokeOffsetForBBox(elem);
-				minX = Math.min(minX, curBb.x - offset);
-				minY = Math.min(minY, curBb.y - offset);
-				// TODO: The old code had this test for max, but not min. I suspect this test should be for both min and max
-				if (elem.nodeType === 1) {
-					maxX = Math.max(maxX, curBb.x + curBb.width + offset);
-					maxY = Math.max(maxY, curBb.y + curBb.height + offset);
-				}
-			}
-		});
-	}
+  // If only one elem, don't call the potentially slow getBBoxWithTransform method again.
+  if (elems.length === 1) {
+    var offset = getStrokeOffsetForBBox(elems[0]);
+    minX -= offset;
+    minY -= offset;
+    maxX += offset;
+    maxY += offset;
+  } else {
+    $.each(elems, function (i, elem) {
+      var curBb = svgedit.utilities.getBBoxWithTransform(elem, addSvgElementFromJson, pathActions);
+      if (curBb) {
+        var offset = getStrokeOffsetForBBox(elem);
+        minX = Math.min(minX, curBb.x - offset);
+        minY = Math.min(minY, curBb.y - offset);
+        // TODO: The old code had this test for max, but not min. I suspect this test should be for both min and max
+        if (elem.nodeType === 1) {
+          maxX = Math.max(maxX, curBb.x + curBb.width + offset);
+          maxY = Math.max(maxY, curBb.y + curBb.height + offset);
+        }
+      }
+    });
+  }
 
-	fullBb.x = minX;
-	fullBb.y = minY;
-	fullBb.width = maxX - minX;
-	fullBb.height = maxY - minY;
-	return fullBb;
+  fullBb.x = minX;
+  fullBb.y = minY;
+  fullBb.width = maxX - minX;
+  fullBb.height = maxY - minY;
+  return fullBb;
 };
 
 // Function: svgedit.utilities.getRotationAngleFromTransformList
@@ -999,16 +999,16 @@ svgedit.utilities.getStrokedBBox = function (elems, addSvgElementFromJson, pathA
 // Returns:
 // Float with the angle in degrees or radians
 svgedit.utilities.getRotationAngleFromTransformList = function (tlist, toRad) {
-	if (!tlist) { return 0; } // <svg> elements have no tlist
-	var N = tlist.numberOfItems;
-	var i;
-	for (i = 0; i < N; ++i) {
-		var xform = tlist.getItem(i);
-		if (xform.type === 4) {
-			return toRad ? xform.angle * Math.PI / 180.0 : xform.angle;
-		}
-	}
-	return 0.0;
+  if (!tlist) { return 0; } // <svg> elements have no tlist
+  var N = tlist.numberOfItems;
+  var i;
+  for (i = 0; i < N; ++i) {
+    var xform = tlist.getItem(i);
+    if (xform.type === 4) {
+      return toRad ? xform.angle * Math.PI / 180.0 : xform.angle;
+    }
+  }
+  return 0.0;
 };
 
 // Function: svgedit.utilities.getRotationAngle
@@ -1021,10 +1021,10 @@ svgedit.utilities.getRotationAngleFromTransformList = function (tlist, toRad) {
 // Returns:
 // Float with the angle in degrees or radians
 svgedit.utilities.getRotationAngle = function (elem, toRad) {
-	var selected = elem || editorContext_.getSelectedElements()[0];
-	// find the rotation transform (if any) and set it
-	var tlist = svgedit.transformlist.getTransformList(selected);
-	return svgedit.utilities.getRotationAngleFromTransformList(tlist, toRad);
+  var selected = elem || editorContext_.getSelectedElements()[0];
+  // find the rotation transform (if any) and set it
+  var tlist = svgedit.transformlist.getTransformList(selected);
+  return svgedit.utilities.getRotationAngleFromTransformList(tlist, toRad);
 };
 
 // Function getRefElem
@@ -1033,7 +1033,7 @@ svgedit.utilities.getRotationAngle = function (elem, toRad) {
 // Parameters:
 // attrVal - The attribute value as a string
 svgedit.utilities.getRefElem = function (attrVal) {
-	return svgedit.utilities.getElem(svgedit.utilities.getUrlFromAttr(attrVal).substr(1));
+  return svgedit.utilities.getElem(svgedit.utilities.getUrlFromAttr(attrVal).substr(1));
 };
 
 // Function: getElem
@@ -1042,25 +1042,25 @@ svgedit.utilities.getRefElem = function (attrVal) {
 // Parameters:
 // id - String with the element's new ID
 if (svgedit.browser.supportsSelectors()) {
-	svgedit.utilities.getElem = function (id) {
-		// querySelector lookup
-		return svgroot_.querySelector('#' + id);
-	};
+  svgedit.utilities.getElem = function (id) {
+    // querySelector lookup
+    return svgroot_.querySelector('#' + id);
+  };
 } else if (svgedit.browser.supportsXpath()) {
-	svgedit.utilities.getElem = function (id) {
-		// xpath lookup
-		return domdoc_.evaluate(
-			'svg:svg[@id="svgroot"]//svg:*[@id="' + id + '"]',
-			domcontainer_,
-			function () { return svgedit.NS.SVG; },
-			9,
-			null).singleNodeValue;
-	};
+  svgedit.utilities.getElem = function (id) {
+    // xpath lookup
+    return domdoc_.evaluate(
+      'svg:svg[@id="svgroot"]//svg:*[@id="' + id + '"]',
+      domcontainer_,
+      function () { return svgedit.NS.SVG; },
+      9,
+      null).singleNodeValue;
+  };
 } else {
-	svgedit.utilities.getElem = function (id) {
-		// jQuery lookup: twice as slow as xpath in FF
-		return $(svgroot_).find('[id=' + id + ']')[0];
-	};
+  svgedit.utilities.getElem = function (id) {
+    // jQuery lookup: twice as slow as xpath in FF
+    return $(svgroot_).find('[id=' + id + ']')[0];
+  };
 }
 
 // Function: assignAttributes
@@ -1072,20 +1072,20 @@ if (svgedit.browser.supportsSelectors()) {
 // suspendLength - Optional integer of milliseconds to suspend redraw
 // unitCheck - Boolean to indicate the need to use svgedit.units.setUnitAttr
 svgedit.utilities.assignAttributes = function (node, attrs, suspendLength, unitCheck) {
-	var i;
-	for (i in attrs) {
-		var ns = (i.substr(0, 4) === 'xml:'
-			? NS.XML
-			: i.substr(0, 6) === 'xlink:' ? NS.XLINK : null);
+  var i;
+  for (i in attrs) {
+    var ns = (i.substr(0, 4) === 'xml:'
+      ? NS.XML
+      : i.substr(0, 6) === 'xlink:' ? NS.XLINK : null);
 
-		if (ns) {
-			node.setAttributeNS(ns, i, attrs[i]);
-		} else if (!unitCheck) {
-			node.setAttribute(i, attrs[i]);
-		} else {
-			svgedit.units.setUnitAttr(node, i, attrs[i]);
-		}
-	}
+    if (ns) {
+      node.setAttributeNS(ns, i, attrs[i]);
+    } else if (!unitCheck) {
+      node.setAttribute(i, attrs[i]);
+    } else {
+      svgedit.units.setUnitAttr(node, i, attrs[i]);
+    }
+  }
 };
 
 // Function: cleanupElement
@@ -1094,51 +1094,51 @@ svgedit.utilities.assignAttributes = function (node, attrs, suspendLength, unitC
 // Parameters:
 // element - DOM element to clean up
 svgedit.utilities.cleanupElement = function (element) {
-	var defaults = {
-		'fill-opacity': 1,
-		'stop-opacity': 1,
-		'opacity': 1,
-		'stroke': 'none',
-		'stroke-dasharray': 'none',
-		'stroke-linejoin': 'miter',
-		'stroke-linecap': 'butt',
-		'stroke-opacity': 1,
-		'stroke-width': 1,
-		'rx': 0,
-		'ry': 0
-	};
+  var defaults = {
+    'fill-opacity': 1,
+    'stop-opacity': 1,
+    'opacity': 1,
+    'stroke': 'none',
+    'stroke-dasharray': 'none',
+    'stroke-linejoin': 'miter',
+    'stroke-linecap': 'butt',
+    'stroke-opacity': 1,
+    'stroke-width': 1,
+    'rx': 0,
+    'ry': 0
+  };
 
-	if (element.nodeName === 'ellipse') {
-		// Ellipse elements requires rx and ry attributes
-		delete defaults.rx;
-		delete defaults.ry;
-	}
+  if (element.nodeName === 'ellipse') {
+    // Ellipse elements requires rx and ry attributes
+    delete defaults.rx;
+    delete defaults.ry;
+  }
 
-	var attr;
-	for (attr in defaults) {
-		var val = defaults[attr];
-		if (element.getAttribute(attr) === String(val)) {
-			element.removeAttribute(attr);
-		}
-	}
+  var attr;
+  for (attr in defaults) {
+    var val = defaults[attr];
+    if (element.getAttribute(attr) === String(val)) {
+      element.removeAttribute(attr);
+    }
+  }
 };
 
 // Function: snapToGrid
 // round value to for snapping
 // NOTE: This function did not move to svgutils.js since it depends on curConfig.
 svgedit.utilities.snapToGrid = function (value) {
-	var stepSize = editorContext_.getSnappingStep();
-	var unit = editorContext_.getBaseUnit();
-	if (unit !== 'px') {
-		stepSize *= svgedit.units.getTypeMap()[unit];
-	}
-	value = Math.round(value / stepSize) * stepSize;
-	return value;
+  var stepSize = editorContext_.getSnappingStep();
+  var unit = editorContext_.getBaseUnit();
+  if (unit !== 'px') {
+    stepSize *= svgedit.units.getTypeMap()[unit];
+  }
+  value = Math.round(value / stepSize) * stepSize;
+  return value;
 };
 
 svgedit.utilities.preg_quote = function (str, delimiter) {
-	// From: http://phpjs.org/functions
-	return String(str).replace(new RegExp('[.\\\\+*?\\[\\^\\]$(){}=!<>|:\\' + (delimiter || '') + '-]', 'g'), '\\$&');
+  // From: http://phpjs.org/functions
+  return String(str).replace(new RegExp('[.\\\\+*?\\[\\^\\]$(){}=!<>|:\\' + (delimiter || '') + '-]', 'g'), '\\$&');
 };
 
 /**
@@ -1147,35 +1147,35 @@ svgedit.utilities.preg_quote = function (str, delimiter) {
 * @param {function} cb The callback to execute upon load.
 */
 svgedit.utilities.executeAfterLoads = function (globalCheck, scripts, cb) {
-	return function () {
-		var args = arguments;
-		function endCallback () {
-			cb.apply(null, args);
-		}
-		if (window[globalCheck]) {
-			endCallback();
-		} else {
-			scripts.reduceRight(function (oldFunc, script) {
-				return function () {
-					$.getScript(script, oldFunc);
-				};
-			}, endCallback)();
-		}
-	};
+  return function () {
+    var args = arguments;
+    function endCallback () {
+      cb.apply(null, args);
+    }
+    if (window[globalCheck]) {
+      endCallback();
+    } else {
+      scripts.reduceRight(function (oldFunc, script) {
+        return function () {
+          $.getScript(script, oldFunc);
+        };
+      }, endCallback)();
+    }
+  };
 };
 
 svgedit.utilities.buildCanvgCallback = function (callCanvg) {
-	return svgedit.utilities.executeAfterLoads('canvg', ['canvg/rgbcolor.js', 'canvg/canvg.js'], callCanvg);
+  return svgedit.utilities.executeAfterLoads('canvg', ['canvg/rgbcolor.js', 'canvg/canvg.js'], callCanvg);
 };
 
 svgedit.utilities.buildJSPDFCallback = function (callJSPDF) {
-	return svgedit.utilities.executeAfterLoads('RGBColor', ['canvg/rgbcolor.js'], function () {
-		var arr = [];
-		if (!RGBColor || RGBColor.ok === undef) { // It's not our RGBColor, so we'll need to load it
-			arr.push('canvg/rgbcolor.js');
-		}
-		svgedit.utilities.executeAfterLoads('jsPDF', arr.concat('jspdf/underscore-min.js', 'jspdf/jspdf.min.js', 'jspdf/jspdf.plugin.svgToPdf.js'), callJSPDF)();
-	});
+  return svgedit.utilities.executeAfterLoads('RGBColor', ['canvg/rgbcolor.js'], function () {
+    var arr = [];
+    if (!RGBColor || RGBColor.ok === undef) { // It's not our RGBColor, so we'll need to load it
+      arr.push('canvg/rgbcolor.js');
+    }
+    svgedit.utilities.executeAfterLoads('jsPDF', arr.concat('jspdf/underscore-min.js', 'jspdf/jspdf.min.js', 'jspdf/jspdf.plugin.svgToPdf.js'), callJSPDF)();
+  });
 };
 
 /**
@@ -1183,7 +1183,7 @@ svgedit.utilities.buildJSPDFCallback = function (callJSPDF) {
  * @param img - The DOM element to prevent the click on
  */
 svgedit.utilities.preventClickDefault = function (img) {
-	$(img).click(function (e) { e.preventDefault(); });
+  $(img).click(function (e) { e.preventDefault(); });
 };
 
 /**
@@ -1193,48 +1193,48 @@ svgedit.utilities.preventClickDefault = function (img) {
  * @returns {Element}
  */
 svgedit.utilities.copyElem = function (el, getNextId) {
-	// manually create a copy of the element
-	var newEl = document.createElementNS(el.namespaceURI, el.nodeName);
-	$.each(el.attributes, function (i, attr) {
-		if (attr.localName !== '-moz-math-font-style') {
-			newEl.setAttributeNS(attr.namespaceURI, attr.nodeName, attr.value);
-		}
-	});
-	// set the copied element's new id
-	newEl.removeAttribute('id');
-	newEl.id = getNextId();
+  // manually create a copy of the element
+  var newEl = document.createElementNS(el.namespaceURI, el.nodeName);
+  $.each(el.attributes, function (i, attr) {
+    if (attr.localName !== '-moz-math-font-style') {
+      newEl.setAttributeNS(attr.namespaceURI, attr.nodeName, attr.value);
+    }
+  });
+  // set the copied element's new id
+  newEl.removeAttribute('id');
+  newEl.id = getNextId();
 
-	// Opera's "d" value needs to be reset for Opera/Win/non-EN
-	// Also needed for webkit (else does not keep curved segments on clone)
-	if (svgedit.browser.isWebkit() && el.nodeName === 'path') {
-		var fixedD = svgedit.utilities.convertPath(el);
-		newEl.setAttribute('d', fixedD);
-	}
+  // Opera's "d" value needs to be reset for Opera/Win/non-EN
+  // Also needed for webkit (else does not keep curved segments on clone)
+  if (svgedit.browser.isWebkit() && el.nodeName === 'path') {
+    var fixedD = svgedit.utilities.convertPath(el);
+    newEl.setAttribute('d', fixedD);
+  }
 
-	// now create copies of all children
-	$.each(el.childNodes, function (i, child) {
-		switch (child.nodeType) {
-		case 1: // element node
-			newEl.appendChild(svgedit.utilities.copyElem(child, getNextId));
-			break;
-		case 3: // text node
-			newEl.textContent = child.nodeValue;
-			break;
-		default:
-			break;
-		}
-	});
+  // now create copies of all children
+  $.each(el.childNodes, function (i, child) {
+    switch (child.nodeType) {
+    case 1: // element node
+      newEl.appendChild(svgedit.utilities.copyElem(child, getNextId));
+      break;
+    case 3: // text node
+      newEl.textContent = child.nodeValue;
+      break;
+    default:
+      break;
+    }
+  });
 
-	if ($(el).data('gsvg')) {
-		$(newEl).data('gsvg', newEl.firstChild);
-	} else if ($(el).data('symbol')) {
-		var ref = $(el).data('symbol');
-		$(newEl).data('ref', ref).data('symbol', ref);
-	} else if (newEl.tagName === 'image') {
-		svgedit.utilities.preventClickDefault(newEl);
-	}
+  if ($(el).data('gsvg')) {
+    $(newEl).data('gsvg', newEl.firstChild);
+  } else if ($(el).data('symbol')) {
+    var ref = $(el).data('symbol');
+    $(newEl).data('ref', ref).data('symbol', ref);
+  } else if (newEl.tagName === 'image') {
+    svgedit.utilities.preventClickDefault(newEl);
+  }
 
-	return newEl;
+  return newEl;
 };
 
 /**
@@ -1247,22 +1247,22 @@ svgedit.utilities.copyElem = function (el, getNextId) {
  * @returns {string}
  */
 function pathDSegment (letter, points, morePoints, lastPoint) {
-	$.each(points, function (i, pnt) {
-		points[i] = svgedit.units.shortFloat(pnt);
-	});
-	var segment = letter + points.join(' ');
-	if (morePoints) {
-		segment += ' ' + morePoints.join(' ');
-	}
-	if (lastPoint) {
-		segment += ' ' + svgedit.units.shortFloat(lastPoint);
-	}
-	return segment;
+  $.each(points, function (i, pnt) {
+    points[i] = svgedit.units.shortFloat(pnt);
+  });
+  var segment = letter + points.join(' ');
+  if (morePoints) {
+    segment += ' ' + morePoints.join(' ');
+  }
+  if (lastPoint) {
+    segment += ' ' + svgedit.units.shortFloat(lastPoint);
+  }
+  return segment;
 }
 
 // this is how we map paths to our preferred relative segment types
 var pathMap = [0, 'z', 'M', 'm', 'L', 'l', 'C', 'c', 'Q', 'q', 'A', 'a',
-	'H', 'h', 'V', 'v', 'S', 's', 'T', 't'];
+  'H', 'h', 'V', 'v', 'S', 's', 'T', 't'];
 
 /**
  * TODO: move to pathActions.js when migrating rest of pathActions out of svgcanvas.js
@@ -1272,156 +1272,156 @@ var pathMap = [0, 'z', 'M', 'm', 'L', 'l', 'C', 'c', 'Q', 'q', 'A', 'a',
  * @returns {string}
  */
 svgedit.utilities.convertPath = function (path, toRel) {
-	var i;
-	var segList = path.pathSegList;
-	var len = segList.numberOfItems;
-	var curx = 0, cury = 0;
-	var d = '';
-	var lastM = null;
+  var i;
+  var segList = path.pathSegList;
+  var len = segList.numberOfItems;
+  var curx = 0, cury = 0;
+  var d = '';
+  var lastM = null;
 
-	for (i = 0; i < len; ++i) {
-		var seg = segList.getItem(i);
-		// if these properties are not in the segment, set them to zero
-		var x = seg.x || 0,
-			y = seg.y || 0,
-			x1 = seg.x1 || 0,
-			y1 = seg.y1 || 0,
-			x2 = seg.x2 || 0,
-			y2 = seg.y2 || 0;
+  for (i = 0; i < len; ++i) {
+    var seg = segList.getItem(i);
+    // if these properties are not in the segment, set them to zero
+    var x = seg.x || 0,
+      y = seg.y || 0,
+      x1 = seg.x1 || 0,
+      y1 = seg.y1 || 0,
+      x2 = seg.x2 || 0,
+      y2 = seg.y2 || 0;
 
-		var type = seg.pathSegType;
-		var letter = pathMap[type]['to' + (toRel ? 'Lower' : 'Upper') + 'Case']();
+    var type = seg.pathSegType;
+    var letter = pathMap[type]['to' + (toRel ? 'Lower' : 'Upper') + 'Case']();
 
-		switch (type) {
-		case 1: // z,Z closepath (Z/z)
-			d += 'z';
-			if (lastM && !toRel) {
-				curx = lastM[0];
-				cury = lastM[1];
-			}
-			break;
-		case 12: // absolute horizontal line (H)
-			x -= curx;
-			// Fallthrough
-		case 13: // relative horizontal line (h)
-			if (toRel) {
-				curx += x;
-				letter = 'l';
-			} else {
-				x += curx;
-				curx = x;
-				letter = 'L';
-			}
-			// Convert to "line" for easier editing
-			d += pathDSegment(letter, [[x, cury]]);
-			break;
-		case 14: // absolute vertical line (V)
-			y -= cury;
-			// Fallthrough
-		case 15: // relative vertical line (v)
-			if (toRel) {
-				cury += y;
-				letter = 'l';
-			} else {
-				y += cury;
-				cury = y;
-				letter = 'L';
-			}
-			// Convert to "line" for easier editing
-			d += pathDSegment(letter, [[curx, y]]);
-			break;
-		case 2: // absolute move (M)
-		case 4: // absolute line (L)
-		case 18: // absolute smooth quad (T)
-			x -= curx;
-			y -= cury;
-			// Fallthrough
-		case 5: // relative line (l)
-		case 3: // relative move (m)
-		case 19: // relative smooth quad (t)
-			if (toRel) {
-				curx += x;
-				cury += y;
-			} else {
-				x += curx;
-				y += cury;
-				curx = x;
-				cury = y;
-			}
-			if (type === 2 || type === 3) { lastM = [curx, cury]; }
+    switch (type) {
+    case 1: // z,Z closepath (Z/z)
+      d += 'z';
+      if (lastM && !toRel) {
+        curx = lastM[0];
+        cury = lastM[1];
+      }
+      break;
+    case 12: // absolute horizontal line (H)
+      x -= curx;
+      // Fallthrough
+    case 13: // relative horizontal line (h)
+      if (toRel) {
+        curx += x;
+        letter = 'l';
+      } else {
+        x += curx;
+        curx = x;
+        letter = 'L';
+      }
+      // Convert to "line" for easier editing
+      d += pathDSegment(letter, [[x, cury]]);
+      break;
+    case 14: // absolute vertical line (V)
+      y -= cury;
+      // Fallthrough
+    case 15: // relative vertical line (v)
+      if (toRel) {
+        cury += y;
+        letter = 'l';
+      } else {
+        y += cury;
+        cury = y;
+        letter = 'L';
+      }
+      // Convert to "line" for easier editing
+      d += pathDSegment(letter, [[curx, y]]);
+      break;
+    case 2: // absolute move (M)
+    case 4: // absolute line (L)
+    case 18: // absolute smooth quad (T)
+      x -= curx;
+      y -= cury;
+      // Fallthrough
+    case 5: // relative line (l)
+    case 3: // relative move (m)
+    case 19: // relative smooth quad (t)
+      if (toRel) {
+        curx += x;
+        cury += y;
+      } else {
+        x += curx;
+        y += cury;
+        curx = x;
+        cury = y;
+      }
+      if (type === 2 || type === 3) { lastM = [curx, cury]; }
 
-			d += pathDSegment(letter, [[x, y]]);
-			break;
-		case 6: // absolute cubic (C)
-			x -= curx; x1 -= curx; x2 -= curx;
-			y -= cury; y1 -= cury; y2 -= cury;
-			// Fallthrough
-		case 7: // relative cubic (c)
-			if (toRel) {
-				curx += x;
-				cury += y;
-			} else {
-				x += curx; x1 += curx; x2 += curx;
-				y += cury; y1 += cury; y2 += cury;
-				curx = x;
-				cury = y;
-			}
-			d += pathDSegment(letter, [[x1, y1], [x2, y2], [x, y]]);
-			break;
-		case 8: // absolute quad (Q)
-			x -= curx; x1 -= curx;
-			y -= cury; y1 -= cury;
-			// Fallthrough
-		case 9: // relative quad (q)
-			if (toRel) {
-				curx += x;
-				cury += y;
-			} else {
-				x += curx; x1 += curx;
-				y += cury; y1 += cury;
-				curx = x;
-				cury = y;
-			}
-			d += pathDSegment(letter, [[x1, y1], [x, y]]);
-			break;
-		case 10: // absolute elliptical arc (A)
-			x -= curx;
-			y -= cury;
-			// Fallthrough
-		case 11: // relative elliptical arc (a)
-			if (toRel) {
-				curx += x;
-				cury += y;
-			} else {
-				x += curx;
-				y += cury;
-				curx = x;
-				cury = y;
-			}
-			d += pathDSegment(letter, [[seg.r1, seg.r2]], [
-				seg.angle,
-				(seg.largeArcFlag ? 1 : 0),
-				(seg.sweepFlag ? 1 : 0)
-			], [x, y]);
-			break;
-		case 16: // absolute smooth cubic (S)
-			x -= curx; x2 -= curx;
-			y -= cury; y2 -= cury;
-			// Fallthrough
-		case 17: // relative smooth cubic (s)
-			if (toRel) {
-				curx += x;
-				cury += y;
-			} else {
-				x += curx; x2 += curx;
-				y += cury; y2 += cury;
-				curx = x;
-				cury = y;
-			}
-			d += pathDSegment(letter, [[x2, y2], [x, y]]);
-			break;
-		} // switch on path segment type
-	} // for each segment
-	return d;
+      d += pathDSegment(letter, [[x, y]]);
+      break;
+    case 6: // absolute cubic (C)
+      x -= curx; x1 -= curx; x2 -= curx;
+      y -= cury; y1 -= cury; y2 -= cury;
+      // Fallthrough
+    case 7: // relative cubic (c)
+      if (toRel) {
+        curx += x;
+        cury += y;
+      } else {
+        x += curx; x1 += curx; x2 += curx;
+        y += cury; y1 += cury; y2 += cury;
+        curx = x;
+        cury = y;
+      }
+      d += pathDSegment(letter, [[x1, y1], [x2, y2], [x, y]]);
+      break;
+    case 8: // absolute quad (Q)
+      x -= curx; x1 -= curx;
+      y -= cury; y1 -= cury;
+      // Fallthrough
+    case 9: // relative quad (q)
+      if (toRel) {
+        curx += x;
+        cury += y;
+      } else {
+        x += curx; x1 += curx;
+        y += cury; y1 += cury;
+        curx = x;
+        cury = y;
+      }
+      d += pathDSegment(letter, [[x1, y1], [x, y]]);
+      break;
+    case 10: // absolute elliptical arc (A)
+      x -= curx;
+      y -= cury;
+      // Fallthrough
+    case 11: // relative elliptical arc (a)
+      if (toRel) {
+        curx += x;
+        cury += y;
+      } else {
+        x += curx;
+        y += cury;
+        curx = x;
+        cury = y;
+      }
+      d += pathDSegment(letter, [[seg.r1, seg.r2]], [
+        seg.angle,
+        (seg.largeArcFlag ? 1 : 0),
+        (seg.sweepFlag ? 1 : 0)
+      ], [x, y]);
+      break;
+    case 16: // absolute smooth cubic (S)
+      x -= curx; x2 -= curx;
+      y -= cury; y2 -= cury;
+      // Fallthrough
+    case 17: // relative smooth cubic (s)
+      if (toRel) {
+        curx += x;
+        cury += y;
+      } else {
+        x += curx; x2 += curx;
+        y += cury; y2 += cury;
+        curx = x;
+        cury = y;
+      }
+      d += pathDSegment(letter, [[x2, y2], [x, y]]);
+      break;
+    } // switch on path segment type
+  } // for each segment
+  return d;
 };
 }());
diff --git a/editor/touch.js b/editor/touch.js
index 0f4c2423..82f11a4e 100644
--- a/editor/touch.js
+++ b/editor/touch.js
@@ -1,32 +1,32 @@
 /* eslint-disable no-var */
 // http://ross.posterous.com/2008/08/19/iphone-touch-events-in-javascript/
 function touchHandler (event) {
-	'use strict';
+  'use strict';
 
-	var simulatedEvent,
-		touches = event.changedTouches,
-		first = touches[0],
-		type = '';
-	switch (event.type) {
-	case 'touchstart': type = 'mousedown'; break;
-	case 'touchmove': type = 'mousemove'; break;
-	case 'touchend': type = 'mouseup'; break;
-	default: return;
-	}
+  var simulatedEvent,
+    touches = event.changedTouches,
+    first = touches[0],
+    type = '';
+  switch (event.type) {
+  case 'touchstart': type = 'mousedown'; break;
+  case 'touchmove': type = 'mousemove'; break;
+  case 'touchend': type = 'mouseup'; break;
+  default: return;
+  }
 
-	// initMouseEvent(type, canBubble, cancelable, view, clickCount,
-	//	screenX, screenY, clientX, clientY, ctrlKey,
-	//	altKey, shiftKey, metaKey, button, relatedTarget);
+  // initMouseEvent(type, canBubble, cancelable, view, clickCount,
+  //	screenX, screenY, clientX, clientY, ctrlKey,
+  //	altKey, shiftKey, metaKey, button, relatedTarget);
 
-	simulatedEvent = document.createEvent('MouseEvent');
-	simulatedEvent.initMouseEvent(type, true, true, window, 1,
-		first.screenX, first.screenY,
-		first.clientX, first.clientY, false,
-		false, false, false, 0/* left */, null);
-	if (touches.length < 2) {
-		first.target.dispatchEvent(simulatedEvent);
-		event.preventDefault();
-	}
+  simulatedEvent = document.createEvent('MouseEvent');
+  simulatedEvent.initMouseEvent(type, true, true, window, 1,
+    first.screenX, first.screenY,
+    first.clientX, first.clientY, false,
+    false, false, false, 0/* left */, null);
+  if (touches.length < 2) {
+    first.target.dispatchEvent(simulatedEvent);
+    event.preventDefault();
+  }
 }
 
 document.addEventListener('touchstart', touchHandler, true);
diff --git a/editor/units.js b/editor/units.js
index f78de469..d0123082 100644
--- a/editor/units.js
+++ b/editor/units.js
@@ -16,7 +16,7 @@
 'use strict';
 
 if (!svgedit.units) {
-	svgedit.units = {};
+  svgedit.units = {};
 }
 
 var NS = svgedit.NS;
@@ -26,15 +26,15 @@ var unitAttrs = ['r', 'radius'].concat(wAttrs, hAttrs);
 // unused
 /*
 var unitNumMap = {
-	'%': 2,
-	'em': 3,
-	'ex': 4,
-	'px': 5,
-	'cm': 6,
-	'mm': 7,
-	'in': 8,
-	'pt': 9,
-	'pc': 10
+  '%': 2,
+  'em': 3,
+  'ex': 4,
+  'px': 5,
+  'cm': 6,
+  'mm': 7,
+  'in': 8,
+  'pt': 9,
+  'pc': 10
 };
 */
 // Container of elements.
@@ -63,31 +63,31 @@ var typeMap_ = {};
  * elementContainer - an object implementing the ElementContainer interface.
  */
 svgedit.units.init = function (elementContainer) {
-	elementContainer_ = elementContainer;
+  elementContainer_ = elementContainer;
 
-	// Get correct em/ex values by creating a temporary SVG.
-	var svg = document.createElementNS(NS.SVG, 'svg');
-	document.body.appendChild(svg);
-	var rect = document.createElementNS(NS.SVG, 'rect');
-	rect.setAttribute('width', '1em');
-	rect.setAttribute('height', '1ex');
-	rect.setAttribute('x', '1in');
-	svg.appendChild(rect);
-	var bb = rect.getBBox();
-	document.body.removeChild(svg);
+  // Get correct em/ex values by creating a temporary SVG.
+  var svg = document.createElementNS(NS.SVG, 'svg');
+  document.body.appendChild(svg);
+  var rect = document.createElementNS(NS.SVG, 'rect');
+  rect.setAttribute('width', '1em');
+  rect.setAttribute('height', '1ex');
+  rect.setAttribute('x', '1in');
+  svg.appendChild(rect);
+  var bb = rect.getBBox();
+  document.body.removeChild(svg);
 
-	var inch = bb.x;
-	typeMap_ = {
-		'em': bb.width,
-		'ex': bb.height,
-		'in': inch,
-		'cm': inch / 2.54,
-		'mm': inch / 25.4,
-		'pt': inch / 72,
-		'pc': inch / 6,
-		'px': 1,
-		'%': 0
-	};
+  var inch = bb.x;
+  typeMap_ = {
+    'em': bb.width,
+    'ex': bb.height,
+    'in': inch,
+    'cm': inch / 2.54,
+    'mm': inch / 25.4,
+    'pt': inch / 72,
+    'pc': inch / 6,
+    'px': 1,
+    '%': 0
+  };
 };
 
 // Group: Unit conversion functions
@@ -95,7 +95,7 @@ svgedit.units.init = function (elementContainer) {
 // Function: svgedit.units.getTypeMap
 // Returns the unit object with values for each unit
 svgedit.units.getTypeMap = function () {
-	return typeMap_;
+  return typeMap_;
 };
 
 // Function: svgedit.units.shortFloat
@@ -108,25 +108,25 @@ svgedit.units.getTypeMap = function () {
 // If a string/number was given, returns a Float. If an array, return a string
 // with comma-separated floats
 svgedit.units.shortFloat = function (val) {
-	var digits = elementContainer_.getRoundDigits();
-	if (!isNaN(val)) {
-		// Note that + converts to Number
-		return +((+val).toFixed(digits));
-	}
-	if ($.isArray(val)) {
-		return svgedit.units.shortFloat(val[0]) + ',' + svgedit.units.shortFloat(val[1]);
-	}
-	return parseFloat(val).toFixed(digits) - 0;
+  var digits = elementContainer_.getRoundDigits();
+  if (!isNaN(val)) {
+    // Note that + converts to Number
+    return +((+val).toFixed(digits));
+  }
+  if ($.isArray(val)) {
+    return svgedit.units.shortFloat(val[0]) + ',' + svgedit.units.shortFloat(val[1]);
+  }
+  return parseFloat(val).toFixed(digits) - 0;
 };
 
 // Function: svgedit.units.convertUnit
 // Converts the number to given unit or baseUnit
 svgedit.units.convertUnit = function (val, unit) {
-	unit = unit || elementContainer_.getBaseUnit();
-	// baseVal.convertToSpecifiedUnits(unitNumMap[unit]);
-	// var val = baseVal.valueInSpecifiedUnits;
-	// baseVal.convertToSpecifiedUnits(1);
-	return svgedit.units.shortFloat(val / typeMap_[unit]);
+  unit = unit || elementContainer_.getBaseUnit();
+  // baseVal.convertToSpecifiedUnits(unitNumMap[unit]);
+  // var val = baseVal.valueInSpecifiedUnits;
+  // baseVal.convertToSpecifiedUnits(1);
+  return svgedit.units.shortFloat(val / typeMap_[unit]);
 };
 
 // Function: svgedit.units.setUnitAttr
@@ -137,49 +137,49 @@ svgedit.units.convertUnit = function (val, unit) {
 // attr - String with the name of the attribute associated with the value
 // val - String with the attribute value to convert
 svgedit.units.setUnitAttr = function (elem, attr, val) {
-	//	if (!isNaN(val)) {
-	// New value is a number, so check currently used unit
-	// var old_val = elem.getAttribute(attr);
+  //	if (!isNaN(val)) {
+  // New value is a number, so check currently used unit
+  // var old_val = elem.getAttribute(attr);
 
-	// Enable this for alternate mode
-	// if (old_val !== null && (isNaN(old_val) || elementContainer_.getBaseUnit() !== 'px')) {
-	// 	// Old value was a number, so get unit, then convert
-	// 	var unit;
-	// 	if (old_val.substr(-1) === '%') {
-	// 		var res = getResolution();
-	// 		unit = '%';
-	// 		val *= 100;
-	// 		if (wAttrs.indexOf(attr) >= 0) {
-	// 			val = val / res.w;
-	// 		} else if (hAttrs.indexOf(attr) >= 0) {
-	// 			val = val / res.h;
-	// 		} else {
-	// 			return val / Math.sqrt((res.w*res.w) + (res.h*res.h))/Math.sqrt(2);
-	// 		}
-	// 	} else {
-	// 		if (elementContainer_.getBaseUnit() !== 'px') {
-	// 			unit = elementContainer_.getBaseUnit();
-	// 		} else {
-	// 			unit = old_val.substr(-2);
-	// 		}
-	// 		val = val / typeMap_[unit];
-	// 	}
-	//
-	// val += unit;
-	// }
-	// }
-	elem.setAttribute(attr, val);
+  // Enable this for alternate mode
+  // if (old_val !== null && (isNaN(old_val) || elementContainer_.getBaseUnit() !== 'px')) {
+  // 	// Old value was a number, so get unit, then convert
+  // 	var unit;
+  // 	if (old_val.substr(-1) === '%') {
+  // 		var res = getResolution();
+  // 		unit = '%';
+  // 		val *= 100;
+  // 		if (wAttrs.indexOf(attr) >= 0) {
+  // 			val = val / res.w;
+  // 		} else if (hAttrs.indexOf(attr) >= 0) {
+  // 			val = val / res.h;
+  // 		} else {
+  // 			return val / Math.sqrt((res.w*res.w) + (res.h*res.h))/Math.sqrt(2);
+  // 		}
+  // 	} else {
+  // 		if (elementContainer_.getBaseUnit() !== 'px') {
+  // 			unit = elementContainer_.getBaseUnit();
+  // 		} else {
+  // 			unit = old_val.substr(-2);
+  // 		}
+  // 		val = val / typeMap_[unit];
+  // 	}
+  //
+  // val += unit;
+  // }
+  // }
+  elem.setAttribute(attr, val);
 };
 
 var attrsToConvert = {
-	'line': ['x1', 'x2', 'y1', 'y2'],
-	'circle': ['cx', 'cy', 'r'],
-	'ellipse': ['cx', 'cy', 'rx', 'ry'],
-	'foreignObject': ['x', 'y', 'width', 'height'],
-	'rect': ['x', 'y', 'width', 'height'],
-	'image': ['x', 'y', 'width', 'height'],
-	'use': ['x', 'y', 'width', 'height'],
-	'text': ['x', 'y']
+  'line': ['x1', 'x2', 'y1', 'y2'],
+  'circle': ['cx', 'cy', 'r'],
+  'ellipse': ['cx', 'cy', 'rx', 'ry'],
+  'foreignObject': ['x', 'y', 'width', 'height'],
+  'rect': ['x', 'y', 'width', 'height'],
+  'image': ['x', 'y', 'width', 'height'],
+  'use': ['x', 'y', 'width', 'height'],
+  'text': ['x', 'y']
 };
 
 // Function: svgedit.units.convertAttrs
@@ -188,25 +188,25 @@ var attrsToConvert = {
 // Parameters:
 // element - a DOM element whose attributes should be converted
 svgedit.units.convertAttrs = function (element) {
-	var elName = element.tagName;
-	var unit = elementContainer_.getBaseUnit();
-	var attrs = attrsToConvert[elName];
-	if (!attrs) { return; }
+  var elName = element.tagName;
+  var unit = elementContainer_.getBaseUnit();
+  var attrs = attrsToConvert[elName];
+  if (!attrs) { return; }
 
-	var len = attrs.length;
-	var i;
-	for (i = 0; i < len; i++) {
-		var attr = attrs[i];
-		var cur = element.getAttribute(attr);
-		if (cur) {
-			if (!isNaN(cur)) {
-				element.setAttribute(attr, (cur / typeMap_[unit]) + unit);
-			}
-			// else {
-			// Convert existing?
-			// }
-		}
-	}
+  var len = attrs.length;
+  var i;
+  for (i = 0; i < len; i++) {
+    var attr = attrs[i];
+    var cur = element.getAttribute(attr);
+    if (cur) {
+      if (!isNaN(cur)) {
+        element.setAttribute(attr, (cur / typeMap_[unit]) + unit);
+      }
+      // else {
+      // Convert existing?
+      // }
+    }
+  }
 };
 
 // Function: svgedit.units.convertToNum
@@ -217,27 +217,27 @@ svgedit.units.convertAttrs = function (element) {
 // attr - String with the name of the attribute associated with the value
 // val - String with the attribute value to convert
 svgedit.units.convertToNum = function (attr, val) {
-	// Return a number if that's what it already is
-	if (!isNaN(val)) { return val - 0; }
-	var num;
-	if (val.substr(-1) === '%') {
-		// Deal with percentage, depends on attribute
-		num = val.substr(0, val.length - 1) / 100;
-		var width = elementContainer_.getWidth();
-		var height = elementContainer_.getHeight();
+  // Return a number if that's what it already is
+  if (!isNaN(val)) { return val - 0; }
+  var num;
+  if (val.substr(-1) === '%') {
+    // Deal with percentage, depends on attribute
+    num = val.substr(0, val.length - 1) / 100;
+    var width = elementContainer_.getWidth();
+    var height = elementContainer_.getHeight();
 
-		if (wAttrs.indexOf(attr) >= 0) {
-			return num * width;
-		}
-		if (hAttrs.indexOf(attr) >= 0) {
-			return num * height;
-		}
-		return num * Math.sqrt((width * width) + (height * height)) / Math.sqrt(2);
-	}
-	var unit = val.substr(-2);
-	num = val.substr(0, val.length - 2);
-	// Note that this multiplication turns the string into a number
-	return num * typeMap_[unit];
+    if (wAttrs.indexOf(attr) >= 0) {
+      return num * width;
+    }
+    if (hAttrs.indexOf(attr) >= 0) {
+      return num * height;
+    }
+    return num * Math.sqrt((width * width) + (height * height)) / Math.sqrt(2);
+  }
+  var unit = val.substr(-2);
+  num = val.substr(0, val.length - 2);
+  // Note that this multiplication turns the string into a number
+  return num * typeMap_[unit];
 };
 
 // Function: svgedit.units.isValidUnit
@@ -247,37 +247,37 @@ svgedit.units.convertToNum = function (attr, val) {
 // attr - String with the name of the attribute associated with the value
 // val - String with the attribute value to check
 svgedit.units.isValidUnit = function (attr, val, selectedElement) {
-	var valid = false;
-	if (unitAttrs.indexOf(attr) >= 0) {
-		// True if it's just a number
-		if (!isNaN(val)) {
-			valid = true;
-		} else {
-		// Not a number, check if it has a valid unit
-			val = val.toLowerCase();
-			$.each(typeMap_, function (unit) {
-				if (valid) { return; }
-				var re = new RegExp('^-?[\\d\\.]+' + unit + '$');
-				if (re.test(val)) { valid = true; }
-			});
-		}
-	} else if (attr === 'id') {
-		// if we're trying to change the id, make sure it's not already present in the doc
-		// and the id value is valid.
+  var valid = false;
+  if (unitAttrs.indexOf(attr) >= 0) {
+    // True if it's just a number
+    if (!isNaN(val)) {
+      valid = true;
+    } else {
+    // Not a number, check if it has a valid unit
+      val = val.toLowerCase();
+      $.each(typeMap_, function (unit) {
+        if (valid) { return; }
+        var re = new RegExp('^-?[\\d\\.]+' + unit + '$');
+        if (re.test(val)) { valid = true; }
+      });
+    }
+  } else if (attr === 'id') {
+    // if we're trying to change the id, make sure it's not already present in the doc
+    // and the id value is valid.
 
-		var result = false;
-		// because getElem() can throw an exception in the case of an invalid id
-		// (according to http://www.w3.org/TR/xml-id/ IDs must be a NCName)
-		// we wrap it in an exception and only return true if the ID was valid and
-		// not already present
-		try {
-			var elem = elementContainer_.getElement(val);
-			result = (elem == null || elem === selectedElement);
-		} catch (e) {}
-		return result;
-	}
-	valid = true;
+    var result = false;
+    // because getElem() can throw an exception in the case of an invalid id
+    // (according to http://www.w3.org/TR/xml-id/ IDs must be a NCName)
+    // we wrap it in an exception and only return true if the ID was valid and
+    // not already present
+    try {
+      var elem = elementContainer_.getElement(val);
+      result = (elem == null || elem === selectedElement);
+    } catch (e) {}
+    return result;
+  }
+  valid = true;
 
-	return valid;
+  return valid;
 };
 }());