topical media & game development

talk show tell print

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(/&amp;gt;/g,'>'); html = html.replace(/&amp;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 // open -a "/Applications/Google Chrome.app" --args --disable-web-security --allow-file-access-from-file setTimeout(function(){ location.href.match(/^file:/) && jQuery('a').add('iframe').each(function(index, element){ var attrNames = { 'A' : 'href', 'IFRAME': 'src' }; var attrName = attrNames[element.nodeName]; var url = jQuery(element).attr(attrName); url = url.replace(/^http:\/\/jeromeetienne.github.com\/tquery\// , 'file://localhost/Users/jerome/webwork/tquery/') url = url.replace(/^http:\/\/jeromeetienne.github.com\/augmentedgesture.js\// , 'file://localhost/Users/jerome/webwork/augmentedgesture.js/') url = url.replace(/^http:\/\/jeromeetienne.github.com\/webaudio.js\// , 'file://localhost/Users/jerome/webwork/webaudio.js/') url = url.replace(/^http:\/\/jeromeetienne.github.com\/pongGL\//, 'file://localhost/Users/jerome/webwork/pongGL/') url = url.replace(/^http:\/\/jeromeetienne.github.com\/threex\//, 'file://localhost/Users/jerome/webwork/threex/') url = url.replace(/^http:\/\/learningthreejs.com\//, 'file://localhost/Users/jerome/webwork/learningthreejs.com/') url = url.replace(/\//, '/index.html') jQuery(element).attr(attrName, url); }) }, 100); </script> </body> </html>

[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

(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>