Added implementation of relative links #7

README.md

@@ -56,5 +56,26 @@ $(document).ready(function() {
 });
 ```
 
+## Additional features
+
+#### Links
+```js
+hljs.initLineNumbersOnLoad({
+	withLinks: true
+});
+```
+
+```css
+.hljs-line-numbers a {
+	text-decoration: none;
+	color: #999;
+}
+.hljs-line-numbers a:target {
+	color: #ff0000;
+	text-decoration: underline;
+	outline: none;
+}
+```
+
 ---
 © 2015 Yauheni Pakala | MIT License

src/highlightjs-line-numbers.js

@@ -8,50 +8,67 @@
 		w.hljs.lineNumbersBlock = lineNumbersBlock;
 	}
 
-	function initLineNumbersOnLoad () {
+	var defaultOptions = {
+		withLinks: false
+	};
+
+	function initLineNumbersOnLoad (options) {
+		options = options || defaultOptions;
 		if (document.readyState === 'complete') {
-			documentReady();
+			documentReady(options);
 		} else {
-			w.addEventListener('DOMContentLoaded', documentReady);
+			w.addEventListener('DOMContentLoaded', function() { documentReady(options); });
 		}
 	}
 
-	function documentReady () {
+	function documentReady (options) {
 		try {
 			var blocks = document.querySelectorAll('code.hljs');
 
 			for (var i in blocks) {
 				if (blocks.hasOwnProperty(i)) {
-					lineNumbersBlock(blocks[i]);
+						lineNumbersBlock(blocks[i], {
+							blockName: 'c' + i,
+							withLinks: options.withLinks
+						});
 				}
 			}
 		} catch (e) {
 			console.error('LineNumbers error: ', e);
 		}
 	}
 
-	function lineNumbersBlock (element) {
+	function lineNumbersBlock (element, options) {
 		if (typeof element !== 'object') return;
+		if (!!options) {
+			options.withLinks = options.withLinks || false;
+			options.blockName = options.blockName || false;
+		} else {
+			options = defaultOptions;
+			options.blockName = '';
+		}
 
 		var parent = element.parentNode;
 		var lines = getCountLines(parent.textContent);
 
 		if (lines > 1) {
 			var l = '';
 			for (var i = 0; i < lines; i++) {
-				l += (i + 1) + '\n';
+				l +=  options.withLinks
+					? getLineWithLink(i + 1, options.blockName)
+					: (i + 1) + '\n';
 			}
 
 			var linesPanel = document.createElement('code');
 			linesPanel.className = 'hljs hljs-line-numbers';
 			linesPanel.style.float = 'left';
-			linesPanel.textContent = l;
+			linesPanel.innerHTML = l;
 
 			parent.insertBefore(linesPanel, element);
 		}
 	}
 
-	function getCountLines(text) {
+	function getCountLines (text) {
 		if (text.length === 0) return 0;
 
 		var regExp = /\r\n|\r|\n/g;
@@ -64,4 +81,9 @@
 
 		return lines;
 	}
-}(window));
+
+	function getLineWithLink (i, blockName) {
+		var id = blockName + '_l' + i;
+		return '<a href="#' + id + '" name="' + id + '">' + i + '</a>\n'
+	}
+}(window));