Skip to content

Timo

Jump to bottom Edit New page
Lieven Hollevoet edited this page Sep 22, 2014 · 1 revision

I want to create a Gui for Misterhouse that runs fullscreen on a Touchscreen. I figured why not make it in Flash. That way it will run on any system capable of running the flashplayer.

I ripped a couple of flash tutorials and code and put this together. For now it's WIP but I would like to make it a customisable frontend for Misterhouse.

Things to do: - Make menu's for lighting, appliances, webcam's and so on. - Make the temp, winddirection stuff better looking. - Update the preloader bit. - Shift things around to get the layout right. - Lot's of other stuff probably ;)

Done: - Make misterhouse pass variables to the GUI through a TCP socket using XML. - Make barometer, temperature, winddirection available on to the main flash screen.

How it works so far: -The flash reads the mainmenu.xml file. That looks like this:

//<icons>// //&lt;icon image=&quot;lights.png&quot; tooltip=&quot;Lights&quot; content=&quot;Placeholder for Lights.&quot;&gt;&lt;/icon&gt&lt;// //&lt;icon image=&quot;&quot; tooltip=&quot;audio&quot; content=&quot;placeholder for audio&quot;&gt;&lt;/icon&gt;// //&lt;icon image=&quot;video.png&quot; tooltip=&quot;video&quot; content=&quot;placeholder for video.&quot;&gt;&lt;/icon&gt;// //&lt;icon image=&quot;&quot; tooltip=&quot;hvac&quot; content=&quot;placeholder for hvac.&quot;&gt;&lt;/icon&gt;// //&lt;icon image=&quot;weather.png&quot; tooltip=&quot;weather&quot; content=&quot;placeholder for weather.&quot;&gt;&lt;/icon&gt;// //&lt;icon image=&quot;appliances.png&quot; tooltip=&quot;appliances&quot; content=&quot;placeholder for appliances.&quot;&gt;&lt;/icon&gt;// //&lt;icon image=&quot;security.png&quot; tooltip=&quot;security&quot; content=&quot;placeholder for security.&quot;&gt;&lt;/icon&gt;// //&lt;icon image=&quot;&quot; tooltip=&quot;camera's&quot; content=&quot;placeholder for camerera's and webcams.&quot;&gt;&lt;/icon&gt;// //&lt;icon image=&quot;&quot; tooltip=&quot;settings&quot; content=&quot;misterhouse settings.&quot;&gt;&lt;/icon&gt;// //</icons&gt;</icons>//

It counts the number of items and sets up the rotating menu for that number. It loads the .png files witch are 128x128 png icon files and also gets the name for the tooltip and the content from the xml.

- The background is just a quicktime loop file converted to flv with the Macromedia flash video converter.

I'm not a programmer. Most things I try to figure out myself using tutorials and manuals on the net. Help is deffinatly needed on this one.

eMail me at Timo at Sariwating.net for questions or if you want to help. I have the fla file available to annyone who wants it. The other files are in http://misterhouse.wikispaces.com/space/filelist (Look for files uploaded by Merdeka)

    • Preview:**
media type="custom" key="19806"
    • UPDATE:**
I have modified voice_server.pl to this code to send out a stream over TCP port 7777. This is the code:

code format="perl"

  1. Category = MisterHouse
my $authorized_1 = 0; my ($password_1, $user_1, $data_1);
  1. $gui_server_1 = new Socket_Item("Connected to MisterHouse GUI Server 1\r\n", 'Welcome', 'server_gui_1');
$gui_server_1 = new Socket_Item("\r\n", 'Welcome', 'server_gui_1'); $timer_disconnect_1 = new Timer;

if (($Reload) && (active $gui_server_1)) { 

    set $gui_server_1 'RELOAD';
    stop $gui_server_1;

}

if (($New_Second) && (active $gui_server_1)) { 

    set $gui_server_1 qq{&lt;variables&gt; &amp;lt;weather temp=&amp;quot;$Weather&amp;#123;TempOutdoor&amp;#125;&amp;quot; wind=&amp;quot;$Weather&amp;#123;WindSpeed&amp;#125;&amp;quot; winddir=&amp;quot;$Weather&amp;#123;WindAvgDir&amp;#125;&amp;quot;&amp;gt;&amp;lt;/weather&amp;gt; &lt;/variables&gt; \x00};

}

if (active_now $gui_server_1) { 

    print_log "Flash GUI connected";
    set $gui_server_1 'Welcome';
    set $timer_disconnect_1 5000, 'disconnect_gui_1';

}

if (inactive_now $gui_server_1) { 

    print_log "Flash GUI closed";
    $authorized_1 = 0;

}

if ($data_1 = said $gui_server_1) { 

    if ($data_1 =~ /Authorization: Basic (\S+)/) {
    set $timer_disconnect_1 0;
        ($user_1, $password_1) = split(':', unpack("u", $1));
        if ($password_1 ne $config_parms{server_gui_1_password}) {
            &amp;disconnect_gui_1;
        }
        else {
            $authorized_1 = 1;
            # set $gui_server_1 "Password authorized";
            set $gui_server_1 " ";
        }
    }

}

sub disconnect_gui_1 {

  1. set $gui_server_1 "Password missing or invalid. Disconnecting.";
    set $gui_server_1 " ";
    sleep 1;
    stop $gui_server_1;

}

&Speak_pre_add_hook(\&speak_to_others_1) if $Reload;

sub speak_to_others_1 { 

    if ((active $gui_server_1) && ($authorized_1 == 1)) {
    my %parms = @_;
    set $gui_server_1 "$parms{text}";
    }

}

&Play_post_add_hook(\&play_to_others_1) if $Reload;

sub play_to_others_1 { 

    if ((active $gui_server_1) && ($authorized_1 == 1)) {
    my %parms = @_;
    set $gui_server_1 "PLAY: $parms{fileplayed}";
    }

}

code

This can probably be done way more better than this. So help if you like. For now it puts out a string like this:

<variables> &lt;weather temp=&quot;8.4&quot; wind=&quot;1.6&quot; winddir=&quot;270&quot;&gt;&lt;/weather&gt; </variables>

I use onXML and XMLsocket to load the vars into actionscript. That way I made the compass showing the winddirection and temperature available on the main flash screen.

    • This isn't implemented live on the wiki preview.**
Has anybody gotten the .fla for this example. I tried emailing the owner but have got no respose. I am interested in creating a Flex based program something like this and would like the files to boot strap my application. Please post here

Main page

Add a custom sidebar
Clone this wiki locally