Title: the title for the application. Only visible in desktop browsers.

theme: allows to assign a fixed theme to the application. If no theme is provided the theme "cupertino" is used on iOS devices and the theme "boston" is used on all other device types.

debug:false|true, when set to true .js files are not compressed and diagnostic information is show in the debug console.

layoutMode:single|split, the split mode allows to show two panels side by side on tablets.

layoutMainMinWidth: in split layoutMode the side panel is automatically hidden if the display width is not sufficient to show the side panel (width 320px) and the main panel side by side. On an iPad with a 1024x768 resolution and the default layoutMainMinWidth = 720 the side panel will be hidden in portrait mode.

chrome:true|false, the App chrome consists of a title bar on top of the App as well as a toolbar at the bottom of the App. When set to false no chrome will be added to the App.

add2home: true|false, allows to disable the Add To Home tip on iOS devices

config: allows to pass arbitrary configuration settings to the App. These settings can be retrieved with the $App.config object (e.g. $App.config.url)

The server component of Tangere.Net is essentially a ASP.NET MVC3 application. The Controller uses Models to retrieve data from data bases and backend systems. Views don’t really exist – the controller sends the “view” data in the JSON format to the Tangere.Net App.

The main logic of the client side resides in a View Model (VM). For each page of the App a View is defined in HTML5. The views are using declarative bindings using a concise, readable syntax to connect with the view model. The VM uses knockout.js to provide also templating and dependency tracking services. The VM retrieves the Model data from backend services. Dependency tracking is used to automatically update the views after any change of the model data or view model state information. So the core architecture of the client site is MVVM.

But the VM doesn’t directly show the views on the device. A “SmartPresenter” uses again dependency tracking to detect changes in the state of the VM. Anytime the state changes the screen of the device is updated to reflect the new state of the VM. The smart part of the Presenter knows if the device is a phone or a tablet and shows the views either on a single page or uses a SplitView to show two views side-by-side on a tablet. The SmartPresenter manages also animated transitions between the views and provides all device specific features (like “Add to Home Screen”).

So what’s the name of the architecture? We have MVC + MVVM + P. But the traditional V of MVC became a MVVMP. So Tangere.Net is probably the first framework with a MCMVVMP architecture – so we desperately need some ideas for a better acronym…