Ebook html5 canvas

• A. GIỚI THIỆU
• B. HTML5 và các API mới
• I. Web Storage (DOM Storage)
• 1. Giới thiệu
• 2. Interface Storage
• 3. Local Storage và Session Storage
• 4. Sử dụng
• 5. Storage event
• 6. Thêm các phương thức vào Storage
• II. Web SQL Database
• 2. Open Database
• 3. Transaction
• 4. Execute SQL
• III. Web Worker
• 2. Ví dụ đơn giản nhất:
• 3. Kết luận
• IV. Tạo chuyển động với WindowAnimationTiming API
• 1. setTimeout và setInterval
• 2. WindowAnimationTiming
• WindowAnimationTiming
• 3. Lợi ích và hiệu quả
• C. Canvas 2D API
• I. Vẽ ảnh và thao tác với pixel
• 1. Nạp và vẽ ảnh
• 2. Thao tác với pixel
• II. Vẽ hình bằng chuột
• 1. Xác định tọa độ chuột
• 2. Lưu nội dung của Canvas
• III. Chọn và di chuyển đối tượng
• 1. Tạo cấu trúc dữ liệu
• 2. Các phương thức vẽ bằng context
• 3. Các sự kiện chuột của Canvas
• IV. Sử dụng bàn phím
• 1. Bắt sự kiện bàn phím
• 2. Kiểm tra trạng thái của nhiều phím
• 3. Giới hạn các phím được bắt
• V. Chuyển động trong Canvas
• 1. Cơ bản
• 2. Thêm hiệu ứng bóng di chuyển
• 3. Kiểm tra va chạm
• D. Kĩ thuật lập trình Game – Cơ bản
• I. Vòng lặp game (Game loop) hoạt động thế nào?
• 1. Vòng lặp cơ bản
• 2. Vòng lặp có tính toán thời gian
• 3. Giải pháp cuối cùng
• 4. Ví dụ hoàn chỉnh
• II. Kiểm tra va chạm: hình tròn và chữ nhật
• 1. Giữa hai hình chữ nhật
• 2. Giữa hai hình tròn
• 3. Giữa hình tròn và hình chữ nhật
• III. Kiểm tra một điểm nằm trên đoạn thẳng
• IV. Vector 2D cơ bản
• 1. Khái niệm
• 2. Vector đơn vị (Unit Vector, Normalized Vector)
• 3. Tích vô hướng (Dot product, Scalar product)
• 4. Phép chiếu (Projection)
• 5. Hiện thực với javascript
• V. Khoảng cách từ điểm đến đoạn thẳng
• VI. Giao điểm của hai đường thẳng
• 1. Tạo phương trình đường thẳng từ đoạn thẳng
• 2. Tính giao điểm của hai đường thẳng
• 3. Minh họa với HTML5 Canvas
• VII. Va chạm và phản xạ
• 1. Kiểm tra hai đoạn thẳng cắt nhau
• 2. Phương pháp
• VIII. Va chạm giữa đường tròn và đoạn thẳng
• 1. Va chạm
• 2. Phản xạ
• IX. Va chạm giữa nhiều đường tròn
• 1. Xử lý va chạm của nhiều đường tròn
• X. Kiểm tra va chạm dựa trên pixel
• 1. Một wrapper của Image
• 2. Xác định vùng giao hai hình chữ nhật
• E. Kỹ thuật lập trình Game – Nâng cao
• I. Cuộn ảnh nền và bản đồ (Map Scrolling)
• 1. Ảnh nền nhiều tầng
• 2. Cuộn giả
• 3. … và cuộn thật
• II. Tạo Amimated Sprite
• III. Nạp trước hình ảnh và tài nguyên
• IV. Phóng to/thu nhỏ game bằng nút cuộn chuột
• 1. Sự kiện Mouse Wheel trong javascript
• 2. Thay đổi kích thước bản đồ
• 3. Vẽ từng vùng bản đồ
• 4. Áp dụng cho các nhân vật trên bản đồ
• V. Thay đổi kích thước Canvas theo trình duyệt
• 1. Điều chỉnh canvas thao kích thước trình duyệt
• VI. Sử dụng Full Screen API
• 2. Ví dụ
• VII. Tạo menu và chuyển đổi giữa các màn hình Game
• 1. Lớp MenuItem
• 2. Lớp Screen
• 3. Kiểm tra kết quả
• F. AI trong game
• I. Giới thiệu
• II. Phân tích để lựa chọn thuật toán
• III. Thuật toán Breadth First Search
• IV. Các quy tắc trong game
• V. Xây dựng một lớp Queue dựa trên mảng
• VI. Cài đặt thuật toán Breadth First Search
• VII. Di chuyển đối tượng theo đường đi
• VIII. Vòng lặp chính của game
• G. Một nền tảng game 2D side-scrolling
• I. Cơ bản
• 1. Tạo bản đồ
• 2. Kiểm tra va chạm
• II. Thêm các chức năng và nhân vật
• 1. Lớp Character
• 2. Lớp Monster
• 3. Lớp Player
• 4. Lớp Map
• H. Một số ứng dụng minh họa
• I. Game đua xe
• 1. Các thông số của xe
• 2. Di chuyển và quay xe
• 3. Kiểm tra va chạm (tiếp xúc) với địa hình
• 4. Hạn chế xe di chuyển và xoay khi bị va chạm
• 5. Tạo các checkpoint
• 6. Kết quả
• II. Game bắn đại bác
• 1. Bản đồ và địa hình
• 2. Phá hủy một phần địa hình
• 3. Trọng lực và Gió
• 4. Di chuyển Cannon
• 5. Sát thương của đạn
• 6. Hỗ trợ nhiều người chơi
• 7. Kết quả
• III. Game Mario
• I. Lời kết
• J. Tài liệu tham khảo

link : http://www.mediafire.com/view/?e9ce3ek00gcg9d7