Results 1 to 10 of 18

Thread: Tutorial - IR Codes on Webpage

Threaded View

  1. #1
    Join Date
    Jan 1998
    Location
    Jupiter, FL
    Posts
    13,541

    Default Tutorial - IR Codes on Webpage

    Guys, I'm working on putting together a new tutorial, this might become a video. Please give feedback on things that are not clear or improvements...

    How to make a virtual remote with Girder 5 Pro/WHP

    This tutorial will show you how to create a virtual remote using Girder 5 Pro. We will build this using the PIR-1 (you can also use an USB-UIRT) and
    the built in webserver. This will allow you to send the IR codes from an internet enabled device.

    You'll learn from the tutorial:


    • how to enable plugins.
    • how to use the IR Profile editor
    • how to use the built-in webserver.



    1. Starting Girder


    First lets start Girder and enable our hardware.

    * File -> Settings -> Plugins
    * Find the PIR-1 plugin and enable it.
    * Find the webserver plugin and enable it.
    * File -> Component Manager -> Installed Component
    * Find the PIR-1 component and enable it.

    2. Learning IR codes - IR Profile Editor

    Open the IR profile editor


    • View -> IR Profile Editor


    Start the IR Profile Wizard by clicking it's button:


    • IR Profile Wizard


    Pick or create a new Manufacturer for your device. I'm createing a profile for my SqueezeBox so I pick Logitec.

    Then next I pick Generic Media Player as the device type. Next we'll actually learn all the code we want to use. You can skip codes
    you don't need and later you can add codes that were not in this list. Once all is learned we just need to setup the output device. Pick the PIR-1 and either front or back output. The back output requires a stick on ir emitter.

    Once you close the Wizard you should see a new Manufacturer, Device and Codes in the profile Editor.

    3. Using the button in the Device Manager

    There are two ways to go no. The automatic way using the Device Manager pages in the webserver. This gives you a predefined look and feel with all the
    buttons you just created on screen. Nothing else to do but use it.

    If you however are more creative and want to design your own look here is how to go about it.

    4. Creating your own web page

    I've created an example webpage called dm_example.html. If you open it up you'll find some javascript at the top. Don't mess with it unless you know what you are
    doing. The HTML section you can freely modify.

    If you look at the example you'll see buttons like this:

    <button class="autoButton" alt="chrome\IR Profiles\2\Power" val="1">Power</button>

    The important part of this line at the class, alt and val parameters. The class parameter must include the "autoButton". This is used to find buttons that will hook into the Device Manager. The alt parameter is the path of the control. You can find this in the device manager. The val is the value the control should be set to. For this tutorial leave this value at 1.

    You can add as many buttons as you like with any path and values you want to use. (Thus you can control other items as well!)

    5. Finding the control paths

    Open the Settings Window ( file -> Settings )
    Click on device Manager, find your newly added IR device in the list (for me it was \Home\SqueezeBox)
    Underneat the dropdown box you'll see the path displayed. This is the path up to the device, we'll need to add the control to it.

    for example: chrome\IR Profiles\3

    The controls are listed in the box below it, so copy the name of the control as well, for example "Power"

    The full path would then be chrome\IR Profiles\3\Power
    Attached Files Attached Files
    Ron
    No support through PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •