Fixed website banner HTML & Javascript

Various website CSS improvements
Added docs & learn icons
Added learn articles
This commit is contained in:
PhilipWitte
2015-02-08 04:01:18 -08:00
parent 5f54ccf0bd
commit 0b2a63b7bd
11 changed files with 220 additions and 213 deletions

View File

@@ -7,7 +7,6 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>$c.projectTitle</title>
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="shortcut icon" href="assets/images/favicon.ico">
#if len(rss) > 0:
<link href="$rss" title="Recent changes" type="application/atom+xml" rel="alternate">
@@ -17,23 +16,23 @@
<header id="head">
<div class="page-layout tall">
<div id="head-logo"></div>
<a id="head-logo-link" href="http://nim-lang.org/index.html"></a>
<a id="head-logo-link" href="index.html"></a>
<nav id="head-links">
#for i in 0.. c.tabs.len-1:
# var name = c.tabs[i].key
# var t = c.tabs[i].val
#if currentTab == t:
<a class="active"
#elif t == "community" or t == "news":
# continue
#else:
<a
#end if
#if t.contains('.'):
href="${t}" title = "$c.projectName - $name">$name</a>
#else:
href="${t}.html" title = "$c.projectName - $name">$name</a>
#end if
# let t = c.tabs[i].val
# if t != "community" and t != "news":
# let name = c.tabs[i].key
# if currentTab == t:
<a class="active"
# else:
<a
# end if
# if t.contains('.'):
href="${t}" title = "$c.projectName - $name">$name</a>
# else:
href="${t}.html" title = "$c.projectName - $name">$name</a>
# end if
# end if
#end for
</nav>
</div>
@@ -50,10 +49,25 @@
# if currentTab == "index":
<div id="slideshow">
<!-- slides -->
<div id="slide0" class="">
<div id="slide0" class="active">
<h2><a name="why-should-i-be-excited">Why should I be excited?</a></h2>
<span class="desc">Nim is the only language that leverages automated proof technology to perform a <i>disjoint check</i> for your parallel code. Working on disjoint data means no locking is required and yet data races are impossible:</span><br><br>
<pre>
<span class="kwd">parallel</span>:
<span class="tab"> </span><span class="kwd">var</span> i = <span class="val">0</span>
<span class="tab"> </span><span class="kwd">while</span> i <= a.high:
<span class="tab"> <span class="tab"> </span></span></span><span class="kwd">spawn</span> f(a[i])
<span class="tab"> <span class="tab"> </span></span></span><span class="kwd">spawn</span> f(a[i+<span class="val">1</span>])
<span class="tab"> <span class="tab"> </span></span></span><span class="cmt"># ERROR: cannot prove a[i] is disjoint from a[i+1]</span>
<span class="tab"> <span class="tab"> </span></span></span><span class="cmt"># BUT: replace 'i += 1' with 'i += 2' and the code compiles!</span>
<span class="tab end"> <span class="tab end"> </span></span>i += <span class="val">1</span>
</pre>
</div>
<div id="slide1">
<div>
<h2>Nim looks like this..</h2>
<pre><span class="cmt"># compute average line length</span>
<pre>
<span class="cmt"># compute average line length</span>
<span class="kwd">var</span>
<span class="tab"> </span>sum = <span class="val">0</span>
<span class="tab end"> </span>count = <span class="val">0</span>
@@ -68,7 +82,8 @@ echo(<span class="val">"Average line length: "</span>,
</div>
<div>
<h2>..and this...</h2>
<pre><span class="cmt"># create and greet someone</span>
<pre>
<span class="cmt"># create and greet someone</span>
<span class="kwd">type</span> <span class="def">Person</span> = <span class="typ">object</span>
<span class="tab"> </span>name: <span class="typ">string</span>
<span class="tab end"> </span>age: <span class="typ">int</span>
@@ -81,58 +96,43 @@ echo(<span class="val">"Average line length: "</span>,
p.greet() <span class="cmt"># or greet(p)</span>
</pre>
</div>
</div> <!-- slide0 -->
<div id="slide1" class="active">
<h2><a name="why-should-i-be-excited">Why should I be excited?</a></h2>
<span class="desc">
Nim is the only language that leverages automated proof technology
to perform a <i>disjoint check</i> for your parallel
code. Working on disjoint data means no locking is
required and yet data races are impossible:</span>
<pre>
<span class="kwd">parallel</span>:
<span class="tab"> </span><span class="kwd">var</span> i = <span class="val">0</span>
<span class="tab"> </span><span class="kwd">while</span> i <= a.high:
<span class="tab"> </span>spawn f(a[i])
<span class="tab"> </span>spawn f(a[i+<span class="val">1</span>])
<span class="tab"> </span><span class="cmt"># ERROR: cannot prove a[i] is disjoint from a[i+1]</span>
<span class="tab"> </span><span class="cmt"># BUT: replace 'i += 1' with 'i += 2' and the code compiles!</span>
<span class="tab end"> </span>i += <span class="val">1</span>
</pre>
</div>
<div id="slide2" class="">
<div>
<h2>interfacing with C..</h2>
<pre>
<span class="kwd">proc</span> <span class="def">unsafeScanf</span>(f: <span class="typ">File</span>; s: <span class="typ">cstring</span>)
<span class="tab"> </span>{.importc: <span class="val">"fscanf"</span>,
<span class="tab end"> </span>header: <span class="val">"&lt;stdio.h&gt;"</span>, varargs.}
<span class="kwd">var</span> x: cint
unsafeScanf(stdin, <span class="val">"%d"</span>, <span class="kwd">addr</span> x)
</pre></div>
<div>
<h2>..and DSLs made easy</h2>
<h2>C FFI is easy in Nim..</h2>
<pre>
<span class="cmt"># declare a C procedure..</span>
<span class="kwd">proc</span> <span class="def">unsafeScanf</span>(f: <span class="typ">File</span>, s: <span class="typ">cstring</span>)
<span class="tab"> </span>{.varargs,
<span class="tab"> </span>importc: <span class="val">"fscanf"</span>,
<span class="tab end"> </span>header: <span class="val">"&lt;stdio.h&gt;"</span>.}
<span class="cmt"># ..and use it...</span>
<span class="kwd">var</span> x: cint
stdin.unsafeScanf(<span class="val">"%d"</span>, <span class="kwd">addr</span> x)
</pre>
<p><span class="desc"><b>Compile and run with:</b><br>&nbsp;&nbsp;&nbsp;&nbsp;&#36; nim c -r example.nim</span></p>
</div>
<div>
<h2>..and DSLs are too...</h2>
<pre>
<span class="cmt"># a simple web server</span>
<span class="kwd">import</span> jester, asyncdispatch, htmlgen
routes:
<span class="tab"> </span>get <span class="val">"/"</span>:
<span class="tab end"> </span>resp h1(<span class="val">"Hello world"</span>)
<span class="cmt"># using jester commands</span>
<span class="kwd">routes</span>:
<span class="tab"> </span><span class="kwd">get</span> <span class="val">"/"</span>:
<span class="tab end"> <span class="tab end"> </span></span><span class="kwd">resp</span> h1(<span class="val">"Hello world"</span>)
runForever()
</pre><p><span class="desc">
Compile and run with:<br />
nim c -r example.nim<br />
View at: localhost:5000
</span></p>
</pre>
<p><span class="desc"><b>View in browser at:</b><br>&nbsp;&nbsp;&nbsp;&nbsp;localhost:5000</span></p>
</div>
</div>
</div>
<div id="slideshow-nav">
<div id="slideControl0" onclick="slideshow_click(0)"></div>
<div id="slideControl1" onclick="slideshow_click(1)" class="active"></div>
<div id="slideControl0" onclick="slideshow_click(0)" class="active"></div>
<div id="slideControl1" onclick="slideshow_click(1)"></div>
<div id="slideControl2" onclick="slideshow_click(2)"></div>
</div>
# end
@@ -190,9 +190,12 @@ View at: localhost:5000
</div>
</div>
</footer>
<script>
# if currentTab == "index":
<script src="assets/index.js"></script>
# end if
# if c.gaId != nil:
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
@@ -200,42 +203,7 @@ View at: localhost:5000
ga('create', '${c.gaId}', 'nim-lang.org');
ga('send', 'pageview');
# end if
var timer;
var prevIndex = 0;
function setSlideShow(index, short) {
if (index > 2) index = 0;
for (var i = 0; i < 10; ++i) {
var x = document.getElementById("slide"+i);
if (!x) break;
x.className = "";
document.getElementById("slideControl"+i).className = "";
}
document.getElementById("slide"+index).className = "active";
document.getElementById("slideControl"+index).className = "active";
prevIndex = index;
startTimer(short ? 8000 : 32000);
}
function nextSlide() { setSlideShow(prevIndex + 1, true); }
function startTimer(t) { timer = setTimeout(nextSlide, t); }
function slideshow_enter() { clearTimeout(timer); }
function slideshow_exit () { startTimer(16000); }
function slideshow_click(index) {
clearTimeout(timer);
setSlideShow(index, false);
}
window.onload = function() {
var slideshow = document.getElementById("slideshow");
slideshow.onmouseenter = slideshow_enter;
slideshow.onmouseleave = slideshow_exit;
startTimer(8000);
};
</script>
# end if
</body>
</html>