Fixed double invoke of scripts, added autofocus

niutech · niutech · commit 296f172523a0 · 2016-05-23T04:15:24.000+02:00
diff --git a/htmlpreview.js b/htmlpreview.js
@@ -40,13 +40,14 @@ var HTMLPreview = {
 				HTMLPreview.send(href, 'loadCSS'); //Then load it using YQL
 			}
 		}
-		script = document.querySelectorAll('script');
+		script = document.querySelectorAll('script[type="text/htmlpreview"]');
 		for(i = 0; i < script.length; ++i) {
 			src = script[i].src; //Get absolute URL
 			if(src.indexOf('//raw.githubusercontent.com') > 0 || src.indexOf('//bitbucket.org') > 0) { //Check if it's from raw.github.com or bitbucket.org
 				HTMLPreview.send(src, 'loadJS'); //Then load it using YQL
 			}
-			else if(!src && script[i].innerHTML.indexOf('HTMLPreview') < 0) { //Move all inline scripts except HTMLPreview.replaceAssets()
+			else { //Append all inline scripts
+				script[i].removeAttribute('type');
 				document.write(script[i].outerHTML);
 			}
 		}
@@ -65,7 +66,7 @@ var HTMLPreview = {
 			&& data.query.results.resources
 			&& data.query.results.resources.content
 			&& data.query.results.resources.status == 200) {
-			HTMLPreview.content = data.query.results.resources.content.replace(/<head>/i, '<head><base href="' + HTMLPreview.raw() + '">').replace(/<\/body>/i, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>HTMLPreview.replaceAssets();</script></body>').replace(/<\/head>\s*<frameset/gi, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>document.addEventListener("DOMContentLoaded",HTMLPreview.replaceAssets,false);</script></head><frameset'); //Add <base> just after <head> and inject <script> just before </body> or </head> if <frameset>
+			HTMLPreview.content = data.query.results.resources.content.replace(/<head>/i, '<head><base href="' + HTMLPreview.raw() + '">').replace(/<script( type=["'](text|application)\/javascript["'])?/gi, '<script type="text/htmlpreview"').replace(/<\/body>/i, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>HTMLPreview.replaceAssets();</script></body>').replace(/<\/head>\s*<frameset/gi, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>document.addEventListener("DOMContentLoaded",HTMLPreview.replaceAssets,false);</script></head><frameset'); //Add <base> just after <head> and inject <script> just before </body> or </head> if <frameset>
 			setTimeout(function() {
 				document.open();
 				document.write(HTMLPreview.content);
diff --git a/htmlpreview.min.js b/htmlpreview.min.js
diff --git a/index.html b/index.html
@@ -5,11 +5,11 @@
 	<title>GitHub &amp; BitBucket HTML Preview</title>
 	<style>
 	body {
-		font: 13px Helvetica, arial, freesans, clean, sans-serif;
+		font: 12px 'Helvetica Neue', Helvetica, Arial, freesans, clean, sans-serif;
 		color: #333;
 	}
 	h1 {
-		font-size: 26px;
+		font-size: 20px;
 	}
 	a {
 		color: #666;
@@ -33,8 +33,8 @@
 <body>
 	<form id="previewform" action="">
 		<h1>GitHub &amp; BitBucket HTML Preview</h1>
-		<p>Enter URL of the HTML file to preview: <input type="url" id="file" value="" placeholder="e.g. https://github.com/user/repo/blob/master/index.html" size="70"> <input type="submit" value="&raquo;"></p>
-		<p>or prepend to the URL: <strong>http://htmlpreview.github.io/?</strong>https://raw.github.com/twbs/bootstrap/gh-pages/2.3.2/index.html</p>
+		<p>Enter URL of the HTML file to preview: <input type="url" id="file" value="" placeholder="e.g. https://github.com/user/repo/blob/master/index.html" size="60" autofocus> <input type="submit" value="&raquo;"></p>
+		<p>or prepend to the URL: <strong>http://htmlpreview.github.io/?</strong>https://github.com/twbs/bootstrap/blob/gh-pages/2.3.2/index.html</p>
 		<p>or use this bookmarklet while browsing GitHub or BitBucket: <a href="javascript:void('http://htmlpreview.github.io/'==window.location?alert('Drag me to your bookmarks bar!'):window.location='http://htmlpreview.github.io/?'+window.location)"><strong>HTMLPreview</strong></a></p>
 		<p id="footer">Developed by <a href="https://github.com/niutech">niu tech</a> | Contribute on <a href="https://github.com/htmlpreview/htmlpreview.github.com">GitHub</a></p>
 	</form>

Original file line number	Diff line number	Diff line change
`@@ -40,13 +40,14 @@ var HTMLPreview = {`
`40`	`40`	`HTMLPreview.send(href, 'loadCSS'); //Then load it using YQL`
`41`	`41`	`}`
`42`	`42`	`}`
`43`		`- script = document.querySelectorAll('script');`
	`43`	`+ script = document.querySelectorAll('script[type="text/htmlpreview"]');`
`44`	`44`	`for(i = 0; i < script.length; ++i) {`
`45`	`45`	`src = script[i].src; //Get absolute URL`
`46`	`46`	`if(src.indexOf('//raw.githubusercontent.com') > 0 \|\| src.indexOf('//bitbucket.org') > 0) { //Check if it's from raw.github.com or bitbucket.org`
`47`	`47`	`HTMLPreview.send(src, 'loadJS'); //Then load it using YQL`
`48`	`48`	`}`
`49`		`- else if(!src && script[i].innerHTML.indexOf('HTMLPreview') < 0) { //Move all inline scripts except HTMLPreview.replaceAssets()`
	`49`	`+ else { //Append all inline scripts`
	`50`	`+ script[i].removeAttribute('type');`
`50`	`51`	`document.write(script[i].outerHTML);`
`51`	`52`	`}`
`52`	`53`	`}`
`@@ -65,7 +66,7 @@ var HTMLPreview = {`
`65`	`66`	`&& data.query.results.resources`
`66`	`67`	`&& data.query.results.resources.content`
`67`	`68`	`&& data.query.results.resources.status == 200) {`
`68`		- HTMLPreview.content = data.query.results.resources.content.replace(/<head>/i, '<head><base href="' + HTMLPreview.raw() + '">').replace(/<\/body>/i, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>HTMLPreview.replaceAssets();</script></body>').replace(/<\/head>\s*<frameset/gi, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>document.addEventListener("DOMContentLoaded",HTMLPreview.replaceAssets,false);</script></head><frameset'); //Add <base> just after <head> and inject <script> just before </body> or </head> if <frameset>
	`69`	+ HTMLPreview.content = data.query.results.resources.content.replace(/<head>/i, '<head><base href="' + HTMLPreview.raw() + '">').replace(/<script( type=["'](text\|application)\/javascript["'])?/gi, '<script type="text/htmlpreview"').replace(/<\/body>/i, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>HTMLPreview.replaceAssets();</script></body>').replace(/<\/head>\s*<frameset/gi, '<script src="//' + location.hostname + '/htmlpreview.min.js"></script><script>document.addEventListener("DOMContentLoaded",HTMLPreview.replaceAssets,false);</script></head><frameset'); //Add <base> just after <head> and inject <script> just before </body> or </head> if <frameset>
`69`	`70`	`setTimeout(function() {`
`70`	`71`	`document.open();`
`71`	`72`	`document.write(HTMLPreview.content);`