Home > Store

Windows 8.1 Apps with HTML5 and JavaScript Unleashed

Register your product to gain access to bonus material or receive a coupon.

Windows 8.1 Apps with HTML5 and JavaScript Unleashed


  • Sorry, this book is no longer in print.
Not for Sale


  • Copyright 2014
  • Edition: 1st
  • Book
  • ISBN-10: 0-672-33711-8
  • ISBN-13: 978-0-672-33711-6

Take advantage of your existing JavaScript and HTML skills to build apps for Windows 8.1 and add them to the Windows Store. It’s a remarkable opportunity—and best-selling Microsoft web development author Stephen Walther will show you how to take full advantage of it.

Offering the same deep insight and practical code that has made his ASP.NET Unleashed the #1 ASP.NET book of all time, Walther covers everything you need to build outstanding Windows Store apps with JavaScript and HTML5.

He guides you through using Microsoft’s WinJS 2.0 library to develop apps for Windows 8.1—you learn how to use JavaScript templates, controls, and data binding. You’ll find in-depth coverage of everything from displaying data with a ListView control to supporting SkyDrive cloud storage, creating games to using IndexedDB and HTML5 forms.

Extensively updated for the release of Windows 8.1, this book covers all of the new features of the WinJS 2.0 library such as the Repeater, SearchBox, WebView, and NavBar controls and the new WinJS Scheduler. This book has been updated with a new sample app that demonstrates how to build a Windows Store app that interacts with Windows Azure Mobile Services.

If you’re a web developer, Windows 8 gives you millions of new potential customers to buy your apps—and you already have many of the skills you’ll need to reach them. Get this book, master the tools and techniques you don’t already know—and go after that huge new market!

Detailed information on how to…

  • Get your app published in the Windows Store
  • Use JavaScript controls such as the Tooltip, Rating, DatePicker, and FlipView controls
  • Thoroughly master using the WinJS ListView control to display, sort, and filter data
  • Use new controls introduced with Windows 8.1 such as the Repeater, WebView, NavBar, and SearchBox controls
  • Implement Windows Search and Share contracts
  • Use HTML5 Canvas to build arcade games
  • Store data on the local file system, via Windows Azure Mobile Services or in IndexedDB databases
  • Use Live Services to authenticate users, retrieve user profiles, and interact with SkyDrive
  • Create custom WinJS controls with Page Controls
  • Build apps that gracefully adapt to different screen resolutions and orientations
  • Take pictures from your computer’s webcam and play sounds 8.1 Apps

Sample Content

Online Sample Chapter

Building Windows Store Apps with with HTML5 and JavaScript

Sample Pages

Download the sample pages (includes Chapter 1 and Index)

Table of Contents

Introduction     1
Updated for Windows 8.1     2
Prerequisites for This Book     3
Source Code     3

1 Building Windows Store Apps     5
What Is a Windows Store App?     5
     Microsoft Design Style Principles     6
     Common Features of Windows Store Apps     7
Creating Your First Windows Store App     13
     Creating the Visual Studio Project     14
     Declaring App Capabilities     15
     Creating the HTML Page     17
     Creating the Style Sheet     18
     Creating the JavaScript File     18
     Running the App     21
Elements of a Windows Store App     21
     JavaScript     21
     HTML5     22
     Cascading Style Sheets 3     22
     Windows Runtime     23
     Windows Library for JavaScript     23
     What About jQuery?     24
Building Windows Store Apps with Visual Studio     26
     Windows Store App Project Templates     27
     Running a Windows Store App     31
Debugging a Windows Store App     33
     Using the Visual Studio JavaScript Console Window     33
     Setting Breakpoints     34
     Using the DOM Explorer     35
Publishing to the Windows Store     36
     Register as a Windows Developer     36
     Submitting Your App     37
     Passing App Certification     39
Migrating from Windows 8 to Windows 8.1     41
Summary     42
2 WinJs Fundamentals     45
Namespaces, Modules, and Classes     45
     Using Namespaces     46
     Using the Module Pattern     48
     Using Classes     51
Asynchronous Programming with Promises     56
     Using Promises     57
     Using then() Versus done()     59
     Creating Promises     60
     Creating a Timeout Promise     61
     Canceling Promises     62
     Composing Promises     63
Retrieving DOM Elements with Query Selectors     63
     Performing Queries with the WinJS.Utilities.query() Method     64
     Retrieving a Single Element with the WinJS.Utilities.id() Method     66
     Using the WinJS.Utilities.children() method     67
     Working with the QueryCollection Class     68
Performing Ajax Calls with the xhr Function     69
     Specifying Different Response Types     72
     Customizing the Properties of the XmlHttpRequest Object     73
Using the Scheduler to Prioritize Jobs     75
     Setting Job Priorities     77
     Yielding to a Higher Priority Job     77
Summary     80

3 Observables, Bindings, and Templates     81
Understanding Observables     81
     Creating an Observable     82
     Creating Observable Listeners     83
     Coalescing Notifications     85
     Bypassing Notifications     87
     Working with the WinJS.Binding.List object     88
     Creating an Observable Collection of Observables     90
Understanding Declarative Data Binding     91
     Declarative Data Binding and Observables     94
     Capturing the Contents of an HTML Form     96
     Declarative Data Binding and WinJS Controls     99
     Declarative Data Binding and Binding Converters     101
Understanding Templates     105
     Creating an Imperative Template     105
     Creating a Declarative Template     108
     Applying a Template with a Query Selector     109
     Creating External Templates     111
Summary     112

4 Using WinJs Controls     113
Introduction to WinJS Controls     113
     Creating a WinJS Control Declaratively     115
     Creating Controls Imperatively     117
     Setting Control Options     118
     Retrieving Controls from an HTML Document     119
Using the Tooltip Control     120
     Using the contentElement Property     121
     Styling a Tooltip     121
Using the ToggleSwitch Control     122
     Determining the State of a ToggleSwitch     123
Using the Rating Control     124
     Customizing the Ratings     125
     Submitting a Rating     125
Using the DatePicker Control     127
     Formatting the Year, Month, and Date     128
     Displaying Only Years, Months, or Days     131
     Capturing the Selected Date     132
Using the TimePicker Control     133
     Getting and Setting the Current Time     134
     Formatting the Hour, Minute, and Period     136
Using the Hub Control     137
     Creating Hubs and Hub Sections     138
     Handling Hub Section Navigation     139
Using the WebView Control     139
     Hosting a Page from the Internet with the WebView Control     140
     Handling Navigation and Navigation Events     142
     Capturing WebView Screenshots     145
Summary     147

5 Creating Forms     149
Using HTML5 Form Validation     149
     Using the required Attribute      150
     Using the pattern Attribute     150
     Performing Custom Validation     151
     Customizing the Validation Error Style     152
     Resetting a Form     154
Using HTML5 Input Elements     155
     Labeling Form Fields     157
     Entering a Number     158
     Entering a Value from a Range of Values     159
Entering Email Addresses, URLs, Telephone Numbers, and Search Terms     160
     Entering a Value from a List of Values     162
     Selecting Files     162
Creating a Rich Text Editor     164
Displaying Progress     165
Summary     167

6 Menus and Flyouts     169
Using the Flyout Control     169
Using the Menu Control     172
Using the AppBar Control     176
     Creating a Simple App Bar     176
     Using App Bar Commands     178
     Showing Contextual Commands     181
Using the NavBar Control     184
     Creating a Simple Nav Bar     184
Configuring App Settings     186
     Creating About Page Settings     187
     Creating Personal Settings     189
Displaying Windows Dialogs     192
Summary     195

7 Using the ItemContainer, Repeater, and FlipView Controls     197
Using the ItemContainer Control     197
     Styling an ItemContainer     198
     Interacting with an ItemContainer     200
     Selecting an ItemContainer     202
     Creating Drag-and-Drop Items     204
Using the Repeater Control     208
     Using an External Template     210
     Using a Nested Template     211
     Using the Repeater with the ItemContainer     214
Using the FlipView Control     215
     Displaying Page Numbers     219
     Creating Custom FlipView Buttons     221
Summary     222

8 Using the ListView Control     223
Introduction to the ListView Control     224
Using Different ListView Layouts     228
     Using Grid Layout     229
     Using List Layout     231
     Using Cell Spanning Layout     231
Invoking Items in a ListView Control     236
Selecting Items in a ListView Control     238
Sorting Items in a ListView Control     241
Filtering Items in a ListView Control     242
Grouping Items in a ListView Control     245
Switching Views with Semantic Zoom     248
Switching a ListView Template Dynamically     253
Using Drag and Drop     256
     Reordering Items in a ListView      256
     Dragging Items from ListViews     258
Summary     262

9 Creating Data Sources     263
Creating Custom Data Sources     263
     Creating the Data Source Class     264
     Creating a Data Adapter     264
     Implementing the getCount() Method     265
     Implementing the itemsFromIndex() Method     265
     Implementing the insertAtEnd() Method     267
     Implementing the remove() Method     267
     Implementing the change() Method     268
     Handling Errors     268
     Implementing the setNotificationHandler() Method     269
Creating a File Data Source     270
     Using the File Data Source     271
Creating a Web Service Data Source     276
     Creating the Data Source     276
     Creating the Web Service     278
     Using the Web Service Data Source     280
Creating an IndexedDB Data Source     281
     Overview of IndexedDB     282
     Using the IndexedDB Data Source     286
Summary     293

10 Using Windows Azure Mobile Services     295
Creating a Mobile Service     295
Creating a Database Table     297
Installing the Mobile Services for WinJS Library     298
Performing Inserts, Updates, and Deletes     299
     Connecting to the Remote Database Table     299
     Inserting Database Data     299
     Updating Database Data     300
     Deleting Database Data     301
Performing Database Queries     301
     Looking Up a Single Database Record     301
     Retrieving a Set of Database Records     302
Performing Validation     304
Performing Custom Actions     306
Debugging Script Errors     308
Summary     309

11 App Events and States     311
App Events     311
     Handling the Activated Event     312
     Handling the Error Event     313
     Deferring Events with Promises     314
     Creating Custom Events     315
Suspending, Terminating, and Resuming an App     315
     Detecting When an App Is Suspended and Terminated      316
     Detecting the Previous Execution State     316
     Testing Application State with Visual Studio     317
     Storing State with Session State     318
Designing for Different Window Sizes     320
     Setting the Minimum App Width     320
     Using CSS Media Queries     321
     Using the window resize Event     324
Scaling Content to Fit Different Screen Resolutions     326
     Defining a Viewport     326
     Using the ViewBox Control     329
Summary     332

12 Page Fragments and Navigation     333
Using the HtmlControl Control     333
Creating a Page Control     336
Creating Multi-Page Apps     340
     Creating a Navigation App     340
     Understanding the Navigation App default.html Page     341
     Adding New Page Controls to a Navigation App     343
     Navigating to Another Page     345
     Understanding the Navigation API     346
     Understanding the PageControlNavigator Control     347
     Understanding Navigation State     347
Summary     351

13 Creating Share and Search Contracts     353
Supporting Sharing     354
     Creating a Share Source     356
     Creating a Share Target     360
Using the Search Charm      368
     Declaring Your App as a Search Provider     369
     Providing Search Suggestions     370
     Handling Search Activation     372
     Adding a Search Results Page     373
Using the SearchBox Control     376
     Adding the SearchBox Control to a Page     377
     Providing Search Suggestions     378
     Displaying Search Results     379
Using the Windows Content Indexer     380
     Understanding the Windows Content Indexer API     381
     Creating an Indexer Helper     381
     Using the Indexer Helper     382
Summary     385

14 Using the Live Connect API     387
Installing the Live SDK     388
     Adding a Reference to the Live SDK     388
     Registering Your App     389
     Initializing the Live Connect SDK     391
     Specifying Different Scopes     391
Authenticating a User     394
     Logging a User into Live Connect     394
     Creating Account Settings     396
Authentication and Windows Azure Mobile Services     401
     Configuring Your Mobile Service     401
     Setting Permissions for Your Mobile Service     402
     Updating the Mobile Server Scripts     402
     Logging Into Azure Mobile Services     404
Retrieving Basic User Information     406
Uploading and Downloading Files from SkyDrive     408
     Listing SkyDrive Folders and Files     409
     Downloading Files from SkyDrive     411
     Uploading Files to SkyDrive     413
Summary     415

15 Graphics and Games     417
Overview of the Game     418
Creating the Game Tiles     419
Playing the Game Sounds     420
Creating the Game Canvas     421
Capturing User Interaction     424
Creating the Update Loop     425
Creating the Render Loop     427
Summary     429

16 Creating a Task List App     431
Overview of the App     432
Setting Up the App     433
Connecting to External Services     435
Optimistic Inserts, Updates, and Deletes     437
Adapting to Screen Changes     440
Creating a Custom Control     444
Using Text to Speech     446
Summary     448

Index     449


Submit Errata

More Information

InformIT Promotional Mailings & Special Offers

I would like to receive exclusive offers and hear about products from InformIT and its family of brands. I can unsubscribe at any time.


Pearson Education, Inc., 221 River Street, Hoboken, New Jersey 07030, (Pearson) presents this site to provide information about products and services that can be purchased through this site.

This privacy notice provides an overview of our commitment to privacy and describes how we collect, protect, use and share personal information collected through this site. Please note that other Pearson websites and online products and services have their own separate privacy policies.

Collection and Use of Information

To conduct business and deliver products and services, Pearson collects and uses personal information in several ways in connection with this site, including:

Questions and Inquiries

For inquiries and questions, we collect the inquiry or question, together with name, contact details (email address, phone number and mailing address) and any other additional information voluntarily submitted to us through a Contact Us form or an email. We use this information to address the inquiry and respond to the question.

Online Store

For orders and purchases placed through our online store on this site, we collect order details, name, institution name and address (if applicable), email address, phone number, shipping and billing addresses, credit/debit card information, shipping options and any instructions. We use this information to complete transactions, fulfill orders, communicate with individuals placing orders or visiting the online store, and for related purposes.


Pearson may offer opportunities to provide feedback or participate in surveys, including surveys evaluating Pearson products, services or sites. Participation is voluntary. Pearson collects information requested in the survey questions and uses the information to evaluate, support, maintain and improve products, services or sites, develop new products and services, conduct educational research and for other purposes specified in the survey.

Contests and Drawings

Occasionally, we may sponsor a contest or drawing. Participation is optional. Pearson collects name, contact information and other information specified on the entry form for the contest or drawing to conduct the contest or drawing. Pearson may collect additional personal information from the winners of a contest or drawing in order to award the prize and for tax reporting purposes, as required by law.


If you have elected to receive email newsletters or promotional mailings and special offers but want to unsubscribe, simply email information@informit.com.

Service Announcements

On rare occasions it is necessary to send out a strictly service related announcement. For instance, if our service is temporarily suspended for maintenance we might send users an email. Generally, users may not opt-out of these communications, though they can deactivate their account information. However, these communications are not promotional in nature.

Customer Service

We communicate with users on a regular basis to provide requested services and in regard to issues relating to their account we reply via email or phone in accordance with the users' wishes when a user submits their information through our Contact Us form.

Other Collection and Use of Information

Application and System Logs

Pearson automatically collects log data to help ensure the delivery, availability and security of this site. Log data may include technical information about how a user or visitor connected to this site, such as browser type, type of computer/device, operating system, internet service provider and IP address. We use this information for support purposes and to monitor the health of the site, identify problems, improve service, detect unauthorized access and fraudulent activity, prevent and respond to security incidents and appropriately scale computing resources.

Web Analytics

Pearson may use third party web trend analytical services, including Google Analytics, to collect visitor information, such as IP addresses, browser types, referring pages, pages visited and time spent on a particular site. While these analytical services collect and report information on an anonymous basis, they may use cookies to gather web trend information. The information gathered may enable Pearson (but not the third party web trend services) to link information with application and system log data. Pearson uses this information for system administration and to identify problems, improve service, detect unauthorized access and fraudulent activity, prevent and respond to security incidents, appropriately scale computing resources and otherwise support and deliver this site and its services.

Cookies and Related Technologies

This site uses cookies and similar technologies to personalize content, measure traffic patterns, control security, track use and access of information on this site, and provide interest-based messages and advertising. Users can manage and block the use of cookies through their browser. Disabling or blocking certain cookies may limit the functionality of this site.

Do Not Track

This site currently does not respond to Do Not Track signals.


Pearson uses appropriate physical, administrative and technical security measures to protect personal information from unauthorized access, use and disclosure.


This site is not directed to children under the age of 13.


Pearson may send or direct marketing communications to users, provided that

  • Pearson will not use personal information collected or processed as a K-12 school service provider for the purpose of directed or targeted advertising.
  • Such marketing is consistent with applicable law and Pearson's legal obligations.
  • Pearson will not knowingly direct or send marketing communications to an individual who has expressed a preference not to receive marketing.
  • Where required by applicable law, express or implied consent to marketing exists and has not been withdrawn.

Pearson may provide personal information to a third party service provider on a restricted basis to provide marketing solely on behalf of Pearson or an affiliate or customer for whom Pearson is a service provider. Marketing preferences may be changed at any time.

Correcting/Updating Personal Information

If a user's personally identifiable information changes (such as your postal address or email address), we provide a way to correct or update that user's personal data provided to us. This can be done on the Account page. If a user no longer desires our service and desires to delete his or her account, please contact us at customer-service@informit.com and we will process the deletion of a user's account.


Users can always make an informed choice as to whether they should proceed with certain services offered by InformIT. If you choose to remove yourself from our mailing list(s) simply visit the following page and uncheck any communication you no longer want to receive: www.informit.com/u.aspx.

Sale of Personal Information

Pearson does not rent or sell personal information in exchange for any payment of money.

While Pearson does not sell personal information, as defined in Nevada law, Nevada residents may email a request for no sale of their personal information to NevadaDesignatedRequest@pearson.com.

Supplemental Privacy Statement for California Residents

California residents should read our Supplemental privacy statement for California residents in conjunction with this Privacy Notice. The Supplemental privacy statement for California residents explains Pearson's commitment to comply with California law and applies to personal information of California residents collected in connection with this site and the Services.

Sharing and Disclosure

Pearson may disclose personal information, as follows:

  • As required by law.
  • With the consent of the individual (or their parent, if the individual is a minor)
  • In response to a subpoena, court order or legal process, to the extent permitted or required by law
  • To protect the security and safety of individuals, data, assets and systems, consistent with applicable law
  • In connection the sale, joint venture or other transfer of some or all of its company or assets, subject to the provisions of this Privacy Notice
  • To investigate or address actual or suspected fraud or other illegal activities
  • To exercise its legal rights, including enforcement of the Terms of Use for this site or another contract
  • To affiliated Pearson companies and other companies and organizations who perform work for Pearson and are obligated to protect the privacy of personal information consistent with this Privacy Notice
  • To a school, organization, company or government agency, where Pearson collects or processes the personal information in a school setting or on behalf of such organization, company or government agency.


This web site contains links to other sites. Please be aware that we are not responsible for the privacy practices of such other sites. We encourage our users to be aware when they leave our site and to read the privacy statements of each and every web site that collects Personal Information. This privacy statement applies solely to information collected by this web site.

Requests and Contact

Please contact us about this Privacy Notice or if you have any requests or questions relating to the privacy of your personal information.

Changes to this Privacy Notice

We may revise this Privacy Notice through an updated posting. We will identify the effective date of the revision in the posting. Often, updates are made to provide greater clarity or to comply with changes in regulatory requirements. If the updates involve material changes to the collection, protection, use or disclosure of Personal Information, Pearson will provide notice of the change through a conspicuous notice on this site or other appropriate way. Continued use of the site after the effective date of a posted revision evidences acceptance. Please contact us if you have questions or concerns about the Privacy Notice or any objection to any revisions.

Last Update: November 17, 2020