topical media & game development
mobile-query-three-plugins-ogsworkshop-slides-gamesteps.htm / htm
<!DOCTYPE html>
<html>
<head>
<title>Three.js workshop</title>
<base target=”_blank” />
<meta charset='utf-8'/>
<script src="vendor/jquery-1.7.2.min.js"></script>
<script src='slides.js'></script>
</head>
<body style='display: none'>
<style>
article[data-markdown] em {
color : orange;
font-style : normal;
font-weight : bolder;
}
article[data-markdown] h3 {
font-size : 180%;
}
span.orange {
color : orange;
}
span.larger {
font-weight : bolder;
font-size : 120%;
}
</style>
<section class='slides layout-regular template-default'>
<!-- *****************************************************************************
STAGE 0
****************************************************************************** -->
<article data-markdown>
# Steps
</article>
<article data-markdown>
Boilerplate
initial stuff
</article>
<article data-markdown>
Minecraft char
[link](../examples/game000.html)
</article>
<article data-markdown>
a skybox
</article>
<article data-markdown>
a ground
</article>
<article data-markdown>
Keyboard controls
</article>
<article data-markdown>
a ground
</article>
<article data-markdown>
a g
</article>
<!-- ****************************************************************************
The End
******************************************************************************** -->
<article data-markdown>
# *Questions ?*
Jerome Etienne
</article>
<!-- ****************************************************************************
Admin
Script
******************************************************************************** -->
<script>
// ==UserScript==
// @name Use Markdown, sometimes, in your HTML.
//
author: Paul Irish <
paulirish.com/>
// gray
http://git.io/data-markdown
// @match *
// ==/UserScript==
// If you're not using this as a userscript just delete from this line up. It's cool, homey.
(function markdownSlideToHtml(){
if (!window.Showdown){
var scr = document.createElement('script');
scr.onload = markdownSlideToHtml;
scr.src = 'vendor/showdown.js';
document.body.appendChild(scr);
return;
}
[].forEach.call(document.querySelectorAll('[data-markdown]'), function fn(elem){
// strip leading whitespace so it isn't evaluated as code
//var text = elem.textContent.replace(/\n\s*\n/g,'\n');
// jerome- to have better support of html within markdown
var text = elem.innerHTML;
//console.log("origin innerHTML", text.split('\n'));
// remove all blanks lines
//text = text.replace(/\n\s*\n/g,'\n');
//console.log("step text", text)
// set indentation level so your markdown can be indented within your HTML
var matches = text.match(/^\n([ \t]*)/);
var leadingws = matches[1].length;
//console.log("first line", matches)
//console.log("leadingws", leadingws)
var regex = new RegExp('\\n[ \\t]{' + leadingws + '}','g');
var md = text.replace(regex,'\n');
//console.log("pre md", md);
html = (new Showdown.converter()).makeHtml(md);
//console.log("post html", html);
// to support prettyprint
html = html.replace(/
<code><br \/>/g,'
<pre class="prettyprint">');
html = html.replace(/
<br \/><\/code>/g,'
</pre>');
// unescape [><]
html = html.replace(/&gt;/g,'>');
html = html.replace(/&lt;/g,'<');
//console.log("escaped html", html);
// here, have sum HTML
elem.innerHTML = html;
});
// callback prettyprint to highlight code found in markdown
prettyPrint();
}());
</script>
<script>
<h4>
//////////////////////////////////////////////////////////</h4>
// scan the whole webpage and replace url to their local location
// - usefull to have local copy of the slides in conference when internet is unavailable
// - and still have slides which works when internet is available
//
/, '/index.html')
jQuery(element).attr(attrName, url);
})
}, 100);
</script>
</body>
</html>
(C) Æliens
04/09/2009
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2780434-1";
urchinTracker();
</script>