From be0c5e67643ab0e1eea2aa197f3dc66b242aa429 Mon Sep 17 00:00:00 2001 From: Remy Sharp Date: Thu, 4 Mar 2010 16:00:10 +0000 Subject: [PATCH] Added view-source ability to all pages with some nifty documentElement code, then watch for location.hash change to bring page back to life. --- css/html5demos.css | 19 +++++++++++++++++++ includes/footer.php | 7 ++++--- js/h5utils.js | 25 +++++++++++++++++++++++++ 3 files changed, 48 insertions(+), 3 deletions(-) diff --git a/css/html5demos.css b/css/html5demos.css index 23dee96..98584e6 100644 --- a/css/html5demos.css +++ b/css/html5demos.css @@ -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; } \ No newline at end of file diff --git a/includes/footer.php b/includes/footer.php index 26373cb..ddc6895 100644 --- a/includes/footer.php +++ b/includes/footer.php @@ -1,7 +1,8 @@ - + + Fork me on GitHub - +} catch(err) {} --> diff --git a/js/h5utils.js b/js/h5utils.js index a9c16a6..e81251d 100644 --- a/js/h5utils.js +++ b/js/h5utils.js @@ -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 = ('\n\n' + document.documentElement.innerHTML + '\n').replace(/[<>]/g, function (m) { return {'<':'<','>':'>'}[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); + } +}); + +})();