Closer2U/_000 Gist Shortcuts.md

## _000 Gist Shortcuts.md

      
    Raw
  

              _000 Gist Shortcuts.md
            
          
    1. Gist.io (.md files)


gist.github.com/username/id --> gist.io/@username/id

2. bl.ocks.org (.html .css files)


gist.github.com/username/id --> bl.ocks.org/username/id

3. gist.run


jsfiddle, plunker, gist import. run .html , .css , .js for testing and saving

4. html css js hosting (... via CDN)


http://htmlpreview.github.io/https://[...]
https://combinatronics.com
https://gitcdn.link
https://rawgit.org --> also available for gitlab and bitbucket


## _004 htmlpreview.html
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>GitHub &amp; BitBucket HTML Preview</title>
	<style>
	body {
		font: 13px Helvetica, arial, freesans, clean, sans-serif;
		color: #333;
	}
	h1 {
		font-size: 24px;
	}
	a {
		color: #666;
	}
	form {
		padding: 20px;
		text-align: center;
	}
	strong {
		color: #333;
		background-color: #FAFFA6;
		padding: 0.1em;
	}
	#footer {
		margin: 20px 0;
		font-size: 10px;
		color: #666;
	}
	</style>
</head>
<body>
	<form id="previewform" action="">
		<h1>GitHub &amp; BitBucket HTML Preview</h1>
		<p>Enter 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>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>
	<script>var HTMLPreview={content:"",previewform:document.getElementById("previewform"),file:function(){return location.search.substring(1)},raw:function(){return HTMLPreview.file().replace(/\/\/github\.com/,"//raw.githubusercontent.com").replace(/\/blob\//,"/")},replaceAssets:function(){var a,b,c;a=document.querySelectorAll("iframe[src],frame[src]");for(b=0;b<a.length;++b)if(c=a[b].src,0<c.indexOf("//raw.githubusercontent.com")||0<c.indexOf("//bitbucket.org"))a[b].src="http://"+location.hostname+location.pathname+"?"+c;a=document.querySelectorAll("a[href]");for(b=0;b<a.length;++b)if(c=a[b].href,0<c.indexOf("#"))a[b].href="http://"+location.hostname+location.pathname+location.search+"#"+a[b].hash.substring(1);else if((0<c.indexOf("//raw.githubusercontent.com")||0<c.indexOf("//bitbucket.org"))&&(0<c.indexOf(".html")||0<c.indexOf(".htm")))a[b].href="http://"+location.hostname+location.pathname+"?"+c;if(!document.querySelectorAll("frameset").length){a=document.querySelectorAll("link[rel=stylesheet]");for(b=0;b<a.length;++b)c=a[b].href,(0<c.indexOf("//raw.githubusercontent.com")||0<c.indexOf("//bitbucket.org"))&&HTMLPreview.send(c,"loadCSS");a=document.querySelectorAll("script");for(b=0;b<a.length;++b)c=a[b].src,0<c.indexOf("//raw.githubusercontent.com")||0<c.indexOf("//bitbucket.org")?HTMLPreview.send(c,"loadJS"):!c&&0>a[b].innerHTML.indexOf("HTMLPreview")&&document.write(a[b].outerHTML)}},loadHTML:function(a){a&&a.query&&a.query.diagnostics&&a.query.diagnostics.redirect?HTMLPreview.send(a.query.diagnostics.redirect.content,"loadHTML"):a&&a.query&&a.query.results&&a.query.results.resources&&a.query.results.resources.content&&200==a.query.results.resources.status?(HTMLPreview.content=a.query.results.resources.content.replace(/<head>/i,'<head><base href="'+HTMLPreview.raw()+'">').replace(/<\/body>/i,'<script src="http://'+location.hostname+'/htmlpreview.min.js">\x3c/script><script>HTMLPreview.replaceAssets();\x3c/script></body>').replace(/<\/head>\s*<frameset/gi,'<script src="http://'+location.hostname+'/htmlpreview.min.js">\x3c/script><script>document.addEventListener("DOMContentLoaded",HTMLPreview.replaceAssets,false);\x3c/script></head><frameset'),setTimeout(function(){document.open();document.write(HTMLPreview.content);document.close()},50)):HTMLPreview.previewform.innerHTML=a&&a.error&&a.error.description?a.error.description:"Error: Cannot load file "+HTMLPreview.raw()},loadCSS:function(a){a&&a.query&&a.query.diagnostics&&a.query.diagnostics.redirect?HTMLPreview.send(a.query.diagnostics.redirect.content,"loadCSS"):a&&a.query&&a.query.results&&a.query.results.resources&&a.query.results.resources.content&&200==a.query.results.resources.status&&document.write("<style>"+a.query.results.resources.content.replace(/url\((?:'|")?([^\/][^:'"\)]+)(?:'|")?\)/gi,"url("+a.query.results.resources.url.replace(/[^\/]+\.css.*$/gi,"")+"$1)")+"</style>")},loadJS:function(a){a&&a.query&&a.query.diagnostics&&a.query.diagnostics.redirect?HTMLPreview.send(a.query.diagnostics.redirect.content,"loadJS"):a&&a.query&&a.query.results&&a.query.results.resources&&a.query.results.resources.content&&200==a.query.results.resources.status&&document.write("<script>"+a.query.results.resources.content+"\x3c/script>")},send:function(a,b){document.write('<script src="http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20data.headers%20where%20url%3D%22'+encodeURIComponent(a)+"%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=HTMLPreview."+b+'">\x3c/script>')},submitform:function(){location.href="/?"+document.getElementById("file").value;return!1},init:function(){HTMLPreview.previewform.onsubmit=HTMLPreview.submitform;HTMLPreview.file()&&(HTMLPreview.previewform.innerHTML="<p>Loading...</p>",HTMLPreview.send(HTMLPreview.raw(),"loadHTML"))}};
</script>
	<script>HTMLPreview.init();</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>GitHub & BitBucket HTML Preview</title>
	<style>
	body {
	font: 13px Helvetica, arial, freesans, clean, sans-serif;
	color: #333;
	}
	h1 {
	font-size: 24px;
	}
	a {
	color: #666;
	}
	form {
	padding: 20px;
	text-align: center;
	}
	strong {
	color: #333;
	background-color: #FAFFA6;
	padding: 0.1em;
	}
	#footer {
	margin: 20px 0;
	font-size: 10px;
	color: #666;
	}
	</style>
	</head>
	<body>
	<form id="previewform" action="">
	<h1>GitHub & BitBucket HTML Preview</h1>
	<p>Enter 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="»"></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>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>
	<script>var HTMLPreview={content:"",previewform:document.getElementById("previewform"),file:function(){return location.search.substring(1)},raw:function(){return HTMLPreview.file().replace(/\/\/github\.com/,"//raw.githubusercontent.com").replace(/\/blob\//,"/")},replaceAssets:function(){var a,b,c;a=document.querySelectorAll("iframe[src],frame[src]");for(b=0;b<a.length;++b)if(c=a[b].src,0<c.indexOf("//raw.githubusercontent.com")\|\|0<c.indexOf("//bitbucket.org"))a[b].src="http://"+location.hostname+location.pathname+"?"+c;a=document.querySelectorAll("a[href]");for(b=0;b<a.length;++b)if(c=a[b].href,0<c.indexOf("#"))a[b].href="http://"+location.hostname+location.pathname+location.search+"#"+a[b].hash.substring(1);else if((0<c.indexOf("//raw.githubusercontent.com")\|\|0<c.indexOf("//bitbucket.org"))&&(0<c.indexOf(".html")\|\|0<c.indexOf(".htm")))a[b].href="http://"+location.hostname+location.pathname+"?"+c;if(!document.querySelectorAll("frameset").length){a=document.querySelectorAll("link[rel=stylesheet]");for(b=0;b<a.length;++b)c=a[b].href,(0<c.indexOf("//raw.githubusercontent.com")\|\|0<c.indexOf("//bitbucket.org"))&&HTMLPreview.send(c,"loadCSS");a=document.querySelectorAll("script");for(b=0;b<a.length;++b)c=a[b].src,0<c.indexOf("//raw.githubusercontent.com")\|\|0<c.indexOf("//bitbucket.org")?HTMLPreview.send(c,"loadJS"):!c&&0>a[b].innerHTML.indexOf("HTMLPreview")&&document.write(a[b].outerHTML)}},loadHTML:function(a){a&&a.query&&a.query.diagnostics&&a.query.diagnostics.redirect?HTMLPreview.send(a.query.diagnostics.redirect.content,"loadHTML"):a&&a.query&&a.query.results&&a.query.results.resources&&a.query.results.resources.content&&200==a.query.results.resources.status?(HTMLPreview.content=a.query.results.resources.content.replace(/<head>/i,'<head><base href="'+HTMLPreview.raw()+'">').replace(/<\/body>/i,'<script src="http://'+location.hostname+'/htmlpreview.min.js">\x3c/script><script>HTMLPreview.replaceAssets();\x3c/script></body>').replace(/<\/head>\s<frameset/gi,'<script src="http://'+location.hostname+'/htmlpreview.min.js">\x3c/script><script>document.addEventListener("DOMContentLoaded",HTMLPreview.replaceAssets,false);\x3c/script></head><frameset'),setTimeout(function(){document.open();document.write(HTMLPreview.content);document.close()},50)):HTMLPreview.previewform.innerHTML=a&&a.error&&a.error.description?a.error.description:"Error: Cannot load file "+HTMLPreview.raw()},loadCSS:function(a){a&&a.query&&a.query.diagnostics&&a.query.diagnostics.redirect?HTMLPreview.send(a.query.diagnostics.redirect.content,"loadCSS"):a&&a.query&&a.query.results&&a.query.results.resources&&a.query.results.resources.content&&200==a.query.results.resources.status&&document.write("<style>"+a.query.results.resources.content.replace(/url\((?:'\|")?([^\/][^:'"\)]+)(?:'\|")?\)/gi,"url("+a.query.results.resources.url.replace(/[^\/]+\.css.$/gi,"")+"$1)")+"</style>")},loadJS:function(a){a&&a.query&&a.query.diagnostics&&a.query.diagnostics.redirect?HTMLPreview.send(a.query.diagnostics.redirect.content,"loadJS"):a&&a.query&&a.query.results&&a.query.results.resources&&a.query.results.resources.content&&200==a.query.results.resources.status&&document.write("<script>"+a.query.results.resources.content+"\x3c/script>")},send:function(a,b){document.write('<script src="http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20data.headers%20where%20url%3D%22'+encodeURIComponent(a)+"%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=HTMLPreview."+b+'">\x3c/script>')},submitform:function(){location.href="/?"+document.getElementById("file").value;return!1},init:function(){HTMLPreview.previewform.onsubmit=HTMLPreview.submitform;HTMLPreview.file()&&(HTMLPreview.previewform.innerHTML="<p>Loading...</p>",HTMLPreview.send(HTMLPreview.raw(),"loadHTML"))}};
	</script>
	<script>HTMLPreview.init();</script>
	</body>
	</html>