Open Hybrid

Arduino Yun Example

Sensor, LED, AR Slider

 

For this example, you will create a hybrid object by assigning a marker image to your object and uploading a sketch to your Arduino. For this example, you will create a new interface. You can find more information on how to assign a new interface to your hybrid object here. Once your object is created, you can virtually change the brightness of the LED and link the Arduino’s sensor to the led and see the physical object react. Once the link is created, the LED on your Arduino will light up when the sensor is touched. When the virtual IO link between your sensor and LED is cut, the led will no longer respond the the sensor.

 

​

 

 

Needed Components

 

 

 

Circuit

Connect the long leg of the LED to the 220 Ohm resistor. Plug the short leg from the LED in to GND and the other side of the resistor in to pin 13.

 

Connect one side of the force sensor to 5V and the other side to the 10K Ohm resistor and the A0 input. Connect the other side of the 10K Ohm resistor to GND.

 

 

 

 

 

 

 

 

 

 

 

 

Hybrid Object

Target

 

Follow these guidelines for creating your object and adding a target image. This marker or target allows the computer vision software to correctly identify your object. Each object that you create needs to have a unique target attached to it. An appropriate target image is one with many edges and without repeating patterns. You can use the image on the right as your target image or just any image you like or photo of surfaces that you like.

 

You can also find more prepared targets in the Library File. You can also use hrqr.org to generate targets easily.

 

 

 

 

 

 

 

 

 

 

 

Arduino

 

/*created 2015by Valentin Heun*/ #include <HybridObject.h>HybridObject obj; void setup() {    obj.developer(); // allow developer tools    obj.add("slider", "led"); // add a new I/O Point    obj.add("slider", "sensor");} void loop() {     // Read from sensor    float reading = obj.map(analogRead(A0), 0, 940);     // Write to Object    obj.write("slider", "sensor", reading);     // Read from Object    analogWrite(13, obj.read("slider", "led") * 255);     delay(30);}Once your target is uploaded, you can now point your device at the target image and see that there is already a starting page.  However, in order to reprogram and interact with your hybrid object, you must first link you Arduino with your interface by generating IO-Points and

send data from the Arduino to these IO-Points. The sketch on the right side is doing this job.

 

You can find a more detailed explanation for this sketch here.

 

A general detailed explanation for all functions can be found in the reference.

 

 

 

 

 

 

 

 

 

 

 

Web

 

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Slider</title>    <script src="object.js"></script>    <script src="objectIO.js"></script>    <script src="/socket.io/socket.io.js"></script>    <style>     input[type=range] {            background-color: transparent;            -webkit-appearance: none;      }      input[type=range]::-webkit-slider-runnable-track {            -webkit-appearance: none;            height: 68px;            background-color: rgba(255, 255, 255, 0);            -webkit-backdrop-filter: blur(4px);            border: solid 4px #00edff;            border-radius: 8px;            padding: 5px;     }      input[type=range]::-webkit-slider-thumb {            -webkit-appearance: none;            border: none;            height: 50px;            width: 50px;            border-radius: 2px;            background: #00edff;     }      .range-slider input[type="range"]:after {            height: 2px;            background: #fff;            content: ' ';            width: 5px;            top: 50%;            margin-top: -1px;            left: -5px;            z-index: 1;            position: absolute;     }      input[type=range]:focus {            outline: none;        }    </style></head><body>    <input id="slider" type="range" value="0" min="0"    max="255" style="width:250px"><script>     var obj = new HybridObject();    var slider = document.getElementById('slider');    var touchState = false;     document.addEventListener("touchstart",function(e) {        touchState = true;    }, false);    document.addEventListener("touchend", function (e) {        touchState = false;    }, false);      obj.addReadListener("led", function(e){        if (!touchState)            slider.value = e*255;     });     slider.addEventListener("input", function () {        obj.write("led",  slider.value / 255);    }, false);</script></body></html>Now it is time to add an interface. You can find all the information you need to add an interface to your hybrid object here. Be sure to title your file index.html. A detailed explanation for all JavaScript functions can be found in the reference.

 

Additionally, you will have to drag and drop the object.js file along with this objectIO.js file to the “Add Interfaces” page. you will find both files in the sensorAndSlider example folder.