From 2665e56daada8aff6682473c6b468a3acc4fc8a4 Mon Sep 17 00:00:00 2001 From: Robert Jefe Lindstaedt Date: Wed, 27 Jan 2016 21:43:05 +0100 Subject: [PATCH 1/2] doc: ecma version switcher --- doc/api_assets/api_app.css | 18 ++++++++++++ doc/api_assets/api_app.js | 59 ++++++++++++++++++++++++++++++++++++++ doc/template.html | 2 ++ 3 files changed, 79 insertions(+) create mode 100644 doc/api_assets/api_app.css create mode 100644 doc/api_assets/api_app.js diff --git a/doc/api_assets/api_app.css b/doc/api_assets/api_app.css new file mode 100644 index 00000000000000..6bd075c37cfe82 --- /dev/null +++ b/doc/api_assets/api_app.css @@ -0,0 +1,18 @@ +.es-switcher > p.active, .es-switcher > p:hover { + background-color: #f2f5f0; + border-color: #f2f5f0; +} +.es-switcher > p { + display: inline-block; + margin: 0px; + cursor: pointer; + padding: 0em 21px; + border-style: solid; + border-color: rgb(255, 255, 255); + border-width: 3px; + background-color: rgb(238, 238, 238); +} +.es-switcher > pre { + border-top-left-radius: 0px !important; + margin: 0px; +} diff --git a/doc/api_assets/api_app.js b/doc/api_assets/api_app.js new file mode 100644 index 00000000000000..1758a076cdc987 --- /dev/null +++ b/doc/api_assets/api_app.js @@ -0,0 +1,59 @@ +'use strict' +const esNextText = 'Modern JavaScript:' +const es5Text = 'ES5:' + +function nextSiblingMatch (e, name, text) { + var sib = e.nextSibling + while (sib) { + if (sib.nodeType == 1) { + if (sib.nodeName == name && (!text || sib.textContent.indexOf(esNextText) > -1)) + return sib + return null + } + sib = sib.nextSibling + } +} + +function renderESCodeBlocks() { + Array.prototype.slice.call(document.querySelectorAll('p')) + .filter(function (p) { + return p.textContent.indexOf(esNextText) > -1}) + .map(function (esNextP) { + var esNextPre = nextSiblingMatch(esNextP, 'PRE') + if (!esNextPre) return null + var es5P = nextSiblingMatch(esNextPre, 'P') + if (!es5P) return null + var es5Pre = nextSiblingMatch(es5P, 'PRE') + if (!es5Pre) return null + return { esNextP: esNextP, esNextPre: esNextPre, es5P: es5P, es5Pre: es5Pre } + }) + .filter(Boolean) + .forEach(function (block) { + var div = document.createElement('div') + div.className = 'es-switcher' + block.esNextP.parentElement.insertBefore(div, block.esNextP) + block.esNextP.textContent = esNextText.replace(/:$/, '') + block.es5P.textContent = es5Text.replace(/:$/, '') + block.esNextP.className = 'active' + div.appendChild(block.esNextP) + div.appendChild(block.es5P) + div.appendChild(block.esNextPre) + div.appendChild(block.es5Pre) + block.es5Pre.style.display = 'none' + block.esNextP.addEventListener('click', function () { + block.esNextPre.style.display = 'block' + block.es5Pre.style.display = 'none' + block.esNextP.className = 'active' + block.es5P.className = '' + }) + block.es5P.addEventListener('click', function () { + block.esNextPre.style.display = 'none' + block.es5Pre.style.display = 'block' + block.esNextP.className = '' + block.es5P.className = 'active' + }) + div.insertAdjacentHTML('afterend', '
') + }) +} + +renderESCodeBlocks() diff --git a/doc/template.html b/doc/template.html index 47bd4ba3e4abb9..8c9dbfbfa57951 100644 --- a/doc/template.html +++ b/doc/template.html @@ -6,6 +6,7 @@ + @@ -45,6 +46,7 @@

Table of Contents

+ From deeb42c293ffec554f3de31fc3267ee007f8535a Mon Sep 17 00:00:00 2001 From: Robert Jefe Lindstaedt Date: Wed, 27 Jan 2016 21:43:40 +0100 Subject: [PATCH 2/2] doc: ecma script version switcher sample --- doc/api/buffer.markdown | 30 ++++++++++++++++++++++++++++++ doc/api/synopsis.markdown | 15 +++++++++++++++ 2 files changed, 45 insertions(+) diff --git a/doc/api/buffer.markdown b/doc/api/buffer.markdown index 8be347a74c725d..b6846706408f8b 100644 --- a/doc/api/buffer.markdown +++ b/doc/api/buffer.markdown @@ -20,6 +20,8 @@ resized. The `Buffer` class is a global within Node.js, making it unlikely that one would need to ever use `require('buffer')`. +Modern JavaScript: + ```js const buf1 = new Buffer(10); // creates a buffer of length 10 @@ -34,6 +36,22 @@ const buf4 = new Buffer('tést', 'utf8'); // creates a buffer containing UTF8 bytes [74, c3, a9, 73, 74] ``` +ES5: + +```js +var buf1 = new Buffer(10); + // creates a buffer of length 10 + +var buf2 = new Buffer([1,2,3]); + // creates a buffer containing [01, 02, 03] + +var buf3 = new Buffer('test'); + // creates a buffer containing ASCII bytes [74, 65, 73, 74] + +var buf4 = new Buffer('tést', 'utf8'); + // creates a buffer containing UTF8 bytes [74, c3, a9, 73, 74] +``` + ## Buffers and Character Encodings Buffers are commonly used to represent sequences of encoded characters @@ -41,6 +59,8 @@ such as UTF8, UCS2, Base64 or even Hex-encoded data. It is possible to convert back and forth between Buffers and ordinary JavaScript string objects by using an explicit encoding method. +Modern JavaScript: + ```js const buf = new Buffer('hello world', 'ascii'); console.log(buf.toString('hex')); @@ -49,6 +69,16 @@ console.log(buf.toString('base64')); // prints: aGVsbG8gd29ybGQ= ``` +ES5: + +```js +var buf = new Buffer('hello world', 'ascii'); +console.log(buf.toString('hex')); + // prints: 68656c6c6f20776f726c64 +console.log(buf.toString('base64')); + // prints: aGVsbG8gd29ybGQ= +``` + The character encodings currently supported by Node.js include: * `'ascii'` - for 7-bit ASCII data only. This encoding method is very fast and diff --git a/doc/api/synopsis.markdown b/doc/api/synopsis.markdown index 7dd3b8fe99d7fd..158ab41e8e2851 100644 --- a/doc/api/synopsis.markdown +++ b/doc/api/synopsis.markdown @@ -5,6 +5,8 @@ An example of a [web server][] written with Node.js which responds with `'Hello World'`: +Modern JavaScript: + ```js const http = require('http'); @@ -16,6 +18,19 @@ http.createServer( (request, response) => { console.log('Server running at http://127.0.0.1:8124/'); ``` +ES5: + +```js +var http = require('http'); + +http.createServer(function (request, response) { + response.writeHead(200, {'Content-Type': 'text/plain'}); + response.end('Hello World\n'); +}).listen(8124); + +console.log('Server running at http://127.0.0.1:8124/'); +``` + To run the server, put the code into a file called `example.js` and execute it with the node program