BuboBubo/topos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Cosmetic fixes

Browse Source
This commit is contained in:
Raphaël Forment
2023-08-30 02:14:47 +02:00
parent 9d34b8e81d
commit 615ef04e7e
3 changed files with 42 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
index.html
View File

@ -104,30 +104,41 @@
<div id="documentation" class="hidden"> <div id="documentation" class="hidden">
<div id="documentation-page" class="flex flex-row"> <div id="documentation-page" class="flex flex-row">
<aside class="h-fit p-1 lg:p-8 bg-neutral-900 text-white"> <aside class="h-fit p-1 lg:p-6 bg-neutral-900 text-white">
<nav class="space-y-0 text-xl sm:text-sm"> <nav class="text-xl sm:text-sm overflow-y-scroll">
<div class="space-y-2"> <div class="">
<h2 class="font-semibold text-gray-400">Basics</h2> <h2 class="font-semibold lg:text-xl text-gray-400">Basics</h2>
<div class="flex flex-col"> <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_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_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_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_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_code" class="pl-2 pr-2 lg:text-xl text-sm hover:bg-neutral-800 py-1 my-1 rounded-lg">Coding</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> </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_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_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_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_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_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> <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> </div>
<div class="space-y-2"> <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"> <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> <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> </div>

5
src/Documentation.ts
View File

@ -1900,9 +1900,8 @@ Topos is made to be controlled entirely with a keyboard. It is recommanded to st
| Shortcut | Key | Description | | Shortcut | Key | Description |
|----------|-------|------------------------------------------------------------| |----------|-------|------------------------------------------------------------|
|**Start** transport|${key_shortcut("Ctrl + P")}|Start audio playback| |**Start/Pause** transport|${key_shortcut("Ctrl + P")}|Start or pause audio playback|
|**Pause** the transport |${key_shortcut("Ctrl + S")}|Pause audio playback| |**Stop** the transport |${key_shortcut("Ctrl + S")}|Stop and rewind audio playback|
|**Rewind** the transport|${key_shortcut("Ctrl + R")}|Rewind audio playback|
## Moving in the interface ## Moving in the interface

28
src/main.ts
View File

@ -27,6 +27,7 @@ import {
template_universes, template_universes,
} from "./AppSettings"; } from "./AppSettings";
import { tryEvaluate } from "./Evaluator"; import { tryEvaluate } from "./Evaluator";
// @ts-ignore
import { gzipSync, decompressSync, strFromU8 } from 'fflate'; import { gzipSync, decompressSync, strFromU8 } from 'fflate';
// Importing showdown and setting up the markdown converter // Importing showdown and setting up the markdown converter
@ -263,19 +264,13 @@ export class Editor {
// Application event listeners // Application event listeners
// ================================================================================ // ================================================================================
document.addEventListener("keydown", (event: KeyboardEvent) => { window.addEventListener("keydown", (event: KeyboardEvent) => {
// TAB should do nothing
if (event.key === "Tab") { if (event.key === "Tab") {
event.preventDefault(); event.preventDefault();
} }
if (event.ctrlKey && event.key === "s") { if (event.ctrlKey && event.key === "s") {
event.preventDefault();
this.setButtonHighlighting("pause", true);
this.clock.pause();
}
if (event.ctrlKey && event.key === "r") {
event.preventDefault(); event.preventDefault();
this.setButtonHighlighting("stop", true); this.setButtonHighlighting("stop", true);
this.clock.stop(); this.clock.stop();
@ -283,8 +278,15 @@ export class Editor {
if (event.ctrlKey && event.key === "p") { if (event.ctrlKey && event.key === "p") {
event.preventDefault(); event.preventDefault();
this.setButtonHighlighting("play", true); if (this.isPlaying) {
this.clock.start(); 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 // Ctrl + Shift + V: Vim Mode
@ -370,8 +372,10 @@ export class Editor {
if (event.keyCode === keycode) { if (event.keyCode === keycode) {
event.preventDefault(); event.preventDefault();
if (event.ctrlKey) { if (event.ctrlKey) {
event.preventDefault();
this.api.script(keycode - 111); this.api.script(keycode - 111);
} else { } else {
event.preventDefault();
this.changeModeFromInterface("local"); this.changeModeFromInterface("local");
this.changeToLocalBuffer(index); this.changeToLocalBuffer(index);
this.hideDocumentation(); this.hideDocumentation();
@ -381,10 +385,12 @@ export class Editor {
); );
if (event.keyCode == 121) { if (event.keyCode == 121) {
event.preventDefault();
this.changeModeFromInterface("global"); this.changeModeFromInterface("global");
this.hideDocumentation(); this.hideDocumentation();
} }
if (event.keyCode == 122) { if (event.keyCode == 122) {
event.preventDefault();
this.changeModeFromInterface("init"); this.changeModeFromInterface("init");
this.hideDocumentation(); this.hideDocumentation();
} }
@ -591,7 +597,7 @@ export class Editor {
"ziffers", "ziffers",
"midi", "midi",
"functions", "functions",
"reference", // "reference",
"shortcuts", "shortcuts",
"about", "about",
].forEach((e) => { ].forEach((e) => {