<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta name="viewport" content="width=device-width,user-scalable=no"/> <title> PointJS</title> </head> <body> <script type="text/javascript" src="point.js"></script> <script type="text/javascript"> // var pjs = new PointJS('2d', 400, 400); // pjs.system.initFullPage(); // var vector = pjs.vector; // var log = pjs.system.log; // var game = pjs.game; // var point = vector.point; // var camera = pjs.camera; // var brush = pjs.brush; // var OOP = pjs.OOP; // var math = pjs.math; // var touch = pjs.touchControl; touch.initTouchControl(); // 'game' game.newLoop('game', function () { // game.fill('#D9D9D9'); // ", !" brush.drawText({ x : 10, y : 10, text : ', !', size : 30, color : '#515151' }); }); // 60fps game.startLoop('game'); </script> </body> </html>
var pjs = new PointJS('2d', 400, 400); pjs.system.initFullPage(); var vector = pjs.vector; var log = pjs.system.log; var game = pjs.game; var point = vector.point; var size = vector.size; var camera = pjs.camera; var brush = pjs.brush; var OOP = pjs.OOP; var math = pjs.math; var touch = pjs.touchControl; touch.initTouchControl(); // var width = game.getWH().w; var height = game.getWH().h; // var del = height / 1000 / 5; // delta-time var dt; // var score = 0; // . , var levelScore = 0; // ( ) oldScore var tmpScore = localStorage.getItem('score'); var oldScore = tmpScore ? tmpScore : 0;
// ( , del) var sizeX = 200 * del, sizeY = 200 * del; // var drawGrid = function () { // , X Y var x = width / sizeX, y = height / sizeY; // OOP.forXY(x, y, function (x, y) { // - X Y, brush.drawRectS({ x : (sizeX + 2)*x, // X y : (sizeY + 2)*y, // Y fillColor : 'white', // w : sizeX, h : sizeY // }); }); };
// , var newGame = game.newTextObject({ text : ' ', // font : 'serif', // size : 300*del, // ( del) color : '#363636' // }); // newGame.setPositionCS(point(width/2, height/2)); // , var drawMenu = function () { // , newGame.draw(); // brush.drawTextLinesS({ x : newGame.x, // " " y : newGame.y + newGame.h, // lines : [': '+Math.abs(oldScore), ' : '+Math.abs(levelScore)], // ? font : 'serif', // size : 250*del, // color : '#363636' // }); // touch, // , " " if (touch.isPeekObject(newGame)) { // - createLevel(10); // ( ) return game.setLoop('game'); // 'game' } };
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta name="viewport" content="width=device-width,user-scalable=no"/> <title> PointJS</title> </head> <body> <script type="text/javascript" src="point.js"></script> <script type="text/javascript" src="init.js"></script> <script type="text/javascript" src="grid.js"></script> <script type="text/javascript" src="menu.js"></script> <script type="text/javascript"> game.newLoop('menu', function () { game.fill('#D9D9D9'); drawGrid(); // drawMenu(); // }); game.startLoop('menu'); // menu </script> </body> </html>
game.newLoop('game', function () { // , Delta-Time dt = game.getDT(20); game.fill('#D9D9D9'); // drawGrid(); // drawLevel(); // - drawPlayer(); // - // ? brush.drawTextS({ x : 10, y : 10, // ( ) text : 'Score: '+Math.abs(score), // size : 300*del, // color : '#515151',// font : 'serif' // }); });
// var pl = game.newImageObject({ x : 0, y : 0, // , w : 744 * del, h : 670 * del, // . 744 670, file : 'img/pl.png' // }); var dy = 2 * del; // , var dmax = 50 * del; // var dx = 0; // , // var drawPlayer = function () { // . , Y ! if (pl.y < score) { score = Math.ceil(pl.y); } pl.draw(); // pl.move(point(0, dy*dt)); // delta-time dy += dy < dmax ? del*dt : 0; // , () // () if (touch.isDown()) { if (touch.getPositionS().x > width/2) // ( ) dx = 30*del; // ( ) else // dx = -30*del; // () // , if (dx > 0) { // pl.setFlip(0, 0); // ( "" ) if (pl.x > width) { // pl.x = -pl.w; // } } else if (dx < 0) { // pl.setFlip(1, 0); // if (pl.x+pl.w < 0) { // , , pl.x = width; // } } pl.move(point(dx*dt, 0)); // } // , , , // , , , // , if (pl.getPositionS().y > score + 5000 * del) { levelScore = score; // ( , ?) if (score < oldScore) { // , oldScore = score; // localStorage.setItem('score', score); // } return game.setLoop('menu'); // , } // , , . camera.moveTimeC(vector.pointPlus(point(width/2, pl.getPositionC().y), point(0, -500*del)), 10); };
// , var blocks = []; // , dy2 = false; // createBlock ( ) var createBlock = function () { if (dy2 === false) { // , dy2 = height - 60*del*4; // } else { // , ( ) dy2 = blocks[blocks.length-1].y - 500*del - math.random(500*del, 800*del); // } blocks.push(game.newImageObject({ // w : 200 * del*4, h : 60 * del*4, // file : 'img/block.png', // x : math.random(0, width - 200*del*4), // y : dy2, // })); }; // // , var oldBlock; // , ? ? " " var createLevel = function (i) { // pl.y = 0; // , pl.x = 0; score = 0; // OOP.forInt(i, function () { // createBlock(); // }); oldBlock = blocks[blocks.length-1] // , - ( ) }; // , , var rePositionBlock = function (el) { // , var x = math.random(0, width - 200*del*4), // y = oldBlock.y - 500*del - // oldBlock, math.random(500*del, 800*del); // , el.setPosition(point(x, y)); // oldBlock = el; // , ( ) }; // var drawLevel = function () { // OOP.forArr(blocks, function (el) { // , if (camera.getPosition().y + height + 2000*del < el.y) { // rePositionBlock(el); // } el.draw(); // // , if (pl.isStaticIntersect(el.getStaticBox()) && dy > 0) { // , if (pl.y+pl.h < el.y+el.h/3) // , , , dy = -50*del; // , } }); };
Source: https://habr.com/ru/post/306922/