From bdbc064057fb5245b627e42404da9f552f289dec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Thu, 3 Nov 2016 00:58:31 +0100 Subject: [PATCH 01/12] Update README.md Document callback option --- README.md | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index 3be0145..c40c750 100644 --- a/README.md +++ b/README.md @@ -30,13 +30,14 @@ There are some options that are available to you as well: ```javascript // Defaults { - highlightSpeed : 20, - typeSpeed : 100, - clearDelay : 500, - typeDelay : 200, - clearOnHighlight : true, - typerDataAttr : 'data-typer-targets', - typerInterval : 2000 + highlightSpeed : 20, + typeSpeed : 100, + clearDelay : 500, + typeDelay : 200, + clearOnHighlight : true, + typerDataAttr : 'data-typer-targets', + typerInterval : 2000, + callback : null } ``` From 0aea2df710d89390fec5fc6fd01ca4ced9eabc85 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Thu, 3 Nov 2016 01:01:28 +0100 Subject: [PATCH 02/12] Convert spaces to tabs --- src/jquery.typer.js | 511 ++++++++++++++++++++++---------------------- 1 file changed, 255 insertions(+), 256 deletions(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index 6892780..becc86d 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -1,262 +1,261 @@ String.prototype.rightChars = function(n){ - if (n <= 0) { - return ""; - } - else if (n > this.length) { - return this; - } - else { - return this.substring(this.length, this.length - n); - } + if (n <= 0) { + return ""; + } + else if (n > this.length) { + return this; + } + else { + return this.substring(this.length, this.length - n); + } }; (function($) { - var - options = { - highlightSpeed : 20, - typeSpeed : 100, - clearDelay : 500, - typeDelay : 200, - clearOnHighlight : true, - typerDataAttr : 'data-typer-targets', - typerInterval : 2000, - callback : null - }, - highlight, - clearText, - backspace, - type, - spanWithColor, - clearDelay, - typeDelay, - clearData, - isNumber, - typeWithAttribute, - getHighlightInterval, - getTypeInterval, - typerInterval; - - spanWithColor = function(color, backgroundColor) { - if (color === 'rgba(0, 0, 0, 0)') { - color = 'rgb(255, 255, 255)'; - } - - return $('') - .css('color', color) - .css('background-color', backgroundColor); - }; - - isNumber = function (n) { - return !isNaN(parseFloat(n)) && isFinite(n); - }; - - clearData = function ($e) { - $e.removeData([ - 'typePosition', - 'highlightPosition', - 'leftStop', - 'rightStop', - 'primaryColor', - 'backgroundColor', - 'text', - 'typing' - ]); - }; - - type = function ($e) { - var - // position = $e.data('typePosition'), - text = $e.data('text'), - oldLeft = $e.data('oldLeft'), - oldRight = $e.data('oldRight'); - - // if (!isNumber(position)) { - // position = $e.data('leftStop'); - // } - - if (!text || text.length === 0) { - clearData($e); - if ($.typer.options.callback) $.typer.options.callback() - return; - } - - - $e.text( - oldLeft + - text.charAt(0) + - oldRight - ).data({ - oldLeft: oldLeft + text.charAt(0), - text: text.substring(1) - }); - - // $e.text($e.text() + text.substring(position, position + 1)); - - // $e.data('typePosition', position + 1); - - setTimeout(function () { - type($e); - }, getTypeInterval()); - }; - - clearText = function ($e) { - $e.find('span').remove(); - - setTimeout(function () { - type($e); - }, typeDelay()); - }; - - highlight = function ($e) { - var - position = $e.data('highlightPosition'), - leftText, - highlightedText, - rightText; - - if (!isNumber(position)) { - position = $e.data('rightStop') + 1; - } - - if (position <= $e.data('leftStop')) { - setTimeout(function () { - clearText($e); - }, clearDelay()); - return; - } - - leftText = $e.text().substring(0, position - 1); - highlightedText = $e.text().substring(position - 1, $e.data('rightStop') + 1); - rightText = $e.text().substring($e.data('rightStop') + 1); - - $e.html(leftText) - .append( - spanWithColor( - $e.data('backgroundColor'), - $e.data('primaryColor') - ) - .append(highlightedText) - ) - .append(rightText); - - $e.data('highlightPosition', position - 1); - - setTimeout(function () { - return highlight($e); - }, getHighlightInterval()); - }; - - typeWithAttribute = function ($e) { - var targets; - - if ($e.data('typing')) { - return; - } - - try { - targets = JSON.parse($e.attr($.typer.options.typerDataAttr)).targets; - } catch (e) {} - - if (typeof targets === "undefined") { - targets = $.map($e.attr($.typer.options.typerDataAttr).split(','), function (e) { - return $.trim(e); - }); - } - - $e.typeTo(targets[Math.floor(Math.random()*targets.length)]); - }; - - // Expose our options to the world. - $.typer = (function () { - return { options: options }; - })(); - - $.extend($.typer, { - options: options - }); - - //-- Methods to attach to jQuery sets - - $.fn.typer = function() { - var $elements = $(this); - - return $elements.each(function () { - var $e = $(this); - - if (typeof $e.attr($.typer.options.typerDataAttr) === "undefined") { - return; - } - - typeWithAttribute($e); - setInterval(function () { - typeWithAttribute($e); - }, typerInterval()); - }); - }; - - $.fn.typeTo = function (newString) { - var - $e = $(this), - currentText = $e.text(), - i = 0, - j = 0; - - if (currentText === newString) { - console.log("Our strings our equal, nothing to type"); - return $e; - } - - if (currentText !== $e.html()) { - console.error("Typer does not work on elements with child elements."); - return $e; - } - - $e.data('typing', true); - - while (currentText.charAt(i) === newString.charAt(i)) { - i++; - } - - while (currentText.rightChars(j) === newString.rightChars(j)) { - j++; - } - - newString = newString.substring(i, newString.length - j + 1); - - $e.data({ - oldLeft: currentText.substring(0, i), - oldRight: currentText.rightChars(j - 1), - leftStop: i, - rightStop: currentText.length - j, - primaryColor: $e.css('color'), - backgroundColor: $e.css('background-color'), - text: newString - }); - - highlight($e); - - return $e; - }; + var options = { + highlightSpeed : 20, + typeSpeed : 100, + clearDelay : 500, + typeDelay : 200, + clearOnHighlight : true, + typerDataAttr : 'data-typer-targets', + typerInterval : 2000, + callback : null + }, + highlight, + clearText, + backspace, + type, + spanWithColor, + clearDelay, + typeDelay, + clearData, + isNumber, + typeWithAttribute, + getHighlightInterval, + getTypeInterval, + typerInterval; + + spanWithColor = function(color, backgroundColor) { + if (color === 'rgba(0, 0, 0, 0)') { + color = 'rgb(255, 255, 255)'; + } + + return $('') + .css('color', color) + .css('background-color', backgroundColor); + }; + + isNumber = function (n) { + return !isNaN(parseFloat(n)) && isFinite(n); + }; + + clearData = function ($e) { + $e.removeData([ + 'typePosition', + 'highlightPosition', + 'leftStop', + 'rightStop', + 'primaryColor', + 'backgroundColor', + 'text', + 'typing' + ]); + }; + + type = function ($e) { + var + // position = $e.data('typePosition'), + text = $e.data('text'), + oldLeft = $e.data('oldLeft'), + oldRight = $e.data('oldRight'); + + // if (!isNumber(position)) { + // position = $e.data('leftStop'); + // } + + if (!text || text.length === 0) { + clearData($e); + if ($.typer.options.callback) $.typer.options.callback() + return; + } + + + $e.text( + oldLeft + + text.charAt(0) + + oldRight + ).data({ + oldLeft: oldLeft + text.charAt(0), + text: text.substring(1) + }); + + // $e.text($e.text() + text.substring(position, position + 1)); + + // $e.data('typePosition', position + 1); + + setTimeout(function () { + type($e); + }, getTypeInterval()); + }; + + clearText = function ($e) { + $e.find('span').remove(); + + setTimeout(function () { + type($e); + }, typeDelay()); + }; + + highlight = function ($e) { + var + position = $e.data('highlightPosition'), + leftText, + highlightedText, + rightText; + + if (!isNumber(position)) { + position = $e.data('rightStop') + 1; + } + + if (position <= $e.data('leftStop')) { + setTimeout(function () { + clearText($e); + }, clearDelay()); + return; + } + + leftText = $e.text().substring(0, position - 1); + highlightedText = $e.text().substring(position - 1, $e.data('rightStop') + 1); + rightText = $e.text().substring($e.data('rightStop') + 1); + + $e.html(leftText) + .append( + spanWithColor( + $e.data('backgroundColor'), + $e.data('primaryColor') + ) + .append(highlightedText) + ) + .append(rightText); + + $e.data('highlightPosition', position - 1); + + setTimeout(function () { + return highlight($e); + }, getHighlightInterval()); + }; + + typeWithAttribute = function ($e) { + var targets; + + if ($e.data('typing')) { + return; + } + + try { + targets = JSON.parse($e.attr($.typer.options.typerDataAttr)).targets; + } catch (e) {} + + if (typeof targets === "undefined") { + targets = $.map($e.attr($.typer.options.typerDataAttr).split(','), function (e) { + return $.trim(e); + }); + } + + $e.typeTo(targets[Math.floor(Math.random()*targets.length)]); + }; + + // Expose our options to the world. + $.typer = (function () { + return { options: options }; + })(); + + $.extend($.typer, { + options: options + }); + + //-- Methods to attach to jQuery sets + + $.fn.typer = function() { + var $elements = $(this); + + return $elements.each(function () { + var $e = $(this); + + if (typeof $e.attr($.typer.options.typerDataAttr) === "undefined") { + return; + } + + typeWithAttribute($e); + setInterval(function () { + typeWithAttribute($e); + }, typerInterval()); + }); + }; + + $.fn.typeTo = function (newString) { + var + $e = $(this), + currentText = $e.text(), + i = 0, + j = 0; + + if (currentText === newString) { + console.log("Our strings our equal, nothing to type"); + return $e; + } + + if (currentText !== $e.html()) { + console.error("Typer does not work on elements with child elements."); + return $e; + } + + $e.data('typing', true); + + while (currentText.charAt(i) === newString.charAt(i)) { + i++; + } + + while (currentText.rightChars(j) === newString.rightChars(j)) { + j++; + } + + newString = newString.substring(i, newString.length - j + 1); + + $e.data({ + oldLeft: currentText.substring(0, i), + oldRight: currentText.rightChars(j - 1), + leftStop: i, + rightStop: currentText.length - j, + primaryColor: $e.css('color'), + backgroundColor: $e.css('background-color'), + text: newString + }); + + highlight($e); + + return $e; + }; - //-- Helper methods. These can one day be customized further to include things like ranges of delays. - - getHighlightInterval = function () { - return $.typer.options.highlightSpeed; - }; - - getTypeInterval = function () { - return $.typer.options.typeSpeed; - }, - - clearDelay = function () { - return $.typer.options.clearDelay; - }, - - typeDelay = function () { - return $.typer.options.typeDelay; - }; - - typerInterval = function () { - return $.typer.options.typerInterval; - }; + //-- Helper methods. These can one day be customized further to include things like ranges of delays. + + getHighlightInterval = function () { + return $.typer.options.highlightSpeed; + }; + + getTypeInterval = function () { + return $.typer.options.typeSpeed; + }, + + clearDelay = function () { + return $.typer.options.clearDelay; + }, + + typeDelay = function () { + return $.typer.options.typeDelay; + }; + + typerInterval = function () { + return $.typer.options.typerInterval; + }; })(jQuery); From c17615a30b63389ed54af86463c0ab1ce28b8934 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Thu, 3 Nov 2016 01:20:54 +0100 Subject: [PATCH 03/12] Implement highlight/highlighted text color --- README.md | 18 ++++++++++-------- src/jquery.typer.js | 15 ++++++++++----- 2 files changed, 20 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index c40c750..488c4fe 100644 --- a/README.md +++ b/README.md @@ -30,14 +30,16 @@ There are some options that are available to you as well: ```javascript // Defaults { - highlightSpeed : 20, - typeSpeed : 100, - clearDelay : 500, - typeDelay : 200, - clearOnHighlight : true, - typerDataAttr : 'data-typer-targets', - typerInterval : 2000, - callback : null + highlightSpeed : 20, + typeSpeed : 100, + clearDelay : 500, + typeDelay : 200, + clearOnHighlight : true, + typerDataAttr : 'data-typer-targets', + typerInterval : 2000, + highlightColor : '#fff', + highlightedTextColor : '#000', + callback : null } ``` diff --git a/src/jquery.typer.js b/src/jquery.typer.js index becc86d..5d239c3 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -18,7 +18,9 @@ String.prototype.rightChars = function(n){ typeDelay : 200, clearOnHighlight : true, typerDataAttr : 'data-typer-targets', - typerInterval : 2000, + typerInterval : 2000, + highlightColor : '#fff', + highlightedTextColor : '#000', callback : null }, highlight, @@ -33,7 +35,9 @@ String.prototype.rightChars = function(n){ typeWithAttribute, getHighlightInterval, getTypeInterval, - typerInterval; + typerInterval, + highlightColor, + highlightedTextColor; spanWithColor = function(color, backgroundColor) { if (color === 'rgba(0, 0, 0, 0)') { @@ -128,11 +132,12 @@ String.prototype.rightChars = function(n){ highlightedText = $e.text().substring(position - 1, $e.data('rightStop') + 1); rightText = $e.text().substring($e.data('rightStop') + 1); + console.log($.typer.options.highlightColor + '/' + $.typer.options.highlightedTextColor); $e.html(leftText) .append( spanWithColor( - $e.data('backgroundColor'), - $e.data('primaryColor') + $.typer.options.highlightColor, + $.typer.options.highlightedTextColor ) .append(highlightedText) ) @@ -258,4 +263,4 @@ String.prototype.rightChars = function(n){ typerInterval = function () { return $.typer.options.typerInterval; }; -})(jQuery); +})(jQuery); \ No newline at end of file From a0d19b5b12e4135f256b166ee8cef01ca7e7440f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Thu, 3 Nov 2016 01:27:48 +0100 Subject: [PATCH 04/12] Remove highlighting only part of the word --- src/jquery.typer.js | 8 -------- 1 file changed, 8 deletions(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index 5d239c3..1e1cf08 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -217,14 +217,6 @@ String.prototype.rightChars = function(n){ $e.data('typing', true); - while (currentText.charAt(i) === newString.charAt(i)) { - i++; - } - - while (currentText.rightChars(j) === newString.rightChars(j)) { - j++; - } - newString = newString.substring(i, newString.length - j + 1); $e.data({ From 0ecaf0a2c4fb9c073aa8ca376b392cf5607d73a5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Thu, 3 Nov 2016 01:39:14 +0100 Subject: [PATCH 05/12] Implement passing settings to function Instead of setting options globally with $.typer, you just pass them to the function. See README. --- README.md | 6 ++++-- src/jquery.typer.js | 16 ++++++++-------- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 488c4fe..54c4efd 100644 --- a/README.md +++ b/README.md @@ -43,10 +43,12 @@ There are some options that are available to you as well: } ``` -Set the options individually: +Set the options: ```javascript -$.typer.options.highlightSpeed = 500; +$('[data-typer-targets]').typer({ + // your options here +}); ``` ## About diff --git a/src/jquery.typer.js b/src/jquery.typer.js index 1e1cf08..547dd17 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -10,8 +10,8 @@ String.prototype.rightChars = function(n){ } }; -(function($) { - var options = { +(function($, options) { + var defaultOptions = { highlightSpeed : 20, typeSpeed : 100, clearDelay : 500, @@ -172,16 +172,16 @@ String.prototype.rightChars = function(n){ // Expose our options to the world. $.typer = (function () { - return { options: options }; + return { options: defaultOptions }; })(); - $.extend($.typer, { - options: options - }); - //-- Methods to attach to jQuery sets - $.fn.typer = function() { + $.fn.typer = function(options) { + $.extend($.typer, { + options: options + }); + var $elements = $(this); return $elements.each(function () { From 92675f7f7bcca63dfa5599b03c3d8cb2b2741282 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Thu, 3 Nov 2016 03:42:05 +0100 Subject: [PATCH 06/12] Fix wrong highlightColor/highlightedTextColor --- src/jquery.typer.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index 547dd17..31ff4e0 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -136,8 +136,9 @@ String.prototype.rightChars = function(n){ $e.html(leftText) .append( spanWithColor( - $.typer.options.highlightColor, - $.typer.options.highlightedTextColor + $.typer.options.highlightedTextColor, + $.typer.options.highlightColor + ) .append(highlightedText) ) @@ -255,4 +256,4 @@ String.prototype.rightChars = function(n){ typerInterval = function () { return $.typer.options.typerInterval; }; -})(jQuery); \ No newline at end of file +})(jQuery); From 2d41e0d9dc86c723f75fee3c45d8c0b510149658 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Sat, 25 Mar 2017 22:29:34 +0100 Subject: [PATCH 07/12] Allows some special characters: "&", quotes Avoid error about HTML not being supported if text includes ampersand or double quotes. --- src/jquery.typer.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index 31ff4e0..d13ccd0 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -138,7 +138,7 @@ String.prototype.rightChars = function(n){ spanWithColor( $.typer.options.highlightedTextColor, $.typer.options.highlightColor - + ) .append(highlightedText) ) @@ -211,7 +211,7 @@ String.prototype.rightChars = function(n){ return $e; } - if (currentText !== $e.html()) { + if (currentText.replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"') !== $e.html()) { console.error("Typer does not work on elements with child elements."); return $e; } @@ -256,4 +256,4 @@ String.prototype.rightChars = function(n){ typerInterval = function () { return $.typer.options.typerInterval; }; -})(jQuery); +})(jQuery); \ No newline at end of file From b51a95a7a34836f0783307d7d7025f40c687b727 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Sat, 25 Mar 2017 22:32:48 +0100 Subject: [PATCH 08/12] Fix typo Hadn't saved before pushing :-/ --- src/jquery.typer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index d13ccd0..eda9d9d 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -211,7 +211,7 @@ String.prototype.rightChars = function(n){ return $e; } - if (currentText.replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"') !== $e.html()) { + if (currentText.replace(/&/g, '&').replace(/"/g, '"') !== $e.html()) { console.error("Typer does not work on elements with child elements."); return $e; } From 90095faa10ef8a9b31a1eb26a83547811bf875d7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Sat, 25 Mar 2017 22:37:54 +0100 Subject: [PATCH 09/12] Clean up code --- src/jquery.typer.js | 40 +++++++++++++++++----------------------- 1 file changed, 17 insertions(+), 23 deletions(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index eda9d9d..2bd8be7 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -12,16 +12,16 @@ String.prototype.rightChars = function(n){ (function($, options) { var defaultOptions = { - highlightSpeed : 20, - typeSpeed : 100, - clearDelay : 500, - typeDelay : 200, - clearOnHighlight : true, - typerDataAttr : 'data-typer-targets', - typerInterval : 2000, - highlightColor : '#fff', - highlightedTextColor : '#000', - callback : null + highlightSpeed : 20, + typeSpeed : 100, + clearDelay : 500, + typeDelay : 200, + clearOnHighlight : true, + typerDataAttr : 'data-typer-targets', + typerInterval : 2000, + highlightColor : '#fff', + highlightedTextColor : '#000', + callback : null }, highlight, clearText, @@ -68,18 +68,15 @@ String.prototype.rightChars = function(n){ type = function ($e) { var - // position = $e.data('typePosition'), text = $e.data('text'), oldLeft = $e.data('oldLeft'), oldRight = $e.data('oldRight'); - // if (!isNumber(position)) { - // position = $e.data('leftStop'); - // } - if (!text || text.length === 0) { clearData($e); - if ($.typer.options.callback) $.typer.options.callback() + + if ($.typer.options.callback) $.typer.options.callback(); + return; } @@ -93,10 +90,6 @@ String.prototype.rightChars = function(n){ text: text.substring(1) }); - // $e.text($e.text() + text.substring(position, position + 1)); - - // $e.data('typePosition', position + 1); - setTimeout(function () { type($e); }, getTypeInterval()); @@ -111,8 +104,7 @@ String.prototype.rightChars = function(n){ }; highlight = function ($e) { - var - position = $e.data('highlightPosition'), + var position = $e.data('highlightPosition'), leftText, highlightedText, rightText; @@ -125,6 +117,7 @@ String.prototype.rightChars = function(n){ setTimeout(function () { clearText($e); }, clearDelay()); + return; } @@ -132,7 +125,6 @@ String.prototype.rightChars = function(n){ highlightedText = $e.text().substring(position - 1, $e.data('rightStop') + 1); rightText = $e.text().substring($e.data('rightStop') + 1); - console.log($.typer.options.highlightColor + '/' + $.typer.options.highlightedTextColor); $e.html(leftText) .append( spanWithColor( @@ -208,11 +200,13 @@ String.prototype.rightChars = function(n){ if (currentText === newString) { console.log("Our strings our equal, nothing to type"); + return $e; } if (currentText.replace(/&/g, '&').replace(/"/g, '"') !== $e.html()) { console.error("Typer does not work on elements with child elements."); + return $e; } From 0b2a03d24e81590e02cbaa6a48ac39ec233ea9f0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Sat, 25 Mar 2017 22:41:13 +0100 Subject: [PATCH 10/12] Remove modifying String's prototype --- src/jquery.typer.js | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index 2bd8be7..1830ed0 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -1,15 +1,3 @@ -String.prototype.rightChars = function(n){ - if (n <= 0) { - return ""; - } - else if (n > this.length) { - return this; - } - else { - return this.substring(this.length, this.length - n); - } -}; - (function($, options) { var defaultOptions = { highlightSpeed : 20, @@ -39,6 +27,18 @@ String.prototype.rightChars = function(n){ highlightColor, highlightedTextColor; + rightChars = function(str, n){ + if (n <= 0) { + return ""; + } + else if (n > this.length) { + return this; + } + else { + return this.substring(this.length, this.length - n); + } + }; + spanWithColor = function(color, backgroundColor) { if (color === 'rgba(0, 0, 0, 0)') { color = 'rgb(255, 255, 255)'; @@ -216,7 +216,7 @@ String.prototype.rightChars = function(n){ $e.data({ oldLeft: currentText.substring(0, i), - oldRight: currentText.rightChars(j - 1), + oldRight: rightChars(currentText, j - 1), leftStop: i, rightStop: currentText.length - j, primaryColor: $e.css('color'), From ed6856a6e8af67a6922b2c778603c90976bc0d70 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Thu, 30 Mar 2017 12:48:38 +0200 Subject: [PATCH 11/12] Update README.md Fix formatting --- README.md | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/README.md b/README.md index 54c4efd..7ca043f 100644 --- a/README.md +++ b/README.md @@ -30,16 +30,16 @@ There are some options that are available to you as well: ```javascript // Defaults { - highlightSpeed : 20, - typeSpeed : 100, - clearDelay : 500, - typeDelay : 200, - clearOnHighlight : true, - typerDataAttr : 'data-typer-targets', - typerInterval : 2000, - highlightColor : '#fff', - highlightedTextColor : '#000', - callback : null + highlightSpeed : 20, + typeSpeed : 100, + clearDelay : 500, + typeDelay : 200, + clearOnHighlight : true, + typerDataAttr : 'data-typer-targets', + typerInterval : 2000, + highlightColor : '#fff', + highlightedTextColor : '#000', + callback : null } ``` @@ -47,7 +47,7 @@ Set the options: ```javascript $('[data-typer-targets]').typer({ - // your options here + // your options here }); ``` ## About From cc621f5e1405745c0ad6985709d253e2e6b3cfd2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niccol=C3=B2=20Brogi?= Date: Wed, 5 Apr 2017 22:32:35 +0200 Subject: [PATCH 12/12] Fix "Typer does not work on elements with child elements." error. --- src/jquery.typer.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/jquery.typer.js b/src/jquery.typer.js index 1830ed0..8da2eb9 100644 --- a/src/jquery.typer.js +++ b/src/jquery.typer.js @@ -192,6 +192,12 @@ }; $.fn.typeTo = function (newString) { + function decodeHtml(html) { + var txt = document.createElement("textarea"); + txt.innerHTML = html; + return txt.value; + } + var $e = $(this), currentText = $e.text(), @@ -204,7 +210,7 @@ return $e; } - if (currentText.replace(/&/g, '&').replace(/"/g, '"') !== $e.html()) { + if (decodeHtml(currentText) !== decodeHtml($e.html())) { console.error("Typer does not work on elements with child elements."); return $e; @@ -250,4 +256,4 @@ typerInterval = function () { return $.typer.options.typerInterval; }; -})(jQuery); \ No newline at end of file +})(jQuery);