splits text into individual words for greater flexibility. It's now t…

…oo slow.
heygrady · Mar 5, 2011 · 91fc707 · 91fc707
1 parent 3196fca
commit 91fc707
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 28 deletions.
diff --git a/jquery.textshadow.css b/jquery.textshadow.css
@@ -1,25 +1,28 @@
 .ui-text-shadow, .ui-text-shadow-original {
-  position: relative;
+	position: relative;
 }
 .ui-text-shadow-original {
-  z-index: 2;
-  text-shadow: none;
+	z-index: 2;
+	text-shadow: none;
+}
+.ui-text-shadow, .ui-text-shadow-copy {
+	/*width: 100%;*/
 }
 .ui-text-shadow-copy {
-  position: absolute;
-  z-index: 1;
-  
-  /* default positioning */
-  left: 0;
-  top: 0;
-  
-  /* turn off shadow */
-  text-shadow: none;
-  
-  /* turn off selection */
-  -webkit-user-select: none;
-  -khtml-user-select: none;
-  -moz-user-select: none;
-  -o-user-select: none;
-  user-select: none;
+	position: absolute;
+	z-index: 1;
+	
+	/* default positioning */
+	left: 0;
+	top: 0;
+	
+	/* turn off shadow */
+	text-shadow: none;
+	
+	/* turn off selection */
+	-webkit-user-select: none;
+	-khtml-user-select: none;
+	-moz-user-select: none;
+	-o-user-select: none;
+	user-select: none;
 }
diff --git a/jquery.textshadow.js b/jquery.textshadow.js
@@ -5,7 +5,7 @@
 		filter = "progid:DXImageTransform.Microsoft.";
 
 	// create a plugin
-	$.fn.textshadow = function(value) {
+	$.fn.textshadow = function(value, options) {
 		var values = rtextshadow.exec(value),
 			x, y, blur, color, opacity;
 
@@ -57,19 +57,38 @@
 	function wrapTextNodes(elem) {
 		$(elem).contents().each(function() {
 			var $elem, $orig, $clone;
+			$elem = $(this);
 			if (this.nodeType === 3) {
-				//TODO: skip text with a parent span.ui-text-shadow-original or span.ui-text-shadow-copy
-				$elem = $(this).wrap('<span class="ui-text-shadow"><span class="ui-text-shadow-original"></span></span>');
-				$orig = $elem.parent();
-				$clone = $orig.clone()
-					.addClass('ui-text-shadow-copy')
-					.removeClass('ui-text-shadow-original')
-					.appendTo($elem.parent().parent());
-			} else if (this.nodeType === 1) {
+				$.each(makeWords(this), function() {
+					$elem = $(this).wrap('<span class="ui-text-shadow"><span class="ui-text-shadow-original"></span></span>');
+					$orig = $elem.parent();
+					$clone = $orig.clone()
+						.addClass('ui-text-shadow-copy')
+						.removeClass('ui-text-shadow-original')
+						.appendTo($elem.parent().parent());
+				});
+			} else if (this.nodeType === 1 && (
+					!$elem.hasClass('ui-text-shadow') ||
+					!$elem.hasClass('ui-text-shadow-original') ||
+					!$elem.hasClass('ui-text-shadow-copy')
+				)) {
 				wrapTextNodes(this);
 			}
 		});
 	}
+
+	function makeWords(textNode) {
+		var words = [],
+			split = textNode.nodeValue.split(/\s/),
+			text = textNode, length;
+		words.push(textNode);
+		$.each(split, function() {
+			length = this.length;
+			text = text.splitText(length + (/\s/.test(text.nodeValue.charAt(length)) ? 1 : 0));
+			words.push(text);
+		});
+		return words;
+	}
 
 	// http://haacked.com/archive/2009/12/29/convert-rgb-to-hex.aspx
 	function toHex(color) {