Mirror
/
html5demos
mirror of https://github.com/Erreur32/html5demos.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Added view-source ability to all pages with some nifty documentElement code, then watch for location.hash change to bring page back to life.

This commit is contained in:
Remy Sharp 2010-03-04 16:00:10 +00:00
parent 967109c436
commit be0c5e6764
3 changed files with 48 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
css/html5demos.css
View File

@ -130,4 +130,23 @@ input {
font-size: 16px;
padding: 3px;
margin-left: 5px;
}
#view-source {
display: none;
}
body.view-source {
margin: 0;
background: #fff;
padding: 20px;
}
body.view-source > * {
display: none;
}
body.view-source #view-source {
display: block !important;
margin: 0;
}

7
includes/footer.php
View File

@ -1,7 +1,8 @@
<footer><a href="/">HTML5 demos</a>/<a id="built" href="http://twitter.com/rem">@rem built this</a></footer>
<footer><a href="/">HTML5 demos</a>/<a id="built" href="http://twitter.com/rem">@rem built this</a>/<a href="#view-source">view source</a></footer>
</section>
<a href="http://github.com/remy/html5demos"><img style="position: absolute; top: 0; left: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png" alt="Fork me on GitHub" /></a>
<script>
<!-- <script>
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
@ -9,6 +10,6 @@ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.
try {
var pageTracker = _gat._getTracker("UA-1656750-18");
pageTracker._trackPageview();
} catch(err) {}</script>
} catch(err) {}</script> -->
</body>
</html>

25
js/h5utils.js
View File

@ -25,3 +25,28 @@ var addEvent = (function () {
}
})();
(function () {
var pre = document.createElement('pre');
pre.id = "view-source"
// private scope to avoid conflicts with demos
addEvent(window, 'click', function (event) {
if (event.target.hash == '#view-source') {
// event.preventDefault();
if (!document.getElementById('view-source')) {
pre.innerHTML = ('<!DOCTYPE html>\n<html>\n' + document.documentElement.innerHTML + '\n</html>').replace(/[<>]/g, function (m) { return {'<':'&lt;','>':'&gt;'}[m]});
document.body.appendChild(pre);
}
document.body.className = 'view-source';
var sourceTimer = setInterval(function () {
if (window.location.hash != '#view-source') {
clearInterval(sourceTimer);
document.body.className = '';
}
}, 200);
}
});
})();