Telerik JustMock received many new features in the service pack for the Q3 2011 release, enhancing the mocking framework’s impressive ability to mock almost everything. Let’s take a look at a few highlights of JustMock Q3 2011 SP.

Mock Inside a Threadpool

Mock objects can be accessed inside of another thread and work as expected.

var mockable = Mock.Create<Mockable>();
Mock.Arrange(() => mockable.IsMocked).Returns(true);

bool mocked = false;

var latch = new WaitLatch();

ThreadPool.QueueUserWorkItem(cookie =>
{
    try
    {
        mocked = mockable.IsMocked;
    }
    finally
    {
        latch.Signal();
    }
});

latch.Wait();

Assert.IsTrue(mocked);

The callback for ThreadPool.QueueUserWorkItem accesses the mock object, and the expected value is returned.

 

Asserting Occurrence in Extension Method

You can now ensure occurrences for extension methods to your mocked objects.

var sequence = Mock.Create<IEnumerable<int>>();

Mock.Arrange(() => sequence.First()).Returns(1).OccursOnce();

int result = sequence.First();

Assert.AreEqual(1, result);
Mock.Assert(sequence);

In this example, sequence.First() is only called once, passing the test.

IgnoreInstance in Fluent Extensions

Mehfuz Hossain’s article on Future Mocking with IgnoreInstance describes this feature added in JustMock Q3 2011, but you may have noticed he didn’t use the Fluent API. It is now present in these extensions, so the example in the original blog post can be written as follows:

var fakeUsed = Mock.Create<UsedClass>();

fakeUsed.Arrange(mock => mock.ReturnFive()).Returns(7).IgnoreInstance();
             
Assert.AreEqual(7, fakeUsed.ReturnFive());

Assert.AreEqual(7, new UsedClass().ReturnFive());

Whichever style you prefer, mocking tightly coupled class is simple with JustMock.

Invoke Call with Expression Argument with Dynamic Value

This feature gives you granular control over an arrangement utilizing a lambda expression.

var repository = Mock.Create<IBookRepository>();
var service = new BookService(repository);

var expected = new Book { Title = "Adventures" };

Mock.Arrange(() => repository.GetWhere(book => book.Id == 1))
    .Returns(expected)
    .MustBeCalled();

var actual = service.GetSingleBook(1);

Assert.AreEqual(actual.Title, expected.Title);

In this example, service.GetSingleBook(1) is calling its dependent repository with the expression: book => book.Id == id. The parameter ‘id’ is a dynamic value.

public class BookService
{
    private IBookRepository repository;

    public BookService(IBookRepository repository)
    {
        this.repository = repository;
    }

    public Book GetSingleBook(int id)
    {
        return repository.GetWhere(book => book.Id == id);
    }
}

JustMock will now match book.Id == 1 to book.Id == id when id is equal to one. The expression must match value types. For example, book.Id > 0 will never be called by service.GetSingleBook(1).

 

Better Access to Documentation

The Getting Started Guide and example projects are now found in the start menu under Telerik | JustMock.

These resources can help you find the solution to nearly any mocking scenario. The Getting Started Guide is the bulk of the English documentation. However, we view tests as documentation as well. That’s why the example projects provide a hands-on approach, unit testing JustMock itself.

The documentation is also available in Help3 for download in a separate ZIP file.

What’s Coming?

Our Q1 2012 Webinars are just around the corner. If you attend the What’s New in Tools for Better Code webinar, you can see live demos of the features mentioned in this blog post and much, much, more. One lucky winner from the Just* webinar will receive a Telerik Ultimate Collection worth $1999. More importantly, you will sharpen your ninja skills to write better code!

 

As a response to your constant requests for sample projects demonstrating the best practices of using OpenAccess ORM in web projects, we have released some of the new and updated samples before Q1 2012 so that you can benefit from them immediately.

 

MVC developers will be happy to know that along with the MVC 2 example “MVC Forum”, we are now offering two solutions demonstrating MVC 3 usage with Fluent API or an .rlinq Domain Model – whichever approach you prefer. In addition, you can see an implementation using the Razor view engine as an alternative of the default one. Find the samples in our new ASP.NET MVC category.

 

We have revised the best practice examples for ASP.NET applications and they are now merged into one sample solution, called Managing OpenAccess Context. There you can see three different approaches for managing your context – storing it in the Master page, in the HttpContext or implementing an HttpModule for it. We appreciate your feedback – which approach do you like the most and why?

 

To provide the RAD developers among you some insight on LINQ-based data binding with OpenAccess ORM, we have updated most of the old OQL-based OpenAccessDataSource samples to use the new OpenAccessLinqDataSource instead. Check out the Hierarchical RadGrid, Self-Referencing with RadTreeView, Cascading Delete and CRUD Operation samples, all under the ASP.NET category.

 

Get the latest build (2011.3.1320) of the OpenAccess SDK from the download page now and speed up the integration of OpenAccess in your solution! Feel free to provide any feedback or to request new samples according to your needs.

As part of the Telerik “Q1.2012 Beta” package for Windows Phone we are releasing a new set of "Application Building Blocks" components. You can find more info on the idea of Application Building Blocks here. Among these components is RadDiagnostics.

Overview

RadDiagnostcs component will enable you to receive crash reports, get specific debug and run-time information from your end users when an issue (ApplicationUnhandledException) in your application is encountered. When an exception occurs, a MessageBox dialog is displayed and users are asked to report the diagnostics data. The collected data contains rich information about the exception, device and runtime info. Optionally a screenshot of the current application state can be provided. Developers can also add custom data when an exception has occurred and to collect runtime logs.

We are already using this component in Telerik “Tasks” application for WindowsPhone and it has proved to be a very valuable helper in debugging and resolving application issues. I strongly recommend you to add such an error reporting component to all of your applications.

Here is how the default user experience for the end users looks like:

When users click on the “Yes” button they will be able to send an email message pre-filled with all the data collected from RadDiagnostics.
This is the default user experience. Developers can customize the displayed message and also have an option to skip the message, to get the data and to send it automatically to their own web service for analyzing (this requires additional development and is not provided out of the box).

The usage of the control is quite simple and intuitive:

RadDiagnostics diagnostics = new RadDiagnostics(); diagnostics.EmailTo = “myemail@mail.com”; diagnostics.Init();

This initialization code should be added in the App constructor.

To create a custom action and to get notified when an exception has occurred, you can subscribe to the ExceptionOccured event:

radDiagnostics.ExceptionOccurred += new EventHandler<ExceptionOccurredEventArgs>(RadDiagnostics_ExceptionOccurred); private void RadDiagnostics_ExceptionOccurred(object sender, ExceptionOccurredEventArgs e)  {   //e.Cancel = true; setting Cancel to true will prevent the message box from displaying.       // add any custom code here, like reporting to a custom web service   //SendDiagnosticsToWebService((sender as RadDiagnostics).DiagnosticInfo);  } Diagnostic Data

You are maybe now curious to see what data you will receive when an error is encountered. Here is a sample error report:

[StackTrace]:[ 
Navigation is not allowed when the task is not in the foreground. Error: -2147220990
   at Microsoft.Phone.Scheduler.SystemNotificationInterop.CheckHr(Int32 hr)
   at Microsoft.Phone.Scheduler.SystemNotificationInterop.CreateNotification(ScheduledAction action)
   at Microsoft.Phone.Scheduler.ScheduledActionService.Add(ScheduledAction action)
   at Telerik.WindowsPhone.Tasks.ApplicationHelpers.ScheduleMasterTileUpdateAgent()
   at Telerik.WindowsPhone.Tasks.App.Application_Launching(Object sender, LaunchingEventArgs e)
   at Microsoft.Phone.Shell.PhoneApplicationService.FireLaunching()
   at Microsoft.Phone.Execution.NativeEmInterop.FireOnLaunching()
]
[OccurrenceDate]:[Tue, 31 Jan 2012 12:41:48 GMT]
[AppInstallDate]:[Sun, 29 Jan 2012 19:00:42 GMT]
[AppTotalRuns]:[4]
[AppRunsAfterLastUpdate]:[4]
[AppPreviousRunDate]:[1/29/2012 2:01:54 PM]
[AppVersion]:[1.33]
[Culture]:[en-US]
[CurrentPageSource]:[/Views/SyncProvidersList.xaml?SyncProviderId=1]
[NavigationStack]:[/Views/MainPage.xaml]
[DeviceManufacturer]:[HTC]
[DeviceModel]:[mwp6985]
[DeviceHardwareVersion]:[0003]
[DeviceFirmwareVersion]:[2305.13.20104.605]
[OSVersion]:[Microsoft Windows CE 7.10.7720]
[CLRVersion]:[3.7.11140.0]
[DeviceType]:[Device]
[NetworkType]:[Wireless80211]
[DeviceTotalMemory(Mb)]:[475.375]
[AppPeakMemoryUsage(Mb)]:[4.828125]
[AppCurrentMemoryUsage(Mb)]:[4.828125]
[IsoStorageAvailableSpace(Mb)]:[2909]

As you can see we are collecting a lot of data which will be useful for you when debugging the problem. If this is not sufficient enough RadDiagnostics can be used as a simple logger to collect any runtime info you are providing. Here is a simple usage of the logging feature:

radDiagnostics.AddDebugInfo(String.Format("filterData = {0}", filterDate));

In order to keep the performance of your application high logs will contain only the last 1Mb of data. Please keep this in mind when using this feature.

Another cool feature (and my favorite one I must admit :)) of RadDiagnostics is how the mail Subject is composed. Apart from the obvious info – ApplicationName and ApplicationVersion – it contains the Hashcode of the Stack Trace!!! This allows you to group the mails you receive and see which error is occurring most often – thus seeing the top priority issues.

Here is how my inbox looks like for the Tasks application crash reports:

I hope that this component will be very useful for you as it is for us in Tasks application. Please give it a try during the beta period and let us know if you have suggestions for enhancements.

You can also find me on twitter @valiostoychev  – I’ll be happy to discuss any feedback you have!

Choosing appropriate identifiers for the constructs in your code provides better readability and maintainability. With the latest build of Telerik JustCode you can now easily set naming conventions for all your code elements.

Configuration and Supported languages

These rules can be set for C# and VB.NET and are part of the Code Style section of the JustCode options dialog:

These options are part of the shared settings so you can share them per solution as well.

Naming Rules

There are seven types of rules that a user can choose from:

• camelCase
• PascalCase
• UPPER_UNDERSCORE
• lower_underscore
• Sentence_underscore
• PascalCase_Underscore
• camelCase_Underscore

You can also disable the naming convention for a specific construct. Just choose “Disabled” from the rules combo box.

Warnings

JustCode will analyze every identifier in your solution and will show a warning if the name of the construct does not match the specified naming rule:

 An appropriate fix will be available:

Secondary rules

There are some cases, in which you would like to set two rules for a construct, so that JustCode will accept either one of them when analyzing the name of the construct.

Consider the following case, where you want to have constants that are Pascal Case as well as constants that are UPPER_UNDERSCORE_CASE:

JustCode is showing a warning that the second constant does not match the naming conventions, because the naming rule for constants is set to “PascalCase”. You can, however, specify a secondary rule. To do so, click on the “Add” button in the Naming Conventions section or choose from the available context menu “Add Secondary Rule”. Save the chosen setting and the analysis will be refreshed automatically. The warning will not be shown anymore:

Code Generation

JustCode does not only show warning if the identifier of a construct does not match the chosen rule, but also uses the Naming Conventions when generation new constructs:

Quick-Fixes

The Naming Conventions are also used in the quick-fixes that JustCode suggests:

That’s it for today. If you are eager to put your hands on these new functionalities, you can give Telerik JustCode a try! We hope you like what you see, much more to come. Your feedback is welcome and appreciated. Write to us in forum or support.

What's Coming?

Our Q1 2012 Webinars are just around the corner. If you attend the What’s New in Tools for Better Code webinar, you can see live demos of the features mentioned in this blog post and much, much, more. One lucky winner from the Just* webinar will receive a Telerik Ultimate Collection worth $1999. More importantly, you will sharpen your ninja skills to write better code! 

Happy Coding!

The JustCode team

I am happy to announce the immediate availability of the Telerik MVC Extensions Q1 2012 Beta release! With it comes the longed-for Area chart type as well as a bunch of new features for the majority of the existing chart types supported by our MVC charting. We are also shipping a plethora of small and medium-sized features across all the Telerik MVC extensions, as well as formal support for the Chrome 16 and FireFox 10 browser versions.

I won't go into much detail about each and every new functionality delivered with the Beta and, consecutively, the upcoming official major release (due in a couple of weeks time), but I will surely underline the most important features from which the majority of the ASP.NET MVC developers will benefit.

New Area Chart Type

This chart type accounts for one additional means to visualize your data by means of area shape. The area chart shores up all applicable features of the rest chart types.

Multiple Value Axes

Now the developers have the option to scale the charting series presentation against more than one value axis. You are free to choose two, three or more value axes - there is virtually no limit, it all depends on how and versus what measurements you would like to visualize the data.



This feature is supported for bar, line and area charts for now, and will be braced for scatter charts with the official Q1'12 release.

 

Plot Bands

Allow you to define visual lines that highlight an important section of the charting graph - oftentimes min/max threshold or range that is aimed to be achieved for a given period. This feature has actually been included since the Q3 2011 SP1 commercial release of the extensions, but the Q1'12 Beta marks its prime time in the Open Source MVC distribution.

Common for all Extensions

Two things are worthy to be mentioned here - improved support for MVC authorization scenarios and combined js file for all MVC extensions client features.

 

And here are the links that will direct you to all the available information concerning the Q1 2012 MVC Beta release:
Trial Files | Commercial Files | OS Files | Demos | Documentation | Release Notes

As always, do not cringe and tell us what you think about the Beta in the public MVC Beta forum. We are only days away from the next major Telerik DevTools release, and your opinion matters!

Also do not miss our Q1'12 webinar week, starting Feb 20th and book your seat now! 

About the author Stefan Rahnev

Stefan Rahnev is the Unit Manager of the ASP.NET MVC Telerik Division. He has been working for the company since 2005, when he started out as a regular support officer. His next steps at Telerik took him through the positions of Technical Support Director, co-team leader in one of the ASP.NET AJAX teams and ASP.NET AJAX Unit Manager. Stefan’s main interests are web development, agile processes planning and management, client services and psychology.

Are you into ASP.NET MVC development? Download our MVC components now to cut back development time and boost your productivity!

RadDataBoundListBox has been continuously developed and extended with new features like Item Animations, CheckBoxes support, Data Virtualization support etc. We have also fine-tuned its performance so that it perfectly fits in an environment of limited memory and CPU resources what a mobile phone is. You can see here a real-world scenario based comparison between RadDataBoundListBox and a standard ListBox control putting both UI Virtualization approaches head to head.

With Q1 2012 Beta we are introducing an entirely new feature which also paves the way for a more complex and performance-optimized Wrap Virtualization Layout: Horizontal Scrolling. A nice example is available in our Demos app (source code in) that showcases this feature:

 

You may now ask what’s the common thing between Horizontal Scrolling and support for Wrap Layout? Well, with this Beta release we are introducing some major architectural changes in RadDataBoundListBox’ engine which give us more freedom to implement different UI virtualization approaches and layouts. These changes include an extraction of the whole UI virtualization mechanism into a so called Strategy class which is simply plugged into the control. In this way we can easily develop a Wrap Layout Virtualization strategy and also make it available as an option in the feature set of the control.

Following is a quick code-snippet enriched demonstration of how activating horizontal scrolling in RadDataBoundListBox is done. There is a new property called VirtualizationStrategyDefinition which basically represents a definition for a given UI strategy and also a set of properties for this strategy. Currently only instances of the StackVirtualizationStrategyDefinition class can be used in this context:

 

<telerikPrimitives:RadDataBoundListBox x:Name="radDataBoundListBox">     <telerikPrimitives:RadDataBoundListBox.VirtualizationStrategyDefinition>         <telerikPrimitives:StackVirtualizationStrategyDefinition Orientation="Horizontal"/>     </telerikPrimitives:RadDataBoundListBox.VirtualizationStrategyDefinition> </telerikPrimitives:RadDataBoundListBox>

As you can see, the StackVirtualizationStrategyDefinition exposes an Orientation property which is used to define whether RadDataBoundListBox will scroll vertically or horizontally.

In near future, you will also be able to define a WrapVirtualizationStrategyDefinition by using the same approach and have your DataBoundListBox position its visual items in a wrap mode.

You can find this new functionality in the RadControls for Windows Phone 7 Q1 2012 Beta package available for download from the Downloads section of your accounts.

 

Hello everyone and welcome back to XAMLflix with RadBarCode for Silverlight and WPF. What is XAMLflix you might ask? Well, it is Telerik’s way of teaching you how to use both new and existing controls from Telerik’s XAML suite. Each and every Thursday, we will provide a fresh batch of videos and sample projects highlighting a different control. Since our Silverlight and WPF share a common codebase and API, you only have to learn how to use these controls once! You can simply copy and paste the code between frameworks. If you are eager to get started then go ahead and download a trial of RadControls for Silverlight and WPF right now and follow along with the videos real-time.

Meet RadBarCode

The RadBarcode control can be used for automatic Barcode generation directly from a numeric or character data without the need of any Barcode font being installed in the end user’s PC. It can also generate many different types of Barcodes including those commonly used in point-of-sales industries.

• Getting Started with RadBarCode – In this video, we will dive into Visual Studio 2010 and begin with File -> New Project and use the RadBarCode Control. We will discuss adding references, to getting your Toolbox setup to finally adding a RadBarCode to our Silverlight Application. We will also discuss several properties that you can use to assist in developing highly flexible barcode applications. If you are brand new to RadBarCode then watch this video first! (source code)
• RadBarCode – Additional Formats In this video, we will discuss the various formats supported by RadBarCode out of the box and begin using several more popular Barcodes such as Code 128, PostNet, EAN-13 and UPC-A. If you want to become familiar with what barcodes we support and get a glimpse at using each one then this video is for you. (source code)
• RadBarCode – Sample Application In this video, we will create a sample application that demonstrates using the RadBarCode in an electronic catalog by using the RadBook control. Your user can flip pages easily in this real world simulation. I also discuss how easily you can print barcodes using RadBarCode and Silverlight 4’s built in PrintDocument class. (source code)

Wrap-Up

Thanks for reading and if you have any questions or comments then please let me know.

Also, keep watching the Telerik blogs as we are planning on releasing new videos for XAMLflix each and every week. You can download a trial of RadControls for Silverlight and WPF right now.

Find me on Twitter at : @mbcrump

Hot on the heels of the Dojo 1.7.1 release, we are excited to officially publish SitePen’s 1.7-specific updates to not one, not two but ALL 55 Dojo 1.6 tutorials. As you can guess, this was no small feat given that Dojo 1.7 is loaded with significant changes that encompass best practices on the road to 2.0. We’ve revamped the full Dojo 1.6 tutorial series to cover, not only how to do the things you already knew, but to prepare your team and your web app for what’s to come.

Oh and of course, the tutorials are rewritten to take full advantage of the new Dojo loader’s support for AMD, and they lay a groundwork for preparing your application to be lighter and more modular than ever!

So raise your glass and toast with us to the completion and release of the Dojo 1.7 Tutorials and to the best JavaScript toolkit available for scalable web apps!

Ready to upgrade to 1.7?

We stand ready to bring your code current to the latest release or kick off your project right out of the gate with Dojo 1.7! In addition to our dedication to Dojo documentation and tutorials we offer a comprehensive set of services to make your project a success!

Dojo Workshops – Learn Dojo 1.7 from the experts. We’ve posted a nationwide, 2012 workshop schedule that will exceed the expectations of developers and engineering budgets alike! If these dates and locations don’t work for you and your team, reach out to us about our private Dojo workshops.

Dojo Support – SitePen offers 5 different plans, all of which are provided to you by Dojo experts who will provide your team with the knowledge and experience necessary to support your web development efforts. Get pro-active and purchase a plan that will support your team with Dojo 1.0 through 1.7 and eliminate potential schedule-busting roadblocks on your path to success!

Development – Upgrading to Dojo 1.7 will improve your web application. If you know this to be true but don’t have the resources to make it happen, engage our development team to work for you and let us do what we do best – Make you look good. Contact us for a custom quote for your Dojo 1.7 upgrade.

Related posts:

1. The Year of Dojo is Here!
2. Dojo 0.9 Update
3. Everyone can “Ask the Experts”

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!

Though the time since the last official release, Q3 2011, and today’s release of the next Q Beta is a month shorter than usual, I am happy to present you the early preview of the Q1 2012 version of Telerik’s Controls for ASP.NET AJAX. Thanks to the hard work of the AJAX team members, we were able to include all of the major features here in the Beta version. And as most of them have been highly requested by you for some time now, I am sure you are eager to get them. But let’s stop wasting time and see what’s really in the box:

Quick links: Play with the Beta Demos | Download the Beta | Check the full Release notes

Client-side binding for RadListView – RadListView now supports client-side binding with client-side HTML templates. The HTML templates are defined through the markup similarly to the server templates. jQuery is used for DOM operations.

See Demos

Expand/Collapse and Drag-and-drop for RadOrgChart – Added with the previous version of RadControls for ASP.NET AJAX, we continue with the important functionalities of the RadOrgChart. Now your users will have the ability to collapse and expand the hierarchical tree, and this is achieved with a single property. Or if you need to re-organize the current structure, you can just drag a single item, or a whole tree of items, and drop it wherever you like.

See Demos

Thumbnail Explorer Mode for RadFileExplorer – This feature offers a new way to display the files list in the selected folder resembling the Windows Explorer view. To enable the thumbnail explorer mode you need to set a single property. This mode is also the default one for the RadEditor Image Manager.

See Demos

Export to Excel and Column Resizing and Show/Hide for RadTreeList – RadTreeList already provides the ability to export it to Pdf and from now on you will be able to export its data to Excel as well. And to make it more flexible and for better user experience, columns resizing and show/hide client-side functionalities are added to the RadTreeList features set. See Demos

New Format Sets drop down for RadEditor – These sets are used to apply formatting to elements and sections in the content of the editor. The format sets dropdown provided different groups. And you can add a custom format set directly through your markup. See Demos

To be getting regular updates on what’s new, subscribe to the ASP.NET AJAX Team blog feed, or keep an eye on it frequently. In the upcoming days the AJAX developers will blog about each of the new features in details and share interesting tips with you.

And last but not least, don’t forget to share your feedback with us on the Beta forum! 

About the author Iana Tsolova

Iana Tsolova is Unit Manager of Telerik’s ASP.NET AJAX division. She joined the company back in 2008 as a Support Officer and has since occupied various positions at Telerik, including Senior Support Officer, Team Lead at one of theASP.NET AJAX teams and Technical Support Director. Iana’s main interests are web developing, reading articles related to geography, wild nature and latest renewable energy technologies.

With Telerik WindowsPhone Q1.2012 Beta release we are shipping the first parts of the new line of Telerik components – Application Building Blocks for Metro mobile applications. These components are created to target mobile Metro applications for Windows Phone 7 and for Windows 8/Rt at a later stage.

The tricky part in mobile development is that you have to think about development and promotion simultaneously. 
The Marketplace is the primary distribution channel for your app and it has its logic and app’s success metrics. What’s cool is that there are a number of in-app tricks that you can do yourself that will influence the app’s overall success. What’s even cooler is that we have thought about these composite parts of your app instead of you.

With our experience in building professional Mobile applications we identified that there are a lot of mobile specific features that can be reusable and are essential parts of every professional application that will be distributed throughout mobile marketplaces. For every application we’ve been working on we needed to implement a set of common features like trial experience, rate the application reminders (for better marketplace rankings), error diagnostics, dynamic live tiles etc.. This is how we came to the decision to develop the following application building blocks which you can get out of the box and reuse in your applications:

- Error diagnostics – with this component you can receive crash reports, add specific debug information and get run-time information from your users when an issue in your application is encountered.

Read more about Rad Diagnostics

- Trial functionality– with this component you can adjust the trial functionality of your application. You can add application wide trial notifications, or feature specific trial functionality with a lot of configurable options for Trial Period or Trial Usages of the application or the paid feature.

Read more about RadTrialReminder

- Rate Application Reminder – with this component you can add a very important feature for reminding your users to rate your application thus increasing your marketplace presence.

Read more about RadRateApplicationReminder

- Live Tiles – live tiles in WP7 and WinRt are a great way expose application functionality onto user’s desktop. With this component you can easily create context specific dynamic tiles.

Read more about RadLiveTileHelper

Please give these components a try, while they are still in Beta, and let us know if you have any other feedback or ideas for other building blocks that will be useful for you.

You can also find me on twitter @valiostoychev  – I’ll be happy to discuss any feedback you have!

Two weeks before the official Q1 2012 release we have prepared a Beta package containing all the new stuff that we have been working on the previous months for you to check out. There are some brand new components, as well as cool new features in RadSlideView, RadDataBoundListBox and RadBusyIndicator.

 

Let's start with the newborn components available in RadControls for Windows Phone Q1 2012 Beta:

• RadToolTip - this is a control that allows you to display a popup associated with a given visual element on your page. This popup may contain any type of information, like additional details or some hints. We have a pretty slick example of this new component in our Demos App with source code available
• RadRating - this one implements one of the most common scenarios: providing the end-user with the ability to evaluate something by choosing from a range of rating items associated with a given value
• Application Building Blocks - here we are taking a new direction by shipping a set of classes that will help you bring some essential scenarios to your own app without having to write so much code. The building blocks are inspired by the marketplace environment and requisite for the promotional stage of your app development cycle. RadDiagnostics, RadTrialReminder, LiveTileHelper and RadRateApplicationReminder are tools that easily integrate withing your app and help you gather feedback from your users, track application crashes, create secondary application tiles and implement trial-only available functionality.

 

  

 

Furthermore, we have prepared some upgrades for a couple of our existing controls that were both highly demanded by many of you and also greatly contribute to the big picture of a fully fledged control suite:

• RadDataBoundListBox now gets horizontal scrolling and a green light for Virtualized Wrap Layout (!) support (which we hope we will ship officially with Q1 2012)
• RadSlideView has been completely redesigned and revamped to provide greater performance, extended functionality like per-item Busy Indicator and optimized UI virtualization logic
• RadBusyIndicator has now an extended out-of-the-box animation set containing the standard WP7 OS dot-style animation

 

  

 

As you can see there is a lot of new stuff to play with. Since this is a Beta we are expecting your extensive feedback so go download the package from your account and check it out! 

We have also left some new cool stuff as a surprise for the release. If you’d like to see all the new bits, make sure to sign-up for the Release Webinar Week, February 20-22. This 3-day event is packed with hour-long webinar sessions on the coolest new features shipping with the Q1 2012 release. One lucky winner from each webinar will leave with a Telerik Ultimate Collection license worth $1999. To enter the drawing and participate in the Q&A session, you must attend the live webinar.
Register at: http://www.telerik.com/support/webinars.aspx

Two years ago, we set out on a journey to make the web mobile. Today, we’re raising the bar with the release of Sencha Touch 2 Beta.

Thank you to our community for your feedback during our sneak peaks with our Preview Releases. Your contributions in the forums, reporting bugs, adding feature requests, and your inspirational teamwork in the Q&A threads have kept us focused on what’s really important to you—delivering quality. We’ve taken all your feedback and we’re proud to deliver a release that we hope will exceed your expectations.

Download Sencha Touch 2 Beta   View Release Notes

What’s New?

With every major release, we strive to bake in the latest innovate approaches to help you create impressive applications. And learning how to use these techniques is now easier than ever.

API Documentation, Guides, and Examples

We’re investing a great deal of time in creating comprehensive documentation for Sencha Touch 2. Every major class now has a full introduction complete with code samples and how it fits into the wider context of your app. As well as class docs, we’re adding over 20 brand new guides covering everything from getting started through to building and deploying your applications.

On top of this, our documentation center now allows you to experiment with inline code editing.

Touch 2 Docs feature 20 new guides, code samples, and editable examples.
Visit the Touch 2 Docs

We’re continuing to lead the way when it comes to innovation in our learning materials. We’re also proud to continue sharing all of the hard work we put into our documentation tools under the open source JSDuck project, a part of Sencha Labs.

New Facebook Integration Example

We’re adding an example showcasing Sencha Touch’s seamless integration with the Facebook Graph API. Jog With Friends combines the Facebook JavaScript SDK on the client side with a 200 line node.js script backed with MongoDB on the server side. For a live demo, check out http://ju.mp/senchajwf on a WebKit browser.

Foundational Improvements

Each major new version of Sencha Touch brings with it an opportunity to advance the state of what can be done with the mobile web. Here are just a few of the improvements we’ve made in Sencha Touch 2.

A New Class System

Sencha Touch 2 benefits from the supercharged class system that powers Ext JS 4. The upgraded system enables powerful new capabilities like dynamic loading, custom builds and new features like mixins. This makes developing your app easier from the first line of code all the way through to creating a minimal custom build that contains only the classes your app actually uses.

As a developer though, the biggest improvement you’ll probably notice is the use of the new config system. Sencha Touch components have always been very configurable, but for version 2 we’ve made a big improvement to the consistency of the API.

Every single configuration can now be set and updated in a very predictable way through the use of generated getter and setter functions. These functions always follow the same format and can be called at any time so once you know the config name you automatically know what function to call to update it:

/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .javascript .imp {font-weight: bold; color: red;} .javascript .kw1 {color: #000066; font-weight: bold;} .javascript .kw2 {color: #003366; font-weight: bold;} .javascript .kw3 {color: #000066;} .javascript .co1 {color: #006600; font-style: italic;} .javascript .co2 {color: #009966; font-style: italic;} .javascript .coMULTI {color: #006600; font-style: italic;} .javascript .es0 {color: #000099; font-weight: bold;} .javascript .br0 {color: #009900;} .javascript .sy0 {color: #339933;} .javascript .st0 {color: #3366CC;} .javascript .nu0 {color: #CC0000;} .javascript .me1 {color: #660066;} .javascript span.xtra { display:block; }

var panel = Ext.create('Ext.Panel', {
    html: 'Sencha Touch 2 rocks'
});
alert(panel.getHtml()); // alerts the current value of the html config
panel.setHtml('It sure does'); // changes your panel html to a new value

These functions always follow the same format, which makes learning the framework really easy. As well as the getter and setter functions we provide hook functions which makes it easy to create your own configs—check out the new class system guide to find out more.

MVC with History Support

One of the most frequently asked questions about web frameworks is how to structure your apps to make them easy and fun to create and maintain. With Sencha Touch 2, we’re bringing significant improvements in our MVC architecture, providing new functionality and a cleaner, leaner API.

History support is baked right into Controllers in this new release, making it easy to add back button and deep linking support into your application. We have a full guide on history support and you can see it in action on your device by checking out the upgraded Kitchen Sink example.

Setting up routes is easier than ever—just define the urls your app needs to react to inside your controller along with a function to call when that url is detected. For example here’s how we can easily create an ecommerce application that shows product details when the user navigates to urls like http://myapp.com/#products/123:

/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .javascript .imp {font-weight: bold; color: red;} .javascript .kw1 {color: #000066; font-weight: bold;} .javascript .kw2 {color: #003366; font-weight: bold;} .javascript .kw3 {color: #000066;} .javascript .co1 {color: #006600; font-style: italic;} .javascript .co2 {color: #009966; font-style: italic;} .javascript .coMULTI {color: #006600; font-style: italic;} .javascript .es0 {color: #000099; font-weight: bold;} .javascript .br0 {color: #009900;} .javascript .sy0 {color: #339933;} .javascript .st0 {color: #3366CC;} .javascript .nu0 {color: #CC0000;} .javascript .me1 {color: #660066;} .javascript span.xtra { display:block; }

Ext.define('MyApp.controller.Products', {
    extend: 'Ext.app.Controller',
    config: {
        routes: {
            'products/:id': 'showProduct'  // It’s that easy
        }
    },    
    showProduct: function(id) {
        console.log('showing product ' + id);
    }
});

Check out the full guide on History Support to find out how to add this to your app.

Multi Device Profiles

One of the challenges of a multi-device world is building an application that runs seamlessly across operating systems and screen sizes. With Sencha Touch 2 we provide a simple mechanism that enables you to write your app once then customize it for each device it runs on.

This is achieved by configuring Device Profiles, which usually split your app into Phone and Tablet modes. Define all of the models, views, controllers and store that you want to reuse in your Ext.application and anything profile-specific inside the configuration for each Profile.

For example, let’s say we’re creating a Facebook app and want to show a simple feed view on Phones and a detailed one on Tablets. We can start by telling our Application that it has two profiles:

/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .javascript .imp {font-weight: bold; color: red;} .javascript .kw1 {color: #000066; font-weight: bold;} .javascript .kw2 {color: #003366; font-weight: bold;} .javascript .kw3 {color: #000066;} .javascript .co1 {color: #006600; font-style: italic;} .javascript .co2 {color: #009966; font-style: italic;} .javascript .coMULTI {color: #006600; font-style: italic;} .javascript .es0 {color: #000099; font-weight: bold;} .javascript .br0 {color: #009900;} .javascript .sy0 {color: #339933;} .javascript .st0 {color: #3366CC;} .javascript .nu0 {color: #CC0000;} .javascript .me1 {color: #660066;} .javascript span.xtra { display:block; }

Ext.application({
    name: 'FB',
    profiles: ['Phone', 'Tablet'],
    controllers: []
});

Now we set up a Tablet Profile that’s activated when we detect that we’re running on a Tablet device:

/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .javascript .imp {font-weight: bold; color: red;} .javascript .kw1 {color: #000066; font-weight: bold;} .javascript .kw2 {color: #003366; font-weight: bold;} .javascript .kw3 {color: #000066;} .javascript .co1 {color: #006600; font-style: italic;} .javascript .co2 {color: #009966; font-style: italic;} .javascript .coMULTI {color: #006600; font-style: italic;} .javascript .es0 {color: #000099; font-weight: bold;} .javascript .br0 {color: #009900;} .javascript .sy0 {color: #339933;} .javascript .st0 {color: #3366CC;} .javascript .nu0 {color: #CC0000;} .javascript .me1 {color: #660066;} .javascript span.xtra { display:block; }

Ext.define('FB.profile.Tablet', {
    config: {
        controllers: ['Feed'],
        views: ['DetailedFeed', 'Timeline']
    },
    isActive: function() {
        return Ext.os.is.Tablet;
    }
});

And one for Phones:

/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .javascript .imp {font-weight: bold; color: red;} .javascript .kw1 {color: #000066; font-weight: bold;} .javascript .kw2 {color: #003366; font-weight: bold;} .javascript .kw3 {color: #000066;} .javascript .co1 {color: #006600; font-style: italic;} .javascript .co2 {color: #009966; font-style: italic;} .javascript .coMULTI {color: #006600; font-style: italic;} .javascript .es0 {color: #000099; font-weight: bold;} .javascript .br0 {color: #009900;} .javascript .sy0 {color: #339933;} .javascript .st0 {color: #3366CC;} .javascript .nu0 {color: #CC0000;} .javascript .me1 {color: #660066;} .javascript span.xtra { display:block; }

Ext.define('FB.profile.Phone', {
    config: {
        controllers: ['Feed'],
        views: ['SimpleFeed', 'Timeline']
    },
    isActive: function() {
        return Ext.os.is.Phone;
    }
});

When the app boots up, it will automatically figure out which Profile to activate and use its specialized models, views and controllers. Check out the Device Profiles guide to find out how to use them in your app.

New Components—Component Data View and Navigation View

In addition to using the new XTemplates in your dataviews, we’re adding one of the most asked for features—using components in your data views. You can now add buttons, or any components, to items.

The KivaTouch demo app uses a Component DataView to show funding progress.

Giving your users the proper visual cues helps your applications flow more naturally. With Sencha Touch 2, wiring up view transitions are now simpler than ever when using a Navigation view. If you choose to use a navigation view, navigational controls such as back buttons will be handled for you. As an added bonus, we’re adding sexy animations when switching between cards.

Sencha Touch 2 Navigation View. View video on Vimeo Dive In

Now that we’re in beta, we encourage you to dive right in. We have a stable API, and we have more guides to help get you going quickly. If you’re looking to port your Sencha Touch 1.0 app we have a backwards-compatibility build that helps you through the migration process. We also have an upgrade guide to help you out.

Note: those of you who have been using the Sencha Touch 2 Preview releases, be aware that we have cleaned up the builds we generate and as a result you may need to change which build of Sencha Touch you use. Most people should now be using sencha-touch-debug.js while developing, but for a complete list of the builds we generate see the builds guide.

Features We’re Still Working On: Android ICS Performance

Sencha Touch 2 has significantly faster performance on Android 2.x browsers – with fast list scrolling being a particular point of pride. We’ve always treated the browser in Android 3.x as fundamentally broken, and do not plan to officially support it in Touch 2. We are currently working on improving performance in Android 4.0 – the Ice Cream Sandwich release. So far, we have found no acceptable mechanism to achieve fast and flicker-free animations. We have filed a bug with a simplified test case showing poor performance on a variety of mechanisms with the Android bug list. If you’d like to help prioritize this bug, please go to the bug page for Android bug number 24833, and “star” the bug by clicking on the star icon just before the headline. Solving this bug will help, not just Sencha Touch 2, but the entire web community developing content for the Android 4 browser. Feel free to add your own test cases as well!

Summary

We hope you enjoy playing around with the examples, and diving in to building your next great app. It’s been a lot of hard work getting to this point, and we thank you for all the feedback. Please keep sharing your ideas.

.right, .alignright { float: right; margin: 0 0 10px 10px; } .left, .alignleft { float: left; margin: 0 10px 10px 0; }

How you assert through unit test that an user is authenticated before doing withdraw operation? You can surely verify a method is invoked as expected but if you want to ensure the order right then you might require a little more. JustMock lets you specify the order in which your setups should be executed. This helps you identify the exact way in which a particular logic is implemented.

To begin, lets consider the following context:

User wants to withdraw money from his account. Withdraw operation should validate the following goals:

• It should check if the user is authenticated
• It should get the balance for the authenticated user and check if the amount to be withdrawn is less than or equals to what is specified.
• Do the withdraw operation and return the remaining balance.

Now we have one IUserService interface

1. public interface IUserSerivce
2. {
3.     bool IsAuthenticated { get; }
4.     IUser GetUser();
5.  
6. }

One IAccountService interface to process the accounts operation:

1. public interface IAccountService
2. {
3.     double Withdraw(double amount);
4.     double GetBalance(IUser user);
5. }

The basic AccountRepository class with minimal implementation covering the above context looks like:

1. public class AccountRepsotory
2. {
3.     public AccountRepsotory(IUserSerivce userService, IAccountService accountService)
4.     {
5.         this.userService = userService;
6.         this.accountService = accountService;
7.     }
8.  
9.     public virtual double Withdraw(double amount)
10.     {
11.         if (userService.IsAuthenticated)
12.         {
13.             if (accountService.GetBalance(userService.GetUser()) >= amount)
14.             {
15.                 return accountService.Withdraw(amount);
16.             }
17.         }
18.  
19.         throw new ArgumentException("TODO");
20.     }
21.  
22.     private readonly IUserSerivce userService;
23.     private readonly IAccountService accountService;
24. }

Ensuring every step to be executed in an orderly manner , we just need to specify an extra InOrder option in Mock.Arrange that will otherwise fail the test during assert for any change of the expected execution order.

1. [TestMethod]
2. public void ShouldCheckUserAndBalanceInOrderWhenSpecificAmountIsWithdrawn()
3. {
4.     var userService = Mock.Create<IUserSerivce>();
5.     var accountService = Mock.Create<IAccountService>();
6.     
7.     var user = Mock.Create<IUser>();
8.  
9.     Mock.Arrange(() => userService.IsAuthenticated).Returns(true).InOrder();
10.     Mock.Arrange(() => userService.GetUser()).Returns(user).InOrder();
11.     Mock.Arrange(() => accountService.GetBalance(user)).Returns(1000).InOrder();
12.  
13.     Mock.Arrange(() => accountService.Withdraw(Arg.AnyDouble)).Returns((amount) => 1000 - amount).InOrder();
14.  
15.  
16.     var repository = new AccountRepsotory(userService, accountService);
17.  
18.     Assert.AreEqual(990, repository.Withdraw(10));
19.  
20.     Mock.Assert(userService);
21.     Mock.Assert(accountService);
22. }

Let’s remove the line# 13 from AccountRepository.Withdraw  that yields:

1. public virtual double Withdraw(double amount)
2. {
3.     if (userService.IsAuthenticated)
4.     {
5.         return accountService.Withdraw(amount);
6.     }
7.  
8.     throw new ArgumentException("TODO");
9. }

 

Since we broke the order, the test will fail with the following message:

 

Here one thing to notice that InOrder is applied to different mock instances within the test method scope that makes it effective in most practical and wide variety of scenarios. I have used Q3 SP build for the purpose (Also available via NuGet).

 

Hope that helps

3.5.0pr2 is available

We deployed the second 3.5.0 preview release right on time, celebrated for a couple minutes, then went back to work on PR3, which will be the gating preview before 3.5.0 GA in mid-March.

But we’ll stop to take a breath and highlight some of the changes in PR2. You’ve read the short list on the release blog post, so join us for a little more detail and probably some live tinkering.

As is the case with all preview releases, we’re eager to get your feedback and any bugs you find. Or if you’re note yet convinced to give it a try before the GA, maybe we can convince you.

Time & Details

We’ll be online on Thursday from 10am to 11am PST.

Join the Meeting

Recording

The recording is available in the YUILibrary YouTube channel.

Since Q3 2011 we have changed the default drag API used. It allows creating more complex scenario as well as building MVVM friendly drag behaviors. However, it does not support drag arrow which, although not very popular feature is still used. Thus, when arrow was required, we have suggesting using legacy execution mechanism.

In this blog I will write how to create your own drag arrow using DragDropManager events. So, basically we will use AddDragInitialize, GiveFeedback and DragDropCompleted to create and control the arrow. We also use Popup to display it on the screen.

The arrow itself is located in Arrow class which derives from Content control and has its own template defined. Thus you can create custom arrow by simply adding new style to this control.

 

So, in order to use it you can just add the following lines in your code:

- Initialize ArrowService:

private void Application_Startup(object sender, StartupEventArgs e) 

{ 
     this.RootVisual = new MainPage();
     ArrowService.Initialize(this.RootVisual);
} 

.csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } - Enable Arrow on drag:

ArrowService.DisplayDragArrow = true;

That way you have full control of arrow appearance and behavior. I hope you’ll like it.

Download Silverlight project

The showcase gallery featuring our customers Windows Phone apps just got updated with a few new applications. Check out the gallery here.

 

Looking at the appsfuse.com 100 Most Rated Publishers list on the Windows Phone Marketplace I was very happy to see one of our customers - Liquid Daffodil on number 10. Congrats!

And the other thing that I wanted to share with you today is this lovely retrospective infographic, posted by Brandon Watson, showing how the Windows Phone Marketplace, the developer mindshare and customer interest has evolved over in 2011.

 

YUI 3.5.0 Preview Release 2 has been released to the developer community for feedback and testing. It is now available on the Yahoo! CDN at yui.yahooapis.com/3.5.0pr2/build/yui/yui-min.js, or as a download if you plan to test it locally.

The rollup of 3.5.0 changes introduced up until PR2 is available on our GitHub Wiki. You can also review the list of tickets that were resolved in this release.

Work-in-progress user guides and API docs for 3.5.0 can be found on our staging site, but beware that these docs may be incomplete or even broken, since this is where we test new stuff. Official docs for the latest stable release can always be found on our production site, yuilibrary.com.

Some highlights in this release include:

• New HTML5 File Uploader with Flash fallback
• Major DataTable refactor. If you’re a DataTable user, please read the user guide for details about API changes.
• CSS Button, Button and ButtonGroup modules
• Many bug fixes and feature enhancements for App Framework components

To file bugs against this release, please visit our bug tracking system. If you’d like to provide input on these and future modules, the ongoing discussions on various topics relating to the 3.5.0 release are happening on our GitHub wiki.

We will release YUI 3.5.0 GA in mid-March. Happy testing!

Most 2012 trend lists include 12 trends. (Get it?  12 in ’12.  Of course you do.).  Because we are not fond of adding unnecessary or filler content (read code), Dylan has come up with 11 trends for 2012.

1.  Mobile

Mobile will gain even more momentum in 2012.  There’s no doubt we will see many new APIs, development tools and capabilities in place to both build and install most any app as a web app rather than using native technology.

2.  AMD

Following on the increasing emergence of microtoolkits in 2010 and 2011, 2012 will be the year everything becomes an AMD module, making it easier for Dojo, jQuery, MooTools and other toolkits to play nicely together.

3.  Builders & Loaders

With so many modules, performance, loading and building will need to be optimized.  Use of package management will become increasingly important.

4… Check out the rest of Dylan’s 11 Trends for 2012! And don’t forget that SitePen’s got your back when it comes to implementing efficient and scalable solutions.  Contact us today!

Related posts:

1. We’ve (unofficially) declared 2012 as the Year of Dojo!
2. The Year of Dojo is Here!
3. SitePen at BlackBerry DevCon Americas 2011

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!

Sencha Designer 2 Now Supports Sencha Touch

Sencha Designer 2 Beta features support for Sencha Touch and Ext JS JavaScript frameworks.
Download Sencha Designer 2 beta today

We’re thrilled to announce that Sencha Designer 2 Beta is available for download! Designer 2 makes it easier than ever to build desktop and mobile applications using Ext JS and Sencha Touch.

We’ve been working hard to bring you the next generation of Designer that will help you quickly build Ext JS and Sencha Touch applications. Experienced users will enjoy the productivity gains of the visual development environment, while folks new to Sencha will have a much easier time learning how to work with our frameworks and quickly build a complete application.

Ext JS and Sencha Touch are incredibly rich: they provide UI components, charting, controllers, models and data stores. In Designer 2, we make all of these features easily accessible and neatly organized to make it easier to discover all their capabilities.

From Ext Designer 1 to Sencha Designer 2

Designer 1.0 was the first step in tooling for Sencha frameworks. Designer 1 was a visual UI builder that made it easy to scaffold and design the UIs for your applications. You used it in conjunction with another code editing tool in order to build Ext JS 3 apps.

In Designer 1.2, we adding the ability to target multiple frameworks and also added support for Ext JS 4. You could continue to build views and stores utilizing all of the new widgets available in the new framework, like charts, enhanced stores, and more.

While you told us that you loved the features of Designer 1.x, we kept hearing that you wanted Designer to do more to help you build fully functional applications in a collaborative way.

Designer 2: Easier, Faster, Stronger

When started planning Designer 2, we wanted to improve every aspect of the tool. To achieve this goal, we adopted the mantra “Easier, Faster, Stronger.”

• Easier because we believed that the learning curve of building Sencha apps could be shortened. In Designer 2, all components come with handy in-line documentation, and there are quick links to go deep into the API reference. More fundamentally, developers can try things quickly and get instant feedback. The Designer canvas is a live view giving you immediate feedback. Learning the dozens of components in Touch or Ext JS is now a breeze.

• Faster because traditionally, web based development proceeded like this: write some code, refresh the browser, check the changes. Over and over again. While better web debugging tools have come a long way, debugging and error checking is still a tedious and sometimes unpredictable process.

  Designer 2 is different: all code generated by the tool is guaranteed to work out of the box. You can’t arrange components in a way that will break the frameworks’ conventions. Every property or event of every component is available in Designer, removing guesswork and eliminating digging through the API docs.

  Moreover, the Project Inspector has been greatly enhanced. It’s the heart of your project, and it shows your views, controllers, models, and stores all in one place, along with information about the project’s structure. All components and their relationships are there where you can see and analyze them.

  If you need to jump into a project somebody else started, the Designer Project Inspector makes it easy. At one glance, you can see the entire project and understand how the application is built without thumbing through pages of code.

• Stronger because Designer 2 helps you create well-structured applications from day one, and ensures that generated code follows best practices. Most (if not all) of the boilerplate code is generated for you, so you can focus on the code that really matters: the controller logic that’s at the core of your unique application.

What’s new in Designer 2?

Designer 2 represents a significant leap ahead in functionality, and here is a brief list of what’s new and what changed since the previous version:

Support for Sencha Touch 2

This feature has consistently been the top request from our community, and now it’s here! Sencha Touch 2 is now a first-class citizen of Designer. Visual development of mobile web applications is now a reality. This beta includes the PR4 release of Sencha Touch 2.

Code editor

Designer now includes a built-in editor so you can add your own code any time you want. You can toggle between the design view, which gives you access to Designer visual controls, and code view, where you write your JavaScript. The files are saved to .js files on the file system, so you can use your editor of choice, or the built-in editor in Designer.

New Toolbox

The component Toolbox has been expanded and improved: it now includes all the components you need to create a fully functional application like Controllers, Models and even a brand new store that connects to Sencha.io. We also worked to make the vast array of components more manageable by adding base categories. This allows you to narrow down the selection quickly, and create your own to fit your personal workflow.

New Project Inspector

The Project Inspector shows the entire application at a glance. The root Application node contains your launch function, while the Controller, View, Store and Model nodes help you keep things organized as you’re building an MVC application.

Event Bindings

There’s a new panel that displays all the Event Bindings available for a component, and you can use this to bring your UI to life. And when your application grows in scope, you can stay organized by moving your event bindings into a controller.

Source control friendly file format

Developers share code using source control, but developers using Designer 1 had a hard time doing that because of the monolithic nature of our project files. Designer 2 projects are better: gone is the single file archive (you still can package them that way for easy sharing via email). Now, each view, model, store is its own file. Designer 2 makes it easier to work in a project team.

In-line documentation

In Designer 2 every component, property and configuration comes with handy in-line documentation, and if you need more there are quick links to go deep in to the API reference.

Caveats for the Beta Release!

We’re excited to share with you our first beta of Designer 2. While we’re excited to see our community give it a whirl, it is still a beta, and there’s still some work left to do. In the following weeks the team will concentrate on two things:

• Further quality improvements of the existing feature set
• Improvements in the user experience and the UI design

Certain features that were not quite ready for the beta have been disabled – don’t worry they’ll be back soon. As of today’s beta, the most notable absence is packaging for mobile devices.

The coming weeks are going to be fundamental to make Designer 2 the application you’ve been waiting for, so we need your feedback. We will be running usability tests to make sure we catch bugs on our own before the official release, but if you find something that doesn’t work as you expected, or think you have an idea that would make the application better, go ahead and let us know. All feedback will be evaluated carefully.

If you’re local to the San Francisco Bay Area, and are interested in participating in the usability testing that we’re doing, we’d love to hear from you. Click here to apply for the usability test.

Since the application is going to improve and change significantly before release, the Designer documentation for beta is very basic. We are releasing an introductory article to get you started, and more material will become available as Designer takes its final shape.

We don’t recommend that you adopt the beta of Designer 2 yet in your production environment. Designer 2 has an auto-update feature, so as we make updates, we’ll be pushing changes directly to the application, and you can choose to accept or decline the updates.

To share your ideas, comments and critiques with us, please use the Sencha Designer 2 forum.

To report bugs, please use the Designer 2 Bug Forum.

Promotions, pricing and availability

We are updating pricing for the product at the launch date: individual copies of Designer will be $399, with discounts for 5 and 20 packs.

Special offer: buy an Ext Designer 1.x License today and take advantage of promotional pricing of $279. Plus, you’ll receive a free upgrade to Designer 2.x License when released. Hurry, this offer ends on March 31, 2012.

Upgrading: if you bought Ext Designer 1.0 after January 1st, 2012, you’re entitled to a free upgrade to Sencha Designer when it ships! In order to get your upgrade license please contact the email address designer.upgrade@sencha.com and we will take care of everything for you.

If you purchased an Ext Designer 1.x license prior to January 1st, 2012, you can upgrade to Designer 2 for $199 from now until March 31, 2012. To take advantage of this offer please email us at designer.upgrade@sencha.com. Note that after March 31, 2012, the upgrade price increases to $279.

Please note that Sencha Complete which will include Designer 2, will remain priced at $999.

So, go ahead, download the Designer 2 beta trial or purchase Ext Designer 1 from the Sencha Store, and share your experiences with us!

.right, .alignright { float: right; margin: 0 0 10px 10px; } .left, .alignleft { float: left; margin: 0 10px 10px 0; }

Hey telerik .net ninjas and ninjettes!

We can’t believe it either – another Telerik release is upon us. Our product group really keeps us, the marketing folks, on our toes at all times. For all of you who are keen on keeping your agendas up-to-date, here is a super early heads up on the Webinar Week schedule, so you can register and block off this time to brush up on all the cool new things coming from Telerik.

At each webinar we will draw a Telerik Ultimate Collection license worth $1999! The Ultimate Collection now contains our newest product – Kendo UI – everything you need to build sites and mobile apps with HTML5 and JavaScript. Participating in the Q&A session, as well as entering the drawing for the big prize, are privileges only for those attending the web events live ;)

Our Webinar Week schedule looks like: 

Date Time Topic Mon, Feb 20   9:30 AM - 10:30 AM What’s New in XAML - RadControls for Silverlight and WPF 11:00 AM - 12:00 PM What’s New in Test Studio
12:30 PM - 1:30 PM What’s New in Data Tools – OpenAccess ORM
  2:00 PM - 2:30 PM What’s New in RadControls for WinForms and Reporting Tues, Feb 21   9:30 AM - 10:30 AM What’s New in ASP.NET 
11:00 AM - 12:00 PM What’s New in Tools for Better Code 
12:30 PM - 1:30 PM What's New in Mobile - RadControls for Windows Phone Wed, Feb 22   9:30 AM - 10:30 AM What’s new in KendoUI 11:00 AM - 12:00 PM What’s new in Sitefinity 5.0
12:30 PM - 1:30 PM What’s new in TeamPulse  .telerik-reTable-4 { border-collapse: collapse; border: solid 0px; font-family: Tahoma; } .telerik-reTable-4 tr.telerik-reTableHeaderRow-4 { border-width: 1.0pt 1.0pt 3.0pt 1.0pt; margin-top: 0in; margin-right: 0in; margin-bottom: 10.0pt; margin-left: 0in; line-height: 115%; font-size: 11.0pt; font-family: "Calibri" , "sans-serif"; width: 119.7pt; background: #4F81BD; padding: 0in 5.4pt 0in 5.4pt; color: #FFFFFF; } .telerik-reTable-4 td.telerik-reTableHeaderFirstCol-4 { padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableHeaderLastCol-4 { padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableHeaderOddCol-4 { padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableHeaderEvenCol-4 { padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 tr.telerik-reTableOddRow-4 { border-width: 1pt; color: #666666; font-size: 10pt; vertical-align: top; border-bottom-style: solid; border-bottom-color: #4F81BD; } .telerik-reTable-4 tr.telerik-reTableEvenRow-4 { color: #666666; font-size: 10pt; vertical-align: top; } .telerik-reTable-4 td.telerik-reTableFirstCol-4 { border-width: 1pt; border-color: #4F81BD; padding: 0in 5.4pt 0in 5.4pt; border-bottom-style: solid; border-left-style: solid; } .telerik-reTable-4 td.telerik-reTableLastCol-4 { border-width: 1pt; border-color: #4F81BD; border-bottom-style: solid; border-right-style: solid; padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableOddCol-4 { border-width: 1pt; border-color: #4F81BD; padding: 0in 5.4pt 0in 5.4pt; border-bottom-style: solid; } .telerik-reTable-4 td.telerik-reTableEvenCol-4 { border-width: 1pt; border-color: #4F81BD; padding: 0in 5.4pt 0in 5.4pt; border-bottom-style: solid; } .telerik-reTable-4 tr.telerik-reTableFooterRow-4 { color: #355C8C; background-color: #FFFFFF; font-size: 10pt; vertical-align: top; padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableFooterFirstCol-4 { border-width: 1pt; border-color: #4F81BD; border-bottom-style: solid; border-left-style: solid; padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableFooterLastCol-4 { border-width: 1pt; border-color: #4F81BD; border-bottom-style: solid; border-right-style: solid; padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableFooterOddCol-4 { border-width: 1pt; border-color: #4F81BD; border-bottom-style: solid; padding: 0in 5.4pt 0in 5.4pt; } .telerik-reTable-4 td.telerik-reTableFooterEvenCol-4 { border-width: 1pt; border-color: #4F81BD; border-bottom-style: solid; padding: 0in 5.4pt 0in 5.4pt; } (All times are Eastern Standard Time)