start splitting the documentation to include a new article about pitch

index.html

@@ -201,6 +201,7 @@
                   <div class="flex flex-col">
                     <p rel="noopener noreferrer" id="docs_audio_basics" class="doc_subheader">Playing a sound</p>
                     <p rel="noopener noreferrer" id="docs_amplitude" class="doc_subheader">Amplitude</p>
+                    <p rel="noopener noreferrer" id="docs_pitch" class="doc_subheader">Pitch</p>
                     <p rel="noopener noreferrer" id="docs_sampler" class="doc_subheader">Sampler</p>
                     <p rel="noopener noreferrer" id="docs_synths" class="doc_subheader">Synths</p>
                     <p rel="noopener noreferrer" id="docs_filters" class="doc_subheader">Filters</p>

src/Documentation.ts

@@ -3,6 +3,7 @@ import { type Editor } from "./main";
 import { introduction } from "./documentation/basics/welcome";
 import { loading_samples } from "./documentation/learning/samples/loading_samples";
 import { amplitude } from "./documentation/learning/audio_engine/amplitude";
+import { pitch } from "./documentation/learning/audio_engine/pitch";
 import { effects } from "./documentation/learning/audio_engine/effects";
 import { sampler } from "./documentation/learning/audio_engine/sampler";
 import { sample_banks } from "./documentation/learning/samples/sample_banks";
@@ -152,6 +153,7 @@ export const documentation_factory = (application: Editor) => {
     generators: generators(application),
     shortcuts: shortcuts(application),
     amplitude: amplitude(application),
+    pitch: pitch(application),
     effects: effects(application),
     sampler: sampler(application),
     mouse: mouse(application),
@@ -218,28 +220,28 @@ export const updateDocumentationContent = (app: Editor, bindings: any) => {
     moreStyling: true,
     backslashEscapesHTMLTags: true,
     extensions: [showdownHighlight({
-      pre: true, 
+      pre: true,
       auto_detection: false
     }), ...bindings],
   });
- 
-  if(Object.keys(app.docs).length === 0) {
+
+  if (Object.keys(app.docs).length === 0) {
     app.docs = documentation_factory(app);
   }
 
-  function _update_and_assign(callback: Function) { 
+  function _update_and_assign(callback: Function) {
     const converted_markdown = converter.makeHtml(
       app.docs[app.currentDocumentationPane],
     );
-     callback(converted_markdown)
+    callback(converted_markdown)
   }
-  _update_and_assign((e: string)=> { 
+  _update_and_assign((e: string) => {
     let display_content = e === undefined ? loading_message : e;
-    document.getElementById("documentation-content")!.innerHTML = display_content; 
+    document.getElementById("documentation-content")!.innerHTML = display_content;
   })
   if (document.getElementById("documentation-content")!.innerHTML.replace(/"/g, "'") == loading_message.replace(/"/g, "'")) {
     setTimeout(() => {
       updateDocumentationContent(app, bindings);
     }, 100);
   }
-}
+}

src/documentation/learning/audio_engine/pitch.ts

@@ -0,0 +1,28 @@
+import { type Editor } from "../../../main";
+import { makeExampleFactory } from "../../../Documentation";
+
+export const pitch = (application: Editor): string => {
+  // @ts-ignore
+  const makeExample = makeExampleFactory(application);
+  return `# Pitch 
+
+
+## Pitch envelope
+	
+Similar to the amplitude envelope, you can use an envelope to shape the pitch
+of your sounds (can be samples or synthesizers). This is super useful to create
+new timbres out of existing sounds.
+	
+| Method  | Alias | Description                                   |
+|---------|-------|-----------------------------------------------|
+| <ic>pattack</ic>  | patt   | Attack time |
+| <ic>pdecay</ic>   | pdec   | Decay time |
+| <ic>psustain</ic> | psus   | Sustain value |
+| <ic>prelease</ic> | prel   | Release time |
+| <ic>penv</ic>    |       | Pitch envelope strength (positive or negative) |
+| <ic>panchor</ic>    |       | Envelope anchor range (0 - 1) |
+	
+Resume writing the pitch documentation here.
+
+`;
+};