apress pro android web game apps, using html5 css3 and javascript (2012)

657 1.2K 0
apress pro android web game apps, using html5 css3 and javascript (2012)

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

Thông tin tài liệu

[...]... used hotkeys grouped by category If you plan to work only with the standard web stack (CSS, HTML, JavaScript, etc.) then you can use the lighter (and cheaper) version of Idea, which is WebStorm The steps required to create and run a new project in WebStorm are simpler Go to File  New Project, and enter the name and the path When the project is created, you work with it in exactly the same way as you... don’t have a Wi-Fi access point and you can’t connect your PC and Android to the same network? Well, the best choice is to buy the missing hardware What can be easier? But seriously, you can install the Android emulator and test your web applications with it CHAPTER 1: Getting Started The Android SDK and Emulator The good news is that you don’t have to choose between a dozen products or download a separate... number if you’re using a port other than 80 Create the environment variable called ANDROID_ HOME and point it to the SDK installation path Then update the PATH variable with ANDROID_ HOME/tools and ANDROID_ HOME/platform-tools Android SDK has two folders with executable scripts Make sure to add both of them to PATH At this point, we have all the basic tools required to start writing code and testing the... Java, J2ME, Android, Grails, and the most important type of module for this book a Web Module Select it from the list on the left, as shown in Figure 1-2 If you decide to use IntelliJ Idea as your main IDE, use these steps for every new project that you make Figure 1-2 Creating a new project Enter the project name and the location you wish to use for project files, and then click Finish Your project is... and install the Android SDK, configure the profile of the device, and run the emulator with the given profile Then you work with the emulator the same way that you would with a mobile device: open browser, enter address, load page, and so on Even though Android emulators are really good, you should perform testing on real devices as soon as possible A real device might have its own vendorspecific and. .. emulator To do this, we will need to install a web server Web Server Your device cannot access the filesystem on your PC and load the web page directly from a folder That’s why we will need a web server, a tool that can serve web pages via HTTP After you install a web server and configure it, you access the project files the same way as you access regular web sites on the Internet: type the address in... Aptana Studio Aptana utilizes a slightly different approach to naming The project in Aptana is similar to module in IntelliJ, and a set of projects is called a workspace Using the example from the previous section, if you make a chat application in Aptana, you will have a separate workspace that contains several projects: Server, Android Client, and Desktop Client Aptana uses the same concept, but... IDEs derived from Idea WebStorm is the one for HTML and JavaScript, and it is only $69  Aptana Studio (http://aptana.com) is based on the glorious and powerful Eclipse project (www.eclipse.org) It is extremely feature-rich, and has a plug-in for virtually anything from exploring databases and building enterprise reports to reminding you that your tea is ready Aptana is free and open source 7 8 CHAPTER... device handy, you can open the same web page and see how it looks on your Android! The easiest way to do this is to connect your Android and PC to the same network via Wi-Fi You’ll need to find the IP address of your computer and point the mobile browser to it For example, if the IP address of your PC on the local network is 192.168.0.15, you should open the browser and enter http://192.168.0.15 in the... the file called bash_profile in your home folder Open the terminal window and execute: $touch ~/.bash_profile $ open –e ~/.bash_profile CHAPTER 1: Getting Started The file should now be opened in the text editor Add the following line for every environment variable that you want to create: export TOOL_HOME=/path/to/tool For example: export NODE_PATH=~/node export ANDROID_ HOME=~ /android The last line . is about making web games with JavaScript for today’s most promising mobile platform Android. Game development is a challenging subject. Games aim to simulate. is about making games for the Android platform with HTML5 and JavaScript. It will guide you from an empty HTML page to a full-blown HTML5 game with animations,

Ngày đăng: 21/03/2014, 11:50

Từ khóa liên quan

Mục lục

  • Contents at a Glance

  • Contents

  • About the Authors

  • Acknowledgments

  • Introduction

  • Chapter 1 Getting Started

    • Tools

      • What We’ll Need

      • Java Development Kit

      • Integrated Development Environment

      • Web Server

      • The Android SDK and Emulator

    • Techniques

      • The Code

      • Object-Oriented Programming

      • A Word About Mobile Browsers

    • Summary

  • Chapter 2 Graphics in the Browser: The Canvas Element

    • The Anatomy of the Game

    • Drawing Inside the Browser

    • The Basic HTML Setup

    • What Is Canvas?

      • The Context

      • The Coordinate System

    • Drawing Shapes

      • Rectangles

      • Paths

      • Subpaths

    • Strokes and Fills

      • Solid Colors

      • Gradients

      • Patterns

    • Context State and Transformations

      • Translate

      • Scale

      • Rotate

      • Stacking Transformations

      • Context State

      • Context Transformations in the Sample Project

    • The Sample Game Project Result

    • Summary

  • Chapter 3 Creating the First Game

    • HTML5 Game Skeleton

      • The Standard Skeleton

      • Forced Orientation

    • Game Architecture

    • Making the Game

      • Rendering the Board

      • Game State and Logic

      • Wiring Components Together: The Game Class

      • Adding the Game to the HTML Skeleton

    • Summary

  • Chapter 4 Animation and Sprites

    • Sprites

      • Loading Images

      • Drawing an Image

      • Sprite Sheets

    • Basics of Animation

      • The Simplest Animation

      • JavaScript Threading Model

      • Timers

      • Improving Animation

    • Summary

  • Chapter 5 Event Handling and User Input

    • Browser Events

      • Desktop Browser vs. Android Browser Input

      • Using Events to Catch User Input

      • Getting More from Events

      • Handling the Differences Between Touch and Mouse Interfaces

    • Custom Events

    • Custom Event Listeners and Emitters

      • EventEmitter: The Base Class

      • Events vs. Callbacks

    • Custom Events

      • Implementing InputHandlerBase

      • Creating MouseInputHandler

      • Creating TouchInputHandler

    • Advanced Input

      • Drag-and-Drop

      • Pixel-Perfect Picking and Image Masks

      • Composite Operations

    • Simulating Joystick

    • Summary

  • Chapter 6 Rendering Virtual Worlds

    • Tile Maps

      • The Idea Behind Tile Maps

      • Implementing a Tile Map

      • Measuring FPS

    • Optimizing Rendering Performance

      • Draw Only What Is Required

      • Offscreen Buffer

      • Caching the Area Around the Viewport

    • World Objects

      • Coordinate Systems

      • Implementing WorldObjectRenderer

      • Rendering Order

      • Optimizations

    • Isometric View

    • Summary

  • Chapter 7 Making an Isometric Engine

    • Setup

      • The Plan

      • Preparing the Workspace

      • Basic Code

      • Utilities

    • Isometric Terrain

      • Coordinate Systems

      • Rendering Tiles

      • Implementing IsometricTileLayer

    • Rendering Objects

      • Implementing Object Clusters

      • Object Cache

      • Handling Movement

      • Composite Objects

      • Object Layer: Next Steps

    • Dirty Rectangles

      • How It Works

      • Implementation

      • Integrating with Layers

      • Marking Dirty Rectangles

    • UI and Layer Manager

      • Layer Manager

      • UI

    • Interaction

      • Event Propagation and Handling

      • Stopping the Propagation

    • Summary

  • Chapter 8 3D in a Browser

    • Introducing 3D Rendering

    • How 3D Rendering Works

      • The Math

      • A 3D Example

    • The Hello World 3D Engine

      • Model and Scene

      • Rendering

    • Summary

  • Chapter 9 Using WebGL

    • Basics of WebGL

      • Initializing WebGL

      • Geometry

      • OpenGL ES 2.0 Rendering Pipeline

      • Using Buffers

      • Shaders and GLSL

    • Basic Example: Render a 3D Cube

      • Using Shaders in a Web Page

      • Rendering Hello World

    • Exploring WebGL

      • Color

      • Textures

      • Loading Models

    • Summary

  • Chapter 10 Going Server-Side

    • Node.js Basics

      • Introducing Node.js

      • Programming Model

      • Installing Node.js

      • Debugging Node Scripts

    • Writing Scripts for Node.js

      • Exceptions and Stack Traces

      • Global Namespace and Node Modules

      • Writing the First Module

      • Discovering Modules

      • Using NPM

    • Getting Real: Building a Server for the Game

      • Web Development Frameworks for Node

      • Basic Output

      • Rendering Web Pages

      • Parsing User Input

      • Working with Sessions

    • Understanding Middleware

    • Housekeeping

      • Reporting Errors

      • Logging

      • Server Configurations

    • Summary

  • Chapter 11 Talking to the Server

    • The Evolution of Networking in Browsers

    • Server Setup

    • Using XMLHttpRequest API for Basic HTTP Requests

      • HTTP Request with Plain Old XHR

      • Handling Errors with XHR

      • XMLHttpRequest Level 2

      • Working with Binary Data

    • Reverse Ajax

      • The Problem

      • The Solutions

      • The Best Solutions

      • The Acceptable Solutions

      • The Obsolete Solutions

    • Testing Transports in the Field

      • DDMS (Dalvik Debug Monitor Server)

      • Specialized Software That Simulates a Bad Network

    • Summary

  • Chapter 12 Making Multiplayer Games

    • The Anatomy of a Network Game

      • Game Architecture: Moving from Single Player to Multiplayer

      • Project Structure

    • Game Lobby with Socket.IO

      • Client-Server Communications

      • Adding the Lobby Screen to the Game

    • Adding the Gameplay

      • Sharing Logic Between the Client and the Server

      • Server-Side

      • Client-Side

    • Summary

  • Chapter 13 AI in Games

    • Do I Need AI in My Game?

    • Introducing Pathfinding

    • Graphs

      • What Is a Graph?

      • Implementing Graphs in JavaScript

    • Building Pathfinding AI

      • A* Algorithm

      • Methods of Building the Pathfinding Graph

    • Decision Making

    • Summary

  • Chapter 14 JavaScript Game Engines

    • Graphical APIs, Libraries, and Game Engines

      • Graphical APIs

      • Graphical Libraries

      • Game Engines

    • Crafty

      • Entity Component System

      • Crafty Hello World

      • Crafty Game

      • Final Version

    • Summary

  • Chapter 15 Building Native Applications

    • Native Applications

    • Setting up Apache Cordova (PhoneGap)

      • Setting up Cordova

      • Setting up Apache Ant

    • Building Native Application

      • Creating an Empty Android Project

      • Testing the Empty Android Project

      • Basic Cordova Project

      • Networking

      • Final Touches: Name, Icon, and Fullscreen Mode

      • Using Native APIs

    • Preparing for Markets

      • Signing Applications

      • Publishing on Google Play

      • Updating Your Application

    • Summary

  • Chapter 16 Adding Sound

    • Audio on Web Pages

      • The Audio Tag

      • The Web Audio API

      • Sound in Android Browser

    • Using SoundManager2

      • Initial Setup

      • Looping

      • Adding Sound to the Game

    • Playing Sound in Cordova Applications

    • User Experience

    • Summary

    • Going Further

  • Appendix A Debugging Client-side JavaScript

    • Debug Example

    • Debugging in a Desktop Browser

    • Debugging on a Mobile Device

    • Logging (Almost) Without Code Changes

    • weinre

    • Summary

  • Index

Tài liệu cùng người dùng

  • Đang cập nhật ...

Tài liệu liên quan