fix: fix doc code tablist switcher

straker · Aug 1, 2019 · d232baa · d232baa
1 parent 8c6025f
commit d232baa
Show file tree

Hide file tree

Showing 20 changed files with 334 additions and 1,935 deletions.
diff --git a/doc-tasks.js b/doc-tasks.js
@@ -78,7 +78,7 @@ function buildImports(section) {
   section.description = section.description
     .replace(codeRegex, (match, className) => {
 
-      if (className === 'lang-js' && !match.includes('// exclude-tablist')) {
+      if (className === 'language-js' && !match.includes('// exclude-tablist')) {
         let globalImport = match.replace(importRegex, `let {$1} = kontra`);
         let esImport = match.replace(importRegex, `import {$1} from 'path/to/kontra.mjs'`);
         let bundlerImport = match;

diff --git a/docs/api/animation.html b/docs/api/animation.html
@@ -84,7 +84,7 @@ <h1>Animation(&#8203;properties)
     </li>
     <li role="presentation"></li>
   </ul>
-  <section role="tabpanel" aria-labelledby=animation-global-tab data-tabpanel="global"><pre><code class="lang-js">let { SpriteSheet, Animation } = kontra;
+  <section role="tabpanel" aria-labelledby=animation-global-tab data-tabpanel="global"><pre><code class="language-js">let { SpriteSheet, Animation } = kontra;
 
 let image = new Image();
 image.src = &#39;assets/imgs/character_walk_sheet.png&#39;;
@@ -101,9 +101,8 @@ <h1>Animation(&#8203;properties)
     frames: [1,2,3,6],
     frameRate: 30
   });
-};
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=animation-es-tab data-tabpanel="es"><pre><code class="lang-js">import { SpriteSheet, Animation } from 'path/to/kontra.mjs';
+};</code></pre></section>
+  <section role="tabpanel" aria-labelledby=animation-es-tab data-tabpanel="es"><pre><code class="language-js">import { SpriteSheet, Animation } from 'path/to/kontra.mjs';
 
 let image = new Image();
 image.src = &#39;assets/imgs/character_walk_sheet.png&#39;;
@@ -120,9 +119,8 @@ <h1>Animation(&#8203;properties)
     frames: [1,2,3,6],
     frameRate: 30
   });
-};
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=animation-bundle-tab data-tabpanel="bundle"><pre><code class="lang-js">import { SpriteSheet, Animation } from &#39;kontra&#39;;
+};</code></pre></section>
+  <section role="tabpanel" aria-labelledby=animation-bundle-tab data-tabpanel="bundle"><pre><code class="language-js">import { SpriteSheet, Animation } from &#39;kontra&#39;;
 
 let image = new Image();
 image.src = &#39;assets/imgs/character_walk_sheet.png&#39;;
@@ -139,8 +137,7 @@ <h1>Animation(&#8203;properties)
     frames: [1,2,3,6],
     frameRate: 30
   });
-};
-</code></pre></section>
+};</code></pre></section>
 </div>
         <h3 id="title-Animation"><span class="visually-hidden">Animation</span> Parameters</span></h3>
         <dl aria-labelledby="title-Animation">

diff --git a/docs/api/assets.html b/docs/api/assets.html
diff --git a/docs/api/core.html b/docs/api/core.html
@@ -82,30 +82,27 @@ <h1>Core        </h1>
     </li>
     <li role="presentation"></li>
   </ul>
-  <section role="tabpanel" aria-labelledby=core-global-tab data-tabpanel="global"><pre><code class="lang-js">let { getCanvas, getContext, init } = kontra;
+  <section role="tabpanel" aria-labelledby=core-global-tab data-tabpanel="global"><pre><code class="language-js">let { getCanvas, getContext, init } = kontra;
 
 let { canvas, context } = init();
 
 // or can get canvas and context through functions
 canvas = getCanvas();
-context = getContext();
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=core-es-tab data-tabpanel="es"><pre><code class="lang-js">import { getCanvas, getContext, init } from 'path/to/kontra.mjs';
+context = getContext();</code></pre></section>
+  <section role="tabpanel" aria-labelledby=core-es-tab data-tabpanel="es"><pre><code class="language-js">import { getCanvas, getContext, init } from 'path/to/kontra.mjs';
 
 let { canvas, context } = init();
 
 // or can get canvas and context through functions
 canvas = getCanvas();
-context = getContext();
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=core-bundle-tab data-tabpanel="bundle"><pre><code class="lang-js">import { getCanvas, getContext, init } from &#39;kontra&#39;;
+context = getContext();</code></pre></section>
+  <section role="tabpanel" aria-labelledby=core-bundle-tab data-tabpanel="bundle"><pre><code class="language-js">import { getCanvas, getContext, init } from &#39;kontra&#39;;
 
 let { canvas, context } = init();
 
 // or can get canvas and context through functions
 canvas = getCanvas();
-context = getContext();
-</code></pre></section>
+context = getContext();</code></pre></section>
 </div>
 
 
@@ -189,18 +186,15 @@ <h2 id="init">
     </li>
     <li role="presentation"></li>
   </ul>
-  <section role="tabpanel" aria-labelledby=init-global-tab data-tabpanel="global"><pre><code class="lang-js">let { init } = kontra;
+  <section role="tabpanel" aria-labelledby=init-global-tab data-tabpanel="global"><pre><code class="language-js">let { init } = kontra;
 
-let { canvas, context } = init(&#39;game&#39;);
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=init-es-tab data-tabpanel="es"><pre><code class="lang-js">import { init } from 'path/to/kontra.mjs';
+let { canvas, context } = init(&#39;game&#39;);</code></pre></section>
+  <section role="tabpanel" aria-labelledby=init-es-tab data-tabpanel="es"><pre><code class="language-js">import { init } from 'path/to/kontra.mjs';
 
-let { canvas, context } = init(&#39;game&#39;);
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=init-bundle-tab data-tabpanel="bundle"><pre><code class="lang-js">import { init } from &#39;kontra&#39;;
+let { canvas, context } = init(&#39;game&#39;);</code></pre></section>
+  <section role="tabpanel" aria-labelledby=init-bundle-tab data-tabpanel="bundle"><pre><code class="language-js">import { init } from &#39;kontra&#39;;
 
-let { canvas, context } = init(&#39;game&#39;);
-</code></pre></section>
+let { canvas, context } = init(&#39;game&#39;);</code></pre></section>
 </div>
           <h3 id="title-init"><span class="visually-hidden">init</span> Parameters</span></h3>
           <dl aria-labelledby="title-init">

diff --git a/docs/api/events.html b/docs/api/events.html
@@ -81,36 +81,33 @@ <h1>Events        </h1>
     </li>
     <li role="presentation"></li>
   </ul>
-  <section role="tabpanel" aria-labelledby=events-global-tab data-tabpanel="global"><pre><code class="lang-js">let { on, off, emit } = kontra;
+  <section role="tabpanel" aria-labelledby=events-global-tab data-tabpanel="global"><pre><code class="language-js">let { on, off, emit } = kontra;
 
 function callback(a, b, c) {
   console.log({a, b, c});
 });
 
 on(&#39;myEvent&#39;, callback);
 emit(&#39;myEvent&#39;, 1, 2, 3);  //=&gt; {a: 1, b: 2, c: 3}
-off(&#39;myEvent&#39;, callback);
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=events-es-tab data-tabpanel="es"><pre><code class="lang-js">import { on, off, emit } from 'path/to/kontra.mjs';
+off(&#39;myEvent&#39;, callback);</code></pre></section>
+  <section role="tabpanel" aria-labelledby=events-es-tab data-tabpanel="es"><pre><code class="language-js">import { on, off, emit } from 'path/to/kontra.mjs';
 
 function callback(a, b, c) {
   console.log({a, b, c});
 });
 
 on(&#39;myEvent&#39;, callback);
 emit(&#39;myEvent&#39;, 1, 2, 3);  //=&gt; {a: 1, b: 2, c: 3}
-off(&#39;myEvent&#39;, callback);
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=events-bundle-tab data-tabpanel="bundle"><pre><code class="lang-js">import { on, off, emit } from &#39;kontra&#39;;
+off(&#39;myEvent&#39;, callback);</code></pre></section>
+  <section role="tabpanel" aria-labelledby=events-bundle-tab data-tabpanel="bundle"><pre><code class="language-js">import { on, off, emit } from &#39;kontra&#39;;
 
 function callback(a, b, c) {
   console.log({a, b, c});
 });
 
 on(&#39;myEvent&#39;, callback);
 emit(&#39;myEvent&#39;, 1, 2, 3);  //=&gt; {a: 1, b: 2, c: 3}
-off(&#39;myEvent&#39;, callback);
-</code></pre></section>
+off(&#39;myEvent&#39;, callback);</code></pre></section>
 </div>
 
 

diff --git a/docs/api/gameLoop.html b/docs/api/gameLoop.html
@@ -84,7 +84,7 @@ <h1>GameLoop(&#8203;properties)
     </li>
     <li role="presentation"></li>
   </ul>
-  <section role="tabpanel" aria-labelledby=gameloop-global-tab data-tabpanel="global"><pre><code class="lang-js">let { Sprite, GameLoop } = kontra;
+  <section role="tabpanel" aria-labelledby=gameloop-global-tab data-tabpanel="global"><pre><code class="language-js">let { Sprite, GameLoop } = kontra;
 
 let sprite = Sprite({
   x: 100,
@@ -109,9 +109,8 @@ <h1>GameLoop(&#8203;properties)
   }
 });
 
-loop.start();
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=gameloop-es-tab data-tabpanel="es"><pre><code class="lang-js">import { Sprite, GameLoop } from 'path/to/kontra.mjs';
+loop.start();</code></pre></section>
+  <section role="tabpanel" aria-labelledby=gameloop-es-tab data-tabpanel="es"><pre><code class="language-js">import { Sprite, GameLoop } from 'path/to/kontra.mjs';
 
 let sprite = Sprite({
   x: 100,
@@ -136,9 +135,8 @@ <h1>GameLoop(&#8203;properties)
   }
 });
 
-loop.start();
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=gameloop-bundle-tab data-tabpanel="bundle"><pre><code class="lang-js">import { Sprite, GameLoop } from &#39;kontra&#39;;
+loop.start();</code></pre></section>
+  <section role="tabpanel" aria-labelledby=gameloop-bundle-tab data-tabpanel="bundle"><pre><code class="language-js">import { Sprite, GameLoop } from &#39;kontra&#39;;
 
 let sprite = Sprite({
   x: 100,
@@ -163,8 +161,7 @@ <h1>GameLoop(&#8203;properties)
   }
 });
 
-loop.start();
-</code></pre></section>
+loop.start();</code></pre></section>
 </div>
         <h3 id="title-GameLoop"><span class="visually-hidden">GameLoop</span> Parameters</span></h3>
         <dl aria-labelledby="title-GameLoop">
@@ -268,7 +265,7 @@ <h2 id="isStopped">
     </li>
     <li role="presentation"></li>
   </ul>
-  <section role="tabpanel" aria-labelledby=isstopped-global-tab data-tabpanel="global"><pre><code class="lang-js">let { GameLoop } = kontra;
+  <section role="tabpanel" aria-labelledby=isstopped-global-tab data-tabpanel="global"><pre><code class="language-js">let { GameLoop } = kontra;
 
 let loop = GameLoop({
   // ...
@@ -279,9 +276,8 @@ <h2 id="isStopped">
 console.log(loop.isStopped);  //=&gt; false
 
 loop.stop();
-console.log(loop.isStopped);  //=&gt; true
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=isstopped-es-tab data-tabpanel="es"><pre><code class="lang-js">import { GameLoop } from 'path/to/kontra.mjs';
+console.log(loop.isStopped);  //=&gt; true</code></pre></section>
+  <section role="tabpanel" aria-labelledby=isstopped-es-tab data-tabpanel="es"><pre><code class="language-js">import { GameLoop } from 'path/to/kontra.mjs';
 
 let loop = GameLoop({
   // ...
@@ -292,9 +288,8 @@ <h2 id="isStopped">
 console.log(loop.isStopped);  //=&gt; false
 
 loop.stop();
-console.log(loop.isStopped);  //=&gt; true
-</code></pre></section>
-  <section role="tabpanel" aria-labelledby=isstopped-bundle-tab data-tabpanel="bundle"><pre><code class="lang-js">import { GameLoop } from &#39;kontra&#39;;
+console.log(loop.isStopped);  //=&gt; true</code></pre></section>
+  <section role="tabpanel" aria-labelledby=isstopped-bundle-tab data-tabpanel="bundle"><pre><code class="language-js">import { GameLoop } from &#39;kontra&#39;;
 
 let loop = GameLoop({
   // ...
@@ -305,8 +300,7 @@ <h2 id="isStopped">
 console.log(loop.isStopped);  //=&gt; false
 
 loop.stop();
-console.log(loop.isStopped);  //=&gt; true
-</code></pre></section>
+console.log(loop.isStopped);  //=&gt; true</code></pre></section>
 </div>
 
         </section>