Jeanine Meyer - HTML5 and JavaScript Projects: Build on your Basic Knowledge of HTML5 and JavaScript to Create Substantial HTML5 Applications

Any source code or other supplementary material referenced by the author in this book is available to readers on GitHub via the book's product page, located at www.apress.com/9781484238639 . For more detailed information, please visit http://www.apress.com/source-code .

This book continues my exploration of HTML5. My approach in developing the projects was to combine features such as canvas and video, attempt more intricate drawing by using mathematics, and use standard programming techniques such as object-oriented programming and separation of content and logic. I was also interested in building applications combining HTML5 and JavaScript with other technologies, including Google Maps.

Each chapter in the book is focused on an application or set of related applications. This is because my experience as a teacher and a learner has shown that concepts and mechanics are best understood in the context of actual use. The applications start off with drawing the HTML5 official logo. As you will find out in Chapter , the way I developed this application prompted use of coordinate transformations.

The project in Chapter , which shows how to create a bouncing video, was built on other two-dimensional applications I have created, and features two different ways to combine canvas and video.

Chapters demonstrates the use of mapping as a portal to media. The application shows you how to separate content and logic so you can scale up to various applications (e.g., a tour of a region or a geography quiz with many locations).

Chapter features a game called Add to 15, which turned out to be an excellent example of arrays. It also demonstrated the necessity to prepare for bad behavior on the part of players.

In Chapter is an educational game with questions on the states of the USA, and it includes the challenge of a jigsaw puzzle. The jigsaw puzzle includes the feature of saving the puzzle-in-progress using localStorage .

For Chapter , I decided to address challenges of responsive design and accessibility as being more appropriate for an HTML and JavaScript book than what I had before. My examples demonstrate ways to incorporate touch in addition to mouse actions, to respond to different screen dimensions, and to specify tab order to ease the use of screen readers.

I do believe my explanations are complete, but I am not claiming, as I did for my previous book, The Essential Guide to HTML5 , that this book is for the total beginner. This book is for the developer who has some knowledge of programming and who wants to build (more) substantial applications by combining features of JavaScript and going beyond the basics. It also can serve as an idea book for someone working with programmers to get an understanding of what is possible.

This book consists of 10 chapters, each organized around an application or type of application. You can skip around, though there are cross-references between chapters, indicated in the text. Each chapter starts with an introduction to the application, with screenshots of the applications in use. The chapters continue with a discussion of the critical requirements in which concepts are introduced before diving into the technical details. The next sections describe how the requirements are satisfied, with specific constructs in HTML5, JavaScript, and CSS. I then show the application coding line by line with comments. You can decide how to read these tables. You may decide to use them as a reference when writing your own programs. Each chapter ends with instructions and tips for testing and uploading the application to a server, and a summary of what you learned.

The code is included as downloads available from the publisher. Go to .

Lets get started.

Much appreciation to my students and colleagues at Purchase College/State University of New York. In particular, for Chapter , which covers the map portal quiz, I want to thank Jennifer Douglas, Jeremy Martinez, and Nik Dedvukaj, for the maze video clip produced in my Robotics class in 2008, which I retained for the new edition. I want also to thank Takashi Mukoda for his photograph of the Great Torii, in addition to everything else he has contributed to this and other projects. I re-used an audio recording of my mother playing piano. Thanks to all my family members (Aviva Meyer, Daniel Meyer, Annika Meyer, Anne Kellerman, Palmer Agnew, Debbie Torres, and Joshua Torres) for being the subjects of photographs and videos and for making the photos, video, and audio. Thanks to Daniel Davis for his HTML5 logo and his technical assistance with the first edition.

Thanks to the crew at Apress, including Nancy Chen, James Markham, and the technical reviewer Takashi Mukoda, as well as others I do not know by name.