From a641044bf8ab541ab40d7d9ce2f55b8089bbd959 Mon Sep 17 00:00:00 2001
From: Pierre Ranwez <pierre.ranwez.etu@univ-lille.fr>
Date: Fri, 21 Jan 2022 12:24:11 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=93=9D=20doc:=20readme=20update.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
README.md | 35 +++++++++++++++++++++++++++++------
1 file changed, 29 insertions(+), 6 deletions(-)
diff --git a/README.md b/README.md
index 0d7f6ee..addeb4d 100644
--- a/README.md
+++ b/README.md
@@ -4,8 +4,7 @@ CssLsd is a Chromium Extension which allows for interactively modifying
the style of web pages using MIDI messages, Keyboard presses or Audio input
features.
-
-## Setup
+## Setup
- Download or Clone CssLsd
- Start Chromium
@@ -13,15 +12,39 @@ features.
- Click "Load unpacked extension" and select the csslsd folder
- Now the extension should appear in the menu bar
-
## Usage
-TODO
+You need to use a CSS template, like below to map your audio or MIDI events to some CSS properties.
+
+```css
+body {
+ background-color:rgba(0,0,0,[audio.meter.volume]);
+}
+h1 {
+ opacity: [midi.noteon.C];
+}
+```
+### MIDI Variables
+- midi
+ - noteon
+ - name (ex: C, D, E, F, G, A, B)
+ - controlchange
+ - name
-## Ressources
+### Audio Variables
+
+- audio
+ - energy
+ - bass
+ - mid
+ - treble
+ - meter
+ - volume
+
+## Ressources
- Chrome extensions : https://developer.chrome.com/docs/extensions/mv3/getstarted/
- WebMIDI : https://webmidijs.org/
-
+- CSSParser : http://glazman.org/JSCSSP/index.html
\ No newline at end of file
--
GitLab