Cosmetic fixes
This commit is contained in:
35
index.html
35
index.html
@ -104,30 +104,41 @@
|
||||
|
||||
<div id="documentation" class="hidden">
|
||||
<div id="documentation-page" class="flex flex-row">
|
||||
<aside class="h-fit p-1 lg:p-8 bg-neutral-900 text-white">
|
||||
<nav class="space-y-0 text-xl sm:text-sm">
|
||||
<div class="space-y-2">
|
||||
<h2 class="font-semibold text-gray-400">Basics</h2>
|
||||
<aside class="h-fit p-1 lg:p-6 bg-neutral-900 text-white">
|
||||
<nav class="text-xl sm:text-sm overflow-y-scroll">
|
||||
<div class="">
|
||||
<h2 class="font-semibold lg:text-xl text-gray-400">Basics</h2>
|
||||
<div class="flex flex-col">
|
||||
<p rel="noopener noreferrer" id="docs_introduction" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Introduction </p>
|
||||
<p rel="noopener noreferrer" id="docs_interface" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Interface</p>
|
||||
<p rel="noopener noreferrer" id="docs_code" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Code</p>
|
||||
<p rel="noopener noreferrer" id="docs_time" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Time</p>
|
||||
<p rel="noopener noreferrer" id="docs_sound" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Sound</p>
|
||||
<p rel="noopener noreferrer" id="docs_shortcuts" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Keyboard</p>
|
||||
<p rel="noopener noreferrer" id="docs_code" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Coding</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<h2 class="font-semibold lg:text-xl pb-1 pt-1 text-gray-400">Learning</h2>
|
||||
<div class="flex flex-col">
|
||||
<p rel="noopener noreferrer" id="docs_time" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Time/Rhythm</p>
|
||||
<p rel="noopener noreferrer" id="docs_sound" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Audio Engine</p>
|
||||
<p rel="noopener noreferrer" id="docs_samples" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Samples</p>
|
||||
<p rel="noopener noreferrer" id="docs_synths" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Synths</p>
|
||||
<p rel="noopener noreferrer" id="docs_midi" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">MIDI</p>
|
||||
<p rel="noopener noreferrer" id="docs_chaining" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Chaining</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<h2 class="font-semibold lg:text-xl pb-1 pt-1 text-gray-400">Patterns</h2>
|
||||
<div class="flex flex-col">
|
||||
<p rel="noopener noreferrer" id="docs_patterns" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Patterns</p>
|
||||
<p rel="noopener noreferrer" id="docs_ziffers" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Ziffers</p>
|
||||
<p rel="noopener noreferrer" id="docs_chaining" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Chaining</p>
|
||||
<p rel="noopener noreferrer" id="docs_functions" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Functions</p>
|
||||
<p rel="noopener noreferrer" id="docs_shortcuts" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Shortcuts</p>
|
||||
<p rel="noopener noreferrer" id="docs_ziffers" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Ziffers</p>
|
||||
<!--
|
||||
<p rel="noopener noreferrer" id="docs_reference" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Reference</p>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<h2 class="font-semibold text-gray-400">More</h2>
|
||||
<h2 class="font-semibold lg:text-xl text-gray-400">More</h2>
|
||||
<div class="flex flex-col">
|
||||
<a rel="noopener noreferrer" id="docs_about" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">About Topos</a>
|
||||
</div>
|
||||
|
||||
@ -1900,9 +1900,8 @@ Topos is made to be controlled entirely with a keyboard. It is recommanded to st
|
||||
|
||||
| Shortcut | Key | Description |
|
||||
|----------|-------|------------------------------------------------------------|
|
||||
|**Start** transport|${key_shortcut("Ctrl + P")}|Start audio playback|
|
||||
|**Pause** the transport |${key_shortcut("Ctrl + S")}|Pause audio playback|
|
||||
|**Rewind** the transport|${key_shortcut("Ctrl + R")}|Rewind audio playback|
|
||||
|**Start/Pause** transport|${key_shortcut("Ctrl + P")}|Start or pause audio playback|
|
||||
|**Stop** the transport |${key_shortcut("Ctrl + S")}|Stop and rewind audio playback|
|
||||
|
||||
## Moving in the interface
|
||||
|
||||
|
||||
28
src/main.ts
28
src/main.ts
@ -27,6 +27,7 @@ import {
|
||||
template_universes,
|
||||
} from "./AppSettings";
|
||||
import { tryEvaluate } from "./Evaluator";
|
||||
// @ts-ignore
|
||||
import { gzipSync, decompressSync, strFromU8 } from 'fflate';
|
||||
|
||||
// Importing showdown and setting up the markdown converter
|
||||
@ -263,19 +264,13 @@ export class Editor {
|
||||
// Application event listeners
|
||||
// ================================================================================
|
||||
|
||||
document.addEventListener("keydown", (event: KeyboardEvent) => {
|
||||
// TAB should do nothing
|
||||
window.addEventListener("keydown", (event: KeyboardEvent) => {
|
||||
|
||||
if (event.key === "Tab") {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
if (event.ctrlKey && event.key === "s") {
|
||||
event.preventDefault();
|
||||
this.setButtonHighlighting("pause", true);
|
||||
this.clock.pause();
|
||||
}
|
||||
|
||||
if (event.ctrlKey && event.key === "r") {
|
||||
event.preventDefault();
|
||||
this.setButtonHighlighting("stop", true);
|
||||
this.clock.stop();
|
||||
@ -283,8 +278,15 @@ export class Editor {
|
||||
|
||||
if (event.ctrlKey && event.key === "p") {
|
||||
event.preventDefault();
|
||||
this.setButtonHighlighting("play", true);
|
||||
this.clock.start();
|
||||
if (this.isPlaying) {
|
||||
this.isPlaying = false;
|
||||
this.setButtonHighlighting("pause", true);
|
||||
this.clock.pause();
|
||||
} else {
|
||||
this.isPlaying = true;
|
||||
this.setButtonHighlighting("play", true);
|
||||
this.clock.start();
|
||||
}
|
||||
}
|
||||
|
||||
// Ctrl + Shift + V: Vim Mode
|
||||
@ -370,8 +372,10 @@ export class Editor {
|
||||
if (event.keyCode === keycode) {
|
||||
event.preventDefault();
|
||||
if (event.ctrlKey) {
|
||||
event.preventDefault();
|
||||
this.api.script(keycode - 111);
|
||||
} else {
|
||||
event.preventDefault();
|
||||
this.changeModeFromInterface("local");
|
||||
this.changeToLocalBuffer(index);
|
||||
this.hideDocumentation();
|
||||
@ -381,10 +385,12 @@ export class Editor {
|
||||
);
|
||||
|
||||
if (event.keyCode == 121) {
|
||||
event.preventDefault();
|
||||
this.changeModeFromInterface("global");
|
||||
this.hideDocumentation();
|
||||
}
|
||||
if (event.keyCode == 122) {
|
||||
event.preventDefault();
|
||||
this.changeModeFromInterface("init");
|
||||
this.hideDocumentation();
|
||||
}
|
||||
@ -591,7 +597,7 @@ export class Editor {
|
||||
"ziffers",
|
||||
"midi",
|
||||
"functions",
|
||||
"reference",
|
||||
// "reference",
|
||||
"shortcuts",
|
||||
"about",
|
||||
].forEach((e) => {
|
||||
|
||||
Reference in New Issue
Block a user