lesterzone/nw-external-links.html

## nw-external-links.html
<!DOCTYPE html>
<html>
<body>

	<script>

		var gui = require('nw.gui');

		function supportExternalLinks(event) {

			var href;
			var isExternal = false;

			function crawlDom(element) {
				if (element.nodeName.toLowerCase() === 'a') {
					href = element.getAttribute('href');
				}
				if (element.classList.contains('js-external-link')) {
					isExternal = true;
				}

				if (href && isExternal) {
					gui.Shell.openExternal(href);
					event.preventDefault();
				} else if (element.parentElement) {
					crawlDom(element.parentElement);
				}
			}

			crawlDom(event.target);
		}

		document.body.addEventListener('click', supportExternalLinks, false);

	</script>

	<p>
		Every link with class <b>.js-external-link</b> will be opened
		in external browser.<br/>
		<a class="js-external-link" href="http://google.com">google</a>
	</p>

	<p class="js-external-link">
		The same behaviour for many links can be achieved by adding
		this class to any parent tag of an anchor tag.<br/>
		<a href="http://google.com">google</a>
		<a href="http://bing.com">bing</a>
	</p>

	<p>
		Links without this class are opened as always.<br/>
		<a href="http://google.com">google</a>
	</p>

</body>
</html>
	<!DOCTYPE html>
	<html>
	<body>

	<script>

	var gui = require('nw.gui');

	function supportExternalLinks(event) {

	var href;
	var isExternal = false;

	function crawlDom(element) {
	if (element.nodeName.toLowerCase() === 'a') {
	href = element.getAttribute('href');
	}
	if (element.classList.contains('js-external-link')) {
	isExternal = true;
	}

	if (href && isExternal) {
	gui.Shell.openExternal(href);
	event.preventDefault();
	} else if (element.parentElement) {
	crawlDom(element.parentElement);
	}
	}

	crawlDom(event.target);
	}

	document.body.addEventListener('click', supportExternalLinks, false);

	</script>

	<p>
	Every link with class <b>.js-external-link</b> will be opened
	in external browser.<br/>
	<a class="js-external-link" href="http://google.com">google</a>
	</p>

	<p class="js-external-link">
	The same behaviour for many links can be achieved by adding
	this class to any parent tag of an anchor tag.<br/>
	<a href="http://google.com">google</a>
	<a href="http://bing.com">bing</a>
	</p>

	<p>
	Links without this class are opened as always.<br/>
	<a href="http://google.com">google</a>
	</p>

	</body>
	</html>