Building UIs with Wijmo

Table of Contents

Building UIs with Wijmo

Credits

About the Author

About the Reviewers

www.PacktPub.com

Support files, eBooks, discount offers and more

Why Subscribe?

Free Access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Getting Started with Wijmo

Setting up Wijmo

Installing Wijmo the quick way via a CDN

Installing Wijmo for development

Customizing jQuery UI for download

Downloading Wijmo

Installing jQuery UI for development

Installing Wijmo for development

Adding Wijmo to an HTML document

Wijmo licensing

Required background

Summary

2. The Dialog Widget

Wijmo additions to the dialog widget at a glance

Adding custom buttons

Configuring the dialog widget's appearance

Loading external content

Summary

3. Form Components

Checkbox

Radio buttons

Dropdown

ComboBox

InputDate

InputMask

Summary

4. Working with Images

Using the carousel widget

Creating the carousel widget

Configuring the carousel widget

Using the display options to show multiple images

Specifying the navigation options

Adding the timer and autoplay

Using the gallery widget

Creating the gallery widget

Playing videos in the gallery widget

Using the lightbox widget

Creating the lightbox widget

Changing the lightbox widget's appearance

Summary

5. Advanced Widgets

Using the tooltip widget

Positioning the tooltip widget

Loading AJAX content in the tooltip widget

Styling the tooltip widget

Using the upload widget with the ProgressBar element

Applying Wijmo themes to HTML5 videos

Using the editor widget

Using the editor widget with BBCode for forums

Summary

6. Dashboard with WijmoGrid

Introduction to MVVM

Introduction to Knockout

Building a rating system with Knockout

Building the dashboard

Sending a message with Knockout and Socket.IO

Displaying messages on the Dashboard

Summary

7. Wijmo Mobile

Getting started with Wijmo mobile

Setting up Wijmo mobile

Obtaining jQuery mobile

Installing jQuery mobile

Using a mobile browser emulator

Creating an expander widget

Passing options to the expander widget

Creating a ListView widget

Creating an AppView widget

Adding the AppView pages

Reusing non-mobile pages

Summary

8. Extending Wijmo

Extending Wijmo Open

Modifying the Dialog widget

Modifying a Wijmo theme with ThemeRoller

Summary

Index

Building UIs with Wijmo

Building UIs with Wijmo

Copyright © 2013 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: September 2013

Production Reference: 1120913

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham B3 2PB, UK.

ISBN 978-1-84969-606-7

www.packtpub.com

Cover Image by Suresh Mogre (<[email protected]>)

Credits

Author

Yuguang Zhang

Reviewers

Stephen J. Naughton

Ryan Pinto

Michaël Vanderheeren

Acquisition Editor

Kartikey Pandey

Commissioning Editor

Subho Gupta

Technical Editor

Anita Nayak

Project Coordinator

Joel Goveya

Proofreader

Lauren Harkins

Indexer

Priya Subramani

Graphics

Abhinash Sahu

Production Coordinator

Manu Joseph

Cover Work

Manu Joseph

About the Author

Yuguang Zhang has worked as a web developer in a number of small companies. Notable companies where he has worked at include SociaLabra, a social media company, and SmartPager, a startup in mobile paging. He has expertise in developing interactive client-side applications with Knockout. As a personal project, he built the first IDE that runs Python in the browser using Knockout and jQuery UI, that is pythonfiddle.com. In addition, he designed and programmed fiddlesalad.com, a multi-language playground for rapid frontend development built with CoffeeScript and Django.

About the Reviewers

Stephen J. Naughton has been programming since the early days of the BBC Micro on which he authored the Plotter ROM, allowing users to print screen to a plotter when Inkjet and other color printers were just appearing. He has worked in the industry as a systems engineer for about 20 years and as a full-time developer in 2003. He has now been a Microsoft MVP for five years in the area of ASP.Net and especially in Dynamic Data. Stephen is freelance web developer specializing in LOB ASP.Net Dynamic Data and LightSwitch application development.

Ryan Pinto is a technology entrepreneur who becomes familiar with emerging technologies in a heartbeat and has a passion for clear and accurate documentation.

He has an intuitive awareness and understanding of Information and System Architecture, being able to effortlessly identify and manipulate the data structure of a product and tailor frontend user experience to its stakeholders. He is ever ready to put in extra efforts and has a passion for getting the job done right, on schedule, and on budget.

A graduate from the University of Waterloo's School of Computer Science and Department of English Language, Ryan strongly believes in quality code with concise documentation. He has architected software solutions and written technical reports for large post-secondary institutions and telecommunication organizations. Projects range from artificially intelligent, OO PHP/SQL Bayesian web applications, to interactive Flash ActionScript market research tools.

Ryan is currently a co-founder and technical lead at SociaLabra Inc., a fast growing company that builds, manages, and integrates niche social networks (NSNs). He is active in both pre and post-sales roles, from client consultancy and business problem definition to solution implementation and support. Whether Java or JavaScript, Native Mobile or Responsive Design, he uses the latest in development ideology and technology to build a customizable platform powering varied NSNs for a number of education, hospitality, sports, and health organizations.

Ryan's knowledge with respect to development is diverse, and it's clear