Differences

This shows you the differences between two versions of the page.

--- external_control:remote_control_wifi:touchosc [2018/10/16 20:13] – Added Color Faders, DreNL
+++ external_control:remote_control_wifi:touchosc [2018/12/27 13:54] (current) – typos, formatting Laudrin
@@ Line 1: / Line 1: @@
 {{ :external_control:remote_control_wifi:touchosc.jpg?nolink&150 |}}
-TouchOSC is a tool which runs on Both Android and Apple IOS. You can download the versions following the appropriate link below.
+TouchOSC is a tool which runs on both Android and Apple iOS. You can download the versions following the appropriate link below.\\
+\\
-[[https://play.google.com/store/apps/details?id=net.hexler.touchosc_a|Google Play]]
+[[https://play.google.com/store/apps/details?id=net.hexler.touchosc_a|Google Play]]\\
+[[https://itunes.apple.com/nl/app/touchosc/id288120394?mt=8|Apple IOS]]\\
-[[https://itunes.apple.com/nl/app/touchosc/id288120394?mt=8|Apple IOS]]
+\\
+In addition to the apps on your mobile device you need a MIDI bridge and a layout editor. These can be downloaded from the [[https://hexler.net/software/touchosc#downloads|download page]] on the website of the developer. Also detailed information on how to install can be [[https://hexler.net/docs/touchosc|found there]].\\
-In addition to the apps on your mobile device you need a midi bridge and a Layout editor. These can be downloaded from the [[https://hexler.net/software/touchosc#downloads|download page]] on the website of the developer. Also detailed information on how to install can be [[https://hexler.net/docs/touchosc|found there]].
+\\
+**Installation**\\
-**Installation**
+\\
+: Install the app on your mobile device.\\
-: Install the app on your mobile device.
+\\
+: Download the TouchOSC bridge for your OS and install it on your computer running FreeStyler. \\
-: Download the TouchOSC bridge for your OS and install it on your computer running FreeStyler.
+\\
+: Download the //TouchOSC Layout Editor// for your OS. There are both 64-bit and 32-bit versions available for Windows, so make sure you download the right one. Extract to a folder of your liking and open the program. When you open the program and get a Java error, please install a JRE from [[https://www.java.com|Java.com]]\\
-: Download the TouchOSC Layout Editor for your OS. There are both 64-bit and 32-bit versions available for Windows, so make sure you download the right one. Extract to a folder of your liking and open the program. When you open the program and get a Java error, please install a JRE from [[https://www.java.com|Java.com]]
+\\
+Once all these steps have been completed it is time to startup the TouchOSC system. Find the //TouchOSC Bridge// program and start it. For your convenience you can let it start up automatically under windows by putting it in the startup folder in the startmenu. The bridge is lightweight and doesn't use a lot of resources.\\
-Once all these steps have been completed it is time to startup the TouchOSC system. Find the TouchOSC Bridge program and start it. For your convenience you can let it start up automatically under windows by putting it in the startup folder in the startmenu. The bridge is lightweight and doesn't use a lot of resources.
+\\
+Then we need to configure FreeStyler to allow MIDI input and output from TouchOSC. You can do this by opening FreeStyler. Go to //Setup// → //FreeStyler Setup//. In the setup screen click //External Control// → //MIDI Control//. You will see the following screen:\\
-Then we need to configure FreeStyler to allow midi input and output from TouchOSC. You can do this by opening FreeStyler. Go to Setup --> FreeStyler Setup. In the setup screen click External Control --> Midi Control. You will see the following screen:
+{{:external_control:remote_control_wifi:midisetup.jpg?direct&400|}}\\
+\\
-{{:external_control:remote_control_wifi:midisetup.jpg?direct&400|}}
+In the left hand top corner select //TouchOSC Bridge// (it will only be visible when the bridge is running). Then click //start//.\\
+\\
-In the left hand top corner select TouchOSC Bridge (it will only be visible when the bridge is running). Then click start.
+On your mobile device you can start up TouchOSC. The Settings screen will come up. For us the main option is //MIDI Bridge//.\\
+{{:external_control:remote_control_wifi:screenshot_20181016-133437_1_.png?direct&400|}}\\
-On your mobile device you can start up TouchOSC. The Settings screen will come up. For us the main option is MIDI Bridge.
+\\
+When you tap it you see Host. There you can fill in the IP address of your computer. When you have Bonjour installed you will see your computer. Then it is easy, just tap your computer and IP address will be filled in automatically. If not you will need to fill in your IP address manually. See below screenshot.\\
-{{:external_control:remote_control_wifi:screenshot_20181016-133437_1_.png?direct&400|}}
+{{:external_control:remote_control_wifi:screenshot_20181016-134011_1_.png?direct&400|}}\\
+\\
-When you tap it you see Host. There you can fill in the IP address of your computer. When you have Bonjour installed you will see your computer. Then it is easy, just tap your computer and IP address will be filled in automatically. If not you will need to fill in your IP address manually. See below screenshot.
+Once done you will go back to the //Settings// page. There you can select //Layout//. Just select the //Keys layout// for now as this is only for testing purposes. Once selected tap //Done// and you will get in the main screen of TouchOSC.\\
+\\
-{{:external_control:remote_control_wifi:screenshot_20181016-134011_1_.png?direct&400|}}
+Go back to the //FreeStyler Setup// and open //External Control// → //MIDI//. On the left in the bottom there is a field which is blank. When you touch a key on the keyboard in your mobile device there should show up a value as seen in below screenshot.\\
+{{:external_control:remote_control_wifi:miditest.jpg?direct&400|}}\\
-Once done you will go back to the Settings page. There you can select Layout. Just select the Keys layout for now as this is only for testing purposes. Once selected tap Done and you will get in the main screen of TouchOSC.
+\\
+Once this works you are now ready to start working on a layout which serves your purpose or see if you can find a good ready-made one in the forum. So we will go on now with creating a layout.\\
-Go back to the FreeStyler Setup and open External Control --> Midi. On the left in the bottom there is a field which is blank. When you touch a key on the keyboard in your mobile device there should show up a value as seen in below screenshot.
+\\
+\\
-{{:external_control:remote_control_wifi:miditest.jpg?direct&400|}}
+The first thing to do is open the TouchOSC Editor. The main page looks like this:\\
+{{:external_control:remote_control_wifi:screen_shot_10-16-18_at_05.18_pm.png?direct&400|}}\\
-Once this works you are now ready to start working on a Layout which serves your purpose or see if you can find a good readymade one in the forum. So we will go on now with creating a layout.
+\\
+The program will start always with these settings. On the left select the layout you want. In my case I will use the //iPad layout// as I am using a //Samsung Galaxy Tab3//. Also I want to use my tablet in landscape so I will set the orientation to horizontal. And because I want to fit my screen in the window I will zoom out the view to 75% so I can see the whole workspace. When done my screen looks like this (highlighted the changed settings):\\
-The first thing to do is open the TouchOSC Editor. The main page looks like this:
+{{:external_control:remote_control_wifi:touchosceditor_1.jpg?direct&400|}}\\
+\\
-{{:external_control:remote_control_wifi:screen_shot_10-16-18_at_05.18_pm.png?direct&400|}}
+Now we are ready  to create controls. Use the links below to go to the different controls. Just remember that you cannot use the same channel twice with the same value.\\
+\\
-The program will start always with these settings. On the left select the layout you want. In my case I will use the iPad layout as i am using a Samsung Galaxy Tab3. Also I want to use my tablet in landscape so I will set the orientation to horizontal. And because I want to fit my screen in the window I will zoom out the view to 75% so I can see the whole workspace. When done my screen looks like this (highlighted the changed settings):
+[[create faders|Click here]] to learn how to create Faders.\\
+[[create buttons|Click here]] to learn how to create Buttons.\\
-{{:external_control:remote_control_wifi:touchosceditor_1.jpg?direct&400|}}
+[[create multi xy|Click here]] to learn how to create Multi X/Y control(Very nice control to move moving heads manually).\\
+\\
-Now it is time to start making your layout. I will start with a slider. It will control the Red color. Right click on the workspace and select Fader H. A fader will appear in red. You can drag and drop the Fader anywhere. The same can be done for the other colors. I have made Faders for RGBWA and Master intensity. This is the start of the Layout. For easy alignment I used the Grid option.
+Happy designing!\\
+\\
-{{:external_control:remote_control_wifi:screen_shot_10-16-18_at_09.01_pm.png?direct&400|}}
+Feel free to add to the manual.
-{{:external_control:remote_control_wifi:screen_shot_10-16-18_at_09.17_pm.png?direct&100 |}}Okay! We have the Faders, now they need to do something in FreeStyler. The new version has one neat option in the midi comfiguration page and that is the button Learn. You can never go wrong anymore. Anyway, first we are going to make sure the Faders are being given a Midi Channel and values. I want to have the Faders in the range 1-20, so my red Fader will get 1. Select the red Fader. Click on the Midi Tab. Select the Checkbox enabled, leave the rest untouched. You will see extra fields popping up like channel, number and value. For ease of use channel will remain on 1, number will go to 1 and range will remain between 0 and 127. Midi has only 127 values against DMX 255. We will do this also for the other colors, making sure the numbers are all +1, so green gets number 2, blue gets number 3 and so on. Once this is done save the file. It is time to get the Layout in the tablet. Oops, here we go.8-o. We should still have a connection with the tablet, because we need it now.
-In the TouchOSC Editor press Sync. As soon as you get a Popup saying what to do on the tablet it is ready to sync your layout. Open TouchOSC on your tablet OR if it's already open, tap the little white button in the upper righthand corner to go back to the menu. Tap Layout and tap Add from Editor. Fill in the IP address of your computer (or select the host below the Download button) and tap Download.
-{{:external_control:remote_control_wifi:screenshot_20181016-213900.png?direct&400|}}
-You will return to the Layout screen automatically. Select your Layout and tap Done to return to the Layout screen. If everything worked well you should see the Layout as it was on your computer.
-{{:external_control:remote_control_wifi:screenshot_20181016-214109.png?direct&400|}}
-Now it is time to go to FreeStyler and see if we can get some color movement in the program. I have added a flatpar and 4 moving heads as this is the testrig I am using. So open FreeStyler and go to the Midi Setup page in the External Control section. First is red. Scroll down until you find CYAN-Red Channel. Select it and click Learn. Move the Fader on the tablet and the used Midi values will be automatically filled in. Do the same for the other colors and the Master fader (Intensity in FreeStyler). Select the function and move fader. As you are still in the learn function you don't need to press Learn anymore.
-{{:external_control:remote_control_wifi:screen_shot_10-16-18_at_10.00_pm.png?direct&400|}}
-So we have configured TouchOSC and FreeStyler, now we need to know if it works. In FreeStyler select your Fixture(s). Go to Output --> Show Output. As we have only configured the colors yet, the XY values of the movingheads are on 127 (default value). As you can see in below pictures everything is working.
-{{:external_control:remote_control_wifi:screen_shot_10-16-18_at_10.07_pm.png?direct&400|}}
-{{:external_control:remote_control_wifi:screenshot_20181016-220741.png?direct&400|}}
-Okay, we have setup the colors. The same goes for buttons and other fields. Lateron I will explain how buttons need to be setup. Till then good luck.
-As this manual is a work in progress please check later or feel free to help me out.