Docs fixes (#4707)

* Mobile Safari needs the code to be >= 16px

* Buttons that just run the code shouldn’t have a label, since in all the other examples the label signifies the command to be run

* Use Bootstrap’s breakpoints

* Use Bootstrap’s styling for the <code> element, to avoid misaligned baseline

* Updated output

* Fix #4704: use replaceState, so that back/forward only happen for user clicks on links; opening and closing Try CoffeeScript doesn’t count as a new history entry, and closing it retrieves the previous URL

* Fix #4702: Some changelog entries are more equal than others

* Updated output

* Eliminate the 1px jitter when initializing code editors

* On first time opening Try CoffeeScript, use just #try as the hash

* Update output

* Increase general body line spacing

* Code styling per Jeremy

* Don’t let the main text column grow unreasonably wide

* Give list items some modest bottom margin (and use ems whenever possible)

* Updated output
This commit is contained in:
Geoffrey Booth 2017-09-20 13:10:48 -07:00 committed by GitHub
parent eb127923a7
commit 5cbd25f5d4
7 changed files with 128 additions and 110 deletions

View File

@ -180,15 +180,16 @@ button:focus, .navbar-dark .navbar-toggler:focus {
font-family: Lato;
font-weight: 300;
font-size: 1.1em;
line-height: 1.7;
}
.main blockquote {
font-size: 1.1em;
}
@media (min-width: 1050px) {
.main p, .main li, .main td, .main th {
font-size: 1.2em;
}
.main blockquote {
.main li p, .main li li, .main li blockquote {
font-size: 1em;
}
@media (min-width: 768px) {
.main p, .main li, .main td, .main th, .main blockquote {
font-size: 1.2em;
}
}
@ -214,15 +215,18 @@ button:focus, .navbar-dark .navbar-toggler:focus {
}
p, blockquote, table, .code-example {
margin-bottom: 1.3rem;
margin-bottom: 1.1em;
}
.main li {
margin-bottom: 0.6em;
}
code {
font-size: 82%;
}
td code {
code, td code {
white-space: nowrap;
padding: 2px 8px;
}
pre code {
white-space: pre; /* We want newlines to be newlines in code blocks */
}
h2, h3, h4 {
@ -243,13 +247,18 @@ h3, h4, h2 time {
margin-top: -2.3rem;
}
@media (min-width: 1200px) {
.main > header, .main section > h2, .main section > h3, .main section > h4, .main section > p, .main section > blockquote, .main section > ul, .main section > table {
max-width: 80%;
}
}
code, button {
font-family: 'Roboto Mono';
font-weight: 400;
}
code, a > code {
background-color: #f8f3f0;
padding: 2px 8px;
}
code {
color: #2f2625;
@ -385,14 +394,20 @@ textarea {
letter-spacing: 0.3px;
color: #f8f8f8;
/* Prevent mobile Safari from zooming in on our code editors; the code is 16px naturally, but somehow being explicit about it prevents the zooming */
font-size: 15px;
font-size: 16px;
}
@media (min-width: 768px) {
.CodeMirror,
.placeholder-code {
font-size: 90%; /* Matching Bootstraps font size for code, which calculates to 14.4px */
}
}
.CodeMirror-lines {
padding: 0.5em 0;
}
.placeholder-code {
padding: 0.5em 4px;
margin-bottom: 1.3rem;
margin-bottom: 1.37em;
white-space: pre-wrap;
}
div.CodeMirror-cursor {
@ -616,14 +631,16 @@ div.CodeMirror-cursor {
</nav>
<main class="main col-lg-9 ml-auto">
<header class="title-logo d-none d-lg-block">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-22 347 566 100">
<header class="d-none d-lg-block">
<p class="title-logo">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-22 347 566 100">
<title>
CoffeeScript Logo
</title>
<path d="M21.7 351.1c.1.6-.2 1.1-1.2 1.6-1.3-.7-4.1-1.1-6.4-.9-2.5.2-4.6 1-4.3 2.7.4 1.7 2.8 2.7 7.1 2.3 10.5-.9 10.4-8 25.8-9.4 12-1.1 18.7 2.6 19.6 7.1.7 3.5-2.2 6.9-10.9 7.6-7.7.7-12.2-1.4-12.6-3.5-.2-1.1.4-2.7 4.1-3.1.4 1.7 2.5 3.5 7.5 3 3.6-.3 6.6-1.6 6.2-3.6-.4-2.1-4.2-3.3-10.2-2.8-12.2 1.1-15.2 7.8-25.6 8.7-7.4.7-13.4-2-14.2-6-.3-1.5-.3-5 7.5-5.7 4-.3 7.2.4 7.6 2zm-39 41.8c-3.4 4.3-4.9 9.3-4.6 14.2.3 4.9 2.7 8.9 6.5 12 4 3.1 8.3 4 13.2 3.1 1.9-.3 4-1.3 5.9-1.9-4 0-7.4-1.3-10.8-4-3.7-2.7-6.2-6.5-6.8-11.1-.9-4.3 0-8.3 2.4-11.8 2.7-3.4 6.2-5.3 10.8-5.9 4.6-.3 8.6.9 12.6 3.7-.9-1.3-2.2-2.2-3.4-3.4-4-2.7-8.3-4-13.6-2.7-4.8 1-8.8 3.5-12.2 7.8zm53.6-23.1c-12.9 0-24.4-1.3-32.7-3.1-8.9-2.2-13.6-4.6-13.6-7.7 0-1.3.6-2.4 2.4-3.7-5.6 2.2-8.6 4-8.6 6.8.3 3.1 5.3 6.2 15.5 8.6 9.6 2.4 21.9 3.7 36.7 3.7 15.1 0 27.1-1.3 36.7-3.7 10.2-2.4 15.1-5.6 15.1-8.6 0-2.2-2.2-4.3-6.2-5.9.9.6 1.6 1.6 1.6 2.7 0 3.1-4.6 5.6-13.9 7.7-8.6 1.9-19.6 3.2-33 3.2zm36.8 8.6c-9.6 2.2-21.9 3.7-36.7 3.7-15.1 0-27.4-1.6-37-3.7-8.6-2.2-13.2-4.6-14.8-7.1 1.6 10.8 5.3 21 10.2 30 3.7 5.6 7.4 10.5 11.1 15.8 1.6 3.1 2.7 6.2 3.4 9.3 2.4 3.4 5.9 5.6 10.2 6.8 5.3 1.9 10.8 2.7 16.4 2.4h.6c5.6.3 11.5-.6 16.9-2.4 4-1.3 7.4-3.4 9.9-6.8h.3c.6-3.1 1.6-6.2 3.1-9.3 3.7-5.3 7.4-10.2 11.1-15.8 4.9-8.9 8.3-19.1 10.2-30-2 2.8-6.6 5.2-14.9 7.1zm106.2 30.1c-4.8 12.1-17.6 16.9-25.9 16.9-13.4 0-19.9-6-19.9-22.3 0-16.5 7.9-47.3 31.7-47.3 8.5 0 15.2 3.3 15.2 12.1 0 4.8-1.8 8.3-6.4 8.3-1.5 0-3.4-.4-5.2-2.4 2.2-1.1 4.2-4.9 4.2-8.3 0-2.9-1.5-5.6-5.6-5.6-10 0-18.9 23.9-18.9 42.4 0 8.3 2.2 14.2 10.9 14.2 7.1 0 13.5-3.4 17.7-9.1l2.2 1.1zm32.9-16.3c.4.2.7.2 1 .2 4.2 0 10.1-2.7 14-5.5l.8 2.4c-3.4 3.7-9.5 6.5-16.1 7.5-1.5 16.8-10.6 27.3-21.7 27.3-8.4 0-14.5-4-14.5-14.4 0-10.5 6.2-32.2 24.9-32.2 7.8.3 11.6 5.3 11.6 14.7zm-7.7 5c-1.9-.5-2.4-2-2.4-3.8 0-2.5 1.2-4.2 2.8-4.9-.2-3.8-1.1-5.3-3.4-5.3-6.5 0-12 16.6-12 25.6 0 6 1.2 7.3 4.6 7.3 4.2.1 8.9-8 10.4-18.9zm-6.6 39.7c0-8.3 7.1-11 15.8-13.6l10.9-51.9c2.7-13 10.6-15.5 16.5-15.5 4.1 0 8 2.2 9.7 5.7 3.6-4.6 8.4-5.7 12.4-5.7 5.6 0 10.8 3.9 10.8 9.8 0 1.5-.1 2.6-.3 3.7h-4.3c.1-.9.2-1.7.2-2.4 0-2.1-1.7-3.1-3.4-3.1-2 0-4.8 1.1-6.2 7.1l-1.7 7.4h9.1l-.8 3.6h-9l-10.3 49.1c-2.7 13-10.6 15.5-16.5 15.5-5.2 0-8.3-2.3-9.8-5.7-3.5 4.6-8.3 5.7-12.3 5.7-5.6.1-10.8-3.8-10.8-9.7zm9.1 1.8c1.9 0 4.2-1.8 5.4-7.1l1.1-5.3c-5.7 2-10.1 4.4-10.1 9.4 0 1.2 1.7 3 3.6 3zm21.7 0c1.9 0 4.2-1.8 5.4-7.1l2.2-10.4-9.4 1.8-1.8 8.3c-.5 2.1-1.1 4-1.8 5.6.9 1.3 3 1.8 5.4 1.8zm-1.4-18l9.4-1.7 7.7-36.8h-9l-8.1 38.5zm16.6-56.7c-2 0-4.8 1.1-6.2 7.1l-1.7 7.4h9l2.1-9.5c.2-.7.2-1.3.2-2 .1-2-1.5-3-3.4-3zm37.9 53c7.1 0 11.6-4 16.1-9.2h3.1c-5.2 8.3-12.9 16.8-25 16.8-8.5 0-14.2-4.2-14.2-14.5 0-10.5 5.9-32.3 24.6-32.3 8.1 0 10 4.2 10 8.7 0 10.5-10 18.5-20.9 19.2-.1 1.3-.2 2.5-.2 3.6 0 6.2 2.2 7.7 6.5 7.7zm5.3-34.4c-4.6 0-9.1 9.7-10.9 18.7 7-.5 13.2-7.4 13.2-15 0-2.2-.5-3.7-2.3-3.7zm28.6 33.4c3.4 0 7.8-2.3 10.8-4.8-2 10.4-8.4 13.4-15.8 13.4-8.4 0-14.1-4.2-14.1-14.5 0-10.5 5.9-32.3 24.6-32.3 8.1 0 10 4.2 10 8.7 0 10.6-10 18.5-20.9 19.2-.1.9-.2 2-.2 2.7 0 5.7 2.5 7.6 5.6 7.6zm6.2-33.4c-4.5 0-9.1 10.1-11 18.7 7.1-.4 13.3-7.3 13.3-15 0-2.2-.6-3.7-2.3-3.7zm51.3-6.7c-1.7 0-3-.6-4.2-1.9 2.4-1.5 4.1-4.8 4.1-7.8 0-3.1-1.8-6.1-6.8-6.1s-8.3 2.8-8.3 8.2c0 13.3 20.5 15.2 20.5 34.8 0 15.3-12.3 22.7-25.6 22.7-10.4 0-19.3-4.5-19.3-15.7 0-9.8 7-14.9 13.3-14.9 3.1 0 7.7 1.3 8 6-4.9 0-10.7 2.3-10.7 8.5 0 4.5 2.9 8.7 8.7 8.7 6.1 0 10.6-4.4 10.6-12 0-15.6-18.6-21.1-18.6-34.5 0-9.5 9.3-16.3 21-16.3 4.3 0 14.6.9 14.6 10.9.1 5.5-2.8 9.4-7.3 9.4zm36.2 10.3c0-2.3-.8-3.7-2.5-3.7-5.7 0-11.7 16.6-11.7 26.7 0 6.2 2.2 7.6 6.6 7.6 7.1 0 11.6-4 16.1-9.2h3.1c-5.2 8.3-12.9 16.8-25 16.8-8.5 0-14.2-4.2-14.2-14.5 0-10.6 6-32.3 24.5-32.3 8.1 0 10.1 4.2 10.1 8.3 0 4.4-2.2 6.7-4.8 6.7-1 0-2.1-.4-3.1-1.1.5-1.9.9-3.6.9-5.3zm27.7-7.6l-1.2 5.7c3.1-2.7 6.7-5.7 11-5.7 4.1 0 6.3 3.3 6.3 6.9 0 3.1-2.1 6.7-6.6 6.7-5.1 0-2.5-6-5.3-6-2.7 0-4.4 1.4-6.7 3.4l-7.2 34.6h-13.1l9.6-45.4 13.2-.2zm34.2 0l-6.6 30.9c-.3 1.2-.4 2.1-.4 2.9 0 2.5 1.2 3.3 3.7 3.3 3.5 0 6.9-3.4 8.1-8h3.8c-5.2 14.8-14.2 16.8-19.1 16.8-5.5 0-9.7-3.2-9.7-10.9 0-1.8.3-3.7.7-5.9l6.2-29.2 13.3.1zm-4.1-19.4c4 0 7.2 3.2 7.2 7.2s-3.2 7.1-7.2 7.1-7.1-3.1-7.1-7.1c-.1-4 3.2-7.2 7.1-7.2zm29.1 16l-1.5 6.9c2.6-2.3 6.1-3.9 10.7-3.9 6.2 0 11.1 3.5 11.1 14.4 0 12.2-4.7 32.1-22.3 32.1-4.5 0-6.8-1.6-7.7-3.2l-4.7 22.1-13.7 3.2 15.2-71.5 12.9-.1zm7.8 17c0-7-2.9-7.5-4.5-7.5-2 0-4.5 1.6-6.3 4.4l-5.4 25.5c.4 1 1.4 2.1 3.4 2.1 9.7 0 12.8-15.9 12.8-24.5zm27.8 17.3c-.3 1.1-.5 2.2-.5 3.1 0 1.9.7 3.2 3.1 3.2.7 0 1.7 0 2.4-.3-2.5 7.8-6.6 8.9-9.6 8.9-6.4 0-9.1-4.4-9.1-10.3 0-1.6.2-3.1.6-4.8l5.8-27.2h-3l.7-3.6h3L528 366l13.4-1.9s-1.4 6.2-3.1 14.4h5.5l-.7 3.6h-5.5l-5.7 27.4z"/>
</svg>
</p>
</header>
<section id="overview">
<p><strong>CoffeeScript is a little language that compiles into JavaScript.</strong> Underneath that awkward Java-esque patina, JavaScript has always had a gorgeous heart. CoffeeScript is an attempt to expose the good parts of JavaScript in a simple way.</p>
@ -1682,7 +1699,7 @@ alert(`Gold: ${gold}\nSilver: ${silver}\nThe Field: ${rest.join(', ')}`);
<button type="button" class="btn btn-primary" data-action="run-code-example" data-example="splats" data-run="true"><small><svg class="play-button" viewBox="0 0 24 24">
<path d="M2.56-0.01v24.02L21.44 11.98 2.56-0.01z"/>
</svg>
</small>Run</button>
</small></button>
</div>
</div>
@ -2480,7 +2497,7 @@ alert((function() {
<button type="button" class="btn btn-primary" data-action="run-code-example" data-example="expressions_try" data-run="true"><small><svg class="play-button" viewBox="0 0 24 24">
<path d="M2.56-0.01v24.02L21.44 11.98 2.56-0.01z"/>
</svg>
</small>Run</button>
</small></button>
</div>
</div>
@ -3553,7 +3570,7 @@ countdown(3);
<button type="button" class="btn btn-primary" data-action="run-code-example" data-example="async" data-run="true"><small><svg class="play-button" viewBox="0 0 24 24">
<path d="M2.56-0.01v24.02L21.44 11.98 2.56-0.01z"/>
</svg>
</small>Run</button>
</small></button>
</div>
</div>
@ -3694,7 +3711,7 @@ tom.move();
<button type="button" class="btn btn-primary" data-action="run-code-example" data-example="classes" data-run="true"><small><svg class="play-button" viewBox="0 0 24 24">
<path d="M2.56-0.01v24.02L21.44 11.98 2.56-0.01z"/>
</svg>
</small>Run</button>
</small></button>
</div>
</div>
@ -5599,21 +5616,12 @@ x = <span class="number">2</span> + <span class="number">2</span>
<a href="https://github.com/jashkenas/coffeescript/compare/1.10.0...1.11.0">1.11.0</a>
<span class="timestamp"> &mdash; <time datetime="2016-09-24">September 24, 2016</time></span>
</h2><ul>
<li>
<p>CoffeeScript now supports ES2015 <a href="#modules"><code>import</code> and <code>export</code> syntax</a>.</p>
</li>
<li>
<p>Added the <code>-M, --inline-map</code> flag to the compiler, allowing you embed the source map directly into the output JavaScript, rather than as a separate file.</p>
</li>
<li>
<p>A bunch of fixes for <code>yield</code>:</p>
<li>CoffeeScript now supports ES2015 <a href="#modules"><code>import</code> and <code>export</code> syntax</a>.</li>
<li>Added the <code>-M, --inline-map</code> flag to the compiler, allowing you embed the source map directly into the output JavaScript, rather than as a separate file.</li>
<li>A bunch of fixes for <code>yield</code>:
<ul>
<li>
<p><code>yield return</code> can no longer mistakenly be used as an expression.</p>
</li>
<li>
<p><code>yield</code> now mirrors <code>return</code> in that it can be used stand-alone as well as with expressions. Where you previously wrote <code>yield undefined</code>, you may now write simply <code>yield</code>. However, this means also inheriting the same syntax limitations that <code>return</code> has, so these examples no longer compile:</p>
<blockquote class="uneditable-code-block"><pre><code>doubles = -&gt;
<li><code>yield return</code> can no longer mistakenly be used as an expression.</li>
<li><code>yield</code> now mirrors <code>return</code> in that it can be used stand-alone as well as with expressions. Where you previously wrote <code>yield undefined</code>, you may now write simply <code>yield</code>. However, this means also inheriting the same syntax limitations that <code>return</code> has, so these examples no longer compile:<blockquote class="uneditable-code-block"><pre><code>doubles = -&gt;
yield for i in [1..3]
i * 2
six = -&gt;
@ -5621,28 +5629,15 @@ six = -&gt;
2 * 3
</code></pre>
</blockquote></li>
<li>
<p>The JavaScript output is a bit nicer, with unnecessary parentheses and spaces, double indentation and double semicolons around <code>yield</code> no longer present.</p>
</li>
<li>The JavaScript output is a bit nicer, with unnecessary parentheses and spaces, double indentation and double semicolons around <code>yield</code> no longer present.</li>
</ul>
</li>
<li>
<p><code>&amp;&amp;=</code>, <code>||=</code>, <code>and=</code> and <code>or=</code> no longer accidentally allow a space before the equals sign.</p>
</li>
<li>
<p>Improved several error messages.</p>
</li>
<li>
<p>Just like <code>undefined</code> compiles to <code>void 0</code>, <code>NaN</code> now compiles into <code>0/0</code> and <code>Infinity</code> into <code>2e308</code>.</p>
</li>
<li>
<p>Bugfix for renamed destructured parameters with defaults. <code>({a: b = 1}) -&gt;</code> no longer crashes the compiler.</p>
</li>
<li>
<p>Improved the internal representation of a CoffeeScript program. This is only noticeable to tools that use <code>CoffeeScript.tokens</code> or <code>CoffeeScript.nodes</code>. Such tools need to update to take account for changed or added tokens and nodes.</p>
</li>
<li>
<p>Several minor bug fixes, including:</p>
<li><code>&amp;&amp;=</code>, <code>||=</code>, <code>and=</code> and <code>or=</code> no longer accidentally allow a space before the equals sign.</li>
<li>Improved several error messages.</li>
<li>Just like <code>undefined</code> compiles to <code>void 0</code>, <code>NaN</code> now compiles into <code>0/0</code> and <code>Infinity</code> into <code>2e308</code>.</li>
<li>Bugfix for renamed destructured parameters with defaults. <code>({a: b = 1}) -&gt;</code> no longer crashes the compiler.</li>
<li>Improved the internal representation of a CoffeeScript program. This is only noticeable to tools that use <code>CoffeeScript.tokens</code> or <code>CoffeeScript.nodes</code>. Such tools need to update to take account for changed or added tokens and nodes.</li>
<li>Several minor bug fixes, including:
<ul>
<li>The caught error in <code>catch</code> blocks is no longer declared unnecessarily, and no longer mistakenly named <code>undefined</code> for <code>catch</code>-less <code>try</code> blocks.</li>
<li>Unassignable parameter destructuring no longer crashes the compiler.</li>
@ -5659,14 +5654,9 @@ six = -&gt;
<a href="https://github.com/jashkenas/coffeescript/compare/1.9.3...1.10.0">1.10.0</a>
<span class="timestamp"> &mdash; <time datetime="2015-09-03">September 3, 2015</time></span>
</h2><ul>
<li>
<p>CoffeeScript now supports ES2015-style destructuring defaults.</p>
</li>
<li>
<p><code>(offsetHeight: height) -&gt;</code> no longer compiles. That syntax was accidental and partly broken. Use <code>({offsetHeight: height}) -&gt;</code> instead. Object destructuring always requires braces.</p>
</li>
<li>
<p>Several minor bug fixes, including:</p>
<li>CoffeeScript now supports ES2015-style destructuring defaults.</li>
<li><code>(offsetHeight: height) -&gt;</code> no longer compiles. That syntax was accidental and partly broken. Use <code>({offsetHeight: height}) -&gt;</code> instead. Object destructuring always requires braces.</li>
<li>Several minor bug fixes, including:
<ul>
<li>A bug where the REPL would sometimes report valid code as invalid, based on what you had typed earlier.</li>
<li>A problem with multiple JS contexts in the jest test framework.</li>
@ -6091,7 +6081,7 @@ The <code>extends</code> keyword now functions identically to <code>goog.inherit
<script src="browser-compiler/coffeescript.js"></script>
<script>
(function(){window.location.origin||(window.location.origin=window.location.protocol+'//'+window.location.hostname),$(document).ready(function(){var a,b,c,d,e,f,g,h,i,j;if(i=function(){return $('.navbar-toggler, .sidebar').toggleClass('show')},$('[data-toggle="offcanvas"]').click(i),$('[data-action="sidebar-nav"]').click(function(a){return $('.navbar-toggler').is(':visible')&&(a.preventDefault(),i(),setTimeout(function(){return window.location=a.target.href},260)),gtag('event','sidebar_navigate',{event_category:'navigation',event_label:a.target.href.replace(window.location.origin,'')})}),$('body').scrollspy({target:'#contents',offset:Math.round($('main').css('padding-top').replace('px',''))}),e=function(a){return $('#contents a.active[href!=\''+a+'\']').removeClass('show')},$(window).on('activate.bs.scrollspy',function(a,b){var c;if($('#contents a.active[href!=\''+b.relatedTarget+'\']').removeClass('show'),c=$('#contents a[href=\''+b.relatedTarget+'\']'),c.prop('href')!==window.location.origin+'/#try')return window.history.pushState({},c.text(),c.prop('href')),gtag('config',GA_TRACKING_ID,{page_path:c.prop('href').replace(window.location.origin,'')})}),h=[],c=[],g=200,$('textarea').each(function(a){return h[a]=this,$(this).data('index',a)}),d=function(a){var b,d,e,f;if(d=a.data('index'),e=a.hasClass('javascript-output')?'javascript':'coffeescript',c[d]=b=CodeMirror.fromTextArea(a[0],{mode:e,theme:'twilight',indentUnit:2,tabSize:2,lineWrapping:!0,lineNumbers:!1,inputStyle:'contenteditable',readOnly:'coffeescript'!==e,viewportMargin:2e308}),'coffeescript'===e)return f=null,b.on('change',function(){return clearTimeout(f),f=setTimeout(function(){var e,f,h,i,j;h=Date.now();try{if(e=b.getValue(),0===d&&$('#try').hasClass('show')){i='try:'+encodeURIComponent(e),window.history.pushState({},'CoffeeScript',location.href.split('#')[0]+'#'+i);try{null!=window.localStorage&&window.localStorage.setItem('tryCoffeeScriptCode',e)}catch(a){f=a}}j=CoffeeScript.compile(e,{bare:!0}),g=Math.max(200,Date.now()-h)}catch(a){f=a,j=''+f}return c[d+1].setValue(j),gtag('event','edit_code',{event_category:'engagement',event_label:a.closest('[data-example]').data('example')})},g)}),b.addKeyMap({Tab:function Tab(a){return a.somethingSelected()?a.indentSelection('add'):/^\t/m.test(a.getValue())?a.execCommand('insertTab'):a.execCommand('insertSoftTab')},"Shift-Tab":function ShiftTab(a){return a.indentSelection('subtract')},Enter:function Enter(a){return a.options.indentWithTabs=/^\t/m.test(a.getValue()),a.execCommand('newlineAndIndent')}})},$('.placeholder-code').one('mouseover',function(){var a,b;return b=$(this).prev('textarea'),$(this).remove(),d(b),a=$(b.parent().siblings()[0]),a.children('.placeholder-code').remove(),d($(a.children('textarea')[0]))}),f=function(){return d($('#try-coffeescript-coffee')),d($('#try-coffeescript-js'))},$('[data-action="run-code-example"]').click(function(){var a,b,d;return d=$(this).data('run'),a=$('#'+$(this).data('example')+'-js').data('index'),b=null==c[a]?$(h[a]).val():c[a].getValue(),!0!==d&&(b=b+'\nalert('+unescape(d)+');'),eval(b),gtag('event','run_code',{event_category:'engagement',event_label:$(this).closest('[data-example]').data('example')})}),a=function(){return window.history.pushState('',document.title,window.location.pathname)},$(window).on('hashchange',function(){if(''===window.location.hash)return a()}),j=function(){var b,d=0<arguments.length&&void 0!==arguments[0]&&arguments[0];if(0===$('#try .CodeMirror').length&&f(),d&&null!=window.localStorage)try{b=window.localStorage.getItem('tryCoffeeScriptCode'),null!=b&&c[0].setValue(b)}catch(a){}return($('#try, #try-link').toggleClass('show'),!$('#try').hasClass('show'))?setTimeout(a,200):void 0},b=function(){return $('#try, #try-link').removeClass('show'),window.history.pushState('',document.title,window.location.pathname)},$('[data-toggle="try"]').click(j),$('[data-close="try"]').click(b),null!=window.location.hash){if('#try'===window.location.hash)return j(!0);if(0===window.location.hash.indexOf('#try'))return 0===$('#try .CodeMirror').length&&f(),c[0].setValue(decodeURIComponent(window.location.hash.slice(5))),j();if(''===window.location.hash)return a();if(e(window.location.hash),1<window.location.hash.length)return document.getElementById(window.location.hash.slice(1).replace(/try:.*/,'')).scrollIntoView()}})}).call(this);
(function(){window.location.origin||(window.location.origin=window.location.protocol+'//'+window.location.hostname),$(document).ready(function(){var a,b,c,d,e,f,g,h,i,j,k,l;if(k=function(){return $('.navbar-toggler, .sidebar').toggleClass('show')},$('[data-toggle="offcanvas"]').click(k),$('[data-action="sidebar-nav"]').click(function(a){return $('.navbar-toggler').is(':visible')&&(a.preventDefault(),k(),setTimeout(function(){return window.location=a.target.href},260)),gtag('event','sidebar_navigate',{event_category:'navigation',event_label:a.target.href.replace(window.location.origin,'')})}),$('body').scrollspy({target:'#contents',offset:Math.round($('main').css('padding-top').replace('px',''))}),e=function(a){return $('#contents a.active[href!=\''+a+'\']').removeClass('show')},$(window).on('activate.bs.scrollspy',function(a,b){var c;if($('#contents a.active[href!=\''+b.relatedTarget+'\']').removeClass('show'),c=$('#contents a[href=\''+b.relatedTarget+'\']'),c.prop('href')!==window.location.origin+'/#try')return i(c.prop('href')),gtag('config',GA_TRACKING_ID,{page_path:c.prop('href').replace(window.location.origin,'')})}),j=[],c=[],g=200,$('textarea').each(function(a){return j[a]=this,$(this).data('index',a)}),d=function(a){var b,d,e,f;if(d=a.data('index'),e=a.hasClass('javascript-output')?'javascript':'coffeescript',c[d]=b=CodeMirror.fromTextArea(a[0],{mode:e,theme:'twilight',indentUnit:2,tabSize:2,lineWrapping:!0,lineNumbers:!1,inputStyle:'contenteditable',readOnly:'coffeescript'!==e,viewportMargin:2e308}),'coffeescript'===e)return f=null,b.on('change',function(){return clearTimeout(f),f=setTimeout(function(){var e,f,h,j,k;h=Date.now();try{if(e=b.getValue(),0===d&&$('#try').hasClass('show')){$('#try').hasClass('show')&&(j='try:'+encodeURIComponent(e),i(window.location.href.split('#')[0]+'#'+j));try{null!=window.localStorage&&window.localStorage.setItem('tryCoffeeScriptCode',e)}catch(a){f=a}}k=CoffeeScript.compile(e,{bare:!0}),g=Math.max(200,Date.now()-h)}catch(a){f=a,k=''+f}return c[d+1].setValue(k),gtag('event','edit_code',{event_category:'engagement',event_label:a.closest('[data-example]').data('example')})},g)}),b.addKeyMap({Tab:function Tab(a){return a.somethingSelected()?a.indentSelection('add'):/^\t/m.test(a.getValue())?a.execCommand('insertTab'):a.execCommand('insertSoftTab')},"Shift-Tab":function ShiftTab(a){return a.indentSelection('subtract')},Enter:function Enter(a){return a.options.indentWithTabs=/^\t/m.test(a.getValue()),a.execCommand('newlineAndIndent')}})},$('.placeholder-code').one('mouseover',function(){var a,b;return b=$(this).prev('textarea'),$(this).remove(),d(b),a=$(b.parent().siblings()[0]),a.children('.placeholder-code').remove(),d($(a.children('textarea')[0]))}),f=function(){return d($('#try-coffeescript-coffee')),d($('#try-coffeescript-js'))},$('[data-action="run-code-example"]').click(function(){var a,b,d;return d=$(this).data('run'),a=$('#'+$(this).data('example')+'-js').data('index'),b=null==c[a]?$(j[a]).val():c[a].getValue(),!0!==d&&(b=b+'\nalert('+unescape(d)+');'),eval(b),gtag('event','run_code',{event_category:'engagement',event_label:$(this).closest('[data-example]').data('example')})}),h=null,l=function(b){var d,e;if($('#try, #try-link').toggleClass('show'),!$('#try').hasClass('show'))return h?i(h):a();if(window.location.hash&&(h=window.location.hash),0===$('#try .CodeMirror').length&&f(),b&&null!=window.localStorage)try{return d=window.localStorage.getItem('tryCoffeeScriptCode'),null==d?i('#try'):c[0].setValue(d)}catch(a){return e=a,i('#try')}else return i('#try')},b=function(){return $('#try, #try-link').removeClass('show'),h?i(h):a()},$('[data-toggle="try"]').click(function(a){return a.preventDefault(),l(!0)}),$('[data-close="try"]').click(b),a=function(){return window.history.replaceState({},document.title,window.location.pathname)},i=function(a){return 0===(null==a?void 0:a.indexOf('#'))&&(a=''+window.location.pathname+a),window.history.replaceState({},document.title,a||'')},$(window).on('hashchange',function(){if(''===window.location.hash)return a()}),null!=window.location.hash){if('#try'===window.location.hash)return l(!0);if(0===window.location.hash.indexOf('#try'))return 0===$('#try .CodeMirror').length&&f(),c[0].setValue(decodeURIComponent(window.location.hash.slice(5))),l(!1);if(''===window.location.hash)return a();if(e(window.location.hash),1<window.location.hash.length)return document.getElementById(window.location.hash.slice(1).replace(/try:.*/,'')).scrollIntoView()}})}).call(this);
</script>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-106156830-1"></script>
<script>

View File

@ -184,7 +184,6 @@ releaseHeader('2016-09-24', '1.11.0', '1.10.0')
* CoffeeScript now supports ES2015 [`import` and `export` syntax](#modules).
* Added the `-M, --inline-map` flag to the compiler, allowing you embed the source map directly into the output JavaScript, rather than as a separate file.
* A bunch of fixes for `yield`:
* `yield return` can no longer mistakenly be used as an expression.
* `yield` now mirrors `return` in that it can be used stand-alone as well as with expressions. Where you previously wrote `yield undefined`, you may now write simply `yield`. However, this means also inheriting the same syntax limitations that `return` has, so these examples no longer compile:
```
@ -195,7 +194,6 @@ releaseHeader('2016-09-24', '1.11.0', '1.10.0')
yield
2 * 3
```
* The JavaScript output is a bit nicer, with unnecessary parentheses and spaces, double indentation and double semicolons around `yield` no longer present.
* `&&=`, `||=`, `and=` and `or=` no longer accidentally allow a space before the equals sign.
* Improved several error messages.
@ -203,7 +201,6 @@ releaseHeader('2016-09-24', '1.11.0', '1.10.0')
* Bugfix for renamed destructured parameters with defaults. `({a: b = 1}) ->` no longer crashes the compiler.
* Improved the internal representation of a CoffeeScript program. This is only noticeable to tools that use `CoffeeScript.tokens` or `CoffeeScript.nodes`. Such tools need to update to take account for changed or added tokens and nodes.
* Several minor bug fixes, including:
* The caught error in `catch` blocks is no longer declared unnecessarily, and no longer mistakenly named `undefined` for `catch`-less `try` blocks.
* Unassignable parameter destructuring no longer crashes the compiler.
* Source maps are now used correctly for errors thrown from .coffee.md files.
@ -219,7 +216,6 @@ releaseHeader('2015-09-03', '1.10.0', '1.9.3')
* CoffeeScript now supports ES2015-style destructuring defaults.
* `(offsetHeight: height) ->` no longer compiles. That syntax was accidental and partly broken. Use `({offsetHeight: height}) ->` instead. Object destructuring always requires braces.
* Several minor bug fixes, including:
* A bug where the REPL would sometimes report valid code as invalid, based on what you had typed earlier.
* A problem with multiple JS contexts in the jest test framework.
* An error in io.js where strict mode is set on internal modules.

View File

@ -8,8 +8,10 @@
<%= include('sidebar.html') %>
</nav>
<main class="main col-lg-9 ml-auto">
<header class="title-logo d-none d-lg-block">
<%= include('logo.svg') %>
<header class="d-none d-lg-block">
<p class="title-logo">
<%= include('logo.svg') %>
</p>
</header>
<section id="overview">
<%= htmlFor('introduction') %>

View File

@ -5,14 +5,20 @@
letter-spacing: 0.3px;
color: #f8f8f8;
/* Prevent mobile Safari from zooming in on our code editors; the code is 16px naturally, but somehow being explicit about it prevents the zooming */
font-size: 15px;
font-size: 16px;
}
@media (min-width: 768px) {
.CodeMirror,
.placeholder-code {
font-size: 90%; /* Matching Bootstraps font size for code, which calculates to 14.4px */
}
}
.CodeMirror-lines {
padding: 0.5em 0;
}
.placeholder-code {
padding: 0.5em 4px;
margin-bottom: 1.3rem;
margin-bottom: 1.37em;
white-space: pre-wrap;
}
div.CodeMirror-cursor {

View File

@ -12,7 +12,7 @@
<% if (run) { %>
<div class="row">
<div class="col text-right">
<button type="button" class="btn btn-primary" data-action="run-code-example" data-example="<%= file %>" data-run="<%= escape(run) %>"><small><%= include('play.svg') %></small><%= run === true ? 'Run' : run.replace(/"/g, '&quot;') %></button>
<button type="button" class="btn btn-primary" data-action="run-code-example" data-example="<%= file %>" data-run="<%= escape(run) %>"><small><%= include('play.svg') %></small><%= run === true ? '' : run.replace(/"/g, '&quot;') %></button>
</div>
</div>
<% } %>

View File

@ -33,8 +33,8 @@ $(document).ready ->
$("#contents a.active[href!='#{target.relatedTarget}']").removeClass 'show'
$target = $("#contents a[href='#{target.relatedTarget}']")
return if $target.prop('href') is "#{window.location.origin}/#try"
# Update the browser address bar on scroll or navigation
window.history.pushState {}, $target.text(), $target.prop('href')
# Update the browser address bar on scroll, without adding to the history; clicking the sidebar links will automatically add to the history
replaceState $target.prop('href')
# Track this as a new pageview; we only want '/#hash', not 'http://coffeescript.org/#hash'
gtag 'config', GA_TRACKING_ID,
page_path: $target.prop('href').replace window.location.origin, ''
@ -74,9 +74,10 @@ $(document).ready ->
try
coffee = editor.getValue()
if index is 0 and $('#try').hasClass('show') # If this is the editor in Try CoffeeScript and its still visible
# Update the hash with the current code
link = "try:#{encodeURIComponent coffee}"
window.history.pushState {}, 'CoffeeScript', "#{location.href.split('#')[0]}##{link}"
if $('#try').hasClass('show')
# Update the hash with the current code
link = "try:#{encodeURIComponent coffee}"
replaceState "#{window.location.href.split('#')[0]}##{link}"
# Save this to the users localStorage
try
if window.localStorage?
@ -135,32 +136,46 @@ $(document).ready ->
event_category: 'engagement'
event_label: $(@).closest('[data-example]').data('example')
# Try CoffeeScript
previousHash = null
toggleTry = (checkLocalStorage) ->
$('#try, #try-link').toggleClass 'show'
if $('#try').hasClass('show')
previousHash = window.location.hash if window.location.hash
initializeTryEditors() if $('#try .CodeMirror').length is 0
if checkLocalStorage and window.localStorage?
try
coffee = window.localStorage.getItem 'tryCoffeeScriptCode'
if coffee?
editors[0].setValue coffee
else
replaceState '#try'
catch exception
replaceState '#try'
else
replaceState '#try'
else
if previousHash then replaceState(previousHash) else clearHash()
closeTry = ->
$('#try, #try-link').removeClass 'show'
if previousHash then replaceState(previousHash) else clearHash()
$('[data-toggle="try"]').click (event) ->
event.preventDefault()
toggleTry yes
$('[data-close="try"]').click closeTry
clearHash = ->
window.history.pushState '', document.title, window.location.pathname
window.history.replaceState {}, document.title, window.location.pathname
replaceState = (newURL) ->
newURL = "#{window.location.pathname}#{newURL}" if newURL?.indexOf('#') is 0
window.history.replaceState {}, document.title, (newURL or '')
$(window).on 'hashchange', ->
# Get rid of dangling # in the address bar
clearHash() if window.location.hash is ''
# Try CoffeeScript
toggleTry = (checkLocalStorage = no) ->
initializeTryEditors() if $('#try .CodeMirror').length is 0
if checkLocalStorage and window.localStorage?
try
coffee = window.localStorage.getItem 'tryCoffeeScriptCode'
if coffee?
editors[0].setValue coffee
catch exception
$('#try, #try-link').toggleClass 'show'
setTimeout clearHash, 200 unless $('#try').hasClass('show')
closeTry = ->
$('#try, #try-link').removeClass 'show'
window.history.pushState '', document.title, window.location.pathname
$('[data-toggle="try"]').click toggleTry
$('[data-close="try"]').click closeTry
# Configure the initial state
if window.location.hash?
if window.location.hash is '#try'
@ -168,7 +183,7 @@ $(document).ready ->
else if window.location.hash.indexOf('#try') is 0
initializeTryEditors() if $('#try .CodeMirror').length is 0
editors[0].setValue decodeURIComponent window.location.hash[5..]
toggleTry()
toggleTry no
else if window.location.hash is ''
clearHash()
else

View File

@ -160,15 +160,16 @@ button:focus, .navbar-dark .navbar-toggler:focus {
font-family: Lato;
font-weight: 300;
font-size: 1.1em;
line-height: 1.7;
}
.main blockquote {
font-size: 1.1em;
}
@media (min-width: 1050px) {
.main p, .main li, .main td, .main th {
font-size: 1.2em;
}
.main blockquote {
.main li p, .main li li, .main li blockquote {
font-size: 1em;
}
@media (min-width: 768px) {
.main p, .main li, .main td, .main th, .main blockquote {
font-size: 1.2em;
}
}
@ -194,15 +195,18 @@ button:focus, .navbar-dark .navbar-toggler:focus {
}
p, blockquote, table, .code-example {
margin-bottom: 1.3rem;
margin-bottom: 1.1em;
}
.main li {
margin-bottom: 0.6em;
}
code {
font-size: 82%;
}
td code {
code, td code {
white-space: nowrap;
padding: 2px 8px;
}
pre code {
white-space: pre; /* We want newlines to be newlines in code blocks */
}
h2, h3, h4 {
@ -223,13 +227,18 @@ h3, h4, h2 time {
margin-top: -2.3rem;
}
@media (min-width: 1200px) {
.main > header, .main section > h2, .main section > h3, .main section > h4, .main section > p, .main section > blockquote, .main section > ul, .main section > table {
max-width: 80%;
}
}
code, button {
font-family: 'Roboto Mono';
font-weight: 400;
}
code, a > code {
background-color: #f8f3f0;
padding: 2px 8px;
}
code {
color: #2f2625;