MakeHaus Examples
Introduction
We have created 16 sample scripts that demonstrate different functionalities and possibilities. These range from pure diagnostic scripts to cross-tile scripts and complex Web UI applications that augment the hardware and can also be influenced by the hardware widgets.
The following subdivision does not represent any restrictions, but a classification of the focus of the respective examples. The first section is an exception, because the scripts in it do not serve a Web UI, but only communicate with the hardware.
All examples can be started from makehaus-js with the command npm run <scriptname>
.
Examples only for use with Hardware Widgets
encoder-events
This example simply logs every event coming from your Encoder Tile(s) to the console. Touch, press and turn your Encoder Widgets and watch the output.
npm run encoderevents
button-events
Same as above, but here only RGB Buttons are evaluated. Press any Button and watch the output on the console.
npm run buttonevents
motorfader-events
This example only listens to Motorfader events. Touch and move the faders - and watch the output on the console.
npm run motorfaderevents
diagnostics
Finally, this example logs every event coming from every type of Tile to the console. Play with your Widgets and watch the output.
npm run diagnostics
auto-animate
For this example you need at least one Motorfader tile and one Encoder tile (8 or 12 Encoders). Turn any Encoder and watch the Motorfaders.
npm run autoanimate
button-api
Start this example and press the first and/or the second Button on a RGB Button Tile. With each Button press, all Buttons change to the same new color.
npm run buttonapi
motorfader-api
This example is comparable with "auto-animate". But here you only need one Motorfader tile. Start the script and move the first (far left) fader.
npm run motorfaderapi
Examples which make use of the Stack API (Web UI Widgets)
makehaus-simple-butled8
This is a very simple example to show how a RGB Button can be linked with a Web UI Button. Just connect your mobile phone or browser to the MakeHaus UI server and press the first Button (which should glow green) on an 8 Button Tile.
npm run makehaussimplebutled8
makehaus-simple-butled12
Same as above, but for a 12 Button Tile. Press the first (green glowing) Button in this example and watch your Web UI.
npm run makehaussimplebutled12
makehaus-simple-encoder8-turn
The following script demonstrates how an Encoder can be augmented. Connect your phone, then touch and turn the first Encoder of an 8 Encoder Tile. Here also a threshold value is defined, at which the color of the UI Widget changes and a label toggles between "Cool" and "Hot".
npm run makehaussimpleencoder8turn
makehaus-simple-encoder12-press
Same as above, but for a 12 Encoder Tile.
npm run makehaussimpleencoder12press
makehaus-simple-motorfader4
Start this example, connect your phone to the UI server and move the first Fader on a Motorfader Tile. In this example, the threshold value is used, too.
npm run makehaussimplemotorfader4
makehaus-full-phone
It's party time! Finally, it's getting colorful. If you start this example and connect your smartphone to the UI server, you will get a color identical representation of an 8-button tile (it does not work with a 12-button tile).
The upper row of buttons is uniformly colored, with one button highlighted. If you press one of the other three buttons here, this one will be highlighted (radio buttons).
The bottom row shows the colors red, green, blue and orange. Use these buttons to select the basic color of the top row. Give it a go!
npm run makehausfullphone
makehaus-full-tablet
More colors! The Web UI that comes with this example is too big for a smartphone screen, so better use a tablet or your desktop browser. MakeHaus-Full-Tablet supports up to 2 Fader-Tiles, 2 8-Encoder-Tiles and 2 8-RGB Button-Tiles. Just play with your controls and watch what happens. The Web UI buttons are also clickable.
npm run makehausfulltablet
Outlook
More examples will follow!