Хотя в прошлом я широко использовал Javascript, я никогда не использовал классы и объекты в своих программах. Я также впервые использую элемент HTML5 canvas
с дополнительной библиотекой Javascript. Я использую библиотеку EaselJS.
Коротко и приятно, я пытаюсь сделать квадратный ход с помощью ввода с клавиатуры, используя объектно-ориентированное программирование. Я уже просмотрел примеры игровых файлов, но я Мне никогда не удавалось заставить его работать должным образом.
Ниже приведен сценарий моего класса:
/*global createjs*/
// Shorthand createjs.Shape Variable
var Shape = createjs.Shape;
// Main Square Class
function square(name) {
this.name = name;
this.vX = 0;
this.vY = 0;
this.canMove = false;
this.vX = this.vY = 0;
this.canMove = false;
this.body = new Shape();
this.body.graphics.beginFill("#ff0000").drawRect(0, 0, 100, 100);
}
И ниже мой основной скрипт:
/*global createjs, document, window, square, alert*/
// Canvas and Stage Variables
var c = document.getElementById("c");
var stage = new createjs.Stage("c");
// Shorthand Create.js Variables
var Ticker = createjs.Ticker;
// Important Keycodes
var keycode_w = 87;
var keycode_a = 65;
var keycode_s = 83;
var keycode_d = 68;
var keycode_left = 37;
var keycode_right = 39;
var keycode_up = 38;
var keycode_down = 40;
var keycode_space = 32;
// Handle Key Down
window.onkeydown = handleKeyDown;
var lfHeld = false;
var rtHeld = false;
// Create Protagonist
var protagonist = new square("Mr. Blue");
// Set Up Ticker
Ticker.setFPS(60);
Ticker.addEventListener("tick", stage);
if (!Ticker.hasEventListener("tick")) {
Ticker.addEventListener("tick", tick);
}
// Init Function, Prepare Protagonist Placement
function init() {
protagonist.x = c.width / 2;
protagonist.y = c.height / 2;
stage.addChild(protagonist);
}
// Ticker Test
function tick() {
if (lfHeld) {
alert("test");
}
}
// Handle Key Down Function
function handleKeyDown(event) {
switch(event.keyCode) {
case keycode_a:
case keycode_left: lfHeld = true; return false;
case keycode_d:
case keycode_right: rtHeld = true; return false;
}
}
Это ошибка, которую я получаю в инструментах разработчика Chrome:
Uncaught TypeError: undefined is not a function
easeljs-0.7.0.min.js:13
Если вам интересно, порядок моих script
тегов следующий: CDN EaselJS, за которым следует мой класс, а затем основной файл сценария.
Я бы очень хотел закрыть этот вопрос. Заранее спасибо.
square
просто так, вам нужно расширить какой-то класс createjs, напримерDisplayObject
— взгляните на этот файл и примените эти методологии к вашемуsquare
: github.com/CreateJS/EaselJS/blob/master/examples/assets/Ship.js - person olsn   schedule 19.05.2014