You are here:   Blog
Register   |  Login

 

Apr 29

Written by: Michael Washington
4/29/2013 10:34 PM  RssIcon

image

ComponentOne allowed me to play with their upcoming Wijmo controls for the Visual Studio LightSwitch HTML Client. The thing that makes them special is that they work as plug-ins in the LightSwitch HTML Client designer and allow you to create custom JavaScript with a click of a button. At the same time they give you full control over the controls as you can easily alter the rendered code.

image

When you install the Wijmo controls, you get screen templates that will automatically wire-up the screens.

image

You simply need to select a template, select your data, then click OK.

image

The screen is created. You can adjust all settings and add additional collections and page elements.

image

When you click the Write Code button you can see the code that has been created for you.

You can adjust this code in any way you need.

image

When you run the application and navigate to the page, the result appears.

image

There is also a Pie Chart screen template, that like the Bar Chart, animates a element when hovered over it and displays the value in a tooltip.

The Grid

image

Implementing the Wijmo Grid could not be any easier. Simply select any collection control…

image

Change it to a Wijmo Collection Control

image

In the Properties for the control, change it to a Grid.

image

Then click the Edit Render Code button.

image

The required JavaScript will be automatically created for you.

You can alter the code as needed. If you mess it up, you simply delete it and click the Edit Render Code button again (if you have any code at all for the particular method, it will not overwrite the code).

image

You have a choice of a page-able grid or an infinite scrolling grid.

image

Of course you can wire-up events as you  would any other LightSwitch control to allow the data to be edited.

Appointments Calendar

image

The Appointments Calendar is one of my favorites.

image

It allows you to display date/time data in various formats.

OLAP Control

image

The control you may find most useful is the OLAP control. Simply point it to a collection (if you need multiple collections you can use a WCF RIA Service).

Your end users can query the data any way they want, eliminating the need to make reports in many situations.

image

It also allows the end user to create charts.

Individual Value Controls

image

There are also a number of value controls:

  • Calendar (wijcalendar)
  • Date Input (HTML5 input, type=date)
  • Date/Time Input (HTML5 input, type=datetime)
  • Linear Gauge (wijlineargauge)
  • Numeric Input (HTML5 input, type=number)
  • Radial Gauge (wijradialgauge)
  • Rating (wijrating)
  • Text Input (HTML5 input, type=text)

Coming Soon…

The ComponentOne Wijmo plug-ins for LightSwitch work fine on my computer, however I do not know when they will be released. Sign up on this site, and as with the previous ComponentOne Visual Studio LightSwitch releases, we will tell you when the product is released in our newsletter.

You can also go to the Wijmo website at:

http://wijmo.com/

(please direct any questions about the controls to the Wijmo Forum – Thank You)

Tags:
Categories:

12 comment(s) so far...


Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

wowwwwwwwwwwwwwww
do i need to buy only the Wijmo ?

my wish dream is Fulfilled.

Thanks a lot micheal !!!!!!!!

By alon on   4/30/2013 4:23 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

This looks amazing. Can't wait to see them in action. This is the stuff that will drive Lightswitch adoption. I hope the other component vendors are paying attention!

By Matt Ireland on   4/30/2013 4:23 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

Michael,

Great Featured Demo. Grid and Scheduler are Highlights.. Thanks to Component One for their Great support to Light Switch.

Regards
Rama Dwarapudi

By Rama on   4/30/2013 4:23 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

I hope they are released as soon as possible. What does the grid look like ? Does it feature everything the wijmo wijgrid can do like grouping and aggregates ?

it definitely could be a gamechanger for the HTML Client and the adoption of LS overall because it would enable the rapid development of fully cross plattform and mobile business intelligence apps for example. I hope there are more extensions and plugins in the pipeline.

And finally, not using silverlight or another plugin, Companies will have little arguments turning down LS in general.

By henn on   4/30/2013 6:07 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

@henn - Please direct any questions to the Wijmo Forums (http://wijmo.com/forums) because those features may be in the final product or I simply didn't find them.

By Michael Washington on   4/30/2013 6:10 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

Error-free JavaScript that I don't have to write is just so huge. Thanks for sharing.

By Richard Waddell on   4/30/2013 3:52 PM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

Hi Michael;

OK, Component-One is doing something, which is great. Thanks to them.
But, how can we add this kind of components to the VSLS Environment?
If it could be easy for folks, we can see hundreds of components/schemes on the shelf soon.

Regards,
Mehmet D.

By Mehmet Demirbilek on   5/1/2013 1:50 PM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

Hello guys,

I am the Product Manager for ComponentOne's LightSwitch products and thought I would weigh in. First of all, thanks for all the positive comments. They are really encouraging.

Let me give some detail and clarification....

ComponentOne makes a popular line of jQuery widgets called Wijmo. We have packaged some of those into LightSwitch extensions that can plug in and generate javascript for you. While you can use Wijmo as it is, the LightSwitch version is much more powerful and easy to use for this purpose. If is very likely that the final product won't be called Wijmo at all since it belongs in our Studio line of products.

We will have a Beta very soon and a full release comes in mid-June. Please, feel free to contact me if you want to stay up to date on the news, want to ask questions, or have comments. I can be found at danb@componentone.com.

Thanks
Dan

By Dan Beall on   5/2/2013 6:12 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

Can't wait for the beta! Thanks for the update on the timeline. I hope they will make the LS HTML Client a fully viable option for building LOB applications that can also target desktops (which is where 90% of those applications would run anyway)

By henn on   5/2/2013 9:14 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

wonder if Wijmo has full support of "RTL" like we had in silverlight ?

By alon on   5/3/2013 5:01 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

awesome

By abuhelweh on   6/22/2013 9:05 AM
Gravatar

Re: Sneak Peek: Wijmo Creates Custom JavaScript In LightSwitch HTML Client

Just wanted to let everybody know that we have released Studio for LightSwitch HTML (powered by Wijmo). Actually, the readers of this blog are the first to know. We will tell the world next week.

See the site here: http://www.componentone.com/SuperProducts/LightSwitchHTML/

By DanBeall on   7/12/2013 9:13 AM

Your name:
Gravatar Preview
Your email:
(Optional) Email used only to show Gravatar.
Your website:
Title:
Comment:
Security Code
CAPTCHA image
Enter the code shown above in the box below
Add Comment   Cancel 
Microsoft Visual Studio is a registered trademark of Microsoft Corporation / LightSwitch is a registered trademark of Microsoft Corporation