From 4b083a632e702cb58a7081de78edf32236192128 Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Sat, 2 Nov 2013 23:30:59 +0000 Subject: [PATCH 1/8] Copying item to the data attribute of the span Added `item` to "data-character" a custom HTML 5 data attribute of the span. This can then be called by pseudo elements using `content: attr(data-character);`. This works for my [use case](http://codepen.io/alienresident/pen/mhqrj) but I think it would be more useful to add `data-{method}="'+item+'"`. So you could have data-character, data-word, data-line attributes depending on what method(s) you used. I am not sure how to do this.... It may also be useful to call this only if you want this by calling an additional argument. Thoughts? --- jquery.lettering.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/jquery.lettering.js b/jquery.lettering.js index 8a693c8..b2e3cd5 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -15,7 +15,7 @@ var a = t.text().split(splitter), inject = ''; if (a.length) { $(a).each(function(i, item) { - inject += ''+item+''+after; + inject += ''+item+''+after; }); t.empty().append(inject); } From 75c9fd88f1c79010a9cff9ce5896795b408c3f03 Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Mon, 4 Nov 2013 12:18:05 -0500 Subject: [PATCH 2/8] Added a function to escape text to html entities --- jquery.lettering.js | 1 + 1 file changed, 1 insertion(+) diff --git a/jquery.lettering.js b/jquery.lettering.js index b2e3cd5..70f05b3 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -21,6 +21,7 @@ } } + function escape(str) { var methods = { init : function() { From b50270afad8e5b4b279b3be208f8e115c9aa2116 Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Mon, 4 Nov 2013 12:20:12 -0500 Subject: [PATCH 3/8] Added +item+ as a custom data attribute and as a class Added +item+ as a custom data attribute for pseudo element magic. Added +item+ as a class so you can create kerning pair rules --- jquery.lettering.js | 1 - 1 file changed, 1 deletion(-) diff --git a/jquery.lettering.js b/jquery.lettering.js index 70f05b3..d010454 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -15,7 +15,6 @@ var a = t.text().split(splitter), inject = ''; if (a.length) { $(a).each(function(i, item) { - inject += ''+item+''+after; }); t.empty().append(inject); } From 9b53576bbb9f34dae18ed7555c9fd83fa21ae2a9 Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Mon, 4 Nov 2013 12:21:38 -0500 Subject: [PATCH 4/8] Added text values to a custom data attribute and as an additional class --- jquery.lettering.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/jquery.lettering.js b/jquery.lettering.js index d010454..35ab3df 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -11,16 +11,20 @@ * Date: Mon Sep 20 17:14:00 2010 -0600 */ (function($){ + function injector(t, splitter, klass, after) { var a = t.text().split(splitter), inject = ''; if (a.length) { $(a).each(function(i, item) { + escitem = escape(item); + inject += ''+item+''+after; }); t.empty().append(inject); } } - function escape(str) { + return String(str).replace(/&/g, '&').replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"'); // avoids double encoding & http://css-tricks.com/snippets/javascript/htmlentities-for-javascript/ See comments + } var methods = { init : function() { From 4b1492a592e190e66a2979fa12c476e5c9d8e0f2 Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Tue, 5 Nov 2013 21:10:05 -0500 Subject: [PATCH 5/8] Added a space to   replacement --- jquery.lettering.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/jquery.lettering.js b/jquery.lettering.js index 35ab3df..09277eb 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -23,7 +23,7 @@ } } function escape(str) { - return String(str).replace(/&/g, '&').replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"'); // avoids double encoding & http://css-tricks.com/snippets/javascript/htmlentities-for-javascript/ See comments + return String(str).replace(/&/g, '&').replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"').replace(/ /g, ' '); // avoids double encoding & See comments from http://css-tricks.com/snippets/javascript/htmlentities-for-javascript/ } var methods = { init : function() { From e78750751fff1175019e4011dd05c4d5b0b4f2b0 Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Thu, 7 Nov 2013 21:00:22 -0500 Subject: [PATCH 6/8] checks to see if the method 'klass' is 'char' If statement to figure out the method. If it's 'char' it's adds a class char - item value i.e. If the letter is 'a' it's adds a class of 'char-a'. This allows you create kerning pairs. You can create kerning pair rules for all the character combos. You won't need to know the content beforehand. Use case could be on a CMS where you won't know the headings beforehand but want strict kerning rules. --- jquery.lettering.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/jquery.lettering.js b/jquery.lettering.js index 09277eb..09c773b 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -17,7 +17,11 @@ if (a.length) { $(a).each(function(i, item) { escitem = escape(item); - inject += ''+item+''+after; + if(klass === 'char') { + inject += ''+item+''+after; + } else { + inject += ''+item+''+after; + } }); t.empty().append(inject); } From 349acd1db626612fb78c94bbf9a138988a2c383a Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Fri, 8 Nov 2013 11:47:00 -0500 Subject: [PATCH 7/8] Removed extra class char-* as it's unnecessary From Dave Rupert's comment of the PR we don't need the extra char-* we can use [data-char="*"] instead. Brillant! --- jquery.lettering.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/jquery.lettering.js b/jquery.lettering.js index 09c773b..a157795 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -17,11 +17,7 @@ if (a.length) { $(a).each(function(i, item) { escitem = escape(item); - if(klass === 'char') { - inject += ''+item+''+after; - } else { - inject += ''+item+''+after; - } + inject += ''+item+''+after; }); t.empty().append(inject); } From c20c5e79783540321ec7eba6f7791259822a149d Mon Sep 17 00:00:00 2001 From: Mark Reilly Date: Fri, 8 Nov 2013 12:51:39 -0500 Subject: [PATCH 8/8] Unnecessary escaping on `space` to   was breaking styling --- jquery.lettering.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/jquery.lettering.js b/jquery.lettering.js index a157795..f21f4da 100644 --- a/jquery.lettering.js +++ b/jquery.lettering.js @@ -23,7 +23,7 @@ } } function escape(str) { - return String(str).replace(/&/g, '&').replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"').replace(/ /g, ' '); // avoids double encoding & See comments from http://css-tricks.com/snippets/javascript/htmlentities-for-javascript/ + return String(str).replace(/&/g, '&').replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"'); // avoids double encoding & See comments from http://css-tricks.com/snippets/javascript/htmlentities-for-javascript/ } var methods = { init : function() {