kmx.io/prism.js

diff --git a/plugins/line-numbers/index.html b/plugins/line-numbers/index.html
index 598ec93..363c2fa 100644
--- a/plugins/line-numbers/index.html
+++ b/plugins/line-numbers/index.html
@@ -29,7 +29,7 @@
   <p>Obviously, this is supposed to work only for code blocks (<code>&lt;pre>&lt;code></code>) and not for inline code.</p>
   <p>Add class <strong>line-numbers</strong> to your desired <code>&lt;pre></code> and line-numbers plugin will take care.</p>
   <p>Optional: You can specify the <code>data-start</code> (Number) attribute on the <code>&lt;pre></code> element. It will shift the line counter.</p>
-  <p>Optional: To support multiline line numbers add <code>line-numbers-break-word</code> class.</p>
+  <p>Optional: To support multiline line numbers using soft wrap add css <code>white-space</code> to <code>pre-line</code> or <code>pre-wrap</code>.</p>
 </section>
 
 <section>
@@ -43,7 +43,7 @@
 
   <h2>HTML</h2>
   <p>Please note the <code>data-start="-5"</code> in the code below.</p>
-  <pre class="line-numbers line-numbers-break-word" data-src="plugins/line-numbers/index.html" data-start="-5"></pre>
+  <pre class="line-numbers" data-src="plugins/line-numbers/index.html" data-start="-5" style="white-space:pre-wrap;"></pre>
 </section>
 
 <footer data-src="templates/footer.html" data-type="text/html"></footer>
diff --git a/plugins/line-numbers/prism-line-numbers.css b/plugins/line-numbers/prism-line-numbers.css
index 861d9af..e32989b 100644
--- a/plugins/line-numbers/prism-line-numbers.css
+++ b/plugins/line-numbers/prism-line-numbers.css
@@ -4,13 +4,10 @@ pre.line-numbers {
 	counter-reset: linenumber;
 }
 
-pre.line-numbers-break-word > code {
-	white-space: pre-wrap;
-	display: inline-block;
-}
-
 pre.line-numbers > code {
 	position: relative;
+    display: inline-block;
+    white-space: inherit;
 }
 
 .line-numbers .line-numbers-rows {
diff --git a/plugins/line-numbers/prism-line-numbers.js b/plugins/line-numbers/prism-line-numbers.js
index 4eabfa8..2d0f480 100644
--- a/plugins/line-numbers/prism-line-numbers.js
+++ b/plugins/line-numbers/prism-line-numbers.js
@@ -1,34 +1,59 @@
 (function(){
 
 	/**
-	 * Class name which is used to flag this code field has break-word css attr
+	 * Class name for <pre> which is activating the plugin
 	 * @type {String}
 	 */
-	var BREAK_WORD_CLASS = 'line-numbers-break-word';
+	var PLUGIN_CLASS = 'line-numbers';
 
 	/**
 	 * Resizes line numbers spans according to height of line of code
-	 * @param  {Element} element <code> element
+	 * @param  {Element} element <pre> element
 	 */
 	var _resizeElement = function(element){
-		var lineNumbersWrapper = element.querySelector('.line-numbers-rows');
-		var lineNumberSizer = element.querySelector('.line-numbers-sizer');
-		var codeLines = element.textContent.split('\n');
+    var codeStyles = getStyles(element);
+    var whiteSpace = codeStyles['white-space'];
 
-		lineNumberSizer.style.display = 'block';
+    if (whiteSpace === 'pre-wrap' || whiteSpace === 'pre-line'){
+      var codeElement = element.querySelector('code');
+      var lineNumbersWrapper = element.querySelector('.line-numbers-rows');
+      var lineNumberSizer = element.querySelector('.line-numbers-sizer');
+      var codeLines = element.textContent.split('\n');
 
-		codeLines.forEach(function(line, lineNumber){
-			lineNumberSizer.textContent = line || '\n';
-			var lineSize = lineNumberSizer.getBoundingClientRect().height;
-			lineNumbersWrapper.children[lineNumber].style.height = lineSize + 'px';
-		});
+      if (!lineNumberSizer){
+        lineNumberSizer = document.createElement('span');
+        lineNumberSizer.className = 'line-numbers-sizer';
 
-		lineNumberSizer.textContent = '';
-		lineNumberSizer.style.display = 'none';
+        codeElement.appendChild(lineNumberSizer);
+      }
+
+      lineNumberSizer.style.display = 'block';
+
+      codeLines.forEach(function(line, lineNumber){
+        lineNumberSizer.textContent = line || '\n';
+        var lineSize = lineNumberSizer.getBoundingClientRect().height;
+        lineNumbersWrapper.children[lineNumber].style.height = lineSize + 'px';
+      });
+
+      lineNumberSizer.textContent = '';
+      lineNumberSizer.style.display = 'none';
+    }
 	};
 
+  /**
+   * Returns style declarations for the element
+   * @param {Element} element
+   */
+  var getStyles = function(element){
+    if (!element){
+      return null;
+    }
+
+    return window.getComputedStyle ? getComputedStyle(element) : (element.currentStyle || null);
+  };
+
 	window.addEventListener('resize', function(){
-		Array.prototype.forEach.call(document.querySelectorAll('pre.' + BREAK_WORD_CLASS), _resizeElement);
+		Array.prototype.forEach.call(document.querySelectorAll('pre.' + PLUGIN_CLASS), _resizeElement);
 	});
 
 	Prism.hooks.add('after-highlight', function (env) {
@@ -67,14 +92,7 @@
 
 		env.element.appendChild(lineNumbersWrapper);
 
-		if (pre.classList.contains(BREAK_WORD_CLASS)){
-			var lineHeightSizer = document.createElement('span');
-			lineHeightSizer.className = 'line-numbers-sizer';
-
-			env.element.appendChild(lineHeightSizer);
-			_resizeElement(env.element);
-		}
-
+    _resizeElement(pre);
 	});
 
 })();
\ No newline at end of file