Update code examples

index.html

@@ -278,8 +278,8 @@
         </li>
         <li>
           <h3>Serve your site.</h3>
-          <pre><code class='language-bash'>site count</code></pre>
-          <aside>(You don’t have to be in the folder you want Site.js to serve, as in the previous examples. As shown here, you can specify the folder as an argument to the <code>site</code> command.)</aside>
+          <pre><code class='language-bash'>site ..</code></pre>
+          <aside>(You don’t have to be in the folder you want Site.js to serve, as in the previous examples. As shown here, you can specify the folder as an argument to the <code>site</code> command. In this case, we want to serve the whole site from the parent folder, not just the <code>.dynamic</code> folder.)</aside>
           <p>Hit <a href='https://localhost'>https://localhost</a> and refresh to see the counter update.</p>
           <p><strong>Congratulations, you just made your first fully-dynamic DotJS site!</strong></p>
         </li>
@@ -359,7 +359,16 @@ EOF</code></pre>
         </li>
         <li>
           <h3>Launch the server.</h3>
-          <pre><code class='language-bash'>site basic-chat</code></pre>
+          <ol>
+            <li>
+              <p>Return to the parent folder that contains the project folder.</p>
+              <pre><code class='language-bash'>cd ../../..</code></pre>
+            </li>
+            <li>
+              <p>Start the server.</p>
+              <pre><code class='language-bash'>site basic-chat</code></pre>
+            </li>
+          </ol>
           <p>To test your chat app, open up two web browser windows and enter the following into the web developer (JavaScript) console on both of them:</p>
 
           <pre><code class='language-js'>// Create the web socket connection.

js/index.js

-//////////////////////////////////////////////////////////////////////
+////////////////////////////////////////////////////////////////////////////////
 //
-// ⚠ GENERATED CODE. Please do not change.
+// Site.js
 //
-// These are the latest versions of the various release channels.
-// They are automatically populated by the Site.js build script
-// on deployment.
+// JavaScript for the index file. None of this JavaScript is required.
+// It’s all just progressive enhancement.
 //
-//////////////////////////////////////////////////////////////////////
-
-const versions = {
-  alphaBinaryVersion: 00000000000000,
-  alphaNodeVersion: '00.00.00',
-  alphaHugoVersion: '00.00.00',
-  alphaPackageVersion: '00.00.00',
-  alphaSourceVersion: 'bedface',
-
-  betaBinaryVersion: 00000000000000,
-  betaNodeVersion: '00.00.00',
-  betaHugoVersion: '00.00.00',
-  betaPackageVersion: '00.00.00',
-  betaSourceVersion: 'acecafe',
-
-  releaseBinaryVersion: 00000000000000,
-  releaseNodeVersion: '00.00.00',
-  releaseHugoVersion: '00.00.00',
-  releasePackageVersion: '00.00.00',
-  releaseSourceVersion: 'decafAF',
-}
-
-// //////////////////////////////////////////////////////////////////////
-// // End of generated code.
-// //////////////////////////////////////////////////////////////////////
+// Copyright ⓒ 2020 Aral Balkan. Licensed under AGPLv3 or later.
+// Shared with ♥ by the Small Technology Foundation.
+//
+// Like this? Fund us!
+// https://small-tech.org/fund-us
+//
+////////////////////////////////////////////////////////////////////////////////
 
+// Start the syntax highlighter.
+// TODO: Move this to the server side build script.
 hljs.initHighlightingOnLoad()
 
+// Useful shortcuts for DOM lookups.
 const $  = document.querySelector.bind(document)
 const $$ = document.querySelectorAll.bind(document)
 
-// Progressive enhancement:
 // Add copy buttons to all code segments.
 // Note: only supported on evergreen browsers.
 if (navigator.clipboard !== undefined) {
@@ -59,54 +42,21 @@ if (navigator.clipboard !== undefined) {
   })
 }
 
-// function binaryVersionToHumanReadableDateString (binaryVersion) {
-//   console.log(binaryVersion)
-//   const m = moment(binaryVersion, 'YYYYMMDDHHmmss')
-//   return `${m.format('MMMM Do, YYYY')} at ${m.format('HH:mm:ss')}`
-// }
-
-// // Progressively enhance the installation instructions to only show the ones for the
-// // detected platform (with links to the others), if we can detect a supported platform.
-// let visiblePlatform = 'linux'
-
-// function displayVersionInformation () {
+// Platform detection.
+const userAgent = navigator.userAgent.toLowerCase()
+let currentPlatform = 'unknown'
+if (userAgent.includes('linux')) { currentPlatform = 'linux' }
+if (userAgent.includes('mac os x')) { currentPlatform = 'mac' }
+if (userAgent.includes('windows')) { currentPlatform = 'windows'}
 
-//   const _ = version => versions[`${document.advanced.version.value}${version}`]
+// If we know the platform, remove instructions that are not
+// relevant for the current person
+if (currentPlatform !== 'unknown') {
 
-//   $$('.humanReadableBinaryVersion').forEach(span =>
-//     span.innerHTML = binaryVersionToHumanReadableDateString(_('BinaryVersion'))
-//   )
-//   $$('.packageVersion').forEach(span => span.innerHTML = _('PackageVersion'))
-//   $$('.sourceVersion').forEach(span => span.innerHTML = _('SourceVersion'))
-//   $$('.nodeVersion').forEach(span => span.innerHTML = _('NodeVersion'))
-//   $$('.hugoVersion').forEach(span => span.innerHTML = _('HugoVersion'))
-//   $$('.sourceUrl').forEach(a =>
-//     a.setAttribute('href', `https://github.com/small-tech/site.js/-/tree/${_('SourceVersion')}`)
-//   )
-// }
-
-// const defaultInstallationString = {
-//   linux: $('#code-linux').innerHTML,
-//   mac: $('#code-mac').innerHTML,
-//   windows: $('#code-windows').innerHTML
-// }
+}
 
-// function inputWithValue(value) {
-//   return $(`input[value="${value}"]`)
-// }
-// const radioButtons = {
-//   wget: inputWithValue('wget'),
-//   curl: inputWithValue('curl'),
-//   release: inputWithValue('release'),
-//   alpha: inputWithValue('alpha'),
-//   beta: inputWithValue('beta')
-// }
+// TODO: Add option to display the page as if the person was on a different platform.
 
-// const userAgent = navigator.userAgent.toLowerCase()
-// let currentPlatform = 'unknown'
-// if (userAgent.includes('linux')) { currentPlatform = 'linux' }
-// if (userAgent.includes('mac os x')) { currentPlatform = 'mac' }
-// if (userAgent.includes('windows')) { currentPlatform = 'windows'}
 
 // displayInstallationInstructionsFor(currentPlatform)