The Isomorphic Blog


Go from Mockup to Code with Reify

We’re big fans of wireframe mockup tools, so we’re excited to announce a new tool that generates SmartClient and Smart GWT code from mockups in one easy step. It’s called Reify – an actual English word meaning “to make something abstract more real or concrete”. Design using a wireframe mockup tool like Balsamiq, then use Reify to instantly transform exported mockups into working screens backed by clean, clear code that follows our best practices.

There are already several tools available that can turn mockups into simple interactive web pages, PDFs, and other formats so they can be more easily shared. That’s not what Reify does.

Instead, Reify deeply analyzes your mockups and produces source code similar to what a developer might write by hand. This allows your team to skip over the phase of painstakingly recreating the UI shown in the mockup, and move directly to adding business logic and data binding.

Watch the Video

Reify Video Thumbnail

Use the tools you already know.

Many teams already use simple wire-framing tools such as Balsamiq to create, edit, and share mockups of new user interfaces as part of the design process. This allows any product manager, business analyst, project manager, or end user to directly contribute to application design using an intuitive tool. Balsamiq also enables your team to host, collaborate and iterate your UX projects on or offline before settling on a design for development.

Don’t re-create. Re-use.

Reify allows you to get much more out of your mockups. Normally, when a mockup is handed off for implementation, your developers needed to laboriously duplicate the mockup in actual code – one screen at a time. This is an enormous waste of time and effort, and typically causes extra iterations as developers inevitably miss subtle but important details. With Reify, you can go straight from a mockup to working code that reproduces your intended design.

Balsamiq mockup imported by Reify

Use Reify with any mockup.

You can benefit from Reify even if your organization doesn’t currently use Balsamiq for mockups. If you receive mockups in another format (such as a file from an image editing tool or HTML page), use Balsamiq to build a new mockup with Reify continuously showing you the resulting screen on the fly. It’s like sketching on a digital whiteboard with an Isomorphic engineer implementing your design in real-time.

How does it work?

In Balsamiq, placing a widget on top of a window or tab is enough for the mockup to look right. However, working applications need to know that a widget is contained by a tab or window, or the wrong thing will happen when the screen is resized or the window dragged.

Reify deeply analyzes your mockup to discover the relationships that are implied by the way you arranged widgets. Containment relationships are automatically discovered, labels are automatically associated with input controls, input controls are automatically grouped into logical forms, and aligned components are grouped into flexible layouts that respond as expected to browser resizes.

Reify even compensates for imprecision in mockups by recognizing that a set of controls is meant to be perfectly aligned even if the mockup is a few pixels off, and recognizing that the intended size of a control is its visible size, not the size of its (invisible) bounding box.

Clean, Extensible Code

Tools that generate code often produce awful results that cannot be meaningfully extended. Reify is different.

Reify outputs screens in Isomorphic’s Component XML format, a concise, declarative format similar to Flash’s MXML or Microsoft’s XAML. Reify makes great efforts to produce clean, minimal code. For example, if a component gets its size from its container, Reify won’t output the redundant size information on the component. More generally, Reify will avoid outputting code that would set a property to its default value.

Screens created by Reify can be connected to real data sources in one step, and event handlers and business logic can be added while keeping the screen definition in XML. This enables a clean separation between layout and logic, and allows non-developers to understand and modify screen layout without breaking business logic.

No Limits

You can easily mix and match between screens imported via Reify and classic hand-coded screens and layouts. For example, if you have created a highly dynamic, portal-style layout manager that couldn’t be built just with XML, you can still use Reify to create portlets, wizards, and other screens controlled by your advanced layout manager.

Or, you can create a screen that has a placeholder for a dynamically generated component, and insert that component programmatically after the Reify-created screen is loaded.

Imported widgets, imported screens, and hand-coded screens using Reify

Reify lets you maintain any part of your application in easy-to-read, easy-to-modify XML, while still allowing advanced, data driven techniques to be used wherever appropriate – the best of both worlds.

Get Started

You can Try Reify online, without installing anything, at the live demo site! Here are two sample mockups so you can try it right now (Sample 1: Resize bars & Layouts; Sample 2: Navigation, Charts). Or, if you’re ready to get started then download our free 60-day trial.

Licensing

  • Reify is available in Smart GWT 3.1 and SmartClient 8.3 Pro Edition and above.
  • Note to existing Smart GWT 2.x Users: 3.x is a paid upgrade for 2.x license holders. Upgrade discounts may vary, and are based upon the date of your last purchase. For a quote please contact sales.

Enhance Reify to meet your needs

Would Reify fit perfectly into your workflow if it had just one more feature? You can have it added! As with our other products, we have a Feature Sponsorship program that allows you to fund development of new features.

Enjoy!

The Isomorphic Team

Why Upgrade from LGPL?

Why Upgrade?

If you’re a user of the free LGPL version of our products, you may be wondering if now is the right time to upgrade to a full version. Most users don’t realize how many immediate benefits come from an upgrade to Pro or above, without the need to rework how your application functions.

This is a rare opportunity to purchase new licenses and optional modules at 30% off until the end of the year. If you are upgrading an existing Pro, Power, or Enterprise license from a previous version, we’ll stack an additional 30% discount on top of the discount you receive for owning a qualifying older license. Contact sales for an upgrade quote today!

Benefits of upgrading to Pro+ Edition

1.  Export to Excel and other formats

Whether you’re using REST-based integration, GWT-RPC or something custom – you can export to Excel and other formats as soon as you install our server .jars and servlets without reworking how your application loads data. This approach, called a “client-driven export”, works with any ListGrid or TreeGrid and only requires a single method call – listGrid.exportClientData().

2.  Print to PDF

Make any printable screen into a .PDF without reworking your application in any way, again using a single method call – RPCManager.exportContent(). Server-side APIs allow you to capture the generated PDF so that you can attach it to email, save it to disk, or whatever else you need. This feature makes any UI you build into a simple “report”, and may obviate the need to install and configure separate reporting packages.

3.  Charts

Pro Edition and above include our HTML5 charting engine, with powerful features like:

You could argue indefinitely about the relative merits of our built-in engine vs. other commercial packages you could integrate into your application. However, any quality add-on from a third party would cost nearly as much as a Pro license, but only give you charts. In addition, you’d have to integrate it yourself with possibly serious technical hurdles around printing, export to PDF, drag and drop with other components, and other things that our built-in charts do automatically.

The charting engine in Pro+ Edition is a no-brainer decision for anyone who currently uses the LGPL Edition and needs charts.

4.  Reify (and other tools)

Reify allows you to transform Balsamiq mockups into working screens backed by clean, clear code. Screens imported via Reify can be added to an existing application without changing its data binding approaches or architecture in any way. Components in Reify screens can connect to RestDataSource or any other type of DataSource, and screens generated in Reify can be placed into layouts and other containers created in a normal hand-coded application.

 Reify lets you keep everything you’ve already built, and add new functionality with a radically improved and more efficient process.

5.  Peace of mind

Many corporate legal departments are allergic to OSS licenses and would prefer to see a standard commercial license. But, perhaps more importantly, any innovative company today is exposed to tremendous risk from “patent trolls” – litigious companies that holding dubious patents and make a business out of suing other companies. Legal defense costs can easily run into the millions, even when the lawsuit is baseless.

    • Do you have staff that can provide clear evidence that a web-related patent is invalid due to prior art?
    • If the best option is to give in and settle even when you’re in the right, are you prepared to create and maintain a fork of our products in order to avoid the bogus patents at issue?

Among other “peace of mind” terms, Enterprise licenses allow you to secure Isomorphic’s future assistance in such matters before the issue comes up.

More benefits in the future

These are just the immediate benefits you get from upgrading to Pro+ Edition, without reworking any of your existing code. Longer term, you can incrementally switch over to using more features, still with a minimum amount of rework.

For example, you can convert a RestDataSource or other client-side DataSource to a server-based DataSource, but still use DMI to call existing business logic. This gives you access to a wide variety of server features, including; Declarative Security, Server-side Validation, and Transaction Chaining and allows you to delete a lot of repetitive, “boilerplate” code. This approach leaves your actual business and persistence logic intact and unchanged, and can even be done on an incremental, screen-by-screen or DataSource-by-DataSource basis.

How to make it happen

Are you an engineer wishing you could use the more advanced versions of our software, and frustrated by your company re-implementing the features of Pro+?  Out of the features above, we feel that the Reify tool and this intro video will play best with management, but don’t discount the power of argument #5 (Peace of Mind). Strange as it may seem, raising the legal and risk-related benefits of a relationship with Isomorphic may be the way you get the upgrade you want.

Now is the perfect time to buy one of our commercial licenses and super-charge your applications, so don’t delay. Buy online, or contact sales for a quote today!

Enjoy!

The Isomorphic Team

Smart GWT 3.1 / SmartClient 8.3 Released and 30% off Holiday Sale

We are pleased to announce that Smart GWT 3.1 and SmartClient 8.3 have been released! In celebration of the release, you have the opportunity to purchase new licenses or upgrade existing licenses at 30% off until the end of the year.

The new release is a massive leap forward, and includes a dizzying array of new features. The list below only includes the major new features, so please see the changelog.html file in the SDK for a complete rundown of the latest features, bug fixes, and enhancements.

Download the new releases today!

Feature List

Dual-Axis HTML5 Chart

Example of Dual-Axis HTML5 Chart

  • Cell-Level Selection:  ListGrid now supports cell-level selection by setting canSelectCells:true. Click and drag to highlight blocks of cells, and select or deselect individual cells in the grid.
  • Excel Copy and Paste:  Copy and paste tabular data between Grids and Excel (or similar spreadsheet applications). Grid to Excel, Grid to Grid, and Excel to Grid copy and paste are all supported.
  • Timeline:  A Calendar widget for visualizing schedules, assigning tasks, or other horizontal displays of time-based information. Timeline supports drag to move or re-size events, hover for more detail, and editing by clicking events in the timeline.
Timeline Calendar Widget

Timeline

  • Component XML Improvements and Documentation:  Define screens or parts of screens in XML, including on-the-fly loading from dynamic storage such as a database. Complete with simplified APIs and more comprehensive documentation.
  • More Powerful SimpleTypes:  SimpleTypes previously allowed you to define a reusable atomic field type such as a zipCode or emailAddress. The SimpleType API can now define custom sorting and filtering behaviors, and the underlying stored value can be a custom object rather than just an atomic type such as String.
  • RTL Support:  RTL stands for “right-to-left” and is a key component when delivering an application in a language such as Hebrew or Arabic. RTL mode will horizontally flip the content layouts and ordering so that layouts reverse stacking order and show scrollbars to the left of every window.
  • CSS3 skins:  Existing skins have been upgraded with a ‘CSS3 mode’. CSS3 skins have the same look and feel as current skins on modern browsers, but use radically less media, have a simpler Document Object Model (DOM) for faster rendering, and are easier to modify.
  • Gauge Widget:  Speedometer-like display with configurable sectors, tick marks, labels, needle position and colors based on the Drawing module.
Gauge Widget

Gauge Widget

  • Scatter Charts:  Scatter charts show data sets with two continuously varying axes, such as plotting the age and weight of a set of people. In addition, multiple data sets can now be shown in different colors.
  • Multi-Select ComboBox:  This new control combines the type-ahead completion interface of a classic ComboBox with multiple item selection. Several options are provided for displaying previously chosen items, allowing the control to fit in a variety of different contexts. Load-on-demand is supported for working with large data sets.
  • Selenium Upgrades:  Scripts recorded in the Selenium IDE now insert intelligent, automatic waits. This eliminates the need to insert manual wait commands into recorded scripts, or run scripts with long delays between commands.
  • Row Spanning Cells in Grids:  Grids will now allow cells to span multiple rows, providing a handy way to visually emphasize aggregation, or common values between rows.
  • Fiscal Year Awareness:  You can now declare a fiscal calendar to be used throughout your application, and date pickers will present an enhanced interface oriented toward weeks of the fiscal year.
  • CubeGrid Single-Axis Load on Demand:  The CubeGrid has the ability to load data on demand, and also has the ability to automatically hide empty rows or columns in an incomplete data cube (where not all dimension values can be crossed with all other dimension values). However, until now these two capabilities were mutually exclusive: we couldn’t determine if a row was empty without complete data.
  • Improved HTML5 Charts:  Printing support including export to PDF, built-in hovers, examples of adding your own elements and interactivity, new ‘skinning’ API’s to enhance control over fonts, colors, shadows and more.

You can learn more about Smart GWT 3.1 and SmartClient 8.3 in our Feature Roadmap and Release Candidate announcements. As always, please send us any bug reports or feedback in the Forums. Please be clear about what product and version you’re using when reporting issues.

30% Sale Pricing

*Starting on release day, ending on 12/31/2012.

LGPL PRO POWER ENTERPRISE
Free $522 $745 per developer
(30% off)
$1365 $1950 per developer
(30% off)
Choose: Per Developer
or Per CPU
or Flat Rate
Download Now
Free
Download Now
Free, Full-Featured 60-day trial
Download Now
Free, Full-Featured 60-day trial
Download Now
Free, Full-Featured 60-day trial
Buy Now
1 Pro License
$522
$745
(30% off)
Buy Now
1 Power License
$1365
$1950
(30% off)
Get Quote
Ready to buy?
Buy Now
4 Pro Licenses
$2086
$2980
(30% off)
Buy Now
4 Power Licenses
$5460
$7800
(30% off)
Buy Now
10 Pro Licenses
$5215
$7450
(30% off)
Buy Now
10 Power Licenses
$13650
$19500
(30% off)
  • To order an upgrade from a previous version and for more options, please contact sales.
  • For more information about how our licenses work, please see the Product & Licensing FAQ.

Download Smart GWT 3.1 or SmartClient 8.3 to get started using our new features today!

Enjoy!

The Isomorphic Team

Announcing Smart GWT 3.1 / SmartClient 8.3 Release Candidate, New Features

We’re pleased to announce that SmartGWT 3.1/SmartClient 8.3 has officially achieved ‘release candidate’ status. We’ve seen zero release-blocking bugs multiple times in the last week, so we expect the upcoming final version to be released in 2-3 weeks. As a result, we recommend that anyone currently developing with Smart GWT 3.x or SmartClient 8.x switch over to the new release now unless you’re on the verge of completing your application.

Please use the following links to download the new release:

Please Note: There isn’t any special build labeled “RC”. In order to get the release candidate, please download the latest 3.1d or 8.3d nightly builds.

In addition, we’ve added several new major features since our last roadmap announcement, and listed them below.

New Features

  • Multi-Axis HTML5 Charts

    HTML5 Charts now support multiple vertical axes, each with their own gradations. These types of charts can be used to show values with different units (e.g. sales in dollars vs. total units shipped), and/or very different ranges (e.g. gross revenue vs. profit) on the same chart.

    Triple-axis and quad-axis charts are also supported, and it’s now possible to render data in any mix of styles (e.g. lines over columns over area).

    Dual-Axis HTML5 Chart

    Example of Dual-Axis HTML5 Chart

  • Scatter Charts

    Scatter charts can now show data sets with two continuously varying axes, such as plotting the age and weight of a set of people. In addition, multiple data sets can now be shown in different colors.

    Scatter Chart Upgrade

    Example of Scatter Chart Upgrade

  • Multi-Select ComboBox

    This new control combines the type-ahead completion interface of a classic ComboBox with multiple item selection. Several options are provided for displaying previously chosen items, allowing the control to fit in a variety of different contexts. Load-on-demand is supported for working with large data sets.

    MultiComboBox in "flow" mode

    Example of MultiComboBox in “flow” mode

    MultiComboBoxItem "Vertical Reverse" mode

    Example of MultiComboBoxItem in “vertical reverse” mode

  • Selenium Upgrades

    Scripts recorded in the Selenium IDE now insert intelligent, automatic waits. This eliminates the need to insert manual wait commands into recorded scripts, or run scripts with long delays between commands.

    The automatically inserted wait commands are also smarter. Rather than just waiting for DOM elements to appear, they understand application-level concerns such as waiting for modal operations to complete before proceeding.

    A greatly expanded Using Selenium user guide covers best practices, using custom commands, advanced APIs, running Selenium under JUnit and more.

  • Multi-Level HeaderSpans (with auto-fitting)

    You can now have as many levels of ‘header spans’ as you like (not just two). Header spans also support auto-fitting to titles.

  • Composite Primary Keys

    ListGrid editing now supports DataSources with ‘composite’ primary keys, meaning two or more fields can be required to uniquely identify a record.

    Server-side, SQL, JPA and Hibernate connectors also support composite keys.

  • Row Spanning Cells in Grids

    Grids will now allow cells to span multiple rows, providing a handy way to visually emphasize aggregation, or common values between rows.

  • Fiscal year Awareness

    You can now declare a fiscal calendar to be used throughout your application, and date pickers will present an enhanced interface oriented toward weeks of the fiscal year.

  • CubeGrid Single-Axis Load on Demand

    The CubeGrid has the ability to load data on demand, and also has the ability to automatically hide empty rows or columns in an incomplete data cube (where not all dimension values can be crossed with all other dimension values). However, until now these two capabilities were mutually exclusive: we couldn’t determine if a row was empty without complete data.

    A new setting:

    hideEmptyAxis: "row" | "column"

    allows you to declare that load-on-demand will be used for only one axis so that empty rows or columns on the other axis can still be automatically hidden.

  • More HTML5 Charts Upgrades

    A new setting:

    showValueOnHover

    can be enabled to show the value nearest to the mouse pointer when a user hovers over a chart.

    Overlays use our general-purpose Drawing API to show additional graphical elements on top of a chart. A sample of this has been added under Charting -> Adding Elements.

    Export to PDF is now supported for IE8 and earlier.

  • RTL Support

    Adds support for languages that are read from ‘right-to-left’, such as Hebrew or Arabic. Previously announced as a 3.x / 8.x feature, we can now confirm that this is a supported capability for the 3.1 / 8.3 release.

A Note for Smart GWT customers with 2.x Licenses

Smart GWT 3.x is a paid upgrade for Smart GWT 2.x license holders, and upgrade prices are based upon the date of your previous purchase. If you bought 2.x recently you may be eligible for a significant discount, so don’t delay. Get access to the entire 3.x series by upgrading today. For a quote, please contact sales.

As always, please send us any bug reports or feedback in the Forums. Please be clear about what product and version you’re using when reporting issues.

Download Smart GWT 3.1 or SmartClient 8.3 to get started using our new features now!

Enjoy!

The Isomorphic Team

Connecting the CubeGrid with Pentaho Mondrian, JasperReports and Microsoft Analysis Services

Why use the CubeGrid?

Popular Online Analytical Analytical Processing (OLAP) server technologies such as Pentaho Mondrian Project, JasperReports, and Microsoft SQL Server Analysis Services (SSAS) enable business users to analyze large quantities of data, offering features such as drilling into and cross-tabulating information from complex analytical queries in real-time. However, the default user interfaces (UIs) are limited, and it can be difficult or impossible to add the additional behaviors that are typically needed when integrating with a larger application. Connecting CubeGrid APIs to these multidimensional, or ‘cube’, data sources will allow you to:

  • Create a more powerful and higher performance UI to replace the built-in UIs, and

  • Seamlessly integrate custom OLAP interfaces into your larger applications.

The CubeGrid is a high-end data analysis engine that wraps OLAP functionality into a single Smart GWT or SmartClient interactive grid component for fast access to multidimensional data and calculations. Please see our previous post, Introducing the CubeGrid, for more information about the advanced OLAP features in our Analytics Module.

This article explains how to connect the CubeGrid user interface to several common sources of cube data using MDX, XMLA, and OLAP4J.

  • MDX (MultiDimensional eXpressions) is a query language for multidimensional databases, in the same way SQL is used to query relational databases.
  • OLAP4J is an open Java API for OLAP, similar to JDBC, but specifically created to access multidimensional datasets.

Server Technology Overview

  • Pentaho Mondrian Project (Community Edition) is an open source OLAP server written in Java and available under the Eclipse Public License (EPL). Mondrian enables interactive analysis of very large datasets stored in SQL databases without writing SQL. It supports the MDX (multidimensional expressions) query language, plus the XMLA and OLAP4J interface specifications. It reads from SQL (and other data sources) and aggregates data in a memory cache.
  • JasperReports Server (Community Edition) is an open source, stand-alone and embeddable OLAP reporting server written in Java and available under the GNU General Public License (GPL). JasperReports Server enables delivery of information on a real-time or scheduled basis to the web, printers, or a variety of file formats, including; PDF, HTML, Microsoft Excel, RTF, ODT, XML, or comma-separated values. JasperReports Server uses the same Mondrian OLAP engine as Pentaho Mondrian Project, and can be integrated with the CubeGrid using a similar methodology.
  • Microsoft SQL Server Analysis Services (SSAS) is available as a part of Microsoft SQL Server, a proprietary RDBMS written in C++ and sold in a wide variety of commercial and free editions. SQL Server Analysis Services adds OLAP and data mining capabilities for SQL Server databases. Microsoft’s OLAP engine supports MOLAP, ROLAP and HOLAP storage modes for data, and supports the XMLA standard as the underlying communication protocol. Cube data can be accessed using MDX and LINQ queries, and data mining specific functionality is exposed via the DMX query language.
OLAP Server Company Version Language License
Pentaho Mondrian Server Pentaho 3.4.0 Java EPL
JasperReports Server JasperSoft 4.5.0 Java GPL
Microsoft SQL Server Microsoft 2012 C++ Proprietary

Connecting the CubeGrid

Multidimensional data sets are called Data Cubes, which consist of features or attributes called Dimensions.  Each corresponding Dimension will also have feature values or attribute values called Members. These definitions have analogous nomenclature in the CubeGrid, as shown in the table below:

OLAP CubeGrid Definition
Data Cube Cube Multidimensional dataset
Dimension Facet Dimension, attribute, or feature
Member Facet Value Dimension member, attribute value, or feature value

On the server side, we first need to set up our DataSources to fetch the necessary data. We have four Java Classes for our DataSources:

  • OLAPDataSourceCubes gets all available Data Cubes in the OLAP database.
  • OLAPDataSourceDimensions gets all available Dimensions for the selected Data Cube (for placement on rows or columns in the CubeGrid).
  • OLAPDataSourceMembers gets all available Members for the selected Dimension, with only one call to the server.
  • OLAPDataSource gets all available data with a query based on the MDX Object Model.

The selected Data Cube and Dimensions are sent from client to server as criteria obtained from DSRequest.

Lastly, the DBConnection Java Class is required for connection to the chosen OLAP server. There are three variations of the getConnection() method:

  • getConnection() creates an OLAP connection to Mondrian server by default. For this example, we used the “FoodMart” sample dataset included with Mondrian.
  • getConnectionJasper() creates an OLAP connection to JasperReports Server. To use this method, first rename getConnectionJasper() to getConnection(). For this example, we used the sample dataset included with JasperReports Server.
  • getConnectionAServices() creates an OLAP connection to Microsoft Analysis Services. To use this method, first rename getConnectionAServices to getConnection(). For this example, we used the Adventure Works samples referenced below.

On the client side, we already have the code required to interface with the CubeGrid. This is very similar to the Advanced Cube sample in the Showcase, except that Data Cubes, Dimensions and associated Members are fetched dynamically.

The software versions used in this sample are:

Download the project source code used in the examples here.

Examples

Lastly, we’ll show a few images of the Project in action.

Figure 1: Creating the CubeGrid from a connected OLAP server (from left to right)

  • Opening screen for Data Cube selection
  • Select Data Cube from the OLAP Server
  • Select Dimensions (Facets) of the Data Cube for placement on rows and columns
  • Select ‘Create CubeGrid’
Creating the CubeGrid

Figure 1: Creating the CubeGrid

Figure 2: The newly created CubeGrid with Control Panel for Dimension (Facet) manipulation

Opening Screen for the CubeGrid

Figure 2: Opening Screen for the CubeGrid

Figure 3: View Members (Facet Values) of selected Dimensions (Facets) using the Control Panel

View Members of selected Dimensions in the CubeGrid

Figure 3: View Members of selected Dimensions in the CubeGrid

Figure 4: Reposition Dimensions (Facets) on the fly for alternate views

Alternate View of the CubeGrid

Figure 4: Alternate View of the CubeGrid

Note that the UI shown above is built out of ordinary SmartGWT components such as ListGrids and Menus (and of course the CubeGrid). This means that, unlike the pre-built UIs bundled with OLAP products, the UI shown above can be easily rearranged and extended. For example, you could add context menus that launch application-specific actions when the user right-clicks on data or dimension values.

Please Note: Some Dimensions in the test cubes are very large and not collapsible due to their non-hierarchical nature. For example, the ‘Customers’ dimension in the ‘Sales’ cube sample for Mondrian shows all values. As a result, the cube may become difficult to navigate or show a slow scripts browser warning. The recommended way to avoid this is to require that the end user choose specific members from large dimensions before adding them to the cube.

Pre-requisites

  • The sample application shown above is open source and free to use. You can download the project source code from the wiki page describing this integration.

Download the Smart GWT or SmartClient Evaluation to get started using our advanced analytics today!

Enjoy,

The Isomorphic Team

Advanced HTML5 interfaces for .NET

If you’re a .NET developer or you know a .NET developer, you may have heard about the confusing situation facing enterprise web developers on the .NET platform:

SmartClient and Smart GWT provide the powerful HTML5 components needed to build modern business web applications, and now we have provided a free sample server implementation for ASP.NET MVC, with an extensive, multi-part tutorial showing how it works!

The server implementation & tutorial cover:

  1. Using NHibernate to implement all CRUD operations (create, retrieve, update and delete) with a REST interface
  2. Implementing data paging / load-on-demand
  3. Supporting search and sort: both simple criteria and AdvancedCriteria
  4. Using transactions for interactions like multi-row editing in a grid
  5. A data-driven approach that can access new NHibernate entities without writing any code

This server implementation works with the free, open source, LGPL Edition of SmartClient or Smart GWT, so the entire client and server solution is free and open source.

Further, commercial support is also available – there is no need to buy a license, and we can help you with the sample server code as well.

To view the tutorial and download the server code as a Visual Studio project, start here:

http://wiki.smartclient.com/display/Main/Integrating+with+ASP.Net+MVC

To find out more about our Support offerings and sign up, start here:

http://www.smartclient.com/services/index.jsp#support

Enjoy!

The Isomorphic Team

CSS3 Mode

What is it?

Our three most commonly used skins (Enterprise, Enterprise Blue and Graphite) now have a “CSS3 mode” that replaces almost all images required for the skin with CSS3 settings that look nearly identical to the image-based appearance. This results in a performance boost both through a simplified Document Object Model (DOM) and by loading far fewer images than before.

CSS3 mode is used by default in modern browsers such as Firefox, ChromeSafari and Internet Explorer 9+. However, Internet Explorer 8 and earlier do not have sufficient CSS support to closely match the existing image-based skin, so CSS3 mode is not enabled by default. If CSS3 mode is manually enabled for earlier IE, this will result in a degraded appearance that is similar across IE6, 7, and 8. For example, rounded elements such as tabs will become square, and gradient backgrounds will have subtly lower quality due to IE’s lack of CSS color stop support.

How does it work?

To override the default decision on whether to use CSS3 support, set the JavaScript global variable <code>isc_css3Mode</code> before any of the SmartClient libraries are loaded. For example:

<script>isc_css3Mode = "on";</script>

There are three CSS3 mode settings:

  • “supported”

    (default setting) CSS3 mode will only be used for fully supported browsers (including rounded edges and full gradient support)

  • “on”

    CSS3 mode will always be used for all browsers

  • “off”

    CSS3 mode will never be used for all browsers

If you want more control than these settings provide, you can create a custom skin based on one of the above three skins and modify load_skin.js. The JavaScript variable useCSS3 defined in load_skin.js controls whether CSS3 mode is used.

A Note for Internet Explorer 9:  We are working on improving IE9 support with the limited CSS3 features provided by this browser. However, the well-published workarounds for IE9′s CSS3 bugs create other bugs of their own that are, as yet, unresolved.

Examples

In the examples below, images rendered with CSS3 mode “on” or “off” are basically identical without a magnifying glass.

SmartClient "Hello World" buttons with CSS3 mode turned on or off.

Hello World

Editing HTML example with CSS3 mode "on" (Enterprise skin)

Editing HTML with CSS3 mode “on” (Enterprise skin)

Editing HTML example with CSS3 mode "off" (Enterprise skin)

Editing HTML with CSS3 mode “off” (Enterprise skin)

For more information, please download the latest Smart GWT 3.1d or SmartClient 8.3d nightly builds. SmartClient Documentation can be found in the SmartClient Reference under Concepts >> Skinning / Theming.

Licensing

  • CSS3 mode will be available for Smart GWT 3.1 and SmartClient 8.3 (coming soon).
  • A Note for Smart GWT customers with 2.x Licenses: Smart GWT 3.x is a paid upgrade for Smart GWT 2.x license holders, and upgrade prices are based upon the date of your previous purchase. If you bought recently you may be eligible for a discount. Get access to the entire 3.x series by upgrading now! For a quote, please contact sales.

As always, please send us any bug reports or feedback in the Forums. Please be clear about what product and version you’re using when reporting issues.

This feature is nearly complete and can be evaluated now in our Smart GWT 3.x and SmartClient 8.3x nightly builds, complete with samples and documentation. Download Smart GWT 3.x or SmartClient 8.x to get started using this new feature today!

Enjoy!

The Isomorphic Team

Server Scripting

What is it?

Server Scripting allows you to embed code snippets directly in DataSource XML (.ds.xml) files for implementation of simple server-side business logic. These code snippets, or “scriptlets”, enable you to insert code right next to the affected definition without having to create a separate file or class to hold the logic. This simplifies development and speeds up testing by eliminating the need to compile and restart. You can write scriplets in any JSR 223 compatible language, including Java itself, as well as other languages such as Groovy, JavaScript, Velocity, Python, Ruby, Scala or Clojure.

Why use it?

Scriplets have several major advantages over using <serverObject> to call a normal Java method.

  • Simplicity and Clarity

    Scriptlets put business logic right next to the relevant persistence operation instead of in a separate .java file.

  • Faster Development Cycle

    Scriptlets are compiled and executed dynamically, so you don’t need to recompile or redeploy server code to try out changes. Just edit your DataSource, then reload the page or retry the operation. Our framework will automatically detect the modified DataSource and uses the updated scriptlet. Note that scriplets are only recompiled when you change them, so they’ll only be compiled once in the final deployment of your application.

Java as a “scripting language”

The ability to use Java as a “scripting language” is particularly powerful:

  • Developers do not have to know more than one language to work with the code for your application.
  • Scriptlets can easily be moved into normal .java files if they are identified as reusable, become too large to manage in a .ds.xml file, or if the (small) performance boost of compiling them to .class files is desired.  There is no need to translate from some other language into Java.

For these reasons we recommend using Server Scripting with Java – even for teams that would not normally consider adopting a “scripting language”.

Examples

The two primary use cases for server scripting are:

  • DMI Scriptlets

    Direct Method Invocation (DMI) scriptlets are declared by adding a <script> tag to an <operationBinding> or <DataSource> tag.  Like DMI logic declared via <serverObject>, DMI scriptlets can be used to add business logic by modifying the DSRequest before it is executed, modifying the default DSResponse, or taking other, unrelated actions.

  • Scriptlet Validators

    Scriplet Validators are declared by adding a <serverCondition> tag to a <validator> definition.  Like a validator declared via <serverObject>, a scriptlet validator defines whether data is valid by running arbitrary logic, then returning true or false.

For example, the following DMI scriptlet enforces a security constraint where all operations on the DataSource will involve the sessionId so a user can only view and modify their own records.

Example of Direct Method Invocation (DMI) scriplet code

DMI Scriplet example

There is no need for a formal class or method definition even though Java is used – the context of a DMI Script is always the same, and the Server Scripting system avoids the need to add this “boilerplate code”.

For more information and examples, please download the latest Smart GWT 3.1d or SmartClient 8.3d nightly builds.

  • Detailed examples for both Smart GWT and SmartClient can be found in the Examples folder under Server Examples >> Server Scripting.
  • SmartClient Documentation can be found in the SmartClient Reference under Concepts >> Server Scripting.
  • Smart GWT Documentation can be found in the JavaDoc under com.smartgwt.client.docs.ServerScript.

Pre-requisites

  • Server Scripting will be available in Pro Edition and above for Smart GWT 3.1 and SmartClient 8.3 (coming soon).
  • A Note for Smart GWT customers with 2.x Licenses: Smart GWT 3.x is a paid upgrade for Smart GWT 2.x license holders, and upgrade prices are based upon the date of your previous purchase. If you bought recently you may be eligible for a discount. Get access to the entire 3.x series by upgrading now! For a quote, please contact sales.

As always, please send us any bug reports or feedback in the Forums. Please be clear about what product and version you’re using when reporting issues.

This feature is nearly complete and can be evaluated now in our Smart GWT 3.x and SmartClient 8.x nightly builds, complete with samples and documentation. Download Smart GWT 3.x or SmartClient 8.x to get started using this new feature today!

Enjoy!

The Isomorphic Team

Announcing SmartGWT.mobile beta

What is SmartGWT.mobile?

We’re very pleased to announce the release of SmartGWT.mobilebeta, our long-awaited mobile framework based on the Google Web Toolkit (GWT). It contains a complete set of visual widgets and data binding services created for building mobile applications.

SmartGWT.mobile is designed primarily for building extremely lightweight applications for smartphones.  Through advanced use of HTML5 and CSS3, SmartGWT.mobile applications look and feel exactly like native mobile applications, but use almost no images, resulting in a minimal download size. SmartGWT.mobile also makes use of GWT’s ability to trim the delivered size of an application to just the components the application actually uses, resulting in smaller downloads and minimum resource requirements.

SmartGWT.mobile and Smart GWT use the same server technology.  DataSources and server business logic defined in either technology can be immediately reused with the other, with no new coding required.  Like Smart GWT, SmartGWT.mobile can also be integrated with third-party server technologies via REST services.

The UI components of SmartGWT.mobile have the same Java API as Smart GWT’s UI components, resulting in quicker learning as well as both conceptual and code re-use between your desktop, tablet and mobile applications.

Why use SmartGWT.mobile?

  • Ease of Development

    Use Java and Eclipse to write mobile applications

    SmartGWT.mobile is based on GWT, which means you can write your application in Java using Eclipse, even using step-through debugging to troubleshoot.  You never have to learn the idiosyncrasies of HTML and JavaScript behavior on different devices because that’s handled by the framework – just write Java.

  • Single Codebase

    Works across multiple devices, web or installed

    SmartGWT.mobile lets you deliver to a variety of smartphones devices from a single codebase, instead of using 4-5 different sets of tools and technologies to build mobile apps for each major platform.

    SmartGWT.mobile applications can also be packaged with technologies such as PhoneGap or Titanium to create installable native applications that have access to on-device resources such as a user’s address book or photos.

  • Native Look and Feel

    Through advanced use of CSS3 and HTML5 techniques, SmartGWT.mobile applications look and feel exactly like native mobile applications, even replicating smooth 3D animations and screen transitions.

    SmartGWT.mobile comes with multiple skins that replicate the native look and feel of different devices, and also allow you to “tint” the skins to achieve a unique look that still feels like a native app.

  • Minimum Application Size

    Mobile applications need to be as lightweight as possible in order to download quickly and run smoothly on smartphone devices.

    Advanced use of CSS3 techniques means your application has an extremely rich look and feel, yet uses almost no images, making it download much faster and feel more responsive.

    Using GWT means that your application only downloads the specific widgets and features you actually use, automatically handling an important optimization process you would otherwise have to perform by hand.

  • Deep server framework

    Shared for desktop and mobile

    SmartGWT.mobile provides instant integration with the Smart GWT Server Framework, a powerful and mature framework for simplifying the development of the server side of Java web applications.

    By leveraging a common server framework and client data services architecture, data services you create for the desktop version of your application are immediately accessible in the mobile version, and vice versa.

Screenshots

SmartGWT.mobile screenshots

SmartGWT.mobile Screenshots

Getting Started

The Showcase included in the SmartGWT.mobile SDK is available at the URL below.  Please note that SmartGWT.mobile supports mobile browsers only – certain non-mobile browsers are intended to be used for testing purposes (see details in user_guide.txt) but it is expected, for example, that IE8 will not work at all.

http://smartgwt-mobile.smartclient.com/

During the beta period, you can download the SmartGWT.mobile SDK here:

http://smartgwt-mobile.smartclient.com/downloads/smartgwt-mobile-1.0.zip

Please start by reading user_guide.txt, which covers installation & usage as well as explaining when to use Smart GWT vs. SmartGWT.mobile.

Both the public showcase and downloadable SDK will be periodically refreshed during the beta period.  See the release_notes.html file in the .zip for changes.

Licensing

SmartGWT.mobile is being released under the GNU Lesser General Public License (LGPL), the same license as Smart GWT LGPL.

Source code will be available in this SmartGWT.mobile Google Code project:

http://code.google.com/p/smartgwt-mobile/

But we’re not done yet.  There is also no Maven support, and there are many improvements we plan to add over the coming months. As always, please send us any bug reports or feedback in the Forums.

Download SmartGWT.mobile to get started using our new features today!

Enjoy!

The Isomorphic Team

Smart GWT 3.1 / SmartClient 8.3 Feature Roadmap

While it’s only been a short while since our last product announcement, we certainly haven’t been sitting idle. We’re very excited to share a few of the great things we’ve been working on for the next release of Smart GWT and SmartClient. If there’s a feature you’ve been wishing for and it’s not on this list, please keep in mind that it’s always possible to influence our roadmap through Feature Sponsorship.

So, without further ado, here are the new features committed for Smart GWT 3.1 / SmartClient 8.3 that are coming soon.

New features

    • Printing with PDF export for all desktop browsers (except IE8 and earlier).
    • Automatic handling of negative and discontinuous values (gaps in lines).
    • New ‘skinning’ APIs to enhance control over fonts, colors, shadows and more.
Improved HTML5 Charts

Improved HTML5 Charts

  • Cell-Level Selection

    the ListGrid now supports cell-level selection by setting canSelectCells:true. Click and drag to highlight blocks of cells, and select or deselect individual cells in the grid.

    Cell-Level Selection in Listgrid

    Cell-Level Selection in Listgrid

  • Gauge Widget

    Speedometer-like display with configurable sectors, tick marks, labels, needle position and colors based on the Drawing module.

    Gauge Widget

    Gauge Widget

  • Excel Copy and Paste

    Copy and paste tabular data between Grids and Excel (or similar spreadsheet applications). Grid to Excel, Grid to Grid, and Excel to Grid copy and paste are all supported.

    Excel Copy and Paste

    Excel Copy and Paste

  • Timeline

    a Calendar widget for visualizing schedules, assigning tasks, or other horizontal displays of time-based information. Timeline supports drag to move or re-size events, hover for more detail, and editing by clicking events in the timeline.

    Timeline Calendar Widget

    Timeline

  • Component XML improvements & Documentation

    Component XML allows you to define screens or parts of screens in XML, including on-the-fly loading from dynamic storage such as a database.  Smart GWT 3.1 / SmartClient 8.3 also offers simplified APIs and more comprehensive documentation.

    Component XML Improvements

    Component XML Improvements

  • More Powerful SimpleTypes

    SimpleTypes previously allowed you to define a reusable atomic field type such as a zipCode or emailAddress.  New in 3.1/8.3, the SimpleType API can now define custom sorting and filtering behaviors, and the underlying stored value can be a custom object rather than just an atomic type such as String.

  • Simplified Localization for Server-Based DataSources (.ds.xml files)

    Directly configure localized field titles and error messages in your .ds.xml file. This is an improvement over the previous process that involved treating .ds.xml files as .jsps.

Coming soon

In addition, here is another new feature just on the horizon that is committed for a future release of Smart GWT 3.x/SmartClient 8.x:

  • RTL Support

    RTL stands for “right-to-left” and is a key component when delivering an application in a language such as Hebrew or Arabic. RTL mode will horizontally flip the content layouts and ordering so that layouts reverse stacking order and show scrollbars to the left of every window. Astute users may have noticed that nightly development builds already have greatly improved RTL support. Official RTL support will be announced later this year.

Previously announced

  • CSS3 skins

    Existing skins have been upgraded with a ‘CSS3 mode’. CSS3 skins have the same look and feel as current skins on modern browsers, but use radically less media, have a simpler Document Object Model (DOM) for faster rendering, and are easier to modify.

  • Server Script Blocks

    Embed code snippets directly in .ds.xml files for server-side business logic. Use Java or any other language that can run in a Java Virtual Machine (JVM); including Groovy, server-side JavaScript, Python, Ruby, Scala and Clojure.

  • *Workflow System

    Loadable XML workflow definitions that can handle multiple steps of user interaction and server contact, making multi-step wizards entirely declarative (*This feature is committed for inclusion in SmartClient only).

Although many of these features are functional now, if you’d like to begin working with them we recommend signing up for a Jump Start program. As always, please send us any bug reports or feedback in the Forums. Please be clear about what product and version you’re using when reporting issues.

These features are nearly complete and can be evaluated now in our Smart GWT 3.x and SmartClient 8.x nightly builds complete with samples and documentation. Download Smart GWT 3.x or SmartClient 8.x to get started using our new features today!

A Note for Smart GWT customers with 2.x Licenses

Smart GWT 3.x is a paid upgrade for Smart GWT 2.x license holders, and upgrade prices are based upon the date of your previous purchase. If you bought recently you may be eligible for a discount. Get access to the entire 3.x series by upgrading now! For a quote, please contact sales.

Enjoy!

The Isomorphic Team

Page 2 of 6«12345»...Last »