atk/LICENSE.txt

## README.md

      
    Raw
  

              README.md
            
          
    basic js syntax highlighting

Encapsulates found regexp, strings, comments, keywords, predefined objects, numbers, brackets and operators into t-tags with a matching class.
Usage

Requires a RegExp to match regexp, strings, comments, keywords, predefined objects, numbers, brackets and operators, e.g.:
var re = /(?![\d\w]\s*)(\/[^\/\*][^\n\/]*\/[gi])|(".*?"|'.*?')|(\/\/.*?\n|\/\*[\x00-\xff\u00\uffff]*?\*\/)|(?:\b)(abstract|boolean|break|byte|case|catch|char|class|const|continue|debugger|default|delete|do|double|else|enum|export|extends|false|final|finally|float|for|function|goto|if|implements|import|in|instanceof|int|interface|long|native|new|null|package|private|protected|public|return|short|static|super|switch|synchronized|this|throw|throws|transient|true|try|typeof|var|void|volatile|while|with)(?:\b)|(?:\b)(Array|Boolean|Date|Function|Math|Number|Object|RegExp|String|document|window|arguments)(?:\b)|(\d[\d\.eE]*)|([\x28-\x2b\x2d\x3a-\x3f\x5b\x5d\x5e\x7b-\x7e]+|\x2f|(?=\D)\.(?=\D))/g;
Provides a filter inserting t-tags* with the following classNames:

f-1 = regexp
f1 = string
f2 = comment
f3 = keyword
f4 = predefined object
f5 = number
f6 = operator, bracket

remember to use innerText/firstChild.data instead of innerHTML to avoid its ability to convert HTML entities which cannot be matched here. "&" needs to be escaped beforehand, otherwise will be transformed on html reinsertion.
* IE6-8 need a js shim to allow for the non-standard tag:
document.createElement('t');
This was created with the 140byt.es homepage in mind, too :-)

  
## annotated.js
function(
  c, // code
  r  // regexp
){
  return c.replace(r,
    // use a replace callback
    function(
      f, // full match
      i  // counter
    ){
      for(
        // initialize counter (with count of regexp arguments)
        i=7;
        // only continue until i is other than -1 (~i becomes 0)
        // and arguments[i] is not present (!'' becomes true coerces to 1),
        // decrease counter
        ~i * !arguments[i--]
      // found something?
      return f ?
        // encapsulate it with a t-tag adding the corresponding class name
        '<t class=f' + i + '>' +
          // replace "<" so it will not be interpreted as a tag
          f.replace('<','&lt;') +
          '</t>' :
        // otherwise return empty string
        '';
  })
}

## index.js
function(c,r){return c.replace(r,function(f,i){for(i=7;~i*!arguments[i--];);return i?'<t class=f'+i+'>'+f.replace('<','&lt;')+'</t>':''})}

## LICENSE.txt
            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
                    Version 2, December 2004

 Copyright (C) 2011 Alex Kloss <alexthkloss@web.de>

 Everyone is permitted to copy and distribute verbatim or modified
 copies of this license document, and changing it is allowed as long
 as the name is changed.

            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
   TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION

  0. You just DO WHAT THE FUCK YOU WANT TO.

## package.json
{
  "name": "jsSyntaxHighlighting",

  "description": "Basic JS Syntax highlighting in 138bytes",

  "keywords": [
    "JavaScript",
    "Syntax",
    "Highlighting"
  ]
}

## test.html
<!DOCTYPE html>
<title>small syntax highlighting</title>
<style>
/* syntax highlighting styles, shameless ripoff off github ;-) */
body{font-family:sans-serif;}
pre{color:#333;font-size:120%;background:#fff;width:100%;overflow-x:auto;padding:5px;}
/* regexp */
.f-1, .f-1 * {color:#092;}
/* string */
.f1,.f1 * {color:#d14;}
/* comment */
.f2,.f2 * {color:#999;font-style:italic;}
/* keyword */
.f3,.f3 * {color:#000;font-weight: 700;}
/* predefined object */
.f4,.f4 * {color:#08B;}
/* number */
.f5,.f5 * {color:#099;}
/* bracket, operator */
.f6 {color:#000;}
</style>
<div>
<h2>Code with syntax highlighting:</h2>
<pre id="ret">/* index.js */

function(c,r){return c.replace(r,function(f,i){for(i=7;~i*!arguments[i--];);return i?'&lt;t class=f'+i+'>'+f.replace('&lt;','&amp;lt;')+'&lt;/t>':''})}

/* annotated.js */

function(
  c, // code
  r  // regexp
){
  return c.replace(r,
    // use a replace callback
    function(
      f, // full match
      i  // counter
    ){
      for(
        // initialize counter (with count of regexp arguments)
        i=6;
        // only continue until i is other than -1 (~i becomes 0)
        // and arguments[i] is not present (!'' becomes true coerces to 1),
        // decrease counter
        ~i * !arguments[i--]
      // found something?
      return f ?
        // encapsulate it with a t-tag adding the corresponding class name
        '&lt;t class=f' + i + '>' +
          // replace "&lt;" so it will not be interpreted as a tag
          f.replace('&lt;','&amp;lt;') +
          '&lt;/t>' :
        // otherwise return empty string
        '';
  })
}

</pre>
</div>

<script>
  // RegExp to detect regexp, strings, comments, keywords, predefined object, numbers and operators
  var re = /(?![\d\w]\s*)(\/[^\/\*][^\n\/]*\/[gi])|(".*?"|'.*?')|(\/\/.*?\n|\/\*[\x00-\xff\u00\uffff]*?\*\/)|(?:\b)(abstract|boolean|break|byte|case|catch|char|class|const|continue|debugger|default|delete|do|double|else|enum|export|extends|false|final|finally|float|for|function|goto|if|implements|import|in|instanceof|int|interface|long|native|new|null|package|private|protected|public|return|short|static|super|switch|synchronized|this|throw|throws|transient|true|try|typeof|var|void|volatile|while|with)(?:\b)|(?:\b)(Array|Boolean|Date|Function|Math|Number|Object|RegExp|String|document|window|arguments)(?:\b)|(\d[\d\.eE]*)|([\x28-\x2b\x2d\x3a-\x3f\x5b\x5d\x5e\x7b-\x7e]+|\x2f|(?=\D)\.(?=\D))/g;
  // syntax highlighting filter
  var myFunction = function(c,r){return c.replace(r,function(f,i){for(i=7;~i*!arguments[i--];);return i?'<t class=f'+i+'>'+f.replace('<','&lt;')+'</t>':''})}
  // test it on the textual contents of the pre tag with the id "ret"
  var ret = document.getElementById( "ret" );
  ret.innerHTML = myFunction(ret.firstChild.data.replace(/&/g,'&amp;'),re);
</script>
	function(
	c, // code
	r // regexp
	){
	return c.replace(r,
	// use a replace callback
	function(
	f, // full match
	i // counter
	){
	for(
	// initialize counter (with count of regexp arguments)
	i=7;
	// only continue until i is other than -1 (~i becomes 0)
	// and arguments[i] is not present (!'' becomes true coerces to 1),
	// decrease counter
	~i * !arguments[i--]
	// found something?
	return f ?
	// encapsulate it with a t-tag adding the corresponding class name
	'<t class=f' + i + '>' +
	// replace "<" so it will not be interpreted as a tag
	f.replace('<','<') +
	'</t>' :
	// otherwise return empty string
	'';
	})
	}
	DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
	Version 2, December 2004

	Copyright (C) 2011 Alex Kloss <alexthkloss@web.de>

	Everyone is permitted to copy and distribute verbatim or modified
	copies of this license document, and changing it is allowed as long
	as the name is changed.

	DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
	TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION

	0. You just DO WHAT THE FUCK YOU WANT TO.
	{
	"name": "jsSyntaxHighlighting",

	"description": "Basic JS Syntax highlighting in 138bytes",

	"keywords": [
	"JavaScript",
	"Syntax",
	"Highlighting"
	]
	}
	<!DOCTYPE html>
	<title>small syntax highlighting</title>
	<style>
	/* syntax highlighting styles, shameless ripoff off github ;-) */
	body{font-family:sans-serif;}
	pre{color:#333;font-size:120%;background:#fff;width:100%;overflow-x:auto;padding:5px;}
	/* regexp */
	.f-1, .f-1 * {color:#092;}
	/* string */
	.f1,.f1 * {color:#d14;}
	/* comment */
	.f2,.f2 * {color:#999;font-style:italic;}
	/* keyword */
	.f3,.f3 * {color:#000;font-weight: 700;}
	/* predefined object */
	.f4,.f4 * {color:#08B;}
	/* number */
	.f5,.f5 * {color:#099;}
	/* bracket, operator */
	.f6 {color:#000;}
	</style>
	<div>
	<h2>Code with syntax highlighting:</h2>
	<pre id="ret">/* index.js */

	function(c,r){return c.replace(r,function(f,i){for(i=7;~i*!arguments[i--];);return i?'<t class=f'+i+'>'+f.replace('<','&lt;')+'</t>':''})}

	/* annotated.js */

	function(
	c, // code
	r // regexp
	){
	return c.replace(r,
	// use a replace callback
	function(
	f, // full match
	i // counter
	){
	for(
	// initialize counter (with count of regexp arguments)
	i=6;
	// only continue until i is other than -1 (~i becomes 0)
	// and arguments[i] is not present (!'' becomes true coerces to 1),
	// decrease counter
	~i * !arguments[i--]
	// found something?
	return f ?
	// encapsulate it with a t-tag adding the corresponding class name
	'<t class=f' + i + '>' +
	// replace "<" so it will not be interpreted as a tag
	f.replace('<','&lt;') +
	'</t>' :
	// otherwise return empty string
	'';
	})
	}

	</pre>
	</div>

	<script>
	// RegExp to detect regexp, strings, comments, keywords, predefined object, numbers and operators
	var re = /(?![\d\w]\s)(\/[^\/\][^\n\/]\/[gi])\|(".?"\|'.?')\|(\/\/.?\n\|\/\[\x00-\xff\u00\uffff]?\\/)\|(?:\b)(abstract\|boolean\|break\|byte\|case\|catch\|char\|class\|const\|continue\|debugger\|default\|delete\|do\|double\|else\|enum\|export\|extends\|false\|final\|finally\|float\|for\|function\|goto\|if\|implements\|import\|in\|instanceof\|int\|interface\|long\|native\|new\|null\|package\|private\|protected\|public\|return\|short\|static\|super\|switch\|synchronized\|this\|throw\|throws\|transient\|true\|try\|typeof\|var\|void\|volatile\|while\|with)(?:\b)\|(?:\b)(Array\|Boolean\|Date\|Function\|Math\|Number\|Object\|RegExp\|String\|document\|window\|arguments)(?:\b)\|(\d[\d\.eE])\|([\x28-\x2b\x2d\x3a-\x3f\x5b\x5d\x5e\x7b-\x7e]+\|\x2f\|(?=\D)\.(?=\D))/g;
	// syntax highlighting filter
	var myFunction = function(c,r){return c.replace(r,function(f,i){for(i=7;~i*!arguments[i--];);return i?'<t class=f'+i+'>'+f.replace('<','<')+'</t>':''})}
	// test it on the textual contents of the pre tag with the id "ret"
	var ret = document.getElementById( "ret" );
	ret.innerHTML = myFunction(ret.firstChild.data.replace(/&/g,'&'),re);
	</script>