Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Simple web interface example for running REAPER actions remotely
<!DOCTYPE html>
<title>Toolbar demo by cfillion</title>
<meta charset="utf-8"/>
@font-face {
font-family: 'Bravura';
src: url('');
button {
font-family: 'Bravura';
font-size: 40px;
height: 100px;
line-height: 120px;
margin: 5px;
overflow: hidden;
width: 100px;
white-space: pre;
<script src="/main.js"></script>
<body data-midieditor-proxy="_RSaa0b95d32702e4280da1ed3c64dd12063f680ee4">
Import the script at in
the Action List's Main Section and put its command ID in the
data-midieditor-proxy attribute above.
Main action:
<button data-action="command-id">Label</button>
MIDI Editor action:
<button data-action="command-id" data-midieditor>Label</button>
<!-- Grid: Set to 1/2 -->
<button data-action="40203" data-midieditor>&#x1d15e;</button>
<!-- Grid: Set to 1/4 -->
<button data-action="40201" data-midieditor>&#x2669;</button>
<!-- Grid: Set to 1/8 -->
<button data-action="40197" data-midieditor>&#x266a;</button>
<!-- Grid: Set to 1/16 -->
<button data-action="40192" data-midieditor>&#x1d161;</button>
function getAction(dataset)
var action = encodeURIComponent(dataset.action);
if(dataset.midieditor !== undefined) {
return 'SET/EXTSTATE/run_action/midi_editor/' +
action + ';' + document.body.dataset.midieditorProxy;
return action;
var elements = document.getElementsByTagName('button');
for(var i = 0; i < elements.length; ++i) {
elements[i].addEventListener('click', function(e) {
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.