diff --git a/LICENSE b/LICENSE
index 5adcdb5a..f5d8e500 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,4 +1,4 @@
-Copyright (C) 2009 XING AG
+Copyright (C) 2011 XING AG
 
 This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 3 of the License, or any later version.
 
diff --git a/Makefile b/Makefile
index 217cc540..f704e66b 100644
--- a/Makefile
+++ b/Makefile
@@ -2,41 +2,51 @@ VERSION = $(shell cat version.txt)
 
 JS_OUTPUT = "dist/wysihtml5-${VERSION}.js"
 
-JS_FILES = lib/rangy/rangy-core.js \
-  lib/rangy/rangy-cssclassapplier-wysihtml5.js \
-  src/wysihtml5.js \
-  src/browser_support.js \
-  src/utils/auto_focus.js \
-  src/utils/auto_link.js \
-  src/utils/caret.js \
-  src/utils/contains.js \
-  src/utils/convert_into_list.js \
-  src/utils/copy_styles.js \
-  src/utils/copy_attributes.js \
-  src/utils/get_in_dom_element.js \
-  src/utils/get_parent_element.js \
-  src/utils/get_style.js \
-  src/utils/has_element_with_tag_name.js \
-  src/utils/has_element_with_class_name.js \
-  src/utils/insert_rules.js \
-  src/utils/observe.js \
-  src/utils/resolve_list.js \
-  src/utils/rename_element.js \
-  src/utils/remove_empty_text_nodes.js \
-  src/utils/sandbox.js \
-  src/utils/sanitize_html.js \
-  src/utils/simulate_placeholder.js \
-  src/utils/synchronizer.js \
-  src/utils/text_content.js \
-  src/utils/unwrap.js \
+JS_FILES = src/wysihtml5.js \
+  lib/rangy/rangy-core.js \
+  lib/base/base.js \
+  src/browser.js \
+  src/lang/array.js \
+  src/lang/dispatcher.js \
+  src/lang/object.js \
+  src/lang/string.js \
+  src/dom/auto_link.js \
+  src/dom/class.js \
+  src/dom/contains.js \
+  src/dom/convert_to_list.js \
+  src/dom/copy_attributes.js \
+  src/dom/copy_styles.js \
+  src/dom/delegate.js \
+  src/dom/get_as_dom.js \
+  src/dom/get_parent_element.js \
+  src/dom/get_style.js \
+  src/dom/has_element_with_tag_name.js \
+  src/dom/has_element_with_class_name.js \
+  src/dom/insert.js \
+  src/dom/insert_css.js \
+  src/dom/observe.js \
+  src/dom/parse.js \
+  src/dom/remove_empty_text_nodes.js \
+  src/dom/rename_element.js \
+  src/dom/replace_with_child_nodes.js \
+  src/dom/resolve_list.js \
+  src/dom/sandbox.js \
+  src/dom/set_attributes.js \
+  src/dom/set_styles.js \
+  src/dom/simulate_placeholder.js \
+  src/dom/text_content.js \
   src/quirks/clean_pasted_html.js \
   src/quirks/ensure_proper_clearing.js \
+  src/quirks/get_correct_inner_html.js \
   src/quirks/insert_line_break_on_return.js \
   src/quirks/redraw.js \
+  src/selection/selection.js \
+  src/selection/html_applier.js \
   src/views/view.js \
   src/views/composer.js \
   src/views/composer.style.js \
   src/views/composer.observe.js \
+  src/views/synchronizer.js \
   src/views/textarea.js \
   src/toolbar/dialog.js \
   src/toolbar/speech.js \
@@ -60,6 +70,20 @@ JS_FILES = lib/rangy/rangy-core.js \
   src/commands/underline.js \
   src/editor.js
 
-all:
+all: bundle minify
+
+bundle:
+	@@echo "Bundling..."
+	@@touch ${JS_OUTPUT}
 	@@rm ${JS_OUTPUT}
-	@@cat ${JS_FILES} >> ${JS_OUTPUT}
\ No newline at end of file
+	@@cat ${JS_FILES} >> ${JS_OUTPUT}
+	@@cat ${JS_OUTPUT} | sed "s/@VERSION/${VERSION}/" > "${JS_OUTPUT}.tmp"
+	@@mv "${JS_OUTPUT}.tmp" ${JS_OUTPUT}
+
+minify:
+	@@echo "Minifying... (this requires node.js)"
+	@@node build/minify.js ${JS_OUTPUT}
+	@@echo "Done."
+
+unittest:
+	@@open test/index.html
diff --git a/README.textile b/README.textile
index 22d19ada..a47820a6 100644
--- a/README.textile
+++ b/README.textile
@@ -1,8 +1,9 @@
-h1. wysihtml5 0.1.0
+h1. wysihtml5 0.2.0
 
 wysihtml5 is an open source rich text editor based on HTML5 technology and the progressive-enhancement approach.
-It uses a sophisticated security concept and aims to generate fully valid HTML5 markup by preventing unmaintainable tag-soups and inline-styles.
-The editor is already in production use on "XING.com":https://www.xing.com - a social network with more than 10 million members.
+It uses a sophisticated security concept and aims to generate fully valid HTML5 markup by preventing unmaintainable tag soups and inline styles.
+The code is completely library agnostic: No jQuery, Prototype or similar is required.
+The editor is already in use on "XING.com":https://www.xing.com - a social network with more than 10 million members.
 
 h2. Features:
 
@@ -15,6 +16,7 @@ h2. Features:
 * Source code view for users with HTML skills
 * Uses sandboxed iframes in order to prevent identity theft through XSS
 * Editor inherits styles and attributes (placeholder, autofocus, ...) from original textarea (you only have to style one element)
+* Speech-input for Chrome 11+
 
 h2. Browser Support
 
@@ -44,7 +46,7 @@ Following is a list of all configuration options with their corresponding defaul
     // Object which includes parser rules (set this to examples/rules/spec.json or your own spec, otherwise only span tags are allowed!)
     parserRules:          null,
     // Parser method to use when the user inserts content via copy & paste
-    parser:               wysihtml5.utils.sanitizeHTML || Prototype.K,
+    parser:               wysihtml5.dom.parse || Prototype.K,
     // Class name which should be set on the contentEditable element in the created sandbox iframe, can be styled via the 'stylesheets' option
     composerClassName:    "wysihtml5-editor",
     // Class name to add to the body when the wysihtml5 editor is supported
@@ -113,6 +115,20 @@ copied to the hidden <code><textarea></code>)
 behavior on the iframe's <code><body></code>
 # Checks whether a toolbar is given and sets event listeners on it's link
 
+h2. How to build your own wysihtml5 files
+
+Clone and build the js file:
+<code>
+  git clone git://github.com/xing/wysihtml5.git
+  cd wysihtml5
+  make
+</code>
+
+Run the unit tests:
+<code>
+  make unittest
+</code>
+
 h2. Research Material
 
 Before starting this library we spent a lot of time investigating the different browsers and their behaviors.
diff --git a/build/minify.js b/build/minify.js
new file mode 100644
index 00000000..c7d1b80e
--- /dev/null
+++ b/build/minify.js
@@ -0,0 +1,82 @@
+var script      = process.argv[2],
+    http        = require("http"),
+    queryString = require("querystring"),
+    fs          = require("fs");
+
+if (!script) {
+  throw "No script url given";
+}
+
+function post(code, callback) {
+  // Build the post string from an object
+  var postData = queryString.stringify({
+    compilation_level:  "SIMPLE_OPTIMIZATIONS",
+    output_format:      "text",
+    output_info:        "compiled_code",
+    warning_level:      "QUIET",
+    js_code:            code
+  });
+
+  // An object of options to indicate where to post to
+  var postOptions = {
+    host: "closure-compiler.appspot.com",
+    port: "80",
+    path: "/compile",
+    method: "POST",
+    headers: {
+      "Content-Type":   "application/x-www-form-urlencoded",
+      "Content-Length": postData.length
+    }
+  };
+  
+  // Set up the request
+  var request = http.request(postOptions, function(response) {
+    var responseText = [];
+    response.setEncoding("utf8");
+    response.on("data", function(data) {
+      responseText.push(data);
+    });
+    response.on("end", function() {
+      callback(responseText.join(""));
+    });
+  });
+  
+  // Post the data
+  request.write(postData);
+  request.end();
+}
+
+function readFile(filePath, callback) {
+  // This is an async file read
+  fs.readFile(filePath, "utf-8", function (err, data) {
+    if (err) {
+      // If this were just a small part of the application, you would
+      // want to handle this differently, maybe throwing an exception
+      // for the caller to handle. Since the file is absolutely essential
+      // to the program's functionality, we're going to exit with a fatal
+      // error instead.
+      console.log("FATAL An error occurred trying to read in the file: " + err);
+      process.exit(-2);
+    }
+    // Make sure there's data before we post it
+    if (data) {
+      callback(data);
+    } else {
+      console.log("No data to post");
+      process.exit(-1);
+    }
+  });
+}
+
+function writeFile(filePath, data, callback) {
+  fs.writeFile(filePath, data, "utf-8", callback);
+}
+
+
+// Ok GO!
+readFile(script, function(code) {
+  post(code, function(code) {
+    var output = script.replace(/\.js/, ".min.js");
+    writeFile(output, code);
+  });
+});
diff --git a/dist/wysihtml5-0.1.0.js b/dist/wysihtml5-0.2.0.js
similarity index 57%
rename from dist/wysihtml5-0.1.0.js
rename to dist/wysihtml5-0.2.0.js
index 0b92e6f1..8b2e04cf 100644
--- a/dist/wysihtml5-0.1.0.js
+++ b/dist/wysihtml5-0.2.0.js
@@ -1,4 +1,38 @@
 /**
+ * @license wysihtml5 v0.2.0
+ * https://github.com/xing/wysihtml5
+ *
+ * Author: Christopher Blum (https://github.com/tiff)
+ *
+ * Copyright (C) 2011 XING AG
+ * Licensed under GNU General Public License
+ *
+ */
+var wysihtml5 = {
+  version: "0.2.0",
+  
+  // namespaces
+  commands:   {},
+  dom:        {},
+  quirks:     {},
+  toolbar:    {},
+  lang:       {},
+  selection:  {},
+  views:      {},
+  
+  INVISIBLE_SPACE: "\uFEFF",
+  
+  EMPTY_FUNCTION: function() {},
+  
+  ELEMENT_NODE: 1,
+  TEXT_NODE:    3,
+  
+  BACKSPACE_KEY:  8,
+  ENTER_KEY:      13,
+  ESCAPE_KEY:     27,
+  SPACE_KEY:      32,
+  DELETE_KEY:     46
+};/**
  * @license Rangy, a cross-browser JavaScript range and selection library
  * http://code.google.com/p/rangy/
  *
@@ -2959,773 +2993,654 @@ rangy.createModule("DomUtil", function(api, module) {
         win = null;
     });
 });
-/**
- * @license CSS Class Applier module for Rangy.
- * Adds, removes and toggles CSS classes on Ranges and Selections
- *
- * Part of Rangy, a cross-browser JavaScript range and selection library
- * http://code.google.com/p/rangy/
- *
- * Depends on Rangy core.
- *
- * Copyright 2011, Tim Down
- * Licensed under the MIT license.
- * Version: 1.1
- * Build date: 12 March 2011
- *
- * Adjusted by Christopher Blum <christopher.blum@xing.com> to match WYSIHTML5 logic
- * in order to be able ...
- *    - to use custom tags
- *    - to detect and replace similar css classes via reg exp
- */
-rangy.createModule("CssClassApplier", function(api, module) {
-    api.requireModules( ["WrappedSelection", "WrappedRange"] );
-
-    var dom = api.dom;
-    
-    var defaultTagName = "span";
-
-    function trim(str) {
-        return str.replace(/^\s\s*/, "").replace(/\s\s*$/, "");
-    }
-
-    function hasClass(el, cssClass, regExp) {
-        if (!el.className) {
-          return false;
-        }
-        
-        var matchingClassNames = el.className.match(regExp) || [];
-        return matchingClassNames[matchingClassNames.length - 1] === cssClass;
-    }
-
-    function addClass(el, cssClass, regExp) {
-        if (el.className) {
-            removeClass(el, regExp);
-            el.className += " " + cssClass;
-        } else {
-            el.className = cssClass;
-        }
-    }
-
-    function removeClass(el, regExp) {
-        if (el.className) {
-            el.className = el.className.replace(regExp, "");
-        }
-    }
-    
-    function hasSameClasses(el1, el2) {
-        return el1.className.replace(/\s+/, " ") == el2.className.replace(/\s+/, " ");
-    }
-
-    function replaceWithOwnChildren(el) {
-        var parent = el.parentNode;
-        while (el.hasChildNodes()) {
-            parent.insertBefore(el.firstChild, el);
-        }
-        parent.removeChild(el);
-    }
-
-    function elementsHaveSameNonClassAttributes(el1, el2) {
-        if (el1.attributes.length != el2.attributes.length) return false;
-        for (var i = 0, len = el1.attributes.length, attr1, attr2, name; i < len; ++i) {
-            attr1 = el1.attributes[i];
-            name = attr1.name;
-            if (name != "class") {
-                attr2 = el2.attributes.getNamedItem(name);
-                if (attr1.specified != attr2.specified) return false;
-                if (attr1.specified && attr1.nodeValue !== attr2.nodeValue) return false;
-            }
-        }
-        return true;
-    }
-
-    function isSplitPoint(node, offset) {
-        if (dom.isCharacterDataNode(node)) {
-            if (offset == 0) {
-                return !!node.previousSibling;
-            } else if (offset == node.length) {
-                return !!node.nextSibling;
-            } else {
-                return true;
-            }
-        }
+/*
+	Base.js, version 1.1a
+	Copyright 2006-2010, Dean Edwards
+	License: http://www.opensource.org/licenses/mit-license.php
+*/
 
-        return offset > 0 && offset < node.childNodes.length;
-    }
+var Base = function() {
+	// dummy
+};
 
-    function splitNodeAt(node, descendantNode, descendantOffset) {
+Base.extend = function(_instance, _static) { // subclass
+	var extend = Base.prototype.extend;
+	
+	// build the prototype
+	Base._prototyping = true;
+	var proto = new this;
+	extend.call(proto, _instance);
+  proto.base = function() {
+    // call this method from any other method to invoke that method's ancestor
+  };
+	delete Base._prototyping;
+	
+	// create the wrapper for the constructor function
+	//var constructor = proto.constructor.valueOf(); //-dean
+	var constructor = proto.constructor;
+	var klass = proto.constructor = function() {
+		if (!Base._prototyping) {
+			if (this._constructing || this.constructor == klass) { // instantiation
+				this._constructing = true;
+				constructor.apply(this, arguments);
+				delete this._constructing;
+			} else if (arguments[0] != null) { // casting
+				return (arguments[0].extend || extend).call(arguments[0], proto);
+			}
+		}
+	};
+	
+	// build the class interface
+	klass.ancestor = this;
+	klass.extend = this.extend;
+	klass.forEach = this.forEach;
+	klass.implement = this.implement;
+	klass.prototype = proto;
+	klass.toString = this.toString;
+	klass.valueOf = function(type) {
+		//return (type == "object") ? klass : constructor; //-dean
+		return (type == "object") ? klass : constructor.valueOf();
+	};
+	extend.call(klass, _static);
+	// class initialisation
+	if (typeof klass.init == "function") klass.init();
+	return klass;
+};
 
-        var newNode;
-        if (dom.isCharacterDataNode(descendantNode)) {
-            if (descendantOffset == 0) {
-                descendantOffset = dom.getNodeIndex(descendantNode);
-                descendantNode = descendantNode.parentNode;
-            } else if (descendantOffset == descendantNode.length) {
-                descendantOffset = dom.getNodeIndex(descendantNode) + 1;
-                descendantNode = descendantNode.parentNode;
-            } else {
-                newNode = dom.splitDataNode(descendantNode, descendantOffset);
-            }
-        }
-        if (!newNode) {
-            newNode = descendantNode.cloneNode(false);
-            if (newNode.id) {
-                newNode.removeAttribute("id");
-            }
-            var child;
-            while ((child = descendantNode.childNodes[descendantOffset])) {
+Base.prototype = {	
+	extend: function(source, value) {
+		if (arguments.length > 1) { // extending with a name/value pair
+			var ancestor = this[source];
+			if (ancestor && (typeof value == "function") && // overriding a method?
+				// the valueOf() comparison is to avoid circular references
+				(!ancestor.valueOf || ancestor.valueOf() != value.valueOf()) &&
+				/\bbase\b/.test(value)) {
+				// get the underlying method
+				var method = value.valueOf();
+				// override
+				value = function() {
+					var previous = this.base || Base.prototype.base;
+					this.base = ancestor;
+					var returnValue = method.apply(this, arguments);
+					this.base = previous;
+					return returnValue;
+				};
+				// point to the underlying method
+				value.valueOf = function(type) {
+					return (type == "object") ? value : method;
+				};
+				value.toString = Base.toString;
+			}
+			this[source] = value;
+		} else if (source) { // extending with an object literal
+			var extend = Base.prototype.extend;
+			// if this object has a customised extend method then use it
+			if (!Base._prototyping && typeof this != "function") {
+				extend = this.extend || extend;
+			}
+			var proto = {toSource: null};
+			// do the "toString" and other methods manually
+			var hidden = ["constructor", "toString", "valueOf"];
+			// if we are prototyping then include the constructor
+			var i = Base._prototyping ? 0 : 1;
+			while (key = hidden[i++]) {
+				if (source[key] != proto[key]) {
+					extend.call(this, key, source[key]);
+
+				}
+			}
+			// copy each of the source object's properties to this object
+			for (var key in source) {
+				if (!proto[key]) extend.call(this, key, source[key]);
+			}
+		}
+		return this;
+	}
+};
 
-                newNode.appendChild(child);
-            }
-            dom.insertAfter(newNode, descendantNode);
-        }
-        return (descendantNode == node) ? newNode : splitNodeAt(node, newNode.parentNode, dom.getNodeIndex(newNode));
-    }
+// initialise
+Base = Base.extend({
+	constructor: function() {
+		this.extend(arguments[0]);
+	}
+}, {
+	ancestor: Object,
+	version: "1.1",
+	
+	forEach: function(object, block, context) {
+		for (var key in object) {
+			if (this.prototype[key] === undefined) {
+				block.call(context, object[key], key, object);
+			}
+		}
+	},
+		
+	implement: function() {
+		for (var i = 0; i < arguments.length; i++) {
+			if (typeof arguments[i] == "function") {
+				// if it's a function, call it
+				arguments[i](this.prototype);
+			} else {
+				// add the interface using the extend method
+				this.prototype.extend(arguments[i]);
+			}
+		}
+		return this;
+	},
+	
+	toString: function() {
+		return String(this.valueOf());
+	}
+});/**
+ * Detect browser support for specific features
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ */
+wysihtml5.browser = (function() {
+  var userAgent   = navigator.userAgent,
+      testElement = document.createElement("div"),
+      // Browser sniffing is unfortunately needed since some behaviors are impossible to feature detect
+      isIE        = userAgent.indexOf("MSIE")         !== -1 && userAgent.indexOf("Opera") === -1,
+      isGecko     = userAgent.indexOf("Gecko")        !== -1 && userAgent.indexOf("KHTML") === -1,
+      isWebKit    = userAgent.indexOf("AppleWebKit/") !== -1,
+      isOpera     = userAgent.indexOf("Opera/")       !== -1;
+  
+  return {
+    // Static variable needed, publicly accessible, to be able override it in unit tests
+    USER_AGENT: userAgent,
     
-    function Merge(firstNode) {
-        this.isElementMerge = (firstNode.nodeType == 1);
-        this.firstTextNode = this.isElementMerge ? firstNode.lastChild : firstNode;
-        this.textNodes = [this.firstTextNode];
-    }
-
-    Merge.prototype = {
-        doMerge: function() {
-            var textBits = [], textNode, parent, text;
-            for (var i = 0, len = this.textNodes.length; i < len; ++i) {
-                textNode = this.textNodes[i];
-                parent = textNode.parentNode;
-                textBits[i] = textNode.data;
-                if (i) {
-                    parent.removeChild(textNode);
-                    if (!parent.hasChildNodes()) {
-                        parent.parentNode.removeChild(parent);
-                    }
-                }
-            }
-            this.firstTextNode.data = text = textBits.join("");
-            return text;
-        },
+    /**
+     * Exclude browsers that are not capable of displaying and handling
+     * contentEditable as desired:
+     *    - iPhone, iPad (tested iOS 4.2.2) and Android (tested 2.2) refuse to make contentEditables focusable
+     *    - IE < 8 create invalid markup and crash randomly from time to time
+     *
+     * @return {Boolean}
+     */
+    supported: function() {
+      var userAgent                   = this.USER_AGENT.toLowerCase(),
+          // Essential for making html elements editable
+          hasContentEditableSupport   = "contentEditable" in testElement,
+          // Following methods are needed in order to interact with the contentEditable area
+          hasEditingApiSupport        = document.execCommand && document.queryCommandSupported && document.queryCommandState,
+          // document selector apis are only supported by IE 8+, Safari 4+, Chrome and Firefox 3.5+
+          hasQuerySelectorSupport     = document.querySelector && document.querySelectorAll,
+          // contentEditable is unusable in mobile browsers (tested iOS 4.2.2, Android 2.2, Opera Mobile)
+          isIncompatibleMobileBrowser = (userAgent.indexOf("webkit") !== -1 && userAgent.indexOf("mobile") !== -1) || userAgent.indexOf("opera mobi") !== -1;
+
+      return hasContentEditableSupport
+        && hasEditingApiSupport
+        && hasQuerySelectorSupport
+        && !isIncompatibleMobileBrowser;
+    },
 
-        getLength: function() {
-            var i = this.textNodes.length, len = 0;
-            while (i--) {
-                len += this.textNodes[i].length;
-            }
-            return len;
-        },
+    /**
+     * Whether the browser supports sandboxed iframes
+     * Currently only IE 6+ offers such feature <iframe security="restricted">
+     *
+     * http://msdn.microsoft.com/en-us/library/ms534622(v=vs.85).aspx
+     * http://blogs.msdn.com/b/ie/archive/2008/01/18/using-frames-more-securely.aspx
+     *
+     * HTML5 sandboxed iframes are still buggy and their DOM is not reachable from the outside (except when using postMessage)
+     */
+    supportsSandboxedIframes: function() {
+      return isIE;
+    },
 
-        toString: function() {
-            var textBits = [];
-            for (var i = 0, len = this.textNodes.length; i < len; ++i) {
-                textBits[i] = "'" + this.textNodes[i].data + "'";
-            }
-            return "[Merge(" + textBits.join(",") + ")]";
-        }
-    };
+    /**
+     * IE6+7 throw a mixed content warning when the src of an iframe
+     * is empty/unset or about:blank
+     * window.querySelector is implemented as of IE8
+     */
+    throwsMixedContentWarningWhenIframeSrcIsEmpty: function() {
+      return !("querySelector" in document);
+    },
 
-    function CssClassApplier(tagNames, cssClass, similarClassRegExp, normalize) {
-        this.tagNames = tagNames || [defaultTagName];
-        this.cssClass = cssClass || "";
-        this.similarClassRegExp = similarClassRegExp;
-        this.normalize = normalize;
-        this.applyToAnyTagName = false;
-    }
-
-    CssClassApplier.prototype = {
-        getAncestorWithClass: function(node) {
-            var cssClassMatch;
-            while (node) {
-                cssClassMatch = this.cssClass ? hasClass(node, this.cssClass, this.similarClassRegExp) : true;
-                if (node.nodeType == 1 && dom.arrayContains(this.tagNames, node.tagName.toLowerCase()) && cssClassMatch) {
-                    return node;
-                }
-                node = node.parentNode;
-            }
-            return false;
-        },
+    /**
+     * Whether the caret is correctly displayed in contentEditable elements
+     * Firefox sometimes shows a huge caret in the beginning after focusing
+     */
+    displaysCaretInEmptyContentEditableCorrectly: function() {
+      return !isGecko;
+    },
 
-        // Normalizes nodes after applying a CSS class to a Range.
-        postApply: function(textNodes, range) {
-            var firstNode = textNodes[0], lastNode = textNodes[textNodes.length - 1];
+    /**
+     * Opera and IE are the only browsers who offer the css value
+     * in the original unit, thx to the currentStyle object
+     * All other browsers provide the computed style in px via window.getComputedStyle
+     */
+    hasCurrentStyleProperty: function() {
+      return "currentStyle" in testElement;
+    },
 
-            var merges = [], currentMerge;
+    /**
+     * Whether the browser inserts a <br> when pressing enter in a contentEditable element
+     */
+    insertsLineBreaksOnReturn: function() {
+      return isGecko;
+    },
 
-            var rangeStartNode = firstNode, rangeEndNode = lastNode;
-            var rangeStartOffset = 0, rangeEndOffset = lastNode.length;
+    supportsPlaceholderAttributeOn: function(element) {
+      return "placeholder" in element;
+    },
 
-            var textNode, precedingTextNode;
+    supportsEvent: function(eventName) {
+      return "on" + eventName in testElement || (function() {
+        testElement.setAttribute("on" + eventName, "return;");
+        return typeof(testElement["on" + eventName]) === "function";
+      })();
+    },
 
-            for (var i = 0, len = textNodes.length; i < len; ++i) {
-                textNode = textNodes[i];
-                precedingTextNode = this.getAdjacentMergeableTextNode(textNode.parentNode, false);
-                if (precedingTextNode) {
-                    if (!currentMerge) {
-                        currentMerge = new Merge(precedingTextNode);
-                        merges.push(currentMerge);
-                    }
-                    currentMerge.textNodes.push(textNode);
-                    if (textNode === firstNode) {
-                        rangeStartNode = currentMerge.firstTextNode;
-                        rangeStartOffset = rangeStartNode.length;
-                    }
-                    if (textNode === lastNode) {
-                        rangeEndNode = currentMerge.firstTextNode;
-                        rangeEndOffset = currentMerge.getLength();
-                    }
-                } else {
-                    currentMerge = null;
-                }
-            }
+    /**
+     * Opera doesn't correctly fire focus/blur events when clicking in- and outside of iframe
+     */
+    supportsEventsInIframeCorrectly: function() {
+      return !isOpera;
+    },
 
-            // Test whether the first node after the range needs merging
-            var nextTextNode = this.getAdjacentMergeableTextNode(lastNode.parentNode, true);
-            if (nextTextNode) {
-                if (!currentMerge) {
-                    currentMerge = new Merge(lastNode);
-                    merges.push(currentMerge);
-                }
-                currentMerge.textNodes.push(nextTextNode);
-            }
+    /**
+     * Chrome & Safari only fire the ondrop/ondragend/... events when the ondragover event is cancelled
+     * with event.preventDefault
+     * Firefox 3.6 fires those events anyway, but the mozilla doc says that the dragover/dragenter event needs
+     * to be cancelled
+     */
+    firesOnDropOnlyWhenOnDragOverIsCancelled: function() {
+      return isWebKit || isGecko;
+    },
+    
+    /**
+     * Whether the browser supports the event.dataTransfer property in a proper way
+     */
+    supportsDataTransfer: function() {
+      try {
+        // Firefox doesn't support dataTransfer in a safe way, it doesn't strip script code in the html payload (like Chrome does)
+        return isWebKit && (window.Clipboard || window.DataTransfer).prototype.getData;
+      } catch(e) {
+        return false;
+      }
+    },
 
-            // Do the merges
-            if (merges.length) {
-                for (i = 0, len = merges.length; i < len; ++i) {
-                    merges[i].doMerge();
-                }
-                // Set the range boundaries
-                range.setStart(rangeStartNode, rangeStartOffset);
-                range.setEnd(rangeEndNode, rangeEndOffset);
-            }
+    /**
+     * Everything below IE9 doesn't know how to treat HTML5 tags
+     *
+     * @param {Object} context The document object on which to check HTML5 support
+     *
+     * @example
+     *    wysihtml5.browser.supportsHTML5Tags(document);
+     */
+    supportsHTML5Tags: function(context) {
+      var element = context.createElement("div"),
+          html5   = "<article>foo</article>";
+      element.innerHTML = html5;
+      return element.innerHTML.toLowerCase() === html5;
+    },
 
-        },
-        
-        getAdjacentMergeableTextNode: function(node, forward) {
-            var isTextNode = (node.nodeType == 3);
-            var el = isTextNode ? node.parentNode : node;
-            var adjacentNode;
-            var propName = forward ? "nextSibling" : "previousSibling";
-            if (isTextNode) {
-                // Can merge if the node's previous/next sibling is a text node
-                adjacentNode = node[propName];
-                if (adjacentNode && adjacentNode.nodeType == 3) {
-                    return adjacentNode;
-                }
-            } else {
-                // Compare element with its sibling
-                adjacentNode = el[propName];
-                if (adjacentNode && this.areElementsMergeable(node, adjacentNode)) {
-                    return adjacentNode[forward ? "firstChild" : "lastChild"];
-                }
-            }
-            return null;
-        },
-        
-        areElementsMergeable: function(el1, el2) {
-            return dom.arrayContains(this.tagNames, (el1.tagName || "").toLowerCase())
-              && dom.arrayContains(this.tagNames, (el2.tagName || "").toLowerCase())
-              && hasSameClasses(el1, el2)
-              && elementsHaveSameNonClassAttributes(el1, el2);
-        },
+    /**
+     * Checks whether a document supports a certain queryCommand
+     * In particular, Opera needs a reference to a document that has a contentEditable in it's dom tree
+     * in oder to report correct results
+     *
+     * @param {Object} doc Document object on which to check for a query command
+     * @param {String} command The query command to check for
+     * @return {Boolean}
+     *
+     * @example
+     *    wysihtml5.browser.supportsCommand(document, "bold");
+     */
+    supportsCommand: (function() {
+      // Following commands are supported but contain bugs in some browsers
+      var buggyCommands = {
+        // formatBlock fails with some tags (eg. <blockquote>)
+        "formatBlock":          isIE,
+         // When inserting unordered or ordered lists in Firefox, Chrome or Safari, the current selection or line gets
+         // converted into a list (<ul><li>...</li></ul>, <ol><li>...</li></ol>)
+         // IE and Opera act a bit different here as they convert the entire content of the current block element into a list
+        "insertUnorderedList":  isIE || isOpera,
+        "insertOrderedList":    isIE || isOpera
+      };
 
-        createContainer: function(doc) {
-            var el = doc.createElement(this.tagNames[0]);
-            if (this.cssClass) {
-              el.className = this.cssClass;
-            }
-            return el;
-        },
+      return function(doc, command) {
+        var isBuggy = buggyCommands[command];
+        if (!isBuggy) {
+          // Firefox throws errors when invoking queryCommandSupported or queryCommandEnabled
+          try {
+            return doc.queryCommandSupported(command);
+          } catch(e1) {}
 
-        applyToTextNode: function(textNode) {
-            var parent = textNode.parentNode;
-            if (parent.childNodes.length == 1 && dom.arrayContains(this.tagNames, parent.tagName.toLowerCase())) {
-                if (this.cssClass) {
-                  addClass(parent, this.cssClass, this.similarClassRegExp);
-                }
-            } else {
-                var el = this.createContainer(dom.getDocument(textNode));
-                textNode.parentNode.insertBefore(el, textNode);
-                el.appendChild(textNode);
-            }
-        },
+          try {
+            return doc.queryCommandEnabled(command);
+          } catch(e2) {}
+        }
+        return false;
+      };
+    })(),
 
-        isRemovable: function(el) {
-            return dom.arrayContains(this.tagNames, el.tagName.toLowerCase()) && trim(el.className) == this.cssClass;
-        },
+    /**
+     * IE: URLs starting with:
+     *    www., http://, https://, ftp://, gopher://, mailto:, new:, snews:, telnet:, wasis:, file://,
+     *    nntp://, newsrc:, ldap://, ldaps://, outlook:, mic:// and url:
+     * will automatically be auto-linked when either the user inserts them via copy&paste or presses the
+     * space bar when the caret is directly after such an url.
+     * This behavior cannot easily be avoided in IE < 9 since the logic is hardcoded in the mshtml.dll
+     * (related blog post on msdn
+     * http://blogs.msdn.com/b/ieinternals/archive/2009/09/17/prevent-automatic-hyperlinking-in-contenteditable-html.aspx).
+     */
+    doesAutoLinkingInContentEditable: function() {
+      return isIE;
+    },
 
-        undoToTextNode: function(textNode, range, ancestorWithClass) {
-            if (!range.containsNode(ancestorWithClass)) {
-                // Split out the portion of the ancestor from which we can remove the CSS class
-                var ancestorRange = range.cloneRange();
-                ancestorRange.selectNode(ancestorWithClass);
+    /**
+     * As stated above, IE auto links urls typed into contentEditable elements
+     * Since IE9 it's possible to prevent this behavior
+     */
+    canDisableAutoLinking: function() {
+      return this.supportsCommand(document, "AutoUrlDetect");
+    },
 
-                if (ancestorRange.isPointInRange(range.endContainer, range.endOffset) && isSplitPoint(range.endContainer, range.endOffset)) {
-                    splitNodeAt(ancestorWithClass, range.endContainer, range.endOffset);
-                    range.setEndAfter(ancestorWithClass);
-                }
-                if (ancestorRange.isPointInRange(range.startContainer, range.startOffset) && isSplitPoint(range.startContainer, range.startOffset)) {
-                    ancestorWithClass = splitNodeAt(ancestorWithClass, range.startContainer, range.startOffset);
-                }
-            }
-            
-            if (this.similarClassRegExp) {
-              removeClass(ancestorWithClass, this.similarClassRegExp);
-            }
-            if (this.isRemovable(ancestorWithClass)) {
-                replaceWithOwnChildren(ancestorWithClass);
-            }
-        },
+    /**
+     * IE leaves an empty paragraph in the contentEditable element after clearing it
+     * Chrome/Safari sometimes an empty <div>
+     */
+    clearsContentEditableCorrectly: function() {
+      return isGecko || isOpera || isWebKit;
+    },
 
-        applyToRange: function(range) {
-            var textNodes = range.getNodes([3]);
-            if (!textNodes.length) {
-              try {
-                var node = this.createContainer(range.endContainer.ownerDocument);
-                range.surroundContents(node);
-                this.selectNode(range, node);
-                return;
-              } catch(e) {}
-            }
-            
-            range.splitBoundaries();
-            textNodes = range.getNodes([3]);
-            
-            if (textNodes.length) {
-                var textNode;
-
-                for (var i = 0, len = textNodes.length; i < len; ++i) {
-                    textNode = textNodes[i];
-                    if (!this.getAncestorWithClass(textNode)) {
-                        this.applyToTextNode(textNode);
-                    }
-                }
-                
-                range.setStart(textNodes[0], 0);
-                textNode = textNodes[textNodes.length - 1];
-                range.setEnd(textNode, textNode.length);
-                
-                if (this.normalize) {
-                    this.postApply(textNodes, range);
-                }
-            }
-        },
+    /**
+     * IE gives wrong results for getAttribute
+     */
+    supportsGetAttributeCorrectly: function() {
+      var td = document.createElement("td");
+      return td.getAttribute("rowspan") != "1";
+    },
 
-        undoToRange: function(range) {
-            var textNodes = range.getNodes([3]), textNode, ancestorWithClass;
-            if (textNodes.length) {
-              range.splitBoundaries();
-              textNodes = range.getNodes([3]);
-            } else {
-              var doc = range.endContainer.ownerDocument,
-                  node = doc.createTextNode("\uFEFF");
-              range.insertNode(node);
-              range.selectNode(node);
-              textNodes = [node];
-            }
-            
-            for (var i = 0, len = textNodes.length; i < len; ++i) {
-                textNode = textNodes[i];
-                ancestorWithClass = this.getAncestorWithClass(textNode);
-                if (ancestorWithClass) {
-                    this.undoToTextNode(textNode, range, ancestorWithClass);
-                }
-            }
-            
-            if (len == 1) {
-                this.selectNode(range, textNodes[0]);
-            } else {
-                range.setStart(textNodes[0], 0);
-                textNode = textNodes[textNodes.length - 1];
-                range.setEnd(textNode, textNode.length);
+    /**
+     * When clicking on images in IE, Opera and Firefox, they are selected, which makes it easy to interact with them.
+     * Chrome and Safari both don't support this
+     */
+    canSelectImagesInContentEditable: function() {
+      return isGecko || isIE || isOpera;
+    },
 
-                if (this.normalize) {
-                    this.postApply(textNodes, range);
-                }
-            }
-        },
-        
-        selectNode: function(range, node) {
-          var isElement       = node.nodeType === 1,
-              canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : true,
-              content         = isElement ? node.innerHTML : node.data,
-              isEmpty         = (content === "" || content === "\uFEFF");
-
-          if (isEmpty && isElement && canHaveHTML) {
-              // Make sure that caret is visible in node by inserted a zero width no breaking space
-              try { node.innerHTML = "\uFEFF"; } catch(e) {}
-          }
-          range.selectNodeContents(node);
-          if (isEmpty && isElement) {
-              range.collapse(false);
-          } else if (isEmpty) {
-              range.setStartAfter(node);
-              range.setEndAfter(node);
-          }
-        },
-        
-        getTextSelectedByRange: function(textNode, range) {
-            var textRange = range.cloneRange();
-            textRange.selectNodeContents(textNode);
+    /**
+     * When the caret is in an empty list (<ul><li>|</li></ul>) which is the first child in an contentEditable container
+     * pressing backspace doesn't remove the entire list as done in other browsers
+     */
+    clearsListsInContentEditableCorrectly: function() {
+      return isGecko || isIE || isWebKit;
+    },
 
-            var intersectionRange = textRange.intersection(range);
-            var text = intersectionRange ? intersectionRange.toString() : "";
-            textRange.detach();
+    /**
+     * All browsers except Safari and Chrome automatically scroll the range/caret position into view
+     */
+    autoScrollsToCaret: function() {
+      return !isWebKit;
+    },
 
-            return text;
-        },
+    /**
+     * Check whether the browser automatically closes tags that don't need to be opened
+     */
+    autoClosesUnclosedTags: function() {
+      var clonedTestElement = testElement.cloneNode(false),
+          returnValue,
+          innerHTML;
 
-        isAppliedToRange: function(range) {
-            var ancestors = [],
-                ancestor,
-                textNodes = range.getNodes([3]);
-            if (!textNodes.length) {
-              var ancestor = this.getAncestorWithClass(range.startContainer);
-              return ancestor ? [ancestor] : false;
-            }
-            
-            for (var i = 0, len = textNodes.length, selectedText; i < len; ++i) {
-                selectedText = this.getTextSelectedByRange(textNodes[i], range);
-                ancestor = this.getAncestorWithClass(textNodes[i]);
-                if (selectedText != "" && !ancestor) {
-                    return false;
-                } else {
-                    ancestors.push(ancestor);
-                }
-            }
-            return ancestors;
-        },
+      clonedTestElement.innerHTML = "<p><div></div>";
+      innerHTML                   = clonedTestElement.innerHTML.toLowerCase();
+      returnValue                 = innerHTML === "<p></p><div></div>" || innerHTML === "<p><div></div></p>";
 
-        toggleRange: function(range) {
-            if (this.isAppliedToRange(range)) {
-                this.undoToRange(range);
-            } else {
-                this.applyToRange(range);
-            }
-        }
-    };
+      // Cache result by overwriting current function
+      this.autoClosesUnclosedTags = function() { return returnValue; };
 
-    function createCssClassApplier(tagNames, cssClass, classRegExp, normalize) {
-        return new CssClassApplier(tagNames, cssClass, classRegExp, normalize);
-    }
+      return returnValue;
+    },
 
-    CssClassApplier.util = {
-        hasClass: hasClass,
-        addClass: addClass,
-        removeClass: removeClass,
-        hasSameClasses: hasSameClasses,
-        replaceWithOwnChildren: replaceWithOwnChildren,
-        elementsHaveSameNonClassAttributes: elementsHaveSameNonClassAttributes,
-        splitNodeAt: splitNodeAt
-    };
+    /**
+     * Whether the browser supports the native document.getElementsByClassName which returns live NodeLists
+     */
+    supportsNativeGetElementsByClassName: function() {
+      return String(document.getElementsByClassName).indexOf("[native code]") !== -1;
+    },
 
-    api.CssClassApplier = CssClassApplier;
-    api.createCssClassApplier = createCssClassApplier;
-});
-var wysihtml5 = {
-  version:  "0.1.0",
-  
-  commands: {},
-  quirks:   {},
-  toolbar:  {},
-  utils:    {},
-  views:    {}
-};/**
- * Detect browser support for specific features
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- */
-wysihtml5.browserSupports = {
-  TEST_ELEMENT: document.createElement("div"),
-  
-  // Static variable needed, publicly accessible, to be able override it in unit tests
-  USER_AGENT: navigator.userAgent,
-  
-  /**
-   * Exclude browsers that are not capable of displaying and handling
-   * contentEditable as desired:
-   *    - iPhone, iPad (tested iOS 4.2.2) and Android (tested 2.2) refuse to make contentEditables focusable
-   *    - IE < 8 create invalid markup and crash randomly from time to time
-   *
-   * @return {Boolean}
-   */
-  contentEditable: function() {
-    var userAgent                   = this.USER_AGENT.toLowerCase(),
-        // Essential for making html elements editable
-        hasContentEditableSupport   = "contentEditable" in this.TEST_ELEMENT,
-        // Following methods are needed in order to interact with the contentEditable area
-        hasEditingApiSupport        = document.execCommand && document.queryCommandSupported && document.queryCommandState,
-        // document selector apis are only supported by IE 8+, Safari 4+, Chrome and Firefox 3.5+
-        hasQuerySelectorSupport     = document.querySelector && document.querySelectorAll,
-        // contentEditable is unusable in mobile browsers (tested iOS 4.2.2, Android 2.2, Opera Mobile)
-        isIncompatibleMobileBrowser = (userAgent.include("webkit") && userAgent.include("mobile")) || userAgent.include("opera mobi");
+    /**
+     * As of now (19.04.2011) only supported by Firefox 4 and Chrome
+     * See https://developer.mozilla.org/en/DOM/Selection/modify
+     */
+    supportsSelectionModify: function() {
+      return "getSelection" in window && "modify" in window.getSelection();
+    },
     
-    return hasContentEditableSupport
-      && hasEditingApiSupport
-      && hasQuerySelectorSupport
-      && !isIncompatibleMobileBrowser;
-  },
-  
-  /**
-   * Whether the browser supports sandboxed iframes
-   * Currently only IE 6+ offers such feature <iframe security="restricted">
-   *
-   * http://msdn.microsoft.com/en-us/library/ms534622(v=vs.85).aspx
-   * http://blogs.msdn.com/b/ie/archive/2008/01/18/using-frames-more-securely.aspx
-   *
-   * HTML5 sandboxed iframes are still buggy and their DOM is not reachable from the outside (except when using postMessage)
-   */
-  sandboxedIframes: function() {
-    return Prototype.Browser.IE;
-  },
-  
-  /**
-   * IE6+7 throw a mixed content warning when the src of an iframe
-   * is empty/unset or about:blank
-   * window.querySelector is implemented as of IE8
-   */
-  emptyIframeSrcInHttpsContext: function() {
-    return "querySelector" in document;
-  },
-  
-  /**
-   * Whether the caret is correctly displayed in contentEditable elements
-   * Firefox sometimes shows a huge caret in the beginning after focusing
-   */
-  caretInEmptyContentEditableCorrectly: function() {
-    return !Prototype.Browser.Gecko;
-  },
-  
-  /**
-   * Opera and IE are the only browsers who offer the css value
-   * in the original unit, thx to the currentStyle object
-   * All other browsers provide the computed style in px via window.getComputedStyle
-   */
-  computedStyleInPercent: function() {
-    return "currentStyle" in this.TEST_ELEMENT;
-  },
-  
-  /**
-   * Whether the browser inserts a <br> when pressing enter in a contentEditable element
-   */
-  lineBreaksOnReturn: function() {
-    return Prototype.Browser.Gecko;
-  },
-  
-  placeholderOn: function(element) {
-    return "placeholder" in element;
-  },
-  
-  event: function(eventName) {
-    var element = this.TEST_ELEMENT;
-    return "on" + eventName in element || (function() {
-      element.setAttribute("on" + eventName, "return;");
-      return typeof(element["on" + eventName]) === "function";
-    })();
-  },
-  
-  /**
-   * Opera doesn't correctly fire focus/blur events when clicking in- and outside of iframe
-   */
-  eventsInIframeCorrectly: function() {
-    return !Prototype.Browser.Opera;
-  },
-  
-  /**
-   * Chrome & Safari only fire the ondrop/ondragend/... events when the ondragover event is cancelled
-   * with event.preventDefault
-   * Firefox 3.6 fires those events anyway, but the mozilla doc says that the dragover/dragenter event needs
-   * to be cancelled
-   */
-  onDropOnlyWhenOnDragOverIsCancelled: function() {
-    return Prototype.Browser.WebKit || Prototype.Browser.Gecko;
-  },
-  
-  htmlDataTransfer: function() {
-    try {
-      // Firefox doesn't support dataTransfer in a safe way, it doesn't strip script code in the html payload (like Chrome does)
-      return Prototype.Browser.WebKit && (window.Clipboard || window.DataTransfer).prototype.getData;
-    } catch(e) {
-      return false;
-    }
-  },
-  
-  /**
-   * Everything below IE9 doesn't know how to treat HTML5 tags
-   *
-   * @param {Object} context The document object on which to check HTML5 support
-   *
-   * @example
-   *    wysihtml5.browserSupports.html5Tags(document);
-   */
-  html5Tags: function(context) {
-    var element = context.createElement("div"),
-        html5   = "<article>foo</article>";
-    element.innerHTML = html5;
-    return element.innerHTML.toLowerCase() === html5;
-  },
-  
-  /**
-   * Checks whether a document supports a certain queryCommand
-   * In particular, Opera needs a reference to a document that has a contentEditable in it's dom tree
-   * in oder to report correct results
-   *
-   * @param {Object} doc Document object on which to check for a query command
-   * @param {String} command The query command to check for
-   * @return {Boolean}
-   *
-   * @example
-   *    wysihtml5.browserSupports.command(document, "bold");
-   */
-  command: (function() {
-    // Following commands are supported but contain bugs in some browsers
-    var buggyCommands = {
-      // formatBlock fails with some tags (eg. <blockquote>)
-      "formatBlock":          Prototype.Browser.IE,
-       // When inserting unordered or ordered lists in Firefox, Chrome or Safari, the current selection or line gets
-       // converted into a list (<ul><li>...</li></ul>, <ol><li>...</li></ol>)
-       // IE and Opera act a bit different here as they convert the entire content of the current block element into a list
-      "insertUnorderedList":  Prototype.Browser.IE || Prototype.Browser.Opera,
-      "insertOrderedList":    Prototype.Browser.IE || Prototype.Browser.Opera
-    };
+    /**
+     * Whether the browser supports the classList object for fast className manipulation
+     * See https://developer.mozilla.org/en/DOM/element.classList
+     */
+    supportsClassList: function() {
+      return "classList" in testElement;
+    },
     
-    return function(doc, command) {
-      var isBuggy = buggyCommands[command];
-      if (isBuggy) {
-        return false;
+    /**
+     * Opera needs a white space after a <br> in order to position the caret correctly
+     */
+    needsSpaceAfterLineBreak: function() {
+      return isOpera;
+    },
+    
+    /**
+     * Whether the browser supports the speech api on the given element
+     * See http://mikepultz.com/2011/03/accessing-google-speech-api-chrome-11/
+     *
+     * @example
+     *    var input = document.createElement("input");
+     *    if (wysihtml5.browser.supportsSpeechApiOn(input)) {
+     *      // ...
+     *    }
+     */
+    supportsSpeechApiOn: function(input) {
+      var chromeVersion = userAgent.match(/Chrome\/(\d+)/) || [, 0];
+      return chromeVersion[1] >= 11 && ("onwebkitspeechchange" in input || "speech" in input);
+    },
+    
+    /**
+     * IE9 crashes when setting a getter via Object.defineProperty on XMLHttpRequest or XDomainRequest
+     * See https://connect.microsoft.com/ie/feedback/details/650112
+     * or try the POC http://tifftiff.de/ie9_crash/
+     */
+    crashesWhenDefineProperty: function(property) {
+      return isIE && (property === "XMLHttpRequest" || property === "XDomainRequest");
+    }
+  };
+})();wysihtml5.lang.array = function(arr) {
+  return {
+    /**
+     * Check whether a given object exists in an array
+     *
+     * @example
+     *    wysihtml5.lang.array([1, 2]).contains(1);
+     *    // => true
+     */
+    contains: function(needle) {
+      if (arr.indexOf) {
+        return arr.indexOf(needle) !== -1;
       } else {
-        // Firefox throws errors when invoking queryCommandSupported or queryCommandEnabled
-        return Try.these(
-          function() { return doc.queryCommandSupported(command); },
-          function() { return doc.queryCommandEnabled(command); }
-        ) || false;
+        for (var i=0, length=arr.length; i<length; i++) {
+          if (arr[i] === needle) { return true; }
+        }
+        return false;
       }
-    };
-  })(),
-  
-  /**
-   * IE: URLs starting with:
-   *    www., http://, https://, ftp://, gopher://, mailto:, new:, snews:, telnet:, wasis:, file://,
-   *    nntp://, newsrc:, ldap://, ldaps://, outlook:, mic:// and url: 
-   * will automatically be auto-linked when either the user inserts them via copy&paste or presses the
-   * space bar when the caret is directly after such an url.
-   * This behavior cannot easily be avoided in IE < 9 since the logic is hardcoded in the mshtml.dll
-   * (related blog post on msdn
-   * http://blogs.msdn.com/b/ieinternals/archive/2009/09/17/prevent-automatic-hyperlinking-in-contenteditable-html.aspx).
-   */
-  autoLinkingInContentEditable: function() {
-    return Prototype.Browser.IE;
-  },
-  
-  /**
-   * As stated above, IE auto links urls typed into contentEditable elements
-   * Since IE9 it's possible to prevent this behavior
-   */
-  disablingOfAutoLinking: function() {
-    return this.command(document, "AutoUrlDetect");
-  },
-  
-  /**
-   * IE leaves an empty paragraph in the contentEditable element after clearing it
-   * Chrome/Safari sometimes an empty <div>
-   */
-  clearingOfContentEditableCorrectly: function() {
-    return Prototype.Browser.Gecko || Prototype.Browser.Opera || Prototype.Browser.WebKit;
-  },
-  
-  /**
-   * IE gives wrong results for getAttribute
-   */
-  getAttributeCorrectly: function() {
-    var td = document.createElement("td");
-    return td.getAttribute("rowspan") != "1";
-  },
-  
-  /**
-   * When clicking on images in IE, Opera and Firefox, they are selected, which makes it easy to interact with them.
-   * Chrome and Safari both don't support this
-   */
-  selectingOfImagesInContentEditableOnClick: function() {
-    return Prototype.Browser.Gecko || Prototype.Browser.IE || Prototype.Browser.Opera;
-  },
-  
-  /**
-   * When the caret is in an empty list (<ul><li>|</li></ul>) which is the first child in an contentEditable container
-   * pressing backspace doesn't remove the entire list as done in other browsers
-   */
-  clearingOfListsInContentEditableCorrectly: function() {
-    return Prototype.Browser.IE || Prototype.Browser.WebKit || Prototype.Browser.Gecko;
-  },
-  
-  /**
-   * All browsers except Safari and Chrome automatically scroll the range/caret position into view
-   */
-  autoScrollIntoViewOfCaret: function() {
-    return !Prototype.Browser.WebKit;
-  },
-  
-  /**
-   * Check whether the browser automatically closes tags that don't need to be opened
-   */
-  closingOfUnclosedTags: function() {
-    var testElement = this.TEST_ELEMENT.cloneNode(false),
-        returnValue,
-        innerHTML;
-    
-    testElement.innerHTML = "<p><div></div>";
-    innerHTML             = testElement.innerHTML.toLowerCase();
-    returnValue           = innerHTML === "<p></p><div></div>" || innerHTML === "<p><div></div></p>";
+    },
     
-    // Cache result by overwriting current function
-    this.closingOfUnclosedTags = function() { return returnValue; };
+    /**
+     * Substract one array from another
+     *
+     * @example
+     *    wysihtml5.lang.array([1, 2, 3, 4]).without([3, 4]);
+     *    // => [1, 2]
+     */
+    without: function(arrayToSubstract) {
+      arrayToSubstract = wysihtml5.lang.array(arrayToSubstract);
+      var newArr  = [],
+          i       = 0,
+          length  = arr.length;
+      for (; i<length; i++) {
+        if (!arrayToSubstract.contains(arr[i])) {
+          newArr.push(arr[i]);
+        }
+      }
+      return newArr;
+    },
     
-    return returnValue;
+    /**
+     * Return a clean native array
+     * 
+     * Following will convert a Live NodeList to a proper Array
+     * @example
+     *    var childNodes = wysihtml5.lang.array(document.body.childNodes).get();
+     */
+    get: function() {
+      var i        = 0,
+          length   = arr.length,
+          newArray = [];
+      for (; i<length; i++) {
+        newArray.push(arr[i]);
+      }
+      return newArray;
+    }
+  };
+};wysihtml5.lang.Dispatcher = Base.extend(
+  /** @scope wysihtml5.lang.Dialog.prototype */ {
+  observe: function(eventName, handler) {
+    this.events = this.events || {};
+    this.events[eventName] = this.events[eventName] || [];
+    this.events[eventName].push(handler);
+    return this;
   },
-  
-  /**
-   * Whether the browser supports the native document.getElementsByClassName which returns live NodeLists
-   */
-  getElementsByClassName: function() {
-    return String(document.getElementsByClassName).indexOf("[native code]") !== -1;
+
+  fire: function(eventName, payload) {
+    this.events = this.events || {};
+    var handlers = this.events[eventName] || [],
+        i        = 0;
+    for (; i<handlers.length; i++) {
+      handlers[i].call(this, payload);
+    }
+    return this;
   },
-  
-  /**
-   * As of now (19.04.2011) only supported by Firefox 4 and Chrome
-   * See https://developer.mozilla.org/en/DOM/Selection/modify
-   */
-  selectionModify: function() {
-    return ("getSelection" in window) && ("modify" in window.getSelection());
-  }
-};/**
- * Simulate HTML5 autofocus
- * Needed since div[contentEditable] elements don't support it
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Element} element The element which should be focussed
- * @example
- *    wysihtml5.utils.autoFocus(element);
- */
-wysihtml5.utils.autoFocus = function(element) {
-  if (document.loaded) {
-    setTimeout(function() { element.focus(); }, 0);
-  } else {
-    document.observe("dom:loaded", function() { element.focus(); });
+
+  stopObserving: function(eventName, handler) {
+    this.events = this.events || {};
+    var i = 0,
+        handlers,
+        newHandlers;
+    if (eventName) {
+      handlers    = this.events[eventName] || [],
+      newHandlers = [];
+      for (; i<handlers.length; i++) {
+        if (handlers[i] !== handler) {
+          newHandlers.push(handlers[i]);
+        }
+      }
+      this.events[eventName] = newHandlers;
+    } else {
+      // Clean up all events
+      this.events = {};
+    }
+    return this;
   }
-};
-/**
- * Find urls in descendant text nodes of an element and auto link them
+});wysihtml5.lang.object = function(obj) {
+  return {
+    /**
+     * @example
+     *    wysihtml5.lang.object({ foo: 1, bar: 1 }).merge({ bar: 2, baz: 3 }).get();
+     *    // => { foo: 1, bar: 2, baz: 3 }
+     */
+    merge: function(otherObj) {
+      for (var i in otherObj) {
+        obj[i] = otherObj[i];
+      }
+      return this;
+    },
+    
+    get: function() {
+      return obj;
+    },
+    
+    /**
+     * @example
+     *    wysihtml5.lang.object({ foo: 1 }).clone();
+     *    // => { foo: 1 }
+     */
+    clone: function() {
+      var newObj = {},
+          i;
+      for (i in obj) {
+        newObj[i] = obj[i];
+      }
+      return newObj;
+    },
+    
+    /**
+     * @example
+     *    wysihtml5.lang.object([]).isArray();
+     *    // => true
+     */
+    isArray: function() {
+      return Object.prototype.toString.call(obj) === "[object Array]";
+    }
+  };
+};(function() {
+  var WHITE_SPACE_START = /^\s+/,
+      WHITE_SPACE_END   = /\s+$/;
+  wysihtml5.lang.string = function(str) {
+    str = String(str);
+    return {
+      /**
+       * @example
+       *    wysihtml5.lang.string("   foo   ").trim();
+       *    // => "foo"
+       */
+      trim: function() {
+        return str.replace(WHITE_SPACE_START, "").replace(WHITE_SPACE_END, "");
+      },
+      
+      /**
+       * @example
+       *    wysihtml5.lang.string("Hello #{name}").interpolate({ name: "Christopher" });
+       *    // => "Hello Christopher"
+       */
+      interpolate: function(vars) {
+        for (var i in vars) {
+          str = this.replace("#{" + i + "}").by(vars[i]);
+        }
+        return str;
+      },
+      
+      /**
+       * @example
+       *    wysihtml5.lang.string("Hello Tom").replace("Tom").with("Hans");
+       *    // => "Hello Hans"
+       */
+      replace: function(search) {
+        return {
+          by: function(replace) {
+            return str.split(search).join(replace);
+          }
+        }
+      }
+    };
+  };
+})();/**
+ * Find urls in descendant text nodes of an element and auto-links them
  * Inspired by http://james.padolsey.com/javascript/find-and-replace-text-with-javascript/
  *
  * @param {Element} element Container element in which to search for urls
  * @author Christopher Blum <christopher.blum@xing.com>
  * @example
  *    <div id="text-container">Please click here: www.google.com</div>
- *    <script>wysihtml5.utils.autoLink($("text-container"));</script>
+ *    <script>wysihtml5.dom.autoLink(document.getElementById("text-container"));</script>
  */
-wysihtml5.utils.autoLink = (function() {
-  var TEXT_NODE             = 3,
-      /**
+(function(wysihtml5) {
+  var /**
        * Don't auto-link urls that are contained in the following elements:
        */
-      IGNORE_URLS_IN        = ["CODE", "PRE", "A", "SCRIPT", "HEAD", "TITLE", "STYLE"],
+      IGNORE_URLS_IN        = wysihtml5.lang.array(["CODE", "PRE", "A", "SCRIPT", "HEAD", "TITLE", "STYLE"]),
       /**
        * revision 1:
        *    /(\S+\.{1}[^\s\,\.\!]+)/g
@@ -3739,20 +3654,19 @@ wysihtml5.utils.autoLink = (function() {
       URL_REG_EXP           = /((https?:\/\/|www\.)[^\s<]{3,})/gi,
       TRAILING_CHAR_REG_EXP = /([^\w\/\-](,?))$/i,
       MAX_DISPLAY_LENGTH    = 100,
-      BRACKETS              = { ")": "(", "]": "[", "}": "{" },
-      TEMP_ELEMENTS_CACHE   = {};
+      BRACKETS              = { ")": "(", "]": "[", "}": "{" };
   
   function autoLink(element) {
     if (_hasParentThatShouldBeIgnored(element)) {
       return element;
     }
 
-    if (element == element.ownerDocument.documentElement) {
+    if (element === element.ownerDocument.documentElement) {
       element = element.ownerDocument.body;
     }
 
     return _parseNode(element);
-  };
+  }
   
   /**
    * This is basically a rebuild of
@@ -3769,7 +3683,10 @@ wysihtml5.utils.autoLink = (function() {
         punctuation = "";
       }
       var realUrl    = url,
-          displayUrl = url.truncate(MAX_DISPLAY_LENGTH);
+          displayUrl = url;
+      if (url.length > MAX_DISPLAY_LENGTH) {
+        displayUrl = displayUrl.substr(0, MAX_DISPLAY_LENGTH) + "...";
+      }
       // Add http prefix if necessary
       if (realUrl.substr(0, 4) === "www.") {
         realUrl = "http://" + realUrl;
@@ -3784,9 +3701,9 @@ wysihtml5.utils.autoLink = (function() {
    * for the given document object
    */
   function _getTempElement(context) {
-    var tempElement = TEMP_ELEMENTS_CACHE[context];
-    if (!tempElement || tempElement.ownerDocument != context) {
-      TEMP_ELEMENTS_CACHE[context] = tempElement = context.createElement("div");
+    var tempElement = context._wysihtml5_tempElement;
+    if (!tempElement) {
+      tempElement = context._wysihtml5_tempElement = context.createElement("div");
     }
     return tempElement;
   }
@@ -3815,9 +3732,9 @@ wysihtml5.utils.autoLink = (function() {
     while (node.parentNode) {
       node = node.parentNode;
       nodeName = node.nodeName;
-      if (IGNORE_URLS_IN.include(nodeName)) {
+      if (IGNORE_URLS_IN.contains(nodeName)) {
         return true;
-      } else if (nodeName == "body") {
+      } else if (nodeName === "body") {
         return false;
       }
     }
@@ -3825,16 +3742,16 @@ wysihtml5.utils.autoLink = (function() {
   }
   
   function _parseNode(element) {
-    if (IGNORE_URLS_IN.include(element.nodeName)) {
+    if (IGNORE_URLS_IN.contains(element.nodeName)) {
       return;
     }
     
-    if (element.nodeType === TEXT_NODE && element.data.match(URL_REG_EXP)) {
+    if (element.nodeType === wysihtml5.TEXT_NODE && element.data.match(URL_REG_EXP)) {
       _wrapMatchesInNode(element);
       return;
     }
     
-    var childNodes        = $A(element.childNodes),
+    var childNodes        = wysihtml5.lang.array(element.childNodes).get(),
         childNodesLength  = childNodes.length,
         i                 = 0;
     
@@ -3845,465 +3762,46 @@ wysihtml5.utils.autoLink = (function() {
     return element;
   }
   
-  // Reveal url reg exp to the outside
-  autoLink.URL_REG_EXP = URL_REG_EXP;
-  
-  return autoLink;
-})();wysihtml5.utils.caret = {
-  PLACEHOLDER_TEXT: "--|CARET|--",
-  
-  /**
-   * Get the current selection as a bookmark to be able to later restore it
-   *
-   * @param {Object} doc Document object of the context
-   * @return {Object} An object that represents the current selection
-   */
-  getBookmark: function(doc) {
-    var range = this.getRange(doc);
-    return range && range.cloneRange();
-  },
-  
-  /**
-   * Restore a selection retrieved via wysihtml5.utils.caret.getBookmark
-   *
-   * @param {Object} bookmark An object that represents the current selection
-   */
-  setBookmark: function(bookmark) {
-    if (!bookmark) {
-      return;
-    }
-    
-    this.setSelection(bookmark);
-  },
-  
-  /**
-   * Check whether the current selection contains a given node
-   * @param {Object} node The node to check for
-   * @return {Boolean}
-   * @example
-   */
-  containsNode: function(node) {
-    var range = this.getRange(node.ownerDocument);
-    if (range) {
-      return range.containsNode(node);
-    } else {
-      return false;
-    }
-  },
-  
-  /**
-   * Set the caret in front of the given node
-   *
-   * @param {Object} node The element or text node where to position the caret in front of
-   * @example
-   *    wysihtml5.utils.caret.setBefore(myElement);
-   */
-  setBefore: function(node) {
-    var range = rangy.createRange(node.ownerDocument);
-    range.setStartBefore(node);
-    range.setEndBefore(node);
-    return this.setSelection(range);
-  },
+  wysihtml5.dom.autoLink = autoLink;
   
-  /**
-   * Set the caret after the given node
-   *
-   * @param {Object} node The element or text node where to position the caret in front of
-   * @example
-   *    wysihtml5.utils.caret.setBefore(myElement);
-   */
-  setAfter: function(node) {
-    var range = rangy.createRange(node.ownerDocument);
-    range.setStartAfter(node);
-    range.setEndAfter(node);
-    return this.setSelection(range);
-  },
+  // Reveal url reg exp to the outside
+  wysihtml5.dom.autoLink.URL_REG_EXP = URL_REG_EXP;
+})(wysihtml5);(function(wysihtml5) {
+  var supportsClassList = wysihtml5.browser.supportsClassList(),
+      api               = wysihtml5.dom;
   
-  /**
-   * Ability to select/mark nodes
-   *
-   * @param {Element} node The node/element to select
-   * @example
-   *    wysihtml5.utils.caret.selectNode(document.getElementById("my-image"));
-   */
-  selectNode: function(node) {
-    var range           = rangy.createRange(node.ownerDocument),
-        isElement       = node.nodeType === Node.ELEMENT_NODE,
-        canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : (node.nodeName !== "IMG"),
-        content         = isElement ? node.innerHTML : node.data,
-        isEmpty         = (content === "" || content === "\uFEFF"),
-        displayStyle    = wysihtml5.utils.getStyle(node, "display"),
-        isBlockElement  = (displayStyle === "block" || displayStyle === "list-item");
-    
-    if (isEmpty && isElement && canHaveHTML) {
-      // Make sure that caret is visible in node by inserted a zero width no breaking space
-      try { node.innerHTML = "\uFEFF"; } catch(e) {}
-    }
-    
-    if (canHaveHTML) {
-      range.selectNodeContents(node);
-    } else {
-      range.selectNode(node);
+  api.addClass = function(element, className) {
+    if (supportsClassList) {
+      return element.classList.add(className);
     }
-    
-    if (canHaveHTML && isEmpty && isElement) {
-      range.collapse(isBlockElement);
-    } else if (canHaveHTML && isEmpty) {
-      range.setStartAfter(node);
-      range.setEndAfter(node);
+    if (api.hasClass(element, className)) {
+      return;
     }
-    
-    this.setSelection(range);
-  },
+    element.className += " " + className;
+  };
   
-  /**
-   * Get the node which contains the selection
-   *
-   * @param {Object} document Document object of the context where to select
-   * @param {Boolean} [controlRange] (only IE) Whether it should return the selected ControlRange element when the selection type is a "ControlRange"
-   * @return {Object} The node that contains the caret
-   * @example
-   *    var nodeThatContainsCaret = wysihtml5.utils.caret.getSelectedNode(document);
-   */
-  getSelectedNode: function(doc, controlRange) {
-    var selection,
-        range;
-    
-    if (controlRange && doc.selection && doc.selection.type === "Control") {
-      range = doc.selection.createRange();
-      if (range && range.length) {
-        return range.item(0);
-      }
+  api.removeClass = function(element, className) {
+    if (supportsClassList) {
+      return element.classList.remove(className);
     }
     
-    selection = this.getSelection(doc);
-    if (selection.focusNode === selection.anchorNode) {
-      return selection.focusNode;
-    } else {
-      range = this.getRange(doc);
-      return range ? range.commonAncestorContainer : doc.body;
-    }
-  },
+    element.className = element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), " ");
+  };
   
-  executeAndRestore: function(doc, method, restoreScrollPosition) {
-    if (!window.getSelection) {
-      return this.executeAndRestoreSimple(doc, method);
-    }
-    
-    var body                = doc.body,
-        oldScrollTop        = body.scrollTop,
-        oldScrollLeft       = body.scrollLeft,
-        range               = this.getRange(doc),
-        caretPlaceholder    = this._getPlaceholderElement(doc),
-        newCaretPlaceholder,
-        newRange;
-    
-    // Nothing selected, execute and say goodbye
-    if (!range) {
-      method(body, body);
-      return;
-    }
-    
-    range.insertNode(caretPlaceholder);
-    
-    // Make sure that a potential error doesn't cause our placeholder element to be left as a placeholder
-    try {
-      method(range.startContainer, range.endContainer);
-    } catch(e1) {
-      setTimeout(function() { throw e1; }, 0);
+  api.hasClass = function(element, className) {
+    if (supportsClassList) {
+      return element.classList.contains(className);
     }
     
-    // range.detach();
-    
-    newCaretPlaceholder = this._findPlaceholderElement(doc);
-    
-    if (newCaretPlaceholder) {
-      newRange = rangy.createRange(doc);
-      newRange.selectNode(newCaretPlaceholder);
-      newRange.deleteContents();
-      this.setSelection(newRange);
-    }
-    
-    if (restoreScrollPosition) {
-      body.scrollTop  = oldScrollTop;
-      body.scrollLeft = oldScrollLeft;
-    }
-    
-    // Remove it again, just to make sure that the placeholder is definitely out of the dom tree
-    try {
-      newCaretPlaceholder.parentNode.removeChild(newCaretPlaceholder);
-    } catch(e2) {}
-  },
-  
-  /**
-   * Different approach of preserving the selection (doesn't modify the dom)
-   * Takes all text nodes in the selection and saves the selection position in the first and last one
-   */
-  executeAndRestoreSimple: function(doc, method) {
-    var range = this.getRange(doc),
-        newRange,
-        firstNode,
-        lastNode,
-        textNodes,
-        rangeBackup;
-    
-    // Nothing selected, execute and say goodbye
-    if (!range) {
-      method(doc.body, doc.body);
-      return;
-    }
-    
-    textNodes = range.getNodes([3]);
-    firstNode = textNodes[0] || range.startContainer;
-    lastNode  = textNodes[textNodes.length - 1] || range.endContainer;
-    
-    rangeBackup = {
-      collapsed:      range.collapsed,
-      startContainer: firstNode,
-      startOffset:    firstNode === range.startContainer ? range.startOffset : 0,
-      endContainer:   lastNode,
-      endOffset:      lastNode === range.endContainer ? range.endOffset : lastNode.length
-    };
-    
-    try {
-      method(range.startContainer, range.endContainer);
-    } catch(e) {
-      setTimeout(function() { throw e; }, 0);
-    }
-    
-    newRange = rangy.createRange(doc);
-    try { newRange.setStart(rangeBackup.startContainer, rangeBackup.startOffset); } catch(e1) {}
-    try { newRange.setEnd(rangeBackup.endContainer, rangeBackup.endOffset); } catch(e2) {}
-    try { this.setSelection(newRange); } catch(e3) {}
-  },
-  
-  /**
-   * Insert html at the caret position and move the cursor after the inserted html
-   *
-   * @param {Object} doc Document object of the context where to insert the html
-   * @param {String} html HTML string to insert
-   * @example
-   *    wysihtml5.utils.caret.insertHTML(document, "<p>foobar</p>");
-   */
-  insertHTML: function(doc, html) {
-    var range     = rangy.createRange(doc),
-        node      = range.createContextualFragment(html),
-        lastChild = node.lastChild;
-    this.insertNode(node);
-    if (lastChild) {
-      this.setAfter(lastChild);
-    }
-  },
-  
-  /**
-   * Insert a node at the caret position and move the cursor after it
-   *
-   * @param {Object} node HTML string to insert
-   * @example
-   *    wysihtml5.utils.caret.insertNode(document.createTextNode("foobar"));
-   */
-  insertNode: function(node) {
-    var range = this.getRange(node.ownerDocument);
-    if (range) {
-      range.insertNode(node);
-    } else {
-      return false;
-    }
-  },
-  
-  /**
-   * Wraps current selection with the given node
-   *
-   * @param {Object} node The node to surround the selected elements with
-   */
-  surround: function(node) {
-    var range = this.getRange(node.ownerDocument);
-    if (!range) {
-      return;
-    }
-    
-    try {
-      // This only works when the range boundaries are not overlapping other elements
-      range.surroundContents(node);
-      this.selectNode(node);
-    } catch(e) {
-      // fallback
-      node.appendChild(range.extractContents());
-      range.insertNode(node);
-    }
-  },
-  
-  /**
-   * Scroll the current caret position into the view
-   * FIXME: This is a bit hacky, there might be a smarter way of doing this
-   *
-   * @param {Object} element A scrollable element in which the caret is currently positioned
-   * @example
-   *    wysihtml5.utils.caret.scrollIntoView(element);
-   */
-  scrollIntoView: function(element) {
-    var doc           = element.ownerDocument,
-        hasScrollBars = doc.documentElement.scrollHeight > doc.documentElement.offsetHeight,
-        tempElement   = doc._wysihtml5ScrollIntoViewElement = doc._wysihtml5ScrollIntoViewElement || (function() {
-          var element = doc.createElement("span");
-          // The element needs content in order to be able to calculate it's position properly
-          element.innerHTML = "\uFEFF";
-          return element;
-        })(),
-        offsetTop;
-    
-    if (hasScrollBars) {
-      this.insertNode(tempElement);
-      offsetTop = Element.cumulativeOffset(tempElement).top;
-      tempElement.parentNode.removeChild(tempElement);
-      if (offsetTop > element.scrollTop) {
-        element.scrollTop = offsetTop;
-      }
-    }
-  },
-  
-  /**
-   * Select line where the caret is in
-   */
-  selectLine: function(doc) {
-    if (wysihtml5.browserSupports.selectionModify()) {
-      this._selectLine_W3C(doc);
-    } else if (doc.selection) {
-      this._selectLine_MSIE(doc);
-    }
-  },
-  
-  /**
-   * See https://developer.mozilla.org/en/DOM/Selection/modify
-   */
-  _selectLine_W3C: function(doc) {
-    var win = doc.defaultView,
-        selection = win.getSelection();
-    selection.modify("extend", "left", "lineboundary");
-    selection.modify("extend", "right", "lineboundary");
-  },
-  
-  _selectLine_MSIE: function(doc) {
-    var range       = doc.selection.createRange(),
-        rangeTop    = range.boundingTop,
-        rangeHeight = range.boundingHeight,
-        scrollWidth = doc.body.scrollWidth,
-        rangeBottom,
-        rangeEnd,
-        measureNode,
-        i,
-        j;
-
-    if (!range.moveToPoint) {
-      return;
-    }
-
-    if (rangeTop === 0) {
-      // Don't know why, but when the selection ends at the end of a line
-      // range.boundingTop is 0
-      measureNode = doc.createElement("span");
-      wysihtml5.utils.caret.insertNode(measureNode);
-      rangeTop = measureNode.offsetTop;
-      measureNode.parentNode.removeChild(measureNode);
-    }
-    
-    rangeTop += 1;
-    
-    for (i=-10; i<scrollWidth; i+=2) {
-      try {
-        range.moveToPoint(i, rangeTop);
-        break;
-      } catch(e1) {}
-    }
-    
-    // Investigate the following in order to handle multi line selections
-    // rangeBottom = rangeTop + (rangeHeight ? (rangeHeight - 1) : 0);
-    rangeBottom = rangeTop;
-    rangeEnd = doc.selection.createRange();
-    for (j=scrollWidth; j>=0; j--) {
-      try {
-        rangeEnd.moveToPoint(j, rangeBottom);
-        break;
-      } catch(e2) {}
-    }
-
-    range.setEndPoint("EndToEnd", rangeEnd);
-    range.select();
-  },
-  
-  getText: function(doc) {
-    var selection = this.getSelection(doc);
-    return selection ? selection.toString() : "";
-  },
-  
-  getNodes: function(doc, nodeType, filter) {
-    var range = this.getRange(doc);
-    if (range) {
-      return range.getNodes([nodeType], filter);
-    } else {
-      return [];
-    }
-  },
-  
-  getRange: function(doc) {
-    var selection = this.getSelection(doc);
-    return selection && selection.rangeCount && selection.getRangeAt(0);
-  },
-  
-  getSelection: function(doc) {
-    return rangy.getSelection(doc.defaultView || doc.parentWindow);
-  },
-  
-  setSelection: function(range) {
-    var doc       = (range.startContainer || range.endContainer).ownerDocument,
-        win       = doc.defaultView || doc.parentWindow,
-        selection = rangy.getSelection(win);
-    return selection.setSingleRange(range);
-  },
-  
-  // ----------------- private -------------- \\
-  _getPlaceholderElement: (function() {
-    var id = "_wysihtml5-placeholder" + new Date().getTime();
-    return function(doc) {
-      // Important: placeholder element needs to be an inline element
-      // otherwise chrome will cause trouble when interacting with the text
-      var element       = doc._wysihtml5CaretPlaceholder = doc._wysihtml5CaretPlaceholder || doc.createElement("span");
-      element.id        = id;
-      element.innerHTML = this.PLACEHOLDER_TEXT;
-      return element;
-    };
-  })(),
-  
-  _findPlaceholderElement: function(doc) {
-    var placeholderElement      = this._getPlaceholderElement(doc),
-        // Using placeholderElement.innerHTML causes problems in firefox who sometimes mangles the innerHTML
-        placeholderElementText  = wysihtml5.utils.getTextContent(placeholderElement),
-        placeholderElementById  = doc.getElementById(placeholderElement.id),
-        i                       = 0,
-        element,
-        elements,
-        elementsLength;
-    if (wysihtml5.utils.contains(doc.body, placeholderElement)) {
-      return placeholderElement;
-    } else if (placeholderElementById) {
-      return placeholderElementById;
-    } else {
-      elements = doc.getElementsByTagName("*");
-      elementsLength = elements.length;
-      for (; i<elementsLength; i++) {
-        element = elements[i];
-        if (element.innerHTML === placeholderElementText) {
-          return element;
-        }
-      }
-      return null;
-    }
-  }
-};wysihtml5.utils.contains = (function() {
+    var elementClassName = element.className;
+    return (elementClassName.length > 0 && (elementClassName == className || new RegExp("(^|\\s)" + className + "(\\s|$)").test(elementClassName)));
+  };
+})(wysihtml5);
+wysihtml5.dom.contains = (function() {
   var documentElement = document.documentElement;
   if (documentElement.contains) {
     return function(container, element) {
-      if (element.nodeType !== Node.ELEMENT_NODE) {
+      if (element.nodeType !== wysihtml5.ELEMENT_NODE) {
         element = element.parentNode;
       }
       return container !== element && container.contains(element);
@@ -4331,7 +3829,7 @@ wysihtml5.utils.autoLink = (function() {
  *    </span>
  *
  *    <script>
- *      wysihtml5.utils.convertIntoList(document.getElementById("pseudo-list"), "ul");
+ *      wysihtml5.dom.convertToList(document.getElementById("pseudo-list"), "ul");
  *    </script>
  *
  *    <!-- Will result in: -->
@@ -4341,7 +3839,7 @@ wysihtml5.utils.autoLink = (function() {
  *      <li>50 Cent</li>
  *    </ul>
  */
-wysihtml5.utils.convertIntoList = (function() {
+wysihtml5.dom.convertToList = (function() {
   function _createListItem(doc, list) {
     var listItem = doc.createElement("li");
     list.appendChild(listItem);
@@ -4352,7 +3850,7 @@ wysihtml5.utils.convertIntoList = (function() {
     return doc.createElement(type);
   }
   
-  function convertIntoList(element, listType) {
+  function convertToList(element, listType) {
     if (element.nodeName === "UL" || element.nodeName === "OL" || element.nodeName === "MENU") {
       // Already a list
       return element;
@@ -4360,7 +3858,7 @@ wysihtml5.utils.convertIntoList = (function() {
     
     var doc               = element.ownerDocument,
         list              = _createList(doc, listType),
-        childNodes        = $A(element.childNodes),
+        childNodes        = wysihtml5.lang.array(element.childNodes).get(),
         childNodesLength  = childNodes.length,
         childNode,
         isBlockElement,
@@ -4370,7 +3868,7 @@ wysihtml5.utils.convertIntoList = (function() {
     for (; i<childNodesLength; i++) {
       currentListItem = currentListItem || _createListItem(doc, list);
       childNode       = childNodes[i];
-      isBlockElement  = wysihtml5.utils.getStyle(childNode, "display") === "block";
+      isBlockElement  = wysihtml5.dom.getStyle("display").from(childNode) === "block";
       isLineBreak     = childNode.nodeName === "BR";
       
       if (isBlockElement) {
@@ -4394,8 +3892,44 @@ wysihtml5.utils.convertIntoList = (function() {
     return list;
   }
   
-  return convertIntoList;
+  return convertToList;
 })();/**
+ * Copy a set of attributes from one element to another
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ *
+ * @param {Array} attributesToCopy List of attributes which should be copied
+ * @return {Object} Returns an object which offers the "from" method which can be invoked with the element where to
+ *    copy the attributes from., this again returns an object which provides a method named "to" which can be invoked 
+ *    with the element where to copy the attributes to (see example)
+ *
+ * @example
+ *    var textarea    = document.querySelector("textarea"),
+ *        div         = document.querySelector("div[contenteditable=true]"),
+ *        anotherDiv  = document.querySelector("div.preview");
+ *    wysihtml5.dom.copyAttributes(["spellcheck", "value", "placeholder"]).from(textarea).to(div).andTo(anotherDiv);
+ *
+ */
+wysihtml5.dom.copyAttributes = function(attributesToCopy) {
+  return {
+    from: function(elementToCopyFrom) {
+      return {
+        to: function(elementToCopyTo) {
+          var attribute,
+              i         = 0,
+              length    = attributesToCopy.length;
+          for (; i<length; i++) {
+            attribute = attributesToCopy[i];
+            if (elementToCopyFrom[attribute]) {
+              elementToCopyTo[attribute] = elementToCopyFrom[attribute];
+            }
+          }
+          return { andTo: arguments.callee };
+        }
+      };
+    }
+  };
+};/**
  * Copy a set of styles from one element to another
  * Please note that this only works properly across browsers when the element from which to copy the styles
  * is in the dom
@@ -4410,103 +3944,89 @@ wysihtml5.utils.convertIntoList = (function() {
  *    with the element where to copy the styles to (see example)
  *
  * @example
- *    var textarea    = $("textarea"),
- *        div         = $$("div[contenteditable=true]")[0],
- *        anotherDiv  = $$("div[contenteditable=true]")[1];
- *    wysihtml5.utils.copyStyles("width", "height").from(textarea).to(div);
- *    // or (advanced example):
- *    wysihtml5.utils.copyStyles(["overflow-y", "width", "height"]).from(textarea).to(div).andTo(anotherDiv);
+ *    var textarea    = document.querySelector("textarea"),
+ *        div         = document.querySelector("div[contenteditable=true]"),
+ *        anotherDiv  = document.querySelector("div.preview");
+ *    wysihtml5.dom.copyStyles(["overflow-y", "width", "height"]).from(textarea).to(div).andTo(anotherDiv);
  *
  */
-wysihtml5.utils.copyStyles = (function() {
+(function(dom) {
   
   /**
-   * Mozilla and Opera recalculate the computed width when box-sizing: boder-box; is set
+   * Mozilla, WebKit and Opera recalculate the computed width when box-sizing: boder-box; is set
    * So if an element has "width: 200px; -moz-box-sizing: border-box; border: 1px;" then 
-   * it's computed css width will be 198px
+   * its computed css width will be 198px
    */
   var BOX_SIZING_PROPERTIES = ["-webkit-box-sizing", "-moz-box-sizing", "-ms-box-sizing", "box-sizing"];
   
   var shouldIgnoreBoxSizingBorderBox = function(element) {
     if (hasBoxSizingBorderBox(element)) {
-       return parseInt(wysihtml5.utils.getStyle(element, "width"), 10) < element.getWidth();
+       return parseInt(dom.getStyle("width").from(element), 10) < element.offsetWidth;
     }
     return false;
   };
   
   var hasBoxSizingBorderBox = function(element) {
-    return BOX_SIZING_PROPERTIES.find(function(property) {
-      return wysihtml5.utils.getStyle(element, property) == "border-box";
-    });
+    var i       = 0,
+        length  = BOX_SIZING_PROPERTIES.length;
+    for (; i<length; i++) {
+      if (dom.getStyle(BOX_SIZING_PROPERTIES[i]).from(element) === "border-box") {
+        return BOX_SIZING_PROPERTIES[i];
+      }
+    }
   };
   
-  return function(stylesToCopy) {
-    stylesToCopy = $A(arguments).flatten();
-    
+  dom.copyStyles = function(stylesToCopy) {
     return {
       from: function(element) {
         if (shouldIgnoreBoxSizingBorderBox(element)) {
-          stylesToCopy = stylesToCopy.without.apply(stylesToCopy, BOX_SIZING_PROPERTIES);
+          stylesToCopy = wysihtml5.lang.array(stylesToCopy).without(BOX_SIZING_PROPERTIES);
         }
         
-        var cssText = stylesToCopy.inject("", function(str, property) {
-          var propertyValue = wysihtml5.utils.getStyle(element, property);
-          if (propertyValue) {
-            str += property + ":" + propertyValue + ";";
-          }
-          return str;
-        });
+        var cssText = "",
+            length  = stylesToCopy.length,
+            i       = 0,
+            property;
+        for (; i<length; i++) {
+          property = stylesToCopy[i];
+          cssText += property + ":" + dom.getStyle(property).from(element) + ";";
+        }
         
         return {
           to: function(element) {
-            /**
-             * Use static Element.setStyle method, since element is not
-             * necessarily prototype extended
-             */
-            Element.setStyle(element, cssText);
+            dom.setStyles(cssText).on(element);
             return { andTo: arguments.callee };
           }
         };
       }
     };
   };
-})();/**
- * Copy a set of attributes from one element to another
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- *
- * @param {Array} attributesToCopy List of attributes which should be copied
- * @return {Object} Returns an object which offers the "from" method which can be invoked with the element where to
- *    copy the attributes from., this again returns an object which provides a method named "to" which can be invoked 
- *    with the element where to copy the attributes to (see example)
+})(wysihtml5.dom);/**
+ * Event Delegation
  *
  * @example
- *    var textarea    = $("textarea"),
- *        div         = $$("div[contenteditable=true]")[0],
- *        anotherDiv  = $$("div[contenteditable=true]")[1];
- *    wysihtml5.utils.copyAttributes("spellcheck", "value", "placeholder").from(textarea).to(div);
- *    // or (advanced example):
- *    wysihtml5.utils.copyAttributes(["spellcheck", "value", "placeholder"]).from(textarea).to(div).andTo(anotherDiv);
- *
+ *    wysihtml5.dom.delegate(document.body, "a", "click", function() {
+ *      // foo
+ *    });
  */
-wysihtml5.utils.copyAttributes = function(attributesToCopy) {
-  attributesToCopy = $A(arguments).flatten();
+(function(wysihtml5) {
   
-  return {
-    from: function(elementToCopyFrom) {
-      return {
-        to: function(elementToCopyTo) {
-          attributesToCopy.each(function(attribute) {
-            if (elementToCopyFrom[attribute]) {
-              elementToCopyTo[attribute] = elementToCopyFrom[attribute];
-            }
-          });
-          return { andTo: arguments.callee };
+  wysihtml5.dom.delegate = function(container, selector, eventName, handler) {
+    return wysihtml5.dom.observe(container, eventName, function(event) {
+      var target    = event.target,
+          match     = wysihtml5.lang.array(container.querySelectorAll(selector));
+      
+      while (target && target !== container) {
+        if (match.contains(target)) {
+          handler.call(target, event);
+          break;
         }
-      };
-    }
+        target = target.parentNode;
+      }
+    });
   };
-};/**
+  
+})(wysihtml5);/**
  * Returns the given html wrapped in a div element
  *
  * Fixing IE's inability to treat unknown elements (HTML5 section, article, ...) correctly
@@ -4515,8 +4035,11 @@ wysihtml5.utils.copyAttributes = function(attributesToCopy) {
  * @author Christopher Blum <christopher.blum@xing.com>
  * @param {String} html The html which should be wrapped in a dom element
  * @param {Obejct} [context] Document object of the context the html belongs to
+ *
+ * @example
+ *    wysihtml5.dom.getAsDom("<article>foo</article>");
  */
-wysihtml5.utils.getInDomElement = (function() {
+wysihtml5.dom.getAsDom = (function() {
   
   var _innerHTMLShiv = function(html, context) {
     var tempElement = context.createElement("div");
@@ -4558,7 +4081,7 @@ wysihtml5.utils.getInDomElement = (function() {
     if (typeof(html) === "object" && html.nodeType) {
       tempElement = context.createElement("div");
       tempElement.appendChild(html);
-    } else if (wysihtml5.browserSupports.html5Tags(context)) {
+    } else if (wysihtml5.browser.supportsHTML5Tags(context)) {
       tempElement = context.createElement("div");
       tempElement.innerHTML = html;
     } else {
@@ -4577,13 +4100,13 @@ wysihtml5.utils.getInDomElement = (function() {
  * @param {Number} [levels] How many parents should the function check up from the current node (defaults to 50)
  * @return {null|Element} Returns the first element that matched the desiredNodeName(s)
  * @example
- *    var listElement = wysihtml5.utils.getParentElement($$("li").first(), { nodeName: ["MENU", "UL", "OL"] });
+ *    var listElement = wysihtml5.dom.getParentElement(document.querySelector("li"), { nodeName: ["MENU", "UL", "OL"] });
  *    // ... or ...
- *    var unorderedListElement = wysihtml5.utils.getParentElement($$("li").first(), { nodeName: "UL" });
+ *    var unorderedListElement = wysihtml5.dom.getParentElement(document.querySelector("li"), { nodeName: "UL" });
  *    // ... or ...
- *    var coloredElement = wysihtml5.utils.getParentElement(myTextNode, { nodeName: "SPAN", className: "wysiwyg-color-red", classRegExp: /wysiwyg-color-[a-z]/g });
+ *    var coloredElement = wysihtml5.dom.getParentElement(myTextNode, { nodeName: "SPAN", className: "wysiwyg-color-red", classRegExp: /wysiwyg-color-[a-z]/g });
  */
-wysihtml5.utils.getParentElement = (function() {
+wysihtml5.dom.getParentElement = (function() {
   
   function _isSameNodeName(nodeName, desiredNodeNames) {
     if (!desiredNodeNames || !desiredNodeNames.length) {
@@ -4593,12 +4116,12 @@ wysihtml5.utils.getParentElement = (function() {
     if (typeof(desiredNodeNames) === "string") {
       return nodeName === desiredNodeNames;
     } else {
-      return desiredNodeNames.indexOf(nodeName) !== -1;
+      return wysihtml5.lang.array(desiredNodeNames).contains(nodeName);
     }
   }
   
   function _isElement(node) {
-    return node.nodeType === Node.ELEMENT_NODE;
+    return node.nodeType === wysihtml5.ELEMENT_NODE;
   }
   
   function _hasClassName(element, className, classRegExp) {
@@ -4651,47 +4174,66 @@ wysihtml5.utils.getParentElement = (function() {
  * @param {String} property The CSS property to retrieve ("float", "display", "text-align", ...)
  * @author Christopher Blum <christopher.blum@xing.com>
  * @example
- *    wysihtml5.utils.getStyle(document.body, "display");
+ *    wysihtml5.dom.getStyle("display").from(document.body);
  *    // => "block"
  */
-wysihtml5.utils.getStyle = (function() {
-  var currentStylePropertyMapping = {
-    "float": "styleFloat"
-  };
+wysihtml5.dom.getStyle = (function() {
+  var stylePropertyMapping = {
+        "float": ("styleFloat" in document.createElement("div").style) ? "styleFloat" : "cssFloat"
+      },
+      REG_EXP_CAMELIZE = /\-[a-z]/g;
   
-  return function(element, property) {
-    if (element.nodeType !== Node.ELEMENT_NODE) {
-      return;
-    }
-    
-    // currentStyle is no standard and only supported by Opera and IE but it has one important advantage over the standard-compliant
-    // window.getComputedStyle, since it returns css property values in their original unit:
-    // If you set an elements width to "50%", window.getComputedStyle will give you it's current width in px while currentStyle
-    // gives you the original "50%".
-    // Opera supports both, currentStyle and window.getComputedStyle, that's why checking for currentStyle should have higher prio
-    if (element.currentStyle) {
-      property = currentStylePropertyMapping[property] || property.camelize();
-      return element.currentStyle[property];
-    }
-
-    var win                 = element.ownerDocument.defaultView || element.ownerDocument.parentWindow,
-        needsOverflowReset  = (property === "height" || property === "width") && element.nodeName === "TEXTAREA",
-        originalOverflow,
-        returnValue;
-    
-    if (win.getComputedStyle) {
-      // Chrome and Safari both calculate a wrong width and height for textareas when they have scroll bars
-      // therfore we remove and restore the scrollbar and calculate the value in between
-      if (needsOverflowReset) {
-        originalOverflow = element.style.overflow;
-        element.style.overflow = "hidden";
-      }
-      returnValue = win.getComputedStyle(element, null).getPropertyValue(property);
-      if (needsOverflowReset) {
-        element.style.overflow = originalOverflow || "";
+  function camelize(str) {
+    return str.replace(REG_EXP_CAMELIZE, function(match) {
+      return match.charAt(1).toUpperCase();
+    });
+  }
+  
+  return function(property) {
+    return {
+      from: function(element) {
+        if (element.nodeType !== wysihtml5.ELEMENT_NODE) {
+          return;
+        }
+        
+        var doc               = element.ownerDocument,
+            camelizedProperty = stylePropertyMapping[property] || camelize(property),
+            style             = element.style,
+            currentStyle      = element.currentStyle,
+            styleValue        = style[camelizedProperty];
+        if (styleValue) {
+          return styleValue;
+        }
+        
+        // currentStyle is no standard and only supported by Opera and IE but it has one important advantage over the standard-compliant
+        // window.getComputedStyle, since it returns css property values in their original unit:
+        // If you set an elements width to "50%", window.getComputedStyle will give you it's current width in px while currentStyle
+        // gives you the original "50%".
+        // Opera supports both, currentStyle and window.getComputedStyle, that's why checking for currentStyle should have higher prio
+        if (currentStyle) {
+          return currentStyle[camelizedProperty];
+        }
+
+        var win                 = doc.defaultView || doc.parentWindow,
+            needsOverflowReset  = (property === "height" || property === "width") && element.nodeName === "TEXTAREA",
+            originalOverflow,
+            returnValue;
+
+        if (win.getComputedStyle) {
+          // Chrome and Safari both calculate a wrong width and height for textareas when they have scroll bars
+          // therfore we remove and restore the scrollbar and calculate the value in between
+          if (needsOverflowReset) {
+            originalOverflow = style.overflow;
+            style.overflow = "hidden";
+          }
+          returnValue = win.getComputedStyle(element, null).getPropertyValue(property);
+          if (needsOverflowReset) {
+            style.overflow = originalOverflow || "";
+          }
+          return returnValue;
+        }
       }
-      return returnValue;
-    }
+    };
   };
 })();/**
  * High performant way to check whether an element with a specific tag name is in the given document
@@ -4702,14 +4244,14 @@ wysihtml5.utils.getStyle = (function() {
  * @param {Object} doc The document object of the context where to check
  * @param {String} tagName Upper cased tag name
  * @example
- *    wysihtml5.utils.hasElementWithTagName(document, "IMG");
+ *    wysihtml5.dom.hasElementWithTagName(document, "IMG");
  */
-wysihtml5.utils.hasElementWithTagName = (function() {
+wysihtml5.dom.hasElementWithTagName = (function() {
   var LIVE_CACHE          = {},
       DOCUMENT_IDENTIFIER = 1;
   
   function _getDocumentIdentifier(doc) {
-    return doc._wysihtml5Identifier || (doc._wysihtml5Identifier = DOCUMENT_IDENTIFIER++);
+    return doc._wysihtml5_identifier || (doc._wysihtml5_identifier = DOCUMENT_IDENTIFIER++);
   }
   
   return function(doc, tagName) {
@@ -4730,59 +4272,62 @@ wysihtml5.utils.hasElementWithTagName = (function() {
  * @param {Object} doc The document object of the context where to check
  * @param {String} tagName Upper cased tag name
  * @example
- *    wysihtml5.utils.hasElementWithClassName(document, "foobar");
+ *    wysihtml5.dom.hasElementWithClassName(document, "foobar");
  */
-wysihtml5.utils.hasElementWithClassName = (function() {
+(function(wysihtml5) {
   var LIVE_CACHE          = {},
       DOCUMENT_IDENTIFIER = 1;
-  
+
   function _getDocumentIdentifier(doc) {
-    return doc._wysihtml5Identifier || (doc._wysihtml5Identifier = DOCUMENT_IDENTIFIER++);
+    return doc._wysihtml5_identifier || (doc._wysihtml5_identifier = DOCUMENT_IDENTIFIER++);
   }
   
-  return function(doc, className) {
+  wysihtml5.dom.hasElementWithClassName = function(doc, className) {
     // getElementsByClassName is not supported by IE<9
     // but is sometimes mocked via library code (which then doesn't return live node lists)
-    if (!wysihtml5.browserSupports.getElementsByClassName()) {
+    if (!wysihtml5.browser.supportsNativeGetElementsByClassName()) {
       return !!doc.querySelector("." + className);
     }
-    
+
     var key         = _getDocumentIdentifier(doc) + ":" + className,
         cacheEntry  = LIVE_CACHE[key];
     if (!cacheEntry) {
       cacheEntry = LIVE_CACHE[key] = doc.getElementsByClassName(className);
     }
-    
+
     return cacheEntry.length > 0;
   };
-})();/**
- * Insert CSS rules
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Array} rules An array containing the css rules to insert
- *
- * @example
- *    wysihtml5.utils.insertRules([
- *      "html { height: 100%; }",
- *      "body { color: red; }"
- *    ]).into(document);
- */
-wysihtml5.utils.insertRules = function(rules) {
+})(wysihtml5);
+wysihtml5.dom.insert = function(elementToInsert) {
+  return {
+    after: function(element) {
+      element.parentNode.insertBefore(elementToInsert, element.nextSibling);
+    },
+    
+    before: function(element) {
+      element.parentNode.insertBefore(elementToInsert, element);
+    },
+    
+    into: function(element) {
+      element.appendChild(elementToInsert);
+    }
+  };
+};wysihtml5.dom.insertCSS = function(rules) {
   rules = rules.join("\n");
   
   return {
     into: function(doc) {
       var head         = doc.head || doc.getElementsByTagName("head")[0],
           styleElement = doc.createElement("style");
-      
+
       styleElement.type = "text/css";
-      
+
       if (styleElement.styleSheet) {
         styleElement.styleSheet.cssText = rules;
       } else {
         styleElement.appendChild(doc.createTextNode(rules));
       }
-      
+
       if (head) {
         head.appendChild(styleElement);
       }
@@ -4791,22 +4336,25 @@ wysihtml5.utils.insertRules = function(rules) {
 };/**
  * Method to set dom events
  *
- * Prototype's original Element.observe doesn't work correctly when used
- * on elements in iframes whose ownerDocument isn't the same as the one where prototype is loaded
- *
  * @author Christopher Blum <christopher.blum@xing.com>
  *
  * @example
- *    wysihtml5.utils.observe(iframe.contentWindow.document.body, ["focus", "blur"], function() { ... });
+ *    wysihtml5.dom.observe(iframe.contentWindow.document.body, ["focus", "blur"], function() { ... });
  */
-wysihtml5.utils.observe = function(element, eventNames, handler) {
-  eventNames = [eventNames].flatten();
-  eventNames.each(function(eventName) {
+wysihtml5.dom.observe = function(element, eventNames, handler) {
+  eventNames = typeof(eventNames) === "string" ? [eventNames] : eventNames;
+  
+  var handlerWrapper,
+      eventName,
+      i       = 0,
+      length  = eventNames.length;
+  
+  for (; i<length; i++) {
+    eventName = eventNames[i];
     if (element.addEventListener) {
       element.addEventListener(eventName, handler, false);
     } else {
-      handler = handler.bind(element);
-      handler = handler.wrap(function(proceed, event) {
+      handlerWrapper = function(event) {
         if (!("target" in event)) {
           event.target = event.srcElement;
         }
@@ -4816,394 +4364,31 @@ wysihtml5.utils.observe = function(element, eventNames, handler) {
         event.stopPropagation = event.stopPropagation || function() {
           this.cancelBubble = true;
         };
-        proceed(event);
-      });
-      element.attachEvent("on" + eventName, handler);
+        handler.call(element, event);
+      };
+      element.attachEvent("on" + eventName, handlerWrapper);
     }
-  });
+  }
   
   return {
     stop: function() {
-      eventNames.each(function(eventName) {
-        if (element.addEventListener) {
+      var eventName,
+          i       = 0,
+          length  = eventNames.length;
+      for (; i<length; i++) {
+        eventName = eventNames[i];
+        if (element.removeEventListener) {
           element.removeEventListener(eventName, handler, false);
         } else {
-          element.detachEvent("on" + eventName, handler);
+          element.detachEvent("on" + eventName, handlerWrapper);
         }
-      });
+      }
     }
   };
 };
 /**
- * Unwraps an unordered/ordered list
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Element} element The list element which should be unwrapped
- *
- * @example
- *    <!-- Assume the following dom: -->
- *    <ul id="list">
- *      <li>eminem</li>
- *      <li>dr. dre</li>
- *      <li>50 Cent</li>
- *    </ul>
- *
- *    <script>
- *      wysihtml5.utils.resolveList(document.getElementById("list"));
- *    </script>
- *
- *    <!-- Will result in: -->
- *    eminem<br>
- *    dr. dre<br>
- *    50 Cent<br>
- */
-wysihtml5.utils.resolveList = (function() {
-  
-  function _isBlockElement(node) {
-    return wysihtml5.utils.getStyle(node, "display") === "block";
-  }
-  
-  function _isLineBreak(node) {
-    return node.nodeName === "BR";
-  }
-  
-  function _appendLineBreak(element) {
-    var lineBreak = element.ownerDocument.createElement("br");
-    element.appendChild(lineBreak);
-  }
-  
-  function resolveList(list) {
-    if (list.nodeName !== "MENU" && list.nodeName !== "UL" && list.nodeName !== "OL") {
-      return;
-    }
-    
-    var doc             = list.ownerDocument,
-        fragment        = doc.createDocumentFragment(),
-        previousSibling = list.previousSibling,
-        firstChild,
-        lastChild,
-        isLastChild,
-        shouldAppendLineBreak,
-        listItem;
-    
-    if (previousSibling && !_isBlockElement(previousSibling)) {
-      _appendLineBreak(fragment);
-    }
-    
-    while (listItem = list.firstChild) {
-      lastChild = listItem.lastChild;
-      while (firstChild = listItem.firstChild) {
-        isLastChild           = firstChild === lastChild;
-        // This needs to be done before appending it to the fragment, as it otherwise will loose style information
-        shouldAppendLineBreak = isLastChild && !_isBlockElement(firstChild) && !_isLineBreak(firstChild);
-        fragment.appendChild(firstChild);
-        if (shouldAppendLineBreak) {
-          _appendLineBreak(fragment);
-        }
-      }
-      
-      listItem.parentNode.removeChild(listItem);
-    }
-    list.parentNode.replaceChild(fragment, list);
-  }
-  return resolveList;
-})();/**
- * Renames an element (eg. a <div> to a <p>) and keeps its childs
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Element} element The list element which should be renamed
- * @param {Element} newNodeName The desired tag name
- *
- * @example
- *    <!-- Assume the following dom: -->
- *    <ul id="list">
- *      <li>eminem</li>
- *      <li>dr. dre</li>
- *      <li>50 Cent</li>
- *    </ul>
- *
- *    <script>
- *      wysihtml5.utils.renameElement(document.getElementById("list"), "ol");
- *    </script>
- *
- *    <!-- Will result in: -->
- *    <ol>
- *      <li>eminem</li>
- *      <li>dr. dre</li>
- *      <li>50 Cent</li>
- *    </ol>
- */
-wysihtml5.utils.renameElement = function(element, newNodeName) {
-  var newElement = element.ownerDocument.createElement(newNodeName),
-      firstChild;
-  while (firstChild = element.firstChild) {
-    newElement.appendChild(firstChild);
-  }
-  wysihtml5.utils.copyAttributes(["align", "className"]).from(element).to(newElement);
-  element.parentNode.replaceChild(newElement, element);
-  return newElement;
-};/**
- * Checks for empty text node childs and removes them
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Element} node The element in which to cleanup
- * @example
- *    wysihtml5.utils.removeEmptyTextNodes(element);
- */
-wysihtml5.utils.removeEmptyTextNodes = function(node) {
-  var childNode,
-      childNodes        = $A(node.childNodes), // $A needed since childNodes is not an array but a live NodeList
-      childNodesLength  = childNodes.length,
-      i                 = 0;
-  for (; i<childNodesLength; i++) {
-    childNode = childNodes[i];
-    if (childNode.nodeType === Node.TEXT_NODE && childNode.data === "") {
-      childNode.parentNode.removeChild(childNode);
-    }
-  }
-};
-/**
- * Sandbox for executing javascript, parsing css styles and doing dom operations in a safe way
- *
- * Browser Compatibility:
- *  - Secure in MSIE 6+, but only when the user hasn't made changes to his security level "restricted"
- *  - Partially secure in other browsers (Firefox, Opera, Safari, Chrome, ...)
- *
- * Please note that this class can't benefit from the HTML5 sandbox attribute for the following reasons:
- *    - sandboxing doesn't work correctly with inlined content (src="javascript:'<html>...</html>'")
- *    - sandboxing of physical documents causes that the dom isn't accessible anymore from the outside (iframe.contentWindow, ...)
- *    - setting the "allow-same-origin" flag would fix that, but then still javascript and dom events refuse to fire
- *    - therefore the "allow-scripts" flag is needed, which then would inactivate any security, as the js executed inside the iframe
- *      can do anything as if the sandbox attribute wasn't set
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- *
- * @param {Function} [readyCallback] Method that gets invoked when the sandbox is ready
- * @param {Object} [config] Optional parameters, see defaultConfig property for more info
- *
- * @example
- *    new wysihtml5.utils.Sandbox(function(sandbox) {
- *      sandbox.getWindow().document.body.innerHTML = '<img src=foo.gif onerror="alert(document.cookie)">';
- *    });
- */
-wysihtml5.utils.Sandbox = Class.create(
-  /** @scope wysihtml5.utils.Sandbox.prototype */ {
-  
-  defaultConfig: {
-    insertInto:   null,       // Element (id or direct object reference) where to insert the sandbox into
-    context:      document,   // Object of document where to insert the sandbox in
-    uaCompatible: "IE=Edge"   // X-UA-Compatible meta tag value (Document compatibility mode)
-  },
-  
-  initialize: function(readyCallback, config) {
-    this.callback = readyCallback || Prototype.emptyFunction;
-    this.config   = Object.extend(Object.clone(this.defaultConfig), config);
-    this.iframe   = this._createIframe();
-    
-    if (typeof(this.config.insertInto) === "string") {
-      this.config.insertInto = this.config.context.getElementById(this.config.insertInto);
-    }
-    
-    if (this.config.insertInto) {
-      this.config.insertInto.appendChild(this.iframe);
-    }
-  },
-  
-  getIframe: function() {
-    return this.iframe;
-  },
-  
-  getWindow: function() {
-    this._readyError();
-  },
-  
-  getDocument: function() {
-    this._readyError();
-  },
-  
-  destroy: function() {
-    var iframe = this.getIframe();
-    iframe.parentNode.removeChild(iframe);
-  },
-  
-  _readyError: function() {
-    throw new Error("wysihtml5.Sandbox: Sandbox iframe isn't loaded yet");
-  },
-  
-  /**
-   * Creates the sandbox iframe
-   *
-   * Some important notes:
-   *  - We can't use HTML5 sandbox for now:
-   *    setting it causes that the iframe's dom can't be accessed from the outside
-   *    Therefore we need to set the "allow-same-origin" flag which enables accessing the iframe's dom
-   *    But then there's another problem, DOM events (focus, blur, change, keypress, ...) aren't fired.
-   *    In order to make this happen we need to set the "allow-scripts" flag.
-   *    A combination of allow-scripts and allow-same-origin is almost the same as setting no sandbox attribute at all.
-   *  - Chrome & Safari, doesn't seem to support sandboxing correctly when the iframe's html is inlined (no physical document)
-   *  - IE needs to have the security="restricted" attribute set before the iframe is 
-   *    inserted into the dom tree
-   *  - Believe it or not but in IE "security" in document.createElement("iframe") is false, even
-   *    though it supports it
-   *  - When an iframe has security="restricted", in IE eval() & execScript() don't work anymore
-   *  - IE doesn't fire the onload event when the content is inlined in the src attribute, therefore we rely
-   *    on the onreadystatechange event
-   */
-  _createIframe: function() {
-    var iframe = this.config.context.createElement("iframe");
-    iframe.className = "wysihtml5-sandbox";
-    iframe.setAttribute("security", "restricted");
-    iframe.setAttribute("allowTransparency", "true");
-    iframe.setAttribute("frameBorder", "0");
-    iframe.setAttribute("width", "0");
-    iframe.setAttribute("height", "0");
-    iframe.setAttribute("marginWidth", "0");
-    iframe.setAttribute("marginHeight", "0");
-    
-    // Setting the src like this prevents ssl warnings in IE6
-    if (!wysihtml5.browserSupports.emptyIframeSrcInHttpsContext()) {
-      iframe.src = "javascript:'<html></html>'";
-    }
-    
-    iframe.onload = function() {
-      iframe.onreadystatechange = iframe.onload = null;
-      this._onLoadIframe(iframe);
-    }.bind(this);
-    
-    iframe.onreadystatechange = function() {
-      if (/loaded|complete/.test(iframe.readyState)) {
-        iframe.onreadystatechange = iframe.onload = null;
-        this._onLoadIframe(iframe);
-      }
-    }.bind(this);
-    
-    return iframe;
-  },
-  
-  /**
-   * Callback for when the iframe has finished loading
-   */
-  _onLoadIframe: function(iframe) {
-    // don't resume when the iframe got unloaded (eg. by removing it from the dom)
-    if (!wysihtml5.utils.contains(document.documentElement, iframe)) {
-      return;
-    }
-    
-    var context        = this.config.context,
-        iframeWindow   = iframe.contentWindow,
-        iframeDocument = iframe.contentDocument || iframe.contentWindow.document,
-        charset        = context.characterSet || context.charset || "utf-8",
-        sandboxHtml    = this._getHtml({
-          charset:      charset,
-          stylesheets:  this.config.stylesheets,
-          uaCompatible: this.config.uaCompatible
-        });
-    
-    // Create the basic dom tree including proper DOCTYPE and charset
-    iframeDocument.open("text/html", "replace");
-    iframeDocument.write(sandboxHtml);
-    iframeDocument.close();
-    
-    this.getWindow = function() { return iframeWindow; };
-    this.getDocument = function() { return iframeDocument; };
-    
-    // Catch js errors and pass them to the parent's onerror event
-    // addEventListener("error") doesn't work properly in some browsers
-    // TODO: apparently this doesn't work in IE9!
-    iframeWindow.onerror = function(errorMessage, fileName, lineNumber) {
-      throw new Error("wysihtml5.Sandbox: " + errorMessage, fileName, lineNumber);
-    };
-    
-    if (!wysihtml5.browserSupports.sandboxedIframes()) {
-      // Unset a bunch of sensitive variables
-      // Please note: This isn't hack safe!  
-      // It more or less just takes care of basic attacks and prevents accidental theft of sensitive information
-      // IE is secure though, which is the most important thing, since IE is the only browser, who
-      // takes over scripts & styles into contentEditable elements when copied from external websites
-      // or applications (Microsoft Word, ...)
-      [
-        "parent", "top", "opener", "frameElement", "frames",
-        "localStorage", "globalStorage", "sessionStorage", "indexedDB"
-      ].each(function(property) {
-        this._unset(iframeWindow, property);
-      }.bind(this));
-
-      [
-        "open", "close", "openDialog", "showModalDialog",
-        "alert", "confirm", "prompt",
-        "openDatabase", "postMessage",
-        "XMLHttpRequest", "XDomainRequest"
-      ].each(function(property) {
-        this._unset(iframeWindow, property, Prototype.emptyFunction);
-      }.bind(this));
-
-      [
-        "referrer",
-        "write", "open", "close"
-      ].each(function(property) {
-        this._unset(iframeDocument, property);
-      }.bind(this));
-
-      // This doesn't work in Safari 5 
-      // See http://stackoverflow.com/questions/992461/is-it-possible-to-override-document-cookie-in-webkit
-      this._unset(iframeDocument, "cookie", "", true);
-    }
-    
-    this.loaded = true;
-    
-    // Trigger the callback
-    setTimeout(function() { this.callback(this); }.bind(this), 0);
-  },
-  
-  _getHtml: function(templateVars) {
-    if (templateVars.stylesheets) {
-      templateVars.stylesheets = [templateVars.stylesheets].flatten().map(function(stylesheet) {
-        return '<link rel="stylesheet" href="' + stylesheet + '">';
-      }).join("");
-    } else {
-      templateVars.stylesheets = "";
-    }
-    
-    return (
-      '<!DOCTYPE html><html><head>'
-      + '<meta http-equiv="X-UA-Compatible" content="#{uaCompatible}"><meta charset="#{charset}">#{stylesheets}</head>'
-      + '<body></body></html>'
-    ).interpolate(templateVars);
-  },
-  
-  /**
-   * Method to unset/override existing variables
-   * @example
-   *    // Make cookie unreadable and unwritable
-   *    this._unset(document, "cookie", "", true);
-   */
-  _unset: function(object, property, value, setter) {
-    try { object[property] = value; } catch(e) {}
-    
-    try { object.__defineGetter__(property, function() { return value; }); } catch(e) {}
-    if (setter) {
-      try { object.__defineSetter__(property, function() {}); } catch(e) {}
-    }
-    
-    // IE9 crashes when setting a getter via Object.defineProperty on XMLHttpRequest or XDomainRequest
-    // See https://connect.microsoft.com/ie/feedback/details/650112
-    // or try the POC http://tifftiff.de/ie9_crash/
-    var causesBrowserCrash = Prototype.Browser.IE && (property === "XMLHttpRequest" || property === "XDomainRequest");
-    if (!causesBrowserCrash) {
-      try {
-        var config = {
-          get: function() { return value; }
-        };
-        if (setter) {
-          config.set = function() {};
-        }
-        Object.defineProperty(object, property, config);
-      } catch(e) {}
-    }
-  }
-});/**
- * HTML Sanitizer
- * Rewrites the HTML based on given rules
+ * HTML Sanitizer
+ * Rewrites the HTML based on given rules
  *
  * @author Christopher Blum <christopher.blum@xing.com>
  *
@@ -5217,7 +4402,7 @@ wysihtml5.utils.Sandbox = Class.create(
  *
  * @example
  *    var userHTML = '<div id="foo" onclick="alert(1);"><p><font color="red">foo</font><script>alert(1);</script></p></div>';
- *    wysihtml5.utils.sanitizeHTML(userHTML, {
+ *    wysihtml5.dom.parse(userHTML, {
  *      tags {
  *        p:      "div",      // Rename p tags to div tags
  *        font:   "span"      // Rename font tags to span tags
@@ -5228,11 +4413,11 @@ wysihtml5.utils.Sandbox = Class.create(
  *    // => <div><div><span>foo bar</span></div></div>
  *
  *    var userHTML = '<table><tbody><tr><td>I'm a table!</td></tr></tbody></table>';
- *    wysihtml5.utils.sanitizeHTML(userHTML);
+ *    wysihtml5.dom.parse(userHTML);
  *    // => '<span><span><span><span>I'm a table!</span></span></span></span>'
  *
  *    var userHTML = '<div>foobar<br>foobar</div>';
- *    wysihtml5.utils.sanitizeHTML(userHTML, {
+ *    wysihtml5.dom.parse(userHTML, {
  *      tags: {
  *        div: undefined,
  *        br:  true
@@ -5241,7 +4426,7 @@ wysihtml5.utils.Sandbox = Class.create(
  *    // => ''
  *
  *    var userHTML = '<div class="red">foo</div><div class="pink">bar</div>';
- *    wysihtml5.utils.sanitizeHTML(userHTML, {
+ *    wysihtml5.dom.parse(userHTML, {
  *      classes: {
  *        red:    1,
  *        green:  1
@@ -5254,7 +4439,7 @@ wysihtml5.utils.Sandbox = Class.create(
  *    });
  *    // => '<p class="red">foo</p><p>bar</p>'
  */
-wysihtml5.utils.sanitizeHTML = (function() {
+wysihtml5.dom.parse = (function() {
   
   /**
    * It's not possible to use a XMLParser/DOMParser as HTML5 is not always well-formed XML
@@ -5264,26 +4449,23 @@ wysihtml5.utils.sanitizeHTML = (function() {
    * Therefore we've to use the browser's ordinary HTML parser invoked by setting innerHTML.
    */
   var NODE_TYPE_MAPPING = {
-    "1": _handleElement,
-    "3": _handleText
-  };
-  
-  var DEFAULT_RULES = { tags: {}, classes: {} };
-  
-  // Rename unknown tags to this
-  var DEFAULT_NODE_NAME = "span";
-  
-  var WHITE_SPACE_REG_EXP = /\s+/;
-  
-  var currentRules = {};
+        "1": _handleElement,
+        "3": _handleText
+      },
+      // Rename unknown tags to this
+      DEFAULT_NODE_NAME   = "span",
+      WHITE_SPACE_REG_EXP = /\s+/,
+      defaultRules        = { tags: {}, classes: {} },
+      currentRules        = {};
   
   /**
    * Iterates over all childs of the element, recreates them, appends them into a document fragment
    * which later replaces the entire body content
    */
-  function sanitizeHTML(elementOrHtml, rules, context, cleanUp) {
-    currentRules = Object.extend(Object.clone(DEFAULT_RULES), rules);
-    context = context || elementOrHtml.ownerDocument || document;
+  function parse(elementOrHtml, rules, context, cleanUp) {
+    wysihtml5.lang.object(currentRules).merge(defaultRules).merge(rules).get();
+    
+    context           = context || elementOrHtml.ownerDocument || document;
     var fragment      = context.createDocumentFragment(),
         isString      = typeof(elementOrHtml) === "string",
         element,
@@ -5291,7 +4473,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
         firstChild;
     
     if (isString) {
-      element = wysihtml5.utils.getInDomElement(elementOrHtml, context);
+      element = wysihtml5.dom.getAsDom(elementOrHtml, context);
     } else {
       element = elementOrHtml;
     }
@@ -5311,7 +4493,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
     // Insert new DOM tree
     element.appendChild(fragment);
     
-    return isString ? element.innerHTML : element;
+    return isString ? wysihtml5.quirks.getCorrectInnerHTML(element) : element;
   }
   
   function _convert(oldNode, cleanUp) {
@@ -5339,7 +4521,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
     if (cleanUp &&
         newNode.childNodes.length <= 1 &&
         newNode.nodeName.toLowerCase() === DEFAULT_NODE_NAME &&
-        newNode.innerHTML !== wysihtml5.utils.caret.PLACEHOLDER_TEXT && 
+        newNode.innerHTML !== wysihtml5.selection.PLACEHOLDER_TEXT && 
         !newNode.attributes.length) {
       return newNode.firstChild;
     }
@@ -5381,7 +4563,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
      * A <p> doesn't need to be closed according HTML4-5 spec, we simply replace it with a <div> to preserve its content and layout
      */
     if ("outerHTML" in oldNode) {
-      if (!wysihtml5.browserSupports.closingOfUnclosedTags() &&
+      if (!wysihtml5.browser.autoClosesUnclosedTags() &&
           oldNode.nodeName === "P" &&
           oldNode.outerHTML.slice(-4).toLowerCase() !== "</p>") {
         nodeName = "div";
@@ -5430,7 +4612,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
         method;
     
     if (setAttributes) {
-      attributes = Object.clone(setAttributes);
+      attributes = wysihtml5.lang.object(setAttributes).clone();
     }
     
     if (checkAttributes) {
@@ -5480,7 +4662,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
     newClassesLength = newClasses.length;
     while (newClassesLength--) {
       currentClass = newClasses[newClassesLength];
-      if (newUniqueClasses.indexOf(currentClass) == -1) {
+      if (!wysihtml5.lang.array(newUniqueClasses).contains(currentClass)) {
         newUniqueClasses.unshift(currentClass);
       }
     }
@@ -5489,9 +4671,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
       attributes["class"] = newUniqueClasses.join(" ");
     }
     
-    // sort and set attributes on newNode
-    attributes = _sortByKey(attributes);
-    
+    // set attributes on newNode
     for (attributeName in attributes) {
       // Setting attributes can cause a js error in IE under certain circumstances
       // eg. on a <img> under https when it's new attribute value is non-https
@@ -5520,7 +4700,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
    *
    * Therefore we have to check the element's outerHTML for the attribute
    */
-  var HAS_GET_ATTRIBUTE_BUG = !wysihtml5.browserSupports.getAttributeCorrectly();
+  var HAS_GET_ATTRIBUTE_BUG = !wysihtml5.browser.supportsGetAttributeCorrectly();
   function _getAttribute(node, attributeName) {
     attributeName = attributeName.toLowerCase();
     var nodeName = node.nodeName;
@@ -5556,22 +4736,6 @@ wysihtml5.utils.sanitizeHTML = (function() {
     }
   }
   
-  /**
-   * Sorts key/value pairs alphabetically by key name
-   */
-  function _sortByKey(object) {
-    var newObject   = {},
-        key,
-        keys        = Object.keys(object).sort(),
-        keysLength  = keys.length,
-        i           = 0;
-    for (; i<keysLength; i++) {
-      key = keys[i];
-      newObject[key] = object[key];
-    }
-    return newObject;
-  }
-  
   function _handleText(oldNode) {
     return oldNode.ownerDocument.createTextNode(oldNode.data);
   }
@@ -5604,10 +4768,8 @@ wysihtml5.utils.sanitizeHTML = (function() {
     numbers: (function() {
       var REG_EXP = /\D/g;
       return function(attributeValue) {
-        if (!attributeValue) {
-          return null;
-        }
-        return attributeValue.replace(REG_EXP, "");
+        attributeValue = (attributeValue || "").replace(REG_EXP, "");
+        return attributeValue || null;
       };
     })()
   };
@@ -5666,172 +4828,63 @@ wysihtml5.utils.sanitizeHTML = (function() {
     })()
   };
   
-  return sanitizeHTML;
+  return parse;
 })();/**
- * Simulate HTML5 placeholder attribute
- *
- * Needed since
- *    - div[contentEditable] elements don't support it
- *    - older browsers (such as IE8 and Firefox 3.6) don't support it at all
+ * Checks for empty text node childs and removes them
  *
  * @author Christopher Blum <christopher.blum@xing.com>
+ * @param {Element} node The element in which to cleanup
+ * @example
+ *    wysihtml5.dom.removeEmptyTextNodes(element);
+ */
+wysihtml5.dom.removeEmptyTextNodes = function(node) {
+  var childNode,
+      childNodes        = wysihtml5.lang.array(node.childNodes).get(),
+      childNodesLength  = childNodes.length,
+      i                 = 0;
+  for (; i<childNodesLength; i++) {
+    childNode = childNodes[i];
+    if (childNode.nodeType === wysihtml5.TEXT_NODE && childNode.data === "") {
+      childNode.parentNode.removeChild(childNode);
+    }
+  }
+};
+/**
+ * Renames an element (eg. a <div> to a <p>) and keeps its childs
  *
- * @param {Object} parent Instance of main wysihtml5.Editor class
- * @param {Element} view Instance of wysihtml5.views.* class
- * @param {String} placeholderText
+ * @author Christopher Blum <christopher.blum@xing.com>
+ * @param {Element} element The list element which should be renamed
+ * @param {Element} newNodeName The desired tag name
  *
  * @example
- *    wysihtml.utils.simulatePlaceholder(this, composer, "Foobar");
- */
-wysihtml5.utils.simulatePlaceholder = function(parent, view, placeholderText) {
-  var unset = function() {
-        if (view.hasPlaceholderSet()) {
-          view.clear();
-        }
-        Element.removeClassName(view.element, "placeholder");
-      },
-      set = function() {
-        if (view.isEmpty()) {
-          view.setValue(placeholderText);
-          Element.addClassName(view.element, "placeholder");
-        }
-      };
-  
-  parent
-    .observe("set_placeholder", set)
-    .observe("unset_placeholder", unset)
-    .observe("focus:composer", unset)
-    .observe("paste:composer", unset)
-    .observe("blur:composer", set);
-  
-  set();
-};/**
- * Class that takes care that the value of the composer and the textarea is always in sync
+ *    <!-- Assume the following dom: -->
+ *    <ul id="list">
+ *      <li>eminem</li>
+ *      <li>dr. dre</li>
+ *      <li>50 Cent</li>
+ *    </ul>
+ *
+ *    <script>
+ *      wysihtml5.dom.renameElement(document.getElementById("list"), "ol");
+ *    </script>
+ *
+ *    <!-- Will result in: -->
+ *    <ol>
+ *      <li>eminem</li>
+ *      <li>dr. dre</li>
+ *      <li>50 Cent</li>
+ *    </ol>
  */
-wysihtml5.utils.Synchronizer = Class.create(
-  /** @scope wysihtml5.utils.Synchronizer.prototype */ {
-  INTERVAL: 400,
-  
-  initialize: function(parent, textarea, composer) {
-    this.parent   = parent;
-    this.textarea = textarea;
-    this.composer = composer;
-    
-    this._observe();
-  },
-  
-  /**
-   * Sync html from composer to textarea
-   * Takes care of placeholders
-   * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the textarea
-   */
-  fromComposerToTextarea: function(shouldParseHtml) {
-    this.textarea.setValue(this._trim(this.composer.getValue()), shouldParseHtml);
-  },
-  
-  /**
-   * Sync value of textarea to composer
-   * Takes care of placeholders
-   * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer
-   */
-  fromTextareaToComposer: function(shouldParseHtml) {
-    var textareaValue = this.textarea.getValue();
-    if (textareaValue) {
-      this.composer.setValue(textareaValue, shouldParseHtml);
-    } else {
-      this.composer.clear();
-      this.parent.fire("set_placeholder");
-    }
-  },
-  
-  /**
-   * Invoke syncing based on view state
-   * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer/textarea
-   */
-  sync: function(shouldParseHtml) {
-    if (this.parent.currentView.name == "textarea") {
-      this.fromTextareaToComposer(shouldParseHtml);
-    } else {
-      this.fromComposerToTextarea(shouldParseHtml);
-    }
-  },
-  
-  /**
-   * Initializes interval-based syncing
-   * also makes sure that on-submit the composer's content is synced with the textarea
-   * immediately when the form gets submitted
-   */
-  _observe: function() {
-    var interval,
-        form          = this.textarea.element.up("form"),
-        startInterval = function() {
-          interval = setInterval(function() { this.fromComposerToTextarea(); }.bind(this), this.INTERVAL);
-        }.bind(this),
-        stopInterval  = function() {
-          clearInterval(interval);
-          interval = null;
-        };
-    
-    startInterval();
-    
-    if (form) {
-      // If the textarea is in a form make sure that after onreset and onsubmit the composer
-      // has the correct state
-      form.observe("submit", function() { this.sync(true); }.bind(this));
-      form.observe("reset", function() { this.fromTextareaToComposer.bind(this).defer(); }.bind(this));
-    }
-    
-    this.parent.observe("change_view", function(event) {
-      var view = event.memo;
-      if (view == "composer" && !interval) {
-        this.fromTextareaToComposer(true);
-        startInterval();
-      } else if (view == "textarea") {
-        this.fromComposerToTextarea(true);
-        stopInterval();
-      }
-    }.bind(this));
-    
-    this.parent.observe("destroy:composer", stopInterval);
-  },
-  
-  /**
-   * Normalizes white space in the beginning and end
-   * This: "     foo    " will become: " foo "
-   */
-  _trim: (function() {
-    var WHITE_SPACE_START = /^\s+/,
-        WHITE_SPACE_END   = /\s+$/;
-    return function(str) {
-      return str.replace(WHITE_SPACE_START, " ").replace(WHITE_SPACE_END, " ");
-    };
-  })()
-});if ("textContent" in document.documentElement) {
-  wysihtml5.utils.setTextContent = function(element, text) {
-    element.textContent = text;
-  };
-  
-  wysihtml5.utils.getTextContent = function(element) {
-    return element.textContent;
-  };
-} else if ("innerText" in document.documentElement) {
-  wysihtml5.utils.setTextContent = function(element, text) {
-    element.innerText = text;
-  };
-
-  wysihtml5.utils.getTextContent = function(element) {
-    return element.innerText;
-  };
-} else {
-  wysihtml5.utils.setTextContent = function(element, text) {
-    element.nodeValue = text;
-  };
-  
-  wysihtml5.utils.getTextContent = function(element) {
-    return element.nodeValue;
-  };
-}
-/**
+wysihtml5.dom.renameElement = function(element, newNodeName) {
+  var newElement = element.ownerDocument.createElement(newNodeName),
+      firstChild;
+  while (firstChild = element.firstChild) {
+    newElement.appendChild(firstChild);
+  }
+  wysihtml5.dom.copyAttributes(["align", "className"]).from(element).to(newElement);
+  element.parentNode.replaceChild(newElement, element);
+  return newElement;
+};/**
  * Takes an element, removes it and replaces it with it's childs
  * 
  * @author Christopher Blum <christopher.blum@xing.com>
@@ -5842,10 +4895,10 @@ wysihtml5.utils.Synchronizer = Class.create(
  *    </div>
  *    <script>
  *      // Remove #foo and replace with it's children
- *      wysihtml5.utils.unwrap(document.getElementById("foo"));
+ *      wysihtml5.dom.replaceWithChildNodes(document.getElementById("foo"));
  *    </script>
  */
-wysihtml5.utils.unwrap = function(node) {
+wysihtml5.dom.replaceWithChildNodes = function(node) {
   if (!node.parentNode) {
     return;
   }
@@ -5863,221 +4916,1573 @@ wysihtml5.utils.unwrap = function(node) {
   node = fragment = null;
 };
 /**
- * Fix most common html formatting misbehaviors of browsers implementation when inserting
- * content via copy & paste contentEditable
+ * Unwraps an unordered/ordered list
  *
- * @author Christopher Blum
+ * @author Christopher Blum <christopher.blum@xing.com>
+ * @param {Element} element The list element which should be unwrapped
+ *
+ * @example
+ *    <!-- Assume the following dom: -->
+ *    <ul id="list">
+ *      <li>eminem</li>
+ *      <li>dr. dre</li>
+ *      <li>50 Cent</li>
+ *    </ul>
+ *
+ *    <script>
+ *      wysihtml5.dom.resolveList(document.getElementById("list"));
+ *    </script>
+ *
+ *    <!-- Will result in: -->
+ *    eminem<br>
+ *    dr. dre<br>
+ *    50 Cent<br>
  */
-wysihtml5.quirks.cleanPastedHTML = (function() {
-  // TODO: We probably need more rules here
-  var defaultRules = {
-    // When pasting underlined links <a> into a contentEditable, IE thinks, it has to insert <u> to keep the styling
-    "a u": wysihtml5.utils.unwrap
-  };
-  
-  function cleanPastedHTML(elementOrHtml, rules, context) {
-    rules   = rules || defaultRules;
-    context = context || elementOrHtml.ownerDocument || document;
-    
-    var element,
-        isString = typeof(elementOrHtml) === "string",
-        method,
-        matches,
-        matchesLength,
-        i,
-        j = 0;
-    if (isString) {
-      element = wysihtml5.utils.getInDomElement(elementOrHtml, context);
-    } else {
-      element = elementOrHtml;
-    }
-    
-    for (i in rules) {
-      matches       = element.querySelectorAll(i);
-      method        = rules[i];
-      matchesLength = matches.length;
-      for (; j<matchesLength; j++) {
-        method(matches[j]);
-      }
-    }
-    
-    matches = elementOrHtml = rules = null;
-    
-    return isString ? element.innerHTML : element;
+(function(dom) {
+  function _isBlockElement(node) {
+    return dom.getStyle("display").from(node) === "block";
   }
   
-  return cleanPastedHTML;
-})();/**
- * IE and Opera leave an empty paragraph in the contentEditable element after clearing it
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Object} contentEditableElement The contentEditable element to observe for clearing events
- * @exaple
- *    wysihtml5.quirks.ensureProperClearing(myContentEditableElement);
- */
-wysihtml5.quirks.ensureProperClearing = (function() {
-  var clearIfNecessary = function(event) {
-    var element = this;
-    setTimeout(function() {
-      var innerHTML = element.innerHTML.toLowerCase();
-      if (innerHTML == "<p>&nbsp;</p>" ||
-          innerHTML == "<p>&nbsp;</p><p>&nbsp;</p>") {
-        element.innerHTML = "";
-      }
-    }, 0);
-  };
+  function _isLineBreak(node) {
+    return node.nodeName === "BR";
+  }
   
-  return function(contentEditableElement) {
-    wysihtml5.utils.observe(contentEditableElement, ["cut", "keydown"], clearIfNecessary);
-  };
-})();
-
-
-
-/**
- * In Opera when the caret is in the first and only item of a list (<ul><li>|</li></ul>) and the list is the first child of the contentEditable element, it's impossible to delete the list by hitting backspace
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Object} contentEditableElement The contentEditable element to observe for clearing events
- * @exaple
- *    wysihtml5.quirks.ensureProperClearing(myContentEditableElement);
- */
-wysihtml5.quirks.ensureProperClearingOfLists = (function() {
-  var ELEMENTS_THAT_CONTAIN_LI = ["OL", "UL", "MENU"];
+  function _appendLineBreak(element) {
+    var lineBreak = element.ownerDocument.createElement("br");
+    element.appendChild(lineBreak);
+  }
   
-  var clearIfNecessary = function(element, contentEditableElement) {
-    if (!contentEditableElement.firstChild || ELEMENTS_THAT_CONTAIN_LI.indexOf(contentEditableElement.firstChild.nodeName) == -1) {
-      return;
-    }
-    
-    var list = wysihtml5.utils.getParentElement(element, { nodeName: ELEMENTS_THAT_CONTAIN_LI });
-    if (!list) {
-      return;
-    }
-    
-    var listIsFirstChildOfContentEditable = list == contentEditableElement.firstChild;
-    if (!listIsFirstChildOfContentEditable) {
+  function resolveList(list) {
+    if (list.nodeName !== "MENU" && list.nodeName !== "UL" && list.nodeName !== "OL") {
       return;
     }
     
-    var hasOnlyOneListItem = list.childNodes.length <= 1;
-    if (!hasOnlyOneListItem) {
-      return;
-    }
+    var doc             = list.ownerDocument,
+        fragment        = doc.createDocumentFragment(),
+        previousSibling = list.previousSibling,
+        firstChild,
+        lastChild,
+        isLastChild,
+        shouldAppendLineBreak,
+        listItem;
     
-    var onlyListItemIsEmpty = list.firstChild ? list.firstChild.innerHTML === "" : true;
-    if (!onlyListItemIsEmpty) {
-      return;
+    if (previousSibling && !_isBlockElement(previousSibling)) {
+      _appendLineBreak(fragment);
     }
     
-    list.parentNode.removeChild(list);
-  };
-  
-  return function(contentEditableElement) {
-    wysihtml5.utils.observe(contentEditableElement, "keydown", function(event) {
-      if (event.keyCode != 8) { // 8 = backspace
-        return;
+    while (listItem = list.firstChild) {
+      lastChild = listItem.lastChild;
+      while (firstChild = listItem.firstChild) {
+        isLastChild           = firstChild === lastChild;
+        // This needs to be done before appending it to the fragment, as it otherwise will loose style information
+        shouldAppendLineBreak = isLastChild && !_isBlockElement(firstChild) && !_isLineBreak(firstChild);
+        fragment.appendChild(firstChild);
+        if (shouldAppendLineBreak) {
+          _appendLineBreak(fragment);
+        }
       }
       
-      var element = wysihtml5.utils.caret.getSelectedNode(contentEditableElement.ownerDocument);
-      clearIfNecessary(element, contentEditableElement);
-    });
-  };
-})();/**
- * Some browsers don't insert line breaks when hitting return in a contentEditable element
- *    - Opera & IE insert new <p> on return
- *    - Chrome & Safari insert new <div> on return
- *    - Firefox inserts <br> on return (yippie!)
- 
+      listItem.parentNode.removeChild(listItem);
+    }
+    list.parentNode.replaceChild(fragment, list);
+  }
+  
+  dom.resolveList = resolveList;
+})(wysihtml5.dom);/**
+ * Sandbox for executing javascript, parsing css styles and doing dom operations in a secure way
+ *
+ * Browser Compatibility:
+ *  - Secure in MSIE 6+, but only when the user hasn't made changes to his security level "restricted"
+ *  - Partially secure in other browsers (Firefox, Opera, Safari, Chrome, ...)
+ *
+ * Please note that this class can't benefit from the HTML5 sandbox attribute for the following reasons:
+ *    - sandboxing doesn't work correctly with inlined content (src="javascript:'<html>...</html>'")
+ *    - sandboxing of physical documents causes that the dom isn't accessible anymore from the outside (iframe.contentWindow, ...)
+ *    - setting the "allow-same-origin" flag would fix that, but then still javascript and dom events refuse to fire
+ *    - therefore the "allow-scripts" flag is needed, which then would deactivate any security, as the js executed inside the iframe
+ *      can do anything as if the sandbox attribute wasn't set
+ *
  * @author Christopher Blum <christopher.blum@xing.com>
  *
- * @param {Element} element
+ * @param {Function} [readyCallback] Method that gets invoked when the sandbox is ready
+ * @param {Object} [config] Optional parameters, see defaultConfig property for more info
  *
  * @example
- *    wysihtml5.quirks.insertLineBreakOnReturn(element);
+ *    new wysihtml5.dom.Sandbox(function(sandbox) {
+ *      sandbox.getWindow().document.body.innerHTML = '<img src=foo.gif onerror="alert(document.cookie)">';
+ *    });
  */
-wysihtml5.quirks.insertLineBreakOnReturn = (function() {
-  var USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS  = ["LI", "DIV", "P", "H1", "H2", "H3", "H4", "H5", "H6"],
-      LIST_TAGS                                     = ["UL", "OL", "MENU"],
-      BACKSPACE_KEY                                 = 8,
-      RETURN_KEY                                    = 13;
-  
-  var keyPress = function(event) {
-    if (event.shiftKey || (event.keyCode !== RETURN_KEY && event.keyCode !== BACKSPACE_KEY)) {
-      return;
-    }
-    
-    var element         = event.target,
-        selectedNode    = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument),
-        blockElement    = wysihtml5.utils.getParentElement(selectedNode, { nodeName: USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS }, 4);
+(function(wysihtml5) {
+  var /**
+       * Default configuration
+       */
+      defaultConfig       = {
+        uaCompatible: "IE=Edge"   // X-UA-Compatible meta tag value (Document compatibility mode)
+      },
+      doc                 = document,
+      /**
+       * Properties to unset/protect on the window object
+       */
+      windowProperties    = [
+        "parent", "top", "opener", "frameElement", "frames",
+        "localStorage", "globalStorage", "sessionStorage", "indexedDB"
+      ],
+      /**
+       * Properties on the window object which are set to an empty function
+       */
+      windowProperties2   = [
+        "open", "close", "openDialog", "showModalDialog",
+        "alert", "confirm", "prompt",
+        "openDatabase", "postMessage",
+        "XMLHttpRequest", "XDomainRequest"
+      ],
+      /**
+       * Properties to unset/proetect on the document object
+       */
+      documentProperties  = [
+        "referrer",
+        "write", "open", "close"
+      ];
+  
+  wysihtml5.dom.Sandbox = Base.extend(
+    /** @scope wysihtml5.dom.Sandbox.prototype */ {
+
+    constructor: function(readyCallback, config) {
+      this.callback = readyCallback || wysihtml5.EMPTY_FUNCTION;
+      this.config   = wysihtml5.lang.object({}).merge(defaultConfig).merge(config).get();
+      this.iframe   = this._createIframe();
+    },
     
-    if (blockElement) {
-      // IE and Opera create <p> elements after leaving a list
-      // check after keypress of backspace and return whether a <p> got inserted and unwrap it
-      if (blockElement.nodeName === "LI" && (event.keyCode === RETURN_KEY || event.keyCode === BACKSPACE_KEY)) {
-        setTimeout(function() {
-          var selectedNode = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument),
-              list,
-              div;
-          if (!selectedNode) {
-            return;
-          }
-          
-          list = wysihtml5.utils.getParentElement(selectedNode, {
+    insertInto: function(element) {
+      if (typeof(element) === "string") {
+        element = doc.getElementById(element);
+      }
+      
+      element.appendChild(this.iframe);
+    },
+
+    getIframe: function() {
+      return this.iframe;
+    },
+
+    getWindow: function() {
+      this._readyError();
+    },
+
+    getDocument: function() {
+      this._readyError();
+    },
+
+    destroy: function() {
+      var iframe = this.getIframe();
+      iframe.parentNode.removeChild(iframe);
+    },
+
+    _readyError: function() {
+      throw new Error("wysihtml5.Sandbox: Sandbox iframe isn't loaded yet");
+    },
+
+    /**
+     * Creates the sandbox iframe
+     *
+     * Some important notes:
+     *  - We can't use HTML5 sandbox for now:
+     *    setting it causes that the iframe's dom can't be accessed from the outside
+     *    Therefore we need to set the "allow-same-origin" flag which enables accessing the iframe's dom
+     *    But then there's another problem, DOM events (focus, blur, change, keypress, ...) aren't fired.
+     *    In order to make this happen we need to set the "allow-scripts" flag.
+     *    A combination of allow-scripts and allow-same-origin is almost the same as setting no sandbox attribute at all.
+     *  - Chrome & Safari, doesn't seem to support sandboxing correctly when the iframe's html is inlined (no physical document)
+     *  - IE needs to have the security="restricted" attribute set before the iframe is 
+     *    inserted into the dom tree
+     *  - Believe it or not but in IE "security" in document.createElement("iframe") is false, even
+     *    though it supports it
+     *  - When an iframe has security="restricted", in IE eval() & execScript() don't work anymore
+     *  - IE doesn't fire the onload event when the content is inlined in the src attribute, therefore we rely
+     *    on the onreadystatechange event
+     */
+    _createIframe: function() {
+      var that   = this,
+          iframe = doc.createElement("iframe");
+      iframe.className = "wysihtml5-sandbox";
+      wysihtml5.dom.setAttributes({
+        "security":           "restricted",
+        "allowtransparency":  "true",
+        "frameborder":        0,
+        "width":              0,
+        "height":             0,
+        "marginwidth":        0,
+        "marginheight":       0
+      }).on(iframe);
+
+      // Setting the src like this prevents ssl warnings in IE6
+      if (wysihtml5.browser.throwsMixedContentWarningWhenIframeSrcIsEmpty()) {
+        iframe.src = "javascript:'<html></html>'";
+      }
+
+      iframe.onload = function() {
+        iframe.onreadystatechange = iframe.onload = null;
+        that._onLoadIframe(iframe);
+      };
+
+      iframe.onreadystatechange = function() {
+        if (/loaded|complete/.test(iframe.readyState)) {
+          iframe.onreadystatechange = iframe.onload = null;
+          that._onLoadIframe(iframe);
+        }
+      };
+
+      return iframe;
+    },
+
+    /**
+     * Callback for when the iframe has finished loading
+     */
+    _onLoadIframe: function(iframe) {
+      // don't resume when the iframe got unloaded (eg. by removing it from the dom)
+      if (!wysihtml5.dom.contains(doc.documentElement, iframe)) {
+        return;
+      }
+
+      var that           = this,
+          iframeWindow   = iframe.contentWindow,
+          iframeDocument = iframe.contentDocument || iframe.contentWindow.document,
+          charset        = doc.characterSet || doc.charset || "utf-8",
+          sandboxHtml    = this._getHtml({
+            charset:      charset,
+            stylesheets:  this.config.stylesheets,
+            uaCompatible: this.config.uaCompatible
+          });
+
+      // Create the basic dom tree including proper DOCTYPE and charset
+      iframeDocument.open("text/html", "replace");
+      iframeDocument.write(sandboxHtml);
+      iframeDocument.close();
+
+      this.getWindow = function() { return iframeWindow; };
+      this.getDocument = function() { return iframeDocument; };
+
+      // Catch js errors and pass them to the parent's onerror event
+      // addEventListener("error") doesn't work properly in some browsers
+      // TODO: apparently this doesn't work in IE9!
+      iframeWindow.onerror = function(errorMessage, fileName, lineNumber) {
+        throw new Error("wysihtml5.Sandbox: " + errorMessage, fileName, lineNumber);
+      };
+
+      if (!wysihtml5.browser.supportsSandboxedIframes()) {
+        // Unset a bunch of sensitive variables
+        // Please note: This isn't hack safe!  
+        // It more or less just takes care of basic attacks and prevents accidental theft of sensitive information
+        // IE is secure though, which is the most important thing, since IE is the only browser, who
+        // takes over scripts & styles into contentEditable elements when copied from external websites
+        // or applications (Microsoft Word, ...)
+        var i, length;
+        for (i=0, length=windowProperties.length; i<length; i++) {
+          this._unset(iframeWindow, windowProperties[i]);
+        }
+        for (i=0, length=windowProperties2.length; i<length; i++) {
+          this._unset(iframeWindow, windowProperties2[i], wysihtml5.EMPTY_FUNCTION);
+        }
+        for (i=0, length=documentProperties.length; i<length; i++) {
+          this._unset(iframeDocument, documentProperties[i]);
+        }
+        // This doesn't work in Safari 5 
+        // See http://stackoverflow.com/questions/992461/is-it-possible-to-override-document-cookie-in-webkit
+        this._unset(iframeDocument, "cookie", "", true);
+      }
+
+      this.loaded = true;
+
+      // Trigger the callback
+      setTimeout(function() { that.callback(that); }, 0);
+    },
+
+    _getHtml: function(templateVars) {
+      var stylesheets = templateVars.stylesheets,
+          html        = "",
+          i           = 0,
+          length;
+      stylesheets = typeof(stylesheets) === "string" ? [stylesheets] : stylesheets;
+      if (stylesheets) {
+        length = stylesheets.length;
+        for (; i<length; i++) {
+          html += '<link rel="stylesheet" href="' + stylesheets[i] + '">';
+        }
+      }
+      templateVars.stylesheets = html;
+
+      return wysihtml5.lang.string(
+        '<!DOCTYPE html><html><head>'
+        + '<meta http-equiv="X-UA-Compatible" content="#{uaCompatible}"><meta charset="#{charset}">#{stylesheets}</head>'
+        + '<body></body></html>'
+      ).interpolate(templateVars);
+    },
+
+    /**
+     * Method to unset/override existing variables
+     * @example
+     *    // Make cookie unreadable and unwritable
+     *    this._unset(document, "cookie", "", true);
+     */
+    _unset: function(object, property, value, setter) {
+      try { object[property] = value; } catch(e) {}
+
+      try { object.__defineGetter__(property, function() { return value; }); } catch(e) {}
+      if (setter) {
+        try { object.__defineSetter__(property, function() {}); } catch(e) {}
+      }
+
+      if (!wysihtml5.browser.crashesWhenDefineProperty(property)) {
+        try {
+          var config = {
+            get: function() { return value; }
+          };
+          if (setter) {
+            config.set = function() {};
+          }
+          Object.defineProperty(object, property, config);
+        } catch(e) {}
+      }
+    }
+  });
+})(wysihtml5);
+(function() {
+  var mapping = {
+    "className": "class"
+  };
+  wysihtml5.dom.setAttributes = function(attributes) {
+    return {
+      on: function(element) {
+        for (var i in attributes) {
+          element.setAttribute(mapping[i] || i, attributes[i]);
+        }
+      }
+    }
+  };
+})();wysihtml5.dom.setStyles = function(styles) {
+  return {
+    on: function(element) {
+      var style = element.style;
+      if (typeof(styles) === "string") {
+        style.cssText += ";" + styles;
+        return;
+      }
+      for (var i in styles) {
+        if (i === "float") {
+          style.cssFloat = styles[i];
+          style.styleFloat = styles[i];
+        } else {
+          style[i] = styles[i];
+        }
+      }
+    }
+  };
+};/**
+ * Simulate HTML5 placeholder attribute
+ *
+ * Needed since
+ *    - div[contentEditable] elements don't support it
+ *    - older browsers (such as IE8 and Firefox 3.6) don't support it at all
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ *
+ * @param {Object} parent Instance of main wysihtml5.Editor class
+ * @param {Element} view Instance of wysihtml5.views.* class
+ * @param {String} placeholderText
+ *
+ * @example
+ *    wysihtml.dom.simulatePlaceholder(this, composer, "Foobar");
+ */
+(function(dom) {
+  dom.simulatePlaceholder = function(editor, view, placeholderText) {
+    var CLASS_NAME = "placeholder",
+        unset = function() {
+          if (view.hasPlaceholderSet()) {
+            view.clear();
+          }
+          dom.removeClass(view.element, CLASS_NAME);
+        },
+        set = function() {
+          if (view.isEmpty()) {
+            view.setValue(placeholderText);
+            dom.addClass(view.element, CLASS_NAME);
+          }
+        };
+
+    editor
+      .observe("set_placeholder", set)
+      .observe("unset_placeholder", unset)
+      .observe("focus:composer", unset)
+      .observe("paste:composer", unset)
+      .observe("blur:composer", set);
+
+    set();
+  };
+})(wysihtml5.dom);
+(function(dom) {
+  var documentElement = document.documentElement;
+  if ("textContent" in documentElement) {
+    dom.setTextContent = function(element, text) {
+      element.textContent = text;
+    };
+
+    dom.getTextContent = function(element) {
+      return element.textContent;
+    };
+  } else if ("innerText" in documentElement) {
+    dom.setTextContent = function(element, text) {
+      element.innerText = text;
+    };
+
+    dom.getTextContent = function(element) {
+      return element.innerText;
+    };
+  } else {
+    dom.setTextContent = function(element, text) {
+      element.nodeValue = text;
+    };
+
+    dom.getTextContent = function(element) {
+      return element.nodeValue;
+    };
+  }
+})(wysihtml5.dom);
+
+/**
+ * Fix most common html formatting misbehaviors of browsers implementation when inserting
+ * content via copy & paste contentEditable
+ *
+ * @author Christopher Blum
+ */
+wysihtml5.quirks.cleanPastedHTML = (function() {
+  // TODO: We probably need more rules here
+  var defaultRules = {
+    // When pasting underlined links <a> into a contentEditable, IE thinks, it has to insert <u> to keep the styling
+    "a u": wysihtml5.dom.replaceWithChildNodes
+  };
+  
+  function cleanPastedHTML(elementOrHtml, rules, context) {
+    rules   = rules || defaultRules;
+    context = context || elementOrHtml.ownerDocument || document;
+    
+    var element,
+        isString = typeof(elementOrHtml) === "string",
+        method,
+        matches,
+        matchesLength,
+        i,
+        j = 0;
+    if (isString) {
+      element = wysihtml5.dom.getAsDom(elementOrHtml, context);
+    } else {
+      element = elementOrHtml;
+    }
+    
+    for (i in rules) {
+      matches       = element.querySelectorAll(i);
+      method        = rules[i];
+      matchesLength = matches.length;
+      for (; j<matchesLength; j++) {
+        method(matches[j]);
+      }
+    }
+    
+    matches = elementOrHtml = rules = null;
+    
+    return isString ? element.innerHTML : element;
+  }
+  
+  return cleanPastedHTML;
+})();/**
+ * IE and Opera leave an empty paragraph in the contentEditable element after clearing it
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ * @param {Object} contentEditableElement The contentEditable element to observe for clearing events
+ * @exaple
+ *    wysihtml5.quirks.ensureProperClearing(myContentEditableElement);
+ */
+(function(wysihtml5) {
+  var dom = wysihtml5.dom;
+  
+  wysihtml5.quirks.ensureProperClearing = (function() {
+    var clearIfNecessary = function(event) {
+      var element = this;
+      setTimeout(function() {
+        var innerHTML = element.innerHTML.toLowerCase();
+        if (innerHTML == "<p>&nbsp;</p>" ||
+            innerHTML == "<p>&nbsp;</p><p>&nbsp;</p>") {
+          element.innerHTML = "";
+        }
+      }, 0);
+    };
+
+    return function(contentEditableElement) {
+      dom.observe(contentEditableElement, ["cut", "keydown"], clearIfNecessary);
+    };
+  })();
+
+
+
+  /**
+   * In Opera when the caret is in the first and only item of a list (<ul><li>|</li></ul>) and the list is the first child of the contentEditable element, it's impossible to delete the list by hitting backspace
+   *
+   * @author Christopher Blum <christopher.blum@xing.com>
+   * @param {Object} contentEditableElement The contentEditable element to observe for clearing events
+   * @exaple
+   *    wysihtml5.quirks.ensureProperClearing(myContentEditableElement);
+   */
+  wysihtml5.quirks.ensureProperClearingOfLists = (function() {
+    var ELEMENTS_THAT_CONTAIN_LI = ["OL", "UL", "MENU"];
+
+    var clearIfNecessary = function(element, contentEditableElement) {
+      if (!contentEditableElement.firstChild || !wysihtml5.lang.array(ELEMENTS_THAT_CONTAIN_LI).contains(contentEditableElement.firstChild.nodeName)) {
+        return;
+      }
+
+      var list = dom.getParentElement(element, { nodeName: ELEMENTS_THAT_CONTAIN_LI });
+      if (!list) {
+        return;
+      }
+
+      var listIsFirstChildOfContentEditable = list == contentEditableElement.firstChild;
+      if (!listIsFirstChildOfContentEditable) {
+        return;
+      }
+
+      var hasOnlyOneListItem = list.childNodes.length <= 1;
+      if (!hasOnlyOneListItem) {
+        return;
+      }
+
+      var onlyListItemIsEmpty = list.firstChild ? list.firstChild.innerHTML === "" : true;
+      if (!onlyListItemIsEmpty) {
+        return;
+      }
+
+      list.parentNode.removeChild(list);
+    };
+
+    return function(contentEditableElement) {
+      dom.observe(contentEditableElement, "keydown", function(event) {
+        if (event.keyCode !== wysihtml5.BACKSPACE_KEY) {
+          return;
+        }
+
+        var element = wysihtml5.selection.getSelectedNode(contentEditableElement.ownerDocument);
+        clearIfNecessary(element, contentEditableElement);
+      });
+    };
+  })();
+
+})(wysihtml5);
+// See https://bugzilla.mozilla.org/show_bug.cgi?id=664398
+//
+// In Firefox this:
+//      var d = document.createElement("div");
+//      d.innerHTML ='<a href="~"></a>';
+//      d.innerHTML;
+// will result in:
+//      <a href="%7E"></a>
+// which is wrong
+(function(wysihtml5) {
+  var TILDE_ESCAPED = "%7E";
+  wysihtml5.quirks.getCorrectInnerHTML = function(element) {
+    var innerHTML = element.innerHTML;
+    if (innerHTML.indexOf(TILDE_ESCAPED) === -1) {
+      return innerHTML;
+    }
+    
+    var elementsWithTilde = element.querySelectorAll("[href*='~'], [src*='~']"),
+        url,
+        urlToSearch,
+        length,
+        i;
+    for (i=0, length=elementsWithTilde.length; i<length; i++) {
+      url         = elementsWithTilde[i].href || elementsWithTilde[i].src;
+      urlToSearch = wysihtml5.lang.string(url).replace("~").by(TILDE_ESCAPED);
+      innerHTML   = wysihtml5.lang.string(innerHTML).replace(urlToSearch).by(url);
+    }
+    return innerHTML;
+  };
+})(wysihtml5);/**
+ * Some browsers don't insert line breaks when hitting return in a contentEditable element
+ *    - Opera & IE insert new <p> on return
+ *    - Chrome & Safari insert new <div> on return
+ *    - Firefox inserts <br> on return (yippie!)
+ 
+ * @author Christopher Blum <christopher.blum@xing.com>
+ *
+ * @param {Element} element
+ *
+ * @example
+ *    wysihtml5.quirks.insertLineBreakOnReturn(element);
+ */
+(function(wysihtml5) {
+  var dom                                           = wysihtml5.dom,
+      USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS  = ["LI", "DIV", "P", "H1", "H2", "H3", "H4", "H5", "H6"],
+      LIST_TAGS                                     = ["UL", "OL", "MENU"];
+  
+  function keyPress(event) {
+    var keyCode = event.keyCode;
+    
+    if (event.shiftKey || (keyCode !== wysihtml5.ENTER_KEY && keyCode !== wysihtml5.BACKSPACE_KEY)) {
+      return;
+    }
+    
+    var element         = event.target,
+        selectedNode    = wysihtml5.selection.getSelectedNode(element.ownerDocument),
+        blockElement    = dom.getParentElement(selectedNode, { nodeName: USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS }, 4);
+    
+    if (blockElement) {
+      // IE and Opera create <p> elements after leaving a list
+      // check after keypress of backspace and return whether a <p> got inserted and unwrap it
+      if (blockElement.nodeName === "LI" && (keyCode === wysihtml5.ENTER_KEY || keyCode === wysihtml5.BACKSPACE_KEY)) {
+        setTimeout(function() {
+          var selectedNode = wysihtml5.selection.getSelectedNode(element.ownerDocument),
+              list,
+              div;
+          if (!selectedNode) {
+            return;
+          }
+          
+          list = dom.getParentElement(selectedNode, {
             nodeName: LIST_TAGS
           }, 2);
           
           if (list) {
             return;
           }
-          if (selectedNode.parentNode.nodeName === "P") {
-            div = wysihtml5.utils.renameElement(selectedNode.parentNode, "div");
-            wysihtml5.utils.caret.selectNode(div);
+          if (selectedNode.parentNode.nodeName === "P") {
+            div = dom.renameElement(selectedNode.parentNode, "div");
+            wysihtml5.selection.selectNode(div);
+          }
+        }, 0);
+      }
+      return;
+    }
+    
+    if (keyCode === wysihtml5.ENTER_KEY) {
+      wysihtml5.commands.exec(element, "insertLineBreak");
+      event.preventDefault();
+    }
+  }
+  
+  wysihtml5.quirks.insertLineBreakOnReturn = function(element) {
+    // keypress doesn't fire when you hit backspace
+    dom.observe(element.ownerDocument, "keydown", keyPress);
+  };
+})(wysihtml5);/**
+ * Force rerendering of a given element
+ * Needed to fix display misbehaviors of IE
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ * @param {Element} element The element object which needs to be rerendered
+ * @example
+ *    wysihtml5.quirks.redraw(document.body);
+ */
+(function(wysihtml5) {
+  var CLASS_NAME = "wysihtml5-quirks-redraw";
+  
+  wysihtml5.quirks.redraw = function(element) {
+    wysihtml5.dom.addClass(element, CLASS_NAME);
+    wysihtml5.dom.removeClass(element, CLASS_NAME);
+    
+    // Following hack is needed for firefox to make sure that image resize handles are properly removed
+    try {
+      var doc = element.ownerDocument;
+      doc.execCommand("italic", false, null);
+      doc.execCommand("italic", false, null);
+    } catch(e) {}
+  };
+})(wysihtml5);(function(wysihtml5) {
+  var PLACEHOLDER_TEXT = "--_CARET_--",
+      dom              = wysihtml5.dom;
+  
+      // ----------------- private -------------- \\
+  function _createPlaceholderNode(doc) {
+    // Important: placeholder element needs to be an inline element
+    // otherwise chrome will cause trouble when interacting with the text
+    var element       = doc._wysihtml5CaretPlaceholder = (doc._wysihtml5CaretPlaceholder || doc.createElement("span"));
+    element.innerHTML = PLACEHOLDER_TEXT;
+    return element;
+  }
+
+  function _findPlaceholderNode(doc) {
+    var placeholderElement      = _createPlaceholderNode(doc),
+        // Using placeholderElement.innerHTML causes problems in firefox who sometimes mangles the innerHTML
+        placeholderElementText  = dom.getTextContent(placeholderElement),
+        placeholderElementById  = doc.getElementById(placeholderElement.id),
+        i                       = 0,
+        element,
+        elements,
+        elementsLength;
+    if (dom.contains(doc.body, placeholderElement)) {
+      return placeholderElement;
+    } else if (placeholderElementById) {
+      return placeholderElementById;
+    } else {
+      elements = doc.getElementsByTagName("*");
+      elementsLength = elements.length;
+      for (; i<elementsLength; i++) {
+        element = elements[i];
+        if (element.innerHTML === placeholderElementText) {
+          return element;
+        }
+      }
+      return null;
+    }
+  }
+  
+  function _getCumulativeOffsetTop(element) {
+    var top = 0;
+    if (element.parentNode) {
+      do {
+        top += element.offsetTop || 0;
+        element = element.offsetParent;
+      } while (element);
+    }
+    return top;
+  }
+  
+  wysihtml5.selection = {
+    PLACEHOLDER_TEXT: PLACEHOLDER_TEXT,
+
+    /**
+     * Get the current selection as a bookmark to be able to later restore it
+     *
+     * @param {Object} doc Document object of the context
+     * @return {Object} An object that represents the current selection
+     */
+    getBookmark: function(doc) {
+      var range = this.getRange(doc);
+      return range && range.cloneRange();
+    },
+
+    /**
+     * Restore a selection retrieved via wysihtml5.selection.getBookmark
+     *
+     * @param {Object} bookmark An object that represents the current selection
+     */
+    setBookmark: function(bookmark) {
+      if (!bookmark) {
+        return;
+      }
+
+      this.setSelection(bookmark);
+    },
+
+    /**
+     * Set the caret in front of the given node
+     *
+     * @param {Object} node The element or text node where to position the caret in front of
+     * @example
+     *    wysihtml5.selection.setBefore(myElement);
+     */
+    setBefore: function(node) {
+      var range = rangy.createRange(node.ownerDocument);
+      range.setStartBefore(node);
+      range.setEndBefore(node);
+      return this.setSelection(range);
+    },
+
+    /**
+     * Set the caret after the given node
+     *
+     * @param {Object} node The element or text node where to position the caret in front of
+     * @example
+     *    wysihtml5.selection.setBefore(myElement);
+     */
+    setAfter: function(node) {
+      var range = rangy.createRange(node.ownerDocument);
+      range.setStartAfter(node);
+      range.setEndAfter(node);
+      return this.setSelection(range);
+    },
+
+    /**
+     * Ability to select/mark nodes
+     *
+     * @param {Element} node The node/element to select
+     * @example
+     *    wysihtml5.selection.selectNode(document.getElementById("my-image"));
+     */
+    selectNode: function(node) {
+      var range           = rangy.createRange(node.ownerDocument),
+          isElement       = node.nodeType === wysihtml5.ELEMENT_NODE,
+          canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : (node.nodeName !== "IMG"),
+          content         = isElement ? node.innerHTML : node.data,
+          isEmpty         = (content === "" || content === wysihtml5.INVISIBLE_SPACE),
+          displayStyle    = dom.getStyle("display").from(node),
+          isBlockElement  = (displayStyle === "block" || displayStyle === "list-item");
+
+      if (isEmpty && isElement && canHaveHTML) {
+        // Make sure that caret is visible in node by inserting a zero width no breaking space
+        try { node.innerHTML = wysihtml5.INVISIBLE_SPACE; } catch(e) {}
+      }
+
+      if (canHaveHTML) {
+        range.selectNodeContents(node);
+      } else {
+        range.selectNode(node);
+      }
+
+      if (canHaveHTML && isEmpty && isElement) {
+        range.collapse(isBlockElement);
+      } else if (canHaveHTML && isEmpty) {
+        range.setStartAfter(node);
+        range.setEndAfter(node);
+      }
+
+      this.setSelection(range);
+    },
+
+    /**
+     * Get the node which contains the selection
+     *
+     * @param {Object} document Document object of the context where to select
+     * @param {Boolean} [controlRange] (only IE) Whether it should return the selected ControlRange element when the selection type is a "ControlRange"
+     * @return {Object} The node that contains the caret
+     * @example
+     *    var nodeThatContainsCaret = wysihtml5.selection.getSelectedNode(document);
+     */
+    getSelectedNode: function(doc, controlRange) {
+      var selection,
+          range;
+
+      if (controlRange && doc.selection && doc.selection.type === "Control") {
+        range = doc.selection.createRange();
+        if (range && range.length) {
+          return range.item(0);
+        }
+      }
+
+      selection = this.getSelection(doc);
+      if (selection.focusNode === selection.anchorNode) {
+        return selection.focusNode;
+      } else {
+        range = this.getRange(doc);
+        return range ? range.commonAncestorContainer : doc.body;
+      }
+    },
+
+    executeAndRestore: function(doc, method, restoreScrollPosition) {
+      if (!window.getSelection) {
+        return this.executeAndRestoreSimple(doc, method);
+      }
+
+      var body                = doc.body,
+          oldScrollTop        = body.scrollTop,
+          oldScrollLeft       = body.scrollLeft,
+          range               = this.getRange(doc),
+          caretPlaceholder    = _createPlaceholderNode(doc),
+          newCaretPlaceholder,
+          newRange;
+
+      // Nothing selected, execute and say goodbye
+      if (!range) {
+        method(body, body);
+        return;
+      }
+
+      range.insertNode(caretPlaceholder);
+
+      // Make sure that a potential error doesn't cause our placeholder element to be left as a placeholder
+      try {
+        method(range.startContainer, range.endContainer);
+      } catch(e1) {
+        setTimeout(function() { throw e1; }, 0);
+      }
+
+      // range.detach();
+
+      newCaretPlaceholder = _findPlaceholderNode(doc);
+
+      if (newCaretPlaceholder) {
+        newRange = rangy.createRange(doc);
+        newRange.selectNode(newCaretPlaceholder);
+        newRange.deleteContents();
+        this.setSelection(newRange);
+      }
+
+      if (restoreScrollPosition) {
+        body.scrollTop  = oldScrollTop;
+        body.scrollLeft = oldScrollLeft;
+      }
+
+      // Remove it again, just to make sure that the placeholder is definitely out of the dom tree
+      try {
+        newCaretPlaceholder.parentNode.removeChild(newCaretPlaceholder);
+      } catch(e2) {}
+    },
+
+    /**
+     * Different approach of preserving the selection (doesn't modify the dom)
+     * Takes all text nodes in the selection and saves the selection position in the first and last one
+     */
+    executeAndRestoreSimple: function(doc, method) {
+      var range = this.getRange(doc),
+          newRange,
+          firstNode,
+          lastNode,
+          textNodes,
+          rangeBackup;
+
+      // Nothing selected, execute and say goodbye
+      if (!range) {
+        method(doc.body, doc.body);
+        return;
+      }
+
+      textNodes = range.getNodes([3]);
+      firstNode = textNodes[0] || range.startContainer;
+      lastNode  = textNodes[textNodes.length - 1] || range.endContainer;
+
+      rangeBackup = {
+        collapsed:      range.collapsed,
+        startContainer: firstNode,
+        startOffset:    firstNode === range.startContainer ? range.startOffset : 0,
+        endContainer:   lastNode,
+        endOffset:      lastNode === range.endContainer ? range.endOffset : lastNode.length
+      };
+
+      try {
+        method(range.startContainer, range.endContainer);
+      } catch(e) {
+        setTimeout(function() { throw e; }, 0);
+      }
+
+      newRange = rangy.createRange(doc);
+      try { newRange.setStart(rangeBackup.startContainer, rangeBackup.startOffset); } catch(e1) {}
+      try { newRange.setEnd(rangeBackup.endContainer, rangeBackup.endOffset); } catch(e2) {}
+      try { this.setSelection(newRange); } catch(e3) {}
+    },
+
+    /**
+     * Insert html at the caret position and move the cursor after the inserted html
+     *
+     * @param {Object} doc Document object of the context where to insert the html
+     * @param {String} html HTML string to insert
+     * @example
+     *    wysihtml5.selection.insertHTML(document, "<p>foobar</p>");
+     */
+    insertHTML: function(doc, html) {
+      var range     = rangy.createRange(doc),
+          node      = range.createContextualFragment(html),
+          lastChild = node.lastChild;
+      this.insertNode(node);
+      if (lastChild) {
+        this.setAfter(lastChild);
+      }
+    },
+
+    /**
+     * Insert a node at the caret position and move the cursor after it
+     *
+     * @param {Object} node HTML string to insert
+     * @example
+     *    wysihtml5.selection.insertNode(document.createTextNode("foobar"));
+     */
+    insertNode: function(node) {
+      var range = this.getRange(node.ownerDocument);
+      if (range) {
+        range.insertNode(node);
+      } else {
+        return false;
+      }
+    },
+
+    /**
+     * Wraps current selection with the given node
+     *
+     * @param {Object} node The node to surround the selected elements with
+     */
+    surround: function(node) {
+      var range = this.getRange(node.ownerDocument);
+      if (!range) {
+        return;
+      }
+
+      try {
+        // This only works when the range boundaries are not overlapping other elements
+        range.surroundContents(node);
+        this.selectNode(node);
+      } catch(e) {
+        // fallback
+        node.appendChild(range.extractContents());
+        range.insertNode(node);
+      }
+    },
+
+    /**
+     * Scroll the current caret position into the view
+     * FIXME: This is a bit hacky, there might be a smarter way of doing this
+     *
+     * @param {Object} element A scrollable element in which the caret is currently positioned
+     * @example
+     *    wysihtml5.selection.scrollIntoView(element);
+     */
+    scrollIntoView: function(element) {
+      var doc           = element.ownerDocument,
+          hasScrollBars = doc.documentElement.scrollHeight > doc.documentElement.offsetHeight,
+          tempElement   = doc._wysihtml5ScrollIntoViewElement = doc._wysihtml5ScrollIntoViewElement || (function() {
+            var element = doc.createElement("span");
+            // The element needs content in order to be able to calculate it's position properly
+            element.innerHTML = wysihtml5.INVISIBLE_SPACE;
+            return element;
+          })(),
+          offsetTop;
+
+      if (hasScrollBars) {
+        this.insertNode(tempElement);
+        offsetTop = _getCumulativeOffsetTop(tempElement);
+        tempElement.parentNode.removeChild(tempElement);
+        if (offsetTop > element.scrollTop) {
+          element.scrollTop = offsetTop;
+        }
+      }
+    },
+
+    /**
+     * Select line where the caret is in
+     */
+    selectLine: function(doc) {
+      if (wysihtml5.browser.supportsSelectionModify()) {
+        this._selectLine_W3C(doc);
+      } else if (doc.selection) {
+        this._selectLine_MSIE(doc);
+      }
+    },
+
+    /**
+     * See https://developer.mozilla.org/en/DOM/Selection/modify
+     */
+    _selectLine_W3C: function(doc) {
+      var win = doc.defaultView,
+          selection = win.getSelection();
+      selection.modify("extend", "left", "lineboundary");
+      selection.modify("extend", "right", "lineboundary");
+    },
+
+    _selectLine_MSIE: function(doc) {
+      var range       = doc.selection.createRange(),
+          rangeTop    = range.boundingTop,
+          rangeHeight = range.boundingHeight,
+          scrollWidth = doc.body.scrollWidth,
+          rangeBottom,
+          rangeEnd,
+          measureNode,
+          i,
+          j;
+
+      if (!range.moveToPoint) {
+        return;
+      }
+
+      if (rangeTop === 0) {
+        // Don't know why, but when the selection ends at the end of a line
+        // range.boundingTop is 0
+        measureNode = doc.createElement("span");
+        this.insertNode(measureNode);
+        rangeTop = measureNode.offsetTop;
+        measureNode.parentNode.removeChild(measureNode);
+      }
+
+      rangeTop += 1;
+
+      for (i=-10; i<scrollWidth; i+=2) {
+        try {
+          range.moveToPoint(i, rangeTop);
+          break;
+        } catch(e1) {}
+      }
+
+      // Investigate the following in order to handle multi line selections
+      // rangeBottom = rangeTop + (rangeHeight ? (rangeHeight - 1) : 0);
+      rangeBottom = rangeTop;
+      rangeEnd = doc.selection.createRange();
+      for (j=scrollWidth; j>=0; j--) {
+        try {
+          rangeEnd.moveToPoint(j, rangeBottom);
+          break;
+        } catch(e2) {}
+      }
+
+      range.setEndPoint("EndToEnd", rangeEnd);
+      range.select();
+    },
+
+    getText: function(doc) {
+      var selection = this.getSelection(doc);
+      return selection ? selection.toString() : "";
+    },
+
+    getNodes: function(doc, nodeType, filter) {
+      var range = this.getRange(doc);
+      if (range) {
+        return range.getNodes([nodeType], filter);
+      } else {
+        return [];
+      }
+    },
+
+    getRange: function(doc) {
+      var selection = this.getSelection(doc);
+      return selection && selection.rangeCount && selection.getRangeAt(0);
+    },
+
+    getSelection: function(doc) {
+      return rangy.getSelection(doc.defaultView || doc.parentWindow);
+    },
+
+    setSelection: function(range) {
+      var doc       = (range.startContainer || range.endContainer).ownerDocument,
+          win       = doc.defaultView || doc.parentWindow,
+          selection = rangy.getSelection(win);
+      return selection.setSingleRange(range);
+    }
+  };
+  
+})(wysihtml5);
+
+/**
+ * @author Christopher Blum <christopher.blum@xing.com> to match WYSIHTML5 logic
+ * in order to be able ...
+ *    - to use custom tags
+ *    - to detect and replace similar css classes via reg exp
+ *
+ * Inspired by the rangy CSS Applier module written by Tim Down and  licensed under the MIT license.
+ * http://code.google.com/p/rangy/
+ */
+(function(wysihtml5, rangy) {
+  var defaultTagName = "span";
+  
+  var REG_EXP_WHITE_SPACE = /\s+/g;
+  
+  function hasClass(el, cssClass, regExp) {
+    if (!el.className) {
+      return false;
+    }
+    
+    var matchingClassNames = el.className.match(regExp) || [];
+    return matchingClassNames[matchingClassNames.length - 1] === cssClass;
+  }
+
+  function addClass(el, cssClass, regExp) {
+    if (el.className) {
+      removeClass(el, regExp);
+      el.className += " " + cssClass;
+    } else {
+      el.className = cssClass;
+    }
+  }
+
+  function removeClass(el, regExp) {
+    if (el.className) {
+      el.className = el.className.replace(regExp, "");
+    }
+  }
+  
+  function hasSameClasses(el1, el2) {
+    return el1.className.replace(REG_EXP_WHITE_SPACE, " ") == el2.className.replace(REG_EXP_WHITE_SPACE, " ");
+  }
+
+  function replaceWithOwnChildren(el) {
+    var parent = el.parentNode;
+    while (el.firstChild) {
+      parent.insertBefore(el.firstChild, el);
+    }
+    parent.removeChild(el);
+  }
+
+  function elementsHaveSameNonClassAttributes(el1, el2) {
+    if (el1.attributes.length != el2.attributes.length) {
+      return false;
+    }
+    for (var i = 0, len = el1.attributes.length, attr1, attr2, name; i < len; ++i) {
+      attr1 = el1.attributes[i];
+      name = attr1.name;
+      if (name != "class") {
+        attr2 = el2.attributes.getNamedItem(name);
+        if (attr1.specified != attr2.specified) {
+          return false;
+        }
+        if (attr1.specified && attr1.nodeValue !== attr2.nodeValue) {
+          return false;
+        }
+      }
+    }
+    return true;
+  }
+
+  function isSplitPoint(node, offset) {
+    if (rangy.dom.isCharacterDataNode(node)) {
+      if (offset == 0) {
+        return !!node.previousSibling;
+      } else if (offset == node.length) {
+        return !!node.nextSibling;
+      } else {
+        return true;
+      }
+    }
+
+    return offset > 0 && offset < node.childNodes.length;
+  }
+
+  function splitNodeAt(node, descendantNode, descendantOffset) {
+    var newNode;
+    if (rangy.dom.isCharacterDataNode(descendantNode)) {
+      if (descendantOffset == 0) {
+        descendantOffset = rangy.dom.getNodeIndex(descendantNode);
+        descendantNode = descendantNode.parentNode;
+      } else if (descendantOffset == descendantNode.length) {
+        descendantOffset = rangy.dom.getNodeIndex(descendantNode) + 1;
+        descendantNode = descendantNode.parentNode;
+      } else {
+        newNode = rangy.dom.splitDataNode(descendantNode, descendantOffset);
+      }
+    }
+    if (!newNode) {
+      newNode = descendantNode.cloneNode(false);
+      if (newNode.id) {
+        newNode.removeAttribute("id");
+      }
+      var child;
+      while ((child = descendantNode.childNodes[descendantOffset])) {
+        newNode.appendChild(child);
+      }
+      rangy.dom.insertAfter(newNode, descendantNode);
+    }
+    return (descendantNode == node) ? newNode : splitNodeAt(node, newNode.parentNode, rangy.dom.getNodeIndex(newNode));
+  }
+  
+  function Merge(firstNode) {
+    this.isElementMerge = (firstNode.nodeType == wysihtml5.ELEMENT_NODE);
+    this.firstTextNode = this.isElementMerge ? firstNode.lastChild : firstNode;
+    this.textNodes = [this.firstTextNode];
+  }
+
+  Merge.prototype = {
+    doMerge: function() {
+      var textBits = [], textNode, parent, text;
+      for (var i = 0, len = this.textNodes.length; i < len; ++i) {
+        textNode = this.textNodes[i];
+        parent = textNode.parentNode;
+        textBits[i] = textNode.data;
+        if (i) {
+          parent.removeChild(textNode);
+          if (!parent.hasChildNodes()) {
+            parent.parentNode.removeChild(parent);
+          }
+        }
+      }
+      this.firstTextNode.data = text = textBits.join("");
+      return text;
+    },
+
+    getLength: function() {
+      var i = this.textNodes.length, len = 0;
+      while (i--) {
+        len += this.textNodes[i].length;
+      }
+      return len;
+    },
+
+    toString: function() {
+      var textBits = [];
+      for (var i = 0, len = this.textNodes.length; i < len; ++i) {
+        textBits[i] = "'" + this.textNodes[i].data + "'";
+      }
+      return "[Merge(" + textBits.join(",") + ")]";
+    }
+  };
+
+  function HTMLApplier(tagNames, cssClass, similarClassRegExp, normalize) {
+    this.tagNames = tagNames || [defaultTagName];
+    this.cssClass = cssClass || "";
+    this.similarClassRegExp = similarClassRegExp;
+    this.normalize = normalize;
+    this.applyToAnyTagName = false;
+  }
+
+  HTMLApplier.prototype = {
+    getAncestorWithClass: function(node) {
+      var cssClassMatch;
+      while (node) {
+        cssClassMatch = this.cssClass ? hasClass(node, this.cssClass, this.similarClassRegExp) : true;
+        if (node.nodeType == wysihtml5.ELEMENT_NODE && rangy.dom.arrayContains(this.tagNames, node.tagName.toLowerCase()) && cssClassMatch) {
+          return node;
+        }
+        node = node.parentNode;
+      }
+      return false;
+    },
+
+    // Normalizes nodes after applying a CSS class to a Range.
+    postApply: function(textNodes, range) {
+      var firstNode = textNodes[0], lastNode = textNodes[textNodes.length - 1];
+
+      var merges = [], currentMerge;
+
+      var rangeStartNode = firstNode, rangeEndNode = lastNode;
+      var rangeStartOffset = 0, rangeEndOffset = lastNode.length;
+
+      var textNode, precedingTextNode;
+
+      for (var i = 0, len = textNodes.length; i < len; ++i) {
+        textNode = textNodes[i];
+        precedingTextNode = this.getAdjacentMergeableTextNode(textNode.parentNode, false);
+        if (precedingTextNode) {
+          if (!currentMerge) {
+            currentMerge = new Merge(precedingTextNode);
+            merges.push(currentMerge);
+          }
+          currentMerge.textNodes.push(textNode);
+          if (textNode === firstNode) {
+            rangeStartNode = currentMerge.firstTextNode;
+            rangeStartOffset = rangeStartNode.length;
+          }
+          if (textNode === lastNode) {
+            rangeEndNode = currentMerge.firstTextNode;
+            rangeEndOffset = currentMerge.getLength();
+          }
+        } else {
+          currentMerge = null;
+        }
+      }
+
+      // Test whether the first node after the range needs merging
+      var nextTextNode = this.getAdjacentMergeableTextNode(lastNode.parentNode, true);
+      if (nextTextNode) {
+        if (!currentMerge) {
+          currentMerge = new Merge(lastNode);
+          merges.push(currentMerge);
+        }
+        currentMerge.textNodes.push(nextTextNode);
+      }
+
+      // Do the merges
+      if (merges.length) {
+        for (i = 0, len = merges.length; i < len; ++i) {
+          merges[i].doMerge();
+        }
+        // Set the range boundaries
+        range.setStart(rangeStartNode, rangeStartOffset);
+        range.setEnd(rangeEndNode, rangeEndOffset);
+      }
+    },
+    
+    getAdjacentMergeableTextNode: function(node, forward) {
+        var isTextNode = (node.nodeType == wysihtml5.TEXT_NODE);
+        var el = isTextNode ? node.parentNode : node;
+        var adjacentNode;
+        var propName = forward ? "nextSibling" : "previousSibling";
+        if (isTextNode) {
+          // Can merge if the node's previous/next sibling is a text node
+          adjacentNode = node[propName];
+          if (adjacentNode && adjacentNode.nodeType == wysihtml5.TEXT_NODE) {
+            return adjacentNode;
+          }
+        } else {
+          // Compare element with its sibling
+          adjacentNode = el[propName];
+          if (adjacentNode && this.areElementsMergeable(node, adjacentNode)) {
+            return adjacentNode[forward ? "firstChild" : "lastChild"];
+          }
+        }
+        return null;
+    },
+    
+    areElementsMergeable: function(el1, el2) {
+      return rangy.dom.arrayContains(this.tagNames, (el1.tagName || "").toLowerCase())
+        && rangy.dom.arrayContains(this.tagNames, (el2.tagName || "").toLowerCase())
+        && hasSameClasses(el1, el2)
+        && elementsHaveSameNonClassAttributes(el1, el2);
+    },
+
+    createContainer: function(doc) {
+      var el = doc.createElement(this.tagNames[0]);
+      if (this.cssClass) {
+        el.className = this.cssClass;
+      }
+      return el;
+    },
+
+    applyToTextNode: function(textNode) {
+      var parent = textNode.parentNode;
+      if (parent.childNodes.length == 1 && rangy.dom.arrayContains(this.tagNames, parent.tagName.toLowerCase())) {
+        if (this.cssClass) {
+          addClass(parent, this.cssClass, this.similarClassRegExp);
+        }
+      } else {
+        var el = this.createContainer(rangy.dom.getDocument(textNode));
+        textNode.parentNode.insertBefore(el, textNode);
+        el.appendChild(textNode);
+      }
+    },
+
+    isRemovable: function(el) {
+      return rangy.dom.arrayContains(this.tagNames, el.tagName.toLowerCase()) && wysihtml5.lang.string(el.className).trim() == this.cssClass;
+    },
+
+    undoToTextNode: function(textNode, range, ancestorWithClass) {
+      if (!range.containsNode(ancestorWithClass)) {
+        // Split out the portion of the ancestor from which we can remove the CSS class
+        var ancestorRange = range.cloneRange();
+        ancestorRange.selectNode(ancestorWithClass);
+
+        if (ancestorRange.isPointInRange(range.endContainer, range.endOffset) && isSplitPoint(range.endContainer, range.endOffset)) {
+          splitNodeAt(ancestorWithClass, range.endContainer, range.endOffset);
+          range.setEndAfter(ancestorWithClass);
+        }
+        if (ancestorRange.isPointInRange(range.startContainer, range.startOffset) && isSplitPoint(range.startContainer, range.startOffset)) {
+          ancestorWithClass = splitNodeAt(ancestorWithClass, range.startContainer, range.startOffset);
+        }
+      }
+      
+      if (this.similarClassRegExp) {
+        removeClass(ancestorWithClass, this.similarClassRegExp);
+      }
+      if (this.isRemovable(ancestorWithClass)) {
+        replaceWithOwnChildren(ancestorWithClass);
+      }
+    },
+
+    applyToRange: function(range) {
+        var textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+        if (!textNodes.length) {
+          try {
+            var node = this.createContainer(range.endContainer.ownerDocument);
+            range.surroundContents(node);
+            this.selectNode(range, node);
+            return;
+          } catch(e) {}
+        }
+        
+        range.splitBoundaries();
+        textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+        
+        if (textNodes.length) {
+          var textNode;
+
+          for (var i = 0, len = textNodes.length; i < len; ++i) {
+            textNode = textNodes[i];
+            if (!this.getAncestorWithClass(textNode)) {
+              this.applyToTextNode(textNode);
+            }
+          }
+          
+          range.setStart(textNodes[0], 0);
+          textNode = textNodes[textNodes.length - 1];
+          range.setEnd(textNode, textNode.length);
+          
+          if (this.normalize) {
+            this.postApply(textNodes, range);
           }
-        }, 0);
+        }
+    },
+
+    undoToRange: function(range) {
+      var textNodes = range.getNodes([wysihtml5.TEXT_NODE]), textNode, ancestorWithClass;
+      if (textNodes.length) {
+        range.splitBoundaries();
+        textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+      } else {
+        var doc = range.endContainer.ownerDocument,
+            node = doc.createTextNode(wysihtml5.INVISIBLE_SPACE);
+        range.insertNode(node);
+        range.selectNode(node);
+        textNodes = [node];
       }
-      return;
-    }
+      
+      for (var i = 0, len = textNodes.length; i < len; ++i) {
+        textNode = textNodes[i];
+        ancestorWithClass = this.getAncestorWithClass(textNode);
+        if (ancestorWithClass) {
+          this.undoToTextNode(textNode, range, ancestorWithClass);
+        }
+      }
+      
+      if (len == 1) {
+        this.selectNode(range, textNodes[0]);
+      } else {
+        range.setStart(textNodes[0], 0);
+        textNode = textNodes[textNodes.length - 1];
+        range.setEnd(textNode, textNode.length);
+
+        if (this.normalize) {
+          this.postApply(textNodes, range);
+        }
+      }
+    },
     
-    if (event.keyCode === RETURN_KEY) {
-      wysihtml5.commands.exec(element, "insertLineBreak");
-      event.preventDefault();
+    selectNode: function(range, node) {
+      var isElement       = node.nodeType === wysihtml5.ELEMENT_NODE,
+          canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : true,
+          content         = isElement ? node.innerHTML : node.data,
+          isEmpty         = (content === "" || content === wysihtml5.INVISIBLE_SPACE);
+
+      if (isEmpty && isElement && canHaveHTML) {
+        // Make sure that caret is visible in node by inserting a zero width no breaking space
+        try { node.innerHTML = wysihtml5.INVISIBLE_SPACE; } catch(e) {}
+      }
+      range.selectNodeContents(node);
+      if (isEmpty && isElement) {
+        range.collapse(false);
+      } else if (isEmpty) {
+        range.setStartAfter(node);
+        range.setEndAfter(node);
+      }
+    },
+    
+    getTextSelectedByRange: function(textNode, range) {
+      var textRange = range.cloneRange();
+      textRange.selectNodeContents(textNode);
+
+      var intersectionRange = textRange.intersection(range);
+      var text = intersectionRange ? intersectionRange.toString() : "";
+      textRange.detach();
+
+      return text;
+    },
+
+    isAppliedToRange: function(range) {
+      var ancestors = [],
+          ancestor,
+          textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+      if (!textNodes.length) {
+        ancestor = this.getAncestorWithClass(range.startContainer);
+        return ancestor ? [ancestor] : false;
+      }
+      
+      for (var i = 0, len = textNodes.length, selectedText; i < len; ++i) {
+        selectedText = this.getTextSelectedByRange(textNodes[i], range);
+        ancestor = this.getAncestorWithClass(textNodes[i]);
+        if (selectedText != "" && !ancestor) {
+          return false;
+        } else {
+          ancestors.push(ancestor);
+        }
+      }
+      return ancestors;
+    },
+
+    toggleRange: function(range) {
+      if (this.isAppliedToRange(range)) {
+        this.undoToRange(range);
+      } else {
+        this.applyToRange(range);
+      }
     }
   };
+
+  wysihtml5.selection.HTMLApplier = HTMLApplier;
   
-  return function(element) {
-    // keypress doesn't fire when you hit backspace
-    wysihtml5.utils.observe(element.ownerDocument, "keydown", keyPress);
-  };
-})();/**
- * Force rerendering of a given element
- * Needed to fix display misbehaviors of IE
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Element} element The element object which needs to be rerendered
- * @example
- *    wysihtml5.quirks.redraw(document.body);
- */
-wysihtml5.quirks.redraw = (function() {
-  var CLASS_NAME = "wysihtml5-quirks-redraw";
-  return function(element) {
-    Element.addClassName(element, CLASS_NAME)
-    Element.removeClassName(element, CLASS_NAME);
-    
-    // Following hack is needed for firefox to make sure that image resize handles are properly removed
-    try {
-      var doc = element.ownerDocument;
-      doc.execCommand("italic", false, null);
-      doc.execCommand("italic", false, null);
-    } catch(e) {}
-  };
-})();
-/**
+})(wysihtml5, rangy);/**
  * TODO: the following methods still need unit test coverage
  */
-wysihtml5.views.View = Class.create(
+wysihtml5.views.View = Base.extend(
   /** @scope wysihtml5.views.View.prototype */ {
-  initialize: function(parent, textareaElement, config) {
+  constructor: function(parent, textareaElement, config) {
     this.parent   = parent;
     this.element  = textareaElement;
     this.config   = config;
@@ -6086,19 +6491,19 @@ wysihtml5.views.View = Class.create(
   },
   
   _observeViewChange: function() {
+    var that = this;
     this.parent.observe("beforeload", function() {
-      this.parent.observe("change_view", function(event) {
-        var view = event.memo;
-        if (view === this.name) {
-          this.parent.currentView = this;
-          this.show();
-          // Using defer() here to make sure that the placeholder is set before focusing
-          this.focus.bind(this).defer();
+      that.parent.observe("change_view", function(view) {
+        if (view === that.name) {
+          that.parent.currentView = that;
+          that.show();
+          // Using tiny delay here to make sure that the placeholder is set before focusing
+          setTimeout(function() { that.focus(); }, 0);
         } else {
-          this.hide();
+          that.hide();
         }
-      }.bind(this));
-    }.bind(this));
+      });
+    });
   },
   
   focus: function() {
@@ -6110,11 +6515,11 @@ wysihtml5.views.View = Class.create(
   },
   
   hide: function() {
-    this.element.hide();
+    this.element.style.display = "none";
   },
   
   show: function() {
-    this.element.show();
+    this.element.style.display = "";
   },
   
   disable: function() {
@@ -6124,439 +6529,472 @@ wysihtml5.views.View = Class.create(
   enable: function() {
     this.element.removeAttribute("disabled");
   }
-});wysihtml5.views.Composer = Class.create(wysihtml5.views.View, 
-  /** @scope wysihtml5.views.Composer.prototype */ {
-  name: "composer",
-  
-  // Needed for firefox in order to display a proper caret in an empty contentEditable
-  CARET_HACK: "<br>",
-  
-  initialize: function($super, parent, textareaElement, config) {
-    $super(parent, textareaElement, config);
-    this.textarea = this.parent.textarea;
-    this._initSandbox();
-  },
-  
-  clear: function() {
-    this.element.innerHTML = wysihtml5.browserSupports.caretInEmptyContentEditableCorrectly() ? "" : this.CARET_HACK;
-  },
-  
-  getValue: function(parse) {
-    var value = this.isEmpty() ? "" : this.element.innerHTML;
-    if (parse) {
-      value = this.parent.parse(value);
-    }
-    
-    // Replace all "zero width no breaking space" chars
-    // which are used as hacks to enable some functionalities
-    // Also remove all CARET hacks that somehow got left
-    value = value
-      .replace(/\uFEFF/g, "")
-      .replace(new RegExp(RegExp.escape(wysihtml5.utils.caret.PLACEHOLDER_TEXT), "g"), "");
-    
-    return value;
-  },
-  
-  setValue: function(html, parse) {
-    if (parse) {
-      html = this.parent.parse(html);
-    }
-    this.element.innerHTML = html;
-  },
-  
-  show: function() {
-    this.iframe.setStyle({ display: this._displayStyle || "" });
-    
-    // Firefox needs this, otherwise contentEditable becomes uneditable
-    this.disable();
-    this.enable();
-  },
-  
-  hide: function() {
-    this._displayStyle = wysihtml5.utils.getStyle(this.iframe, "display");
-    if (this._displayStyle === "none") {
-      this._displayStyle = null;
-    }
-    this.iframe.hide();
-  },
-  
-  disable: function($super) {
-    this.element.removeAttribute("contentEditable");
-    $super();
-  },
-  
-  enable: function($super) {
-    this.element.setAttribute("contentEditable", "true");
-    $super();
-  },
-  
-  getTextContent: function() {
-    return wysihtml5.utils.getTextContent(this.element);
-  },
-  
-  hasPlaceholderSet: function() {
-    return this.getTextContent() == this.textarea.element.readAttribute("placeholder");
-  },
-  
-  isEmpty: function() {
-    var innerHTML               = this.element.innerHTML,
-        elementsWithVisualValue = "blockquote, ul, ol, img, embed, object, table, iframe, svg, video, audio, button, input, select, textarea";
-    return innerHTML === "" || 
-      innerHTML === this.CARET_HACK ||
-      this.hasPlaceholderSet() ||
-      (this.getTextContent() === "" && !this.element.querySelector(elementsWithVisualValue));
-  },
-  
-  _initSandbox: function() {
-    this.sandbox = new wysihtml5.utils.Sandbox(this._create.bind(this), {
-      stylesheets:  this.config.stylesheets,
-      uaCompatible: "IE=7"
-    });
-    this.iframe  = this.sandbox.getIframe();
-    
-    // Create hidden field which tells the server after submit, that the user used an wysiwyg editor
-    this.hiddenField = new Element("input", {
-      type:   "hidden",
-      name:   "_wysihtml5_mode"
-    });
-    this.hiddenField.value = "1";
-    
-    // Store reference to current wysihtml5 instance on the textarea element
-    this.textarea.element
-      .insert({ after: this.iframe })
-      .insert({ after: this.hiddenField });
-  },
-  
-  _create: function() {
-    this.element                  = this.sandbox.getDocument().body;
-    this.textarea                 = this.parent.textarea;
-    this.element.innerHTML        = this.textarea.getValue(true);
-    this.enable();
-    
-    // Make sure that our external range library is initialized
-    window.rangy.init();
-    
-    wysihtml5.utils.copyAttributes(
-      "className", "spellcheck", "title", "lang", "dir", "accessKey"
-    ).from(this.textarea.element).to(this.element);
-    
-    Element.addClassName(this.element, this.config.composerClassName);
-    
-    // Make the editor look like the original textarea, by syncing styles
-    if (this.config.style) {
-      this.style();
-    }
-    
-    this.observe();
-    
-    var name = this.config.name;
-    if (name) {
-      Element.addClassName(this.element, name);
-      Element.addClassName(this.iframe, name);
-    }
-    
-    // Simulate html5 placeholder attribute on contentEditable element
-    var placeholderText = Object.isString(this.config.placeholder) ? this.config.placeholder : this.textarea.element.readAttribute("placeholder");
-    if (placeholderText) {
-      wysihtml5.utils.simulatePlaceholder(this.parent, this, placeholderText);
-    }
-    
-    // Make sure that the browser avoids using inline styles whenever possible
-    wysihtml5.commands.exec(this.element, "styleWithCSS", false);
-    
-    this._initAutoLinking();
-    this._initObjectResizing();
-    
-    // Simulate html5 autofocus on contentEditable element
-    if (this.textarea.element.hasAttribute("autofocus") || document.querySelector(":focus") == this.textarea.element) {
-      wysihtml5.utils.autoFocus(this);
-    }
-    
-    // IE and Opera insert paragraphs on return instead of line breaks
-    if (!wysihtml5.browserSupports.lineBreaksOnReturn()) {
-      wysihtml5.quirks.insertLineBreakOnReturn(this.element);
-    }
-    
-    // IE sometimes leaves a single paragraph, which can't be removed by the user
-    if (!wysihtml5.browserSupports.clearingOfContentEditableCorrectly()) {
-      wysihtml5.quirks.ensureProperClearing(this.element);
-    }
-    
-    if (!wysihtml5.browserSupports.clearingOfListsInContentEditableCorrectly()) {
-      wysihtml5.quirks.ensureProperClearingOfLists(this.element);
-    }
-    
-    // Set up a sync that makes sure that textarea and editor have the same content
-    if (this.initSync && this.config.sync) {
-      this.initSync();
-    }
-    
-    // Okay hide the textarea, we are ready to go
-    this.textarea.hide();
-    
-    // Fire global (before-)load event
-    this.parent.fire("beforeload").fire("load");
-  },
-  
-  _initAutoLinking: function() {
-    var supportsDisablingOfAutoLinking = wysihtml5.browserSupports.disablingOfAutoLinking(),
-        supportsAutoLinking            = wysihtml5.browserSupports.autoLinkingInContentEditable();
-    if (supportsDisablingOfAutoLinking) {
-      wysihtml5.commands.exec(this.element, "autoUrlDetect", false);
-    }
-    
-    if (!this.config.autoLink) {
-      return;
-    }
-    
-    var sandboxDoc = this.sandbox.getDocument();
-    
-    // Only do the auto linking by ourselves when the browser doesn't support auto linking
-    // OR when he supports auto linking but we were able to turn it off (IE9+)
-    if (!supportsAutoLinking || (supportsAutoLinking && supportsDisablingOfAutoLinking)) {
-      this.parent.observe("newword:composer", function() {
-        wysihtml5.utils.caret.executeAndRestore(sandboxDoc, function(startContainer, endContainer) {
-          wysihtml5.utils.autoLink(endContainer.parentNode);
-        });
-      }.bind(this));
-    }
-    
-    // Assuming we have the following:
-    //  <a href="http://www.google.de">http://www.google.de</a>
-    // If a user now changes the url in the innerHTML we want to make sure that
-    // it's synchronized with the href attribute (as long as the innerHTML is still a url)
-    var // Use a live NodeList to check whether there are any links in the document
-        links           = sandboxDoc.getElementsByTagName("a"),
-        // The autoLink helper method reveals a reg exp to detect correct urls
-        urlRegExp       = wysihtml5.utils.autoLink.URL_REG_EXP,
-        getTextContent  = function(element) {
-          var textContent = wysihtml5.utils.getTextContent(element).strip();
-          if (textContent.substr(0, 4) === "www.") {
-            textContent = "http://" + textContent;
-          }
-          return textContent;
-        };
-    
-    wysihtml5.utils.observe(this.element, "keydown", function(event) {
-      if (!links.length) {
-        return;
+});(function(wysihtml5) {
+  var dom       = wysihtml5.dom,
+      browser   = wysihtml5.browser,
+      selection = wysihtml5.selection;
+  
+  wysihtml5.views.Composer = wysihtml5.views.View.extend(
+    /** @scope wysihtml5.views.Composer.prototype */ {
+    name: "composer",
+
+    // Needed for firefox in order to display a proper caret in an empty contentEditable
+    CARET_HACK: "<br>",
+
+    constructor: function(parent, textareaElement, config) {
+      this.base(parent, textareaElement, config);
+      this.textarea = this.parent.textarea;
+      this._initSandbox();
+    },
+
+    clear: function() {
+      this.element.innerHTML = browser.displaysCaretInEmptyContentEditableCorrectly() ? "" : this.CARET_HACK;
+    },
+
+    getValue: function(parse) {
+      var value = this.isEmpty() ? "" : wysihtml5.quirks.getCorrectInnerHTML(this.element);
+      
+      if (parse) {
+        value = this.parent.parse(value);
+      }
+
+      // Replace all "zero width no breaking space" chars
+      // which are used as hacks to enable some functionalities
+      // Also remove all CARET hacks that somehow got left
+      value = wysihtml5.lang.string(value).replace(wysihtml5.INVISIBLE_SPACE).by("");
+      value = wysihtml5.lang.string(value).replace(selection.PLACEHOLDER_TEXT).by("");
+
+      return value;
+    },
+
+    setValue: function(html, parse) {
+      if (parse) {
+        html = this.parent.parse(html);
       }
+      this.element.innerHTML = html;
+    },
+
+    show: function() {
+      this.iframe.style.display = this._displayStyle || "";
+
+      // Firefox needs this, otherwise contentEditable becomes uneditable
+      this.disable();
+      this.enable();
+    },
+
+    hide: function() {
+      this._displayStyle = dom.getStyle("display").from(this.iframe);
+      if (this._displayStyle === "none") {
+        this._displayStyle = null;
+      }
+      this.iframe.style.display = "none";
+    },
+
+    disable: function() {
+      this.element.removeAttribute("contentEditable");
+      this.base();
+    },
+
+    enable: function() {
+      this.element.setAttribute("contentEditable", "true");
+      this.base();
+    },
+
+    getTextContent: function() {
+      return dom.getTextContent(this.element);
+    },
+
+    hasPlaceholderSet: function() {
+      return this.getTextContent() == this.textarea.element.getAttribute("placeholder");
+    },
+
+    isEmpty: function() {
+      var innerHTML               = this.element.innerHTML,
+          elementsWithVisualValue = "blockquote, ul, ol, img, embed, object, table, iframe, svg, video, audio, button, input, select, textarea";
+      return innerHTML === ""              || 
+             innerHTML === this.CARET_HACK ||
+             this.hasPlaceholderSet()      ||
+             (this.getTextContent() === "" && !this.element.querySelector(elementsWithVisualValue));
+    },
+
+    _initSandbox: function() {
+      var that = this;
+      
+      this.sandbox = new dom.Sandbox(function() {
+        that._create();
+      }, {
+        stylesheets:  this.config.stylesheets,
+        uaCompatible: "IE=7"
+      });
+      this.iframe  = this.sandbox.getIframe();
+
+      // Create hidden field which tells the server after submit, that the user used an wysiwyg editor
+      var hiddenField = document.createElement("input");
+      hiddenField.type   = "hidden";
+      hiddenField.name   = "_wysihtml5_mode";
+      hiddenField.value  = 1;
+
+      // Store reference to current wysihtml5 instance on the textarea element
+      var textareaElement = this.textarea.element;
+      dom.insert(this.iframe).after(textareaElement);
+      dom.insert(hiddenField).after(textareaElement);
+    },
+
+    _create: function() {
+      var that = this;
       
-      var selectedNode = wysihtml5.utils.caret.getSelectedNode(event.target.ownerDocument),
-          link         = wysihtml5.utils.getParentElement(selectedNode, { nodeName: "A" }, 4),
-          textContent;
+      this.element            = this.sandbox.getDocument().body;
+      this.textarea           = this.parent.textarea;
+      this.element.innerHTML  = this.textarea.getValue(true);
+      this.enable();
+
+      // Make sure that our external range library is initialized
+      window.rangy.init();
+
+      dom.copyAttributes([
+        "className", "spellcheck", "title", "lang", "dir", "accessKey"
+      ]).from(this.textarea.element).to(this.element);
       
-      if (!link) {
+      dom.addClass(this.element, this.config.composerClassName);
+
+      // Make the editor look like the original textarea, by syncing styles
+      if (this.config.style) {
+        this.style();
+      }
+
+      this.observe();
+
+      var name = this.config.name;
+      if (name) {
+        dom.addClass(this.element, name);
+        dom.addClass(this.iframe, name);
+      }
+
+      // Simulate html5 placeholder attribute on contentEditable element
+      var placeholderText = typeof(this.config.placeholder) === "string"
+        ? this.config.placeholder
+        : this.textarea.element.getAttribute("placeholder");
+      if (placeholderText) {
+        dom.simulatePlaceholder(this.parent, this, placeholderText);
+      }
+
+      // Make sure that the browser avoids using inline styles whenever possible
+      wysihtml5.commands.exec(this.element, "styleWithCSS", false);
+
+      this._initAutoLinking();
+      this._initObjectResizing();
+
+      // Simulate html5 autofocus on contentEditable element
+      if (this.textarea.element.hasAttribute("autofocus") || document.querySelector(":focus") == this.textarea.element) {
+        setTimeout(function() { that.focus(); }, 100);
+      }
+
+      // IE and Opera insert paragraphs on return instead of line breaks
+      if (!browser.insertsLineBreaksOnReturn()) {
+        wysihtml5.quirks.insertLineBreakOnReturn(this.element);
+      }
+
+      // IE sometimes leaves a single paragraph, which can't be removed by the user
+      if (!browser.clearsContentEditableCorrectly()) {
+        wysihtml5.quirks.ensureProperClearing(this.element);
+      }
+
+      if (!browser.clearsListsInContentEditableCorrectly()) {
+        wysihtml5.quirks.ensureProperClearingOfLists(this.element);
+      }
+
+      // Set up a sync that makes sure that textarea and editor have the same content
+      if (this.initSync && this.config.sync) {
+        this.initSync();
+      }
+
+      // Okay hide the textarea, we are ready to go
+      this.textarea.hide();
+
+      // Fire global (before-)load event
+      this.parent.fire("beforeload").fire("load");
+    },
+
+    _initAutoLinking: function() {
+      var supportsDisablingOfAutoLinking = browser.canDisableAutoLinking(),
+          supportsAutoLinking            = browser.doesAutoLinkingInContentEditable();
+      if (supportsDisablingOfAutoLinking) {
+        wysihtml5.commands.exec(this.element, "autoUrlDetect", false);
+      }
+
+      if (!this.config.autoLink) {
         return;
       }
-      
-      textContent = getTextContent(link);
-      // keydown is fired before the actual content is changed
-      // therefore we set a timeout to change the href
-      setTimeout(function() {
-        var newTextContent = getTextContent(link);
-        if (newTextContent === textContent) {
+
+      var sandboxDoc = this.sandbox.getDocument();
+
+      // Only do the auto linking by ourselves when the browser doesn't support auto linking
+      // OR when he supports auto linking but we were able to turn it off (IE9+)
+      if (!supportsAutoLinking || (supportsAutoLinking && supportsDisablingOfAutoLinking)) {
+        this.parent.observe("newword:composer", function() {
+          selection.executeAndRestore(sandboxDoc, function(startContainer, endContainer) {
+            dom.autoLink(endContainer.parentNode);
+          });
+        });
+      }
+
+      // Assuming we have the following:
+      //  <a href="http://www.google.de">http://www.google.de</a>
+      // If a user now changes the url in the innerHTML we want to make sure that
+      // it's synchronized with the href attribute (as long as the innerHTML is still a url)
+      var // Use a live NodeList to check whether there are any links in the document
+          links           = sandboxDoc.getElementsByTagName("a"),
+          // The autoLink helper method reveals a reg exp to detect correct urls
+          urlRegExp       = dom.autoLink.URL_REG_EXP,
+          getTextContent  = function(element) {
+            var textContent = wysihtml5.lang.string(dom.getTextContent(element)).trim();
+            if (textContent.substr(0, 4) === "www.") {
+              textContent = "http://" + textContent;
+            }
+            return textContent;
+          };
+
+      dom.observe(this.element, "keydown", function(event) {
+        if (!links.length) {
           return;
         }
-        
-        // Only set href when new href looks like a valid url
-        if (newTextContent.match(urlRegExp)) {
-          link.setAttribute("href", newTextContent);
+
+        var selectedNode = selection.getSelectedNode(event.target.ownerDocument),
+            link         = dom.getParentElement(selectedNode, { nodeName: "A" }, 4),
+            textContent;
+
+        if (!link) {
+          return;
         }
-      }, 0);
-    });
-  },
-  
-  _initObjectResizing: function() {
-    wysihtml5.commands.exec(this.element, "enableObjectResizing", this.config.allowObjectResizing);
-    
-    if (this.config.allowObjectResizing) {
-      if (wysihtml5.browserSupports.event("resizeend")) {
-        wysihtml5.utils.observe(this.element, "resizeend", function(event) {
-          var target      = event.target || event.srcElement;
-          ["width", "height"].each(function(property) {
-            if (target.style[property]) {
-              target.setAttribute(property, parseInt(target.style[property], 10));
-              target.style[property] = "";
+
+        textContent = getTextContent(link);
+        // keydown is fired before the actual content is changed
+        // therefore we set a timeout to change the href
+        setTimeout(function() {
+          var newTextContent = getTextContent(link);
+          if (newTextContent === textContent) {
+            return;
+          }
+
+          // Only set href when new href looks like a valid url
+          if (newTextContent.match(urlRegExp)) {
+            link.setAttribute("href", newTextContent);
+          }
+        }, 0);
+      });
+    },
+
+    _initObjectResizing: function() {
+      var properties        = ["width", "height"],
+          propertiesLength  = properties.length,
+          element           = this.element;
+      
+      wysihtml5.commands.exec(element, "enableObjectResizing", this.config.allowObjectResizing);
+
+      if (this.config.allowObjectResizing) {
+         // IE sets inline styles after resizing objects
+         // The following lines make sure that the width/height css properties
+         // are copied over to the width/height attributes
+        if (browser.supportsEvent("resizeend")) {
+          dom.observe(element, "resizeend", function(event) {
+            var target = event.target || event.srcElement,
+                style  = target.style,
+                i      = 0,
+                property;
+            for(; i<propertiesLength; i++) {
+              property = properties[i];
+              if (style[property]) {
+                target.setAttribute(property, parseInt(style[property], 10));
+                style[property] = "";
+              }
             }
+            // After resizing IE sometimes forgets to remove the old resize handles
+            wysihtml5.quirks.redraw(element);
           });
-          // After resizing IE sometimes forgets to remove the old resize handles
-          wysihtml5.quirks.redraw(this.element);
-        }.bind(this));
-      }
-    } else {
-      if (wysihtml5.browserSupports.event("resizestart")) {
-        wysihtml5.utils.observe(this.element, "resizestart", function(event) {
-          event.preventDefault();
-        });
-      }
-    }
-  }
-});wysihtml5.views.Composer.addMethods({
-  style: (function() {
-    var HOST_TEMPLATE   = new Element("div"),
-        /**
-         * Styles to copy from textarea to the composer element
-         */
-        TEXT_FORMATTING = [
-          "background-color",
-          "color", "cursor",
-          "font-family", "font-size", "font-style", "font-variant", "font-weight",
-          "line-height", "letter-spacing",
-          "text-align", "text-decoration", "text-indent", "text-rendering",
-          "word-break", "word-wrap", "word-spacing"
-        ],
-        /**
-         * Styles to copy from textarea to the iframe
-         */
-        BOX_FORMATTING = [
-          "background-color",
-          "border-collapse",
-          "border-bottom-color", "border-bottom-style", "border-bottom-width",
-          "border-left-color", "border-left-style", "border-left-width",
-          "border-right-color", "border-right-style", "border-right-width",
-          "border-top-color", "border-top-style", "border-top-width",
-          "clear", "display", "float",
-          "margin-bottom", "margin-left", "margin-right", "margin-top",
-          "outline-color", "outline-offset", "outline-width", "outline-style",
-          "padding-left", "padding-right", "padding-top", "padding-bottom",
-          "position", "top", "left", "right", "bottom", "z-index",
-          "vertical-align", "text-align",
-          "-webkit-box-sizing", "-moz-box-sizing", "-ms-box-sizing", "box-sizing",
-          "-webkit-box-shadow", "-moz-box-shadow", "-ms-box-shadow","box-shadow",
-          "width", "height"
-        ],
-        /**
-         * Styles to sync while the window gets resized
-         */
-        RESIZE_STYLE = [
-          "width", "height",
-          "top", "left", "right", "bottom"
-        ],
-        ADDITIONAL_CSS_RULES = [
-          "html             { height: 100%; }",
-          "body             { min-height: 100%; padding: 0; margin: 0; margin-top: -1px; padding-top: 1px; }",
-          Prototype.Browser.Gecko ?
-            "body.placeholder { color: graytext !important; }" : 
-            "body.placeholder { color: #a9a9a9 !important; }",
-          "body[disabled]   { background-color: #eee !important; color: #999 !important; cursor: default !important; }",
-          // Ensure that user see's broken images and can delete them
-          "img:-moz-broken  { -moz-force-broken-image-icon: 1; height: 24px; width: 24px; }"
-        ];
-    
-    /**
-     * With "setActive" IE offers a smart way of focusing elements without scrolling them into view:
-     * http://msdn.microsoft.com/en-us/library/ms536738(v=vs.85).aspx
-     *
-     * Other browsers need a more hacky way: (pssst don't tell my mama)
-     * In order to prevent the element being scrolled into view when focusing it, we simply
-     * Move it out of the scrollable area, focus it, and reset it's position
-     */
-    var focusWithoutScrolling = function(element) {
-      if (element.setActive) {
-        element.setActive();
+        }
       } else {
-        var elementStyle = element.style,
-            originalScrollTop = document.documentElement.scrollTop || document.body.scrollTop,
-            originalScrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft,
-            originalStyles = {
-              position:         elementStyle.position,
-              top:              elementStyle.top,
-              left:             elementStyle.left,
-              WebkitUserSelect: elementStyle.WebkitUserSelect
-            };
-        
-        // Don't ask why but temporarily setting -webkit-user-select to none makes the whole thing performing smoother
-        element.setStyle({ position: "absolute", top: "-99999px", left: "-99999px", WebkitUserSelect: "none" });
-        element.focus();
-        element.setStyle(originalStyles);
-        if (window.scrollTo) {
-          // Some browser extensions unset this method to prevent annoyances
-          // "Better PopUp Blocker" for Chrome http://code.google.com/p/betterpopupblocker/source/browse/trunk/blockStart.js#100
-          // Issue: http://code.google.com/p/betterpopupblocker/issues/detail?id=1
-          window.scrollTo(originalScrollLeft, originalScrollTop);
+        if (browser.supportsEvent("resizestart")) {
+          dom.observe(element, "resizestart", function(event) { event.preventDefault(); });
         }
       }
-    };
-    
-    return function() {
-      var originalActiveElement = document.querySelector(":focus"),
-          textareaElement       = this.textarea.element,
-          hasPlaceholder        = textareaElement.hasAttribute("placeholder"),
-          originalPlaceholder   = hasPlaceholder && textareaElement.getAttribute("placeholder");
-      this.focusStylesHost      = this.focusStylesHost  || HOST_TEMPLATE.clone();
-      this.blurStylesHost       = this.blurStylesHost   || HOST_TEMPLATE.clone();
-      
-      // Remove placeholder before copying (as the placeholder has an affect on the computed style)
-      if (hasPlaceholder) {
-        textareaElement.removeAttribute("placeholder");
-      }
-      
-      if (textareaElement === originalActiveElement) {
-        textareaElement.blur();
-      }
-      
-      // --------- iframe styles (has to be set before editor styles, otherwise IE9 sets wrong fontFamily on blurStylesHost) ---------
-      wysihtml5.utils.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.iframe).andTo(this.blurStylesHost);
-      
-      // --------- editor styles ---------
-      wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.element).andTo(this.blurStylesHost);
-      
-      // --------- apply standard rules ---------
-      wysihtml5.utils.insertRules(ADDITIONAL_CSS_RULES).into(this.element.ownerDocument);
-      
-      // --------- :focus styles ---------
-      focusWithoutScrolling(textareaElement);
-      wysihtml5.utils.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.focusStylesHost);
-      wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.focusStylesHost);
+    }
+  });
+})(wysihtml5);(function(wysihtml5) {
+  var dom             = wysihtml5.dom,
+      doc             = document,
+      win             = window,
+      HOST_TEMPLATE   = doc.createElement("div"),
+      /**
+       * Styles to copy from textarea to the composer element
+       */
+      TEXT_FORMATTING = [
+        "background-color",
+        "color", "cursor",
+        "font-family", "font-size", "font-style", "font-variant", "font-weight",
+        "line-height", "letter-spacing",
+        "text-align", "text-decoration", "text-indent", "text-rendering",
+        "word-break", "word-wrap", "word-spacing"
+      ],
+      /**
+       * Styles to copy from textarea to the iframe
+       */
+      BOX_FORMATTING = [
+        "background-color",
+        "border-collapse",
+        "border-bottom-color", "border-bottom-style", "border-bottom-width",
+        "border-left-color", "border-left-style", "border-left-width",
+        "border-right-color", "border-right-style", "border-right-width",
+        "border-top-color", "border-top-style", "border-top-width",
+        "clear", "display", "float",
+        "margin-bottom", "margin-left", "margin-right", "margin-top",
+        "outline-color", "outline-offset", "outline-width", "outline-style",
+        "padding-left", "padding-right", "padding-top", "padding-bottom",
+        "position", "top", "left", "right", "bottom", "z-index",
+        "vertical-align", "text-align",
+        "-webkit-box-sizing", "-moz-box-sizing", "-ms-box-sizing", "box-sizing",
+        "-webkit-box-shadow", "-moz-box-shadow", "-ms-box-shadow","box-shadow",
+        "width", "height"
+      ],
+      /**
+       * Styles to sync while the window gets resized
+       */
+      RESIZE_STYLE = [
+        "width", "height",
+        "top", "left", "right", "bottom"
+      ],
+      ADDITIONAL_CSS_RULES = [
+        "html             { height: 100%; }",
+        "body             { min-height: 100%; padding: 0; margin: 0; margin-top: -1px; padding-top: 1px; }",
+        wysihtml5.browser.isGecko ?
+          "body.placeholder { color: graytext !important; }" : 
+          "body.placeholder { color: #a9a9a9 !important; }",
+        "body[disabled]   { background-color: #eee !important; color: #999 !important; cursor: default !important; }",
+        // Ensure that user see's broken images and can delete them
+        "img:-moz-broken  { -moz-force-broken-image-icon: 1; height: 24px; width: 24px; }"
+      ];
+  
+  /**
+   * With "setActive" IE offers a smart way of focusing elements without scrolling them into view:
+   * http://msdn.microsoft.com/en-us/library/ms536738(v=vs.85).aspx
+   *
+   * Other browsers need a more hacky way: (pssst don't tell my mama)
+   * In order to prevent the element being scrolled into view when focusing it, we simply
+   * Move it out of the scrollable area, focus it, and reset it's position
+   */
+  var focusWithoutScrolling = function(element) {
+    if (element.setActive) {
+      element.setActive();
+    } else {
+      var elementStyle = element.style,
+          originalScrollTop = doc.documentElement.scrollTop || doc.body.scrollTop,
+          originalScrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft,
+          originalStyles = {
+            position:         elementStyle.position,
+            top:              elementStyle.top,
+            left:             elementStyle.left,
+            WebkitUserSelect: elementStyle.WebkitUserSelect
+          };
       
-      // Make sure that we don't change the display style of the iframe when copying styles oblur/onfocus
-      // this is needed for when the change_view event is fired where the iframe is hidden and then
-      // the blur event fires and re-displays it
-      var boxFormattingStyles = BOX_FORMATTING.without("display");
+      dom.setStyles({
+        position:         "absolute",
+        top:              "-99999px",
+        left:             "-99999px",
+        // Don't ask why but temporarily setting -webkit-user-select to none makes the whole thing performing smoother
+        WebkitUserSelect: "none"
+      }).on(element);
       
-      // --------- restore focus ---------
-      if (originalActiveElement) {
-        originalActiveElement.focus();
-      } else {
-        textareaElement.blur();
-      }
+      element.focus();
       
-      // --------- restore placeholder ---------
-      if (hasPlaceholder) {
-        textareaElement.setAttribute("placeholder", originalPlaceholder);
-      }
+      dom.setStyles(originalStyles).on(element);
       
-      // When copying styles, we only get the computed style which is never returned in percent unit
-      // Therefore we've to recalculate style onresize
-      if (!wysihtml5.browserSupports.computedStyleInPercent()) {
-        Event.observe(window, "resize", function() {
-          var originalDisplayStyle = wysihtml5.utils.getStyle(textareaElement, "display");
-          textareaElement.style.display = "";
-          wysihtml5.utils.copyStyles(RESIZE_STYLE)
-            .from(textareaElement)
-            .to(this.iframe)
-            .andTo(this.focusStylesHost)
-            .andTo(this.blurStylesHost);
-          textareaElement.style.display = originalDisplayStyle;
-        }.bind(this));
+      if (win.scrollTo) {
+        // Some browser extensions unset this method to prevent annoyances
+        // "Better PopUp Blocker" for Chrome http://code.google.com/p/betterpopupblocker/source/browse/trunk/blockStart.js#100
+        // Issue: http://code.google.com/p/betterpopupblocker/issues/detail?id=1
+        win.scrollTo(originalScrollLeft, originalScrollTop);
       }
-      
-      // --------- Sync focus/blur styles ---------
-      this.parent.observe("focus:composer", function() {
-        wysihtml5.utils.copyStyles(boxFormattingStyles).from(this.focusStylesHost).to(this.iframe);
-        wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(this.focusStylesHost).to(this.element);
-      }.bind(this));
-
-      this.parent.observe("blur:composer", function() {
-        wysihtml5.utils.copyStyles(boxFormattingStyles).from(this.blurStylesHost).to(this.iframe);
-        wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(this.blurStylesHost).to(this.element);
-      }.bind(this));
-      
-      return this;
-    };
-  })()
-});/**
+    }
+  };
+  
+  
+  wysihtml5.views.Composer.prototype.style = function() {
+    var that                  = this,
+        originalActiveElement = doc.querySelector(":focus"),
+        textareaElement       = this.textarea.element,
+        hasPlaceholder        = textareaElement.hasAttribute("placeholder"),
+        originalPlaceholder   = hasPlaceholder && textareaElement.getAttribute("placeholder");
+    this.focusStylesHost      = this.focusStylesHost  || HOST_TEMPLATE.cloneNode(false);
+    this.blurStylesHost       = this.blurStylesHost   || HOST_TEMPLATE.cloneNode(false);
+  
+    // Remove placeholder before copying (as the placeholder has an affect on the computed style)
+    if (hasPlaceholder) {
+      textareaElement.removeAttribute("placeholder");
+    }
+  
+    if (textareaElement === originalActiveElement) {
+      textareaElement.blur();
+    }
+  
+    // --------- iframe styles (has to be set before editor styles, otherwise IE9 sets wrong fontFamily on blurStylesHost) ---------
+    dom.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.iframe).andTo(this.blurStylesHost);
+  
+    // --------- editor styles ---------
+    dom.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.element).andTo(this.blurStylesHost);
+  
+    // --------- apply standard rules ---------
+    dom.insertCSS(ADDITIONAL_CSS_RULES).into(this.element.ownerDocument);
+  
+    // --------- :focus styles ---------
+    focusWithoutScrolling(textareaElement);
+    dom.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.focusStylesHost);
+    dom.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.focusStylesHost);
+  
+    // Make sure that we don't change the display style of the iframe when copying styles oblur/onfocus
+    // this is needed for when the change_view event is fired where the iframe is hidden and then
+    // the blur event fires and re-displays it
+    var boxFormattingStyles = wysihtml5.lang.array(BOX_FORMATTING).without(["display"]);
+  
+    // --------- restore focus ---------
+    if (originalActiveElement) {
+      originalActiveElement.focus();
+    } else {
+      textareaElement.blur();
+    }
+  
+    // --------- restore placeholder ---------
+    if (hasPlaceholder) {
+      textareaElement.setAttribute("placeholder", originalPlaceholder);
+    }
+  
+    // When copying styles, we only get the computed style which is never returned in percent unit
+    // Therefore we've to recalculate style onresize
+    if (!wysihtml5.browser.hasCurrentStyleProperty()) {
+      dom.observe(win, "resize", function() {
+        var originalDisplayStyle = dom.getStyle("display").from(textareaElement);
+        textareaElement.style.display = "";
+        dom.copyStyles(RESIZE_STYLE)
+          .from(textareaElement)
+          .to(that.iframe)
+          .andTo(that.focusStylesHost)
+          .andTo(that.blurStylesHost);
+        textareaElement.style.display = originalDisplayStyle;
+      });
+    }
+  
+    // --------- Sync focus/blur styles ---------
+    this.parent.observe("focus:composer", function() {
+      dom.copyStyles(boxFormattingStyles) .from(that.focusStylesHost).to(that.iframe);
+      dom.copyStyles(TEXT_FORMATTING)     .from(that.focusStylesHost).to(that.element);
+    });
+
+    this.parent.observe("blur:composer", function() {
+      dom.copyStyles(boxFormattingStyles) .from(that.blurStylesHost).to(that.iframe);
+      dom.copyStyles(TEXT_FORMATTING)     .from(that.blurStylesHost).to(that.element);
+    });
+  
+    return this;
+  };
+})(wysihtml5);/**
  * Taking care of events
  *  - Simulating 'change' event on contentEditable element
  *  - Handling drag & drop logic
@@ -6566,167 +7004,262 @@ wysihtml5.views.View = Class.create(
  *
  * @author Christopher Blum <christopher.blum@xing.com>
  */
-wysihtml5.views.Composer.addMethods({
-  observe: (function() {
-    /**
-     * Map keyCodes to query commands
-     */
-    var shortcuts = {
-      "66": "bold",     // B
-      "73": "italic",   // I
-      "85": "underline" // U
-    };
-    
-    return function() {
-      var state               = this.getValue(),
-          iframe              = this.sandbox.getIframe(),
-          element             = this.element,
-          focusBlurElement    = wysihtml5.browserSupports.eventsInIframeCorrectly() ? element : this.sandbox.getWindow(),
-          // Firefox < 3.5 doesn't support the drop event, instead it supports a so called "dragdrop" event which behaves almost the same
-          pasteEvents         = wysihtml5.browserSupports.event("drop") ? ["drop", "paste"] : ["dragdrop", "paste"];
-      
-      // --------- destroy:composer event ---------
-      wysihtml5.utils.observe(iframe, "DOMNodeRemoved", function() {
+(function(wysihtml5) {
+  var dom       = wysihtml5.dom,
+      browser   = wysihtml5.browser,
+      /**
+       * Map keyCodes to query commands
+       */
+      shortcuts = {
+        "66": "bold",     // B
+        "73": "italic",   // I
+        "85": "underline" // U
+      };
+  
+  wysihtml5.views.Composer.prototype.observe = function() {
+    var that                = this,
+        state               = this.getValue(),
+        iframe              = this.sandbox.getIframe(),
+        element             = this.element,
+        focusBlurElement    = browser.supportsEventsInIframeCorrectly() ? element : this.sandbox.getWindow(),
+        // Firefox < 3.5 doesn't support the drop event, instead it supports a so called "dragdrop" event which behaves almost the same
+        pasteEvents         = browser.supportsEvent("drop") ? ["drop", "paste"] : ["dragdrop", "paste"];
+
+    // --------- destroy:composer event ---------
+    dom.observe(iframe, "DOMNodeRemoved", function() {
+      clearInterval(domNodeRemovedInterval);
+      that.parent.fire("destroy:composer");
+    });
+
+    // DOMNodeRemoved event is not supported in IE 8
+    var domNodeRemovedInterval = setInterval(function() {
+      if (!dom.contains(document.documentElement, iframe)) {
         clearInterval(domNodeRemovedInterval);
-        this.parent.fire("destroy:composer");
-      }.bind(this));
-      
-      // DOMNodeRemoved event is not supported in IE 8
-      var domNodeRemovedInterval = setInterval(function() {
-        if (!wysihtml5.utils.contains(document.documentElement, iframe)) {
-          clearInterval(domNodeRemovedInterval);
-          this.parent.fire("destroy:composer");
-        }
-      }.bind(this), 250);
-      
-      
-      // --------- Focus & blur logic ---------
-      wysihtml5.utils.observe(focusBlurElement, "focus", function() {
-        this.parent.fire("focus").fire("focus:composer");
+        that.parent.fire("destroy:composer");
+      }
+    }, 250);
 
-        // Delay storing of state until all focus handler are fired
-        // especially the one which resets the placeholder
-        (function() { state = this.getValue(); }).bind(this).defer();
-      }.bind(this));
 
-      wysihtml5.utils.observe(focusBlurElement, "blur", function() {
-        if (state != this.getValue()) {
-          this.parent.fire("change").fire("change:composer");
-        }
-        this.parent.fire("blur").fire("blur:composer");
-      }.bind(this));
+    // --------- Focus & blur logic ---------
+    dom.observe(focusBlurElement, "focus", function() {
+      that.parent.fire("focus").fire("focus:composer");
 
-      // --------- Drag & Drop logic ---------
-      wysihtml5.utils.observe(element, "dragenter", function() {
-        this.parent.fire("unset_placeholder");
-      }.bind(this));
+      // Delay storing of state until all focus handler are fired
+      // especially the one which resets the placeholder
+      setTimeout(function() { state = that.getValue(); }, 0);
+    });
 
-      if (wysihtml5.browserSupports.onDropOnlyWhenOnDragOverIsCancelled()) {
-        wysihtml5.utils.observe(element, ["dragover", "dragenter"], function(event) {
-          event.preventDefault();
-        }.bind(this));
+    dom.observe(focusBlurElement, "blur", function() {
+      if (state !== that.getValue()) {
+        that.parent.fire("change").fire("change:composer");
       }
-      
-      wysihtml5.utils.observe(element, pasteEvents, function(event) {
-        var dataTransfer = event.dataTransfer,
-            data;
-        
-        if (dataTransfer && wysihtml5.browserSupports.htmlDataTransfer()) {
-          data = dataTransfer.getData("text/html") || dataTransfer.getData("text/plain");
-        }
-        if (data) {
-          element.focus();
-          wysihtml5.commands.exec(element, "insertHTML", data);
-          this.parent.fire("paste").fire("paste:composer");
-          event.stopPropagation();
-          event.preventDefault();
-        } else {
-          setTimeout(function() {
-            this.parent.fire("paste").fire("paste:composer");
-          }.bind(this), 0);
-        }
-      }.bind(this));
+      that.parent.fire("blur").fire("blur:composer");
+    });
 
-      // --------- neword event ---------
-      Event.KEY_SPACE = Event.KEY_SPACE || 32;
-      wysihtml5.utils.observe(element, "keyup", function(event) {
-        var keyCode = event.keyCode;
-        if (keyCode == Event.KEY_SPACE || keyCode == Event.KEY_RETURN) {
-          this.parent.fire("newword:composer");
-        }
-      }.bind(this));
+    // --------- Drag & Drop logic ---------
+    dom.observe(element, "dragenter", function() {
+      that.parent.fire("unset_placeholder");
+    });
+
+    if (browser.firesOnDropOnlyWhenOnDragOverIsCancelled()) {
+      dom.observe(element, ["dragover", "dragenter"], function(event) {
+        event.preventDefault();
+      });
+    }
 
-      this.parent.observe("paste:composer", function() {
-        setTimeout(function() { this.parent.fire("newword:composer"); }.bind(this), 0);
-      }.bind(this));
+    dom.observe(element, pasteEvents, function(event) {
+      var dataTransfer = event.dataTransfer,
+          data;
 
-      // --------- Make sure that images are selected when clicking on them ---------
-      if (!wysihtml5.browserSupports.selectingOfImagesInContentEditableOnClick()) {
-        wysihtml5.utils.observe(element, "mousedown", function(event) {
-          var target = event.target;
-          if (target.nodeName == "IMG") {
-            wysihtml5.utils.caret.selectNode(target);
-            event.preventDefault();
-          }
-        });
+      if (dataTransfer && browser.supportsDataTransfer()) {
+        data = dataTransfer.getData("text/html") || dataTransfer.getData("text/plain");
+      }
+      if (data) {
+        element.focus();
+        wysihtml5.commands.exec(element, "insertHTML", data);
+        that.parent.fire("paste").fire("paste:composer");
+        event.stopPropagation();
+        event.preventDefault();
+      } else {
+        setTimeout(function() {
+          that.parent.fire("paste").fire("paste:composer");
+        }, 0);
       }
+    });
 
-      // --------- Shortcut logic ---------
-      wysihtml5.utils.observe(element, "keydown", function(event) {
-        var keyCode  = event.keyCode,
-            command  = shortcuts[keyCode.toString()];
-        if ((event.ctrlKey || event.metaKey) && command) {
-          wysihtml5.commands.exec(element, command);
-          event.preventDefault();
-        }
-      });
-      
-      // --------- Make sure that when pressing backspace/delete on selected images deletes the image and it's anchor ---------
-      wysihtml5.utils.observe(element, "keydown", function(event) {
-        var target  = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument, true),
-            keyCode = event.keyCode,
-            parent;
-        if (target && target.nodeName == "IMG" && (keyCode == 8 || keyCode == 46)) { // 8 => backspace, 46 => delete
-          parent = target.parentNode;
-          // delete the <img>
-          parent.removeChild(target);
-          // and it's parent <a> too if it hasn't got any other child nodes
-          if (parent.nodeName == "A" && !parent.firstChild) {
-            parent.parentNode.removeChild(parent);
-          }
-          
-          setTimeout(function() { wysihtml5.quirks.redraw(element); }, 0);
+    // --------- neword event ---------
+    dom.observe(element, "keyup", function(event) {
+      var keyCode = event.keyCode;
+      if (keyCode === wysihtml5.SPACE_KEY || keyCode === wysihtml5.ENTER_KEY) {
+        that.parent.fire("newword:composer");
+      }
+    });
+
+    this.parent.observe("paste:composer", function() {
+      setTimeout(function() { that.parent.fire("newword:composer"); }, 0);
+    });
+
+    // --------- Make sure that images are selected when clicking on them ---------
+    if (!browser.canSelectImagesInContentEditable()) {
+      dom.observe(element, "mousedown", function(event) {
+        var target = event.target;
+        if (target.nodeName === "IMG") {
+          wysihtml5.selection.selectNode(target);
           event.preventDefault();
         }
       });
-      
-      // --------- Show url in tooltip when hovering links or images ---------
-      var titlePrefixes = {
-        IMG: "Image: ",
-        A:   "Link: "
-      };
-      wysihtml5.utils.observe(element, "mouseover", function(event) {
-        var target   = event.target,
-            nodeName = target.nodeName,
-            title;
-        if (nodeName !== "A" && nodeName !== "IMG") {
-          return;
+    }
+
+    // --------- Shortcut logic ---------
+    dom.observe(element, "keydown", function(event) {
+      var keyCode  = event.keyCode,
+          command  = shortcuts[keyCode];
+      if ((event.ctrlKey || event.metaKey) && command) {
+        wysihtml5.commands.exec(element, command);
+        event.preventDefault();
+      }
+    });
+
+    // --------- Make sure that when pressing backspace/delete on selected images deletes the image and it's anchor ---------
+    dom.observe(element, "keydown", function(event) {
+      var target  = wysihtml5.selection.getSelectedNode(element.ownerDocument, true),
+          keyCode = event.keyCode,
+          parent;
+      if (target && target.nodeName === "IMG" && (keyCode === wysihtml5.BACKSPACE_KEY || keyCode === wysihtml5.DELETE_KEY)) { // 8 => backspace, 46 => delete
+        parent = target.parentNode;
+        // delete the <img>
+        parent.removeChild(target);
+        // and it's parent <a> too if it hasn't got any other child nodes
+        if (parent.nodeName === "A" && !parent.firstChild) {
+          parent.parentNode.removeChild(parent);
+        }
+
+        setTimeout(function() { wysihtml5.quirks.redraw(element); }, 0);
+        event.preventDefault();
+      }
+    });
+
+    // --------- Show url in tooltip when hovering links or images ---------
+    var titlePrefixes = {
+      IMG: "Image: ",
+      A:   "Link: "
+    };
+    
+    dom.observe(element, "mouseover", function(event) {
+      var target   = event.target,
+          nodeName = target.nodeName,
+          title;
+      if (nodeName !== "A" && nodeName !== "IMG") {
+        return;
+      }
+
+      title = titlePrefixes[nodeName] + (target.getAttribute("href") || target.getAttribute("src"));
+      target.setAttribute("title", title);
+    });
+  };
+})(wysihtml5);/**
+ * Class that takes care that the value of the composer and the textarea is always in sync
+ */
+(function(wysihtml5) {
+  var INTERVAL = 400;
+  
+  wysihtml5.views.Synchronizer = Base.extend(
+    /** @scope wysihtml5.views.Synchronizer.prototype */ {
+
+    constructor: function(editor, textarea, composer) {
+      this.editor   = editor;
+      this.textarea = textarea;
+      this.composer = composer;
+
+      this._observe();
+    },
+
+    /**
+     * Sync html from composer to textarea
+     * Takes care of placeholders
+     * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the textarea
+     */
+    fromComposerToTextarea: function(shouldParseHtml) {
+      this.textarea.setValue(wysihtml5.lang.string(this.composer.getValue()).trim(), shouldParseHtml);
+    },
+
+    /**
+     * Sync value of textarea to composer
+     * Takes care of placeholders
+     * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer
+     */
+    fromTextareaToComposer: function(shouldParseHtml) {
+      var textareaValue = this.textarea.getValue();
+      if (textareaValue) {
+        this.composer.setValue(textareaValue, shouldParseHtml);
+      } else {
+        this.composer.clear();
+        this.editor.fire("set_placeholder");
+      }
+    },
+
+    /**
+     * Invoke syncing based on view state
+     * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer/textarea
+     */
+    sync: function(shouldParseHtml) {
+      if (this.editor.currentView.name === "textarea") {
+        this.fromTextareaToComposer(shouldParseHtml);
+      } else {
+        this.fromComposerToTextarea(shouldParseHtml);
+      }
+    },
+
+    /**
+     * Initializes interval-based syncing
+     * also makes sure that on-submit the composer's content is synced with the textarea
+     * immediately when the form gets submitted
+     */
+    _observe: function() {
+      var interval,
+          that          = this,
+          form          = this.textarea.element.form,
+          startInterval = function() {
+            interval = setInterval(function() { that.fromComposerToTextarea(); }, INTERVAL);
+          },
+          stopInterval  = function() {
+            clearInterval(interval);
+            interval = null;
+          };
+
+      startInterval();
+
+      if (form) {
+        // If the textarea is in a form make sure that after onreset and onsubmit the composer
+        // has the correct state
+        wysihtml5.dom.observe(form, "submit", function() {
+          that.sync(true);
+        });
+        wysihtml5.dom.observe(form, "reset", function() {
+          setTimeout(function() { that.fromTextareaToComposer(); }, 0);
+        });
+      }
+
+      this.editor.observe("change_view", function(view) {
+        if (view === "composer" && !interval) {
+          that.fromTextareaToComposer(true);
+          startInterval();
+        } else if (view === "textarea") {
+          that.fromComposerToTextarea(true);
+          stopInterval();
         }
-        
-        title = titlePrefixes[nodeName] + (target.getAttribute("href") || target.getAttribute("src"));
-        target.setAttribute("title", title);
       });
-    };
-  })()
-});wysihtml5.views.Textarea = Class.create(wysihtml5.views.View,
+
+      this.editor.observe("destroy:composer", stopInterval);
+    }
+  });
+})(wysihtml5);
+wysihtml5.views.Textarea = wysihtml5.views.View.extend(
   /** @scope wysihtml5.views.Textarea.prototype */ {
   name: "textarea",
   
-  initialize: function($super, parent, textareaElement, config) {
-    $super(parent, textareaElement, config);
-    
-    // Store reference to current wysihtml5.Editor instance
-    this.element.store("wysihtml5", parent);
+  constructor: function(parent, textareaElement, config) {
+    this.base(parent, textareaElement, config);
     
     this._observe();
   },
@@ -6751,7 +7284,7 @@ wysihtml5.views.Composer.addMethods({
   },
   
   hasPlaceholderSet: function() {
-    var supportsPlaceholder = wysihtml5.browserSupports.placeholderOn(this.element),
+    var supportsPlaceholder = wysihtml5.browser.supportsPlaceholderAttributeOn(this.element),
         placeholderText     = this.element.getAttribute("placeholder") || null,
         value               = this.element.value,
         isEmpty             = !value;
@@ -6759,7 +7292,7 @@ wysihtml5.views.Composer.addMethods({
   },
   
   isEmpty: function() {
-    return !this.element.value.strip() || this.hasPlaceholderSet();
+    return !wysihtml5.lang.string(this.element.value).trim() || this.hasPlaceholderSet();
   },
   
   _observe: function() {
@@ -6773,15 +7306,15 @@ wysihtml5.views.Composer.addMethods({
          * Calling focus() or blur() on an element doesn't synchronously trigger the attached focus/blur events
          * This is the case for focusin and focusout, so let's use them whenever possible, kkthxbai
          */
-        events = wysihtml5.browserSupports.event("focusin") ? ["focusin", "focusout", "change"] : ["focus", "blur", "change"];
+        events = wysihtml5.browser.supportsEvent("focusin") ? ["focusin", "focusout", "change"] : ["focus", "blur", "change"];
     
     parent.observe("beforeload", function() {
-      wysihtml5.utils.observe(element, events, function(event) {
+      wysihtml5.dom.observe(element, events, function(event) {
         var eventName = eventMapping[event.type] || event.type;
         parent.fire(eventName).fire(eventName + ":textarea");
       });
       
-      wysihtml5.utils.observe(element, ["paste", "drop"], function() {
+      wysihtml5.dom.observe(element, ["paste", "drop"], function() {
         setTimeout(function() { parent.fire("paste").fire("paste:textarea"); }, 0);
       });
     });
@@ -6809,149 +7342,171 @@ wysihtml5.views.Composer.addMethods({
  *
  *    <script>
  *      var dialog = new wysihtml5.toolbar.Dialog(
- *        $$("[data-wysihtml5-command='insertImage']").first(),
- *        $$("[data-wysihtml5-dialog='insertImage']").first()
+ *        document.querySelector("[data-wysihtml5-command='insertImage']"),
+ *        document.querySelector("[data-wysihtml5-dialog='insertImage']")
  *      );
  *      dialog.observe("save", function(attributes) {
  *        // do something
  *      });
  *    </script>
  */
-wysihtml5.toolbar.Dialog = Class.create(
-  /** @scope wysihtml5.toolbar.Dialog.prototype */ {
-  initialize: function(link, container) {
-    this.link       = link;
-    this.container  = container;
-  },
+(function(wysihtml5) {
+  var dom                     = wysihtml5.dom,
+      CLASS_NAME_OPENED       = "wysihtml5-command-dialog-opened",
+      SELECTOR_FORM_ELEMENTS  = "input, select, textarea",
+      SELECTOR_FIELDS         = "[data-wysihtml5-dialog-field]",
+      ATTRIBUTE_FIELDS        = "data-wysihtml5-dialog-field";
+      
   
-  _observe: function() {
-    if (this._observed) {
-      return;
-    }
-    
-    var callbackWrapper = function(event) {
-      var attributes = this._serialize();
-      if (attributes == this.elementToChange) {
-        this.fire("edit", attributes);
-      } else {
-        this.fire("save", attributes);
+  wysihtml5.toolbar.Dialog = wysihtml5.lang.Dispatcher.extend(
+    /** @scope wysihtml5.toolbar.Dialog.prototype */ {
+    constructor: function(link, container) {
+      this.link       = link;
+      this.container  = container;
+    },
+
+    _observe: function() {
+      if (this._observed) {
+        return;
       }
-      this.hide();
-      event.stop();
-    }.bind(this);
-    
-    this.link.on("click", function(event) {
-      if (this.link.hasClassName("wysihtml5-command-dialog-opened")) {
-        setTimeout(this.hide.bind(this), 0);
+      
+      var that = this,
+          callbackWrapper = function(event) {
+            var attributes = that._serialize();
+            if (attributes == that.elementToChange) {
+              that.fire("edit", attributes);
+            } else {
+              that.fire("save", attributes);
+            }
+            that.hide();
+            event.preventDefault();
+            event.stopPropagation();
+          };
+
+      dom.observe(that.link, "click", function(event) {
+        if (dom.hasClass(that.link, CLASS_NAME_OPENED)) {
+          setTimeout(function() { that.hide(); }, 0);
+        }
+      });
+
+      dom.observe(this.container, "keydown", function(event) {
+        var keyCode = event.keyCode;
+        if (keyCode === wysihtml5.ENTER_KEY) {
+          callbackWrapper(event);
+        }
+        if (keyCode === wysihtml5.ESCAPE_KEY) {
+          that.hide();
+        }
+      });
+
+      dom.delegate(this.container, "[data-wysihtml5-dialog-action=save]", "click", callbackWrapper);
+
+      dom.delegate(this.container, "[data-wysihtml5-dialog-action=cancel]", "click", function(event) {
+        that.fire("cancel");
+        that.hide();
+        event.preventDefault();
+        event.stopPropagation();
+      });
+
+      var formElements  = this.container.querySelectorAll(SELECTOR_FORM_ELEMENTS),
+          i             = 0,
+          length        = formElements.length,
+          _clearInterval = function() { clearInterval(that.interval); };
+      for (; i<length; i++) {
+        dom.observe(formElements[i], "change", _clearInterval);
       }
-    }.bind(this));
-    
-    this.container.on("keydown", function(event) {
-      if (event.keyCode === Event.KEY_RETURN) {
-        callbackWrapper(event);
+
+      this._observed = true;
+    },
+
+    /**
+     * Grabs all fields in the dialog and puts them in key=>value style in an object which
+     * then gets returned
+     */
+    _serialize: function() {
+      var data    = this.elementToChange || {},
+          fields  = this.container.querySelectorAll(SELECTOR_FIELDS),
+          length  = fields.length,
+          i       = 0;
+      for (; i<length; i++) {
+        data[fields[i].getAttribute(ATTRIBUTE_FIELDS)] = fields[i].value;
       }
-      if (event.keyCode === Event.KEY_ESC) {
-        this.hide();
+      return data;
+    },
+
+    /**
+     * Takes the attributes of the "elementToChange"
+     * and inserts them in their corresponding dialog input fields
+     * 
+     * Assume the "elementToChange" looks like this:
+     *    <a href="http://www.google.com" target="_blank">foo</a>
+     *
+     * and we have the following dialog:
+     *    <input type="text" data-wysihtml5-dialog-field="href" value="">
+     *    <input type="text" data-wysihtml5-dialog-field="target" value="">
+     * 
+     * after calling _interpolate() the dialog will look like this
+     *    <input type="text" data-wysihtml5-dialog-field="href" value="http://www.google.com">
+     *    <input type="text" data-wysihtml5-dialog-field="target" value="_blank">
+     *
+     * Basically it adopted the attribute values into the corresponding input fields
+     *
+     */
+    _interpolate: function() {
+      var field,
+          fieldName,
+          newValue,
+          focusedElement = document.querySelector(":focus"),
+          fields         = this.container.querySelectorAll(SELECTOR_FIELDS),
+          length         = fields.length,
+          i              = 0;
+      for (; i<length; i++) {
+        field = fields[i];
+        // Never change elements where the user is currently typing in
+        if (field === focusedElement) {
+          continue;
+        }
+        fieldName = field.getAttribute(ATTRIBUTE_FIELDS);
+        newValue  = this.elementToChange ? (this.elementToChange[fieldName] || "") : field.defaultValue;
+        field.value = newValue;
       }
-    }.bind(this));
-    
-    this.container.on("click", "[data-wysihtml5-dialog-action=save]", callbackWrapper);
-    this.container.on("click", "[data-wysihtml5-dialog-action=cancel]", function(event) {
-      this.fire("cancel");
-      this.hide();
-      event.stop();
-    }.bind(this));
-    
-    this.container.select("input, select, textarea").invoke("on", "change", function() {
-      clearInterval(this.interval);
-    }.bind(this));
-    
-    this._observed = true;
-  },
-  
-  /**
-   * Grabs all fields in the dialog and puts them in key=>value style in an object which
-   * then gets returned
-   */
-  _serialize: function() {
-    var data = this.elementToChange || {};
-    this.container.select("[data-wysihtml5-dialog-field]").each(function(field) {
-      data[field.getAttribute("data-wysihtml5-dialog-field")] = field.getValue();
-    });
-    return data;
-  },
-  
-  /**
-   * Takes the attributes of the "elementToChange"
-   * and inserts them in their corresponding dialog input fields
-   * 
-   * Assume the "elementToChange" looks like this:
-   *    <a href="http://www.google.com" target="_blank">foo</a>
-   *
-   * and we have the following dialog:
-   *    <input type="text" data-wysihtml5-dialog-field="href" value="">
-   *    <input type="text" data-wysihtml5-dialog-field="target" value="">
-   * 
-   * after calling _interpolate() the dialog will look like this
-   *    <input type="text" data-wysihtml5-dialog-field="href" value="http://www.google.com">
-   *    <input type="text" data-wysihtml5-dialog-field="target" value="_blank">
-   *
-   * Basically it adopted the attribute values into the corresponding input fields
-   *
-   */
-  _interpolate: function() {
-    var focusedElement = document.querySelector(":focus");
-    this.container.select("[data-wysihtml5-dialog-field]").each(function(field) {
-      // Never change elements where the user is currently typing
-      if (field === focusedElement) {
-        return;
+    },
+
+    /**
+     * Show the dialog element
+     */
+    show: function(elementToChange) {
+      var that        = this,
+          firstField  = this.container.querySelector(SELECTOR_FORM_ELEMENTS);
+      this.elementToChange = elementToChange;
+      this._observe();
+      this._interpolate();
+      if (elementToChange) {
+        this.interval = setInterval(function() { that._interpolate(); }, 500);
       }
-      var fieldName = field.getAttribute("data-wysihtml5-dialog-field"),
-          newValue  = this.elementToChange ? (this.elementToChange[fieldName] || "") : field.defaultValue;
-      field.setValue(newValue);
-    }.bind(this));
-  },
-  
-  observe: function(eventName, handler) {
-    this.container.on("dialog:" + eventName, function(event) { handler(event.memo); });
-  },
-  
-  fire: function(eventName, data) {
-    this.container.fire("dialog:" + eventName, data);
-  },
-  
-  /**
-   * Show the dialog element
-   */
-  show: function(elementToChange) {
-    this.elementToChange = elementToChange;
-    this._observe();
-    this._interpolate();
-    if (elementToChange) {
-      this.interval = setInterval(this._interpolate.bind(this), 500);
-    }
-    this.link.addClassName("wysihtml5-command-dialog-opened");
-    this.container.show();
-    this.fire("show");
-    var firstField = this.container.down("input, select, textarea");
-    if (firstField && !elementToChange) {
-      try {
-        firstField.focus();
-      } catch(e) {}
+      dom.addClass(this.link, CLASS_NAME_OPENED);
+      this.container.style.display = "";
+      this.fire("show");
+      if (firstField && !elementToChange) {
+        try {
+          firstField.focus();
+        } catch(e) {}
+      }
+    },
+
+    /**
+     * Hide the dialog element
+     */
+    hide: function() {
+      clearInterval(this.interval);
+      this.elementToChange = null;
+      dom.removeClass(this.link, CLASS_NAME_OPENED);
+      this.container.style.display = "none";
+      this.fire("hide");
     }
-  },
-  
-  /**
-   * Hide the dialog element
-   */
-  hide: function() {
-    clearInterval(this.interval);
-    this.elementToChange = null;
-    this.link.removeClassName("wysihtml5-command-dialog-opened");
-    this.container.hide();
-    this.fire("hide");
-  }
-});/**
+  });
+})(wysihtml5);
+/**
  * Converts speech-to-text and inserts this into the editor
  * As of now (2011/03/25) this only is supported in Chrome >= 11
  *
@@ -6966,12 +7521,25 @@ wysihtml5.toolbar.Dialog = Class.create(
  *
  * @author Christopher Blum <christopher.blum@xing.com>
  */
-wysihtml5.toolbar.Speech = (function() {
-  var linkStyle = {
+(function(wysihtml5) {
+  var dom = wysihtml5.dom;
+  
+  var linkStyles = {
     position: "relative"
   };
   
-  var inputStyle = {
+  var wrapperStyles = {
+    left:     0,
+    margin:   0,
+    opacity:  0,
+    overflow: "hidden",
+    padding:  0,
+    position: "absolute",
+    top:      0,
+    zIndex:   1
+  };
+  
+  var inputStyles = {
     cursor:     "inherit",
     fontSize:   "50px",
     height:     "50px",
@@ -6983,55 +7551,49 @@ wysihtml5.toolbar.Speech = (function() {
     top:        "50%"
   };
   
-  var wrapperStyle = {
-    left:     0,
-    margin:   0,
-    opacity:  0,
-    overflow: "hidden",
-    padding:  0,
-    position: "absolute",
-    top:      0,
-    zIndex:   1
-  };
-  
-  var supportsSpeechInput = function(input) {
-    var chromeVersion = navigator.userAgent.match(/Chrome\/(\d+)/) || [, 0];
-    return chromeVersion[1] >= 11 && ("onwebkitspeechchange" in input || "speech" in input);
+  var inputAttributes = {
+    "x-webkit-speech": "",
+    "speech":          ""
   };
   
-  return function(parent, link) {
-    var input = new Element("input");
-    if (!supportsSpeechInput(input)) {
-      link.hide();
+  wysihtml5.toolbar.Speech = function(parent, link) {
+    var input = document.createElement("input");
+    if (!wysihtml5.browser.supportsSpeechApiOn(input)) {
+      link.style.display = "none";
       return;
     }
     
-    var wrapper = new Element("div");
+    var wrapper = document.createElement("div");
     
-    Object.extend(wrapperStyle, {
-      width:  link.getWidth()  + "px",
-      height: link.getHeight() + "px"
+    wysihtml5.lang.object(wrapperStyles).merge({
+      width:  link.offsetWidth  + "px",
+      height: link.offsetHeight + "px"
     });
     
-    input.setStyle(inputStyle).writeAttribute({ "x-webkit-speech": "", "speech": "" });
-    wrapper.setStyle(wrapperStyle).insert(input);
-    link.setStyle(linkStyle).insert(wrapper);
+    dom.insert(input).into(wrapper);
+    dom.insert(wrapper).into(link);
+    
+    dom.setStyles(inputStyles).on(input);
+    dom.setAttributes(inputAttributes).on(input)
+    
+    dom.setStyles(wrapperStyles).on(wrapper);
+    dom.setStyles(linkStyles).on(link);
     
     var eventName = "onwebkitspeechchange" in input ? "webkitspeechchange" : "speechchange";
-    input.on(eventName, function() {
+    dom.observe(input, eventName, function() {
       parent.execCommand("insertText", input.value);
       input.value = "";
     });
     
-    wrapper.on("click", function(event) {
-      if (link.hasClassName("wysihtml5-command-disabled")) {
+    dom.observe(input, "click", function(event) {
+      if (dom.hasClass(link, "wysihtml5-command-disabled")) {
         event.preventDefault();
       }
       
       event.stopPropagation();
     });
   };
-})();/**
+})(wysihtml5);/**
  * Toolbar
  *
  * @author Christopher Blum <christopher.blum@xing.com>
@@ -7045,229 +7607,255 @@ wysihtml5.toolbar.Speech = (function() {
  *    </div>
  *
  *    <script>
- *      var toolbar = new wysihtml5.toolbar.Toolbar(editor, $("toolbar"));
+ *      var toolbar = new wysihtml5.toolbar.Toolbar(editor, document.getElementById("toolbar"));
  *    </script>
  */
-wysihtml5.toolbar.Toolbar = Class.create(
-  /** @scope wysihtml5.toolbar.Toolbar.prototype */ {
-  initialize: function(parent, container) {
-    this.parent     = parent;
-    this.container  = $(container);
-    this.composer   = parent.composer;
-    
-    this._getLinks("command");
-    this._getLinks("action");
-    
-    this._observe();
-    this.show();
-    
-    this.container.select("[data-wysihtml5-command=insertSpeech]").each(function(link) {
-      new wysihtml5.toolbar.Speech(this, link);
-    }.bind(this));
-  },
-  
-  _getLinks: function(type) {
-    var links   = this[type + "Links"] = this.container.select("a[data-wysihtml5-" + type + "]"),
-        mapping = this[type + "Mapping"] = {};
-    links.each(function(link) {
-      var name    = link.getAttribute("data-wysihtml5-" + type),
-          value   = link.getAttribute("data-wysihtml5-" + type + "-value"),
-          dialog  = this._getDialog(link, name);
+(function(wysihtml5) {
+  var CLASS_NAME_COMMAND_DISABLED   = "wysihtml5-command-disabled",
+      CLASS_NAME_COMMANDS_DISABLED  = "wysihtml5-commands-disabled",
+      CLASS_NAME_COMMAND_ACTIVE     = "wysihtml5-command-active",
+      dom                           = wysihtml5.dom;
+  
+  wysihtml5.toolbar.Toolbar = Base.extend(
+    /** @scope wysihtml5.toolbar.Toolbar.prototype */ {
+    constructor: function(editor, container) {
+      this.editor     = editor;
+      this.container  = typeof(container) === "string" ? document.getElementById(container) : container;
+      this.composer   = editor.composer;
+
+      this._getLinks("command");
+      this._getLinks("action");
+
+      this._observe();
+      this.show();
       
-      mapping[name + ":" + value] = {
-        link:   link,
-        name:   name,
-        value:  value,
-        dialog: dialog,
-        state:  false
-      };
-    }, this);
-  },
-  
-  _getDialog: function(link, command) {
-    var dialogElement = this.container.down("[data-wysihtml5-dialog='" + command + "']"),
-        sandboxDoc    = this.composer.sandbox.getDocument(),
-        dialog,
-        caretBookmark;
-    if (dialogElement) {
-      dialog = new wysihtml5.toolbar.Dialog(link, dialogElement);
-      
-      dialog.observe("show", function() {
-        caretBookmark = wysihtml5.utils.caret.getBookmark(sandboxDoc);
-      });
-      
-      dialog.observe("save", function(attributes) {
-        this.parent.focus(false);
+      var speechInputLinks  = this.container.querySelectorAll("[data-wysihtml5-command=insertSpeech]"),
+          length            = speechInputLinks.length,
+          i                 = 0;
+      for (; i<length; i++) {
+        new wysihtml5.toolbar.Speech(this, speechInputLinks[i]);
+      }
+    },
+
+    _getLinks: function(type) {
+      var links   = this[type + "Links"] = wysihtml5.lang.array(this.container.querySelectorAll("a[data-wysihtml5-" + type + "]")).get(),
+          length  = links.length,
+          i       = 0,
+          mapping = this[type + "Mapping"] = {},
+          link,
+          name,
+          value,
+          dialog;
+      for (; i<length; i++) {
+        link    = links[i];
+        name    = link.getAttribute("data-wysihtml5-" + type);
+        value   = link.getAttribute("data-wysihtml5-" + type + "-value");
+        dialog  = this._getDialog(link, name);
         
-        if (caretBookmark) {
-          wysihtml5.utils.caret.setBookmark(caretBookmark);
-        }
-        this._execCommand(command, attributes);
-      }.bind(this));
-      
-      dialog.observe("cancel", function() {
-        this.parent.focus(false);
-      }.bind(this));
-    }
-    return dialog;
-  },
-  
-  /**
-   * @example
-   *    var toolbar = new wysihtml5.Toolbar();
-   *    // Insert a <blockquote> element or wrap current selection in <blockquote>
-   *    toolbar.execCommand("formatBlock", "blockquote");
-   */
-  execCommand: function(command, commandValue) {
-    if (this.commandsDisabled) {
-      return;
-    }
-    
-    var commandObj = this.commandMapping[command + ":" + commandValue];
-    
-    // Show dialog when available
-    if (commandObj && commandObj.dialog && !commandObj.state) {
-      commandObj.dialog.show();
-    } else {
-      this._execCommand(command, commandValue);
-    }
-  },
-  
-  _execCommand: function(command, commandValue) {
-    // Make sure that composer is focussed (false => don't move caret to the end)
-    this.parent.focus(false);
-    
-    wysihtml5.commands.exec(this.composer.element, command, commandValue);
-    this._updateLinkStates();
-  },
-  
-  execAction: function(action) {
-    switch(action) {
-      case "change_view":
-        if (this.parent.currentView === this.parent.textarea) {
-          this.parent.fire("change_view", "composer");
-        } else {
-          this.parent.fire("change_view", "textarea");
-        }
-        break;
-    }
-  },
-  
-  _observe: function() {
-    // 'javascript:;' and unselectable=on Needed for IE, but done in all browsers to make sure that all get the same css applied
-    // (you know, a:link { ... } doesn't match anchors with missing href attribute)
-    var links = [this.commandLinks, this.actionLinks].flatten();
-    links.invoke("setAttribute", "href", "javascript:;");
-    links.invoke("setAttribute", "unselectable", "on");
-    
-    // Needed for opera
-    this.container.on("mousedown", "[data-wysihtml5-command]", function(event) { event.preventDefault(); });
-    
-    this.container.on("click", "[data-wysihtml5-command]", function(event) {
-      var link          = event.target,
-          command       = link.getAttribute("data-wysihtml5-command"),
-          commandValue  = link.getAttribute("data-wysihtml5-command-value");
-      this.execCommand(command, commandValue);
-      event.preventDefault();
-    }.bind(this));
-    
-    this.container.on("click", "[data-wysihtml5-action]", function(event) {
-      var action = event.target.getAttribute("data-wysihtml5-action");
-      this.execAction(action);
-      event.preventDefault();
-    }.bind(this));
-    
-    this.parent.observe("focus:composer", function() {
-      this.bookmark = null;
-      clearInterval(this.interval);
-      this.interval = setInterval(this._updateLinkStates.bind(this), 500);
-    }.bind(this));
-    
-    this.parent.observe("blur:composer", function() {
-      clearInterval(this.interval);
-    }.bind(this));
-    
-    this.parent.observe("destroy:composer", function() {
-      clearInterval(this.interval);
-    }.bind(this));
-    
-    this.parent.observe("change_view", function(event) {
-      var currentView       = event.memo,
-          disabledClassName = "wysihtml5-commands-disabled";
-      // Set timeout needed in order to let the blur event fire first
-      setTimeout(function() {
-        this.commandsDisabled = (currentView !== "composer");
-        this._updateLinkStates();
-        if (this.commandsDisabled) {
-          this.container.addClassName(disabledClassName);
-        } else {
-          this.container.removeClassName(disabledClassName);
-        }
-      }.bind(this), 0);
-    }.bind(this));
-  },
-  
-  _updateLinkStates: function() {
-    var activeClassName   = "wysihtml5-command-active",
-        disabledClassName = "wysihtml5-command-disabled",
-        element           = this.composer.element,
-        commandMapping    = this.commandMapping,
-        i,
-        state,
-        command;
-    // every millisecond counts... this is executed quite often
-    // no library .each(), just a native speedy-gonzales "for"-loop
-    for (i in commandMapping) {
-      command = commandMapping[i];
+        mapping[name + ":" + value] = {
+          link:   link,
+          name:   name,
+          value:  value,
+          dialog: dialog,
+          state:  false
+        };
+      }
+    },
+
+    _getDialog: function(link, command) {
+      var that          = this,
+          dialogElement = this.container.querySelector("[data-wysihtml5-dialog='" + command + "']"),
+          sandboxDoc    = this.composer.sandbox.getDocument(),
+          dialog,
+          caretBookmark;
+      if (dialogElement) {
+        dialog = new wysihtml5.toolbar.Dialog(link, dialogElement);
+
+        dialog.observe("show", function() {
+          caretBookmark = wysihtml5.selection.getBookmark(sandboxDoc);
+        });
+
+        dialog.observe("save", function(attributes) {
+          that.editor.focus(false);
+
+          if (caretBookmark) {
+            wysihtml5.selection.setBookmark(caretBookmark);
+          }
+          that._execCommand(command, attributes);
+        });
+
+        dialog.observe("cancel", function() {
+          that.editor.focus(false);
+        });
+      }
+      return dialog;
+    },
+
+    /**
+     * @example
+     *    var toolbar = new wysihtml5.Toolbar();
+     *    // Insert a <blockquote> element or wrap current selection in <blockquote>
+     *    toolbar.execCommand("formatBlock", "blockquote");
+     */
+    execCommand: function(command, commandValue) {
       if (this.commandsDisabled) {
-        state = false;
-        command.link.addClassName(disabledClassName);
-        if (command.dialog) {
-          command.dialog.hide();
-        }
+        return;
+      }
+
+      var commandObj = this.commandMapping[command + ":" + commandValue];
+
+      // Show dialog when available
+      if (commandObj && commandObj.dialog && !commandObj.state) {
+        commandObj.dialog.show();
       } else {
-        state = wysihtml5.commands.state(element, command.name, command.value);
-        if (Object.isArray(state)) {
-          // Grab first and only object/element in state array, otherwise convert state into boolean
-          // to avoid showing a dialog for multiple selected elements which may have different attributes
-          // eg. when two links with different href are selected, the state will be an array consisting of both link elements
-          // but the dialog interface can only update one
-          state = state.length === 1 ? state[0] : true;
-        }
-        command.link.removeClassName(disabledClassName);
+        this._execCommand(command, commandValue);
+      }
+    },
+
+    _execCommand: function(command, commandValue) {
+      // Make sure that composer is focussed (false => don't move caret to the end)
+      this.editor.focus(false);
+
+      wysihtml5.commands.exec(this.composer.element, command, commandValue);
+      this._updateLinkStates();
+    },
+
+    execAction: function(action) {
+      var editor = this.editor;
+      switch(action) {
+        case "change_view":
+          if (editor.currentView === editor.textarea) {
+            editor.fire("change_view", "composer");
+          } else {
+            editor.fire("change_view", "textarea");
+          }
+          break;
       }
+    },
+
+    _observe: function() {
+      var that      = this,
+          editor    = this.editor,
+          container = this.container,
+          links     = this.commandLinks.concat(this.actionLinks),
+          length    = links.length,
+          i         = 0;
       
-      if (command.state === state) {
-        continue;
+      for (; i<length; i++) {
+        // 'javascript:;' and unselectable=on Needed for IE, but done in all browsers to make sure that all get the same css applied
+        // (you know, a:link { ... } doesn't match anchors with missing href attribute)
+        dom.setAttributes({
+          href:         "javascript:;",
+          unselectable: "on"
+        }).on(links[i]);
       }
+
+      // Needed for opera
+      dom.delegate(container, "[data-wysihtml5-command]", "mousedown", function(event) { event.preventDefault(); });
       
-      command.state = state;
-      if (state) {
-        command.link.addClassName(activeClassName);
-        if (command.dialog) {
-          if (typeof(state) === "object") {
-            command.dialog.show(state);
+      dom.delegate(container, "[data-wysihtml5-command]", "click", function(event) {
+        var link          = event.target,
+            command       = link.getAttribute("data-wysihtml5-command"),
+            commandValue  = link.getAttribute("data-wysihtml5-command-value");
+        that.execCommand(command, commandValue);
+        event.preventDefault();
+      });
+
+      dom.delegate(container, "[data-wysihtml5-action]", "click", function(event) {
+        var action = event.target.getAttribute("data-wysihtml5-action");
+        that.execAction(action);
+        event.preventDefault();
+      });
+
+      editor.observe("focus:composer", function() {
+        that.bookmark = null;
+        clearInterval(that.interval);
+        that.interval = setInterval(function() { that._updateLinkStates(); }, 500);
+      });
+
+      editor.observe("blur:composer", function() {
+        clearInterval(that.interval);
+      });
+
+      editor.observe("destroy:composer", function() {
+        clearInterval(that.interval);
+      });
+
+      editor.observe("change_view", function(currentView) {
+        // Set timeout needed in order to let the blur event fire first
+        setTimeout(function() {
+          that.commandsDisabled = (currentView !== "composer");
+          that._updateLinkStates();
+          if (that.commandsDisabled) {
+            dom.addClass(container, CLASS_NAME_COMMANDS_DISABLED);
           } else {
+            dom.removeClass(container, CLASS_NAME_COMMANDS_DISABLED);
+          }
+        }, 0);
+      });
+    },
+
+    _updateLinkStates: function() {
+      var element           = this.composer.element,
+          commandMapping    = this.commandMapping,
+          i,
+          state,
+          command;
+      // every millisecond counts... this is executed quite often
+      for (i in commandMapping) {
+        command = commandMapping[i];
+        if (this.commandsDisabled) {
+          state = false;
+          dom.removeClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
+          if (command.dialog) {
+            command.dialog.hide();
+          }
+        } else {
+          state = wysihtml5.commands.state(element, command.name, command.value);
+          if (wysihtml5.lang.object(state).isArray()) {
+            // Grab first and only object/element in state array, otherwise convert state into boolean
+            // to avoid showing a dialog for multiple selected elements which may have different attributes
+            // eg. when two links with different href are selected, the state will be an array consisting of both link elements
+            // but the dialog interface can only update one
+            state = state.length === 1 ? state[0] : true;
+          }
+          dom.removeClass(command.link, CLASS_NAME_COMMAND_DISABLED);
+        }
+
+        if (command.state === state) {
+          continue;
+        }
+
+        command.state = state;
+        if (state) {
+          dom.addClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
+          if (command.dialog) {
+            if (typeof(state) === "object") {
+              command.dialog.show(state);
+            } else {
+              command.dialog.hide();
+            }
+          }
+        } else {
+          dom.removeClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
+          if (command.dialog) {
             command.dialog.hide();
           }
         }
-      } else {
-        command.link.removeClassName(activeClassName);
-        if (command.dialog) {
-          command.dialog.hide();
-        }
       }
+    },
+
+    show: function() {
+      this.container.style.display = "";
+    },
+
+    hide: function() {
+      this.container.style.display = "none";
     }
-  },
-  
-  show: function() {
-    this.container.show();
-  },
+  });
   
-  hide: function() {
-    this.container.hide();
-  }
-});/**
+})(wysihtml5);
+/**
  * Rich Text Query/Formatting Commands
  * 
  * @author Christopher Blum <christopher.blum@xing.com>
@@ -7282,7 +7870,7 @@ wysihtml5.commands = {
    *    wysihtml5.commands.supports(element, "createLink");
    */
   support: function(element, command) {
-    return wysihtml5.browserSupports.command(element.ownerDocument, command);
+    return wysihtml5.browser.supportsCommand(element.ownerDocument, command);
   },
   
   /**
@@ -7298,7 +7886,7 @@ wysihtml5.commands = {
     var obj     = this[command],
         method  = obj && obj.exec;
     if (method) {
-      return method(element, command, value);
+      return method.call(obj, element, command, value);
     } else {
       try {
         // try/catch for buggy firefox
@@ -7322,8 +7910,7 @@ wysihtml5.commands = {
     var obj     = this[command],
         method  = obj && obj.state;
     if (method) {
-      // TODO: Consider to pass the selectedNode as element instead of the contentEditable
-      return method(element, command, commandValue);
+      return method.call(obj, element, command, commandValue);
     } else {
       try {
         // try/catch for buggy firefox
@@ -7357,34 +7944,33 @@ wysihtml5.commands = {
       }
     }
   }
-};wysihtml5.commands.bold = (function() {
+};(function(wysihtml5) {
   var undef;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatInline.exec(element, command, "b");
-  }
-  
-  function state(element, command, color) {
-    // element.ownerDocument.queryCommandState("bold") results:
-    // firefox: only <b>
-    // chrome:  <b>, <strong>, <h1>, <h2>, ...
-    // ie:      <b>, <strong>
-    // opera:   <b>, <strong>
-    return wysihtml5.commands.formatInline.state(element, command, "b");
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.bold = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatInline.exec(element, command, "b");
+    },
+
+    state: function(element, command, color) {
+      // element.ownerDocument.queryCommandState("bold") results:
+      // firefox: only <b>
+      // chrome:  <b>, <strong>, <h1>, <h2>, ...
+      // ie:      <b>, <strong>
+      // opera:   <b>, <strong>
+      return wysihtml5.commands.formatInline.state(element, command, "b");
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();wysihtml5.commands.createLink = (function() {
+})(wysihtml5);
+
+(function(wysihtml5) {
   var undef,
-      NODE_NAME = "A";
+      NODE_NAME = "A",
+      dom       = wysihtml5.dom;
   
   function _removeFormat(element, anchors) {
     var length = anchors.length,
@@ -7394,20 +7980,20 @@ wysihtml5.commands = {
         textContent;
     for (; i<length; i++) {
       anchor      = anchors[i];
-      codeElement = wysihtml5.utils.getParentElement(anchor, { nodeName: "code" });
-      textContent = wysihtml5.utils.getTextContent(anchor);
-      
+      codeElement = dom.getParentElement(anchor, { nodeName: "code" });
+      textContent = dom.getTextContent(anchor);
+
       // if <a> contains url-like text content, rename it to <code> to prevent re-autolinking
       // else replace <a> with its childNodes
-      if (textContent.match(wysihtml5.utils.autoLink.URL_REG_EXP) && !codeElement) {
+      if (textContent.match(dom.autoLink.URL_REG_EXP) && !codeElement) {
         // <code> element is used to prevent later auto-linking of the content
-        codeElement = wysihtml5.utils.renameElement(anchor, "code");
+        codeElement = dom.renameElement(anchor, "code");
       } else {
-        wysihtml5.utils.unwrap(anchor);
+        dom.replaceWithChildNodes(anchor);
       }
     }
   }
-  
+
   function _format(element, attributes) {
     var doc             = element.ownerDocument,
         tempClass       = "_wysihtml5-temp-" + new Date().getTime(),
@@ -7432,120 +8018,110 @@ wysihtml5.commands = {
         anchor.setAttribute(j, attributes[j]);
       }
     }
-    
+
     elementToSetCaretAfter = anchor;
     if (length === 1) {
-      textContent = wysihtml5.utils.getTextContent(anchor);
+      textContent = dom.getTextContent(anchor);
       hasElementChild = !!anchor.querySelector("*");
-      isEmpty = textContent === "" || textContent === "\uFEFF";
+      isEmpty = textContent === "" || textContent === wysihtml5.INVISIBLE_SPACE;
       if (!hasElementChild && isEmpty) {
-        wysihtml5.utils.setTextContent(anchor, anchor.href);
+        dom.setTextContent(anchor, anchor.href);
         whiteSpace = doc.createTextNode(" ");
-        wysihtml5.utils.caret.setAfter(anchor);
-        wysihtml5.utils.caret.insertNode(whiteSpace);
+        wysihtml5.selection.setAfter(anchor);
+        wysihtml5.selection.insertNode(whiteSpace);
         elementToSetCaretAfter = whiteSpace;
       }
     }
-    wysihtml5.utils.caret.setAfter(elementToSetCaretAfter);
+    wysihtml5.selection.setAfter(elementToSetCaretAfter);
   }
   
-  /**
-   * TODO: Use cssapplier or formatInline here
-   *
-   * Turns selection into a link
-   * If selection is already a link, it removes the link and wraps it with a <code> element
-   * The <code> element is needed to avoid auto linking
-   * 
-   * @example
-   *    // either ...
-   *    wysihtml5.commands.createLink.exec(element, "createLink", "http://www.google.de");
-   *    // ... or ...
-   *    wysihtml5.commands.createLink.exec(element, "createLink", { href: "http://www.google.de", target: "_blank" });
-   */
-  function exec(element, command, value) {
-    var doc           = element.ownerDocument,
-        anchors       = state(element, command);
-    
-    if (anchors) {
-      // Selection contains links
-      wysihtml5.utils.caret.executeAndRestore(doc, function() {
-        _removeFormat(element, anchors);
-      });
-    } else {
-      // Create links
-      value = typeof(value) === "object" ? value : { href: value };
-      _format(element, value);
+  wysihtml5.commands.createLink = {
+    /**
+     * TODO: Use HTMLApplier or formatInline here
+     *
+     * Turns selection into a link
+     * If selection is already a link, it removes the link and wraps it with a <code> element
+     * The <code> element is needed to avoid auto linking
+     * 
+     * @example
+     *    // either ...
+     *    wysihtml5.commands.createLink.exec(element, "createLink", "http://www.google.de");
+     *    // ... or ...
+     *    wysihtml5.commands.createLink.exec(element, "createLink", { href: "http://www.google.de", target: "_blank" });
+     */
+    exec: function(element, command, value) {
+      var doc           = element.ownerDocument,
+          anchors       = this.state(element, command);
+
+      if (anchors) {
+        // Selection contains links
+        wysihtml5.selection.executeAndRestore(doc, function() {
+          _removeFormat(element, anchors);
+        });
+      } else {
+        // Create links
+        value = typeof(value) === "object" ? value : { href: value };
+        _format(element, value);
+      }
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatInline.state(element, command, "A");
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatInline.state(element, command, "A");
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();/**
- * execCommand("fontSize") will create either inline styles (firefox, chrome) or use font tags
+})(wysihtml5);/**
+ * document.execCommand("fontSize") will create either inline styles (firefox, chrome) or use font tags
  * which we don't want
  * Instead we set a css class
  */
-wysihtml5.commands.fontSize = (function() {
+(function(wysihtml5) {
   var undef,
       REG_EXP = /wysiwyg-font-size-[a-z]+/g;
   
-  function exec(element, command, size) {
-    return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
-  }
-  
-  function state(element, command, size) {
-    return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.fontSize = {
+    exec: function(element, command, size) {
+      return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
+    },
+
+    state: function(element, command, size) {
+      return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();/**
- * execCommand("foreColor") will create either inline styles (firefox, chrome) or use font tags
+})(wysihtml5);
+/**
+ * document.execCommand("foreColor") will create either inline styles (firefox, chrome) or use font tags
  * which we don't want
  * Instead we set a css class
  */
-wysihtml5.commands.foreColor = (function() {
+(function(wysihtml5) {
   var undef,
       REG_EXP = /wysiwyg-color-[a-z]+/g;
   
-  function exec(element, command, color) {
-    return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
-  }
-  
-  function state(element, command, color) {
-    return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
-  }
-  
-  function value() {
-    // TODO
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.foreColor = {
+    exec: function(element, command, color) {
+      return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
+    },
+
+    state: function(element, command, color) {
+      return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();wysihtml5.commands.formatBlock = (function() {
+})(wysihtml5);(function(wysihtml5) {
   var undef,
+      dom                     = wysihtml5.dom,
+      selection               = wysihtml5.selection,
       DEFAULT_NODE_NAME       = "DIV",
       // Following elements are grouped
       // when the caret is within a H1 and the H4 is invoked, the H1 should turn into H4
@@ -7564,18 +8140,18 @@ wysihtml5.commands.foreColor = (function() {
       element.className = className;
     }
   }
-  
+
   function _removeClass(element, classRegExp) {
     element.className = element.className.replace(classRegExp, "");
   }
-  
+
   /**
    * Check whether given node is a text node and whether it's empty
    */
   function _isBlankTextNode(node) {
-    return node.nodeType === Node.TEXT_NODE && String(node.data).blank();
+    return node.nodeType === wysihtml5.TEXT_NODE && !wysihtml5.lang.string(node.data).trim();
   }
-  
+
   /**
    * Returns previous sibling node that is not a blank text node
    */
@@ -7586,7 +8162,7 @@ wysihtml5.commands.foreColor = (function() {
     }
     return previousSibling;
   }
-  
+
   /**
    * Returns next sibling node that is not a blank text node
    */
@@ -7597,7 +8173,7 @@ wysihtml5.commands.foreColor = (function() {
     }
     return nextSibling;
   }
-  
+
   /**
    * Adds line breaks before and after the given node if the previous and next siblings
    * aren't already causing a visual line break (block element or <br>)
@@ -7606,7 +8182,7 @@ wysihtml5.commands.foreColor = (function() {
     var doc             = node.ownerDocument,
         nextSibling     = _getNextSiblingThatIsNotBlank(node),
         previousSibling = _getPreviousSiblingThatIsNotBlank(node);
-    
+
     if (nextSibling && !_isLineBreakOrBlockElement(nextSibling)) {
       node.parentNode.insertBefore(doc.createElement("br"), nextSibling);
     }
@@ -7614,14 +8190,14 @@ wysihtml5.commands.foreColor = (function() {
       node.parentNode.insertBefore(doc.createElement("br"), node);
     }
   }
-  
+
   /**
    * Removes line breaks before and after the given node
    */
   function _removeLineBreakBeforeAndAfter(node) {
     var nextSibling     = _getNextSiblingThatIsNotBlank(node),
         previousSibling = _getPreviousSiblingThatIsNotBlank(node);
-    
+
     if (nextSibling && _isLineBreak(nextSibling)) {
       nextSibling.parentNode.removeChild(nextSibling);
     }
@@ -7629,18 +8205,18 @@ wysihtml5.commands.foreColor = (function() {
       previousSibling.parentNode.removeChild(previousSibling);
     }
   }
-  
+
   function _removeLastChildIfLineBreak(node) {
     var lastChild = node.lastChild;
     if (lastChild && _isLineBreak(lastChild)) {
       lastChild.parentNode.removeChild(lastChild);
     }
   }
-  
+
   function _isLineBreak(node) {
     return node.nodeName === "BR";
   }
-  
+
   /**
    * Checks whether the elment causes a visual line break
    * (<br> or block elements)
@@ -7649,27 +8225,27 @@ wysihtml5.commands.foreColor = (function() {
     if (_isLineBreak(element)) {
       return true;
     }
-    
-    if (wysihtml5.utils.getStyle(element, "display") === "block") {
+
+    if (dom.getStyle("display").from(element) === "block") {
       return true;
     }
-    
+
     return false;
   }
-  
+
   /**
    * Execute native query command
    * and if necessary modify the inserted node's className
    */
   function _execCommand(doc, command, nodeName, className) {
     if (className) {
-      var eventListener = wysihtml5.utils.observe(doc, "DOMNodeInserted", function(event) {
+      var eventListener = dom.observe(doc, "DOMNodeInserted", function(event) {
         var target = event.target,
             displayStyle;
-        if (target.nodeType !== Node.ELEMENT_NODE) {
+        if (target.nodeType !== wysihtml5.ELEMENT_NODE) {
           return;
         }
-        displayStyle  = wysihtml5.utils.getStyle(target, "display");
+        displayStyle  = dom.getStyle("display").from(target);
         if (displayStyle.substr(0, 6) !== "inline") {
           // Make sure that only block elements receive the given class
           target.className += " " + className;
@@ -7681,100 +8257,94 @@ wysihtml5.commands.foreColor = (function() {
       eventListener.stop();
     }
   }
-  
+
   function _selectLineAndWrap(element) {
-    wysihtml5.utils.caret.selectLine(element.ownerDocument);
-    wysihtml5.utils.caret.surround(element);
+    selection.selectLine(element.ownerDocument);
+    selection.surround(element);
     _removeLineBreakBeforeAndAfter(element);
     _removeLastChildIfLineBreak(element);
-    wysihtml5.utils.caret.selectNode(element);
+    selection.selectNode(element);
   }
-  
+
   function _hasClasses(element) {
-    return !!element.className.replace(/^\s+/, "").replace(/\s+$/, "");
+    return !!wysihtml5.lang.string(element.className).trim();
   }
   
-  function exec(element, command, nodeName, className, classRegExp) {
-    var doc          = element.ownerDocument,
-        blockElement = state(element, command, nodeName, className, classRegExp),
-        keepClassName,
-        selectedNode;
-    
-    nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
-    
-    if (blockElement) {
-      wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-        if (classRegExp) {
-          _removeClass(blockElement, classRegExp);
-        }
-        var hasClasses = _hasClasses(blockElement);
-        if (!hasClasses && blockElement.nodeName === (nodeName || DEFAULT_NODE_NAME)) {
-          // Insert a line break afterwards and beforewards when there are siblings
-          // that are not of type line break or block element
-          _addLineBreakBeforeAndAfter(blockElement);
-          wysihtml5.utils.unwrap(blockElement);
-        } else if (hasClasses) {
-          // Make sure that styling is kept by renaming the element to <div> and copying over the class name
-          wysihtml5.utils.renameElement(blockElement, DEFAULT_NODE_NAME);
-        }
-      });
-      return;
-    }
-    
-    // Find similiar block element and rename it (<h2 class="foo"></h2>  =>  <h1 class="foo"></h1>)
-    if (nodeName === null || BLOCK_ELEMENTS_GROUP.indexOf(nodeName) !== -1) {
-      selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-      blockElement = wysihtml5.utils.getParentElement(selectedNode, {
-        nodeName:     BLOCK_ELEMENTS_GROUP
-      });
-      
+  wysihtml5.commands.formatBlock = {
+    exec: function(element, command, nodeName, className, classRegExp) {
+      var doc          = element.ownerDocument,
+          blockElement = this.state(element, command, nodeName, className, classRegExp),
+          selectedNode;
+
+      nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
+
       if (blockElement) {
-        wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-          // Rename current block element to new block element and add class
-          if (nodeName) {
-            blockElement = wysihtml5.utils.renameElement(blockElement, nodeName);
+        selection.executeAndRestoreSimple(doc, function() {
+          if (classRegExp) {
+            _removeClass(blockElement, classRegExp);
           }
-          if (className) {
-            _addClass(blockElement, className, classRegExp);
+          var hasClasses = _hasClasses(blockElement);
+          if (!hasClasses && blockElement.nodeName === (nodeName || DEFAULT_NODE_NAME)) {
+            // Insert a line break afterwards and beforewards when there are siblings
+            // that are not of type line break or block element
+            _addLineBreakBeforeAndAfter(blockElement);
+            dom.replaceWithChildNodes(blockElement);
+          } else if (hasClasses) {
+            // Make sure that styling is kept by renaming the element to <div> and copying over the class name
+            dom.renameElement(blockElement, DEFAULT_NODE_NAME);
           }
         });
         return;
       }
+
+      // Find similiar block element and rename it (<h2 class="foo"></h2>  =>  <h1 class="foo"></h1>)
+      if (nodeName === null || wysihtml5.lang.array(BLOCK_ELEMENTS_GROUP).contains(nodeName)) {
+        selectedNode = selection.getSelectedNode(doc);
+        blockElement = dom.getParentElement(selectedNode, {
+          nodeName:     BLOCK_ELEMENTS_GROUP
+        });
+
+        if (blockElement) {
+          selection.executeAndRestoreSimple(doc, function() {
+            // Rename current block element to new block element and add class
+            if (nodeName) {
+              blockElement = dom.renameElement(blockElement, nodeName);
+            }
+            if (className) {
+              _addClass(blockElement, className, classRegExp);
+            }
+          });
+          return;
+        }
+      }
+
+      if (wysihtml5.commands.support(element, command)) {
+        _execCommand(doc, command, nodeName || DEFAULT_NODE_NAME, className);
+        return;
+      }
+
+      blockElement = doc.createElement(nodeName || DEFAULT_NODE_NAME);
+      if (className) {
+        blockElement.className = className;
+      }
+      _selectLineAndWrap(blockElement);
+    },
+
+    state: function(element, command, nodeName, className, classRegExp) {
+      nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
+      var selectedNode = selection.getSelectedNode(element.ownerDocument);
+      return dom.getParentElement(selectedNode, {
+        nodeName:     nodeName,
+        className:    className,
+        classRegExp:  classRegExp
+      });
+    },
+
+    value: function() {
+      return undef;
     }
-    
-    if (wysihtml5.commands.support(element, command)) {
-      _execCommand(doc, command, nodeName || DEFAULT_NODE_NAME, className);
-      return;
-    }
-    
-    blockElement = doc.createElement(nodeName || DEFAULT_NODE_NAME);
-    if (className) {
-      blockElement.className = className;
-    }
-    _selectLineAndWrap(blockElement);
-  }
-  
-  function state(element, command, nodeName, className, classRegExp) {
-    nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
-    var selectedNode = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument);
-    return wysihtml5.utils.getParentElement(selectedNode, {
-      nodeName:     nodeName,
-      className:    className,
-      classRegExp:  classRegExp
-    });
-  }
-  
-  function value(element, command) {
-    return undef;
-  }
-  
-  return {
-    BLOCK_ELEMENTS_GROUP: BLOCK_ELEMENTS_GROUP,
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();/**
+})(wysihtml5);/**
  * formatInline scenarios for tag "B" (| = caret, |foo| = selected text)
  *
  *   #1 caret in unformatted text:
@@ -7803,475 +8373,427 @@ wysihtml5.commands.foreColor = (function() {
  *      <b>ab</b>|c|
  *
  *   #6 formatted text selected across boundaries
- *      <span>ab|c</span> <b>de|fgh</b>
- *   output:
- *      <span>ab|c</span> de|<b>fgh</b>
- */
-wysihtml5.commands.formatInline = (function() {
-  var undef,
-      // Treat <b> as <strong> and vice versa
-      ALIAS_MAPPING = {
-        "strong": "b",
-        "em":     "i",
-        "b":      "strong",
-        "i":      "em"
-      },
-      cssClassApplier = {};
-  
-  function _getTagNames(tagName) {
-    var alias = ALIAS_MAPPING[tagName];
-    return alias ? [tagName.toLowerCase(), alias.toLowerCase()] : [tagName.toLowerCase()];
-  }
-  
-  function _getApplier(tagName, className, classRegExp) {
-    var identifier = tagName + ":" + className;
-    if (!cssClassApplier[identifier]) {
-      cssClassApplier[identifier] = rangy.createCssClassApplier(_getTagNames(tagName), className, classRegExp, true);
-    }
-    return cssClassApplier[identifier];
-  }
-  
-  function exec(element, command, tagName, className, classRegExp) {
-    var range = wysihtml5.utils.caret.getRange(element.ownerDocument);
-    if (!range) {
-      return false;
-    }
-    _getApplier(tagName, className, classRegExp).toggleRange(range);
-    wysihtml5.utils.caret.setSelection(range);
-  }
-  
-  function state(element, command, tagName, className, classRegExp) {
-    var doc           = element.ownerDocument,
-        aliasTagName  = ALIAS_MAPPING[tagName] || tagName,
-        range;
-    
-    // Check whether the document contains a node with the desired tagName
-    if (!wysihtml5.utils.hasElementWithTagName(doc, tagName) &&
-        !wysihtml5.utils.hasElementWithTagName(doc, aliasTagName)) {
-      return false;
-    }
-     
-     // Check whether the document contains a node with the desired className
-    if (className && !wysihtml5.utils.hasElementWithClassName(doc, className)) {
-       return false;
-    }
-    
-    range = wysihtml5.utils.caret.getRange(doc);
-    if (!range) {
-      return false;
-    }
-    
-    return _getApplier(tagName, className, classRegExp).isAppliedToRange(range);
-  }
-  
-  function value(element, command) {
-    // TODO
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
-  };
-})();wysihtml5.commands.insertHTML = (function() {
-  var undef;
-  
-  function exec(element, command, html) {
-    if (wysihtml5.commands.support(element, command)) {
-      element.ownerDocument.execCommand(command, false, html);
-    } else {
-      wysihtml5.utils.caret.insertHTML(element.ownerDocument, html);
-    }
-  }
-  
-  function state() {
-    return false;
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
-  };
-})();wysihtml5.commands.insertImage = (function() {
-  var NODE_NAME = "IMG",
-      WHITE_SPACE_START_REG_EXP = /^\s+/,
-      WHITE_SPACE_END_REG_EXP   = /\s+$/;
-  
-  /**
-   * Inserts an <img>
-   * If selection is already an image link, it removes it
-   * 
-   * @example
-   *    // either ...
-   *    wysihtml5.commands.insertImage.exec(element, "insertImage", "http://www.google.de/logo.jpg");
-   *    // ... or ...
-   *    wysihtml5.commands.insertImage.exec(element, "insertImage", { src: "http://www.google.de/logo.jpg", title: "foo" });
-   */
-  function exec(element, command, value) {
-    value = typeof(value) === "object" ? value : { src: value };
-    
-    var doc   = element.ownerDocument,
-        image = state(element),
-        i,
-        parent;
-    
-    if (image) {
-      // Image already selected, set the caret before it and delete it
-      wysihtml5.utils.caret.setBefore(image);
-      parent = image.parentNode;
-      parent.removeChild(image);
-      
-      // and it's parent <a> too if it hasn't got any other relevant child nodes
-      wysihtml5.utils.removeEmptyTextNodes(parent);
-      if (parent.nodeName === "A" && !parent.firstChild) {
-        wysihtml5.utils.caret.setAfter(parent);
-        parent.parentNode.removeChild(parent);
-      }
-      
-      // firefox and ie sometimes don't remove the image handles, even though the image got removed
-      wysihtml5.quirks.redraw(element);
-      return;
-    }
-    
-    image = doc.createElement(NODE_NAME);
-    
-    for (i in value) {
-      image[i] = value[i];
-    }
-    
-    wysihtml5.utils.caret.insertNode(image);
-    wysihtml5.utils.caret.setAfter(image);
-  }
-  
-  function state(element) {
-    var doc = element.ownerDocument,
-        selectedNode,
-        trimmedText,
-        imagesInSelection;
-    
-    if (!wysihtml5.utils.hasElementWithTagName(doc, NODE_NAME)) {
-      return false;
-    }
-    
-    selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-    if (!selectedNode) {
-      return false;
-    }
-    
-    if (selectedNode.nodeName === NODE_NAME) {
-      // This works perfectly in IE
-      return selectedNode;
-    }
-    
-    if (selectedNode.nodeType !== Node.ELEMENT_NODE) {
-      return false;
-    }
-    
-    trimmedText = wysihtml5.utils.caret.getText(doc)
-      .replace(WHITE_SPACE_START_REG_EXP, "")
-      .replace(WHITE_SPACE_END_REG_EXP, "");
-    if (trimmedText) {
-      return false;
-    }
-    
-    imagesInSelection = wysihtml5.utils.caret.getNodes(doc, Node.ELEMENT_NODE, function(node) {
-      return node.nodeName === "IMG";
-    });
-    
-    if (imagesInSelection.length !== 1) {
-      return false;
-    }
-    
-    return imagesInSelection[0];
+ *      <span>ab|c</span> <b>de|fgh</b>
+ *   output:
+ *      <span>ab|c</span> de|<b>fgh</b>
+ */
+(function(wysihtml5) {
+  var undef,
+      // Treat <b> as <strong> and vice versa
+      ALIAS_MAPPING = {
+        "strong": "b",
+        "em":     "i",
+        "b":      "strong",
+        "i":      "em"
+      },
+      htmlApplier = {};
+  
+  function _getTagNames(tagName) {
+    var alias = ALIAS_MAPPING[tagName];
+    return alias ? [tagName.toLowerCase(), alias.toLowerCase()] : [tagName.toLowerCase()];
   }
   
-  function value(element) {
-    var image = state(element);
-    return image && image.src;
+  function _getApplier(tagName, className, classRegExp) {
+    var identifier = tagName + ":" + className;
+    if (!htmlApplier[identifier]) {
+      htmlApplier[identifier] = new wysihtml5.selection.HTMLApplier(_getTagNames(tagName), className, classRegExp, true);
+    }
+    return htmlApplier[identifier];
   }
   
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.formatInline = {
+    exec: function(element, command, tagName, className, classRegExp) {
+      var range = wysihtml5.selection.getRange(element.ownerDocument);
+      if (!range) {
+        return false;
+      }
+      _getApplier(tagName, className, classRegExp).toggleRange(range);
+      wysihtml5.selection.setSelection(range);
+    },
+
+    state: function(element, command, tagName, className, classRegExp) {
+      var doc           = element.ownerDocument,
+          aliasTagName  = ALIAS_MAPPING[tagName] || tagName,
+          range;
+
+      // Check whether the document contains a node with the desired tagName
+      if (!wysihtml5.dom.hasElementWithTagName(doc, tagName) &&
+          !wysihtml5.dom.hasElementWithTagName(doc, aliasTagName)) {
+        return false;
+      }
+
+       // Check whether the document contains a node with the desired className
+      if (className && !wysihtml5.dom.hasElementWithClassName(doc, className)) {
+         return false;
+      }
+
+      range = wysihtml5.selection.getRange(doc);
+      if (!range) {
+        return false;
+      }
+
+      return _getApplier(tagName, className, classRegExp).isAppliedToRange(range);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();wysihtml5.commands.insertLineBreak = (function() {
-  var undef,
-      LINE_BREAK = "<br>" + (Prototype.Browser.Opera ? " " : "");
+})(wysihtml5);(function(wysihtml5) {
+  var undef;
   
-  function exec(element, command) {
-    if (wysihtml5.commands.support(element, command)) {
-      element.ownerDocument.execCommand(command, false, null);
-      if (!wysihtml5.browserSupports.autoScrollIntoViewOfCaret()) {
-        wysihtml5.utils.caret.scrollIntoView(element);
+  wysihtml5.commands.insertHTML = {
+    exec: function(element, command, html) {
+      if (wysihtml5.commands.support(element, command)) {
+        element.ownerDocument.execCommand(command, false, html);
+      } else {
+        wysihtml5.selection.insertHTML(element.ownerDocument, html);
       }
-    } else {
-      wysihtml5.commands.exec(element, "insertHTML", LINE_BREAK);
+    },
+
+    state: function() {
+      return false;
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function state() {
-    return false;
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();wysihtml5.commands.insertOrderedList = (function() {
-  var undef;
+})(wysihtml5);(function(wysihtml5) {
+  var NODE_NAME = "IMG";
   
-  function exec(element, command) {
-    var doc = element.ownerDocument,
-        selectedNode,
-        isEmpty,
-        tempElement,
-        list;
-    
-    if (wysihtml5.commands.support(element, command)) {
-      doc.execCommand(command, false, null);
-    } else {
-      selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-      list = wysihtml5.utils.getParentElement(selectedNode, { nodeName: ["UL", "OL"] }, 4);
-      if (!list) {
-        tempElement = doc.createElement("span");
-        wysihtml5.utils.caret.surround(tempElement);
-        isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === "\uFEFF";
-        wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-          list = wysihtml5.utils.convertIntoList(tempElement, "ol");
-        });
-        
-        if (isEmpty) {
-          wysihtml5.utils.caret.selectNode(list.querySelector("li"));
+  wysihtml5.commands.insertImage = {
+    /**
+     * Inserts an <img>
+     * If selection is already an image link, it removes it
+     * 
+     * @example
+     *    // either ...
+     *    wysihtml5.commands.insertImage.exec(element, "insertImage", "http://www.google.de/logo.jpg");
+     *    // ... or ...
+     *    wysihtml5.commands.insertImage.exec(element, "insertImage", { src: "http://www.google.de/logo.jpg", title: "foo" });
+     */
+    exec: function(element, command, value) {
+      value = typeof(value) === "object" ? value : { src: value };
+
+      var doc   = element.ownerDocument,
+          image = this.state(element),
+          i,
+          parent;
+
+      if (image) {
+        // Image already selected, set the caret before it and delete it
+        wysihtml5.selection.setBefore(image);
+        parent = image.parentNode;
+        parent.removeChild(image);
+
+        // and it's parent <a> too if it hasn't got any other relevant child nodes
+        wysihtml5.dom.removeEmptyTextNodes(parent);
+        if (parent.nodeName === "A" && !parent.firstChild) {
+          wysihtml5.selection.setAfter(parent);
+          parent.parentNode.removeChild(parent);
         }
+
+        // firefox and ie sometimes don't remove the image handles, even though the image got removed
+        wysihtml5.quirks.redraw(element);
         return;
       }
-      
-      wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-        if (list.nodeName === "OL") {
-          // Unwrap list
-          // <ol><li>foo</li><li>bar</li></ol>
-          // becomes:
-          // foo<br>bar<br>
-          wysihtml5.utils.resolveList(list);
-        } else if (list.nodeName === "UL" || list.nodeName === "MENU") {
-          // Turn an unordered list into an ordered list
-          // <ul><li>foo</li><li>bar</li></ul>
-          // becomes:
-          // <ol><li>foo</li><li>bar</li></ol>
-          wysihtml5.utils.renameElement(list, "ol");
-        }
+
+      image = doc.createElement(NODE_NAME);
+
+      for (i in value) {
+        image[i] = value[i];
+      }
+
+      wysihtml5.selection.insertNode(image);
+      wysihtml5.selection.setAfter(image);
+    },
+
+    state: function(element) {
+      var doc = element.ownerDocument,
+          selectedNode,
+          text,
+          imagesInSelection;
+
+      if (!wysihtml5.dom.hasElementWithTagName(doc, NODE_NAME)) {
+        return false;
+      }
+
+      selectedNode = wysihtml5.selection.getSelectedNode(doc);
+      if (!selectedNode) {
+        return false;
+      }
+
+      if (selectedNode.nodeName === NODE_NAME) {
+        // This works perfectly in IE
+        return selectedNode;
+      }
+
+      if (selectedNode.nodeType !== wysihtml5.ELEMENT_NODE) {
+        return false;
+      }
+
+      text = wysihtml5.selection.getText(doc);
+      text = wysihtml5.lang.string(text).trim();
+      if (text) {
+        return false;
+      }
+
+      imagesInSelection = wysihtml5.selection.getNodes(doc, wysihtml5.ELEMENT_NODE, function(node) {
+        return node.nodeName === "IMG";
       });
+
+      if (imagesInSelection.length !== 1) {
+        return false;
+      }
+
+      return imagesInSelection[0];
+    },
+
+    value: function(element) {
+      var image = this.state(element);
+      return image && image.src;
     }
-  }
+  };
+})(wysihtml5);(function(wysihtml5) {
+  var undef,
+      LINE_BREAK = "<br>" + (wysihtml5.browser.needsSpaceAfterLineBreak() ? " " : "");
   
-  function state(element, command) {
-    try {
-      return element.ownerDocument.queryCommandState(command);
-    } catch(e) {
+  wysihtml5.commands.insertLineBreak = {
+    exec: function(element, command) {
+      if (wysihtml5.commands.support(element, command)) {
+        element.ownerDocument.execCommand(command, false, null);
+        if (!wysihtml5.browser.autoScrollsToCaret()) {
+          wysihtml5.selection.scrollIntoView(element);
+        }
+      } else {
+        wysihtml5.commands.exec(element, "insertHTML", LINE_BREAK);
+      }
+    },
+
+    state: function() {
       return false;
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();wysihtml5.commands.insertUnorderedList = (function() {
+})(wysihtml5);(function(wysihtml5) {
   var undef;
   
-  function exec(element, command) {
-    var doc = element.ownerDocument,
-        selectedNode,
-        isEmpty,
-        tempElement,
-        list;
-    
-    if (wysihtml5.commands.support(element, command)) {
-      doc.execCommand(command, false, null);
-    } else {
-      selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-      list = wysihtml5.utils.getParentElement(selectedNode, { nodeName: ["UL", "OL"] });
-      
-      if (!list) {
-        tempElement = doc.createElement("span");
-        wysihtml5.utils.caret.surround(tempElement);
-        isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === "\uFEFF";
-        wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-          list = wysihtml5.utils.convertIntoList(tempElement, "ul");
-        });
-        
-        if (isEmpty) {
-          wysihtml5.utils.caret.selectNode(list.querySelector("li"));
+  wysihtml5.commands.insertOrderedList = {
+    exec: function(element, command) {
+      var doc = element.ownerDocument,
+          selectedNode,
+          isEmpty,
+          tempElement,
+          list;
+
+      if (wysihtml5.commands.support(element, command)) {
+        doc.execCommand(command, false, null);
+      } else {
+        selectedNode = wysihtml5.selection.getSelectedNode(doc);
+        list = wysihtml5.dom.getParentElement(selectedNode, { nodeName: ["UL", "OL"] }, 4);
+        if (!list) {
+          tempElement = doc.createElement("span");
+          wysihtml5.selection.surround(tempElement);
+          isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === wysihtml5.INVISIBLE_SPACE;
+          wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+            list = wysihtml5.dom.convertToList(tempElement, "ol");
+          });
+
+          if (isEmpty) {
+            wysihtml5.selection.selectNode(list.querySelector("li"));
+          }
+          return;
         }
-        return;
+
+        wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+          if (list.nodeName === "OL") {
+            // Unwrap list
+            // <ol><li>foo</li><li>bar</li></ol>
+            // becomes:
+            // foo<br>bar<br>
+            wysihtml5.dom.resolveList(list);
+          } else if (list.nodeName === "UL" || list.nodeName === "MENU") {
+            // Turn an unordered list into an ordered list
+            // <ul><li>foo</li><li>bar</li></ul>
+            // becomes:
+            // <ol><li>foo</li><li>bar</li></ol>
+            wysihtml5.dom.renameElement(list, "ol");
+          }
+        });
       }
-      
-      wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-        if (list.nodeName === "UL") {
-          // Unwrap list
-          // <ul><li>foo</li><li>bar</li></ul>
-          // becomes:
-          // foo<br>bar<br>
-          wysihtml5.utils.resolveList(list);
-        } else if (list.nodeName === "OL" || list.nodeName === "MENU") {
-          // Turn an ordered list into an unordered list
-          // <ol><li>foo</li><li>bar</li></ol>
-          // becomes:
-          // <ul><li>foo</li><li>bar</li></ul>
-          wysihtml5.utils.renameElement(list, "ul");
-        }
-      });
+    },
+
+    state: function(element, command) {
+      try {
+        return element.ownerDocument.queryCommandState(command);
+      } catch(e) {
+        return false;
+      }
+    },
+
+    value: function() {
+      return undef;
     }
-  }
+  };
+})(wysihtml5);(function(wysihtml5) {
+  var undef;
   
-  function state(element, command) {
-    try {
-      return element.ownerDocument.queryCommandState(command);
-    } catch(e) {
-      return false;
+  wysihtml5.commands.insertUnorderedList = {
+    exec: function(element, command) {
+      var doc = element.ownerDocument,
+          selectedNode,
+          isEmpty,
+          tempElement,
+          list;
+
+      if (wysihtml5.commands.support(element, command)) {
+        doc.execCommand(command, false, null);
+      } else {
+        selectedNode = wysihtml5.selection.getSelectedNode(doc);
+        list = wysihtml5.dom.getParentElement(selectedNode, { nodeName: ["UL", "OL"] });
+
+        if (!list) {
+          tempElement = doc.createElement("span");
+          wysihtml5.selection.surround(tempElement);
+          isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === wysihtml5.INVISIBLE_SPACE;
+          wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+            list = wysihtml5.dom.convertToList(tempElement, "ul");
+          });
+
+          if (isEmpty) {
+            wysihtml5.selection.selectNode(list.querySelector("li"));
+          }
+          return;
+        }
+
+        wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+          if (list.nodeName === "UL") {
+            // Unwrap list
+            // <ul><li>foo</li><li>bar</li></ul>
+            // becomes:
+            // foo<br>bar<br>
+            wysihtml5.dom.resolveList(list);
+          } else if (list.nodeName === "OL" || list.nodeName === "MENU") {
+            // Turn an ordered list into an unordered list
+            // <ol><li>foo</li><li>bar</li></ol>
+            // becomes:
+            // <ul><li>foo</li><li>bar</li></ul>
+            wysihtml5.dom.renameElement(list, "ul");
+          }
+        });
+      }
+    },
+
+    state: function(element, command) {
+      try {
+        return element.ownerDocument.queryCommandState(command);
+      } catch(e) {
+        return false;
+      }
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();wysihtml5.commands.italic = (function() {
+})(wysihtml5);(function(wysihtml5) {
   var undef;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatInline.exec(element, command, "i");
-  }
-  
-  function state(element, command, color) {
-    // element.ownerDocument.queryCommandState("italic") results:
-    // firefox: only <i>
-    // chrome:  <i>, <em>, <blockquote>, ...
-    // ie:      <i>, <em>
-    // opera:   only <i>
-    return wysihtml5.commands.formatInline.state(element, command, "i");
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.italic = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatInline.exec(element, command, "i");
+    },
+
+    state: function(element, command, color) {
+      // element.ownerDocument.queryCommandState("italic") results:
+      // firefox: only <i>
+      // chrome:  <i>, <em>, <blockquote>, ...
+      // ie:      <i>, <em>
+      // opera:   only <i>
+      return wysihtml5.commands.formatInline.state(element, command, "i");
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();wysihtml5.commands.justifyCenter = (function() {
+})(wysihtml5);(function(wysihtml5) {
   var undef,
       CLASS_NAME  = "wysiwyg-text-align-center",
       REG_EXP     = /wysiwyg-text-align-[a-z]+/g;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.justifyCenter = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();wysihtml5.commands.justifyLeft = (function() {
+})(wysihtml5);(function(wysihtml5) {
   var undef,
       CLASS_NAME  = "wysiwyg-text-align-left",
       REG_EXP     = /wysiwyg-text-align-[a-z]+/g;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.justifyLeft = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();wysihtml5.commands.justifyRight = (function() {
+})(wysihtml5);(function(wysihtml5) {
   var undef,
       CLASS_NAME  = "wysiwyg-text-align-right",
       REG_EXP     = /wysiwyg-text-align-[a-z]+/g;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.justifyRight = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();wysihtml5.commands.underline = (function() {
+})(wysihtml5);(function(wysihtml5) {
   var undef,
       REG_EXP     = /wysiwyg-text-decoration-underline/g,
       CLASS_NAME  = "wysiwyg-text-decoration-underline";
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatInline.exec(element, command, "span", CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatInline.state(element, command, "span", CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.underline = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatInline.exec(element, command, "span", CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatInline.state(element, command, "span", CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();/**
+})(wysihtml5);/**
  * WYSIHTML5 Editor
  *
  * @author Christopher Blum <christopher.blum@xing.com>
@@ -8297,20 +8819,23 @@ wysihtml5.commands.formatInline = (function() {
  *    destroy:composer
  *    change_view
  */
-wysihtml5.Editor = (function() {
+(function(wysihtml5) {
+  var undef;
+  
   var defaultConfig = {
     // Give the editor a name, the name will also be set as class name on the iframe and on the iframe's body 
-    name:                 null,
+    name:                 undef,
     // Whether the editor should look like the textarea (by adopting styles)
     style:                true,
     // Id of the toolbar element, pass falsey value if you don't want any toolbar logic
-    toolbar:              null,
+    toolbar:              undef,
     // Whether urls, entered by the user should automatically become clickable-links
     autoLink:             true,
     // Object which includes parser rules to apply when html gets inserted via copy & paste
-    parserRules:          null,
+    // See parser_rules/*.js for examples
+    parserRules:          { tags: { br: {}, span: {}, div: {}, p: {} }, classes: {} },
     // Parser method to use when the user inserts content via copy & paste
-    parser:               wysihtml5.utils.sanitizeHTML || Prototype.K,
+    parser:               wysihtml5.dom.parse,
     // Class name which should be set on the contentEditable element in the created sandbox iframe, can be styled via the 'stylesheets' option
     composerClassName:    "wysihtml5-editor",
     // Class name to add to the body when the wysihtml5 editor is supported
@@ -8318,46 +8843,43 @@ wysihtml5.Editor = (function() {
     // Array (or single string) of stylesheet urls to be loaded in the editor's iframe
     stylesheets:          [],
     // Placeholder text to use, defaults to the placeholder attribute on the textarea element
-    placeholderText:      null,
+    placeholderText:      undef,
     // Whether the composer should allow the user to manually resize images, tables etc.
     allowObjectResizing:  true
   };
   
-  // Incremental instance id
-  var instanceId = new Date().getTime();
-  
-  return Class.create(
+  wysihtml5.Editor = wysihtml5.lang.Dispatcher.extend(
     /** @scope wysihtml5.Editor.prototype */ {
-    initialize: function(textareaElement, config) {
-      this._instanceId      = ++instanceId;
-      this.textareaElement  = $(textareaElement);
-      this.config           = Object.extend(Object.clone(defaultConfig), config);
+    constructor: function(textareaElement, config) {
+      this.textareaElement  = typeof(textareaElement) === "string" ? document.getElementById(textareaElement) : textareaElement;
+      this.config           = wysihtml5.lang.object({}).merge(defaultConfig).merge(config).get();
       this.textarea         = new wysihtml5.views.Textarea(this, this.textareaElement, this.config);
       this.currentView      = this.textarea;
-      this._isCompatible    = wysihtml5.browserSupports.contentEditable();
+      this._isCompatible    = wysihtml5.browser.supported();
       
       // Sort out unsupported browsers here
       if (!this._isCompatible) {
-        (function() { this.fire("beforeload").fire("load"); }).bind(this).defer();
+        var that = this;
+        setTimeout(function() { that.fire("beforeload").fire("load"); }, 0);
         return;
       }
       
       // Add class name to body, to indicate that the editor is supported
-      $(document.body).addClassName(this.config.bodyClassName);
+      wysihtml5.dom.addClass(document.body, this.config.bodyClassName);
       
       this.composer = new wysihtml5.views.Composer(this, this.textareaElement, this.config);
       this.currentView = this.composer;
       
-      if (Object.isFunction(this.config.parser)) {
+      if (typeof(this.config.parser) === "function") {
         this._initParser();
       }
       
       this.observe("beforeload", function() {
-        this.synchronizer = new wysihtml5.utils.Synchronizer(this, this.textarea, this.composer);
+        this.synchronizer = new wysihtml5.views.Synchronizer(this, this.textarea, this.composer);
         if (this.config.toolbar) {
           this.toolbar = new wysihtml5.toolbar.Toolbar(this, this.config.toolbar);
         }
-      }.bind(this));
+      });
       
       try {
         console.log("Heya! This page is using wysihtml5 for rich text editing. Check out https://github.com/xing/wysihtml5");
@@ -8367,33 +8889,6 @@ wysihtml5.Editor = (function() {
     isCompatible: function() {
       return this._isCompatible;
     },
-    
-    observe: function() {
-      Element.observe.apply(Element, this._getEventArguments(arguments));
-      return this;
-    },
-
-    fire: function() {
-      Element.fire.apply(Element, this._getEventArguments(arguments));
-      return this;
-    },
-
-    stopObserving: function() {
-      Element.stopObserving.apply(Element, this._getEventArguments(arguments));
-      return this;
-    },
-
-    /**
-     * Builds an array that can be passed into Function.prototyope.apply
-     * when called on Element.observe, Element.stopObserving, Element.fire
-     */
-    _getEventArguments: function(args) {
-      args = $A(args);
-      if (args[0]) {
-        args[0] = "wysihtml5:" + this._instanceId + ":" + args[0];
-      }
-      return [document.documentElement, args].flatten();
-    },
 
     clear: function() {
       this.currentView.clear();
@@ -8451,36 +8946,24 @@ wysihtml5.Editor = (function() {
     
     /**
      * Prepare html parser logic
-     *  - Loads parser rules if config.parserRules is a string
      *  - Observes for paste and drop
      */
     _initParser: function() {
-      if (typeof(this.config.parserRules) === "string") {
-        new Ajax.Request(this.config.parserRules, {
-          method:   "get",
-          onCreate: function() {
-            this.config.parserRules = defaultConfig.parserRules;
-          }.bind(this),
-          onSuccess: function(transport) {
-            this.config.parserRules = transport.responseJSON || transport.responseText.evalJSON();
-          }.bind(this)
-        });
-      }
-      
       this.observe("paste:composer", function() {
-        var keepScrollPosition = true;
-        wysihtml5.utils.caret.executeAndRestore(this.composer.sandbox.getDocument(), function() {
-          wysihtml5.quirks.cleanPastedHTML(this.composer.element);
-          this.parse(this.composer.element);
-        }.bind(this), keepScrollPosition);
-      }.bind(this));
+        var keepScrollPosition  = true,
+            that                = this;
+        wysihtml5.selection.executeAndRestore(this.composer.sandbox.getDocument(), function() {
+          wysihtml5.quirks.cleanPastedHTML(that.composer.element);
+          that.parse(that.composer.element);
+        }, keepScrollPosition);
+      });
       
       this.observe("paste:textarea", function() {
         var value   = this.textarea.getValue(),
             newValue;
         newValue = this.parse(value);
         this.textarea.setValue(newValue);
-      }.bind(this));
+      });
     }
   });
-})();
\ No newline at end of file
+})(wysihtml5);
diff --git a/dist/wysihtml5-0.2.0.min.js b/dist/wysihtml5-0.2.0.min.js
new file mode 100644
index 00000000..806efe9b
--- /dev/null
+++ b/dist/wysihtml5-0.2.0.min.js
@@ -0,0 +1,242 @@
+/*
+ wysihtml5 v0.2.0
+ https://github.com/xing/wysihtml5
+
+ Author: Christopher Blum (https://github.com/tiff)
+
+ Copyright (C) 2011 XING AG
+ Licensed under GNU General Public License
+
+ Rangy, a cross-browser JavaScript range and selection library
+ http://code.google.com/p/rangy/
+
+ Copyright 2011, Tim Down
+ Licensed under the MIT license.
+ Version: 1.1
+ Build date: 12 March 2011
+*/
+var wysihtml5={version:"0.2.0",commands:{},dom:{},quirks:{},toolbar:{},lang:{},selection:{},views:{},INVISIBLE_SPACE:"\ufeff",EMPTY_FUNCTION:function(){},ELEMENT_NODE:1,TEXT_NODE:3,BACKSPACE_KEY:8,ENTER_KEY:13,ESCAPE_KEY:27,SPACE_KEY:32,DELETE_KEY:46},rangy=function(){function a(a,b){var c=typeof a[b];return c==k||!!(c==i&&a[b])||c=="unknown"}function c(a,b){return!!(typeof a[b]==i&&a[b])}function b(a,b){return typeof a[b]!=j}function d(a){return function(b,c){for(var g=c.length;g--;)if(!a(b,c[g]))return!1;
+return!0}}function e(a){window.alert("Rangy not supported in your browser. Reason: "+a);r.initialized=!0;r.supported=!1}function h(){if(!r.initialized){var b,f=!1,d=!1;a(document,"createRange")&&(b=document.createRange(),t(b,l)&&w(b,g)&&(f=!0),b.detach());if((b=c(document,"body")?document.body:document.getElementsByTagName("body")[0])&&a(b,"createTextRange"))b=b.createTextRange(),t(b,q)&&w(b,n)&&(d=!0);!f&&!d&&e("Neither Range nor TextRange are implemented");r.initialized=!0;r.features={implementsDomRange:f,
+implementsTextRange:d};f=x.concat(s);d=0;for(b=f.length;d<b;++d)try{f[d](r)}catch(j){c(window,"console")&&a(window.console,"log")&&console.log("Init listener threw an exception. Continuing.",j)}}}function f(a){this.name=a;this.supported=this.initialized=!1}var i="object",k="function",j="undefined",g=["startContainer","startOffset","endContainer","endOffset","collapsed","commonAncestorContainer","START_TO_START","START_TO_END","END_TO_START","END_TO_END"],l=["setStart","setStartBefore","setStartAfter",
+"setEnd","setEndBefore","setEndAfter","collapse","selectNode","selectNodeContents","compareBoundaryPoints","deleteContents","extractContents","cloneContents","insertNode","surroundContents","cloneRange","toString","detach"],n=["boundingHeight","boundingLeft","boundingTop","boundingWidth","htmlText","text"],q=["collapse","compareEndPoints","duplicate","getBookmark","moveToBookmark","moveToElementText","parentElement","pasteHTML","select","setEndPoint"],t=d(a),o=d(c),w=d(b),r={initialized:!1,supported:!0,
+util:{isHostMethod:a,isHostObject:c,isHostProperty:b,areHostMethods:t,areHostObjects:o,areHostProperties:w},features:{},modules:{},config:{alertOnWarn:!1}};r.fail=e;r.warn=function(a){a="Rangy warning: "+a;r.config.alertOnWarn?window.alert(a):typeof window.console!=j&&typeof window.console.log!=j&&window.console.log(a)};r.init=h;var s=[],x=[];r.addInitListener=function(a){r.initialized?a(r):s.push(a)};var p=[];r.addCreateMissingNativeApiListener=function(a){p.push(a)};r.createMissingNativeApi=function(a){a=
+a||window;h();for(var b=0,c=p.length;b<c;++b)p[b](a)};f.prototype.fail=function(a){this.initialized=!0;this.supported=!1;throw Error("Module '"+this.name+"' failed to load: "+a);};f.prototype.createError=function(a){return Error("Error in Rangy "+this.name+" module: "+a)};r.createModule=function(a,b){var c=new f(a);r.modules[a]=c;x.push(function(a){b(a,c);c.initialized=!0;c.supported=!0})};r.requireModules=function(a){for(var b=0,c=a.length,g,d;b<c;++b){d=a[b];g=r.modules[d];if(!g||!(g instanceof
+f))throw Error("Module '"+d+"' not found");if(!g.supported)throw Error("Module '"+d+"' not supported");}};var v=!1,o=function(){v||(v=!0,r.initialized||h())};if(typeof window==j)e("No window found");else if(typeof document==j)e("No document found");else return a(document,"addEventListener")&&document.addEventListener("DOMContentLoaded",o,!1),a(window,"addEventListener")?window.addEventListener("load",o,!1):a(window,"attachEvent")?window.attachEvent("onload",o):e("Window does not have required addEventListener or attachEvent method"),
+r}();
+rangy.createModule("DomUtil",function(a,c){function b(a){for(var b=0;a=a.previousSibling;)b++;return b}function d(a,b){var c=[],g;for(g=a;g;g=g.parentNode)c.push(g);for(g=b;g;g=g.parentNode)if(o(c,g))return g;return null}function e(a,b,c){for(c=c?a:a.parentNode;c;){a=c.parentNode;if(a===b)return c;c=a}return null}function h(a){a=a.nodeType;return a==3||a==4||a==8}function f(a,b){var c=b.nextSibling,g=b.parentNode;c?g.insertBefore(a,c):g.appendChild(a);return a}function i(a){if(a.nodeType==9)return a;else if(typeof a.ownerDocument!=
+n)return a.ownerDocument;else if(typeof a.document!=n)return a.document;else if(a.parentNode)return i(a.parentNode);else throw Error("getDocument: no document found for node");}function k(a){if(!a)return"[No node]";return h(a)?'"'+a.data+'"':a.nodeType==1?"<"+a.nodeName+(a.id?' id="'+a.id+'"':"")+">["+a.childNodes.length+"]":a.nodeName}function j(a){this._next=this.root=a}function g(a,b){this.node=a;this.offset=b}function l(a){this.code=this[a];this.codeName=a;this.message="DOMException: "+this.codeName}
+var n="undefined",q=a.util;q.areHostMethods(document,["createDocumentFragment","createElement","createTextNode"])||c.fail("document missing a Node creation method");q.isHostMethod(document,"getElementsByTagName")||c.fail("document missing getElementsByTagName method");var t=document.createElement("div");q.areHostMethods(t,["insertBefore","appendChild","cloneNode"])||c.fail("Incomplete Element implementation");t=document.createTextNode("test");q.areHostMethods(t,["splitText","deleteData","insertData",
+"appendData","cloneNode"])||c.fail("Incomplete Text Node implementation");var o=function(a,b){for(var c=a.length;c--;)if(a[c]===b)return!0;return!1};j.prototype={_current:null,hasNext:function(){return!!this._next},next:function(){var a=this._current=this._next,b;if(this._current){b=a.firstChild;if(!b)for(b=null;a!==this.root&&!(b=a.nextSibling);)a=a.parentNode;this._next=b}return this._current},detach:function(){this._current=this._next=this.root=null}};g.prototype={equals:function(a){return this.node===
+a.node&this.offset==a.offset},inspect:function(){return"[DomPosition("+k(this.node)+":"+this.offset+")]"}};l.prototype={INDEX_SIZE_ERR:1,HIERARCHY_REQUEST_ERR:3,WRONG_DOCUMENT_ERR:4,NO_MODIFICATION_ALLOWED_ERR:7,NOT_FOUND_ERR:8,NOT_SUPPORTED_ERR:9,INVALID_STATE_ERR:11};l.prototype.toString=function(){return this.message};a.dom={arrayContains:o,getNodeIndex:b,getCommonAncestor:d,isAncestorOf:function(a,b,c){for(b=c?b:b.parentNode;b;)if(b===a)return!0;else b=b.parentNode;return!1},getClosestAncestorIn:e,
+isCharacterDataNode:h,insertAfter:f,splitDataNode:function(a,b){var c;a.nodeType==3?c=a.splitText(b):(c=a.cloneNode(),c.deleteData(0,b),a.deleteData(0,a.length-b),f(c,a));return c},getDocument:i,getWindow:function(a){a=i(a);if(typeof a.defaultView!=n)return a.defaultView;else if(typeof a.parentWindow!=n)return a.parentWindow;else throw Error("Cannot get a window object for node");},getIframeWindow:function(a){if(typeof a.contentWindow!=n)return a.contentWindow;else if(typeof a.contentDocument!=n)return a.contentDocument.defaultView;
+else throw Error("getIframeWindow: No Window object found for iframe element");},getIframeDocument:function(a){if(typeof a.contentDocument!=n)return a.contentDocument;else if(typeof a.contentWindow!=n)return a.contentWindow.document;else throw Error("getIframeWindow: No Document object found for iframe element");},getBody:function(a){return q.isHostObject(a,"body")?a.body:a.getElementsByTagName("body")[0]},comparePoints:function(a,c,g,f){var j;if(a==g)return c===f?0:c<f?-1:1;else if(j=e(g,a,!0))return c<=
+b(j)?-1:1;else if(j=e(a,g,!0))return b(j)<f?-1:1;else if(c=d(a,g),a=a===c?c:e(a,c,!0),g=g===c?c:e(g,c,!0),a===g)throw Error("comparePoints got to case 4 and childA and childB are the same!");else{for(c=c.firstChild;c;){if(c===a)return-1;else if(c===g)return 1;c=c.nextSibling}throw Error("Should not be here!");}},inspectNode:k,createIterator:function(a){return new j(a)},DomPosition:g};a.DOMException=l});
+rangy.createModule("DomRange",function(a){function c(a,b){this.range=a;this.clonePartiallySelectedTextNodes=b;if(!a.collapsed){this.sc=a.startContainer;this.so=a.startOffset;this.ec=a.endContainer;this.eo=a.endOffset;var c=a.commonAncestorContainer;this.sc===this.ec&&m.isCharacterDataNode(this.sc)?(this.isSingleCharacterDataNode=!0,this._first=this._last=this._next=this.sc):(this._first=this._next=this.sc===c&&!m.isCharacterDataNode(this.sc)?this.sc.childNodes[this.so]:m.getClosestAncestorIn(this.sc,
+c,!0),this._last=this.ec===c&&!m.isCharacterDataNode(this.ec)?this.ec.childNodes[this.eo-1]:m.getClosestAncestorIn(this.ec,c,!0))}}function b(a){this.code=this[a];this.codeName=a;this.message="RangeException: "+this.codeName}function d(a){return m.getDocument(a.startContainer)}function e(a,b,c){if(b=a._listeners[b])for(var g=0,f=b.length;g<f;++g)b[g].call(a,{target:a,args:c})}function h(a){return new K(a.parentNode,m.getNodeIndex(a))}function f(a){return new K(a.parentNode,m.getNodeIndex(a)+1)}function i(a){return m.isCharacterDataNode(a)?
+a.length:a.childNodes?a.childNodes.length:0}function k(a,b,c){var g=a.nodeType==11?a.firstChild:a;m.isCharacterDataNode(b)?c==b.length?m.insertAfter(a,b):b.parentNode.insertBefore(a,c==0?b:m.splitDataNode(b,c)):c>=b.childNodes.length?b.appendChild(a):b.insertBefore(a,b.childNodes[c]);return g}function j(a){for(var b,c,g=d(a.range).createDocumentFragment();c=a.next();){b=a.isPartiallySelectedSubtree();c=c.cloneNode(!b);b&&(b=a.getSubtreeIterator(),c.appendChild(j(b)),b.detach(!0));if(c.nodeType==10)throw new D("HIERARCHY_REQUEST_ERR");
+g.appendChild(c)}return g}function g(a,b,c){for(var f,d,c=c||{stop:!1};f=a.next();)if(a.isPartiallySelectedSubtree())if(b(f)===!1){c.stop=!0;break}else{if(f=a.getSubtreeIterator(),g(f,b,c),f.detach(!0),c.stop)break}else for(f=m.createIterator(f);d=f.next();)if(b(d)===!1){c.stop=!0;return}}function l(a){for(var b;a.next();)a.isPartiallySelectedSubtree()?(b=a.getSubtreeIterator(),l(b),b.detach(!0)):a.remove()}function n(a){for(var b,c=d(a.range).createDocumentFragment(),g;b=a.next();){a.isPartiallySelectedSubtree()?
+(b=b.cloneNode(!1),g=a.getSubtreeIterator(),b.appendChild(n(g)),g.detach(!0)):a.remove();if(b.nodeType==10)throw new D("HIERARCHY_REQUEST_ERR");c.appendChild(b)}return c}function q(a,b,f){var d=!(!b||!b.length),j,e=!!f;d&&(j=RegExp("^("+b.join("|")+")$"));var l=[];g(new c(a,!1),function(a){(!d||j.test(a.nodeType))&&(!e||f(a))&&l.push(a)});return l}function t(a){return"["+(typeof a.getName=="undefined"?"Range":a.getName())+"("+m.inspectNode(a.startContainer)+":"+a.startOffset+", "+m.inspectNode(a.endContainer)+
+":"+a.endOffset+")]"}function o(a,b,c){this.nodes=q(a,b,c);this._next=this.nodes[0];this._pointer=0}function w(a,b){return a.nodeType!=3&&(m.isAncestorOf(a,b.startContainer,!0)||m.isAncestorOf(a,b.endContainer,!0))}function r(a){return function(b,c){for(var g,f=c?b:b.parentNode;f;){g=f.nodeType;if(m.arrayContains(a,g))return f;f=f.parentNode}return null}}function s(a){for(var b;b=a.parentNode;)a=b;return a}function x(a,c){if(U(a,c))throw new b("INVALID_NODE_TYPE_ERR");}function p(a){if(!a.startContainer)throw new D("INVALID_STATE_ERR");
+}function v(a,c){if(!m.arrayContains(c,a.nodeType))throw new b("INVALID_NODE_TYPE_ERR");}function B(a,b){if(b<0||b>(m.isCharacterDataNode(a)?a.length:a.childNodes.length))throw new D("INDEX_SIZE_ERR");}function A(a,b){if(I(a,!0)!==I(b,!0))throw new D("WRONG_DOCUMENT_ERR");}function F(a){if(V(a,!0))throw new D("NO_MODIFICATION_ALLOWED_ERR");}function H(a,b){if(!a)throw new D(b);}function y(a){if(!I(a.startContainer,!0)||!I(a.endContainer,!0)||!(a.startOffset<=(m.isCharacterDataNode(a.startContainer)?
+a.startContainer.length:a.startContainer.childNodes.length))||!(a.endOffset<=(m.isCharacterDataNode(a.endContainer)?a.endContainer.length:a.endContainer.childNodes.length)))throw Error("Range Range error: Range is no longer valid after DOM mutation ("+a.inspect()+")");}function G(a){a.START_TO_START=L;a.START_TO_END=O;a.END_TO_END=W;a.END_TO_START=P;a.NODE_BEFORE=Q;a.NODE_AFTER=R;a.NODE_BEFORE_AND_AFTER=S;a.NODE_INSIDE=M}function u(a){G(a);G(a.prototype)}function E(a,e,K){function r(a,b){return function(c){p(this);
+v(c,T);v(s(c),X);c=(a?h:f)(c);(b?I:C)(this,c.node,c.offset)}}function I(a,b,c){var g=a.endContainer,f=a.endOffset;if(b!==a.startContainer||c!==this.startOffset){if(s(b)!=s(g)||m.comparePoints(b,c,g,f)==1)g=b,f=c;e(a,b,c,g,f)}}function C(a,b,c){var g=a.startContainer,f=a.startOffset;if(b!==a.endContainer||c!==this.endOffset){if(s(b)!=s(g)||m.comparePoints(b,c,g,f)==-1)g=b,f=c;e(a,g,f,b,c)}}function G(a,b,c){(b!==a.startContainer||c!==this.startOffset||b!==a.endContainer||c!==this.endOffset)&&e(a,b,
+c,b,c)}function E(a){return function(){p(this);y(this);var b=this.startContainer,d=this.startOffset,j=this.commonAncestorContainer,l=new c(this,!0);if(b!==j)b=m.getClosestAncestorIn(b,j,!0),d=f(b),b=d.node,d=d.offset;g(l,F);l.reset();j=a(l);l.detach();e(this,b,d,b,d);return j}}a.prototype={attachListener:function(a,b){this._listeners[a].push(b)},setStart:function(a,b){p(this);x(a,!0);B(a,b);I(this,a,b)},setEnd:function(a,b){p(this);x(a,!0);B(a,b);C(this,a,b)},setStartBefore:r(!0,!0),setStartAfter:r(!1,
+!0),setEndBefore:r(!0,!1),setEndAfter:r(!1,!1),collapse:function(a){p(this);y(this);a?e(this,this.startContainer,this.startOffset,this.startContainer,this.startOffset):e(this,this.endContainer,this.endOffset,this.endContainer,this.endOffset)},selectNodeContents:function(a){p(this);x(a,!0);e(this,a,0,a,i(a))},selectNode:function(a){p(this);x(a,!1);v(a,T);var b=h(a),a=f(a);e(this,b.node,b.offset,a.node,a.offset)},compareBoundaryPoints:function(a,b){p(this);y(this);A(this.startContainer,b.startContainer);
+var c=a==P||a==L?"start":"end",g=a==O||a==L?"start":"end";return m.comparePoints(this[c+"Container"],this[c+"Offset"],b[g+"Container"],b[g+"Offset"])},insertNode:function(a){p(this);y(this);v(a,Y);F(this.startContainer);if(m.isAncestorOf(a,this.startContainer,!0))throw new D("HIERARCHY_REQUEST_ERR");this.setStartBefore(k(a,this.startContainer,this.startOffset))},cloneContents:function(){p(this);y(this);var a,b;if(this.collapsed)return d(this).createDocumentFragment();else{if(this.startContainer===
+this.endContainer&&m.isCharacterDataNode(this.startContainer))return a=this.startContainer.cloneNode(!0),a.data=a.data.slice(this.startOffset,this.endOffset),b=d(this).createDocumentFragment(),b.appendChild(a),b;else b=new c(this,!0),a=j(b),b.detach();return a}},extractContents:E(n),deleteContents:E(l),canSurroundContents:function(){p(this);y(this);F(this.startContainer);F(this.endContainer);var a=new c(this,!0),b=a._first&&w(a._first,this)||a._last&&w(a._last,this);a.detach();return!b},surroundContents:function(a){v(a,
+Z);if(!this.canSurroundContents())throw new b("BAD_BOUNDARYPOINTS_ERR");var c=this.extractContents();if(a.hasChildNodes())for(;a.lastChild;)a.removeChild(a.lastChild);k(a,this.startContainer,this.startOffset);a.appendChild(c);this.selectNode(a)},cloneRange:function(){p(this);y(this);for(var a=new z(d(this)),b=N.length,c;b--;)c=N[b],a[c]=this[c];return a},detach:function(){K(this)},toString:function(){p(this);y(this);var a=this.startContainer;if(a===this.endContainer&&m.isCharacterDataNode(a))return a.nodeType==
+3||a.nodeType==4?a.data.slice(this.startOffset,this.endOffset):"";else{var b=[],a=new c(this,!0);g(a,function(a){(a.nodeType==3||a.nodeType==4)&&b.push(a.data)});a.detach();return b.join("")}},compareNode:function(a){p(this);y(this);var b=a.parentNode,c=m.getNodeIndex(a);if(!b)throw new D("NOT_FOUND_ERR");a=this.comparePoint(b,c);b=this.comparePoint(b,c+1);return a<0?b>0?S:Q:b>0?R:M},comparePoint:function(a,b){p(this);y(this);H(a,"HIERARCHY_REQUEST_ERR");A(a,this.startContainer);if(m.comparePoints(a,
+b,this.startContainer,this.startOffset)<0)return-1;else if(m.comparePoints(a,b,this.endContainer,this.endOffset)>0)return 1;return 0},createContextualFragment:function(a){p(this);var b=d(this),c=b.createElement("div");c.innerHTML=a;for(a=b.createDocumentFragment();b=c.firstChild;)a.appendChild(b);return a},intersectsNode:function(a,b){p(this);y(this);H(a,"NOT_FOUND_ERR");if(m.getDocument(a)!==d(this))return!1;var c=a.parentNode,g=m.getNodeIndex(a);H(c,"NOT_FOUND_ERR");var f=m.comparePoints(c,g,this.endContainer,
+this.endOffset),c=m.comparePoints(c,g+1,this.startContainer,this.startOffset);return b?f<=0&&c>=0:f<0&&c>0},isPointInRange:function(a,b){p(this);y(this);H(a,"HIERARCHY_REQUEST_ERR");A(a,this.startContainer);return m.comparePoints(a,b,this.startContainer,this.startOffset)>=0&&m.comparePoints(a,b,this.endContainer,this.endOffset)<=0},intersectsRange:function(a){p(this);y(this);if(d(a)!=d(this))throw new D("WRONG_DOCUMENT_ERR");return m.comparePoints(this.startContainer,this.startOffset,a.endContainer,
+a.endOffset)<0&&m.comparePoints(this.endContainer,this.endOffset,a.startContainer,a.startOffset)>0},intersection:function(a){if(this.intersectsRange(a)){var b=m.comparePoints(this.startContainer,this.startOffset,a.startContainer,a.startOffset),c=m.comparePoints(this.endContainer,this.endOffset,a.endContainer,a.endOffset),g=this.cloneRange();b==-1&&g.setStart(a.startContainer,a.startOffset);c==1&&g.setEnd(a.endContainer,a.endOffset);return g}return null},containsNode:function(a,b){return b?this.intersectsNode(a,
+!1):this.compareNode(a)==M},containsNodeContents:function(a){return this.comparePoint(a,0)>=0&&this.comparePoint(a,i(a))<=0},splitBoundaries:function(){p(this);y(this);var a=this.startContainer,b=this.startOffset,c=this.endContainer,g=this.endOffset,f=a===c;m.isCharacterDataNode(c)&&g<c.length&&m.splitDataNode(c,g);m.isCharacterDataNode(a)&&b>0&&(a=m.splitDataNode(a,b),f&&(g-=b,c=a),b=0);e(this,a,b,c,g)},normalizeBoundaries:function(){p(this);y(this);var a=this.startContainer,b=this.startOffset,c=
+this.endContainer,g=this.endOffset,f=function(a){var b=a.nextSibling;if(b&&b.nodeType==a.nodeType)c=a,g=a.length,a.appendData(b.data),b.parentNode.removeChild(b)},d=function(f){var d=f.previousSibling;if(d&&d.nodeType==f.nodeType)a=f,b=d.length,f.insertData(0,d.data),d.parentNode.removeChild(d),a==c&&(g+=b,c=a)},j=!0;m.isCharacterDataNode(c)?c.length==g&&f(c):(g>0&&(j=c.childNodes[g-1])&&m.isCharacterDataNode(j)&&f(j),j=!this.collapsed);j?m.isCharacterDataNode(a)?b==0&&d(a):b<a.childNodes.length&&
+(f=a.childNodes[b])&&m.isCharacterDataNode(f)&&d(f):(a=c,b=g);e(this,a,b,c,g)},createNodeIterator:function(a,b){p(this);y(this);return new o(this,a,b)},getNodes:function(a,b){p(this);y(this);return q(this,a,b)},collapseToPoint:function(a,b){p(this);y(this);x(a,!0);B(a,b);G(this,a,b)},collapseBefore:function(a){p(this);this.setEndBefore(a);this.collapse(!1)},collapseAfter:function(a){p(this);this.setStartAfter(a);this.collapse(!0)},getName:function(){return"DomRange"},equals:function(a){return z.rangesEqual(this,
+a)},inspect:function(){return t(this)}};u(a)}function J(a){a.collapsed=a.startContainer===a.endContainer&&a.startOffset===a.endOffset;a.commonAncestorContainer=a.collapsed?a.startContainer:m.getCommonAncestor(a.startContainer,a.endContainer)}function C(a,b,c,g,f){var d=a.startContainer!==b||a.startOffset!==c,j=a.endContainer!==g||a.endOffset!==f;a.startContainer=b;a.startOffset=c;a.endContainer=g;a.endOffset=f;J(a);e(a,"boundarychange",{startMoved:d,endMoved:j})}function z(a){this.startContainer=
+a;this.startOffset=0;this.endContainer=a;this.endOffset=0;this._listeners={boundarychange:[],detach:[]};J(this)}a.requireModules(["DomUtil"]);var m=a.dom,K=m.DomPosition,D=a.DOMException;c.prototype={_current:null,_next:null,_first:null,_last:null,isSingleCharacterDataNode:!1,reset:function(){this._current=null;this._next=this._first},hasNext:function(){return!!this._next},next:function(){var a=this._current=this._next;if(a)this._next=a!==this._last?a.nextSibling:null,m.isCharacterDataNode(a)&&this.clonePartiallySelectedTextNodes&&
+(a===this.ec&&(a=a.cloneNode(!0)).deleteData(this.eo,a.length-this.eo),this._current===this.sc&&(a=a.cloneNode(!0)).deleteData(0,this.so));return a},remove:function(){var a=this._current,b,c;m.isCharacterDataNode(a)&&(a===this.sc||a===this.ec)?(b=a===this.sc?this.so:0,c=a===this.ec?this.eo:a.length,b!=c&&a.deleteData(b,c-b)):a.parentNode&&a.parentNode.removeChild(a)},isPartiallySelectedSubtree:function(){return w(this._current,this.range)},getSubtreeIterator:function(){var a;if(this.isSingleCharacterDataNode)a=
+this.range.cloneRange(),a.collapse();else{a=new z(d(this.range));var b=this._current,g=b,f=0,j=b,e=i(b);if(m.isAncestorOf(b,this.sc,!0))g=this.sc,f=this.so;if(m.isAncestorOf(b,this.ec,!0))j=this.ec,e=this.eo;C(a,g,f,j,e)}return new c(a,this.clonePartiallySelectedTextNodes)},detach:function(a){a&&this.range.detach();this.range=this._current=this._next=this._first=this._last=this.sc=this.so=this.ec=this.eo=null}};b.prototype={BAD_BOUNDARYPOINTS_ERR:1,INVALID_NODE_TYPE_ERR:2};b.prototype.toString=function(){return this.message};
+o.prototype={_current:null,hasNext:function(){return!!this._next},next:function(){this._current=this._next;this._next=this.nodes[++this._pointer];return this._current},detach:function(){this._current=this._next=this.nodes=null}};var T=[1,3,4,5,7,8,10],X=[2,9,11],Y=[1,3,4,5,7,8,10,11],Z=[1,3,4,5,7,8],I=r([9,11]),V=r([5,6,10,12]),U=r([6,10,12]),N=["startContainer","startOffset","endContainer","endOffset","collapsed","commonAncestorContainer"],L=0,O=1,W=2,P=3,Q=0,R=1,S=2,M=3;E(z,C,function(a){p(a);a.startContainer=
+a.startOffset=a.endContainer=a.endOffset=null;a.collapsed=a.commonAncestorContainer=null;e(a,"detach",null);a._listeners=null});z.fromRange=function(a){var b=new z(d(a));C(b,a.startContainer,a.startOffset,a.endContainer,a.endOffset);return b};z.rangeProperties=N;z.RangeIterator=c;z.copyComparisonConstants=u;z.createPrototypeRange=E;z.inspect=t;z.getRangeDocument=d;z.rangesEqual=function(a,b){return a.startContainer===b.startContainer&&a.startOffset===b.startOffset&&a.endContainer===b.endContainer&&
+a.endOffset===b.endOffset};z.getEndOffset=i;a.DomRange=z;a.RangeException=b});
+rangy.createModule("WrappedRange",function(a){function c(a,b,c,f){var d=a.duplicate();d.collapse(c);var i=d.parentElement();e.isAncestorOf(b,i,!0)||(i=b);if(!i.canHaveHTML)return new h(i.parentNode,e.getNodeIndex(i));var b=e.getDocument(i).createElement("span"),t,o=c?"StartToStart":"StartToEnd";do i.insertBefore(b,b.previousSibling),d.moveToElementText(b);while((t=d.compareEndPoints(o,a))>0&&b.previousSibling);o=b.nextSibling;if(t==-1&&o&&e.isCharacterDataNode(o)){d.setEndPoint(c?"EndToStart":"EndToEnd",
+a);if(/[\r\n]/.test(o.data)){i=d.duplicate();c=i.text.replace(/\r\n/g,"\r").length;for(c=i.moveStart("character",c);i.compareEndPoints("StartToEnd",i)==-1;)c++,i.moveStart("character",1)}else c=d.text.length;i=new h(o,c)}else o=(f||!c)&&b.previousSibling,i=(c=(f||c)&&b.nextSibling)&&e.isCharacterDataNode(c)?new h(c,0):o&&e.isCharacterDataNode(o)?new h(o,o.length):new h(i,e.getNodeIndex(b));b.parentNode.removeChild(b);return i}function b(a,b){var c,f,d=a.offset,i=e.getDocument(a.node),h=i.body.createTextRange(),
+o=e.isCharacterDataNode(a.node);o?(c=a.node,f=c.parentNode):(c=a.node.childNodes,c=d<c.length?c[d]:null,f=a.node);i=i.createElement("span");i.innerHTML="&#feff;";c?f.insertBefore(i,c):f.appendChild(i);h.moveToElementText(i);h.collapse(!b);f.removeChild(i);if(o)h[b?"moveStart":"moveEnd"]("character",d);return h}a.requireModules(["DomUtil","DomRange"]);var d,e=a.dom,h=e.DomPosition,f=a.DomRange;if(a.features.implementsDomRange)(function(){function a(b){for(var f=c.length,d;f--;)d=c[f],b[d]=b.nativeRange[d]}
+var b,c=f.rangeProperties,i;d=function(b){if(!b)throw Error("Range must be specified");this.nativeRange=b;a(this)};f.createPrototypeRange(d,function(a,b,c,g,f){var d=a.startContainer!==b||a.startOffset!=c;(a.endContainer!==g||a.endOffset!=f)&&a.setEnd(g,f);d&&a.setStart(b,c)},function(a){a.nativeRange.detach();a.detached=!0;for(var b=c.length,f;b--;)f=c[b],a[f]=null});b=d.prototype;b.selectNode=function(b){this.nativeRange.selectNode(b);a(this)};b.deleteContents=function(){this.nativeRange.deleteContents();
+a(this)};b.extractContents=function(){var b=this.nativeRange.extractContents();a(this);return b};b.cloneContents=function(){return this.nativeRange.cloneContents()};b.surroundContents=function(b){this.nativeRange.surroundContents(b);a(this)};b.collapse=function(b){this.nativeRange.collapse(b);a(this)};b.cloneRange=function(){return new d(this.nativeRange.cloneRange())};b.refresh=function(){a(this)};b.toString=function(){return this.nativeRange.toString()};var h=document.createTextNode("test");e.getBody(document).appendChild(h);
+var q=document.createRange();q.setStart(h,0);q.setEnd(h,0);try{q.setStart(h,1),b.setStart=function(b,c){this.nativeRange.setStart(b,c);a(this)},b.setEnd=function(b,c){this.nativeRange.setEnd(b,c);a(this)},i=function(b){return function(c){this.nativeRange[b](c);a(this)}}}catch(t){b.setStart=function(b,c){try{this.nativeRange.setStart(b,c)}catch(g){this.nativeRange.setEnd(b,c),this.nativeRange.setStart(b,c)}a(this)},b.setEnd=function(b,c){try{this.nativeRange.setEnd(b,c)}catch(g){this.nativeRange.setStart(b,
+c),this.nativeRange.setEnd(b,c)}a(this)},i=function(b,c){return function(g){try{this.nativeRange[b](g)}catch(f){this.nativeRange[c](g),this.nativeRange[b](g)}a(this)}}}b.setStartBefore=i("setStartBefore","setEndBefore");b.setStartAfter=i("setStartAfter","setEndAfter");b.setEndBefore=i("setEndBefore","setStartBefore");b.setEndAfter=i("setEndAfter","setStartAfter");q.selectNodeContents(h);b.selectNodeContents=q.startContainer==h&&q.endContainer==h&&q.startOffset==0&&q.endOffset==h.length?function(b){this.nativeRange.selectNodeContents(b);
+a(this)}:function(a){this.setStart(a,0);this.setEnd(a,f.getEndOffset(a))};q.selectNodeContents(h);q.setEnd(h,3);i=document.createRange();i.selectNodeContents(h);i.setEnd(h,4);i.setStart(h,2);b.compareBoundaryPoints=q.compareBoundaryPoints(q.START_TO_END,i)==-1&&q.compareBoundaryPoints(q.END_TO_START,i)==1?function(a,b){b=b.nativeRange||b;if(a==b.START_TO_END)a=b.END_TO_START;else if(a==b.END_TO_START)a=b.START_TO_END;return this.nativeRange.compareBoundaryPoints(a,b)}:function(a,b){return this.nativeRange.compareBoundaryPoints(a,
+b.nativeRange||b)};e.getBody(document).removeChild(h);q.detach();i.detach()})();else if(a.features.implementsTextRange){d=function(a){this.textRange=a;this.refresh()};d.prototype=new f(document);d.prototype.refresh=function(){var a,b,g=this.textRange;a=g.parentElement();var f=g.duplicate();f.collapse(!0);b=f.parentElement();f=g.duplicate();f.collapse(!1);g=f.parentElement();b=b==g?b:e.getCommonAncestor(b,g);b=b==a?b:e.getCommonAncestor(a,b);this.textRange.compareEndPoints("StartToEnd",this.textRange)==
+0?b=a=c(this.textRange,b,!0,!0):(a=c(this.textRange,b,!0,!1),b=c(this.textRange,b,!1,!1));this.setStart(a.node,a.offset);this.setEnd(b.node,b.offset)};d.rangeToTextRange=function(a){if(a.collapsed)return b(new h(a.startContainer,a.startOffset),!0,!0);else{var c=b(new h(a.startContainer,a.startOffset),!0,!1),g=b(new h(a.endContainer,a.endOffset),!1,!1),a=e.getDocument(a.startContainer).body.createTextRange();a.setEndPoint("StartToStart",c);a.setEndPoint("EndToEnd",g);return a}};f.copyComparisonConstants(d);
+var i=function(){return this}();if(typeof i.Range=="undefined")i.Range=d}d.prototype.getName=function(){return"WrappedRange"};a.WrappedRange=d;a.createNativeRange=function(b){b=b||document;if(a.features.implementsDomRange)return b.createRange();else if(a.features.implementsTextRange)return b.body.createTextRange()};a.createRange=function(b){return new d(a.createNativeRange(b||document))};a.createRangyRange=function(a){return new f(a||document)};a.createIframeRange=function(b){return a.createRange(e.getIframeDocument(b))};
+a.createIframeRangyRange=function(b){return a.createRangyRange(e.getIframeDocument(b))};a.addCreateMissingNativeApiListener(function(b){b=b.document;if(typeof b.createRange=="undefined")b.createRange=function(){return a.createRange(this)};b=b=null})});
+rangy.createModule("WrappedSelection",function(a,c){function b(a,b,c){var g=c?"end":"start",c=c?"start":"end";a.anchorNode=b[g+"Container"];a.anchorOffset=b[g+"Offset"];a.focusNode=b[c+"Container"];a.focusOffset=b[c+"Offset"]}function d(a){a.anchorNode=a.focusNode=null;a.anchorOffset=a.focusOffset=0;a.rangeCount=0;a.isCollapsed=!0;a._ranges.length=0}function e(b){var c;if(b instanceof n){if(c=b._selectionNativeRange,!c)c=a.createNativeRange(g.getDocument(b.startContainer)),c.setEnd(b.endContainer,
+b.endOffset),c.setStart(b.startContainer,b.startOffset),b._selectionNativeRange=c,b.attachListener("detach",function(){this._selectionNativeRange=null})}else b instanceof q?c=b.nativeRange:window.Range&&b instanceof Range&&(c=b);return c}function h(a){var b=a.getNodes(),c;a:if(!b.length||b[0].nodeType!=1)c=!1;else{c=1;for(var f=b.length;c<f;++c)if(!g.isAncestorOf(b[0],b[c])){c=!1;break a}c=!0}if(!c)throw Error("getSingleElementFromRange: range "+a.inspect()+" did not consist of a single element");
+return b[0]}function f(c){c._ranges.length=0;if(c.nativeSelection.type=="None")d(c);else{var f=c.nativeSelection.createRange();c.rangeCount=f.length;for(var j,e=g.getDocument(f.item(0)),i=0;i<c.rangeCount;++i)j=a.createRange(e),j.selectNode(f.item(i)),c._ranges.push(j);c.isCollapsed=c.rangeCount==1&&c._ranges[0].collapsed;b(c,c._ranges[c.rangeCount-1],!1)}}function i(a){this.nativeSelection=a;this._ranges=[];this.refresh()}function k(a,b){if(a.anchorNode&&g.getDocument(a.anchorNode)!==g.getDocument(b))throw new t("WRONG_DOCUMENT_ERR");
+}function j(a){var b=[],c=new o(a.anchorNode,a.anchorOffset),g=new o(a.focusNode,a.focusOffset),f=typeof a.getName=="function"?a.getName():"Selection";if(typeof a.rangeCount!="undefined")for(var d=0,j=a.rangeCount;d<j;++d)b[d]=n.inspect(a.getRangeAt(d));return"["+f+"(Ranges: "+b.join(", ")+")(anchor: "+c.inspect()+", focus: "+g.inspect()+"]"}a.requireModules(["DomUtil","DomRange","WrappedRange"]);a.config.checkSelectionRanges=!0;var g=a.dom,l=a.util,n=a.DomRange,q=a.WrappedRange,t=a.DOMException,
+o=g.DomPosition,w,r;a.util.isHostMethod(window,"getSelection")?w=function(a){return(a||window).getSelection()}:a.util.isHostObject(document,"selection")?w=function(a){return(a||window).document.selection}:c.fail("No means of obtaining a selection object");a.getNativeSelection=w;var s=w(),x=a.createNativeRange(document),p=g.getBody(document),v=l.areHostObjects(s,l.areHostProperties(s,["anchorOffset","focusOffset"]));a.features.selectionHasAnchorAndFocus=v;var B=l.isHostMethod(s,"extend");a.features.selectionHasExtend=
+B;var A=typeof s.rangeCount=="number";a.features.selectionHasRangeCount=A;var F=!1,H=!0;l.areHostMethods(s,["addRange","getRangeAt","removeAllRanges"])&&typeof s.rangeCount=="number"&&a.features.implementsDomRange&&function(){var b=p.appendChild(document.createTextNode("One")),c=p.appendChild(document.createTextNode("Two")),g=a.createNativeRange(document);g.selectNodeContents(b);var f=a.createNativeRange(document);f.selectNodeContents(c);s.removeAllRanges();s.addRange(g);s.addRange(f);F=s.rangeCount==
+2;s.removeAllRanges();b.parentNode.removeChild(b);c.parentNode.removeChild(c);b=document.createElement("p");b.contentEditable=!1;c=b.appendChild(document.createTextNode("test"));p.appendChild(b);g=a.createRange();g.collapseToPoint(c,1);s.addRange(g.nativeRange);H=s.rangeCount==1;s.removeAllRanges();p.removeChild(b)}();a.features.selectionSupportsMultipleRanges=F;a.features.collapsedNonEditableSelectionsSupported=H;var y=l.isHostProperty(s,"type"),G=!1,u;p&&l.isHostMethod(p,"createControlRange")&&
+(u=p.createControlRange(),l.areHostProperties(u,["item","add"])&&(G=!0));a.features.implementsControlRange=G;r=v?function(a){return a.anchorNode===a.focusNode&&a.anchorOffset===a.focusOffset}:function(a){return a.rangeCount?a.getRangeAt(a.rangeCount-1).collapsed:!1};var E;l.isHostMethod(s,"getRangeAt")?E=function(a,b){try{return a.getRangeAt(b)}catch(c){return null}}:v&&(E=function(b){var c=g.getDocument(b.anchorNode),c=a.createRange(c);c.setStart(b.anchorNode,b.anchorOffset);c.setEnd(b.focusNode,
+b.focusOffset);c.collapsed!==this.isCollapsed&&(c.setStart(b.focusNode,b.focusOffset),c.setEnd(b.anchorNode,b.anchorOffset));return c});a.getSelection=function(a){var a=a||window,b=a._rangySelection;b?(b.nativeSelection=w(a),b.refresh()):(b=new i(w(a)),a._rangySelection=b);return b};a.getIframeSelection=function(b){return a.getSelection(g.getIframeWindow(b))};u=i.prototype;if(v&&l.areHostMethods(s,["removeAllRanges","addRange"])){u.removeAllRanges=function(){this.nativeSelection.removeAllRanges();
+d(this)};var J=function(b,c){var g=n.getRangeDocument(c),g=a.createRange(g);g.collapseToPoint(c.endContainer,c.endOffset);b.nativeSelection.addRange(e(g));b.nativeSelection.extend(c.startContainer,c.startOffset);b.refresh()};u.addRange=A?function(c,g){if(g&&B)J(this,c);else{var f;F?f=this.rangeCount:(this.removeAllRanges(),f=0);this.nativeSelection.addRange(e(c));this.rangeCount=this.nativeSelection.rangeCount;this.rangeCount==f+1?(a.config.checkSelectionRanges&&(f=E(this.nativeSelection,this.rangeCount-
+1))&&!n.rangesEqual(f,c)&&(c=new q(f)),this._ranges[this.rangeCount-1]=c,b(this,c,m(this.nativeSelection)),this.isCollapsed=r(this)):this.refresh()}}:function(a,b){b&&B?J(this,a):(this.nativeSelection.addRange(e(a)),this.refresh())};u.setRanges=function(a){this.removeAllRanges();for(var b=0,c=a.length;b<c;++b)this.addRange(a[b])}}else if(l.isHostMethod(s,"empty")&&l.isHostMethod(x,"select")&&y&&G)u.removeAllRanges=function(){try{if(this.nativeSelection.empty(),this.nativeSelection.type!="None"){var a;
+if(this.anchorNode)a=g.getDocument(this.anchorNode);else if(this.nativeSelection.type=="Control"){var b=this.nativeSelection.createRange();b.length&&(a=g.getDocument(b.item(0)).body.createTextRange())}a&&(a.body.createTextRange().select(),this.nativeSelection.empty())}}catch(c){}d(this)},u.addRange=function(a){if(this.nativeSelection.type=="Control"){for(var c=this.nativeSelection.createRange(),a=h(a),d=g.getDocument(c.item(0)),d=g.getBody(d).createControlRange(),j=0,e=c.length;j<e;++j)d.add(c.item(j));
+try{d.add(a)}catch(i){throw Error("addRange(): Element within the specified Range could not be added to control selection (does it have layout?)");}d.select();f(this)}else q.rangeToTextRange(a).select(),this._ranges[0]=a,this.rangeCount=1,this.isCollapsed=this._ranges[0].collapsed,b(this,a,!1)},u.setRanges=function(a){this.removeAllRanges();var b=a.length;if(b>1){for(var c=g.getDocument(a[0].startContainer),c=g.getBody(c).createControlRange(),d=0,j;d<b;++d){j=h(a[d]);try{c.add(j)}catch(e){throw Error("setRanges(): Element within the one of the specified Ranges could not be added to control selection (does it have layout?)");
+}}c.select();f(this)}else b&&this.addRange(a[0])};else return c.fail("No means of selecting a Range or TextRange was found"),!1;u.getRangeAt=function(a){if(a<0||a>=this.rangeCount)throw new t("INDEX_SIZE_ERR");else return this._ranges[a]};var C;if(l.isHostMethod(s,"getRangeAt")&&typeof s.rangeCount=="number")C=function(c){c._ranges.length=c.rangeCount=c.nativeSelection.rangeCount;if(c.rangeCount){for(var g=0,f=c.rangeCount;g<f;++g)c._ranges[g]=new a.WrappedRange(c.nativeSelection.getRangeAt(g));b(c,
+c._ranges[c.rangeCount-1],m(c.nativeSelection));c.isCollapsed=r(c)}else d(c)};else if(v&&typeof s.isCollapsed=="boolean"&&typeof x.collapsed=="boolean"&&a.features.implementsDomRange)C=function(a){var b;b=a.nativeSelection;b.anchorNode?(b=E(b,0),a._ranges=[b],a.rangeCount=1,b=a.nativeSelection,a.anchorNode=b.anchorNode,a.anchorOffset=b.anchorOffset,a.focusNode=b.focusNode,a.focusOffset=b.focusOffset,a.isCollapsed=r(a)):d(a)};else if(l.isHostMethod(s,"createRange")&&a.features.implementsTextRange)C=
+function(a){var c=a.nativeSelection.createRange();a.nativeSelection.type=="Control"?f(a):c&&typeof c.text!="undefined"?(c=new q(c),a._ranges=[c],b(a,c,!1),a.rangeCount=1,a.isCollapsed=c.collapsed):d(a)};else return c.fail("No means of obtaining a Range or TextRange from the user's selection was found"),!1;u.refresh=function(a){var b=a?this._ranges.slice(0):null;C(this);if(a){a=b.length;if(a!=this._ranges.length)return!1;for(;a--;)if(!n.rangesEqual(b[a],this._ranges[a]))return!1;return!0}};var z=function(a,
+b){var c=a.getAllRanges(),g=!1;a.removeAllRanges();for(var f=0,j=c.length;f<j;++f)g||b!==c[f]?a.addRange(c[f]):g=!0;a.rangeCount||d(a)};u.removeRange=y&&G?function(a){if(this.nativeSelection.type=="Control"){for(var b=this.nativeSelection.createRange(),a=h(a),c=g.getDocument(b.item(0)),c=g.getBody(c).createControlRange(),d,j=!1,e=0,i=b.length;e<i;++e)d=b.item(e),d!==a||j?c.add(b.item(e)):j=!0;c.select();f(this)}else z(this,a)}:function(a){z(this,a)};var m;v&&a.features.implementsDomRange?(m=function(a){var b=
+!1;a.anchorNode&&(b=g.comparePoints(a.anchorNode,a.anchorOffset,a.focusNode,a.focusOffset)==1);return b},u.isBackwards=function(){return m(this)}):m=u.isBackwards=function(){return!1};u.toString=function(){for(var a=[],b=0,c=this.rangeCount;b<c;++b)a[b]=""+this._ranges[b];return a.join("")};u.collapse=function(b,c){k(this,b);var f=a.createRange(g.getDocument(b));f.collapseToPoint(b,c);this.removeAllRanges();this.addRange(f);this.isCollapsed=!0};u.collapseToStart=function(){if(this.rangeCount){var a=
+this._ranges[0];this.collapse(a.startContainer,a.startOffset)}else throw new t("INVALID_STATE_ERR");};u.collapseToEnd=function(){if(this.rangeCount){var a=this._ranges[this.rangeCount-1];this.collapse(a.endContainer,a.endOffset)}else throw new t("INVALID_STATE_ERR");};u.selectAllChildren=function(b){k(this,b);var c=a.createRange(g.getDocument(b));c.selectNodeContents(b);this.removeAllRanges();this.addRange(c)};u.deleteFromDocument=function(){if(this.rangeCount){var a=this.getAllRanges();this.removeAllRanges();
+for(var b=0,c=a.length;b<c;++b)a[b].deleteContents();this.addRange(a[c-1])}};u.getAllRanges=function(){return this._ranges.slice(0)};u.setSingleRange=function(a){this.setRanges([a])};u.containsNode=function(a,b){for(var c=0,g=this._ranges.length;c<g;++c)if(this._ranges[c].containsNode(a,b))return!0;return!1};u.getName=function(){return"WrappedSelection"};u.inspect=function(){return j(this)};u.detach=function(){this.anchorNode&&(g.getWindow(this.anchorNode)._rangySelection=null)};i.inspect=j;a.Selection=
+i;a.addCreateMissingNativeApiListener(function(b){if(typeof b.getSelection=="undefined")b.getSelection=function(){return a.getSelection(this)};b=null})});var Base=function(){};
+Base.extend=function(a,c){var b=Base.prototype.extend;Base._prototyping=!0;var d=new this;b.call(d,a);d.base=function(){};delete Base._prototyping;var e=d.constructor,h=d.constructor=function(){if(!Base._prototyping)if(this._constructing||this.constructor==h)this._constructing=!0,e.apply(this,arguments),delete this._constructing;else if(arguments[0]!=null)return(arguments[0].extend||b).call(arguments[0],d)};h.ancestor=this;h.extend=this.extend;h.forEach=this.forEach;h.implement=this.implement;h.prototype=
+d;h.toString=this.toString;h.valueOf=function(a){return a=="object"?h:e.valueOf()};b.call(h,c);typeof h.init=="function"&&h.init();return h};
+Base.prototype={extend:function(a,c){if(arguments.length>1){var b=this[a];if(b&&typeof c=="function"&&(!b.valueOf||b.valueOf()!=c.valueOf())&&/\bbase\b/.test(c)){var d=c.valueOf(),c=function(){var a=this.base||Base.prototype.base;this.base=b;var c=d.apply(this,arguments);this.base=a;return c};c.valueOf=function(a){return a=="object"?c:d};c.toString=Base.toString}this[a]=c}else if(a){var e=Base.prototype.extend;!Base._prototyping&&typeof this!="function"&&(e=this.extend||e);for(var h={toSource:null},
+f=["constructor","toString","valueOf"],i=Base._prototyping?0:1;k=f[i++];)a[k]!=h[k]&&e.call(this,k,a[k]);for(var k in a)h[k]||e.call(this,k,a[k])}return this}};
+Base=Base.extend({constructor:function(a){this.extend(a)}},{ancestor:Object,version:"1.1",forEach:function(a,c,b){for(var d in a)this.prototype[d]===void 0&&c.call(b,a[d],d,a)},implement:function(){for(var a=0;a<arguments.length;a++)if(typeof arguments[a]=="function")arguments[a](this.prototype);else this.prototype.extend(arguments[a]);return this},toString:function(){return String(this.valueOf())}});
+wysihtml5.browser=function(){var a=navigator.userAgent,c=document.createElement("div"),b=a.indexOf("MSIE")!==-1&&a.indexOf("Opera")===-1,d=a.indexOf("Gecko")!==-1&&a.indexOf("KHTML")===-1,e=a.indexOf("AppleWebKit/")!==-1,h=a.indexOf("Opera/")!==-1;return{USER_AGENT:a,supported:function(){var a=this.USER_AGENT.toLowerCase(),b="contentEditable"in c,d=document.execCommand&&document.queryCommandSupported&&document.queryCommandState,j=document.querySelector&&document.querySelectorAll,a=a.indexOf("webkit")!==
+-1&&a.indexOf("mobile")!==-1||a.indexOf("opera mobi")!==-1;return b&&d&&j&&!a},supportsSandboxedIframes:function(){return b},throwsMixedContentWarningWhenIframeSrcIsEmpty:function(){return!("querySelector"in document)},displaysCaretInEmptyContentEditableCorrectly:function(){return!d},hasCurrentStyleProperty:function(){return"currentStyle"in c},insertsLineBreaksOnReturn:function(){return d},supportsPlaceholderAttributeOn:function(a){return"placeholder"in a},supportsEvent:function(a){var b;if(!(b="on"+
+a in c))c.setAttribute("on"+a,"return;"),b=typeof c["on"+a]==="function";return b},supportsEventsInIframeCorrectly:function(){return!h},firesOnDropOnlyWhenOnDragOverIsCancelled:function(){return e||d},supportsDataTransfer:function(){try{return e&&(window.Clipboard||window.DataTransfer).prototype.getData}catch(a){return!1}},supportsHTML5Tags:function(a){a=a.createElement("div");a.innerHTML="<article>foo</article>";return a.innerHTML.toLowerCase()==="<article>foo</article>"},supportsCommand:function(){var a=
+{formatBlock:b,insertUnorderedList:b||h,insertOrderedList:b||h};return function(b,c){if(!a[c]){try{return b.queryCommandSupported(c)}catch(d){}try{return b.queryCommandEnabled(c)}catch(g){}}return!1}}(),doesAutoLinkingInContentEditable:function(){return b},canDisableAutoLinking:function(){return this.supportsCommand(document,"AutoUrlDetect")},clearsContentEditableCorrectly:function(){return d||h||e},supportsGetAttributeCorrectly:function(){return document.createElement("td").getAttribute("rowspan")!=
+"1"},canSelectImagesInContentEditable:function(){return d||b||h},clearsListsInContentEditableCorrectly:function(){return d||b||e},autoScrollsToCaret:function(){return!e},autoClosesUnclosedTags:function(){var a=c.cloneNode(!1),b;a.innerHTML="<p><div></div>";a=a.innerHTML.toLowerCase();b=a==="<p></p><div></div>"||a==="<p><div></div></p>";this.autoClosesUnclosedTags=function(){return b};return b},supportsNativeGetElementsByClassName:function(){return String(document.getElementsByClassName).indexOf("[native code]")!==
+-1},supportsSelectionModify:function(){return"getSelection"in window&&"modify"in window.getSelection()},supportsClassList:function(){return"classList"in c},needsSpaceAfterLineBreak:function(){return h},supportsSpeechApiOn:function(b){return(a.match(/Chrome\/(\d+)/)||[,0])[1]>=11&&("onwebkitspeechchange"in b||"speech"in b)},crashesWhenDefineProperty:function(a){return b&&(a==="XMLHttpRequest"||a==="XDomainRequest")}}}();
+wysihtml5.lang.array=function(a){return{contains:function(c){if(a.indexOf)return a.indexOf(c)!==-1;else{for(var b=0,d=a.length;b<d;b++)if(a[b]===c)return!0;return!1}},without:function(c){for(var c=wysihtml5.lang.array(c),b=[],d=0,e=a.length;d<e;d++)c.contains(a[d])||b.push(a[d]);return b},get:function(){for(var c=0,b=a.length,d=[];c<b;c++)d.push(a[c]);return d}}};
+wysihtml5.lang.Dispatcher=Base.extend({observe:function(a,c){this.events=this.events||{};this.events[a]=this.events[a]||[];this.events[a].push(c);return this},fire:function(a,c){this.events=this.events||{};for(var b=this.events[a]||[],d=0;d<b.length;d++)b[d].call(this,c);return this},stopObserving:function(a,c){this.events=this.events||{};var b=0,d,e;if(a){d=this.events[a]||[];for(e=[];b<d.length;b++)d[b]!==c&&e.push(d[b]);this.events[a]=e}else this.events={};return this}});
+wysihtml5.lang.object=function(a){return{merge:function(c){for(var b in c)a[b]=c[b];return this},get:function(){return a},clone:function(){var c={},b;for(b in a)c[b]=a[b];return c},isArray:function(){return Object.prototype.toString.call(a)==="[object Array]"}}};(function(){var a=/^\s+/,c=/\s+$/;wysihtml5.lang.string=function(b){b=String(b);return{trim:function(){return b.replace(a,"").replace(c,"")},interpolate:function(a){for(var c in a)b=this.replace("#{"+c+"}").by(a[c]);return b},replace:function(a){return{by:function(c){return b.split(a).join(c)}}}}}})();
+(function(a){function c(a){return a.replace(e,function(a,b){var c=(b.match(h)||[])[1]||"",d=i[c],b=b.replace(h,"");b.split(d).length>b.split(c).length&&(b+=c,c="");var e=d=b;b.length>f&&(e=e.substr(0,f)+"...");d.substr(0,4)==="www."&&(d="http://"+d);return'<a href="'+d+'">'+e+"</a>"+c})}function b(f){if(!d.contains(f.nodeName))if(f.nodeType===a.TEXT_NODE&&f.data.match(e)){var j=f.parentNode,g;g=j.ownerDocument;var i=g._wysihtml5_tempElement;if(!i)i=g._wysihtml5_tempElement=g.createElement("div");
+g=i;g.innerHTML="<span></span>"+c(f.data);for(g.removeChild(g.firstChild);g.firstChild;)j.insertBefore(g.firstChild,f);j.removeChild(f)}else{j=a.lang.array(f.childNodes).get();g=j.length;for(i=0;i<g;i++)b(j[i]);return f}}var d=a.lang.array(["CODE","PRE","A","SCRIPT","HEAD","TITLE","STYLE"]),e=/((https?:\/\/|www\.)[^\s<]{3,})/gi,h=/([^\w\/\-](,?))$/i,f=100,i={")":"(","]":"[","}":"{"};a.dom.autoLink=function(a){var c;a:{c=a;for(var g;c.parentNode;)if(c=c.parentNode,g=c.nodeName,d.contains(g)){c=!0;
+break a}else if(g==="body")break;c=!1}if(c)return a;if(a===a.ownerDocument.documentElement)a=a.ownerDocument.body;return b(a)};a.dom.autoLink.URL_REG_EXP=e})(wysihtml5);
+(function(a){var c=a.browser.supportsClassList(),b=a.dom;b.addClass=function(a,e){if(c)return a.classList.add(e);b.hasClass(a,e)||(a.className+=" "+e)};b.removeClass=function(a,b){if(c)return a.classList.remove(b);a.className=a.className.replace(RegExp("(^|\\s+)"+b+"(\\s+|$)")," ")};b.hasClass=function(a,b){if(c)return a.classList.contains(b);var h=a.className;return h.length>0&&(h==b||RegExp("(^|\\s)"+b+"(\\s|$)").test(h))}})(wysihtml5);
+wysihtml5.dom.contains=function(){var a=document.documentElement;if(a.contains)return function(a,b){if(b.nodeType!==wysihtml5.ELEMENT_NODE)b=b.parentNode;return a!==b&&a.contains(b)};else if(a.compareDocumentPosition)return function(a,b){return!!(a.compareDocumentPosition(b)&16)}}();
+wysihtml5.dom.convertToList=function(){function a(a,b){var d=a.createElement("li");b.appendChild(d);return d}return function(c,b){if(c.nodeName==="UL"||c.nodeName==="OL"||c.nodeName==="MENU")return c;for(var d=c.ownerDocument,e=d.createElement(b),h=wysihtml5.lang.array(c.childNodes).get(),f=h.length,i,k,j,g,l=0;l<f;l++)g=g||a(d,e),i=h[l],k=wysihtml5.dom.getStyle("display").from(i)==="block",j=i.nodeName==="BR",k?(g=g.firstChild?a(d,e):g,g.appendChild(i),g=null):j?g=g.firstChild?null:g:g.appendChild(i);
+c.parentNode.replaceChild(e,c);return e}}();wysihtml5.dom.copyAttributes=function(a){return{from:function(c){return{to:function(b){for(var d,e=0,h=a.length;e<h;e++)d=a[e],c[d]&&(b[d]=c[d]);return{andTo:arguments.callee}}}}}};
+(function(a){var c=["-webkit-box-sizing","-moz-box-sizing","-ms-box-sizing","box-sizing"],b=function(b){var e;a:for(var h=0,f=c.length;h<f;h++)if(a.getStyle(c[h]).from(b)==="border-box"){e=c[h];break a}if(e)return parseInt(a.getStyle("width").from(b),10)<b.offsetWidth;return!1};a.copyStyles=function(d){return{from:function(e){b(e)&&(d=wysihtml5.lang.array(d).without(c));for(var h="",f=d.length,i=0,k;i<f;i++)k=d[i],h+=k+":"+a.getStyle(k).from(e)+";";return{to:function(b){a.setStyles(h).on(b);return{andTo:arguments.callee}}}}}}})(wysihtml5.dom);
+(function(a){a.dom.delegate=function(c,b,d,e){return a.dom.observe(c,d,function(d){for(var f=d.target,i=a.lang.array(c.querySelectorAll(b));f&&f!==c;){if(i.contains(f)){e.call(f,d);break}f=f.parentNode}})}})(wysihtml5);
+wysihtml5.dom.getAsDom=function(){var a=["abbr","article","aside","audio","bdi","canvas","command","datalist","details","figcaption","figure","footer","header","hgroup","keygen","mark","meter","nav","output","progress","rp","rt","ruby","svg","section","source","summary","time","track","video","wbr"];return function(c,b){var b=b||document,d;if(typeof c==="object"&&c.nodeType)d=b.createElement("div"),d.appendChild(c);else if(wysihtml5.browser.supportsHTML5Tags(b))d=b.createElement("div"),d.innerHTML=
+c;else{d=b;if(!d._wysihtml5_supportsHTML5Tags){for(var e=0,h=a.length;e<h;e++)d.createElement(a[e]);d._wysihtml5_supportsHTML5Tags=!0}d=b;e=d.createElement("div");e.style.display="none";d.body.appendChild(e);try{e.innerHTML=c}catch(f){}d.body.removeChild(e);d=e}return d}}();
+wysihtml5.dom.getParentElement=function(){function a(a,b){if(!b||!b.length)return!0;return typeof b==="string"?a===b:wysihtml5.lang.array(b).contains(a)}return function(c,b,d){d=d||50;if(b.className||b.classRegExp)a:{for(var e=b.nodeName,h=b.className,b=b.classRegExp;d--&&c&&c.nodeName!=="BODY";){var f;if(f=c.nodeType===wysihtml5.ELEMENT_NODE)if(f=a(c.nodeName,e)){f=h;var i=(c.className||"").match(b)||[];f=f?i[i.length-1]===f:!!i.length}if(f)break a;c=c.parentNode}c=null}else a:{e=b.nodeName;for(h=
+d;h--&&c&&c.nodeName!=="BODY";){if(a(c.nodeName,e))break a;c=c.parentNode}c=null}return c}}();
+wysihtml5.dom.getStyle=function(){function a(a){return a.replace(b,function(a){return a.charAt(1).toUpperCase()})}var c={"float":"styleFloat"in document.createElement("div").style?"styleFloat":"cssFloat"},b=/\-[a-z]/g;return function(b){return{from:function(e){if(e.nodeType===wysihtml5.ELEMENT_NODE){var h=e.ownerDocument,f=c[b]||a(b),i=e.style,k=e.currentStyle,j=i[f];if(j)return j;if(k)return k[f];var f=h.defaultView||h.parentWindow,h=(b==="height"||b==="width")&&e.nodeName==="TEXTAREA",g;if(f.getComputedStyle){if(h)g=
+i.overflow,i.overflow="hidden";e=f.getComputedStyle(e,null).getPropertyValue(b);if(h)i.overflow=g||"";return e}}}}}}();wysihtml5.dom.hasElementWithTagName=function(){var a={},c=1;return function(b,d){var e=(b._wysihtml5_identifier||(b._wysihtml5_identifier=c++))+":"+d,h=a[e];h||(h=a[e]=b.getElementsByTagName(d));return h.length>0}}();
+(function(a){var c={},b=1;a.dom.hasElementWithClassName=function(d,e){if(!a.browser.supportsNativeGetElementsByClassName())return!!d.querySelector("."+e);var h=(d._wysihtml5_identifier||(d._wysihtml5_identifier=b++))+":"+e,f=c[h];f||(f=c[h]=d.getElementsByClassName(e));return f.length>0}})(wysihtml5);wysihtml5.dom.insert=function(a){return{after:function(c){c.parentNode.insertBefore(a,c.nextSibling)},before:function(c){c.parentNode.insertBefore(a,c)},into:function(c){c.appendChild(a)}}};
+wysihtml5.dom.insertCSS=function(a){a=a.join("\n");return{into:function(c){var b=c.head||c.getElementsByTagName("head")[0],d=c.createElement("style");d.type="text/css";d.styleSheet?d.styleSheet.cssText=a:d.appendChild(c.createTextNode(a));b&&b.appendChild(d)}}};
+wysihtml5.dom.observe=function(a,c,b){for(var c=typeof c==="string"?[c]:c,d,e,h=0,f=c.length;h<f;h++)e=c[h],a.addEventListener?a.addEventListener(e,b,!1):(d=function(c){if(!("target"in c))c.target=c.srcElement;c.preventDefault=c.preventDefault||function(){this.returnValue=!1};c.stopPropagation=c.stopPropagation||function(){this.cancelBubble=!0};b.call(a,c)},a.attachEvent("on"+e,d));return{stop:function(){for(var f,e=0,j=c.length;e<j;e++)f=c[e],a.removeEventListener?a.removeEventListener(f,b,!1):a.detachEvent("on"+
+f,d)}}};
+wysihtml5.dom.parse=function(){function a(c,f){var j=c.childNodes,e=j.length,i;i=b[c.nodeType];var h=0;i=i&&i(c);if(!i)return null;for(h=0;h<e;h++)(newChild=a(j[h],f))&&i.appendChild(newChild);if(f&&i.childNodes.length<=1&&i.nodeName.toLowerCase()===d&&i.innerHTML!==wysihtml5.selection.PLACEHOLDER_TEXT&&!i.attributes.length)return i.firstChild;return i}function c(a,b){var b=b.toLowerCase(),c;if(c=a.nodeName=="IMG")if(c=b=="src"){var f;try{f=a.complete&&!a.mozMatchesSelector(":-moz-broken")}catch(d){a.complete&&a.readyState===
+"complete"&&(f=!0)}c=f===!0}return c?a.src:i&&"outerHTML"in a?a.outerHTML.toLowerCase().indexOf(" "+b+"=")!=-1?a.getAttribute(b):null:a.getAttribute(b)}var b={1:function(a){var b,i,h=f.tags;i=a.nodeName.toLowerCase();b=a.scopeName;if(a._wysihtml5)return null;a._wysihtml5=1;b&&b!="HTML"&&(i=b+":"+i);"outerHTML"in a&&!wysihtml5.browser.autoClosesUnclosedTags()&&a.nodeName==="P"&&a.outerHTML.slice(-4).toLowerCase()!=="</p>"&&(i="div");if(i in h){b=h[i];if(!b||b.remove)return null;b=typeof b==="string"?
+{rename_tag:b}:b}else if(a.firstChild)b={rename_tag:d};else return null;i=a.ownerDocument.createElement(b.rename_tag||i);var h={},t=b.set_class,o=b.add_class,w=b.set_attributes,r=b.check_attributes,s=f.classes,x=0,p=[];b=[];var v=[],B=[],A;w&&(h=wysihtml5.lang.object(w).clone());if(r)for(A in r)if(w=k[r[A]])w=w(c(a,A)),typeof w==="string"&&(h[A]=w);t&&p.push(t);if(o)for(A in o)if(w=j[o[A]])t=w(c(a,A)),typeof t==="string"&&p.push(t);(B=a.getAttribute("class"))&&(p=p.concat(B.split(e)));for(o=p.length;x<
+o;x++)a=p[x],s[a]&&b.push(a);for(s=b.length;s--;)a=b[s],wysihtml5.lang.array(v).contains(a)||v.unshift(a);v.length&&(h["class"]=v.join(" "));for(A in h)try{i.setAttribute(A,h[A])}catch(F){}h.src&&(typeof h.width!=="undefined"&&i.setAttribute("width",h.width),typeof h.height!=="undefined"&&i.setAttribute("height",h.height));return i},3:function(a){return a.ownerDocument.createTextNode(a.data)}},d="span",e=/\s+/,h={tags:{},classes:{}},f={},i=!wysihtml5.browser.supportsGetAttributeCorrectly(),k={url:function(){var a=
+/^https?:\/\//i;return function(b){if(!b||!b.match(a))return null;return b.replace(a,function(a){return a.toLowerCase()})}}(),alt:function(){var a=/[^ a-z0-9_\-]/gi;return function(b){if(!b)return"";return b.replace(a,"")}}(),numbers:function(){var a=/\D/g;return function(b){return(b=(b||"").replace(a,""))||null}}()},j={align_img:function(){var a={left:"wysiwyg-float-left",right:"wysiwyg-float-right"};return function(b){return a[String(b).toLowerCase()]}}(),align_text:function(){var a={left:"wysiwyg-text-align-left",
+right:"wysiwyg-text-align-right",center:"wysiwyg-text-align-center",justify:"wysiwyg-text-align-justify"};return function(b){return a[String(b).toLowerCase()]}}(),clear_br:function(){var a={left:"wysiwyg-clear-left",right:"wysiwyg-clear-right",both:"wysiwyg-clear-both",all:"wysiwyg-clear-both"};return function(b){return a[String(b).toLowerCase()]}}(),size_font:function(){var a={1:"wysiwyg-font-size-xx-small",2:"wysiwyg-font-size-small",3:"wysiwyg-font-size-medium",4:"wysiwyg-font-size-large",5:"wysiwyg-font-size-x-large",
+6:"wysiwyg-font-size-xx-large",7:"wysiwyg-font-size-xx-large","-":"wysiwyg-font-size-smaller","+":"wysiwyg-font-size-larger"};return function(b){return a[String(b).charAt(0)]}}()};return function(b,c,d,j){wysihtml5.lang.object(f).merge(h).merge(c).get();for(var d=d||b.ownerDocument||document,c=d.createDocumentFragment(),e=typeof b==="string",b=e?wysihtml5.dom.getAsDom(b,d):b;b.firstChild;)d=b.firstChild,b.removeChild(d),(d=a(d,j))&&c.appendChild(d);b.innerHTML="";b.appendChild(c);return e?wysihtml5.quirks.getCorrectInnerHTML(b):
+b}}();wysihtml5.dom.removeEmptyTextNodes=function(a){for(var c=wysihtml5.lang.array(a.childNodes).get(),b=c.length,d=0;d<b;d++)a=c[d],a.nodeType===wysihtml5.TEXT_NODE&&a.data===""&&a.parentNode.removeChild(a)};wysihtml5.dom.renameElement=function(a,c){for(var b=a.ownerDocument.createElement(c),d;d=a.firstChild;)b.appendChild(d);wysihtml5.dom.copyAttributes(["align","className"]).from(a).to(b);a.parentNode.replaceChild(b,a);return b};
+wysihtml5.dom.replaceWithChildNodes=function(a){if(a.parentNode)if(a.firstChild){for(var c=a.ownerDocument.createDocumentFragment();a.firstChild;)c.appendChild(a.firstChild);a.parentNode.replaceChild(c,a)}else a.parentNode.removeChild(a)};
+(function(a){function c(a){var c=a.ownerDocument.createElement("br");a.appendChild(c)}a.resolveList=function(b){if(!(b.nodeName!=="MENU"&&b.nodeName!=="UL"&&b.nodeName!=="OL")){var d=b.ownerDocument.createDocumentFragment(),e=b.previousSibling,h,f,i;for(e&&a.getStyle("display").from(e)!=="block"&&c(d);i=b.firstChild;){for(h=i.lastChild;e=i.firstChild;)f=(f=e===h)&&a.getStyle("display").from(e)!=="block"&&e.nodeName!=="BR",d.appendChild(e),f&&c(d);i.parentNode.removeChild(i)}b.parentNode.replaceChild(d,
+b)}}})(wysihtml5.dom);
+(function(a){var c={uaCompatible:"IE=Edge"},b=document,d=["parent","top","opener","frameElement","frames","localStorage","globalStorage","sessionStorage","indexedDB"],e=["open","close","openDialog","showModalDialog","alert","confirm","prompt","openDatabase","postMessage","XMLHttpRequest","XDomainRequest"],h=["referrer","write","open","close"];a.dom.Sandbox=Base.extend({constructor:function(b,d){this.callback=b||a.EMPTY_FUNCTION;this.config=a.lang.object({}).merge(c).merge(d).get();this.iframe=this._createIframe()},
+insertInto:function(a){typeof a==="string"&&(a=b.getElementById(a));a.appendChild(this.iframe)},getIframe:function(){return this.iframe},getWindow:function(){this._readyError()},getDocument:function(){this._readyError()},destroy:function(){var a=this.getIframe();a.parentNode.removeChild(a)},_readyError:function(){throw Error("wysihtml5.Sandbox: Sandbox iframe isn't loaded yet");},_createIframe:function(){var c=this,d=b.createElement("iframe");d.className="wysihtml5-sandbox";a.dom.setAttributes({security:"restricted",
+allowtransparency:"true",frameborder:0,width:0,height:0,marginwidth:0,marginheight:0}).on(d);if(a.browser.throwsMixedContentWarningWhenIframeSrcIsEmpty())d.src="javascript:'<html></html>'";d.onload=function(){d.onreadystatechange=d.onload=null;c._onLoadIframe(d)};d.onreadystatechange=function(){if(/loaded|complete/.test(d.readyState))d.onreadystatechange=d.onload=null,c._onLoadIframe(d)};return d},_onLoadIframe:function(c){if(a.dom.contains(b.documentElement,c)){var i=this,k=c.contentWindow,j=c.contentDocument||
+c.contentWindow.document,c=this._getHtml({charset:b.characterSet||b.charset||"utf-8",stylesheets:this.config.stylesheets,uaCompatible:this.config.uaCompatible});j.open("text/html","replace");j.write(c);j.close();this.getWindow=function(){return k};this.getDocument=function(){return j};k.onerror=function(a,b,c){throw Error("wysihtml5.Sandbox: "+a,b,c);};if(!a.browser.supportsSandboxedIframes()){var g,c=0;for(g=d.length;c<g;c++)this._unset(k,d[c]);c=0;for(g=e.length;c<g;c++)this._unset(k,e[c],a.EMPTY_FUNCTION);
+c=0;for(g=h.length;c<g;c++)this._unset(j,h[c]);this._unset(j,"cookie","",!0)}this.loaded=!0;setTimeout(function(){i.callback(i)},0)}},_getHtml:function(b){var c=b.stylesheets,d="",j=0,g;if(c=typeof c==="string"?[c]:c)for(g=c.length;j<g;j++)d+='<link rel="stylesheet" href="'+c[j]+'">';b.stylesheets=d;return a.lang.string('<!DOCTYPE html><html><head><meta http-equiv="X-UA-Compatible" content="#{uaCompatible}"><meta charset="#{charset}">#{stylesheets}</head><body></body></html>').interpolate(b)},_unset:function(b,
+c,d,j){try{b[c]=d}catch(g){}try{b.__defineGetter__(c,function(){return d})}catch(e){}if(j)try{b.__defineSetter__(c,function(){})}catch(h){}if(!a.browser.crashesWhenDefineProperty(c))try{var q={get:function(){return d}};if(j)q.set=function(){};Object.defineProperty(b,c,q)}catch(t){}}})})(wysihtml5);(function(){var a={className:"class"};wysihtml5.dom.setAttributes=function(c){return{on:function(b){for(var d in c)b.setAttribute(a[d]||d,c[d])}}}})();
+wysihtml5.dom.setStyles=function(a){return{on:function(c){c=c.style;if(typeof a==="string")c.cssText+=";"+a;else for(var b in a)b==="float"?(c.cssFloat=a[b],c.styleFloat=a[b]):c[b]=a[b]}}};
+(function(a){a.simulatePlaceholder=function(c,b,d){var e=function(){b.hasPlaceholderSet()&&b.clear();a.removeClass(b.element,"placeholder")},h=function(){b.isEmpty()&&(b.setValue(d),a.addClass(b.element,"placeholder"))};c.observe("set_placeholder",h).observe("unset_placeholder",e).observe("focus:composer",e).observe("paste:composer",e).observe("blur:composer",h);h()}})(wysihtml5.dom);
+(function(a){var c=document.documentElement;"textContent"in c?(a.setTextContent=function(a,c){a.textContent=c},a.getTextContent=function(a){return a.textContent}):"innerText"in c?(a.setTextContent=function(a,c){a.innerText=c},a.getTextContent=function(a){return a.innerText}):(a.setTextContent=function(a,c){a.nodeValue=c},a.getTextContent=function(a){return a.nodeValue})})(wysihtml5.dom);
+wysihtml5.quirks.cleanPastedHTML=function(){var a={"a u":wysihtml5.dom.replaceWithChildNodes};return function(c,b,d){var b=b||a,d=d||c.ownerDocument||document,e=typeof c==="string",h,f,i,k=0,c=e?wysihtml5.dom.getAsDom(c,d):c;for(i in b){h=c.querySelectorAll(i);d=b[i];for(f=h.length;k<f;k++)d(h[k])}return e?c.innerHTML:c}}();
+(function(a){var c=a.dom;a.quirks.ensureProperClearing=function(){var a=function(){var a=this;setTimeout(function(){var b=a.innerHTML.toLowerCase();if(b=="<p>&nbsp;</p>"||b=="<p>&nbsp;</p><p>&nbsp;</p>")a.innerHTML=""},0)};return function(d){c.observe(d,["cut","keydown"],a)}}();a.quirks.ensureProperClearingOfLists=function(){var b=["OL","UL","MENU"];return function(d){c.observe(d,"keydown",function(e){e.keyCode===a.BACKSPACE_KEY&&(e=a.selection.getSelectedNode(d.ownerDocument),d.firstChild&&a.lang.array(b).contains(d.firstChild.nodeName)&&
+(e=c.getParentElement(e,{nodeName:b}))&&e==d.firstChild&&e.childNodes.length<=1&&(e.firstChild?e.firstChild.innerHTML==="":1)&&e.parentNode.removeChild(e))})}}()})(wysihtml5);(function(a){a.quirks.getCorrectInnerHTML=function(c){var b=c.innerHTML;if(b.indexOf("%7E")===-1)return b;var c=c.querySelectorAll("[href*='~'], [src*='~']"),d,e,h,f;f=0;for(h=c.length;f<h;f++)d=c[f].href||c[f].src,e=a.lang.string(d).replace("~").by("%7E"),b=a.lang.string(b).replace(e).by(d);return b}})(wysihtml5);
+(function(a){function c(c){var f=c.keyCode;if(!(c.shiftKey||f!==a.ENTER_KEY&&f!==a.BACKSPACE_KEY)){var i=c.target,k=a.selection.getSelectedNode(i.ownerDocument);(k=b.getParentElement(k,{nodeName:d},4))?k.nodeName==="LI"&&(f===a.ENTER_KEY||f===a.BACKSPACE_KEY)&&setTimeout(function(){var c=a.selection.getSelectedNode(i.ownerDocument);c&&!b.getParentElement(c,{nodeName:e},2)&&c.parentNode.nodeName==="P"&&(c=b.renameElement(c.parentNode,"div"),a.selection.selectNode(c))},0):f===a.ENTER_KEY&&(a.commands.exec(i,
+"insertLineBreak"),c.preventDefault())}}var b=a.dom,d=["LI","DIV","P","H1","H2","H3","H4","H5","H6"],e=["UL","OL","MENU"];a.quirks.insertLineBreakOnReturn=function(a){b.observe(a.ownerDocument,"keydown",c)}})(wysihtml5);(function(a){a.quirks.redraw=function(c){a.dom.addClass(c,"wysihtml5-quirks-redraw");a.dom.removeClass(c,"wysihtml5-quirks-redraw");try{var b=c.ownerDocument;b.execCommand("italic",!1,null);b.execCommand("italic",!1,null)}catch(d){}}})(wysihtml5);
+(function(a){function c(a){var f;f=a._wysihtml5CaretPlaceholder=a._wysihtml5CaretPlaceholder||a.createElement("span"),a=f;a.innerHTML=e;return a}function b(a){var b=c(a),d=h.getTextContent(b),e=a.getElementById(b.id),g=0;if(h.contains(a.body,b))return b;else if(e)return e;else{b=a.getElementsByTagName("*");for(e=b.length;g<e;g++)if(a=b[g],a.innerHTML===d)return a;return null}}function d(a){var b=0;if(a.parentNode){do b+=a.offsetTop||0,a=a.offsetParent;while(a)}return b}var e="--_CARET_--",h=a.dom;
+a.selection={PLACEHOLDER_TEXT:e,getBookmark:function(a){return(a=this.getRange(a))&&a.cloneRange()},setBookmark:function(a){a&&this.setSelection(a)},setBefore:function(a){var b=rangy.createRange(a.ownerDocument);b.setStartBefore(a);b.setEndBefore(a);return this.setSelection(b)},setAfter:function(a){var b=rangy.createRange(a.ownerDocument);b.setStartAfter(a);b.setEndAfter(a);return this.setSelection(b)},selectNode:function(b){var c=rangy.createRange(b.ownerDocument),d=b.nodeType===a.ELEMENT_NODE,e=
+"canHaveHTML"in b?b.canHaveHTML:b.nodeName!=="IMG",g=d?b.innerHTML:b.data,g=g===""||g===a.INVISIBLE_SPACE,l=h.getStyle("display").from(b),l=l==="block"||l==="list-item";if(g&&d&&e)try{b.innerHTML=a.INVISIBLE_SPACE}catch(n){}e?c.selectNodeContents(b):c.selectNode(b);e&&g&&d?c.collapse(l):e&&g&&(c.setStartAfter(b),c.setEndAfter(b));this.setSelection(c)},getSelectedNode:function(a,b){var c;if(b&&a.selection&&a.selection.type==="Control"&&(c=a.selection.createRange())&&c.length)return c.item(0);c=this.getSelection(a);
+return c.focusNode===c.anchorNode?c.focusNode:(c=this.getRange(a))?c.commonAncestorContainer:a.body},executeAndRestore:function(a,d,e){if(!window.getSelection)return this.executeAndRestoreSimple(a,d);var j=a.body,g=j.scrollTop,h=j.scrollLeft,n=this.getRange(a),q=c(a);if(n){n.insertNode(q);try{d(n.startContainer,n.endContainer)}catch(t){setTimeout(function(){throw t;},0)}if(d=b(a))a=rangy.createRange(a),a.selectNode(d),a.deleteContents(),this.setSelection(a);if(e)j.scrollTop=g,j.scrollLeft=h;try{d.parentNode.removeChild(d)}catch(o){}}else d(j,
+j)},executeAndRestoreSimple:function(a,b){var c=this.getRange(a),d,g;if(c){g=c.getNodes([3]);d=g[0]||c.startContainer;g=g[g.length-1]||c.endContainer;d={collapsed:c.collapsed,startContainer:d,startOffset:d===c.startContainer?c.startOffset:0,endContainer:g,endOffset:g===c.endContainer?c.endOffset:g.length};try{b(c.startContainer,c.endContainer)}catch(e){setTimeout(function(){throw e;},0)}c=rangy.createRange(a);try{c.setStart(d.startContainer,d.startOffset)}catch(h){}try{c.setEnd(d.endContainer,d.endOffset)}catch(q){}try{this.setSelection(c)}catch(t){}}else b(a.body,
+a.body)},insertHTML:function(a,b){var c=rangy.createRange(a).createContextualFragment(b),d=c.lastChild;this.insertNode(c);d&&this.setAfter(d)},insertNode:function(a){var b=this.getRange(a.ownerDocument);if(b)b.insertNode(a);else return!1},surround:function(a){var b=this.getRange(a.ownerDocument);if(b)try{b.surroundContents(a),this.selectNode(a)}catch(c){a.appendChild(b.extractContents()),b.insertNode(a)}},scrollIntoView:function(b){var c=b.ownerDocument,e=c.documentElement.scrollHeight>c.documentElement.offsetHeight,
+j=c._wysihtml5ScrollIntoViewElement=c._wysihtml5ScrollIntoViewElement||function(){var b=c.createElement("span");b.innerHTML=a.INVISIBLE_SPACE;return b}();if(e&&(this.insertNode(j),e=d(j),j.parentNode.removeChild(j),e>b.scrollTop))b.scrollTop=e},selectLine:function(b){a.browser.supportsSelectionModify()?this._selectLine_W3C(b):b.selection&&this._selectLine_MSIE(b)},_selectLine_W3C:function(a){a=a.defaultView.getSelection();a.modify("extend","left","lineboundary");a.modify("extend","right","lineboundary")},
+_selectLine_MSIE:function(a){var b=a.selection.createRange(),c=b.boundingTop,d=a.body.scrollWidth,g;if(b.moveToPoint){if(c===0)g=a.createElement("span"),this.insertNode(g),c=g.offsetTop,g.parentNode.removeChild(g);c+=1;for(g=-10;g<d;g+=2)try{b.moveToPoint(g,c);break}catch(e){}for(a=a.selection.createRange();d>=0;d--)try{a.moveToPoint(d,c);break}catch(h){}b.setEndPoint("EndToEnd",a);b.select()}},getText:function(a){return(a=this.getSelection(a))?a.toString():""},getNodes:function(a,b,c){return(a=this.getRange(a))?
+a.getNodes([b],c):[]},getRange:function(a){return(a=this.getSelection(a))&&a.rangeCount&&a.getRangeAt(0)},getSelection:function(a){return rangy.getSelection(a.defaultView||a.parentWindow)},setSelection:function(a){var b=(a.startContainer||a.endContainer).ownerDocument;return rangy.getSelection(b.defaultView||b.parentWindow).setSingleRange(a)}}})(wysihtml5);
+(function(a,c){function b(a,b){if(a.attributes.length!=b.attributes.length)return!1;for(var c=0,d=a.attributes.length,e,f;c<d;++c)if(e=a.attributes[c],f=e.name,f!="class"){f=b.attributes.getNamedItem(f);if(e.specified!=f.specified)return!1;if(e.specified&&e.nodeValue!==f.nodeValue)return!1}return!0}function d(a,b){if(c.dom.isCharacterDataNode(a))return b==0?!!a.previousSibling:b==a.length?!!a.nextSibling:!0;return b>0&&b<a.childNodes.length}function e(a,b,d){var f;if(c.dom.isCharacterDataNode(b))d==
+0?(d=c.dom.getNodeIndex(b),b=b.parentNode):d==b.length?(d=c.dom.getNodeIndex(b)+1,b=b.parentNode):f=c.dom.splitDataNode(b,d);if(!f){f=b.cloneNode(!1);f.id&&f.removeAttribute("id");for(var h;h=b.childNodes[d];)f.appendChild(h);c.dom.insertAfter(f,b)}return b==a?f:e(a,f.parentNode,c.dom.getNodeIndex(f))}function h(b){this.firstTextNode=(this.isElementMerge=b.nodeType==a.ELEMENT_NODE)?b.lastChild:b;this.textNodes=[this.firstTextNode]}function f(a,b,c,d){this.tagNames=a||[i];this.cssClass=b||"";this.similarClassRegExp=
+c;this.normalize=d;this.applyToAnyTagName=!1}var i="span",k=/\s+/g;h.prototype={doMerge:function(){for(var a=[],b,c,d=0,e=this.textNodes.length;d<e;++d)b=this.textNodes[d],c=b.parentNode,a[d]=b.data,d&&(c.removeChild(b),c.hasChildNodes()||c.parentNode.removeChild(c));return this.firstTextNode.data=a=a.join("")},getLength:function(){for(var a=this.textNodes.length,b=0;a--;)b+=this.textNodes[a].length;return b},toString:function(){for(var a=[],b=0,c=this.textNodes.length;b<c;++b)a[b]="'"+this.textNodes[b].data+
+"'";return"[Merge("+a.join(",")+")]"}};f.prototype={getAncestorWithClass:function(b){for(var d;b;){if(this.cssClass)if(d=this.cssClass,b.className){var e=b.className.match(this.similarClassRegExp)||[];d=e[e.length-1]===d}else d=!1;else d=!0;if(b.nodeType==a.ELEMENT_NODE&&c.dom.arrayContains(this.tagNames,b.tagName.toLowerCase())&&d)return b;b=b.parentNode}return!1},postApply:function(a,b){for(var c=a[0],d=a[a.length-1],e=[],f,i=c,k=d,r=0,s=d.length,x,p,v=0,B=a.length;v<B;++v)if(x=a[v],p=this.getAdjacentMergeableTextNode(x.parentNode,
+!1)){f||(f=new h(p),e.push(f));f.textNodes.push(x);if(x===c)i=f.firstTextNode,r=i.length;if(x===d)k=f.firstTextNode,s=f.getLength()}else f=null;if(c=this.getAdjacentMergeableTextNode(d.parentNode,!0))f||(f=new h(d),e.push(f)),f.textNodes.push(c);if(e.length){v=0;for(B=e.length;v<B;++v)e[v].doMerge();b.setStart(i,r);b.setEnd(k,s)}},getAdjacentMergeableTextNode:function(b,c){var d=b.nodeType==a.TEXT_NODE,e=d?b.parentNode:b,f=c?"nextSibling":"previousSibling";if(d){if((d=b[f])&&d.nodeType==a.TEXT_NODE)return d}else if((d=
+e[f])&&this.areElementsMergeable(b,d))return d[c?"firstChild":"lastChild"];return null},areElementsMergeable:function(a,d){return c.dom.arrayContains(this.tagNames,(a.tagName||"").toLowerCase())&&c.dom.arrayContains(this.tagNames,(d.tagName||"").toLowerCase())&&a.className.replace(k," ")==d.className.replace(k," ")&&b(a,d)},createContainer:function(a){a=a.createElement(this.tagNames[0]);if(this.cssClass)a.className=this.cssClass;return a},applyToTextNode:function(a){var b=a.parentNode;if(b.childNodes.length==
+1&&c.dom.arrayContains(this.tagNames,b.tagName.toLowerCase())){if(this.cssClass)if(a=this.cssClass,b.className){if(b.className)b.className=b.className.replace(this.similarClassRegExp,"");b.className+=" "+a}else b.className=a}else b=this.createContainer(c.dom.getDocument(a)),a.parentNode.insertBefore(b,a),b.appendChild(a)},isRemovable:function(b){return c.dom.arrayContains(this.tagNames,b.tagName.toLowerCase())&&a.lang.string(b.className).trim()==this.cssClass},undoToTextNode:function(a,b,c){b.containsNode(c)||
+(a=b.cloneRange(),a.selectNode(c),a.isPointInRange(b.endContainer,b.endOffset)&&d(b.endContainer,b.endOffset)&&(e(c,b.endContainer,b.endOffset),b.setEndAfter(c)),a.isPointInRange(b.startContainer,b.startOffset)&&d(b.startContainer,b.startOffset)&&(c=e(c,b.startContainer,b.startOffset)));if(this.similarClassRegExp&&c.className)c.className=c.className.replace(this.similarClassRegExp,"");if(this.isRemovable(c)){b=c;for(c=b.parentNode;b.firstChild;)c.insertBefore(b.firstChild,b);c.removeChild(b)}},applyToRange:function(b){var c=
+b.getNodes([a.TEXT_NODE]);if(!c.length)try{var d=this.createContainer(b.endContainer.ownerDocument);b.surroundContents(d);this.selectNode(b,d);return}catch(e){}b.splitBoundaries();c=b.getNodes([a.TEXT_NODE]);if(c.length){for(var f=0,h=c.length;f<h;++f)d=c[f],this.getAncestorWithClass(d)||this.applyToTextNode(d);b.setStart(c[0],0);d=c[c.length-1];b.setEnd(d,d.length);this.normalize&&this.postApply(c,b)}},undoToRange:function(b){var c=b.getNodes([a.TEXT_NODE]),d,e;c.length?(b.splitBoundaries(),c=b.getNodes([a.TEXT_NODE])):
+(c=b.endContainer.ownerDocument.createTextNode(a.INVISIBLE_SPACE),b.insertNode(c),b.selectNode(c),c=[c]);for(var f=0,h=c.length;f<h;++f)d=c[f],(e=this.getAncestorWithClass(d))&&this.undoToTextNode(d,b,e);h==1?this.selectNode(b,c[0]):(b.setStart(c[0],0),d=c[c.length-1],b.setEnd(d,d.length),this.normalize&&this.postApply(c,b))},selectNode:function(b,c){var d=c.nodeType===a.ELEMENT_NODE,e="canHaveHTML"in c?c.canHaveHTML:!0,f=d?c.innerHTML:c.data;if((f=f===""||f===a.INVISIBLE_SPACE)&&d&&e)try{c.innerHTML=
+a.INVISIBLE_SPACE}catch(h){}b.selectNodeContents(c);f&&d?b.collapse(!1):f&&(b.setStartAfter(c),b.setEndAfter(c))},getTextSelectedByRange:function(a,b){var c=b.cloneRange();c.selectNodeContents(a);var d=c.intersection(b),d=d?d.toString():"";c.detach();return d},isAppliedToRange:function(b){var c=[],d,e=b.getNodes([a.TEXT_NODE]);if(!e.length)return(d=this.getAncestorWithClass(b.startContainer))?[d]:!1;for(var f=0,h=e.length,i;f<h;++f)if(i=this.getTextSelectedByRange(e[f],b),d=this.getAncestorWithClass(e[f]),
+i!=""&&!d)return!1;else c.push(d);return c},toggleRange:function(a){this.isAppliedToRange(a)?this.undoToRange(a):this.applyToRange(a)}};a.selection.HTMLApplier=f})(wysihtml5,rangy);
+wysihtml5.views.View=Base.extend({constructor:function(a,c,b){this.parent=a;this.element=c;this.config=b;this._observeViewChange()},_observeViewChange:function(){var a=this;this.parent.observe("beforeload",function(){a.parent.observe("change_view",function(c){c===a.name?(a.parent.currentView=a,a.show(),setTimeout(function(){a.focus()},0)):a.hide()})})},focus:function(){if(this.element.ownerDocument.querySelector(":focus")!==this.element)try{this.element.focus()}catch(a){}},hide:function(){this.element.style.display=
+"none"},show:function(){this.element.style.display=""},disable:function(){this.element.setAttribute("disabled","disabled")},enable:function(){this.element.removeAttribute("disabled")}});
+(function(a){var c=a.dom,b=a.browser,d=a.selection;a.views.Composer=a.views.View.extend({name:"composer",CARET_HACK:"<br>",constructor:function(a,b,c){this.base(a,b,c);this.textarea=this.parent.textarea;this._initSandbox()},clear:function(){this.element.innerHTML=b.displaysCaretInEmptyContentEditableCorrectly()?"":this.CARET_HACK},getValue:function(b){var c=this.isEmpty()?"":a.quirks.getCorrectInnerHTML(this.element);b&&(c=this.parent.parse(c));c=a.lang.string(c).replace(a.INVISIBLE_SPACE).by("");
+return c=a.lang.string(c).replace(d.PLACEHOLDER_TEXT).by("")},setValue:function(a,b){b&&(a=this.parent.parse(a));this.element.innerHTML=a},show:function(){this.iframe.style.display=this._displayStyle||"";this.disable();this.enable()},hide:function(){this._displayStyle=c.getStyle("display").from(this.iframe);if(this._displayStyle==="none")this._displayStyle=null;this.iframe.style.display="none"},disable:function(){this.element.removeAttribute("contentEditable");this.base()},enable:function(){this.element.setAttribute("contentEditable",
+"true");this.base()},getTextContent:function(){return c.getTextContent(this.element)},hasPlaceholderSet:function(){return this.getTextContent()==this.textarea.element.getAttribute("placeholder")},isEmpty:function(){var a=this.element.innerHTML;return a===""||a===this.CARET_HACK||this.hasPlaceholderSet()||this.getTextContent()===""&&!this.element.querySelector("blockquote, ul, ol, img, embed, object, table, iframe, svg, video, audio, button, input, select, textarea")},_initSandbox:function(){var a=
+this;this.sandbox=new c.Sandbox(function(){a._create()},{stylesheets:this.config.stylesheets,uaCompatible:"IE=7"});this.iframe=this.sandbox.getIframe();var b=document.createElement("input");b.type="hidden";b.name="_wysihtml5_mode";b.value=1;var d=this.textarea.element;c.insert(this.iframe).after(d);c.insert(b).after(d)},_create:function(){var d=this;this.element=this.sandbox.getDocument().body;this.textarea=this.parent.textarea;this.element.innerHTML=this.textarea.getValue(!0);this.enable();window.rangy.init();
+c.copyAttributes(["className","spellcheck","title","lang","dir","accessKey"]).from(this.textarea.element).to(this.element);c.addClass(this.element,this.config.composerClassName);this.config.style&&this.style();this.observe();var h=this.config.name;h&&(c.addClass(this.element,h),c.addClass(this.iframe,h));(h=typeof this.config.placeholder==="string"?this.config.placeholder:this.textarea.element.getAttribute("placeholder"))&&c.simulatePlaceholder(this.parent,this,h);a.commands.exec(this.element,"styleWithCSS",
+!1);this._initAutoLinking();this._initObjectResizing();(this.textarea.element.hasAttribute("autofocus")||document.querySelector(":focus")==this.textarea.element)&&setTimeout(function(){d.focus()},100);b.insertsLineBreaksOnReturn()||a.quirks.insertLineBreakOnReturn(this.element);b.clearsContentEditableCorrectly()||a.quirks.ensureProperClearing(this.element);b.clearsListsInContentEditableCorrectly()||a.quirks.ensureProperClearingOfLists(this.element);this.initSync&&this.config.sync&&this.initSync();
+this.textarea.hide();this.parent.fire("beforeload").fire("load")},_initAutoLinking:function(){var e=b.canDisableAutoLinking(),h=b.doesAutoLinkingInContentEditable();e&&a.commands.exec(this.element,"autoUrlDetect",!1);if(this.config.autoLink){var f=this.sandbox.getDocument();(!h||h&&e)&&this.parent.observe("newword:composer",function(){d.executeAndRestore(f,function(a,b){c.autoLink(b.parentNode)})});var i=f.getElementsByTagName("a"),k=c.autoLink.URL_REG_EXP,j=function(b){b=a.lang.string(c.getTextContent(b)).trim();
+b.substr(0,4)==="www."&&(b="http://"+b);return b};c.observe(this.element,"keydown",function(a){if(i.length){var a=d.getSelectedNode(a.target.ownerDocument),b=c.getParentElement(a,{nodeName:"A"},4),e;b&&(e=j(b),setTimeout(function(){var a=j(b);a!==e&&a.match(k)&&b.setAttribute("href",a)},0))}})}},_initObjectResizing:function(){var d=["width","height"],h=d.length,f=this.element;a.commands.exec(f,"enableObjectResizing",this.config.allowObjectResizing);this.config.allowObjectResizing?b.supportsEvent("resizeend")&&
+c.observe(f,"resizeend",function(b){for(var b=b.target||b.srcElement,c=b.style,j=0,g;j<h;j++)g=d[j],c[g]&&(b.setAttribute(g,parseInt(c[g],10)),c[g]="");a.quirks.redraw(f)}):b.supportsEvent("resizestart")&&c.observe(f,"resizestart",function(a){a.preventDefault()})}})})(wysihtml5);
+(function(a){var c=a.dom,b=document,d=window,e=b.createElement("div"),h=["background-color","color","cursor","font-family","font-size","font-style","font-variant","font-weight","line-height","letter-spacing","text-align","text-decoration","text-indent","text-rendering","word-break","word-wrap","word-spacing"],f=["background-color","border-collapse","border-bottom-color","border-bottom-style","border-bottom-width","border-left-color","border-left-style","border-left-width","border-right-color","border-right-style",
+"border-right-width","border-top-color","border-top-style","border-top-width","clear","display","float","margin-bottom","margin-left","margin-right","margin-top","outline-color","outline-offset","outline-width","outline-style","padding-left","padding-right","padding-top","padding-bottom","position","top","left","right","bottom","z-index","vertical-align","text-align","-webkit-box-sizing","-moz-box-sizing","-ms-box-sizing","box-sizing","-webkit-box-shadow","-moz-box-shadow","-ms-box-shadow","box-shadow",
+"width","height"],i=["width","height","top","left","right","bottom"],k=["html             { height: 100%; }","body             { min-height: 100%; padding: 0; margin: 0; margin-top: -1px; padding-top: 1px; }",a.browser.isGecko?"body.placeholder { color: graytext !important; }":"body.placeholder { color: #a9a9a9 !important; }","body[disabled]   { background-color: #eee !important; color: #999 !important; cursor: default !important; }","img:-moz-broken  { -moz-force-broken-image-icon: 1; height: 24px; width: 24px; }"],
+j=function(a){if(a.setActive)a.setActive();else{var e=a.style,f=b.documentElement.scrollTop||b.body.scrollTop,h=b.documentElement.scrollLeft||b.body.scrollLeft,e={position:e.position,top:e.top,left:e.left,WebkitUserSelect:e.WebkitUserSelect};c.setStyles({position:"absolute",top:"-99999px",left:"-99999px",WebkitUserSelect:"none"}).on(a);a.focus();c.setStyles(e).on(a);d.scrollTo&&d.scrollTo(h,f)}};a.views.Composer.prototype.style=function(){var g=this,l=b.querySelector(":focus"),n=this.textarea.element,
+q=n.hasAttribute("placeholder"),t=q&&n.getAttribute("placeholder");this.focusStylesHost=this.focusStylesHost||e.cloneNode(!1);this.blurStylesHost=this.blurStylesHost||e.cloneNode(!1);q&&n.removeAttribute("placeholder");n===l&&n.blur();c.copyStyles(f).from(n).to(this.iframe).andTo(this.blurStylesHost);c.copyStyles(h).from(n).to(this.element).andTo(this.blurStylesHost);c.insertCSS(k).into(this.element.ownerDocument);j(n);c.copyStyles(f).from(n).to(this.focusStylesHost);c.copyStyles(h).from(n).to(this.focusStylesHost);
+var o=a.lang.array(f).without(["display"]);l?l.focus():n.blur();q&&n.setAttribute("placeholder",t);a.browser.hasCurrentStyleProperty()||c.observe(d,"resize",function(){var a=c.getStyle("display").from(n);n.style.display="";c.copyStyles(i).from(n).to(g.iframe).andTo(g.focusStylesHost).andTo(g.blurStylesHost);n.style.display=a});this.parent.observe("focus:composer",function(){c.copyStyles(o).from(g.focusStylesHost).to(g.iframe);c.copyStyles(h).from(g.focusStylesHost).to(g.element)});this.parent.observe("blur:composer",
+function(){c.copyStyles(o).from(g.blurStylesHost).to(g.iframe);c.copyStyles(h).from(g.blurStylesHost).to(g.element)});return this}})(wysihtml5);
+(function(a){var c=a.dom,b=a.browser,d={66:"bold",73:"italic",85:"underline"};a.views.Composer.prototype.observe=function(){var e=this,h=this.getValue(),f=this.sandbox.getIframe(),i=this.element,k=b.supportsEventsInIframeCorrectly()?i:this.sandbox.getWindow(),j=b.supportsEvent("drop")?["drop","paste"]:["dragdrop","paste"];c.observe(f,"DOMNodeRemoved",function(){clearInterval(g);e.parent.fire("destroy:composer")});var g=setInterval(function(){c.contains(document.documentElement,f)||(clearInterval(g),
+e.parent.fire("destroy:composer"))},250);c.observe(k,"focus",function(){e.parent.fire("focus").fire("focus:composer");setTimeout(function(){h=e.getValue()},0)});c.observe(k,"blur",function(){h!==e.getValue()&&e.parent.fire("change").fire("change:composer");e.parent.fire("blur").fire("blur:composer")});c.observe(i,"dragenter",function(){e.parent.fire("unset_placeholder")});b.firesOnDropOnlyWhenOnDragOverIsCancelled()&&c.observe(i,["dragover","dragenter"],function(a){a.preventDefault()});c.observe(i,
+j,function(c){var d=c.dataTransfer,f;d&&b.supportsDataTransfer()&&(f=d.getData("text/html")||d.getData("text/plain"));f?(i.focus(),a.commands.exec(i,"insertHTML",f),e.parent.fire("paste").fire("paste:composer"),c.stopPropagation(),c.preventDefault()):setTimeout(function(){e.parent.fire("paste").fire("paste:composer")},0)});c.observe(i,"keyup",function(b){b=b.keyCode;(b===a.SPACE_KEY||b===a.ENTER_KEY)&&e.parent.fire("newword:composer")});this.parent.observe("paste:composer",function(){setTimeout(function(){e.parent.fire("newword:composer")},
+0)});b.canSelectImagesInContentEditable()||c.observe(i,"mousedown",function(b){var c=b.target;c.nodeName==="IMG"&&(a.selection.selectNode(c),b.preventDefault())});c.observe(i,"keydown",function(b){var c=d[b.keyCode];if((b.ctrlKey||b.metaKey)&&c)a.commands.exec(i,c),b.preventDefault()});c.observe(i,"keydown",function(b){var c=a.selection.getSelectedNode(i.ownerDocument,!0),d=b.keyCode;if(c&&c.nodeName==="IMG"&&(d===a.BACKSPACE_KEY||d===a.DELETE_KEY))d=c.parentNode,d.removeChild(c),d.nodeName==="A"&&
+!d.firstChild&&d.parentNode.removeChild(d),setTimeout(function(){a.quirks.redraw(i)},0),b.preventDefault()});var l={IMG:"Image: ",A:"Link: "};c.observe(i,"mouseover",function(a){var a=a.target,b=a.nodeName;b!=="A"&&b!=="IMG"||(b=l[b]+(a.getAttribute("href")||a.getAttribute("src")),a.setAttribute("title",b))})}})(wysihtml5);
+(function(a){a.views.Synchronizer=Base.extend({constructor:function(a,b,d){this.editor=a;this.textarea=b;this.composer=d;this._observe()},fromComposerToTextarea:function(c){this.textarea.setValue(a.lang.string(this.composer.getValue()).trim(),c)},fromTextareaToComposer:function(a){var b=this.textarea.getValue();b?this.composer.setValue(b,a):(this.composer.clear(),this.editor.fire("set_placeholder"))},sync:function(a){this.editor.currentView.name==="textarea"?this.fromTextareaToComposer(a):this.fromComposerToTextarea(a)},
+_observe:function(){var c,b=this,d=this.textarea.element.form,e=function(){c=setInterval(function(){b.fromComposerToTextarea()},400)},h=function(){clearInterval(c);c=null};e();d&&(a.dom.observe(d,"submit",function(){b.sync(!0)}),a.dom.observe(d,"reset",function(){setTimeout(function(){b.fromTextareaToComposer()},0)}));this.editor.observe("change_view",function(a){a==="composer"&&!c?(b.fromTextareaToComposer(!0),e()):a==="textarea"&&(b.fromComposerToTextarea(!0),h())});this.editor.observe("destroy:composer",
+h)}})})(wysihtml5);
+wysihtml5.views.Textarea=wysihtml5.views.View.extend({name:"textarea",constructor:function(a,c,b){this.base(a,c,b);this._observe()},clear:function(){this.element.value=""},getValue:function(a){var c=this.isEmpty()?"":this.element.value;a&&(c=this.parent.parse(c));return c},setValue:function(a,c){c&&(a=this.parent.parse(a));this.element.value=a},hasPlaceholderSet:function(){var a=wysihtml5.browser.supportsPlaceholderAttributeOn(this.element),c=this.element.getAttribute("placeholder")||null,b=this.element.value;
+return a&&!b||b===c},isEmpty:function(){return!wysihtml5.lang.string(this.element.value).trim()||this.hasPlaceholderSet()},_observe:function(){var a=this.element,c=this.parent,b={focusin:"focus",focusout:"blur"},d=wysihtml5.browser.supportsEvent("focusin")?["focusin","focusout","change"]:["focus","blur","change"];c.observe("beforeload",function(){wysihtml5.dom.observe(a,d,function(a){a=b[a.type]||a.type;c.fire(a).fire(a+":textarea")});wysihtml5.dom.observe(a,["paste","drop"],function(){setTimeout(function(){c.fire("paste").fire("paste:textarea")},
+0)})})}});
+(function(a){var c=a.dom;a.toolbar.Dialog=a.lang.Dispatcher.extend({constructor:function(a,c){this.link=a;this.container=c},_observe:function(){if(!this._observed){var b=this,d=function(a){var c=b._serialize();c==b.elementToChange?b.fire("edit",c):b.fire("save",c);b.hide();a.preventDefault();a.stopPropagation()};c.observe(b.link,"click",function(){c.hasClass(b.link,"wysihtml5-command-dialog-opened")&&setTimeout(function(){b.hide()},0)});c.observe(this.container,"keydown",function(c){var e=c.keyCode;
+e===a.ENTER_KEY&&d(c);e===a.ESCAPE_KEY&&b.hide()});c.delegate(this.container,"[data-wysihtml5-dialog-action=save]","click",d);c.delegate(this.container,"[data-wysihtml5-dialog-action=cancel]","click",function(a){b.fire("cancel");b.hide();a.preventDefault();a.stopPropagation()});for(var e=this.container.querySelectorAll("input, select, textarea"),h=0,f=e.length,i=function(){clearInterval(b.interval)};h<f;h++)c.observe(e[h],"change",i);this._observed=!0}},_serialize:function(){for(var a=this.elementToChange||
+{},c=this.container.querySelectorAll("[data-wysihtml5-dialog-field]"),e=c.length,h=0;h<e;h++)a[c[h].getAttribute("data-wysihtml5-dialog-field")]=c[h].value;return a},_interpolate:function(){for(var a,c,e=document.querySelector(":focus"),h=this.container.querySelectorAll("[data-wysihtml5-dialog-field]"),f=h.length,i=0;i<f;i++)if(a=h[i],a!==e)c=a.getAttribute("data-wysihtml5-dialog-field"),c=this.elementToChange?this.elementToChange[c]||"":a.defaultValue,a.value=c},show:function(a){var d=this,e=this.container.querySelector("input, select, textarea");
+this.elementToChange=a;this._observe();this._interpolate();if(a)this.interval=setInterval(function(){d._interpolate()},500);c.addClass(this.link,"wysihtml5-command-dialog-opened");this.container.style.display="";this.fire("show");if(e&&!a)try{e.focus()}catch(h){}},hide:function(){clearInterval(this.interval);this.elementToChange=null;c.removeClass(this.link,"wysihtml5-command-dialog-opened");this.container.style.display="none";this.fire("hide")}})})(wysihtml5);
+(function(a){var c=a.dom,b={position:"relative"},d={left:0,margin:0,opacity:0,overflow:"hidden",padding:0,position:"absolute",top:0,zIndex:1},e={cursor:"inherit",fontSize:"50px",height:"50px",marginTop:"-25px",outline:0,padding:0,position:"absolute",right:"-12px",top:"50%"},h={"x-webkit-speech":"",speech:""};a.toolbar.Speech=function(f,i){var k=document.createElement("input");if(a.browser.supportsSpeechApiOn(k)){var j=document.createElement("div");a.lang.object(d).merge({width:i.offsetWidth+"px",
+height:i.offsetHeight+"px"});c.insert(k).into(j);c.insert(j).into(i);c.setStyles(e).on(k);c.setAttributes(h).on(k);c.setStyles(d).on(j);c.setStyles(b).on(i);c.observe(k,"onwebkitspeechchange"in k?"webkitspeechchange":"speechchange",function(){f.execCommand("insertText",k.value);k.value=""});c.observe(k,"click",function(a){c.hasClass(i,"wysihtml5-command-disabled")&&a.preventDefault();a.stopPropagation()})}else i.style.display="none"}})(wysihtml5);
+(function(a){var c=a.dom;a.toolbar.Toolbar=Base.extend({constructor:function(b,c){this.editor=b;this.container=typeof c==="string"?document.getElementById(c):c;this.composer=b.composer;this._getLinks("command");this._getLinks("action");this._observe();this.show();for(var e=this.container.querySelectorAll("[data-wysihtml5-command=insertSpeech]"),h=e.length,f=0;f<h;f++)new a.toolbar.Speech(this,e[f])},_getLinks:function(b){for(var c=this[b+"Links"]=a.lang.array(this.container.querySelectorAll("a[data-wysihtml5-"+
+b+"]")).get(),e=c.length,h=0,f=this[b+"Mapping"]={},i,k,j,g;h<e;h++)i=c[h],k=i.getAttribute("data-wysihtml5-"+b),j=i.getAttribute("data-wysihtml5-"+b+"-value"),g=this._getDialog(i,k),f[k+":"+j]={link:i,name:k,value:j,dialog:g,state:!1}},_getDialog:function(b,c){var e=this,h=this.container.querySelector("[data-wysihtml5-dialog='"+c+"']"),f=this.composer.sandbox.getDocument(),i,k;h&&(i=new a.toolbar.Dialog(b,h),i.observe("show",function(){k=a.selection.getBookmark(f)}),i.observe("save",function(b){e.editor.focus(!1);
+k&&a.selection.setBookmark(k);e._execCommand(c,b)}),i.observe("cancel",function(){e.editor.focus(!1)}));return i},execCommand:function(a,c){if(!this.commandsDisabled){var e=this.commandMapping[a+":"+c];e&&e.dialog&&!e.state?e.dialog.show():this._execCommand(a,c)}},_execCommand:function(b,c){this.editor.focus(!1);a.commands.exec(this.composer.element,b,c);this._updateLinkStates()},execAction:function(a){var c=this.editor;switch(a){case "change_view":c.currentView===c.textarea?c.fire("change_view",
+"composer"):c.fire("change_view","textarea")}},_observe:function(){for(var a=this,d=this.editor,e=this.container,h=this.commandLinks.concat(this.actionLinks),f=h.length,i=0;i<f;i++)c.setAttributes({href:"javascript:;",unselectable:"on"}).on(h[i]);c.delegate(e,"[data-wysihtml5-command]","mousedown",function(a){a.preventDefault()});c.delegate(e,"[data-wysihtml5-command]","click",function(c){var d=c.target,e=d.getAttribute("data-wysihtml5-command"),d=d.getAttribute("data-wysihtml5-command-value");a.execCommand(e,
+d);c.preventDefault()});c.delegate(e,"[data-wysihtml5-action]","click",function(c){var d=c.target.getAttribute("data-wysihtml5-action");a.execAction(d);c.preventDefault()});d.observe("focus:composer",function(){a.bookmark=null;clearInterval(a.interval);a.interval=setInterval(function(){a._updateLinkStates()},500)});d.observe("blur:composer",function(){clearInterval(a.interval)});d.observe("destroy:composer",function(){clearInterval(a.interval)});d.observe("change_view",function(d){setTimeout(function(){a.commandsDisabled=
+d!=="composer";a._updateLinkStates();a.commandsDisabled?c.addClass(e,"wysihtml5-commands-disabled"):c.removeClass(e,"wysihtml5-commands-disabled")},0)})},_updateLinkStates:function(){var b=this.composer.element,d=this.commandMapping,e,h,f;for(e in d)if(f=d[e],this.commandsDisabled?(h=!1,c.removeClass(f.link,"wysihtml5-command-active"),f.dialog&&f.dialog.hide()):(h=a.commands.state(b,f.name,f.value),a.lang.object(h).isArray()&&(h=h.length===1?h[0]:!0),c.removeClass(f.link,"wysihtml5-command-disabled")),
+f.state!==h)(f.state=h)?(c.addClass(f.link,"wysihtml5-command-active"),f.dialog&&(typeof h==="object"?f.dialog.show(h):f.dialog.hide())):(c.removeClass(f.link,"wysihtml5-command-active"),f.dialog&&f.dialog.hide())},show:function(){this.container.style.display=""},hide:function(){this.container.style.display="none"}})})(wysihtml5);
+wysihtml5.commands={support:function(a,c){return wysihtml5.browser.supportsCommand(a.ownerDocument,c)},exec:function(a,c,b){var d=this[c],e=d&&d.exec;if(e)return e.call(d,a,c,b);else try{return a.ownerDocument.execCommand(c,!1,b)}catch(h){}},state:function(a,c,b){var d=this[c],e=d&&d.state;if(e)return e.call(d,a,c,b);else try{return a.ownerDocument.queryCommandState(c)}catch(h){return!1}},value:function(a,c){var b=this[c];if(b=b&&b.value)b(a,c);else try{return a.ownerDocument.queryCommandValue(c)}catch(d){return null}}};
+(function(a){a.commands.bold={exec:function(c,b){return a.commands.formatInline.exec(c,b,"b")},state:function(c,b){return a.commands.formatInline.state(c,b,"b")},value:function(){}}})(wysihtml5);
+(function(a){function c(c,f){var i=c.ownerDocument,k="_wysihtml5-temp-"+(new Date).getTime(),j=0,g,l,n;a.commands.formatInline.exec(c,b,d,k,/non-matching-class/g);g=i.querySelectorAll(d+"."+k);for(k=g.length;j<k;j++)for(n in l=g[j],l.removeAttribute("class"),f)l.setAttribute(n,f[n]);j=l;k===1&&(n=e.getTextContent(l),k=!!l.querySelector("*"),n=n===""||n===a.INVISIBLE_SPACE,!k&&n&&(e.setTextContent(l,l.href),i=i.createTextNode(" "),a.selection.setAfter(l),a.selection.insertNode(i),j=i));a.selection.setAfter(j)}
+var b,d="A",e=a.dom;a.commands.createLink={exec:function(b,d,i){var k=b.ownerDocument,j=this.state(b,d);j?a.selection.executeAndRestore(k,function(){for(var a=j.length,b=0,c,d,f;b<a;b++)c=j[b],d=e.getParentElement(c,{nodeName:"code"}),f=e.getTextContent(c),f.match(e.autoLink.URL_REG_EXP)&&!d?e.renameElement(c,"code"):e.replaceWithChildNodes(c)}):(i=typeof i==="object"?i:{href:i},c(b,i))},state:function(b,c){return a.commands.formatInline.state(b,c,"A")},value:function(){return b}}})(wysihtml5);
+(function(a){var c=/wysiwyg-font-size-[a-z]+/g;a.commands.fontSize={exec:function(b,d,e){return a.commands.formatInline.exec(b,d,"span","wysiwyg-font-size-"+e,c)},state:function(b,d,e){return a.commands.formatInline.state(b,d,"span","wysiwyg-font-size-"+e,c)},value:function(){}}})(wysihtml5);
+(function(a){var c=/wysiwyg-color-[a-z]+/g;a.commands.foreColor={exec:function(b,d,e){return a.commands.formatInline.exec(b,d,"span","wysiwyg-color-"+e,c)},state:function(b,d,e){return a.commands.formatInline.state(b,d,"span","wysiwyg-color-"+e,c)},value:function(){}}})(wysihtml5);
+(function(a){function c(b){for(b=b.previousSibling;b&&b.nodeType===a.TEXT_NODE&&!a.lang.string(b.data).trim();)b=b.previousSibling;return b}function b(b){for(b=b.nextSibling;b&&b.nodeType===a.TEXT_NODE&&!a.lang.string(b.data).trim();)b=b.nextSibling;return b}function d(a){if(a.nodeName==="BR")return!0;if(f.getStyle("display").from(a)==="block")return!0;return!1}function e(b,c,d,e){if(e)var h=f.observe(b,"DOMNodeInserted",function(b){b=b.target;b.nodeType===a.ELEMENT_NODE&&f.getStyle("display").from(b).substr(0,
+6)!=="inline"&&(b.className+=" "+e)});b.execCommand(c,!1,d);h&&h.stop()}function h(a){i.selectLine(a.ownerDocument);i.surround(a);var d=b(a),e=c(a);d&&d.nodeName==="BR"&&d.parentNode.removeChild(d);e&&e.nodeName==="BR"&&e.parentNode.removeChild(e);(d=a.lastChild)&&d.nodeName==="BR"&&d.parentNode.removeChild(d);i.selectNode(a)}var f=a.dom,i=a.selection,k=["H1","H2","H3","H4","H5","H6","P","BLOCKQUOTE","DIV"];a.commands.formatBlock={exec:function(j,g,l,n,q){var t=j.ownerDocument,o=this.state(j,g,l,
+n,q),w,l=typeof l==="string"?l.toUpperCase():l;if(o)i.executeAndRestoreSimple(t,function(){if(q)o.className=o.className.replace(q,"");var e=!!a.lang.string(o.className).trim();if(!e&&o.nodeName===(l||"DIV")){var e=o,g=e.ownerDocument,h=b(e),i=c(e);h&&!d(h)&&e.parentNode.insertBefore(g.createElement("br"),h);i&&!d(i)&&e.parentNode.insertBefore(g.createElement("br"),e);f.replaceWithChildNodes(o)}else e&&f.renameElement(o,"DIV")});else{if(l===null||a.lang.array(k).contains(l))if(w=i.getSelectedNode(t),
+o=f.getParentElement(w,{nodeName:k})){i.executeAndRestoreSimple(t,function(){l&&(o=f.renameElement(o,l));if(n){var a=o;a.className?(a.className=a.className.replace(q,""),a.className+=" "+n):a.className=n}});return}if(a.commands.support(j,g))e(t,g,l||"DIV",n);else{o=t.createElement(l||"DIV");if(n)o.className=n;h(o)}}},state:function(a,b,c,d,e){c=typeof c==="string"?c.toUpperCase():c;a=i.getSelectedNode(a.ownerDocument);return f.getParentElement(a,{nodeName:c,className:d,classRegExp:e})},value:function(){}}})(wysihtml5);
+(function(a){function c(c,h,f){var i=c+":"+h;if(!d[i]){var k=d,j=a.selection.HTMLApplier,g=b[c],c=g?[c.toLowerCase(),g.toLowerCase()]:[c.toLowerCase()];k[i]=new j(c,h,f,!0)}return d[i]}var b={strong:"b",em:"i",b:"strong",i:"em"},d={};a.commands.formatInline={exec:function(b,d,f,i,k){b=a.selection.getRange(b.ownerDocument);if(!b)return!1;c(f,i,k).toggleRange(b);a.selection.setSelection(b)},state:function(d,h,f,i,k){d=d.ownerDocument;h=b[f]||f;if(!a.dom.hasElementWithTagName(d,f)&&!a.dom.hasElementWithTagName(d,
+h))return!1;if(i&&!a.dom.hasElementWithClassName(d,i))return!1;d=a.selection.getRange(d);if(!d)return!1;return c(f,i,k).isAppliedToRange(d)},value:function(){}}})(wysihtml5);(function(a){a.commands.insertHTML={exec:function(c,b,d){a.commands.support(c,b)?c.ownerDocument.execCommand(b,!1,d):a.selection.insertHTML(c.ownerDocument,d)},state:function(){return!1},value:function(){}}})(wysihtml5);
+(function(a){a.commands.insertImage={exec:function(c,b,d){var d=typeof d==="object"?d:{src:d},e=c.ownerDocument,b=this.state(c),h;if(b)a.selection.setBefore(b),d=b.parentNode,d.removeChild(b),a.dom.removeEmptyTextNodes(d),d.nodeName==="A"&&!d.firstChild&&(a.selection.setAfter(d),d.parentNode.removeChild(d)),a.quirks.redraw(c);else{b=e.createElement("IMG");for(h in d)b[h]=d[h];a.selection.insertNode(b);a.selection.setAfter(b)}},state:function(c){var c=c.ownerDocument,b;if(!a.dom.hasElementWithTagName(c,
+"IMG"))return!1;b=a.selection.getSelectedNode(c);if(!b)return!1;if(b.nodeName==="IMG")return b;if(b.nodeType!==a.ELEMENT_NODE)return!1;b=a.selection.getText(c);if(b=a.lang.string(b).trim())return!1;c=a.selection.getNodes(c,a.ELEMENT_NODE,function(a){return a.nodeName==="IMG"});if(c.length!==1)return!1;return c[0]},value:function(a){return(a=this.state(a))&&a.src}}})(wysihtml5);
+(function(a){var c="<br>"+(a.browser.needsSpaceAfterLineBreak()?" ":"");a.commands.insertLineBreak={exec:function(b,d){a.commands.support(b,d)?(b.ownerDocument.execCommand(d,!1,null),a.browser.autoScrollsToCaret()||a.selection.scrollIntoView(b)):a.commands.exec(b,"insertHTML",c)},state:function(){return!1},value:function(){}}})(wysihtml5);
+(function(a){a.commands.insertOrderedList={exec:function(c,b){var d=c.ownerDocument,e,h,f;a.commands.support(c,b)?d.execCommand(b,!1,null):(e=a.selection.getSelectedNode(d),(f=a.dom.getParentElement(e,{nodeName:["UL","OL"]},4))?a.selection.executeAndRestoreSimple(d,function(){f.nodeName==="OL"?a.dom.resolveList(f):(f.nodeName==="UL"||f.nodeName==="MENU")&&a.dom.renameElement(f,"ol")}):(h=d.createElement("span"),a.selection.surround(h),e=h.innerHTML===""||h.innerHTML===a.INVISIBLE_SPACE,a.selection.executeAndRestoreSimple(d,
+function(){f=a.dom.convertToList(h,"ol")}),e&&a.selection.selectNode(f.querySelector("li"))))},state:function(a,b){try{return a.ownerDocument.queryCommandState(b)}catch(d){return!1}},value:function(){}}})(wysihtml5);
+(function(a){a.commands.insertUnorderedList={exec:function(c,b){var d=c.ownerDocument,e,h,f;a.commands.support(c,b)?d.execCommand(b,!1,null):(e=a.selection.getSelectedNode(d),(f=a.dom.getParentElement(e,{nodeName:["UL","OL"]}))?a.selection.executeAndRestoreSimple(d,function(){f.nodeName==="UL"?a.dom.resolveList(f):(f.nodeName==="OL"||f.nodeName==="MENU")&&a.dom.renameElement(f,"ul")}):(h=d.createElement("span"),a.selection.surround(h),e=h.innerHTML===""||h.innerHTML===a.INVISIBLE_SPACE,a.selection.executeAndRestoreSimple(d,
+function(){f=a.dom.convertToList(h,"ul")}),e&&a.selection.selectNode(f.querySelector("li"))))},state:function(a,b){try{return a.ownerDocument.queryCommandState(b)}catch(d){return!1}},value:function(){}}})(wysihtml5);(function(a){a.commands.italic={exec:function(c,b){return a.commands.formatInline.exec(c,b,"i")},state:function(c,b){return a.commands.formatInline.state(c,b,"i")},value:function(){}}})(wysihtml5);
+(function(a){var c=/wysiwyg-text-align-[a-z]+/g;a.commands.justifyCenter={exec:function(b){return a.commands.formatBlock.exec(b,"formatBlock",null,"wysiwyg-text-align-center",c)},state:function(b){return a.commands.formatBlock.state(b,"formatBlock",null,"wysiwyg-text-align-center",c)},value:function(){}}})(wysihtml5);
+(function(a){var c=/wysiwyg-text-align-[a-z]+/g;a.commands.justifyLeft={exec:function(b){return a.commands.formatBlock.exec(b,"formatBlock",null,"wysiwyg-text-align-left",c)},state:function(b){return a.commands.formatBlock.state(b,"formatBlock",null,"wysiwyg-text-align-left",c)},value:function(){}}})(wysihtml5);
+(function(a){var c=/wysiwyg-text-align-[a-z]+/g;a.commands.justifyRight={exec:function(b){return a.commands.formatBlock.exec(b,"formatBlock",null,"wysiwyg-text-align-right",c)},state:function(b){return a.commands.formatBlock.state(b,"formatBlock",null,"wysiwyg-text-align-right",c)},value:function(){}}})(wysihtml5);
+(function(a){var c=/wysiwyg-text-decoration-underline/g;a.commands.underline={exec:function(b,d){return a.commands.formatInline.exec(b,d,"span","wysiwyg-text-decoration-underline",c)},state:function(b,d){return a.commands.formatInline.state(b,d,"span","wysiwyg-text-decoration-underline",c)},value:function(){}}})(wysihtml5);
+(function(a){var c={name:void 0,style:!0,toolbar:void 0,autoLink:!0,parserRules:{tags:{br:{},span:{},div:{},p:{}},classes:{}},parser:a.dom.parse,composerClassName:"wysihtml5-editor",bodyClassName:"wysihtml5-supported",stylesheets:[],placeholderText:void 0,allowObjectResizing:!0};a.Editor=a.lang.Dispatcher.extend({constructor:function(b,d){this.textareaElement=typeof b==="string"?document.getElementById(b):b;this.config=a.lang.object({}).merge(c).merge(d).get();this.currentView=this.textarea=new a.views.Textarea(this,
+this.textareaElement,this.config);if(this._isCompatible=a.browser.supported()){a.dom.addClass(document.body,this.config.bodyClassName);this.currentView=this.composer=new a.views.Composer(this,this.textareaElement,this.config);typeof this.config.parser==="function"&&this._initParser();this.observe("beforeload",function(){this.synchronizer=new a.views.Synchronizer(this,this.textarea,this.composer);if(this.config.toolbar)this.toolbar=new a.toolbar.Toolbar(this,this.config.toolbar)});try{console.log("Heya! This page is using wysihtml5 for rich text editing. Check out https://github.com/xing/wysihtml5")}catch(e){}}else{var h=
+this;setTimeout(function(){h.fire("beforeload").fire("load")},0)}},isCompatible:function(){return this._isCompatible},clear:function(){this.currentView.clear();return this},getValue:function(a){return this.currentView.getValue(a)},setValue:function(a,c){if(!a)return this.clear();this.currentView.setValue(a,c);return this},focus:function(a){this.currentView.focus(a);return this},disable:function(){this.currentView.disable();return this},enable:function(){this.currentView.enable();return this},isEmpty:function(){return this.currentView.isEmpty()},
+hasPlaceholderSet:function(){return this.currentView.hasPlaceholderSet()},parse:function(b){var c=this.config.parser(b,this.config.parserRules,this.composer.sandbox.getDocument(),!0);typeof b==="object"&&a.quirks.redraw(b);return c},_initParser:function(){this.observe("paste:composer",function(){var b=this;a.selection.executeAndRestore(this.composer.sandbox.getDocument(),function(){a.quirks.cleanPastedHTML(b.composer.element);b.parse(b.composer.element)},!0)});this.observe("paste:textarea",function(){this.textarea.setValue(this.parse(this.textarea.getValue()))})}})})(wysihtml5);
diff --git a/examples/advanced.html b/examples/advanced.html
index e30a923f..762b9381 100644
--- a/examples/advanced.html
+++ b/examples/advanced.html
@@ -38,7 +38,7 @@
   
   #toolbar,
   textarea {
-    width: 600px;
+    width: 800px;
     padding: 5px;
     box-sizing: boder-box;
     -webkit-box-sizing: border-box;
@@ -47,7 +47,6 @@
   }
   
   textarea {
-    width: 600px;
     height: 280px;
     border: 2px solid green;
     font-family: Verdana;
@@ -92,6 +91,8 @@ <h1>wysihtml5 - Advanced Editor Example</h1>
     <a data-wysihtml5-command="insertImage">insert image</a> |
     <a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h1">h1</a> |
     <a data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h2">h2</a> |
+    <a data-wysihtml5-command="insertUnorderedList">insertUnorderedList</a> |
+    <a data-wysihtml5-command="insertOrderedList">insertUnorderedList</a> |
     <a data-wysihtml5-command="foreColor" data-wysihtml5-command-value="red">red</a> |
     <a data-wysihtml5-command="foreColor" data-wysihtml5-command-value="green">green</a> |
     <a data-wysihtml5-command="foreColor" data-wysihtml5-command-value="blue">blue</a>
@@ -131,32 +132,34 @@ <h2>Events:</h2>
 
 <small>powered by <a href="https://github.com/xing/wysihtml5" target="_blank">wysihtml5</a>.</small>
 
-<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script>
-<script type="text/javascript" src="../dist/wysihtml5-0.1.0.js"></script>
+<script src="../parser_rules/advanced.js"></script>
+<script src="../dist/wysihtml5-0.2.0.js"></script>
 <script>
   var editor = new wysihtml5.Editor("textarea", {
     toolbar:      "toolbar",
-    parserRules:  "rules/spec.json",
-    stylesheets:  "css/stylesheet.css"
+    stylesheets:  "css/stylesheet.css",
+    parserRules:  wysihtml5ParserRules
   });
   
+  var log = document.getElementById("log");
+  
   editor
     .observe("load", function() {
-      $("log").insert("<div>load</div>");
+      log.innerHTML += "<div>load</div>";
     })
     .observe("focus", function() {
-      $("log").insert("<div>focus</div>");
+      log.innerHTML += "<div>focus</div>";
     })
     .observe("blur", function() {
-      $("log").insert("<div>blur</div>");
+      log.innerHTML += "<div>blur</div>";
     })
     .observe("change", function() {
-      $("log").insert("<div>change</div>");
+      log.innerHTML += "<div>change</div>";
     })
     .observe("paste", function() {
-      $("log").insert("<div>paste</div>");
+      log.innerHTML += "<div>paste</div>";
     })
     .observe("newword:composer", function() {
-      $("log").insert("<div>newword:composer</div>");
+      log.innerHTML += "<div>newword:composer</div>";
     });
 </script>
\ No newline at end of file
diff --git a/examples/css/stylesheet.css b/examples/css/stylesheet.css
index 120841c4..77446866 100644
--- a/examples/css/stylesheet.css
+++ b/examples/css/stylesheet.css
@@ -1,11 +1,137 @@
+.wysiwyg-font-size-smaller {
+  font-size: smaller;
+}
+
+.wysiwyg-font-size-larger {
+  font-size: larger;
+}
+
+.wysiwyg-font-size-xx-large {
+  font-size: xx-large;
+}
+
+.wysiwyg-font-size-x-large {
+  font-size: x-large;
+}
+
+.wysiwyg-font-size-large {
+  font-size: large;
+}
+
+.wysiwyg-font-size-medium {
+  font-size: medium;
+}
+
+.wysiwyg-font-size-small {
+  font-size: small;
+}
+
+.wysiwyg-font-size-x-small {
+  font-size: x-small;
+}
+
+.wysiwyg-font-size-xx-small {
+  font-size: xx-small;
+}
+
+.wysiwyg-color-black {
+  color: black;
+}
+
+.wysiwyg-color-silver {
+  color: silver;
+}
+
+.wysiwyg-color-gray {
+  color: gray;
+}
+
+.wysiwyg-color-white {
+  color: white;
+}
+
+.wysiwyg-color-maroon {
+  color: maroon;
+}
+
 .wysiwyg-color-red {
   color: red;
 }
 
-.wysiwyg-color-blue {
-  color: blue;
+.wysiwyg-color-purple {
+  color: purple;
+}
+
+.wysiwyg-color-fuchsia {
+  color: fuchsia;
 }
 
 .wysiwyg-color-green {
   color: green;
+}
+
+.wysiwyg-color-lime {
+  color: lime;
+}
+
+.wysiwyg-color-olive {
+  color: olive;
+}
+
+.wysiwyg-color-yellow {
+  color: yellow;
+}
+
+.wysiwyg-color-navy {
+  color: navy;
+}
+
+.wysiwyg-color-blue {
+  color: blue;
+}
+
+.wysiwyg-color-teal {
+  color: teal;
+}
+
+.wysiwyg-color-aqua {
+  color: aqua;
+}
+
+.wysiwyg-color-xing {
+  color: #006567;
+}
+
+.wysiwyg-text-align-right {
+  text-align: right;
+}
+
+.wysiwyg-text-align-center {
+  text-align: center;
+}
+
+.wysiwyg-text-align-left {
+  text-align: left;
+}
+
+.wysiwyg-text-decoration-underline {
+  text-decoration: underline;
+}
+
+.wysiwyg-float-left {
+  float: left;
+  margin: 0 8px 8px 0;
+}
+
+.wysiwyg-float-right {
+  float: right;
+  margin: 0 0 8px 8px;
+}
+
+.wysiwyg-clear-right {
+  clear: right;
+}
+
+.wysiwyg-clear-left {
+  clear: left;
 }
\ No newline at end of file
diff --git a/examples/rules/spec.json b/examples/rules/spec.json
deleted file mode 100644
index 5edad4e9..00000000
--- a/examples/rules/spec.json
+++ /dev/null
@@ -1 +0,0 @@
-{"classes":{"wysiwyg-font-size-x-large":1,"wysiwyg-font-size-small":1,"wysiwyg-color-yellow":1,"wysiwyg-color-purple":1,"wysiwyg-font-size-x-small":1,"wysiwyg-color-olive":1,"wysiwyg-clear-right":1,"wysiwyg-text-decoration-underline":1,"wysiwyg-font-size-xx-small":1,"wysiwyg-text-align-right":1,"wysiwyg-color-green":1,"wysiwyg-font-size-medium":1,"wysiwyg-float-right":1,"wysiwyg-font-size-larger":1,"wysiwyg-clear-both":1,"wysiwyg-text-align-left":1,"wysiwyg-color-red":1,"wysiwyg-color-black":1,"wysiwyg-color-maroon":1,"wysiwyg-color-fuchsia":1,"wysiwyg-color-blue":1,"wysiwyg-text-align-justify":1,"wysiwyg-color-navy":1,"wysiwyg-clear-left":1,"wysiwyg-color-xing":1,"wysiwyg-font-size-large":1,"wysiwyg-color-silver":1,"wysiwyg-color-aqua":1,"wysiwyg-color-gray":1,"wysiwyg-font-size-smaller":1,"wysiwyg-color-white":1,"wysiwyg-color-lime":1,"wysiwyg-text-align-center":1,"wysiwyg-font-size-xx-large":1,"wysiwyg-color-teal":1,"wysiwyg-float-left":1},"tags":{"tr":{"add_class":{"align":"align_text"}},"strike":{"remove":1},"form":{"rename_tag":"div"},"rt":{"rename_tag":"span"},"code":{},"acronym":{"rename_tag":"span"},"br":{"add_class":{"clear":"clear_br"}},"details":{"rename_tag":"div"},"h4":{"add_class":{"align":"align_text"}},"em":{},"title":{"remove":1},"multicol":{"rename_tag":"div"},"figure":{"rename_tag":"div"},"xmp":{"rename_tag":"span"},"small":{"rename_tag":"span","set_class":"wysiwyg-font-size-smaller"},"area":{"remove":1},"time":{"rename_tag":"span"},"dir":{"rename_tag":"ul"},"bdi":{"rename_tag":"span"},"command":{"remove":1},"ul":{},"progress":{"rename_tag":"span"},"dfn":{"rename_tag":"span"},"iframe":{"remove":1},"figcaption":{"rename_tag":"div"},"a":{"check_attributes":{"href":"url"},"set_attributes":{"rel":"nofollow","target":"_blank"}},"img":{"check_attributes":{"width":"numbers","alt":"alt","src":"url","height":"numbers"},"add_class":{"align":"align_img"}},"rb":{"rename_tag":"span"},"footer":{"rename_tag":"div"},"noframes":{"remove":1},"abbr":{"rename_tag":"span"},"u":{"rename_tag":"span","set_class":"wysiwyg-text-decoration-underline"},"bgsound":{"remove":1},"sup":{"rename_tag":"span"},"address":{"rename_tag":"div"},"basefont":{"remove":1},"nav":{"rename_tag":"div"},"h1":{"add_class":{"align":"align_text"}},"head":{"remove":1},"tbody":{"add_class":{"align":"align_text"}},"dd":{"rename_tag":"div"},"s":{"rename_tag":"span"},"li":{},"td":{"check_attributes":{"rowspan":"numbers","colspan":"numbers"},"add_class":{"align":"align_text"}},"object":{"remove":1},"div":{"add_class":{"align":"align_text"}},"option":{"rename_tag":"span"},"select":{"rename_tag":"span"},"i":{},"track":{"remove":1},"wbr":{"remove":1},"fieldset":{"rename_tag":"div"},"big":{"rename_tag":"span","set_class":"wysiwyg-font-size-larger"},"button":{"rename_tag":"span"},"noscript":{"remove":1},"svg":{"remove":1},"input":{"remove":1},"table":{},"keygen":{"remove":1},"h5":{"add_class":{"align":"align_text"}},"meta":{"remove":1},"map":{"rename_tag":"div"},"isindex":{"remove":1},"mark":{"rename_tag":"span"},"caption":{"add_class":{"align":"align_text"}},"tfoot":{"add_class":{"align":"align_text"}},"base":{"remove":1},"video":{"remove":1},"strong":{},"canvas":{"remove":1},"output":{"rename_tag":"span"},"marquee":{"rename_tag":"span"},"b":{},"q":{"check_attributes":{"cite":"url"}},"applet":{"remove":1},"span":{},"rp":{"rename_tag":"span"},"spacer":{"remove":1},"source":{"remove":1},"aside":{"rename_tag":"div"},"frame":{"remove":1},"section":{"rename_tag":"div"},"body":{"rename_tag":"div"},"ol":{},"nobr":{"rename_tag":"span"},"html":{"rename_tag":"div"},"summary":{"rename_tag":"span"},"var":{"rename_tag":"span"},"del":{"remove":1},"blockquote":{"check_attributes":{"cite":"url"}},"style":{"remove":1},"device":{"remove":1},"meter":{"rename_tag":"span"},"h3":{"add_class":{"align":"align_text"}},"textarea":{"rename_tag":"span"},"embed":{"remove":1},"hgroup":{"rename_tag":"div"},"font":{"rename_tag":"span","add_class":{"size":"size_font"}},"tt":{"rename_tag":"span"},"noembed":{"remove":1},"thead":{"add_class":{"align":"align_text"}},"blink":{"rename_tag":"span"},"plaintext":{"rename_tag":"span"},"xml":{"remove":1},"h6":{"add_class":{"align":"align_text"}},"param":{"remove":1},"th":{"check_attributes":{"rowspan":"numbers","colspan":"numbers"},"add_class":{"align":"align_text"}},"legend":{"rename_tag":"span"},"hr":{},"label":{"rename_tag":"span"},"dl":{"rename_tag":"div"},"kbd":{"rename_tag":"span"},"listing":{"rename_tag":"div"},"dt":{"rename_tag":"span"},"nextid":{"remove":1},"pre":{},"center":{"rename_tag":"div","set_class":"wysiwyg-text-align-center"},"audio":{"remove":1},"datalist":{"rename_tag":"span"},"samp":{"rename_tag":"span"},"col":{"remove":1},"article":{"rename_tag":"div"},"cite":{},"link":{"remove":1},"script":{"remove":1},"bdo":{"rename_tag":"span"},"menu":{"rename_tag":"ul"},"colgroup":{"remove":1},"ruby":{"rename_tag":"span"},"h2":{"add_class":{"align":"align_text"}},"ins":{"rename_tag":"span"},"p":{"add_class":{"align":"align_text"}},"sub":{"rename_tag":"span"},"comment":{"remove":1},"frameset":{"remove":1},"optgroup":{"rename_tag":"span"},"header":{"rename_tag":"div"}}}
\ No newline at end of file
diff --git a/examples/simple.html b/examples/simple.html
index 723aad62..623610cd 100644
--- a/examples/simple.html
+++ b/examples/simple.html
@@ -87,41 +87,33 @@ <h2>Events:</h2>
 
 <small>powered by <a href="https://github.com/xing/wysihtml5" target="_blank">wysihtml5</a>.</small>
 
-<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script>
-<script type="text/javascript" src="../dist/wysihtml5-0.1.0.js"></script>
+<script src="../parser_rules/simple.js"></script>
+<script src="../dist/wysihtml5-0.2.0.js"></script>
 <script>
   var editor = new wysihtml5.Editor("textarea", {
     toolbar:      "toolbar",
-    parserRules:  {
-      tags: {
-        br:     true,
-        strong: true,
-        b:      true,
-        i:      true,
-        em:     true,
-        span:   true,
-        a:      { check_attributes: { href: "url" }, set_attributes: { rel: "nofollow", target: "_blank" } }
-      }
-    }
+    parserRules:  wysihtml5ParserRules
   });
   
+  var log = document.getElementById("log");
+  
   editor
     .observe("load", function() {
-      $("log").insert("<div>load</div>");
+      log.innerHTML += "<div>load</div>";
     })
     .observe("focus", function() {
-      $("log").insert("<div>focus</div>");
+      log.innerHTML += "<div>focus</div>";
     })
     .observe("blur", function() {
-      $("log").insert("<div>blur</div>");
+      log.innerHTML += "<div>blur</div>";
     })
     .observe("change", function() {
-      $("log").insert("<div>change</div>");
+      log.innerHTML += "<div>change</div>";
     })
     .observe("paste", function() {
-      $("log").insert("<div>paste</div>");
+      log.innerHTML += "<div>paste</div>";
     })
     .observe("newword:composer", function() {
-      $("log").insert("<div>newword:composer</div>");
+      log.innerHTML += "<div>newword:composer</div>";
     });
 </script>
\ No newline at end of file
diff --git a/lib/base/base.js b/lib/base/base.js
new file mode 100644
index 00000000..f334e12d
--- /dev/null
+++ b/lib/base/base.js
@@ -0,0 +1,139 @@
+/*
+	Base.js, version 1.1a
+	Copyright 2006-2010, Dean Edwards
+	License: http://www.opensource.org/licenses/mit-license.php
+*/
+
+var Base = function() {
+	// dummy
+};
+
+Base.extend = function(_instance, _static) { // subclass
+	var extend = Base.prototype.extend;
+	
+	// build the prototype
+	Base._prototyping = true;
+	var proto = new this;
+	extend.call(proto, _instance);
+  proto.base = function() {
+    // call this method from any other method to invoke that method's ancestor
+  };
+	delete Base._prototyping;
+	
+	// create the wrapper for the constructor function
+	//var constructor = proto.constructor.valueOf(); //-dean
+	var constructor = proto.constructor;
+	var klass = proto.constructor = function() {
+		if (!Base._prototyping) {
+			if (this._constructing || this.constructor == klass) { // instantiation
+				this._constructing = true;
+				constructor.apply(this, arguments);
+				delete this._constructing;
+			} else if (arguments[0] != null) { // casting
+				return (arguments[0].extend || extend).call(arguments[0], proto);
+			}
+		}
+	};
+	
+	// build the class interface
+	klass.ancestor = this;
+	klass.extend = this.extend;
+	klass.forEach = this.forEach;
+	klass.implement = this.implement;
+	klass.prototype = proto;
+	klass.toString = this.toString;
+	klass.valueOf = function(type) {
+		//return (type == "object") ? klass : constructor; //-dean
+		return (type == "object") ? klass : constructor.valueOf();
+	};
+	extend.call(klass, _static);
+	// class initialisation
+	if (typeof klass.init == "function") klass.init();
+	return klass;
+};
+
+Base.prototype = {	
+	extend: function(source, value) {
+		if (arguments.length > 1) { // extending with a name/value pair
+			var ancestor = this[source];
+			if (ancestor && (typeof value == "function") && // overriding a method?
+				// the valueOf() comparison is to avoid circular references
+				(!ancestor.valueOf || ancestor.valueOf() != value.valueOf()) &&
+				/\bbase\b/.test(value)) {
+				// get the underlying method
+				var method = value.valueOf();
+				// override
+				value = function() {
+					var previous = this.base || Base.prototype.base;
+					this.base = ancestor;
+					var returnValue = method.apply(this, arguments);
+					this.base = previous;
+					return returnValue;
+				};
+				// point to the underlying method
+				value.valueOf = function(type) {
+					return (type == "object") ? value : method;
+				};
+				value.toString = Base.toString;
+			}
+			this[source] = value;
+		} else if (source) { // extending with an object literal
+			var extend = Base.prototype.extend;
+			// if this object has a customised extend method then use it
+			if (!Base._prototyping && typeof this != "function") {
+				extend = this.extend || extend;
+			}
+			var proto = {toSource: null};
+			// do the "toString" and other methods manually
+			var hidden = ["constructor", "toString", "valueOf"];
+			// if we are prototyping then include the constructor
+			var i = Base._prototyping ? 0 : 1;
+			while (key = hidden[i++]) {
+				if (source[key] != proto[key]) {
+					extend.call(this, key, source[key]);
+
+				}
+			}
+			// copy each of the source object's properties to this object
+			for (var key in source) {
+				if (!proto[key]) extend.call(this, key, source[key]);
+			}
+		}
+		return this;
+	}
+};
+
+// initialise
+Base = Base.extend({
+	constructor: function() {
+		this.extend(arguments[0]);
+	}
+}, {
+	ancestor: Object,
+	version: "1.1",
+	
+	forEach: function(object, block, context) {
+		for (var key in object) {
+			if (this.prototype[key] === undefined) {
+				block.call(context, object[key], key, object);
+			}
+		}
+	},
+		
+	implement: function() {
+		for (var i = 0; i < arguments.length; i++) {
+			if (typeof arguments[i] == "function") {
+				// if it's a function, call it
+				arguments[i](this.prototype);
+			} else {
+				// add the interface using the extend method
+				this.prototype.extend(arguments[i]);
+			}
+		}
+		return this;
+	},
+	
+	toString: function() {
+		return String(this.valueOf());
+	}
+});
\ No newline at end of file
diff --git a/lib/rangy/rangy-cssclassapplier-wysihtml5.js b/lib/rangy/rangy-cssclassapplier-wysihtml5.js
deleted file mode 100644
index 7d5778d1..00000000
--- a/lib/rangy/rangy-cssclassapplier-wysihtml5.js
+++ /dev/null
@@ -1,461 +0,0 @@
-/**
- * @license CSS Class Applier module for Rangy.
- * Adds, removes and toggles CSS classes on Ranges and Selections
- *
- * Part of Rangy, a cross-browser JavaScript range and selection library
- * http://code.google.com/p/rangy/
- *
- * Depends on Rangy core.
- *
- * Copyright 2011, Tim Down
- * Licensed under the MIT license.
- * Version: 1.1
- * Build date: 12 March 2011
- *
- * Adjusted by Christopher Blum <christopher.blum@xing.com> to match WYSIHTML5 logic
- * in order to be able ...
- *    - to use custom tags
- *    - to detect and replace similar css classes via reg exp
- */
-rangy.createModule("CssClassApplier", function(api, module) {
-    api.requireModules( ["WrappedSelection", "WrappedRange"] );
-
-    var dom = api.dom;
-    
-    var defaultTagName = "span";
-
-    function trim(str) {
-        return str.replace(/^\s\s*/, "").replace(/\s\s*$/, "");
-    }
-
-    function hasClass(el, cssClass, regExp) {
-        if (!el.className) {
-          return false;
-        }
-        
-        var matchingClassNames = el.className.match(regExp) || [];
-        return matchingClassNames[matchingClassNames.length - 1] === cssClass;
-    }
-
-    function addClass(el, cssClass, regExp) {
-        if (el.className) {
-            removeClass(el, regExp);
-            el.className += " " + cssClass;
-        } else {
-            el.className = cssClass;
-        }
-    }
-
-    function removeClass(el, regExp) {
-        if (el.className) {
-            el.className = el.className.replace(regExp, "");
-        }
-    }
-    
-    function hasSameClasses(el1, el2) {
-        return el1.className.replace(/\s+/, " ") == el2.className.replace(/\s+/, " ");
-    }
-
-    function replaceWithOwnChildren(el) {
-        var parent = el.parentNode;
-        while (el.hasChildNodes()) {
-            parent.insertBefore(el.firstChild, el);
-        }
-        parent.removeChild(el);
-    }
-
-    function elementsHaveSameNonClassAttributes(el1, el2) {
-        if (el1.attributes.length != el2.attributes.length) return false;
-        for (var i = 0, len = el1.attributes.length, attr1, attr2, name; i < len; ++i) {
-            attr1 = el1.attributes[i];
-            name = attr1.name;
-            if (name != "class") {
-                attr2 = el2.attributes.getNamedItem(name);
-                if (attr1.specified != attr2.specified) return false;
-                if (attr1.specified && attr1.nodeValue !== attr2.nodeValue) return false;
-            }
-        }
-        return true;
-    }
-
-    function isSplitPoint(node, offset) {
-        if (dom.isCharacterDataNode(node)) {
-            if (offset == 0) {
-                return !!node.previousSibling;
-            } else if (offset == node.length) {
-                return !!node.nextSibling;
-            } else {
-                return true;
-            }
-        }
-
-        return offset > 0 && offset < node.childNodes.length;
-    }
-
-    function splitNodeAt(node, descendantNode, descendantOffset) {
-
-        var newNode;
-        if (dom.isCharacterDataNode(descendantNode)) {
-            if (descendantOffset == 0) {
-                descendantOffset = dom.getNodeIndex(descendantNode);
-                descendantNode = descendantNode.parentNode;
-            } else if (descendantOffset == descendantNode.length) {
-                descendantOffset = dom.getNodeIndex(descendantNode) + 1;
-                descendantNode = descendantNode.parentNode;
-            } else {
-                newNode = dom.splitDataNode(descendantNode, descendantOffset);
-            }
-        }
-        if (!newNode) {
-            newNode = descendantNode.cloneNode(false);
-            if (newNode.id) {
-                newNode.removeAttribute("id");
-            }
-            var child;
-            while ((child = descendantNode.childNodes[descendantOffset])) {
-
-                newNode.appendChild(child);
-            }
-            dom.insertAfter(newNode, descendantNode);
-        }
-        return (descendantNode == node) ? newNode : splitNodeAt(node, newNode.parentNode, dom.getNodeIndex(newNode));
-    }
-    
-    function Merge(firstNode) {
-        this.isElementMerge = (firstNode.nodeType == 1);
-        this.firstTextNode = this.isElementMerge ? firstNode.lastChild : firstNode;
-        this.textNodes = [this.firstTextNode];
-    }
-
-    Merge.prototype = {
-        doMerge: function() {
-            var textBits = [], textNode, parent, text;
-            for (var i = 0, len = this.textNodes.length; i < len; ++i) {
-                textNode = this.textNodes[i];
-                parent = textNode.parentNode;
-                textBits[i] = textNode.data;
-                if (i) {
-                    parent.removeChild(textNode);
-                    if (!parent.hasChildNodes()) {
-                        parent.parentNode.removeChild(parent);
-                    }
-                }
-            }
-            this.firstTextNode.data = text = textBits.join("");
-            return text;
-        },
-
-        getLength: function() {
-            var i = this.textNodes.length, len = 0;
-            while (i--) {
-                len += this.textNodes[i].length;
-            }
-            return len;
-        },
-
-        toString: function() {
-            var textBits = [];
-            for (var i = 0, len = this.textNodes.length; i < len; ++i) {
-                textBits[i] = "'" + this.textNodes[i].data + "'";
-            }
-            return "[Merge(" + textBits.join(",") + ")]";
-        }
-    };
-
-    function CssClassApplier(tagNames, cssClass, similarClassRegExp, normalize) {
-        this.tagNames = tagNames || [defaultTagName];
-        this.cssClass = cssClass || "";
-        this.similarClassRegExp = similarClassRegExp;
-        this.normalize = normalize;
-        this.applyToAnyTagName = false;
-    }
-
-    CssClassApplier.prototype = {
-        getAncestorWithClass: function(node) {
-            var cssClassMatch;
-            while (node) {
-                cssClassMatch = this.cssClass ? hasClass(node, this.cssClass, this.similarClassRegExp) : true;
-                if (node.nodeType == 1 && dom.arrayContains(this.tagNames, node.tagName.toLowerCase()) && cssClassMatch) {
-                    return node;
-                }
-                node = node.parentNode;
-            }
-            return false;
-        },
-
-        // Normalizes nodes after applying a CSS class to a Range.
-        postApply: function(textNodes, range) {
-            var firstNode = textNodes[0], lastNode = textNodes[textNodes.length - 1];
-
-            var merges = [], currentMerge;
-
-            var rangeStartNode = firstNode, rangeEndNode = lastNode;
-            var rangeStartOffset = 0, rangeEndOffset = lastNode.length;
-
-            var textNode, precedingTextNode;
-
-            for (var i = 0, len = textNodes.length; i < len; ++i) {
-                textNode = textNodes[i];
-                precedingTextNode = this.getAdjacentMergeableTextNode(textNode.parentNode, false);
-                if (precedingTextNode) {
-                    if (!currentMerge) {
-                        currentMerge = new Merge(precedingTextNode);
-                        merges.push(currentMerge);
-                    }
-                    currentMerge.textNodes.push(textNode);
-                    if (textNode === firstNode) {
-                        rangeStartNode = currentMerge.firstTextNode;
-                        rangeStartOffset = rangeStartNode.length;
-                    }
-                    if (textNode === lastNode) {
-                        rangeEndNode = currentMerge.firstTextNode;
-                        rangeEndOffset = currentMerge.getLength();
-                    }
-                } else {
-                    currentMerge = null;
-                }
-            }
-
-            // Test whether the first node after the range needs merging
-            var nextTextNode = this.getAdjacentMergeableTextNode(lastNode.parentNode, true);
-            if (nextTextNode) {
-                if (!currentMerge) {
-                    currentMerge = new Merge(lastNode);
-                    merges.push(currentMerge);
-                }
-                currentMerge.textNodes.push(nextTextNode);
-            }
-
-            // Do the merges
-            if (merges.length) {
-                for (i = 0, len = merges.length; i < len; ++i) {
-                    merges[i].doMerge();
-                }
-                // Set the range boundaries
-                range.setStart(rangeStartNode, rangeStartOffset);
-                range.setEnd(rangeEndNode, rangeEndOffset);
-            }
-
-        },
-        
-        getAdjacentMergeableTextNode: function(node, forward) {
-            var isTextNode = (node.nodeType == 3);
-            var el = isTextNode ? node.parentNode : node;
-            var adjacentNode;
-            var propName = forward ? "nextSibling" : "previousSibling";
-            if (isTextNode) {
-                // Can merge if the node's previous/next sibling is a text node
-                adjacentNode = node[propName];
-                if (adjacentNode && adjacentNode.nodeType == 3) {
-                    return adjacentNode;
-                }
-            } else {
-                // Compare element with its sibling
-                adjacentNode = el[propName];
-                if (adjacentNode && this.areElementsMergeable(node, adjacentNode)) {
-                    return adjacentNode[forward ? "firstChild" : "lastChild"];
-                }
-            }
-            return null;
-        },
-        
-        areElementsMergeable: function(el1, el2) {
-            return dom.arrayContains(this.tagNames, (el1.tagName || "").toLowerCase())
-              && dom.arrayContains(this.tagNames, (el2.tagName || "").toLowerCase())
-              && hasSameClasses(el1, el2)
-              && elementsHaveSameNonClassAttributes(el1, el2);
-        },
-
-        createContainer: function(doc) {
-            var el = doc.createElement(this.tagNames[0]);
-            if (this.cssClass) {
-              el.className = this.cssClass;
-            }
-            return el;
-        },
-
-        applyToTextNode: function(textNode) {
-            var parent = textNode.parentNode;
-            if (parent.childNodes.length == 1 && dom.arrayContains(this.tagNames, parent.tagName.toLowerCase())) {
-                if (this.cssClass) {
-                  addClass(parent, this.cssClass, this.similarClassRegExp);
-                }
-            } else {
-                var el = this.createContainer(dom.getDocument(textNode));
-                textNode.parentNode.insertBefore(el, textNode);
-                el.appendChild(textNode);
-            }
-        },
-
-        isRemovable: function(el) {
-            return dom.arrayContains(this.tagNames, el.tagName.toLowerCase()) && trim(el.className) == this.cssClass;
-        },
-
-        undoToTextNode: function(textNode, range, ancestorWithClass) {
-            if (!range.containsNode(ancestorWithClass)) {
-                // Split out the portion of the ancestor from which we can remove the CSS class
-                var ancestorRange = range.cloneRange();
-                ancestorRange.selectNode(ancestorWithClass);
-
-                if (ancestorRange.isPointInRange(range.endContainer, range.endOffset) && isSplitPoint(range.endContainer, range.endOffset)) {
-                    splitNodeAt(ancestorWithClass, range.endContainer, range.endOffset);
-                    range.setEndAfter(ancestorWithClass);
-                }
-                if (ancestorRange.isPointInRange(range.startContainer, range.startOffset) && isSplitPoint(range.startContainer, range.startOffset)) {
-                    ancestorWithClass = splitNodeAt(ancestorWithClass, range.startContainer, range.startOffset);
-                }
-            }
-            
-            if (this.similarClassRegExp) {
-              removeClass(ancestorWithClass, this.similarClassRegExp);
-            }
-            if (this.isRemovable(ancestorWithClass)) {
-                replaceWithOwnChildren(ancestorWithClass);
-            }
-        },
-
-        applyToRange: function(range) {
-            var textNodes = range.getNodes([3]);
-            if (!textNodes.length) {
-              try {
-                var node = this.createContainer(range.endContainer.ownerDocument);
-                range.surroundContents(node);
-                this.selectNode(range, node);
-                return;
-              } catch(e) {}
-            }
-            
-            range.splitBoundaries();
-            textNodes = range.getNodes([3]);
-            
-            if (textNodes.length) {
-                var textNode;
-
-                for (var i = 0, len = textNodes.length; i < len; ++i) {
-                    textNode = textNodes[i];
-                    if (!this.getAncestorWithClass(textNode)) {
-                        this.applyToTextNode(textNode);
-                    }
-                }
-                
-                range.setStart(textNodes[0], 0);
-                textNode = textNodes[textNodes.length - 1];
-                range.setEnd(textNode, textNode.length);
-                
-                if (this.normalize) {
-                    this.postApply(textNodes, range);
-                }
-            }
-        },
-
-        undoToRange: function(range) {
-            var textNodes = range.getNodes([3]), textNode, ancestorWithClass;
-            if (textNodes.length) {
-              range.splitBoundaries();
-              textNodes = range.getNodes([3]);
-            } else {
-              var doc = range.endContainer.ownerDocument,
-                  node = doc.createTextNode("\uFEFF");
-              range.insertNode(node);
-              range.selectNode(node);
-              textNodes = [node];
-            }
-            
-            for (var i = 0, len = textNodes.length; i < len; ++i) {
-                textNode = textNodes[i];
-                ancestorWithClass = this.getAncestorWithClass(textNode);
-                if (ancestorWithClass) {
-                    this.undoToTextNode(textNode, range, ancestorWithClass);
-                }
-            }
-            
-            if (len == 1) {
-                this.selectNode(range, textNodes[0]);
-            } else {
-                range.setStart(textNodes[0], 0);
-                textNode = textNodes[textNodes.length - 1];
-                range.setEnd(textNode, textNode.length);
-
-                if (this.normalize) {
-                    this.postApply(textNodes, range);
-                }
-            }
-        },
-        
-        selectNode: function(range, node) {
-          var isElement       = node.nodeType === 1,
-              canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : true,
-              content         = isElement ? node.innerHTML : node.data,
-              isEmpty         = (content === "" || content === "\uFEFF");
-
-          if (isEmpty && isElement && canHaveHTML) {
-              // Make sure that caret is visible in node by inserted a zero width no breaking space
-              try { node.innerHTML = "\uFEFF"; } catch(e) {}
-          }
-          range.selectNodeContents(node);
-          if (isEmpty && isElement) {
-              range.collapse(false);
-          } else if (isEmpty) {
-              range.setStartAfter(node);
-              range.setEndAfter(node);
-          }
-        },
-        
-        getTextSelectedByRange: function(textNode, range) {
-            var textRange = range.cloneRange();
-            textRange.selectNodeContents(textNode);
-
-            var intersectionRange = textRange.intersection(range);
-            var text = intersectionRange ? intersectionRange.toString() : "";
-            textRange.detach();
-
-            return text;
-        },
-
-        isAppliedToRange: function(range) {
-            var ancestors = [],
-                ancestor,
-                textNodes = range.getNodes([3]);
-            if (!textNodes.length) {
-              var ancestor = this.getAncestorWithClass(range.startContainer);
-              return ancestor ? [ancestor] : false;
-            }
-            
-            for (var i = 0, len = textNodes.length, selectedText; i < len; ++i) {
-                selectedText = this.getTextSelectedByRange(textNodes[i], range);
-                ancestor = this.getAncestorWithClass(textNodes[i]);
-                if (selectedText != "" && !ancestor) {
-                    return false;
-                } else {
-                    ancestors.push(ancestor);
-                }
-            }
-            return ancestors;
-        },
-
-        toggleRange: function(range) {
-            if (this.isAppliedToRange(range)) {
-                this.undoToRange(range);
-            } else {
-                this.applyToRange(range);
-            }
-        }
-    };
-
-    function createCssClassApplier(tagNames, cssClass, classRegExp, normalize) {
-        return new CssClassApplier(tagNames, cssClass, classRegExp, normalize);
-    }
-
-    CssClassApplier.util = {
-        hasClass: hasClass,
-        addClass: addClass,
-        removeClass: removeClass,
-        hasSameClasses: hasSameClasses,
-        replaceWithOwnChildren: replaceWithOwnChildren,
-        elementsHaveSameNonClassAttributes: elementsHaveSameNonClassAttributes,
-        splitNodeAt: splitNodeAt
-    };
-
-    api.CssClassApplier = CssClassApplier;
-    api.createCssClassApplier = createCssClassApplier;
-});
diff --git a/parser_rules/advanced.js b/parser_rules/advanced.js
new file mode 100644
index 00000000..73d1bdf7
--- /dev/null
+++ b/parser_rules/advanced.js
@@ -0,0 +1,563 @@
+/**
+ * Full HTML5 compatibility rule set
+ * Creates fully valid, secure and compatible HTML5 without affecting the visual appearance
+ *
+ * Examples:
+ *    <font size="1">foo</font>
+ *    ... becomes ...
+ *    <span class="wysiwyg-font-size-xx-small">foo</span>
+ *
+ *    <a href="http://foobar.com">foo</a>
+ *    ... becomes ...
+ *    <a href="http://foobar.com" target="_blank" rel="nofollow">foo</a>
+ *
+ *    <img align="left" src="http://foobar.com/image.png">
+ *    ... becomes ...
+ *    <img class="wysiwyg-float-left" src="http://foobar.com/image.png" alt="">
+ *
+ *    <u>foo</u>
+ *    ... becomes ...
+ *    <span class="wysiwyg-text-decoration-underline">foo</span>
+ *
+ *    <div>foo<script>alert(document.cookie)</script></div>
+ *    ... becomes ...
+ *    <div>foo</div>
+ *
+ *    <marquee>foo</marquee>
+ *    ... becomes ...
+ *    <span>foo</marquee>
+ *
+ *    foo <br clear="both"> bar
+ *    ... becomes ...
+ *    foo <br class="wysiwyg-clear-both"> bar
+ *
+ *    <div>hello <iframe src="http://google.com"></iframe></div>
+ *    ... becomes ...
+ *    <div>hello </div>
+ *
+ *    <center>hello</center>
+ *    ... becomes ...
+ *    <div class="wysiwyg-text-align-center">hello</div>
+ */
+var wysihtml5ParserRules = {
+    /**
+     * CSS Class white-list
+     * Following css classes won't be removed when parsed by the wysihtml5 html parser
+     */
+    "classes": {
+        "wysiwyg-font-size-x-large": 1,
+        "wysiwyg-font-size-small": 1,
+        "wysiwyg-color-yellow": 1,
+        "wysiwyg-color-purple": 1,
+        "wysiwyg-font-size-x-small": 1,
+        "wysiwyg-color-olive": 1,
+        "wysiwyg-clear-right": 1,
+        "wysiwyg-text-decoration-underline": 1,
+        "wysiwyg-font-size-xx-small": 1,
+        "wysiwyg-text-align-right": 1,
+        "wysiwyg-color-green": 1,
+        "wysiwyg-font-size-medium": 1,
+        "wysiwyg-float-right": 1,
+        "wysiwyg-font-size-larger": 1,
+        "wysiwyg-clear-both": 1,
+        "wysiwyg-text-align-left": 1,
+        "wysiwyg-color-red": 1,
+        "wysiwyg-color-black": 1,
+        "wysiwyg-color-maroon": 1,
+        "wysiwyg-color-fuchsia": 1,
+        "wysiwyg-color-blue": 1,
+        "wysiwyg-text-align-justify": 1,
+        "wysiwyg-color-navy": 1,
+        "wysiwyg-clear-left": 1,
+        "wysiwyg-color-xing": 1,
+        "wysiwyg-font-size-large": 1,
+        "wysiwyg-color-silver": 1,
+        "wysiwyg-color-aqua": 1,
+        "wysiwyg-color-gray": 1,
+        "wysiwyg-font-size-smaller": 1,
+        "wysiwyg-color-white": 1,
+        "wysiwyg-color-lime": 1,
+        "wysiwyg-text-align-center": 1,
+        "wysiwyg-font-size-xx-large": 1,
+        "wysiwyg-color-teal": 1,
+        "wysiwyg-float-left": 1
+    },
+    /**
+     * Tag list
+     *
+     * Following options are available:
+     *
+     *    - add_class:        converts and deletes the given HTML4 attribute (align, clear, ...) via the given method to a css class
+     *                        The following methods are implemented in wysihtml5.dom.parse:
+     *                          - align_text:  converts align attribute values (right/left/center/justify) to their corresponding css class "wysiwyg-text-align-*")
+                                  <p align="center">foo</p> ... becomes ... <p> class="wysiwyg-text-align-center">foo</p>
+     *                          - clear_br:    converts clear attribute values left/right/all/both to their corresponding css class "wysiwyg-clear-*"
+     *                            <br clear="all"> ... becomes ... <br class="wysiwyg-clear-both">
+     *                          - align_img:    converts align attribute values (right/left) on <img> to their corresponding css class "wysiwyg-float-*"
+     *                          
+     *    - remove:             removes the element and it's content
+     *
+     *    - rename_tag:         renames the element to the given tag
+     *
+     *    - set_class:          adds the given class to the element (note: make sure that the class is in the "classes" white list above)
+     *
+     *    - set_attributes:     sets/overrides the given attributes
+     *
+     *    - check_attributes:   checks the given HTML attribute via the given method
+     *                            - url:      checks whether the given string is an url, deletes the attribute if not
+     *                            - alt:      strips unwanted characters. if the attribute is not set, then it gets set (to ensure valid and compatible HTML)
+     *                            - numbers:  ensures that the attribute only contains numeric characters
+     */
+    "tags": {
+        "tr": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "strike": {
+            "remove": 1
+        },
+        "form": {
+            "rename_tag": "div"
+        },
+        "rt": {
+            "rename_tag": "span"
+        },
+        "code": {},
+        "acronym": {
+            "rename_tag": "span"
+        },
+        "br": {
+            "add_class": {
+                "clear": "clear_br"
+            }
+        },
+        "details": {
+            "rename_tag": "div"
+        },
+        "h4": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "em": {},
+        "title": {
+            "remove": 1
+        },
+        "multicol": {
+            "rename_tag": "div"
+        },
+        "figure": {
+            "rename_tag": "div"
+        },
+        "xmp": {
+            "rename_tag": "span"
+        },
+        "small": {
+            "rename_tag": "span",
+            "set_class": "wysiwyg-font-size-smaller"
+        },
+        "area": {
+            "remove": 1
+        },
+        "time": {
+            "rename_tag": "span"
+        },
+        "dir": {
+            "rename_tag": "ul"
+        },
+        "bdi": {
+            "rename_tag": "span"
+        },
+        "command": {
+            "remove": 1
+        },
+        "ul": {},
+        "progress": {
+            "rename_tag": "span"
+        },
+        "dfn": {
+            "rename_tag": "span"
+        },
+        "iframe": {
+            "remove": 1
+        },
+        "figcaption": {
+            "rename_tag": "div"
+        },
+        "a": {
+            "check_attributes": {
+                "href": "url"
+            },
+            "set_attributes": {
+                "rel": "nofollow",
+                "target": "_blank"
+            }
+        },
+        "img": {
+            "check_attributes": {
+                "width": "numbers",
+                "alt": "alt",
+                "src": "url",
+                "height": "numbers"
+            },
+            "add_class": {
+                "align": "align_img"
+            }
+        },
+        "rb": {
+            "rename_tag": "span"
+        },
+        "footer": {
+            "rename_tag": "div"
+        },
+        "noframes": {
+            "remove": 1
+        },
+        "abbr": {
+            "rename_tag": "span"
+        },
+        "u": {
+            "rename_tag": "span",
+            "set_class": "wysiwyg-text-decoration-underline"
+        },
+        "bgsound": {
+            "remove": 1
+        },
+        "sup": {
+            "rename_tag": "span"
+        },
+        "address": {
+            "rename_tag": "div"
+        },
+        "basefont": {
+            "remove": 1
+        },
+        "nav": {
+            "rename_tag": "div"
+        },
+        "h1": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "head": {
+            "remove": 1
+        },
+        "tbody": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "dd": {
+            "rename_tag": "div"
+        },
+        "s": {
+            "rename_tag": "span"
+        },
+        "li": {},
+        "td": {
+            "check_attributes": {
+                "rowspan": "numbers",
+                "colspan": "numbers"
+            },
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "object": {
+            "remove": 1
+        },
+        "div": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "option": {
+            "rename_tag": "span"
+        },
+        "select": {
+            "rename_tag": "span"
+        },
+        "i": {},
+        "track": {
+            "remove": 1
+        },
+        "wbr": {
+            "remove": 1
+        },
+        "fieldset": {
+            "rename_tag": "div"
+        },
+        "big": {
+            "rename_tag": "span",
+            "set_class": "wysiwyg-font-size-larger"
+        },
+        "button": {
+            "rename_tag": "span"
+        },
+        "noscript": {
+            "remove": 1
+        },
+        "svg": {
+            "remove": 1
+        },
+        "input": {
+            "remove": 1
+        },
+        "table": {},
+        "keygen": {
+            "remove": 1
+        },
+        "h5": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "meta": {
+            "remove": 1
+        },
+        "map": {
+            "rename_tag": "div"
+        },
+        "isindex": {
+            "remove": 1
+        },
+        "mark": {
+            "rename_tag": "span"
+        },
+        "caption": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "tfoot": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "base": {
+            "remove": 1
+        },
+        "video": {
+            "remove": 1
+        },
+        "strong": {},
+        "canvas": {
+            "remove": 1
+        },
+        "output": {
+            "rename_tag": "span"
+        },
+        "marquee": {
+            "rename_tag": "span"
+        },
+        "b": {},
+        "q": {
+            "check_attributes": {
+                "cite": "url"
+            }
+        },
+        "applet": {
+            "remove": 1
+        },
+        "span": {},
+        "rp": {
+            "rename_tag": "span"
+        },
+        "spacer": {
+            "remove": 1
+        },
+        "source": {
+            "remove": 1
+        },
+        "aside": {
+            "rename_tag": "div"
+        },
+        "frame": {
+            "remove": 1
+        },
+        "section": {
+            "rename_tag": "div"
+        },
+        "body": {
+            "rename_tag": "div"
+        },
+        "ol": {},
+        "nobr": {
+            "rename_tag": "span"
+        },
+        "html": {
+            "rename_tag": "div"
+        },
+        "summary": {
+            "rename_tag": "span"
+        },
+        "var": {
+            "rename_tag": "span"
+        },
+        "del": {
+            "remove": 1
+        },
+        "blockquote": {
+            "check_attributes": {
+                "cite": "url"
+            }
+        },
+        "style": {
+            "remove": 1
+        },
+        "device": {
+            "remove": 1
+        },
+        "meter": {
+            "rename_tag": "span"
+        },
+        "h3": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "textarea": {
+            "rename_tag": "span"
+        },
+        "embed": {
+            "remove": 1
+        },
+        "hgroup": {
+            "rename_tag": "div"
+        },
+        "font": {
+            "rename_tag": "span",
+            "add_class": {
+                "size": "size_font"
+            }
+        },
+        "tt": {
+            "rename_tag": "span"
+        },
+        "noembed": {
+            "remove": 1
+        },
+        "thead": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "blink": {
+            "rename_tag": "span"
+        },
+        "plaintext": {
+            "rename_tag": "span"
+        },
+        "xml": {
+            "remove": 1
+        },
+        "h6": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "param": {
+            "remove": 1
+        },
+        "th": {
+            "check_attributes": {
+                "rowspan": "numbers",
+                "colspan": "numbers"
+            },
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "legend": {
+            "rename_tag": "span"
+        },
+        "hr": {},
+        "label": {
+            "rename_tag": "span"
+        },
+        "dl": {
+            "rename_tag": "div"
+        },
+        "kbd": {
+            "rename_tag": "span"
+        },
+        "listing": {
+            "rename_tag": "div"
+        },
+        "dt": {
+            "rename_tag": "span"
+        },
+        "nextid": {
+            "remove": 1
+        },
+        "pre": {},
+        "center": {
+            "rename_tag": "div",
+            "set_class": "wysiwyg-text-align-center"
+        },
+        "audio": {
+            "remove": 1
+        },
+        "datalist": {
+            "rename_tag": "span"
+        },
+        "samp": {
+            "rename_tag": "span"
+        },
+        "col": {
+            "remove": 1
+        },
+        "article": {
+            "rename_tag": "div"
+        },
+        "cite": {},
+        "link": {
+            "remove": 1
+        },
+        "script": {
+            "remove": 1
+        },
+        "bdo": {
+            "rename_tag": "span"
+        },
+        "menu": {
+            "rename_tag": "ul"
+        },
+        "colgroup": {
+            "remove": 1
+        },
+        "ruby": {
+            "rename_tag": "span"
+        },
+        "h2": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "ins": {
+            "rename_tag": "span"
+        },
+        "p": {
+            "add_class": {
+                "align": "align_text"
+            }
+        },
+        "sub": {
+            "rename_tag": "span"
+        },
+        "comment": {
+            "remove": 1
+        },
+        "frameset": {
+            "remove": 1
+        },
+        "optgroup": {
+            "rename_tag": "span"
+        },
+        "header": {
+            "rename_tag": "div"
+        }
+    }
+};
\ No newline at end of file
diff --git a/parser_rules/simple.js b/parser_rules/simple.js
new file mode 100644
index 00000000..252e5101
--- /dev/null
+++ b/parser_rules/simple.js
@@ -0,0 +1,32 @@
+/**
+ * Very simple basic rule set
+ *
+ * Allows
+ *    <i>, <em>, <b>, <strong>, <p>, <div>, <a href="http://foo"></a>, <br>, <span>, <ol>, <ul>, <li>
+ *
+ * For a proper documentation of the format check full.js
+ */
+var wysihtml5ParserRules = {
+  tags: {
+    strong: {},
+    b:      {},
+    i:      {},
+    em:     {},
+    br:     {},
+    p:      {},
+    div:    {},
+    span:   {},
+    ul:     {},
+    ol:     {},
+    li:     {},
+    a:      {
+      set_attributes: {
+        target: "_blank",
+        rel:    "nofollow"
+      },
+      check_attributes: {
+        href:   "url" // important to avoid XSS
+      }
+    }
+  }
+};
\ No newline at end of file
diff --git a/src/assert/html_equals.js b/src/assert/html_equals.js
index 00fff261..27e94a62 100644
--- a/src/assert/html_equals.js
+++ b/src/assert/html_equals.js
@@ -57,7 +57,7 @@ wysihtml5.assert.htmlEquals = (function() {
   })();
   
   /**
-   * As stated above, firefox doesn't preserve original attribute order
+   * Browsers don't preserve original attribute order
    * In order to be able to compare html we simply split both, the expected and actual html at spaces and element-ends,
    * sort them alphabetically and put them back together
    * TODO: This solution is a bit crappy. Maybe there's a smarter way. However it works for now.
@@ -97,15 +97,15 @@ wysihtml5.assert.htmlEquals = (function() {
   var removeWhiteSpace = (function() {
     var REG_EXP = /(>)(\s*?)(<)/gm;
     return function(html) {
-      return html.replace(REG_EXP, "$1$3").strip();
+      return wysihtml5.lang.string(html.replace(REG_EXP, "$1$3")).trim();
     };
   })();
   
   return function(actual, expected, message, config) {
     config = config || {};
     if (NEEDS_TO_BE_PREPARSED) {
-      actual = wysihtml5.utils.getInDomElement(actual).innerHTML;
-      expected = wysihtml5.utils.getInDomElement(expected).innerHTML;
+      actual = wysihtml5.dom.getAsDom(actual).innerHTML;
+      expected = wysihtml5.dom.getAsDom(expected).innerHTML;
     }
     
     if (config.normalizeWhiteSpace || DOESNT_PRESERVE_WHITE_SPACE) {
@@ -118,12 +118,8 @@ wysihtml5.assert.htmlEquals = (function() {
       expected = removeWhiteSpace(expected);
     }
     
-    if (REORDERS_ATTRIBUTES) {
-      actual = tokenizeHTML(actual);
-      expected = tokenizeHTML(expected);
-      ok(actual == expected, message);
-      return;
-    }
-    equals(actual, expected, message);
+    actual = tokenizeHTML(actual);
+    expected = tokenizeHTML(expected);
+    ok(actual == expected, message);
   };
 })();
\ No newline at end of file
diff --git a/src/browser.js b/src/browser.js
new file mode 100644
index 00000000..c09f5b2c
--- /dev/null
+++ b/src/browser.js
@@ -0,0 +1,318 @@
+/**
+ * Detect browser support for specific features
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ */
+wysihtml5.browser = (function() {
+  var userAgent   = navigator.userAgent,
+      testElement = document.createElement("div"),
+      // Browser sniffing is unfortunately needed since some behaviors are impossible to feature detect
+      isIE        = userAgent.indexOf("MSIE")         !== -1 && userAgent.indexOf("Opera") === -1,
+      isGecko     = userAgent.indexOf("Gecko")        !== -1 && userAgent.indexOf("KHTML") === -1,
+      isWebKit    = userAgent.indexOf("AppleWebKit/") !== -1,
+      isOpera     = userAgent.indexOf("Opera/")       !== -1;
+  
+  return {
+    // Static variable needed, publicly accessible, to be able override it in unit tests
+    USER_AGENT: userAgent,
+    
+    /**
+     * Exclude browsers that are not capable of displaying and handling
+     * contentEditable as desired:
+     *    - iPhone, iPad (tested iOS 4.2.2) and Android (tested 2.2) refuse to make contentEditables focusable
+     *    - IE < 8 create invalid markup and crash randomly from time to time
+     *
+     * @return {Boolean}
+     */
+    supported: function() {
+      var userAgent                   = this.USER_AGENT.toLowerCase(),
+          // Essential for making html elements editable
+          hasContentEditableSupport   = "contentEditable" in testElement,
+          // Following methods are needed in order to interact with the contentEditable area
+          hasEditingApiSupport        = document.execCommand && document.queryCommandSupported && document.queryCommandState,
+          // document selector apis are only supported by IE 8+, Safari 4+, Chrome and Firefox 3.5+
+          hasQuerySelectorSupport     = document.querySelector && document.querySelectorAll,
+          // contentEditable is unusable in mobile browsers (tested iOS 4.2.2, Android 2.2, Opera Mobile)
+          isIncompatibleMobileBrowser = (userAgent.indexOf("webkit") !== -1 && userAgent.indexOf("mobile") !== -1) || userAgent.indexOf("opera mobi") !== -1;
+
+      return hasContentEditableSupport
+        && hasEditingApiSupport
+        && hasQuerySelectorSupport
+        && !isIncompatibleMobileBrowser;
+    },
+
+    /**
+     * Whether the browser supports sandboxed iframes
+     * Currently only IE 6+ offers such feature <iframe security="restricted">
+     *
+     * http://msdn.microsoft.com/en-us/library/ms534622(v=vs.85).aspx
+     * http://blogs.msdn.com/b/ie/archive/2008/01/18/using-frames-more-securely.aspx
+     *
+     * HTML5 sandboxed iframes are still buggy and their DOM is not reachable from the outside (except when using postMessage)
+     */
+    supportsSandboxedIframes: function() {
+      return isIE;
+    },
+
+    /**
+     * IE6+7 throw a mixed content warning when the src of an iframe
+     * is empty/unset or about:blank
+     * window.querySelector is implemented as of IE8
+     */
+    throwsMixedContentWarningWhenIframeSrcIsEmpty: function() {
+      return !("querySelector" in document);
+    },
+
+    /**
+     * Whether the caret is correctly displayed in contentEditable elements
+     * Firefox sometimes shows a huge caret in the beginning after focusing
+     */
+    displaysCaretInEmptyContentEditableCorrectly: function() {
+      return !isGecko;
+    },
+
+    /**
+     * Opera and IE are the only browsers who offer the css value
+     * in the original unit, thx to the currentStyle object
+     * All other browsers provide the computed style in px via window.getComputedStyle
+     */
+    hasCurrentStyleProperty: function() {
+      return "currentStyle" in testElement;
+    },
+
+    /**
+     * Whether the browser inserts a <br> when pressing enter in a contentEditable element
+     */
+    insertsLineBreaksOnReturn: function() {
+      return isGecko;
+    },
+
+    supportsPlaceholderAttributeOn: function(element) {
+      return "placeholder" in element;
+    },
+
+    supportsEvent: function(eventName) {
+      return "on" + eventName in testElement || (function() {
+        testElement.setAttribute("on" + eventName, "return;");
+        return typeof(testElement["on" + eventName]) === "function";
+      })();
+    },
+
+    /**
+     * Opera doesn't correctly fire focus/blur events when clicking in- and outside of iframe
+     */
+    supportsEventsInIframeCorrectly: function() {
+      return !isOpera;
+    },
+
+    /**
+     * Chrome & Safari only fire the ondrop/ondragend/... events when the ondragover event is cancelled
+     * with event.preventDefault
+     * Firefox 3.6 fires those events anyway, but the mozilla doc says that the dragover/dragenter event needs
+     * to be cancelled
+     */
+    firesOnDropOnlyWhenOnDragOverIsCancelled: function() {
+      return isWebKit || isGecko;
+    },
+    
+    /**
+     * Whether the browser supports the event.dataTransfer property in a proper way
+     */
+    supportsDataTransfer: function() {
+      try {
+        // Firefox doesn't support dataTransfer in a safe way, it doesn't strip script code in the html payload (like Chrome does)
+        return isWebKit && (window.Clipboard || window.DataTransfer).prototype.getData;
+      } catch(e) {
+        return false;
+      }
+    },
+
+    /**
+     * Everything below IE9 doesn't know how to treat HTML5 tags
+     *
+     * @param {Object} context The document object on which to check HTML5 support
+     *
+     * @example
+     *    wysihtml5.browser.supportsHTML5Tags(document);
+     */
+    supportsHTML5Tags: function(context) {
+      var element = context.createElement("div"),
+          html5   = "<article>foo</article>";
+      element.innerHTML = html5;
+      return element.innerHTML.toLowerCase() === html5;
+    },
+
+    /**
+     * Checks whether a document supports a certain queryCommand
+     * In particular, Opera needs a reference to a document that has a contentEditable in it's dom tree
+     * in oder to report correct results
+     *
+     * @param {Object} doc Document object on which to check for a query command
+     * @param {String} command The query command to check for
+     * @return {Boolean}
+     *
+     * @example
+     *    wysihtml5.browser.supportsCommand(document, "bold");
+     */
+    supportsCommand: (function() {
+      // Following commands are supported but contain bugs in some browsers
+      var buggyCommands = {
+        // formatBlock fails with some tags (eg. <blockquote>)
+        "formatBlock":          isIE,
+         // When inserting unordered or ordered lists in Firefox, Chrome or Safari, the current selection or line gets
+         // converted into a list (<ul><li>...</li></ul>, <ol><li>...</li></ol>)
+         // IE and Opera act a bit different here as they convert the entire content of the current block element into a list
+        "insertUnorderedList":  isIE || isOpera,
+        "insertOrderedList":    isIE || isOpera
+      };
+
+      return function(doc, command) {
+        var isBuggy = buggyCommands[command];
+        if (!isBuggy) {
+          // Firefox throws errors when invoking queryCommandSupported or queryCommandEnabled
+          try {
+            return doc.queryCommandSupported(command);
+          } catch(e1) {}
+
+          try {
+            return doc.queryCommandEnabled(command);
+          } catch(e2) {}
+        }
+        return false;
+      };
+    })(),
+
+    /**
+     * IE: URLs starting with:
+     *    www., http://, https://, ftp://, gopher://, mailto:, new:, snews:, telnet:, wasis:, file://,
+     *    nntp://, newsrc:, ldap://, ldaps://, outlook:, mic:// and url:
+     * will automatically be auto-linked when either the user inserts them via copy&paste or presses the
+     * space bar when the caret is directly after such an url.
+     * This behavior cannot easily be avoided in IE < 9 since the logic is hardcoded in the mshtml.dll
+     * (related blog post on msdn
+     * http://blogs.msdn.com/b/ieinternals/archive/2009/09/17/prevent-automatic-hyperlinking-in-contenteditable-html.aspx).
+     */
+    doesAutoLinkingInContentEditable: function() {
+      return isIE;
+    },
+
+    /**
+     * As stated above, IE auto links urls typed into contentEditable elements
+     * Since IE9 it's possible to prevent this behavior
+     */
+    canDisableAutoLinking: function() {
+      return this.supportsCommand(document, "AutoUrlDetect");
+    },
+
+    /**
+     * IE leaves an empty paragraph in the contentEditable element after clearing it
+     * Chrome/Safari sometimes an empty <div>
+     */
+    clearsContentEditableCorrectly: function() {
+      return isGecko || isOpera || isWebKit;
+    },
+
+    /**
+     * IE gives wrong results for getAttribute
+     */
+    supportsGetAttributeCorrectly: function() {
+      var td = document.createElement("td");
+      return td.getAttribute("rowspan") != "1";
+    },
+
+    /**
+     * When clicking on images in IE, Opera and Firefox, they are selected, which makes it easy to interact with them.
+     * Chrome and Safari both don't support this
+     */
+    canSelectImagesInContentEditable: function() {
+      return isGecko || isIE || isOpera;
+    },
+
+    /**
+     * When the caret is in an empty list (<ul><li>|</li></ul>) which is the first child in an contentEditable container
+     * pressing backspace doesn't remove the entire list as done in other browsers
+     */
+    clearsListsInContentEditableCorrectly: function() {
+      return isGecko || isIE || isWebKit;
+    },
+
+    /**
+     * All browsers except Safari and Chrome automatically scroll the range/caret position into view
+     */
+    autoScrollsToCaret: function() {
+      return !isWebKit;
+    },
+
+    /**
+     * Check whether the browser automatically closes tags that don't need to be opened
+     */
+    autoClosesUnclosedTags: function() {
+      var clonedTestElement = testElement.cloneNode(false),
+          returnValue,
+          innerHTML;
+
+      clonedTestElement.innerHTML = "<p><div></div>";
+      innerHTML                   = clonedTestElement.innerHTML.toLowerCase();
+      returnValue                 = innerHTML === "<p></p><div></div>" || innerHTML === "<p><div></div></p>";
+
+      // Cache result by overwriting current function
+      this.autoClosesUnclosedTags = function() { return returnValue; };
+
+      return returnValue;
+    },
+
+    /**
+     * Whether the browser supports the native document.getElementsByClassName which returns live NodeLists
+     */
+    supportsNativeGetElementsByClassName: function() {
+      return String(document.getElementsByClassName).indexOf("[native code]") !== -1;
+    },
+
+    /**
+     * As of now (19.04.2011) only supported by Firefox 4 and Chrome
+     * See https://developer.mozilla.org/en/DOM/Selection/modify
+     */
+    supportsSelectionModify: function() {
+      return "getSelection" in window && "modify" in window.getSelection();
+    },
+    
+    /**
+     * Whether the browser supports the classList object for fast className manipulation
+     * See https://developer.mozilla.org/en/DOM/element.classList
+     */
+    supportsClassList: function() {
+      return "classList" in testElement;
+    },
+    
+    /**
+     * Opera needs a white space after a <br> in order to position the caret correctly
+     */
+    needsSpaceAfterLineBreak: function() {
+      return isOpera;
+    },
+    
+    /**
+     * Whether the browser supports the speech api on the given element
+     * See http://mikepultz.com/2011/03/accessing-google-speech-api-chrome-11/
+     *
+     * @example
+     *    var input = document.createElement("input");
+     *    if (wysihtml5.browser.supportsSpeechApiOn(input)) {
+     *      // ...
+     *    }
+     */
+    supportsSpeechApiOn: function(input) {
+      var chromeVersion = userAgent.match(/Chrome\/(\d+)/) || [, 0];
+      return chromeVersion[1] >= 11 && ("onwebkitspeechchange" in input || "speech" in input);
+    },
+    
+    /**
+     * IE9 crashes when setting a getter via Object.defineProperty on XMLHttpRequest or XDomainRequest
+     * See https://connect.microsoft.com/ie/feedback/details/650112
+     * or try the POC http://tifftiff.de/ie9_crash/
+     */
+    crashesWhenDefineProperty: function(property) {
+      return isIE && (property === "XMLHttpRequest" || property === "XDomainRequest");
+    }
+  };
+})();
\ No newline at end of file
diff --git a/src/browser_support.js b/src/browser_support.js
deleted file mode 100644
index b41ffd0f..00000000
--- a/src/browser_support.js
+++ /dev/null
@@ -1,267 +0,0 @@
-/**
- * Detect browser support for specific features
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- */
-wysihtml5.browserSupports = {
-  TEST_ELEMENT: document.createElement("div"),
-  
-  // Static variable needed, publicly accessible, to be able override it in unit tests
-  USER_AGENT: navigator.userAgent,
-  
-  /**
-   * Exclude browsers that are not capable of displaying and handling
-   * contentEditable as desired:
-   *    - iPhone, iPad (tested iOS 4.2.2) and Android (tested 2.2) refuse to make contentEditables focusable
-   *    - IE < 8 create invalid markup and crash randomly from time to time
-   *
-   * @return {Boolean}
-   */
-  contentEditable: function() {
-    var userAgent                   = this.USER_AGENT.toLowerCase(),
-        // Essential for making html elements editable
-        hasContentEditableSupport   = "contentEditable" in this.TEST_ELEMENT,
-        // Following methods are needed in order to interact with the contentEditable area
-        hasEditingApiSupport        = document.execCommand && document.queryCommandSupported && document.queryCommandState,
-        // document selector apis are only supported by IE 8+, Safari 4+, Chrome and Firefox 3.5+
-        hasQuerySelectorSupport     = document.querySelector && document.querySelectorAll,
-        // contentEditable is unusable in mobile browsers (tested iOS 4.2.2, Android 2.2, Opera Mobile)
-        isIncompatibleMobileBrowser = (userAgent.include("webkit") && userAgent.include("mobile")) || userAgent.include("opera mobi");
-    
-    return hasContentEditableSupport
-      && hasEditingApiSupport
-      && hasQuerySelectorSupport
-      && !isIncompatibleMobileBrowser;
-  },
-  
-  /**
-   * Whether the browser supports sandboxed iframes
-   * Currently only IE 6+ offers such feature <iframe security="restricted">
-   *
-   * http://msdn.microsoft.com/en-us/library/ms534622(v=vs.85).aspx
-   * http://blogs.msdn.com/b/ie/archive/2008/01/18/using-frames-more-securely.aspx
-   *
-   * HTML5 sandboxed iframes are still buggy and their DOM is not reachable from the outside (except when using postMessage)
-   */
-  sandboxedIframes: function() {
-    return Prototype.Browser.IE;
-  },
-  
-  /**
-   * IE6+7 throw a mixed content warning when the src of an iframe
-   * is empty/unset or about:blank
-   * window.querySelector is implemented as of IE8
-   */
-  emptyIframeSrcInHttpsContext: function() {
-    return "querySelector" in document;
-  },
-  
-  /**
-   * Whether the caret is correctly displayed in contentEditable elements
-   * Firefox sometimes shows a huge caret in the beginning after focusing
-   */
-  caretInEmptyContentEditableCorrectly: function() {
-    return !Prototype.Browser.Gecko;
-  },
-  
-  /**
-   * Opera and IE are the only browsers who offer the css value
-   * in the original unit, thx to the currentStyle object
-   * All other browsers provide the computed style in px via window.getComputedStyle
-   */
-  computedStyleInPercent: function() {
-    return "currentStyle" in this.TEST_ELEMENT;
-  },
-  
-  /**
-   * Whether the browser inserts a <br> when pressing enter in a contentEditable element
-   */
-  lineBreaksOnReturn: function() {
-    return Prototype.Browser.Gecko;
-  },
-  
-  placeholderOn: function(element) {
-    return "placeholder" in element;
-  },
-  
-  event: function(eventName) {
-    var element = this.TEST_ELEMENT;
-    return "on" + eventName in element || (function() {
-      element.setAttribute("on" + eventName, "return;");
-      return typeof(element["on" + eventName]) === "function";
-    })();
-  },
-  
-  /**
-   * Opera doesn't correctly fire focus/blur events when clicking in- and outside of iframe
-   */
-  eventsInIframeCorrectly: function() {
-    return !Prototype.Browser.Opera;
-  },
-  
-  /**
-   * Chrome & Safari only fire the ondrop/ondragend/... events when the ondragover event is cancelled
-   * with event.preventDefault
-   * Firefox 3.6 fires those events anyway, but the mozilla doc says that the dragover/dragenter event needs
-   * to be cancelled
-   */
-  onDropOnlyWhenOnDragOverIsCancelled: function() {
-    return Prototype.Browser.WebKit || Prototype.Browser.Gecko;
-  },
-  
-  htmlDataTransfer: function() {
-    try {
-      // Firefox doesn't support dataTransfer in a safe way, it doesn't strip script code in the html payload (like Chrome does)
-      return Prototype.Browser.WebKit && (window.Clipboard || window.DataTransfer).prototype.getData;
-    } catch(e) {
-      return false;
-    }
-  },
-  
-  /**
-   * Everything below IE9 doesn't know how to treat HTML5 tags
-   *
-   * @param {Object} context The document object on which to check HTML5 support
-   *
-   * @example
-   *    wysihtml5.browserSupports.html5Tags(document);
-   */
-  html5Tags: function(context) {
-    var element = context.createElement("div"),
-        html5   = "<article>foo</article>";
-    element.innerHTML = html5;
-    return element.innerHTML.toLowerCase() === html5;
-  },
-  
-  /**
-   * Checks whether a document supports a certain queryCommand
-   * In particular, Opera needs a reference to a document that has a contentEditable in it's dom tree
-   * in oder to report correct results
-   *
-   * @param {Object} doc Document object on which to check for a query command
-   * @param {String} command The query command to check for
-   * @return {Boolean}
-   *
-   * @example
-   *    wysihtml5.browserSupports.command(document, "bold");
-   */
-  command: (function() {
-    // Following commands are supported but contain bugs in some browsers
-    var buggyCommands = {
-      // formatBlock fails with some tags (eg. <blockquote>)
-      "formatBlock":          Prototype.Browser.IE,
-       // When inserting unordered or ordered lists in Firefox, Chrome or Safari, the current selection or line gets
-       // converted into a list (<ul><li>...</li></ul>, <ol><li>...</li></ol>)
-       // IE and Opera act a bit different here as they convert the entire content of the current block element into a list
-      "insertUnorderedList":  Prototype.Browser.IE || Prototype.Browser.Opera,
-      "insertOrderedList":    Prototype.Browser.IE || Prototype.Browser.Opera
-    };
-    
-    return function(doc, command) {
-      var isBuggy = buggyCommands[command];
-      if (isBuggy) {
-        return false;
-      } else {
-        // Firefox throws errors when invoking queryCommandSupported or queryCommandEnabled
-        return Try.these(
-          function() { return doc.queryCommandSupported(command); },
-          function() { return doc.queryCommandEnabled(command); }
-        ) || false;
-      }
-    };
-  })(),
-  
-  /**
-   * IE: URLs starting with:
-   *    www., http://, https://, ftp://, gopher://, mailto:, new:, snews:, telnet:, wasis:, file://,
-   *    nntp://, newsrc:, ldap://, ldaps://, outlook:, mic:// and url: 
-   * will automatically be auto-linked when either the user inserts them via copy&paste or presses the
-   * space bar when the caret is directly after such an url.
-   * This behavior cannot easily be avoided in IE < 9 since the logic is hardcoded in the mshtml.dll
-   * (related blog post on msdn
-   * http://blogs.msdn.com/b/ieinternals/archive/2009/09/17/prevent-automatic-hyperlinking-in-contenteditable-html.aspx).
-   */
-  autoLinkingInContentEditable: function() {
-    return Prototype.Browser.IE;
-  },
-  
-  /**
-   * As stated above, IE auto links urls typed into contentEditable elements
-   * Since IE9 it's possible to prevent this behavior
-   */
-  disablingOfAutoLinking: function() {
-    return this.command(document, "AutoUrlDetect");
-  },
-  
-  /**
-   * IE leaves an empty paragraph in the contentEditable element after clearing it
-   * Chrome/Safari sometimes an empty <div>
-   */
-  clearingOfContentEditableCorrectly: function() {
-    return Prototype.Browser.Gecko || Prototype.Browser.Opera || Prototype.Browser.WebKit;
-  },
-  
-  /**
-   * IE gives wrong results for getAttribute
-   */
-  getAttributeCorrectly: function() {
-    var td = document.createElement("td");
-    return td.getAttribute("rowspan") != "1";
-  },
-  
-  /**
-   * When clicking on images in IE, Opera and Firefox, they are selected, which makes it easy to interact with them.
-   * Chrome and Safari both don't support this
-   */
-  selectingOfImagesInContentEditableOnClick: function() {
-    return Prototype.Browser.Gecko || Prototype.Browser.IE || Prototype.Browser.Opera;
-  },
-  
-  /**
-   * When the caret is in an empty list (<ul><li>|</li></ul>) which is the first child in an contentEditable container
-   * pressing backspace doesn't remove the entire list as done in other browsers
-   */
-  clearingOfListsInContentEditableCorrectly: function() {
-    return Prototype.Browser.IE || Prototype.Browser.WebKit || Prototype.Browser.Gecko;
-  },
-  
-  /**
-   * All browsers except Safari and Chrome automatically scroll the range/caret position into view
-   */
-  autoScrollIntoViewOfCaret: function() {
-    return !Prototype.Browser.WebKit;
-  },
-  
-  /**
-   * Check whether the browser automatically closes tags that don't need to be opened
-   */
-  closingOfUnclosedTags: function() {
-    var testElement = this.TEST_ELEMENT.cloneNode(false),
-        returnValue,
-        innerHTML;
-    
-    testElement.innerHTML = "<p><div></div>";
-    innerHTML             = testElement.innerHTML.toLowerCase();
-    returnValue           = innerHTML === "<p></p><div></div>" || innerHTML === "<p><div></div></p>";
-    
-    // Cache result by overwriting current function
-    this.closingOfUnclosedTags = function() { return returnValue; };
-    
-    return returnValue;
-  },
-  
-  /**
-   * Whether the browser supports the native document.getElementsByClassName which returns live NodeLists
-   */
-  getElementsByClassName: function() {
-    return String(document.getElementsByClassName).indexOf("[native code]") !== -1;
-  },
-  
-  /**
-   * As of now (19.04.2011) only supported by Firefox 4 and Chrome
-   * See https://developer.mozilla.org/en/DOM/Selection/modify
-   */
-  selectionModify: function() {
-    return ("getSelection" in window) && ("modify" in window.getSelection());
-  }
-};
\ No newline at end of file
diff --git a/src/commands.js b/src/commands.js
index 96287e0e..6018d874 100644
--- a/src/commands.js
+++ b/src/commands.js
@@ -13,7 +13,7 @@ wysihtml5.commands = {
    *    wysihtml5.commands.supports(element, "createLink");
    */
   support: function(element, command) {
-    return wysihtml5.browserSupports.command(element.ownerDocument, command);
+    return wysihtml5.browser.supportsCommand(element.ownerDocument, command);
   },
   
   /**
@@ -29,7 +29,7 @@ wysihtml5.commands = {
     var obj     = this[command],
         method  = obj && obj.exec;
     if (method) {
-      return method(element, command, value);
+      return method.call(obj, element, command, value);
     } else {
       try {
         // try/catch for buggy firefox
@@ -53,8 +53,7 @@ wysihtml5.commands = {
     var obj     = this[command],
         method  = obj && obj.state;
     if (method) {
-      // TODO: Consider to pass the selectedNode as element instead of the contentEditable
-      return method(element, command, commandValue);
+      return method.call(obj, element, command, commandValue);
     } else {
       try {
         // try/catch for buggy firefox
diff --git a/src/commands/bold.js b/src/commands/bold.js
index f14ca2ed..303f03f2 100644
--- a/src/commands/bold.js
+++ b/src/commands/bold.js
@@ -1,26 +1,23 @@
-wysihtml5.commands.bold = (function() {
+(function(wysihtml5) {
   var undef;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatInline.exec(element, command, "b");
-  }
-  
-  function state(element, command, color) {
-    // element.ownerDocument.queryCommandState("bold") results:
-    // firefox: only <b>
-    // chrome:  <b>, <strong>, <h1>, <h2>, ...
-    // ie:      <b>, <strong>
-    // opera:   <b>, <strong>
-    return wysihtml5.commands.formatInline.state(element, command, "b");
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.bold = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatInline.exec(element, command, "b");
+    },
+
+    state: function(element, command, color) {
+      // element.ownerDocument.queryCommandState("bold") results:
+      // firefox: only <b>
+      // chrome:  <b>, <strong>, <h1>, <h2>, ...
+      // ie:      <b>, <strong>
+      // opera:   <b>, <strong>
+      return wysihtml5.commands.formatInline.state(element, command, "b");
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
+
diff --git a/src/commands/createLink.js b/src/commands/createLink.js
index 1091b718..0b0ffa71 100644
--- a/src/commands/createLink.js
+++ b/src/commands/createLink.js
@@ -1,6 +1,7 @@
-wysihtml5.commands.createLink = (function() {
+(function(wysihtml5) {
   var undef,
-      NODE_NAME = "A";
+      NODE_NAME = "A",
+      dom       = wysihtml5.dom;
   
   function _removeFormat(element, anchors) {
     var length = anchors.length,
@@ -10,20 +11,20 @@ wysihtml5.commands.createLink = (function() {
         textContent;
     for (; i<length; i++) {
       anchor      = anchors[i];
-      codeElement = wysihtml5.utils.getParentElement(anchor, { nodeName: "code" });
-      textContent = wysihtml5.utils.getTextContent(anchor);
-      
+      codeElement = dom.getParentElement(anchor, { nodeName: "code" });
+      textContent = dom.getTextContent(anchor);
+
       // if <a> contains url-like text content, rename it to <code> to prevent re-autolinking
       // else replace <a> with its childNodes
-      if (textContent.match(wysihtml5.utils.autoLink.URL_REG_EXP) && !codeElement) {
+      if (textContent.match(dom.autoLink.URL_REG_EXP) && !codeElement) {
         // <code> element is used to prevent later auto-linking of the content
-        codeElement = wysihtml5.utils.renameElement(anchor, "code");
+        codeElement = dom.renameElement(anchor, "code");
       } else {
-        wysihtml5.utils.unwrap(anchor);
+        dom.replaceWithChildNodes(anchor);
       }
     }
   }
-  
+
   function _format(element, attributes) {
     var doc             = element.ownerDocument,
         tempClass       = "_wysihtml5-temp-" + new Date().getTime(),
@@ -48,63 +49,59 @@ wysihtml5.commands.createLink = (function() {
         anchor.setAttribute(j, attributes[j]);
       }
     }
-    
+
     elementToSetCaretAfter = anchor;
     if (length === 1) {
-      textContent = wysihtml5.utils.getTextContent(anchor);
+      textContent = dom.getTextContent(anchor);
       hasElementChild = !!anchor.querySelector("*");
-      isEmpty = textContent === "" || textContent === "\uFEFF";
+      isEmpty = textContent === "" || textContent === wysihtml5.INVISIBLE_SPACE;
       if (!hasElementChild && isEmpty) {
-        wysihtml5.utils.setTextContent(anchor, anchor.href);
+        dom.setTextContent(anchor, anchor.href);
         whiteSpace = doc.createTextNode(" ");
-        wysihtml5.utils.caret.setAfter(anchor);
-        wysihtml5.utils.caret.insertNode(whiteSpace);
+        wysihtml5.selection.setAfter(anchor);
+        wysihtml5.selection.insertNode(whiteSpace);
         elementToSetCaretAfter = whiteSpace;
       }
     }
-    wysihtml5.utils.caret.setAfter(elementToSetCaretAfter);
+    wysihtml5.selection.setAfter(elementToSetCaretAfter);
   }
   
-  /**
-   * TODO: Use cssapplier or formatInline here
-   *
-   * Turns selection into a link
-   * If selection is already a link, it removes the link and wraps it with a <code> element
-   * The <code> element is needed to avoid auto linking
-   * 
-   * @example
-   *    // either ...
-   *    wysihtml5.commands.createLink.exec(element, "createLink", "http://www.google.de");
-   *    // ... or ...
-   *    wysihtml5.commands.createLink.exec(element, "createLink", { href: "http://www.google.de", target: "_blank" });
-   */
-  function exec(element, command, value) {
-    var doc           = element.ownerDocument,
-        anchors       = state(element, command);
-    
-    if (anchors) {
-      // Selection contains links
-      wysihtml5.utils.caret.executeAndRestore(doc, function() {
-        _removeFormat(element, anchors);
-      });
-    } else {
-      // Create links
-      value = typeof(value) === "object" ? value : { href: value };
-      _format(element, value);
+  wysihtml5.commands.createLink = {
+    /**
+     * TODO: Use HTMLApplier or formatInline here
+     *
+     * Turns selection into a link
+     * If selection is already a link, it removes the link and wraps it with a <code> element
+     * The <code> element is needed to avoid auto linking
+     * 
+     * @example
+     *    // either ...
+     *    wysihtml5.commands.createLink.exec(element, "createLink", "http://www.google.de");
+     *    // ... or ...
+     *    wysihtml5.commands.createLink.exec(element, "createLink", { href: "http://www.google.de", target: "_blank" });
+     */
+    exec: function(element, command, value) {
+      var doc           = element.ownerDocument,
+          anchors       = this.state(element, command);
+
+      if (anchors) {
+        // Selection contains links
+        wysihtml5.selection.executeAndRestore(doc, function() {
+          _removeFormat(element, anchors);
+        });
+      } else {
+        // Create links
+        value = typeof(value) === "object" ? value : { href: value };
+        _format(element, value);
+      }
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatInline.state(element, command, "A");
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatInline.state(element, command, "A");
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/fontSize.js b/src/commands/fontSize.js
index 49dfa869..209b0a5f 100644
--- a/src/commands/fontSize.js
+++ b/src/commands/fontSize.js
@@ -1,27 +1,23 @@
 /**
- * execCommand("fontSize") will create either inline styles (firefox, chrome) or use font tags
+ * document.execCommand("fontSize") will create either inline styles (firefox, chrome) or use font tags
  * which we don't want
  * Instead we set a css class
  */
-wysihtml5.commands.fontSize = (function() {
+(function(wysihtml5) {
   var undef,
       REG_EXP = /wysiwyg-font-size-[a-z]+/g;
   
-  function exec(element, command, size) {
-    return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
-  }
-  
-  function state(element, command, size) {
-    return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.fontSize = {
+    exec: function(element, command, size) {
+      return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
+    },
+
+    state: function(element, command, size) {
+      return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-font-size-" + size, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
diff --git a/src/commands/foreColor.js b/src/commands/foreColor.js
index c663ba59..f51564fa 100644
--- a/src/commands/foreColor.js
+++ b/src/commands/foreColor.js
@@ -1,28 +1,23 @@
 /**
- * execCommand("foreColor") will create either inline styles (firefox, chrome) or use font tags
+ * document.execCommand("foreColor") will create either inline styles (firefox, chrome) or use font tags
  * which we don't want
  * Instead we set a css class
  */
-wysihtml5.commands.foreColor = (function() {
+(function(wysihtml5) {
   var undef,
       REG_EXP = /wysiwyg-color-[a-z]+/g;
   
-  function exec(element, command, color) {
-    return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
-  }
-  
-  function state(element, command, color) {
-    return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
-  }
-  
-  function value() {
-    // TODO
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.foreColor = {
+    exec: function(element, command, color) {
+      return wysihtml5.commands.formatInline.exec(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
+    },
+
+    state: function(element, command, color) {
+      return wysihtml5.commands.formatInline.state(element, command, "span", "wysiwyg-color-" + color, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/formatBlock.js b/src/commands/formatBlock.js
index cd17ceb8..b1e543e2 100644
--- a/src/commands/formatBlock.js
+++ b/src/commands/formatBlock.js
@@ -1,5 +1,7 @@
-wysihtml5.commands.formatBlock = (function() {
+(function(wysihtml5) {
   var undef,
+      dom                     = wysihtml5.dom,
+      selection               = wysihtml5.selection,
       DEFAULT_NODE_NAME       = "DIV",
       // Following elements are grouped
       // when the caret is within a H1 and the H4 is invoked, the H1 should turn into H4
@@ -18,18 +20,18 @@ wysihtml5.commands.formatBlock = (function() {
       element.className = className;
     }
   }
-  
+
   function _removeClass(element, classRegExp) {
     element.className = element.className.replace(classRegExp, "");
   }
-  
+
   /**
    * Check whether given node is a text node and whether it's empty
    */
   function _isBlankTextNode(node) {
-    return node.nodeType === Node.TEXT_NODE && String(node.data).blank();
+    return node.nodeType === wysihtml5.TEXT_NODE && !wysihtml5.lang.string(node.data).trim();
   }
-  
+
   /**
    * Returns previous sibling node that is not a blank text node
    */
@@ -40,7 +42,7 @@ wysihtml5.commands.formatBlock = (function() {
     }
     return previousSibling;
   }
-  
+
   /**
    * Returns next sibling node that is not a blank text node
    */
@@ -51,7 +53,7 @@ wysihtml5.commands.formatBlock = (function() {
     }
     return nextSibling;
   }
-  
+
   /**
    * Adds line breaks before and after the given node if the previous and next siblings
    * aren't already causing a visual line break (block element or <br>)
@@ -60,7 +62,7 @@ wysihtml5.commands.formatBlock = (function() {
     var doc             = node.ownerDocument,
         nextSibling     = _getNextSiblingThatIsNotBlank(node),
         previousSibling = _getPreviousSiblingThatIsNotBlank(node);
-    
+
     if (nextSibling && !_isLineBreakOrBlockElement(nextSibling)) {
       node.parentNode.insertBefore(doc.createElement("br"), nextSibling);
     }
@@ -68,14 +70,14 @@ wysihtml5.commands.formatBlock = (function() {
       node.parentNode.insertBefore(doc.createElement("br"), node);
     }
   }
-  
+
   /**
    * Removes line breaks before and after the given node
    */
   function _removeLineBreakBeforeAndAfter(node) {
     var nextSibling     = _getNextSiblingThatIsNotBlank(node),
         previousSibling = _getPreviousSiblingThatIsNotBlank(node);
-    
+
     if (nextSibling && _isLineBreak(nextSibling)) {
       nextSibling.parentNode.removeChild(nextSibling);
     }
@@ -83,18 +85,18 @@ wysihtml5.commands.formatBlock = (function() {
       previousSibling.parentNode.removeChild(previousSibling);
     }
   }
-  
+
   function _removeLastChildIfLineBreak(node) {
     var lastChild = node.lastChild;
     if (lastChild && _isLineBreak(lastChild)) {
       lastChild.parentNode.removeChild(lastChild);
     }
   }
-  
+
   function _isLineBreak(node) {
     return node.nodeName === "BR";
   }
-  
+
   /**
    * Checks whether the elment causes a visual line break
    * (<br> or block elements)
@@ -103,27 +105,27 @@ wysihtml5.commands.formatBlock = (function() {
     if (_isLineBreak(element)) {
       return true;
     }
-    
-    if (wysihtml5.utils.getStyle(element, "display") === "block") {
+
+    if (dom.getStyle("display").from(element) === "block") {
       return true;
     }
-    
+
     return false;
   }
-  
+
   /**
    * Execute native query command
    * and if necessary modify the inserted node's className
    */
   function _execCommand(doc, command, nodeName, className) {
     if (className) {
-      var eventListener = wysihtml5.utils.observe(doc, "DOMNodeInserted", function(event) {
+      var eventListener = dom.observe(doc, "DOMNodeInserted", function(event) {
         var target = event.target,
             displayStyle;
-        if (target.nodeType !== Node.ELEMENT_NODE) {
+        if (target.nodeType !== wysihtml5.ELEMENT_NODE) {
           return;
         }
-        displayStyle  = wysihtml5.utils.getStyle(target, "display");
+        displayStyle  = dom.getStyle("display").from(target);
         if (displayStyle.substr(0, 6) !== "inline") {
           // Make sure that only block elements receive the given class
           target.className += " " + className;
@@ -135,97 +137,91 @@ wysihtml5.commands.formatBlock = (function() {
       eventListener.stop();
     }
   }
-  
+
   function _selectLineAndWrap(element) {
-    wysihtml5.utils.caret.selectLine(element.ownerDocument);
-    wysihtml5.utils.caret.surround(element);
+    selection.selectLine(element.ownerDocument);
+    selection.surround(element);
     _removeLineBreakBeforeAndAfter(element);
     _removeLastChildIfLineBreak(element);
-    wysihtml5.utils.caret.selectNode(element);
+    selection.selectNode(element);
   }
-  
+
   function _hasClasses(element) {
-    return !!element.className.replace(/^\s+/, "").replace(/\s+$/, "");
+    return !!wysihtml5.lang.string(element.className).trim();
   }
   
-  function exec(element, command, nodeName, className, classRegExp) {
-    var doc          = element.ownerDocument,
-        blockElement = state(element, command, nodeName, className, classRegExp),
-        keepClassName,
-        selectedNode;
-    
-    nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
-    
-    if (blockElement) {
-      wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-        if (classRegExp) {
-          _removeClass(blockElement, classRegExp);
-        }
-        var hasClasses = _hasClasses(blockElement);
-        if (!hasClasses && blockElement.nodeName === (nodeName || DEFAULT_NODE_NAME)) {
-          // Insert a line break afterwards and beforewards when there are siblings
-          // that are not of type line break or block element
-          _addLineBreakBeforeAndAfter(blockElement);
-          wysihtml5.utils.unwrap(blockElement);
-        } else if (hasClasses) {
-          // Make sure that styling is kept by renaming the element to <div> and copying over the class name
-          wysihtml5.utils.renameElement(blockElement, DEFAULT_NODE_NAME);
-        }
-      });
-      return;
-    }
-    
-    // Find similiar block element and rename it (<h2 class="foo"></h2>  =>  <h1 class="foo"></h1>)
-    if (nodeName === null || BLOCK_ELEMENTS_GROUP.indexOf(nodeName) !== -1) {
-      selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-      blockElement = wysihtml5.utils.getParentElement(selectedNode, {
-        nodeName:     BLOCK_ELEMENTS_GROUP
-      });
-      
+  wysihtml5.commands.formatBlock = {
+    exec: function(element, command, nodeName, className, classRegExp) {
+      var doc          = element.ownerDocument,
+          blockElement = this.state(element, command, nodeName, className, classRegExp),
+          selectedNode;
+
+      nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
+
       if (blockElement) {
-        wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-          // Rename current block element to new block element and add class
-          if (nodeName) {
-            blockElement = wysihtml5.utils.renameElement(blockElement, nodeName);
+        selection.executeAndRestoreSimple(doc, function() {
+          if (classRegExp) {
+            _removeClass(blockElement, classRegExp);
           }
-          if (className) {
-            _addClass(blockElement, className, classRegExp);
+          var hasClasses = _hasClasses(blockElement);
+          if (!hasClasses && blockElement.nodeName === (nodeName || DEFAULT_NODE_NAME)) {
+            // Insert a line break afterwards and beforewards when there are siblings
+            // that are not of type line break or block element
+            _addLineBreakBeforeAndAfter(blockElement);
+            dom.replaceWithChildNodes(blockElement);
+          } else if (hasClasses) {
+            // Make sure that styling is kept by renaming the element to <div> and copying over the class name
+            dom.renameElement(blockElement, DEFAULT_NODE_NAME);
           }
         });
         return;
       }
+
+      // Find similiar block element and rename it (<h2 class="foo"></h2>  =>  <h1 class="foo"></h1>)
+      if (nodeName === null || wysihtml5.lang.array(BLOCK_ELEMENTS_GROUP).contains(nodeName)) {
+        selectedNode = selection.getSelectedNode(doc);
+        blockElement = dom.getParentElement(selectedNode, {
+          nodeName:     BLOCK_ELEMENTS_GROUP
+        });
+
+        if (blockElement) {
+          selection.executeAndRestoreSimple(doc, function() {
+            // Rename current block element to new block element and add class
+            if (nodeName) {
+              blockElement = dom.renameElement(blockElement, nodeName);
+            }
+            if (className) {
+              _addClass(blockElement, className, classRegExp);
+            }
+          });
+          return;
+        }
+      }
+
+      if (wysihtml5.commands.support(element, command)) {
+        _execCommand(doc, command, nodeName || DEFAULT_NODE_NAME, className);
+        return;
+      }
+
+      blockElement = doc.createElement(nodeName || DEFAULT_NODE_NAME);
+      if (className) {
+        blockElement.className = className;
+      }
+      _selectLineAndWrap(blockElement);
+    },
+
+    state: function(element, command, nodeName, className, classRegExp) {
+      nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
+      var selectedNode = selection.getSelectedNode(element.ownerDocument);
+      return dom.getParentElement(selectedNode, {
+        nodeName:     nodeName,
+        className:    className,
+        classRegExp:  classRegExp
+      });
+    },
+
+    value: function() {
+      return undef;
     }
-    
-    if (wysihtml5.commands.support(element, command)) {
-      _execCommand(doc, command, nodeName || DEFAULT_NODE_NAME, className);
-      return;
-    }
-    
-    blockElement = doc.createElement(nodeName || DEFAULT_NODE_NAME);
-    if (className) {
-      blockElement.className = className;
-    }
-    _selectLineAndWrap(blockElement);
-  }
-  
-  function state(element, command, nodeName, className, classRegExp) {
-    nodeName = typeof(nodeName) === "string" ? nodeName.toUpperCase() : nodeName;
-    var selectedNode = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument);
-    return wysihtml5.utils.getParentElement(selectedNode, {
-      nodeName:     nodeName,
-      className:    className,
-      classRegExp:  classRegExp
-    });
-  }
-  
-  function value(element, command) {
-    return undef;
-  }
-  
-  return {
-    BLOCK_ELEMENTS_GROUP: BLOCK_ELEMENTS_GROUP,
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/formatInline.js b/src/commands/formatInline.js
index 6ce401ab..b15a6302 100644
--- a/src/commands/formatInline.js
+++ b/src/commands/formatInline.js
@@ -31,7 +31,7 @@
  *   output:
  *      <span>ab|c</span> de|<b>fgh</b>
  */
-wysihtml5.commands.formatInline = (function() {
+(function(wysihtml5) {
   var undef,
       // Treat <b> as <strong> and vice versa
       ALIAS_MAPPING = {
@@ -40,7 +40,7 @@ wysihtml5.commands.formatInline = (function() {
         "b":      "strong",
         "i":      "em"
       },
-      cssClassApplier = {};
+      htmlApplier = {};
   
   function _getTagNames(tagName) {
     var alias = ALIAS_MAPPING[tagName];
@@ -49,53 +49,48 @@ wysihtml5.commands.formatInline = (function() {
   
   function _getApplier(tagName, className, classRegExp) {
     var identifier = tagName + ":" + className;
-    if (!cssClassApplier[identifier]) {
-      cssClassApplier[identifier] = rangy.createCssClassApplier(_getTagNames(tagName), className, classRegExp, true);
+    if (!htmlApplier[identifier]) {
+      htmlApplier[identifier] = new wysihtml5.selection.HTMLApplier(_getTagNames(tagName), className, classRegExp, true);
     }
-    return cssClassApplier[identifier];
+    return htmlApplier[identifier];
   }
   
-  function exec(element, command, tagName, className, classRegExp) {
-    var range = wysihtml5.utils.caret.getRange(element.ownerDocument);
-    if (!range) {
-      return false;
+  wysihtml5.commands.formatInline = {
+    exec: function(element, command, tagName, className, classRegExp) {
+      var range = wysihtml5.selection.getRange(element.ownerDocument);
+      if (!range) {
+        return false;
+      }
+      _getApplier(tagName, className, classRegExp).toggleRange(range);
+      wysihtml5.selection.setSelection(range);
+    },
+
+    state: function(element, command, tagName, className, classRegExp) {
+      var doc           = element.ownerDocument,
+          aliasTagName  = ALIAS_MAPPING[tagName] || tagName,
+          range;
+
+      // Check whether the document contains a node with the desired tagName
+      if (!wysihtml5.dom.hasElementWithTagName(doc, tagName) &&
+          !wysihtml5.dom.hasElementWithTagName(doc, aliasTagName)) {
+        return false;
+      }
+
+       // Check whether the document contains a node with the desired className
+      if (className && !wysihtml5.dom.hasElementWithClassName(doc, className)) {
+         return false;
+      }
+
+      range = wysihtml5.selection.getRange(doc);
+      if (!range) {
+        return false;
+      }
+
+      return _getApplier(tagName, className, classRegExp).isAppliedToRange(range);
+    },
+
+    value: function() {
+      return undef;
     }
-    _getApplier(tagName, className, classRegExp).toggleRange(range);
-    wysihtml5.utils.caret.setSelection(range);
-  }
-  
-  function state(element, command, tagName, className, classRegExp) {
-    var doc           = element.ownerDocument,
-        aliasTagName  = ALIAS_MAPPING[tagName] || tagName,
-        range;
-    
-    // Check whether the document contains a node with the desired tagName
-    if (!wysihtml5.utils.hasElementWithTagName(doc, tagName) &&
-        !wysihtml5.utils.hasElementWithTagName(doc, aliasTagName)) {
-      return false;
-    }
-     
-     // Check whether the document contains a node with the desired className
-    if (className && !wysihtml5.utils.hasElementWithClassName(doc, className)) {
-       return false;
-    }
-    
-    range = wysihtml5.utils.caret.getRange(doc);
-    if (!range) {
-      return false;
-    }
-    
-    return _getApplier(tagName, className, classRegExp).isAppliedToRange(range);
-  }
-  
-  function value(element, command) {
-    // TODO
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/insertHTML.js b/src/commands/insertHTML.js
index 987b2ca3..25c557d2 100644
--- a/src/commands/insertHTML.js
+++ b/src/commands/insertHTML.js
@@ -1,25 +1,21 @@
-wysihtml5.commands.insertHTML = (function() {
+(function(wysihtml5) {
   var undef;
   
-  function exec(element, command, html) {
-    if (wysihtml5.commands.support(element, command)) {
-      element.ownerDocument.execCommand(command, false, html);
-    } else {
-      wysihtml5.utils.caret.insertHTML(element.ownerDocument, html);
+  wysihtml5.commands.insertHTML = {
+    exec: function(element, command, html) {
+      if (wysihtml5.commands.support(element, command)) {
+        element.ownerDocument.execCommand(command, false, html);
+      } else {
+        wysihtml5.selection.insertHTML(element.ownerDocument, html);
+      }
+    },
+
+    state: function() {
+      return false;
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function state() {
-    return false;
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/insertImage.js b/src/commands/insertImage.js
index c8f1bc01..d152b87a 100644
--- a/src/commands/insertImage.js
+++ b/src/commands/insertImage.js
@@ -1,104 +1,97 @@
-wysihtml5.commands.insertImage = (function() {
-  var NODE_NAME = "IMG",
-      WHITE_SPACE_START_REG_EXP = /^\s+/,
-      WHITE_SPACE_END_REG_EXP   = /\s+$/;
+(function(wysihtml5) {
+  var NODE_NAME = "IMG";
   
-  /**
-   * Inserts an <img>
-   * If selection is already an image link, it removes it
-   * 
-   * @example
-   *    // either ...
-   *    wysihtml5.commands.insertImage.exec(element, "insertImage", "http://www.google.de/logo.jpg");
-   *    // ... or ...
-   *    wysihtml5.commands.insertImage.exec(element, "insertImage", { src: "http://www.google.de/logo.jpg", title: "foo" });
-   */
-  function exec(element, command, value) {
-    value = typeof(value) === "object" ? value : { src: value };
-    
-    var doc   = element.ownerDocument,
-        image = state(element),
-        i,
-        parent;
-    
-    if (image) {
-      // Image already selected, set the caret before it and delete it
-      wysihtml5.utils.caret.setBefore(image);
-      parent = image.parentNode;
-      parent.removeChild(image);
-      
-      // and it's parent <a> too if it hasn't got any other relevant child nodes
-      wysihtml5.utils.removeEmptyTextNodes(parent);
-      if (parent.nodeName === "A" && !parent.firstChild) {
-        wysihtml5.utils.caret.setAfter(parent);
-        parent.parentNode.removeChild(parent);
+  wysihtml5.commands.insertImage = {
+    /**
+     * Inserts an <img>
+     * If selection is already an image link, it removes it
+     * 
+     * @example
+     *    // either ...
+     *    wysihtml5.commands.insertImage.exec(element, "insertImage", "http://www.google.de/logo.jpg");
+     *    // ... or ...
+     *    wysihtml5.commands.insertImage.exec(element, "insertImage", { src: "http://www.google.de/logo.jpg", title: "foo" });
+     */
+    exec: function(element, command, value) {
+      value = typeof(value) === "object" ? value : { src: value };
+
+      var doc   = element.ownerDocument,
+          image = this.state(element),
+          i,
+          parent;
+
+      if (image) {
+        // Image already selected, set the caret before it and delete it
+        wysihtml5.selection.setBefore(image);
+        parent = image.parentNode;
+        parent.removeChild(image);
+
+        // and it's parent <a> too if it hasn't got any other relevant child nodes
+        wysihtml5.dom.removeEmptyTextNodes(parent);
+        if (parent.nodeName === "A" && !parent.firstChild) {
+          wysihtml5.selection.setAfter(parent);
+          parent.parentNode.removeChild(parent);
+        }
+
+        // firefox and ie sometimes don't remove the image handles, even though the image got removed
+        wysihtml5.quirks.redraw(element);
+        return;
       }
-      
-      // firefox and ie sometimes don't remove the image handles, even though the image got removed
-      wysihtml5.quirks.redraw(element);
-      return;
-    }
-    
-    image = doc.createElement(NODE_NAME);
-    
-    for (i in value) {
-      image[i] = value[i];
-    }
-    
-    wysihtml5.utils.caret.insertNode(image);
-    wysihtml5.utils.caret.setAfter(image);
-  }
-  
-  function state(element) {
-    var doc = element.ownerDocument,
-        selectedNode,
-        trimmedText,
-        imagesInSelection;
-    
-    if (!wysihtml5.utils.hasElementWithTagName(doc, NODE_NAME)) {
-      return false;
-    }
-    
-    selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-    if (!selectedNode) {
-      return false;
-    }
-    
-    if (selectedNode.nodeName === NODE_NAME) {
-      // This works perfectly in IE
-      return selectedNode;
-    }
-    
-    if (selectedNode.nodeType !== Node.ELEMENT_NODE) {
-      return false;
-    }
-    
-    trimmedText = wysihtml5.utils.caret.getText(doc)
-      .replace(WHITE_SPACE_START_REG_EXP, "")
-      .replace(WHITE_SPACE_END_REG_EXP, "");
-    if (trimmedText) {
-      return false;
-    }
-    
-    imagesInSelection = wysihtml5.utils.caret.getNodes(doc, Node.ELEMENT_NODE, function(node) {
-      return node.nodeName === "IMG";
-    });
-    
-    if (imagesInSelection.length !== 1) {
-      return false;
+
+      image = doc.createElement(NODE_NAME);
+
+      for (i in value) {
+        image[i] = value[i];
+      }
+
+      wysihtml5.selection.insertNode(image);
+      wysihtml5.selection.setAfter(image);
+    },
+
+    state: function(element) {
+      var doc = element.ownerDocument,
+          selectedNode,
+          text,
+          imagesInSelection;
+
+      if (!wysihtml5.dom.hasElementWithTagName(doc, NODE_NAME)) {
+        return false;
+      }
+
+      selectedNode = wysihtml5.selection.getSelectedNode(doc);
+      if (!selectedNode) {
+        return false;
+      }
+
+      if (selectedNode.nodeName === NODE_NAME) {
+        // This works perfectly in IE
+        return selectedNode;
+      }
+
+      if (selectedNode.nodeType !== wysihtml5.ELEMENT_NODE) {
+        return false;
+      }
+
+      text = wysihtml5.selection.getText(doc);
+      text = wysihtml5.lang.string(text).trim();
+      if (text) {
+        return false;
+      }
+
+      imagesInSelection = wysihtml5.selection.getNodes(doc, wysihtml5.ELEMENT_NODE, function(node) {
+        return node.nodeName === "IMG";
+      });
+
+      if (imagesInSelection.length !== 1) {
+        return false;
+      }
+
+      return imagesInSelection[0];
+    },
+
+    value: function(element) {
+      var image = this.state(element);
+      return image && image.src;
     }
-    
-    return imagesInSelection[0];
-  }
-  
-  function value(element) {
-    var image = state(element);
-    return image && image.src;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/insertLineBreak.js b/src/commands/insertLineBreak.js
index 0bd7b53f..807f2dd2 100644
--- a/src/commands/insertLineBreak.js
+++ b/src/commands/insertLineBreak.js
@@ -1,29 +1,25 @@
-wysihtml5.commands.insertLineBreak = (function() {
+(function(wysihtml5) {
   var undef,
-      LINE_BREAK = "<br>" + (Prototype.Browser.Opera ? " " : "");
+      LINE_BREAK = "<br>" + (wysihtml5.browser.needsSpaceAfterLineBreak() ? " " : "");
   
-  function exec(element, command) {
-    if (wysihtml5.commands.support(element, command)) {
-      element.ownerDocument.execCommand(command, false, null);
-      if (!wysihtml5.browserSupports.autoScrollIntoViewOfCaret()) {
-        wysihtml5.utils.caret.scrollIntoView(element);
+  wysihtml5.commands.insertLineBreak = {
+    exec: function(element, command) {
+      if (wysihtml5.commands.support(element, command)) {
+        element.ownerDocument.execCommand(command, false, null);
+        if (!wysihtml5.browser.autoScrollsToCaret()) {
+          wysihtml5.selection.scrollIntoView(element);
+        }
+      } else {
+        wysihtml5.commands.exec(element, "insertHTML", LINE_BREAK);
       }
-    } else {
-      wysihtml5.commands.exec(element, "insertHTML", LINE_BREAK);
+    },
+
+    state: function() {
+      return false;
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function state() {
-    return false;
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/insertOrderedList.js b/src/commands/insertOrderedList.js
index 2c8ca4ef..3d92935c 100644
--- a/src/commands/insertOrderedList.js
+++ b/src/commands/insertOrderedList.js
@@ -1,65 +1,61 @@
-wysihtml5.commands.insertOrderedList = (function() {
+(function(wysihtml5) {
   var undef;
   
-  function exec(element, command) {
-    var doc = element.ownerDocument,
-        selectedNode,
-        isEmpty,
-        tempElement,
-        list;
-    
-    if (wysihtml5.commands.support(element, command)) {
-      doc.execCommand(command, false, null);
-    } else {
-      selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-      list = wysihtml5.utils.getParentElement(selectedNode, { nodeName: ["UL", "OL"] }, 4);
-      if (!list) {
-        tempElement = doc.createElement("span");
-        wysihtml5.utils.caret.surround(tempElement);
-        isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === "\uFEFF";
-        wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-          list = wysihtml5.utils.convertIntoList(tempElement, "ol");
-        });
-        
-        if (isEmpty) {
-          wysihtml5.utils.caret.selectNode(list.querySelector("li"));
+  wysihtml5.commands.insertOrderedList = {
+    exec: function(element, command) {
+      var doc = element.ownerDocument,
+          selectedNode,
+          isEmpty,
+          tempElement,
+          list;
+
+      if (wysihtml5.commands.support(element, command)) {
+        doc.execCommand(command, false, null);
+      } else {
+        selectedNode = wysihtml5.selection.getSelectedNode(doc);
+        list = wysihtml5.dom.getParentElement(selectedNode, { nodeName: ["UL", "OL"] }, 4);
+        if (!list) {
+          tempElement = doc.createElement("span");
+          wysihtml5.selection.surround(tempElement);
+          isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === wysihtml5.INVISIBLE_SPACE;
+          wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+            list = wysihtml5.dom.convertToList(tempElement, "ol");
+          });
+
+          if (isEmpty) {
+            wysihtml5.selection.selectNode(list.querySelector("li"));
+          }
+          return;
         }
-        return;
+
+        wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+          if (list.nodeName === "OL") {
+            // Unwrap list
+            // <ol><li>foo</li><li>bar</li></ol>
+            // becomes:
+            // foo<br>bar<br>
+            wysihtml5.dom.resolveList(list);
+          } else if (list.nodeName === "UL" || list.nodeName === "MENU") {
+            // Turn an unordered list into an ordered list
+            // <ul><li>foo</li><li>bar</li></ul>
+            // becomes:
+            // <ol><li>foo</li><li>bar</li></ol>
+            wysihtml5.dom.renameElement(list, "ol");
+          }
+        });
       }
-      
-      wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-        if (list.nodeName === "OL") {
-          // Unwrap list
-          // <ol><li>foo</li><li>bar</li></ol>
-          // becomes:
-          // foo<br>bar<br>
-          wysihtml5.utils.resolveList(list);
-        } else if (list.nodeName === "UL" || list.nodeName === "MENU") {
-          // Turn an unordered list into an ordered list
-          // <ul><li>foo</li><li>bar</li></ul>
-          // becomes:
-          // <ol><li>foo</li><li>bar</li></ol>
-          wysihtml5.utils.renameElement(list, "ol");
-        }
-      });
-    }
-  }
-  
-  function state(element, command) {
-    try {
-      return element.ownerDocument.queryCommandState(command);
-    } catch(e) {
-      return false;
+    },
+
+    state: function(element, command) {
+      try {
+        return element.ownerDocument.queryCommandState(command);
+      } catch(e) {
+        return false;
+      }
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/insertUnorderedList.js b/src/commands/insertUnorderedList.js
index e8f4de4b..3f4d1949 100644
--- a/src/commands/insertUnorderedList.js
+++ b/src/commands/insertUnorderedList.js
@@ -1,66 +1,62 @@
-wysihtml5.commands.insertUnorderedList = (function() {
+(function(wysihtml5) {
   var undef;
   
-  function exec(element, command) {
-    var doc = element.ownerDocument,
-        selectedNode,
-        isEmpty,
-        tempElement,
-        list;
-    
-    if (wysihtml5.commands.support(element, command)) {
-      doc.execCommand(command, false, null);
-    } else {
-      selectedNode = wysihtml5.utils.caret.getSelectedNode(doc);
-      list = wysihtml5.utils.getParentElement(selectedNode, { nodeName: ["UL", "OL"] });
-      
-      if (!list) {
-        tempElement = doc.createElement("span");
-        wysihtml5.utils.caret.surround(tempElement);
-        isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === "\uFEFF";
-        wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-          list = wysihtml5.utils.convertIntoList(tempElement, "ul");
-        });
-        
-        if (isEmpty) {
-          wysihtml5.utils.caret.selectNode(list.querySelector("li"));
+  wysihtml5.commands.insertUnorderedList = {
+    exec: function(element, command) {
+      var doc = element.ownerDocument,
+          selectedNode,
+          isEmpty,
+          tempElement,
+          list;
+
+      if (wysihtml5.commands.support(element, command)) {
+        doc.execCommand(command, false, null);
+      } else {
+        selectedNode = wysihtml5.selection.getSelectedNode(doc);
+        list = wysihtml5.dom.getParentElement(selectedNode, { nodeName: ["UL", "OL"] });
+
+        if (!list) {
+          tempElement = doc.createElement("span");
+          wysihtml5.selection.surround(tempElement);
+          isEmpty = tempElement.innerHTML === "" || tempElement.innerHTML === wysihtml5.INVISIBLE_SPACE;
+          wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+            list = wysihtml5.dom.convertToList(tempElement, "ul");
+          });
+
+          if (isEmpty) {
+            wysihtml5.selection.selectNode(list.querySelector("li"));
+          }
+          return;
         }
-        return;
+
+        wysihtml5.selection.executeAndRestoreSimple(doc, function() {
+          if (list.nodeName === "UL") {
+            // Unwrap list
+            // <ul><li>foo</li><li>bar</li></ul>
+            // becomes:
+            // foo<br>bar<br>
+            wysihtml5.dom.resolveList(list);
+          } else if (list.nodeName === "OL" || list.nodeName === "MENU") {
+            // Turn an ordered list into an unordered list
+            // <ol><li>foo</li><li>bar</li></ol>
+            // becomes:
+            // <ul><li>foo</li><li>bar</li></ul>
+            wysihtml5.dom.renameElement(list, "ul");
+          }
+        });
       }
-      
-      wysihtml5.utils.caret.executeAndRestoreSimple(doc, function() {
-        if (list.nodeName === "UL") {
-          // Unwrap list
-          // <ul><li>foo</li><li>bar</li></ul>
-          // becomes:
-          // foo<br>bar<br>
-          wysihtml5.utils.resolveList(list);
-        } else if (list.nodeName === "OL" || list.nodeName === "MENU") {
-          // Turn an ordered list into an unordered list
-          // <ol><li>foo</li><li>bar</li></ol>
-          // becomes:
-          // <ul><li>foo</li><li>bar</li></ul>
-          wysihtml5.utils.renameElement(list, "ul");
-        }
-      });
-    }
-  }
-  
-  function state(element, command) {
-    try {
-      return element.ownerDocument.queryCommandState(command);
-    } catch(e) {
-      return false;
+    },
+
+    state: function(element, command) {
+      try {
+        return element.ownerDocument.queryCommandState(command);
+      } catch(e) {
+        return false;
+      }
+    },
+
+    value: function() {
+      return undef;
     }
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/italic.js b/src/commands/italic.js
index e36cbd7d..5e0c7108 100644
--- a/src/commands/italic.js
+++ b/src/commands/italic.js
@@ -1,26 +1,22 @@
-wysihtml5.commands.italic = (function() {
+(function(wysihtml5) {
   var undef;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatInline.exec(element, command, "i");
-  }
-  
-  function state(element, command, color) {
-    // element.ownerDocument.queryCommandState("italic") results:
-    // firefox: only <i>
-    // chrome:  <i>, <em>, <blockquote>, ...
-    // ie:      <i>, <em>
-    // opera:   only <i>
-    return wysihtml5.commands.formatInline.state(element, command, "i");
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.italic = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatInline.exec(element, command, "i");
+    },
+
+    state: function(element, command, color) {
+      // element.ownerDocument.queryCommandState("italic") results:
+      // firefox: only <i>
+      // chrome:  <i>, <em>, <blockquote>, ...
+      // ie:      <i>, <em>
+      // opera:   only <i>
+      return wysihtml5.commands.formatInline.state(element, command, "i");
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/justifyCenter.js b/src/commands/justifyCenter.js
index 7e4a9ed7..9f924d58 100644
--- a/src/commands/justifyCenter.js
+++ b/src/commands/justifyCenter.js
@@ -1,23 +1,19 @@
-wysihtml5.commands.justifyCenter = (function() {
+(function(wysihtml5) {
   var undef,
       CLASS_NAME  = "wysiwyg-text-align-center",
       REG_EXP     = /wysiwyg-text-align-[a-z]+/g;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.justifyCenter = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/justifyLeft.js b/src/commands/justifyLeft.js
index ed0495c4..5872c066 100644
--- a/src/commands/justifyLeft.js
+++ b/src/commands/justifyLeft.js
@@ -1,23 +1,19 @@
-wysihtml5.commands.justifyLeft = (function() {
+(function(wysihtml5) {
   var undef,
       CLASS_NAME  = "wysiwyg-text-align-left",
       REG_EXP     = /wysiwyg-text-align-[a-z]+/g;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.justifyLeft = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/justifyRight.js b/src/commands/justifyRight.js
index fdc27a6b..26933710 100644
--- a/src/commands/justifyRight.js
+++ b/src/commands/justifyRight.js
@@ -1,23 +1,19 @@
-wysihtml5.commands.justifyRight = (function() {
+(function(wysihtml5) {
   var undef,
       CLASS_NAME  = "wysiwyg-text-align-right",
       REG_EXP     = /wysiwyg-text-align-[a-z]+/g;
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.justifyRight = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatBlock.exec(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatBlock.state(element, "formatBlock", null, CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/commands/underline.js b/src/commands/underline.js
index c0fb4779..263b49c5 100644
--- a/src/commands/underline.js
+++ b/src/commands/underline.js
@@ -1,23 +1,19 @@
-wysihtml5.commands.underline = (function() {
+(function(wysihtml5) {
   var undef,
       REG_EXP     = /wysiwyg-text-decoration-underline/g,
       CLASS_NAME  = "wysiwyg-text-decoration-underline";
   
-  function exec(element, command) {
-    return wysihtml5.commands.formatInline.exec(element, command, "span", CLASS_NAME, REG_EXP);
-  }
-  
-  function state(element, command) {
-    return wysihtml5.commands.formatInline.state(element, command, "span", CLASS_NAME, REG_EXP);
-  }
-  
-  function value() {
-    return undef;
-  }
-  
-  return {
-    exec:   exec,
-    state:  state,
-    value:  value
+  wysihtml5.commands.underline = {
+    exec: function(element, command) {
+      return wysihtml5.commands.formatInline.exec(element, command, "span", CLASS_NAME, REG_EXP);
+    },
+
+    state: function(element, command) {
+      return wysihtml5.commands.formatInline.state(element, command, "span", CLASS_NAME, REG_EXP);
+    },
+
+    value: function() {
+      return undef;
+    }
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/utils/auto_link.js b/src/dom/auto_link.js
similarity index 74%
rename from src/utils/auto_link.js
rename to src/dom/auto_link.js
index 9d868f69..0f4590cc 100644
--- a/src/utils/auto_link.js
+++ b/src/dom/auto_link.js
@@ -1,19 +1,18 @@
 /**
- * Find urls in descendant text nodes of an element and auto link them
+ * Find urls in descendant text nodes of an element and auto-links them
  * Inspired by http://james.padolsey.com/javascript/find-and-replace-text-with-javascript/
  *
  * @param {Element} element Container element in which to search for urls
  * @author Christopher Blum <christopher.blum@xing.com>
  * @example
  *    <div id="text-container">Please click here: www.google.com</div>
- *    <script>wysihtml5.utils.autoLink($("text-container"));</script>
+ *    <script>wysihtml5.dom.autoLink(document.getElementById("text-container"));</script>
  */
-wysihtml5.utils.autoLink = (function() {
-  var TEXT_NODE             = 3,
-      /**
+(function(wysihtml5) {
+  var /**
        * Don't auto-link urls that are contained in the following elements:
        */
-      IGNORE_URLS_IN        = ["CODE", "PRE", "A", "SCRIPT", "HEAD", "TITLE", "STYLE"],
+      IGNORE_URLS_IN        = wysihtml5.lang.array(["CODE", "PRE", "A", "SCRIPT", "HEAD", "TITLE", "STYLE"]),
       /**
        * revision 1:
        *    /(\S+\.{1}[^\s\,\.\!]+)/g
@@ -27,20 +26,19 @@ wysihtml5.utils.autoLink = (function() {
       URL_REG_EXP           = /((https?:\/\/|www\.)[^\s<]{3,})/gi,
       TRAILING_CHAR_REG_EXP = /([^\w\/\-](,?))$/i,
       MAX_DISPLAY_LENGTH    = 100,
-      BRACKETS              = { ")": "(", "]": "[", "}": "{" },
-      TEMP_ELEMENTS_CACHE   = {};
+      BRACKETS              = { ")": "(", "]": "[", "}": "{" };
   
   function autoLink(element) {
     if (_hasParentThatShouldBeIgnored(element)) {
       return element;
     }
 
-    if (element == element.ownerDocument.documentElement) {
+    if (element === element.ownerDocument.documentElement) {
       element = element.ownerDocument.body;
     }
 
     return _parseNode(element);
-  };
+  }
   
   /**
    * This is basically a rebuild of
@@ -57,7 +55,10 @@ wysihtml5.utils.autoLink = (function() {
         punctuation = "";
       }
       var realUrl    = url,
-          displayUrl = url.truncate(MAX_DISPLAY_LENGTH);
+          displayUrl = url;
+      if (url.length > MAX_DISPLAY_LENGTH) {
+        displayUrl = displayUrl.substr(0, MAX_DISPLAY_LENGTH) + "...";
+      }
       // Add http prefix if necessary
       if (realUrl.substr(0, 4) === "www.") {
         realUrl = "http://" + realUrl;
@@ -72,9 +73,9 @@ wysihtml5.utils.autoLink = (function() {
    * for the given document object
    */
   function _getTempElement(context) {
-    var tempElement = TEMP_ELEMENTS_CACHE[context];
-    if (!tempElement || tempElement.ownerDocument != context) {
-      TEMP_ELEMENTS_CACHE[context] = tempElement = context.createElement("div");
+    var tempElement = context._wysihtml5_tempElement;
+    if (!tempElement) {
+      tempElement = context._wysihtml5_tempElement = context.createElement("div");
     }
     return tempElement;
   }
@@ -103,9 +104,9 @@ wysihtml5.utils.autoLink = (function() {
     while (node.parentNode) {
       node = node.parentNode;
       nodeName = node.nodeName;
-      if (IGNORE_URLS_IN.include(nodeName)) {
+      if (IGNORE_URLS_IN.contains(nodeName)) {
         return true;
-      } else if (nodeName == "body") {
+      } else if (nodeName === "body") {
         return false;
       }
     }
@@ -113,16 +114,16 @@ wysihtml5.utils.autoLink = (function() {
   }
   
   function _parseNode(element) {
-    if (IGNORE_URLS_IN.include(element.nodeName)) {
+    if (IGNORE_URLS_IN.contains(element.nodeName)) {
       return;
     }
     
-    if (element.nodeType === TEXT_NODE && element.data.match(URL_REG_EXP)) {
+    if (element.nodeType === wysihtml5.TEXT_NODE && element.data.match(URL_REG_EXP)) {
       _wrapMatchesInNode(element);
       return;
     }
     
-    var childNodes        = $A(element.childNodes),
+    var childNodes        = wysihtml5.lang.array(element.childNodes).get(),
         childNodesLength  = childNodes.length,
         i                 = 0;
     
@@ -133,8 +134,8 @@ wysihtml5.utils.autoLink = (function() {
     return element;
   }
   
-  // Reveal url reg exp to the outside
-  autoLink.URL_REG_EXP = URL_REG_EXP;
+  wysihtml5.dom.autoLink = autoLink;
   
-  return autoLink;
-})();
\ No newline at end of file
+  // Reveal url reg exp to the outside
+  wysihtml5.dom.autoLink.URL_REG_EXP = URL_REG_EXP;
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/dom/class.js b/src/dom/class.js
new file mode 100644
index 00000000..e6af905f
--- /dev/null
+++ b/src/dom/class.js
@@ -0,0 +1,31 @@
+(function(wysihtml5) {
+  var supportsClassList = wysihtml5.browser.supportsClassList(),
+      api               = wysihtml5.dom;
+  
+  api.addClass = function(element, className) {
+    if (supportsClassList) {
+      return element.classList.add(className);
+    }
+    if (api.hasClass(element, className)) {
+      return;
+    }
+    element.className += " " + className;
+  };
+  
+  api.removeClass = function(element, className) {
+    if (supportsClassList) {
+      return element.classList.remove(className);
+    }
+    
+    element.className = element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), " ");
+  };
+  
+  api.hasClass = function(element, className) {
+    if (supportsClassList) {
+      return element.classList.contains(className);
+    }
+    
+    var elementClassName = element.className;
+    return (elementClassName.length > 0 && (elementClassName == className || new RegExp("(^|\\s)" + className + "(\\s|$)").test(elementClassName)));
+  };
+})(wysihtml5);
diff --git a/src/utils/contains.js b/src/dom/contains.js
similarity index 83%
rename from src/utils/contains.js
rename to src/dom/contains.js
index cdcd5658..8b5e863c 100644
--- a/src/utils/contains.js
+++ b/src/dom/contains.js
@@ -1,8 +1,8 @@
-wysihtml5.utils.contains = (function() {
+wysihtml5.dom.contains = (function() {
   var documentElement = document.documentElement;
   if (documentElement.contains) {
     return function(container, element) {
-      if (element.nodeType !== Node.ELEMENT_NODE) {
+      if (element.nodeType !== wysihtml5.ELEMENT_NODE) {
         element = element.parentNode;
       }
       return container !== element && container.contains(element);
diff --git a/src/utils/convert_into_list.js b/src/dom/convert_to_list.js
similarity index 86%
rename from src/utils/convert_into_list.js
rename to src/dom/convert_to_list.js
index b510f996..78611ab5 100644
--- a/src/utils/convert_into_list.js
+++ b/src/dom/convert_to_list.js
@@ -15,7 +15,7 @@
  *    </span>
  *
  *    <script>
- *      wysihtml5.utils.convertIntoList(document.getElementById("pseudo-list"), "ul");
+ *      wysihtml5.dom.convertToList(document.getElementById("pseudo-list"), "ul");
  *    </script>
  *
  *    <!-- Will result in: -->
@@ -25,7 +25,7 @@
  *      <li>50 Cent</li>
  *    </ul>
  */
-wysihtml5.utils.convertIntoList = (function() {
+wysihtml5.dom.convertToList = (function() {
   function _createListItem(doc, list) {
     var listItem = doc.createElement("li");
     list.appendChild(listItem);
@@ -36,7 +36,7 @@ wysihtml5.utils.convertIntoList = (function() {
     return doc.createElement(type);
   }
   
-  function convertIntoList(element, listType) {
+  function convertToList(element, listType) {
     if (element.nodeName === "UL" || element.nodeName === "OL" || element.nodeName === "MENU") {
       // Already a list
       return element;
@@ -44,7 +44,7 @@ wysihtml5.utils.convertIntoList = (function() {
     
     var doc               = element.ownerDocument,
         list              = _createList(doc, listType),
-        childNodes        = $A(element.childNodes),
+        childNodes        = wysihtml5.lang.array(element.childNodes).get(),
         childNodesLength  = childNodes.length,
         childNode,
         isBlockElement,
@@ -54,7 +54,7 @@ wysihtml5.utils.convertIntoList = (function() {
     for (; i<childNodesLength; i++) {
       currentListItem = currentListItem || _createListItem(doc, list);
       childNode       = childNodes[i];
-      isBlockElement  = wysihtml5.utils.getStyle(childNode, "display") === "block";
+      isBlockElement  = wysihtml5.dom.getStyle("display").from(childNode) === "block";
       isLineBreak     = childNode.nodeName === "BR";
       
       if (isBlockElement) {
@@ -78,5 +78,5 @@ wysihtml5.utils.convertIntoList = (function() {
     return list;
   }
   
-  return convertIntoList;
+  return convertToList;
 })();
\ No newline at end of file
diff --git a/src/utils/copy_attributes.js b/src/dom/copy_attributes.js
similarity index 58%
rename from src/utils/copy_attributes.js
rename to src/dom/copy_attributes.js
index 96411bb0..c519dcb9 100644
--- a/src/utils/copy_attributes.js
+++ b/src/dom/copy_attributes.js
@@ -9,26 +9,26 @@
  *    with the element where to copy the attributes to (see example)
  *
  * @example
- *    var textarea    = $("textarea"),
- *        div         = $$("div[contenteditable=true]")[0],
- *        anotherDiv  = $$("div[contenteditable=true]")[1];
- *    wysihtml5.utils.copyAttributes("spellcheck", "value", "placeholder").from(textarea).to(div);
- *    // or (advanced example):
- *    wysihtml5.utils.copyAttributes(["spellcheck", "value", "placeholder"]).from(textarea).to(div).andTo(anotherDiv);
+ *    var textarea    = document.querySelector("textarea"),
+ *        div         = document.querySelector("div[contenteditable=true]"),
+ *        anotherDiv  = document.querySelector("div.preview");
+ *    wysihtml5.dom.copyAttributes(["spellcheck", "value", "placeholder"]).from(textarea).to(div).andTo(anotherDiv);
  *
  */
-wysihtml5.utils.copyAttributes = function(attributesToCopy) {
-  attributesToCopy = $A(arguments).flatten();
-  
+wysihtml5.dom.copyAttributes = function(attributesToCopy) {
   return {
     from: function(elementToCopyFrom) {
       return {
         to: function(elementToCopyTo) {
-          attributesToCopy.each(function(attribute) {
+          var attribute,
+              i         = 0,
+              length    = attributesToCopy.length;
+          for (; i<length; i++) {
+            attribute = attributesToCopy[i];
             if (elementToCopyFrom[attribute]) {
               elementToCopyTo[attribute] = elementToCopyFrom[attribute];
             }
-          });
+          }
           return { andTo: arguments.callee };
         }
       };
diff --git a/src/dom/copy_styles.js b/src/dom/copy_styles.js
new file mode 100644
index 00000000..49d88918
--- /dev/null
+++ b/src/dom/copy_styles.js
@@ -0,0 +1,73 @@
+/**
+ * Copy a set of styles from one element to another
+ * Please note that this only works properly across browsers when the element from which to copy the styles
+ * is in the dom
+ *
+ * Interesting article on how to copy styles
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ *
+ * @param {Array} stylesToCopy List of styles which should be copied
+ * @return {Object} Returns an object which offers the "from" method which can be invoked with the element where to
+ *    copy the styles from., this again returns an object which provides a method named "to" which can be invoked 
+ *    with the element where to copy the styles to (see example)
+ *
+ * @example
+ *    var textarea    = document.querySelector("textarea"),
+ *        div         = document.querySelector("div[contenteditable=true]"),
+ *        anotherDiv  = document.querySelector("div.preview");
+ *    wysihtml5.dom.copyStyles(["overflow-y", "width", "height"]).from(textarea).to(div).andTo(anotherDiv);
+ *
+ */
+(function(dom) {
+  
+  /**
+   * Mozilla, WebKit and Opera recalculate the computed width when box-sizing: boder-box; is set
+   * So if an element has "width: 200px; -moz-box-sizing: border-box; border: 1px;" then 
+   * its computed css width will be 198px
+   */
+  var BOX_SIZING_PROPERTIES = ["-webkit-box-sizing", "-moz-box-sizing", "-ms-box-sizing", "box-sizing"];
+  
+  var shouldIgnoreBoxSizingBorderBox = function(element) {
+    if (hasBoxSizingBorderBox(element)) {
+       return parseInt(dom.getStyle("width").from(element), 10) < element.offsetWidth;
+    }
+    return false;
+  };
+  
+  var hasBoxSizingBorderBox = function(element) {
+    var i       = 0,
+        length  = BOX_SIZING_PROPERTIES.length;
+    for (; i<length; i++) {
+      if (dom.getStyle(BOX_SIZING_PROPERTIES[i]).from(element) === "border-box") {
+        return BOX_SIZING_PROPERTIES[i];
+      }
+    }
+  };
+  
+  dom.copyStyles = function(stylesToCopy) {
+    return {
+      from: function(element) {
+        if (shouldIgnoreBoxSizingBorderBox(element)) {
+          stylesToCopy = wysihtml5.lang.array(stylesToCopy).without(BOX_SIZING_PROPERTIES);
+        }
+        
+        var cssText = "",
+            length  = stylesToCopy.length,
+            i       = 0,
+            property;
+        for (; i<length; i++) {
+          property = stylesToCopy[i];
+          cssText += property + ":" + dom.getStyle(property).from(element) + ";";
+        }
+        
+        return {
+          to: function(element) {
+            dom.setStyles(cssText).on(element);
+            return { andTo: arguments.callee };
+          }
+        };
+      }
+    };
+  };
+})(wysihtml5.dom);
\ No newline at end of file
diff --git a/src/dom/delegate.js b/src/dom/delegate.js
new file mode 100644
index 00000000..419d8cc4
--- /dev/null
+++ b/src/dom/delegate.js
@@ -0,0 +1,26 @@
+/**
+ * Event Delegation
+ *
+ * @example
+ *    wysihtml5.dom.delegate(document.body, "a", "click", function() {
+ *      // foo
+ *    });
+ */
+(function(wysihtml5) {
+  
+  wysihtml5.dom.delegate = function(container, selector, eventName, handler) {
+    return wysihtml5.dom.observe(container, eventName, function(event) {
+      var target    = event.target,
+          match     = wysihtml5.lang.array(container.querySelectorAll(selector));
+      
+      while (target && target !== container) {
+        if (match.contains(target)) {
+          handler.call(target, event);
+          break;
+        }
+        target = target.parentNode;
+      }
+    });
+  };
+  
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/utils/get_in_dom_element.js b/src/dom/get_as_dom.js
similarity index 92%
rename from src/utils/get_in_dom_element.js
rename to src/dom/get_as_dom.js
index 06b7fcee..b45e5865 100644
--- a/src/utils/get_in_dom_element.js
+++ b/src/dom/get_as_dom.js
@@ -7,8 +7,11 @@
  * @author Christopher Blum <christopher.blum@xing.com>
  * @param {String} html The html which should be wrapped in a dom element
  * @param {Obejct} [context] Document object of the context the html belongs to
+ *
+ * @example
+ *    wysihtml5.dom.getAsDom("<article>foo</article>");
  */
-wysihtml5.utils.getInDomElement = (function() {
+wysihtml5.dom.getAsDom = (function() {
   
   var _innerHTMLShiv = function(html, context) {
     var tempElement = context.createElement("div");
@@ -50,7 +53,7 @@ wysihtml5.utils.getInDomElement = (function() {
     if (typeof(html) === "object" && html.nodeType) {
       tempElement = context.createElement("div");
       tempElement.appendChild(html);
-    } else if (wysihtml5.browserSupports.html5Tags(context)) {
+    } else if (wysihtml5.browser.supportsHTML5Tags(context)) {
       tempElement = context.createElement("div");
       tempElement.innerHTML = html;
     } else {
diff --git a/src/utils/get_parent_element.js b/src/dom/get_parent_element.js
similarity index 80%
rename from src/utils/get_parent_element.js
rename to src/dom/get_parent_element.js
index 0646c6a7..7fb46458 100644
--- a/src/utils/get_parent_element.js
+++ b/src/dom/get_parent_element.js
@@ -8,13 +8,13 @@
  * @param {Number} [levels] How many parents should the function check up from the current node (defaults to 50)
  * @return {null|Element} Returns the first element that matched the desiredNodeName(s)
  * @example
- *    var listElement = wysihtml5.utils.getParentElement($$("li").first(), { nodeName: ["MENU", "UL", "OL"] });
+ *    var listElement = wysihtml5.dom.getParentElement(document.querySelector("li"), { nodeName: ["MENU", "UL", "OL"] });
  *    // ... or ...
- *    var unorderedListElement = wysihtml5.utils.getParentElement($$("li").first(), { nodeName: "UL" });
+ *    var unorderedListElement = wysihtml5.dom.getParentElement(document.querySelector("li"), { nodeName: "UL" });
  *    // ... or ...
- *    var coloredElement = wysihtml5.utils.getParentElement(myTextNode, { nodeName: "SPAN", className: "wysiwyg-color-red", classRegExp: /wysiwyg-color-[a-z]/g });
+ *    var coloredElement = wysihtml5.dom.getParentElement(myTextNode, { nodeName: "SPAN", className: "wysiwyg-color-red", classRegExp: /wysiwyg-color-[a-z]/g });
  */
-wysihtml5.utils.getParentElement = (function() {
+wysihtml5.dom.getParentElement = (function() {
   
   function _isSameNodeName(nodeName, desiredNodeNames) {
     if (!desiredNodeNames || !desiredNodeNames.length) {
@@ -24,12 +24,12 @@ wysihtml5.utils.getParentElement = (function() {
     if (typeof(desiredNodeNames) === "string") {
       return nodeName === desiredNodeNames;
     } else {
-      return desiredNodeNames.indexOf(nodeName) !== -1;
+      return wysihtml5.lang.array(desiredNodeNames).contains(nodeName);
     }
   }
   
   function _isElement(node) {
-    return node.nodeType === Node.ELEMENT_NODE;
+    return node.nodeType === wysihtml5.ELEMENT_NODE;
   }
   
   function _hasClassName(element, className, classRegExp) {
diff --git a/src/dom/get_style.js b/src/dom/get_style.js
new file mode 100644
index 00000000..4e1deec2
--- /dev/null
+++ b/src/dom/get_style.js
@@ -0,0 +1,69 @@
+/**
+ * Get element's style for a specific css property
+ *
+ * @param {Element} element The element on which to retrieve the style
+ * @param {String} property The CSS property to retrieve ("float", "display", "text-align", ...)
+ * @author Christopher Blum <christopher.blum@xing.com>
+ * @example
+ *    wysihtml5.dom.getStyle("display").from(document.body);
+ *    // => "block"
+ */
+wysihtml5.dom.getStyle = (function() {
+  var stylePropertyMapping = {
+        "float": ("styleFloat" in document.createElement("div").style) ? "styleFloat" : "cssFloat"
+      },
+      REG_EXP_CAMELIZE = /\-[a-z]/g;
+  
+  function camelize(str) {
+    return str.replace(REG_EXP_CAMELIZE, function(match) {
+      return match.charAt(1).toUpperCase();
+    });
+  }
+  
+  return function(property) {
+    return {
+      from: function(element) {
+        if (element.nodeType !== wysihtml5.ELEMENT_NODE) {
+          return;
+        }
+        
+        var doc               = element.ownerDocument,
+            camelizedProperty = stylePropertyMapping[property] || camelize(property),
+            style             = element.style,
+            currentStyle      = element.currentStyle,
+            styleValue        = style[camelizedProperty];
+        if (styleValue) {
+          return styleValue;
+        }
+        
+        // currentStyle is no standard and only supported by Opera and IE but it has one important advantage over the standard-compliant
+        // window.getComputedStyle, since it returns css property values in their original unit:
+        // If you set an elements width to "50%", window.getComputedStyle will give you it's current width in px while currentStyle
+        // gives you the original "50%".
+        // Opera supports both, currentStyle and window.getComputedStyle, that's why checking for currentStyle should have higher prio
+        if (currentStyle) {
+          return currentStyle[camelizedProperty];
+        }
+
+        var win                 = doc.defaultView || doc.parentWindow,
+            needsOverflowReset  = (property === "height" || property === "width") && element.nodeName === "TEXTAREA",
+            originalOverflow,
+            returnValue;
+
+        if (win.getComputedStyle) {
+          // Chrome and Safari both calculate a wrong width and height for textareas when they have scroll bars
+          // therfore we remove and restore the scrollbar and calculate the value in between
+          if (needsOverflowReset) {
+            originalOverflow = style.overflow;
+            style.overflow = "hidden";
+          }
+          returnValue = win.getComputedStyle(element, null).getPropertyValue(property);
+          if (needsOverflowReset) {
+            style.overflow = originalOverflow || "";
+          }
+          return returnValue;
+        }
+      }
+    };
+  };
+})();
\ No newline at end of file
diff --git a/src/utils/has_element_with_class_name.js b/src/dom/has_element_with_class_name.js
similarity index 73%
rename from src/utils/has_element_with_class_name.js
rename to src/dom/has_element_with_class_name.js
index 955bc61a..4309ca4b 100644
--- a/src/utils/has_element_with_class_name.js
+++ b/src/dom/has_element_with_class_name.js
@@ -7,29 +7,29 @@
  * @param {Object} doc The document object of the context where to check
  * @param {String} tagName Upper cased tag name
  * @example
- *    wysihtml5.utils.hasElementWithClassName(document, "foobar");
+ *    wysihtml5.dom.hasElementWithClassName(document, "foobar");
  */
-wysihtml5.utils.hasElementWithClassName = (function() {
+(function(wysihtml5) {
   var LIVE_CACHE          = {},
       DOCUMENT_IDENTIFIER = 1;
-  
+
   function _getDocumentIdentifier(doc) {
-    return doc._wysihtml5Identifier || (doc._wysihtml5Identifier = DOCUMENT_IDENTIFIER++);
+    return doc._wysihtml5_identifier || (doc._wysihtml5_identifier = DOCUMENT_IDENTIFIER++);
   }
   
-  return function(doc, className) {
+  wysihtml5.dom.hasElementWithClassName = function(doc, className) {
     // getElementsByClassName is not supported by IE<9
     // but is sometimes mocked via library code (which then doesn't return live node lists)
-    if (!wysihtml5.browserSupports.getElementsByClassName()) {
+    if (!wysihtml5.browser.supportsNativeGetElementsByClassName()) {
       return !!doc.querySelector("." + className);
     }
-    
+
     var key         = _getDocumentIdentifier(doc) + ":" + className,
         cacheEntry  = LIVE_CACHE[key];
     if (!cacheEntry) {
       cacheEntry = LIVE_CACHE[key] = doc.getElementsByClassName(className);
     }
-    
+
     return cacheEntry.length > 0;
   };
-})();
\ No newline at end of file
+})(wysihtml5);
diff --git a/src/utils/has_element_with_tag_name.js b/src/dom/has_element_with_tag_name.js
similarity index 79%
rename from src/utils/has_element_with_tag_name.js
rename to src/dom/has_element_with_tag_name.js
index 80c7d878..b8511c6e 100644
--- a/src/utils/has_element_with_tag_name.js
+++ b/src/dom/has_element_with_tag_name.js
@@ -7,14 +7,14 @@
  * @param {Object} doc The document object of the context where to check
  * @param {String} tagName Upper cased tag name
  * @example
- *    wysihtml5.utils.hasElementWithTagName(document, "IMG");
+ *    wysihtml5.dom.hasElementWithTagName(document, "IMG");
  */
-wysihtml5.utils.hasElementWithTagName = (function() {
+wysihtml5.dom.hasElementWithTagName = (function() {
   var LIVE_CACHE          = {},
       DOCUMENT_IDENTIFIER = 1;
   
   function _getDocumentIdentifier(doc) {
-    return doc._wysihtml5Identifier || (doc._wysihtml5Identifier = DOCUMENT_IDENTIFIER++);
+    return doc._wysihtml5_identifier || (doc._wysihtml5_identifier = DOCUMENT_IDENTIFIER++);
   }
   
   return function(doc, tagName) {
diff --git a/src/dom/insert.js b/src/dom/insert.js
new file mode 100644
index 00000000..103fd6e0
--- /dev/null
+++ b/src/dom/insert.js
@@ -0,0 +1,15 @@
+wysihtml5.dom.insert = function(elementToInsert) {
+  return {
+    after: function(element) {
+      element.parentNode.insertBefore(elementToInsert, element.nextSibling);
+    },
+    
+    before: function(element) {
+      element.parentNode.insertBefore(elementToInsert, element);
+    },
+    
+    into: function(element) {
+      element.appendChild(elementToInsert);
+    }
+  };
+};
\ No newline at end of file
diff --git a/src/utils/insert_rules.js b/src/dom/insert_css.js
similarity index 56%
rename from src/utils/insert_rules.js
rename to src/dom/insert_css.js
index 5164e690..a6e0210a 100644
--- a/src/utils/insert_rules.js
+++ b/src/dom/insert_css.js
@@ -1,31 +1,19 @@
-/**
- * Insert CSS rules
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Array} rules An array containing the css rules to insert
- *
- * @example
- *    wysihtml5.utils.insertRules([
- *      "html { height: 100%; }",
- *      "body { color: red; }"
- *    ]).into(document);
- */
-wysihtml5.utils.insertRules = function(rules) {
+wysihtml5.dom.insertCSS = function(rules) {
   rules = rules.join("\n");
   
   return {
     into: function(doc) {
       var head         = doc.head || doc.getElementsByTagName("head")[0],
           styleElement = doc.createElement("style");
-      
+
       styleElement.type = "text/css";
-      
+
       if (styleElement.styleSheet) {
         styleElement.styleSheet.cssText = rules;
       } else {
         styleElement.appendChild(doc.createTextNode(rules));
       }
-      
+
       if (head) {
         head.appendChild(styleElement);
       }
diff --git a/src/dom/observe.js b/src/dom/observe.js
new file mode 100644
index 00000000..3c422a8c
--- /dev/null
+++ b/src/dom/observe.js
@@ -0,0 +1,53 @@
+/**
+ * Method to set dom events
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ *
+ * @example
+ *    wysihtml5.dom.observe(iframe.contentWindow.document.body, ["focus", "blur"], function() { ... });
+ */
+wysihtml5.dom.observe = function(element, eventNames, handler) {
+  eventNames = typeof(eventNames) === "string" ? [eventNames] : eventNames;
+  
+  var handlerWrapper,
+      eventName,
+      i       = 0,
+      length  = eventNames.length;
+  
+  for (; i<length; i++) {
+    eventName = eventNames[i];
+    if (element.addEventListener) {
+      element.addEventListener(eventName, handler, false);
+    } else {
+      handlerWrapper = function(event) {
+        if (!("target" in event)) {
+          event.target = event.srcElement;
+        }
+        event.preventDefault = event.preventDefault || function() {
+          this.returnValue = false;
+        };
+        event.stopPropagation = event.stopPropagation || function() {
+          this.cancelBubble = true;
+        };
+        handler.call(element, event);
+      };
+      element.attachEvent("on" + eventName, handlerWrapper);
+    }
+  }
+  
+  return {
+    stop: function() {
+      var eventName,
+          i       = 0,
+          length  = eventNames.length;
+      for (; i<length; i++) {
+        eventName = eventNames[i];
+        if (element.removeEventListener) {
+          element.removeEventListener(eventName, handler, false);
+        } else {
+          element.detachEvent("on" + eventName, handlerWrapper);
+        }
+      }
+    }
+  };
+};
diff --git a/src/utils/sanitize_html.js b/src/dom/parse.js
similarity index 88%
rename from src/utils/sanitize_html.js
rename to src/dom/parse.js
index bb2302b8..e5923763 100644
--- a/src/utils/sanitize_html.js
+++ b/src/dom/parse.js
@@ -14,7 +14,7 @@
  *
  * @example
  *    var userHTML = '<div id="foo" onclick="alert(1);"><p><font color="red">foo</font><script>alert(1);</script></p></div>';
- *    wysihtml5.utils.sanitizeHTML(userHTML, {
+ *    wysihtml5.dom.parse(userHTML, {
  *      tags {
  *        p:      "div",      // Rename p tags to div tags
  *        font:   "span"      // Rename font tags to span tags
@@ -25,11 +25,11 @@
  *    // => <div><div><span>foo bar</span></div></div>
  *
  *    var userHTML = '<table><tbody><tr><td>I'm a table!</td></tr></tbody></table>';
- *    wysihtml5.utils.sanitizeHTML(userHTML);
+ *    wysihtml5.dom.parse(userHTML);
  *    // => '<span><span><span><span>I'm a table!</span></span></span></span>'
  *
  *    var userHTML = '<div>foobar<br>foobar</div>';
- *    wysihtml5.utils.sanitizeHTML(userHTML, {
+ *    wysihtml5.dom.parse(userHTML, {
  *      tags: {
  *        div: undefined,
  *        br:  true
@@ -38,7 +38,7 @@
  *    // => ''
  *
  *    var userHTML = '<div class="red">foo</div><div class="pink">bar</div>';
- *    wysihtml5.utils.sanitizeHTML(userHTML, {
+ *    wysihtml5.dom.parse(userHTML, {
  *      classes: {
  *        red:    1,
  *        green:  1
@@ -51,7 +51,7 @@
  *    });
  *    // => '<p class="red">foo</p><p>bar</p>'
  */
-wysihtml5.utils.sanitizeHTML = (function() {
+wysihtml5.dom.parse = (function() {
   
   /**
    * It's not possible to use a XMLParser/DOMParser as HTML5 is not always well-formed XML
@@ -61,26 +61,23 @@ wysihtml5.utils.sanitizeHTML = (function() {
    * Therefore we've to use the browser's ordinary HTML parser invoked by setting innerHTML.
    */
   var NODE_TYPE_MAPPING = {
-    "1": _handleElement,
-    "3": _handleText
-  };
-  
-  var DEFAULT_RULES = { tags: {}, classes: {} };
-  
-  // Rename unknown tags to this
-  var DEFAULT_NODE_NAME = "span";
-  
-  var WHITE_SPACE_REG_EXP = /\s+/;
-  
-  var currentRules = {};
+        "1": _handleElement,
+        "3": _handleText
+      },
+      // Rename unknown tags to this
+      DEFAULT_NODE_NAME   = "span",
+      WHITE_SPACE_REG_EXP = /\s+/,
+      defaultRules        = { tags: {}, classes: {} },
+      currentRules        = {};
   
   /**
    * Iterates over all childs of the element, recreates them, appends them into a document fragment
    * which later replaces the entire body content
    */
-  function sanitizeHTML(elementOrHtml, rules, context, cleanUp) {
-    currentRules = Object.extend(Object.clone(DEFAULT_RULES), rules);
-    context = context || elementOrHtml.ownerDocument || document;
+  function parse(elementOrHtml, rules, context, cleanUp) {
+    wysihtml5.lang.object(currentRules).merge(defaultRules).merge(rules).get();
+    
+    context           = context || elementOrHtml.ownerDocument || document;
     var fragment      = context.createDocumentFragment(),
         isString      = typeof(elementOrHtml) === "string",
         element,
@@ -88,7 +85,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
         firstChild;
     
     if (isString) {
-      element = wysihtml5.utils.getInDomElement(elementOrHtml, context);
+      element = wysihtml5.dom.getAsDom(elementOrHtml, context);
     } else {
       element = elementOrHtml;
     }
@@ -108,7 +105,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
     // Insert new DOM tree
     element.appendChild(fragment);
     
-    return isString ? element.innerHTML : element;
+    return isString ? wysihtml5.quirks.getCorrectInnerHTML(element) : element;
   }
   
   function _convert(oldNode, cleanUp) {
@@ -136,7 +133,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
     if (cleanUp &&
         newNode.childNodes.length <= 1 &&
         newNode.nodeName.toLowerCase() === DEFAULT_NODE_NAME &&
-        newNode.innerHTML !== wysihtml5.utils.caret.PLACEHOLDER_TEXT && 
+        newNode.innerHTML !== wysihtml5.selection.PLACEHOLDER_TEXT && 
         !newNode.attributes.length) {
       return newNode.firstChild;
     }
@@ -178,7 +175,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
      * A <p> doesn't need to be closed according HTML4-5 spec, we simply replace it with a <div> to preserve its content and layout
      */
     if ("outerHTML" in oldNode) {
-      if (!wysihtml5.browserSupports.closingOfUnclosedTags() &&
+      if (!wysihtml5.browser.autoClosesUnclosedTags() &&
           oldNode.nodeName === "P" &&
           oldNode.outerHTML.slice(-4).toLowerCase() !== "</p>") {
         nodeName = "div";
@@ -227,7 +224,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
         method;
     
     if (setAttributes) {
-      attributes = Object.clone(setAttributes);
+      attributes = wysihtml5.lang.object(setAttributes).clone();
     }
     
     if (checkAttributes) {
@@ -277,7 +274,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
     newClassesLength = newClasses.length;
     while (newClassesLength--) {
       currentClass = newClasses[newClassesLength];
-      if (newUniqueClasses.indexOf(currentClass) == -1) {
+      if (!wysihtml5.lang.array(newUniqueClasses).contains(currentClass)) {
         newUniqueClasses.unshift(currentClass);
       }
     }
@@ -286,9 +283,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
       attributes["class"] = newUniqueClasses.join(" ");
     }
     
-    // sort and set attributes on newNode
-    attributes = _sortByKey(attributes);
-    
+    // set attributes on newNode
     for (attributeName in attributes) {
       // Setting attributes can cause a js error in IE under certain circumstances
       // eg. on a <img> under https when it's new attribute value is non-https
@@ -317,7 +312,7 @@ wysihtml5.utils.sanitizeHTML = (function() {
    *
    * Therefore we have to check the element's outerHTML for the attribute
    */
-  var HAS_GET_ATTRIBUTE_BUG = !wysihtml5.browserSupports.getAttributeCorrectly();
+  var HAS_GET_ATTRIBUTE_BUG = !wysihtml5.browser.supportsGetAttributeCorrectly();
   function _getAttribute(node, attributeName) {
     attributeName = attributeName.toLowerCase();
     var nodeName = node.nodeName;
@@ -353,22 +348,6 @@ wysihtml5.utils.sanitizeHTML = (function() {
     }
   }
   
-  /**
-   * Sorts key/value pairs alphabetically by key name
-   */
-  function _sortByKey(object) {
-    var newObject   = {},
-        key,
-        keys        = Object.keys(object).sort(),
-        keysLength  = keys.length,
-        i           = 0;
-    for (; i<keysLength; i++) {
-      key = keys[i];
-      newObject[key] = object[key];
-    }
-    return newObject;
-  }
-  
   function _handleText(oldNode) {
     return oldNode.ownerDocument.createTextNode(oldNode.data);
   }
@@ -401,10 +380,8 @@ wysihtml5.utils.sanitizeHTML = (function() {
     numbers: (function() {
       var REG_EXP = /\D/g;
       return function(attributeValue) {
-        if (!attributeValue) {
-          return null;
-        }
-        return attributeValue.replace(REG_EXP, "");
+        attributeValue = (attributeValue || "").replace(REG_EXP, "");
+        return attributeValue || null;
       };
     })()
   };
@@ -463,5 +440,5 @@ wysihtml5.utils.sanitizeHTML = (function() {
     })()
   };
   
-  return sanitizeHTML;
+  return parse;
 })();
\ No newline at end of file
diff --git a/src/utils/remove_empty_text_nodes.js b/src/dom/remove_empty_text_nodes.js
similarity index 58%
rename from src/utils/remove_empty_text_nodes.js
rename to src/dom/remove_empty_text_nodes.js
index 0b616f68..546e30ad 100644
--- a/src/utils/remove_empty_text_nodes.js
+++ b/src/dom/remove_empty_text_nodes.js
@@ -4,16 +4,16 @@
  * @author Christopher Blum <christopher.blum@xing.com>
  * @param {Element} node The element in which to cleanup
  * @example
- *    wysihtml5.utils.removeEmptyTextNodes(element);
+ *    wysihtml5.dom.removeEmptyTextNodes(element);
  */
-wysihtml5.utils.removeEmptyTextNodes = function(node) {
+wysihtml5.dom.removeEmptyTextNodes = function(node) {
   var childNode,
-      childNodes        = $A(node.childNodes), // $A needed since childNodes is not an array but a live NodeList
+      childNodes        = wysihtml5.lang.array(node.childNodes).get(),
       childNodesLength  = childNodes.length,
       i                 = 0;
   for (; i<childNodesLength; i++) {
     childNode = childNodes[i];
-    if (childNode.nodeType === Node.TEXT_NODE && childNode.data === "") {
+    if (childNode.nodeType === wysihtml5.TEXT_NODE && childNode.data === "") {
       childNode.parentNode.removeChild(childNode);
     }
   }
diff --git a/src/utils/rename_element.js b/src/dom/rename_element.js
similarity index 78%
rename from src/utils/rename_element.js
rename to src/dom/rename_element.js
index 2ee02c44..53660e2f 100644
--- a/src/utils/rename_element.js
+++ b/src/dom/rename_element.js
@@ -14,7 +14,7 @@
  *    </ul>
  *
  *    <script>
- *      wysihtml5.utils.renameElement(document.getElementById("list"), "ol");
+ *      wysihtml5.dom.renameElement(document.getElementById("list"), "ol");
  *    </script>
  *
  *    <!-- Will result in: -->
@@ -24,13 +24,13 @@
  *      <li>50 Cent</li>
  *    </ol>
  */
-wysihtml5.utils.renameElement = function(element, newNodeName) {
+wysihtml5.dom.renameElement = function(element, newNodeName) {
   var newElement = element.ownerDocument.createElement(newNodeName),
       firstChild;
   while (firstChild = element.firstChild) {
     newElement.appendChild(firstChild);
   }
-  wysihtml5.utils.copyAttributes(["align", "className"]).from(element).to(newElement);
+  wysihtml5.dom.copyAttributes(["align", "className"]).from(element).to(newElement);
   element.parentNode.replaceChild(newElement, element);
   return newElement;
 };
\ No newline at end of file
diff --git a/src/utils/unwrap.js b/src/dom/replace_with_child_nodes.js
similarity index 84%
rename from src/utils/unwrap.js
rename to src/dom/replace_with_child_nodes.js
index b4e59090..29f201e9 100644
--- a/src/utils/unwrap.js
+++ b/src/dom/replace_with_child_nodes.js
@@ -9,10 +9,10 @@
  *    </div>
  *    <script>
  *      // Remove #foo and replace with it's children
- *      wysihtml5.utils.unwrap(document.getElementById("foo"));
+ *      wysihtml5.dom.replaceWithChildNodes(document.getElementById("foo"));
  *    </script>
  */
-wysihtml5.utils.unwrap = function(node) {
+wysihtml5.dom.replaceWithChildNodes = function(node) {
   if (!node.parentNode) {
     return;
   }
diff --git a/src/utils/resolve_list.js b/src/dom/resolve_list.js
similarity index 90%
rename from src/utils/resolve_list.js
rename to src/dom/resolve_list.js
index 4f030183..9082e87d 100644
--- a/src/utils/resolve_list.js
+++ b/src/dom/resolve_list.js
@@ -13,7 +13,7 @@
  *    </ul>
  *
  *    <script>
- *      wysihtml5.utils.resolveList(document.getElementById("list"));
+ *      wysihtml5.dom.resolveList(document.getElementById("list"));
  *    </script>
  *
  *    <!-- Will result in: -->
@@ -21,10 +21,9 @@
  *    dr. dre<br>
  *    50 Cent<br>
  */
-wysihtml5.utils.resolveList = (function() {
-  
+(function(dom) {
   function _isBlockElement(node) {
-    return wysihtml5.utils.getStyle(node, "display") === "block";
+    return dom.getStyle("display").from(node) === "block";
   }
   
   function _isLineBreak(node) {
@@ -70,5 +69,6 @@ wysihtml5.utils.resolveList = (function() {
     }
     list.parentNode.replaceChild(fragment, list);
   }
-  return resolveList;
-})();
\ No newline at end of file
+  
+  dom.resolveList = resolveList;
+})(wysihtml5.dom);
\ No newline at end of file
diff --git a/src/dom/sandbox.js b/src/dom/sandbox.js
new file mode 100644
index 00000000..1efb8794
--- /dev/null
+++ b/src/dom/sandbox.js
@@ -0,0 +1,258 @@
+/**
+ * Sandbox for executing javascript, parsing css styles and doing dom operations in a secure way
+ *
+ * Browser Compatibility:
+ *  - Secure in MSIE 6+, but only when the user hasn't made changes to his security level "restricted"
+ *  - Partially secure in other browsers (Firefox, Opera, Safari, Chrome, ...)
+ *
+ * Please note that this class can't benefit from the HTML5 sandbox attribute for the following reasons:
+ *    - sandboxing doesn't work correctly with inlined content (src="javascript:'<html>...</html>'")
+ *    - sandboxing of physical documents causes that the dom isn't accessible anymore from the outside (iframe.contentWindow, ...)
+ *    - setting the "allow-same-origin" flag would fix that, but then still javascript and dom events refuse to fire
+ *    - therefore the "allow-scripts" flag is needed, which then would deactivate any security, as the js executed inside the iframe
+ *      can do anything as if the sandbox attribute wasn't set
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ *
+ * @param {Function} [readyCallback] Method that gets invoked when the sandbox is ready
+ * @param {Object} [config] Optional parameters, see defaultConfig property for more info
+ *
+ * @example
+ *    new wysihtml5.dom.Sandbox(function(sandbox) {
+ *      sandbox.getWindow().document.body.innerHTML = '<img src=foo.gif onerror="alert(document.cookie)">';
+ *    });
+ */
+(function(wysihtml5) {
+  var /**
+       * Default configuration
+       */
+      defaultConfig       = {
+        uaCompatible: "IE=Edge"   // X-UA-Compatible meta tag value (Document compatibility mode)
+      },
+      doc                 = document,
+      /**
+       * Properties to unset/protect on the window object
+       */
+      windowProperties    = [
+        "parent", "top", "opener", "frameElement", "frames",
+        "localStorage", "globalStorage", "sessionStorage", "indexedDB"
+      ],
+      /**
+       * Properties on the window object which are set to an empty function
+       */
+      windowProperties2   = [
+        "open", "close", "openDialog", "showModalDialog",
+        "alert", "confirm", "prompt",
+        "openDatabase", "postMessage",
+        "XMLHttpRequest", "XDomainRequest"
+      ],
+      /**
+       * Properties to unset/proetect on the document object
+       */
+      documentProperties  = [
+        "referrer",
+        "write", "open", "close"
+      ];
+  
+  wysihtml5.dom.Sandbox = Base.extend(
+    /** @scope wysihtml5.dom.Sandbox.prototype */ {
+
+    constructor: function(readyCallback, config) {
+      this.callback = readyCallback || wysihtml5.EMPTY_FUNCTION;
+      this.config   = wysihtml5.lang.object({}).merge(defaultConfig).merge(config).get();
+      this.iframe   = this._createIframe();
+    },
+    
+    insertInto: function(element) {
+      if (typeof(element) === "string") {
+        element = doc.getElementById(element);
+      }
+      
+      element.appendChild(this.iframe);
+    },
+
+    getIframe: function() {
+      return this.iframe;
+    },
+
+    getWindow: function() {
+      this._readyError();
+    },
+
+    getDocument: function() {
+      this._readyError();
+    },
+
+    destroy: function() {
+      var iframe = this.getIframe();
+      iframe.parentNode.removeChild(iframe);
+    },
+
+    _readyError: function() {
+      throw new Error("wysihtml5.Sandbox: Sandbox iframe isn't loaded yet");
+    },
+
+    /**
+     * Creates the sandbox iframe
+     *
+     * Some important notes:
+     *  - We can't use HTML5 sandbox for now:
+     *    setting it causes that the iframe's dom can't be accessed from the outside
+     *    Therefore we need to set the "allow-same-origin" flag which enables accessing the iframe's dom
+     *    But then there's another problem, DOM events (focus, blur, change, keypress, ...) aren't fired.
+     *    In order to make this happen we need to set the "allow-scripts" flag.
+     *    A combination of allow-scripts and allow-same-origin is almost the same as setting no sandbox attribute at all.
+     *  - Chrome & Safari, doesn't seem to support sandboxing correctly when the iframe's html is inlined (no physical document)
+     *  - IE needs to have the security="restricted" attribute set before the iframe is 
+     *    inserted into the dom tree
+     *  - Believe it or not but in IE "security" in document.createElement("iframe") is false, even
+     *    though it supports it
+     *  - When an iframe has security="restricted", in IE eval() & execScript() don't work anymore
+     *  - IE doesn't fire the onload event when the content is inlined in the src attribute, therefore we rely
+     *    on the onreadystatechange event
+     */
+    _createIframe: function() {
+      var that   = this,
+          iframe = doc.createElement("iframe");
+      iframe.className = "wysihtml5-sandbox";
+      wysihtml5.dom.setAttributes({
+        "security":           "restricted",
+        "allowtransparency":  "true",
+        "frameborder":        0,
+        "width":              0,
+        "height":             0,
+        "marginwidth":        0,
+        "marginheight":       0
+      }).on(iframe);
+
+      // Setting the src like this prevents ssl warnings in IE6
+      if (wysihtml5.browser.throwsMixedContentWarningWhenIframeSrcIsEmpty()) {
+        iframe.src = "javascript:'<html></html>'";
+      }
+
+      iframe.onload = function() {
+        iframe.onreadystatechange = iframe.onload = null;
+        that._onLoadIframe(iframe);
+      };
+
+      iframe.onreadystatechange = function() {
+        if (/loaded|complete/.test(iframe.readyState)) {
+          iframe.onreadystatechange = iframe.onload = null;
+          that._onLoadIframe(iframe);
+        }
+      };
+
+      return iframe;
+    },
+
+    /**
+     * Callback for when the iframe has finished loading
+     */
+    _onLoadIframe: function(iframe) {
+      // don't resume when the iframe got unloaded (eg. by removing it from the dom)
+      if (!wysihtml5.dom.contains(doc.documentElement, iframe)) {
+        return;
+      }
+
+      var that           = this,
+          iframeWindow   = iframe.contentWindow,
+          iframeDocument = iframe.contentDocument || iframe.contentWindow.document,
+          charset        = doc.characterSet || doc.charset || "utf-8",
+          sandboxHtml    = this._getHtml({
+            charset:      charset,
+            stylesheets:  this.config.stylesheets,
+            uaCompatible: this.config.uaCompatible
+          });
+
+      // Create the basic dom tree including proper DOCTYPE and charset
+      iframeDocument.open("text/html", "replace");
+      iframeDocument.write(sandboxHtml);
+      iframeDocument.close();
+
+      this.getWindow = function() { return iframeWindow; };
+      this.getDocument = function() { return iframeDocument; };
+
+      // Catch js errors and pass them to the parent's onerror event
+      // addEventListener("error") doesn't work properly in some browsers
+      // TODO: apparently this doesn't work in IE9!
+      iframeWindow.onerror = function(errorMessage, fileName, lineNumber) {
+        throw new Error("wysihtml5.Sandbox: " + errorMessage, fileName, lineNumber);
+      };
+
+      if (!wysihtml5.browser.supportsSandboxedIframes()) {
+        // Unset a bunch of sensitive variables
+        // Please note: This isn't hack safe!  
+        // It more or less just takes care of basic attacks and prevents accidental theft of sensitive information
+        // IE is secure though, which is the most important thing, since IE is the only browser, who
+        // takes over scripts & styles into contentEditable elements when copied from external websites
+        // or applications (Microsoft Word, ...)
+        var i, length;
+        for (i=0, length=windowProperties.length; i<length; i++) {
+          this._unset(iframeWindow, windowProperties[i]);
+        }
+        for (i=0, length=windowProperties2.length; i<length; i++) {
+          this._unset(iframeWindow, windowProperties2[i], wysihtml5.EMPTY_FUNCTION);
+        }
+        for (i=0, length=documentProperties.length; i<length; i++) {
+          this._unset(iframeDocument, documentProperties[i]);
+        }
+        // This doesn't work in Safari 5 
+        // See http://stackoverflow.com/questions/992461/is-it-possible-to-override-document-cookie-in-webkit
+        this._unset(iframeDocument, "cookie", "", true);
+      }
+
+      this.loaded = true;
+
+      // Trigger the callback
+      setTimeout(function() { that.callback(that); }, 0);
+    },
+
+    _getHtml: function(templateVars) {
+      var stylesheets = templateVars.stylesheets,
+          html        = "",
+          i           = 0,
+          length;
+      stylesheets = typeof(stylesheets) === "string" ? [stylesheets] : stylesheets;
+      if (stylesheets) {
+        length = stylesheets.length;
+        for (; i<length; i++) {
+          html += '<link rel="stylesheet" href="' + stylesheets[i] + '">';
+        }
+      }
+      templateVars.stylesheets = html;
+
+      return wysihtml5.lang.string(
+        '<!DOCTYPE html><html><head>'
+        + '<meta http-equiv="X-UA-Compatible" content="#{uaCompatible}"><meta charset="#{charset}">#{stylesheets}</head>'
+        + '<body></body></html>'
+      ).interpolate(templateVars);
+    },
+
+    /**
+     * Method to unset/override existing variables
+     * @example
+     *    // Make cookie unreadable and unwritable
+     *    this._unset(document, "cookie", "", true);
+     */
+    _unset: function(object, property, value, setter) {
+      try { object[property] = value; } catch(e) {}
+
+      try { object.__defineGetter__(property, function() { return value; }); } catch(e) {}
+      if (setter) {
+        try { object.__defineSetter__(property, function() {}); } catch(e) {}
+      }
+
+      if (!wysihtml5.browser.crashesWhenDefineProperty(property)) {
+        try {
+          var config = {
+            get: function() { return value; }
+          };
+          if (setter) {
+            config.set = function() {};
+          }
+          Object.defineProperty(object, property, config);
+        } catch(e) {}
+      }
+    }
+  });
+})(wysihtml5);
diff --git a/src/dom/set_attributes.js b/src/dom/set_attributes.js
new file mode 100644
index 00000000..71ce2b73
--- /dev/null
+++ b/src/dom/set_attributes.js
@@ -0,0 +1,14 @@
+(function() {
+  var mapping = {
+    "className": "class"
+  };
+  wysihtml5.dom.setAttributes = function(attributes) {
+    return {
+      on: function(element) {
+        for (var i in attributes) {
+          element.setAttribute(mapping[i] || i, attributes[i]);
+        }
+      }
+    }
+  };
+})();
\ No newline at end of file
diff --git a/src/dom/set_styles.js b/src/dom/set_styles.js
new file mode 100644
index 00000000..78a2df81
--- /dev/null
+++ b/src/dom/set_styles.js
@@ -0,0 +1,19 @@
+wysihtml5.dom.setStyles = function(styles) {
+  return {
+    on: function(element) {
+      var style = element.style;
+      if (typeof(styles) === "string") {
+        style.cssText += ";" + styles;
+        return;
+      }
+      for (var i in styles) {
+        if (i === "float") {
+          style.cssFloat = styles[i];
+          style.styleFloat = styles[i];
+        } else {
+          style[i] = styles[i];
+        }
+      }
+    }
+  };
+};
\ No newline at end of file
diff --git a/src/dom/simulate_placeholder.js b/src/dom/simulate_placeholder.js
new file mode 100644
index 00000000..38892059
--- /dev/null
+++ b/src/dom/simulate_placeholder.js
@@ -0,0 +1,42 @@
+/**
+ * Simulate HTML5 placeholder attribute
+ *
+ * Needed since
+ *    - div[contentEditable] elements don't support it
+ *    - older browsers (such as IE8 and Firefox 3.6) don't support it at all
+ *
+ * @author Christopher Blum <christopher.blum@xing.com>
+ *
+ * @param {Object} parent Instance of main wysihtml5.Editor class
+ * @param {Element} view Instance of wysihtml5.views.* class
+ * @param {String} placeholderText
+ *
+ * @example
+ *    wysihtml.dom.simulatePlaceholder(this, composer, "Foobar");
+ */
+(function(dom) {
+  dom.simulatePlaceholder = function(editor, view, placeholderText) {
+    var CLASS_NAME = "placeholder",
+        unset = function() {
+          if (view.hasPlaceholderSet()) {
+            view.clear();
+          }
+          dom.removeClass(view.element, CLASS_NAME);
+        },
+        set = function() {
+          if (view.isEmpty()) {
+            view.setValue(placeholderText);
+            dom.addClass(view.element, CLASS_NAME);
+          }
+        };
+
+    editor
+      .observe("set_placeholder", set)
+      .observe("unset_placeholder", unset)
+      .observe("focus:composer", unset)
+      .observe("paste:composer", unset)
+      .observe("blur:composer", set);
+
+    set();
+  };
+})(wysihtml5.dom);
diff --git a/src/dom/text_content.js b/src/dom/text_content.js
new file mode 100644
index 00000000..41c2ace4
--- /dev/null
+++ b/src/dom/text_content.js
@@ -0,0 +1,29 @@
+(function(dom) {
+  var documentElement = document.documentElement;
+  if ("textContent" in documentElement) {
+    dom.setTextContent = function(element, text) {
+      element.textContent = text;
+    };
+
+    dom.getTextContent = function(element) {
+      return element.textContent;
+    };
+  } else if ("innerText" in documentElement) {
+    dom.setTextContent = function(element, text) {
+      element.innerText = text;
+    };
+
+    dom.getTextContent = function(element) {
+      return element.innerText;
+    };
+  } else {
+    dom.setTextContent = function(element, text) {
+      element.nodeValue = text;
+    };
+
+    dom.getTextContent = function(element) {
+      return element.nodeValue;
+    };
+  }
+})(wysihtml5.dom);
+
diff --git a/src/editor.js b/src/editor.js
index 5fdf9c1d..bb899d14 100644
--- a/src/editor.js
+++ b/src/editor.js
@@ -24,20 +24,23 @@
  *    destroy:composer
  *    change_view
  */
-wysihtml5.Editor = (function() {
+(function(wysihtml5) {
+  var undef;
+  
   var defaultConfig = {
     // Give the editor a name, the name will also be set as class name on the iframe and on the iframe's body 
-    name:                 null,
+    name:                 undef,
     // Whether the editor should look like the textarea (by adopting styles)
     style:                true,
     // Id of the toolbar element, pass falsey value if you don't want any toolbar logic
-    toolbar:              null,
+    toolbar:              undef,
     // Whether urls, entered by the user should automatically become clickable-links
     autoLink:             true,
     // Object which includes parser rules to apply when html gets inserted via copy & paste
-    parserRules:          null,
+    // See parser_rules/*.js for examples
+    parserRules:          { tags: { br: {}, span: {}, div: {}, p: {} }, classes: {} },
     // Parser method to use when the user inserts content via copy & paste
-    parser:               wysihtml5.utils.sanitizeHTML || Prototype.K,
+    parser:               wysihtml5.dom.parse,
     // Class name which should be set on the contentEditable element in the created sandbox iframe, can be styled via the 'stylesheets' option
     composerClassName:    "wysihtml5-editor",
     // Class name to add to the body when the wysihtml5 editor is supported
@@ -45,46 +48,43 @@ wysihtml5.Editor = (function() {
     // Array (or single string) of stylesheet urls to be loaded in the editor's iframe
     stylesheets:          [],
     // Placeholder text to use, defaults to the placeholder attribute on the textarea element
-    placeholderText:      null,
+    placeholderText:      undef,
     // Whether the composer should allow the user to manually resize images, tables etc.
     allowObjectResizing:  true
   };
   
-  // Incremental instance id
-  var instanceId = new Date().getTime();
-  
-  return Class.create(
+  wysihtml5.Editor = wysihtml5.lang.Dispatcher.extend(
     /** @scope wysihtml5.Editor.prototype */ {
-    initialize: function(textareaElement, config) {
-      this._instanceId      = ++instanceId;
-      this.textareaElement  = $(textareaElement);
-      this.config           = Object.extend(Object.clone(defaultConfig), config);
+    constructor: function(textareaElement, config) {
+      this.textareaElement  = typeof(textareaElement) === "string" ? document.getElementById(textareaElement) : textareaElement;
+      this.config           = wysihtml5.lang.object({}).merge(defaultConfig).merge(config).get();
       this.textarea         = new wysihtml5.views.Textarea(this, this.textareaElement, this.config);
       this.currentView      = this.textarea;
-      this._isCompatible    = wysihtml5.browserSupports.contentEditable();
+      this._isCompatible    = wysihtml5.browser.supported();
       
       // Sort out unsupported browsers here
       if (!this._isCompatible) {
-        (function() { this.fire("beforeload").fire("load"); }).bind(this).defer();
+        var that = this;
+        setTimeout(function() { that.fire("beforeload").fire("load"); }, 0);
         return;
       }
       
       // Add class name to body, to indicate that the editor is supported
-      $(document.body).addClassName(this.config.bodyClassName);
+      wysihtml5.dom.addClass(document.body, this.config.bodyClassName);
       
       this.composer = new wysihtml5.views.Composer(this, this.textareaElement, this.config);
       this.currentView = this.composer;
       
-      if (Object.isFunction(this.config.parser)) {
+      if (typeof(this.config.parser) === "function") {
         this._initParser();
       }
       
       this.observe("beforeload", function() {
-        this.synchronizer = new wysihtml5.utils.Synchronizer(this, this.textarea, this.composer);
+        this.synchronizer = new wysihtml5.views.Synchronizer(this, this.textarea, this.composer);
         if (this.config.toolbar) {
           this.toolbar = new wysihtml5.toolbar.Toolbar(this, this.config.toolbar);
         }
-      }.bind(this));
+      });
       
       try {
         console.log("Heya! This page is using wysihtml5 for rich text editing. Check out https://github.com/xing/wysihtml5");
@@ -94,33 +94,6 @@ wysihtml5.Editor = (function() {
     isCompatible: function() {
       return this._isCompatible;
     },
-    
-    observe: function() {
-      Element.observe.apply(Element, this._getEventArguments(arguments));
-      return this;
-    },
-
-    fire: function() {
-      Element.fire.apply(Element, this._getEventArguments(arguments));
-      return this;
-    },
-
-    stopObserving: function() {
-      Element.stopObserving.apply(Element, this._getEventArguments(arguments));
-      return this;
-    },
-
-    /**
-     * Builds an array that can be passed into Function.prototyope.apply
-     * when called on Element.observe, Element.stopObserving, Element.fire
-     */
-    _getEventArguments: function(args) {
-      args = $A(args);
-      if (args[0]) {
-        args[0] = "wysihtml5:" + this._instanceId + ":" + args[0];
-      }
-      return [document.documentElement, args].flatten();
-    },
 
     clear: function() {
       this.currentView.clear();
@@ -178,36 +151,24 @@ wysihtml5.Editor = (function() {
     
     /**
      * Prepare html parser logic
-     *  - Loads parser rules if config.parserRules is a string
      *  - Observes for paste and drop
      */
     _initParser: function() {
-      if (typeof(this.config.parserRules) === "string") {
-        new Ajax.Request(this.config.parserRules, {
-          method:   "get",
-          onCreate: function() {
-            this.config.parserRules = defaultConfig.parserRules;
-          }.bind(this),
-          onSuccess: function(transport) {
-            this.config.parserRules = transport.responseJSON || transport.responseText.evalJSON();
-          }.bind(this)
-        });
-      }
-      
       this.observe("paste:composer", function() {
-        var keepScrollPosition = true;
-        wysihtml5.utils.caret.executeAndRestore(this.composer.sandbox.getDocument(), function() {
-          wysihtml5.quirks.cleanPastedHTML(this.composer.element);
-          this.parse(this.composer.element);
-        }.bind(this), keepScrollPosition);
-      }.bind(this));
+        var keepScrollPosition  = true,
+            that                = this;
+        wysihtml5.selection.executeAndRestore(this.composer.sandbox.getDocument(), function() {
+          wysihtml5.quirks.cleanPastedHTML(that.composer.element);
+          that.parse(that.composer.element);
+        }, keepScrollPosition);
+      });
       
       this.observe("paste:textarea", function() {
         var value   = this.textarea.getValue(),
             newValue;
         newValue = this.parse(value);
         this.textarea.setValue(newValue);
-      }.bind(this));
+      });
     }
   });
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/lang/array.js b/src/lang/array.js
new file mode 100644
index 00000000..b6c14599
--- /dev/null
+++ b/src/lang/array.js
@@ -0,0 +1,58 @@
+wysihtml5.lang.array = function(arr) {
+  return {
+    /**
+     * Check whether a given object exists in an array
+     *
+     * @example
+     *    wysihtml5.lang.array([1, 2]).contains(1);
+     *    // => true
+     */
+    contains: function(needle) {
+      if (arr.indexOf) {
+        return arr.indexOf(needle) !== -1;
+      } else {
+        for (var i=0, length=arr.length; i<length; i++) {
+          if (arr[i] === needle) { return true; }
+        }
+        return false;
+      }
+    },
+    
+    /**
+     * Substract one array from another
+     *
+     * @example
+     *    wysihtml5.lang.array([1, 2, 3, 4]).without([3, 4]);
+     *    // => [1, 2]
+     */
+    without: function(arrayToSubstract) {
+      arrayToSubstract = wysihtml5.lang.array(arrayToSubstract);
+      var newArr  = [],
+          i       = 0,
+          length  = arr.length;
+      for (; i<length; i++) {
+        if (!arrayToSubstract.contains(arr[i])) {
+          newArr.push(arr[i]);
+        }
+      }
+      return newArr;
+    },
+    
+    /**
+     * Return a clean native array
+     * 
+     * Following will convert a Live NodeList to a proper Array
+     * @example
+     *    var childNodes = wysihtml5.lang.array(document.body.childNodes).get();
+     */
+    get: function() {
+      var i        = 0,
+          length   = arr.length,
+          newArray = [];
+      for (; i<length; i++) {
+        newArray.push(arr[i]);
+      }
+      return newArray;
+    }
+  };
+};
\ No newline at end of file
diff --git a/src/lang/dispatcher.js b/src/lang/dispatcher.js
new file mode 100644
index 00000000..1453202a
--- /dev/null
+++ b/src/lang/dispatcher.js
@@ -0,0 +1,40 @@
+wysihtml5.lang.Dispatcher = Base.extend(
+  /** @scope wysihtml5.lang.Dialog.prototype */ {
+  observe: function(eventName, handler) {
+    this.events = this.events || {};
+    this.events[eventName] = this.events[eventName] || [];
+    this.events[eventName].push(handler);
+    return this;
+  },
+
+  fire: function(eventName, payload) {
+    this.events = this.events || {};
+    var handlers = this.events[eventName] || [],
+        i        = 0;
+    for (; i<handlers.length; i++) {
+      handlers[i].call(this, payload);
+    }
+    return this;
+  },
+
+  stopObserving: function(eventName, handler) {
+    this.events = this.events || {};
+    var i = 0,
+        handlers,
+        newHandlers;
+    if (eventName) {
+      handlers    = this.events[eventName] || [],
+      newHandlers = [];
+      for (; i<handlers.length; i++) {
+        if (handlers[i] !== handler) {
+          newHandlers.push(handlers[i]);
+        }
+      }
+      this.events[eventName] = newHandlers;
+    } else {
+      // Clean up all events
+      this.events = {};
+    }
+    return this;
+  }
+});
\ No newline at end of file
diff --git a/src/lang/object.js b/src/lang/object.js
new file mode 100644
index 00000000..081a7496
--- /dev/null
+++ b/src/lang/object.js
@@ -0,0 +1,42 @@
+wysihtml5.lang.object = function(obj) {
+  return {
+    /**
+     * @example
+     *    wysihtml5.lang.object({ foo: 1, bar: 1 }).merge({ bar: 2, baz: 3 }).get();
+     *    // => { foo: 1, bar: 2, baz: 3 }
+     */
+    merge: function(otherObj) {
+      for (var i in otherObj) {
+        obj[i] = otherObj[i];
+      }
+      return this;
+    },
+    
+    get: function() {
+      return obj;
+    },
+    
+    /**
+     * @example
+     *    wysihtml5.lang.object({ foo: 1 }).clone();
+     *    // => { foo: 1 }
+     */
+    clone: function() {
+      var newObj = {},
+          i;
+      for (i in obj) {
+        newObj[i] = obj[i];
+      }
+      return newObj;
+    },
+    
+    /**
+     * @example
+     *    wysihtml5.lang.object([]).isArray();
+     *    // => true
+     */
+    isArray: function() {
+      return Object.prototype.toString.call(obj) === "[object Array]";
+    }
+  };
+};
\ No newline at end of file
diff --git a/src/lang/string.js b/src/lang/string.js
new file mode 100644
index 00000000..87788555
--- /dev/null
+++ b/src/lang/string.js
@@ -0,0 +1,42 @@
+(function() {
+  var WHITE_SPACE_START = /^\s+/,
+      WHITE_SPACE_END   = /\s+$/;
+  wysihtml5.lang.string = function(str) {
+    str = String(str);
+    return {
+      /**
+       * @example
+       *    wysihtml5.lang.string("   foo   ").trim();
+       *    // => "foo"
+       */
+      trim: function() {
+        return str.replace(WHITE_SPACE_START, "").replace(WHITE_SPACE_END, "");
+      },
+      
+      /**
+       * @example
+       *    wysihtml5.lang.string("Hello #{name}").interpolate({ name: "Christopher" });
+       *    // => "Hello Christopher"
+       */
+      interpolate: function(vars) {
+        for (var i in vars) {
+          str = this.replace("#{" + i + "}").by(vars[i]);
+        }
+        return str;
+      },
+      
+      /**
+       * @example
+       *    wysihtml5.lang.string("Hello Tom").replace("Tom").with("Hans");
+       *    // => "Hello Hans"
+       */
+      replace: function(search) {
+        return {
+          by: function(replace) {
+            return str.split(search).join(replace);
+          }
+        }
+      }
+    };
+  };
+})();
\ No newline at end of file
diff --git a/src/quirks/clean_pasted_html.js b/src/quirks/clean_pasted_html.js
index 62b1bba9..6923b796 100644
--- a/src/quirks/clean_pasted_html.js
+++ b/src/quirks/clean_pasted_html.js
@@ -8,7 +8,7 @@ wysihtml5.quirks.cleanPastedHTML = (function() {
   // TODO: We probably need more rules here
   var defaultRules = {
     // When pasting underlined links <a> into a contentEditable, IE thinks, it has to insert <u> to keep the styling
-    "a u": wysihtml5.utils.unwrap
+    "a u": wysihtml5.dom.replaceWithChildNodes
   };
   
   function cleanPastedHTML(elementOrHtml, rules, context) {
@@ -23,7 +23,7 @@ wysihtml5.quirks.cleanPastedHTML = (function() {
         i,
         j = 0;
     if (isString) {
-      element = wysihtml5.utils.getInDomElement(elementOrHtml, context);
+      element = wysihtml5.dom.getAsDom(elementOrHtml, context);
     } else {
       element = elementOrHtml;
     }
diff --git a/src/quirks/ensure_proper_clearing.js b/src/quirks/ensure_proper_clearing.js
index 50080e72..0b059e4e 100644
--- a/src/quirks/ensure_proper_clearing.js
+++ b/src/quirks/ensure_proper_clearing.js
@@ -6,72 +6,77 @@
  * @exaple
  *    wysihtml5.quirks.ensureProperClearing(myContentEditableElement);
  */
-wysihtml5.quirks.ensureProperClearing = (function() {
-  var clearIfNecessary = function(event) {
-    var element = this;
-    setTimeout(function() {
-      var innerHTML = element.innerHTML.toLowerCase();
-      if (innerHTML == "<p>&nbsp;</p>" ||
-          innerHTML == "<p>&nbsp;</p><p>&nbsp;</p>") {
-        element.innerHTML = "";
-      }
-    }, 0);
-  };
+(function(wysihtml5) {
+  var dom = wysihtml5.dom;
   
-  return function(contentEditableElement) {
-    wysihtml5.utils.observe(contentEditableElement, ["cut", "keydown"], clearIfNecessary);
-  };
-})();
+  wysihtml5.quirks.ensureProperClearing = (function() {
+    var clearIfNecessary = function(event) {
+      var element = this;
+      setTimeout(function() {
+        var innerHTML = element.innerHTML.toLowerCase();
+        if (innerHTML == "<p>&nbsp;</p>" ||
+            innerHTML == "<p>&nbsp;</p><p>&nbsp;</p>") {
+          element.innerHTML = "";
+        }
+      }, 0);
+    };
 
+    return function(contentEditableElement) {
+      dom.observe(contentEditableElement, ["cut", "keydown"], clearIfNecessary);
+    };
+  })();
 
 
-/**
- * In Opera when the caret is in the first and only item of a list (<ul><li>|</li></ul>) and the list is the first child of the contentEditable element, it's impossible to delete the list by hitting backspace
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Object} contentEditableElement The contentEditable element to observe for clearing events
- * @exaple
- *    wysihtml5.quirks.ensureProperClearing(myContentEditableElement);
- */
-wysihtml5.quirks.ensureProperClearingOfLists = (function() {
-  var ELEMENTS_THAT_CONTAIN_LI = ["OL", "UL", "MENU"];
-  
-  var clearIfNecessary = function(element, contentEditableElement) {
-    if (!contentEditableElement.firstChild || ELEMENTS_THAT_CONTAIN_LI.indexOf(contentEditableElement.firstChild.nodeName) == -1) {
-      return;
-    }
-    
-    var list = wysihtml5.utils.getParentElement(element, { nodeName: ELEMENTS_THAT_CONTAIN_LI });
-    if (!list) {
-      return;
-    }
-    
-    var listIsFirstChildOfContentEditable = list == contentEditableElement.firstChild;
-    if (!listIsFirstChildOfContentEditable) {
-      return;
-    }
-    
-    var hasOnlyOneListItem = list.childNodes.length <= 1;
-    if (!hasOnlyOneListItem) {
-      return;
-    }
-    
-    var onlyListItemIsEmpty = list.firstChild ? list.firstChild.innerHTML === "" : true;
-    if (!onlyListItemIsEmpty) {
-      return;
-    }
-    
-    list.parentNode.removeChild(list);
-  };
-  
-  return function(contentEditableElement) {
-    wysihtml5.utils.observe(contentEditableElement, "keydown", function(event) {
-      if (event.keyCode != 8) { // 8 = backspace
+
+  /**
+   * In Opera when the caret is in the first and only item of a list (<ul><li>|</li></ul>) and the list is the first child of the contentEditable element, it's impossible to delete the list by hitting backspace
+   *
+   * @author Christopher Blum <christopher.blum@xing.com>
+   * @param {Object} contentEditableElement The contentEditable element to observe for clearing events
+   * @exaple
+   *    wysihtml5.quirks.ensureProperClearing(myContentEditableElement);
+   */
+  wysihtml5.quirks.ensureProperClearingOfLists = (function() {
+    var ELEMENTS_THAT_CONTAIN_LI = ["OL", "UL", "MENU"];
+
+    var clearIfNecessary = function(element, contentEditableElement) {
+      if (!contentEditableElement.firstChild || !wysihtml5.lang.array(ELEMENTS_THAT_CONTAIN_LI).contains(contentEditableElement.firstChild.nodeName)) {
+        return;
+      }
+
+      var list = dom.getParentElement(element, { nodeName: ELEMENTS_THAT_CONTAIN_LI });
+      if (!list) {
+        return;
+      }
+
+      var listIsFirstChildOfContentEditable = list == contentEditableElement.firstChild;
+      if (!listIsFirstChildOfContentEditable) {
+        return;
+      }
+
+      var hasOnlyOneListItem = list.childNodes.length <= 1;
+      if (!hasOnlyOneListItem) {
         return;
       }
-      
-      var element = wysihtml5.utils.caret.getSelectedNode(contentEditableElement.ownerDocument);
-      clearIfNecessary(element, contentEditableElement);
-    });
-  };
-})();
\ No newline at end of file
+
+      var onlyListItemIsEmpty = list.firstChild ? list.firstChild.innerHTML === "" : true;
+      if (!onlyListItemIsEmpty) {
+        return;
+      }
+
+      list.parentNode.removeChild(list);
+    };
+
+    return function(contentEditableElement) {
+      dom.observe(contentEditableElement, "keydown", function(event) {
+        if (event.keyCode !== wysihtml5.BACKSPACE_KEY) {
+          return;
+        }
+
+        var element = wysihtml5.selection.getSelectedNode(contentEditableElement.ownerDocument);
+        clearIfNecessary(element, contentEditableElement);
+      });
+    };
+  })();
+
+})(wysihtml5);
diff --git a/src/quirks/get_correct_inner_html.js b/src/quirks/get_correct_inner_html.js
new file mode 100644
index 00000000..7aedaec5
--- /dev/null
+++ b/src/quirks/get_correct_inner_html.js
@@ -0,0 +1,30 @@
+// See https://bugzilla.mozilla.org/show_bug.cgi?id=664398
+//
+// In Firefox this:
+//      var d = document.createElement("div");
+//      d.innerHTML ='<a href="~"></a>';
+//      d.innerHTML;
+// will result in:
+//      <a href="%7E"></a>
+// which is wrong
+(function(wysihtml5) {
+  var TILDE_ESCAPED = "%7E";
+  wysihtml5.quirks.getCorrectInnerHTML = function(element) {
+    var innerHTML = element.innerHTML;
+    if (innerHTML.indexOf(TILDE_ESCAPED) === -1) {
+      return innerHTML;
+    }
+    
+    var elementsWithTilde = element.querySelectorAll("[href*='~'], [src*='~']"),
+        url,
+        urlToSearch,
+        length,
+        i;
+    for (i=0, length=elementsWithTilde.length; i<length; i++) {
+      url         = elementsWithTilde[i].href || elementsWithTilde[i].src;
+      urlToSearch = wysihtml5.lang.string(url).replace("~").by(TILDE_ESCAPED);
+      innerHTML   = wysihtml5.lang.string(innerHTML).replace(urlToSearch).by(url);
+    }
+    return innerHTML;
+  };
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/quirks/insert_line_break_on_return.js b/src/quirks/insert_line_break_on_return.js
index 4d9c3244..302a58ac 100644
--- a/src/quirks/insert_line_break_on_return.js
+++ b/src/quirks/insert_line_break_on_return.js
@@ -11,34 +11,35 @@
  * @example
  *    wysihtml5.quirks.insertLineBreakOnReturn(element);
  */
-wysihtml5.quirks.insertLineBreakOnReturn = (function() {
-  var USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS  = ["LI", "DIV", "P", "H1", "H2", "H3", "H4", "H5", "H6"],
-      LIST_TAGS                                     = ["UL", "OL", "MENU"],
-      BACKSPACE_KEY                                 = 8,
-      RETURN_KEY                                    = 13;
+(function(wysihtml5) {
+  var dom                                           = wysihtml5.dom,
+      USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS  = ["LI", "DIV", "P", "H1", "H2", "H3", "H4", "H5", "H6"],
+      LIST_TAGS                                     = ["UL", "OL", "MENU"];
   
-  var keyPress = function(event) {
-    if (event.shiftKey || (event.keyCode !== RETURN_KEY && event.keyCode !== BACKSPACE_KEY)) {
+  function keyPress(event) {
+    var keyCode = event.keyCode;
+    
+    if (event.shiftKey || (keyCode !== wysihtml5.ENTER_KEY && keyCode !== wysihtml5.BACKSPACE_KEY)) {
       return;
     }
     
     var element         = event.target,
-        selectedNode    = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument),
-        blockElement    = wysihtml5.utils.getParentElement(selectedNode, { nodeName: USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS }, 4);
+        selectedNode    = wysihtml5.selection.getSelectedNode(element.ownerDocument),
+        blockElement    = dom.getParentElement(selectedNode, { nodeName: USE_NATIVE_LINE_BREAK_WHEN_CARET_INSIDE_TAGS }, 4);
     
     if (blockElement) {
       // IE and Opera create <p> elements after leaving a list
       // check after keypress of backspace and return whether a <p> got inserted and unwrap it
-      if (blockElement.nodeName === "LI" && (event.keyCode === RETURN_KEY || event.keyCode === BACKSPACE_KEY)) {
+      if (blockElement.nodeName === "LI" && (keyCode === wysihtml5.ENTER_KEY || keyCode === wysihtml5.BACKSPACE_KEY)) {
         setTimeout(function() {
-          var selectedNode = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument),
+          var selectedNode = wysihtml5.selection.getSelectedNode(element.ownerDocument),
               list,
               div;
           if (!selectedNode) {
             return;
           }
           
-          list = wysihtml5.utils.getParentElement(selectedNode, {
+          list = dom.getParentElement(selectedNode, {
             nodeName: LIST_TAGS
           }, 2);
           
@@ -46,22 +47,22 @@ wysihtml5.quirks.insertLineBreakOnReturn = (function() {
             return;
           }
           if (selectedNode.parentNode.nodeName === "P") {
-            div = wysihtml5.utils.renameElement(selectedNode.parentNode, "div");
-            wysihtml5.utils.caret.selectNode(div);
+            div = dom.renameElement(selectedNode.parentNode, "div");
+            wysihtml5.selection.selectNode(div);
           }
         }, 0);
       }
       return;
     }
     
-    if (event.keyCode === RETURN_KEY) {
+    if (keyCode === wysihtml5.ENTER_KEY) {
       wysihtml5.commands.exec(element, "insertLineBreak");
       event.preventDefault();
     }
-  };
+  }
   
-  return function(element) {
+  wysihtml5.quirks.insertLineBreakOnReturn = function(element) {
     // keypress doesn't fire when you hit backspace
-    wysihtml5.utils.observe(element.ownerDocument, "keydown", keyPress);
+    dom.observe(element.ownerDocument, "keydown", keyPress);
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/quirks/redraw.js b/src/quirks/redraw.js
index e05fee3a..4b97ab96 100644
--- a/src/quirks/redraw.js
+++ b/src/quirks/redraw.js
@@ -7,11 +7,12 @@
  * @example
  *    wysihtml5.quirks.redraw(document.body);
  */
-wysihtml5.quirks.redraw = (function() {
+(function(wysihtml5) {
   var CLASS_NAME = "wysihtml5-quirks-redraw";
-  return function(element) {
-    Element.addClassName(element, CLASS_NAME)
-    Element.removeClassName(element, CLASS_NAME);
+  
+  wysihtml5.quirks.redraw = function(element) {
+    wysihtml5.dom.addClass(element, CLASS_NAME);
+    wysihtml5.dom.removeClass(element, CLASS_NAME);
     
     // Following hack is needed for firefox to make sure that image resize handles are properly removed
     try {
@@ -20,4 +21,4 @@ wysihtml5.quirks.redraw = (function() {
       doc.execCommand("italic", false, null);
     } catch(e) {}
   };
-})();
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/selection/html_applier.js b/src/selection/html_applier.js
new file mode 100644
index 00000000..2b98f0cb
--- /dev/null
+++ b/src/selection/html_applier.js
@@ -0,0 +1,434 @@
+/**
+ * @author Christopher Blum <christopher.blum@xing.com> to match WYSIHTML5 logic
+ * in order to be able ...
+ *    - to use custom tags
+ *    - to detect and replace similar css classes via reg exp
+ *
+ * Inspired by the rangy CSS Applier module written by Tim Down and  licensed under the MIT license.
+ * http://code.google.com/p/rangy/
+ */
+(function(wysihtml5, rangy) {
+  var defaultTagName = "span";
+  
+  var REG_EXP_WHITE_SPACE = /\s+/g;
+  
+  function hasClass(el, cssClass, regExp) {
+    if (!el.className) {
+      return false;
+    }
+    
+    var matchingClassNames = el.className.match(regExp) || [];
+    return matchingClassNames[matchingClassNames.length - 1] === cssClass;
+  }
+
+  function addClass(el, cssClass, regExp) {
+    if (el.className) {
+      removeClass(el, regExp);
+      el.className += " " + cssClass;
+    } else {
+      el.className = cssClass;
+    }
+  }
+
+  function removeClass(el, regExp) {
+    if (el.className) {
+      el.className = el.className.replace(regExp, "");
+    }
+  }
+  
+  function hasSameClasses(el1, el2) {
+    return el1.className.replace(REG_EXP_WHITE_SPACE, " ") == el2.className.replace(REG_EXP_WHITE_SPACE, " ");
+  }
+
+  function replaceWithOwnChildren(el) {
+    var parent = el.parentNode;
+    while (el.firstChild) {
+      parent.insertBefore(el.firstChild, el);
+    }
+    parent.removeChild(el);
+  }
+
+  function elementsHaveSameNonClassAttributes(el1, el2) {
+    if (el1.attributes.length != el2.attributes.length) {
+      return false;
+    }
+    for (var i = 0, len = el1.attributes.length, attr1, attr2, name; i < len; ++i) {
+      attr1 = el1.attributes[i];
+      name = attr1.name;
+      if (name != "class") {
+        attr2 = el2.attributes.getNamedItem(name);
+        if (attr1.specified != attr2.specified) {
+          return false;
+        }
+        if (attr1.specified && attr1.nodeValue !== attr2.nodeValue) {
+          return false;
+        }
+      }
+    }
+    return true;
+  }
+
+  function isSplitPoint(node, offset) {
+    if (rangy.dom.isCharacterDataNode(node)) {
+      if (offset == 0) {
+        return !!node.previousSibling;
+      } else if (offset == node.length) {
+        return !!node.nextSibling;
+      } else {
+        return true;
+      }
+    }
+
+    return offset > 0 && offset < node.childNodes.length;
+  }
+
+  function splitNodeAt(node, descendantNode, descendantOffset) {
+    var newNode;
+    if (rangy.dom.isCharacterDataNode(descendantNode)) {
+      if (descendantOffset == 0) {
+        descendantOffset = rangy.dom.getNodeIndex(descendantNode);
+        descendantNode = descendantNode.parentNode;
+      } else if (descendantOffset == descendantNode.length) {
+        descendantOffset = rangy.dom.getNodeIndex(descendantNode) + 1;
+        descendantNode = descendantNode.parentNode;
+      } else {
+        newNode = rangy.dom.splitDataNode(descendantNode, descendantOffset);
+      }
+    }
+    if (!newNode) {
+      newNode = descendantNode.cloneNode(false);
+      if (newNode.id) {
+        newNode.removeAttribute("id");
+      }
+      var child;
+      while ((child = descendantNode.childNodes[descendantOffset])) {
+        newNode.appendChild(child);
+      }
+      rangy.dom.insertAfter(newNode, descendantNode);
+    }
+    return (descendantNode == node) ? newNode : splitNodeAt(node, newNode.parentNode, rangy.dom.getNodeIndex(newNode));
+  }
+  
+  function Merge(firstNode) {
+    this.isElementMerge = (firstNode.nodeType == wysihtml5.ELEMENT_NODE);
+    this.firstTextNode = this.isElementMerge ? firstNode.lastChild : firstNode;
+    this.textNodes = [this.firstTextNode];
+  }
+
+  Merge.prototype = {
+    doMerge: function() {
+      var textBits = [], textNode, parent, text;
+      for (var i = 0, len = this.textNodes.length; i < len; ++i) {
+        textNode = this.textNodes[i];
+        parent = textNode.parentNode;
+        textBits[i] = textNode.data;
+        if (i) {
+          parent.removeChild(textNode);
+          if (!parent.hasChildNodes()) {
+            parent.parentNode.removeChild(parent);
+          }
+        }
+      }
+      this.firstTextNode.data = text = textBits.join("");
+      return text;
+    },
+
+    getLength: function() {
+      var i = this.textNodes.length, len = 0;
+      while (i--) {
+        len += this.textNodes[i].length;
+      }
+      return len;
+    },
+
+    toString: function() {
+      var textBits = [];
+      for (var i = 0, len = this.textNodes.length; i < len; ++i) {
+        textBits[i] = "'" + this.textNodes[i].data + "'";
+      }
+      return "[Merge(" + textBits.join(",") + ")]";
+    }
+  };
+
+  function HTMLApplier(tagNames, cssClass, similarClassRegExp, normalize) {
+    this.tagNames = tagNames || [defaultTagName];
+    this.cssClass = cssClass || "";
+    this.similarClassRegExp = similarClassRegExp;
+    this.normalize = normalize;
+    this.applyToAnyTagName = false;
+  }
+
+  HTMLApplier.prototype = {
+    getAncestorWithClass: function(node) {
+      var cssClassMatch;
+      while (node) {
+        cssClassMatch = this.cssClass ? hasClass(node, this.cssClass, this.similarClassRegExp) : true;
+        if (node.nodeType == wysihtml5.ELEMENT_NODE && rangy.dom.arrayContains(this.tagNames, node.tagName.toLowerCase()) && cssClassMatch) {
+          return node;
+        }
+        node = node.parentNode;
+      }
+      return false;
+    },
+
+    // Normalizes nodes after applying a CSS class to a Range.
+    postApply: function(textNodes, range) {
+      var firstNode = textNodes[0], lastNode = textNodes[textNodes.length - 1];
+
+      var merges = [], currentMerge;
+
+      var rangeStartNode = firstNode, rangeEndNode = lastNode;
+      var rangeStartOffset = 0, rangeEndOffset = lastNode.length;
+
+      var textNode, precedingTextNode;
+
+      for (var i = 0, len = textNodes.length; i < len; ++i) {
+        textNode = textNodes[i];
+        precedingTextNode = this.getAdjacentMergeableTextNode(textNode.parentNode, false);
+        if (precedingTextNode) {
+          if (!currentMerge) {
+            currentMerge = new Merge(precedingTextNode);
+            merges.push(currentMerge);
+          }
+          currentMerge.textNodes.push(textNode);
+          if (textNode === firstNode) {
+            rangeStartNode = currentMerge.firstTextNode;
+            rangeStartOffset = rangeStartNode.length;
+          }
+          if (textNode === lastNode) {
+            rangeEndNode = currentMerge.firstTextNode;
+            rangeEndOffset = currentMerge.getLength();
+          }
+        } else {
+          currentMerge = null;
+        }
+      }
+
+      // Test whether the first node after the range needs merging
+      var nextTextNode = this.getAdjacentMergeableTextNode(lastNode.parentNode, true);
+      if (nextTextNode) {
+        if (!currentMerge) {
+          currentMerge = new Merge(lastNode);
+          merges.push(currentMerge);
+        }
+        currentMerge.textNodes.push(nextTextNode);
+      }
+
+      // Do the merges
+      if (merges.length) {
+        for (i = 0, len = merges.length; i < len; ++i) {
+          merges[i].doMerge();
+        }
+        // Set the range boundaries
+        range.setStart(rangeStartNode, rangeStartOffset);
+        range.setEnd(rangeEndNode, rangeEndOffset);
+      }
+    },
+    
+    getAdjacentMergeableTextNode: function(node, forward) {
+        var isTextNode = (node.nodeType == wysihtml5.TEXT_NODE);
+        var el = isTextNode ? node.parentNode : node;
+        var adjacentNode;
+        var propName = forward ? "nextSibling" : "previousSibling";
+        if (isTextNode) {
+          // Can merge if the node's previous/next sibling is a text node
+          adjacentNode = node[propName];
+          if (adjacentNode && adjacentNode.nodeType == wysihtml5.TEXT_NODE) {
+            return adjacentNode;
+          }
+        } else {
+          // Compare element with its sibling
+          adjacentNode = el[propName];
+          if (adjacentNode && this.areElementsMergeable(node, adjacentNode)) {
+            return adjacentNode[forward ? "firstChild" : "lastChild"];
+          }
+        }
+        return null;
+    },
+    
+    areElementsMergeable: function(el1, el2) {
+      return rangy.dom.arrayContains(this.tagNames, (el1.tagName || "").toLowerCase())
+        && rangy.dom.arrayContains(this.tagNames, (el2.tagName || "").toLowerCase())
+        && hasSameClasses(el1, el2)
+        && elementsHaveSameNonClassAttributes(el1, el2);
+    },
+
+    createContainer: function(doc) {
+      var el = doc.createElement(this.tagNames[0]);
+      if (this.cssClass) {
+        el.className = this.cssClass;
+      }
+      return el;
+    },
+
+    applyToTextNode: function(textNode) {
+      var parent = textNode.parentNode;
+      if (parent.childNodes.length == 1 && rangy.dom.arrayContains(this.tagNames, parent.tagName.toLowerCase())) {
+        if (this.cssClass) {
+          addClass(parent, this.cssClass, this.similarClassRegExp);
+        }
+      } else {
+        var el = this.createContainer(rangy.dom.getDocument(textNode));
+        textNode.parentNode.insertBefore(el, textNode);
+        el.appendChild(textNode);
+      }
+    },
+
+    isRemovable: function(el) {
+      return rangy.dom.arrayContains(this.tagNames, el.tagName.toLowerCase()) && wysihtml5.lang.string(el.className).trim() == this.cssClass;
+    },
+
+    undoToTextNode: function(textNode, range, ancestorWithClass) {
+      if (!range.containsNode(ancestorWithClass)) {
+        // Split out the portion of the ancestor from which we can remove the CSS class
+        var ancestorRange = range.cloneRange();
+        ancestorRange.selectNode(ancestorWithClass);
+
+        if (ancestorRange.isPointInRange(range.endContainer, range.endOffset) && isSplitPoint(range.endContainer, range.endOffset)) {
+          splitNodeAt(ancestorWithClass, range.endContainer, range.endOffset);
+          range.setEndAfter(ancestorWithClass);
+        }
+        if (ancestorRange.isPointInRange(range.startContainer, range.startOffset) && isSplitPoint(range.startContainer, range.startOffset)) {
+          ancestorWithClass = splitNodeAt(ancestorWithClass, range.startContainer, range.startOffset);
+        }
+      }
+      
+      if (this.similarClassRegExp) {
+        removeClass(ancestorWithClass, this.similarClassRegExp);
+      }
+      if (this.isRemovable(ancestorWithClass)) {
+        replaceWithOwnChildren(ancestorWithClass);
+      }
+    },
+
+    applyToRange: function(range) {
+        var textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+        if (!textNodes.length) {
+          try {
+            var node = this.createContainer(range.endContainer.ownerDocument);
+            range.surroundContents(node);
+            this.selectNode(range, node);
+            return;
+          } catch(e) {}
+        }
+        
+        range.splitBoundaries();
+        textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+        
+        if (textNodes.length) {
+          var textNode;
+
+          for (var i = 0, len = textNodes.length; i < len; ++i) {
+            textNode = textNodes[i];
+            if (!this.getAncestorWithClass(textNode)) {
+              this.applyToTextNode(textNode);
+            }
+          }
+          
+          range.setStart(textNodes[0], 0);
+          textNode = textNodes[textNodes.length - 1];
+          range.setEnd(textNode, textNode.length);
+          
+          if (this.normalize) {
+            this.postApply(textNodes, range);
+          }
+        }
+    },
+
+    undoToRange: function(range) {
+      var textNodes = range.getNodes([wysihtml5.TEXT_NODE]), textNode, ancestorWithClass;
+      if (textNodes.length) {
+        range.splitBoundaries();
+        textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+      } else {
+        var doc = range.endContainer.ownerDocument,
+            node = doc.createTextNode(wysihtml5.INVISIBLE_SPACE);
+        range.insertNode(node);
+        range.selectNode(node);
+        textNodes = [node];
+      }
+      
+      for (var i = 0, len = textNodes.length; i < len; ++i) {
+        textNode = textNodes[i];
+        ancestorWithClass = this.getAncestorWithClass(textNode);
+        if (ancestorWithClass) {
+          this.undoToTextNode(textNode, range, ancestorWithClass);
+        }
+      }
+      
+      if (len == 1) {
+        this.selectNode(range, textNodes[0]);
+      } else {
+        range.setStart(textNodes[0], 0);
+        textNode = textNodes[textNodes.length - 1];
+        range.setEnd(textNode, textNode.length);
+
+        if (this.normalize) {
+          this.postApply(textNodes, range);
+        }
+      }
+    },
+    
+    selectNode: function(range, node) {
+      var isElement       = node.nodeType === wysihtml5.ELEMENT_NODE,
+          canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : true,
+          content         = isElement ? node.innerHTML : node.data,
+          isEmpty         = (content === "" || content === wysihtml5.INVISIBLE_SPACE);
+
+      if (isEmpty && isElement && canHaveHTML) {
+        // Make sure that caret is visible in node by inserting a zero width no breaking space
+        try { node.innerHTML = wysihtml5.INVISIBLE_SPACE; } catch(e) {}
+      }
+      range.selectNodeContents(node);
+      if (isEmpty && isElement) {
+        range.collapse(false);
+      } else if (isEmpty) {
+        range.setStartAfter(node);
+        range.setEndAfter(node);
+      }
+    },
+    
+    getTextSelectedByRange: function(textNode, range) {
+      var textRange = range.cloneRange();
+      textRange.selectNodeContents(textNode);
+
+      var intersectionRange = textRange.intersection(range);
+      var text = intersectionRange ? intersectionRange.toString() : "";
+      textRange.detach();
+
+      return text;
+    },
+
+    isAppliedToRange: function(range) {
+      var ancestors = [],
+          ancestor,
+          textNodes = range.getNodes([wysihtml5.TEXT_NODE]);
+      if (!textNodes.length) {
+        ancestor = this.getAncestorWithClass(range.startContainer);
+        return ancestor ? [ancestor] : false;
+      }
+      
+      for (var i = 0, len = textNodes.length, selectedText; i < len; ++i) {
+        selectedText = this.getTextSelectedByRange(textNodes[i], range);
+        ancestor = this.getAncestorWithClass(textNodes[i]);
+        if (selectedText != "" && !ancestor) {
+          return false;
+        } else {
+          ancestors.push(ancestor);
+        }
+      }
+      return ancestors;
+    },
+
+    toggleRange: function(range) {
+      if (this.isAppliedToRange(range)) {
+        this.undoToRange(range);
+      } else {
+        this.applyToRange(range);
+      }
+    }
+  };
+
+  wysihtml5.selection.HTMLApplier = HTMLApplier;
+  
+})(wysihtml5, rangy);
\ No newline at end of file
diff --git a/src/selection/selection.js b/src/selection/selection.js
new file mode 100644
index 00000000..98ff848e
--- /dev/null
+++ b/src/selection/selection.js
@@ -0,0 +1,450 @@
+(function(wysihtml5) {
+  var PLACEHOLDER_TEXT = "--_CARET_--",
+      dom              = wysihtml5.dom;
+  
+      // ----------------- private -------------- \\
+  function _createPlaceholderNode(doc) {
+    // Important: placeholder element needs to be an inline element
+    // otherwise chrome will cause trouble when interacting with the text
+    var element       = doc._wysihtml5CaretPlaceholder = (doc._wysihtml5CaretPlaceholder || doc.createElement("span"));
+    element.innerHTML = PLACEHOLDER_TEXT;
+    return element;
+  }
+
+  function _findPlaceholderNode(doc) {
+    var placeholderElement      = _createPlaceholderNode(doc),
+        // Using placeholderElement.innerHTML causes problems in firefox who sometimes mangles the innerHTML
+        placeholderElementText  = dom.getTextContent(placeholderElement),
+        placeholderElementById  = doc.getElementById(placeholderElement.id),
+        i                       = 0,
+        element,
+        elements,
+        elementsLength;
+    if (dom.contains(doc.body, placeholderElement)) {
+      return placeholderElement;
+    } else if (placeholderElementById) {
+      return placeholderElementById;
+    } else {
+      elements = doc.getElementsByTagName("*");
+      elementsLength = elements.length;
+      for (; i<elementsLength; i++) {
+        element = elements[i];
+        if (element.innerHTML === placeholderElementText) {
+          return element;
+        }
+      }
+      return null;
+    }
+  }
+  
+  function _getCumulativeOffsetTop(element) {
+    var top = 0;
+    if (element.parentNode) {
+      do {
+        top += element.offsetTop || 0;
+        element = element.offsetParent;
+      } while (element);
+    }
+    return top;
+  }
+  
+  wysihtml5.selection = {
+    PLACEHOLDER_TEXT: PLACEHOLDER_TEXT,
+
+    /**
+     * Get the current selection as a bookmark to be able to later restore it
+     *
+     * @param {Object} doc Document object of the context
+     * @return {Object} An object that represents the current selection
+     */
+    getBookmark: function(doc) {
+      var range = this.getRange(doc);
+      return range && range.cloneRange();
+    },
+
+    /**
+     * Restore a selection retrieved via wysihtml5.selection.getBookmark
+     *
+     * @param {Object} bookmark An object that represents the current selection
+     */
+    setBookmark: function(bookmark) {
+      if (!bookmark) {
+        return;
+      }
+
+      this.setSelection(bookmark);
+    },
+
+    /**
+     * Set the caret in front of the given node
+     *
+     * @param {Object} node The element or text node where to position the caret in front of
+     * @example
+     *    wysihtml5.selection.setBefore(myElement);
+     */
+    setBefore: function(node) {
+      var range = rangy.createRange(node.ownerDocument);
+      range.setStartBefore(node);
+      range.setEndBefore(node);
+      return this.setSelection(range);
+    },
+
+    /**
+     * Set the caret after the given node
+     *
+     * @param {Object} node The element or text node where to position the caret in front of
+     * @example
+     *    wysihtml5.selection.setBefore(myElement);
+     */
+    setAfter: function(node) {
+      var range = rangy.createRange(node.ownerDocument);
+      range.setStartAfter(node);
+      range.setEndAfter(node);
+      return this.setSelection(range);
+    },
+
+    /**
+     * Ability to select/mark nodes
+     *
+     * @param {Element} node The node/element to select
+     * @example
+     *    wysihtml5.selection.selectNode(document.getElementById("my-image"));
+     */
+    selectNode: function(node) {
+      var range           = rangy.createRange(node.ownerDocument),
+          isElement       = node.nodeType === wysihtml5.ELEMENT_NODE,
+          canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : (node.nodeName !== "IMG"),
+          content         = isElement ? node.innerHTML : node.data,
+          isEmpty         = (content === "" || content === wysihtml5.INVISIBLE_SPACE),
+          displayStyle    = dom.getStyle("display").from(node),
+          isBlockElement  = (displayStyle === "block" || displayStyle === "list-item");
+
+      if (isEmpty && isElement && canHaveHTML) {
+        // Make sure that caret is visible in node by inserting a zero width no breaking space
+        try { node.innerHTML = wysihtml5.INVISIBLE_SPACE; } catch(e) {}
+      }
+
+      if (canHaveHTML) {
+        range.selectNodeContents(node);
+      } else {
+        range.selectNode(node);
+      }
+
+      if (canHaveHTML && isEmpty && isElement) {
+        range.collapse(isBlockElement);
+      } else if (canHaveHTML && isEmpty) {
+        range.setStartAfter(node);
+        range.setEndAfter(node);
+      }
+
+      this.setSelection(range);
+    },
+
+    /**
+     * Get the node which contains the selection
+     *
+     * @param {Object} document Document object of the context where to select
+     * @param {Boolean} [controlRange] (only IE) Whether it should return the selected ControlRange element when the selection type is a "ControlRange"
+     * @return {Object} The node that contains the caret
+     * @example
+     *    var nodeThatContainsCaret = wysihtml5.selection.getSelectedNode(document);
+     */
+    getSelectedNode: function(doc, controlRange) {
+      var selection,
+          range;
+
+      if (controlRange && doc.selection && doc.selection.type === "Control") {
+        range = doc.selection.createRange();
+        if (range && range.length) {
+          return range.item(0);
+        }
+      }
+
+      selection = this.getSelection(doc);
+      if (selection.focusNode === selection.anchorNode) {
+        return selection.focusNode;
+      } else {
+        range = this.getRange(doc);
+        return range ? range.commonAncestorContainer : doc.body;
+      }
+    },
+
+    executeAndRestore: function(doc, method, restoreScrollPosition) {
+      if (!window.getSelection) {
+        return this.executeAndRestoreSimple(doc, method);
+      }
+
+      var body                = doc.body,
+          oldScrollTop        = body.scrollTop,
+          oldScrollLeft       = body.scrollLeft,
+          range               = this.getRange(doc),
+          caretPlaceholder    = _createPlaceholderNode(doc),
+          newCaretPlaceholder,
+          newRange;
+
+      // Nothing selected, execute and say goodbye
+      if (!range) {
+        method(body, body);
+        return;
+      }
+
+      range.insertNode(caretPlaceholder);
+
+      // Make sure that a potential error doesn't cause our placeholder element to be left as a placeholder
+      try {
+        method(range.startContainer, range.endContainer);
+      } catch(e1) {
+        setTimeout(function() { throw e1; }, 0);
+      }
+
+      // range.detach();
+
+      newCaretPlaceholder = _findPlaceholderNode(doc);
+
+      if (newCaretPlaceholder) {
+        newRange = rangy.createRange(doc);
+        newRange.selectNode(newCaretPlaceholder);
+        newRange.deleteContents();
+        this.setSelection(newRange);
+      }
+
+      if (restoreScrollPosition) {
+        body.scrollTop  = oldScrollTop;
+        body.scrollLeft = oldScrollLeft;
+      }
+
+      // Remove it again, just to make sure that the placeholder is definitely out of the dom tree
+      try {
+        newCaretPlaceholder.parentNode.removeChild(newCaretPlaceholder);
+      } catch(e2) {}
+    },
+
+    /**
+     * Different approach of preserving the selection (doesn't modify the dom)
+     * Takes all text nodes in the selection and saves the selection position in the first and last one
+     */
+    executeAndRestoreSimple: function(doc, method) {
+      var range = this.getRange(doc),
+          newRange,
+          firstNode,
+          lastNode,
+          textNodes,
+          rangeBackup;
+
+      // Nothing selected, execute and say goodbye
+      if (!range) {
+        method(doc.body, doc.body);
+        return;
+      }
+
+      textNodes = range.getNodes([3]);
+      firstNode = textNodes[0] || range.startContainer;
+      lastNode  = textNodes[textNodes.length - 1] || range.endContainer;
+
+      rangeBackup = {
+        collapsed:      range.collapsed,
+        startContainer: firstNode,
+        startOffset:    firstNode === range.startContainer ? range.startOffset : 0,
+        endContainer:   lastNode,
+        endOffset:      lastNode === range.endContainer ? range.endOffset : lastNode.length
+      };
+
+      try {
+        method(range.startContainer, range.endContainer);
+      } catch(e) {
+        setTimeout(function() { throw e; }, 0);
+      }
+
+      newRange = rangy.createRange(doc);
+      try { newRange.setStart(rangeBackup.startContainer, rangeBackup.startOffset); } catch(e1) {}
+      try { newRange.setEnd(rangeBackup.endContainer, rangeBackup.endOffset); } catch(e2) {}
+      try { this.setSelection(newRange); } catch(e3) {}
+    },
+
+    /**
+     * Insert html at the caret position and move the cursor after the inserted html
+     *
+     * @param {Object} doc Document object of the context where to insert the html
+     * @param {String} html HTML string to insert
+     * @example
+     *    wysihtml5.selection.insertHTML(document, "<p>foobar</p>");
+     */
+    insertHTML: function(doc, html) {
+      var range     = rangy.createRange(doc),
+          node      = range.createContextualFragment(html),
+          lastChild = node.lastChild;
+      this.insertNode(node);
+      if (lastChild) {
+        this.setAfter(lastChild);
+      }
+    },
+
+    /**
+     * Insert a node at the caret position and move the cursor after it
+     *
+     * @param {Object} node HTML string to insert
+     * @example
+     *    wysihtml5.selection.insertNode(document.createTextNode("foobar"));
+     */
+    insertNode: function(node) {
+      var range = this.getRange(node.ownerDocument);
+      if (range) {
+        range.insertNode(node);
+      } else {
+        return false;
+      }
+    },
+
+    /**
+     * Wraps current selection with the given node
+     *
+     * @param {Object} node The node to surround the selected elements with
+     */
+    surround: function(node) {
+      var range = this.getRange(node.ownerDocument);
+      if (!range) {
+        return;
+      }
+
+      try {
+        // This only works when the range boundaries are not overlapping other elements
+        range.surroundContents(node);
+        this.selectNode(node);
+      } catch(e) {
+        // fallback
+        node.appendChild(range.extractContents());
+        range.insertNode(node);
+      }
+    },
+
+    /**
+     * Scroll the current caret position into the view
+     * FIXME: This is a bit hacky, there might be a smarter way of doing this
+     *
+     * @param {Object} element A scrollable element in which the caret is currently positioned
+     * @example
+     *    wysihtml5.selection.scrollIntoView(element);
+     */
+    scrollIntoView: function(element) {
+      var doc           = element.ownerDocument,
+          hasScrollBars = doc.documentElement.scrollHeight > doc.documentElement.offsetHeight,
+          tempElement   = doc._wysihtml5ScrollIntoViewElement = doc._wysihtml5ScrollIntoViewElement || (function() {
+            var element = doc.createElement("span");
+            // The element needs content in order to be able to calculate it's position properly
+            element.innerHTML = wysihtml5.INVISIBLE_SPACE;
+            return element;
+          })(),
+          offsetTop;
+
+      if (hasScrollBars) {
+        this.insertNode(tempElement);
+        offsetTop = _getCumulativeOffsetTop(tempElement);
+        tempElement.parentNode.removeChild(tempElement);
+        if (offsetTop > element.scrollTop) {
+          element.scrollTop = offsetTop;
+        }
+      }
+    },
+
+    /**
+     * Select line where the caret is in
+     */
+    selectLine: function(doc) {
+      if (wysihtml5.browser.supportsSelectionModify()) {
+        this._selectLine_W3C(doc);
+      } else if (doc.selection) {
+        this._selectLine_MSIE(doc);
+      }
+    },
+
+    /**
+     * See https://developer.mozilla.org/en/DOM/Selection/modify
+     */
+    _selectLine_W3C: function(doc) {
+      var win = doc.defaultView,
+          selection = win.getSelection();
+      selection.modify("extend", "left", "lineboundary");
+      selection.modify("extend", "right", "lineboundary");
+    },
+
+    _selectLine_MSIE: function(doc) {
+      var range       = doc.selection.createRange(),
+          rangeTop    = range.boundingTop,
+          rangeHeight = range.boundingHeight,
+          scrollWidth = doc.body.scrollWidth,
+          rangeBottom,
+          rangeEnd,
+          measureNode,
+          i,
+          j;
+
+      if (!range.moveToPoint) {
+        return;
+      }
+
+      if (rangeTop === 0) {
+        // Don't know why, but when the selection ends at the end of a line
+        // range.boundingTop is 0
+        measureNode = doc.createElement("span");
+        this.insertNode(measureNode);
+        rangeTop = measureNode.offsetTop;
+        measureNode.parentNode.removeChild(measureNode);
+      }
+
+      rangeTop += 1;
+
+      for (i=-10; i<scrollWidth; i+=2) {
+        try {
+          range.moveToPoint(i, rangeTop);
+          break;
+        } catch(e1) {}
+      }
+
+      // Investigate the following in order to handle multi line selections
+      // rangeBottom = rangeTop + (rangeHeight ? (rangeHeight - 1) : 0);
+      rangeBottom = rangeTop;
+      rangeEnd = doc.selection.createRange();
+      for (j=scrollWidth; j>=0; j--) {
+        try {
+          rangeEnd.moveToPoint(j, rangeBottom);
+          break;
+        } catch(e2) {}
+      }
+
+      range.setEndPoint("EndToEnd", rangeEnd);
+      range.select();
+    },
+
+    getText: function(doc) {
+      var selection = this.getSelection(doc);
+      return selection ? selection.toString() : "";
+    },
+
+    getNodes: function(doc, nodeType, filter) {
+      var range = this.getRange(doc);
+      if (range) {
+        return range.getNodes([nodeType], filter);
+      } else {
+        return [];
+      }
+    },
+
+    getRange: function(doc) {
+      var selection = this.getSelection(doc);
+      return selection && selection.rangeCount && selection.getRangeAt(0);
+    },
+
+    getSelection: function(doc) {
+      return rangy.getSelection(doc.defaultView || doc.parentWindow);
+    },
+
+    setSelection: function(range) {
+      var doc       = (range.startContainer || range.endContainer).ownerDocument,
+          win       = doc.defaultView || doc.parentWindow,
+          selection = rangy.getSelection(win);
+      return selection.setSingleRange(range);
+    }
+  };
+  
+})(wysihtml5);
+
diff --git a/src/toolbar/dialog.js b/src/toolbar/dialog.js
index 64b88727..6322b560 100644
--- a/src/toolbar/dialog.js
+++ b/src/toolbar/dialog.js
@@ -21,146 +21,167 @@
  *
  *    <script>
  *      var dialog = new wysihtml5.toolbar.Dialog(
- *        $$("[data-wysihtml5-command='insertImage']").first(),
- *        $$("[data-wysihtml5-dialog='insertImage']").first()
+ *        document.querySelector("[data-wysihtml5-command='insertImage']"),
+ *        document.querySelector("[data-wysihtml5-dialog='insertImage']")
  *      );
  *      dialog.observe("save", function(attributes) {
  *        // do something
  *      });
  *    </script>
  */
-wysihtml5.toolbar.Dialog = Class.create(
-  /** @scope wysihtml5.toolbar.Dialog.prototype */ {
-  initialize: function(link, container) {
-    this.link       = link;
-    this.container  = container;
-  },
+(function(wysihtml5) {
+  var dom                     = wysihtml5.dom,
+      CLASS_NAME_OPENED       = "wysihtml5-command-dialog-opened",
+      SELECTOR_FORM_ELEMENTS  = "input, select, textarea",
+      SELECTOR_FIELDS         = "[data-wysihtml5-dialog-field]",
+      ATTRIBUTE_FIELDS        = "data-wysihtml5-dialog-field";
+      
   
-  _observe: function() {
-    if (this._observed) {
-      return;
-    }
-    
-    var callbackWrapper = function(event) {
-      var attributes = this._serialize();
-      if (attributes == this.elementToChange) {
-        this.fire("edit", attributes);
-      } else {
-        this.fire("save", attributes);
+  wysihtml5.toolbar.Dialog = wysihtml5.lang.Dispatcher.extend(
+    /** @scope wysihtml5.toolbar.Dialog.prototype */ {
+    constructor: function(link, container) {
+      this.link       = link;
+      this.container  = container;
+    },
+
+    _observe: function() {
+      if (this._observed) {
+        return;
       }
-      this.hide();
-      event.stop();
-    }.bind(this);
-    
-    this.link.on("click", function(event) {
-      if (this.link.hasClassName("wysihtml5-command-dialog-opened")) {
-        setTimeout(this.hide.bind(this), 0);
+      
+      var that = this,
+          callbackWrapper = function(event) {
+            var attributes = that._serialize();
+            if (attributes == that.elementToChange) {
+              that.fire("edit", attributes);
+            } else {
+              that.fire("save", attributes);
+            }
+            that.hide();
+            event.preventDefault();
+            event.stopPropagation();
+          };
+
+      dom.observe(that.link, "click", function(event) {
+        if (dom.hasClass(that.link, CLASS_NAME_OPENED)) {
+          setTimeout(function() { that.hide(); }, 0);
+        }
+      });
+
+      dom.observe(this.container, "keydown", function(event) {
+        var keyCode = event.keyCode;
+        if (keyCode === wysihtml5.ENTER_KEY) {
+          callbackWrapper(event);
+        }
+        if (keyCode === wysihtml5.ESCAPE_KEY) {
+          that.hide();
+        }
+      });
+
+      dom.delegate(this.container, "[data-wysihtml5-dialog-action=save]", "click", callbackWrapper);
+
+      dom.delegate(this.container, "[data-wysihtml5-dialog-action=cancel]", "click", function(event) {
+        that.fire("cancel");
+        that.hide();
+        event.preventDefault();
+        event.stopPropagation();
+      });
+
+      var formElements  = this.container.querySelectorAll(SELECTOR_FORM_ELEMENTS),
+          i             = 0,
+          length        = formElements.length,
+          _clearInterval = function() { clearInterval(that.interval); };
+      for (; i<length; i++) {
+        dom.observe(formElements[i], "change", _clearInterval);
       }
-    }.bind(this));
-    
-    this.container.on("keydown", function(event) {
-      if (event.keyCode === Event.KEY_RETURN) {
-        callbackWrapper(event);
+
+      this._observed = true;
+    },
+
+    /**
+     * Grabs all fields in the dialog and puts them in key=>value style in an object which
+     * then gets returned
+     */
+    _serialize: function() {
+      var data    = this.elementToChange || {},
+          fields  = this.container.querySelectorAll(SELECTOR_FIELDS),
+          length  = fields.length,
+          i       = 0;
+      for (; i<length; i++) {
+        data[fields[i].getAttribute(ATTRIBUTE_FIELDS)] = fields[i].value;
       }
-      if (event.keyCode === Event.KEY_ESC) {
-        this.hide();
+      return data;
+    },
+
+    /**
+     * Takes the attributes of the "elementToChange"
+     * and inserts them in their corresponding dialog input fields
+     * 
+     * Assume the "elementToChange" looks like this:
+     *    <a href="http://www.google.com" target="_blank">foo</a>
+     *
+     * and we have the following dialog:
+     *    <input type="text" data-wysihtml5-dialog-field="href" value="">
+     *    <input type="text" data-wysihtml5-dialog-field="target" value="">
+     * 
+     * after calling _interpolate() the dialog will look like this
+     *    <input type="text" data-wysihtml5-dialog-field="href" value="http://www.google.com">
+     *    <input type="text" data-wysihtml5-dialog-field="target" value="_blank">
+     *
+     * Basically it adopted the attribute values into the corresponding input fields
+     *
+     */
+    _interpolate: function() {
+      var field,
+          fieldName,
+          newValue,
+          focusedElement = document.querySelector(":focus"),
+          fields         = this.container.querySelectorAll(SELECTOR_FIELDS),
+          length         = fields.length,
+          i              = 0;
+      for (; i<length; i++) {
+        field = fields[i];
+        // Never change elements where the user is currently typing in
+        if (field === focusedElement) {
+          continue;
+        }
+        fieldName = field.getAttribute(ATTRIBUTE_FIELDS);
+        newValue  = this.elementToChange ? (this.elementToChange[fieldName] || "") : field.defaultValue;
+        field.value = newValue;
       }
-    }.bind(this));
-    
-    this.container.on("click", "[data-wysihtml5-dialog-action=save]", callbackWrapper);
-    this.container.on("click", "[data-wysihtml5-dialog-action=cancel]", function(event) {
-      this.fire("cancel");
-      this.hide();
-      event.stop();
-    }.bind(this));
-    
-    this.container.select("input, select, textarea").invoke("on", "change", function() {
-      clearInterval(this.interval);
-    }.bind(this));
-    
-    this._observed = true;
-  },
-  
-  /**
-   * Grabs all fields in the dialog and puts them in key=>value style in an object which
-   * then gets returned
-   */
-  _serialize: function() {
-    var data = this.elementToChange || {};
-    this.container.select("[data-wysihtml5-dialog-field]").each(function(field) {
-      data[field.getAttribute("data-wysihtml5-dialog-field")] = field.getValue();
-    });
-    return data;
-  },
-  
-  /**
-   * Takes the attributes of the "elementToChange"
-   * and inserts them in their corresponding dialog input fields
-   * 
-   * Assume the "elementToChange" looks like this:
-   *    <a href="http://www.google.com" target="_blank">foo</a>
-   *
-   * and we have the following dialog:
-   *    <input type="text" data-wysihtml5-dialog-field="href" value="">
-   *    <input type="text" data-wysihtml5-dialog-field="target" value="">
-   * 
-   * after calling _interpolate() the dialog will look like this
-   *    <input type="text" data-wysihtml5-dialog-field="href" value="http://www.google.com">
-   *    <input type="text" data-wysihtml5-dialog-field="target" value="_blank">
-   *
-   * Basically it adopted the attribute values into the corresponding input fields
-   *
-   */
-  _interpolate: function() {
-    var focusedElement = document.querySelector(":focus");
-    this.container.select("[data-wysihtml5-dialog-field]").each(function(field) {
-      // Never change elements where the user is currently typing
-      if (field === focusedElement) {
-        return;
+    },
+
+    /**
+     * Show the dialog element
+     */
+    show: function(elementToChange) {
+      var that        = this,
+          firstField  = this.container.querySelector(SELECTOR_FORM_ELEMENTS);
+      this.elementToChange = elementToChange;
+      this._observe();
+      this._interpolate();
+      if (elementToChange) {
+        this.interval = setInterval(function() { that._interpolate(); }, 500);
       }
-      var fieldName = field.getAttribute("data-wysihtml5-dialog-field"),
-          newValue  = this.elementToChange ? (this.elementToChange[fieldName] || "") : field.defaultValue;
-      field.setValue(newValue);
-    }.bind(this));
-  },
-  
-  observe: function(eventName, handler) {
-    this.container.on("dialog:" + eventName, function(event) { handler(event.memo); });
-  },
-  
-  fire: function(eventName, data) {
-    this.container.fire("dialog:" + eventName, data);
-  },
-  
-  /**
-   * Show the dialog element
-   */
-  show: function(elementToChange) {
-    this.elementToChange = elementToChange;
-    this._observe();
-    this._interpolate();
-    if (elementToChange) {
-      this.interval = setInterval(this._interpolate.bind(this), 500);
-    }
-    this.link.addClassName("wysihtml5-command-dialog-opened");
-    this.container.show();
-    this.fire("show");
-    var firstField = this.container.down("input, select, textarea");
-    if (firstField && !elementToChange) {
-      try {
-        firstField.focus();
-      } catch(e) {}
+      dom.addClass(this.link, CLASS_NAME_OPENED);
+      this.container.style.display = "";
+      this.fire("show");
+      if (firstField && !elementToChange) {
+        try {
+          firstField.focus();
+        } catch(e) {}
+      }
+    },
+
+    /**
+     * Hide the dialog element
+     */
+    hide: function() {
+      clearInterval(this.interval);
+      this.elementToChange = null;
+      dom.removeClass(this.link, CLASS_NAME_OPENED);
+      this.container.style.display = "none";
+      this.fire("hide");
     }
-  },
-  
-  /**
-   * Hide the dialog element
-   */
-  hide: function() {
-    clearInterval(this.interval);
-    this.elementToChange = null;
-    this.link.removeClassName("wysihtml5-command-dialog-opened");
-    this.container.hide();
-    this.fire("hide");
-  }
-});
\ No newline at end of file
+  });
+})(wysihtml5);
diff --git a/src/toolbar/speech.js b/src/toolbar/speech.js
index 748d18ae..adf37772 100644
--- a/src/toolbar/speech.js
+++ b/src/toolbar/speech.js
@@ -13,12 +13,25 @@
  *
  * @author Christopher Blum <christopher.blum@xing.com>
  */
-wysihtml5.toolbar.Speech = (function() {
-  var linkStyle = {
+(function(wysihtml5) {
+  var dom = wysihtml5.dom;
+  
+  var linkStyles = {
     position: "relative"
   };
   
-  var inputStyle = {
+  var wrapperStyles = {
+    left:     0,
+    margin:   0,
+    opacity:  0,
+    overflow: "hidden",
+    padding:  0,
+    position: "absolute",
+    top:      0,
+    zIndex:   1
+  };
+  
+  var inputStyles = {
     cursor:     "inherit",
     fontSize:   "50px",
     height:     "50px",
@@ -30,52 +43,46 @@ wysihtml5.toolbar.Speech = (function() {
     top:        "50%"
   };
   
-  var wrapperStyle = {
-    left:     0,
-    margin:   0,
-    opacity:  0,
-    overflow: "hidden",
-    padding:  0,
-    position: "absolute",
-    top:      0,
-    zIndex:   1
-  };
-  
-  var supportsSpeechInput = function(input) {
-    var chromeVersion = navigator.userAgent.match(/Chrome\/(\d+)/) || [, 0];
-    return chromeVersion[1] >= 11 && ("onwebkitspeechchange" in input || "speech" in input);
+  var inputAttributes = {
+    "x-webkit-speech": "",
+    "speech":          ""
   };
   
-  return function(parent, link) {
-    var input = new Element("input");
-    if (!supportsSpeechInput(input)) {
-      link.hide();
+  wysihtml5.toolbar.Speech = function(parent, link) {
+    var input = document.createElement("input");
+    if (!wysihtml5.browser.supportsSpeechApiOn(input)) {
+      link.style.display = "none";
       return;
     }
     
-    var wrapper = new Element("div");
+    var wrapper = document.createElement("div");
     
-    Object.extend(wrapperStyle, {
-      width:  link.getWidth()  + "px",
-      height: link.getHeight() + "px"
+    wysihtml5.lang.object(wrapperStyles).merge({
+      width:  link.offsetWidth  + "px",
+      height: link.offsetHeight + "px"
     });
     
-    input.setStyle(inputStyle).writeAttribute({ "x-webkit-speech": "", "speech": "" });
-    wrapper.setStyle(wrapperStyle).insert(input);
-    link.setStyle(linkStyle).insert(wrapper);
+    dom.insert(input).into(wrapper);
+    dom.insert(wrapper).into(link);
+    
+    dom.setStyles(inputStyles).on(input);
+    dom.setAttributes(inputAttributes).on(input)
+    
+    dom.setStyles(wrapperStyles).on(wrapper);
+    dom.setStyles(linkStyles).on(link);
     
     var eventName = "onwebkitspeechchange" in input ? "webkitspeechchange" : "speechchange";
-    input.on(eventName, function() {
+    dom.observe(input, eventName, function() {
       parent.execCommand("insertText", input.value);
       input.value = "";
     });
     
-    wrapper.on("click", function(event) {
-      if (link.hasClassName("wysihtml5-command-disabled")) {
+    dom.observe(input, "click", function(event) {
+      if (dom.hasClass(link, "wysihtml5-command-disabled")) {
         event.preventDefault();
       }
       
       event.stopPropagation();
     });
   };
-})();
\ No newline at end of file
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/toolbar/toolbar.js b/src/toolbar/toolbar.js
index 5e62e9a5..b47d8937 100644
--- a/src/toolbar/toolbar.js
+++ b/src/toolbar/toolbar.js
@@ -12,226 +12,251 @@
  *    </div>
  *
  *    <script>
- *      var toolbar = new wysihtml5.toolbar.Toolbar(editor, $("toolbar"));
+ *      var toolbar = new wysihtml5.toolbar.Toolbar(editor, document.getElementById("toolbar"));
  *    </script>
  */
-wysihtml5.toolbar.Toolbar = Class.create(
-  /** @scope wysihtml5.toolbar.Toolbar.prototype */ {
-  initialize: function(parent, container) {
-    this.parent     = parent;
-    this.container  = $(container);
-    this.composer   = parent.composer;
-    
-    this._getLinks("command");
-    this._getLinks("action");
-    
-    this._observe();
-    this.show();
-    
-    this.container.select("[data-wysihtml5-command=insertSpeech]").each(function(link) {
-      new wysihtml5.toolbar.Speech(this, link);
-    }.bind(this));
-  },
+(function(wysihtml5) {
+  var CLASS_NAME_COMMAND_DISABLED   = "wysihtml5-command-disabled",
+      CLASS_NAME_COMMANDS_DISABLED  = "wysihtml5-commands-disabled",
+      CLASS_NAME_COMMAND_ACTIVE     = "wysihtml5-command-active",
+      dom                           = wysihtml5.dom;
   
-  _getLinks: function(type) {
-    var links   = this[type + "Links"] = this.container.select("a[data-wysihtml5-" + type + "]"),
-        mapping = this[type + "Mapping"] = {};
-    links.each(function(link) {
-      var name    = link.getAttribute("data-wysihtml5-" + type),
-          value   = link.getAttribute("data-wysihtml5-" + type + "-value"),
-          dialog  = this._getDialog(link, name);
+  wysihtml5.toolbar.Toolbar = Base.extend(
+    /** @scope wysihtml5.toolbar.Toolbar.prototype */ {
+    constructor: function(editor, container) {
+      this.editor     = editor;
+      this.container  = typeof(container) === "string" ? document.getElementById(container) : container;
+      this.composer   = editor.composer;
+
+      this._getLinks("command");
+      this._getLinks("action");
+
+      this._observe();
+      this.show();
       
-      mapping[name + ":" + value] = {
-        link:   link,
-        name:   name,
-        value:  value,
-        dialog: dialog,
-        state:  false
-      };
-    }, this);
-  },
-  
-  _getDialog: function(link, command) {
-    var dialogElement = this.container.down("[data-wysihtml5-dialog='" + command + "']"),
-        sandboxDoc    = this.composer.sandbox.getDocument(),
-        dialog,
-        caretBookmark;
-    if (dialogElement) {
-      dialog = new wysihtml5.toolbar.Dialog(link, dialogElement);
-      
-      dialog.observe("show", function() {
-        caretBookmark = wysihtml5.utils.caret.getBookmark(sandboxDoc);
-      });
-      
-      dialog.observe("save", function(attributes) {
-        this.parent.focus(false);
+      var speechInputLinks  = this.container.querySelectorAll("[data-wysihtml5-command=insertSpeech]"),
+          length            = speechInputLinks.length,
+          i                 = 0;
+      for (; i<length; i++) {
+        new wysihtml5.toolbar.Speech(this, speechInputLinks[i]);
+      }
+    },
+
+    _getLinks: function(type) {
+      var links   = this[type + "Links"] = wysihtml5.lang.array(this.container.querySelectorAll("a[data-wysihtml5-" + type + "]")).get(),
+          length  = links.length,
+          i       = 0,
+          mapping = this[type + "Mapping"] = {},
+          link,
+          name,
+          value,
+          dialog;
+      for (; i<length; i++) {
+        link    = links[i];
+        name    = link.getAttribute("data-wysihtml5-" + type);
+        value   = link.getAttribute("data-wysihtml5-" + type + "-value");
+        dialog  = this._getDialog(link, name);
         
-        if (caretBookmark) {
-          wysihtml5.utils.caret.setBookmark(caretBookmark);
-        }
-        this._execCommand(command, attributes);
-      }.bind(this));
-      
-      dialog.observe("cancel", function() {
-        this.parent.focus(false);
-      }.bind(this));
-    }
-    return dialog;
-  },
-  
-  /**
-   * @example
-   *    var toolbar = new wysihtml5.Toolbar();
-   *    // Insert a <blockquote> element or wrap current selection in <blockquote>
-   *    toolbar.execCommand("formatBlock", "blockquote");
-   */
-  execCommand: function(command, commandValue) {
-    if (this.commandsDisabled) {
-      return;
-    }
-    
-    var commandObj = this.commandMapping[command + ":" + commandValue];
-    
-    // Show dialog when available
-    if (commandObj && commandObj.dialog && !commandObj.state) {
-      commandObj.dialog.show();
-    } else {
-      this._execCommand(command, commandValue);
-    }
-  },
-  
-  _execCommand: function(command, commandValue) {
-    // Make sure that composer is focussed (false => don't move caret to the end)
-    this.parent.focus(false);
-    
-    wysihtml5.commands.exec(this.composer.element, command, commandValue);
-    this._updateLinkStates();
-  },
-  
-  execAction: function(action) {
-    switch(action) {
-      case "change_view":
-        if (this.parent.currentView === this.parent.textarea) {
-          this.parent.fire("change_view", "composer");
-        } else {
-          this.parent.fire("change_view", "textarea");
-        }
-        break;
-    }
-  },
-  
-  _observe: function() {
-    // 'javascript:;' and unselectable=on Needed for IE, but done in all browsers to make sure that all get the same css applied
-    // (you know, a:link { ... } doesn't match anchors with missing href attribute)
-    var links = [this.commandLinks, this.actionLinks].flatten();
-    links.invoke("setAttribute", "href", "javascript:;");
-    links.invoke("setAttribute", "unselectable", "on");
-    
-    // Needed for opera
-    this.container.on("mousedown", "[data-wysihtml5-command]", function(event) { event.preventDefault(); });
-    
-    this.container.on("click", "[data-wysihtml5-command]", function(event) {
-      var link          = event.target,
-          command       = link.getAttribute("data-wysihtml5-command"),
-          commandValue  = link.getAttribute("data-wysihtml5-command-value");
-      this.execCommand(command, commandValue);
-      event.preventDefault();
-    }.bind(this));
-    
-    this.container.on("click", "[data-wysihtml5-action]", function(event) {
-      var action = event.target.getAttribute("data-wysihtml5-action");
-      this.execAction(action);
-      event.preventDefault();
-    }.bind(this));
-    
-    this.parent.observe("focus:composer", function() {
-      this.bookmark = null;
-      clearInterval(this.interval);
-      this.interval = setInterval(this._updateLinkStates.bind(this), 500);
-    }.bind(this));
-    
-    this.parent.observe("blur:composer", function() {
-      clearInterval(this.interval);
-    }.bind(this));
-    
-    this.parent.observe("destroy:composer", function() {
-      clearInterval(this.interval);
-    }.bind(this));
-    
-    this.parent.observe("change_view", function(event) {
-      var currentView       = event.memo,
-          disabledClassName = "wysihtml5-commands-disabled";
-      // Set timeout needed in order to let the blur event fire first
-      setTimeout(function() {
-        this.commandsDisabled = (currentView !== "composer");
-        this._updateLinkStates();
-        if (this.commandsDisabled) {
-          this.container.addClassName(disabledClassName);
-        } else {
-          this.container.removeClassName(disabledClassName);
-        }
-      }.bind(this), 0);
-    }.bind(this));
-  },
-  
-  _updateLinkStates: function() {
-    var activeClassName   = "wysihtml5-command-active",
-        disabledClassName = "wysihtml5-command-disabled",
-        element           = this.composer.element,
-        commandMapping    = this.commandMapping,
-        i,
-        state,
-        command;
-    // every millisecond counts... this is executed quite often
-    // no library .each(), just a native speedy-gonzales "for"-loop
-    for (i in commandMapping) {
-      command = commandMapping[i];
+        mapping[name + ":" + value] = {
+          link:   link,
+          name:   name,
+          value:  value,
+          dialog: dialog,
+          state:  false
+        };
+      }
+    },
+
+    _getDialog: function(link, command) {
+      var that          = this,
+          dialogElement = this.container.querySelector("[data-wysihtml5-dialog='" + command + "']"),
+          sandboxDoc    = this.composer.sandbox.getDocument(),
+          dialog,
+          caretBookmark;
+      if (dialogElement) {
+        dialog = new wysihtml5.toolbar.Dialog(link, dialogElement);
+
+        dialog.observe("show", function() {
+          caretBookmark = wysihtml5.selection.getBookmark(sandboxDoc);
+        });
+
+        dialog.observe("save", function(attributes) {
+          that.editor.focus(false);
+
+          if (caretBookmark) {
+            wysihtml5.selection.setBookmark(caretBookmark);
+          }
+          that._execCommand(command, attributes);
+        });
+
+        dialog.observe("cancel", function() {
+          that.editor.focus(false);
+        });
+      }
+      return dialog;
+    },
+
+    /**
+     * @example
+     *    var toolbar = new wysihtml5.Toolbar();
+     *    // Insert a <blockquote> element or wrap current selection in <blockquote>
+     *    toolbar.execCommand("formatBlock", "blockquote");
+     */
+    execCommand: function(command, commandValue) {
       if (this.commandsDisabled) {
-        state = false;
-        command.link.addClassName(disabledClassName);
-        if (command.dialog) {
-          command.dialog.hide();
-        }
+        return;
+      }
+
+      var commandObj = this.commandMapping[command + ":" + commandValue];
+
+      // Show dialog when available
+      if (commandObj && commandObj.dialog && !commandObj.state) {
+        commandObj.dialog.show();
       } else {
-        state = wysihtml5.commands.state(element, command.name, command.value);
-        if (Object.isArray(state)) {
-          // Grab first and only object/element in state array, otherwise convert state into boolean
-          // to avoid showing a dialog for multiple selected elements which may have different attributes
-          // eg. when two links with different href are selected, the state will be an array consisting of both link elements
-          // but the dialog interface can only update one
-          state = state.length === 1 ? state[0] : true;
-        }
-        command.link.removeClassName(disabledClassName);
+        this._execCommand(command, commandValue);
+      }
+    },
+
+    _execCommand: function(command, commandValue) {
+      // Make sure that composer is focussed (false => don't move caret to the end)
+      this.editor.focus(false);
+
+      wysihtml5.commands.exec(this.composer.element, command, commandValue);
+      this._updateLinkStates();
+    },
+
+    execAction: function(action) {
+      var editor = this.editor;
+      switch(action) {
+        case "change_view":
+          if (editor.currentView === editor.textarea) {
+            editor.fire("change_view", "composer");
+          } else {
+            editor.fire("change_view", "textarea");
+          }
+          break;
       }
+    },
+
+    _observe: function() {
+      var that      = this,
+          editor    = this.editor,
+          container = this.container,
+          links     = this.commandLinks.concat(this.actionLinks),
+          length    = links.length,
+          i         = 0;
       
-      if (command.state === state) {
-        continue;
+      for (; i<length; i++) {
+        // 'javascript:;' and unselectable=on Needed for IE, but done in all browsers to make sure that all get the same css applied
+        // (you know, a:link { ... } doesn't match anchors with missing href attribute)
+        dom.setAttributes({
+          href:         "javascript:;",
+          unselectable: "on"
+        }).on(links[i]);
       }
+
+      // Needed for opera
+      dom.delegate(container, "[data-wysihtml5-command]", "mousedown", function(event) { event.preventDefault(); });
       
-      command.state = state;
-      if (state) {
-        command.link.addClassName(activeClassName);
-        if (command.dialog) {
-          if (typeof(state) === "object") {
-            command.dialog.show(state);
+      dom.delegate(container, "[data-wysihtml5-command]", "click", function(event) {
+        var link          = event.target,
+            command       = link.getAttribute("data-wysihtml5-command"),
+            commandValue  = link.getAttribute("data-wysihtml5-command-value");
+        that.execCommand(command, commandValue);
+        event.preventDefault();
+      });
+
+      dom.delegate(container, "[data-wysihtml5-action]", "click", function(event) {
+        var action = event.target.getAttribute("data-wysihtml5-action");
+        that.execAction(action);
+        event.preventDefault();
+      });
+
+      editor.observe("focus:composer", function() {
+        that.bookmark = null;
+        clearInterval(that.interval);
+        that.interval = setInterval(function() { that._updateLinkStates(); }, 500);
+      });
+
+      editor.observe("blur:composer", function() {
+        clearInterval(that.interval);
+      });
+
+      editor.observe("destroy:composer", function() {
+        clearInterval(that.interval);
+      });
+
+      editor.observe("change_view", function(currentView) {
+        // Set timeout needed in order to let the blur event fire first
+        setTimeout(function() {
+          that.commandsDisabled = (currentView !== "composer");
+          that._updateLinkStates();
+          if (that.commandsDisabled) {
+            dom.addClass(container, CLASS_NAME_COMMANDS_DISABLED);
           } else {
+            dom.removeClass(container, CLASS_NAME_COMMANDS_DISABLED);
+          }
+        }, 0);
+      });
+    },
+
+    _updateLinkStates: function() {
+      var element           = this.composer.element,
+          commandMapping    = this.commandMapping,
+          i,
+          state,
+          command;
+      // every millisecond counts... this is executed quite often
+      for (i in commandMapping) {
+        command = commandMapping[i];
+        if (this.commandsDisabled) {
+          state = false;
+          dom.removeClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
+          if (command.dialog) {
             command.dialog.hide();
           }
+        } else {
+          state = wysihtml5.commands.state(element, command.name, command.value);
+          if (wysihtml5.lang.object(state).isArray()) {
+            // Grab first and only object/element in state array, otherwise convert state into boolean
+            // to avoid showing a dialog for multiple selected elements which may have different attributes
+            // eg. when two links with different href are selected, the state will be an array consisting of both link elements
+            // but the dialog interface can only update one
+            state = state.length === 1 ? state[0] : true;
+          }
+          dom.removeClass(command.link, CLASS_NAME_COMMAND_DISABLED);
         }
-      } else {
-        command.link.removeClassName(activeClassName);
-        if (command.dialog) {
-          command.dialog.hide();
+
+        if (command.state === state) {
+          continue;
+        }
+
+        command.state = state;
+        if (state) {
+          dom.addClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
+          if (command.dialog) {
+            if (typeof(state) === "object") {
+              command.dialog.show(state);
+            } else {
+              command.dialog.hide();
+            }
+          }
+        } else {
+          dom.removeClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
+          if (command.dialog) {
+            command.dialog.hide();
+          }
         }
       }
+    },
+
+    show: function() {
+      this.container.style.display = "";
+    },
+
+    hide: function() {
+      this.container.style.display = "none";
     }
-  },
-  
-  show: function() {
-    this.container.show();
-  },
+  });
   
-  hide: function() {
-    this.container.hide();
-  }
-});
\ No newline at end of file
+})(wysihtml5);
diff --git a/src/utils/auto_focus.js b/src/utils/auto_focus.js
deleted file mode 100644
index 1f588853..00000000
--- a/src/utils/auto_focus.js
+++ /dev/null
@@ -1,16 +0,0 @@
-/**
- * Simulate HTML5 autofocus
- * Needed since div[contentEditable] elements don't support it
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- * @param {Element} element The element which should be focussed
- * @example
- *    wysihtml5.utils.autoFocus(element);
- */
-wysihtml5.utils.autoFocus = function(element) {
-  if (document.loaded) {
-    setTimeout(function() { element.focus(); }, 0);
-  } else {
-    document.observe("dom:loaded", function() { element.focus(); });
-  }
-};
diff --git a/src/utils/caret.js b/src/utils/caret.js
deleted file mode 100644
index f077e2f1..00000000
--- a/src/utils/caret.js
+++ /dev/null
@@ -1,451 +0,0 @@
-wysihtml5.utils.caret = {
-  PLACEHOLDER_TEXT: "--|CARET|--",
-  
-  /**
-   * Get the current selection as a bookmark to be able to later restore it
-   *
-   * @param {Object} doc Document object of the context
-   * @return {Object} An object that represents the current selection
-   */
-  getBookmark: function(doc) {
-    var range = this.getRange(doc);
-    return range && range.cloneRange();
-  },
-  
-  /**
-   * Restore a selection retrieved via wysihtml5.utils.caret.getBookmark
-   *
-   * @param {Object} bookmark An object that represents the current selection
-   */
-  setBookmark: function(bookmark) {
-    if (!bookmark) {
-      return;
-    }
-    
-    this.setSelection(bookmark);
-  },
-  
-  /**
-   * Check whether the current selection contains a given node
-   * @param {Object} node The node to check for
-   * @return {Boolean}
-   * @example
-   */
-  containsNode: function(node) {
-    var range = this.getRange(node.ownerDocument);
-    if (range) {
-      return range.containsNode(node);
-    } else {
-      return false;
-    }
-  },
-  
-  /**
-   * Set the caret in front of the given node
-   *
-   * @param {Object} node The element or text node where to position the caret in front of
-   * @example
-   *    wysihtml5.utils.caret.setBefore(myElement);
-   */
-  setBefore: function(node) {
-    var range = rangy.createRange(node.ownerDocument);
-    range.setStartBefore(node);
-    range.setEndBefore(node);
-    return this.setSelection(range);
-  },
-  
-  /**
-   * Set the caret after the given node
-   *
-   * @param {Object} node The element or text node where to position the caret in front of
-   * @example
-   *    wysihtml5.utils.caret.setBefore(myElement);
-   */
-  setAfter: function(node) {
-    var range = rangy.createRange(node.ownerDocument);
-    range.setStartAfter(node);
-    range.setEndAfter(node);
-    return this.setSelection(range);
-  },
-  
-  /**
-   * Ability to select/mark nodes
-   *
-   * @param {Element} node The node/element to select
-   * @example
-   *    wysihtml5.utils.caret.selectNode(document.getElementById("my-image"));
-   */
-  selectNode: function(node) {
-    var range           = rangy.createRange(node.ownerDocument),
-        isElement       = node.nodeType === Node.ELEMENT_NODE,
-        canHaveHTML     = "canHaveHTML" in node ? node.canHaveHTML : (node.nodeName !== "IMG"),
-        content         = isElement ? node.innerHTML : node.data,
-        isEmpty         = (content === "" || content === "\uFEFF"),
-        displayStyle    = wysihtml5.utils.getStyle(node, "display"),
-        isBlockElement  = (displayStyle === "block" || displayStyle === "list-item");
-    
-    if (isEmpty && isElement && canHaveHTML) {
-      // Make sure that caret is visible in node by inserted a zero width no breaking space
-      try { node.innerHTML = "\uFEFF"; } catch(e) {}
-    }
-    
-    if (canHaveHTML) {
-      range.selectNodeContents(node);
-    } else {
-      range.selectNode(node);
-    }
-    
-    if (canHaveHTML && isEmpty && isElement) {
-      range.collapse(isBlockElement);
-    } else if (canHaveHTML && isEmpty) {
-      range.setStartAfter(node);
-      range.setEndAfter(node);
-    }
-    
-    this.setSelection(range);
-  },
-  
-  /**
-   * Get the node which contains the selection
-   *
-   * @param {Object} document Document object of the context where to select
-   * @param {Boolean} [controlRange] (only IE) Whether it should return the selected ControlRange element when the selection type is a "ControlRange"
-   * @return {Object} The node that contains the caret
-   * @example
-   *    var nodeThatContainsCaret = wysihtml5.utils.caret.getSelectedNode(document);
-   */
-  getSelectedNode: function(doc, controlRange) {
-    var selection,
-        range;
-    
-    if (controlRange && doc.selection && doc.selection.type === "Control") {
-      range = doc.selection.createRange();
-      if (range && range.length) {
-        return range.item(0);
-      }
-    }
-    
-    selection = this.getSelection(doc);
-    if (selection.focusNode === selection.anchorNode) {
-      return selection.focusNode;
-    } else {
-      range = this.getRange(doc);
-      return range ? range.commonAncestorContainer : doc.body;
-    }
-  },
-  
-  executeAndRestore: function(doc, method, restoreScrollPosition) {
-    if (!window.getSelection) {
-      return this.executeAndRestoreSimple(doc, method);
-    }
-    
-    var body                = doc.body,
-        oldScrollTop        = body.scrollTop,
-        oldScrollLeft       = body.scrollLeft,
-        range               = this.getRange(doc),
-        caretPlaceholder    = this._getPlaceholderElement(doc),
-        newCaretPlaceholder,
-        newRange;
-    
-    // Nothing selected, execute and say goodbye
-    if (!range) {
-      method(body, body);
-      return;
-    }
-    
-    range.insertNode(caretPlaceholder);
-    
-    // Make sure that a potential error doesn't cause our placeholder element to be left as a placeholder
-    try {
-      method(range.startContainer, range.endContainer);
-    } catch(e1) {
-      setTimeout(function() { throw e1; }, 0);
-    }
-    
-    // range.detach();
-    
-    newCaretPlaceholder = this._findPlaceholderElement(doc);
-    
-    if (newCaretPlaceholder) {
-      newRange = rangy.createRange(doc);
-      newRange.selectNode(newCaretPlaceholder);
-      newRange.deleteContents();
-      this.setSelection(newRange);
-    }
-    
-    if (restoreScrollPosition) {
-      body.scrollTop  = oldScrollTop;
-      body.scrollLeft = oldScrollLeft;
-    }
-    
-    // Remove it again, just to make sure that the placeholder is definitely out of the dom tree
-    try {
-      newCaretPlaceholder.parentNode.removeChild(newCaretPlaceholder);
-    } catch(e2) {}
-  },
-  
-  /**
-   * Different approach of preserving the selection (doesn't modify the dom)
-   * Takes all text nodes in the selection and saves the selection position in the first and last one
-   */
-  executeAndRestoreSimple: function(doc, method) {
-    var range = this.getRange(doc),
-        newRange,
-        firstNode,
-        lastNode,
-        textNodes,
-        rangeBackup;
-    
-    // Nothing selected, execute and say goodbye
-    if (!range) {
-      method(doc.body, doc.body);
-      return;
-    }
-    
-    textNodes = range.getNodes([3]);
-    firstNode = textNodes[0] || range.startContainer;
-    lastNode  = textNodes[textNodes.length - 1] || range.endContainer;
-    
-    rangeBackup = {
-      collapsed:      range.collapsed,
-      startContainer: firstNode,
-      startOffset:    firstNode === range.startContainer ? range.startOffset : 0,
-      endContainer:   lastNode,
-      endOffset:      lastNode === range.endContainer ? range.endOffset : lastNode.length
-    };
-    
-    try {
-      method(range.startContainer, range.endContainer);
-    } catch(e) {
-      setTimeout(function() { throw e; }, 0);
-    }
-    
-    newRange = rangy.createRange(doc);
-    try { newRange.setStart(rangeBackup.startContainer, rangeBackup.startOffset); } catch(e1) {}
-    try { newRange.setEnd(rangeBackup.endContainer, rangeBackup.endOffset); } catch(e2) {}
-    try { this.setSelection(newRange); } catch(e3) {}
-  },
-  
-  /**
-   * Insert html at the caret position and move the cursor after the inserted html
-   *
-   * @param {Object} doc Document object of the context where to insert the html
-   * @param {String} html HTML string to insert
-   * @example
-   *    wysihtml5.utils.caret.insertHTML(document, "<p>foobar</p>");
-   */
-  insertHTML: function(doc, html) {
-    var range     = rangy.createRange(doc),
-        node      = range.createContextualFragment(html),
-        lastChild = node.lastChild;
-    this.insertNode(node);
-    if (lastChild) {
-      this.setAfter(lastChild);
-    }
-  },
-  
-  /**
-   * Insert a node at the caret position and move the cursor after it
-   *
-   * @param {Object} node HTML string to insert
-   * @example
-   *    wysihtml5.utils.caret.insertNode(document.createTextNode("foobar"));
-   */
-  insertNode: function(node) {
-    var range = this.getRange(node.ownerDocument);
-    if (range) {
-      range.insertNode(node);
-    } else {
-      return false;
-    }
-  },
-  
-  /**
-   * Wraps current selection with the given node
-   *
-   * @param {Object} node The node to surround the selected elements with
-   */
-  surround: function(node) {
-    var range = this.getRange(node.ownerDocument);
-    if (!range) {
-      return;
-    }
-    
-    try {
-      // This only works when the range boundaries are not overlapping other elements
-      range.surroundContents(node);
-      this.selectNode(node);
-    } catch(e) {
-      // fallback
-      node.appendChild(range.extractContents());
-      range.insertNode(node);
-    }
-  },
-  
-  /**
-   * Scroll the current caret position into the view
-   * FIXME: This is a bit hacky, there might be a smarter way of doing this
-   *
-   * @param {Object} element A scrollable element in which the caret is currently positioned
-   * @example
-   *    wysihtml5.utils.caret.scrollIntoView(element);
-   */
-  scrollIntoView: function(element) {
-    var doc           = element.ownerDocument,
-        hasScrollBars = doc.documentElement.scrollHeight > doc.documentElement.offsetHeight,
-        tempElement   = doc._wysihtml5ScrollIntoViewElement = doc._wysihtml5ScrollIntoViewElement || (function() {
-          var element = doc.createElement("span");
-          // The element needs content in order to be able to calculate it's position properly
-          element.innerHTML = "\uFEFF";
-          return element;
-        })(),
-        offsetTop;
-    
-    if (hasScrollBars) {
-      this.insertNode(tempElement);
-      offsetTop = Element.cumulativeOffset(tempElement).top;
-      tempElement.parentNode.removeChild(tempElement);
-      if (offsetTop > element.scrollTop) {
-        element.scrollTop = offsetTop;
-      }
-    }
-  },
-  
-  /**
-   * Select line where the caret is in
-   */
-  selectLine: function(doc) {
-    if (wysihtml5.browserSupports.selectionModify()) {
-      this._selectLine_W3C(doc);
-    } else if (doc.selection) {
-      this._selectLine_MSIE(doc);
-    }
-  },
-  
-  /**
-   * See https://developer.mozilla.org/en/DOM/Selection/modify
-   */
-  _selectLine_W3C: function(doc) {
-    var win = doc.defaultView,
-        selection = win.getSelection();
-    selection.modify("extend", "left", "lineboundary");
-    selection.modify("extend", "right", "lineboundary");
-  },
-  
-  _selectLine_MSIE: function(doc) {
-    var range       = doc.selection.createRange(),
-        rangeTop    = range.boundingTop,
-        rangeHeight = range.boundingHeight,
-        scrollWidth = doc.body.scrollWidth,
-        rangeBottom,
-        rangeEnd,
-        measureNode,
-        i,
-        j;
-
-    if (!range.moveToPoint) {
-      return;
-    }
-
-    if (rangeTop === 0) {
-      // Don't know why, but when the selection ends at the end of a line
-      // range.boundingTop is 0
-      measureNode = doc.createElement("span");
-      wysihtml5.utils.caret.insertNode(measureNode);
-      rangeTop = measureNode.offsetTop;
-      measureNode.parentNode.removeChild(measureNode);
-    }
-    
-    rangeTop += 1;
-    
-    for (i=-10; i<scrollWidth; i+=2) {
-      try {
-        range.moveToPoint(i, rangeTop);
-        break;
-      } catch(e1) {}
-    }
-    
-    // Investigate the following in order to handle multi line selections
-    // rangeBottom = rangeTop + (rangeHeight ? (rangeHeight - 1) : 0);
-    rangeBottom = rangeTop;
-    rangeEnd = doc.selection.createRange();
-    for (j=scrollWidth; j>=0; j--) {
-      try {
-        rangeEnd.moveToPoint(j, rangeBottom);
-        break;
-      } catch(e2) {}
-    }
-
-    range.setEndPoint("EndToEnd", rangeEnd);
-    range.select();
-  },
-  
-  getText: function(doc) {
-    var selection = this.getSelection(doc);
-    return selection ? selection.toString() : "";
-  },
-  
-  getNodes: function(doc, nodeType, filter) {
-    var range = this.getRange(doc);
-    if (range) {
-      return range.getNodes([nodeType], filter);
-    } else {
-      return [];
-    }
-  },
-  
-  getRange: function(doc) {
-    var selection = this.getSelection(doc);
-    return selection && selection.rangeCount && selection.getRangeAt(0);
-  },
-  
-  getSelection: function(doc) {
-    return rangy.getSelection(doc.defaultView || doc.parentWindow);
-  },
-  
-  setSelection: function(range) {
-    var doc       = (range.startContainer || range.endContainer).ownerDocument,
-        win       = doc.defaultView || doc.parentWindow,
-        selection = rangy.getSelection(win);
-    return selection.setSingleRange(range);
-  },
-  
-  // ----------------- private -------------- \\
-  _getPlaceholderElement: (function() {
-    var id = "_wysihtml5-placeholder" + new Date().getTime();
-    return function(doc) {
-      // Important: placeholder element needs to be an inline element
-      // otherwise chrome will cause trouble when interacting with the text
-      var element       = doc._wysihtml5CaretPlaceholder = doc._wysihtml5CaretPlaceholder || doc.createElement("span");
-      element.id        = id;
-      element.innerHTML = this.PLACEHOLDER_TEXT;
-      return element;
-    };
-  })(),
-  
-  _findPlaceholderElement: function(doc) {
-    var placeholderElement      = this._getPlaceholderElement(doc),
-        // Using placeholderElement.innerHTML causes problems in firefox who sometimes mangles the innerHTML
-        placeholderElementText  = wysihtml5.utils.getTextContent(placeholderElement),
-        placeholderElementById  = doc.getElementById(placeholderElement.id),
-        i                       = 0,
-        element,
-        elements,
-        elementsLength;
-    if (wysihtml5.utils.contains(doc.body, placeholderElement)) {
-      return placeholderElement;
-    } else if (placeholderElementById) {
-      return placeholderElementById;
-    } else {
-      elements = doc.getElementsByTagName("*");
-      elementsLength = elements.length;
-      for (; i<elementsLength; i++) {
-        element = elements[i];
-        if (element.innerHTML === placeholderElementText) {
-          return element;
-        }
-      }
-      return null;
-    }
-  }
-};
\ No newline at end of file
diff --git a/src/utils/copy_styles.js b/src/utils/copy_styles.js
deleted file mode 100644
index 9637f274..00000000
--- a/src/utils/copy_styles.js
+++ /dev/null
@@ -1,76 +0,0 @@
-/**
- * Copy a set of styles from one element to another
- * Please note that this only works properly across browsers when the element from which to copy the styles
- * is in the dom
- *
- * Interesting article on how to copy styles
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- *
- * @param {Array} stylesToCopy List of styles which should be copied
- * @return {Object} Returns an object which offers the "from" method which can be invoked with the element where to
- *    copy the styles from., this again returns an object which provides a method named "to" which can be invoked 
- *    with the element where to copy the styles to (see example)
- *
- * @example
- *    var textarea    = $("textarea"),
- *        div         = $$("div[contenteditable=true]")[0],
- *        anotherDiv  = $$("div[contenteditable=true]")[1];
- *    wysihtml5.utils.copyStyles("width", "height").from(textarea).to(div);
- *    // or (advanced example):
- *    wysihtml5.utils.copyStyles(["overflow-y", "width", "height"]).from(textarea).to(div).andTo(anotherDiv);
- *
- */
-wysihtml5.utils.copyStyles = (function() {
-  
-  /**
-   * Mozilla and Opera recalculate the computed width when box-sizing: boder-box; is set
-   * So if an element has "width: 200px; -moz-box-sizing: border-box; border: 1px;" then 
-   * it's computed css width will be 198px
-   */
-  var BOX_SIZING_PROPERTIES = ["-webkit-box-sizing", "-moz-box-sizing", "-ms-box-sizing", "box-sizing"];
-  
-  var shouldIgnoreBoxSizingBorderBox = function(element) {
-    if (hasBoxSizingBorderBox(element)) {
-       return parseInt(wysihtml5.utils.getStyle(element, "width"), 10) < element.getWidth();
-    }
-    return false;
-  };
-  
-  var hasBoxSizingBorderBox = function(element) {
-    return BOX_SIZING_PROPERTIES.find(function(property) {
-      return wysihtml5.utils.getStyle(element, property) == "border-box";
-    });
-  };
-  
-  return function(stylesToCopy) {
-    stylesToCopy = $A(arguments).flatten();
-    
-    return {
-      from: function(element) {
-        if (shouldIgnoreBoxSizingBorderBox(element)) {
-          stylesToCopy = stylesToCopy.without.apply(stylesToCopy, BOX_SIZING_PROPERTIES);
-        }
-        
-        var cssText = stylesToCopy.inject("", function(str, property) {
-          var propertyValue = wysihtml5.utils.getStyle(element, property);
-          if (propertyValue) {
-            str += property + ":" + propertyValue + ";";
-          }
-          return str;
-        });
-        
-        return {
-          to: function(element) {
-            /**
-             * Use static Element.setStyle method, since element is not
-             * necessarily prototype extended
-             */
-            Element.setStyle(element, cssText);
-            return { andTo: arguments.callee };
-          }
-        };
-      }
-    };
-  };
-})();
\ No newline at end of file
diff --git a/src/utils/get_style.js b/src/utils/get_style.js
deleted file mode 100644
index 37918ef2..00000000
--- a/src/utils/get_style.js
+++ /dev/null
@@ -1,50 +0,0 @@
-/**
- * Get element's style for a specific css property
- *
- * @param {Element} element The element on which to retrieve the style
- * @param {String} property The CSS property to retrieve ("float", "display", "text-align", ...)
- * @author Christopher Blum <christopher.blum@xing.com>
- * @example
- *    wysihtml5.utils.getStyle(document.body, "display");
- *    // => "block"
- */
-wysihtml5.utils.getStyle = (function() {
-  var currentStylePropertyMapping = {
-    "float": "styleFloat"
-  };
-  
-  return function(element, property) {
-    if (element.nodeType !== Node.ELEMENT_NODE) {
-      return;
-    }
-    
-    // currentStyle is no standard and only supported by Opera and IE but it has one important advantage over the standard-compliant
-    // window.getComputedStyle, since it returns css property values in their original unit:
-    // If you set an elements width to "50%", window.getComputedStyle will give you it's current width in px while currentStyle
-    // gives you the original "50%".
-    // Opera supports both, currentStyle and window.getComputedStyle, that's why checking for currentStyle should have higher prio
-    if (element.currentStyle) {
-      property = currentStylePropertyMapping[property] || property.camelize();
-      return element.currentStyle[property];
-    }
-
-    var win                 = element.ownerDocument.defaultView || element.ownerDocument.parentWindow,
-        needsOverflowReset  = (property === "height" || property === "width") && element.nodeName === "TEXTAREA",
-        originalOverflow,
-        returnValue;
-    
-    if (win.getComputedStyle) {
-      // Chrome and Safari both calculate a wrong width and height for textareas when they have scroll bars
-      // therfore we remove and restore the scrollbar and calculate the value in between
-      if (needsOverflowReset) {
-        originalOverflow = element.style.overflow;
-        element.style.overflow = "hidden";
-      }
-      returnValue = win.getComputedStyle(element, null).getPropertyValue(property);
-      if (needsOverflowReset) {
-        element.style.overflow = originalOverflow || "";
-      }
-      return returnValue;
-    }
-  };
-})();
\ No newline at end of file
diff --git a/src/utils/observe.js b/src/utils/observe.js
deleted file mode 100644
index b449eaab..00000000
--- a/src/utils/observe.js
+++ /dev/null
@@ -1,46 +0,0 @@
-/**
- * Method to set dom events
- *
- * Prototype's original Element.observe doesn't work correctly when used
- * on elements in iframes whose ownerDocument isn't the same as the one where prototype is loaded
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- *
- * @example
- *    wysihtml5.utils.observe(iframe.contentWindow.document.body, ["focus", "blur"], function() { ... });
- */
-wysihtml5.utils.observe = function(element, eventNames, handler) {
-  eventNames = [eventNames].flatten();
-  eventNames.each(function(eventName) {
-    if (element.addEventListener) {
-      element.addEventListener(eventName, handler, false);
-    } else {
-      handler = handler.bind(element);
-      handler = handler.wrap(function(proceed, event) {
-        if (!("target" in event)) {
-          event.target = event.srcElement;
-        }
-        event.preventDefault = event.preventDefault || function() {
-          this.returnValue = false;
-        };
-        event.stopPropagation = event.stopPropagation || function() {
-          this.cancelBubble = true;
-        };
-        proceed(event);
-      });
-      element.attachEvent("on" + eventName, handler);
-    }
-  });
-  
-  return {
-    stop: function() {
-      eventNames.each(function(eventName) {
-        if (element.addEventListener) {
-          element.removeEventListener(eventName, handler, false);
-        } else {
-          element.detachEvent("on" + eventName, handler);
-        }
-      });
-    }
-  };
-};
diff --git a/src/utils/sandbox.js b/src/utils/sandbox.js
deleted file mode 100644
index 617ec0be..00000000
--- a/src/utils/sandbox.js
+++ /dev/null
@@ -1,240 +0,0 @@
-/**
- * Sandbox for executing javascript, parsing css styles and doing dom operations in a safe way
- *
- * Browser Compatibility:
- *  - Secure in MSIE 6+, but only when the user hasn't made changes to his security level "restricted"
- *  - Partially secure in other browsers (Firefox, Opera, Safari, Chrome, ...)
- *
- * Please note that this class can't benefit from the HTML5 sandbox attribute for the following reasons:
- *    - sandboxing doesn't work correctly with inlined content (src="javascript:'<html>...</html>'")
- *    - sandboxing of physical documents causes that the dom isn't accessible anymore from the outside (iframe.contentWindow, ...)
- *    - setting the "allow-same-origin" flag would fix that, but then still javascript and dom events refuse to fire
- *    - therefore the "allow-scripts" flag is needed, which then would inactivate any security, as the js executed inside the iframe
- *      can do anything as if the sandbox attribute wasn't set
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- *
- * @param {Function} [readyCallback] Method that gets invoked when the sandbox is ready
- * @param {Object} [config] Optional parameters, see defaultConfig property for more info
- *
- * @example
- *    new wysihtml5.utils.Sandbox(function(sandbox) {
- *      sandbox.getWindow().document.body.innerHTML = '<img src=foo.gif onerror="alert(document.cookie)">';
- *    });
- */
-wysihtml5.utils.Sandbox = Class.create(
-  /** @scope wysihtml5.utils.Sandbox.prototype */ {
-  
-  defaultConfig: {
-    insertInto:   null,       // Element (id or direct object reference) where to insert the sandbox into
-    context:      document,   // Object of document where to insert the sandbox in
-    uaCompatible: "IE=Edge"   // X-UA-Compatible meta tag value (Document compatibility mode)
-  },
-  
-  initialize: function(readyCallback, config) {
-    this.callback = readyCallback || Prototype.emptyFunction;
-    this.config   = Object.extend(Object.clone(this.defaultConfig), config);
-    this.iframe   = this._createIframe();
-    
-    if (typeof(this.config.insertInto) === "string") {
-      this.config.insertInto = this.config.context.getElementById(this.config.insertInto);
-    }
-    
-    if (this.config.insertInto) {
-      this.config.insertInto.appendChild(this.iframe);
-    }
-  },
-  
-  getIframe: function() {
-    return this.iframe;
-  },
-  
-  getWindow: function() {
-    this._readyError();
-  },
-  
-  getDocument: function() {
-    this._readyError();
-  },
-  
-  destroy: function() {
-    var iframe = this.getIframe();
-    iframe.parentNode.removeChild(iframe);
-  },
-  
-  _readyError: function() {
-    throw new Error("wysihtml5.Sandbox: Sandbox iframe isn't loaded yet");
-  },
-  
-  /**
-   * Creates the sandbox iframe
-   *
-   * Some important notes:
-   *  - We can't use HTML5 sandbox for now:
-   *    setting it causes that the iframe's dom can't be accessed from the outside
-   *    Therefore we need to set the "allow-same-origin" flag which enables accessing the iframe's dom
-   *    But then there's another problem, DOM events (focus, blur, change, keypress, ...) aren't fired.
-   *    In order to make this happen we need to set the "allow-scripts" flag.
-   *    A combination of allow-scripts and allow-same-origin is almost the same as setting no sandbox attribute at all.
-   *  - Chrome & Safari, doesn't seem to support sandboxing correctly when the iframe's html is inlined (no physical document)
-   *  - IE needs to have the security="restricted" attribute set before the iframe is 
-   *    inserted into the dom tree
-   *  - Believe it or not but in IE "security" in document.createElement("iframe") is false, even
-   *    though it supports it
-   *  - When an iframe has security="restricted", in IE eval() & execScript() don't work anymore
-   *  - IE doesn't fire the onload event when the content is inlined in the src attribute, therefore we rely
-   *    on the onreadystatechange event
-   */
-  _createIframe: function() {
-    var iframe = this.config.context.createElement("iframe");
-    iframe.className = "wysihtml5-sandbox";
-    iframe.setAttribute("security", "restricted");
-    iframe.setAttribute("allowTransparency", "true");
-    iframe.setAttribute("frameBorder", "0");
-    iframe.setAttribute("width", "0");
-    iframe.setAttribute("height", "0");
-    iframe.setAttribute("marginWidth", "0");
-    iframe.setAttribute("marginHeight", "0");
-    
-    // Setting the src like this prevents ssl warnings in IE6
-    if (!wysihtml5.browserSupports.emptyIframeSrcInHttpsContext()) {
-      iframe.src = "javascript:'<html></html>'";
-    }
-    
-    iframe.onload = function() {
-      iframe.onreadystatechange = iframe.onload = null;
-      this._onLoadIframe(iframe);
-    }.bind(this);
-    
-    iframe.onreadystatechange = function() {
-      if (/loaded|complete/.test(iframe.readyState)) {
-        iframe.onreadystatechange = iframe.onload = null;
-        this._onLoadIframe(iframe);
-      }
-    }.bind(this);
-    
-    return iframe;
-  },
-  
-  /**
-   * Callback for when the iframe has finished loading
-   */
-  _onLoadIframe: function(iframe) {
-    // don't resume when the iframe got unloaded (eg. by removing it from the dom)
-    if (!wysihtml5.utils.contains(document.documentElement, iframe)) {
-      return;
-    }
-    
-    var context        = this.config.context,
-        iframeWindow   = iframe.contentWindow,
-        iframeDocument = iframe.contentDocument || iframe.contentWindow.document,
-        charset        = context.characterSet || context.charset || "utf-8",
-        sandboxHtml    = this._getHtml({
-          charset:      charset,
-          stylesheets:  this.config.stylesheets,
-          uaCompatible: this.config.uaCompatible
-        });
-    
-    // Create the basic dom tree including proper DOCTYPE and charset
-    iframeDocument.open("text/html", "replace");
-    iframeDocument.write(sandboxHtml);
-    iframeDocument.close();
-    
-    this.getWindow = function() { return iframeWindow; };
-    this.getDocument = function() { return iframeDocument; };
-    
-    // Catch js errors and pass them to the parent's onerror event
-    // addEventListener("error") doesn't work properly in some browsers
-    // TODO: apparently this doesn't work in IE9!
-    iframeWindow.onerror = function(errorMessage, fileName, lineNumber) {
-      throw new Error("wysihtml5.Sandbox: " + errorMessage, fileName, lineNumber);
-    };
-    
-    if (!wysihtml5.browserSupports.sandboxedIframes()) {
-      // Unset a bunch of sensitive variables
-      // Please note: This isn't hack safe!  
-      // It more or less just takes care of basic attacks and prevents accidental theft of sensitive information
-      // IE is secure though, which is the most important thing, since IE is the only browser, who
-      // takes over scripts & styles into contentEditable elements when copied from external websites
-      // or applications (Microsoft Word, ...)
-      [
-        "parent", "top", "opener", "frameElement", "frames",
-        "localStorage", "globalStorage", "sessionStorage", "indexedDB"
-      ].each(function(property) {
-        this._unset(iframeWindow, property);
-      }.bind(this));
-
-      [
-        "open", "close", "openDialog", "showModalDialog",
-        "alert", "confirm", "prompt",
-        "openDatabase", "postMessage",
-        "XMLHttpRequest", "XDomainRequest"
-      ].each(function(property) {
-        this._unset(iframeWindow, property, Prototype.emptyFunction);
-      }.bind(this));
-
-      [
-        "referrer",
-        "write", "open", "close"
-      ].each(function(property) {
-        this._unset(iframeDocument, property);
-      }.bind(this));
-
-      // This doesn't work in Safari 5 
-      // See http://stackoverflow.com/questions/992461/is-it-possible-to-override-document-cookie-in-webkit
-      this._unset(iframeDocument, "cookie", "", true);
-    }
-    
-    this.loaded = true;
-    
-    // Trigger the callback
-    setTimeout(function() { this.callback(this); }.bind(this), 0);
-  },
-  
-  _getHtml: function(templateVars) {
-    if (templateVars.stylesheets) {
-      templateVars.stylesheets = [templateVars.stylesheets].flatten().map(function(stylesheet) {
-        return '<link rel="stylesheet" href="' + stylesheet + '">';
-      }).join("");
-    } else {
-      templateVars.stylesheets = "";
-    }
-    
-    return (
-      '<!DOCTYPE html><html><head>'
-      + '<meta http-equiv="X-UA-Compatible" content="#{uaCompatible}"><meta charset="#{charset}">#{stylesheets}</head>'
-      + '<body></body></html>'
-    ).interpolate(templateVars);
-  },
-  
-  /**
-   * Method to unset/override existing variables
-   * @example
-   *    // Make cookie unreadable and unwritable
-   *    this._unset(document, "cookie", "", true);
-   */
-  _unset: function(object, property, value, setter) {
-    try { object[property] = value; } catch(e) {}
-    
-    try { object.__defineGetter__(property, function() { return value; }); } catch(e) {}
-    if (setter) {
-      try { object.__defineSetter__(property, function() {}); } catch(e) {}
-    }
-    
-    // IE9 crashes when setting a getter via Object.defineProperty on XMLHttpRequest or XDomainRequest
-    // See https://connect.microsoft.com/ie/feedback/details/650112
-    // or try the POC http://tifftiff.de/ie9_crash/
-    var causesBrowserCrash = Prototype.Browser.IE && (property === "XMLHttpRequest" || property === "XDomainRequest");
-    if (!causesBrowserCrash) {
-      try {
-        var config = {
-          get: function() { return value; }
-        };
-        if (setter) {
-          config.set = function() {};
-        }
-        Object.defineProperty(object, property, config);
-      } catch(e) {}
-    }
-  }
-});
\ No newline at end of file
diff --git a/src/utils/simulate_placeholder.js b/src/utils/simulate_placeholder.js
deleted file mode 100644
index d7ba0fce..00000000
--- a/src/utils/simulate_placeholder.js
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * Simulate HTML5 placeholder attribute
- *
- * Needed since
- *    - div[contentEditable] elements don't support it
- *    - older browsers (such as IE8 and Firefox 3.6) don't support it at all
- *
- * @author Christopher Blum <christopher.blum@xing.com>
- *
- * @param {Object} parent Instance of main wysihtml5.Editor class
- * @param {Element} view Instance of wysihtml5.views.* class
- * @param {String} placeholderText
- *
- * @example
- *    wysihtml.utils.simulatePlaceholder(this, composer, "Foobar");
- */
-wysihtml5.utils.simulatePlaceholder = function(parent, view, placeholderText) {
-  var unset = function() {
-        if (view.hasPlaceholderSet()) {
-          view.clear();
-        }
-        Element.removeClassName(view.element, "placeholder");
-      },
-      set = function() {
-        if (view.isEmpty()) {
-          view.setValue(placeholderText);
-          Element.addClassName(view.element, "placeholder");
-        }
-      };
-  
-  parent
-    .observe("set_placeholder", set)
-    .observe("unset_placeholder", unset)
-    .observe("focus:composer", unset)
-    .observe("paste:composer", unset)
-    .observe("blur:composer", set);
-  
-  set();
-};
\ No newline at end of file
diff --git a/src/utils/synchronizer.js b/src/utils/synchronizer.js
deleted file mode 100644
index 118dcda6..00000000
--- a/src/utils/synchronizer.js
+++ /dev/null
@@ -1,102 +0,0 @@
-/**
- * Class that takes care that the value of the composer and the textarea is always in sync
- */
-wysihtml5.utils.Synchronizer = Class.create(
-  /** @scope wysihtml5.utils.Synchronizer.prototype */ {
-  INTERVAL: 400,
-  
-  initialize: function(parent, textarea, composer) {
-    this.parent   = parent;
-    this.textarea = textarea;
-    this.composer = composer;
-    
-    this._observe();
-  },
-  
-  /**
-   * Sync html from composer to textarea
-   * Takes care of placeholders
-   * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the textarea
-   */
-  fromComposerToTextarea: function(shouldParseHtml) {
-    this.textarea.setValue(this._trim(this.composer.getValue()), shouldParseHtml);
-  },
-  
-  /**
-   * Sync value of textarea to composer
-   * Takes care of placeholders
-   * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer
-   */
-  fromTextareaToComposer: function(shouldParseHtml) {
-    var textareaValue = this.textarea.getValue();
-    if (textareaValue) {
-      this.composer.setValue(textareaValue, shouldParseHtml);
-    } else {
-      this.composer.clear();
-      this.parent.fire("set_placeholder");
-    }
-  },
-  
-  /**
-   * Invoke syncing based on view state
-   * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer/textarea
-   */
-  sync: function(shouldParseHtml) {
-    if (this.parent.currentView.name == "textarea") {
-      this.fromTextareaToComposer(shouldParseHtml);
-    } else {
-      this.fromComposerToTextarea(shouldParseHtml);
-    }
-  },
-  
-  /**
-   * Initializes interval-based syncing
-   * also makes sure that on-submit the composer's content is synced with the textarea
-   * immediately when the form gets submitted
-   */
-  _observe: function() {
-    var interval,
-        form          = this.textarea.element.up("form"),
-        startInterval = function() {
-          interval = setInterval(function() { this.fromComposerToTextarea(); }.bind(this), this.INTERVAL);
-        }.bind(this),
-        stopInterval  = function() {
-          clearInterval(interval);
-          interval = null;
-        };
-    
-    startInterval();
-    
-    if (form) {
-      // If the textarea is in a form make sure that after onreset and onsubmit the composer
-      // has the correct state
-      form.observe("submit", function() { this.sync(true); }.bind(this));
-      form.observe("reset", function() { this.fromTextareaToComposer.bind(this).defer(); }.bind(this));
-    }
-    
-    this.parent.observe("change_view", function(event) {
-      var view = event.memo;
-      if (view == "composer" && !interval) {
-        this.fromTextareaToComposer(true);
-        startInterval();
-      } else if (view == "textarea") {
-        this.fromComposerToTextarea(true);
-        stopInterval();
-      }
-    }.bind(this));
-    
-    this.parent.observe("destroy:composer", stopInterval);
-  },
-  
-  /**
-   * Normalizes white space in the beginning and end
-   * This: "     foo    " will become: " foo "
-   */
-  _trim: (function() {
-    var WHITE_SPACE_START = /^\s+/,
-        WHITE_SPACE_END   = /\s+$/;
-    return function(str) {
-      return str.replace(WHITE_SPACE_START, " ").replace(WHITE_SPACE_END, " ");
-    };
-  })()
-});
\ No newline at end of file
diff --git a/src/utils/text_content.js b/src/utils/text_content.js
deleted file mode 100644
index 5e9dae3b..00000000
--- a/src/utils/text_content.js
+++ /dev/null
@@ -1,25 +0,0 @@
-if ("textContent" in document.documentElement) {
-  wysihtml5.utils.setTextContent = function(element, text) {
-    element.textContent = text;
-  };
-  
-  wysihtml5.utils.getTextContent = function(element) {
-    return element.textContent;
-  };
-} else if ("innerText" in document.documentElement) {
-  wysihtml5.utils.setTextContent = function(element, text) {
-    element.innerText = text;
-  };
-
-  wysihtml5.utils.getTextContent = function(element) {
-    return element.innerText;
-  };
-} else {
-  wysihtml5.utils.setTextContent = function(element, text) {
-    element.nodeValue = text;
-  };
-  
-  wysihtml5.utils.getTextContent = function(element) {
-    return element.nodeValue;
-  };
-}
diff --git a/src/views/composer.js b/src/views/composer.js
index 4d317f17..b11f276b 100644
--- a/src/views/composer.js
+++ b/src/views/composer.js
@@ -1,269 +1,291 @@
-wysihtml5.views.Composer = Class.create(wysihtml5.views.View, 
-  /** @scope wysihtml5.views.Composer.prototype */ {
-  name: "composer",
+(function(wysihtml5) {
+  var dom       = wysihtml5.dom,
+      browser   = wysihtml5.browser,
+      selection = wysihtml5.selection;
   
-  // Needed for firefox in order to display a proper caret in an empty contentEditable
-  CARET_HACK: "<br>",
-  
-  initialize: function($super, parent, textareaElement, config) {
-    $super(parent, textareaElement, config);
-    this.textarea = this.parent.textarea;
-    this._initSandbox();
-  },
-  
-  clear: function() {
-    this.element.innerHTML = wysihtml5.browserSupports.caretInEmptyContentEditableCorrectly() ? "" : this.CARET_HACK;
-  },
-  
-  getValue: function(parse) {
-    var value = this.isEmpty() ? "" : this.element.innerHTML;
-    if (parse) {
-      value = this.parent.parse(value);
-    }
-    
-    // Replace all "zero width no breaking space" chars
-    // which are used as hacks to enable some functionalities
-    // Also remove all CARET hacks that somehow got left
-    value = value
-      .replace(/\uFEFF/g, "")
-      .replace(new RegExp(RegExp.escape(wysihtml5.utils.caret.PLACEHOLDER_TEXT), "g"), "");
-    
-    return value;
-  },
-  
-  setValue: function(html, parse) {
-    if (parse) {
-      html = this.parent.parse(html);
-    }
-    this.element.innerHTML = html;
-  },
-  
-  show: function() {
-    this.iframe.setStyle({ display: this._displayStyle || "" });
-    
-    // Firefox needs this, otherwise contentEditable becomes uneditable
-    this.disable();
-    this.enable();
-  },
-  
-  hide: function() {
-    this._displayStyle = wysihtml5.utils.getStyle(this.iframe, "display");
-    if (this._displayStyle === "none") {
-      this._displayStyle = null;
-    }
-    this.iframe.hide();
-  },
-  
-  disable: function($super) {
-    this.element.removeAttribute("contentEditable");
-    $super();
-  },
-  
-  enable: function($super) {
-    this.element.setAttribute("contentEditable", "true");
-    $super();
-  },
-  
-  getTextContent: function() {
-    return wysihtml5.utils.getTextContent(this.element);
-  },
-  
-  hasPlaceholderSet: function() {
-    return this.getTextContent() == this.textarea.element.readAttribute("placeholder");
-  },
-  
-  isEmpty: function() {
-    var innerHTML               = this.element.innerHTML,
-        elementsWithVisualValue = "blockquote, ul, ol, img, embed, object, table, iframe, svg, video, audio, button, input, select, textarea";
-    return innerHTML === "" || 
-      innerHTML === this.CARET_HACK ||
-      this.hasPlaceholderSet() ||
-      (this.getTextContent() === "" && !this.element.querySelector(elementsWithVisualValue));
-  },
-  
-  _initSandbox: function() {
-    this.sandbox = new wysihtml5.utils.Sandbox(this._create.bind(this), {
-      stylesheets:  this.config.stylesheets,
-      uaCompatible: "IE=7"
-    });
-    this.iframe  = this.sandbox.getIframe();
-    
-    // Create hidden field which tells the server after submit, that the user used an wysiwyg editor
-    this.hiddenField = new Element("input", {
-      type:   "hidden",
-      name:   "_wysihtml5_mode"
-    });
-    this.hiddenField.value = "1";
-    
-    // Store reference to current wysihtml5 instance on the textarea element
-    this.textarea.element
-      .insert({ after: this.iframe })
-      .insert({ after: this.hiddenField });
-  },
-  
-  _create: function() {
-    this.element                  = this.sandbox.getDocument().body;
-    this.textarea                 = this.parent.textarea;
-    this.element.innerHTML        = this.textarea.getValue(true);
-    this.enable();
-    
-    // Make sure that our external range library is initialized
-    window.rangy.init();
-    
-    wysihtml5.utils.copyAttributes(
-      "className", "spellcheck", "title", "lang", "dir", "accessKey"
-    ).from(this.textarea.element).to(this.element);
-    
-    Element.addClassName(this.element, this.config.composerClassName);
-    
-    // Make the editor look like the original textarea, by syncing styles
-    if (this.config.style) {
-      this.style();
-    }
-    
-    this.observe();
-    
-    var name = this.config.name;
-    if (name) {
-      Element.addClassName(this.element, name);
-      Element.addClassName(this.iframe, name);
-    }
-    
-    // Simulate html5 placeholder attribute on contentEditable element
-    var placeholderText = Object.isString(this.config.placeholder) ? this.config.placeholder : this.textarea.element.readAttribute("placeholder");
-    if (placeholderText) {
-      wysihtml5.utils.simulatePlaceholder(this.parent, this, placeholderText);
-    }
-    
-    // Make sure that the browser avoids using inline styles whenever possible
-    wysihtml5.commands.exec(this.element, "styleWithCSS", false);
-    
-    this._initAutoLinking();
-    this._initObjectResizing();
-    
-    // Simulate html5 autofocus on contentEditable element
-    if (this.textarea.element.hasAttribute("autofocus") || document.querySelector(":focus") == this.textarea.element) {
-      wysihtml5.utils.autoFocus(this);
-    }
-    
-    // IE and Opera insert paragraphs on return instead of line breaks
-    if (!wysihtml5.browserSupports.lineBreaksOnReturn()) {
-      wysihtml5.quirks.insertLineBreakOnReturn(this.element);
-    }
-    
-    // IE sometimes leaves a single paragraph, which can't be removed by the user
-    if (!wysihtml5.browserSupports.clearingOfContentEditableCorrectly()) {
-      wysihtml5.quirks.ensureProperClearing(this.element);
-    }
-    
-    if (!wysihtml5.browserSupports.clearingOfListsInContentEditableCorrectly()) {
-      wysihtml5.quirks.ensureProperClearingOfLists(this.element);
-    }
-    
-    // Set up a sync that makes sure that textarea and editor have the same content
-    if (this.initSync && this.config.sync) {
-      this.initSync();
-    }
-    
-    // Okay hide the textarea, we are ready to go
-    this.textarea.hide();
-    
-    // Fire global (before-)load event
-    this.parent.fire("beforeload").fire("load");
-  },
-  
-  _initAutoLinking: function() {
-    var supportsDisablingOfAutoLinking = wysihtml5.browserSupports.disablingOfAutoLinking(),
-        supportsAutoLinking            = wysihtml5.browserSupports.autoLinkingInContentEditable();
-    if (supportsDisablingOfAutoLinking) {
-      wysihtml5.commands.exec(this.element, "autoUrlDetect", false);
-    }
-    
-    if (!this.config.autoLink) {
-      return;
-    }
-    
-    var sandboxDoc = this.sandbox.getDocument();
-    
-    // Only do the auto linking by ourselves when the browser doesn't support auto linking
-    // OR when he supports auto linking but we were able to turn it off (IE9+)
-    if (!supportsAutoLinking || (supportsAutoLinking && supportsDisablingOfAutoLinking)) {
-      this.parent.observe("newword:composer", function() {
-        wysihtml5.utils.caret.executeAndRestore(sandboxDoc, function(startContainer, endContainer) {
-          wysihtml5.utils.autoLink(endContainer.parentNode);
-        });
-      }.bind(this));
-    }
-    
-    // Assuming we have the following:
-    //  <a href="http://www.google.de">http://www.google.de</a>
-    // If a user now changes the url in the innerHTML we want to make sure that
-    // it's synchronized with the href attribute (as long as the innerHTML is still a url)
-    var // Use a live NodeList to check whether there are any links in the document
-        links           = sandboxDoc.getElementsByTagName("a"),
-        // The autoLink helper method reveals a reg exp to detect correct urls
-        urlRegExp       = wysihtml5.utils.autoLink.URL_REG_EXP,
-        getTextContent  = function(element) {
-          var textContent = wysihtml5.utils.getTextContent(element).strip();
-          if (textContent.substr(0, 4) === "www.") {
-            textContent = "http://" + textContent;
-          }
-          return textContent;
-        };
-    
-    wysihtml5.utils.observe(this.element, "keydown", function(event) {
-      if (!links.length) {
-        return;
+  wysihtml5.views.Composer = wysihtml5.views.View.extend(
+    /** @scope wysihtml5.views.Composer.prototype */ {
+    name: "composer",
+
+    // Needed for firefox in order to display a proper caret in an empty contentEditable
+    CARET_HACK: "<br>",
+
+    constructor: function(parent, textareaElement, config) {
+      this.base(parent, textareaElement, config);
+      this.textarea = this.parent.textarea;
+      this._initSandbox();
+    },
+
+    clear: function() {
+      this.element.innerHTML = browser.displaysCaretInEmptyContentEditableCorrectly() ? "" : this.CARET_HACK;
+    },
+
+    getValue: function(parse) {
+      var value = this.isEmpty() ? "" : wysihtml5.quirks.getCorrectInnerHTML(this.element);
+      
+      if (parse) {
+        value = this.parent.parse(value);
+      }
+
+      // Replace all "zero width no breaking space" chars
+      // which are used as hacks to enable some functionalities
+      // Also remove all CARET hacks that somehow got left
+      value = wysihtml5.lang.string(value).replace(wysihtml5.INVISIBLE_SPACE).by("");
+      value = wysihtml5.lang.string(value).replace(selection.PLACEHOLDER_TEXT).by("");
+
+      return value;
+    },
+
+    setValue: function(html, parse) {
+      if (parse) {
+        html = this.parent.parse(html);
       }
+      this.element.innerHTML = html;
+    },
+
+    show: function() {
+      this.iframe.style.display = this._displayStyle || "";
+
+      // Firefox needs this, otherwise contentEditable becomes uneditable
+      this.disable();
+      this.enable();
+    },
+
+    hide: function() {
+      this._displayStyle = dom.getStyle("display").from(this.iframe);
+      if (this._displayStyle === "none") {
+        this._displayStyle = null;
+      }
+      this.iframe.style.display = "none";
+    },
+
+    disable: function() {
+      this.element.removeAttribute("contentEditable");
+      this.base();
+    },
+
+    enable: function() {
+      this.element.setAttribute("contentEditable", "true");
+      this.base();
+    },
+
+    getTextContent: function() {
+      return dom.getTextContent(this.element);
+    },
+
+    hasPlaceholderSet: function() {
+      return this.getTextContent() == this.textarea.element.getAttribute("placeholder");
+    },
+
+    isEmpty: function() {
+      var innerHTML               = this.element.innerHTML,
+          elementsWithVisualValue = "blockquote, ul, ol, img, embed, object, table, iframe, svg, video, audio, button, input, select, textarea";
+      return innerHTML === ""              || 
+             innerHTML === this.CARET_HACK ||
+             this.hasPlaceholderSet()      ||
+             (this.getTextContent() === "" && !this.element.querySelector(elementsWithVisualValue));
+    },
+
+    _initSandbox: function() {
+      var that = this;
+      
+      this.sandbox = new dom.Sandbox(function() {
+        that._create();
+      }, {
+        stylesheets:  this.config.stylesheets,
+        uaCompatible: "IE=7"
+      });
+      this.iframe  = this.sandbox.getIframe();
+
+      // Create hidden field which tells the server after submit, that the user used an wysiwyg editor
+      var hiddenField = document.createElement("input");
+      hiddenField.type   = "hidden";
+      hiddenField.name   = "_wysihtml5_mode";
+      hiddenField.value  = 1;
+
+      // Store reference to current wysihtml5 instance on the textarea element
+      var textareaElement = this.textarea.element;
+      dom.insert(this.iframe).after(textareaElement);
+      dom.insert(hiddenField).after(textareaElement);
+    },
+
+    _create: function() {
+      var that = this;
       
-      var selectedNode = wysihtml5.utils.caret.getSelectedNode(event.target.ownerDocument),
-          link         = wysihtml5.utils.getParentElement(selectedNode, { nodeName: "A" }, 4),
-          textContent;
+      this.element            = this.sandbox.getDocument().body;
+      this.textarea           = this.parent.textarea;
+      this.element.innerHTML  = this.textarea.getValue(true);
+      this.enable();
+
+      // Make sure that our external range library is initialized
+      window.rangy.init();
+
+      dom.copyAttributes([
+        "className", "spellcheck", "title", "lang", "dir", "accessKey"
+      ]).from(this.textarea.element).to(this.element);
       
-      if (!link) {
+      dom.addClass(this.element, this.config.composerClassName);
+
+      // Make the editor look like the original textarea, by syncing styles
+      if (this.config.style) {
+        this.style();
+      }
+
+      this.observe();
+
+      var name = this.config.name;
+      if (name) {
+        dom.addClass(this.element, name);
+        dom.addClass(this.iframe, name);
+      }
+
+      // Simulate html5 placeholder attribute on contentEditable element
+      var placeholderText = typeof(this.config.placeholder) === "string"
+        ? this.config.placeholder
+        : this.textarea.element.getAttribute("placeholder");
+      if (placeholderText) {
+        dom.simulatePlaceholder(this.parent, this, placeholderText);
+      }
+
+      // Make sure that the browser avoids using inline styles whenever possible
+      wysihtml5.commands.exec(this.element, "styleWithCSS", false);
+
+      this._initAutoLinking();
+      this._initObjectResizing();
+
+      // Simulate html5 autofocus on contentEditable element
+      if (this.textarea.element.hasAttribute("autofocus") || document.querySelector(":focus") == this.textarea.element) {
+        setTimeout(function() { that.focus(); }, 100);
+      }
+
+      // IE and Opera insert paragraphs on return instead of line breaks
+      if (!browser.insertsLineBreaksOnReturn()) {
+        wysihtml5.quirks.insertLineBreakOnReturn(this.element);
+      }
+
+      // IE sometimes leaves a single paragraph, which can't be removed by the user
+      if (!browser.clearsContentEditableCorrectly()) {
+        wysihtml5.quirks.ensureProperClearing(this.element);
+      }
+
+      if (!browser.clearsListsInContentEditableCorrectly()) {
+        wysihtml5.quirks.ensureProperClearingOfLists(this.element);
+      }
+
+      // Set up a sync that makes sure that textarea and editor have the same content
+      if (this.initSync && this.config.sync) {
+        this.initSync();
+      }
+
+      // Okay hide the textarea, we are ready to go
+      this.textarea.hide();
+
+      // Fire global (before-)load event
+      this.parent.fire("beforeload").fire("load");
+    },
+
+    _initAutoLinking: function() {
+      var supportsDisablingOfAutoLinking = browser.canDisableAutoLinking(),
+          supportsAutoLinking            = browser.doesAutoLinkingInContentEditable();
+      if (supportsDisablingOfAutoLinking) {
+        wysihtml5.commands.exec(this.element, "autoUrlDetect", false);
+      }
+
+      if (!this.config.autoLink) {
         return;
       }
-      
-      textContent = getTextContent(link);
-      // keydown is fired before the actual content is changed
-      // therefore we set a timeout to change the href
-      setTimeout(function() {
-        var newTextContent = getTextContent(link);
-        if (newTextContent === textContent) {
+
+      var sandboxDoc = this.sandbox.getDocument();
+
+      // Only do the auto linking by ourselves when the browser doesn't support auto linking
+      // OR when he supports auto linking but we were able to turn it off (IE9+)
+      if (!supportsAutoLinking || (supportsAutoLinking && supportsDisablingOfAutoLinking)) {
+        this.parent.observe("newword:composer", function() {
+          selection.executeAndRestore(sandboxDoc, function(startContainer, endContainer) {
+            dom.autoLink(endContainer.parentNode);
+          });
+        });
+      }
+
+      // Assuming we have the following:
+      //  <a href="http://www.google.de">http://www.google.de</a>
+      // If a user now changes the url in the innerHTML we want to make sure that
+      // it's synchronized with the href attribute (as long as the innerHTML is still a url)
+      var // Use a live NodeList to check whether there are any links in the document
+          links           = sandboxDoc.getElementsByTagName("a"),
+          // The autoLink helper method reveals a reg exp to detect correct urls
+          urlRegExp       = dom.autoLink.URL_REG_EXP,
+          getTextContent  = function(element) {
+            var textContent = wysihtml5.lang.string(dom.getTextContent(element)).trim();
+            if (textContent.substr(0, 4) === "www.") {
+              textContent = "http://" + textContent;
+            }
+            return textContent;
+          };
+
+      dom.observe(this.element, "keydown", function(event) {
+        if (!links.length) {
           return;
         }
-        
-        // Only set href when new href looks like a valid url
-        if (newTextContent.match(urlRegExp)) {
-          link.setAttribute("href", newTextContent);
+
+        var selectedNode = selection.getSelectedNode(event.target.ownerDocument),
+            link         = dom.getParentElement(selectedNode, { nodeName: "A" }, 4),
+            textContent;
+
+        if (!link) {
+          return;
         }
-      }, 0);
-    });
-  },
-  
-  _initObjectResizing: function() {
-    wysihtml5.commands.exec(this.element, "enableObjectResizing", this.config.allowObjectResizing);
-    
-    if (this.config.allowObjectResizing) {
-      if (wysihtml5.browserSupports.event("resizeend")) {
-        wysihtml5.utils.observe(this.element, "resizeend", function(event) {
-          var target      = event.target || event.srcElement;
-          ["width", "height"].each(function(property) {
-            if (target.style[property]) {
-              target.setAttribute(property, parseInt(target.style[property], 10));
-              target.style[property] = "";
+
+        textContent = getTextContent(link);
+        // keydown is fired before the actual content is changed
+        // therefore we set a timeout to change the href
+        setTimeout(function() {
+          var newTextContent = getTextContent(link);
+          if (newTextContent === textContent) {
+            return;
+          }
+
+          // Only set href when new href looks like a valid url
+          if (newTextContent.match(urlRegExp)) {
+            link.setAttribute("href", newTextContent);
+          }
+        }, 0);
+      });
+    },
+
+    _initObjectResizing: function() {
+      var properties        = ["width", "height"],
+          propertiesLength  = properties.length,
+          element           = this.element;
+      
+      wysihtml5.commands.exec(element, "enableObjectResizing", this.config.allowObjectResizing);
+
+      if (this.config.allowObjectResizing) {
+         // IE sets inline styles after resizing objects
+         // The following lines make sure that the width/height css properties
+         // are copied over to the width/height attributes
+        if (browser.supportsEvent("resizeend")) {
+          dom.observe(element, "resizeend", function(event) {
+            var target = event.target || event.srcElement,
+                style  = target.style,
+                i      = 0,
+                property;
+            for(; i<propertiesLength; i++) {
+              property = properties[i];
+              if (style[property]) {
+                target.setAttribute(property, parseInt(style[property], 10));
+                style[property] = "";
+              }
             }
+            // After resizing IE sometimes forgets to remove the old resize handles
+            wysihtml5.quirks.redraw(element);
           });
-          // After resizing IE sometimes forgets to remove the old resize handles
-          wysihtml5.quirks.redraw(this.element);
-        }.bind(this));
-      }
-    } else {
-      if (wysihtml5.browserSupports.event("resizestart")) {
-        wysihtml5.utils.observe(this.element, "resizestart", function(event) {
-          event.preventDefault();
-        });
+        }
+      } else {
+        if (browser.supportsEvent("resizestart")) {
+          dom.observe(element, "resizestart", function(event) { event.preventDefault(); });
+        }
       }
     }
-  }
-});
\ No newline at end of file
+  });
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/views/composer.observe.js b/src/views/composer.observe.js
index 01e9cada..96f6a599 100644
--- a/src/views/composer.observe.js
+++ b/src/views/composer.observe.js
@@ -8,156 +8,157 @@
  *
  * @author Christopher Blum <christopher.blum@xing.com>
  */
-wysihtml5.views.Composer.addMethods({
-  observe: (function() {
-    /**
-     * Map keyCodes to query commands
-     */
-    var shortcuts = {
-      "66": "bold",     // B
-      "73": "italic",   // I
-      "85": "underline" // U
-    };
-    
-    return function() {
-      var state               = this.getValue(),
-          iframe              = this.sandbox.getIframe(),
-          element             = this.element,
-          focusBlurElement    = wysihtml5.browserSupports.eventsInIframeCorrectly() ? element : this.sandbox.getWindow(),
-          // Firefox < 3.5 doesn't support the drop event, instead it supports a so called "dragdrop" event which behaves almost the same
-          pasteEvents         = wysihtml5.browserSupports.event("drop") ? ["drop", "paste"] : ["dragdrop", "paste"];
-      
-      // --------- destroy:composer event ---------
-      wysihtml5.utils.observe(iframe, "DOMNodeRemoved", function() {
-        clearInterval(domNodeRemovedInterval);
-        this.parent.fire("destroy:composer");
-      }.bind(this));
-      
-      // DOMNodeRemoved event is not supported in IE 8
-      var domNodeRemovedInterval = setInterval(function() {
-        if (!wysihtml5.utils.contains(document.documentElement, iframe)) {
-          clearInterval(domNodeRemovedInterval);
-          this.parent.fire("destroy:composer");
-        }
-      }.bind(this), 250);
-      
-      
-      // --------- Focus & blur logic ---------
-      wysihtml5.utils.observe(focusBlurElement, "focus", function() {
-        this.parent.fire("focus").fire("focus:composer");
-
-        // Delay storing of state until all focus handler are fired
-        // especially the one which resets the placeholder
-        (function() { state = this.getValue(); }).bind(this).defer();
-      }.bind(this));
-
-      wysihtml5.utils.observe(focusBlurElement, "blur", function() {
-        if (state != this.getValue()) {
-          this.parent.fire("change").fire("change:composer");
-        }
-        this.parent.fire("blur").fire("blur:composer");
-      }.bind(this));
+(function(wysihtml5) {
+  var dom       = wysihtml5.dom,
+      browser   = wysihtml5.browser,
+      /**
+       * Map keyCodes to query commands
+       */
+      shortcuts = {
+        "66": "bold",     // B
+        "73": "italic",   // I
+        "85": "underline" // U
+      };
+  
+  wysihtml5.views.Composer.prototype.observe = function() {
+    var that                = this,
+        state               = this.getValue(),
+        iframe              = this.sandbox.getIframe(),
+        element             = this.element,
+        focusBlurElement    = browser.supportsEventsInIframeCorrectly() ? element : this.sandbox.getWindow(),
+        // Firefox < 3.5 doesn't support the drop event, instead it supports a so called "dragdrop" event which behaves almost the same
+        pasteEvents         = browser.supportsEvent("drop") ? ["drop", "paste"] : ["dragdrop", "paste"];
 
-      // --------- Drag & Drop logic ---------
-      wysihtml5.utils.observe(element, "dragenter", function() {
-        this.parent.fire("unset_placeholder");
-      }.bind(this));
+    // --------- destroy:composer event ---------
+    dom.observe(iframe, "DOMNodeRemoved", function() {
+      clearInterval(domNodeRemovedInterval);
+      that.parent.fire("destroy:composer");
+    });
 
-      if (wysihtml5.browserSupports.onDropOnlyWhenOnDragOverIsCancelled()) {
-        wysihtml5.utils.observe(element, ["dragover", "dragenter"], function(event) {
-          event.preventDefault();
-        }.bind(this));
+    // DOMNodeRemoved event is not supported in IE 8
+    var domNodeRemovedInterval = setInterval(function() {
+      if (!dom.contains(document.documentElement, iframe)) {
+        clearInterval(domNodeRemovedInterval);
+        that.parent.fire("destroy:composer");
       }
-      
-      wysihtml5.utils.observe(element, pasteEvents, function(event) {
-        var dataTransfer = event.dataTransfer,
-            data;
-        
-        if (dataTransfer && wysihtml5.browserSupports.htmlDataTransfer()) {
-          data = dataTransfer.getData("text/html") || dataTransfer.getData("text/plain");
-        }
-        if (data) {
-          element.focus();
-          wysihtml5.commands.exec(element, "insertHTML", data);
-          this.parent.fire("paste").fire("paste:composer");
-          event.stopPropagation();
-          event.preventDefault();
-        } else {
-          setTimeout(function() {
-            this.parent.fire("paste").fire("paste:composer");
-          }.bind(this), 0);
-        }
-      }.bind(this));
-
-      // --------- neword event ---------
-      Event.KEY_SPACE = Event.KEY_SPACE || 32;
-      wysihtml5.utils.observe(element, "keyup", function(event) {
-        var keyCode = event.keyCode;
-        if (keyCode == Event.KEY_SPACE || keyCode == Event.KEY_RETURN) {
-          this.parent.fire("newword:composer");
-        }
-      }.bind(this));
-
-      this.parent.observe("paste:composer", function() {
-        setTimeout(function() { this.parent.fire("newword:composer"); }.bind(this), 0);
-      }.bind(this));
-
-      // --------- Make sure that images are selected when clicking on them ---------
-      if (!wysihtml5.browserSupports.selectingOfImagesInContentEditableOnClick()) {
-        wysihtml5.utils.observe(element, "mousedown", function(event) {
-          var target = event.target;
-          if (target.nodeName == "IMG") {
-            wysihtml5.utils.caret.selectNode(target);
-            event.preventDefault();
-          }
-        });
+    }, 250);
+
+
+    // --------- Focus & blur logic ---------
+    dom.observe(focusBlurElement, "focus", function() {
+      that.parent.fire("focus").fire("focus:composer");
+
+      // Delay storing of state until all focus handler are fired
+      // especially the one which resets the placeholder
+      setTimeout(function() { state = that.getValue(); }, 0);
+    });
+
+    dom.observe(focusBlurElement, "blur", function() {
+      if (state !== that.getValue()) {
+        that.parent.fire("change").fire("change:composer");
       }
+      that.parent.fire("blur").fire("blur:composer");
+    });
 
-      // --------- Shortcut logic ---------
-      wysihtml5.utils.observe(element, "keydown", function(event) {
-        var keyCode  = event.keyCode,
-            command  = shortcuts[keyCode.toString()];
-        if ((event.ctrlKey || event.metaKey) && command) {
-          wysihtml5.commands.exec(element, command);
-          event.preventDefault();
-        }
+    // --------- Drag & Drop logic ---------
+    dom.observe(element, "dragenter", function() {
+      that.parent.fire("unset_placeholder");
+    });
+
+    if (browser.firesOnDropOnlyWhenOnDragOverIsCancelled()) {
+      dom.observe(element, ["dragover", "dragenter"], function(event) {
+        event.preventDefault();
       });
-      
-      // --------- Make sure that when pressing backspace/delete on selected images deletes the image and it's anchor ---------
-      wysihtml5.utils.observe(element, "keydown", function(event) {
-        var target  = wysihtml5.utils.caret.getSelectedNode(element.ownerDocument, true),
-            keyCode = event.keyCode,
-            parent;
-        if (target && target.nodeName == "IMG" && (keyCode == 8 || keyCode == 46)) { // 8 => backspace, 46 => delete
-          parent = target.parentNode;
-          // delete the <img>
-          parent.removeChild(target);
-          // and it's parent <a> too if it hasn't got any other child nodes
-          if (parent.nodeName == "A" && !parent.firstChild) {
-            parent.parentNode.removeChild(parent);
-          }
-          
-          setTimeout(function() { wysihtml5.quirks.redraw(element); }, 0);
+    }
+
+    dom.observe(element, pasteEvents, function(event) {
+      var dataTransfer = event.dataTransfer,
+          data;
+
+      if (dataTransfer && browser.supportsDataTransfer()) {
+        data = dataTransfer.getData("text/html") || dataTransfer.getData("text/plain");
+      }
+      if (data) {
+        element.focus();
+        wysihtml5.commands.exec(element, "insertHTML", data);
+        that.parent.fire("paste").fire("paste:composer");
+        event.stopPropagation();
+        event.preventDefault();
+      } else {
+        setTimeout(function() {
+          that.parent.fire("paste").fire("paste:composer");
+        }, 0);
+      }
+    });
+
+    // --------- neword event ---------
+    dom.observe(element, "keyup", function(event) {
+      var keyCode = event.keyCode;
+      if (keyCode === wysihtml5.SPACE_KEY || keyCode === wysihtml5.ENTER_KEY) {
+        that.parent.fire("newword:composer");
+      }
+    });
+
+    this.parent.observe("paste:composer", function() {
+      setTimeout(function() { that.parent.fire("newword:composer"); }, 0);
+    });
+
+    // --------- Make sure that images are selected when clicking on them ---------
+    if (!browser.canSelectImagesInContentEditable()) {
+      dom.observe(element, "mousedown", function(event) {
+        var target = event.target;
+        if (target.nodeName === "IMG") {
+          wysihtml5.selection.selectNode(target);
           event.preventDefault();
         }
       });
-      
-      // --------- Show url in tooltip when hovering links or images ---------
-      var titlePrefixes = {
-        IMG: "Image: ",
-        A:   "Link: "
-      };
-      wysihtml5.utils.observe(element, "mouseover", function(event) {
-        var target   = event.target,
-            nodeName = target.nodeName,
-            title;
-        if (nodeName !== "A" && nodeName !== "IMG") {
-          return;
+    }
+
+    // --------- Shortcut logic ---------
+    dom.observe(element, "keydown", function(event) {
+      var keyCode  = event.keyCode,
+          command  = shortcuts[keyCode];
+      if ((event.ctrlKey || event.metaKey) && command) {
+        wysihtml5.commands.exec(element, command);
+        event.preventDefault();
+      }
+    });
+
+    // --------- Make sure that when pressing backspace/delete on selected images deletes the image and it's anchor ---------
+    dom.observe(element, "keydown", function(event) {
+      var target  = wysihtml5.selection.getSelectedNode(element.ownerDocument, true),
+          keyCode = event.keyCode,
+          parent;
+      if (target && target.nodeName === "IMG" && (keyCode === wysihtml5.BACKSPACE_KEY || keyCode === wysihtml5.DELETE_KEY)) { // 8 => backspace, 46 => delete
+        parent = target.parentNode;
+        // delete the <img>
+        parent.removeChild(target);
+        // and it's parent <a> too if it hasn't got any other child nodes
+        if (parent.nodeName === "A" && !parent.firstChild) {
+          parent.parentNode.removeChild(parent);
         }
-        
-        title = titlePrefixes[nodeName] + (target.getAttribute("href") || target.getAttribute("src"));
-        target.setAttribute("title", title);
-      });
+
+        setTimeout(function() { wysihtml5.quirks.redraw(element); }, 0);
+        event.preventDefault();
+      }
+    });
+
+    // --------- Show url in tooltip when hovering links or images ---------
+    var titlePrefixes = {
+      IMG: "Image: ",
+      A:   "Link: "
     };
-  })()
-});
\ No newline at end of file
+    
+    dom.observe(element, "mouseover", function(event) {
+      var target   = event.target,
+          nodeName = target.nodeName,
+          title;
+      if (nodeName !== "A" && nodeName !== "IMG") {
+        return;
+      }
+
+      title = titlePrefixes[nodeName] + (target.getAttribute("href") || target.getAttribute("src"));
+      target.setAttribute("title", title);
+    });
+  };
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/views/composer.style.js b/src/views/composer.style.js
index 69af215d..adbcf665 100644
--- a/src/views/composer.style.js
+++ b/src/views/composer.style.js
@@ -1,165 +1,176 @@
-wysihtml5.views.Composer.addMethods({
-  style: (function() {
-    var HOST_TEMPLATE   = new Element("div"),
-        /**
-         * Styles to copy from textarea to the composer element
-         */
-        TEXT_FORMATTING = [
-          "background-color",
-          "color", "cursor",
-          "font-family", "font-size", "font-style", "font-variant", "font-weight",
-          "line-height", "letter-spacing",
-          "text-align", "text-decoration", "text-indent", "text-rendering",
-          "word-break", "word-wrap", "word-spacing"
-        ],
-        /**
-         * Styles to copy from textarea to the iframe
-         */
-        BOX_FORMATTING = [
-          "background-color",
-          "border-collapse",
-          "border-bottom-color", "border-bottom-style", "border-bottom-width",
-          "border-left-color", "border-left-style", "border-left-width",
-          "border-right-color", "border-right-style", "border-right-width",
-          "border-top-color", "border-top-style", "border-top-width",
-          "clear", "display", "float",
-          "margin-bottom", "margin-left", "margin-right", "margin-top",
-          "outline-color", "outline-offset", "outline-width", "outline-style",
-          "padding-left", "padding-right", "padding-top", "padding-bottom",
-          "position", "top", "left", "right", "bottom", "z-index",
-          "vertical-align", "text-align",
-          "-webkit-box-sizing", "-moz-box-sizing", "-ms-box-sizing", "box-sizing",
-          "-webkit-box-shadow", "-moz-box-shadow", "-ms-box-shadow","box-shadow",
-          "width", "height"
-        ],
-        /**
-         * Styles to sync while the window gets resized
-         */
-        RESIZE_STYLE = [
-          "width", "height",
-          "top", "left", "right", "bottom"
-        ],
-        ADDITIONAL_CSS_RULES = [
-          "html             { height: 100%; }",
-          "body             { min-height: 100%; padding: 0; margin: 0; margin-top: -1px; padding-top: 1px; }",
-          Prototype.Browser.Gecko ?
-            "body.placeholder { color: graytext !important; }" : 
-            "body.placeholder { color: #a9a9a9 !important; }",
-          "body[disabled]   { background-color: #eee !important; color: #999 !important; cursor: default !important; }",
-          // Ensure that user see's broken images and can delete them
-          "img:-moz-broken  { -moz-force-broken-image-icon: 1; height: 24px; width: 24px; }"
-        ];
-    
-    /**
-     * With "setActive" IE offers a smart way of focusing elements without scrolling them into view:
-     * http://msdn.microsoft.com/en-us/library/ms536738(v=vs.85).aspx
-     *
-     * Other browsers need a more hacky way: (pssst don't tell my mama)
-     * In order to prevent the element being scrolled into view when focusing it, we simply
-     * Move it out of the scrollable area, focus it, and reset it's position
-     */
-    var focusWithoutScrolling = function(element) {
-      if (element.setActive) {
-        element.setActive();
-      } else {
-        var elementStyle = element.style,
-            originalScrollTop = document.documentElement.scrollTop || document.body.scrollTop,
-            originalScrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft,
-            originalStyles = {
-              position:         elementStyle.position,
-              top:              elementStyle.top,
-              left:             elementStyle.left,
-              WebkitUserSelect: elementStyle.WebkitUserSelect
-            };
-        
-        // Don't ask why but temporarily setting -webkit-user-select to none makes the whole thing performing smoother
-        element.setStyle({ position: "absolute", top: "-99999px", left: "-99999px", WebkitUserSelect: "none" });
-        element.focus();
-        element.setStyle(originalStyles);
-        if (window.scrollTo) {
-          // Some browser extensions unset this method to prevent annoyances
-          // "Better PopUp Blocker" for Chrome http://code.google.com/p/betterpopupblocker/source/browse/trunk/blockStart.js#100
-          // Issue: http://code.google.com/p/betterpopupblocker/issues/detail?id=1
-          window.scrollTo(originalScrollLeft, originalScrollTop);
-        }
-      }
-    };
-    
-    return function() {
-      var originalActiveElement = document.querySelector(":focus"),
-          textareaElement       = this.textarea.element,
-          hasPlaceholder        = textareaElement.hasAttribute("placeholder"),
-          originalPlaceholder   = hasPlaceholder && textareaElement.getAttribute("placeholder");
-      this.focusStylesHost      = this.focusStylesHost  || HOST_TEMPLATE.clone();
-      this.blurStylesHost       = this.blurStylesHost   || HOST_TEMPLATE.clone();
-      
-      // Remove placeholder before copying (as the placeholder has an affect on the computed style)
-      if (hasPlaceholder) {
-        textareaElement.removeAttribute("placeholder");
-      }
-      
-      if (textareaElement === originalActiveElement) {
-        textareaElement.blur();
-      }
-      
-      // --------- iframe styles (has to be set before editor styles, otherwise IE9 sets wrong fontFamily on blurStylesHost) ---------
-      wysihtml5.utils.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.iframe).andTo(this.blurStylesHost);
-      
-      // --------- editor styles ---------
-      wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.element).andTo(this.blurStylesHost);
+(function(wysihtml5) {
+  var dom             = wysihtml5.dom,
+      doc             = document,
+      win             = window,
+      HOST_TEMPLATE   = doc.createElement("div"),
+      /**
+       * Styles to copy from textarea to the composer element
+       */
+      TEXT_FORMATTING = [
+        "background-color",
+        "color", "cursor",
+        "font-family", "font-size", "font-style", "font-variant", "font-weight",
+        "line-height", "letter-spacing",
+        "text-align", "text-decoration", "text-indent", "text-rendering",
+        "word-break", "word-wrap", "word-spacing"
+      ],
+      /**
+       * Styles to copy from textarea to the iframe
+       */
+      BOX_FORMATTING = [
+        "background-color",
+        "border-collapse",
+        "border-bottom-color", "border-bottom-style", "border-bottom-width",
+        "border-left-color", "border-left-style", "border-left-width",
+        "border-right-color", "border-right-style", "border-right-width",
+        "border-top-color", "border-top-style", "border-top-width",
+        "clear", "display", "float",
+        "margin-bottom", "margin-left", "margin-right", "margin-top",
+        "outline-color", "outline-offset", "outline-width", "outline-style",
+        "padding-left", "padding-right", "padding-top", "padding-bottom",
+        "position", "top", "left", "right", "bottom", "z-index",
+        "vertical-align", "text-align",
+        "-webkit-box-sizing", "-moz-box-sizing", "-ms-box-sizing", "box-sizing",
+        "-webkit-box-shadow", "-moz-box-shadow", "-ms-box-shadow","box-shadow",
+        "width", "height"
+      ],
+      /**
+       * Styles to sync while the window gets resized
+       */
+      RESIZE_STYLE = [
+        "width", "height",
+        "top", "left", "right", "bottom"
+      ],
+      ADDITIONAL_CSS_RULES = [
+        "html             { height: 100%; }",
+        "body             { min-height: 100%; padding: 0; margin: 0; margin-top: -1px; padding-top: 1px; }",
+        wysihtml5.browser.isGecko ?
+          "body.placeholder { color: graytext !important; }" : 
+          "body.placeholder { color: #a9a9a9 !important; }",
+        "body[disabled]   { background-color: #eee !important; color: #999 !important; cursor: default !important; }",
+        // Ensure that user see's broken images and can delete them
+        "img:-moz-broken  { -moz-force-broken-image-icon: 1; height: 24px; width: 24px; }"
+      ];
+  
+  /**
+   * With "setActive" IE offers a smart way of focusing elements without scrolling them into view:
+   * http://msdn.microsoft.com/en-us/library/ms536738(v=vs.85).aspx
+   *
+   * Other browsers need a more hacky way: (pssst don't tell my mama)
+   * In order to prevent the element being scrolled into view when focusing it, we simply
+   * Move it out of the scrollable area, focus it, and reset it's position
+   */
+  var focusWithoutScrolling = function(element) {
+    if (element.setActive) {
+      element.setActive();
+    } else {
+      var elementStyle = element.style,
+          originalScrollTop = doc.documentElement.scrollTop || doc.body.scrollTop,
+          originalScrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft,
+          originalStyles = {
+            position:         elementStyle.position,
+            top:              elementStyle.top,
+            left:             elementStyle.left,
+            WebkitUserSelect: elementStyle.WebkitUserSelect
+          };
       
-      // --------- apply standard rules ---------
-      wysihtml5.utils.insertRules(ADDITIONAL_CSS_RULES).into(this.element.ownerDocument);
-      
-      // --------- :focus styles ---------
-      focusWithoutScrolling(textareaElement);
-      wysihtml5.utils.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.focusStylesHost);
-      wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.focusStylesHost);
+      dom.setStyles({
+        position:         "absolute",
+        top:              "-99999px",
+        left:             "-99999px",
+        // Don't ask why but temporarily setting -webkit-user-select to none makes the whole thing performing smoother
+        WebkitUserSelect: "none"
+      }).on(element);
       
-      // Make sure that we don't change the display style of the iframe when copying styles oblur/onfocus
-      // this is needed for when the change_view event is fired where the iframe is hidden and then
-      // the blur event fires and re-displays it
-      var boxFormattingStyles = BOX_FORMATTING.without("display");
+      element.focus();
       
-      // --------- restore focus ---------
-      if (originalActiveElement) {
-        originalActiveElement.focus();
-      } else {
-        textareaElement.blur();
-      }
+      dom.setStyles(originalStyles).on(element);
       
-      // --------- restore placeholder ---------
-      if (hasPlaceholder) {
-        textareaElement.setAttribute("placeholder", originalPlaceholder);
+      if (win.scrollTo) {
+        // Some browser extensions unset this method to prevent annoyances
+        // "Better PopUp Blocker" for Chrome http://code.google.com/p/betterpopupblocker/source/browse/trunk/blockStart.js#100
+        // Issue: http://code.google.com/p/betterpopupblocker/issues/detail?id=1
+        win.scrollTo(originalScrollLeft, originalScrollTop);
       }
-      
-      // When copying styles, we only get the computed style which is never returned in percent unit
-      // Therefore we've to recalculate style onresize
-      if (!wysihtml5.browserSupports.computedStyleInPercent()) {
-        Event.observe(window, "resize", function() {
-          var originalDisplayStyle = wysihtml5.utils.getStyle(textareaElement, "display");
-          textareaElement.style.display = "";
-          wysihtml5.utils.copyStyles(RESIZE_STYLE)
-            .from(textareaElement)
-            .to(this.iframe)
-            .andTo(this.focusStylesHost)
-            .andTo(this.blurStylesHost);
-          textareaElement.style.display = originalDisplayStyle;
-        }.bind(this));
-      }
-      
-      // --------- Sync focus/blur styles ---------
-      this.parent.observe("focus:composer", function() {
-        wysihtml5.utils.copyStyles(boxFormattingStyles).from(this.focusStylesHost).to(this.iframe);
-        wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(this.focusStylesHost).to(this.element);
-      }.bind(this));
+    }
+  };
+  
+  
+  wysihtml5.views.Composer.prototype.style = function() {
+    var that                  = this,
+        originalActiveElement = doc.querySelector(":focus"),
+        textareaElement       = this.textarea.element,
+        hasPlaceholder        = textareaElement.hasAttribute("placeholder"),
+        originalPlaceholder   = hasPlaceholder && textareaElement.getAttribute("placeholder");
+    this.focusStylesHost      = this.focusStylesHost  || HOST_TEMPLATE.cloneNode(false);
+    this.blurStylesHost       = this.blurStylesHost   || HOST_TEMPLATE.cloneNode(false);
+  
+    // Remove placeholder before copying (as the placeholder has an affect on the computed style)
+    if (hasPlaceholder) {
+      textareaElement.removeAttribute("placeholder");
+    }
+  
+    if (textareaElement === originalActiveElement) {
+      textareaElement.blur();
+    }
+  
+    // --------- iframe styles (has to be set before editor styles, otherwise IE9 sets wrong fontFamily on blurStylesHost) ---------
+    dom.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.iframe).andTo(this.blurStylesHost);
+  
+    // --------- editor styles ---------
+    dom.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.element).andTo(this.blurStylesHost);
+  
+    // --------- apply standard rules ---------
+    dom.insertCSS(ADDITIONAL_CSS_RULES).into(this.element.ownerDocument);
+  
+    // --------- :focus styles ---------
+    focusWithoutScrolling(textareaElement);
+    dom.copyStyles(BOX_FORMATTING).from(textareaElement).to(this.focusStylesHost);
+    dom.copyStyles(TEXT_FORMATTING).from(textareaElement).to(this.focusStylesHost);
+  
+    // Make sure that we don't change the display style of the iframe when copying styles oblur/onfocus
+    // this is needed for when the change_view event is fired where the iframe is hidden and then
+    // the blur event fires and re-displays it
+    var boxFormattingStyles = wysihtml5.lang.array(BOX_FORMATTING).without(["display"]);
+  
+    // --------- restore focus ---------
+    if (originalActiveElement) {
+      originalActiveElement.focus();
+    } else {
+      textareaElement.blur();
+    }
+  
+    // --------- restore placeholder ---------
+    if (hasPlaceholder) {
+      textareaElement.setAttribute("placeholder", originalPlaceholder);
+    }
+  
+    // When copying styles, we only get the computed style which is never returned in percent unit
+    // Therefore we've to recalculate style onresize
+    if (!wysihtml5.browser.hasCurrentStyleProperty()) {
+      dom.observe(win, "resize", function() {
+        var originalDisplayStyle = dom.getStyle("display").from(textareaElement);
+        textareaElement.style.display = "";
+        dom.copyStyles(RESIZE_STYLE)
+          .from(textareaElement)
+          .to(that.iframe)
+          .andTo(that.focusStylesHost)
+          .andTo(that.blurStylesHost);
+        textareaElement.style.display = originalDisplayStyle;
+      });
+    }
+  
+    // --------- Sync focus/blur styles ---------
+    this.parent.observe("focus:composer", function() {
+      dom.copyStyles(boxFormattingStyles) .from(that.focusStylesHost).to(that.iframe);
+      dom.copyStyles(TEXT_FORMATTING)     .from(that.focusStylesHost).to(that.element);
+    });
 
-      this.parent.observe("blur:composer", function() {
-        wysihtml5.utils.copyStyles(boxFormattingStyles).from(this.blurStylesHost).to(this.iframe);
-        wysihtml5.utils.copyStyles(TEXT_FORMATTING).from(this.blurStylesHost).to(this.element);
-      }.bind(this));
-      
-      return this;
-    };
-  })()
-});
\ No newline at end of file
+    this.parent.observe("blur:composer", function() {
+      dom.copyStyles(boxFormattingStyles) .from(that.blurStylesHost).to(that.iframe);
+      dom.copyStyles(TEXT_FORMATTING)     .from(that.blurStylesHost).to(that.element);
+    });
+  
+    return this;
+  };
+})(wysihtml5);
\ No newline at end of file
diff --git a/src/views/synchronizer.js b/src/views/synchronizer.js
new file mode 100644
index 00000000..094e884e
--- /dev/null
+++ b/src/views/synchronizer.js
@@ -0,0 +1,97 @@
+/**
+ * Class that takes care that the value of the composer and the textarea is always in sync
+ */
+(function(wysihtml5) {
+  var INTERVAL = 400;
+  
+  wysihtml5.views.Synchronizer = Base.extend(
+    /** @scope wysihtml5.views.Synchronizer.prototype */ {
+
+    constructor: function(editor, textarea, composer) {
+      this.editor   = editor;
+      this.textarea = textarea;
+      this.composer = composer;
+
+      this._observe();
+    },
+
+    /**
+     * Sync html from composer to textarea
+     * Takes care of placeholders
+     * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the textarea
+     */
+    fromComposerToTextarea: function(shouldParseHtml) {
+      this.textarea.setValue(wysihtml5.lang.string(this.composer.getValue()).trim(), shouldParseHtml);
+    },
+
+    /**
+     * Sync value of textarea to composer
+     * Takes care of placeholders
+     * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer
+     */
+    fromTextareaToComposer: function(shouldParseHtml) {
+      var textareaValue = this.textarea.getValue();
+      if (textareaValue) {
+        this.composer.setValue(textareaValue, shouldParseHtml);
+      } else {
+        this.composer.clear();
+        this.editor.fire("set_placeholder");
+      }
+    },
+
+    /**
+     * Invoke syncing based on view state
+     * @param {Boolean} shouldParseHtml Whether the html should be sanitized before inserting it into the composer/textarea
+     */
+    sync: function(shouldParseHtml) {
+      if (this.editor.currentView.name === "textarea") {
+        this.fromTextareaToComposer(shouldParseHtml);
+      } else {
+        this.fromComposerToTextarea(shouldParseHtml);
+      }
+    },
+
+    /**
+     * Initializes interval-based syncing
+     * also makes sure that on-submit the composer's content is synced with the textarea
+     * immediately when the form gets submitted
+     */
+    _observe: function() {
+      var interval,
+          that          = this,
+          form          = this.textarea.element.form,
+          startInterval = function() {
+            interval = setInterval(function() { that.fromComposerToTextarea(); }, INTERVAL);
+          },
+          stopInterval  = function() {
+            clearInterval(interval);
+            interval = null;
+          };
+
+      startInterval();
+
+      if (form) {
+        // If the textarea is in a form make sure that after onreset and onsubmit the composer
+        // has the correct state
+        wysihtml5.dom.observe(form, "submit", function() {
+          that.sync(true);
+        });
+        wysihtml5.dom.observe(form, "reset", function() {
+          setTimeout(function() { that.fromTextareaToComposer(); }, 0);
+        });
+      }
+
+      this.editor.observe("change_view", function(view) {
+        if (view === "composer" && !interval) {
+          that.fromTextareaToComposer(true);
+          startInterval();
+        } else if (view === "textarea") {
+          that.fromComposerToTextarea(true);
+          stopInterval();
+        }
+      });
+
+      this.editor.observe("destroy:composer", stopInterval);
+    }
+  });
+})(wysihtml5);
diff --git a/src/views/textarea.js b/src/views/textarea.js
index 52675ada..3a64327d 100644
--- a/src/views/textarea.js
+++ b/src/views/textarea.js
@@ -1,12 +1,9 @@
-wysihtml5.views.Textarea = Class.create(wysihtml5.views.View,
+wysihtml5.views.Textarea = wysihtml5.views.View.extend(
   /** @scope wysihtml5.views.Textarea.prototype */ {
   name: "textarea",
   
-  initialize: function($super, parent, textareaElement, config) {
-    $super(parent, textareaElement, config);
-    
-    // Store reference to current wysihtml5.Editor instance
-    this.element.store("wysihtml5", parent);
+  constructor: function(parent, textareaElement, config) {
+    this.base(parent, textareaElement, config);
     
     this._observe();
   },
@@ -31,7 +28,7 @@ wysihtml5.views.Textarea = Class.create(wysihtml5.views.View,
   },
   
   hasPlaceholderSet: function() {
-    var supportsPlaceholder = wysihtml5.browserSupports.placeholderOn(this.element),
+    var supportsPlaceholder = wysihtml5.browser.supportsPlaceholderAttributeOn(this.element),
         placeholderText     = this.element.getAttribute("placeholder") || null,
         value               = this.element.value,
         isEmpty             = !value;
@@ -39,7 +36,7 @@ wysihtml5.views.Textarea = Class.create(wysihtml5.views.View,
   },
   
   isEmpty: function() {
-    return !this.element.value.strip() || this.hasPlaceholderSet();
+    return !wysihtml5.lang.string(this.element.value).trim() || this.hasPlaceholderSet();
   },
   
   _observe: function() {
@@ -53,15 +50,15 @@ wysihtml5.views.Textarea = Class.create(wysihtml5.views.View,
          * Calling focus() or blur() on an element doesn't synchronously trigger the attached focus/blur events
          * This is the case for focusin and focusout, so let's use them whenever possible, kkthxbai
          */
-        events = wysihtml5.browserSupports.event("focusin") ? ["focusin", "focusout", "change"] : ["focus", "blur", "change"];
+        events = wysihtml5.browser.supportsEvent("focusin") ? ["focusin", "focusout", "change"] : ["focus", "blur", "change"];
     
     parent.observe("beforeload", function() {
-      wysihtml5.utils.observe(element, events, function(event) {
+      wysihtml5.dom.observe(element, events, function(event) {
         var eventName = eventMapping[event.type] || event.type;
         parent.fire(eventName).fire(eventName + ":textarea");
       });
       
-      wysihtml5.utils.observe(element, ["paste", "drop"], function() {
+      wysihtml5.dom.observe(element, ["paste", "drop"], function() {
         setTimeout(function() { parent.fire("paste").fire("paste:textarea"); }, 0);
       });
     });
diff --git a/src/views/view.js b/src/views/view.js
index fc1f869c..a161d5b3 100644
--- a/src/views/view.js
+++ b/src/views/view.js
@@ -1,9 +1,9 @@
 /**
  * TODO: the following methods still need unit test coverage
  */
-wysihtml5.views.View = Class.create(
+wysihtml5.views.View = Base.extend(
   /** @scope wysihtml5.views.View.prototype */ {
-  initialize: function(parent, textareaElement, config) {
+  constructor: function(parent, textareaElement, config) {
     this.parent   = parent;
     this.element  = textareaElement;
     this.config   = config;
@@ -12,19 +12,19 @@ wysihtml5.views.View = Class.create(
   },
   
   _observeViewChange: function() {
+    var that = this;
     this.parent.observe("beforeload", function() {
-      this.parent.observe("change_view", function(event) {
-        var view = event.memo;
-        if (view === this.name) {
-          this.parent.currentView = this;
-          this.show();
-          // Using defer() here to make sure that the placeholder is set before focusing
-          this.focus.bind(this).defer();
+      that.parent.observe("change_view", function(view) {
+        if (view === that.name) {
+          that.parent.currentView = that;
+          that.show();
+          // Using tiny delay here to make sure that the placeholder is set before focusing
+          setTimeout(function() { that.focus(); }, 0);
         } else {
-          this.hide();
+          that.hide();
         }
-      }.bind(this));
-    }.bind(this));
+      });
+    });
   },
   
   focus: function() {
@@ -36,11 +36,11 @@ wysihtml5.views.View = Class.create(
   },
   
   hide: function() {
-    this.element.hide();
+    this.element.style.display = "none";
   },
   
   show: function() {
-    this.element.show();
+    this.element.style.display = "";
   },
   
   disable: function() {
diff --git a/src/wysihtml5.js b/src/wysihtml5.js
index 9a3cc76d..b3104c01 100644
--- a/src/wysihtml5.js
+++ b/src/wysihtml5.js
@@ -1,9 +1,35 @@
+/**
+ * @license wysihtml5 v@VERSION
+ * https://github.com/xing/wysihtml5
+ *
+ * Author: Christopher Blum (https://github.com/tiff)
+ *
+ * Copyright (C) 2011 XING AG
+ * Licensed under GNU General Public License
+ *
+ */
 var wysihtml5 = {
-  version:  "0.1.0",
+  version: "@VERSION",
   
-  commands: {},
-  quirks:   {},
-  toolbar:  {},
-  utils:    {},
-  views:    {}
+  // namespaces
+  commands:   {},
+  dom:        {},
+  quirks:     {},
+  toolbar:    {},
+  lang:       {},
+  selection:  {},
+  views:      {},
+  
+  INVISIBLE_SPACE: "\uFEFF",
+  
+  EMPTY_FUNCTION: function() {},
+  
+  ELEMENT_NODE: 1,
+  TEXT_NODE:    3,
+  
+  BACKSPACE_KEY:  8,
+  ENTER_KEY:      13,
+  ESCAPE_KEY:     27,
+  SPACE_KEY:      32,
+  DELETE_KEY:     46
 };
\ No newline at end of file
diff --git a/test/assert/html_equals_test.js b/test/assert/html_equals_test.js
index 8cb9aa6f..387150f4 100644
--- a/test/assert/html_equals_test.js
+++ b/test/assert/html_equals_test.js
@@ -1,25 +1,25 @@
-module("wysihtml5.utils.htmlEquals");
+module("wysihtml5.assert.htmlEquals");
 
 test("Basic tests", function() {
   wysihtml5.assert.htmlEquals("<span>foo</span>", "<span>foo</span>");
   wysihtml5.assert.htmlEquals("<SPAN>foo</SPAN>", "<span>foo</span>");
   wysihtml5.assert.htmlEquals("<IMG SRC=foo.gif>", '<img src="foo.gif">');
   
-  var container = new Element("div"),
-      image     = new Element("img");
+  var container = document.createElement("div"),
+      image     = document.createElement("img");
   image.setAttribute("alt", "foo");
   image.setAttribute("border", 0);
   image.setAttribute("src", "foo.gif");
   image.setAttribute("width", 25);
   image.setAttribute("height", 25);
-  container.insert(image);
+  container.appendChild(image);
   
   wysihtml5.assert.htmlEquals(container.innerHTML, '<img alt="foo" border="0" src="foo.gif" width="25" height="25">');
   
-  var inlineElement = new Element("span");
+  var inlineElement = document.createElement("span");
   inlineElement.innerHTML = "<p>foo</p>";
   container.innerHTML = "";
-  container.insert(inlineElement);
+  container.appendChild(inlineElement);
   wysihtml5.assert.htmlEquals(container.innerHTML, '<span><p>foo</p></span>');
   
   wysihtml5.assert.htmlEquals("<p>foo     bar</p>", '<p>foo bar</p>', "", {
diff --git a/test/browser_support_test.js b/test/browser_test.js
similarity index 56%
rename from test/browser_support_test.js
rename to test/browser_test.js
index 65b69f28..36cf0100 100644
--- a/test/browser_support_test.js
+++ b/test/browser_test.js
@@ -1,4 +1,4 @@
-module("wysihtml5.browserSupports", {
+module("wysihtml5.browser", {
   userAgents: {
     iPad:         "Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.10",
     iPhone:       "Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543a Safari/419.3",
@@ -12,14 +12,14 @@ module("wysihtml5.browserSupports", {
   },
   
   setup: function() {
-    this.originalUserAgent = wysihtml5.browserSupports.USER_AGENT;
-    this.originalExecCommand = document.execCommand;
-    this.originalQuerySelector = document.querySelector;
-    this.originalQuerySelectorAll = document.querySelectorAll;
+    this.originalUserAgent          = wysihtml5.browser.USER_AGENT;
+    this.originalExecCommand        = document.execCommand;
+    this.originalQuerySelector      = document.querySelector;
+    this.originalQuerySelectorAll   = document.querySelectorAll;
   },
   
   teardown: function() {
-    wysihtml5.browserSupports.USER_AGENT = this.originalUserAgent;
+    wysihtml5.browser.USER_AGENT = this.originalUserAgent;
     document.execCommand = this.originalExecCommand;
     document.querySelector = this.originalQuerySelector;
     document.querySelectorAll = this.originalQuerySelectorAll;
@@ -28,48 +28,48 @@ module("wysihtml5.browserSupports", {
 
 
 test("Check mobile contentEditable support", function() {
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.iPad;
-  ok(!wysihtml5.browserSupports.contentEditable(), "iPad is correctly unsupported");
+  wysihtml5.browser.USER_AGENT = this.userAgents.iPad;
+  ok(!wysihtml5.browser.supported(), "iPad is correctly unsupported");
   
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.iPhone;
-  ok(!wysihtml5.browserSupports.contentEditable(), "iPhone is correctly unsupported");
+  wysihtml5.browser.USER_AGENT = this.userAgents.iPhone;
+  ok(!wysihtml5.browser.supported(), "iPhone is correctly unsupported");
   
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.Android;
-  ok(!wysihtml5.browserSupports.contentEditable(), "Android is correctly unsupported");
+  wysihtml5.browser.USER_AGENT = this.userAgents.Android;
+  ok(!wysihtml5.browser.supported(), "Android is correctly unsupported");
   
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.OperaMobile;
-  ok(!wysihtml5.browserSupports.contentEditable(), "Opera Mobile is correctly unsupported");
+  wysihtml5.browser.USER_AGENT = this.userAgents.OperaMobile;
+  ok(!wysihtml5.browser.supported(), "Opera Mobile is correctly unsupported");
 });
 
 
 test("Check with missing document.execCommand", function() {
   document.execCommand = null;
   // I've no idea why this test fails in Opera... (if you run the test alone, everything works)
-  ok(!wysihtml5.browserSupports.contentEditable(), "Missing document.execCommand causes editor to be unsupported");
+  ok(!wysihtml5.browser.supported(), "Missing document.execCommand causes editor to be unsupported");
 });
 
 
 test("Check IE support", function() {
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.IE6;
+  wysihtml5.browser.USER_AGENT = this.userAgents.IE6;
   document.querySelector = document.querySelectorAll = null;
-  ok(!wysihtml5.browserSupports.contentEditable(), "IE6 is correctly unsupported");
+  ok(!wysihtml5.browser.supported(), "IE6 is correctly unsupported");
   
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.IE7;
+  wysihtml5.browser.USER_AGENT = this.userAgents.IE7;
   document.querySelector = document.querySelectorAll = null;
-  ok(!wysihtml5.browserSupports.contentEditable(), "IE7 is correctly unsupported");
+  ok(!wysihtml5.browser.supported(), "IE7 is correctly unsupported");
   
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.IE8;
+  wysihtml5.browser.USER_AGENT = this.userAgents.IE8;
   document.querySelector = document.querySelectorAll = function() {};
-  ok(wysihtml5.browserSupports.contentEditable(), "IE8 is correctly supported");
+  ok(wysihtml5.browser.supported(), "IE8 is correctly supported");
   
-  wysihtml5.browserSupports.USER_AGENT = this.userAgents.IE9;
+  wysihtml5.browser.USER_AGENT = this.userAgents.IE9;
   document.querySelector = document.querySelectorAll = function() {};
-  ok(wysihtml5.browserSupports.contentEditable(), "IE9 is correctly supported");
+  ok(wysihtml5.browser.supported(), "IE9 is correctly supported");
 });
 
 
 test("Check placeholder support", function() {
-  var pseudoElement = new Element("div");
+  var pseudoElement = document.createElement("div");
   pseudoElement.placeholder = "";
-  ok(wysihtml5.browserSupports.placeholderOn(pseudoElement));
+  ok(wysihtml5.browser.supportsPlaceholderAttributeOn(pseudoElement));
 });
\ No newline at end of file
diff --git a/test/utils/auto_link_test.js b/test/dom/auto_link_test.js
similarity index 94%
rename from test/utils/auto_link_test.js
rename to test/dom/auto_link_test.js
index b1f59302..bb97e7df 100644
--- a/test/utils/auto_link_test.js
+++ b/test/dom/auto_link_test.js
@@ -1,17 +1,17 @@
-module("wysihtml5.utils.autoLink", {
+module("wysihtml5.dom.autoLink", {
   equals: function(actual, expected, message) {
     return wysihtml5.assert.htmlEquals(actual, expected, message);
   },
   
   autoLink: function(html) {
-    var container = wysihtml5.utils.getInDomElement(html);
-    return wysihtml5.utils.autoLink(container).innerHTML;
+    var container = wysihtml5.dom.getAsDom(html);
+    return wysihtml5.dom.autoLink(container).innerHTML;
   } 
 });
 
 
 test("Basic test", function() {
-  ok(wysihtml5.utils.autoLink.URL_REG_EXP, "URL reg exp is revealed to be access globally");
+  ok(wysihtml5.dom.autoLink.URL_REG_EXP, "URL reg exp is revealed to be access globally");
   
   this.equals(
     this.autoLink("hey check out this search engine http://www.google.com"),
diff --git a/test/dom/contains_test.js b/test/dom/contains_test.js
new file mode 100644
index 00000000..03567638
--- /dev/null
+++ b/test/dom/contains_test.js
@@ -0,0 +1,18 @@
+module("wysihtml5.dom.contains", {
+  setup: function() {
+    this.container = document.createElement("div");
+    document.body.appendChild(this.container);
+  },
+  
+  teardown: function() {
+    this.container.parentNode.removeChild(this.container);
+  } 
+});
+
+
+test("Basic test", function() {
+  ok(wysihtml5.dom.contains(document.documentElement, document.body));
+  ok(wysihtml5.dom.contains(document.body, this.container));
+  ok(!wysihtml5.dom.contains(this.container, document.body));
+  ok(!wysihtml5.dom.contains(document.body, document.body));
+});
\ No newline at end of file
diff --git a/test/dom/convert_to_list_test.js b/test/dom/convert_to_list_test.js
new file mode 100644
index 00000000..00712be6
--- /dev/null
+++ b/test/dom/convert_to_list_test.js
@@ -0,0 +1,86 @@
+module("wysihtml5.dom.convertToList", {
+  equals: function(actual, expected, message) {
+    return wysihtml5.assert.htmlEquals(actual, expected, message);
+  },
+  
+  convertToList: function(html, type) {
+    var container = wysihtml5.dom.getAsDom(html);
+    document.body.appendChild(container);
+    wysihtml5.dom.convertToList(container.firstChild, type);
+    var innerHTML = container.innerHTML;
+    container.parentNode.removeChild(container);
+    return innerHTML;
+  }
+});
+
+test("Basic tests for UL", function() {
+  this.equals(
+    this.convertToList("<div>foo</div>", "ul"),
+    "<ul><li>foo</li></ul>"
+  );
+  
+  this.equals(
+    this.convertToList("<span></span>", "ul"),
+    "<ul></ul>"
+  );
+  
+  this.equals(
+    this.convertToList("<span>foo<br>bar</span>", "ul"),
+    "<ul><li>foo</li><li>bar</li></ul>"
+  );
+  
+  this.equals(
+    this.convertToList("<span>foo<br>bar<div>baz</div></span>", "ul"),
+    "<ul><li>foo</li><li>bar</li><li><div>baz</div></li></ul>"
+  );
+  
+  this.equals(
+    this.convertToList("<span><div></div><h1></h1><p>yeah</p></span>", "ul"),
+    "<ul><li><div></div></li><li><h1></h1></li><li><p>yeah</p></li></ul>"
+  );
+});
+
+test("Basic tests for OL", function() {
+  this.equals(
+    this.convertToList("<div>foo</div>", "ol"),
+    "<ol><li>foo</li></ol>"
+  );
+  
+  this.equals(
+    this.convertToList("<span></span>", "ol"),
+    "<ol></ol>"
+  );
+  
+  this.equals(
+    this.convertToList("<span>foo<br>bar</span>", "ol"),
+    "<ol><li>foo</li><li>bar</li></ol>"
+  );
+  
+  this.equals(
+    this.convertToList("<span>foo<br>bar<div>baz</div></span>", "ol"),
+    "<ol><li>foo</li><li>bar</li><li><div>baz</div></li></ol>"
+  );
+  
+  this.equals(
+    this.convertToList("<span><div></div><h1></h1><p>yeah</p></span>", "ol"),
+    "<ol><li><div></div></li><li><h1></h1></li><li><p>yeah</p></li></ol>"
+  );
+});
+
+
+test("Test whether it doesn't convert dom trees that are already a list", function() {
+  this.equals(
+    this.convertToList("<ol><li>foo</li></ol>", "ol"),
+    "<ol><li>foo</li></ol>"
+  );
+  
+  this.equals(
+    this.convertToList("<menu><li>foo</li></menu>", "ol"),
+    "<menu><li>foo</li></menu>"
+  );
+  
+  this.equals(
+    this.convertToList("<ul><li>foo</li></ul>", "ol"),
+    "<ul><li>foo</li></ul>"
+  );
+});
\ No newline at end of file
diff --git a/test/utils/copy_attributes_test.js b/test/dom/copy_attributes_test.js
similarity index 51%
rename from test/utils/copy_attributes_test.js
rename to test/dom/copy_attributes_test.js
index bb626394..8740a5a1 100644
--- a/test/utils/copy_attributes_test.js
+++ b/test/dom/copy_attributes_test.js
@@ -1,28 +1,28 @@
-module("wysihtml5.utils.copyAttributes", {
+module("wysihtml5.dom.copyAttributes", {
   setup: function() {
-    this.div        = new Element("div");
-    this.span       = new Element("span");
-    this.anotherDiv = new Element("div");
-    this.iframe     = new Element("iframe", { src: "javascript:'<html></html>'" });
+    this.div        = document.createElement("div");
+    this.span       = document.createElement("span");
+    this.anotherDiv = document.createElement("div");
+    this.iframe     = document.createElement("iframe");
     
-    $(document.body).insert(this.iframe);
+    this.iframe.src = "javascript:'<html></html>'";
+    document.body.appendChild(this.iframe);
   },
   
   teardown: function() {
-    this.iframe.remove();
+    this.iframe.parentNode.removeChild(this.iframe);
   }
 });
 
 
 test("Basic Tests", function() {
   var attributes = { title: "foobar", lang: "en", className: "foo bar" };
-  this.div.writeAttribute(attributes);
-  
-  wysihtml5.utils.copyAttributes("title", "lang", "className").from(this.div).to(this.span);
+  wysihtml5.dom.setAttributes(attributes).on(this.div);
+  wysihtml5.dom.copyAttributes(["title", "lang", "className"]).from(this.div).to(this.span);
   
   equals(this.span.title, attributes.title, "Title correctly copied");
   equals(this.span.lang, attributes.lang, "Lang correctly copied");
-  equals(this.span.className, attributes.className, "Text-align correctly copied");
+  equals(this.span.className, attributes.className, "Class correctly copied");
 });
 
 
@@ -30,21 +30,23 @@ test("Test copying attributes from one element to another element which is in an
   expect(1);
   stop(2000);
   
+  var that = this;
+  
   // Timeout needed to make sure that the iframe is ready
   setTimeout(function() {
-    var iframeDocument = this.iframe.contentWindow.document,
+    var iframeDocument = that.iframe.contentWindow.document,
         iframeElement = iframeDocument.createElement("div");
     
     iframeDocument.body.appendChild(iframeElement);
-    this.span.title = "heya!";
+    that.span.title = "heya!";
     
-    wysihtml5.utils
-      .copyAttributes("title")
-      .from(this.span)
+    wysihtml5.dom
+      .copyAttributes(["title"])
+      .from(that.span)
       .to(iframeElement);
     
     equals(iframeElement.title, "heya!", "Element in iframe correctly got attributes copied over");
     
     start();
-  }.bind(this), 1000);
+  }, 1000);
 });
\ No newline at end of file
diff --git a/test/dom/copy_styles_test.js b/test/dom/copy_styles_test.js
new file mode 100644
index 00000000..193e27e9
--- /dev/null
+++ b/test/dom/copy_styles_test.js
@@ -0,0 +1,111 @@
+module("wysihtml5.dom.copyStyles", {
+  setup: function() {
+    this.div        = document.createElement("div");
+    this.span       = document.createElement("span");
+    this.anotherDiv = document.createElement("div");
+    this.iframe     = document.createElement("iframe");
+    
+    this.span.id = "wysihtml5-test-span";
+    this.iframe.id = "javascript:'<html></html>'";
+    
+    document.body.appendChild(this.div);
+    document.body.appendChild(this.span);
+    document.body.appendChild(this.anotherDiv);
+    document.body.appendChild(this.iframe);
+  },
+  
+  teardown: function() {
+    this.div.parentNode.removeChild(this.div);
+    this.span.parentNode.removeChild(this.span);
+    this.anotherDiv.parentNode.removeChild(this.anotherDiv);
+    this.iframe.parentNode.removeChild(this.iframe);
+  }
+});
+
+
+test("Basic Tests", function() {
+  this.div.style.cssText = "width: 400px; height: 200px; text-align: right; float: left;";
+  
+  wysihtml5.dom.copyStyles(["width", "height", "text-align", "float"]).from(this.div).to(this.span);
+  
+  equals(wysihtml5.dom.getStyle("width")      .from(this.span), "400px",  "Width correctly copied");
+  equals(wysihtml5.dom.getStyle("height")     .from(this.span), "200px",  "Height correctly copied");
+  equals(wysihtml5.dom.getStyle("text-align") .from(this.span), "right",  "Text-align correctly copied");
+  equals(wysihtml5.dom.getStyle("float")      .from(this.span), "left",   "Float correctly copied");
+});
+
+
+test("Whether it copies native user agent styles", function() {
+  wysihtml5.dom.copyStyles(["display"]).from(this.span).to(this.div);
+  
+  equals(wysihtml5.dom.getStyle("display").from(this.div), "inline", "Display correctly copied");
+});
+
+
+test("Advanced tests", function() {
+  this.span.style.cssText = "color: rgb(255, 0, 0); -moz-border-radius: 5px 5px 5px 5px;";
+  this.div.style.cssText  = "color: rgb(0, 255, 0); text-decoration: underline;";
+  
+  wysihtml5.dom
+    .copyStyles(["color", "-moz-border-radius", "unknown-style"])
+    .from(this.span)
+    .to(this.div)
+    .andTo(this.anotherDiv);
+  
+  // Opera and IE internally convert color values either to rgb or hexcode, and some version of IE either
+  // strip or add white spaces between rgb values
+  var divColor = wysihtml5.dom.getStyle("color").from(this.div).replace(/\s+/g, "");
+  ok(divColor == "rgb(255,0,0)" || divColor == "#ff0000", "First div has correct color");
+  
+  var anotherDivColor = wysihtml5.dom.getStyle("color").from(this.anotherDiv).replace(/\s+/g, "");
+  ok(anotherDivColor == "rgb(255,0,0)" || anotherDivColor == "#ff0000", "Second div has correct color");
+  
+  equals(wysihtml5.dom.getStyle("text-decoration").from(this.div), "underline", "Text-decoration hasn't been overwritten");
+  
+  if ("MozBorderRadius" in this.div.style) {
+    equals(wysihtml5.dom.getStyle("-moz-border-radius").from(this.div),        "5px 5px 5px 5px", "First div has correct border-radius");
+    equals(wysihtml5.dom.getStyle("-moz-border-radius").from(this.anotherDiv), "5px 5px 5px 5px", "Second div has correct border-radius");
+  }
+});
+
+
+test("Test copying styles from one element to another element which is in an iframe", function() {
+  expect(1);
+  stop(2000);
+  
+  var that = this;
+  
+  // Timeout needed to make sure that the iframe is ready
+  setTimeout(function() {
+    var iframeDocument = that.iframe.contentWindow.document,
+        iframeElement = iframeDocument.createElement("div");
+    
+    iframeDocument.body.appendChild(iframeElement);
+    that.span.style.cssText = "float: left;";
+    
+    wysihtml5.dom
+      .copyStyles(["float"])
+      .from(that.span)
+      .to(iframeElement);
+    
+    equals(iframeElement.style.styleFloat || iframeElement.style.cssFloat, "left", "Element in iframe correctly got css float copied over");
+    
+    start();
+  }, 1000);
+});
+
+
+test("Test copying styles that were set via style element", function() {
+  wysihtml5.dom
+    .insertCSS(["span#wysihtml5-test-span { font-size: 16px; }"])
+    .into(document);
+  
+  wysihtml5.dom
+    .copyStyles(["font-size"])
+    .from(this.span)
+    .to(this.div);
+  
+  equals(
+    wysihtml5.dom.getStyle("font-size").from(this.div), "16px", "Font-size correctly copied"
+  );
+});
\ No newline at end of file
diff --git a/test/dom/delegate_test.js b/test/dom/delegate_test.js
new file mode 100644
index 00000000..babca21a
--- /dev/null
+++ b/test/dom/delegate_test.js
@@ -0,0 +1,62 @@
+module("wysihtml5.dom.delegate", {
+  setup: function() {
+    this.container    = document.createElement("div");
+    this.link1        = document.createElement("a");
+    this.link2        = document.createElement("a");
+    this.nestedSpan   = document.createElement("span");
+    
+    this.link2.appendChild(this.nestedSpan);
+    this.container.appendChild(this.link1);
+    this.container.appendChild(this.link2);
+    
+    document.body.appendChild(this.container);
+  },
+  
+  teardown: function() {
+    this.container.parentNode.removeChild(this.container);
+  }
+});
+
+test("Basic test", function() {
+  expect(3);
+  
+  var that = this;
+  
+  wysihtml5.dom.delegate(this.container, "a", "click", function(event) {
+    ok(true, "Callback handler executed");
+    equals(this, that.link1, "Callback handler executed in correct scope");
+    ok(event.stopPropagation && event.preventDefault, "Parameter passed into callback handler is a proper event object");
+  });
+  
+  QUnit.triggerEvent(this.link1, "click");
+});
+
+test("Click on nested element works as well", function() {
+  expect(3);
+  
+  var that = this;
+  
+  wysihtml5.dom.delegate(this.container, "a", "click", function(event) {
+    ok(true, "Callback handler executed");
+    equals(this, that.link2, "Callback handler executed in correct scope");
+    ok(event.stopPropagation && event.preventDefault, "Parameter passed into callback handler is a proper event object");
+  });
+  
+  QUnit.triggerEvent(this.nestedSpan, "click");
+});
+
+test("Delegation on the body", function() {
+  expect(1);
+  
+  var delegater = wysihtml5.dom.delegate(document.body, ".delegation-test", "mousedown", function() {
+    ok(true, "Callback handler executed");
+  });
+  
+  this.link1.className = "delegation-test another-class";
+  
+  QUnit.triggerEvent(this.link1, "mousedown");
+  
+  delegater.stop();
+  
+  QUnit.triggerEvent(this.link1, "mousedown");
+});
\ No newline at end of file
diff --git a/test/utils/get_in_dom_element_test.js b/test/dom/get_as_dom_test.js
similarity index 56%
rename from test/utils/get_in_dom_element_test.js
rename to test/dom/get_as_dom_test.js
index 74203d72..9182dd38 100644
--- a/test/utils/get_in_dom_element_test.js
+++ b/test/dom/get_as_dom_test.js
@@ -1,13 +1,16 @@
-module("wysihtml5.utils.getInDomElement", {
+module("wysihtml5.dom.getAsDom", {
   teardown: function() {
-    $$("iframe.wysihtml5-sandbox").invoke("remove");
+    var iframe;
+    while (iframe = document.querySelector("iframe.wysihtml5-sandbox")) {
+      iframe.parentNode.removeChild(iframe);
+    }
   }
 });
 
 test("Basic test", function() {
   var result;
   
-  result = wysihtml5.utils.getInDomElement('<span id="get-in-dom-element-test">foo</span>');
+  result = wysihtml5.dom.getAsDom('<span id="get-in-dom-element-test">foo</span>');
   equals(result.nodeName, "DIV");
   equals(result.ownerDocument, document);
   equals(result.firstChild.nodeName, "SPAN");
@@ -15,10 +18,10 @@ test("Basic test", function() {
   equals(result.firstChild.innerHTML, "foo");
   ok(!document.getElementById("get-in-dom-element-test"));
   
-  result = wysihtml5.utils.getInDomElement("<i>1</i> <b>2</b>");
+  result = wysihtml5.dom.getAsDom("<i>1</i> <b>2</b>");
   equals(result.childNodes.length, 3);
   
-  result = wysihtml5.utils.getInDomElement(document.createElement("div"));
+  result = wysihtml5.dom.getAsDom(document.createElement("div"));
   equals(result.innerHTML.toLowerCase(), "<div></div>");
 });
 
@@ -26,11 +29,11 @@ test("Basic test", function() {
 test("HTML5 elements", function() {
   var result;
   
-  result = wysihtml5.utils.getInDomElement("<article><span>foo</span></article>");
+  result = wysihtml5.dom.getAsDom("<article><span>foo</span></article>");
   equals(result.firstChild.nodeName.toLowerCase(), "article");
   equals(result.firstChild.innerHTML.toLowerCase(), "<span>foo</span>");
   
-  result = wysihtml5.utils.getInDomElement("<output>foo</output>");
+  result = wysihtml5.dom.getAsDom("<output>foo</output>");
   equals(result.innerHTML.toLowerCase(), "<output>foo</output>");
 });
 
@@ -39,15 +42,15 @@ test("Different document context", function() {
   expect(2);
   stop(5000);
   
-  new wysihtml5.utils.Sandbox(function(sandbox) {
+  new wysihtml5.dom.Sandbox(function(sandbox) {
     var result;
     
-    result = wysihtml5.utils.getInDomElement("<div>hello</div>", sandbox.getDocument());
+    result = wysihtml5.dom.getAsDom("<div>hello</div>", sandbox.getDocument());
     equals(result.firstChild.ownerDocument, sandbox.getDocument());
     
-    result = wysihtml5.utils.getInDomElement("<header>hello</header>", sandbox.getDocument());
+    result = wysihtml5.dom.getAsDom("<header>hello</header>", sandbox.getDocument());
     equals(result.innerHTML.toLowerCase(), "<header>hello</header>");
     
     start();
-  }, { insertInto: document.body });
+  }).insertInto(document.body);
 });
\ No newline at end of file
diff --git a/test/utils/get_parent_element_test.js b/test/dom/get_parent_element_test.js
similarity index 56%
rename from test/utils/get_parent_element_test.js
rename to test/dom/get_parent_element_test.js
index 2f4aeae4..46ae91f8 100644
--- a/test/utils/get_parent_element_test.js
+++ b/test/dom/get_parent_element_test.js
@@ -1,6 +1,6 @@
-module("wysihtml5.utils.getParentElement", {
+module("wysihtml5.dom.getParentElement", {
   setup: function() {
-    this.container = new Element("div");
+    this.container = document.createElement("div");
   }
 });
 
@@ -8,25 +8,26 @@ module("wysihtml5.utils.getParentElement", {
 test("Basic test - nodeName only", function() {
   this.container.innerHTML = "<ul><li>foo</li></ul>";
   
-  var listItem = this.container.down("li"),
+  var listItem = this.container.querySelector("li"),
       textNode = listItem.firstChild,
-      list     = this.container.down("ul");
-  equals(wysihtml5.utils.getParentElement(listItem, { nodeName: "LI" }), listItem);
-  equals(wysihtml5.utils.getParentElement(listItem, { nodeName: ["LI", "UL"] }), listItem);
-  equals(wysihtml5.utils.getParentElement(listItem, { nodeName: "UL" }), list);
-  equals(wysihtml5.utils.getParentElement(textNode, { nodeName: "UL" }), list);
-  equals(wysihtml5.utils.getParentElement(listItem, { nodeName: "ul" }), null);
-  equals(wysihtml5.utils.getParentElement(listItem, { nodeName: "SPAN" }), null);
+      list     = this.container.querySelector("ul");
+  equals(wysihtml5.dom.getParentElement(listItem, { nodeName: "LI" }), listItem);
+  equals(wysihtml5.dom.getParentElement(listItem, { nodeName: ["LI", "UL"] }), listItem);
+  equals(wysihtml5.dom.getParentElement(listItem, { nodeName: "UL" }), list);
+  equals(wysihtml5.dom.getParentElement(textNode, { nodeName: "UL" }), list);
+  equals(wysihtml5.dom.getParentElement(listItem, { nodeName: "ul" }), null);
+  equals(wysihtml5.dom.getParentElement(listItem, { nodeName: "SPAN" }), null);
 });
 
 
 test("Check 'levels' param - nodeName only", function() {
-  this.container.innerHTML = "<div><div><ul><li></li></ul></blockquote></div></div>";
+  this.container.innerHTML = "<div><div><ul><li></li></ul></div></div>";
+  
+  var listItem  = this.container.querySelector("li"),
+      nestedDiv = this.container.querySelector("div").querySelector("div");
+  equals(wysihtml5.dom.getParentElement(listItem, { nodeName: "DIV" }, 2), null);
+  equals(wysihtml5.dom.getParentElement(listItem, { nodeName: "DIV" }, 3), nestedDiv);
   
-  var listItem  = this.container.down("li"),
-      nestedDiv = this.container.down("div div");
-  equals(wysihtml5.utils.getParentElement(listItem, { nodeName: "DIV" }, 2), null);
-  equals(wysihtml5.utils.getParentElement(listItem, { nodeName: "DIV" }, 3), nestedDiv);
 });
 
 
@@ -37,56 +38,56 @@ test("Basic test - nodeName + className", function() {
       textNode    = this.container.firstChild.firstChild,
       result;
   
-  result = wysihtml5.utils.getParentElement(textNode, {
+  result = wysihtml5.dom.getParentElement(textNode, {
     nodeName:   "SPAN",
     className:  "wysiwyg-color-green",
     classRegExp: /wysiwyg-color-[a-z]+/g
   });
   equals(result, spanElement);
   
-  result = wysihtml5.utils.getParentElement(textNode, {
+  result = wysihtml5.dom.getParentElement(textNode, {
     nodeName:   ["STRONG", "SPAN"],
     className:  "wysiwyg-color-green",
     classRegExp: /wysiwyg-color-[a-z]+/g
   });
   equals(result, spanElement);
   
-  result = wysihtml5.utils.getParentElement(textNode, {
+  result = wysihtml5.dom.getParentElement(textNode, {
     nodeName:   ["STRONG"],
     className:  "wysiwyg-color-green",
     classRegExp: /wysiwyg-color-[a-z]+/g
   });
   equals(result, null);
   
-  result = wysihtml5.utils.getParentElement(textNode, {
+  result = wysihtml5.dom.getParentElement(textNode, {
     nodeName:   "DIV",
     className:  "wysiwyg-color-green",
     classRegExp: /wysiwyg-color-[a-z]+/g
   });
   equals(result, null);
   
-  result = wysihtml5.utils.getParentElement(textNode, {
+  result = wysihtml5.dom.getParentElement(textNode, {
     nodeName:   "SPAN",
     className:  "wysiwyg-color-blue",
     classRegExp: /wysiwyg-color-[a-z]+/g
   });
   equals(result, null);
   
-  result = wysihtml5.utils.getParentElement(textNode, {
+  result = wysihtml5.dom.getParentElement(textNode, {
     nodeName:   "SPAN",
     className:  "wysiwyg-color-red",
     classRegExp: /wysiwyg-color-[a-z]+/g
   });
   equals(result, null);
   
-  result = wysihtml5.utils.getParentElement(spanElement, {
+  result = wysihtml5.dom.getParentElement(spanElement, {
     nodeName:   "SPAN",
     className:  "wysiwyg-color-green",
     classRegExp: /wysiwyg-color-[a-z]+/g
   });
   equals(result, spanElement);
   
-  result = wysihtml5.utils.getParentElement(spanElement, {
+  result = wysihtml5.dom.getParentElement(spanElement, {
     nodeName:   "span",
     className:  "wysiwyg-color-green",
     classRegExp: /wysiwyg-color-[a-z]+/g
@@ -98,18 +99,18 @@ test("Basic test - nodeName + className", function() {
 test("Check 'levels' param - nodeName + className", function() {
   this.container.innerHTML = '<div class="wysiwyg-color-green"><div class="wysiwyg-color-green"><ul><li></li></ul></blockquote></div></div>';
   
-  var listItem  = this.container.down("li"),
-      nestedDiv = this.container.down("div div"),
+  var listItem  = this.container.querySelector("li"),
+      nestedDiv = this.container.querySelector("div").querySelector("div"),
       result;
   
-  result = wysihtml5.utils.getParentElement(listItem, {
+  result = wysihtml5.dom.getParentElement(listItem, {
     nodeName:     "DIV",
     className:    "wysiwyg-color-green",
     classRegExp:  /wysiwyg-color-[a-z]+/g
   }, 2);
   equals(result, null);
   
-  result = wysihtml5.utils.getParentElement(listItem, {
+  result = wysihtml5.dom.getParentElement(listItem, {
     nodeName:     "DIV",
     className:    "wysiwyg-color-green",
     classRegExp:  /wysiwyg-color-[a-z]+/g
@@ -121,11 +122,11 @@ test("Check 'levels' param - nodeName + className", function() {
 test("Check  - no nodeName", function() {
   this.container.innerHTML = '<div><div class="wysiwyg-text-align-right"><span>foo</span></div></div>';
   
-  var spanElement = this.container.down("span"),
-      alignedDiv  = this.container.down("div div"),
+  var spanElement = this.container.querySelector("span"),
+      alignedDiv  = this.container.querySelector("div").querySelector("div"),
       result;
   
-  result = wysihtml5.utils.getParentElement(spanElement, {
+  result = wysihtml5.dom.getParentElement(spanElement, {
     className:    "wysiwyg-text-align-right",
     classRegExp:  /wysiwyg-text-align-[a-z]+/g
   });
@@ -135,11 +136,11 @@ test("Check  - no nodeName", function() {
 test("Test - with no nodeName", function() {
   this.container.innerHTML = '<div><div class="wysiwyg-text-align-right"><span>foo</span></div></div>';
   
-  var spanElement = this.container.down("span"),
-      alignedDiv  = this.container.down("div div"),
+  var spanElement = this.container.querySelector("span"),
+      alignedDiv  = this.container.querySelector("div").querySelector("div"),
       result;
   
-  result = wysihtml5.utils.getParentElement(spanElement, {
+  result = wysihtml5.dom.getParentElement(spanElement, {
     className:    "wysiwyg-text-align-right",
     classRegExp:  /wysiwyg-text-align-[a-z]+/g
   });
@@ -149,11 +150,11 @@ test("Test - with no nodeName", function() {
 test("Test - with only a classRegExp", function() {
   this.container.innerHTML = '<div><div class="wysiwyg-text-align-right"><span>foo</span></div></div>';
   
-  var spanElement = this.container.down("span"),
-      alignedDiv  = this.container.down("div div"),
+  var spanElement = this.container.querySelector("span"),
+      alignedDiv  = this.container.querySelector("div").querySelector("div"),
       result;
   
-  result = wysihtml5.utils.getParentElement(spanElement, {
+  result = wysihtml5.dom.getParentElement(spanElement, {
     classRegExp:  /wysiwyg-text-align-[a-z]+/g
   });
   equals(result, alignedDiv);
diff --git a/test/utils/get_style_test.js b/test/dom/get_style_test.js
similarity index 64%
rename from test/utils/get_style_test.js
rename to test/dom/get_style_test.js
index e426b231..5ef1143b 100644
--- a/test/utils/get_style_test.js
+++ b/test/dom/get_style_test.js
@@ -1,4 +1,4 @@
-module("wysihtml5.utils.getStyle", {
+module("wysihtml5.dom.getStyle", {
   setup: function() {
     this.container = document.createElement("div");
     document.body.appendChild(this.container);
@@ -11,7 +11,7 @@ module("wysihtml5.utils.getStyle", {
 
 
 test("Basic test", function() {
-  wysihtml5.utils.insertRules([
+  wysihtml5.dom.insertCSS([
     ".test-element-2 { position: absolute }"
   ]).into(document);
   
@@ -21,22 +21,22 @@ test("Basic test", function() {
   this.container.innerHTML += '<div></div>';
   
   equals(
-    wysihtml5.utils.getStyle(this.container.getElementsByTagName("span")[0], "float"),
+    wysihtml5.dom.getStyle("float").from(this.container.getElementsByTagName("span")[0]),
     "left"
   );
   
   equals(
-    wysihtml5.utils.getStyle(this.container.getElementsByTagName("span")[1], "position"),
+    wysihtml5.dom.getStyle("position").from(this.container.getElementsByTagName("span")[1]),
     "absolute"
   );
   
   equals(
-    wysihtml5.utils.getStyle(this.container.getElementsByTagName("div")[0], "display"),
+    wysihtml5.dom.getStyle("display").from(this.container.getElementsByTagName("div")[0]),
     "block"
   );
   
   equals(
-    wysihtml5.utils.getStyle(this.container.getElementsByTagName("i")[0], "display"),
+    wysihtml5.dom.getStyle("display").from(this.container.getElementsByTagName("i")[0]),
     "inline"
   );
 });
@@ -49,6 +49,6 @@ test("Textarea width/height when value causes overflow", function() {
   textarea.value = Array(500).join("Lorem ipsum dolor foo bar");
   this.container.appendChild(textarea);
   
-  equals(wysihtml5.utils.getStyle(textarea, "width"), "500px");
-  equals(wysihtml5.utils.getStyle(textarea, "height"), "200px");
+  equals(wysihtml5.dom.getStyle("width")  .from(textarea), "500px");
+  equals(wysihtml5.dom.getStyle("height") .from(textarea), "200px");
 });
\ No newline at end of file
diff --git a/test/dom/has_element_with_class_name_test.js b/test/dom/has_element_with_class_name_test.js
new file mode 100644
index 00000000..afed1bcc
--- /dev/null
+++ b/test/dom/has_element_with_class_name_test.js
@@ -0,0 +1,30 @@
+if ("querySelector" in document || wysihtml5.browser.supportsNativeGetElementsByClassName()) {
+  module("wysihtml5.dom.hasElementWithClassName", {
+    teardown: function() {
+      var iframe;
+      while (iframe = document.querySelector("iframe.wysihtml5-sandbox")) {
+        iframe.parentNode.removeChild(iframe);
+      }
+    }
+  });
+
+
+  test("Basic test", function() {
+    stop(4000);
+    expect(3);
+    
+    new wysihtml5.dom.Sandbox(function(sandbox) {
+      var doc         = sandbox.getDocument(),
+          tempElement = doc.createElement("i");
+      tempElement.className = "wysiwyg-color-aqua";
+
+      ok(!wysihtml5.dom.hasElementWithClassName(doc, "wysiwyg-color-aqua"));
+      doc.body.appendChild(tempElement);
+      ok(wysihtml5.dom.hasElementWithClassName(doc, "wysiwyg-color-aqua"));
+      tempElement.parentNode.removeChild(tempElement);
+      ok(!wysihtml5.dom.hasElementWithClassName(doc, "wysiwyg-color-aqua"));
+
+      start();
+    }).insertInto(document.body);
+  });
+}
diff --git a/test/dom/has_element_with_tag_name_test.js b/test/dom/has_element_with_tag_name_test.js
new file mode 100644
index 00000000..2126c692
--- /dev/null
+++ b/test/dom/has_element_with_tag_name_test.js
@@ -0,0 +1,26 @@
+module("wysihtml5.dom.hasElementWithTagName", {
+  teardown: function() {
+    var iframe;
+    while (iframe = document.querySelector("iframe.wysihtml5-sandbox")) {
+      iframe.parentNode.removeChild(iframe);
+    }
+  }
+});
+
+
+test("Basic test", function() {
+  stop(4000);
+  expect(3);
+  
+  new wysihtml5.dom.Sandbox(function(sandbox) {
+    var doc         = sandbox.getDocument(),
+        tempElement = doc.createElement("i");
+    ok(!wysihtml5.dom.hasElementWithTagName(doc, "I"));
+    doc.body.appendChild(tempElement);
+    ok(wysihtml5.dom.hasElementWithTagName(doc, "I"));
+    tempElement.parentNode.removeChild(tempElement);
+    ok(!wysihtml5.dom.hasElementWithTagName(doc, "I"));
+    
+    start();
+  }).insertInto(document.body);
+});
\ No newline at end of file
diff --git a/test/dom/insert_css_test.js b/test/dom/insert_css_test.js
new file mode 100644
index 00000000..d329a076
--- /dev/null
+++ b/test/dom/insert_css_test.js
@@ -0,0 +1,56 @@
+module("wysihtml5.dom.insertCSS", {
+  teardown: function() {
+    var iframe;
+    while (iframe = document.querySelector("iframe.wysihtml5-sandbox")) {
+      iframe.parentNode.removeChild(iframe);
+    }
+  }
+});
+
+test("Basic Tests with IE=Edge", function() {
+  expect(3);
+  stop();
+  
+  new wysihtml5.dom.Sandbox(function(sandbox) {
+    var doc     = sandbox.getDocument(),
+        body    = doc.body,
+        element = doc.createElement("sub");
+    
+    body.appendChild(element);
+    
+    wysihtml5.dom.insertCSS([
+      "sub  { display: block; text-align: right; }",
+      "body { text-indent: 50px; }"
+    ]).into(doc);
+    
+    equals(wysihtml5.dom.getStyle("display")    .from(element), "block");
+    equals(wysihtml5.dom.getStyle("text-align") .from(element), "right");
+    equals(wysihtml5.dom.getStyle("text-indent").from(element), "50px");
+    
+    start();
+  }, { uaCompatible: "IE=Edge" }).insertInto(document.body);
+});
+
+test("Basic Tests with IE=7", function() {
+  expect(3);
+  stop();
+  
+  new wysihtml5.dom.Sandbox(function(sandbox) {
+    var doc     = sandbox.getDocument(),
+        body    = doc.body,
+        element = doc.createElement("sub");
+    
+    body.appendChild(element);
+    
+    wysihtml5.dom.insertCSS([
+      "sub { display: block; text-align: right; }",
+      "body { text-indent: 50px; }"
+    ]).into(doc);
+    
+    equals(wysihtml5.dom.getStyle("display")    .from(element), "block");
+    equals(wysihtml5.dom.getStyle("text-align") .from(element), "right");
+    equals(wysihtml5.dom.getStyle("text-indent").from(body),    "50px");
+    
+    start();
+  }, { uaCompatible: "IE=7" }).insertInto(document.body);
+});
\ No newline at end of file
diff --git a/test/dom/observe_test.js b/test/dom/observe_test.js
new file mode 100644
index 00000000..f0a750f0
--- /dev/null
+++ b/test/dom/observe_test.js
@@ -0,0 +1,83 @@
+module("wysihtml5.dom.observe", {
+  setup: function() {
+    this.container  = document.createElement("div");
+    this.element    = document.createElement("textarea");
+    this.container.appendChild(this.element);
+    document.body.appendChild(this.container);
+  },
+  
+  teardown: function() {
+    this.container.parentNode.removeChild(this.container);
+    
+    var iframe;
+    while (iframe = document.querySelector("iframe.wysihtml5-sandbox")) {
+      iframe.parentNode.removeChild(iframe);
+    }
+  }
+});
+
+
+test("Basic test", function() {
+  expect(4);
+  
+  var element = this.element;
+  
+  wysihtml5.dom.observe(element, ["mouseover", "mouseout"], function(event) {
+    ok(true, "'" + event.type + "' correctly fired");
+  });
+  
+  wysihtml5.dom.observe(element, "click", function(event) {
+    equals(event.target, element, "event.target or event.srcElement are set");
+    ok(true, "'click' correctly fired");
+  });
+  
+  QUnit.triggerEvent(element, "mouseover");
+  QUnit.triggerEvent(element, "mouseout");
+  QUnit.triggerEvent(element, "click");
+});
+
+
+test("Test stopPropagation and scope of event handler", function(event) {
+  expect(2);
+  var element = this.element;
+  
+  wysihtml5.dom.observe(this.container, "click", function(event) {
+    ok(false, "The event shouldn't have been bubbled!");
+  });
+  
+  wysihtml5.dom.observe(this.element, "click", function(event) {
+    event.stopPropagation();
+    equals(this, element, "Event handler bound to correct scope");
+    ok(true, "stopPropagation correctly fired");
+  });
+  
+  QUnit.triggerEvent(this.element, "click");
+});
+
+test("Test detaching events", function() {
+  var eventListener = wysihtml5.dom.observe(this.element, "click", function() {
+    ok(false, "This should not be triggered");
+  });
+  
+  eventListener.stop();
+  QUnit.triggerEvent(this.element, "click");
+});
+
+test("Advanced test observing within a sandboxed iframe", function() {
+  expect(2);
+  stop(2000);
+  
+  var sandbox = new wysihtml5.dom.Sandbox(function() {
+    var element = sandbox.getDocument().createElement("div");
+    sandbox.getDocument().body.appendChild(element);
+    wysihtml5.dom.observe(element, ["click", "mousedown"], function(event) {
+      ok(true, "'" + event.type + "' correctly fired");
+    });
+    QUnit.triggerEvent(element, "click");
+    QUnit.triggerEvent(element, "mousedown");
+    
+    start();
+  });
+  
+  sandbox.insertInto(document.body);
+});
\ No newline at end of file
diff --git a/test/utils/sanitize_html_test.js b/test/dom/parse_test.js
similarity index 91%
rename from test/utils/sanitize_html_test.js
rename to test/dom/parse_test.js
index d2c34eae..6bd4ddcf 100644
--- a/test/utils/sanitize_html_test.js
+++ b/test/dom/parse_test.js
@@ -1,8 +1,8 @@
-if (wysihtml5.browserSupports.contentEditable()) {
+if (wysihtml5.browser.supported()) {
 
-  module("wysihtml5.utils.sanitizeHTML", {
+  module("wysihtml5.dom.parse", {
     sanitize: function(html, rules, context, cleanUp) {
-      return wysihtml5.utils.sanitizeHTML(html, rules, context, cleanUp);
+      return wysihtml5.dom.parse(html, rules, context, cleanUp);
     },
 
     equals: function(actual, expected, message) {
@@ -104,7 +104,7 @@ if (wysihtml5.browserSupports.contentEditable()) {
       ),
       '<h2>take this you snorty little sanitizer</h2>' +
       '<h2>yes, you!</h2>' +
-      '<span><img alt="foo" border="1" height="10" src="http://foo.gif" width="10"></span>' +
+      '<span><img alt="foo" border="1" src="http://foo.gif" height="10" width="10"></span>' +
       '<span><i title=""></i></span>'
     );
   });
@@ -115,8 +115,8 @@ if (wysihtml5.browserSupports.contentEditable()) {
       tags: { p: true, span: true, div: true }
     };
     
-    var result = this.sanitize('<SPAN><P><SPAN><div>MINDESTENS</div>', rules);
-    ok(result.indexOf("MINDESTENS") === result.lastIndexOf("MINDESTENS"));
+    var result = this.sanitize('<SPAN><P><SPAN><div>FOO</div>', rules);
+    ok(result.indexOf("FOO") === result.lastIndexOf("FOO"));
   });
   
   
@@ -473,4 +473,33 @@ if (wysihtml5.browserSupports.contentEditable()) {
       "Allowed classes 'c' is correctly kept and unknown class 'b' is correctly removed."
     );
   });
+  
+  test("Check Firefox misbehavior with tilde characters in urls", function() {
+    var rules = {
+      tags: {
+        a: {
+          set_attributes: {
+            target: "_blank",
+            rel:    "nofollow"
+          },
+          check_attributes: {
+            href:   "url"
+          }
+        }
+      }
+    };
+    
+    // See https://bugzilla.mozilla.org/show_bug.cgi?id=664398
+    //
+    // In Firefox this:
+    //      var d = document.createElement("div");
+    //      d.innerHTML ='<a href="~"></a>';
+    //      d.innerHTML;
+    // will result in:
+    //      <a href="%7E"></a>
+    // which is wrong
+    ok(
+      this.sanitize('<a href="http://google.com/~foo"></a>', rules).indexOf("~") !== -1
+    );
+  });
 }
\ No newline at end of file
diff --git a/test/utils/rename_element_test.js b/test/dom/rename_element_test.js
similarity index 76%
rename from test/utils/rename_element_test.js
rename to test/dom/rename_element_test.js
index 2e263d32..9136e6f9 100644
--- a/test/utils/rename_element_test.js
+++ b/test/dom/rename_element_test.js
@@ -1,11 +1,11 @@
-module("wysihtml5.utils.renameElement", {
+module("wysihtml5.dom.renameElement", {
   equals: function(actual, expected, message) {
     return wysihtml5.assert.htmlEquals(actual, expected, message);
   },
   
   renameElement: function(html, newNodeName) {
-    var container = wysihtml5.utils.getInDomElement(html);
-    wysihtml5.utils.renameElement(container.firstChild, newNodeName);
+    var container = wysihtml5.dom.getAsDom(html);
+    wysihtml5.dom.renameElement(container.firstChild, newNodeName);
     return container.innerHTML;
   }
 });
diff --git a/test/utils/resolve_list_test.js b/test/dom/resolve_list_test.js
similarity index 69%
rename from test/utils/resolve_list_test.js
rename to test/dom/resolve_list_test.js
index 9a8ac3ba..8e63d4ee 100644
--- a/test/utils/resolve_list_test.js
+++ b/test/dom/resolve_list_test.js
@@ -1,24 +1,15 @@
-module("wysihtml5.utils.resolveList", {
+module("wysihtml5.dom.resolveList", {
   equals: function(actual, expected, message) {
     return wysihtml5.assert.htmlEquals(actual, expected, message);
   },
   
   resolveList: function(html) {
-    var container = wysihtml5.utils.getInDomElement(html);
+    var container = wysihtml5.dom.getAsDom(html);
     document.body.appendChild(container);
-    this.elements.push(container);
-    wysihtml5.utils.resolveList(container.firstChild);
-    return container.innerHTML;
-  },
-  
-  setup: function() {
-    this.elements = [];
-  },
-  
-  teardown: function() {
-    this.elements.each(function(element) {
-      Element.remove(element);
-    });
+    wysihtml5.dom.resolveList(container.firstChild);
+    var innerHTML = container.innerHTML;
+    container.parentNode.removeChild(container);
+    return innerHTML;
   }
 });
 
diff --git a/test/utils/sandbox_test.js b/test/dom/sandbox_test.js
similarity index 55%
rename from test/utils/sandbox_test.js
rename to test/dom/sandbox_test.js
index f53bdd22..8de40945 100644
--- a/test/utils/sandbox_test.js
+++ b/test/dom/sandbox_test.js
@@ -1,6 +1,9 @@
-module("wysihtml5.utils.Sandbox", {
+module("wysihtml5.dom.Sandbox", {
   teardown: function() {
-    $$("iframe.wysihtml5-sandbox").invoke("stopObserving").invoke("remove");
+    var iframe;
+    while (iframe = document.querySelector("iframe.wysihtml5-sandbox")) {
+      iframe.parentNode.removeChild(iframe);
+    }
   },
   
   getCharset: function(doc) {
@@ -21,7 +24,7 @@ module("wysihtml5.utils.Sandbox", {
   
   isUnset: function(evalCode, iframeWindow) {
     var value = this.eval(iframeWindow, evalCode);
-    return !value || value == Prototype.emptyFunction;
+    return !value || value == wysihtml5.EMPTY_FUNCTION;
   }
 });
 
@@ -30,14 +33,14 @@ test("Basic Test", function() {
   expect(8);
   stop(5000);
   
-  var sandbox = new wysihtml5.utils.Sandbox(function(param) {
+  var sandbox = new wysihtml5.dom.Sandbox(function(param) {
     equals(param, sandbox, "The parameter passed into the readyCallback is the sandbox instance");
     
-    var iframes = $$("iframe.wysihtml5-sandbox");
+    var iframes = document.querySelectorAll("iframe.wysihtml5-sandbox");
     equals(iframes.length, 1, "iFrame sandbox inserted into dom tree");
     
-    var iframe = iframes.last(),
-        isIframeInvisible = iframe.width == iframe.height == iframe.frameBorder == 0;
+    var iframe = iframes[iframes.length - 1],
+        isIframeInvisible = iframe.width == 0 && iframe.height == 0 && iframe.frameBorder == 0;
     ok(isIframeInvisible, "iframe is not visible");
     
     var isSandboxed = iframe.getAttribute("security") == "restricted";
@@ -50,10 +53,12 @@ test("Basic Test", function() {
     ok(isDocumentObject, "wysihtml5.Sandbox.prototype.getDocument() works properly");
     
     equals(sandbox.getIframe(), iframe, "wysihtml5.Sandbox.prototype.getIframe() returns the iframe correctly");
-    ok(Object.isFunction(sandbox.getWindow().onerror), "window.onerror is set");
+    equals(typeof(sandbox.getWindow().onerror), "function", "window.onerror is set");
     
     start();
-  }, { insertInto: document.body });
+  });
+  
+  sandbox.insertInto(document.body);
 });
 
 
@@ -61,32 +66,38 @@ test("Security test #1", function() {
   expect(14);
   stop(5000);
   
-  var sandbox = new wysihtml5.utils.Sandbox(function() {
+  var that = this;
+  
+  var sandbox = new wysihtml5.dom.Sandbox(function() {
     var iframeWindow = sandbox.getWindow();
     
-    if (Prototype.Browser.WebKit || !window.chrome) {
+    var isSafari = wysihtml5.browser.USER_AGENT.indexOf("Safari") !== -1 && wysihtml5.browser.USER_AGENT.indexOf("Chrome") === 1;
+    
+    if (isSafari) {
       // This test fails in Safari 5, as it's impossible to unset a cookie there
-      ok(true, "Cookie is NOT unset (but expected in Safari)");
+      ok(true, "Cookie is NOT unset (but that's expected in Safari)");
     } else {
-      ok(this.isUnset("document.cookie", iframeWindow), "Cookie is unset");
+      ok(that.isUnset("document.cookie", iframeWindow), "Cookie is unset");
     }
     
-    ok(this.isUnset("document.open", iframeWindow), "document.open is unset");
-    ok(this.isUnset("document.write", iframeWindow), "document.write is unset");
-    ok(this.isUnset("window.parent", iframeWindow), "window.parent is unset");
-    ok(this.isUnset("window.opener", iframeWindow), "window.opener is unset");
-    ok(this.isUnset("window.localStorage", iframeWindow), "localStorage is unset");
-    ok(this.isUnset("window.globalStorage", iframeWindow), "globalStorage is unset");
-    ok(this.isUnset("window.XMLHttpRequest", iframeWindow), "XMLHttpRequest is an empty function");
-    ok(this.isUnset("window.XDomainRequest", iframeWindow), "XDomainRequest is an empty function");
-    ok(this.isUnset("window.alert", iframeWindow), "alert is an empty function");
-    ok(this.isUnset("window.prompt", iframeWindow), "prompt is an empty function");
-    ok(this.isUnset("window.openDatabase", iframeWindow), "window.openDatabase is unset");
-    ok(this.isUnset("window.indexedDB", iframeWindow), "window.indexedDB is unset");
-    ok(this.isUnset("window.postMessage", iframeWindow), "window.openDatabase is unset");
+    ok(that.isUnset("document.open", iframeWindow),         "document.open is unset");
+    ok(that.isUnset("document.write", iframeWindow),        "document.write is unset");
+    ok(that.isUnset("window.parent", iframeWindow),         "window.parent is unset");
+    ok(that.isUnset("window.opener", iframeWindow),         "window.opener is unset");
+    ok(that.isUnset("window.localStorage", iframeWindow),   "localStorage is unset");
+    ok(that.isUnset("window.globalStorage", iframeWindow),  "globalStorage is unset");
+    ok(that.isUnset("window.XMLHttpRequest", iframeWindow), "XMLHttpRequest is an empty function");
+    ok(that.isUnset("window.XDomainRequest", iframeWindow), "XDomainRequest is an empty function");
+    ok(that.isUnset("window.alert", iframeWindow),          "alert is an empty function");
+    ok(that.isUnset("window.prompt", iframeWindow),         "prompt is an empty function");
+    ok(that.isUnset("window.openDatabase", iframeWindow),   "window.openDatabase is unset");
+    ok(that.isUnset("window.indexedDB", iframeWindow),      "window.indexedDB is unset");
+    ok(that.isUnset("window.postMessage", iframeWindow),    "window.openDatabase is unset");
     
     start();
-  }.bind(this), { insertInto: document.body });
+  });
+  
+  sandbox.insertInto(document.body);
 });
 
 
@@ -94,21 +105,19 @@ test("Security test #2", function() {
   expect(2);
   stop(5000);
   
-  var sandbox = new wysihtml5.utils.Sandbox(function() {
-    var html = '<img src="#{data_uri}" onerror="#{script}" onload="#{script}">'.interpolate({
-          script:   "try { window.parent._hackedCookie=document.cookie; } catch(e){}; try { window.parent._hackedVariable=1; } catch(e) {}",
-          data_uri: "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
-        });
-    
+  var sandbox = new wysihtml5.dom.Sandbox(function() {
+    var html = '<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" onerror="#{script}" onload="try { window.parent._hackedCookie=document.cookie; } catch(e){}; try { window.parent._hackedVariable=1; } catch(e) {}">';
     sandbox.getDocument().body.innerHTML = html;
     
-    (function() {
-      equals(window._hackedCookie || "", "", "Cookie can't be easily stolen");
+    setTimeout(function() {
+      equals(window._hackedCookie   || "", "", "Cookie can't be easily stolen");
       equals(window._hackedVariable || 0, 0, "iFrame has no access to parent");
       
       start();
-    }).delay(2);
-  }.bind(this), { insertInto: document.body });
+    }, 2000);
+  });
+  
+  sandbox.insertInto(document.body);
 });
 
 
@@ -116,20 +125,24 @@ test("Check charset & doctype", function() {
   expect(3);
   stop(5000);
   
-  var sandbox = new wysihtml5.utils.Sandbox(function() {
+  var that = this;
+  
+  var sandbox = new wysihtml5.dom.Sandbox(function() {
     var iframeDocument = sandbox.getDocument(),
         isQuirksMode   = iframeDocument.compatMode == "BackCompat";
     
     ok(!isQuirksMode, "iFrame isn't in quirks mode");
-    equals(this.getCharset(iframeDocument), this.getCharset(document), "Charset correctly inherited by iframe");
+    equals(that.getCharset(iframeDocument), that.getCharset(document), "Charset correctly inherited by iframe");
     
     iframeDocument.body.innerHTML = '<meta charset="iso-8859-1">&uuml;';
     
     setTimeout(function() {
-      equals(this.getCharset(iframeDocument), this.getCharset(document), "Charset isn't overwritten");
+      equals(that.getCharset(iframeDocument), that.getCharset(document), "Charset isn't overwritten");
       start();
-    }.bind(this), 500);
-  }.bind(this), { insertInto: document.body });
+    }, 500);
+  });
+  
+  sandbox.insertInto(document.body);
 });
 
 
@@ -137,14 +150,13 @@ test("Check insertion of single stylesheet", function() {
   stop(5000);
   expect(1);
   
-  new wysihtml5.utils.Sandbox(function(sandbox) {
+  new wysihtml5.dom.Sandbox(function(sandbox) {
     var doc = sandbox.getDocument();
     equals(doc.getElementsByTagName("link").length, 1, "Correct amount of stylesheets inserted into the dom tree");
     start();
   }, {
-    insertInto:  document.body,
     stylesheets: "https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/blitzer/jquery-ui.css"
-  });
+  }).insertInto(document.body);
 });
 
 
@@ -152,17 +164,16 @@ test("Check insertion of multiple stylesheets", function() {
   stop(5000);
   expect(1);
   
-  new wysihtml5.utils.Sandbox(function(sandbox) {
+  new wysihtml5.dom.Sandbox(function(sandbox) {
     var doc = sandbox.getDocument();
     equals(doc.getElementsByTagName("link").length, 2, "Correct amount of stylesheets inserted into the dom tree");
     start();
   }, {
-    insertInto:  document.body,
     stylesheets: [
       "https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/blitzer/jquery-ui.css",
       "https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/excite-bike/jquery-ui.css"
     ]
-  });
+  }).insertInto(document.body);
 });
 
 
@@ -170,18 +181,15 @@ test("Check X-UA-Compatible meta tag #1", function() {
   stop(5000);
   expect(2);
   
-  new wysihtml5.utils.Sandbox(function(sandbox) {
+  new wysihtml5.dom.Sandbox(function(sandbox) {
     var doc                 = sandbox.getDocument(),
-        metaTags            = $A(doc.getElementsByTagName("meta")),
-        uaCompatibleMetaTag = metaTags.find(function(metaTag) { return metaTag.httpEquiv === "X-UA-Compatible"; });
+        uaCompatibleMetaTag = doc.querySelector("meta[http-equiv='X-UA-Compatible']");
     ok(uaCompatibleMetaTag, "X-UA-Compatible meta tag found");
     if (uaCompatibleMetaTag) {
       equals(uaCompatibleMetaTag.getAttribute("content"), "IE=Edge", "X-UA-Compatible correctly set");
     }
     start();
-  }, {
-    insertInto:  document.body
-  });
+  }).insertInto(document.body);
 });
 
 
@@ -189,11 +197,10 @@ test("Check X-UA-Compatible meta tag #2", function() {
   stop(5000);
   expect(3);
   
-  new wysihtml5.utils.Sandbox(function(sandbox) {
+  new wysihtml5.dom.Sandbox(function(sandbox) {
     var doc                 = sandbox.getDocument(),
         docMode             = doc.documentMode || 7,
-        metaTags            = $A(doc.getElementsByTagName("meta")),
-        uaCompatibleMetaTag = metaTags.find(function(metaTag) { return metaTag.httpEquiv === "X-UA-Compatible"; });
+        uaCompatibleMetaTag = doc.querySelector("meta[http-equiv='X-UA-Compatible']");
         
     ok(uaCompatibleMetaTag, "X-UA-Compatible meta tag found");
     
@@ -203,7 +210,6 @@ test("Check X-UA-Compatible meta tag #2", function() {
     }
     start();
   }, {
-    insertInto:   document.body,
     uaCompatible: "IE=7"
-  });
+  }).insertInto(document.body);
 });
\ No newline at end of file
diff --git a/test/dom/set_attributes_test.js b/test/dom/set_attributes_test.js
new file mode 100644
index 00000000..660fa747
--- /dev/null
+++ b/test/dom/set_attributes_test.js
@@ -0,0 +1,15 @@
+module("wysihtml5.dom.setAttributes", {
+  setup: function() {
+    this.element = document.createElement("div");
+  }
+});
+
+test("Basic test", function() {
+  wysihtml5.dom.setAttributes({
+    id:       "foo",
+    "class":  "bar"
+  }).on(this.element);
+  
+  equals(this.element.id, "foo");
+  equals(this.element.className, "bar");
+});
\ No newline at end of file
diff --git a/test/dom/set_styles_test.js b/test/dom/set_styles_test.js
new file mode 100644
index 00000000..6b8dbaf8
--- /dev/null
+++ b/test/dom/set_styles_test.js
@@ -0,0 +1,19 @@
+module("wysihtml5.dom.setStyles", {
+  setup: function() {
+    this.element = document.createElement("div");
+    document.body.appendChild(this.element);
+  },
+  
+  teardown: function() {
+    this.element.parentNode.removeChild(this.element);
+  }
+});
+
+test("Basic test", function() {
+  wysihtml5.dom.setStyles("text-align: right; float: left").on(this.element);
+  equals(wysihtml5.dom.getStyle("text-align").from(this.element), "right");
+  equals(wysihtml5.dom.getStyle("float").from(this.element),      "left");
+  
+  wysihtml5.dom.setStyles({ "float": "right" }).on(this.element);
+  equals(wysihtml5.dom.getStyle("float").from(this.element), "right");
+});
\ No newline at end of file
diff --git a/test/editor_test.js b/test/editor_test.js
index 9a73af78..a8e40a66 100644
--- a/test/editor_test.js
+++ b/test/editor_test.js
@@ -1,47 +1,32 @@
-if (wysihtml5.browserSupports.contentEditable()) {
-  module("wysihtml5.Editor - compatible", {
+if (wysihtml5.browser.supported()) {
+  module("wysihtml5.Editor", {
     setup: function() {
-      this.insertCss("#wysihtml5-test-textarea { width: 200px; height: 100px; margin-top: 5px; font-style: italic; border: 2px solid red; }");
-      this.insertCss("#wysihtml5-test-textarea:focus { margin-top: 10px; }");
+      wysihtml5.dom.insertCSS([
+        "#wysihtml5-test-textarea { width: 200px; height: 100px; margin-top: 5px; font-style: italic; border: 2px solid red; }",
+        "#wysihtml5-test-textarea:focus { margin-top: 10px; }"
+      ]).into(document);
 
-      this.textareaElement = new Element("textarea", {
-        id:    "wysihtml5-test-textarea",
-        title: "Please enter your foo"
-      });
-      this.textareaElement.value = "hey tiff, what's up?";
+      this.textareaElement        = document.createElement("textarea");
+      this.textareaElement.id     = "wysihtml5-test-textarea";
+      this.textareaElement.title  = "Please enter your foo";
+      this.textareaElement.value  = "hey tiff, what's up?";
       
-      this.form = new Element("form");
-      this.form.observe("submit", function(event) { event.preventDefault(); });
-      this.form.insert(this.textareaElement);
+      this.form = document.createElement("form");
+      this.form.onsubmit = function() { return false; };
+      this.form.appendChild(this.textareaElement);
       
       this.originalBodyClassName = document.body.className;
       
-      this.originalKeyReturn = Event.KEY_RETURN;
-      this.originalAjaxRequest = window.Ajax.Request;
-
-      $(document.body).insert(this.form);
+      document.body.appendChild(this.form);
     },
 
     teardown: function() {
-      [$$("iframe.wysihtml5-sandbox"), $$("input[name='_wysihtml5_mode']"), this.form].flatten().invoke("remove");
-      Event.KEY_RETURN = this.originalKeyReturn;
-      window.Ajax.Request = this.originalAjaxRequest;
-      
-      document.body.className = this.originalBodyClassName;
-    },
-
-    insertCss: function(css) {
-      var styleElement = new Element("style", { type: "text/css" });
-      if (styleElement.styleSheet) {
-        styleElement.styleSheet.cssText = css;
-      } else {
-        styleElement.appendChild(document.createTextNode(css));
+      var leftover;
+      while (leftover = document.querySelector("iframe.wysihtml5-sandbox, input[name='_wysihtml5_mode']")) {
+        leftover.parentNode.removeChild(leftover);
       }
-      $$("head, body")[0].insert(styleElement);
-    },
-
-    getTextContent: function(element) {
-      return ("innerText" in element ? element.innerText : element.textContent).strip();
+      this.form.parentNode.removeChild(this.form);
+      document.body.className = this.originalBodyClassName;
     },
 
     getComposerElement: function() {
@@ -49,45 +34,51 @@ if (wysihtml5.browserSupports.contentEditable()) {
     },
 
     getIframeElement: function() {
-      return $$("iframe.wysihtml5-sandbox").last();
+      var iframes = document.querySelectorAll("iframe.wysihtml5-sandbox");
+      return iframes[iframes.length - 1];
     }
   });
   
   test("Basic test", function() {
-    expect(17);
+    expect(16);
     stop(2000);
-  
+    
+    var that = this;
+    
     var editor = new wysihtml5.Editor(this.textareaElement);
     editor.observe("load", function() {
-      var iframeElement = this.getIframeElement(),
-          composerElement = this.getComposerElement(),
-          textareaElement = this.textareaElement;
+      var iframeElement   = that.getIframeElement(),
+          composerElement = that.getComposerElement(),
+          textareaElement = that.textareaElement;
       ok(true, "Load callback triggered");
-      ok($(document.body).hasClassName("wysihtml5-supported"), "<body> received correct class name");
-      ok(!textareaElement.visible(), "Textarea not visible");
-      ok(iframeElement.visible(), "Editor iFrame is visible");
+      ok(wysihtml5.dom.hasClass(document.body, "wysihtml5-supported"), "<body> received correct class name");
+      equals(textareaElement.style.display, "none", "Textarea not visible");
+      ok(iframeElement.style.display, "", "Editor iFrame is visible");
       equals(editor.currentView.name, "composer", "Current view is 'composer'");
       
       // Make textarea visible for a short amount of time, in order to calculate dimensions properly
-      textareaElement.show();
-      same(iframeElement.getDimensions(), textareaElement.getDimensions(), "Editor has the same dimensions as the original textarea");
-      textareaElement.hide();
-      
-      var hiddenField = textareaElement.next();
+      textareaElement.style.display = "";
+      same(
+        [iframeElement.offsetHeight,    iframeElement.offsetWidth],
+        [textareaElement.offsetHeight,  textareaElement.offsetWidth],
+        "Editor has the same dimensions as the original textarea"
+      );
+      textareaElement.style.display = "none";
+      
+      var hiddenField = textareaElement.nextSibling;
       equals(hiddenField.name, "_wysihtml5_mode", "Hidden field has correct name");
       equals(hiddenField.value, "1", "Hidden field has correct value");
       equals(hiddenField.type, "hidden", "Hidden field is actually hidden");
-      equals(textareaElement.next().next(), iframeElement, "Editor iframe is inserted after the textarea");
+      equals(textareaElement.nextSibling.nextSibling, iframeElement, "Editor iframe is inserted after the textarea");
       equals(composerElement.getAttribute("contentEditable"), "true", "Body element in iframe is editable");
-      equals(editor.textarea.element, textareaElement, "Textarea correctly set on editor instance");
-      equals(editor.composer.element, composerElement, "Textarea correctly set on editor instance");
-      equals(wysihtml5.utils.getStyle(composerElement, "font-style"), "italic", "Correct font-style applied to editor element");
+      equals(editor.textarea.element, textareaElement, "Textarea correctly available on editor instance");
+      equals(editor.composer.element, composerElement, "contentEditable element available on editor instance");
+      equals(wysihtml5.dom.getStyle("font-style").from(composerElement), "italic", "Correct font-style applied to editor element");
       equals(composerElement.innerHTML.toLowerCase(), "hey tiff, what's up?", "Copied the initial textarea value to the editor");
-      ok(textareaElement.retrieve("wysihtml5") === editor, "Instance of editor correctly stored on textarea");
-      ok(Element.hasClassName(composerElement, "wysihtml5-editor"), "Editor element has correct class name");
+      ok(wysihtml5.dom.hasClass(composerElement, "wysihtml5-editor"), "Editor element has correct class name");
       
       start();
-    }.bind(this));
+    });
   });
 
 
@@ -97,61 +88,72 @@ if (wysihtml5.browserSupports.contentEditable()) {
     
     this.textareaElement.className = "death-star";
     
-    var name   = "star-wars-input",
+    var that   = this,
+        name   = "star-wars-input",
         editor = new wysihtml5.Editor(this.textareaElement, { name: "star-wars-input" });
     
     editor.observe("load", function() {
-      var iframeElement   = this.getIframeElement(),
-          composerElement = this.getComposerElement(),
-          textareaElement = this.textareaElement;
-      ok(Element.hasClassName(iframeElement, name), "iFrame has adopted name as className");
-      ok(Element.hasClassName(composerElement, name), "iFrame's body has adopted name as className");
-      ok(Element.hasClassName(composerElement, "death-star"), "iFrame's body has adopted the textarea className");
-      ok(!Element.hasClassName(textareaElement, name), "Textarea has not adopted name as className");
+      var iframeElement   = that.getIframeElement(),
+          composerElement = that.getComposerElement(),
+          textareaElement = that.textareaElement;
+      ok(wysihtml5.dom.hasClass(iframeElement, name), "iFrame has adopted name as className");
+      ok(wysihtml5.dom.hasClass(composerElement, name), "iFrame's body has adopted name as className");
+      ok(wysihtml5.dom.hasClass(composerElement, "death-star"), "iFrame's body has adopted the textarea className");
+      ok(!wysihtml5.dom.hasClass(textareaElement, name), "Textarea has not adopted name as className");
       start();
-    }.bind(this));
+    });
   });
 
 
   test("Check textarea with box-sizing: border-box;", function() {
     expect(1);
     stop(2000);
-  
-    this.textareaElement.setStyle({
+    
+    var that = this;
+    
+    wysihtml5.dom.setStyles({
       MozBoxSizing:     "border-box",
       WebkitBoxSizing:  "border-box",
       MsBoxSizing:      "border-box",
       boxSizing:        "border-box"
-    });
+    }).on(this.textareaElement);
   
     var editor = new wysihtml5.Editor(this.textareaElement);
     editor.observe("load", function() {
       // Make textarea visible for a short amount of time, in order to calculate dimensions properly
-      this.textareaElement.show();
-      same(this.getIframeElement().getDimensions(), this.textareaElement.getDimensions(), "Editor has the same dimensions as the original textarea");
-      this.textareaElement.hide();
+      that.textareaElement.style.display = "";
+      same(
+        [that.getIframeElement().offsetWidth, that.getIframeElement().offsetHeight],
+        [that.textareaElement.offsetWidth,    that.textareaElement.offsetHeight],
+        "Editor has the same dimensions as the original textarea"
+      );
+      that.textareaElement.style.display = "none";
     
       start();
-    }.bind(this));
+    });
   });
 
 
   test("Check whether attributes are copied", function() {
     expect(1);
     stop(2000);
-  
+    
+    var that = this;
+    
     var editor = new wysihtml5.Editor(this.textareaElement);
     editor.observe("load", function() {
-      equals(this.getComposerElement().title, this.textareaElement.title, "Editor got attributes copied over from textarea");
+      equals(that.getComposerElement().title, that.textareaElement.title, "Editor got attributes copied over from textarea");
       start();
-    }.bind(this));
+    });
   });
 
 
   test("Check events", function() {
     expect(8);
     stop(2000);
-  
+    
+    var that = this;
+    
     var editor = new wysihtml5.Editor(this.textareaElement);
     
     editor.observe("beforeload", function() {
@@ -159,8 +161,8 @@ if (wysihtml5.browserSupports.contentEditable()) {
     });
     
     editor.observe("load", function() {
-      var composerElement = this.getComposerElement(),
-          iframeElement   = this.getIframeElement();
+      var composerElement = that.getComposerElement(),
+          iframeElement   = that.getIframeElement();
       
       editor.observe("focus", function() {
         ok(true, "'focus' event correctly fired");
@@ -191,7 +193,7 @@ if (wysihtml5.browserSupports.contentEditable()) {
       composerElement.innerHTML = "foobar";
       QUnit.triggerEvent(composerElement, "blur");
       QUnit.triggerEvent(composerElement, "focusout");
-      equals(wysihtml5.utils.getStyle(iframeElement, "margin-top"), "5px", ":focus styles are correctly unset");
+      equals(wysihtml5.dom.getStyle("margin-top").from(iframeElement), "5px", ":focus styles are correctly unset");
       QUnit.triggerEvent(composerElement, "paste");
       QUnit.triggerEvent(composerElement, "drop");
       
@@ -200,68 +202,73 @@ if (wysihtml5.browserSupports.contentEditable()) {
       // Delay teardown in order to avoid unwanted js errors caused by a too early removed sandbox iframe
       // which then causes js errors in Safari 5
       setTimeout(function() { start(); }, 100);
-    }.bind(this));
+    });
   });
 
 
   test("Check sync (basic)", function() {
     expect(1);
     stop(2500);
-  
+    
+    var that = this;
+    
     var editor = new wysihtml5.Editor(this.textareaElement);
     editor.observe("load", function() {
       var html = "<p>hello foobar, what up?</p>";
-      this.getComposerElement().innerHTML = html;
+      that.getComposerElement().innerHTML = html;
     
       setTimeout(function() {
-        equals(this.textareaElement.value.toLowerCase(), html.toLowerCase(), "Editor content got correctly copied over to original textarea");
+        equals(that.textareaElement.value.toLowerCase(), html.toLowerCase(), "Editor content got correctly copied over to original textarea");
         start();
-      }.bind(this), 500);
-    }.bind(this));
+      }, 500);
+    });
   });
   
   
   test("Check sync (advanced)", function() {
     expect(5);
     stop(4000);
-  
+    
+    var that = this;
+    
     var editor = new wysihtml5.Editor(this.textareaElement, {
       parserRules: { tags: { "strong": true } }
     });
+    
     editor.observe("load", function() {
       var html = "<strong>timmay!</strong>",
-          composerElement = this.getComposerElement();
+          composerElement = that.getComposerElement();
       composerElement.innerHTML = html;
       
       setTimeout(function() {
-        equals(this.textareaElement.value.toLowerCase(), html.toLowerCase(), "Editor content got correctly copied over to original textarea");
+        equals(that.textareaElement.value.toLowerCase(), html.toLowerCase(), "Editor content got correctly copied over to original textarea");
         
         composerElement.innerHTML = "<font color=\"red\">hey </font><strong>helen!</strong>";
         editor.fire("change_view", "textarea");
-        equals(this.textareaElement.value.toLowerCase(), "hey <strong>helen!</strong>", "Editor got immediately copied over to textarea after switching the view");
+        equals(that.textareaElement.value.toLowerCase(), "hey <strong>helen!</strong>", "Editor got immediately copied over to textarea after switching the view");
         
-        this.textareaElement.value = "<i>hey </i><strong>richard!</strong>";
+        that.textareaElement.value = "<i>hey </i><strong>richard!</strong>";
         editor.fire("change_view", "composer");
         equals(composerElement.innerHTML.toLowerCase(), "hey <strong>richard!</strong>", "Textarea sanitized and copied over it's value to the editor after switch");
         
         composerElement.innerHTML = "<i>hey </i><strong>timmay!</strong>";
-        QUnit.triggerEvent(this.form, "submit");
-        equals(this.textareaElement.value.toLowerCase(), "hey <strong>timmay!</strong>", "Textarea gets the sanitized content of the editor onsubmit");
+        QUnit.triggerEvent(that.form, "submit");
+        equals(that.textareaElement.value.toLowerCase(), "hey <strong>timmay!</strong>", "Textarea gets the sanitized content of the editor onsubmit");
         
         setTimeout(function() {
-          this.form.reset();
+          that.form.reset();
           
           // Timeout needed since reset() isn't executed synchronously
           setTimeout(function() {
-            equals(this.getTextContent(composerElement), "", "Editor is empty after reset");
+            equals(wysihtml5.dom.getTextContent(composerElement), "", "Editor is empty after reset");
             start();
-          }.bind(this), 100);
+          }, 100);
           
-        }.bind(this), 500);
+        }, 500);
         
-      }.bind(this), 500);
+      }, 500);
       
-    }.bind(this));
+    });
   });
   
   
@@ -269,47 +276,49 @@ if (wysihtml5.browserSupports.contentEditable()) {
     expect(13);
     stop(3000);
     
+    var that = this;
+    
     var placeholderText = "enter text ...";
     this.textareaElement.value = "";
     this.textareaElement.setAttribute("placeholder", "enter text ...");
     
     var editor = new wysihtml5.Editor(this.textareaElement);
     editor.observe("load", function() {
-      var composerElement = this.getComposerElement();
-      equals(this.getTextContent(composerElement), placeholderText, "Placeholder text correctly copied into textarea");
-      ok(Element.hasClassName(composerElement, "placeholder"), "Editor got 'placeholder' css class");
+      var composerElement = that.getComposerElement();
+      equals(wysihtml5.dom.getTextContent(composerElement), placeholderText, "Placeholder text correctly copied into textarea");
+      ok(wysihtml5.dom.hasClass(composerElement, "placeholder"), "Editor got 'placeholder' css class");
       ok(editor.hasPlaceholderSet(), "'hasPlaceholderSet' returns correct value when placeholder is actually set");
       editor.fire("focus:composer");
-      equals(this.getTextContent(composerElement), "", "Editor is empty after focus");
-      ok(!Element.hasClassName(composerElement, "placeholder"), "Editor hasn't got 'placeholder' css class");
+      equals(wysihtml5.dom.getTextContent(composerElement), "", "Editor is empty after focus");
+      ok(!wysihtml5.dom.hasClass(composerElement, "placeholder"), "Editor hasn't got 'placeholder' css class");
       ok(!editor.hasPlaceholderSet(), "'hasPlaceholderSet' returns correct value when placeholder isn't actually set");
       editor.fire("blur:composer");
-      equals(this.getTextContent(composerElement), placeholderText, "Editor restored placeholder text after unfocus");
+      equals(wysihtml5.dom.getTextContent(composerElement), placeholderText, "Editor restored placeholder text after unfocus");
       editor.fire("focus:composer");
-      equals(this.getTextContent(composerElement), "");
+      equals(wysihtml5.dom.getTextContent(composerElement), "");
       composerElement.innerHTML = "some content";
       editor.fire("blur:composer");
-      equals(this.getTextContent(composerElement), "some content");
-      ok(!Element.hasClassName(composerElement, "placeholder"), "Editor hasn't got 'placeholder' css class");
+      equals(wysihtml5.dom.getTextContent(composerElement), "some content");
+      ok(!wysihtml5.dom.hasClass(composerElement, "placeholder"), "Editor hasn't got 'placeholder' css class");
       editor.fire("focus:composer");
       // Following html causes innerText and textContent to report an empty string
       var html = '<img>';
       composerElement.innerHTML = html;
       editor.fire("blur:composer");
       equals(composerElement.innerHTML.toLowerCase(), html, "HTML hasn't been cleared even though the innerText and textContent properties indicate empty content.");
-      ok(!Element.hasClassName(composerElement, "placeholder"), "Editor hasn't got 'placeholder' css class");
+      ok(!wysihtml5.dom.hasClass(composerElement, "placeholder"), "Editor hasn't got 'placeholder' css class");
       
       setTimeout(function() {
-        this.form.reset();
+        that.form.reset();
         
         // Timeout needed since reset() isn't executed synchronously
         setTimeout(function() {
-          equals(this.getTextContent(composerElement), placeholderText, "After form reset the editor has the placeholder as content");
+          equals(wysihtml5.dom.getTextContent(composerElement), placeholderText, "After form reset the editor has the placeholder as content");
           start();
-        }.bind(this), 100);
+        }, 100);
         
-      }.bind(this), 500);
-    }.bind(this));
+      }, 500);
+    });
   });
   
   
@@ -317,6 +326,8 @@ if (wysihtml5.browserSupports.contentEditable()) {
     expect(14);
     stop(2000);
     
+    var that = this;
+    
     var editor = new wysihtml5.Editor(this.textareaElement, {
       parserRules:        { tags: { p: { rename_tag: "div" } } },
       bodyClassName:      "editor-is-supported",
@@ -325,12 +336,12 @@ if (wysihtml5.browserSupports.contentEditable()) {
     
     editor.observe("load", function() {
       ok(editor.isCompatible(), "isCompatible() returns correct value");
-      ok($(document.body).hasClassName("editor-is-supported"), "<body> received correct class name");
+      ok(wysihtml5.dom.hasClass(document.body, "editor-is-supported"), "<body> received correct class name");
       
-      var composerElement = this.getComposerElement();
+      var composerElement = that.getComposerElement();
       editor.clear();
-      equals(this.getTextContent(composerElement), "", "Editor empty after calling 'clear'");
-      ok(Element.hasClassName(composerElement, "editor"), "Composer element has correct class name");
+      equals(wysihtml5.dom.getTextContent(composerElement), "", "Editor empty after calling 'clear'");
+      ok(wysihtml5.dom.hasClass(composerElement, "editor"), "Composer element has correct class name");
       
       var html = "hello <strong>foo</strong>!";
       editor.setValue(html);
@@ -357,59 +368,7 @@ if (wysihtml5.browserSupports.contentEditable()) {
       ok(!composerElement.getAttribute("disabled"), "After enabling the disabled attribute is unset");
       
       start();
-    }.bind(this));
-  });
-  
-  
-  test("Parser (default parser method with parserRules fetched from url)", function() {
-    expect(6);
-    stop(3000);
-    
-    Ajax.Request = function(url, options) {
-      equals(url, "spec.json", "Correct url requested");
-      equals(options.method, "get", "Request done via GET");
-      options.onSuccess({ responseJSON: parserRules });
-    };
-    
-    var parserRules = {
-      tags: {
-        div: true,
-        p: { rename_tag: "div" },
-        span: true,
-        script: undefined
-      }
-    };
-    
-    var input1   = "<p>foobar</p>",
-        output1  = "<div>foobar</div>",
-        input2   = "<script>alert(1);</script><span>foo</span>",
-        output2  = "foo",
-        input3   = "<span><i>hello</i> foo</span>",
-        output3  = "<span>hello foo</span>";
-    
-    var editor = new wysihtml5.Editor(this.textareaElement, {
-      parserRules: "spec.json"
     });
-    
-    editor.observe("load", function() {
-      var composerElement = this.getComposerElement();
-      equals(editor.config.parserRules, parserRules, "Parser rules correctly set on config object");
-      // Invoke parsing via second parameter of setValue()
-      editor.setValue(input1, true);
-      equals(editor.getValue().toLowerCase(), output1, "HTML got correctly parsed within setValue()");
-      // Invoke parsing via first parameter of getValue()
-      editor.setValue(input2);
-      equals(editor.getValue(true).toLowerCase(), output2, "HTML got correctly parsed within getValue()");
-      // Invoke parsing via paste event
-      composerElement.innerHTML = input3;
-      QUnit.triggerEvent(composerElement, "paste");
-      
-      // pasting is done async, therefore the timeout
-      (function() {
-        equals(composerElement.innerHTML.toLowerCase(), output3, "HTML got correctly parsed after paste event");
-        start();
-      }).bind(this).delay(0.1);
-    }.bind(this));
   });
   
   
@@ -439,7 +398,7 @@ if (wysihtml5.browserSupports.contentEditable()) {
       editor.setValue(input, true);
       equals(editor.getValue().toLowerCase(), output, "HTML got correctly parsed within setValue()");
       start();
-    }.bind(this));
+    });
   });
   
   
@@ -447,7 +406,8 @@ if (wysihtml5.browserSupports.contentEditable()) {
     expect(7);
     stop(3000);
     
-    var parserRules = { script: undefined },
+    var that        = this,
+        parserRules = { script: undefined },
         input       = this.textareaElement.value,
         output      = input;
     
@@ -456,9 +416,9 @@ if (wysihtml5.browserSupports.contentEditable()) {
       parser:      function(html, rules, context) {
         equals(html.toLowerCase(), input, "HTML passed into parser is equal to the one which just got inserted");
         equals(rules, parserRules, "Rules passed into parser are equal to those given to the editor");
-        equals(context, this.getIframeElement().contentWindow.document, "Context passed into parser is equal the document object of the editor's iframe");
-        return html.stripScripts();
-      }.bind(this)
+        equals(context, that.getIframeElement().contentWindow.document, "Context passed into parser is equal the document object of the editor's iframe");
+        return html.replace(/\<script\>.*?\<\/script\>/gi, "");
+      }
     });
     
     editor.observe("load", function() {
@@ -470,7 +430,7 @@ if (wysihtml5.browserSupports.contentEditable()) {
       equals(editor.getValue().toLowerCase(), output, "HTML got correctly parsed within setValue()");
       
       start();
-    }.bind(this));
+    });
   });
   
   
@@ -478,11 +438,13 @@ if (wysihtml5.browserSupports.contentEditable()) {
     expect(2);
     stop(2000);
     
+    var that = this;
+    
     var editor = new wysihtml5.Editor(this.textareaElement);
     editor.observe("load", function() {
       var html            = '<img>',
-          composerElement = this.getComposerElement(),
-          textareaElement = this.textareaElement;
+          composerElement = that.getComposerElement(),
+          textareaElement = that.textareaElement;
       composerElement.innerHTML = html;
       
       // Fire events that could cause a change in the composer
@@ -491,12 +453,12 @@ if (wysihtml5.browserSupports.contentEditable()) {
       QUnit.triggerEvent(composerElement, "cut");
       QUnit.triggerEvent(composerElement, "blur");
       
-      (function() {
+      setTimeout(function() {
         equals(composerElement.innerHTML.toLowerCase(), html, "Composer still has correct content");
         equals(textareaElement.value.toLowerCase(), html, "Textarea got correct value");
         start();
-      }).delay(0.5);
-    }.bind(this));
+      }, 500);
+    });
   });
   
   
@@ -504,6 +466,8 @@ if (wysihtml5.browserSupports.contentEditable()) {
     stop(2000);
     expect(5);
     
+    var that = this;
+    
     var stylesheetUrls = [
       "http://yui.yahooapis.com/2.8.2r1/build/reset/reset-min.css",
       "http://yui.yahooapis.com/2.8.0/build/reset/reset-min.css"
@@ -514,7 +478,7 @@ if (wysihtml5.browserSupports.contentEditable()) {
     });
     
     editor.observe("load", function() {
-      var iframeElement = this.getIframeElement(),
+      var iframeElement = that.getIframeElement(),
           iframeDoc     = iframeElement.contentWindow.document,
           linkElements  = iframeDoc.getElementsByTagName("link");
       equals(linkElements.length, 2, "Correct amount of stylesheets inserted into the dom tree");
@@ -523,81 +487,6 @@ if (wysihtml5.browserSupports.contentEditable()) {
       equals(linkElements[1].getAttribute("href"), stylesheetUrls[1]);
       equals(linkElements[1].getAttribute("rel"), "stylesheet");
       start();
-    }.bind(this));
-  });
-  
-  
-  test("Instance Id", function() {
-    var textarea1 = this.textareaElement.clone(true),
-        textarea2 = this.textareaElement.clone(true);
-    
-    document.body.appendChild(textarea1);
-    document.body.appendChild(textarea2);
-    
-    var editor1 = new wysihtml5.Editor(textarea1),
-        editor2 = new wysihtml5.Editor(textarea2);
-    
-    ok(editor1._instanceId != editor2._instanceId, "Instance ids of two editors are not equal");
-    
-    textarea1.parentNode.removeChild(textarea1);
-    textarea2.parentNode.removeChild(textarea2);
-  });
-}
-
-
-// -------------- TEST WHAT HAPPENS WHEN EDITOR IS NOT COMPATIBLE WITH BROWSER -------------- \\
-module("wysihtml5.Editor - incompatible", {
-  setup: function() {
-    this.originalSupportCheck = wysihtml5.browserSupports.contentEditable;
-    wysihtml5.browserSupports.contentEditable = function() { return false; };
-    
-    this.textareaElement = new Element("textarea");
-    $(document.body).insert(this.textareaElement);
-  },
-  
-  teardown: function() {
-    wysihtml5.browserSupports.contentEditable = this.originalSupportCheck;
-    this.textareaElement.remove();
-  }
-});
-
-
-test("Basic test", function() {
-  expect(13);
-  stop(2000);
-  
-  var editor = new wysihtml5.Editor(this.textareaElement);
-  editor.observe("load", function() {
-    ok(true, "'load' event correctly triggered");
-    ok(!$(document.body).hasClassName("wysihtml5-supported"), "<body> didn't receive the 'wysihtml5-supported' class");
-    ok(!editor.isCompatible(), "isCompatible returns false when rich text editing is not correctly supported in the current browser");
-    ok(this.textareaElement.visible(), "Textarea is visible");
-    ok(!$$("iframe.wysihtml5-sandbox").length, "No iframe has been inserted into the dom");
-    ok(!$$("input[name='_wysihtml5_mode']").length, "No hidden field has been inserted into the dom");
-    ok(this.textareaElement.retrieve("wysihtml5") == editor, "Editor instance correctly stored on textarea");
-    ok(!editor.composer, "Composer not initialized");
-    
-    var html = "foobar<br>";
-    editor.setValue(html);
-    equals(this.textareaElement.value, html);
-    equals(editor.getValue(), html);
-    editor.clear();
-    equals(this.textareaElement.value, "");
-    
-    editor.observe("focus", function() {
-      ok(true, "Generic 'focus' event fired");
-    });
-    
-    editor.observe("focus:textarea", function() {
-      ok(true, "Specific 'focus:textarea' event fired");
     });
-    
-    editor.observe("focus:composer", function() {
-      ok(false, "Specific 'focus:composer' event fired, and that's wrong, there shouldn't be a composer element/view");
-    });
-    
-    QUnit.triggerEvent(this.textareaElement, wysihtml5.browserSupports.event("focusin") ? "focusin" : "focus");
-    
-    start();
-  }.bind(this));
-});
\ No newline at end of file
+  });
+}
\ No newline at end of file
diff --git a/test/incompatible_test.js b/test/incompatible_test.js
new file mode 100644
index 00000000..2aa718b1
--- /dev/null
+++ b/test/incompatible_test.js
@@ -0,0 +1,61 @@
+module("wysihtml5 - Incompatible", {
+  setup: function() {
+    this.originalSupportCheck = wysihtml5.browser.supported;
+    wysihtml5.browser.supported = function() { return false; };
+    
+    this.textareaElement = document.createElement("textarea");
+    document.body.appendChild(this.textareaElement);
+  },
+  
+  teardown: function() {
+    wysihtml5.browser.supported = this.originalSupportCheck;
+    this.textareaElement.parentNode.removeChild(this.textareaElement);
+  }
+});
+
+
+test("Basic test", function() {
+  expect(12);
+  stop(2000);
+  
+  var that = this;
+  
+  var oldIframesLength = document.getElementsByTagName("iframe").length;
+  
+  var oldInputsLength = document.getElementsByTagName("input").length;
+  
+  var editor = new wysihtml5.Editor(this.textareaElement);
+  editor.observe("load", function() {
+    ok(true, "'load' event correctly triggered");
+    ok(!wysihtml5.dom.hasClass(document.body, "wysihtml5-supported"), "<body> didn't receive the 'wysihtml5-supported' class");
+    ok(!editor.isCompatible(), "isCompatible returns false when rich text editing is not correctly supported in the current browser");
+    equals(that.textareaElement.style.display, "", "Textarea is visible");
+    ok(!editor.composer, "Composer not initialized");
+    
+    equals(document.getElementsByTagName("iframe").length, oldIframesLength, "No hidden field has been inserted into the dom");
+    equals(document.getElementsByTagName("input").length,  oldInputsLength,  "Composer not initialized");
+    
+    var html = "foobar<br>";
+    editor.setValue(html);
+    equals(that.textareaElement.value, html);
+    equals(editor.getValue(), html);
+    editor.clear();
+    equals(that.textareaElement.value, "");
+    
+    editor.observe("focus", function() {
+      ok(true, "Generic 'focus' event fired");
+    });
+    
+    editor.observe("focus:textarea", function() {
+      ok(true, "Specific 'focus:textarea' event fired");
+    });
+    
+    editor.observe("focus:composer", function() {
+      ok(false, "Specific 'focus:composer' event fired, and that's wrong, there shouldn't be a composer element/view");
+    });
+    
+    QUnit.triggerEvent(that.textareaElement, wysihtml5.browser.supportsEvent("focusin") ? "focusin" : "focus");
+    
+    start();
+  });
+});
\ No newline at end of file
diff --git a/test/index.html b/test/index.html
index 620afef4..7ca8f822 100644
--- a/test/index.html
+++ b/test/index.html
@@ -7,31 +7,45 @@
 
 <link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css">
 
-<script src="http://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script>
 <script src="http://code.jquery.com/qunit/qunit-git.js"></script>
 
-<script src="../dist/wysihtml5-0.1.0.js"></script>
+<script src="../dist/wysihtml5-0.2.0.js"></script>
 <script src="../src/assert/html_equals.js"></script>
 
-<script src="assert/html_equals_test.js"></script>
-<script src="utils/sanitize_html_test.js"></script>
-<script src="utils/sandbox_test.js"></script>
-<script src="utils/copy_styles_test.js"></script>
-<script src="utils/copy_attributes_test.js"></script>
-<script src="utils/observe_test.js"></script>
-<script src="utils/get_in_dom_element_test.js"></script>
-<script src="utils/get_parent_element_test.js"></script>
-<script src="utils/get_style_test.js"></script>
-<script src="utils/has_element_with_tag_name_test.js"></script>
-<script src="utils/has_element_with_class_name_test.js"></script>
-<script src="utils/insert_rules_test.js"></script>
-<script src="utils/auto_link_test.js"></script>
-<script src="utils/convert_into_list_test.js"></script>
-<script src="utils/resolve_list_test.js"></script>
-<script src="utils/rename_element_test.js"></script>
-<script src="quirks/clean_pasted_html_test.js"></script>
-<script src="browser_support_test.js"></script>
-<script src="editor_test.js"></script>
+<script src="browser_test.js"></script>
+<script src="incompatible_test.js"></script>
+
+<script>
+  if (wysihtml5.browser.supported()) {
+    document.write(
+      '<script src="assert/html_equals_test.js"><\/script>'               +
+      '<script src="lang/array_test.js"><\/script>'                       +
+      '<script src="lang/object_test.js"><\/script>'                      +
+      '<script src="lang/string_test.js"><\/script>'                      +
+      '<script src="dom/auto_link_test.js"><\/script>'                    +
+      '<script src="dom/contains_test.js"><\/script>'                     +
+      '<script src="dom/convert_to_list_test.js"><\/script>'              +
+      '<script src="dom/copy_styles_test.js"><\/script>'                  +
+      '<script src="dom/copy_attributes_test.js"><\/script>'              +
+      '<script src="dom/delegate_test.js"><\/script>'                     +
+      '<script src="dom/sandbox_test.js"><\/script>'                      +
+      '<script src="dom/observe_test.js"><\/script>'                      +
+      '<script src="dom/get_as_dom_test.js"><\/script>'                   +
+      '<script src="dom/get_parent_element_test.js"><\/script>'           +
+      '<script src="dom/get_style_test.js"><\/script>'                    +
+      '<script src="dom/has_element_with_tag_name_test.js"><\/script>'    +
+      '<script src="dom/has_element_with_class_name_test.js"><\/script>'  +
+      '<script src="dom/insert_css_test.js"><\/script>'                   +
+      '<script src="dom/resolve_list_test.js"><\/script>'                 +
+      '<script src="dom/rename_element_test.js"><\/script>'               +
+      '<script src="dom/set_styles_test.js"><\/script>'                   +
+      '<script src="dom/set_attributes_test.js"><\/script>'               +
+      '<script src="dom/parse_test.js"><\/script>'                        +
+      '<script src="quirks/clean_pasted_html_test.js"><\/script>'         +
+      '<script src="editor_test.js"><\/script>'
+    );
+  }
+</script>
 
 <h1 id="qunit-header">wysihtml5 - Test Suite</h1>
 <h2 id="qunit-banner"></h2>
diff --git a/test/lang/array_test.js b/test/lang/array_test.js
new file mode 100644
index 00000000..ce65ca4e
--- /dev/null
+++ b/test/lang/array_test.js
@@ -0,0 +1,22 @@
+module("wysihtml5.lang.array");
+
+test("contains()", function() {
+  var arr = [1, "2", "foo"];
+  ok(wysihtml5.lang.array(arr).contains(1));
+  ok(!wysihtml5.lang.array(arr).contains(2));
+  ok(wysihtml5.lang.array(arr).contains("2"));
+  ok(wysihtml5.lang.array(arr).contains("foo"));
+});
+
+test("without()", function() {
+  var arr = [1, 2, 3];
+  same(wysihtml5.lang.array(arr).without([1]), [2, 3]);
+  same(wysihtml5.lang.array(arr).without([4]), [1, 2, 3]);
+});
+
+test("get()", function() {
+  var nodeList = document.getElementsByTagName("*"),
+      arr      = wysihtml5.lang.array(nodeList).get();
+  equals(arr.length, nodeList.length);
+  ok(arr instanceof Array);
+});
\ No newline at end of file
diff --git a/test/lang/object_test.js b/test/lang/object_test.js
new file mode 100644
index 00000000..b59138df
--- /dev/null
+++ b/test/lang/object_test.js
@@ -0,0 +1,22 @@
+module("wysihtml5.lang.object");
+
+test("merge()", function() {
+  var obj         = { foo: 1, bar: 1 },
+      returnValue = wysihtml5.lang.object(obj).merge({ bar: 2, baz: 3 }).get();
+  equals(returnValue, obj);
+  same(obj, { foo: 1, bar: 2, baz: 3 });
+});
+
+test("clone()", function() {
+  var obj = { foo: true },
+      returnValue = wysihtml5.lang.object(obj).clone();
+  ok(obj != returnValue);
+  same(obj, returnValue);
+});
+
+test("isArray()", function() {
+  ok(wysihtml5.lang.object([]).isArray());
+  ok(!wysihtml5.lang.object({}).isArray());
+  ok(!wysihtml5.lang.object(document.body.childNodes).isArray());
+  ok(!wysihtml5.lang.object("1,2,3").isArray());
+});
\ No newline at end of file
diff --git a/test/lang/string_test.js b/test/lang/string_test.js
new file mode 100644
index 00000000..99409f4b
--- /dev/null
+++ b/test/lang/string_test.js
@@ -0,0 +1,19 @@
+module("wysihtml5.lang.string");
+
+test("trim()", function() {
+  equals(wysihtml5.lang.string("   foo   \n").trim(), "foo");
+});
+
+test("interpolate()", function() {
+  equals(
+    wysihtml5.lang.string("Hello #{name}, I LOVE YOUR NAME. IT'S VERY GERMAN AND SOUNDS STRONG.").interpolate({ name: "Reinhold" }),
+    "Hello Reinhold, I LOVE YOUR NAME. IT'S VERY GERMAN AND SOUNDS STRONG."
+  );
+});
+
+test("replace()", function() {
+  equals(
+    wysihtml5.lang.string("I LOVE CAKE").replace("CAKE").by("BOOBS"),
+    "I LOVE BOOBS"
+  );
+});
\ No newline at end of file
diff --git a/test/quirks/clean_pasted_html_test.js b/test/quirks/clean_pasted_html_test.js
index ed7fad88..7f214e10 100644
--- a/test/quirks/clean_pasted_html_test.js
+++ b/test/quirks/clean_pasted_html_test.js
@@ -1,4 +1,4 @@
-if (wysihtml5.browserSupports.contentEditable()) {
+if (wysihtml5.browser.supported()) {
   module("wysihtml5.quirks.cleanPastedHTML");
 
   test("Basic test", function() {
diff --git a/test/utils/convert_into_list_test.js b/test/utils/convert_into_list_test.js
deleted file mode 100644
index 135f6fbb..00000000
--- a/test/utils/convert_into_list_test.js
+++ /dev/null
@@ -1,95 +0,0 @@
-module("wysihtml5.utils.convertIntoList", {
-  equals: function(actual, expected, message) {
-    return wysihtml5.assert.htmlEquals(actual, expected, message);
-  },
-  
-  convertIntoList: function(html, type) {
-    var container = wysihtml5.utils.getInDomElement(html);
-    document.body.appendChild(container);
-    this.elements.push(container);
-    wysihtml5.utils.convertIntoList(container.firstChild, type);
-    return container.innerHTML;
-  },
-  
-  setup: function() {
-    this.elements = [];
-  },
-  
-  teardown: function() {
-    this.elements.each(function(element) {
-      Element.remove(element);
-    });
-  }
-});
-
-test("Basic tests for UL", function() {
-  this.equals(
-    this.convertIntoList("<div>foo</div>", "ul"),
-    "<ul><li>foo</li></ul>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span></span>", "ul"),
-    "<ul></ul>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span>foo<br>bar</span>", "ul"),
-    "<ul><li>foo</li><li>bar</li></ul>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span>foo<br>bar<div>baz</div></span>", "ul"),
-    "<ul><li>foo</li><li>bar</li><li><div>baz</div></li></ul>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span><div></div><h1></h1><p>yeah</p></span>", "ul"),
-    "<ul><li><div></div></li><li><h1></h1></li><li><p>yeah</p></li></ul>"
-  );
-});
-
-test("Basic tests for OL", function() {
-  this.equals(
-    this.convertIntoList("<div>foo</div>", "ol"),
-    "<ol><li>foo</li></ol>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span></span>", "ol"),
-    "<ol></ol>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span>foo<br>bar</span>", "ol"),
-    "<ol><li>foo</li><li>bar</li></ol>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span>foo<br>bar<div>baz</div></span>", "ol"),
-    "<ol><li>foo</li><li>bar</li><li><div>baz</div></li></ol>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<span><div></div><h1></h1><p>yeah</p></span>", "ol"),
-    "<ol><li><div></div></li><li><h1></h1></li><li><p>yeah</p></li></ol>"
-  );
-});
-
-
-test("Test whether it doesn't convert dom trees that are already a list", function() {
-  this.equals(
-    this.convertIntoList("<ol><li>foo</li></ol>", "ol"),
-    "<ol><li>foo</li></ol>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<menu><li>foo</li></menu>", "ol"),
-    "<menu><li>foo</li></menu>"
-  );
-  
-  this.equals(
-    this.convertIntoList("<ul><li>foo</li></ul>", "ol"),
-    "<ul><li>foo</li></ul>"
-  );
-});
\ No newline at end of file
diff --git a/test/utils/copy_styles_test.js b/test/utils/copy_styles_test.js
deleted file mode 100644
index 28fad3fc..00000000
--- a/test/utils/copy_styles_test.js
+++ /dev/null
@@ -1,110 +0,0 @@
-module("wysihtml5.copyStyles", {
-  setup: function() {
-    this.div        = new Element("div");
-    this.span       = new Element("span", { id: "wysihtml5-test-span" });
-    this.anotherDiv = new Element("div");
-    this.iframe     = new Element("iframe", { src: "javascript:'<html></html>'" });
-    
-    $(document.body)
-      .insert(this.div)
-      .insert(this.span)
-      .insert(this.anotherDiv)
-      .insert(this.iframe);
-  },
-  
-  teardown: function() {
-    [this.div, this.span, this.anotherDiv, this.iframe].invoke("remove");
-  },
-  
-  insertCss: function(css) {
-    var styleElement = new Element("style", { type: "text/css" });
-    if (styleElement.styleSheet) {
-      styleElement.styleSheet.cssText = css;
-    } else {
-      styleElement.appendChild(document.createTextNode(css));
-    }
-    $$("head, body")[0].insert(styleElement);
-  }
-});
-
-
-test("Basic Tests", function() {
-  this.div.setStyle({ width: "400px", height: "200px", textAlign: "right", "float": "left" });
-  
-  wysihtml5.utils.copyStyles("width", "height", "text-align", "float").from(this.div).to(this.span);
-  
-  equals(this.span.getStyle("width"), "400px", "Width correctly copied");
-  equals(this.span.getStyle("height"), "200px", "Height correctly copied");
-  equals(this.span.getStyle("text-align"), "right", "Text-align correctly copied");
-  equals(this.span.getStyle("float"), "left", "Float correctly copied");
-});
-
-
-test("Whether it copies native user agent styles", function() {
-  wysihtml5.utils.copyStyles("display").from(this.span).to(this.div);
-  
-  equals(this.div.getStyle("display"), "inline", "Display correctly copied");
-});
-
-
-test("Advanced tests", function() {
-  this.span.style.cssText = "color: rgb(255, 0, 0); -moz-border-radius: 5px 5px 5px 5px;";
-  this.div.style.cssText = "color: rgb(0, 255, 0); text-decoration: underline;";
-  
-  wysihtml5.utils
-    .copyStyles(["color", "-moz-border-radius", "unknown-style"])
-    .from(this.span)
-    .to(this.div)
-    .andTo(this.anotherDiv);
-  
-  // Opera and IE internally convert color values either to rgb or hexcode, and some version of IE either
-  // strip or add white spaces between rgb values
-  var divColor = this.div.getStyle("color").replace(/\s+/g, "");
-  ok(divColor == "rgb(255,0,0)" || divColor == "#ff0000", "First div has correct color");
-  
-  var anotherDivColor = this.anotherDiv.getStyle("color").replace(/\s+/g, "");
-  ok(anotherDivColor == "rgb(255,0,0)" || anotherDivColor == "#ff0000", "Second div has correct color");
-  
-  equals(this.div.getStyle("textDecoration"), "underline", "Text-decoration hasn't been overwritten");
-  
-  if ("MozBorderRadius" in this.div.style) {
-    equals(this.div.getStyle("-moz-border-radius"), "5px 5px 5px 5px", "First div has correct border-radius");
-    equals(this.anotherDiv.getStyle("-moz-border-radius"), "5px 5px 5px 5px", "Second div has correct border-radius");
-  }
-});
-
-
-test("Test copying styles from one element to another element which is in an iframe", function() {
-  expect(1);
-  stop(2000);
-  
-  // Timeout needed to make sure that the iframe is ready
-  setTimeout(function() {
-    var iframeDocument = this.iframe.contentWindow.document,
-        iframeElement = iframeDocument.createElement("div");
-    
-    iframeDocument.body.appendChild(iframeElement);
-    this.span.style.cssText = "float: left;";
-    
-    wysihtml5.utils
-      .copyStyles("float")
-      .from(this.span)
-      .to(iframeElement);
-    
-    equals(iframeElement.style.styleFloat || iframeElement.style.cssFloat, "left", "Element in iframe correctly got css float copied over");
-    
-    start();
-  }.bind(this), 1000);
-});
-
-
-test("Test copying styles that were set via style element", function() {
-  this.insertCss("span#wysihtml5-test-span { font-size: 16px; }");
-  
-  wysihtml5.utils
-    .copyStyles("font-size")
-    .from(this.span)
-    .to(this.div);
-  
-  equals(this.div.getStyle("font-size"), "16px", "Font-size correctly copied");
-});
\ No newline at end of file
diff --git a/test/utils/has_element_with_class_name_test.js b/test/utils/has_element_with_class_name_test.js
deleted file mode 100644
index 33430b54..00000000
--- a/test/utils/has_element_with_class_name_test.js
+++ /dev/null
@@ -1,27 +0,0 @@
-if ("querySelector" in document || wysihtml5.browserSupports.getElementsByClassName()) {
-  module("wysihtml5.utils.hasElementWithClassName", {
-    teardown: function() {
-      $$("iframe.wysihtml5-sandbox").invoke("stopObserving").invoke("remove");
-    }
-  });
-
-
-  test("Basic test", function() {
-    stop(4000);
-    expect(3);
-
-    new wysihtml5.utils.Sandbox(function(sandbox) {
-      var doc         = sandbox.getDocument(),
-          tempElement = doc.createElement("i");
-      tempElement.className = "wysiwyg-color-aqua";
-
-      ok(!wysihtml5.utils.hasElementWithClassName(doc, "wysiwyg-color-aqua"));
-      doc.body.appendChild(tempElement);
-      ok(wysihtml5.utils.hasElementWithClassName(doc, "wysiwyg-color-aqua"));
-      tempElement.parentNode.removeChild(tempElement);
-      ok(!wysihtml5.utils.hasElementWithClassName(doc, "wysiwyg-color-aqua"));
-
-      start();
-    }.bind(this), { insertInto: document.body });
-  });
-}
diff --git a/test/utils/has_element_with_tag_name_test.js b/test/utils/has_element_with_tag_name_test.js
deleted file mode 100644
index e234ec2b..00000000
--- a/test/utils/has_element_with_tag_name_test.js
+++ /dev/null
@@ -1,23 +0,0 @@
-module("wysihtml5.utils.hasElementWithTagName", {
-  teardown: function() {
-    $$("iframe.wysihtml5-sandbox").invoke("stopObserving").invoke("remove");
-  }
-});
-
-
-test("Basic test", function() {
-  stop(4000);
-  expect(3);
-  
-  new wysihtml5.utils.Sandbox(function(sandbox) {
-    var doc         = sandbox.getDocument(),
-        tempElement = doc.createElement("i");
-    ok(!wysihtml5.utils.hasElementWithTagName(doc, "I"));
-    doc.body.appendChild(tempElement);
-    ok(wysihtml5.utils.hasElementWithTagName(doc, "I"));
-    tempElement.parentNode.removeChild(tempElement);
-    ok(!wysihtml5.utils.hasElementWithTagName(doc, "I"));
-    
-    start();
-  }.bind(this), { insertInto: document.body });
-});
\ No newline at end of file
diff --git a/test/utils/insert_rules_test.js b/test/utils/insert_rules_test.js
deleted file mode 100644
index 42397cd8..00000000
--- a/test/utils/insert_rules_test.js
+++ /dev/null
@@ -1,53 +0,0 @@
-module("wysihtml5.utils.insertRules", {
-  teardown: function() {
-    $$("iframe.wysihtml5-sandbox").invoke("stopObserving").invoke("remove");
-  }
-});
-
-test("Basic Tests with IE=Edge", function() {
-  expect(3);
-  stop();
-  
-  new wysihtml5.utils.Sandbox(function(sandbox) {
-    var doc     = sandbox.getDocument(),
-        body    = doc.body,
-        element = doc.createElement("sub");
-    
-    body.appendChild(element);
-    
-    wysihtml5.utils.insertRules([
-      "sub { display: block; text-align: right; }",
-      "body { text-indent: 50px; }"
-    ]).into(doc);
-    
-    equals(wysihtml5.utils.getStyle(element, "display"),    "block");
-    equals(wysihtml5.utils.getStyle(element, "text-align"), "right");
-    equals(wysihtml5.utils.getStyle(body, "text-indent"),   "50px");
-    
-    start();
-  }, { insertInto: document.body, uaCompatible: "IE=Edge" });
-});
-
-test("Basic Tests with IE=7", function() {
-  expect(3);
-  stop();
-  
-  new wysihtml5.utils.Sandbox(function(sandbox) {
-    var doc     = sandbox.getDocument(),
-        body    = doc.body,
-        element = doc.createElement("sub");
-    
-    body.appendChild(element);
-    
-    wysihtml5.utils.insertRules([
-      "sub { display: block; text-align: right; }",
-      "body { text-indent: 50px; }"
-    ]).into(doc);
-    
-    equals(wysihtml5.utils.getStyle(element, "display"),    "block");
-    equals(wysihtml5.utils.getStyle(element, "text-align"), "right");
-    equals(wysihtml5.utils.getStyle(body, "text-indent"),   "50px");
-    
-    start();
-  }, { insertInto: document.body, uaCompatible: "IE=7" });
-});
\ No newline at end of file
diff --git a/test/utils/observe_test.js b/test/utils/observe_test.js
deleted file mode 100644
index 1afabcf2..00000000
--- a/test/utils/observe_test.js
+++ /dev/null
@@ -1,75 +0,0 @@
-module("wysihtml5.utils.observe", {
-  setup: function() {
-    this.container  = new Element("div");
-    this.element    = new Element("textarea");
-    this.container.insert(this.element);
-    $(document.body).insert(this.container);
-  },
-  
-  teardown: function() {
-    this.container.remove();
-    $$("iframe.wysihtml5-sandbox").invoke("stopObserving").invoke("remove");
-  }
-});
-
-
-test("Basic test", function() {
-  expect(4);
-  
-  wysihtml5.utils.observe(this.element, ["mouseover", "mouseout"], function(event) {
-    ok(true, "'" + event.type + "' correctly fired");
-  });
-  
-  wysihtml5.utils.observe(this.element, "click", function(event) {
-    equals(event.target, this.element, "event.target or event.srcElement are set");
-    ok(true, "'click' correctly fired");
-  }.bind(this));
-  
-  QUnit.triggerEvent(this.element, "mouseover");
-  QUnit.triggerEvent(this.element, "mouseout");
-  QUnit.triggerEvent(this.element, "click");
-});
-
-
-test("Test stopPropagation and scope of event handler", function(event) {
-  expect(2);
-  var element = this.element;
-  
-  wysihtml5.utils.observe(this.container, "click", function(event) {
-    ok(false, "The event shouldn't have been bubbled!");
-  });
-  
-  wysihtml5.utils.observe(this.element, "click", function(event) {
-    event.stopPropagation();
-    equals(this, element, "Event handler bound to correct scope");
-    ok(true, "stopPropagation correctly fired");
-  });
-  
-  QUnit.triggerEvent(this.element, "click");
-});
-
-test("Test detaching events", function() {
-  var eventListener = wysihtml5.utils.observe(this.element, "click", function() {
-    ok(false, "This should not be triggered");
-  });
-  
-  eventListener.stop();
-  QUnit.triggerEvent(this.element, "click");
-});
-
-test("Advanced test observing within a sandboxed iframe", function() {
-  expect(2);
-  stop(2000);
-  
-  var sandbox = new wysihtml5.utils.Sandbox(function() {
-    var element = sandbox.getDocument().createElement("div");
-    sandbox.getDocument().body.appendChild(element);
-    wysihtml5.utils.observe(element, ["click", "mousedown"], function(event) {
-      ok(true, "'" + event.type + "' correctly fired");
-    });
-    QUnit.triggerEvent(element, "click");
-    QUnit.triggerEvent(element, "mousedown");
-    
-    start();
-  }, { insertInto: document.body });
-});
\ No newline at end of file
diff --git a/version.txt b/version.txt
index 6c6aa7cb..341cf11f 100644
--- a/version.txt
+++ b/version.txt
@@ -1 +1 @@
-0.1.0
\ No newline at end of file
+0.2.0
\ No newline at end of file