Release Candidate #1

Topics related to the new MainLobby Web Designer software for Android and iOS devices.
User avatar
CinemarDave
Site Admin
Site Admin
Posts: 10533
Joined: Fri Feb 07, 2003 8:56 am
Location: Planet Earth
Contact:

Release Candidate #1

Postby CinemarDave » Wed Jan 30, 2013 6:02 pm

After a long phase of development and testing we are ready to release the latest version of the Web Designer. This version has seen a tremendous number of changes and while no software is ever done we are considering this version as our first Release Candidate. Moving from Beta to Release Candidate phase means the software is feature complete and just needs additional testing.

What's new in this release.

(Global changes)
1) MLServer's built in web servers were completely re-written. We previously were using a third party web server control. The new web server's have been written using the native .NET components. The new web servers now have compression turned on and transfer data to the clients about 300% faster using one third of the previous bandwidth. These are significant improvements but difficult to measure in the real world because of the small size of the web app pages. However, you should be seeing better performance overall.

2) Communication from the web app to the server and back has been switched from XML to the more industry standard JSON.

3) The MLServer web sockets server has also been updated to support the current web sockets standards.

4) If your tablet or phone is capable of using web sockets then you can now take advantage of the new MLServer WebCmd command. Similar to MainLobby's MLCmd the new WebCmd can be used to send client commands using a MLServer command. Any valid client command can be used. For example sending a changescene command to a web client looks like WebCmd|LoadScene|index.html. Since this is a MLServer command you are free to use server variables where appropriate. Currently all iOS devices, current generation Kindles and Android devices running Android 4.1 support web sockets.

5) The formulas that are used to calculate gradients have all been normalized. Prior to this release different formulas were used and this resulted in inconsistent looks between objects.

6) The restriction that only one instance of a MLServer variable can be used on a page has been removed. There is now no limit to how many times the same variable can be used on a page. (THIS HAS A SIGNIFICANT IMPACT ON ANY EXISTING PAGES YOU HAVE ALREADY CREATED. MORE ABOUT THIS LATER.)

7) The JQuery files have been updated to the latest release.

8) The core JavaScript routines in the Scripts.js file have been reworked to support the new functions and features.

9) To accommodate users that do not want to maintain the default file naming conventions for the html files a new JavaScript file called Custom.js has been added to the allow for different file names. The hard coded file names in the Scripts.js file have been moved to the Custom.js file and are exposed as JavaScript variables. If you want to use different file names all you have to do is edit this file in notepad and make the appropriate file name changes.

10) The "FastClick" JavaScript library has been implemented in the core scripts. This should help eliminate the 400ms delay inherent when pressing the objects on screen.

Additionally each of the insertable objects have seen significant changes. The more significant changes to each object are outlined below.

Panel Object
1) Gradients now uses the new formula
2) Panel corners can now be adjusted in pixel increments. It is possible to create round panels.

Text (Label) Object
1) Labels can now be rotated a full 360 degrees.
Label-Properties.png


Image Object
1) (new) Opacity Variable - you can define a server variable that can be used to set the opacity of the image. The variable should range from 0 to 100. A sample use for this would be to add a glow to a light that reflects the lights level.
2) (new) Reload - when you enable this option the image will automatically be refreshed at about 1.5 second intervals when displayed on a page.
3) (updated) Click Object - When you enter the name of a object ID here that object will receive the red glow ring when you click the image.
4) (new) Rotate When On - when the state variable associated with the image is in an On state the image will rotate on the screen approximately 10 degrees every 200 milliseconds or about 8 rpm.
5) (new) On Image - you can swap a different image when the state variable is On.
6) (new) Off Image - you can swap a different image when the state variable is Off. These come in pairs. You need to specify both On and Off images if you want to use this feature.
Image-Properties.png


Button Object
1) (updated) - corner radius can be adjusted in pixel increments. It is possible to create round buttons.
2) (updated) - gradient uses the new formula.
3) (new) Rotation - Buttons can be rotated a full 360 degrees.
4) (updated) Click Object - When you enter the name of a object ID here that object will receive the red glow ring when you click the button.
5) (updated) Icons - new icons from the Transport font appear in the font drop down.
6) (new) On Background - you can set the background color of the button when the state variable is on.
7) (new) Off Background - you can set the background color of the button when the state variable is off. These come in pairs. You need to specify both On and Off colors if you want to use this feature.
Button-Properties.png


Vertical Slider Object
1) (updated) - Corners can be set at 1 pixel increments
2) (updated) - gradients use the new formula

Horizontal Progress Bar Object
1) (updated) - corners can be set at 1 pixel increments
2) (updated) - gradients use the new formula

Generic Progress Bar Object
1) (updated) - gradients use the new formula

Toggle Button object
No changes - consider using the background On,Off feature of the button object until this object gets rewritten.

Movie Browser Object
1) (updated) - A/Z corners can be set at 1 pixel increments
2) (updated) - A/Z gradients use the new formula
3) (new) - Option to include / exclude movie titles

Music Browser Object
1) (updated) - A/Z corners can be set at 1 pixel increments
2) (updated) - A/Z gradients use the new formula
3) (new) - Option to include / Artist and Album names

Netflix Browser Object
1) (updated) - A/Z corners can be set at 1 pixel increments
2) (updated) - A/Z gradients use the new formula
3) (new) - Option to include / exclude movie titles

Scroller Object
1) (updated) - visible scroll bar has new styling and will automatically disappear after a few seconds.
Scroller.jpg


Video Object
1) (update) - underlying html is fully HTML 5 compliant

Gauge Object
1) (update) - new dial graphic and needle images.

Calendar Object
No changes

Infinite Scroll Object
1) (update) - significant changes to the underlying JavaScript. However is still remains an advanced control that required knowledge of SQL queries and HTML syntax. This object is still in development. If you would like to use this object please contact us and we can work with you on the solution.

Carousel Object (NEW)
1) (new) - This object can be used to build horizontal or vertical scrolling objects. Menus, images browsers. Lots off possibilities. Like the infinite scroll object the carousel supports a virtual infinite scroll. For example you could build a carousel of movie thumbnails that automatically load new images as the user scrolls. Like the Infinite scroll this object is still in development and should be considered an advanced object that requires SQL and HTML knowledge. We can work with you if you want to use this object.

Web Page Object (NEW)
1) (new) Like WebLobby you can now embed an external web page on your scenes. Web pages are loaded in an IFrame object. Not all web sites like being loaded in an IFrame but this should work fine for all normal uses.

WHAT ABOUT THE EXISTING SCENES YOU HAVE CREATED?

A lot of effort has gone into trying to automatically covert the older HTML code into the new format supported by this release. It will be easier to start with the new versions of the sample apps but the designer will convert your old scene HTML code to the new format and be 95% successful.

To convert your old scenes to the new format you will have to do the following for each page.
1) Open the scene and after it finishes loading immediately press the Save button.
2) Then for each Button object on the page do the following
a) Re-select the button background color
b) Re-select the label font color
c) Press the Update Button.
3) Then for each Text label on the page do the following
a) Re-select the label font color
b) Press the Update button.
4) Then for each Panel on the page do the following
a) Re-select the panel background color
b) Press the Update Button.
5) Then for all other object on the page
a) edit the object and press its Update button
6) Edit each .html file that is not an overlay and insert the following line just BEFORE the scripts.js line

Code: Select all

<script src="javascript/Custom.js" type="text/javascript"></script>


This seems like a lot but it really doesn't take that long. I converted the sample iPad app using this method. The only place where you will see some issues is that there are some times you will lose the server state variable associated with the object if one was previously being used.

CAVEATS

This new version has gone through a considerable amount of testing. We have used the designer on two different customer's designs and it is working well. However, there is probably still some bugs lurking in there and there are still some objects to be enhanced. The designer has seen over 12,000 lines of code modified from the last release so you can see many, many things have changed. It is strongly suggested that you sample the new apps before starting on the migration of your existing scenes. By all means DO NOT immediately press the refresh button on your existing scenes before you are ready to dive in with making ALL the changes. If you just press Refresh without editing all your old scenes all of the old scenes WILL STOP WORKING properly. Caveat Emptor.

The next post will talk about the new sample apps. The new release will appear in the Installation Assistant just after a bit more testing.
You do not have the required permissions to view the files attached to this post.

User avatar
CinemarDave
Site Admin
Site Admin
Posts: 10533
Joined: Fri Feb 07, 2003 8:56 am
Location: Planet Earth
Contact:

Re: Release Candidate #1

Postby CinemarDave » Wed Jan 30, 2013 6:28 pm

The sample apps have been totally reworked too. The only distinction between what we call the iPad and Android version is the target screen size. All of the html and JavaScript code is identical in either version. Thankfully, there are some Internet standards out there. There is absolutely no support for Internet Explorer or Windows Phone. Microsoft does some really crazy non-standard things in their web browsers and supporting them would only cause an overall performance hit.

The following images show some of the scenes from the new web apps. There is now a very consistent style across all pages. Sample pages are there for all the media apps and major Family categories. These should give you a great starting point for your own scene development. Of course you can just run with these.

HomePage.jpg


Movies.jpg


MovieDetails.jpg


Music.jpg


MusicDetails.jpg


Netflix.jpg


Pandora.jpg


InternetRadio.jpg


SatRadio.jpg


Recipes.jpg


RecipeDetails.jpg


Weather.jpg


Pollen.jpg


WeatherRadar.jpg


WeatherMaps.jpg


RSS.jpg


FloorPlan.jpg


Environment.jpg


Energy.jpg


Cameras.jpg


About.jpg
You do not have the required permissions to view the files attached to this post.

sonypoolplr
Is there life beyond Cinemar?
Is there life beyond Cinemar?
Posts: 1490
Joined: Fri Mar 26, 2004 8:48 am
Location: New Jersey
Contact:

Re: Release Candidate #1

Postby sonypoolplr » Wed Jan 30, 2013 6:40 pm

This looks great. If I just want to use the designer to redo my scenes without upgrading the old ones, can I open the old scenes up and as long as I don't hit "Refresh" will they stay operational while I build new scenes? I would probably only want to open the old ones if I added some custom commands.

chiphayes
Member
Member
Posts: 62
Joined: Mon Sep 25, 2006 8:33 pm
Location: Charlottesville, VA
Contact:

Re: Release Candidate #1

Postby chiphayes » Wed Jan 30, 2013 6:42 pm

Wow... just, wow.

Gonna be a busy boy for a few days...

Looks fantastic, Dave! Congrats.
Last edited by chiphayes on Wed Jan 30, 2013 8:19 pm, edited 2 times in total.

User avatar
CinemarDave
Site Admin
Site Admin
Posts: 10533
Joined: Fri Feb 07, 2003 8:56 am
Location: Planet Earth
Contact:

Re: Release Candidate #1

Postby CinemarDave » Wed Jan 30, 2013 6:46 pm

Your old scenes will continue to work fine as long as you DO NOT hit the refresh button. Just leave them as version 1 of the development and then begin on V2. If you hit refresh then you are forced to go down the path of editing each and every page.

This also means that you CANNOT EDIT any of your old scenes WITHOUT pressing refresh. This is because as soon as you press save the old html is converted into the new format. And the new format requires the refreshed files. Catch-22. It is all or nothing on the older scenes.

chiphayes
Member
Member
Posts: 62
Joined: Mon Sep 25, 2006 8:33 pm
Location: Charlottesville, VA
Contact:

Re: Release Candidate #1

Postby chiphayes » Wed Jan 30, 2013 8:20 pm

Dave...

Not that you haven't done an amazing amount of work already, but...

In some post somewhere you mentioned already integrating the HTML5 video player into your code. How far away are we from being able to have DVDLobby open up a video window and playing a movie on a tablet?

kgingerich
Intermediate
Intermediate
Posts: 312
Joined: Sun Jan 21, 2007 9:11 am
Contact:

Re: Release Candidate #1

Postby kgingerich » Wed Jan 30, 2013 8:52 pm

looks pretty sweet. I've been sitting back watching it's development but haven't used it yet... looks like now is the time.

However, I don't see it in the installation assistant... where do I download it?

User avatar
CinemarDave
Site Admin
Site Admin
Posts: 10533
Joined: Fri Feb 07, 2003 8:56 am
Location: Planet Earth
Contact:

Re: Release Candidate #1

Postby CinemarDave » Wed Jan 30, 2013 9:45 pm

Chip , if your video is tablet friendly then you can use the Video object to play the movie full screen.

Kyle, I did not release it. I found one more thing this evening that I am fixing right now. I'll post a message here as soon as it is uploaded.

User avatar
CinemarDave
Site Admin
Site Admin
Posts: 10533
Joined: Fri Feb 07, 2003 8:56 am
Location: Planet Earth
Contact:

Re: Release Candidate #1

Postby CinemarDave » Thu Jan 31, 2013 12:51 pm

Check the Installation Assistant. The new Designer and Sample apps are ready to download. I've gone blind testing these things. Tell me what I missed. And more importantly show us what you come up with. I think we have the most comprehensive and user friendly User Interface design tool for mobile devices on the market. Hands down. But then again I'm biased.

EUROTECH
Senior Member
Senior Member
Posts: 229
Joined: Mon Aug 01, 2011 6:10 pm
Location: New Jersey
Contact:

Re: Release Candidate #1

Postby EUROTECH » Thu Jan 31, 2013 2:38 pm

All this good stuff going on and i'm at work :cry:

Reading up on what you posted on adapting our older scenes, can we create new scenes with the new designer and copy/paste our "design" layouts from the older scenes and make further adjustments from there?

Thanks for all the good stuff. Looking forward to messing around with the carousel item.

Euro.

chiphayes
Member
Member
Posts: 62
Joined: Mon Sep 25, 2006 8:33 pm
Location: Charlottesville, VA
Contact:

Re: Release Candidate #1

Postby chiphayes » Thu Jan 31, 2013 3:01 pm

Dave...

FYI, for your templates drop down, the following are all the Kindles' full screen resolutions (I had to re-size my Kindle project when the 960 x 600 you have now left me with some extra real estate at the bottom in full screen mode.)

Kindle Fire (first and second gen) = 1024 x 600
Kindle Fire HD 7" = 1280 x 800
Kindle Fire HD 8.9" = 1920 x 1200

greyt
Intermediate
Intermediate
Posts: 448
Joined: Mon Jul 04, 2005 7:26 am
Contact:

Re: Release Candidate #1

Postby greyt » Thu Jan 31, 2013 3:37 pm

Looks really good Dave, and the response times are really good with the new code when running on an Ipad. It is obvious to see a huge amount of work has gone into this.

Comments so far :-

If you use a variable with the char ] then lots of the other variables stop updating, Homeseer is a pain with the non friendly html chars it uses. May be worth trapping these if they are attempted to be entered

There is something weird going on after the properties page of an object has been dragged to the left of the screen. It can disappear seemingly at random when moving the mouse or when clicking

Sliders still can't be in an overlay - the slider will always be shown on the base scene before the overlay is loaded.

Horizontal slider would be nice. Is it possible to cheat and rotate a vertical slider or have I over simplified it?

User avatar
CinemarDave
Site Admin
Site Admin
Posts: 10533
Joined: Fri Feb 07, 2003 8:56 am
Location: Planet Earth
Contact:

Re: Release Candidate #1

Postby CinemarDave » Thu Jan 31, 2013 3:46 pm

HomeSeer server variables are a nightmare to deal with. Bob Maslen has updated his HomeSeer plugin to create web friendly server variables. The same thing should be done to Krumpy's version. Without the update any Homeseer variable with non-alpha or numeric characters is guaranteed to break things.

If you see other strange things always check the Events button to see if an error message is shown.

Sliders can be on an overlay. Set them as hidden and then on the button the does a Show|Overlay make it a macro and also do a Show|volumeslider

A horizontal version of the slider is in the works. I did not want to delay this release any longer.

User avatar
CinemarDave
Site Admin
Site Admin
Posts: 10533
Joined: Fri Feb 07, 2003 8:56 am
Location: Planet Earth
Contact:

Re: Release Candidate #1

Postby CinemarDave » Thu Jan 31, 2013 3:48 pm

Euro - you can do the copy and paste trick but there is a high probability that you will not get state variables picked up as part of the copy and paste operation.

greyt
Intermediate
Intermediate
Posts: 448
Joined: Mon Jul 04, 2005 7:26 am
Contact:

Re: Release Candidate #1

Postby greyt » Thu Jan 31, 2013 4:17 pm

CinemarDave wrote:HomeSeer server variables are a nightmare to deal with. Bob Maslen has updated his HomeSeer plugin to create web friendly server variables. The same thing should be done to Krumpy's version. Without the update any Homeseer variable with non-alpha or numeric characters is guaranteed to break things.

If you see other strange things always check the Events button to see if an error message is shown.

Sliders can be on an overlay. Set them as hidden and then on the button the does a Show|Overlay make it a macro and also do a Show|volumeslider

A horizontal version of the slider is in the works. I did not want to delay this release any longer.


Bob's plugin has a couple of issues as well, but I am just using automation rules to convert Homeseer non compliant values into values that are HTML compliant. It just threw me for a few mins when all my updates stopped working and I realised I pasted a non compliant variable in.....

Sliders - sounds good I will give this a go tonight. I assume this means there can only be one overlay with sliders in a scene otherwise all sliders from all overlays will show?


Return to “MainLobby Web Designer (V5)”

Who is online

Users browsing this forum: No registered users and 1 guest