UI 2 takeaway

A Firefox OS Application placeholder ready to use with common UI solutions

Try the example

Open http://basiclines.github.com/ui2ta/ from your browser. If you open it from a FirefoxOS device it will ask for installing.

UI guidelines

• More UI components: http://www.buildingfirefoxos.com (not Mozilla official)
• Building Blocks: https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks
• App icons styleguide: http://www.mozilla.org/en-US/styleguide/products/firefoxos/icons/

View managing (js/views.js)

• Autogenerated global dom access dom.view.myviewid (js/ready.js)
• Provides basic views handling (go, back, home, getActive)
  • views.go(viewId) Shows the desired view
  • views.back() Triggers history back
  • views.home() Goes to the defined home view
  • views.getActive() returns DOM Object
• Works with url hash, you can link directly to any view
• data-showon and data-hideon you can toggle visibility of any element in any desired view

UI utilities (js/ui.js)

• Toggle sidebar
• Edit mode
• Custom selects
• Sliders
• Back actions
• Clear fields

Template engine (js/templates.js)

• Simple template parsrer
• templates.parse(string, data)