It’s been a long time…
…we shouldn’t have left you without a dope beat to step to… but now we are back! And we are very proud to announce the release of The-M-Project v1.3. We’ve been working on this one for quite a long time. Lots of experiences we gained with customer projects are combined within this release.
When taking a look at this release you might think: Well, where’s the big changes? Where is the “one more thing” kind of thing? But once you scanned through the changelog and started working with this version, you will notice that there are lots of improvements and fixes that will help you making your applications even better.
Speaking of the omega replica changelog, what’s part of the v1.3?
- Support for jQuery Mobile v1.2
- Add valueBinding to selectionListView
- Fixed input tap delay
- Fixed Android Chrome scrolling
- Added M.ToggleSwitchView
- Added isPersistent flag to Toolbar
- Fixed multiple selection dialog mode on ipad
- Bugfix if a browser does not support localStorage
- Fixed problem with BB devices and keyUp event
- Fixed issues with list item and multiple buttons
- Fixed a bug with keyUp event an initial text
- Fixed a bug with image view and the load event
- Fixed a bug with M.WebView and Android+Cordova (render pseudo div and push iframe dynamically)
- Set the current list item value to the view value. This enables for example to get the value/contentBinding of a list item in a template view.
- Fixed an issue with the debugMode flag and M.Logger (thx to wherati)
- Added M.ImagePreloader component and linked it with espressos preloading part to auto-load all images on startup if enabled via config.json.
- Refactored internal id/model_id behaviour of list item ids passed when a list item is selected.
- Disabled the automatic positioning of buttons within a list item view applied by jQuery Mobile.
- Added updateListItemView to M.ListView.
- Minor performance improvement for M.LoaderView (cached selector).
- Fixed inconsistency bug with selection list in single_selection_dialog mode.
- Added iconSize property to M.MapMarkerView.
- Added auto-destroy on DOM remove especially for list items
Ehm, ok. But now give me some details
You all know the contentBinding feature we got from day one. With this feature, a view can be bound to a controller’s property. Everytime this property changes, the view gets updated automatically based on the content of that property. This features is very handy if you have e.g. a form view that display a person record. If this record changes, the view gets informed immediately and the form displays the updated version of the records properties. If your form is based on text fields, this fits your needs perfectly. But also filling selection lists with contentBinding is very easy. But there was one important limitation to this feature so far: A selection list is based on two information! The one that is responsible for the content of the list and another one that is responsible for the selected value. That’s why we added the valueBinding feature. With contentBinding you can set the whole list of items of a selection list e.g. based on a model. With valueBinding you can set the selected value for the given selection list. Here’s an example (look at the KitchenSink app for the complete source code):
the view (a selection list)
initialText: 'Please choose',
the content bound to the view
var boundContent = [
the calls to trigger both the contentBinding and the valueBinding
The first set() will trigger the rendering of the selection lists’s item list, the second set() will trigger the selection of the ’07:00:00′ item. You can see that both the contentBinding and the valueBinding are triggered with the same function – the set()-method of M.Controller. The first argument of that method is the name of the referenced property as a string, the second one the value resp. content.
It took a while, but we finally decided to add the jQuery mobile flip toggle switch. This basically is some kind of a boolean view that offers the user two possible options of which one is always set: true or false.
isPersistent flag for the toolbar
Often a toolbar is placed at the top of a page and is basically the same on every single page. So if you want to have the same toolbar on every page and you want it not to change with the page transition, you can now set the isPersistent flag. This property determines whether the toolbar is persistent or not (as its name already told you). By default it is set to YES. If you like to customize the behavior you can simply define your own identifier. If you switch from one page to another and the toolbars on both pages share the same identifier, the toolbar will stick to the viewport while the rest of the pages will move. If you want the toolbar to be sticky all over your application, simply don’t care about the identifier property resp. set it to YES.
This feature is linked with the ‘preloadImages’ property of Espresso’s config.json. This feature can be used to advice The-M-Project to automatically preload all images located in your project directory. By default this is set to NO. So each images used within an application will be loaded once it gets displayed on the screen. So there always will be a tiny delay even if it’s only a small image. By turning this feature on, all images will be in memory right after the startup of your application.
Now get it!
We hope you enjoy the new version of The-M-Project. We also like to thank everyone who helped us improving this and further versions. We’re always happy to get feedback and pull requests from you guys (and girls). And, as always, a special thanks goes out to the guys at filament group for providing such a great thing as jquery mobile for free!
Download The-M-Project v1.3 or get it via NPM (npm install espresso -g)